apex-grid 3.2.0 → 3.4.0

package/controllers/navigation.js

@@ -39,6 +39,24 @@ export class NavigationController {
                 ?.scrollIntoView({ block: 'nearest' });
         }
     }
+    findActiveCell() {
+        const row = Array.from(this.virtualizer.querySelectorAll(GRID_ROW_TAG)).find((el) => el.index === this.active.row);
+        return row?.cells.find((cell) => cell.column.key === this.active.column);
+    }
+    focusActiveCell() {
+        const node = this.state.get('current');
+        if (!node || node === SENTINEL_NODE)
+            return;
+        void (async () => {
+            await this.host.updateComplete;
+            let cell = this.findActiveCell();
+            if (!cell) {
+                await new Promise(requestAnimationFrame);
+                cell = this.findActiveCell();
+            }
+            cell?.focus({ preventScroll: true });
+        })();
+    }
     get active() {
         return this._active;
     }
@@ -57,6 +75,8 @@ export class NavigationController {
             ArrowRight: this.arrowRight,
             Home: this.home,
             End: this.end,
+            PageUp: this.pageUp,
+            PageDown: this.pageDown,
             ' ': this.toggleSelection,
         }));
         this.state = NAVIGATION_STATE;
@@ -64,11 +84,45 @@ export class NavigationController {
         this.host.addController(this);
     }
     home() {
-        this.active = Object.assign(this.nextNode, { row: 0 });
-        this.virtualizer.element(this.active.row)?.scrollIntoView({ block: 'nearest' });
+        this.active = Object.assign(this.nextNode, { column: this.firstColumn });
+        this.scrollToCell(this.active);
     }
     end() {
-        this.active = Object.assign(this.nextNode, { row: this.host.pageItems.length - 1 });
+        const last = this.visibleColumns.at(-1)?.key ?? this.firstColumn;
+        this.active = Object.assign(this.nextNode, { column: last });
+        this.scrollToCell(this.active);
+    }
+    ctrlHome() {
+        this.active = { column: this.firstColumn, row: 0 };
+        this.virtualizer.element(0)?.scrollIntoView({ block: 'nearest' });
+        this.scrollToCell(this.active);
+    }
+    ctrlEnd() {
+        const row = Math.max(0, this.host.pageItems.length - 1);
+        const last = this.visibleColumns.at(-1)?.key ?? this.firstColumn;
+        this.active = { column: last, row };
+        this.virtualizer.element(row)?.scrollIntoView({ block: 'nearest' });
+        this.scrollToCell(this.active);
+    }
+    pageStep() {
+        const rowEl = this.virtualizer.element(this.nextNode.row);
+        const rowHeight = rowEl?.offsetHeight || 0;
+        const viewport = this.host.clientHeight || 0;
+        if (!rowHeight || !viewport)
+            return 10;
+        const rows = Math.floor(viewport / rowHeight) - 1;
+        return rows > 0 ? rows : 10;
+    }
+    pageUp() {
+        const next = this.nextNode;
+        this.active = Object.assign(next, { row: Math.max(0, next.row - this.pageStep()) });
+        this.virtualizer.element(this.active.row)?.scrollIntoView({ block: 'nearest' });
+    }
+    pageDown() {
+        const next = this.nextNode;
+        this.active = Object.assign(next, {
+            row: Math.min(this.host.pageItems.length - 1, next.row + this.pageStep()),
+        });
         this.virtualizer.element(this.active.row)?.scrollIntoView({ block: 'nearest' });
     }
     arrowDown() {
@@ -104,10 +158,98 @@ export class NavigationController {
         this.active = SENTINEL_NODE;
         this.state = NAVIGATION_STATE;
     }
+    get editing() {
+        return this.host.stateController.editing;
+    }
+    handleEditKey(event) {
+        if (event.key !== 'Enter' && event.key !== 'F2')
+            return false;
+        if (event.ctrlKey || event.metaKey || event.altKey)
+            return false;
+        const node = this.state.get('current');
+        if (!node || node === SENTINEL_NODE)
+            return false;
+        const editing = this.editing;
+        if (!editing?.enabled)
+            return false;
+        const column = this.host.getColumn(this.active.column);
+        if (!column || !editing.isEditable(column))
+            return false;
+        event.preventDefault();
+        void editing.editCell(this.active.row, this.active.column);
+        return true;
+    }
+    get rowReorder() {
+        return this.host.stateController.rowReorder;
+    }
+    handleReorderKey(event) {
+        const reorder = this.rowReorder;
+        if (!reorder?.enabled)
+            return false;
+        if (reorder.isGrabbing) {
+            switch (event.key) {
+                case 'ArrowUp':
+                case 'ArrowDown': {
+                    event.preventDefault();
+                    const next = reorder.moveGrabbed(event.key === 'ArrowDown' ? 1 : -1);
+                    if (next >= 0) {
+                        this.active = Object.assign(this.nextNode, { row: next });
+                        this.virtualizer.element(next)?.scrollIntoView({ block: 'nearest' });
+                    }
+                    return true;
+                }
+                case ' ':
+                case 'Enter':
+                    event.preventDefault();
+                    reorder.drop();
+                    return true;
+                case 'Escape':
+                    event.preventDefault();
+                    reorder.cancelGrab();
+                    return true;
+                default:
+                    return false;
+            }
+        }
+        if (event.key === ' ' && this.active.row >= 0) {
+            event.preventDefault();
+            return reorder.grab(this.active.row);
+        }
+        return false;
+    }
     navigate(event) {
+        if (this.handleReorderKey(event))
+            return;
+        if ((event.ctrlKey || event.metaKey) && !event.altKey) {
+            const key = event.key.toLowerCase();
+            if (key === 'z' && !event.shiftKey) {
+                event.preventDefault();
+                this.host.undo();
+                return;
+            }
+            if ((key === 'z' && event.shiftKey) || key === 'y') {
+                event.preventDefault();
+                this.host.redo();
+                return;
+            }
+            if (event.key === 'Home' || event.key === 'End') {
+                event.preventDefault();
+                if (event.key === 'Home') {
+                    this.ctrlHome();
+                }
+                else {
+                    this.ctrlEnd();
+                }
+                this.focusActiveCell();
+                return;
+            }
+        }
+        if (this.handleEditKey(event))
+            return;
         if (this.handlers.has(event.key)) {
             event.preventDefault();
             this.handlers.get(event.key).call(this);
+            this.focusActiveCell();
         }
     }
 }

package/controllers/navigation.js.map

