feat(ag-grid-angular-theme): added `KbqAgGridColumnMenu` directive (#DS-3660) by artembelik · Pull Request #167 · koobiq/data-grid

artembelik · 2026-05-20T14:34:45Z

No description provided.

github-actions · 2026-05-20T14:37:24Z

Visit the preview URL for this PR (updated for commit c5135e0):

https://data-grid-next--data-grid-pr-167-k35b9aef.web.app

_{(expires Sat, 20 Jun 2026 09:13:12 GMT)}

_{🔥 via Firebase Hosting GitHub Action 🌎}

_{Sign: b9d49913f5b5988e9af8690a8b37f16143707448}

github-actions · 2026-05-20T14:39:21Z

🚨 E2E tests failed

Review the report for details.

💡 Comment /approve-snapshots to approve snapshot changes.

artembelik · 2026-05-20T14:49:32Z

/approve-snapshots

github-actions · 2026-05-20T14:49:56Z

🔄 Updating snapshots.

github-actions · 2026-05-20T14:55:34Z

✅ Snapshots updated!

rmnturov · 2026-05-21T07:00:00Z

Положение кнопки-меню должно быть в углу грида, а не около последней колонки

rmnturov · 2026-05-21T07:46:04Z

колонку с чекбоксами не надо показывать в меню

artembelik · 2026-05-21T09:59:22Z

Положение кнопки-меню должно быть в углу грида, а не около последней колонки

колонку с чекбоксами не надо показывать в меню

@rmnturov поправил

Copilot

Pull request overview

Adds a new AG Grid Angular theme feature to render always-visible “header row actions” as a custom overlay component, plus accompanying styling and dev/e2e coverage. The PR also includes a broad dependency upgrade (Angular + Koobiq ecosystem) and some dev-app wiring changes.

Changes:

Introduces KbqAgGridHeaderRowActions directive + injection token to mount a custom component into the grid header area.
Adds theme SCSS for the header actions overlay and wires the directive into the theme module + public exports.
Extends the dev app with a new “header-actions” page and Playwright spec, plus upgrades dependencies/lint config.

Reviewed changes

Copilot reviewed 37 out of 38 changed files in this pull request and generated 13 comments.

Show a summary per file

File	Description
packages/ag-grid-angular-theme/src/to-next-row-by-tab.ng.ts	Reorders directive metadata fields.
packages/ag-grid-angular-theme/src/theme.scss	Adds header actions overlay styling mixin and includes it in the theme.
packages/ag-grid-angular-theme/src/theme.ng.ts	Reorders directive metadata fields.
packages/ag-grid-angular-theme/src/status-bar.ng.ts	Reorders directive metadata fields.
packages/ag-grid-angular-theme/src/select-rows-by-shift-click.ng.ts	Reorders directive metadata fields.
packages/ag-grid-angular-theme/src/select-rows-by-shift-arrow.ng.ts	Reorders directive metadata fields.
packages/ag-grid-angular-theme/src/select-rows-by-ctrl-click.ng.ts	Reorders directive metadata fields.
packages/ag-grid-angular-theme/src/select-all-rows-by-ctrl-a.ng.ts	Reorders directive metadata fields.
packages/ag-grid-angular-theme/src/row-actions.ng.ts	Reorders directive metadata fields.
packages/ag-grid-angular-theme/src/quick-filter-state.ng.ts	Reorders directive metadata fields.
packages/ag-grid-angular-theme/src/module.ng.ts	Registers the new header actions directive in the theme module.
packages/ag-grid-angular-theme/src/header-row-actions.ng.ts	New directive + injection token to render header overlay component.
packages/ag-grid-angular-theme/src/filter-state.ng.ts	Reorders directive metadata fields.
packages/ag-grid-angular-theme/src/external-filter-state.ng.ts	Reorders directive metadata fields.
packages/ag-grid-angular-theme/src/copy-by-ctrl-c.ng.ts	Reorders directive metadata fields.
packages/ag-grid-angular-theme/src/column-state.ng.ts	Reorders directive metadata fields.
packages/ag-grid-angular-theme/index.ts	Exports the new header actions directive publicly.
package.json	Upgrades Angular/Koobiq/tooling dependencies.
dev/ag-grid-angular/src/tests/to-next-row-by-tab.ng.ts	Reorders component metadata fields in dev test page.
dev/ag-grid-angular/src/tests/theme.ng.ts	Reorders component metadata fields in dev test page.
dev/ag-grid-angular/src/tests/status-bar.ng.ts	Reorders component metadata fields in dev test page.
dev/ag-grid-angular/src/tests/select-rows-by-shift-click.ng.ts	Reorders component metadata fields in dev test page.
dev/ag-grid-angular/src/tests/select-rows-by-shift-arrow.ng.ts	Reorders component metadata fields in dev test page.
dev/ag-grid-angular/src/tests/select-rows-by-ctrl-click.ng.ts	Reorders component metadata fields in dev test page.
dev/ag-grid-angular/src/tests/row-actions.ng.ts	Reorders component metadata fields in dev test page.
dev/ag-grid-angular/src/tests/quick-filter-state.ng.ts	Reorders component metadata fields in dev test page.
dev/ag-grid-angular/src/tests/header-actions.playwright-spec.ts	New Playwright coverage for header actions interactions (visibility/order/drag).
dev/ag-grid-angular/src/tests/header-actions.ng.ts	New dev page demonstrating header actions component behavior.
dev/ag-grid-angular/src/tests/filter-state.ng.ts	Reorders component metadata fields in dev test page.
dev/ag-grid-angular/src/tests/external-filter-state.ng.ts	Reorders component metadata fields in dev test page.
dev/ag-grid-angular/src/tests/copy-by-ctrl-c.ng.ts	Reorders component metadata fields in dev test page.
dev/ag-grid-angular/src/tests/column-state.ng.ts	Reorders component metadata fields in dev test page.
dev/ag-grid-angular/src/styles.scss	Adds Koobiq prebuilt theme stylesheet import for the dev app.
dev/ag-grid-angular/src/overview.ng.ts	Updates dev overview UI and adds header actions demo + new UI controls/UX changes.
dev/ag-grid-angular/src/main.ts	Adds route for header-actions page and enables animations provider.
dev/ag-grid-angular/src/app.ng.ts	Reorders component metadata fields.
.eslintrc.js	Disables two Angular template accessibility lint rules.

github-actions · 2026-05-29T08:57:55Z

🚨 E2E tests failed

Review the report for details.

💡 Comment /approve-snapshots to approve snapshot changes.

github-actions · 2026-05-29T09:23:46Z

🚨 E2E tests failed

Review the report for details.

💡 Comment /approve-snapshots to approve snapshot changes.

github-actions · 2026-05-29T13:03:32Z

🚨 E2E tests failed

Review the report for details.

💡 Comment /approve-snapshots to approve snapshot changes.

github-actions · 2026-06-01T14:06:51Z

🚨 E2E tests failed

Review the report for details.

💡 Comment /approve-snapshots to approve snapshot changes.

artembelik · 2026-06-01T14:07:24Z

/approve-snapshots

github-actions · 2026-06-01T14:07:38Z

🔄 Updating snapshots.

github-actions · 2026-06-01T14:10:19Z

✅ Snapshots updated!

Copilot

Pull request overview

Copilot reviewed 12 out of 13 changed files in this pull request and generated 4 comments.

artembelik · 2026-06-09T11:29:50Z

Драг-н-дроп надо анимировать. Например, чуть начали тащить, отпускаем и элемент плавно возвращается на прежнее место. Вроде как .cdk-drag-animating

добавил

rmnturov · 2026-06-11T06:56:57Z

При открытии окна. Элементы анимируются при стартовом появлении. Так не надо

rmnturov · 2026-06-11T07:09:55Z

Превью появилось и оно стилизовано. Это хорошо. Давай добавим тень shadow-popup.

Мне кажется, что сохранять элементу серый фон и тп в превью — добавляет приятный эффект, что пользователь буквально перетаскивает тот же самый объект из списка). Перед началом перетягивания в ховер-состоянии фон серый