@@ -1 +1 @@
-{"version":3,"file":"navigation.js","sourceRoot":"","sources":["../../src/controllers/navigation.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ReactiveController } from 'lit';\nimport type ApexGridRow from '../components/row.js';\nimport { NAVIGATION_STATE, SENTINEL_NODE } from '../internal/constants.js';\nimport { GRID_ROW_TAG } from '../internal/tags.js';\nimport type { ActiveNode, GridHost, Keys } from '../internal/types.js';\nimport { getDisplayColumns } from '../internal/utils.js';\n\nexport class NavigationController<T extends object> implements ReactiveController {\n  protected handlers = new Map(\n    Object.entries({\n      ArrowDown: this.arrowDown,\n      ArrowUp: this.arrowUp,\n      ArrowLeft: this.arrowLeft,\n      ArrowRight: this.arrowRight,\n      Home: this.home,\n      End: this.end,\n      ' ': this.toggleSelection,\n    })\n  );\n\n  protected get virtualizer() {\n    // @ts-expect-error - Protected member access\n    return this.host.scrollContainer;\n  }\n\n  protected state = NAVIGATION_STATE;\n  protected _active = SENTINEL_NODE;\n\n  protected get nextNode() {\n    const node = this.state.get('current')!;\n    return node === SENTINEL_NODE\n      ? { column: this.firstColumn, row: 0 }\n      : ({ ...node } as ActiveNode<T>);\n  }\n\n  protected get columns(): Array<{ key: Keys<T>; hidden?: boolean }> {\n    return getDisplayColumns(this.host.columns) as unknown as Array<{\n      key: Keys<T>;\n      hidden?: boolean;\n    }>;\n  }\n\n  protected get visibleColumns() {\n    return this.columns.filter((column) => !column.hidden);\n  }\n\n  protected get firstColumn(): Keys<T> {\n    const first = this.visibleColumns.at(0);\n    return (first?.key ?? (this.host.columns[0]?.key as Keys<T>)) as Keys<T>;\n  }\n\n  protected getPreviousColumn(key: Keys<T>): Keys<T> {\n    const columns = this.visibleColumns;\n    const idx = columns.findIndex((column) => column.key === key);\n    return columns[Math.max(idx - 1, 0)].key;\n  }\n\n  protected getNextColumn(key: Keys<T>): Keys<T> {\n    const columns = this.visibleColumns;\n    const idx = columns.findIndex((column) => column.key === key);\n    return columns[Math.min(idx + 1, columns.length - 1)].key;\n  }\n\n  protected scrollToCell(node: ActiveNode<T>) {\n    const row = Array.from(this.virtualizer.querySelectorAll(GRID_ROW_TAG)).find(\n      (row) => (row as unknown as ApexGridRow<T>).index === node.row\n    ) as unknown as ApexGridRow<T>;\n\n    if (row) {\n      row.cells\n        .find((cell) => cell.column.key === node.column)\n        ?.scrollIntoView({ block: 'nearest' });\n    }\n  }\n\n  public get active() {\n    return this._active as ActiveNode<T>;\n  }\n\n  public set active(node: ActiveNode<T>) {\n    this._active = node;\n    this.state.set('previous', this._active);\n    this.state.set('current', node);\n    this.host.requestUpdate();\n  }\n\n  constructor(protected host: GridHost<T>) {\n    this.host.addController(this);\n  }\n\n  protected home() {\n    this.active = Object.assign(this.nextNode, { row: 0 });\n    this.virtualizer.element(this.active.row)?.scrollIntoView({ block: 'nearest' });\n  }\n\n  protected end() {\n    this.active = Object.assign(this.nextNode, { row: this.host.pageItems.length - 1 });\n    this.virtualizer.element(this.active.row)?.scrollIntoView({ block: 'nearest' });\n  }\n\n  protected arrowDown() {\n    const next = this.nextNode;\n\n    this.active = Object.assign(next, {\n      row: Math.min(next.row + 1, this.host.pageItems.length - 1),\n    });\n    this.virtualizer.element(next.row)?.scrollIntoView({ block: 'nearest' });\n  }\n\n  protected arrowUp() {\n    const next = this.nextNode;\n    this.active = Object.assign(next, { row: Math.max(0, next.row - 1) });\n    this.virtualizer.element(next.row)?.scrollIntoView({ block: 'nearest' });\n  }\n\n  protected arrowLeft() {\n    const next = this.nextNode;\n    this.active = Object.assign(next, { column: this.getPreviousColumn(next.column) });\n    this.scrollToCell(this.active);\n  }\n\n  protected arrowRight() {\n    const next = this.nextNode;\n    this.active = Object.assign(next, { column: this.getNextColumn(next.column) });\n    this.scrollToCell(this.active);\n  }\n\n  protected toggleSelection() {\n    // Space on the focused grid toggles selection of the active row.\n    // No-op when selection is disabled or there's no active row.\n    const data = this.host.pageItems[this.active.row] as T | undefined;\n    if (!data) return;\n    void this.host.toggleRowSelection(data);\n  }\n\n  public hostConnected() {}\n\n  public hostDisconnected() {\n    this.active = SENTINEL_NODE as ActiveNode<T>;\n    this.state = NAVIGATION_STATE;\n  }\n\n  public navigate(event: KeyboardEvent) {\n    if (this.handlers.has(event.key)) {\n      event.preventDefault();\n      this.handlers.get(event.key)!.call(this);\n    }\n  }\n}\n"]}
+{"version":3,"file":"navigation.js","sourceRoot":"","sources":["../../src/controllers/navigation.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ReactiveController } from 'lit';\nimport type ApexGridRow from '../components/row.js';\nimport { NAVIGATION_STATE, SENTINEL_NODE } from '../internal/constants.js';\nimport { GRID_ROW_TAG } from '../internal/tags.js';\nimport type { ActiveNode, ColumnConfiguration, GridHost, Keys } from '../internal/types.js';\nimport { getDisplayColumns } from '../internal/utils.js';\n\nexport class NavigationController<T extends object> implements ReactiveController {\n  protected handlers = new Map(\n    Object.entries({\n      ArrowDown: this.arrowDown,\n      ArrowUp: this.arrowUp,\n      ArrowLeft: this.arrowLeft,\n      ArrowRight: this.arrowRight,\n      Home: this.home,\n      End: this.end,\n      PageUp: this.pageUp,\n      PageDown: this.pageDown,\n      ' ': this.toggleSelection,\n    })\n  );\n\n  protected get virtualizer() {\n    // @ts-expect-error - Protected member access\n    return this.host.scrollContainer;\n  }\n\n  protected state = NAVIGATION_STATE;\n  protected _active = SENTINEL_NODE;\n\n  protected get nextNode() {\n    const node = this.state.get('current')!;\n    return node === SENTINEL_NODE\n      ? { column: this.firstColumn, row: 0 }\n      : ({ ...node } as ActiveNode<T>);\n  }\n\n  protected get columns(): Array<{ key: Keys<T>; hidden?: boolean }> {\n    return getDisplayColumns(this.host.columns) as unknown as Array<{\n      key: Keys<T>;\n      hidden?: boolean;\n    }>;\n  }\n\n  protected get visibleColumns() {\n    return this.columns.filter((column) => !column.hidden);\n  }\n\n  protected get firstColumn(): Keys<T> {\n    const first = this.visibleColumns.at(0);\n    return (first?.key ?? (this.host.columns[0]?.key as Keys<T>)) as Keys<T>;\n  }\n\n  protected getPreviousColumn(key: Keys<T>): Keys<T> {\n    const columns = this.visibleColumns;\n    const idx = columns.findIndex((column) => column.key === key);\n    return columns[Math.max(idx - 1, 0)].key;\n  }\n\n  protected getNextColumn(key: Keys<T>): Keys<T> {\n    const columns = this.visibleColumns;\n    const idx = columns.findIndex((column) => column.key === key);\n    return columns[Math.min(idx + 1, columns.length - 1)].key;\n  }\n\n  protected scrollToCell(node: ActiveNode<T>) {\n    const row = Array.from(this.virtualizer.querySelectorAll(GRID_ROW_TAG)).find(\n      (row) => (row as unknown as ApexGridRow<T>).index === node.row\n    ) as unknown as ApexGridRow<T>;\n\n    if (row) {\n      row.cells\n        .find((cell) => cell.column.key === node.column)\n        ?.scrollIntoView({ block: 'nearest' });\n    }\n  }\n\n  protected findActiveCell() {\n    const row = Array.from(this.virtualizer.querySelectorAll(GRID_ROW_TAG)).find(\n      (el) => (el as unknown as ApexGridRow<T>).index === this.active.row\n    ) as unknown as ApexGridRow<T> | undefined;\n    return row?.cells.find((cell) => cell.column.key === this.active.column);\n  }\n\n  /**\n   * Moves real DOM focus to the active cell (the grid body's roving tab stop),\n   * so screen readers track keyboard navigation. Waits for the host render to\n   * commit the cell's `active` state, then retries once on the next frame to\n   * cover virtualizer re-materialization after a long jump. No-op while no\n   * cell is active (the scroll container keeps focus as the entry point).\n   */\n  public focusActiveCell(): void {\n    const node = this.state.get('current');\n    if (!node || node === SENTINEL_NODE) return;\n    void (async () => {\n      await this.host.updateComplete;\n      let cell = this.findActiveCell();\n      if (!cell) {\n        await new Promise(requestAnimationFrame);\n        cell = this.findActiveCell();\n      }\n      cell?.focus({ preventScroll: true });\n    })();\n  }\n\n  public get active() {\n    return this._active as ActiveNode<T>;\n  }\n\n  public set active(node: ActiveNode<T>) {\n    this._active = node;\n    this.state.set('previous', this._active);\n    this.state.set('current', node);\n    this.host.requestUpdate();\n  }\n\n  constructor(protected host: GridHost<T>) {\n    this.host.addController(this);\n  }\n\n  /** Home moves to the first cell in the row (ARIA grid pattern). */\n  protected home() {\n    this.active = Object.assign(this.nextNode, { column: this.firstColumn });\n    this.scrollToCell(this.active);\n  }\n\n  /** End moves to the last cell in the row (ARIA grid pattern). */\n  protected end() {\n    const last = this.visibleColumns.at(-1)?.key ?? this.firstColumn;\n    this.active = Object.assign(this.nextNode, { column: last });\n    this.scrollToCell(this.active);\n  }\n\n  /** Ctrl/Cmd+Home moves to the first cell of the grid. */\n  protected ctrlHome() {\n    this.active = { column: this.firstColumn, row: 0 } as ActiveNode<T>;\n    this.virtualizer.element(0)?.scrollIntoView({ block: 'nearest' });\n    this.scrollToCell(this.active);\n  }\n\n  /** Ctrl/Cmd+End moves to the last cell of the grid. */\n  protected ctrlEnd() {\n    const row = Math.max(0, this.host.pageItems.length - 1);\n    const last = this.visibleColumns.at(-1)?.key ?? this.firstColumn;\n    this.active = { column: last, row } as ActiveNode<T>;\n    this.virtualizer.element(row)?.scrollIntoView({ block: 'nearest' });\n    this.scrollToCell(this.active);\n  }\n\n  /**\n   * Rows per Page Up/Down step, derived from the host viewport and the height\n   * of a rendered row (fallback: 10 rows when nothing is measurable yet).\n   */\n  protected pageStep(): number {\n    const rowEl = this.virtualizer.element(this.nextNode.row) as HTMLElement | undefined;\n    const rowHeight = rowEl?.offsetHeight || 0;\n    const viewport = (this.host as unknown as HTMLElement).clientHeight || 0;\n    if (!rowHeight || !viewport) return 10;\n    const rows = Math.floor(viewport / rowHeight) - 1;\n    return rows > 0 ? rows : 10;\n  }\n\n  protected pageUp() {\n    const next = this.nextNode;\n    this.active = Object.assign(next, { row: Math.max(0, next.row - this.pageStep()) });\n    this.virtualizer.element(this.active.row)?.scrollIntoView({ block: 'nearest' });\n  }\n\n  protected pageDown() {\n    const next = this.nextNode;\n    this.active = Object.assign(next, {\n      row: Math.min(this.host.pageItems.length - 1, next.row + this.pageStep()),\n    });\n    this.virtualizer.element(this.active.row)?.scrollIntoView({ block: 'nearest' });\n  }\n\n  protected arrowDown() {\n    const next = this.nextNode;\n\n    this.active = Object.assign(next, {\n      row: Math.min(next.row + 1, this.host.pageItems.length - 1),\n    });\n    this.virtualizer.element(next.row)?.scrollIntoView({ block: 'nearest' });\n  }\n\n  protected arrowUp() {\n    const next = this.nextNode;\n    this.active = Object.assign(next, { row: Math.max(0, next.row - 1) });\n    this.virtualizer.element(next.row)?.scrollIntoView({ block: 'nearest' });\n  }\n\n  protected arrowLeft() {\n    const next = this.nextNode;\n    this.active = Object.assign(next, { column: this.getPreviousColumn(next.column) });\n    this.scrollToCell(this.active);\n  }\n\n  protected arrowRight() {\n    const next = this.nextNode;\n    this.active = Object.assign(next, { column: this.getNextColumn(next.column) });\n    this.scrollToCell(this.active);\n  }\n\n  protected toggleSelection() {\n    // Space on the focused grid toggles selection of the active row.\n    // No-op when selection is disabled or there's no active row.\n    const data = this.host.pageItems[this.active.row] as T | undefined;\n    if (!data) return;\n    void this.host.toggleRowSelection(data);\n  }\n\n  public hostConnected() {}\n\n  public hostDisconnected() {\n    this.active = SENTINEL_NODE as ActiveNode<T>;\n    this.state = NAVIGATION_STATE;\n  }\n\n  protected get editing() {\n    // @ts-expect-error - protected member access\n    return this.host.stateController.editing as\n      | {\n          enabled: boolean;\n          isEditable(column: ColumnConfiguration<T>): boolean;\n          editCell(rowIndex: number, columnKey: Keys<T>): Promise<boolean>;\n        }\n      | undefined;\n  }\n\n  /**\n   * Enter / F2 on the active cell opens its editor (the keyboard path into\n   * edit mode). Returns `true` when the event was consumed.\n   */\n  protected handleEditKey(event: KeyboardEvent): boolean {\n    if (event.key !== 'Enter' && event.key !== 'F2') return false;\n    if (event.ctrlKey || event.metaKey || event.altKey) return false;\n    const node = this.state.get('current');\n    if (!node || node === SENTINEL_NODE) return false;\n    const editing = this.editing;\n    if (!editing?.enabled) return false;\n    const column = this.host.getColumn(this.active.column);\n    if (!column || !editing.isEditable(column)) return false;\n    event.preventDefault();\n    void editing.editCell(this.active.row, this.active.column);\n    return true;\n  }\n\n  protected get rowReorder() {\n    // @ts-expect-error - protected member access\n    return this.host.stateController.rowReorder as\n      | {\n          enabled: boolean;\n          isGrabbing: boolean;\n          grab(rowIndex: number): boolean;\n          moveGrabbed(direction: -1 | 1): number;\n          drop(): void;\n          cancelGrab(): void;\n        }\n      | undefined;\n  }\n\n  /**\n   * Keyboard row reorder: Space grabs the active row, arrows move it, Space /\n   * Enter drops, Escape cancels. Returns `true` when the event was consumed.\n   * Only active when `rowReordering.enabled` (so it never shadows Space-to-select\n   * on grids without reordering).\n   */\n  protected handleReorderKey(event: KeyboardEvent): boolean {\n    const reorder = this.rowReorder;\n    if (!reorder?.enabled) return false;\n\n    if (reorder.isGrabbing) {\n      switch (event.key) {\n        case 'ArrowUp':\n        case 'ArrowDown': {\n          event.preventDefault();\n          const next = reorder.moveGrabbed(event.key === 'ArrowDown' ? 1 : -1);\n          if (next >= 0) {\n            this.active = Object.assign(this.nextNode, { row: next });\n            this.virtualizer.element(next)?.scrollIntoView({ block: 'nearest' });\n          }\n          return true;\n        }\n        case ' ':\n        case 'Enter':\n          event.preventDefault();\n          reorder.drop();\n          return true;\n        case 'Escape':\n          event.preventDefault();\n          reorder.cancelGrab();\n          return true;\n        default:\n          return false;\n      }\n    }\n\n    if (event.key === ' ' && this.active.row >= 0) {\n      event.preventDefault();\n      return reorder.grab(this.active.row);\n    }\n    return false;\n  }\n\n  public navigate(event: KeyboardEvent) {\n    if (this.handleReorderKey(event)) return;\n    // Undo / redo: Ctrl/Cmd+Z, Ctrl/Cmd+Shift+Z, Ctrl/Cmd+Y. Only fires when the\n    // grid body (not an open editor) has focus, so a text editor's native undo\n    // is never hijacked.\n    if ((event.ctrlKey || event.metaKey) && !event.altKey) {\n      const key = event.key.toLowerCase();\n      if (key === 'z' && !event.shiftKey) {\n        event.preventDefault();\n        this.host.undo();\n        return;\n      }\n      if ((key === 'z' && event.shiftKey) || key === 'y') {\n        event.preventDefault();\n        this.host.redo();\n        return;\n      }\n      // Ctrl/Cmd+Home / Ctrl/Cmd+End jump to the grid corners (ARIA grid pattern).\n      if (event.key === 'Home' || event.key === 'End') {\n        event.preventDefault();\n        if (event.key === 'Home') {\n          this.ctrlHome();\n        } else {\n          this.ctrlEnd();\n        }\n        this.focusActiveCell();\n        return;\n      }\n    }\n    if (this.handleEditKey(event)) return;\n    if (this.handlers.has(event.key)) {\n      event.preventDefault();\n      this.handlers.get(event.key)!.call(this);\n      // Real focus follows the active cell so AT tracks the movement.\n      this.focusActiveCell();\n    }\n  }\n}\n"]}

package/controllers/pagination.js

@@ -60,7 +60,7 @@ export class PaginationController {
         });
     }
     #emitChanged() {
-        this.host.announce(`Page ${this.page + 1} of ${this.pageCount}`);
+        this.host.announce(this.host.localize('announce.page', { page: this.page + 1, total: this.pageCount }));
         return this.host.emitEvent('pageChanged', { detail: this.state });
     }
     async gotoPage(page) {

package/controllers/pagination.js.map

@@ -1 +1 @@
-{"version":3,"file":"pagination.js","sourceRoot":"","sources":["../../src/controllers/pagination.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ReactiveController } from 'lit';\nimport { PIPELINE } from '../internal/constants.js';\nimport type { GridHost, PaginationState } from '../internal/types.js';\n\n/**\n * Default pagination state used when no `pagination` configuration is provided.\n */\nexport const DEFAULT_PAGINATION = Object.freeze({\n  mode: 'local' as const,\n  page: 0,\n  pageSize: 25,\n  pageSizeOptions: Object.freeze([10, 25, 50, 100]) as readonly number[],\n});\n\n/**\n * Reactive controller that owns the grid's pagination state.\n *\n * @remarks\n * Exposes a state machine for the current `page` and `pageSize`, derives `pageCount`\n * from the host's data, and emits the cancellable `pageChanging` + `pageChanged`\n * events on the grid host. Page slicing itself is performed by\n * {@link PaginationDataOperation} so the controller does not mutate `dataView`.\n */\nexport class PaginationController<T extends object> implements ReactiveController {\n  /**\n   * The current zero-based page index.\n   */\n  public page: number = DEFAULT_PAGINATION.page;\n\n  /**\n   * The current page size.\n   */\n  public pageSize: number = DEFAULT_PAGINATION.pageSize;\n\n  constructor(protected host: GridHost<T>) {\n    this.host.addController(this);\n  }\n\n  public hostConnected() {}\n\n  /**\n   * Whether pagination is enabled on the host grid.\n   */\n  public get enabled(): boolean {\n    return Boolean(this.host.pagination?.enabled);\n  }\n\n  /**\n   * The total number of records before pagination is applied.\n   *\n   * @remarks\n   * For `'local'` mode this is the post-filter, post-sort dataset length. For `'remote'`\n   * mode the consumer must supply the value via `pagination.totalItems`.\n   */\n  public get totalItems(): number {\n    const cfg = this.host.pagination;\n    if (cfg?.mode === 'remote') {\n      return Math.max(0, cfg?.totalItems ?? 0);\n    }\n    // @ts-expect-error - protected member access\n    return this.host.dataState?.length ?? 0;\n  }\n\n  /**\n   * The total number of pages for the current data view and `pageSize`.\n   *\n   * @remarks\n   * Always at least `1` so a paginator can render a sensible \"1 / 1\" label for empty data.\n   */\n  public get pageCount(): number {\n    if (!this.pageSize) return 1;\n    return Math.max(1, Math.ceil(this.totalItems / this.pageSize));\n  }\n\n  /**\n   * Returns the resolved {@link PaginationState} for the current host.\n   */\n  public get state(): PaginationState {\n    return {\n      page: this.page,\n      pageSize: this.pageSize,\n      pageCount: this.pageCount,\n      totalItems: this.totalItems,\n    };\n  }\n\n  /**\n   * Clamps a candidate `page` index into the valid `[0, pageCount - 1]` range.\n   *\n   * @param page - The candidate page index.\n   */\n  public clamp(page: number): number {\n    if (!Number.isFinite(page)) return 0;\n    return Math.min(Math.max(0, Math.trunc(page)), Math.max(0, this.pageCount - 1));\n  }\n\n  /**\n   * Re-clamps the current page after the dataset size (or `pageSize`) changes.\n   *\n   * @remarks\n   * Called from the grid pipeline so paging never points past the last valid page.\n   * Mutates `page` in place and requests a re-render when the value changes.\n   */\n  public reclamp(): void {\n    const next = this.clamp(this.page);\n    if (next !== this.page) {\n      this.page = next;\n      this.host.requestUpdate();\n    }\n  }\n\n  #emitChanging(nextPage: number, nextPageSize: number) {\n    return this.host.emitEvent('pageChanging', {\n      detail: {\n        page: this.page,\n        pageSize: this.pageSize,\n        nextPage,\n        nextPageSize,\n      },\n      cancelable: true,\n    });\n  }\n\n  #emitChanged() {\n    this.host.announce(`Page ${this.page + 1} of ${this.pageCount}`);\n    return this.host.emitEvent('pageChanged', { detail: this.state });\n  }\n\n  /**\n   * Navigates to `page`, emitting the cancellable `pageChanging` event first and\n   * the `pageChanged` event after the pipeline has applied.\n   *\n   * @param page - The target zero-based page index. Out-of-range values are clamped.\n   * @returns `true` if the change was applied, `false` if it was cancelled or a no-op.\n   */\n  public async gotoPage(page: number): Promise<boolean> {\n    const next = this.clamp(page);\n    if (next === this.page) return false;\n\n    if (!this.#emitChanging(next, this.pageSize)) {\n      return false;\n    }\n\n    this.page = next;\n    this.host.requestUpdate(PIPELINE);\n    await this.host.updateComplete;\n    this.#emitChanged();\n    return true;\n  }\n\n  /**\n   * Sets the current page size and resets to the first page.\n   *\n   * @param size - The new page size. Must be a positive integer.\n   * @returns `true` if the change was applied, `false` if it was cancelled or a no-op.\n   */\n  public async setPageSize(size: number): Promise<boolean> {\n    const next = Math.max(1, Math.trunc(size));\n    if (next === this.pageSize) return false;\n\n    if (!this.#emitChanging(0, next)) {\n      return false;\n    }\n\n    this.pageSize = next;\n    this.page = 0;\n    this.host.requestUpdate(PIPELINE);\n    await this.host.updateComplete;\n    this.#emitChanged();\n    return true;\n  }\n\n  /**\n   * Navigates to the next page if not already on the last one.\n   */\n  public nextPage() {\n    return this.gotoPage(this.page + 1);\n  }\n\n  /**\n   * Navigates to the previous page if not already on the first one.\n   */\n  public previousPage() {\n    return this.gotoPage(this.page - 1);\n  }\n\n  /**\n   * Navigates to the first page.\n   */\n  public firstPage() {\n    return this.gotoPage(0);\n  }\n\n  /**\n   * Navigates to the last page.\n   */\n  public lastPage() {\n    return this.gotoPage(this.pageCount - 1);\n  }\n}\n"]}
+{"version":3,"file":"pagination.js","sourceRoot":"","sources":["../../src/controllers/pagination.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ReactiveController } from 'lit';\nimport { PIPELINE } from '../internal/constants.js';\nimport type { GridHost, PaginationState } from '../internal/types.js';\n\n/**\n * Default pagination state used when no `pagination` configuration is provided.\n */\nexport const DEFAULT_PAGINATION = Object.freeze({\n  mode: 'local' as const,\n  page: 0,\n  pageSize: 25,\n  pageSizeOptions: Object.freeze([10, 25, 50, 100]) as readonly number[],\n});\n\n/**\n * Reactive controller that owns the grid's pagination state.\n *\n * @remarks\n * Exposes a state machine for the current `page` and `pageSize`, derives `pageCount`\n * from the host's data, and emits the cancellable `pageChanging` + `pageChanged`\n * events on the grid host. Page slicing itself is performed by\n * {@link PaginationDataOperation} so the controller does not mutate `dataView`.\n */\nexport class PaginationController<T extends object> implements ReactiveController {\n  /**\n   * The current zero-based page index.\n   */\n  public page: number = DEFAULT_PAGINATION.page;\n\n  /**\n   * The current page size.\n   */\n  public pageSize: number = DEFAULT_PAGINATION.pageSize;\n\n  constructor(protected host: GridHost<T>) {\n    this.host.addController(this);\n  }\n\n  public hostConnected() {}\n\n  /**\n   * Whether pagination is enabled on the host grid.\n   */\n  public get enabled(): boolean {\n    return Boolean(this.host.pagination?.enabled);\n  }\n\n  /**\n   * The total number of records before pagination is applied.\n   *\n   * @remarks\n   * For `'local'` mode this is the post-filter, post-sort dataset length. For `'remote'`\n   * mode the consumer must supply the value via `pagination.totalItems`.\n   */\n  public get totalItems(): number {\n    const cfg = this.host.pagination;\n    if (cfg?.mode === 'remote') {\n      return Math.max(0, cfg?.totalItems ?? 0);\n    }\n    // @ts-expect-error - protected member access\n    return this.host.dataState?.length ?? 0;\n  }\n\n  /**\n   * The total number of pages for the current data view and `pageSize`.\n   *\n   * @remarks\n   * Always at least `1` so a paginator can render a sensible \"1 / 1\" label for empty data.\n   */\n  public get pageCount(): number {\n    if (!this.pageSize) return 1;\n    return Math.max(1, Math.ceil(this.totalItems / this.pageSize));\n  }\n\n  /**\n   * Returns the resolved {@link PaginationState} for the current host.\n   */\n  public get state(): PaginationState {\n    return {\n      page: this.page,\n      pageSize: this.pageSize,\n      pageCount: this.pageCount,\n      totalItems: this.totalItems,\n    };\n  }\n\n  /**\n   * Clamps a candidate `page` index into the valid `[0, pageCount - 1]` range.\n   *\n   * @param page - The candidate page index.\n   */\n  public clamp(page: number): number {\n    if (!Number.isFinite(page)) return 0;\n    return Math.min(Math.max(0, Math.trunc(page)), Math.max(0, this.pageCount - 1));\n  }\n\n  /**\n   * Re-clamps the current page after the dataset size (or `pageSize`) changes.\n   *\n   * @remarks\n   * Called from the grid pipeline so paging never points past the last valid page.\n   * Mutates `page` in place and requests a re-render when the value changes.\n   */\n  public reclamp(): void {\n    const next = this.clamp(this.page);\n    if (next !== this.page) {\n      this.page = next;\n      this.host.requestUpdate();\n    }\n  }\n\n  #emitChanging(nextPage: number, nextPageSize: number) {\n    return this.host.emitEvent('pageChanging', {\n      detail: {\n        page: this.page,\n        pageSize: this.pageSize,\n        nextPage,\n        nextPageSize,\n      },\n      cancelable: true,\n    });\n  }\n\n  #emitChanged() {\n    this.host.announce(\n      this.host.localize('announce.page', { page: this.page + 1, total: this.pageCount })\n    );\n    return this.host.emitEvent('pageChanged', { detail: this.state });\n  }\n\n  /**\n   * Navigates to `page`, emitting the cancellable `pageChanging` event first and\n   * the `pageChanged` event after the pipeline has applied.\n   *\n   * @param page - The target zero-based page index. Out-of-range values are clamped.\n   * @returns `true` if the change was applied, `false` if it was cancelled or a no-op.\n   */\n  public async gotoPage(page: number): Promise<boolean> {\n    const next = this.clamp(page);\n    if (next === this.page) return false;\n\n    if (!this.#emitChanging(next, this.pageSize)) {\n      return false;\n    }\n\n    this.page = next;\n    this.host.requestUpdate(PIPELINE);\n    await this.host.updateComplete;\n    this.#emitChanged();\n    return true;\n  }\n\n  /**\n   * Sets the current page size and resets to the first page.\n   *\n   * @param size - The new page size. Must be a positive integer.\n   * @returns `true` if the change was applied, `false` if it was cancelled or a no-op.\n   */\n  public async setPageSize(size: number): Promise<boolean> {\n    const next = Math.max(1, Math.trunc(size));\n    if (next === this.pageSize) return false;\n\n    if (!this.#emitChanging(0, next)) {\n      return false;\n    }\n\n    this.pageSize = next;\n    this.page = 0;\n    this.host.requestUpdate(PIPELINE);\n    await this.host.updateComplete;\n    this.#emitChanged();\n    return true;\n  }\n\n  /**\n   * Navigates to the next page if not already on the last one.\n   */\n  public nextPage() {\n    return this.gotoPage(this.page + 1);\n  }\n\n  /**\n   * Navigates to the previous page if not already on the first one.\n   */\n  public previousPage() {\n    return this.gotoPage(this.page - 1);\n  }\n\n  /**\n   * Navigates to the first page.\n   */\n  public firstPage() {\n    return this.gotoPage(0);\n  }\n\n  /**\n   * Navigates to the last page.\n   */\n  public lastPage() {\n    return this.gotoPage(this.pageCount - 1);\n  }\n}\n"]}

package/controllers/reorder.js

@@ -23,7 +23,9 @@ export class ReorderController {
             return false;
         if (!this.isDraggable(source) || !this.isDraggable(target))
             return false;
-        return (source.pinned ?? null) === (target.pinned ?? null);
+        if ((source.pinned ?? null) !== (target.pinned ?? null))
+            return false;
+        return (source.group ?? null) === (target.group ?? null);
     }
     start(sourceKey, sourceRect, initialClientX, initialClientY, label) {
         this.state = {

package/controllers/reorder.js.map

@@ -1 +1 @@
-{"version":3,"file":"reorder.js","sourceRoot":"","sources":["../../src/controllers/reorder.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ReactiveController } from 'lit';\nimport { awaitChildUpdates, captureRect, type FlipEntry, playFlip } from '../internal/flip.js';\nimport type { ColumnConfiguration, GridHost, Keys } from '../internal/types.js';\n\n/**\n * Live drag state surfaced to the header row so it can render the floating\n * \"ghost\" element that follows the cursor.\n *\n * @remarks\n * The dragged column itself stays in the columns array — we live-swap it\n * with neighbours as the cursor crosses their midpoints, so the rendered\n * order updates while the user is still dragging. The ghost is purely a\n * visual indicator of what the user is grabbing.\n */\ninterface ReorderState<T> {\n  /** The column currently being dragged. */\n  sourceKey: Keys<T>;\n  /** Ghost position (viewport-relative top-left, in CSS pixels). */\n  ghostX: number;\n  ghostY: number;\n  /** Ghost size — fixed at the source header's initial bounding rect. */\n  ghostWidth: number;\n  ghostHeight: number;\n  /** Cursor offset within the ghost so the grab point stays under the cursor. */\n  pointerOffsetX: number;\n  pointerOffsetY: number;\n  /** Display label for the ghost (header text or column key). */\n  label: string;\n}\n\n/**\n * Reactive controller backing pointer-driven column reordering with a\n * floating ghost and live mid-drag swaps.\n *\n * @remarks\n * Headers feed `pointerdown` / `pointermove` / `pointerup` events into the\n * controller. While dragging, the controller updates the ghost position and\n * decides whether the cursor has crossed an adjacent column's midpoint —\n * if so it calls {@link ApexGrid.moveColumn} immediately, so the swap\n * happens during the drag instead of waiting for drop. The same cancellable\n * `columnMoving` / follow-up `columnMoved` event pipeline applies for\n * every swap.\n */\nexport class ReorderController<T extends object> implements ReactiveController {\n  public state: ReorderState<T> | null = null;\n\n  /** Re-entrancy guard so a slow `moveColumn` can't trigger a second swap. */\n  #swapping = false;\n\n  constructor(protected host: GridHost<T>) {\n    this.host.addController(this);\n  }\n\n  public hostConnected() {}\n\n  protected get headerRow() {\n    // @ts-expect-error - protected member access\n    return this.host.headerRow as\n      | (HTMLElement & { headers?: Array<HTMLElement & { column: ColumnConfiguration<T> }> })\n      | undefined;\n  }\n\n  /**\n   * Whether reordering is enabled for the given column.\n   */\n  public isDraggable(column: ColumnConfiguration<T>): boolean {\n    if (!this.host.columnReordering) return false;\n    if (column.hidden) return false;\n    return column.reorderable !== false;\n  }\n\n  /**\n   * Whether `source` may be dropped onto `target`. Cross-pinning-group moves\n   * are blocked so the drag can't escape its pin region.\n   */\n  public canDrop(source: ColumnConfiguration<T>, target: ColumnConfiguration<T>): boolean {\n    if (source.key === target.key) return false;\n    if (!this.isDraggable(source) || !this.isDraggable(target)) return false;\n    return (source.pinned ?? null) === (target.pinned ?? null);\n  }\n\n  /**\n   * Begins a drag from `sourceKey`. Captures the source's bounding rect and\n   * the cursor offset within it so the ghost stays anchored to the grab\n   * point as the cursor moves.\n   */\n  public start(\n    sourceKey: Keys<T>,\n    sourceRect: DOMRect,\n    initialClientX: number,\n    initialClientY: number,\n    label: string\n  ): void {\n    this.state = {\n      sourceKey,\n      ghostX: sourceRect.left,\n      ghostY: sourceRect.top,\n      ghostWidth: sourceRect.width,\n      ghostHeight: sourceRect.height,\n      pointerOffsetX: initialClientX - sourceRect.left,\n      pointerOffsetY: initialClientY - sourceRect.top,\n      label,\n    };\n    this.host.requestUpdate();\n  }\n\n  /**\n   * Updates the ghost position and decides whether to swap with an adjacent\n   * column.\n   */\n  public move(clientX: number, clientY: number): void {\n    if (!this.state) return;\n    this.state = {\n      ...this.state,\n      ghostX: clientX - this.state.pointerOffsetX,\n      ghostY: clientY - this.state.pointerOffsetY,\n    };\n    this.host.requestUpdate();\n    void this.#checkSwap(clientX);\n  }\n\n  /**\n   * Ends the drag session. The columns are already in their final order\n   * because we live-swapped during the drag, so there's nothing to commit.\n   */\n  public end(): void {\n    if (!this.state) return;\n    this.state = null;\n    this.host.requestUpdate();\n  }\n\n  async #checkSwap(clientX: number): Promise<void> {\n    if (!this.state || this.#swapping) return;\n    const source = this.host.getColumn(this.state.sourceKey);\n    if (!source) return;\n    const headerRow = this.headerRow;\n    if (!headerRow?.headers) return;\n\n    // Find the visible header whose box currently contains the cursor X.\n    const target = headerRow.headers.find((h) => {\n      const rect = h.getBoundingClientRect();\n      return clientX >= rect.left && clientX < rect.right;\n    });\n    if (!target || target.column.key === source.key) return;\n    if (!this.canDrop(source, target.column)) return;\n\n    // Only swap once the cursor crosses the target's midpoint, so we don't\n    // bounce back and forth as soon as the ghost touches the edge.\n    const rect = target.getBoundingClientRect();\n    const midpoint = rect.left + rect.width / 2;\n    const visibleColumns = this.host.columns.filter((c) => !c.hidden);\n    const sourceIdx = visibleColumns.findIndex((c) => c.key === source.key);\n    const targetIdx = visibleColumns.findIndex((c) => c.key === target.column.key);\n    if (sourceIdx === -1 || targetIdx === -1) return;\n\n    let position: 'before' | 'after';\n    if (sourceIdx < targetIdx) {\n      // Dragging right — swap when the cursor crosses past the target's centre.\n      if (clientX < midpoint) return;\n      position = 'after';\n    } else {\n      // Dragging left — swap when the cursor crosses before the target's centre.\n      if (clientX > midpoint) return;\n      position = 'before';\n    }\n\n    this.#swapping = true;\n    try {\n      const before = this.#captureCellRects();\n      await this.host.moveColumn(source.key, target.column.key, position);\n      await this.host.updateComplete;\n      // Child rows + header row schedule their own updates one microtask\n      // after the grid — wait for them so the cells have actually moved\n      // before measuring the \"Last\" rect.\n      await awaitChildUpdates([\n        this.headerRow as unknown as { updateComplete: Promise<unknown> } | undefined,\n        ...this.host.rows,\n      ]);\n      playFlip(before, 'x');\n    } finally {\n      this.#swapping = false;\n    }\n  }\n\n  /**\n   * Snapshots the bounding rect of every header + body cell before a\n   * swap. Used as the \"First\" step of a FLIP — after `moveColumn` resolves,\n   * `playFlip` computes the delta against the new rect and animates each\n   * element from its old position back to identity.\n   */\n  #captureCellRects(): FlipEntry[] {\n    const entries: FlipEntry[] = [];\n    const headerRow = this.headerRow;\n    if (headerRow?.headers) {\n      for (const header of headerRow.headers) {\n        entries.push(captureRect(header));\n      }\n    }\n    for (const row of this.host.rows) {\n      for (const cell of row.cells) {\n        entries.push(captureRect(cell as unknown as HTMLElement));\n      }\n    }\n    return entries;\n  }\n}\n"]}
+{"version":3,"file":"reorder.js","sourceRoot":"","sources":["../../src/controllers/reorder.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ReactiveController } from 'lit';\nimport { awaitChildUpdates, captureRect, type FlipEntry, playFlip } from '../internal/flip.js';\nimport type { ColumnConfiguration, GridHost, Keys } from '../internal/types.js';\n\n/**\n * Live drag state surfaced to the header row so it can render the floating\n * \"ghost\" element that follows the cursor.\n *\n * @remarks\n * The dragged column itself stays in the columns array — we live-swap it\n * with neighbours as the cursor crosses their midpoints, so the rendered\n * order updates while the user is still dragging. The ghost is purely a\n * visual indicator of what the user is grabbing.\n */\ninterface ReorderState<T> {\n  /** The column currently being dragged. */\n  sourceKey: Keys<T>;\n  /** Ghost position (viewport-relative top-left, in CSS pixels). */\n  ghostX: number;\n  ghostY: number;\n  /** Ghost size — fixed at the source header's initial bounding rect. */\n  ghostWidth: number;\n  ghostHeight: number;\n  /** Cursor offset within the ghost so the grab point stays under the cursor. */\n  pointerOffsetX: number;\n  pointerOffsetY: number;\n  /** Display label for the ghost (header text or column key). */\n  label: string;\n}\n\n/**\n * Reactive controller backing pointer-driven column reordering with a\n * floating ghost and live mid-drag swaps.\n *\n * @remarks\n * Headers feed `pointerdown` / `pointermove` / `pointerup` events into the\n * controller. While dragging, the controller updates the ghost position and\n * decides whether the cursor has crossed an adjacent column's midpoint —\n * if so it calls {@link ApexGrid.moveColumn} immediately, so the swap\n * happens during the drag instead of waiting for drop. The same cancellable\n * `columnMoving` / follow-up `columnMoved` event pipeline applies for\n * every swap.\n */\nexport class ReorderController<T extends object> implements ReactiveController {\n  public state: ReorderState<T> | null = null;\n\n  /** Re-entrancy guard so a slow `moveColumn` can't trigger a second swap. */\n  #swapping = false;\n\n  constructor(protected host: GridHost<T>) {\n    this.host.addController(this);\n  }\n\n  public hostConnected() {}\n\n  protected get headerRow() {\n    // @ts-expect-error - protected member access\n    return this.host.headerRow as\n      | (HTMLElement & { headers?: Array<HTMLElement & { column: ColumnConfiguration<T> }> })\n      | undefined;\n  }\n\n  /**\n   * Whether reordering is enabled for the given column.\n   */\n  public isDraggable(column: ColumnConfiguration<T>): boolean {\n    if (!this.host.columnReordering) return false;\n    if (column.hidden) return false;\n    return column.reorderable !== false;\n  }\n\n  /**\n   * Whether `source` may be dropped onto `target`. Cross-pinning-group moves\n   * are blocked so the drag can't escape its pin region.\n   */\n  public canDrop(source: ColumnConfiguration<T>, target: ColumnConfiguration<T>): boolean {\n    if (source.key === target.key) return false;\n    if (!this.isDraggable(source) || !this.isDraggable(target)) return false;\n    if ((source.pinned ?? null) !== (target.pinned ?? null)) return false;\n    // Grouped columns reorder only within their own group; ungrouped only among\n    // ungrouped. Keeps a group's members contiguous (v1 has no group-level move).\n    return (source.group ?? null) === (target.group ?? null);\n  }\n\n  /**\n   * Begins a drag from `sourceKey`. Captures the source's bounding rect and\n   * the cursor offset within it so the ghost stays anchored to the grab\n   * point as the cursor moves.\n   */\n  public start(\n    sourceKey: Keys<T>,\n    sourceRect: DOMRect,\n    initialClientX: number,\n    initialClientY: number,\n    label: string\n  ): void {\n    this.state = {\n      sourceKey,\n      ghostX: sourceRect.left,\n      ghostY: sourceRect.top,\n      ghostWidth: sourceRect.width,\n      ghostHeight: sourceRect.height,\n      pointerOffsetX: initialClientX - sourceRect.left,\n      pointerOffsetY: initialClientY - sourceRect.top,\n      label,\n    };\n    this.host.requestUpdate();\n  }\n\n  /**\n   * Updates the ghost position and decides whether to swap with an adjacent\n   * column.\n   */\n  public move(clientX: number, clientY: number): void {\n    if (!this.state) return;\n    this.state = {\n      ...this.state,\n      ghostX: clientX - this.state.pointerOffsetX,\n      ghostY: clientY - this.state.pointerOffsetY,\n    };\n    this.host.requestUpdate();\n    void this.#checkSwap(clientX);\n  }\n\n  /**\n   * Ends the drag session. The columns are already in their final order\n   * because we live-swapped during the drag, so there's nothing to commit.\n   */\n  public end(): void {\n    if (!this.state) return;\n    this.state = null;\n    this.host.requestUpdate();\n  }\n\n  async #checkSwap(clientX: number): Promise<void> {\n    if (!this.state || this.#swapping) return;\n    const source = this.host.getColumn(this.state.sourceKey);\n    if (!source) return;\n    const headerRow = this.headerRow;\n    if (!headerRow?.headers) return;\n\n    // Find the visible header whose box currently contains the cursor X.\n    const target = headerRow.headers.find((h) => {\n      const rect = h.getBoundingClientRect();\n      return clientX >= rect.left && clientX < rect.right;\n    });\n    if (!target || target.column.key === source.key) return;\n    if (!this.canDrop(source, target.column)) return;\n\n    // Only swap once the cursor crosses the target's midpoint, so we don't\n    // bounce back and forth as soon as the ghost touches the edge.\n    const rect = target.getBoundingClientRect();\n    const midpoint = rect.left + rect.width / 2;\n    const visibleColumns = this.host.columns.filter((c) => !c.hidden);\n    const sourceIdx = visibleColumns.findIndex((c) => c.key === source.key);\n    const targetIdx = visibleColumns.findIndex((c) => c.key === target.column.key);\n    if (sourceIdx === -1 || targetIdx === -1) return;\n\n    let position: 'before' | 'after';\n    if (sourceIdx < targetIdx) {\n      // Dragging right — swap when the cursor crosses past the target's centre.\n      if (clientX < midpoint) return;\n      position = 'after';\n    } else {\n      // Dragging left — swap when the cursor crosses before the target's centre.\n      if (clientX > midpoint) return;\n      position = 'before';\n    }\n\n    this.#swapping = true;\n    try {\n      const before = this.#captureCellRects();\n      await this.host.moveColumn(source.key, target.column.key, position);\n      await this.host.updateComplete;\n      // Child rows + header row schedule their own updates one microtask\n      // after the grid — wait for them so the cells have actually moved\n      // before measuring the \"Last\" rect.\n      await awaitChildUpdates([\n        this.headerRow as unknown as { updateComplete: Promise<unknown> } | undefined,\n        ...this.host.rows,\n      ]);\n      playFlip(before, 'x');\n    } finally {\n      this.#swapping = false;\n    }\n  }\n\n  /**\n   * Snapshots the bounding rect of every header + body cell before a\n   * swap. Used as the \"First\" step of a FLIP — after `moveColumn` resolves,\n   * `playFlip` computes the delta against the new rect and animates each\n   * element from its old position back to identity.\n   */\n  #captureCellRects(): FlipEntry[] {\n    const entries: FlipEntry[] = [];\n    const headerRow = this.headerRow;\n    if (headerRow?.headers) {\n      for (const header of headerRow.headers) {\n        entries.push(captureRect(header));\n      }\n    }\n    for (const row of this.host.rows) {\n      for (const cell of row.cells) {\n        entries.push(captureRect(cell as unknown as HTMLElement));\n      }\n    }\n    return entries;\n  }\n}\n"]}

package/controllers/row-pin.d.ts

@@ -0,0 +1,59 @@
+import type { ReactiveController } from 'lit';
+import type { GridHost } from '../internal/types.js';
+/** Where a row is pinned, or `null` when it scrolls with the body. */
+export type RowPinPosition = 'top' | 'bottom';
+/**
+ * Reactive controller backing row pinning.
+ *
+ * @remarks
+ * Pinned rows are lifted out of the scrollable body and rendered in sticky
+ * bands above (`'top'`) or below (`'bottom'`) the virtualized rows. State is
+ * reference-based: the controller holds a `Set` of row data references per band,
+ * so pins survive sort / filter / pagination as long as those preserve row
+ * identity (the default in-place pipeline does). Replacing {@link ApexGrid.data}
+ * wholesale should be followed by re-pinning or {@link clear}.
+ *
+ * Mutations go through the cancellable `rowPinning` event and emit a follow-up
+ * `rowPinned` event, mirroring selection / expansion.
+ */
+export declare class RowPinController<T extends object> implements ReactiveController {
+    #private;
+    protected host: GridHost<T>;
+    constructor(host: GridHost<T>);
+    hostConnected(): void;
+    /** Whether row pinning is enabled at the grid level. */
+    get enabled(): boolean;
+    /** Whether any row is currently pinned. */
+    get hasPinnedRows(): boolean;
+    /** The band `row` is pinned to, or `null` when it is not pinned. */
+    pinnedPosition(row: T): RowPinPosition | null;
+    /** Whether `row` is pinned to either band. */
+    isPinned(row: T): boolean;
+    /** Pinned rows per band, in the order they were pinned. */
+    get pinnedRows(): {
+        top: T[];
+        bottom: T[];
+    };
+    /**
+     * Pins `row` to the given band. Moves it between bands when already pinned
+     * elsewhere. No-op (returns `true`) when it is already pinned there.
+     *
+     * @returns `true` when applied, `false` when disabled or cancelled.
+     */
+    pinRow(row: T, position: RowPinPosition): boolean;
+    /**
+     * Unpins `row` from whichever band holds it. No-op (returns `true`) when it is
+     * not pinned.
+     *
+     * @returns `true` when applied, `false` when cancelled.
+     */
+    unpinRow(row: T): boolean;
+    /** Clears every pin in both bands. */
+    clear(): void;
+    /**
+     * Restores pinned rows from explicit per-band reference lists (state restore),
+     * replacing any current pins. Silent: emits no `rowPinning` / `rowPinned` and
+     * preserves the given order within each band.
+     */
+    restore(top: ReadonlyArray<T>, bottom: ReadonlyArray<T>): void;
+}

package/controllers/row-pin.js

@@ -0,0 +1,75 @@
+export class RowPinController {
+    #top = new Set();
+    #bottom = new Set();
+    constructor(host) {
+        this.host = host;
+        this.host.addController(this);
+    }
+    hostConnected() { }
+    get enabled() {
+        return Boolean(this.host.rowPinning?.enabled);
+    }
+    get hasPinnedRows() {
+        return this.#top.size > 0 || this.#bottom.size > 0;
+    }
+    pinnedPosition(row) {
+        if (this.#top.has(row))
+            return 'top';
+        if (this.#bottom.has(row))
+            return 'bottom';
+        return null;
+    }
+    isPinned(row) {
+        return this.#top.has(row) || this.#bottom.has(row);
+    }
+    get pinnedRows() {
+        return { top: [...this.#top], bottom: [...this.#bottom] };
+    }
+    pinRow(row, position) {
+        if (!this.enabled)
+            return false;
+        if (this.pinnedPosition(row) === position)
+            return true;
+        if (!this.#emitPinning(row, position))
+            return false;
+        this.#top.delete(row);
+        this.#bottom.delete(row);
+        (position === 'top' ? this.#top : this.#bottom).add(row);
+        this.#commit(row, position, this.host.localize(position === 'top' ? 'announce.rowPinnedTop' : 'announce.rowPinnedBottom'));
+        return true;
+    }
+    unpinRow(row) {
+        if (!this.isPinned(row))
+            return true;
+        if (!this.#emitPinning(row, null))
+            return false;
+        this.#top.delete(row);
+        this.#bottom.delete(row);
+        this.#commit(row, null, this.host.localize('announce.rowUnpinned'));
+        return true;
+    }
+    clear() {
+        if (!this.hasPinnedRows)
+            return;
+        this.#top.clear();
+        this.#bottom.clear();
+        this.host.requestUpdate();
+    }
+    restore(top, bottom) {
+        this.#top = new Set(top);
+        this.#bottom = new Set(bottom);
+        this.host.requestUpdate();
+    }
+    #emitPinning(row, position) {
+        return this.host.emitEvent('rowPinning', {
+            detail: { row, position },
+            cancelable: true,
+        });
+    }
+    #commit(row, position, message) {
+        this.host.requestUpdate();
+        this.host.announce(message);
+        this.host.emitEvent('rowPinned', { detail: { row, position } });
+    }
+}
+//# sourceMappingURL=row-pin.js.map

package/controllers/row-pin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"row-pin.js","sourceRoot":"","sources":["../../src/controllers/row-pin.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ReactiveController } from 'lit';\nimport type { GridHost } from '../internal/types.js';\n\n/** Where a row is pinned, or `null` when it scrolls with the body. */\nexport type RowPinPosition = 'top' | 'bottom';\n\n/**\n * Reactive controller backing row pinning.\n *\n * @remarks\n * Pinned rows are lifted out of the scrollable body and rendered in sticky\n * bands above (`'top'`) or below (`'bottom'`) the virtualized rows. State is\n * reference-based: the controller holds a `Set` of row data references per band,\n * so pins survive sort / filter / pagination as long as those preserve row\n * identity (the default in-place pipeline does). Replacing {@link ApexGrid.data}\n * wholesale should be followed by re-pinning or {@link clear}.\n *\n * Mutations go through the cancellable `rowPinning` event and emit a follow-up\n * `rowPinned` event, mirroring selection / expansion.\n */\nexport class RowPinController<T extends object> implements ReactiveController {\n  #top: Set<T> = new Set();\n  #bottom: Set<T> = new Set();\n\n  constructor(protected host: GridHost<T>) {\n    this.host.addController(this);\n  }\n\n  public hostConnected() {}\n\n  /** Whether row pinning is enabled at the grid level. */\n  public get enabled(): boolean {\n    return Boolean(this.host.rowPinning?.enabled);\n  }\n\n  /** Whether any row is currently pinned. */\n  public get hasPinnedRows(): boolean {\n    return this.#top.size > 0 || this.#bottom.size > 0;\n  }\n\n  /** The band `row` is pinned to, or `null` when it is not pinned. */\n  public pinnedPosition(row: T): RowPinPosition | null {\n    if (this.#top.has(row)) return 'top';\n    if (this.#bottom.has(row)) return 'bottom';\n    return null;\n  }\n\n  /** Whether `row` is pinned to either band. */\n  public isPinned(row: T): boolean {\n    return this.#top.has(row) || this.#bottom.has(row);\n  }\n\n  /** Pinned rows per band, in the order they were pinned. */\n  public get pinnedRows(): { top: T[]; bottom: T[] } {\n    return { top: [...this.#top], bottom: [...this.#bottom] };\n  }\n\n  /**\n   * Pins `row` to the given band. Moves it between bands when already pinned\n   * elsewhere. No-op (returns `true`) when it is already pinned there.\n   *\n   * @returns `true` when applied, `false` when disabled or cancelled.\n   */\n  public pinRow(row: T, position: RowPinPosition): boolean {\n    if (!this.enabled) return false;\n    if (this.pinnedPosition(row) === position) return true;\n    if (!this.#emitPinning(row, position)) return false;\n\n    this.#top.delete(row);\n    this.#bottom.delete(row);\n    (position === 'top' ? this.#top : this.#bottom).add(row);\n    this.#commit(\n      row,\n      position,\n      this.host.localize(position === 'top' ? 'announce.rowPinnedTop' : 'announce.rowPinnedBottom')\n    );\n    return true;\n  }\n\n  /**\n   * Unpins `row` from whichever band holds it. No-op (returns `true`) when it is\n   * not pinned.\n   *\n   * @returns `true` when applied, `false` when cancelled.\n   */\n  public unpinRow(row: T): boolean {\n    if (!this.isPinned(row)) return true;\n    if (!this.#emitPinning(row, null)) return false;\n\n    this.#top.delete(row);\n    this.#bottom.delete(row);\n    this.#commit(row, null, this.host.localize('announce.rowUnpinned'));\n    return true;\n  }\n\n  /** Clears every pin in both bands. */\n  public clear(): void {\n    if (!this.hasPinnedRows) return;\n    this.#top.clear();\n    this.#bottom.clear();\n    this.host.requestUpdate();\n  }\n\n  /**\n   * Restores pinned rows from explicit per-band reference lists (state restore),\n   * replacing any current pins. Silent: emits no `rowPinning` / `rowPinned` and\n   * preserves the given order within each band.\n   */\n  public restore(top: ReadonlyArray<T>, bottom: ReadonlyArray<T>): void {\n    this.#top = new Set(top);\n    this.#bottom = new Set(bottom);\n    this.host.requestUpdate();\n  }\n\n  #emitPinning(row: T, position: RowPinPosition | null): boolean {\n    return this.host.emitEvent('rowPinning', {\n      detail: { row, position },\n      cancelable: true,\n    });\n  }\n\n  #commit(row: T, position: RowPinPosition | null, message: string): void {\n    this.host.requestUpdate();\n    this.host.announce(message);\n    this.host.emitEvent('rowPinned', { detail: { row, position } });\n  }\n}\n"]}