Видимость иконок-кнопок тоже надо сохранить

Будет хорошо, в превью, чтобы drag handle имел active-фон (--kbq-states-icon-contrast-fade-active). Это создаст ощущение, что рукоятка «захвачена», за нее крепко взялись.

rmnturov · 2026-06-11T07:53:06Z

Заголовки групп. Перепроверить верстку надо и стиль текста

rmnturov · 2026-06-11T07:56:17Z

Отдельной задачей. переход навигации с элемента списка на его доп. действия: список, панель действий, очистка.

В List у нас по Tab https://koobiq.io/ru/components/list/overview#action-button)

rmnturov · 2026-06-11T07:59:04Z

Во время перетаскивания над разрешенной зоной сброса давай сделаем курсор grabbing
Над Hidden делаем no-drop
В остальных местах default

artembelik · 2026-06-11T12:44:31Z

Заголовки групп. Перепроверить верстку надо и стиль текста

поправил

artembelik · 2026-06-11T12:44:51Z

Отдельной задачей. переход навигации с элемента списка на его доп. действия: список, панель действий, очистка.

поправил в рамках этой

artembelik · 2026-06-11T12:48:55Z

Превью появилось и оно стилизовано. Это хорошо. Давай добавим тень shadow-popup.

Мне кажется, что сохранять элементу серый фон и тп в превью — добавляет приятный эффект, что пользователь буквально перетаскивает тот же самый объект из списка). Перед началом перетягивания в ховер-состоянии фон серый

Видимость иконок-кнопок тоже надо сохранить

Будет хорошо, в превью, чтобы drag handle имел active-фон (--kbq-states-icon-contrast-fade-active). Это создаст ощущение, что рукоятка «захвачена», за нее крепко взялись.

поправил

artembelik · 2026-06-11T12:56:30Z

Во время перетаскивания над разрешенной зоной сброса давай сделаем курсор grabbing

поправил

github-actions · 2026-06-11T13:07:55Z

🚨 E2E tests failed

Review the report for details.

💡 Comment /approve-snapshots to approve snapshot changes.

artembelik · 2026-06-11T13:08:45Z

/approve-snapshots

github-actions · 2026-06-11T13:09:04Z

🔄 Updating snapshots.

Copilot

Pull request overview

Copilot reviewed 13 out of 15 changed files in this pull request and generated 8 comments.

github-actions · 2026-06-11T13:12:06Z

✅ Snapshots updated!

Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>

github-actions · 2026-06-11T13:17:35Z

Visit the preview URL for this PR (updated for commit 0dbbd99):

https://data-grid-next--data-grid-pr-167-k35b9aef.web.app

_{(expires Tue, 16 Jun 2026 13:17:18 GMT)}

_{🔥 via Firebase Hosting GitHub Action 🌎}

_{Sign: b9d49913f5b5988e9af8690a8b37f16143707448}

rmnturov · 2026-06-16T07:57:07Z

Прости, забыл написать. Надо отступы между иконками в панели доп. действий в строке исправить

наложение

Надо так

rmnturov · 2026-06-16T07:57:59Z

Иконку drag-handle надо использовать другую, без суффикса -s

rmnturov · 2026-06-16T08:00:20Z

Когда открыто меню, то кнопка-иконка должна оставаться в оформлении active

rmnturov · 2026-06-16T08:01:31Z

Тень у превью обрезается снизу, можно исправить?

artembelik self-assigned this May 20, 2026

artembelik marked this pull request as ready for review May 21, 2026 09:58

artembelik requested review from NikGurev and lskramarov as code owners May 21, 2026 09:58

Copilot AI review requested due to automatic review settings May 21, 2026 09:58

Copilot started reviewing on behalf of artembelik May 21, 2026 09:58 View session

artembelik requested a review from rmnturov May 21, 2026 09:58

Copilot AI reviewed May 21, 2026

View reviewed changes

artembelik marked this pull request as draft May 22, 2026 08:51

artembelik force-pushed the feat/DS-3660 branch from 541b312 to c13a9a8 Compare May 29, 2026 08:54

artembelik changed the title ~~feat(ag-grid-angular-theme): added KbqAgGridHeaderRowActions directive (#DS-3660)~~ feat(ag-grid-angular-theme): added KbqAgGridColumnMenu directive (#DS-3660) May 29, 2026

artembelik marked this pull request as ready for review June 1, 2026 14:07

artembelik requested a review from Copilot June 1, 2026 14:07

Copilot started reviewing on behalf of artembelik June 1, 2026 14:08 View session

Copilot AI reviewed Jun 1, 2026

View reviewed changes

Comment thread packages/ag-grid-angular-theme/src/column-menu.ng.ts

Comment thread packages/ag-grid-angular-theme/src/column-menu.ng.ts

Comment thread packages/ag-grid-angular-theme/src/column-menu.ng.ts Outdated

Comment thread .eslintrc.js

refactor: design review

22b15c0

artembelik requested a review from Copilot June 11, 2026 13:04

Copilot started reviewing on behalf of artembelik June 11, 2026 13:05 View session

Copilot AI reviewed Jun 11, 2026

View reviewed changes

test: updated e2e snapshots

3798aa0

artembelik and others added 5 commits June 11, 2026 16:14

Potential fix for pull request finding

9284653

Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>

Potential fix for pull request finding

0dbbd99

Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>

Potential fix for pull request finding

63a5e36

Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>

Potential fix for pull request finding

84f7472

Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>

Potential fix for pull request finding

5c5a88b

Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>

refactor: units

c5135e0

Conversation

artembelik commented May 20, 2026

Uh oh!

github-actions Bot commented May 20, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions Bot commented May 20, 2026

🚨 E2E tests failed

Uh oh!

artembelik commented May 20, 2026

Uh oh!

github-actions Bot commented May 20, 2026

Uh oh!

github-actions Bot commented May 20, 2026

Uh oh!

rmnturov commented May 21, 2026

Uh oh!

rmnturov commented May 21, 2026

Uh oh!

artembelik commented May 21, 2026

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

github-actions Bot commented May 29, 2026

🚨 E2E tests failed

Uh oh!

github-actions Bot commented May 29, 2026

🚨 E2E tests failed

Uh oh!

github-actions Bot commented May 29, 2026

🚨 E2E tests failed

Uh oh!

github-actions Bot commented Jun 1, 2026

🚨 E2E tests failed

Uh oh!

artembelik commented Jun 1, 2026

Uh oh!

github-actions Bot commented Jun 1, 2026

Uh oh!

github-actions Bot commented Jun 1, 2026

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

artembelik commented Jun 9, 2026

Uh oh!

rmnturov commented Jun 11, 2026

Uh oh!

rmnturov commented Jun 11, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

rmnturov commented Jun 11, 2026

Uh oh!

rmnturov commented Jun 11, 2026

Uh oh!

rmnturov commented Jun 11, 2026

Uh oh!

artembelik commented Jun 11, 2026

Uh oh!

artembelik commented Jun 11, 2026

Uh oh!

artembelik commented Jun 11, 2026

github-actions Bot commented May 20, 2026 •

edited

Loading

rmnturov commented Jun 11, 2026 •

edited

Loading