@toolbox-web/grid 1.19.3 → 1.20.0

package/lib/plugins/selection/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../../libs/grid/src/lib/core/internal/utils.ts","../../../../../../libs/grid/src/lib/core/types.ts","../../../../../../libs/grid/src/lib/core/plugin/base-plugin.ts","../../../../../../libs/grid/src/lib/core/plugin/expander-column.ts","../../../../../../libs/grid/src/lib/plugins/selection/range-selection.ts","../../../../../../libs/grid/src/lib/plugins/selection/SelectionPlugin.ts"],"sourcesContent":["// #region Environment Helpers\n\n/**\n * Check if we're running in a development environment.\n * Returns true for localhost or when NODE_ENV !== 'production'.\n * Used to show warnings only in development.\n */\nexport function isDevelopment(): boolean {\n  // Check for localhost (browser environment)\n  if (typeof window !== 'undefined' && window.location) {\n    const hostname = window.location.hostname;\n    if (hostname === 'localhost' || hostname === '127.0.0.1' || hostname === '::1') {\n      return true;\n    }\n  }\n  // Check for NODE_ENV (build-time or SSR)\n  if (typeof process !== 'undefined' && process.env?.NODE_ENV !== 'production') {\n    return true;\n  }\n  return false;\n}\n\n// #endregion\n\n// #region Cell Rendering Helpers\n\n/**\n * Generate accessible HTML for a boolean cell.\n * Uses role=\"checkbox\" with proper aria attributes.\n */\nexport function booleanCellHTML(value: boolean): string {\n  return `<span role=\"checkbox\" aria-checked=\"${value}\" aria-label=\"${value}\">${value ? '&#x1F5F9;' : '&#9744;'}</span>`;\n}\n\n/**\n * Format a date value for display.\n * Handles Date objects, timestamps, and date strings.\n * Returns empty string for invalid dates.\n */\nexport function formatDateValue(value: unknown): string {\n  if (value == null || value === '') return '';\n  if (value instanceof Date) {\n    return isNaN(value.getTime()) ? '' : value.toLocaleDateString();\n  }\n  if (typeof value === 'number' || typeof value === 'string') {\n    const d = new Date(value);\n    return isNaN(d.getTime()) ? '' : d.toLocaleDateString();\n  }\n  return '';\n}\n\n/**\n * Get the row index from a cell element's data-row attribute.\n * Falls back to calculating from parent row's DOM position if data-row is missing.\n * Returns -1 if no valid row index is found.\n */\nexport function getRowIndexFromCell(cell: Element | null): number {\n  if (!cell) return -1;\n  const attr = cell.getAttribute('data-row');\n  if (attr) return parseInt(attr, 10);\n\n  // Fallback: find the parent .data-grid-row and calculate index from siblings\n  const rowEl = cell.closest('.data-grid-row');\n  if (!rowEl) return -1;\n\n  const parent = rowEl.parentElement;\n  if (!parent) return -1;\n\n  // Get all data-grid-row siblings and find this row's index\n  const rows = parent.querySelectorAll(':scope > .data-grid-row');\n  for (let i = 0; i < rows.length; i++) {\n    if (rows[i] === rowEl) return i;\n  }\n  return -1;\n}\n\n/**\n * Get the column index from a cell element's data-col attribute.\n * Returns -1 if no valid column index is found.\n */\nexport function getColIndexFromCell(cell: Element | null): number {\n  if (!cell) return -1;\n  const attr = cell.getAttribute('data-col');\n  return attr ? parseInt(attr, 10) : -1;\n}\n\n/**\n * Clear all cell-focus styling from a root element.\n * Used when changing focus or when selection plugin takes over focus management.\n */\nexport function clearCellFocus(root: Element | null): void {\n  if (!root) return;\n  root.querySelectorAll('.cell-focus').forEach((el) => el.classList.remove('cell-focus'));\n}\n// #endregion\n\n// #region RTL Helpers\n\n/** Text direction */\nexport type TextDirection = 'ltr' | 'rtl';\n\n/**\n * Get the text direction for an element.\n * Reads from the computed style, which respects the `dir` attribute on the element\n * or any ancestor, as well as CSS `direction` property.\n *\n * @param element - The element to check direction for\n * @returns 'ltr' or 'rtl'\n *\n * @example\n * ```typescript\n * // Detect grid's direction\n * const dir = getDirection(gridElement);\n * if (dir === 'rtl') {\n *   // Handle RTL layout\n * }\n * ```\n */\nexport function getDirection(element: Element): TextDirection {\n  // Try computed style first (works in real browsers)\n  try {\n    const computedDir = getComputedStyle(element).direction;\n    if (computedDir === 'rtl') return 'rtl';\n  } catch {\n    // getComputedStyle may fail in some test environments\n  }\n\n  // Fallback: check dir attribute on element or ancestors\n  // This handles test environments where getComputedStyle may not reflect dir attribute\n  try {\n    const dirAttr = element.closest?.('[dir]')?.getAttribute('dir');\n    if (dirAttr === 'rtl') return 'rtl';\n  } catch {\n    // closest may not be available on mock elements\n  }\n\n  return 'ltr';\n}\n\n/**\n * Check if an element is in RTL mode.\n *\n * @param element - The element to check\n * @returns true if the element's text direction is right-to-left\n */\nexport function isRTL(element: Element): boolean {\n  return getDirection(element) === 'rtl';\n}\n\n/**\n * Resolve a logical inline position to a physical position based on text direction.\n *\n * - `'start'` → `'left'` in LTR, `'right'` in RTL\n * - `'end'` → `'right'` in LTR, `'left'` in RTL\n * - `'left'` / `'right'` → unchanged (physical values)\n *\n * @param position - Logical or physical position\n * @param direction - Text direction ('ltr' or 'rtl')\n * @returns Physical position ('left' or 'right')\n *\n * @example\n * ```typescript\n * resolveInlinePosition('start', 'ltr'); // 'left'\n * resolveInlinePosition('start', 'rtl'); // 'right'\n * resolveInlinePosition('left', 'rtl');  // 'left' (unchanged)\n * ```\n */\nexport function resolveInlinePosition(\n  position: 'left' | 'right' | 'start' | 'end',\n  direction: TextDirection,\n): 'left' | 'right' {\n  if (position === 'left' || position === 'right') {\n    return position;\n  }\n  if (direction === 'rtl') {\n    return position === 'start' ? 'right' : 'left';\n  }\n  return position === 'start' ? 'left' : 'right';\n}\n// #endregion\n","import type { RowPosition } from './internal/virtualization';\nimport type { PluginQuery } from './plugin/base-plugin';\nimport type { AfterCellRenderContext, AfterRowRenderContext, CellMouseEvent } from './plugin/types';\n\n/**\n * Position entry for a single row in the position cache.\n * Part of variable row height virtualization.\n *\n * Re-exported from position-cache.ts for public API consistency.\n *\n * @see VirtualState.positionCache\n * @category Plugin Development\n */\nexport type RowPositionEntry = RowPosition;\n\n// #region DataGridElement Interface\n/**\n * The compiled web component interface for DataGrid.\n *\n * This interface represents the `<tbw-grid>` custom element, combining\n * the public grid API with standard HTMLElement functionality.\n *\n * @example\n * ```typescript\n * // Query existing grid\n * const grid = document.querySelector('tbw-grid') as DataGridElement<Employee>;\n * grid.rows = employees;\n * grid.addEventListener('cell-click', (e) => console.log(e.detail));\n *\n * // Create grid programmatically\n * import { createGrid } from '@toolbox-web/grid';\n * const grid = createGrid<Employee>({\n *   columns: [{ field: 'name' }, { field: 'email' }],\n * });\n * document.body.appendChild(grid);\n * ```\n *\n * @see {@link PublicGrid} for the public API methods and properties\n * @see {@link createGrid} for typed grid creation\n * @see {@link queryGrid} for typed grid querying\n */\nexport interface DataGridElement extends PublicGrid, HTMLElement {}\n// #endregion\n\n// #region PublicGrid Interface\n/**\n * Public API interface for DataGrid component.\n *\n * **Property Getters vs Setters:**\n *\n * Property getters return the EFFECTIVE (resolved) value after merging all config sources.\n * This is the \"current situation\" - what consumers and plugins need to know.\n *\n * Property setters accept input values which are merged into the effective config.\n * Multiple sources can contribute (gridConfig, columns prop, light DOM, individual props).\n *\n * For example:\n * - `grid.fitMode` returns the resolved fitMode (e.g., 'stretch' even if you set undefined)\n * - `grid.columns` returns the effective columns after merging\n * - `grid.gridConfig` returns the full effective config\n */\nexport interface PublicGrid<T = any> {\n  /**\n   * Full config object. Setter merges with other inputs per precedence rules.\n   * Getter returns the effective (resolved) config.\n   */\n  gridConfig?: GridConfig<T>;\n  /**\n   * Column definitions.\n   * Getter returns effective columns (after merging config, light DOM, inference).\n   */\n  columns?: ColumnConfig<T>[];\n  /** Current row data (after plugin processing like grouping, filtering). */\n  rows?: T[];\n  /** Resolves once the component has finished initial work (layout, inference). */\n  ready?: () => Promise<void>;\n  /** Force a layout / measurement pass (e.g. after container resize). */\n  forceLayout?: () => Promise<void>;\n  /** Return effective resolved config (after inference & precedence). */\n  getConfig?: () => Promise<Readonly<GridConfig<T>>>;\n  /** Toggle expansion state of a group row by its generated key. */\n  toggleGroup?: (key: string) => Promise<void>;\n\n  // Custom Styles API\n  /**\n   * Register custom CSS styles to be injected into the grid.\n   * Use this to style custom cell renderers, editors, or detail panels.\n   * @param id - Unique identifier for the style block (for removal/updates)\n   * @param css - CSS string to inject\n   */\n  registerStyles?: (id: string, css: string) => void;\n  /**\n   * Remove previously registered custom styles.\n   * @param id - The ID used when registering the styles\n   */\n  unregisterStyles?: (id: string) => void;\n  /**\n   * Get list of registered custom style IDs.\n   */\n  getRegisteredStyles?: () => string[];\n\n  // Plugin API\n  /**\n   * Get a plugin instance by its class.\n   *\n   * @example\n   * ```typescript\n   * const selection = grid.getPlugin(SelectionPlugin);\n   * if (selection) {\n   *   selection.selectAll();\n   * }\n   * ```\n   */\n  getPlugin?<P>(PluginClass: new (...args: any[]) => P): P | undefined;\n  /**\n   * Get a plugin instance by its name.\n   * Prefer `getPlugin(PluginClass)` for type safety.\n   */\n  getPluginByName?(name: string): GridPlugin | undefined;\n\n  // Shell API\n  /**\n   * Re-render the shell header (title, column groups, toolbar).\n   * Call this after dynamically adding/removing tool panels or toolbar buttons.\n   */\n  refreshShellHeader?(): void;\n  /**\n   * Register a custom tool panel in the sidebar.\n   *\n   * @example\n   * ```typescript\n   * grid.registerToolPanel({\n   *   id: 'analytics',\n   *   title: 'Analytics',\n   *   icon: '📊',\n   *   render: (container) => {\n   *     container.innerHTML = '<div>Charts here...</div>';\n   *   }\n   * });\n   * ```\n   */\n  registerToolPanel?(panel: ToolPanelDefinition): void;\n  /**\n   * Unregister a previously registered tool panel.\n   */\n  unregisterToolPanel?(panelId: string): void;\n  /**\n   * Open the tool panel sidebar.\n   */\n  openToolPanel?(): void;\n  /**\n   * Close the tool panel sidebar.\n   */\n  closeToolPanel?(): void;\n  /**\n   * Toggle the tool panel sidebar open or closed.\n   */\n  toggleToolPanel?(): void;\n  /**\n   * Toggle an accordion section expanded or collapsed within the tool panel.\n   * @param sectionId - The ID of the section to toggle\n   */\n  toggleToolPanelSection?(sectionId: string): void;\n\n  // State Persistence API\n  /**\n   * Get the current column state including order, width, visibility, and sort.\n   * Use for persisting user preferences to localStorage or a backend.\n   *\n   * @example\n   * ```typescript\n   * const state = grid.getColumnState();\n   * localStorage.setItem('gridState', JSON.stringify(state));\n   * ```\n   */\n  getColumnState?(): GridColumnState;\n  /**\n   * Set/restore the column state.\n   * Can be set before or after grid initialization.\n   *\n   * @example\n   * ```typescript\n   * const saved = localStorage.getItem('gridState');\n   * if (saved) {\n   *   grid.columnState = JSON.parse(saved);\n   * }\n   * ```\n   */\n  columnState?: GridColumnState;\n\n  // Loading API\n  /**\n   * Whether the grid is currently in a loading state.\n   * When true, displays a loading overlay with spinner.\n   *\n   * Can also be set via the `loading` HTML attribute.\n   *\n   * @example\n   * ```typescript\n   * // Show loading overlay\n   * grid.loading = true;\n   * const data = await fetchData();\n   * grid.rows = data;\n   * grid.loading = false;\n   * ```\n   */\n  loading?: boolean;\n\n  /**\n   * Set loading state for a specific row.\n   * Displays a small spinner indicator on the row.\n   *\n   * Use when persisting row data or performing row-level async operations.\n   *\n   * @param rowId - The row's unique identifier (from getRowId)\n   * @param loading - Whether the row is loading\n   *\n   * @example\n   * ```typescript\n   * // Show loading while saving row\n   * grid.setRowLoading('emp-123', true);\n   * await saveRow(row);\n   * grid.setRowLoading('emp-123', false);\n   * ```\n   */\n  setRowLoading?(rowId: string, loading: boolean): void;\n\n  /**\n   * Set loading state for a specific cell.\n   * Displays a small spinner indicator on the cell.\n   *\n   * Use when performing cell-level async operations (e.g., validation, lookup).\n   *\n   * @param rowId - The row's unique identifier (from getRowId)\n   * @param field - The column field\n   * @param loading - Whether the cell is loading\n   *\n   * @example\n   * ```typescript\n   * // Show loading while validating cell\n   * grid.setCellLoading('emp-123', 'email', true);\n   * const isValid = await validateEmail(email);\n   * grid.setCellLoading('emp-123', 'email', false);\n   * ```\n   */\n  setCellLoading?(rowId: string, field: string, loading: boolean): void;\n\n  /**\n   * Check if a row is currently in loading state.\n   * @param rowId - The row's unique identifier\n   */\n  isRowLoading?(rowId: string): boolean;\n\n  /**\n   * Check if a cell is currently in loading state.\n   * @param rowId - The row's unique identifier\n   * @param field - The column field\n   */\n  isCellLoading?(rowId: string, field: string): boolean;\n\n  /**\n   * Clear all row and cell loading states.\n   */\n  clearAllLoading?(): void;\n}\n// #endregion\n\n// #region InternalGrid Interface\n/**\n * Internal-only augmented interface for DataGrid component.\n *\n * Member prefixes indicate accessibility:\n * - `_underscore` = protected members - private outside core, accessible to plugins. Marked with @internal.\n * - `__doubleUnderscore` = deeply internal members - private outside core, only for internal functions.\n *\n * @category Plugin Development\n */\nexport interface InternalGrid<T = any> extends PublicGrid<T>, GridConfig<T> {\n  // Element methods available because DataGridElement extends HTMLElement\n  querySelector<K extends keyof HTMLElementTagNameMap>(selectors: K): HTMLElementTagNameMap[K] | null;\n  querySelector<E extends Element = Element>(selectors: string): E | null;\n  querySelectorAll<K extends keyof HTMLElementTagNameMap>(selectors: K): NodeListOf<HTMLElementTagNameMap[K]>;\n  querySelectorAll<E extends Element = Element>(selectors: string): NodeListOf<E>;\n  _rows: T[];\n  _columns: ColumnInternal<T>[];\n  /** Visible columns only (excludes hidden). Use for rendering. */\n  _visibleColumns: ColumnInternal<T>[];\n  _headerRowEl: HTMLElement;\n  _bodyEl: HTMLElement;\n  _rowPool: RowElementInternal[];\n  _resizeController: ResizeController;\n  _sortState: { field: string; direction: 1 | -1 } | null;\n  /** Original unfiltered/unprocessed rows. @internal */\n  sourceRows: T[];\n  /** Framework adapter instance (set by Grid directives). @internal */\n  __frameworkAdapter?: FrameworkAdapter;\n  __originalOrder: T[];\n  __rowRenderEpoch: number;\n  __didInitialAutoSize?: boolean;\n  __lightDomColumnsCache?: ColumnInternal[];\n  __originalColumnNodes?: HTMLElement[];\n  /** Cell display value cache. @internal */\n  __cellDisplayCache?: Map<number, string[]>;\n  /** Cache epoch for cell display values. @internal */\n  __cellCacheEpoch?: number;\n  /** Cached header row count for virtualization. @internal */\n  __cachedHeaderRowCount?: number;\n  /** Cached flag for whether grid has special columns (custom renderers, etc.). @internal */\n  __hasSpecialColumns?: boolean;\n  /** Cached flag for whether any plugin has renderRow hooks. @internal */\n  __hasRenderRowPlugins?: boolean;\n  _gridTemplate: string;\n  _virtualization: VirtualState;\n  _focusRow: number;\n  _focusCol: number;\n  /** Currently active edit row index. Injected by EditingPlugin. @internal */\n  _activeEditRows?: number;\n  /** Whether the grid is in 'grid' editing mode (all rows editable). Injected by EditingPlugin. @internal */\n  _isGridEditMode?: boolean;\n  /** Snapshots of row data before editing. Injected by EditingPlugin. @internal */\n  _rowEditSnapshots?: Map<number, T>;\n  /** Get all changed rows. Injected by EditingPlugin. */\n  changedRows?: T[];\n  /** Get IDs of all changed rows. Injected by EditingPlugin. */\n  changedRowIds?: string[];\n  effectiveConfig?: GridConfig<T>;\n  findHeaderRow?: () => HTMLElement;\n  refreshVirtualWindow: (full: boolean, skipAfterRender?: boolean) => boolean;\n  updateTemplate?: () => void;\n  findRenderedRowElement?: (rowIndex: number) => HTMLElement | null;\n  /** Get a row by its ID. Implemented in grid.ts */\n  getRow?: (id: string) => T | undefined;\n  /** Get a row and its current index by ID. Returns undefined if not found. @internal */\n  _getRowEntry: (id: string) => { row: T; index: number } | undefined;\n  /** Get the unique ID for a row. Implemented in grid.ts */\n  getRowId?: (row: T) => string;\n  /** Update a row by ID. Implemented in grid.ts */\n  updateRow?: (id: string, changes: Partial<T>, source?: UpdateSource) => void;\n  /** Animate a single row. Implemented in grid.ts */\n  animateRow?: (rowIndex: number, type: RowAnimationType) => void;\n  /** Animate multiple rows. Implemented in grid.ts */\n  animateRows?: (rowIndices: number[], type: RowAnimationType) => void;\n  /** Animate a row by its ID. Implemented in grid.ts */\n  animateRowById?: (rowId: string, type: RowAnimationType) => boolean;\n  /** Begin bulk edit on a row. Injected by EditingPlugin. */\n  beginBulkEdit?: (rowIndex: number) => void;\n  /** Commit active row edit. Injected by EditingPlugin. */\n  commitActiveRowEdit?: () => void;\n  /** Dispatch cell click to plugin system, returns true if handled */\n  _dispatchCellClick?: (event: MouseEvent, rowIndex: number, colIndex: number, cellEl: HTMLElement) => boolean;\n  /** Dispatch row click to plugin system, returns true if handled */\n  _dispatchRowClick?: (event: MouseEvent, rowIndex: number, row: any, rowEl: HTMLElement) => boolean;\n  /** Dispatch header click to plugin system, returns true if handled */\n  _dispatchHeaderClick?: (event: MouseEvent, col: ColumnConfig, headerEl: HTMLElement) => boolean;\n  /** Dispatch keydown to plugin system, returns true if handled */\n  _dispatchKeyDown?: (event: KeyboardEvent) => boolean;\n  /** Dispatch cell mouse events for drag operations. Returns true if any plugin started a drag. */\n  _dispatchCellMouseDown?: (event: CellMouseEvent) => boolean;\n  /** Dispatch cell mouse move during drag. */\n  _dispatchCellMouseMove?: (event: CellMouseEvent) => void;\n  /** Dispatch cell mouse up to end drag. */\n  _dispatchCellMouseUp?: (event: CellMouseEvent) => void;\n  /** Call afterCellRender hook on all plugins. Called from rows.ts after each cell is rendered. @internal */\n  _afterCellRender?: (context: AfterCellRenderContext<T>) => void;\n  /** Check if any plugin has registered an afterCellRender hook. Used to skip hook call for performance. @internal */\n  _hasAfterCellRenderHook?: () => boolean;\n  /** Call afterRowRender hook on all plugins. Called from rows.ts after each row is rendered. @internal */\n  _afterRowRender?: (context: AfterRowRenderContext<T>) => void;\n  /** Check if any plugin has registered an afterRowRender hook. Used to skip hook call for performance. @internal */\n  _hasAfterRowRenderHook?: () => boolean;\n  /** Get horizontal scroll boundary offsets from plugins */\n  _getHorizontalScrollOffsets?: (\n    rowEl?: HTMLElement,\n    focusedCell?: HTMLElement,\n  ) => { left: number; right: number; skipScroll?: boolean };\n  /** Query all plugins with a generic query and collect responses */\n  queryPlugins?: <T>(query: PluginQuery) => T[];\n  /** Request emission of column-state-change event (debounced) */\n  requestStateChange?: () => void;\n}\n// #endregion\n\n// #region Column Types\n/**\n * Built-in primitive column types with automatic formatting and editing support.\n *\n * - `'string'` - Text content, default text input editor\n * - `'number'` - Numeric content, right-aligned, number input editor\n * - `'date'` - Date content, formatted display, date picker editor\n * - `'boolean'` - True/false, rendered as checkbox\n * - `'select'` - Dropdown selection from `options` array\n *\n * @example\n * ```typescript\n * columns: [\n *   { field: 'name', type: 'string' },\n *   { field: 'age', type: 'number' },\n *   { field: 'hireDate', type: 'date' },\n *   { field: 'active', type: 'boolean' },\n *   { field: 'department', type: 'select', options: [\n *     { label: 'Engineering', value: 'eng' },\n *     { label: 'Sales', value: 'sales' },\n *   ]},\n * ]\n * ```\n *\n * @see {@link ColumnType} for custom type support\n * @see {@link TypeDefault} for type-level defaults\n */\nexport type PrimitiveColumnType = 'number' | 'string' | 'date' | 'boolean' | 'select';\n\n/**\n * Column type - built-in primitives or custom type strings.\n *\n * Use built-in types for automatic formatting, or define custom types\n * (e.g., 'currency', 'country') with type-level defaults via `typeDefaults`.\n *\n * @example\n * ```typescript\n * // Built-in types\n * { field: 'name', type: 'string' }\n * { field: 'salary', type: 'number' }\n *\n * // Custom types with defaults\n * grid.gridConfig = {\n *   columns: [\n *     { field: 'salary', type: 'currency' },\n *     { field: 'birthCountry', type: 'country' },\n *   ],\n *   typeDefaults: {\n *     currency: {\n *       format: (v) => `$${Number(v).toFixed(2)}`,\n *     },\n *     country: {\n *       renderer: (ctx) => `🌍 ${ctx.value}`,\n *     },\n *   },\n * };\n * ```\n *\n * @see {@link PrimitiveColumnType} for built-in types\n * @see {@link TypeDefault} for defining custom type defaults\n */\nexport type ColumnType = PrimitiveColumnType | (string & {});\n// #endregion\n\n// #region TypeDefault Interface\n/**\n * Type-level defaults for formatters and renderers.\n * Applied to all columns of a given type unless overridden at column level.\n *\n * Note: `editor` and `editorParams` are added via module augmentation when\n * EditingPlugin is imported. `filterPanelRenderer` is added by FilteringPlugin.\n *\n * @example\n * ```typescript\n * typeDefaults: {\n *   currency: {\n *     format: (value) => new Intl.NumberFormat('en-US', {\n *       style: 'currency',\n *       currency: 'USD',\n *     }).format(value as number),\n *   },\n *   country: {\n *     renderer: (ctx) => {\n *       const span = document.createElement('span');\n *       span.innerHTML = `<img src=\"/flags/${ctx.value}.svg\" /> ${ctx.value}`;\n *       return span;\n *     }\n *   }\n * }\n * ```\n *\n * @see {@link ColumnViewRenderer} for custom renderer function signature\n * @see {@link ColumnType} for type strings that can have defaults\n * @see {@link GridConfig.typeDefaults} for registering type defaults\n */\nexport interface TypeDefault<TRow = unknown> {\n  /**\n   * Default formatter for all columns of this type.\n   *\n   * Transforms the raw cell value into a display string. Use when you need\n   * consistent formatting across columns without custom DOM (e.g., currency,\n   * percentages, dates with specific locale).\n   *\n   * **Resolution Priority**: Column `format` → Type `format` → Built-in\n   *\n   * @example\n   * ```typescript\n   * typeDefaults: {\n   *   currency: {\n   *     format: (value) => new Intl.NumberFormat('en-US', {\n   *       style: 'currency',\n   *       currency: 'USD',\n   *     }).format(value as number),\n   *   },\n   *   percentage: {\n   *     format: (value) => `${(value as number * 100).toFixed(1)}%`,\n   *   }\n   * }\n   * ```\n   */\n  format?: (value: unknown, row: TRow) => string;\n\n  /**\n   * Default renderer for all columns of this type.\n   *\n   * Creates custom DOM for the cell content. Use when you need more than\n   * text formatting (e.g., icons, badges, interactive elements).\n   *\n   * **Resolution Priority**: Column `renderer` → Type `renderer` → App-level (adapter) → Built-in\n   *\n   * @example\n   * ```typescript\n   * typeDefaults: {\n   *   status: {\n   *     renderer: (ctx) => {\n   *       const badge = document.createElement('span');\n   *       badge.className = `badge badge-${ctx.value}`;\n   *       badge.textContent = ctx.value as string;\n   *       return badge;\n   *     }\n   *   },\n   *   country: {\n   *     renderer: (ctx) => {\n   *       const span = document.createElement('span');\n   *       span.innerHTML = `<img src=\"/flags/${ctx.value}.svg\" /> ${ctx.value}`;\n   *       return span;\n   *     }\n   *   }\n   * }\n   * ```\n   */\n  renderer?: ColumnViewRenderer<TRow, unknown>;\n}\n// #endregion\n\n// #region BaseColumnConfig Interface\n/**\n * Base contract for a column configuration.\n *\n * Defines the fundamental properties all columns share. Extended by {@link ColumnConfig}\n * with additional features like custom renderers and grouping.\n *\n * @example\n * ```typescript\n * // Basic column with common properties\n * const columns: BaseColumnConfig<Employee>[] = [\n *   {\n *     field: 'name',\n *     header: 'Full Name',\n *     sortable: true,\n *     resizable: true,\n *   },\n *   {\n *     field: 'salary',\n *     type: 'number',\n *     width: 120,\n *     format: (value) => `$${value.toLocaleString()}`,\n *     sortComparator: (a, b) => a - b,\n *   },\n *   {\n *     field: 'department',\n *     type: 'select',\n *     options: [\n *       { label: 'Engineering', value: 'eng' },\n *       { label: 'Sales', value: 'sales' },\n *     ],\n *   },\n * ];\n * ```\n *\n * @see {@link ColumnConfig} for full column configuration with renderers\n * @see {@link ColumnType} for type options\n */\nexport interface BaseColumnConfig<TRow = any, TValue = any> {\n  /** Unique field key referencing property in row objects */\n  field: keyof TRow & string;\n  /** Visible header label; defaults to capitalized field */\n  header?: string;\n  /**\n   * Column data type.\n   *\n   * Built-in types: `'string'`, `'number'`, `'date'`, `'boolean'`, `'select'`\n   *\n   * Custom types (e.g., `'currency'`, `'country'`) can have type-level defaults\n   * via `gridConfig.typeDefaults` or framework adapter registries.\n   *\n   * @default Inferred from first row data\n   */\n  type?: ColumnType;\n  /** Column width in pixels; fixed size (no flexibility) */\n  width?: string | number;\n  /** Minimum column width in pixels (stretch mode only); when set, column uses minmax(minWidth, 1fr) */\n  minWidth?: number;\n  /** Whether column can be sorted */\n  sortable?: boolean;\n  /** Whether column can be resized by user */\n  resizable?: boolean;\n  /** Optional custom comparator for sorting (a,b) -> number */\n  sortComparator?: (a: TValue, b: TValue, rowA: TRow, rowB: TRow) => number;\n  /** For select type - available options */\n  options?: Array<{ label: string; value: unknown }> | (() => Array<{ label: string; value: unknown }>);\n  /** For select - allow multi select */\n  multi?: boolean;\n  /**\n   * Formats the raw cell value into a display string.\n   *\n   * Used both for **cell rendering** and the **built-in filter panel**:\n   * - In cells, the formatted value replaces the raw value as text content.\n   * - In the filter panel (set filter), checkbox labels show the formatted value\n   *   instead of the raw value, and search matches against the formatted text.\n   *\n   * The `row` parameter is available during cell rendering but is `undefined`\n   * when called from the filter panel (standalone value formatting). Avoid\n   * accessing `row` properties in format functions intended for filter display.\n   *\n   * @example\n   * ```typescript\n   * // Currency formatter — works in both cells and filter panel\n   * {\n   *   field: 'price',\n   *   format: (value) => `$${Number(value).toFixed(2)}`,\n   * }\n   *\n   * // ID-to-name lookup — filter panel shows names, not IDs\n   * {\n   *   field: 'departmentId',\n   *   format: (value) => departmentMap.get(value as string) ?? String(value),\n   * }\n   * ```\n   */\n  format?: (value: TValue, row: TRow) => string;\n  /** Arbitrary extra metadata */\n  meta?: Record<string, unknown>;\n}\n// #endregion\n\n// #region ColumnConfig Interface\n/**\n * Full column configuration including custom renderers, editors, and grouping metadata.\n *\n * Extends {@link BaseColumnConfig} with additional features for customizing\n * how cells are displayed and edited.\n *\n * @example\n * ```typescript\n * const columns: ColumnConfig<Employee>[] = [\n *   // Basic sortable column\n *   { field: 'id', header: 'ID', width: 60, sortable: true },\n *\n *   // Column with custom renderer\n *   {\n *     field: 'name',\n *     header: 'Employee',\n *     renderer: (ctx) => {\n *       const div = document.createElement('div');\n *       div.innerHTML = `<img src=\"${ctx.row.avatar}\" /><span>${ctx.value}</span>`;\n *       return div;\n *     },\n *   },\n *\n *   // Column with custom header\n *   {\n *     field: 'email',\n *     headerLabelRenderer: (ctx) => `${ctx.value} 📧`,\n *   },\n *\n *   // Editable column (requires EditingPlugin)\n *   {\n *     field: 'status',\n *     editable: true,\n *     editor: (ctx) => {\n *       const select = document.createElement('select');\n *       // ... editor implementation\n *       return select;\n *     },\n *   },\n *\n *   // Hidden column (can be shown via VisibilityPlugin)\n *   { field: 'internalNotes', hidden: true },\n * ];\n * ```\n *\n * @see {@link BaseColumnConfig} for basic column properties\n * @see {@link ColumnViewRenderer} for custom cell renderers\n * @see {@link ColumnEditorSpec} for custom cell editors\n * @see {@link HeaderRenderer} for custom header renderers\n */\nexport interface ColumnConfig<TRow = any> extends BaseColumnConfig<TRow, any> {\n  /**\n   * Optional custom cell renderer function. Alias for `viewRenderer`.\n   * Can return an HTMLElement, a Node, or an HTML string (which will be sanitized).\n   *\n   * @example\n   * ```typescript\n   * // Simple string template\n   * renderer: (ctx) => `<span class=\"badge\">${ctx.value}</span>`\n   *\n   * // DOM element\n   * renderer: (ctx) => {\n   *   const el = document.createElement('span');\n   *   el.textContent = ctx.value;\n   *   return el;\n   * }\n   * ```\n   */\n  renderer?: ColumnViewRenderer<TRow, any>;\n  /** Optional custom view renderer used instead of default text rendering */\n  viewRenderer?: ColumnViewRenderer<TRow, any>;\n  /** External view spec (lets host app mount any framework component) */\n  externalView?: {\n    component: unknown;\n    props?: Record<string, unknown>;\n    mount?: (options: {\n      placeholder: HTMLElement;\n      context: CellRenderContext<TRow, unknown>;\n      spec: unknown;\n    }) => void | { dispose?: () => void };\n  };\n  /** Whether the column is initially hidden */\n  hidden?: boolean;\n  /** Prevent this column from being hidden programmatically */\n  lockVisible?: boolean;\n  /**\n   * Dynamic CSS class(es) for cells in this column.\n   * Called for each cell during rendering. Return class names to add to the cell element.\n   *\n   * @example\n   * ```typescript\n   * // Highlight negative values\n   * cellClass: (value, row, column) => value < 0 ? ['negative', 'text-red'] : []\n   *\n   * // Status-based styling\n   * cellClass: (value) => [`status-${value}`]\n   * ```\n   */\n  cellClass?: (value: unknown, row: TRow, column: ColumnConfig<TRow>) => string[];\n\n  /**\n   * Custom header label renderer. Customize the label content while the grid\n   * handles sort icons, filter buttons, resize handles, and click interactions.\n   *\n   * Use this for simple customizations like adding icons, badges, or units.\n   *\n   * @example\n   * ```typescript\n   * // Add required field indicator\n   * headerLabelRenderer: (ctx) => `${ctx.value} <span class=\"required\">*</span>`\n   *\n   * // Add unit to header\n   * headerLabelRenderer: (ctx) => {\n   *   const span = document.createElement('span');\n   *   span.innerHTML = `${ctx.value}<br/><small>(kg)</small>`;\n   *   return span;\n   * }\n   * ```\n   */\n  headerLabelRenderer?: HeaderLabelRenderer<TRow>;\n\n  /**\n   * Custom header cell renderer. Complete control over the entire header cell.\n   * Resize handles are added automatically for resizable columns.\n   *\n   * The context provides helper functions to include standard elements:\n   * - `renderSortIcon()` - Returns sort indicator element (null if not sortable)\n   * - `renderFilterButton()` - Returns filter button (null if not filterable)\n   *\n   * **Precedence**: `headerRenderer` > `headerLabelRenderer` > `header` > `field`\n   *\n   * @example\n   * ```typescript\n   * headerRenderer: (ctx) => {\n   *   const div = document.createElement('div');\n   *   div.className = 'custom-header';\n   *   div.innerHTML = `<span>${ctx.value}</span>`;\n   *   const sortIcon = ctx.renderSortIcon();\n   *   if (sortIcon) div.appendChild(sortIcon);\n   *   return div;\n   * }\n   * ```\n   */\n  headerRenderer?: HeaderRenderer<TRow>;\n}\n// #endregion\n\n// #region ColumnConfigMap Type\n/**\n * Array of column configurations.\n * Convenience type alias for `ColumnConfig<TRow>[]`.\n *\n * @example\n * ```typescript\n * const columns: ColumnConfigMap<Employee> = [\n *   { field: 'name', header: 'Full Name', sortable: true },\n *   { field: 'email', header: 'Email Address' },\n *   { field: 'department', type: 'select', options: deptOptions },\n * ];\n *\n * grid.columns = columns;\n * ```\n *\n * @see {@link ColumnConfig} for individual column options\n * @see {@link GridConfig.columns} for setting columns on the grid\n */\nexport type ColumnConfigMap<TRow = any> = ColumnConfig<TRow>[];\n// #endregion\n\n// #region Editor Types\n/**\n * Editor specification for inline cell editing.\n * Supports multiple formats for maximum flexibility.\n *\n * **Format Options:**\n * - `string` - Custom element tag name (e.g., 'my-date-picker')\n * - `function` - Factory function returning an editor element\n * - `object` - External component spec for framework integration\n *\n * @example\n * ```typescript\n * // 1. Custom element tag name\n * columns: [\n *   { field: 'date', editor: 'my-date-picker' }\n * ]\n *\n * // 2. Factory function (full control)\n * columns: [\n *   {\n *     field: 'status',\n *     editor: (ctx) => {\n *       const select = document.createElement('select');\n *       select.innerHTML = `\n *         <option value=\"active\">Active</option>\n *         <option value=\"inactive\">Inactive</option>\n *       `;\n *       select.value = ctx.value;\n *       select.onchange = () => ctx.commit(select.value);\n *       select.onkeydown = (e) => {\n *         if (e.key === 'Escape') ctx.cancel();\n *       };\n *       return select;\n *     }\n *   }\n * ]\n *\n * // 3. External component (React, Angular, Vue)\n * columns: [\n *   {\n *     field: 'country',\n *     editor: {\n *       component: CountrySelect,\n *       props: { showFlags: true }\n *     }\n *   }\n * ]\n * ```\n *\n * @see {@link ColumnEditorContext} for the context passed to factory functions\n */\nexport type ColumnEditorSpec<TRow = unknown, TValue = unknown> =\n  | string // custom element tag name\n  | ((context: ColumnEditorContext<TRow, TValue>) => HTMLElement | string)\n  | {\n      /** Arbitrary component reference (class, function, token) */\n      component: unknown;\n      /** Optional static props passed to mount */\n      props?: Record<string, unknown>;\n      /** Optional custom mount function; if provided we call it directly instead of emitting an event */\n      mount?: (options: {\n        placeholder: HTMLElement;\n        context: ColumnEditorContext<TRow, TValue>;\n        spec: unknown;\n      }) => void | { dispose?: () => void };\n    };\n\n/**\n * Context object provided to editor factories allowing mutation (commit/cancel) of a cell value.\n *\n * The `commit` and `cancel` functions control the editing lifecycle:\n * - Call `commit(newValue)` to save changes and exit edit mode\n * - Call `cancel()` to discard changes and exit edit mode\n *\n * @example\n * ```typescript\n * const myEditor: ColumnEditorSpec = (ctx: ColumnEditorContext) => {\n *   const input = document.createElement('input');\n *   input.value = ctx.value;\n *   input.className = 'my-editor';\n *\n *   // Save on Enter, cancel on Escape\n *   input.onkeydown = (e) => {\n *     if (e.key === 'Enter') {\n *       ctx.commit(input.value);\n *     } else if (e.key === 'Escape') {\n *       ctx.cancel();\n *     }\n *   };\n *\n *   // Access row data for validation\n *   if (ctx.row.locked) {\n *     input.disabled = true;\n *   }\n *\n *   return input;\n * };\n * ```\n *\n * @see {@link ColumnEditorSpec} for editor specification options\n */\nexport interface ColumnEditorContext<TRow = any, TValue = any> {\n  /** Underlying full row object for the active edit. */\n  row: TRow;\n  /** Current cell value (mutable only via commit). */\n  value: TValue;\n  /** Field name being edited. */\n  field: keyof TRow & string;\n  /** Column configuration reference. */\n  column: ColumnConfig<TRow>;\n  /**\n   * Stable row identifier (from `getRowId`).\n   * Empty string if no `getRowId` is configured.\n   */\n  rowId: string;\n  /** Accept the edit; triggers change tracking + rerender. */\n  commit: (newValue: TValue) => void;\n  /** Abort edit without persisting changes. */\n  cancel: () => void;\n  /**\n   * Update other fields in this row while the editor is open.\n   * Changes are committed with source `'cascade'`, triggering\n   * `cell-change` events and `onValueChange` pushes to sibling editors.\n   *\n   * Useful for editors that affect multiple fields (e.g., an address\n   * lookup that sets city + zip + state).\n   *\n   * @example\n   * ```typescript\n   * // In a cell-commit listener:\n   * grid.addEventListener('cell-commit', (e) => {\n   *   if (e.detail.field === 'quantity') {\n   *     e.detail.updateRow({ total: e.detail.row.price * e.detail.value });\n   *   }\n   * });\n   * ```\n   */\n  updateRow: (changes: Partial<TRow>) => void;\n  /**\n   * Register a callback invoked when the cell's underlying value changes\n   * while the editor is open (e.g., via `updateRow()` from another cell's commit).\n   *\n   * Built-in editors auto-update their input values. Custom/framework editors\n   * should use this to stay in sync with external mutations.\n   *\n   * @example\n   * ```typescript\n   * const editor = (ctx: ColumnEditorContext) => {\n   *   const input = document.createElement('input');\n   *   input.value = String(ctx.value);\n   *   ctx.onValueChange?.((newValue) => {\n   *     input.value = String(newValue);\n   *   });\n   *   return input;\n   * };\n   * ```\n   */\n  onValueChange?: (callback: (newValue: TValue) => void) => void;\n}\n// #endregion\n\n// #region Renderer Types\n/**\n * Context passed to custom view renderers (pure display – no commit helpers).\n *\n * Used by `viewRenderer` and `renderer` column properties to create\n * custom cell content. Return a DOM node or HTML string.\n *\n * @example\n * ```typescript\n * // Status badge renderer\n * const statusRenderer: ColumnViewRenderer = (ctx: CellRenderContext) => {\n *   const badge = document.createElement('span');\n *   badge.className = `badge badge-${ctx.value}`;\n *   badge.textContent = ctx.value;\n *   return badge;\n * };\n *\n * // Progress bar using row data\n * const progressRenderer: ColumnViewRenderer = (ctx) => {\n *   const bar = document.createElement('div');\n *   bar.className = 'progress-bar';\n *   bar.style.width = `${ctx.value}%`;\n *   bar.title = `${ctx.row.taskName}: ${ctx.value}%`;\n *   return bar;\n * };\n *\n * // Return HTML string (simpler, less performant)\n * const htmlRenderer: ColumnViewRenderer = (ctx) => {\n *   return `<strong>${ctx.value}</strong>`;\n * };\n * ```\n *\n * @see {@link ColumnViewRenderer} for the renderer function signature\n */\nexport interface CellRenderContext<TRow = any, TValue = any> {\n  /** Row object for the cell being rendered. */\n  row: TRow;\n  /** Value at field. */\n  value: TValue;\n  /** Field key. */\n  field: keyof TRow & string;\n  /** Column configuration reference. */\n  column: ColumnConfig<TRow>;\n  /**\n   * The cell DOM element being rendered into.\n   * Framework adapters can use this to cache per-cell state (e.g., React roots).\n   * @internal\n   */\n  cellEl?: HTMLElement;\n}\n\n/**\n * Custom view renderer function for cell content.\n *\n * Returns one of:\n * - `Node` - DOM element to display in the cell\n * - `string` - HTML string (parsed and inserted)\n * - `void | null` - Use default text rendering\n *\n * @example\n * ```typescript\n * // DOM element (recommended for interactivity)\n * const avatarRenderer: ColumnViewRenderer<Employee> = (ctx) => {\n *   const img = document.createElement('img');\n *   img.src = ctx.row.avatarUrl;\n *   img.alt = ctx.row.name;\n *   img.className = 'avatar';\n *   return img;\n * };\n *\n * // HTML string (simpler, good for static content)\n * const emailRenderer: ColumnViewRenderer = (ctx) => {\n *   return `<a href=\"mailto:${ctx.value}\">${ctx.value}</a>`;\n * };\n *\n * // Conditional rendering\n * const conditionalRenderer: ColumnViewRenderer = (ctx) => {\n *   if (!ctx.value) return null; // Use default\n *   return `<em>${ctx.value}</em>`;\n * };\n * ```\n *\n * @see {@link CellRenderContext} for available context properties\n */\nexport type ColumnViewRenderer<TRow = unknown, TValue = unknown> = (\n  ctx: CellRenderContext<TRow, TValue>,\n) => Node | string | void | null;\n// #endregion\n\n// #region Header Renderer Types\n/**\n * Context passed to `headerLabelRenderer` for customizing header label content.\n * The framework handles sort icons, filter buttons, resize handles, and click interactions.\n *\n * @example\n * ```typescript\n * headerLabelRenderer: (ctx) => {\n *   const span = document.createElement('span');\n *   span.innerHTML = `${ctx.value} <span class=\"required\">*</span>`;\n *   return span;\n * }\n * ```\n */\nexport interface HeaderLabelContext<TRow = unknown> {\n  /** Column configuration reference. */\n  column: ColumnConfig<TRow>;\n  /** The header text (from column.header or column.field). */\n  value: string;\n}\n\n/**\n * Context passed to `headerRenderer` for complete control over header cell content.\n * When using this, you control the header content. Resize handles are added automatically\n * for resizable columns.\n *\n * @example\n * ```typescript\n * headerRenderer: (ctx) => {\n *   const div = document.createElement('div');\n *   div.className = 'custom-header';\n *   div.innerHTML = `<span>${ctx.value}</span>`;\n *   // Optionally include sort icon\n *   const sortIcon = ctx.renderSortIcon();\n *   if (sortIcon) div.appendChild(sortIcon);\n *   return div;\n * }\n * ```\n */\nexport interface HeaderCellContext<TRow = unknown> {\n  /** Column configuration reference. */\n  column: ColumnConfig<TRow>;\n  /** The header text (from column.header or column.field). */\n  value: string;\n  /** Current sort state for this column. */\n  sortState: 'asc' | 'desc' | null;\n  /** Whether the column has an active filter. */\n  filterActive: boolean;\n  /** The header cell DOM element being rendered into. */\n  cellEl: HTMLElement;\n  /**\n   * Render the standard sort indicator icon.\n   * Returns null if column is not sortable.\n   */\n  renderSortIcon: () => HTMLElement | null;\n  /**\n   * Render the standard filter button.\n   * Returns null if FilteringPlugin is not active or column is not filterable.\n   * Note: The actual button is added by FilteringPlugin's afterRender hook.\n   */\n  renderFilterButton: () => HTMLElement | null;\n}\n\n/**\n * Header label renderer function type.\n * Customize the label while framework handles sort icons, filter buttons, resize handles.\n *\n * Use this for simple label customizations without taking over the entire header.\n * The grid automatically appends sort icons, filter buttons, and resize handles.\n *\n * @example\n * ```typescript\n * // Add required indicator\n * const requiredHeader: HeaderLabelRenderer = (ctx) => {\n *   return `${ctx.value} <span style=\"color: red;\">*</span>`;\n * };\n *\n * // Add unit suffix\n * const priceHeader: HeaderLabelRenderer = (ctx) => {\n *   const span = document.createElement('span');\n *   span.innerHTML = `${ctx.value} <small>(USD)</small>`;\n *   return span;\n * };\n *\n * // Column config usage\n * columns: [\n *   { field: 'name', headerLabelRenderer: requiredHeader },\n *   { field: 'price', headerLabelRenderer: priceHeader },\n * ]\n * ```\n *\n * @see {@link HeaderLabelContext} for context properties\n * @see {@link HeaderRenderer} for full header control\n */\nexport type HeaderLabelRenderer<TRow = unknown> = (ctx: HeaderLabelContext<TRow>) => Node | string | void | null;\n\n/**\n * Header cell renderer function type.\n * Full control over header cell content. User is responsible for all content and interactions.\n *\n * When using this, you have complete control but must manually include\n * sort icons, filter buttons, and resize handles using the helper functions.\n *\n * @example\n * ```typescript\n * // Custom header with all standard elements\n * const customHeader: HeaderRenderer = (ctx) => {\n *   const div = document.createElement('div');\n *   div.className = 'custom-header';\n *   div.innerHTML = `<span class=\"label\">${ctx.value}</span>`;\n *\n *   // Add sort icon (returns null if not sortable)\n *   const sortIcon = ctx.renderSortIcon();\n *   if (sortIcon) div.appendChild(sortIcon);\n *\n *   // Add filter button (returns null if not filterable)\n *   const filterBtn = ctx.renderFilterButton();\n *   if (filterBtn) div.appendChild(filterBtn);\n *\n *   // Resize handles are added automatically for resizable columns\n *   return div;\n * };\n *\n * // Minimal header (no sort/resize)\n * const minimalHeader: HeaderRenderer = (ctx) => {\n *   return `<div class=\"minimal\">${ctx.value}</div>`;\n * };\n *\n * // Column config usage\n * columns: [\n *   { field: 'name', headerRenderer: customHeader },\n * ]\n * ```\n *\n * @see {@link HeaderCellContext} for context properties and helper functions\n * @see {@link HeaderLabelRenderer} for simpler label-only customization\n */\nexport type HeaderRenderer<TRow = unknown> = (ctx: HeaderCellContext<TRow>) => Node | string | void | null;\n// #endregion\n\n// #region Framework Adapter Interface\n/**\n * Framework adapter interface for handling framework-specific component instantiation.\n * Allows framework libraries (Angular, React, Vue) to register handlers that convert\n * declarative light DOM elements into functional renderers/editors.\n *\n * @example\n * ```typescript\n * // In @toolbox-web/grid-angular\n * class AngularGridAdapter implements FrameworkAdapter {\n *   canHandle(element: HTMLElement): boolean {\n *     return element.tagName.startsWith('APP-');\n *   }\n *   createRenderer(element: HTMLElement): ColumnViewRenderer {\n *     return (ctx) => {\n *       // Angular-specific instantiation logic\n *       const componentRef = createComponent(...);\n *       componentRef.setInput('value', ctx.value);\n *       return componentRef.location.nativeElement;\n *     };\n *   }\n *   createEditor(element: HTMLElement): ColumnEditorSpec {\n *     return (ctx) => {\n *       // Angular-specific editor with commit/cancel\n *       const componentRef = createComponent(...);\n *       componentRef.setInput('value', ctx.value);\n *       // Subscribe to commit/cancel outputs\n *       return componentRef.location.nativeElement;\n *     };\n *   }\n * }\n *\n * // User registers adapter once in their app\n * GridElement.registerAdapter(new AngularGridAdapter(injector, appRef));\n * ```\n * @category Framework Adapters\n */\nexport interface FrameworkAdapter {\n  /**\n   * Determines if this adapter can handle the given element.\n   * Typically checks tag name, attributes, or other conventions.\n   */\n  canHandle(element: HTMLElement): boolean;\n\n  /**\n   * Creates a view renderer function from a light DOM element.\n   * The renderer receives cell context and returns DOM or string.\n   */\n  createRenderer<TRow = unknown, TValue = unknown>(element: HTMLElement): ColumnViewRenderer<TRow, TValue>;\n\n  /**\n   * Creates an editor spec from a light DOM element.\n   * The editor receives context with commit/cancel and returns DOM.\n   * Returns undefined if no editor template is registered, allowing the grid\n   * to use its default built-in editors.\n   */\n  createEditor<TRow = unknown, TValue = unknown>(element: HTMLElement): ColumnEditorSpec<TRow, TValue> | undefined;\n\n  /**\n   * Creates a tool panel renderer from a light DOM element.\n   * The renderer receives a container element and optionally returns a cleanup function.\n   */\n  createToolPanelRenderer?(element: HTMLElement): ((container: HTMLElement) => void | (() => void)) | undefined;\n\n  /**\n   * Gets type-level defaults from an application-level registry.\n   * Used by Angular's `GridTypeRegistry` and React's `GridTypeProvider`.\n   *\n   * @param type - The column type (e.g., 'date', 'currency', 'country')\n   * @returns Type defaults for renderer/editor, or undefined if not registered\n   */\n  getTypeDefault?<TRow = unknown>(type: string): TypeDefault<TRow> | undefined;\n\n  /**\n   * Called when a cell's content is about to be wiped (e.g., when exiting edit mode,\n   * scroll-recycling a row, or rebuilding a row).\n   *\n   * Framework adapters should use this to properly destroy cached views/components\n   * associated with the cell to prevent memory leaks.\n   *\n   * @param cellEl - The cell element whose content is being released\n   */\n  releaseCell?(cellEl: HTMLElement): void;\n\n  /**\n   * Unmount a specific framework container and free its resources.\n   *\n   * Called by the grid core (e.g., MasterDetailPlugin) when a container\n   * created by the adapter is about to be removed from the DOM.\n   * The adapter should destroy the associated framework instance\n   * (React root, Vue app, Angular view) and remove it from tracking arrays.\n   *\n   * @param container - The container element returned by a create* method\n   */\n  unmount?(container: HTMLElement): void;\n}\n// #endregion\n\n// #region Internal Types\n\n/**\n * Column internal properties used during light DOM parsing.\n * Stores attribute-based names before they're resolved to actual functions.\n * @internal\n */\nexport interface ColumnParsedAttributes {\n  /** Editor name from `editor` attribute (resolved later) */\n  __editorName?: string;\n  /** Renderer name from `renderer` attribute (resolved later) */\n  __rendererName?: string;\n}\n\n/**\n * Extended column config used internally.\n * Includes all internal properties needed during grid lifecycle.\n *\n * Plugin developers may need to access these when working with\n * column caching and compiled templates.\n *\n * @example\n * ```typescript\n * import type { ColumnInternal } from '@toolbox-web/grid';\n *\n * class MyPlugin extends BaseGridPlugin {\n *   afterRender(): void {\n *     // Access internal column properties\n *     const columns = this.columns as ColumnInternal[];\n *     for (const col of columns) {\n *       // Check if column was auto-sized\n *       if (col.__autoSized) {\n *         console.log(`${col.field} was auto-sized`);\n *       }\n *     }\n *   }\n * }\n * ```\n *\n * @see {@link ColumnConfig} for public column properties\n * @category Plugin Development\n * @internal\n */\nexport interface ColumnInternal<T = any> extends ColumnConfig<T>, ColumnParsedAttributes {\n  __autoSized?: boolean;\n  __userResized?: boolean;\n  __renderedWidth?: number;\n  /** Original configured width (for reset on double-click) */\n  __originalWidth?: number;\n  __viewTemplate?: HTMLElement;\n  __editorTemplate?: HTMLElement;\n  __headerTemplate?: HTMLElement;\n  __compiledView?: CompiledViewFunction<T>;\n  __compiledEditor?: (ctx: EditorExecContext<T>) => string;\n}\n\n/**\n * Row element with internal tracking properties.\n * Used during virtualization and row pooling.\n *\n * @category Plugin Development\n * @internal\n */\nexport interface RowElementInternal extends HTMLElement {\n  /** Epoch marker for row render invalidation */\n  __epoch?: number;\n  /** Reference to the row data object for change detection */\n  __rowDataRef?: unknown;\n  /** Count of cells currently in edit mode */\n  __editingCellCount?: number;\n  /** Flag indicating this is a custom-rendered row (group row, etc.) */\n  __isCustomRow?: boolean;\n}\n\n/**\n * Type-safe access to element.part API (DOMTokenList-like).\n * Used for CSS ::part styling support.\n * @internal\n */\nexport interface ElementWithPart {\n  part?: DOMTokenList;\n}\n\n/**\n * Compiled view function type with optional blocked flag.\n * The __blocked flag is set when a template contains unsafe expressions.\n *\n * @category Plugin Development\n * @internal\n */\nexport interface CompiledViewFunction<T = any> {\n  (ctx: CellContext<T>): string;\n  /** Set to true when template was blocked due to unsafe expressions */\n  __blocked?: boolean;\n}\n\n/**\n * Runtime cell context used internally for compiled template execution.\n *\n * Contains the minimal context needed to render a cell: the row data,\n * cell value, field name, and column configuration.\n *\n * @example\n * ```typescript\n * import type { CellContext, ColumnInternal } from '@toolbox-web/grid';\n *\n * // Used internally by compiled templates\n * const renderCell = (ctx: CellContext) => {\n *   return `<span title=\"${ctx.field}\">${ctx.value}</span>`;\n * };\n * ```\n *\n * @see {@link CellRenderContext} for public cell render context\n * @see {@link EditorExecContext} for editor context with commit/cancel\n * @category Plugin Development\n */\nexport interface CellContext<T = any> {\n  row: T;\n  value: unknown;\n  field: string;\n  column: ColumnInternal<T>;\n}\n\n/**\n * Internal editor execution context extending the generic cell context with commit helpers.\n *\n * Used internally by the editing system. For public editor APIs,\n * prefer using {@link ColumnEditorContext}.\n *\n * @example\n * ```typescript\n * import type { EditorExecContext } from '@toolbox-web/grid';\n *\n * // Internal editor template execution\n * const execEditor = (ctx: EditorExecContext) => {\n *   const input = document.createElement('input');\n *   input.value = String(ctx.value);\n *   input.onkeydown = (e) => {\n *     if (e.key === 'Enter') ctx.commit(input.value);\n *     if (e.key === 'Escape') ctx.cancel();\n *   };\n *   return input;\n * };\n * ```\n *\n * @see {@link ColumnEditorContext} for public editor context\n * @see {@link CellContext} for base cell context\n * @category Plugin Development\n */\nexport interface EditorExecContext<T = any> extends CellContext<T> {\n  commit: (newValue: unknown) => void;\n  cancel: () => void;\n}\n\n/**\n * Controller managing drag-based column resize lifecycle.\n *\n * Exposed internally for plugins that need to interact with resize behavior.\n *\n * @example\n * ```typescript\n * import type { ResizeController, InternalGrid } from '@toolbox-web/grid';\n *\n * class MyPlugin extends BaseGridPlugin {\n *   handleColumnAction(colIndex: number): void {\n *     const grid = this.grid as InternalGrid;\n *     const resizeCtrl = grid._resizeController;\n *\n *     // Check if resize is in progress\n *     if (resizeCtrl?.isResizing) {\n *       return; // Don't interfere\n *     }\n *\n *     // Reset column to configured width\n *     resizeCtrl?.resetColumn(colIndex);\n *   }\n * }\n * ```\n *\n * @see {@link ColumnResizeDetail} for resize event details\n * @category Plugin Development\n */\nexport interface ResizeController {\n  start: (e: MouseEvent, colIndex: number, cell: HTMLElement) => void;\n  /** Reset a column to its configured width (or auto-size if none configured). */\n  resetColumn: (colIndex: number) => void;\n  dispose: () => void;\n  /** True while a resize drag is in progress (used to suppress header click/sort). */\n  isResizing: boolean;\n}\n\n/**\n * Virtual window bookkeeping; modified in-place as scroll position changes.\n *\n * Tracks virtualization state for row rendering. The grid only renders\n * rows within the visible viewport window (start to end) plus overscan.\n *\n * @example\n * ```typescript\n * import type { VirtualState, InternalGrid } from '@toolbox-web/grid';\n *\n * class MyPlugin extends BaseGridPlugin {\n *   logVirtualWindow(): void {\n *     const grid = this.grid as InternalGrid;\n *     const vs = grid.virtualization;\n *\n *     console.log(`Row height: ${vs.rowHeight}px`);\n *     console.log(`Visible rows: ${vs.start} to ${vs.end}`);\n *     console.log(`Virtualization: ${vs.enabled ? 'on' : 'off'}`);\n *   }\n * }\n * ```\n *\n * @see {@link GridConfig.rowHeight} for configuring row height\n * @category Plugin Development\n */\nexport interface VirtualState {\n  enabled: boolean;\n  rowHeight: number;\n  /** Threshold for bypassing virtualization (renders all rows if totalRows <= bypassThreshold) */\n  bypassThreshold: number;\n  start: number;\n  end: number;\n  /** Faux scrollbar element that provides scroll events (AG Grid pattern) */\n  container: HTMLElement | null;\n  /** Rows viewport element for measuring visible area height */\n  viewportEl: HTMLElement | null;\n  /** Spacer element inside faux scrollbar for setting virtual height */\n  totalHeightEl: HTMLElement | null;\n\n  // --- Variable Row Height Support (Phase 1) ---\n\n  /**\n   * Position cache for variable row heights.\n   * Index-based array mapping row index → {offset, height, measured}.\n   * Rebuilt when row count changes (expand/collapse, filter).\n   * `null` when using uniform row heights (default).\n   */\n  positionCache: RowPositionEntry[] | null;\n\n  /**\n   * Height cache by row identity.\n   * Persists row heights across position cache rebuilds.\n   * Uses dual storage: Map for string keys (rowId, __rowCacheKey) and WeakMap for object refs.\n   */\n  heightCache: {\n    /** Heights keyed by string (synthetic rows with __rowCacheKey, or rowId-keyed rows) */\n    byKey: Map<string, number>;\n    /** Heights keyed by object reference (data rows without rowId) */\n    byRef: WeakMap<object, number>;\n  };\n\n  /** Running average of measured row heights. Used for estimating unmeasured rows. */\n  averageHeight: number;\n\n  /** Number of rows that have been measured. */\n  measuredCount: number;\n\n  /** Whether variable row height mode is active (rowHeight is a function). */\n  variableHeights: boolean;\n\n  // --- Cached Geometry (avoid forced layout reads on scroll hot path) ---\n\n  /** Cached viewport element height. Updated by ResizeObserver and force-refresh only. */\n  cachedViewportHeight: number;\n\n  /** Cached faux scrollbar element height. Updated alongside viewport height. */\n  cachedFauxHeight: number;\n\n  /** Cached scroll-area element height. Updated alongside viewport/faux heights. */\n  cachedScrollAreaHeight: number;\n\n  /** Cached reference to .tbw-scroll-area element. Set during scroll listener setup. */\n  scrollAreaEl: HTMLElement | null;\n}\n\n// RowElementInternal is now defined earlier in the file with all internal properties\n\n/**\n * Union type for input-like elements that have a `value` property.\n * Covers standard form elements and custom elements with value semantics.\n *\n * @category Plugin Development\n * @internal\n */\nexport type InputLikeElement = HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement | { value: unknown };\n// #endregion\n\n// #region Grouping & Footer Public Types\n/**\n * Group row rendering customization options.\n * Controls how group header rows are displayed in the GroupingRowsPlugin.\n *\n * @example\n * ```typescript\n * import { GroupingRowsPlugin } from '@toolbox-web/grid/all';\n *\n * new GroupingRowsPlugin({\n *   groupBy: ['department', 'team'],\n *   render: {\n *     // Group row spans all columns\n *     fullWidth: true,\n *\n *     // Custom label format\n *     formatLabel: (value, depth, key) => {\n *       if (depth === 0) return `Department: ${value}`;\n *       return `Team: ${value}`;\n *     },\n *\n *     // Show aggregates in group rows (when not fullWidth)\n *     aggregators: {\n *       salary: 'sum',\n *       age: 'avg',\n *     },\n *\n *     // Custom CSS class\n *     class: 'my-group-row',\n *   },\n * });\n * ```\n *\n * @see {@link AggregatorRef} for aggregation options\n */\nexport interface RowGroupRenderConfig {\n  /** If true, group rows span all columns (single full-width cell). Default false. */\n  fullWidth?: boolean;\n  /** Optional label formatter override. Receives raw group value + depth. */\n  formatLabel?: (value: unknown, depth: number, key: string) => string;\n  /** Optional aggregate overrides per field for group summary cells (only when not fullWidth). */\n  aggregators?: Record<string, AggregatorRef>;\n  /** Additional CSS class applied to each group row root element. */\n  class?: string;\n}\n\n/**\n * Reference to an aggregation function for footer/group summaries.\n *\n * Can be either:\n * - A built-in aggregator name: `'sum'`, `'avg'`, `'min'`, `'max'`, `'count'`\n * - A custom function that calculates the aggregate value\n *\n * @example\n * ```typescript\n * // Built-in aggregator\n * { field: 'amount', aggregator: 'sum' }\n *\n * // Custom aggregator function\n * { field: 'price', aggregator: (rows, field) => {\n *   const values = rows.map(r => r[field]).filter(v => v != null);\n *   return values.length ? Math.max(...values) : null;\n * }}\n * ```\n *\n * @see {@link RowGroupRenderConfig} for using aggregators in group rows\n */\nexport type AggregatorRef = string | ((rows: unknown[], field: string, column?: unknown) => unknown);\n\n/**\n * Result of automatic column inference from sample rows.\n *\n * When no columns are configured, the grid analyzes the first row of data\n * to automatically generate column definitions with inferred types.\n *\n * @example\n * ```typescript\n * // Automatic inference (no columns configured)\n * grid.rows = [\n *   { name: 'Alice', age: 30, active: true, hireDate: new Date() },\n * ];\n * // Grid infers:\n * // - name: type 'string'\n * // - age: type 'number'\n * // - active: type 'boolean'\n * // - hireDate: type 'date'\n *\n * // Access inferred result programmatically\n * const config = await grid.getConfig();\n * console.log(config.columns); // Inferred columns\n * ```\n *\n * @see {@link ColumnConfig} for column configuration options\n * @see {@link ColumnType} for type inference rules\n */\nexport interface InferredColumnResult<TRow = unknown> {\n  /** Generated column configurations based on data analysis */\n  columns: ColumnConfigMap<TRow>;\n  /** Map of field names to their inferred types */\n  typeMap: Record<string, ColumnType>;\n}\n\n/**\n * Column sizing mode.\n *\n * - `'fixed'` - Columns use their configured widths. Horizontal scrolling if content overflows.\n * - `'stretch'` - Columns stretch proportionally to fill available width. No horizontal scrolling.\n *\n * @example\n * ```typescript\n * // Fixed widths - good for many columns\n * grid.fitMode = 'fixed';\n *\n * // Stretch to fill - good for few columns\n * grid.fitMode = 'stretch';\n *\n * // Via gridConfig\n * grid.gridConfig = { fitMode: 'stretch' };\n * ```\n */\nexport const FitModeEnum = {\n  STRETCH: 'stretch',\n  FIXED: 'fixed',\n} as const;\nexport type FitMode = (typeof FitModeEnum)[keyof typeof FitModeEnum]; // evaluates to 'stretch' | 'fixed'\n// #endregion\n\n// #region Plugin Interface\n/**\n * Minimal plugin interface for type-checking.\n * This interface is defined here to avoid circular imports with BaseGridPlugin.\n * All plugins must satisfy this shape (BaseGridPlugin implements it).\n *\n * @example\n * ```typescript\n * // Using plugins in grid config\n * import { SelectionPlugin, FilteringPlugin } from '@toolbox-web/grid/all';\n *\n * grid.gridConfig = {\n *   plugins: [\n *     new SelectionPlugin({ mode: 'row' }),\n *     new FilteringPlugin({ debounceMs: 200 }),\n *   ],\n * };\n *\n * // Accessing plugin instance at runtime\n * const selection = grid.getPlugin(SelectionPlugin);\n * if (selection) {\n *   selection.selectAll();\n * }\n * ```\n *\n * @category Plugin Development\n */\nexport interface GridPlugin {\n  /** Unique plugin identifier */\n  readonly name: string;\n  /** Plugin version */\n  readonly version: string;\n  /** CSS styles to inject into the grid */\n  readonly styles?: string;\n}\n// #endregion\n\n// #region Grid Config\n/**\n * Grid configuration object - the **single source of truth** for grid behavior.\n *\n * Users can configure the grid via multiple input methods, all of which converge\n * into an effective `GridConfig` internally:\n *\n * **Configuration Input Methods:**\n * - `gridConfig` property - direct assignment of this object\n * - `columns` property - shorthand for `gridConfig.columns`\n * - `fitMode` property - shorthand for `gridConfig.fitMode`\n * - Light DOM `<tbw-grid-column>` - declarative columns (merged into `columns`)\n * - Light DOM `<tbw-grid-header>` - declarative shell header (merged into `shell.header`)\n *\n * **Precedence (when same property set multiple ways):**\n * Individual props (`fitMode`) > `columns` prop > Light DOM > `gridConfig`\n *\n * @example\n * ```ts\n * // Via gridConfig (recommended for complex setups)\n * grid.gridConfig = {\n *   columns: [{ field: 'name' }, { field: 'age' }],\n *   fitMode: 'stretch',\n *   plugins: [new SelectionPlugin()],\n *   shell: { header: { title: 'My Grid' } }\n * };\n *\n * // Via individual props (convenience for simple cases)\n * grid.columns = [{ field: 'name' }, { field: 'age' }];\n * grid.fitMode = 'stretch';\n * ```\n */\nexport interface GridConfig<TRow = any> {\n  /**\n   * Column definitions. Can also be set via `columns` prop or `<tbw-grid-column>` light DOM.\n   * @see {@link ColumnConfig} for column options\n   * @see {@link ColumnConfigMap}\n   */\n  columns?: ColumnConfigMap<TRow>;\n  /**\n   * Dynamic CSS class(es) for data rows.\n   * Called for each row during rendering. Return class names to add to the row element.\n   *\n   * @example\n   * ```typescript\n   * // Highlight inactive rows\n   * rowClass: (row) => row.active ? [] : ['inactive', 'dimmed']\n   *\n   * // Status-based row styling\n   * rowClass: (row) => [`priority-${row.priority}`]\n   * ```\n   */\n  rowClass?: (row: TRow) => string[];\n  /** Sizing mode for columns. Can also be set via `fitMode` prop. */\n  fitMode?: FitMode;\n\n  /**\n   * Grid-wide sorting toggle.\n   * When false, disables sorting for all columns regardless of their individual `sortable` setting.\n   * When true (default), columns with `sortable: true` can be sorted.\n   *\n   * This affects:\n   * - Header click handlers for sorting\n   * - Sort indicator visibility\n   * - Multi-sort plugin behavior (if loaded)\n   *\n   * @default true\n   *\n   * @example\n   * ```typescript\n   * // Disable all sorting\n   * gridConfig = { sortable: false };\n   *\n   * // Enable sorting (default) - individual columns still need sortable: true\n   * gridConfig = { sortable: true };\n   * ```\n   */\n  sortable?: boolean;\n\n  /**\n   * Grid-wide resizing toggle.\n   * When false, disables column resizing for all columns regardless of their individual `resizable` setting.\n   * When true (default), columns with `resizable: true` (or resizable not set, since it defaults to true) can be resized.\n   *\n   * This affects:\n   * - Resize handle visibility in header cells\n   * - Double-click to auto-size behavior\n   *\n   * @default true\n   *\n   * @example\n   * ```typescript\n   * // Disable all column resizing\n   * gridConfig = { resizable: false };\n   *\n   * // Enable resizing (default) - individual columns can opt out with resizable: false\n   * gridConfig = { resizable: true };\n   * ```\n   */\n  resizable?: boolean;\n\n  /**\n   * Row height in pixels for virtualization calculations.\n   * The virtualization system assumes uniform row heights for performance.\n   *\n   * If not specified, the grid measures the first rendered row's height,\n   * which respects the CSS variable `--tbw-row-height` set by themes.\n   *\n   * Set this explicitly when:\n   * - Row content may wrap to multiple lines (also set `--tbw-cell-white-space: normal`)\n   * - Using custom row templates with variable content\n   * - You want to override theme-defined row height\n   * - Rows have different heights based on content (use function form)\n   *\n   * **Variable Row Heights**: When a function is provided, the grid enables variable height\n   * virtualization. Heights are measured on first render and cached by row identity.\n   *\n   * @default Auto-measured from first row (respects --tbw-row-height CSS variable)\n   *\n   * @example\n   * ```ts\n   * // Fixed height for all rows\n   * gridConfig = { rowHeight: 56 };\n   *\n   * // Variable height based on content\n   * gridConfig = {\n   *   rowHeight: (row, index) => row.hasDetails ? 80 : 40,\n   * };\n   *\n   * // Return undefined to trigger DOM auto-measurement\n   * gridConfig = {\n   *   rowHeight: (row) => row.isExpanded ? undefined : 40,\n   * };\n   * ```\n   */\n  rowHeight?: number | ((row: TRow, index: number) => number | undefined);\n  /**\n   * Array of plugin instances.\n   * Each plugin is instantiated with its configuration and attached to this grid.\n   *\n   * @example\n   * ```ts\n   * plugins: [\n   *   new SelectionPlugin({ mode: 'range' }),\n   *   new MultiSortPlugin(),\n   *   new FilteringPlugin({ debounceMs: 150 }),\n   * ]\n   * ```\n   */\n  plugins?: GridPlugin[];\n\n  /**\n   * Saved column state to restore on initialization.\n   * Includes order, width, visibility, sort, and plugin-contributed state.\n   */\n  columnState?: GridColumnState;\n\n  /**\n   * Shell configuration for header bar and tool panels.\n   * When configured, adds an optional wrapper with title, toolbar, and collapsible side panels.\n   */\n  shell?: ShellConfig;\n\n  /**\n   * Grid-wide icon configuration.\n   * Provides consistent icons across all plugins (tree, grouping, sorting, etc.).\n   * Plugins will use these by default but can override with their own config.\n   */\n  icons?: GridIcons;\n\n  /**\n   * Grid-wide animation configuration.\n   * Controls animations for expand/collapse, reordering, and other visual transitions.\n   * Individual plugins can override these defaults in their own config.\n   */\n  animation?: AnimationConfig;\n\n  /**\n   * Custom sort handler for full control over sorting behavior.\n   *\n   * When provided, this handler is called instead of the built-in sorting logic.\n   * Enables custom sorting algorithms, server-side sorting, or plugin-specific sorting.\n   *\n   * The handler receives:\n   * - `rows`: Current row array to sort\n   * - `sortState`: Sort field and direction (1 = asc, -1 = desc)\n   * - `columns`: Column configurations (for accessing sortComparator)\n   *\n   * Return the sorted array (sync) or a Promise that resolves to the sorted array (async).\n   * For server-side sorting, return a Promise that resolves when data is fetched.\n   *\n   * @example\n   * ```ts\n   * // Custom stable sort\n   * sortHandler: (rows, state, cols) => {\n   *   return stableSort(rows, (a, b) => compare(a[state.field], b[state.field]) * state.direction);\n   * }\n   *\n   * // Server-side sorting\n   * sortHandler: async (rows, state) => {\n   *   const response = await fetch(`/api/data?sort=${state.field}&dir=${state.direction}`);\n   *   return response.json();\n   * }\n   * ```\n   */\n  sortHandler?: SortHandler<TRow>;\n\n  /**\n   * Function to extract a unique identifier from a row.\n   * Used by `updateRow()`, `getRow()`, and ID-based tracking.\n   *\n   * If not provided, falls back to `row.id` or `row._id` if present.\n   * Rows without IDs are silently skipped during map building.\n   * Only throws when explicitly calling `getRowId()` or `updateRow()` on a row without an ID.\n   *\n   * @example\n   * ```ts\n   * // Simple field\n   * getRowId: (row) => row.id\n   *\n   * // Composite key\n   * getRowId: (row) => `${row.voyageId}-${row.legNumber}`\n   *\n   * // UUID field\n   * getRowId: (row) => row.uuid\n   * ```\n   */\n  getRowId?: (row: TRow) => string;\n\n  /**\n   * Type-level renderer and editor defaults.\n   *\n   * Keys can be:\n   * - Built-in types: `'string'`, `'number'`, `'date'`, `'boolean'`, `'select'`\n   * - Custom types: `'currency'`, `'country'`, `'status'`, etc.\n   *\n   * Resolution order (highest priority first):\n   * 1. Column-level (`column.renderer` / `column.editor`)\n   * 2. Grid-level (`gridConfig.typeDefaults[column.type]`)\n   * 3. App-level (Angular `GridTypeRegistry`, React `GridTypeProvider`)\n   * 4. Built-in (checkbox for boolean, select for select, etc.)\n   * 5. Fallback (plain text / text input)\n   *\n   * @example\n   * ```typescript\n   * typeDefaults: {\n   *   date: { editor: myDatePickerEditor },\n   *   country: {\n   *     renderer: (ctx) => {\n   *       const span = document.createElement('span');\n   *       span.innerHTML = `<img src=\"/flags/${ctx.value}.svg\" /> ${ctx.value}`;\n   *       return span;\n   *     },\n   *     editor: (ctx) => createCountrySelect(ctx)\n   *   }\n   * }\n   * ```\n   */\n  typeDefaults?: Record<string, TypeDefault<TRow>>;\n\n  // #region Accessibility\n\n  /**\n   * Accessible label for the grid.\n   * Sets `aria-label` on the grid's internal table element for screen readers.\n   *\n   * If not provided and `shell.header.title` is set, the title is used automatically.\n   *\n   * @example\n   * ```ts\n   * gridConfig = { gridAriaLabel: 'Employee data' };\n   * ```\n   */\n  gridAriaLabel?: string;\n\n  /**\n   * ID of an element that describes the grid.\n   * Sets `aria-describedby` on the grid's internal table element.\n   *\n   * @example\n   * ```html\n   * <p id=\"grid-desc\">This table shows all active employees.</p>\n   * <tbw-grid></tbw-grid>\n   * ```\n   * ```ts\n   * gridConfig = { gridAriaDescribedBy: 'grid-desc' };\n   * ```\n   */\n  gridAriaDescribedBy?: string;\n\n  // #endregion\n\n  // #region Loading\n\n  /**\n   * Custom renderer for the loading overlay.\n   *\n   * When provided, replaces the default spinner with custom content.\n   * Receives a context object with the current loading size.\n   *\n   * @example\n   * ```typescript\n   * // Simple text loading indicator\n   * loadingRenderer: () => {\n   *   const el = document.createElement('div');\n   *   el.textContent = 'Loading...';\n   *   return el;\n   * }\n   *\n   * // Custom spinner component\n   * loadingRenderer: (ctx) => {\n   *   const spinner = document.createElement('my-spinner');\n   *   spinner.size = ctx.size === 'large' ? 48 : 24;\n   *   return spinner;\n   * }\n   * ```\n   */\n  loadingRenderer?: LoadingRenderer;\n\n  // #endregion\n}\n// #endregion\n\n// #region Animation\n\n/**\n * Sort state passed to custom sort handlers.\n * Represents the current sorting configuration for a column.\n *\n * @example\n * ```typescript\n * // In a custom sort handler\n * const sortHandler: SortHandler = (rows, sortState, columns) => {\n *   const { field, direction } = sortState;\n *   console.log(`Sorting by ${field} ${direction === 1 ? 'ASC' : 'DESC'}`);\n *\n *   return [...rows].sort((a, b) => {\n *     const aVal = a[field];\n *     const bVal = b[field];\n *     return (aVal < bVal ? -1 : aVal > bVal ? 1 : 0) * direction;\n *   });\n * };\n * ```\n *\n * @see {@link SortHandler} for custom sort handler signature\n * @see {@link SortChangeDetail} for sort change events\n */\nexport interface SortState {\n  /** Field to sort by */\n  field: string;\n  /** Sort direction: 1 = ascending, -1 = descending */\n  direction: 1 | -1;\n}\n\n/**\n * Custom sort handler function signature.\n *\n * Enables full control over sorting behavior including server-side sorting,\n * custom algorithms, or multi-column sorting.\n *\n * @param rows - Current row array to sort\n * @param sortState - Sort field and direction\n * @param columns - Column configurations (for accessing sortComparator)\n * @returns Sorted array (sync) or Promise resolving to sorted array (async)\n *\n * @example\n * ```typescript\n * // Custom client-side sort with locale awareness\n * const localeSortHandler: SortHandler<Employee> = (rows, state, cols) => {\n *   const col = cols.find(c => c.field === state.field);\n *   return [...rows].sort((a, b) => {\n *     const aVal = String(a[state.field] ?? '');\n *     const bVal = String(b[state.field] ?? '');\n *     return aVal.localeCompare(bVal) * state.direction;\n *   });\n * };\n *\n * // Server-side sorting\n * const serverSortHandler: SortHandler<Employee> = async (rows, state) => {\n *   const response = await fetch(\n *     `/api/employees?sortBy=${state.field}&dir=${state.direction}`\n *   );\n *   return response.json();\n * };\n *\n * grid.gridConfig = {\n *   sortHandler: localeSortHandler,\n * };\n * ```\n *\n * @see {@link SortState} for the sort state object\n * @see {@link GridConfig.sortHandler} for configuring the handler\n * @see {@link BaseColumnConfig.sortComparator} for column-level comparators\n */\nexport type SortHandler<TRow = any> = (\n  rows: TRow[],\n  sortState: SortState,\n  columns: ColumnConfig<TRow>[],\n) => TRow[] | Promise<TRow[]>;\n\n// #region Loading\n\n/**\n * Loading indicator size variant.\n *\n * - `'large'`: 48x48px max - used for grid-level loading overlay (`grid.loading = true`)\n * - `'small'`: Follows row height - used for row/cell loading states\n *\n * @example\n * ```typescript\n * // Custom loading renderer adapting to size\n * const myLoader: LoadingRenderer = (ctx) => {\n *   if (ctx.size === 'large') {\n *     // Full overlay spinner\n *     return '<div class=\"spinner-lg\"></div>';\n *   }\n *   // Inline row/cell spinner\n *   return '<span class=\"spinner-sm\"></span>';\n * };\n * ```\n *\n * @see {@link LoadingRenderer} for custom loading renderer\n * @see {@link LoadingContext} for context passed to renderers\n */\nexport type LoadingSize = 'large' | 'small';\n\n/**\n * Context passed to custom loading renderers.\n *\n * Provides information about the loading indicator being rendered,\n * allowing the renderer to adapt its appearance based on the size variant.\n *\n * @example\n * ```typescript\n * const myLoadingRenderer: LoadingRenderer = (ctx: LoadingContext) => {\n *   if (ctx.size === 'large') {\n *     // Full-size spinner for grid-level loading\n *     return '<div class=\"large-spinner\"></div>';\n *   } else {\n *     // Compact spinner for row/cell loading\n *     return '<div class=\"small-spinner\"></div>';\n *   }\n * };\n * ```\n *\n * @see {@link LoadingRenderer} for the renderer function signature\n * @see {@link LoadingSize} for available size variants\n */\nexport interface LoadingContext {\n  /** The size variant being rendered: 'large' for grid-level, 'small' for row/cell */\n  size: LoadingSize;\n}\n\n/**\n * Custom loading renderer function.\n * Returns an element or HTML string to display as the loading indicator.\n *\n * Used with the `loadingRenderer` property in {@link GridConfig} to replace\n * the default spinner with custom content.\n *\n * @param context - Context containing size information\n * @returns HTMLElement or HTML string\n *\n * @example\n * ```typescript\n * // Simple text loading indicator\n * const textLoader: LoadingRenderer = () => {\n *   const el = document.createElement('div');\n *   el.textContent = 'Loading...';\n *   return el;\n * };\n *\n * // Custom spinner with size awareness\n * const customSpinner: LoadingRenderer = (ctx) => {\n *   const spinner = document.createElement('my-spinner');\n *   spinner.size = ctx.size === 'large' ? 48 : 24;\n *   return spinner;\n * };\n *\n * // Material Design-style progress bar\n * const progressBar: LoadingRenderer = () => {\n *   const container = document.createElement('div');\n *   container.className = 'progress-bar-container';\n *   container.innerHTML = '<div class=\"progress-bar\"></div>';\n *   return container;\n * };\n *\n * grid.gridConfig = {\n *   loadingRenderer: customSpinner,\n * };\n * ```\n *\n * @see {@link LoadingContext} for the context object passed to the renderer\n * @see {@link LoadingSize} for size variants ('large' | 'small')\n */\nexport type LoadingRenderer = (context: LoadingContext) => HTMLElement | string;\n\n// #endregion\n\n// #region Data Update Management\n\n/**\n * Indicates the origin of a data change.\n * Used to prevent infinite loops in cascade update handlers.\n *\n * - `'user'`: Direct user interaction via EditingPlugin (typing, selecting)\n * - `'cascade'`: Triggered by `updateRow()` in an event handler\n * - `'api'`: External programmatic update via `grid.updateRow()`\n *\n * @example\n * ```typescript\n * grid.addEventListener('cell-change', (e) => {\n *   const { source, field, newValue } = e.detail;\n *\n *   // Only cascade updates for user edits\n *   if (source === 'user' && field === 'price') {\n *     // Update calculated field (marked as 'cascade')\n *     grid.updateRow(e.detail.rowId, {\n *       total: newValue * e.detail.row.quantity,\n *     });\n *   }\n *\n *   // Ignore cascade updates to prevent infinite loops\n *   if (source === 'cascade') return;\n * });\n * ```\n *\n * @see {@link CellChangeDetail} for the event detail containing source\n * @category Data Management\n */\nexport type UpdateSource = 'user' | 'cascade' | 'api';\n\n/**\n * Detail for cell-change event (emitted by core after mutation).\n * This is an informational event that fires for ALL data mutations.\n *\n * Use this event for:\n * - Logging/auditing changes\n * - Cascading updates (updating other fields based on a change)\n * - Syncing changes to external state\n *\n * @example\n * ```typescript\n * grid.addEventListener('cell-change', (e: CustomEvent<CellChangeDetail>) => {\n *   const { row, rowId, field, oldValue, newValue, source } = e.detail;\n *\n *   console.log(`${field} changed from ${oldValue} to ${newValue}`);\n *   console.log(`Change source: ${source}`);\n *\n *   // Cascade: update total when price changes\n *   if (source === 'user' && field === 'price') {\n *     grid.updateRow(rowId, { total: newValue * row.quantity });\n *   }\n * });\n * ```\n *\n * @see {@link UpdateSource} for understanding change origins\n * @see {@link CellCommitDetail} for the commit event (editing lifecycle)\n * @category Events\n */\nexport interface CellChangeDetail<TRow = unknown> {\n  /** The row object (after mutation) */\n  row: TRow;\n  /** Stable row identifier */\n  rowId: string;\n  /** Current index in rows array */\n  rowIndex: number;\n  /** Field that changed */\n  field: string;\n  /** Value before change */\n  oldValue: unknown;\n  /** Value after change */\n  newValue: unknown;\n  /** All changes passed to updateRow/updateRows (for context) */\n  changes: Partial<TRow>;\n  /** Origin of this change */\n  source: UpdateSource;\n}\n\n/**\n * Batch update specification for updateRows().\n *\n * Used when you need to update multiple rows at once efficiently.\n * The grid will batch all updates and trigger a single re-render.\n *\n * @example\n * ```typescript\n * // Update multiple rows in a single batch\n * const updates: RowUpdate<Employee>[] = [\n *   { id: 'emp-1', changes: { status: 'active', updatedAt: new Date() } },\n *   { id: 'emp-2', changes: { status: 'inactive' } },\n *   { id: 'emp-3', changes: { salary: 75000 } },\n * ];\n *\n * grid.updateRows(updates);\n * ```\n *\n * @see {@link CellChangeDetail} for individual change events\n * @see {@link GridConfig.getRowId} for row identification\n * @category Data Management\n */\nexport interface RowUpdate<TRow = unknown> {\n  /** Row identifier (from getRowId) */\n  id: string;\n  /** Fields to update */\n  changes: Partial<TRow>;\n}\n\n// #endregion\n\n/**\n * Animation behavior mode.\n * - `true` or `'on'`: Animations always enabled\n * - `false` or `'off'`: Animations always disabled\n * - `'reduced-motion'`: Respects `prefers-reduced-motion` media query (default)\n *\n * @example\n * ```typescript\n * // Force animations on (ignore system preference)\n * grid.gridConfig = { animation: { mode: 'on' } };\n *\n * // Disable all animations\n * grid.gridConfig = { animation: { mode: false } };\n *\n * // Respect user's accessibility settings (default)\n * grid.gridConfig = { animation: { mode: 'reduced-motion' } };\n * ```\n *\n * @see {@link AnimationConfig} for full animation configuration\n */\nexport type AnimationMode = boolean | 'on' | 'off' | 'reduced-motion';\n\n/**\n * Animation style for visual transitions.\n * - `'slide'`: Slide/transform animation (e.g., expand down, slide left/right)\n * - `'fade'`: Opacity fade animation\n * - `'flip'`: FLIP technique for position changes (First, Last, Invert, Play)\n * - `false`: No animation for this specific feature\n *\n * @example\n * ```typescript\n * // Plugin-specific animation styles\n * new TreePlugin({\n *   expandAnimation: 'slide', // Slide children down when expanding\n * });\n *\n * new ReorderPlugin({\n *   animation: 'flip', // FLIP animation for column reordering\n * });\n * ```\n *\n * @see {@link AnimationConfig} for grid-wide animation settings\n * @see {@link ExpandCollapseAnimation} for expand/collapse-specific styles\n */\nexport type AnimationStyle = 'slide' | 'fade' | 'flip' | false;\n\n/**\n * Animation style for expand/collapse operations.\n * Subset of AnimationStyle - excludes 'flip' which is for position changes.\n * - `'slide'`: Slide down/up animation for expanding/collapsing content\n * - `'fade'`: Fade in/out animation\n * - `false`: No animation\n *\n * @example\n * ```typescript\n * // Tree rows slide down when expanding\n * new TreePlugin({ expandAnimation: 'slide' });\n *\n * // Row groups fade in/out\n * new GroupingRowsPlugin({ expandAnimation: 'fade' });\n *\n * // Master-detail panels with no animation\n * new MasterDetailPlugin({ expandAnimation: false });\n * ```\n *\n * @see {@link AnimationStyle} for all animation styles\n * @see {@link AnimationConfig} for grid-wide settings\n */\nexport type ExpandCollapseAnimation = 'slide' | 'fade' | false;\n\n/**\n * Type of row animation.\n * - `'change'`: Flash highlight when row data changes (e.g., after cell edit)\n * - `'insert'`: Slide-in animation for newly added rows\n * - `'remove'`: Fade-out animation for rows being removed\n *\n * @example\n * ```typescript\n * // Internal usage - row animation is triggered automatically:\n * // - 'change' after cell-commit event\n * // - 'insert' when rows are added to the grid\n * // - 'remove' when rows are deleted\n *\n * // The animation respects AnimationConfig.mode\n * grid.gridConfig = {\n *   animation: { mode: 'on', duration: 300 },\n * };\n * ```\n *\n * @see {@link AnimationConfig} for animation configuration\n */\nexport type RowAnimationType = 'change' | 'insert' | 'remove';\n\n/**\n * Grid-wide animation configuration.\n * Controls global animation behavior - individual plugins define their own animation styles.\n * Duration and easing values set corresponding CSS variables on the grid element.\n *\n * @example\n * ```typescript\n * // Enable animations regardless of system preferences\n * grid.gridConfig = {\n *   animation: {\n *     mode: 'on',\n *     duration: 300,\n *     easing: 'cubic-bezier(0.4, 0, 0.2, 1)',\n *   },\n * };\n *\n * // Disable all animations\n * grid.gridConfig = {\n *   animation: { mode: 'off' },\n * };\n *\n * // Respect user's reduced-motion preference (default)\n * grid.gridConfig = {\n *   animation: { mode: 'reduced-motion' },\n * };\n * ```\n *\n * @see {@link AnimationMode} for mode options\n */\nexport interface AnimationConfig {\n  /**\n   * Global animation mode.\n   * @default 'reduced-motion'\n   */\n  mode?: AnimationMode;\n\n  /**\n   * Default animation duration in milliseconds.\n   * Sets `--tbw-animation-duration` CSS variable.\n   * @default 200\n   */\n  duration?: number;\n\n  /**\n   * Default easing function.\n   * Sets `--tbw-animation-easing` CSS variable.\n   * @default 'ease-out'\n   */\n  easing?: string;\n}\n\n/** Default animation configuration */\nexport const DEFAULT_ANIMATION_CONFIG: Required<Omit<AnimationConfig, 'sort'>> = {\n  mode: 'reduced-motion',\n  duration: 200,\n  easing: 'ease-out',\n};\n\n// #endregion\n\n// #region Grid Icons\n\n/** Icon value - can be a string (text/HTML) or HTMLElement */\nexport type IconValue = string | HTMLElement;\n\n/**\n * Grid-wide icon configuration.\n * All icons are optional - sensible defaults are used when not specified.\n *\n * Icons can be text (including emoji), HTML strings (for SVG), or HTMLElement instances.\n *\n * @example\n * ```typescript\n * grid.gridConfig = {\n *   icons: {\n *     // Emoji icons\n *     expand: '➕',\n *     collapse: '➖',\n *\n *     // Custom SVG icon\n *     sortAsc: '<svg viewBox=\"0 0 16 16\"><path d=\"M8 4l4 8H4z\"/></svg>',\n *\n *     // Font icon class (wrap in span)\n *     filter: '<span class=\"icon icon-filter\"></span>',\n *   },\n * };\n * ```\n *\n * @see {@link IconValue} for allowed icon formats\n */\nexport interface GridIcons {\n  /** Expand icon for collapsed items (trees, groups, details). Default: '▶' */\n  expand?: IconValue;\n  /** Collapse icon for expanded items (trees, groups, details). Default: '▼' */\n  collapse?: IconValue;\n  /** Sort ascending indicator. Default: '▲' */\n  sortAsc?: IconValue;\n  /** Sort descending indicator. Default: '▼' */\n  sortDesc?: IconValue;\n  /** Sort neutral/unsorted indicator. Default: '⇅' */\n  sortNone?: IconValue;\n  /** Submenu arrow for context menus. Default: '▶' */\n  submenuArrow?: IconValue;\n  /** Drag handle icon for reordering. Default: '⋮⋮' */\n  dragHandle?: IconValue;\n  /** Tool panel toggle icon in toolbar. Default: '☰' */\n  toolPanel?: IconValue;\n  /** Filter icon in column headers. Default: SVG funnel icon */\n  filter?: IconValue;\n  /** Filter icon when filter is active. Default: same as filter with accent color */\n  filterActive?: IconValue;\n  /** Print icon for print button. Default: '🖨️' */\n  print?: IconValue;\n}\n\n/** Default filter icon SVG */\nconst DEFAULT_FILTER_ICON =\n  '<svg viewBox=\"0 0 16 16\" width=\"12\" height=\"12\"><path fill=\"currentColor\" d=\"M6 10.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z\"/></svg>';\n\n/** Default icons used when not overridden */\nexport const DEFAULT_GRID_ICONS: Required<GridIcons> = {\n  expand: '▶',\n  collapse: '▼',\n  sortAsc: '▲',\n  sortDesc: '▼',\n  sortNone: '⇅',\n  submenuArrow: '▶',\n  dragHandle: '⋮⋮',\n  toolPanel: '☰',\n  filter: DEFAULT_FILTER_ICON,\n  filterActive: DEFAULT_FILTER_ICON,\n  print: '🖨️',\n};\n// #endregion\n\n// #region Shell Configuration\n\n/**\n * Shell configuration for the grid's optional header bar and tool panels.\n *\n * The shell provides a wrapper around the grid with:\n * - Header bar with title, toolbar buttons, and custom content\n * - Collapsible side panel for filters, column visibility, settings, etc.\n *\n * @example\n * ```typescript\n * grid.gridConfig = {\n *   shell: {\n *     header: {\n *       title: 'Employee Directory',\n *     },\n *     toolPanel: {\n *       position: 'right',\n *       defaultOpen: 'columns', // Open by default\n *     },\n *   },\n *   plugins: [new VisibilityPlugin()], // Adds \"Columns\" panel\n * };\n *\n * // Register custom tool panels\n * grid.registerToolPanel({\n *   id: 'filters',\n *   title: 'Filters',\n *   icon: '🔍',\n *   render: (container) => {\n *     container.innerHTML = '<div>Filter controls...</div>';\n *   },\n * });\n * ```\n *\n * @see {@link ShellHeaderConfig} for header options\n * @see {@link ToolPanelConfig} for tool panel options\n */\nexport interface ShellConfig {\n  /** Shell header bar configuration */\n  header?: ShellHeaderConfig;\n  /** Tool panel configuration */\n  toolPanel?: ToolPanelConfig;\n  /**\n   * Registered tool panels (from plugins, API, or Light DOM).\n   * These are the actual panel definitions that can be opened.\n   * @internal Set by ConfigManager during merge\n   */\n  toolPanels?: ToolPanelDefinition[];\n  /**\n   * Registered header content sections (from plugins or API).\n   * Content rendered in the center of the shell header.\n   * @internal Set by ConfigManager during merge\n   */\n  headerContents?: HeaderContentDefinition[];\n}\n\n/**\n * Shell header bar configuration\n */\nexport interface ShellHeaderConfig {\n  /** Grid title displayed on the left (optional) */\n  title?: string;\n  /** Custom toolbar content (rendered before tool panel toggle) */\n  toolbarContents?: ToolbarContentDefinition[];\n  /**\n   * Light DOM header content elements (parsed from <tbw-grid-header> children).\n   * @internal Set by ConfigManager during merge\n   */\n  lightDomContent?: HTMLElement[];\n  /**\n   * Whether a tool buttons container was found in light DOM.\n   * @internal Set by ConfigManager during merge\n   */\n  hasToolButtonsContainer?: boolean;\n}\n\n/**\n * Tool panel configuration\n */\nexport interface ToolPanelConfig {\n  /** Panel position: 'left' | 'right' (default: 'right') */\n  position?: 'left' | 'right';\n  /** Default panel width in pixels (default: 280) */\n  width?: number;\n  /** Panel ID to open by default on load */\n  defaultOpen?: string;\n  /** Whether to persist open/closed state (requires Column State Events) */\n  persistState?: boolean;\n  /**\n   * Close the tool panel when clicking outside of it.\n   * When `true`, clicking anywhere outside the tool panel (but inside the grid)\n   * will close the panel automatically.\n   * @default false\n   */\n  closeOnClickOutside?: boolean;\n}\n\n/**\n * Toolbar content definition for the shell header toolbar area.\n * Register via `registerToolbarContent()` or use light DOM `<tbw-grid-tool-buttons>`.\n *\n * @example\n * ```typescript\n * grid.registerToolbarContent({\n *   id: 'my-toolbar',\n *   order: 10,\n *   render: (container) => {\n *     const btn = document.createElement('button');\n *     btn.textContent = 'Refresh';\n *     btn.onclick = () => console.log('clicked');\n *     container.appendChild(btn);\n *     return () => btn.remove();\n *   },\n * });\n * ```\n */\nexport interface ToolbarContentDefinition {\n  /** Unique content ID */\n  id: string;\n  /** Content factory - called once when shell header renders */\n  render: (container: HTMLElement) => void | (() => void);\n  /** Called when content is removed (for cleanup) */\n  onDestroy?: () => void;\n  /** Order priority (lower = first, default: 100) */\n  order?: number;\n}\n\n/**\n * Tool panel definition registered by plugins or consumers.\n *\n * Register via `grid.registerToolPanel()` to add panels to the sidebar.\n * Panels appear as collapsible sections with icons and titles.\n *\n * @example\n * ```typescript\n * grid.registerToolPanel({\n *   id: 'filters',\n *   title: 'Filters',\n *   icon: '🔍',\n *   tooltip: 'Filter grid data',\n *   order: 10, // Lower = appears first\n *   render: (container) => {\n *     container.innerHTML = `\n *       <div class=\"filter-panel\">\n *         <input type=\"text\" placeholder=\"Search...\" />\n *       </div>\n *     `;\n *     // Return cleanup function\n *     return () => container.innerHTML = '';\n *   },\n *   onClose: () => {\n *     console.log('Filter panel closed');\n *   },\n * });\n * ```\n *\n * @see {@link ShellConfig} for shell configuration\n */\nexport interface ToolPanelDefinition {\n  /** Unique panel ID */\n  id: string;\n  /** Panel title shown in accordion header */\n  title: string;\n  /** Icon for accordion section header (optional, emoji or SVG) */\n  icon?: string;\n  /** Tooltip for accordion section header */\n  tooltip?: string;\n  /** Panel content factory - called when panel section opens */\n  render: (container: HTMLElement) => void | (() => void);\n  /** Called when panel closes (for cleanup) */\n  onClose?: () => void;\n  /** Panel order priority (lower = first, default: 100) */\n  order?: number;\n}\n\n/**\n * Header content definition for plugins contributing to shell header center section.\n *\n * Register via `grid.registerHeaderContent()` to add content between\n * the title and toolbar buttons.\n *\n * @example\n * ```typescript\n * grid.registerHeaderContent({\n *   id: 'row-count',\n *   order: 10,\n *   render: (container) => {\n *     const span = document.createElement('span');\n *     span.className = 'row-count';\n *     span.textContent = `${grid.rows.length} rows`;\n *     container.appendChild(span);\n *\n *     // Update on data changes\n *     const update = () => span.textContent = `${grid.rows.length} rows`;\n *     grid.addEventListener('data-change', update);\n *\n *     return () => {\n *       grid.removeEventListener('data-change', update);\n *     };\n *   },\n * });\n * ```\n *\n * @see {@link ShellConfig} for shell configuration\n */\nexport interface HeaderContentDefinition {\n  /** Unique content ID */\n  id: string;\n  /** Content factory - called once when shell header renders */\n  render: (container: HTMLElement) => void | (() => void);\n  /** Called when content is removed (for cleanup) */\n  onDestroy?: () => void;\n  /** Order priority (lower = first, default: 100) */\n  order?: number;\n}\n// #endregion\n\n// #region Column State (Persistence)\n\n/**\n * State for a single column. Captures user-driven changes at runtime.\n * Plugins can extend this interface via module augmentation to add their own state.\n *\n * Used with `grid.getColumnState()` and `grid.columnState` for persisting\n * user customizations (column widths, order, visibility, sort).\n *\n * @example\n * ```typescript\n * // Save column state to localStorage\n * const state = grid.getColumnState();\n * localStorage.setItem('gridState', JSON.stringify(state));\n *\n * // Restore on page load\n * const saved = localStorage.getItem('gridState');\n * if (saved) {\n *   grid.columnState = JSON.parse(saved);\n * }\n *\n * // Example column state structure\n * const state: GridColumnState = {\n *   columns: [\n *     { field: 'name', order: 0, width: 200, hidden: false },\n *     { field: 'email', order: 1, width: 300, hidden: false },\n *     { field: 'phone', order: 2, hidden: true }, // Hidden column\n *   ],\n *   sort: { field: 'name', direction: 1 },\n * };\n * ```\n *\n * @example\n * ```typescript\n * // Plugin augmentation example (in filtering plugin)\n * declare module '@toolbox-web/grid' {\n *   interface ColumnState {\n *     filter?: FilterValue;\n *   }\n * }\n * ```\n *\n * @see {@link GridColumnState} for the full state object\n */\nexport interface ColumnState {\n  /** Column field identifier */\n  field: string;\n  /** Position index after reordering (0-based) */\n  order: number;\n  /** Width in pixels (undefined = use default) */\n  width?: number;\n  /** Visibility state */\n  visible: boolean;\n  /** Sort state (undefined = not sorted). */\n  sort?: ColumnSortState;\n}\n\n/**\n * Sort state for a column.\n * Used within {@link ColumnState} to track sort direction and priority.\n *\n * @see {@link ColumnState} for column state persistence\n * @see {@link SortChangeDetail} for sort change events\n */\nexport interface ColumnSortState {\n  /** Sort direction */\n  direction: 'asc' | 'desc';\n  /** Priority for multi-sort (0 = primary, 1 = secondary, etc.) */\n  priority: number;\n}\n\n/**\n * Complete grid column state for persistence.\n * Contains state for all columns, including plugin-contributed properties.\n *\n * @example\n * ```typescript\n * // Save state\n * const state = grid.getColumnState();\n * localStorage.setItem('grid-state', JSON.stringify(state));\n *\n * // Restore state\n * grid.columnState = JSON.parse(localStorage.getItem('grid-state'));\n * ```\n *\n * @see {@link ColumnState} for individual column state\n * @see {@link PublicGrid.getColumnState} for retrieving state\n */\nexport interface GridColumnState {\n  /** Array of column states. */\n  columns: ColumnState[];\n}\n// #endregion\n\n// #region Public Event Detail Interfaces\n/**\n * Detail for a cell click event.\n * Provides full context about the clicked cell including row data.\n *\n * @example\n * ```typescript\n * grid.addEventListener('cell-click', (e: CustomEvent<CellClickDetail>) => {\n *   const { row, field, value, rowIndex, colIndex } = e.detail;\n *   console.log(`Clicked ${field} = ${value} in row ${rowIndex}`);\\n *\n *   // Access the full row data\n *   if (row.status === 'pending') {\n *     showApprovalDialog(row);\n *   }\n * });\n * ```\n *\n * @category Events\n */\nexport interface CellClickDetail<TRow = unknown> {\n  /** Zero-based row index of the clicked cell. */\n  rowIndex: number;\n  /** Zero-based column index of the clicked cell. */\n  colIndex: number;\n  /** Column configuration object for the clicked cell. */\n  column: ColumnConfig<TRow>;\n  /** Field name of the clicked column. */\n  field: string;\n  /** Cell value at the clicked position. */\n  value: unknown;\n  /** Full row data object. */\n  row: TRow;\n  /** The clicked cell element. */\n  cellEl: HTMLElement;\n  /** The original mouse event. */\n  originalEvent: MouseEvent;\n}\n\n/**\n * Detail for a row click event.\n * Provides context about the clicked row.\n *\n * @example\n * ```typescript\n * grid.addEventListener('row-click', (e: CustomEvent<RowClickDetail>) => {\n *   const { row, rowIndex, rowEl } = e.detail;\n *   console.log(`Clicked row ${rowIndex}: ${row.name}`);\n *\n *   // Highlight the row\n *   rowEl.classList.add('selected');\n *\n *   // Open detail panel\n *   showDetailPanel(row);\n * });\n * ```\n *\n * @category Events\n */\nexport interface RowClickDetail<TRow = unknown> {\n  /** Zero-based row index of the clicked row. */\n  rowIndex: number;\n  /** Full row data object. */\n  row: TRow;\n  /** The clicked row element. */\n  rowEl: HTMLElement;\n  /** The original mouse event. */\n  originalEvent: MouseEvent;\n}\n\n/**\n * Detail for a sort change (direction 0 indicates cleared sort).\n *\n * @example\n * ```typescript\n * grid.addEventListener('sort-change', (e: CustomEvent<SortChangeDetail>) => {\n *   const { field, direction } = e.detail;\n *\n *   if (direction === 0) {\n *     console.log(`Sort cleared on ${field}`);\n *   } else {\n *     const dir = direction === 1 ? 'ascending' : 'descending';\n *     console.log(`Sorted by ${field} ${dir}`);\n *   }\n *\n *   // Fetch sorted data from server\n *   fetchData({ sortBy: field, sortDir: direction });\n * });\n * ```\n *\n * @see {@link SortState} for the sort state object\n * @see {@link SortHandler} for custom sort handlers\n * @category Events\n */\nexport interface SortChangeDetail {\n  /** Sorted field key. */\n  field: string;\n  /** Direction: 1 ascending, -1 descending, 0 cleared. */\n  direction: 1 | -1 | 0;\n}\n\n/**\n * Column resize event detail containing final pixel width.\n *\n * @example\n * ```typescript\n * grid.addEventListener('column-resize', (e: CustomEvent<ColumnResizeDetail>) => {\n *   const { field, width } = e.detail;\n *   console.log(`Column ${field} resized to ${width}px`);\n *\n *   // Persist to user preferences\n *   saveColumnWidth(field, width);\n * });\n * ```\n *\n * @see {@link ColumnState} for persisting column state\n * @see {@link ResizeController} for resize implementation\n * @category Events\n */\nexport interface ColumnResizeDetail {\n  /** Resized column field key. */\n  field: string;\n  /** New width in pixels. */\n  width: number;\n}\n\n/**\n * Trigger type for cell activation.\n * - `'keyboard'`: Enter key pressed on focused cell\n * - `'pointer'`: Mouse/touch/pen click on cell\n *\n * @see {@link CellActivateDetail} for the activation event detail\n * @category Events\n */\nexport type CellActivateTrigger = 'keyboard' | 'pointer';\n\n/**\n * Fired when a cell is activated by user interaction (Enter key or click).\n * Unified event for both keyboard and pointer activation.\n *\n * @example\n * ```typescript\n * grid.addEventListener('cell-activate', (e: CustomEvent<CellActivateDetail>) => {\n *   const { row, field, value, trigger, cellEl } = e.detail;\n *\n *   if (trigger === 'keyboard') {\n *     console.log('Activated via Enter key');\n *   } else {\n *     console.log('Activated via click/tap');\n *   }\n *\n *   // Start custom editing for specific columns\n *   if (field === 'notes') {\n *     openNotesEditor(row, cellEl);\n *     e.preventDefault(); // Prevent default editing\n *   }\n * });\n * ```\n *\n * @see {@link CellClickDetail} for click-only events\n * @see {@link CellActivateTrigger} for trigger types\n * @category Events\n */\nexport interface CellActivateDetail<TRow = unknown> {\n  /** Zero-based row index of the activated cell. */\n  rowIndex: number;\n  /** Zero-based column index of the activated cell. */\n  colIndex: number;\n  /** Field name of the activated column. */\n  field: string;\n  /** Cell value at the activated position. */\n  value: unknown;\n  /** Full row data object. */\n  row: TRow;\n  /** The activated cell element. */\n  cellEl: HTMLElement;\n  /** What triggered the activation. */\n  trigger: CellActivateTrigger;\n  /** The original event (KeyboardEvent for keyboard, MouseEvent/PointerEvent for pointer). */\n  originalEvent: KeyboardEvent | MouseEvent | PointerEvent;\n}\n\n/**\n * @deprecated Use `CellActivateDetail` instead. Will be removed in next major version.\n * Kept for backwards compatibility.\n *\n * @category Events\n */\nexport interface ActivateCellDetail {\n  /** Zero-based row index now focused. */\n  row: number;\n  /** Zero-based column index now focused. */\n  col: number;\n}\n\n/**\n * Event detail for mounting external view renderers.\n *\n * Emitted when a cell uses an external component spec (React, Angular, Vue)\n * and needs the framework adapter to mount the component.\n *\n * @example\n * ```typescript\n * // Framework adapter listens for this event\n * grid.addEventListener('mount-external-view', (e: CustomEvent<ExternalMountViewDetail>) => {\n *   const { placeholder, spec, context } = e.detail;\n *   // Mount framework component into placeholder\n *   mountComponent(spec.component, placeholder, context);\n * });\n * ```\n *\n * @see {@link ColumnConfig.externalView} for external view spec\n * @see {@link FrameworkAdapter} for adapter interface\n * @category Framework Adapters\n */\nexport interface ExternalMountViewDetail<TRow = unknown> {\n  placeholder: HTMLElement;\n  spec: unknown;\n  context: { row: TRow; value: unknown; field: string; column: unknown };\n}\n\n/**\n * Event detail for mounting external editor renderers.\n *\n * Emitted when a cell uses an external editor component spec and needs\n * the framework adapter to mount the editor with commit/cancel bindings.\n *\n * @example\n * ```typescript\n * // Framework adapter listens for this event\n * grid.addEventListener('mount-external-editor', (e: CustomEvent<ExternalMountEditorDetail>) => {\n *   const { placeholder, spec, context } = e.detail;\n *   // Mount framework editor with commit/cancel wired\n *   mountEditor(spec.component, placeholder, {\n *     value: context.value,\n *     onCommit: context.commit,\n *     onCancel: context.cancel,\n *   });\n * });\n * ```\n *\n * @see {@link ColumnEditorSpec} for external editor spec\n * @see {@link FrameworkAdapter} for adapter interface\n * @category Framework Adapters\n */\nexport interface ExternalMountEditorDetail<TRow = unknown> {\n  placeholder: HTMLElement;\n  spec: unknown;\n  context: {\n    row: TRow;\n    value: unknown;\n    field: string;\n    column: unknown;\n    commit: (v: unknown) => void;\n    cancel: () => void;\n  };\n}\n\n/**\n * Maps event names to their detail payload types.\n *\n * Use this interface for strongly typed event handling.\n *\n * @example\n * ```typescript\n * // Type-safe event listener\n * function handleEvent<K extends keyof DataGridEventMap>(\n *   grid: DataGridElement,\n *   event: K,\n *   handler: (detail: DataGridEventMap[K]) => void,\n * ): void {\n *   grid.addEventListener(event, (e: CustomEvent) => handler(e.detail));\n * }\n *\n * handleEvent(grid, 'cell-click', (detail) => {\n *   console.log(detail.field); // Type-safe access\n * });\n * ```\n *\n * @see {@link DataGridCustomEvent} for typed CustomEvent wrapper\n * @see {@link DGEvents} for event name constants\n * @category Events\n */\nexport interface DataGridEventMap<TRow = unknown> {\n  'cell-click': CellClickDetail<TRow>;\n  'row-click': RowClickDetail<TRow>;\n  'cell-activate': CellActivateDetail<TRow>;\n  'cell-change': CellChangeDetail<TRow>;\n  'mount-external-view': ExternalMountViewDetail<TRow>;\n  'mount-external-editor': ExternalMountEditorDetail<TRow>;\n  'sort-change': SortChangeDetail;\n  'column-resize': ColumnResizeDetail;\n  /** @deprecated Use 'cell-activate' instead */\n  'activate-cell': ActivateCellDetail;\n  'column-state-change': GridColumnState;\n  // Note: 'cell-commit', 'row-commit', 'changed-rows-reset' are added via\n  // module augmentation by EditingPlugin when imported\n}\n\n/**\n * Extracts the event detail type for a given event name.\n *\n * Utility type for getting the detail payload type of a specific event.\n *\n * @example\n * ```typescript\n * // Extract detail type for specific event\n * type ClickDetail = DataGridEventDetail<'cell-click', Employee>;\n * // Equivalent to: CellClickDetail<Employee>\n *\n * // Use in generic handler\n * function logDetail<K extends keyof DataGridEventMap>(\n *   eventName: K,\n *   detail: DataGridEventDetail<K>,\n * ): void {\n *   console.log(`${eventName}:`, detail);\n * }\n * ```\n *\n * @see {@link DataGridEventMap} for all event types\n * @category Events\n */\nexport type DataGridEventDetail<K extends keyof DataGridEventMap<unknown>, TRow = unknown> = DataGridEventMap<TRow>[K];\n\n/**\n * Custom event type for DataGrid events with typed detail payload.\n *\n * Use this type when you need to cast or declare event handler parameters.\n *\n * @example\n * ```typescript\n * // Strongly typed event handler\n * function onCellClick(e: DataGridCustomEvent<'cell-click', Employee>): void {\n *   const { row, field, value } = e.detail;\n *   console.log(`Clicked ${field} = ${value} on ${row.name}`);\n * }\n *\n * grid.addEventListener('cell-click', onCellClick);\n * ```\n *\n * @see {@link DataGridEventMap} for all event types\n * @see {@link DataGridEventDetail} for extracting detail type only\n * @category Events\n */\nexport type DataGridCustomEvent<K extends keyof DataGridEventMap<unknown>, TRow = unknown> = CustomEvent<\n  DataGridEventMap<TRow>[K]\n>;\n\n/**\n * Template evaluation context for dynamic templates.\n *\n * @category Plugin Development\n */\nexport interface EvalContext {\n  value: unknown;\n  row: Record<string, unknown> | null;\n}\n// #endregion\n","/**\n * Base Grid Plugin Class\n *\n * All plugins extend this abstract class.\n * Plugins are instantiated per-grid and manage their own state.\n */\n\n// Injected by Vite at build time from package.json (same as grid.ts)\ndeclare const __GRID_VERSION__: string;\n\nimport type {\n  ColumnConfig,\n  ColumnState,\n  GridPlugin,\n  HeaderContentDefinition,\n  IconValue,\n  ToolPanelDefinition,\n} from '../types';\nimport { DEFAULT_GRID_ICONS } from '../types';\n\n// Re-export shared plugin types for convenience\nexport { PLUGIN_QUERIES } from './types';\nexport type {\n  AfterCellRenderContext,\n  AfterRowRenderContext,\n  CellClickEvent,\n  CellCoords,\n  CellEditor,\n  CellMouseEvent,\n  CellRenderer,\n  ContextMenuItem,\n  ContextMenuParams,\n  GridElementRef,\n  HeaderClickEvent,\n  HeaderRenderer,\n  KeyboardModifiers,\n  PluginCellRenderContext,\n  PluginQuery,\n  RowClickEvent,\n  ScrollEvent,\n} from './types';\n\nimport type {\n  AfterCellRenderContext,\n  AfterRowRenderContext,\n  CellClickEvent,\n  CellEditor,\n  CellMouseEvent,\n  CellRenderer,\n  GridElementRef,\n  HeaderClickEvent,\n  HeaderRenderer,\n  PluginQuery,\n  RowClickEvent,\n  ScrollEvent,\n} from './types';\n\n/**\n * Grid element interface for plugins.\n * Extends GridElementRef with plugin-specific methods.\n * Note: effectiveConfig is already available from GridElementRef.\n */\nexport interface GridElement extends GridElementRef {\n  getPlugin<T extends BaseGridPlugin>(PluginClass: new (...args: any[]) => T): T | undefined;\n  getPluginByName(name: string): BaseGridPlugin | undefined;\n  /**\n   * Get a plugin's state by plugin name.\n   * This is a loose-coupling method for plugins to access other plugins' state\n   * without importing the plugin class directly.\n   * @internal Plugin API\n   */\n  getPluginState?(name: string): unknown;\n}\n\n/**\n * Header render context for plugin header renderers.\n */\nexport interface PluginHeaderRenderContext {\n  /** Column configuration */\n  column: ColumnConfig;\n  /** Column index */\n  colIndex: number;\n}\n\n// ============================================================================\n// Plugin Dependency Types\n// ============================================================================\n\n/**\n * Declares a dependency on another plugin.\n *\n * @category Plugin Development\n * @example\n * ```typescript\n * export class UndoRedoPlugin extends BaseGridPlugin {\n *   static readonly dependencies: PluginDependency[] = [\n *     { name: 'editing', required: true },\n *   ];\n * }\n * ```\n */\nexport interface PluginDependency {\n  /**\n   * The name of the required plugin (matches the plugin's `name` property).\n   * Use string names for loose coupling - avoids static imports.\n   */\n  name: string;\n\n  /**\n   * Whether this dependency is required (hard) or optional (soft).\n   * - `true`: Plugin cannot function without it. Throws error if missing.\n   * - `false`: Plugin works with reduced functionality. Logs info if missing.\n   * @default true\n   */\n  required?: boolean;\n\n  /**\n   * Human-readable reason for this dependency.\n   * Shown in error/info messages to help users understand why.\n   * @example \"UndoRedoPlugin needs EditingPlugin to track cell edits\"\n   */\n  reason?: string;\n}\n\n/**\n * Declares an incompatibility between plugins.\n * When both plugins are loaded, a warning is logged to help users understand the conflict.\n *\n * @category Plugin Development\n */\nexport interface PluginIncompatibility {\n  /**\n   * The name of the incompatible plugin (matches the plugin's `name` property).\n   */\n  name: string;\n\n  /**\n   * Human-readable reason for the incompatibility.\n   * Should explain why the plugins conflict and any workarounds.\n   * @example \"Responsive card layout does not support row grouping yet\"\n   */\n  reason: string;\n}\n\n// ============================================================================\n// Plugin Query & Event Definitions\n// ============================================================================\n\n/**\n * Defines a query that a plugin can handle.\n * Other plugins or the grid can send this query type to retrieve data.\n *\n * @category Plugin Development\n *\n * @example\n * ```typescript\n * // In manifest\n * queries: [\n *   {\n *     type: 'canMoveColumn',\n *     description: 'Check if a column can be moved/reordered',\n *   },\n * ]\n *\n * // In plugin class\n * handleQuery(query: PluginQuery): unknown {\n *   if (query.type === 'canMoveColumn') {\n *     return this.canMoveColumn(query.context);\n *   }\n * }\n * ```\n */\nexport interface QueryDefinition {\n  /**\n   * The query type identifier (e.g., 'canMoveColumn', 'getContextMenuItems').\n   * Should be unique across all plugins.\n   */\n  type: string;\n\n  /**\n   * Human-readable description of what the query does.\n   */\n  description?: string;\n}\n\n/**\n * Defines an event that a plugin can emit.\n * Other plugins can subscribe to these events via the Event Bus.\n *\n * @category Plugin Development\n *\n * @example\n * ```typescript\n * // In manifest\n * events: [\n *   {\n *     type: 'filter-change',\n *     description: 'Emitted when filter criteria change',\n *   },\n * ]\n *\n * // In plugin class - emit\n * this.emitPluginEvent('filter-change', { field: 'name', value: 'Alice' });\n *\n * // In another plugin - subscribe\n * this.on('filter-change', (detail) => console.log('Filter changed:', detail));\n * ```\n */\nexport interface EventDefinition {\n  /**\n   * The event type identifier (e.g., 'filter-change', 'selection-change').\n   * Used when emitting and subscribing to events.\n   */\n  type: string;\n\n  /**\n   * Human-readable description of what the event represents.\n   */\n  description?: string;\n\n  /**\n   * Whether this event is cancelable via `event.preventDefault()`.\n   * @default false\n   */\n  cancelable?: boolean;\n}\n\n// ============================================================================\n// Plugin Manifest Types\n// ============================================================================\n\n/**\n * Defines a property that a plugin \"owns\" - used for configuration validation.\n * When this property is used without the owning plugin loaded, an error is thrown.\n *\n * @category Plugin Development\n */\nexport interface PluginPropertyDefinition {\n  /** The property name on column or grid config */\n  property: string;\n  /** Whether this is a column-level or config-level property */\n  level: 'column' | 'config';\n  /** Human-readable description for error messages (e.g., 'the \"editable\" column property') */\n  description: string;\n  /** Import path hint for error messages (e.g., \"import { EditingPlugin } from '@toolbox-web/grid/plugins/editing';\") */\n  importHint?: string;\n  /** Custom check for whether property is considered \"used\" (default: truthy value check) */\n  isUsed?: (value: unknown) => boolean;\n}\n\n/**\n * A configuration validation rule for detecting invalid/conflicting settings.\n * Plugins declare rules in their manifest; the validator executes them during grid initialization.\n *\n * @category Plugin Development\n * @template TConfig - The plugin's configuration type\n */\nexport interface PluginConfigRule<TConfig = unknown> {\n  /** Rule identifier for debugging (e.g., 'selection/range-dblclick') */\n  id: string;\n  /** Severity: 'error' throws, 'warn' logs warning */\n  severity: 'error' | 'warn';\n  /** Human-readable message shown when rule is violated */\n  message: string;\n  /** Predicate returning true if the rule is VIOLATED (i.e., config is invalid) */\n  check: (pluginConfig: TConfig) => boolean;\n}\n\n/**\n * Hook names that can have execution priority configured.\n *\n * @category Plugin Development\n */\nexport type HookName =\n  | 'processColumns'\n  | 'processRows'\n  | 'afterRender'\n  | 'afterCellRender'\n  | 'afterRowRender'\n  | 'onCellClick'\n  | 'onCellMouseDown'\n  | 'onCellMouseMove'\n  | 'onCellMouseUp'\n  | 'onKeyDown'\n  | 'onScroll'\n  | 'onScrollRender';\n\n/**\n * Static metadata about a plugin's capabilities and requirements.\n * Declared as a static property on plugin classes.\n *\n * @category Plugin Development\n * @template TConfig - The plugin's configuration type\n *\n * @example\n * ```typescript\n * export class MyPlugin extends BaseGridPlugin<MyConfig> {\n *   static override readonly manifest: PluginManifest<MyConfig> = {\n *     ownedProperties: [\n *       { property: 'myProp', level: 'column', description: 'the \"myProp\" column property' },\n *     ],\n *     configRules: [\n *       { id: 'my-plugin/invalid-combo', severity: 'warn', message: '...', check: (c) => c.a && c.b },\n *     ],\n *   };\n *   readonly name = 'myPlugin';\n * }\n * ```\n */\nexport interface PluginManifest<TConfig = unknown> {\n  /**\n   * Properties this plugin owns - validated by validate-config.ts.\n   * If a user uses one of these properties without loading the plugin, an error is thrown.\n   */\n  ownedProperties?: PluginPropertyDefinition[];\n\n  /**\n   * Hook execution priority (higher = later, default 0).\n   * Use negative values to run earlier, positive to run later.\n   */\n  hookPriority?: Partial<Record<HookName, number>>;\n\n  /**\n   * Configuration validation rules - checked during grid initialization.\n   * Rules with severity 'error' throw, 'warn' logs to console.\n   */\n  configRules?: PluginConfigRule<TConfig>[];\n\n  /**\n   * Plugins that are incompatible with this plugin.\n   * When both plugins are loaded together, a warning is shown.\n   *\n   * @example\n   * ```typescript\n   * incompatibleWith: [\n   *   { name: 'groupingRows', reason: 'Responsive card layout does not support row grouping yet' },\n   * ],\n   * ```\n   */\n  incompatibleWith?: PluginIncompatibility[];\n\n  /**\n   * Queries this plugin can handle.\n   * Declares what query types this plugin responds to via `handleQuery()`.\n   * This replaces the centralized PLUGIN_QUERIES approach with manifest-declared queries.\n   *\n   * @example\n   * ```typescript\n   * queries: [\n   *   { type: 'canMoveColumn', description: 'Check if a column can be moved' },\n   * ],\n   * ```\n   */\n  queries?: QueryDefinition[];\n\n  /**\n   * Events this plugin can emit.\n   * Declares what event types other plugins can subscribe to via `on()`.\n   *\n   * @example\n   * ```typescript\n   * events: [\n   *   { type: 'filter-change', description: 'Emitted when filter criteria change' },\n   * ],\n   * ```\n   */\n  events?: EventDefinition[];\n}\n\n/**\n * Abstract base class for all grid plugins.\n *\n * @category Plugin Development\n * @template TConfig - Configuration type for the plugin\n */\nexport abstract class BaseGridPlugin<TConfig = unknown> implements GridPlugin {\n  /**\n   * Plugin dependencies - declare other plugins this one requires.\n   *\n   * Dependencies are validated when the plugin is attached.\n   * Required dependencies throw an error if missing.\n   * Optional dependencies log an info message if missing.\n   *\n   * @example\n   * ```typescript\n   * static readonly dependencies: PluginDependency[] = [\n   *   { name: 'editing', required: true, reason: 'Tracks cell edits for undo/redo' },\n   *   { name: 'selection', required: false, reason: 'Enables selection-based undo' },\n   * ];\n   * ```\n   */\n  static readonly dependencies?: PluginDependency[];\n\n  /**\n   * Plugin manifest - declares owned properties, config rules, and hook priorities.\n   *\n   * This is read by the configuration validator to:\n   * - Validate that required plugins are loaded when their properties are used\n   * - Execute configRules to detect invalid/conflicting settings\n   * - Order hook execution based on priority\n   *\n   * @example\n   * ```typescript\n   * static override readonly manifest: PluginManifest<MyConfig> = {\n   *   ownedProperties: [\n   *     { property: 'myProp', level: 'column', description: 'the \"myProp\" column property' },\n   *   ],\n   *   configRules: [\n   *     { id: 'myPlugin/conflict', severity: 'warn', message: '...', check: (c) => c.a && c.b },\n   *   ],\n   * };\n   * ```\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  static readonly manifest?: PluginManifest<any>;\n\n  /** Unique plugin identifier (derived from class name by default) */\n  abstract readonly name: string;\n\n  /**\n   * Plugin version - defaults to grid version for built-in plugins.\n   * Third-party plugins can override with their own semver.\n   */\n  readonly version: string = typeof __GRID_VERSION__ !== 'undefined' ? __GRID_VERSION__ : 'dev';\n\n  /** CSS styles to inject into the grid's shadow DOM */\n  readonly styles?: string;\n\n  /** Custom cell renderers keyed by type name */\n  readonly cellRenderers?: Record<string, CellRenderer>;\n\n  /** Custom header renderers keyed by type name */\n  readonly headerRenderers?: Record<string, HeaderRenderer>;\n\n  /** Custom cell editors keyed by type name */\n  readonly cellEditors?: Record<string, CellEditor>;\n\n  /** The grid instance this plugin is attached to */\n  protected grid!: GridElement;\n\n  /** Plugin configuration - merged with defaults in attach() */\n  protected config!: TConfig;\n\n  /** User-provided configuration from constructor */\n  protected readonly userConfig: Partial<TConfig>;\n\n  /**\n   * Plugin-level AbortController for event listener cleanup.\n   * Created fresh in attach(), aborted in detach().\n   * This ensures event listeners are properly cleaned up when plugins are re-attached.\n   */\n  #abortController?: AbortController;\n\n  /**\n   * Default configuration - subclasses should override this getter.\n   * Note: This must be a getter (not property initializer) for proper inheritance\n   * since property initializers run after parent constructor.\n   */\n  protected get defaultConfig(): Partial<TConfig> {\n    return {};\n  }\n\n  constructor(config: Partial<TConfig> = {}) {\n    this.userConfig = config;\n  }\n\n  /**\n   * Called when the plugin is attached to a grid.\n   * Override to set up event listeners, initialize state, etc.\n   *\n   * @example\n   * ```ts\n   * attach(grid: GridElement): void {\n   *   super.attach(grid);\n   *   // Set up document-level listeners with auto-cleanup\n   *   document.addEventListener('keydown', this.handleEscape, {\n   *     signal: this.disconnectSignal\n   *   });\n   * }\n   * ```\n   */\n  attach(grid: GridElement): void {\n    // Abort any previous abort controller (in case of re-attach without detach)\n    this.#abortController?.abort();\n    // Create fresh abort controller for this attachment\n    this.#abortController = new AbortController();\n\n    this.grid = grid;\n    // Merge config here (after subclass construction is complete)\n    this.config = { ...this.defaultConfig, ...this.userConfig } as TConfig;\n  }\n\n  /**\n   * Called when the plugin is detached from a grid.\n   * Override to clean up event listeners, timers, etc.\n   *\n   * @example\n   * ```ts\n   * detach(): void {\n   *   // Clean up any state not handled by disconnectSignal\n   *   this.selectedRows.clear();\n   *   this.cache = null;\n   * }\n   * ```\n   */\n  detach(): void {\n    // Abort the plugin's abort controller to clean up all event listeners\n    // registered with { signal: this.disconnectSignal }\n    this.#abortController?.abort();\n    this.#abortController = undefined;\n    // Override in subclass for additional cleanup\n  }\n\n  /**\n   * Called when another plugin is attached to the same grid.\n   * Use for inter-plugin coordination, e.g., to integrate with new plugins.\n   *\n   * @param name - The name of the plugin that was attached\n   * @param plugin - The plugin instance (for direct access if needed)\n   *\n   * @example\n   * ```ts\n   * onPluginAttached(name: string, plugin: BaseGridPlugin): void {\n   *   if (name === 'selection') {\n   *     // Integrate with selection plugin\n   *     this.selectionPlugin = plugin as SelectionPlugin;\n   *   }\n   * }\n   * ```\n   */\n  onPluginAttached?(name: string, plugin: BaseGridPlugin): void;\n\n  /**\n   * Called when another plugin is detached from the same grid.\n   * Use to clean up inter-plugin references.\n   *\n   * @param name - The name of the plugin that was detached\n   *\n   * @example\n   * ```ts\n   * onPluginDetached(name: string): void {\n   *   if (name === 'selection') {\n   *     this.selectionPlugin = undefined;\n   *   }\n   * }\n   * ```\n   */\n  onPluginDetached?(name: string): void;\n\n  /**\n   * Get another plugin instance from the same grid.\n   * Use for inter-plugin communication.\n   *\n   * @example\n   * ```ts\n   * const selection = this.getPlugin(SelectionPlugin);\n   * if (selection) {\n   *   const selectedRows = selection.getSelectedRows();\n   * }\n   * ```\n   */\n  protected getPlugin<T extends BaseGridPlugin>(PluginClass: new (...args: any[]) => T): T | undefined {\n    return this.grid?.getPlugin(PluginClass);\n  }\n\n  /**\n   * Emit a custom event from the grid.\n   */\n  protected emit<T>(eventName: string, detail: T): void {\n    this.grid?.dispatchEvent?.(new CustomEvent(eventName, { detail, bubbles: true }));\n  }\n\n  /**\n   * Emit a cancelable custom event from the grid.\n   * @returns `true` if the event was cancelled (preventDefault called), `false` otherwise\n   */\n  protected emitCancelable<T>(eventName: string, detail: T): boolean {\n    const event = new CustomEvent(eventName, { detail, bubbles: true, cancelable: true });\n    this.grid?.dispatchEvent?.(event);\n    return event.defaultPrevented;\n  }\n\n  // =========================================================================\n  // Event Bus - Plugin-to-Plugin Communication\n  // =========================================================================\n\n  /**\n   * Subscribe to an event from another plugin.\n   * The subscription is automatically cleaned up when this plugin is detached.\n   *\n   * @category Plugin Development\n   * @param eventType - The event type to listen for (e.g., 'filter-change')\n   * @param callback - The callback to invoke when the event is emitted\n   *\n   * @example\n   * ```typescript\n   * // In attach() or other initialization\n   * this.on('filter-change', (detail) => {\n   *   console.log('Filter changed:', detail);\n   * });\n   * ```\n   */\n  protected on<T = unknown>(eventType: string, callback: (detail: T) => void): void {\n    this.grid?._pluginManager?.subscribe(this, eventType, callback as (detail: unknown) => void);\n  }\n\n  /**\n   * Unsubscribe from a plugin event.\n   *\n   * @category Plugin Development\n   * @param eventType - The event type to stop listening for\n   *\n   * @example\n   * ```typescript\n   * this.off('filter-change');\n   * ```\n   */\n  protected off(eventType: string): void {\n    this.grid?._pluginManager?.unsubscribe(this, eventType);\n  }\n\n  /**\n   * Emit an event to other plugins via the Event Bus.\n   * This is for inter-plugin communication only; it does NOT dispatch DOM events.\n   * Use `emit()` to dispatch DOM events that external consumers can listen to.\n   *\n   * @category Plugin Development\n   * @param eventType - The event type to emit (should be declared in manifest.events)\n   * @param detail - The event payload\n   *\n   * @example\n   * ```typescript\n   * // Emit to other plugins (not DOM)\n   * this.emitPluginEvent('filter-change', { field: 'name', value: 'Alice' });\n   *\n   * // For DOM events that consumers can addEventListener to:\n   * this.emit('filter-change', { field: 'name', value: 'Alice' });\n   * ```\n   */\n  protected emitPluginEvent<T>(eventType: string, detail: T): void {\n    this.grid?._pluginManager?.emitPluginEvent(eventType, detail);\n  }\n\n  /**\n   * Request a re-render of the grid.\n   * Uses ROWS phase - does NOT trigger processColumns hooks.\n   */\n  protected requestRender(): void {\n    this.grid?.requestRender?.();\n  }\n\n  /**\n   * Request a columns re-render of the grid.\n   * Uses COLUMNS phase - triggers processColumns hooks.\n   * Use this when your plugin needs to reprocess column configuration.\n   */\n  protected requestColumnsRender(): void {\n    (this.grid as { requestColumnsRender?: () => void })?.requestColumnsRender?.();\n  }\n\n  /**\n   * Request a re-render and restore focus styling afterward.\n   * Use this when a plugin action (like expand/collapse) triggers a render\n   * but needs to maintain keyboard navigation focus.\n   */\n  protected requestRenderWithFocus(): void {\n    this.grid?.requestRenderWithFocus?.();\n  }\n\n  /**\n   * Request a lightweight style update without rebuilding DOM.\n   * Use this instead of requestRender() when only CSS classes need updating.\n   */\n  protected requestAfterRender(): void {\n    this.grid?.requestAfterRender?.();\n  }\n\n  /**\n   * Get the current rows from the grid.\n   */\n  protected get rows(): any[] {\n    return this.grid?.rows ?? [];\n  }\n\n  /**\n   * Get the original unfiltered/unprocessed rows from the grid.\n   * Use this when you need all source data regardless of active filters.\n   */\n  protected get sourceRows(): any[] {\n    return this.grid?.sourceRows ?? [];\n  }\n\n  /**\n   * Get the current columns from the grid.\n   */\n  protected get columns(): ColumnConfig[] {\n    return this.grid?.columns ?? [];\n  }\n\n  /**\n   * Get only visible columns from the grid (excludes hidden).\n   * Use this for rendering that needs to match the grid template.\n   */\n  protected get visibleColumns(): ColumnConfig[] {\n    return this.grid?._visibleColumns ?? [];\n  }\n\n  /**\n   * Get the grid as an HTMLElement for direct DOM operations.\n   * Use sparingly - prefer the typed GridElementRef API when possible.\n   *\n   * @example\n   * ```ts\n   * const width = this.gridElement.clientWidth;\n   * this.gridElement.classList.add('my-plugin-active');\n   * ```\n   */\n  protected get gridElement(): HTMLElement {\n    return this.grid as unknown as HTMLElement;\n  }\n\n  /**\n   * Get the disconnect signal for event listener cleanup.\n   * This signal is aborted when the grid disconnects from the DOM.\n   * Use this when adding event listeners that should be cleaned up automatically.\n   *\n   * Best for:\n   * - Document/window-level listeners added in attach()\n   * - Listeners on the grid element itself\n   * - Any listener that should persist across renders\n   *\n   * Not needed for:\n   * - Listeners on elements created in afterRender() (removed with element)\n   *\n   * @example\n   * element.addEventListener('click', handler, { signal: this.disconnectSignal });\n   * document.addEventListener('keydown', handler, { signal: this.disconnectSignal });\n   */\n  protected get disconnectSignal(): AbortSignal {\n    // Return the plugin's own abort signal for proper cleanup on detach/re-attach\n    // Falls back to grid's signal if plugin's controller not yet created\n    return this.#abortController?.signal ?? this.grid?.disconnectSignal;\n  }\n\n  /**\n   * Get the grid-level icons configuration.\n   * Returns merged icons (user config + defaults).\n   */\n  protected get gridIcons(): typeof DEFAULT_GRID_ICONS {\n    const userIcons = this.grid?.gridConfig?.icons ?? {};\n    return { ...DEFAULT_GRID_ICONS, ...userIcons };\n  }\n\n  // #region Animation Helpers\n\n  /**\n   * Check if animations are enabled at the grid level.\n   * Respects gridConfig.animation.mode and the CSS variable set by the grid.\n   *\n   * Plugins should use this to skip animations when:\n   * - Animation mode is 'off' or `false`\n   * - User prefers reduced motion and mode is 'reduced-motion' (default)\n   *\n   * @example\n   * ```ts\n   * private get animationStyle(): 'slide' | 'fade' | false {\n   *   if (!this.isAnimationEnabled) return false;\n   *   return this.config.animation ?? 'slide';\n   * }\n   * ```\n   */\n  protected get isAnimationEnabled(): boolean {\n    const mode = this.grid?.effectiveConfig?.animation?.mode ?? 'reduced-motion';\n\n    // Explicit off = disabled\n    if (mode === false || mode === 'off') return false;\n\n    // Explicit on = always enabled\n    if (mode === true || mode === 'on') return true;\n\n    // reduced-motion: check CSS variable (set by grid based on media query)\n    const host = this.gridElement;\n    if (host) {\n      const enabled = getComputedStyle(host).getPropertyValue('--tbw-animation-enabled').trim();\n      return enabled !== '0';\n    }\n\n    return true; // Default to enabled\n  }\n\n  /**\n   * Get the animation duration in milliseconds from CSS variable.\n   * Falls back to 200ms if not set.\n   *\n   * Plugins can use this for their animation timing to stay consistent\n   * with the grid-level animation.duration setting.\n   *\n   * @example\n   * ```ts\n   * element.animate(keyframes, { duration: this.animationDuration });\n   * ```\n   */\n  protected get animationDuration(): number {\n    const host = this.gridElement;\n    if (host) {\n      const durationStr = getComputedStyle(host).getPropertyValue('--tbw-animation-duration').trim();\n      const parsed = parseInt(durationStr, 10);\n      if (!isNaN(parsed)) return parsed;\n    }\n    return 200; // Default\n  }\n\n  // #endregion\n\n  /**\n   * Resolve an icon value to string or HTMLElement.\n   * Checks plugin config first, then grid-level icons, then defaults.\n   *\n   * @param iconKey - The icon key in GridIcons (e.g., 'expand', 'collapse')\n   * @param pluginOverride - Optional plugin-level override\n   * @returns The resolved icon value\n   */\n  protected resolveIcon(iconKey: keyof typeof DEFAULT_GRID_ICONS, pluginOverride?: IconValue): IconValue {\n    // Plugin override takes precedence\n    if (pluginOverride !== undefined) {\n      return pluginOverride;\n    }\n    // Then grid-level config\n    return this.gridIcons[iconKey];\n  }\n\n  /**\n   * Set an icon value on an element.\n   * Handles both string (text/HTML) and HTMLElement values.\n   *\n   * @param element - The element to set the icon on\n   * @param icon - The icon value (string or HTMLElement)\n   */\n  protected setIcon(element: HTMLElement, icon: IconValue): void {\n    if (typeof icon === 'string') {\n      element.innerHTML = icon;\n    } else if (icon instanceof HTMLElement) {\n      element.innerHTML = '';\n      element.appendChild(icon.cloneNode(true));\n    }\n  }\n\n  /**\n   * Log a warning message.\n   */\n  protected warn(message: string): void {\n    console.warn(`[tbw-grid:${this.name}] ${message}`);\n  }\n\n  // #region Lifecycle Hooks\n\n  /**\n   * Transform rows before rendering.\n   * Called during each render cycle before rows are rendered to the DOM.\n   * Use this to filter, sort, or add computed properties to rows.\n   *\n   * @param rows - The current rows array (readonly to encourage returning a new array)\n   * @returns The modified rows array to render\n   *\n   * @example\n   * ```ts\n   * processRows(rows: readonly any[]): any[] {\n   *   // Filter out hidden rows\n   *   return rows.filter(row => !row._hidden);\n   * }\n   * ```\n   *\n   * @example\n   * ```ts\n   * processRows(rows: readonly any[]): any[] {\n   *   // Add computed properties\n   *   return rows.map(row => ({\n   *     ...row,\n   *     _fullName: `${row.firstName} ${row.lastName}`\n   *   }));\n   * }\n   * ```\n   */\n  processRows?(rows: readonly any[]): any[];\n\n  /**\n   * Transform columns before rendering.\n   * Called during each render cycle before column headers and cells are rendered.\n   * Use this to add, remove, or modify column definitions.\n   *\n   * @param columns - The current columns array (readonly to encourage returning a new array)\n   * @returns The modified columns array to render\n   *\n   * @example\n   * ```ts\n   * processColumns(columns: readonly ColumnConfig[]): ColumnConfig[] {\n   *   // Add a selection checkbox column\n   *   return [\n   *     { field: '_select', header: '', width: 40 },\n   *     ...columns\n   *   ];\n   * }\n   * ```\n   */\n  processColumns?(columns: readonly ColumnConfig[]): ColumnConfig[];\n\n  /**\n   * Called before each render cycle begins.\n   * Use this to prepare state or cache values needed during rendering.\n   *\n   * **Note:** This hook is currently a placeholder for future implementation.\n   * It is defined in the interface but not yet invoked by the grid's render pipeline.\n   * If you need this functionality, please open an issue or contribute an implementation.\n   *\n   * @example\n   * ```ts\n   * beforeRender(): void {\n   *   this.visibleRowCount = this.calculateVisibleRows();\n   * }\n   * ```\n   */\n  beforeRender?(): void;\n\n  /**\n   * Called after each render cycle completes.\n   * Use this for DOM manipulation, adding event listeners to rendered elements,\n   * or applying visual effects like selection highlights.\n   *\n   * @example\n   * ```ts\n   * afterRender(): void {\n   *   // Apply selection styling to rendered rows\n   *   const rows = this.gridElement?.querySelectorAll('.data-row');\n   *   rows?.forEach((row, i) => {\n   *     row.classList.toggle('selected', this.selectedRows.has(i));\n   *   });\n   * }\n   * ```\n   */\n  afterRender?(): void;\n\n  /**\n   * Called after each cell is rendered.\n   * This hook is more efficient than `afterRender()` for cell-level modifications\n   * because you receive the cell context directly - no DOM queries needed.\n   *\n   * Use cases:\n   * - Adding selection/highlight classes to specific cells\n   * - Injecting badges or decorations\n   * - Applying conditional styling based on cell value\n   *\n   * Performance note: Called for every visible cell during render. Keep implementation fast.\n   * This hook is also called during scroll when cells are recycled.\n   *\n   * @param context - The cell render context with row, column, value, and elements\n   *\n   * @example\n   * ```ts\n   * afterCellRender(context: AfterCellRenderContext): void {\n   *   // Add selection class without DOM queries\n   *   if (this.isSelected(context.rowIndex, context.colIndex)) {\n   *     context.cellElement.classList.add('selected');\n   *   }\n   *\n   *   // Add validation error styling\n   *   if (this.hasError(context.row, context.column.field)) {\n   *     context.cellElement.classList.add('has-error');\n   *   }\n   * }\n   * ```\n   */\n  afterCellRender?(context: AfterCellRenderContext): void;\n\n  /**\n   * Called after a row is fully rendered (all cells complete).\n   * Use this for row-level decorations, styling, or ARIA attributes.\n   *\n   * Common use cases:\n   * - Adding selection classes to entire rows (row-focus, selected)\n   * - Setting row-level ARIA attributes\n   * - Applying row validation highlighting\n   * - Tree indentation styling\n   *\n   * Performance note: Called for every visible row during render. Keep implementation fast.\n   * This hook is also called during scroll when rows are recycled.\n   *\n   * @param context - The row render context with row data and element\n   *\n   * @example\n   * ```ts\n   * afterRowRender(context: AfterRowRenderContext): void {\n   *   // Add row selection class without DOM queries\n   *   if (this.isRowSelected(context.rowIndex)) {\n   *     context.rowElement.classList.add('selected', 'row-focus');\n   *   }\n   *\n   *   // Add validation error styling\n   *   if (this.rowHasErrors(context.row)) {\n   *     context.rowElement.classList.add('has-errors');\n   *   }\n   * }\n   * ```\n   */\n  afterRowRender?(context: AfterRowRenderContext): void;\n\n  /**\n   * Called after scroll-triggered row rendering completes.\n   * This is a lightweight hook for applying visual state to recycled DOM elements.\n   * Use this instead of afterRender when you need to reapply styling during scroll.\n   *\n   * Performance note: This is called frequently during scroll. Keep implementation fast.\n   *\n   * @example\n   * ```ts\n   * onScrollRender(): void {\n   *   // Reapply selection state to visible cells\n   *   this.applySelectionToVisibleCells();\n   * }\n   * ```\n   */\n  onScrollRender?(): void;\n\n  /**\n   * Return extra height contributed by this plugin (e.g., expanded detail rows).\n   * Used to adjust scrollbar height calculations for virtualization.\n   *\n   * @returns Total extra height in pixels\n   *\n   * @deprecated Use {@link getRowHeight} instead. This hook will be removed in v3.0.\n   * The new `getRowHeight(row, index)` hook provides per-row height information which\n   * enables better position caching and variable row height support.\n   *\n   * @example\n   * ```ts\n   * // OLD (deprecated):\n   * getExtraHeight(): number {\n   *   return this.expandedRows.size * this.detailHeight;\n   * }\n   *\n   * // NEW (preferred):\n   * getRowHeight(row: unknown, index: number): number | undefined {\n   *   if (this.isExpanded(row)) {\n   *     return this.baseRowHeight + this.getDetailHeight(row);\n   *   }\n   *   return undefined;\n   * }\n   * ```\n   */\n  getExtraHeight?(): number;\n\n  /**\n   * Return extra height that appears before a given row index.\n   * Used by virtualization to correctly calculate scroll positions when\n   * there's variable height content (like expanded detail rows) above the viewport.\n   *\n   * @param beforeRowIndex - The row index to calculate extra height before\n   * @returns Extra height in pixels that appears before this row\n   *\n   * @deprecated Use {@link getRowHeight} instead. This hook will be removed in v3.0.\n   * The new `getRowHeight(row, index)` hook provides per-row height information which\n   * enables better position caching and variable row height support.\n   *\n   * @example\n   * ```ts\n   * // OLD (deprecated):\n   * getExtraHeightBefore(beforeRowIndex: number): number {\n   *   let height = 0;\n   *   for (const expandedRowIndex of this.expandedRowIndices) {\n   *     if (expandedRowIndex < beforeRowIndex) {\n   *       height += this.getDetailHeight(expandedRowIndex);\n   *     }\n   *   }\n   *   return height;\n   * }\n   *\n   * // NEW (preferred):\n   * getRowHeight(row: unknown, index: number): number | undefined {\n   *   if (this.isExpanded(row)) {\n   *     return this.baseRowHeight + this.getDetailHeight(row);\n   *   }\n   *   return undefined;\n   * }\n   * ```\n   */\n  getExtraHeightBefore?(beforeRowIndex: number): number;\n\n  /**\n   * Get the height of a specific row.\n   * Used for synthetic rows (group headers, detail panels, etc.) that have fixed heights.\n   * Return undefined if this plugin does not manage the height for this row.\n   *\n   * This hook is called during position cache rebuilds for variable row height virtualization.\n   * Plugins that create synthetic rows should implement this to provide accurate heights.\n   *\n   * @param row - The row data\n   * @param index - The row index in the processed rows array\n   * @returns The row height in pixels, or undefined if not managed by this plugin\n   *\n   * @example\n   * ```ts\n   * getRowHeight(row: unknown, index: number): number | undefined {\n   *   // Group headers have a fixed height\n   *   if (this.isGroupHeader(row)) {\n   *     return 32;\n   *   }\n   *   return undefined; // Let grid use default/measured height\n   * }\n   * ```\n   */\n  getRowHeight?(row: unknown, index: number): number | undefined;\n\n  /**\n   * Adjust the virtualization start index to render additional rows before the visible range.\n   * Use this when expanded content (like detail rows) needs its parent row to remain rendered\n   * even when the parent row itself has scrolled above the viewport.\n   *\n   * @param start - The calculated start row index\n   * @param scrollTop - The current scroll position\n   * @param rowHeight - The height of a single row\n   * @returns The adjusted start index (lower than or equal to original start)\n   *\n   * @example\n   * ```ts\n   * adjustVirtualStart(start: number, scrollTop: number, rowHeight: number): number {\n   *   // If row 5 is expanded and scrolled partially, keep it rendered\n   *   for (const expandedRowIndex of this.expandedRowIndices) {\n   *     const expandedRowTop = expandedRowIndex * rowHeight;\n   *     const expandedRowBottom = expandedRowTop + rowHeight + this.detailHeight;\n   *     if (expandedRowBottom > scrollTop && expandedRowIndex < start) {\n   *       return expandedRowIndex;\n   *     }\n   *   }\n   *   return start;\n   * }\n   * ```\n   */\n  adjustVirtualStart?(start: number, scrollTop: number, rowHeight: number): number;\n\n  /**\n   * Render a custom row, bypassing the default row rendering.\n   * Use this for special row types like group headers, detail rows, or footers.\n   *\n   * @param row - The row data object\n   * @param rowEl - The row DOM element to render into\n   * @param rowIndex - The index of the row in the data array\n   * @returns `true` if the plugin handled rendering (prevents default), `false`/`void` for default rendering\n   *\n   * @example\n   * ```ts\n   * renderRow(row: any, rowEl: HTMLElement, rowIndex: number): boolean | void {\n   *   if (row._isGroupHeader) {\n   *     rowEl.innerHTML = `<div class=\"group-header\">${row._groupLabel}</div>`;\n   *     return true; // Handled - skip default rendering\n   *   }\n   *   // Return void to let default rendering proceed\n   * }\n   * ```\n   */\n  renderRow?(row: any, rowEl: HTMLElement, rowIndex: number): boolean | void;\n\n  // #endregion\n\n  // #region Inter-Plugin Communication\n\n  /**\n   * Handle queries from other plugins.\n   * This is the generic mechanism for inter-plugin communication.\n   * Plugins can respond to well-known query types or define their own.\n   *\n   * **Prefer `handleQuery` for new plugins** - it has the same signature but\n   * a clearer name. `onPluginQuery` is kept for backwards compatibility.\n   *\n   * @category Plugin Development\n   * @param query - The query object with type and context\n   * @returns Query-specific response, or undefined if not handling this query\n   *\n   * @example\n   * ```ts\n   * onPluginQuery(query: PluginQuery): unknown {\n   *   switch (query.type) {\n   *     case PLUGIN_QUERIES.CAN_MOVE_COLUMN:\n   *       // Prevent moving pinned columns\n   *       const column = query.context as ColumnConfig;\n   *       if (column.sticky === 'left' || column.sticky === 'right') {\n   *         return false;\n   *       }\n   *       break;\n   *     case PLUGIN_QUERIES.GET_CONTEXT_MENU_ITEMS:\n   *       const params = query.context as ContextMenuParams;\n   *       return [{ id: 'my-action', label: 'My Action', action: () => {} }];\n   *   }\n   * }\n   * ```\n   * @deprecated Use `handleQuery` instead for new plugins.\n   */\n  onPluginQuery?(query: PluginQuery): unknown;\n\n  /**\n   * Handle queries from other plugins or the grid.\n   *\n   * Queries are declared in `manifest.queries` and dispatched via `grid.query()`.\n   * This enables type-safe, discoverable inter-plugin communication.\n   *\n   * @category Plugin Development\n   * @param query - The query object with type and context\n   * @returns Query-specific response, or undefined if not handling this query\n   *\n   * @example\n   * ```ts\n   * // In manifest\n   * static override readonly manifest: PluginManifest = {\n   *   queries: [\n   *     { type: 'canMoveColumn', description: 'Check if a column can be moved' },\n   *   ],\n   * };\n   *\n   * // In plugin class\n   * handleQuery(query: PluginQuery): unknown {\n   *   if (query.type === 'canMoveColumn') {\n   *     const column = query.context as ColumnConfig;\n   *     return !column.sticky; // Can't move sticky columns\n   *   }\n   * }\n   * ```\n   */\n  handleQuery?(query: PluginQuery): unknown;\n\n  // #endregion\n\n  // #region Interaction Hooks\n\n  /**\n   * Handle keyboard events on the grid.\n   * Called when a key is pressed while the grid or a cell has focus.\n   *\n   * @param event - The native KeyboardEvent\n   * @returns `true` to prevent default behavior and stop propagation, `false`/`void` to allow default\n   *\n   * @example\n   * ```ts\n   * onKeyDown(event: KeyboardEvent): boolean | void {\n   *   // Handle Ctrl+A for select all\n   *   if (event.ctrlKey && event.key === 'a') {\n   *     this.selectAllRows();\n   *     return true; // Prevent default browser select-all\n   *   }\n   * }\n   * ```\n   */\n  onKeyDown?(event: KeyboardEvent): boolean | void;\n\n  /**\n   * Handle cell click events.\n   * Called when a data cell is clicked (not headers).\n   *\n   * @param event - Cell click event with row/column context\n   * @returns `true` to prevent default behavior and stop propagation, `false`/`void` to allow default\n   *\n   * @example\n   * ```ts\n   * onCellClick(event: CellClickEvent): boolean | void {\n   *   if (event.field === '_select') {\n   *     this.toggleRowSelection(event.rowIndex);\n   *     return true; // Handled\n   *   }\n   * }\n   * ```\n   */\n  onCellClick?(event: CellClickEvent): boolean | void;\n\n  /**\n   * Handle row click events.\n   * Called when any part of a data row is clicked.\n   * Note: This is called in addition to onCellClick, not instead of.\n   *\n   * @param event - Row click event with row context\n   * @returns `true` to prevent default behavior and stop propagation, `false`/`void` to allow default\n   *\n   * @example\n   * ```ts\n   * onRowClick(event: RowClickEvent): boolean | void {\n   *   if (this.config.mode === 'row') {\n   *     this.selectRow(event.rowIndex, event.originalEvent);\n   *     return true;\n   *   }\n   * }\n   * ```\n   */\n  onRowClick?(event: RowClickEvent): boolean | void;\n\n  /**\n   * Handle header click events.\n   * Called when a column header is clicked. Commonly used for sorting.\n   *\n   * @param event - Header click event with column context\n   * @returns `true` to prevent default behavior and stop propagation, `false`/`void` to allow default\n   *\n   * @example\n   * ```ts\n   * onHeaderClick(event: HeaderClickEvent): boolean | void {\n   *   if (event.column.sortable !== false) {\n   *     this.toggleSort(event.field);\n   *     return true;\n   *   }\n   * }\n   * ```\n   */\n  onHeaderClick?(event: HeaderClickEvent): boolean | void;\n\n  /**\n   * Handle scroll events on the grid viewport.\n   * Called during scrolling. Note: This may be called frequently; debounce if needed.\n   *\n   * @param event - Scroll event with scroll position and viewport dimensions\n   *\n   * @example\n   * ```ts\n   * onScroll(event: ScrollEvent): void {\n   *   // Update sticky column positions\n   *   this.updateStickyPositions(event.scrollLeft);\n   * }\n   * ```\n   */\n  onScroll?(event: ScrollEvent): void;\n\n  /**\n   * Handle cell mousedown events.\n   * Used for initiating drag operations like range selection or column resize.\n   *\n   * @param event - Mouse event with cell context\n   * @returns `true` to indicate drag started (prevents text selection), `false`/`void` otherwise\n   *\n   * @example\n   * ```ts\n   * onCellMouseDown(event: CellMouseEvent): boolean | void {\n   *   if (event.rowIndex !== undefined && this.config.mode === 'range') {\n   *     this.startDragSelection(event.rowIndex, event.colIndex);\n   *     return true; // Prevent text selection\n   *   }\n   * }\n   * ```\n   */\n  onCellMouseDown?(event: CellMouseEvent): boolean | void;\n\n  /**\n   * Handle cell mousemove events during drag operations.\n   * Only called when a drag is in progress (after mousedown returned true).\n   *\n   * @param event - Mouse event with current cell context\n   * @returns `true` to continue handling the drag, `false`/`void` otherwise\n   *\n   * @example\n   * ```ts\n   * onCellMouseMove(event: CellMouseEvent): boolean | void {\n   *   if (this.isDragging && event.rowIndex !== undefined) {\n   *     this.extendSelection(event.rowIndex, event.colIndex);\n   *     return true;\n   *   }\n   * }\n   * ```\n   */\n  onCellMouseMove?(event: CellMouseEvent): boolean | void;\n\n  /**\n   * Handle cell mouseup events to end drag operations.\n   *\n   * @param event - Mouse event with final cell context\n   * @returns `true` if drag was finalized, `false`/`void` otherwise\n   *\n   * @example\n   * ```ts\n   * onCellMouseUp(event: CellMouseEvent): boolean | void {\n   *   if (this.isDragging) {\n   *     this.finalizeDragSelection();\n   *     this.isDragging = false;\n   *     return true;\n   *   }\n   * }\n   * ```\n   */\n  onCellMouseUp?(event: CellMouseEvent): boolean | void;\n\n  // Note: Context menu items are provided via handleQuery('getContextMenuItems').\n  // This keeps the core decoupled from the context-menu plugin specifics.\n\n  // #endregion\n\n  // #region Column State Hooks\n\n  /**\n   * Contribute plugin-specific state for a column.\n   * Called by the grid when collecting column state for serialization.\n   * Plugins can add their own properties to the column state.\n   *\n   * @param field - The field name of the column\n   * @returns Partial column state with plugin-specific properties, or undefined if no state to contribute\n   *\n   * @example\n   * ```ts\n   * getColumnState(field: string): Partial<ColumnState> | undefined {\n   *   const filterModel = this.filterModels.get(field);\n   *   if (filterModel) {\n   *     // Uses module augmentation to add filter property to ColumnState\n   *     return { filter: filterModel } as Partial<ColumnState>;\n   *   }\n   *   return undefined;\n   * }\n   * ```\n   */\n  getColumnState?(field: string): Partial<ColumnState> | undefined;\n\n  /**\n   * Apply plugin-specific state to a column.\n   * Called by the grid when restoring column state from serialized data.\n   * Plugins should restore their internal state based on the provided state.\n   *\n   * @param field - The field name of the column\n   * @param state - The column state to apply (may contain plugin-specific properties)\n   *\n   * @example\n   * ```ts\n   * applyColumnState(field: string, state: ColumnState): void {\n   *   // Check for filter property added via module augmentation\n   *   const filter = (state as any).filter;\n   *   if (filter) {\n   *     this.filterModels.set(field, filter);\n   *     this.applyFilter();\n   *   }\n   * }\n   * ```\n   */\n  applyColumnState?(field: string, state: ColumnState): void;\n\n  // #endregion\n\n  // #region Scroll Boundary Hooks\n\n  /**\n   * Report horizontal scroll boundary offsets for this plugin.\n   * Plugins that obscure part of the scroll area (e.g., pinned/sticky columns)\n   * should return how much space they occupy on each side.\n   * The keyboard navigation uses this to ensure focused cells are fully visible.\n   *\n   * @param rowEl - The row element (optional, for calculating widths from rendered cells)\n   * @param focusedCell - The currently focused cell element (optional, to determine if scrolling should be skipped)\n   * @returns Object with left/right pixel offsets and optional skipScroll flag, or undefined if plugin has no offsets\n   *\n   * @example\n   * ```ts\n   * getHorizontalScrollOffsets(rowEl?: HTMLElement, focusedCell?: HTMLElement): { left: number; right: number; skipScroll?: boolean } | undefined {\n   *   // Calculate total width of left-pinned columns\n   *   const leftCells = rowEl?.querySelectorAll('.sticky-left') ?? [];\n   *   let left = 0;\n   *   leftCells.forEach(el => { left += (el as HTMLElement).offsetWidth; });\n   *   // Skip scroll if focused cell is pinned (always visible)\n   *   const skipScroll = focusedCell?.classList.contains('sticky-left');\n   *   return { left, right: 0, skipScroll };\n   * }\n   * ```\n   */\n  getHorizontalScrollOffsets?(\n    rowEl?: HTMLElement,\n    focusedCell?: HTMLElement,\n  ): { left: number; right: number; skipScroll?: boolean } | undefined;\n\n  // #endregion\n\n  // #region Shell Integration Hooks\n\n  /**\n   * Register a tool panel for this plugin.\n   * Return undefined if plugin has no tool panel.\n   * The shell will create a toolbar toggle button and render the panel content\n   * when the user opens the panel.\n   *\n   * @returns Tool panel definition, or undefined if plugin has no panel\n   *\n   * @example\n   * ```ts\n   * getToolPanel(): ToolPanelDefinition | undefined {\n   *   return {\n   *     id: 'columns',\n   *     title: 'Columns',\n   *     icon: '☰',\n   *     tooltip: 'Show/hide columns',\n   *     order: 10,\n   *     render: (container) => {\n   *       this.renderColumnList(container);\n   *       return () => this.cleanup();\n   *     },\n   *   };\n   * }\n   * ```\n   */\n  getToolPanel?(): ToolPanelDefinition | undefined;\n\n  /**\n   * Register content for the shell header center section.\n   * Return undefined if plugin has no header content.\n   * Examples: search input, selection summary, status indicators.\n   *\n   * @returns Header content definition, or undefined if plugin has no header content\n   *\n   * @example\n   * ```ts\n   * getHeaderContent(): HeaderContentDefinition | undefined {\n   *   return {\n   *     id: 'quick-filter',\n   *     order: 10,\n   *     render: (container) => {\n   *       const input = document.createElement('input');\n   *       input.type = 'text';\n   *       input.placeholder = 'Search...';\n   *       input.addEventListener('input', this.handleInput);\n   *       container.appendChild(input);\n   *       return () => input.removeEventListener('input', this.handleInput);\n   *     },\n   *   };\n   * }\n   * ```\n   */\n  getHeaderContent?(): HeaderContentDefinition | undefined;\n\n  // #endregion\n}\n","/**\n * Shared Expander Column Utilities\n *\n * Provides a fixed expander column for plugins that need expand/collapse icons\n * (MasterDetail, Tree, RowGrouping). The column is:\n * - Always first in the grid\n * - Cannot be reordered (lockPosition: true)\n * - Has no header (empty string)\n * - Has no right border (borderless styling)\n * - Narrow width (just fits the icon)\n */\n\nimport type { ColumnConfig } from '../types';\n\n/** Special field name for the expander column */\nexport const EXPANDER_COLUMN_FIELD = '__tbw_expander';\n\n/** Default width for the expander column (pixels) */\nexport const EXPANDER_COLUMN_WIDTH = 32;\n\n/**\n * Marker interface for expander column renderers.\n * Used to detect if expander column is already present.\n */\nexport interface ExpanderColumnRenderer {\n  (ctx: any): HTMLElement;\n  __expanderColumn?: true;\n  /** Plugin name that created this expander */\n  __expanderPlugin?: string;\n}\n\n/**\n * Check if a column is an expander column.\n */\nexport function isExpanderColumn(column: ColumnConfig): boolean {\n  return column.field === EXPANDER_COLUMN_FIELD;\n}\n\n/**\n * Check if a column is a utility column (excluded from selection, clipboard, etc.).\n * Utility columns are non-data columns like expander columns.\n */\nexport function isUtilityColumn(column: ColumnConfig): boolean {\n  return column.meta?.utility === true;\n}\n\n/**\n * Find an existing expander column in the column array.\n */\nexport function findExpanderColumn(columns: readonly ColumnConfig[]): ColumnConfig | undefined {\n  return columns.find(isExpanderColumn);\n}\n\n/**\n * Create the base expander column config.\n * Plugins should add their own renderer to customize the expand icon behavior.\n *\n * @param pluginName - Name of the plugin creating the expander (for debugging)\n * @returns Base column config for the expander column\n */\nexport function createExpanderColumnConfig(pluginName: string): ColumnConfig {\n  return {\n    field: EXPANDER_COLUMN_FIELD as any,\n    header: '', // No header text - visually merges with next column\n    width: EXPANDER_COLUMN_WIDTH,\n    resizable: false,\n    sortable: false,\n    filterable: false, // No filter button for expander column\n    meta: {\n      lockPosition: true,\n      suppressMovable: true,\n      expanderColumn: true,\n      expanderPlugin: pluginName,\n      utility: true, // Marks this as a utility column (excluded from selection, clipboard, etc.)\n    },\n  };\n}\n\n/**\n * Create a container element for expand/collapse toggle icons.\n * Used by plugins to wrap their expand icons with consistent styling.\n *\n * @param expanded - Whether the item is currently expanded\n * @param pluginClass - CSS class prefix for the plugin (e.g., 'master-detail', 'tree')\n * @returns Container span element\n */\nexport function createExpanderContainer(expanded: boolean, pluginClass: string): HTMLSpanElement {\n  const container = document.createElement('span');\n  container.className = `${pluginClass}-expander expander-cell`;\n  if (expanded) {\n    container.classList.add('expanded');\n  }\n  return container;\n}\n\n/**\n * CSS styles for the expander column.\n * Plugins should include this in their styles to ensure consistent appearance.\n */\nexport const EXPANDER_COLUMN_STYLES = `\n/* Expander column data cells - always first, borderless right edge */\n.cell[data-field=\"${EXPANDER_COLUMN_FIELD}\"] {\n  border-right: none !important;\n  padding: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n/* Expander column header - completely hidden, no content, no border, no width contribution */\n.header-row .cell[data-field=\"${EXPANDER_COLUMN_FIELD}\"] {\n  visibility: hidden;\n  border: none !important;\n  padding: 0;\n  overflow: hidden;\n}\n\n/* The column after the expander should visually extend into the expander header space */\n.header-row .cell[data-field=\"${EXPANDER_COLUMN_FIELD}\"] + .cell {\n  /* Pull left to cover the hidden expander header */\n  margin-left: -${EXPANDER_COLUMN_WIDTH}px;\n  padding-left: calc(var(--tbw-cell-padding, 8px) + ${EXPANDER_COLUMN_WIDTH}px);\n}\n\n/* Expander cell contents */\n.expander-cell {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  height: 100%;\n  cursor: pointer;\n}\n`;\n","/**\n * Cell Range Selection Core Logic\n *\n * Pure functions for cell range selection operations.\n */\n\nimport type { InternalCellRange, CellRange } from './types';\n\n/**\n * Normalize a range so startRow/startCol are always <= endRow/endCol.\n * This handles cases where user drags from bottom-right to top-left.\n *\n * @param range - The range to normalize\n * @returns Normalized range with start <= end for both dimensions\n */\nexport function normalizeRange(range: InternalCellRange): InternalCellRange {\n  return {\n    startRow: Math.min(range.startRow, range.endRow),\n    startCol: Math.min(range.startCol, range.endCol),\n    endRow: Math.max(range.startRow, range.endRow),\n    endCol: Math.max(range.startCol, range.endCol),\n  };\n}\n\n/**\n * Convert an internal range to the public event format.\n *\n * @param range - The internal range to convert\n * @returns Public CellRange format with from/to coordinates\n */\nexport function toPublicRange(range: InternalCellRange): CellRange {\n  const normalized = normalizeRange(range);\n  return {\n    from: { row: normalized.startRow, col: normalized.startCol },\n    to: { row: normalized.endRow, col: normalized.endCol },\n  };\n}\n\n/**\n * Convert multiple internal ranges to public format.\n *\n * @param ranges - Array of internal ranges\n * @returns Array of public CellRange format\n */\nexport function toPublicRanges(ranges: InternalCellRange[]): CellRange[] {\n  return ranges.map(toPublicRange);\n}\n\n/**\n * Check if a cell is within a specific range.\n *\n * @param row - The row index to check\n * @param col - The column index to check\n * @param range - The range to check against\n * @returns True if the cell is within the range\n */\nexport function isCellInRange(row: number, col: number, range: InternalCellRange): boolean {\n  const normalized = normalizeRange(range);\n  return (\n    row >= normalized.startRow && row <= normalized.endRow && col >= normalized.startCol && col <= normalized.endCol\n  );\n}\n\n/**\n * Check if a cell is within any of the provided ranges.\n *\n * @param row - The row index to check\n * @param col - The column index to check\n * @param ranges - Array of ranges to check against\n * @returns True if the cell is within any range\n */\nexport function isCellInAnyRange(row: number, col: number, ranges: InternalCellRange[]): boolean {\n  return ranges.some((range) => isCellInRange(row, col, range));\n}\n\n/**\n * Get all cells within a range as an array of {row, col} objects.\n *\n * @param range - The range to enumerate\n * @returns Array of all cell coordinates in the range\n */\nexport function getCellsInRange(range: InternalCellRange): Array<{ row: number; col: number }> {\n  const cells: Array<{ row: number; col: number }> = [];\n  const normalized = normalizeRange(range);\n\n  for (let row = normalized.startRow; row <= normalized.endRow; row++) {\n    for (let col = normalized.startCol; col <= normalized.endCol; col++) {\n      cells.push({ row, col });\n    }\n  }\n\n  return cells;\n}\n\n/**\n * Get all unique cells across multiple ranges.\n * Deduplicates cells that appear in overlapping ranges.\n *\n * @param ranges - Array of ranges to enumerate\n * @returns Array of unique cell coordinates\n */\nexport function getAllCellsInRanges(ranges: InternalCellRange[]): Array<{ row: number; col: number }> {\n  const cellMap = new Map<string, { row: number; col: number }>();\n\n  for (const range of ranges) {\n    for (const cell of getCellsInRange(range)) {\n      cellMap.set(`${cell.row},${cell.col}`, cell);\n    }\n  }\n\n  return [...cellMap.values()];\n}\n\n/**\n * Merge overlapping or adjacent ranges into fewer ranges.\n * Simple implementation - returns ranges as-is for now.\n * More complex merging logic can be added later for optimization.\n *\n * @param ranges - Array of ranges to merge\n * @returns Merged array of ranges\n */\nexport function mergeRanges(ranges: InternalCellRange[]): InternalCellRange[] {\n  // Simple implementation - more complex merging can be added later\n  return ranges;\n}\n\n/**\n * Create a range from an anchor cell to a current cell position.\n * The range is not normalized - it preserves the direction of selection.\n *\n * @param anchor - The anchor cell (where selection started)\n * @param current - The current cell (where selection ends)\n * @returns An InternalCellRange from anchor to current\n */\nexport function createRangeFromAnchor(\n  anchor: { row: number; col: number },\n  current: { row: number; col: number }\n): InternalCellRange {\n  return {\n    startRow: anchor.row,\n    startCol: anchor.col,\n    endRow: current.row,\n    endCol: current.col,\n  };\n}\n\n/**\n * Calculate the number of cells in a range.\n *\n * @param range - The range to measure\n * @returns Total number of cells in the range\n */\nexport function getRangeCellCount(range: InternalCellRange): number {\n  const normalized = normalizeRange(range);\n  const rowCount = normalized.endRow - normalized.startRow + 1;\n  const colCount = normalized.endCol - normalized.startCol + 1;\n  return rowCount * colCount;\n}\n\n/**\n * Check if two ranges are equal (same boundaries).\n *\n * @param a - First range\n * @param b - Second range\n * @returns True if ranges have same boundaries after normalization\n */\nexport function rangesEqual(a: InternalCellRange, b: InternalCellRange): boolean {\n  const normA = normalizeRange(a);\n  const normB = normalizeRange(b);\n  return (\n    normA.startRow === normB.startRow &&\n    normA.startCol === normB.startCol &&\n    normA.endRow === normB.endRow &&\n    normA.endCol === normB.endCol\n  );\n}\n\n/**\n * Check if a range is a single cell (1x1).\n *\n * @param range - The range to check\n * @returns True if the range is exactly one cell\n */\nexport function isSingleCell(range: InternalCellRange): boolean {\n  const normalized = normalizeRange(range);\n  return normalized.startRow === normalized.endRow && normalized.startCol === normalized.endCol;\n}\n","/**\n * Selection Plugin (Class-based)\n *\n * Provides selection functionality for tbw-grid.\n * Supports three modes:\n * - 'cell': Single cell selection (default). No border, just focus highlight.\n * - 'row': Row selection. Clicking a cell selects the entire row.\n * - 'range': Range selection. Shift+click or drag to select rectangular cell ranges.\n */\n\nimport { clearCellFocus, getRowIndexFromCell } from '../../core/internal/utils';\nimport type { GridElement, PluginManifest, PluginQuery } from '../../core/plugin/base-plugin';\nimport { BaseGridPlugin, CellClickEvent, CellMouseEvent } from '../../core/plugin/base-plugin';\nimport { isExpanderColumn, isUtilityColumn } from '../../core/plugin/expander-column';\nimport type { ColumnConfig } from '../../core/types';\nimport {\n  createRangeFromAnchor,\n  getAllCellsInRanges,\n  isCellInAnyRange,\n  normalizeRange,\n  rangesEqual,\n  toPublicRanges,\n} from './range-selection';\nimport styles from './selection.css?inline';\nimport type {\n  CellRange,\n  InternalCellRange,\n  SelectionChangeDetail,\n  SelectionConfig,\n  SelectionMode,\n  SelectionResult,\n} from './types';\n\n/** Special field name for the selection checkbox column */\nconst CHECKBOX_COLUMN_FIELD = '__tbw_checkbox';\n\n/**\n * Build the selection change event detail for the current state.\n */\nfunction buildSelectionEvent(\n  mode: SelectionMode,\n  state: {\n    selectedCell: { row: number; col: number } | null;\n    selected: Set<number>;\n    ranges: InternalCellRange[];\n  },\n  colCount: number,\n): SelectionChangeDetail {\n  if (mode === 'cell' && state.selectedCell) {\n    return {\n      mode,\n      ranges: [\n        {\n          from: { row: state.selectedCell.row, col: state.selectedCell.col },\n          to: { row: state.selectedCell.row, col: state.selectedCell.col },\n        },\n      ],\n    };\n  }\n\n  if (mode === 'row' && state.selected.size > 0) {\n    // Sort rows and merge contiguous indices into minimal ranges\n    const sorted = [...state.selected].sort((a, b) => a - b);\n    const ranges: CellRange[] = [];\n    let start = sorted[0];\n    let end = start;\n    for (let i = 1; i < sorted.length; i++) {\n      if (sorted[i] === end + 1) {\n        end = sorted[i];\n      } else {\n        ranges.push({ from: { row: start, col: 0 }, to: { row: end, col: colCount - 1 } });\n        start = sorted[i];\n        end = start;\n      }\n    }\n    ranges.push({ from: { row: start, col: 0 }, to: { row: end, col: colCount - 1 } });\n    return { mode, ranges };\n  }\n\n  if (mode === 'range' && state.ranges.length > 0) {\n    return { mode, ranges: toPublicRanges(state.ranges) };\n  }\n\n  return { mode, ranges: [] };\n}\n\n/**\n * Selection Plugin for tbw-grid\n *\n * Adds cell, row, and range selection capabilities to the grid with full keyboard support.\n * Whether you need simple cell highlighting or complex multi-range selections, this plugin has you covered.\n *\n * ## Installation\n *\n * ```ts\n * import { SelectionPlugin } from '@toolbox-web/grid/plugins/selection';\n * ```\n *\n * ## Selection Modes\n *\n * Configure the plugin with one of three modes via {@link SelectionConfig}:\n *\n * - **`'cell'`** - Single cell selection (default). Click cells to select individually.\n * - **`'row'`** - Full row selection. Click anywhere in a row to select the entire row.\n * - **`'range'`** - Rectangular selection. Click and drag or Shift+Click to select ranges.\n *\n * ## Keyboard Shortcuts\n *\n * | Shortcut | Action |\n * |----------|--------|\n * | `Arrow Keys` | Move selection |\n * | `Shift + Arrow` | Extend selection (range mode) |\n * | `Ctrl/Cmd + Click` | Toggle selection (multi-select) |\n * | `Shift + Click` | Extend to clicked cell/row |\n * | `Ctrl/Cmd + A` | Select all (range mode) |\n * | `Escape` | Clear selection |\n *\n * > **Note:** When `multiSelect: false`, Ctrl/Shift modifiers are ignored —\n * > clicks always select a single item.\n *\n * ## CSS Custom Properties\n *\n * | Property | Description |\n * |----------|-------------|\n * | `--tbw-focus-background` | Focused row background |\n * | `--tbw-range-selection-bg` | Range selection fill |\n * | `--tbw-range-border-color` | Range selection border |\n *\n * @example Basic row selection\n * ```ts\n * grid.gridConfig = {\n *   columns: [...],\n *   plugins: [new SelectionPlugin({ mode: 'row' })],\n * };\n * ```\n *\n * @example Range selection with event handling\n * ```ts\n * grid.gridConfig = {\n *   plugins: [new SelectionPlugin({ mode: 'range' })],\n * };\n *\n * grid.addEventListener('selection-change', (e) => {\n *   const { mode, ranges } = e.detail;\n *   console.log(`Selected ${ranges.length} ranges in ${mode} mode`);\n * });\n * ```\n *\n * @example Programmatic selection control\n * ```ts\n * const plugin = grid.getPlugin(SelectionPlugin);\n *\n * // Get current selection\n * const selection = plugin.getSelection();\n * console.log(selection.ranges);\n *\n * // Set selection programmatically\n * plugin.setRanges([{ from: { row: 0, col: 0 }, to: { row: 5, col: 3 } }]);\n *\n * // Clear all selection\n * plugin.clearSelection();\n * ```\n *\n * @see {@link SelectionMode} for detailed mode descriptions\n * @see {@link SelectionConfig} for configuration options\n * @see {@link SelectionResult} for the selection result structure\n * @see [Live Demos](?path=/docs/grid-plugins-selection--docs) for interactive examples\n */\nexport class SelectionPlugin extends BaseGridPlugin<SelectionConfig> {\n  /**\n   * Plugin manifest - declares queries and configuration validation rules.\n   * @internal\n   */\n  static override readonly manifest: PluginManifest<SelectionConfig> = {\n    queries: [\n      { type: 'getSelection', description: 'Get the current selection state' },\n      { type: 'selectRows', description: 'Select specific rows by index (row mode only)' },\n      { type: 'getSelectedRowIndices', description: 'Get sorted array of selected row indices' },\n      { type: 'getSelectedRows', description: 'Get actual row objects for the current selection (works in all modes)' },\n    ],\n    configRules: [\n      {\n        id: 'selection/range-dblclick',\n        severity: 'warn',\n        message:\n          `\"triggerOn: 'dblclick'\" has no effect when mode is \"range\".\\n` +\n          `  → Range selection uses drag interaction (mousedown → mousemove), not click events.\\n` +\n          `  → The \"triggerOn\" option only affects \"cell\" and \"row\" selection modes.`,\n        check: (config) => config.mode === 'range' && config.triggerOn === 'dblclick',\n      },\n    ],\n  };\n\n  /** @internal */\n  readonly name = 'selection';\n  /** @internal */\n  override readonly styles = styles;\n\n  /** @internal */\n  protected override get defaultConfig(): Partial<SelectionConfig> {\n    return {\n      mode: 'cell',\n      triggerOn: 'click',\n      enabled: true,\n      multiSelect: true,\n    };\n  }\n\n  // #region Internal State\n  /** Row selection state (row mode) */\n  private selected = new Set<number>();\n  private lastSelected: number | null = null;\n  private anchor: number | null = null;\n\n  /** Range selection state (range mode) */\n  private ranges: InternalCellRange[] = [];\n  private activeRange: InternalCellRange | null = null;\n  private cellAnchor: { row: number; col: number } | null = null;\n  private isDragging = false;\n\n  /** Pending keyboard navigation update (processed in afterRender) */\n  private pendingKeyboardUpdate: { shiftKey: boolean } | null = null;\n\n  /** Cell selection state (cell mode) */\n  private selectedCell: { row: number; col: number } | null = null;\n\n  /** Last synced focus row — used to detect when grid focus moves so selection follows */\n  private lastSyncedFocusRow = -1;\n  /** Last synced focus col (cell mode) */\n  private lastSyncedFocusCol = -1;\n\n  /** True when selection was explicitly set (click/keyboard) — prevents #syncSelectionToFocus from overwriting */\n  private explicitSelection = false;\n\n  // #endregion\n\n  // #region Private Helpers - Selection Enabled Check\n\n  /**\n   * Check if selection is enabled at the grid level.\n   * Grid-wide `selectable: false` or plugin's `enabled: false` disables all selection.\n   */\n  private isSelectionEnabled(): boolean {\n    // Check plugin config first\n    if (this.config.enabled === false) return false;\n    // Check grid-level config\n    return this.grid.effectiveConfig?.selectable !== false;\n  }\n\n  // #endregion\n\n  // #region Private Helpers - Selectability\n\n  /**\n   * Check if a row/cell is selectable.\n   * Returns true if selectable, false if not.\n   */\n  private checkSelectable(rowIndex: number, colIndex?: number): boolean {\n    const { isSelectable } = this.config;\n    if (!isSelectable) return true; // No callback = all selectable\n\n    const row = this.rows[rowIndex];\n    if (!row) return false;\n\n    const column = colIndex !== undefined ? this.columns[colIndex] : undefined;\n    return isSelectable(row, rowIndex, column, colIndex);\n  }\n\n  /**\n   * Check if an entire row is selectable (for row mode).\n   */\n  private isRowSelectable(rowIndex: number): boolean {\n    return this.checkSelectable(rowIndex);\n  }\n\n  /**\n   * Check if a cell is selectable (for cell/range modes).\n   */\n  private isCellSelectable(rowIndex: number, colIndex: number): boolean {\n    return this.checkSelectable(rowIndex, colIndex);\n  }\n\n  // #endregion\n\n  // #region Lifecycle\n\n  /** @internal */\n  override attach(grid: GridElement): void {\n    super.attach(grid);\n\n    // Subscribe to events that invalidate selection\n    // When rows change due to filtering/grouping/tree operations, selection indices become invalid\n    this.on('filter-applied', () => this.clearSelectionSilent());\n    this.on('grouping-state-change', () => this.clearSelectionSilent());\n    this.on('tree-state-change', () => this.clearSelectionSilent());\n  }\n\n  /**\n   * Handle queries from other plugins.\n   * @internal\n   */\n  override handleQuery(query: PluginQuery): unknown {\n    if (query.type === 'getSelection') {\n      return this.getSelection();\n    }\n    if (query.type === 'getSelectedRowIndices') {\n      return this.getSelectedRowIndices();\n    }\n    if (query.type === 'getSelectedRows') {\n      return this.getSelectedRows();\n    }\n    if (query.type === 'selectRows') {\n      this.selectRows(query.context as number[]);\n      return true;\n    }\n    return undefined;\n  }\n\n  /** @internal */\n  override detach(): void {\n    this.selected.clear();\n    this.ranges = [];\n    this.activeRange = null;\n    this.cellAnchor = null;\n    this.isDragging = false;\n    this.selectedCell = null;\n    this.pendingKeyboardUpdate = null;\n    this.lastSyncedFocusRow = -1;\n    this.lastSyncedFocusCol = -1;\n  }\n\n  /**\n   * Clear selection without emitting an event.\n   * Used when selection is invalidated by external changes (filtering, grouping, etc.)\n   */\n  private clearSelectionSilent(): void {\n    this.selected.clear();\n    this.ranges = [];\n    this.activeRange = null;\n    this.cellAnchor = null;\n    this.selectedCell = null;\n    this.lastSelected = null;\n    this.anchor = null;\n    this.lastSyncedFocusRow = -1;\n    this.lastSyncedFocusCol = -1;\n    this.requestAfterRender();\n  }\n\n  // #endregion\n\n  // #region Event Handlers\n\n  /** @internal */\n  override onCellClick(event: CellClickEvent): boolean {\n    // Skip all selection if disabled at grid level or plugin level\n    if (!this.isSelectionEnabled()) return false;\n\n    const { rowIndex, colIndex, originalEvent } = event;\n    const { mode, triggerOn = 'click' } = this.config;\n\n    // Skip if event type doesn't match configured trigger\n    // This allows dblclick mode to only select on double-click\n    if (originalEvent.type !== triggerOn) {\n      return false;\n    }\n\n    // Check if this is a utility column (expander columns, etc.)\n    const column = this.columns[colIndex];\n    const isUtility = column && isUtilityColumn(column);\n\n    // CELL MODE: Single cell selection - skip utility columns and non-selectable cells\n    if (mode === 'cell') {\n      if (isUtility) {\n        return false; // Allow event to propagate, but don't select utility cells\n      }\n      if (!this.isCellSelectable(rowIndex, colIndex)) {\n        return false; // Cell is not selectable\n      }\n      // Only emit if selection actually changed\n      const currentCell = this.selectedCell;\n      if (currentCell && currentCell.row === rowIndex && currentCell.col === colIndex) {\n        return false; // Same cell already selected\n      }\n      this.selectedCell = { row: rowIndex, col: colIndex };\n      this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n      this.requestAfterRender();\n      return false;\n    }\n\n    // ROW MODE: Multi-select with Shift/Ctrl, checkbox toggle, or single select\n    if (mode === 'row') {\n      if (!this.isRowSelectable(rowIndex)) {\n        return false; // Row is not selectable\n      }\n\n      const multiSelect = this.config.multiSelect !== false;\n      const shiftKey = originalEvent.shiftKey && multiSelect;\n      const ctrlKey = (originalEvent.ctrlKey || originalEvent.metaKey) && multiSelect;\n      const isCheckbox = column?.meta?.checkboxColumn === true;\n\n      if (shiftKey && this.anchor !== null) {\n        // Shift+Click: Range select from anchor to clicked row\n        const start = Math.min(this.anchor, rowIndex);\n        const end = Math.max(this.anchor, rowIndex);\n        if (!ctrlKey) {\n          this.selected.clear();\n        }\n        for (let i = start; i <= end; i++) {\n          if (this.isRowSelectable(i)) {\n            this.selected.add(i);\n          }\n        }\n      } else if (ctrlKey || (isCheckbox && multiSelect)) {\n        // Ctrl+Click or checkbox click: Toggle individual row\n        if (this.selected.has(rowIndex)) {\n          this.selected.delete(rowIndex);\n        } else {\n          this.selected.add(rowIndex);\n        }\n        this.anchor = rowIndex;\n      } else {\n        // Plain click (or any click when multiSelect is false): select only clicked row\n        if (this.selected.size === 1 && this.selected.has(rowIndex)) {\n          return false; // Same row already selected\n        }\n        this.selected.clear();\n        this.selected.add(rowIndex);\n        this.anchor = rowIndex;\n      }\n\n      this.lastSelected = rowIndex;\n      this.explicitSelection = true;\n      this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n      this.requestAfterRender();\n      return false;\n    }\n\n    // RANGE MODE: Shift+click extends selection, click starts new\n    if (mode === 'range') {\n      // Skip utility columns in range mode - don't start selection from them\n      if (isUtility) {\n        return false;\n      }\n\n      // Skip non-selectable cells in range mode\n      if (!this.isCellSelectable(rowIndex, colIndex)) {\n        return false;\n      }\n\n      const shiftKey = originalEvent.shiftKey;\n      const ctrlKey = (originalEvent.ctrlKey || originalEvent.metaKey) && this.config.multiSelect !== false;\n\n      if (shiftKey && this.cellAnchor) {\n        // Extend selection from anchor\n        const newRange = createRangeFromAnchor(this.cellAnchor, { row: rowIndex, col: colIndex });\n\n        // Check if range actually changed\n        const currentRange = this.ranges.length > 0 ? this.ranges[this.ranges.length - 1] : null;\n        if (currentRange && rangesEqual(currentRange, newRange)) {\n          return false; // Same range already selected\n        }\n\n        if (ctrlKey) {\n          if (this.ranges.length > 0) {\n            this.ranges[this.ranges.length - 1] = newRange;\n          } else {\n            this.ranges.push(newRange);\n          }\n        } else {\n          this.ranges = [newRange];\n        }\n        this.activeRange = newRange;\n      } else if (ctrlKey) {\n        const newRange: InternalCellRange = {\n          startRow: rowIndex,\n          startCol: colIndex,\n          endRow: rowIndex,\n          endCol: colIndex,\n        };\n        this.ranges.push(newRange);\n        this.activeRange = newRange;\n        this.cellAnchor = { row: rowIndex, col: colIndex };\n      } else {\n        // Plain click - check if same single-cell range already selected\n        const newRange: InternalCellRange = {\n          startRow: rowIndex,\n          startCol: colIndex,\n          endRow: rowIndex,\n          endCol: colIndex,\n        };\n\n        // Only emit if selection actually changed\n        if (this.ranges.length === 1 && rangesEqual(this.ranges[0], newRange)) {\n          return false; // Same cell already selected\n        }\n\n        this.ranges = [newRange];\n        this.activeRange = newRange;\n        this.cellAnchor = { row: rowIndex, col: colIndex };\n      }\n\n      this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n\n      this.requestAfterRender();\n      return false;\n    }\n\n    return false;\n  }\n\n  /** @internal */\n  override onKeyDown(event: KeyboardEvent): boolean {\n    // Skip all selection if disabled at grid level or plugin level\n    if (!this.isSelectionEnabled()) return false;\n\n    const { mode } = this.config;\n    const navKeys = ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight', 'Tab', 'Home', 'End', 'PageUp', 'PageDown'];\n    const isNavKey = navKeys.includes(event.key);\n\n    // Escape clears selection in all modes\n    // But if editing is active, let the EditingPlugin handle Escape first\n    if (event.key === 'Escape') {\n      const isEditing = this.grid.query<boolean>('isEditing');\n      if (isEditing.some(Boolean)) {\n        return false; // Defer to EditingPlugin to cancel the active edit\n      }\n\n      if (mode === 'cell') {\n        this.selectedCell = null;\n      } else if (mode === 'row') {\n        this.selected.clear();\n        this.anchor = null;\n      } else if (mode === 'range') {\n        this.ranges = [];\n        this.activeRange = null;\n        this.cellAnchor = null;\n      }\n      this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n      this.requestAfterRender();\n      return true;\n    }\n\n    // CELL MODE: Selection follows focus (but respects selectability)\n    if (mode === 'cell' && isNavKey) {\n      // Use queueMicrotask so grid's handler runs first and updates focusRow/focusCol\n      queueMicrotask(() => {\n        const focusRow = this.grid._focusRow;\n        const focusCol = this.grid._focusCol;\n        // Only select if the cell is selectable\n        if (this.isCellSelectable(focusRow, focusCol)) {\n          this.selectedCell = { row: focusRow, col: focusCol };\n        } else {\n          // Clear selection when navigating to non-selectable cell\n          this.selectedCell = null;\n        }\n        this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n        this.requestAfterRender();\n      });\n      return false; // Let grid handle navigation\n    }\n\n    // ROW MODE: Arrow keys move selection, Shift+Arrow extends, Ctrl+A selects all\n    if (mode === 'row') {\n      const multiSelect = this.config.multiSelect !== false;\n\n      if (event.key === 'ArrowUp' || event.key === 'ArrowDown') {\n        const shiftKey = event.shiftKey && multiSelect;\n\n        // Set anchor before grid moves focus\n        if (shiftKey && this.anchor === null) {\n          this.anchor = this.grid._focusRow;\n        }\n\n        // Let grid move focus first, then sync row selection\n        queueMicrotask(() => {\n          const focusRow = this.grid._focusRow;\n\n          if (shiftKey && this.anchor !== null) {\n            // Shift+Arrow: Extend selection from anchor\n            this.selected.clear();\n            const start = Math.min(this.anchor, focusRow);\n            const end = Math.max(this.anchor, focusRow);\n            for (let i = start; i <= end; i++) {\n              if (this.isRowSelectable(i)) {\n                this.selected.add(i);\n              }\n            }\n          } else {\n            // Plain arrow: Single select\n            if (this.isRowSelectable(focusRow)) {\n              this.selected.clear();\n              this.selected.add(focusRow);\n              this.anchor = focusRow;\n            } else {\n              this.selected.clear();\n            }\n          }\n\n          this.lastSelected = focusRow;\n          this.explicitSelection = true;\n          this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n          this.requestAfterRender();\n        });\n        return false; // Let grid handle navigation\n      }\n\n      // Ctrl+A: Select all rows (skip when editing, skip when single-select)\n      if (multiSelect && event.key === 'a' && (event.ctrlKey || event.metaKey)) {\n        const isEditing = this.grid.query<boolean>('isEditing');\n        if (isEditing.some(Boolean)) return false;\n        event.preventDefault();\n        event.stopPropagation();\n        this.selectAll();\n        return true;\n      }\n    }\n\n    // RANGE MODE: Shift+Arrow extends, plain Arrow resets\n    // Tab key always navigates without extending (even with Shift)\n    if (mode === 'range' && isNavKey) {\n      // Tab should not extend selection - it just navigates to the next/previous cell\n      const isTabKey = event.key === 'Tab';\n      const shouldExtend = event.shiftKey && !isTabKey;\n\n      // Capture anchor BEFORE grid moves focus (synchronous)\n      // This ensures the anchor is the starting point, not the destination\n      if (shouldExtend && !this.cellAnchor) {\n        this.cellAnchor = { row: this.grid._focusRow, col: this.grid._focusCol };\n      }\n\n      // Mark pending update - will be processed in afterRender when grid updates focus\n      this.pendingKeyboardUpdate = { shiftKey: shouldExtend };\n\n      // Schedule afterRender to run after grid's keyboard handler completes\n      // Grid's refreshVirtualWindow(false) skips afterRender for performance,\n      // so we explicitly request it to process pendingKeyboardUpdate\n      queueMicrotask(() => this.requestAfterRender());\n\n      return false; // Let grid handle navigation\n    }\n\n    // Ctrl+A selects all in range mode (skip when editing, skip when single-select)\n    if (\n      mode === 'range' &&\n      this.config.multiSelect !== false &&\n      event.key === 'a' &&\n      (event.ctrlKey || event.metaKey)\n    ) {\n      const isEditing = this.grid.query<boolean>('isEditing');\n      if (isEditing.some(Boolean)) return false;\n      event.preventDefault();\n      event.stopPropagation();\n      this.selectAll();\n      return true;\n    }\n\n    return false;\n  }\n\n  /** @internal */\n  override onCellMouseDown(event: CellMouseEvent): boolean | void {\n    // Skip all selection if disabled at grid level or plugin level\n    if (!this.isSelectionEnabled()) return;\n\n    if (this.config.mode !== 'range') return;\n    if (event.rowIndex === undefined || event.colIndex === undefined) return;\n    if (event.rowIndex < 0) return; // Header\n\n    // Skip utility columns (expander columns, etc.)\n    const column = this.columns[event.colIndex];\n    if (column && isUtilityColumn(column)) {\n      return; // Don't start selection on utility columns\n    }\n\n    // Skip non-selectable cells - don't start drag from them\n    if (!this.isCellSelectable(event.rowIndex, event.colIndex)) {\n      return;\n    }\n\n    // Let onCellClick handle shift+click for range extension\n    if (event.originalEvent.shiftKey && this.cellAnchor) {\n      return;\n    }\n\n    // Start drag selection\n    this.isDragging = true;\n    const rowIndex = event.rowIndex;\n    const colIndex = event.colIndex;\n\n    // When multiSelect is false, Ctrl+click starts a new single range instead of adding\n    const ctrlKey = (event.originalEvent.ctrlKey || event.originalEvent.metaKey) && this.config.multiSelect !== false;\n\n    const newRange: InternalCellRange = {\n      startRow: rowIndex,\n      startCol: colIndex,\n      endRow: rowIndex,\n      endCol: colIndex,\n    };\n\n    // Check if selection is actually changing (for non-Ctrl clicks)\n    if (!ctrlKey && this.ranges.length === 1 && rangesEqual(this.ranges[0], newRange)) {\n      // Same cell already selected, just update anchor for potential drag\n      this.cellAnchor = { row: rowIndex, col: colIndex };\n      return true;\n    }\n\n    this.cellAnchor = { row: rowIndex, col: colIndex };\n\n    if (!ctrlKey) {\n      this.ranges = [];\n    }\n\n    this.ranges.push(newRange);\n    this.activeRange = newRange;\n\n    this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n    this.requestAfterRender();\n    return true;\n  }\n\n  /** @internal */\n  override onCellMouseMove(event: CellMouseEvent): boolean | void {\n    // Skip all selection if disabled at grid level or plugin level\n    if (!this.isSelectionEnabled()) return;\n\n    if (this.config.mode !== 'range') return;\n    if (!this.isDragging || !this.cellAnchor) return;\n    if (event.rowIndex === undefined || event.colIndex === undefined) return;\n    if (event.rowIndex < 0) return;\n\n    // When dragging, clamp to first data column (skip utility columns)\n    let targetCol = event.colIndex;\n    const column = this.columns[targetCol];\n    if (column && isUtilityColumn(column)) {\n      // Find the first non-utility column\n      const firstDataCol = this.columns.findIndex((col) => !isUtilityColumn(col));\n      if (firstDataCol >= 0) {\n        targetCol = firstDataCol;\n      }\n    }\n\n    const newRange = createRangeFromAnchor(this.cellAnchor, { row: event.rowIndex, col: targetCol });\n\n    // Only update and emit if the range actually changed\n    const currentRange = this.ranges.length > 0 ? this.ranges[this.ranges.length - 1] : null;\n    if (currentRange && rangesEqual(currentRange, newRange)) {\n      return true; // Range unchanged, no need to update\n    }\n\n    if (this.ranges.length > 0) {\n      this.ranges[this.ranges.length - 1] = newRange;\n    } else {\n      this.ranges.push(newRange);\n    }\n    this.activeRange = newRange;\n\n    this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n    this.requestAfterRender();\n    return true;\n  }\n\n  /** @internal */\n  override onCellMouseUp(_event: CellMouseEvent): boolean | void {\n    // Skip all selection if disabled at grid level or plugin level\n    if (!this.isSelectionEnabled()) return;\n\n    if (this.config.mode !== 'range') return;\n    if (this.isDragging) {\n      this.isDragging = false;\n      return true;\n    }\n  }\n\n  // #region Checkbox Column\n\n  /**\n   * Inject checkbox column when `checkbox: true` and mode is `'row'`.\n   * @internal\n   */\n  override processColumns(columns: ColumnConfig[]): ColumnConfig[] {\n    if (this.config.checkbox && this.config.mode === 'row') {\n      // Check if checkbox column already exists\n      if (columns.some((col) => col.field === CHECKBOX_COLUMN_FIELD)) {\n        return columns;\n      }\n      const checkboxCol = this.#createCheckboxColumn();\n      // Insert after expander column if present, otherwise first\n      const expanderIdx = columns.findIndex(isExpanderColumn);\n      const insertAt = expanderIdx >= 0 ? expanderIdx + 1 : 0;\n      return [...columns.slice(0, insertAt), checkboxCol, ...columns.slice(insertAt)];\n    }\n    return columns;\n  }\n\n  /**\n   * Create the checkbox utility column configuration.\n   */\n  #createCheckboxColumn(): ColumnConfig {\n    return {\n      field: CHECKBOX_COLUMN_FIELD,\n      header: '',\n      width: 32,\n      resizable: false,\n      sortable: false,\n      meta: {\n        lockPosition: true,\n        suppressMovable: true,\n        utility: true,\n        checkboxColumn: true,\n      },\n      headerRenderer: () => {\n        const container = document.createElement('div');\n        container.className = 'tbw-checkbox-header';\n        // Hide \"select all\" checkbox in single-select mode\n        if (this.config.multiSelect === false) return container;\n        const checkbox = document.createElement('input');\n        checkbox.type = 'checkbox';\n        checkbox.className = 'tbw-select-all-checkbox';\n        checkbox.addEventListener('click', (e) => {\n          e.stopPropagation(); // Prevent header sort\n          if ((e.target as HTMLInputElement).checked) {\n            this.selectAll();\n          } else {\n            this.clearSelection();\n          }\n        });\n        container.appendChild(checkbox);\n        return container;\n      },\n      renderer: (ctx) => {\n        const checkbox = document.createElement('input');\n        checkbox.type = 'checkbox';\n        checkbox.className = 'tbw-select-row-checkbox';\n        // Set initial checked state from current selection\n        const cellEl = ctx.cellEl;\n        if (cellEl) {\n          const rowIndex = parseInt(cellEl.getAttribute('data-row') ?? '-1', 10);\n          if (rowIndex >= 0) {\n            checkbox.checked = this.selected.has(rowIndex);\n          }\n        }\n        return checkbox;\n      },\n    };\n  }\n\n  /**\n   * Update checkbox checked states to reflect current selection.\n   * Called from #applySelectionClasses.\n   */\n  #updateCheckboxStates(gridEl: HTMLElement): void {\n    // Update row checkboxes\n    const rowCheckboxes = gridEl.querySelectorAll('.tbw-select-row-checkbox') as NodeListOf<HTMLInputElement>;\n    rowCheckboxes.forEach((checkbox) => {\n      const cell = checkbox.closest('.cell');\n      const rowIndex = cell ? getRowIndexFromCell(cell) : -1;\n      if (rowIndex >= 0) {\n        checkbox.checked = this.selected.has(rowIndex);\n      }\n    });\n\n    // Update header select-all checkbox\n    const headerCheckbox = gridEl.querySelector('.tbw-select-all-checkbox') as HTMLInputElement | null;\n    if (headerCheckbox) {\n      const rowCount = this.rows.length;\n      let selectableCount = 0;\n      if (this.config.isSelectable) {\n        for (let i = 0; i < rowCount; i++) {\n          if (this.isRowSelectable(i)) selectableCount++;\n        }\n      } else {\n        selectableCount = rowCount;\n      }\n      const allSelected = selectableCount > 0 && this.selected.size >= selectableCount;\n      const someSelected = this.selected.size > 0;\n      headerCheckbox.checked = allSelected;\n      headerCheckbox.indeterminate = someSelected && !allSelected;\n    }\n  }\n\n  // #endregion\n\n  /**\n   * Sync selection state to the grid's current focus position.\n   * In row mode, keeps `selected` in sync with `_focusRow`.\n   * In cell mode, keeps `selectedCell` in sync with `_focusRow`/`_focusCol`.\n   * Only updates when the focus has changed since the last sync.\n   * Skips when `explicitSelection` is set (click/keyboard set selection directly).\n   */\n  #syncSelectionToFocus(mode: string): void {\n    const focusRow = this.grid._focusRow;\n    const focusCol = this.grid._focusCol;\n\n    if (mode === 'row') {\n      // Skip auto-sync when selection was explicitly set (Shift/Ctrl click, keyboard)\n      if (this.explicitSelection) {\n        this.explicitSelection = false;\n        this.lastSyncedFocusRow = focusRow;\n        return;\n      }\n\n      if (focusRow !== this.lastSyncedFocusRow) {\n        this.lastSyncedFocusRow = focusRow;\n        if (this.isRowSelectable(focusRow)) {\n          if (!this.selected.has(focusRow) || this.selected.size !== 1) {\n            this.selected.clear();\n            this.selected.add(focusRow);\n            this.lastSelected = focusRow;\n            this.anchor = focusRow;\n            this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n          }\n        }\n      }\n    }\n\n    if (mode === 'cell') {\n      if (this.explicitSelection) {\n        this.explicitSelection = false;\n        this.lastSyncedFocusRow = focusRow;\n        this.lastSyncedFocusCol = focusCol;\n        return;\n      }\n\n      if (focusRow !== this.lastSyncedFocusRow || focusCol !== this.lastSyncedFocusCol) {\n        this.lastSyncedFocusRow = focusRow;\n        this.lastSyncedFocusCol = focusCol;\n        if (this.isCellSelectable(focusRow, focusCol)) {\n          const cur = this.selectedCell;\n          if (!cur || cur.row !== focusRow || cur.col !== focusCol) {\n            this.selectedCell = { row: focusRow, col: focusCol };\n            this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n          }\n        }\n      }\n    }\n  }\n\n  /**\n   * Apply CSS selection classes to row/cell elements.\n   * Shared by afterRender and onScrollRender.\n   */\n  #applySelectionClasses(): void {\n    const gridEl = this.gridElement;\n    if (!gridEl) return;\n\n    const { mode } = this.config;\n    const hasSelectableCallback = !!this.config.isSelectable;\n\n    // Clear all selection classes first\n    const allCells = gridEl.querySelectorAll('.cell');\n    allCells.forEach((cell) => {\n      cell.classList.remove('selected', 'top', 'bottom', 'first', 'last');\n      // Clear selectable attribute - will be re-applied below\n      if (hasSelectableCallback) {\n        cell.removeAttribute('data-selectable');\n      }\n    });\n\n    const allRows = gridEl.querySelectorAll('.data-grid-row');\n    allRows.forEach((row) => {\n      row.classList.remove('selected', 'row-focus');\n      // Clear selectable attribute - will be re-applied below\n      if (hasSelectableCallback) {\n        row.removeAttribute('data-selectable');\n      }\n    });\n\n    // ROW MODE: Add row-focus class to selected rows, disable cell-focus, update checkboxes\n    if (mode === 'row') {\n      // In row mode, disable ALL cell-focus styling - row selection takes precedence\n      clearCellFocus(gridEl);\n\n      allRows.forEach((row) => {\n        const firstCell = row.querySelector('.cell[data-row]');\n        const rowIndex = getRowIndexFromCell(firstCell);\n        if (rowIndex >= 0) {\n          // Mark non-selectable rows\n          if (hasSelectableCallback && !this.isRowSelectable(rowIndex)) {\n            row.setAttribute('data-selectable', 'false');\n          }\n          if (this.selected.has(rowIndex)) {\n            row.classList.add('selected', 'row-focus');\n          }\n        }\n      });\n\n      // Update checkbox states if checkbox column is enabled\n      if (this.config.checkbox) {\n        this.#updateCheckboxStates(gridEl);\n      }\n    }\n\n    // CELL/RANGE MODE: Mark non-selectable cells\n    if ((mode === 'cell' || mode === 'range') && hasSelectableCallback) {\n      const cells = gridEl.querySelectorAll('.cell[data-row][data-col]');\n      cells.forEach((cell) => {\n        const rowIndex = parseInt(cell.getAttribute('data-row') ?? '-1', 10);\n        const colIndex = parseInt(cell.getAttribute('data-col') ?? '-1', 10);\n        if (rowIndex >= 0 && colIndex >= 0) {\n          if (!this.isCellSelectable(rowIndex, colIndex)) {\n            cell.setAttribute('data-selectable', 'false');\n          }\n        }\n      });\n    }\n\n    // RANGE MODE: Add selected and edge classes to cells\n    // Uses neighbor-based edge detection for correct multi-range borders\n    if (mode === 'range' && this.ranges.length > 0) {\n      // Clear all cell-focus first - selection plugin manages focus styling in range mode\n      clearCellFocus(gridEl);\n\n      // Pre-normalize ranges for efficient neighbor checks\n      const normalizedRanges = this.ranges.map(normalizeRange);\n\n      // Fast selection check against pre-normalized ranges\n      const isInSelection = (r: number, c: number): boolean => {\n        for (const range of normalizedRanges) {\n          if (r >= range.startRow && r <= range.endRow && c >= range.startCol && c <= range.endCol) {\n            return true;\n          }\n        }\n        return false;\n      };\n\n      const cells = gridEl.querySelectorAll('.cell[data-row][data-col]');\n      cells.forEach((cell) => {\n        const rowIndex = parseInt(cell.getAttribute('data-row') ?? '-1', 10);\n        const colIndex = parseInt(cell.getAttribute('data-col') ?? '-1', 10);\n        if (rowIndex >= 0 && colIndex >= 0) {\n          // Skip utility columns entirely - don't add any selection classes\n          const column = this.columns[colIndex];\n          if (column && isUtilityColumn(column)) {\n            return;\n          }\n\n          if (isInSelection(rowIndex, colIndex)) {\n            cell.classList.add('selected');\n\n            // Edge detection: add border class where neighbor is not selected\n            // This handles single ranges, multi-range, and irregular selections correctly\n            if (!isInSelection(rowIndex - 1, colIndex)) cell.classList.add('top');\n            if (!isInSelection(rowIndex + 1, colIndex)) cell.classList.add('bottom');\n            if (!isInSelection(rowIndex, colIndex - 1)) cell.classList.add('first');\n            if (!isInSelection(rowIndex, colIndex + 1)) cell.classList.add('last');\n          }\n        }\n      });\n    }\n\n    // CELL MODE: Let the grid's native .cell-focus styling handle cell highlighting\n    // No additional action needed - the grid already manages focus styling\n  }\n\n  /** @internal */\n  override afterRender(): void {\n    // Skip rendering selection if disabled at grid level or plugin level\n    if (!this.isSelectionEnabled()) return;\n\n    const gridEl = this.gridElement;\n    if (!gridEl) return;\n\n    const container = gridEl.children[0];\n    const { mode } = this.config;\n\n    // Process pending keyboard navigation update (range mode)\n    // This runs AFTER the grid has updated focusRow/focusCol\n    if (this.pendingKeyboardUpdate && mode === 'range') {\n      const { shiftKey } = this.pendingKeyboardUpdate;\n      this.pendingKeyboardUpdate = null;\n\n      const currentRow = this.grid._focusRow;\n      const currentCol = this.grid._focusCol;\n\n      if (shiftKey && this.cellAnchor) {\n        // Extend selection from anchor to current focus\n        const newRange = createRangeFromAnchor(this.cellAnchor, { row: currentRow, col: currentCol });\n        this.ranges = [newRange];\n        this.activeRange = newRange;\n      } else if (!shiftKey) {\n        // Without shift, clear selection (cell-focus will show instead)\n        this.ranges = [];\n        this.activeRange = null;\n        this.cellAnchor = { row: currentRow, col: currentCol }; // Reset anchor to current position\n      }\n\n      this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n    }\n\n    // Sync selection to grid's focus position.\n    // This ensures selection follows keyboard navigation (Tab, arrows, etc.)\n    // regardless of which plugin moved the focus.\n    this.#syncSelectionToFocus(mode);\n\n    // Set data attribute on host for CSS variable scoping\n    (this.grid as unknown as Element).setAttribute('data-selection-mode', mode);\n\n    // Toggle .selecting class during drag to prevent text selection\n    if (container) {\n      container.classList.toggle('selecting', this.isDragging);\n    }\n\n    this.#applySelectionClasses();\n  }\n\n  /**\n   * Called after scroll-triggered row rendering.\n   * Reapplies selection classes to recycled DOM elements.\n   * @internal\n   */\n  override onScrollRender(): void {\n    // Skip rendering selection classes if disabled\n    if (!this.isSelectionEnabled()) return;\n\n    this.#applySelectionClasses();\n  }\n\n  // #endregion\n\n  // #region Public API\n\n  /**\n   * Get the current selection as a unified result.\n   * Works for all selection modes and always returns ranges.\n   *\n   * @example\n   * ```ts\n   * const selection = plugin.getSelection();\n   * if (selection.ranges.length > 0) {\n   *   const { from, to } = selection.ranges[0];\n   *   // For cell mode: from === to (single cell)\n   *   // For row mode: from.col = 0, to.col = lastCol (full row)\n   *   // For range mode: rectangular selection\n   * }\n   * ```\n   */\n  getSelection(): SelectionResult {\n    return {\n      mode: this.config.mode,\n      ranges: this.#buildEvent().ranges,\n      anchor: this.cellAnchor,\n    };\n  }\n\n  /**\n   * Get all selected cells across all ranges.\n   */\n  getSelectedCells(): Array<{ row: number; col: number }> {\n    return getAllCellsInRanges(this.ranges);\n  }\n\n  /**\n   * Check if a specific cell is in range selection.\n   */\n  isCellSelected(row: number, col: number): boolean {\n    return isCellInAnyRange(row, col, this.ranges);\n  }\n\n  /**\n   * Select all selectable rows (row mode) or all cells (range mode).\n   *\n   * In row mode, selects every row where `isSelectable` returns true (or all rows if no callback).\n   * In range mode, creates a single range spanning all rows and columns.\n   * Has no effect in cell mode.\n   *\n   * @example\n   * ```ts\n   * const plugin = grid.getPlugin(SelectionPlugin);\n   * plugin.selectAll(); // Selects everything in current mode\n   * ```\n   */\n  selectAll(): void {\n    const { mode, multiSelect } = this.config;\n\n    // Single-select mode: selectAll is a no-op\n    if (multiSelect === false) return;\n\n    if (mode === 'row') {\n      this.selected.clear();\n      for (let i = 0; i < this.rows.length; i++) {\n        if (this.isRowSelectable(i)) {\n          this.selected.add(i);\n        }\n      }\n      this.explicitSelection = true;\n      this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n      this.requestAfterRender();\n    } else if (mode === 'range') {\n      const rowCount = this.rows.length;\n      const colCount = this.columns.length;\n      if (rowCount > 0 && colCount > 0) {\n        const allRange: InternalCellRange = {\n          startRow: 0,\n          startCol: 0,\n          endRow: rowCount - 1,\n          endCol: colCount - 1,\n        };\n        this.ranges = [allRange];\n        this.activeRange = allRange;\n        this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n        this.requestAfterRender();\n      }\n    }\n  }\n\n  /**\n   * Select specific rows by index (row mode only).\n   * Replaces the current selection with the provided row indices.\n   * Indices that are out of bounds or fail the `isSelectable` check are ignored.\n   *\n   * @param indices - Array of row indices to select\n   *\n   * @example\n   * ```ts\n   * const plugin = grid.getPlugin(SelectionPlugin);\n   * plugin.selectRows([0, 2, 4]); // Select rows 0, 2, and 4\n   * ```\n   */\n  selectRows(indices: number[]): void {\n    if (this.config.mode !== 'row') return;\n    // In single-select mode, only use the last index\n    const effectiveIndices =\n      this.config.multiSelect === false && indices.length > 1 ? [indices[indices.length - 1]] : indices;\n    this.selected.clear();\n    for (const idx of effectiveIndices) {\n      if (idx >= 0 && idx < this.rows.length && this.isRowSelectable(idx)) {\n        this.selected.add(idx);\n      }\n    }\n    this.anchor = effectiveIndices.length > 0 ? effectiveIndices[effectiveIndices.length - 1] : null;\n    this.explicitSelection = true;\n    this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n    this.requestAfterRender();\n  }\n\n  /**\n   * Get the indices of all selected rows (convenience for row mode).\n   * Returns indices sorted in ascending order.\n   *\n   * @example\n   * ```ts\n   * const plugin = grid.getPlugin(SelectionPlugin);\n   * const rows = plugin.getSelectedRowIndices(); // [0, 2, 4]\n   * ```\n   */\n  getSelectedRowIndices(): number[] {\n    return [...this.selected].sort((a, b) => a - b);\n  }\n\n  /**\n   * Get the actual row objects for the current selection.\n   *\n   * Works across all selection modes:\n   * - **Row mode**: Returns the row objects for all selected rows.\n   * - **Cell mode**: Returns the single row containing the selected cell, or `[]`.\n   * - **Range mode**: Returns the unique row objects that intersect any selected range.\n   *\n   * Row objects are resolved from the grid's processed (sorted/filtered) row array,\n   * so they always reflect the current visual order.\n   *\n   * @example\n   * ```ts\n   * const plugin = grid.getPlugin(SelectionPlugin);\n   * const selected = plugin.getSelectedRows(); // [{ id: 1, name: 'Alice' }, ...]\n   * ```\n   */\n  getSelectedRows<T = unknown>(): T[] {\n    const { mode } = this.config;\n    const rows = this.rows;\n\n    if (mode === 'row') {\n      return this.getSelectedRowIndices()\n        .filter((i) => i >= 0 && i < rows.length)\n        .map((i) => rows[i]) as T[];\n    }\n\n    if (mode === 'cell' && this.selectedCell) {\n      const { row } = this.selectedCell;\n      return row >= 0 && row < rows.length ? [rows[row] as T] : [];\n    }\n\n    if (mode === 'range' && this.ranges.length > 0) {\n      // Collect unique row indices across all ranges\n      const rowIndices = new Set<number>();\n      for (const range of this.ranges) {\n        const minRow = Math.max(0, Math.min(range.startRow, range.endRow));\n        const maxRow = Math.min(rows.length - 1, Math.max(range.startRow, range.endRow));\n        for (let r = minRow; r <= maxRow; r++) {\n          rowIndices.add(r);\n        }\n      }\n      return [...rowIndices].sort((a, b) => a - b).map((i) => rows[i]) as T[];\n    }\n\n    return [];\n  }\n\n  /**\n   * Clear all selection.\n   */\n  clearSelection(): void {\n    this.selectedCell = null;\n    this.selected.clear();\n    this.anchor = null;\n    this.ranges = [];\n    this.activeRange = null;\n    this.cellAnchor = null;\n    this.emit<SelectionChangeDetail>('selection-change', { mode: this.config.mode, ranges: [] });\n    this.requestAfterRender();\n  }\n\n  /**\n   * Set selected ranges programmatically.\n   */\n  setRanges(ranges: CellRange[]): void {\n    this.ranges = ranges.map((r) => ({\n      startRow: r.from.row,\n      startCol: r.from.col,\n      endRow: r.to.row,\n      endCol: r.to.col,\n    }));\n    this.activeRange = this.ranges.length > 0 ? this.ranges[this.ranges.length - 1] : null;\n    this.emit<SelectionChangeDetail>('selection-change', {\n      mode: this.config.mode,\n      ranges: toPublicRanges(this.ranges),\n    });\n    this.requestAfterRender();\n  }\n\n  // #endregion\n\n  // #region Private Helpers\n\n  #buildEvent(): SelectionChangeDetail {\n    return buildSelectionEvent(\n      this.config.mode,\n      {\n        selectedCell: this.selectedCell,\n        selected: this.selected,\n        ranges: this.ranges,\n      },\n      this.columns.length,\n    );\n  }\n\n  // #endregion\n}\n"],"names":["getRowIndexFromCell","cell","attr","rowEl","parent","rows","i","clearCellFocus","root","el","DEFAULT_FILTER_ICON","DEFAULT_GRID_ICONS","BaseGridPlugin","#abortController","config","grid","PluginClass","eventName","detail","event","eventType","callback","userIcons","mode","host","durationStr","parsed","iconKey","pluginOverride","element","icon","message","EXPANDER_COLUMN_FIELD","isExpanderColumn","column","isUtilityColumn","normalizeRange","range","toPublicRange","normalized","toPublicRanges","ranges","isCellInRange","row","col","isCellInAnyRange","getCellsInRange","cells","getAllCellsInRanges","cellMap","createRangeFromAnchor","anchor","current","rangesEqual","a","b","normA","normB","CHECKBOX_COLUMN_FIELD","buildSelectionEvent","state","colCount","sorted","start","end","SelectionPlugin","styles","rowIndex","colIndex","isSelectable","query","originalEvent","triggerOn","isUtility","currentCell","#buildEvent","multiSelect","shiftKey","ctrlKey","isCheckbox","newRange","currentRange","isNavKey","focusRow","focusCol","isTabKey","shouldExtend","targetCol","firstDataCol","_event","columns","checkboxCol","#createCheckboxColumn","expanderIdx","insertAt","container","checkbox","e","ctx","cellEl","#updateCheckboxStates","gridEl","headerCheckbox","rowCount","selectableCount","allSelected","someSelected","#syncSelectionToFocus","cur","#applySelectionClasses","hasSelectableCallback","allRows","firstCell","normalizedRanges","isInSelection","r","c","currentRow","currentCol","allRange","indices","effectiveIndices","idx","rowIndices","minRow","maxRow"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../../libs/grid/src/lib/core/internal/utils.ts","../../../../../../libs/grid/src/lib/core/types.ts","../../../../../../libs/grid/src/lib/core/plugin/base-plugin.ts","../../../../../../libs/grid/src/lib/core/plugin/expander-column.ts","../../../../../../libs/grid/src/lib/plugins/selection/range-selection.ts","../../../../../../libs/grid/src/lib/plugins/selection/SelectionPlugin.ts"],"sourcesContent":["// #region Environment Helpers\n\n/**\n * Check if we're running in a development environment.\n * Returns true for localhost or when NODE_ENV !== 'production'.\n * Used to show warnings only in development.\n */\nexport function isDevelopment(): boolean {\n  // Check for localhost (browser environment)\n  if (typeof window !== 'undefined' && window.location) {\n    const hostname = window.location.hostname;\n    if (hostname === 'localhost' || hostname === '127.0.0.1' || hostname === '::1') {\n      return true;\n    }\n  }\n  // Check for NODE_ENV (build-time or SSR)\n  if (typeof process !== 'undefined' && process.env?.NODE_ENV !== 'production') {\n    return true;\n  }\n  return false;\n}\n\n// #endregion\n\n// #region Cell Rendering Helpers\n\n/**\n * Generate accessible HTML for a boolean cell.\n * Uses role=\"checkbox\" with proper aria attributes.\n */\nexport function booleanCellHTML(value: boolean): string {\n  return `<span role=\"checkbox\" aria-checked=\"${value}\" aria-label=\"${value}\">${value ? '&#x1F5F9;' : '&#9744;'}</span>`;\n}\n\n/**\n * Format a date value for display.\n * Handles Date objects, timestamps, and date strings.\n * Returns empty string for invalid dates.\n */\nexport function formatDateValue(value: unknown): string {\n  if (value == null || value === '') return '';\n  if (value instanceof Date) {\n    return isNaN(value.getTime()) ? '' : value.toLocaleDateString();\n  }\n  if (typeof value === 'number' || typeof value === 'string') {\n    const d = new Date(value);\n    return isNaN(d.getTime()) ? '' : d.toLocaleDateString();\n  }\n  return '';\n}\n\n/**\n * Get the row index from a cell element's data-row attribute.\n * Falls back to calculating from parent row's DOM position if data-row is missing.\n * Returns -1 if no valid row index is found.\n */\nexport function getRowIndexFromCell(cell: Element | null): number {\n  if (!cell) return -1;\n  const attr = cell.getAttribute('data-row');\n  if (attr) return parseInt(attr, 10);\n\n  // Fallback: find the parent .data-grid-row and calculate index from siblings\n  const rowEl = cell.closest('.data-grid-row');\n  if (!rowEl) return -1;\n\n  const parent = rowEl.parentElement;\n  if (!parent) return -1;\n\n  // Get all data-grid-row siblings and find this row's index\n  const rows = parent.querySelectorAll(':scope > .data-grid-row');\n  for (let i = 0; i < rows.length; i++) {\n    if (rows[i] === rowEl) return i;\n  }\n  return -1;\n}\n\n/**\n * Get the column index from a cell element's data-col attribute.\n * Returns -1 if no valid column index is found.\n */\nexport function getColIndexFromCell(cell: Element | null): number {\n  if (!cell) return -1;\n  const attr = cell.getAttribute('data-col');\n  return attr ? parseInt(attr, 10) : -1;\n}\n\n/**\n * Clear all cell-focus styling from a root element.\n * Used when changing focus or when selection plugin takes over focus management.\n */\nexport function clearCellFocus(root: Element | null): void {\n  if (!root) return;\n  root.querySelectorAll('.cell-focus').forEach((el) => el.classList.remove('cell-focus'));\n}\n// #endregion\n\n// #region RTL Helpers\n\n/** Text direction */\nexport type TextDirection = 'ltr' | 'rtl';\n\n/**\n * Get the text direction for an element.\n * Reads from the computed style, which respects the `dir` attribute on the element\n * or any ancestor, as well as CSS `direction` property.\n *\n * @param element - The element to check direction for\n * @returns 'ltr' or 'rtl'\n *\n * @example\n * ```typescript\n * // Detect grid's direction\n * const dir = getDirection(gridElement);\n * if (dir === 'rtl') {\n *   // Handle RTL layout\n * }\n * ```\n */\nexport function getDirection(element: Element): TextDirection {\n  // Try computed style first (works in real browsers)\n  try {\n    const computedDir = getComputedStyle(element).direction;\n    if (computedDir === 'rtl') return 'rtl';\n  } catch {\n    // getComputedStyle may fail in some test environments\n  }\n\n  // Fallback: check dir attribute on element or ancestors\n  // This handles test environments where getComputedStyle may not reflect dir attribute\n  try {\n    const dirAttr = element.closest?.('[dir]')?.getAttribute('dir');\n    if (dirAttr === 'rtl') return 'rtl';\n  } catch {\n    // closest may not be available on mock elements\n  }\n\n  return 'ltr';\n}\n\n/**\n * Check if an element is in RTL mode.\n *\n * @param element - The element to check\n * @returns true if the element's text direction is right-to-left\n */\nexport function isRTL(element: Element): boolean {\n  return getDirection(element) === 'rtl';\n}\n\n/**\n * Resolve a logical inline position to a physical position based on text direction.\n *\n * - `'start'` → `'left'` in LTR, `'right'` in RTL\n * - `'end'` → `'right'` in LTR, `'left'` in RTL\n * - `'left'` / `'right'` → unchanged (physical values)\n *\n * @param position - Logical or physical position\n * @param direction - Text direction ('ltr' or 'rtl')\n * @returns Physical position ('left' or 'right')\n *\n * @example\n * ```typescript\n * resolveInlinePosition('start', 'ltr'); // 'left'\n * resolveInlinePosition('start', 'rtl'); // 'right'\n * resolveInlinePosition('left', 'rtl');  // 'left' (unchanged)\n * ```\n */\nexport function resolveInlinePosition(\n  position: 'left' | 'right' | 'start' | 'end',\n  direction: TextDirection,\n): 'left' | 'right' {\n  if (position === 'left' || position === 'right') {\n    return position;\n  }\n  if (direction === 'rtl') {\n    return position === 'start' ? 'right' : 'left';\n  }\n  return position === 'start' ? 'left' : 'right';\n}\n// #endregion\n","import type { RowPosition } from './internal/virtualization';\nimport type { PluginQuery } from './plugin/base-plugin';\nimport type { AfterCellRenderContext, AfterRowRenderContext, CellMouseEvent } from './plugin/types';\n\n/**\n * Position entry for a single row in the position cache.\n * Part of variable row height virtualization.\n *\n * Re-exported from position-cache.ts for public API consistency.\n *\n * @see VirtualState.positionCache\n * @category Plugin Development\n */\nexport type RowPositionEntry = RowPosition;\n\n// #region DataGridElement Interface\n/**\n * The compiled web component interface for DataGrid.\n *\n * This interface represents the `<tbw-grid>` custom element, combining\n * the public grid API with standard HTMLElement functionality.\n *\n * @example\n * ```typescript\n * // Query existing grid\n * const grid = document.querySelector('tbw-grid') as DataGridElement<Employee>;\n * grid.rows = employees;\n * grid.addEventListener('cell-click', (e) => console.log(e.detail));\n *\n * // Create grid programmatically\n * import { createGrid } from '@toolbox-web/grid';\n * const grid = createGrid<Employee>({\n *   columns: [{ field: 'name' }, { field: 'email' }],\n * });\n * document.body.appendChild(grid);\n * ```\n *\n * @see {@link PublicGrid} for the public API methods and properties\n * @see {@link createGrid} for typed grid creation\n * @see {@link queryGrid} for typed grid querying\n */\nexport interface DataGridElement extends PublicGrid, HTMLElement {}\n// #endregion\n\n// #region PublicGrid Interface\n/**\n * Public API interface for DataGrid component.\n *\n * **Property Getters vs Setters:**\n *\n * Property getters return the EFFECTIVE (resolved) value after merging all config sources.\n * This is the \"current situation\" - what consumers and plugins need to know.\n *\n * Property setters accept input values which are merged into the effective config.\n * Multiple sources can contribute (gridConfig, columns prop, light DOM, individual props).\n *\n * For example:\n * - `grid.fitMode` returns the resolved fitMode (e.g., 'stretch' even if you set undefined)\n * - `grid.columns` returns the effective columns after merging\n * - `grid.gridConfig` returns the full effective config\n */\nexport interface PublicGrid<T = any> {\n  /**\n   * Full config object. Setter merges with other inputs per precedence rules.\n   * Getter returns the effective (resolved) config.\n   */\n  gridConfig?: GridConfig<T>;\n  /**\n   * Column definitions.\n   * Getter returns effective columns (after merging config, light DOM, inference).\n   */\n  columns?: ColumnConfig<T>[];\n  /** Current row data (after plugin processing like grouping, filtering). */\n  rows?: T[];\n  /** Resolves once the component has finished initial work (layout, inference). */\n  ready?: () => Promise<void>;\n  /** Force a layout / measurement pass (e.g. after container resize). */\n  forceLayout?: () => Promise<void>;\n  /**\n   * Suspend row processing for the next `rows` update.\n   * Skips plugin processRows hooks (sort, filter, group) and core sort for one cycle.\n   * Auto-resets after the rows render. Use before inserting/removing rows by hand.\n   */\n  suspendProcessing?: () => void;\n  /** Return effective resolved config (after inference & precedence). */\n  getConfig?: () => Promise<Readonly<GridConfig<T>>>;\n  /** Toggle expansion state of a group row by its generated key. */\n  toggleGroup?: (key: string) => Promise<void>;\n\n  // Custom Styles API\n  /**\n   * Register custom CSS styles to be injected into the grid.\n   * Use this to style custom cell renderers, editors, or detail panels.\n   * @param id - Unique identifier for the style block (for removal/updates)\n   * @param css - CSS string to inject\n   */\n  registerStyles?: (id: string, css: string) => void;\n  /**\n   * Remove previously registered custom styles.\n   * @param id - The ID used when registering the styles\n   */\n  unregisterStyles?: (id: string) => void;\n  /**\n   * Get list of registered custom style IDs.\n   */\n  getRegisteredStyles?: () => string[];\n\n  // Plugin API\n  /**\n   * Get a plugin instance by its class.\n   *\n   * @example\n   * ```typescript\n   * const selection = grid.getPlugin(SelectionPlugin);\n   * if (selection) {\n   *   selection.selectAll();\n   * }\n   * ```\n   */\n  getPlugin?<P>(PluginClass: new (...args: any[]) => P): P | undefined;\n  /**\n   * Get a plugin instance by its name.\n   * Prefer `getPlugin(PluginClass)` for type safety.\n   */\n  getPluginByName?(name: string): GridPlugin | undefined;\n\n  // Shell API\n  /**\n   * Re-render the shell header (title, column groups, toolbar).\n   * Call this after dynamically adding/removing tool panels or toolbar buttons.\n   */\n  refreshShellHeader?(): void;\n  /**\n   * Register a custom tool panel in the sidebar.\n   *\n   * @example\n   * ```typescript\n   * grid.registerToolPanel({\n   *   id: 'analytics',\n   *   title: 'Analytics',\n   *   icon: '📊',\n   *   render: (container) => {\n   *     container.innerHTML = '<div>Charts here...</div>';\n   *   }\n   * });\n   * ```\n   */\n  registerToolPanel?(panel: ToolPanelDefinition): void;\n  /**\n   * Unregister a previously registered tool panel.\n   */\n  unregisterToolPanel?(panelId: string): void;\n  /**\n   * Open the tool panel sidebar.\n   */\n  openToolPanel?(): void;\n  /**\n   * Close the tool panel sidebar.\n   */\n  closeToolPanel?(): void;\n  /**\n   * Toggle the tool panel sidebar open or closed.\n   */\n  toggleToolPanel?(): void;\n  /**\n   * Toggle an accordion section expanded or collapsed within the tool panel.\n   * @param sectionId - The ID of the section to toggle\n   */\n  toggleToolPanelSection?(sectionId: string): void;\n\n  // State Persistence API\n  /**\n   * Get the current column state including order, width, visibility, and sort.\n   * Use for persisting user preferences to localStorage or a backend.\n   *\n   * @example\n   * ```typescript\n   * const state = grid.getColumnState();\n   * localStorage.setItem('gridState', JSON.stringify(state));\n   * ```\n   */\n  getColumnState?(): GridColumnState;\n  /**\n   * Set/restore the column state.\n   * Can be set before or after grid initialization.\n   *\n   * @example\n   * ```typescript\n   * const saved = localStorage.getItem('gridState');\n   * if (saved) {\n   *   grid.columnState = JSON.parse(saved);\n   * }\n   * ```\n   */\n  columnState?: GridColumnState;\n\n  // Loading API\n  /**\n   * Whether the grid is currently in a loading state.\n   * When true, displays a loading overlay with spinner.\n   *\n   * Can also be set via the `loading` HTML attribute.\n   *\n   * @example\n   * ```typescript\n   * // Show loading overlay\n   * grid.loading = true;\n   * const data = await fetchData();\n   * grid.rows = data;\n   * grid.loading = false;\n   * ```\n   */\n  loading?: boolean;\n\n  /**\n   * Set loading state for a specific row.\n   * Displays a small spinner indicator on the row.\n   *\n   * Use when persisting row data or performing row-level async operations.\n   *\n   * @param rowId - The row's unique identifier (from getRowId)\n   * @param loading - Whether the row is loading\n   *\n   * @example\n   * ```typescript\n   * // Show loading while saving row\n   * grid.setRowLoading('emp-123', true);\n   * await saveRow(row);\n   * grid.setRowLoading('emp-123', false);\n   * ```\n   */\n  setRowLoading?(rowId: string, loading: boolean): void;\n\n  /**\n   * Set loading state for a specific cell.\n   * Displays a small spinner indicator on the cell.\n   *\n   * Use when performing cell-level async operations (e.g., validation, lookup).\n   *\n   * @param rowId - The row's unique identifier (from getRowId)\n   * @param field - The column field\n   * @param loading - Whether the cell is loading\n   *\n   * @example\n   * ```typescript\n   * // Show loading while validating cell\n   * grid.setCellLoading('emp-123', 'email', true);\n   * const isValid = await validateEmail(email);\n   * grid.setCellLoading('emp-123', 'email', false);\n   * ```\n   */\n  setCellLoading?(rowId: string, field: string, loading: boolean): void;\n\n  /**\n   * Check if a row is currently in loading state.\n   * @param rowId - The row's unique identifier\n   */\n  isRowLoading?(rowId: string): boolean;\n\n  /**\n   * Check if a cell is currently in loading state.\n   * @param rowId - The row's unique identifier\n   * @param field - The column field\n   */\n  isCellLoading?(rowId: string, field: string): boolean;\n\n  /**\n   * Clear all row and cell loading states.\n   */\n  clearAllLoading?(): void;\n}\n// #endregion\n\n// #region InternalGrid Interface\n/**\n * Internal-only augmented interface for DataGrid component.\n *\n * Member prefixes indicate accessibility:\n * - `_underscore` = protected members - private outside core, accessible to plugins. Marked with @internal.\n * - `__doubleUnderscore` = deeply internal members - private outside core, only for internal functions.\n *\n * @category Plugin Development\n */\nexport interface InternalGrid<T = any> extends PublicGrid<T>, GridConfig<T> {\n  // Element methods available because DataGridElement extends HTMLElement\n  querySelector<K extends keyof HTMLElementTagNameMap>(selectors: K): HTMLElementTagNameMap[K] | null;\n  querySelector<E extends Element = Element>(selectors: string): E | null;\n  querySelectorAll<K extends keyof HTMLElementTagNameMap>(selectors: K): NodeListOf<HTMLElementTagNameMap[K]>;\n  querySelectorAll<E extends Element = Element>(selectors: string): NodeListOf<E>;\n  _rows: T[];\n  _columns: ColumnInternal<T>[];\n  /** Visible columns only (excludes hidden). Use for rendering. */\n  _visibleColumns: ColumnInternal<T>[];\n  _headerRowEl: HTMLElement;\n  _bodyEl: HTMLElement;\n  _rowPool: RowElementInternal[];\n  _resizeController: ResizeController;\n  _sortState: { field: string; direction: 1 | -1 } | null;\n  /** Original unfiltered/unprocessed rows. @internal */\n  sourceRows: T[];\n  /** Framework adapter instance (set by Grid directives). @internal */\n  __frameworkAdapter?: FrameworkAdapter;\n  __originalOrder: T[];\n  __rowRenderEpoch: number;\n  __didInitialAutoSize?: boolean;\n  __lightDomColumnsCache?: ColumnInternal[];\n  __originalColumnNodes?: HTMLElement[];\n  /** Cell display value cache. @internal */\n  __cellDisplayCache?: Map<number, string[]>;\n  /** Cache epoch for cell display values. @internal */\n  __cellCacheEpoch?: number;\n  /** Cached header row count for virtualization. @internal */\n  __cachedHeaderRowCount?: number;\n  /** Cached flag for whether grid has special columns (custom renderers, etc.). @internal */\n  __hasSpecialColumns?: boolean;\n  /** Cached flag for whether any plugin has renderRow hooks. @internal */\n  __hasRenderRowPlugins?: boolean;\n  _gridTemplate: string;\n  _virtualization: VirtualState;\n  _focusRow: number;\n  _focusCol: number;\n  /** Currently active edit row index. Injected by EditingPlugin. @internal */\n  _activeEditRows?: number;\n  /** Whether the grid is in 'grid' editing mode (all rows editable). Injected by EditingPlugin. @internal */\n  _isGridEditMode?: boolean;\n  /** Snapshots of row data before editing. Injected by EditingPlugin. @internal */\n  _rowEditSnapshots?: Map<number, T>;\n  /** Get all changed rows. Injected by EditingPlugin. */\n  changedRows?: T[];\n  /** Get IDs of all changed rows. Injected by EditingPlugin. */\n  changedRowIds?: string[];\n  effectiveConfig?: GridConfig<T>;\n  findHeaderRow?: () => HTMLElement;\n  refreshVirtualWindow: (full: boolean, skipAfterRender?: boolean) => boolean;\n  updateTemplate?: () => void;\n  findRenderedRowElement?: (rowIndex: number) => HTMLElement | null;\n  /** Get a row by its ID. Implemented in grid.ts */\n  getRow?: (id: string) => T | undefined;\n  /** Get a row and its current index by ID. Returns undefined if not found. @internal */\n  _getRowEntry: (id: string) => { row: T; index: number } | undefined;\n  /** Get the unique ID for a row. Implemented in grid.ts */\n  getRowId?: (row: T) => string;\n  /** Update a row by ID. Implemented in grid.ts */\n  updateRow?: (id: string, changes: Partial<T>, source?: UpdateSource) => void;\n  /** Animate a single row. Implemented in grid.ts */\n  animateRow?: (rowIndex: number, type: RowAnimationType) => void;\n  /** Animate multiple rows. Implemented in grid.ts */\n  animateRows?: (rowIndices: number[], type: RowAnimationType) => void;\n  /** Animate a row by its ID. Implemented in grid.ts */\n  animateRowById?: (rowId: string, type: RowAnimationType) => boolean;\n  /** Begin bulk edit on a row. Injected by EditingPlugin. */\n  beginBulkEdit?: (rowIndex: number) => void;\n  /** Commit active row edit. Injected by EditingPlugin. */\n  commitActiveRowEdit?: () => void;\n  /** Dispatch cell click to plugin system, returns true if handled */\n  _dispatchCellClick?: (event: MouseEvent, rowIndex: number, colIndex: number, cellEl: HTMLElement) => boolean;\n  /** Dispatch row click to plugin system, returns true if handled */\n  _dispatchRowClick?: (event: MouseEvent, rowIndex: number, row: any, rowEl: HTMLElement) => boolean;\n  /** Dispatch header click to plugin system, returns true if handled */\n  _dispatchHeaderClick?: (event: MouseEvent, col: ColumnConfig, headerEl: HTMLElement) => boolean;\n  /** Dispatch keydown to plugin system, returns true if handled */\n  _dispatchKeyDown?: (event: KeyboardEvent) => boolean;\n  /** Dispatch cell mouse events for drag operations. Returns true if any plugin started a drag. */\n  _dispatchCellMouseDown?: (event: CellMouseEvent) => boolean;\n  /** Dispatch cell mouse move during drag. */\n  _dispatchCellMouseMove?: (event: CellMouseEvent) => void;\n  /** Dispatch cell mouse up to end drag. */\n  _dispatchCellMouseUp?: (event: CellMouseEvent) => void;\n  /** Call afterCellRender hook on all plugins. Called from rows.ts after each cell is rendered. @internal */\n  _afterCellRender?: (context: AfterCellRenderContext<T>) => void;\n  /** Check if any plugin has registered an afterCellRender hook. Used to skip hook call for performance. @internal */\n  _hasAfterCellRenderHook?: () => boolean;\n  /** Call afterRowRender hook on all plugins. Called from rows.ts after each row is rendered. @internal */\n  _afterRowRender?: (context: AfterRowRenderContext<T>) => void;\n  /** Check if any plugin has registered an afterRowRender hook. Used to skip hook call for performance. @internal */\n  _hasAfterRowRenderHook?: () => boolean;\n  /** Get horizontal scroll boundary offsets from plugins */\n  _getHorizontalScrollOffsets?: (\n    rowEl?: HTMLElement,\n    focusedCell?: HTMLElement,\n  ) => { left: number; right: number; skipScroll?: boolean };\n  /** Query all plugins with a generic query and collect responses */\n  queryPlugins?: <T>(query: PluginQuery) => T[];\n  /** Request emission of column-state-change event (debounced) */\n  requestStateChange?: () => void;\n}\n// #endregion\n\n// #region Column Types\n/**\n * Built-in primitive column types with automatic formatting and editing support.\n *\n * - `'string'` - Text content, default text input editor\n * - `'number'` - Numeric content, right-aligned, number input editor\n * - `'date'` - Date content, formatted display, date picker editor\n * - `'boolean'` - True/false, rendered as checkbox\n * - `'select'` - Dropdown selection from `options` array\n *\n * @example\n * ```typescript\n * columns: [\n *   { field: 'name', type: 'string' },\n *   { field: 'age', type: 'number' },\n *   { field: 'hireDate', type: 'date' },\n *   { field: 'active', type: 'boolean' },\n *   { field: 'department', type: 'select', options: [\n *     { label: 'Engineering', value: 'eng' },\n *     { label: 'Sales', value: 'sales' },\n *   ]},\n * ]\n * ```\n *\n * @see {@link ColumnType} for custom type support\n * @see {@link TypeDefault} for type-level defaults\n */\nexport type PrimitiveColumnType = 'number' | 'string' | 'date' | 'boolean' | 'select';\n\n/**\n * Column type - built-in primitives or custom type strings.\n *\n * Use built-in types for automatic formatting, or define custom types\n * (e.g., 'currency', 'country') with type-level defaults via `typeDefaults`.\n *\n * @example\n * ```typescript\n * // Built-in types\n * { field: 'name', type: 'string' }\n * { field: 'salary', type: 'number' }\n *\n * // Custom types with defaults\n * grid.gridConfig = {\n *   columns: [\n *     { field: 'salary', type: 'currency' },\n *     { field: 'birthCountry', type: 'country' },\n *   ],\n *   typeDefaults: {\n *     currency: {\n *       format: (v) => `$${Number(v).toFixed(2)}`,\n *     },\n *     country: {\n *       renderer: (ctx) => `🌍 ${ctx.value}`,\n *     },\n *   },\n * };\n * ```\n *\n * @see {@link PrimitiveColumnType} for built-in types\n * @see {@link TypeDefault} for defining custom type defaults\n */\nexport type ColumnType = PrimitiveColumnType | (string & {});\n// #endregion\n\n// #region TypeDefault Interface\n/**\n * Type-level defaults for formatters and renderers.\n * Applied to all columns of a given type unless overridden at column level.\n *\n * Note: `editor` and `editorParams` are added via module augmentation when\n * EditingPlugin is imported. `filterPanelRenderer` is added by FilteringPlugin.\n *\n * @example\n * ```typescript\n * typeDefaults: {\n *   currency: {\n *     format: (value) => new Intl.NumberFormat('en-US', {\n *       style: 'currency',\n *       currency: 'USD',\n *     }).format(value as number),\n *   },\n *   country: {\n *     renderer: (ctx) => {\n *       const span = document.createElement('span');\n *       span.innerHTML = `<img src=\"/flags/${ctx.value}.svg\" /> ${ctx.value}`;\n *       return span;\n *     }\n *   }\n * }\n * ```\n *\n * @see {@link ColumnViewRenderer} for custom renderer function signature\n * @see {@link ColumnType} for type strings that can have defaults\n * @see {@link GridConfig.typeDefaults} for registering type defaults\n */\nexport interface TypeDefault<TRow = unknown> {\n  /**\n   * Default formatter for all columns of this type.\n   *\n   * Transforms the raw cell value into a display string. Use when you need\n   * consistent formatting across columns without custom DOM (e.g., currency,\n   * percentages, dates with specific locale).\n   *\n   * **Resolution Priority**: Column `format` → Type `format` → Built-in\n   *\n   * @example\n   * ```typescript\n   * typeDefaults: {\n   *   currency: {\n   *     format: (value) => new Intl.NumberFormat('en-US', {\n   *       style: 'currency',\n   *       currency: 'USD',\n   *     }).format(value as number),\n   *   },\n   *   percentage: {\n   *     format: (value) => `${(value as number * 100).toFixed(1)}%`,\n   *   }\n   * }\n   * ```\n   */\n  format?: (value: unknown, row: TRow) => string;\n\n  /**\n   * Default renderer for all columns of this type.\n   *\n   * Creates custom DOM for the cell content. Use when you need more than\n   * text formatting (e.g., icons, badges, interactive elements).\n   *\n   * **Resolution Priority**: Column `renderer` → Type `renderer` → App-level (adapter) → Built-in\n   *\n   * @example\n   * ```typescript\n   * typeDefaults: {\n   *   status: {\n   *     renderer: (ctx) => {\n   *       const badge = document.createElement('span');\n   *       badge.className = `badge badge-${ctx.value}`;\n   *       badge.textContent = ctx.value as string;\n   *       return badge;\n   *     }\n   *   },\n   *   country: {\n   *     renderer: (ctx) => {\n   *       const span = document.createElement('span');\n   *       span.innerHTML = `<img src=\"/flags/${ctx.value}.svg\" /> ${ctx.value}`;\n   *       return span;\n   *     }\n   *   }\n   * }\n   * ```\n   */\n  renderer?: ColumnViewRenderer<TRow, unknown>;\n}\n// #endregion\n\n// #region BaseColumnConfig Interface\n/**\n * Base contract for a column configuration.\n *\n * Defines the fundamental properties all columns share. Extended by {@link ColumnConfig}\n * with additional features like custom renderers and grouping.\n *\n * @example\n * ```typescript\n * // Basic column with common properties\n * const columns: BaseColumnConfig<Employee>[] = [\n *   {\n *     field: 'name',\n *     header: 'Full Name',\n *     sortable: true,\n *     resizable: true,\n *   },\n *   {\n *     field: 'salary',\n *     type: 'number',\n *     width: 120,\n *     format: (value) => `$${value.toLocaleString()}`,\n *     sortComparator: (a, b) => a - b,\n *   },\n *   {\n *     field: 'department',\n *     type: 'select',\n *     options: [\n *       { label: 'Engineering', value: 'eng' },\n *       { label: 'Sales', value: 'sales' },\n *     ],\n *   },\n * ];\n * ```\n *\n * @see {@link ColumnConfig} for full column configuration with renderers\n * @see {@link ColumnType} for type options\n */\nexport interface BaseColumnConfig<TRow = any, TValue = any> {\n  /** Unique field key referencing property in row objects */\n  field: keyof TRow & string;\n  /** Visible header label; defaults to capitalized field */\n  header?: string;\n  /**\n   * Column data type.\n   *\n   * Built-in types: `'string'`, `'number'`, `'date'`, `'boolean'`, `'select'`\n   *\n   * Custom types (e.g., `'currency'`, `'country'`) can have type-level defaults\n   * via `gridConfig.typeDefaults` or framework adapter registries.\n   *\n   * @default Inferred from first row data\n   */\n  type?: ColumnType;\n  /** Column width in pixels; fixed size (no flexibility) */\n  width?: string | number;\n  /** Minimum column width in pixels (stretch mode only); when set, column uses minmax(minWidth, 1fr) */\n  minWidth?: number;\n  /** Whether column can be sorted */\n  sortable?: boolean;\n  /** Whether column can be resized by user */\n  resizable?: boolean;\n  /** Optional custom comparator for sorting (a,b) -> number */\n  sortComparator?: (a: TValue, b: TValue, rowA: TRow, rowB: TRow) => number;\n  /** For select type - available options */\n  options?: Array<{ label: string; value: unknown }> | (() => Array<{ label: string; value: unknown }>);\n  /** For select - allow multi select */\n  multi?: boolean;\n  /**\n   * Formats the raw cell value into a display string.\n   *\n   * Used both for **cell rendering** and the **built-in filter panel**:\n   * - In cells, the formatted value replaces the raw value as text content.\n   * - In the filter panel (set filter), checkbox labels show the formatted value\n   *   instead of the raw value, and search matches against the formatted text.\n   *\n   * The `row` parameter is available during cell rendering but is `undefined`\n   * when called from the filter panel (standalone value formatting). Avoid\n   * accessing `row` properties in format functions intended for filter display.\n   *\n   * @example\n   * ```typescript\n   * // Currency formatter — works in both cells and filter panel\n   * {\n   *   field: 'price',\n   *   format: (value) => `$${Number(value).toFixed(2)}`,\n   * }\n   *\n   * // ID-to-name lookup — filter panel shows names, not IDs\n   * {\n   *   field: 'departmentId',\n   *   format: (value) => departmentMap.get(value as string) ?? String(value),\n   * }\n   * ```\n   */\n  format?: (value: TValue, row: TRow) => string;\n  /** Arbitrary extra metadata */\n  meta?: Record<string, unknown>;\n}\n// #endregion\n\n// #region ColumnConfig Interface\n/**\n * Full column configuration including custom renderers, editors, and grouping metadata.\n *\n * Extends {@link BaseColumnConfig} with additional features for customizing\n * how cells are displayed and edited.\n *\n * @example\n * ```typescript\n * const columns: ColumnConfig<Employee>[] = [\n *   // Basic sortable column\n *   { field: 'id', header: 'ID', width: 60, sortable: true },\n *\n *   // Column with custom renderer\n *   {\n *     field: 'name',\n *     header: 'Employee',\n *     renderer: (ctx) => {\n *       const div = document.createElement('div');\n *       div.innerHTML = `<img src=\"${ctx.row.avatar}\" /><span>${ctx.value}</span>`;\n *       return div;\n *     },\n *   },\n *\n *   // Column with custom header\n *   {\n *     field: 'email',\n *     headerLabelRenderer: (ctx) => `${ctx.value} 📧`,\n *   },\n *\n *   // Editable column (requires EditingPlugin)\n *   {\n *     field: 'status',\n *     editable: true,\n *     editor: (ctx) => {\n *       const select = document.createElement('select');\n *       // ... editor implementation\n *       return select;\n *     },\n *   },\n *\n *   // Hidden column (can be shown via VisibilityPlugin)\n *   { field: 'internalNotes', hidden: true },\n * ];\n * ```\n *\n * @see {@link BaseColumnConfig} for basic column properties\n * @see {@link ColumnViewRenderer} for custom cell renderers\n * @see {@link ColumnEditorSpec} for custom cell editors\n * @see {@link HeaderRenderer} for custom header renderers\n */\nexport interface ColumnConfig<TRow = any> extends BaseColumnConfig<TRow, any> {\n  /**\n   * Optional custom cell renderer function. Alias for `viewRenderer`.\n   * Can return an HTMLElement, a Node, or an HTML string (which will be sanitized).\n   *\n   * @example\n   * ```typescript\n   * // Simple string template\n   * renderer: (ctx) => `<span class=\"badge\">${ctx.value}</span>`\n   *\n   * // DOM element\n   * renderer: (ctx) => {\n   *   const el = document.createElement('span');\n   *   el.textContent = ctx.value;\n   *   return el;\n   * }\n   * ```\n   */\n  renderer?: ColumnViewRenderer<TRow, any>;\n  /** Optional custom view renderer used instead of default text rendering */\n  viewRenderer?: ColumnViewRenderer<TRow, any>;\n  /** External view spec (lets host app mount any framework component) */\n  externalView?: {\n    component: unknown;\n    props?: Record<string, unknown>;\n    mount?: (options: {\n      placeholder: HTMLElement;\n      context: CellRenderContext<TRow, unknown>;\n      spec: unknown;\n    }) => void | { dispose?: () => void };\n  };\n  /** Whether the column is initially hidden */\n  hidden?: boolean;\n  /** Prevent this column from being hidden programmatically */\n  lockVisible?: boolean;\n  /**\n   * Dynamic CSS class(es) for cells in this column.\n   * Called for each cell during rendering. Return class names to add to the cell element.\n   *\n   * @example\n   * ```typescript\n   * // Highlight negative values\n   * cellClass: (value, row, column) => value < 0 ? ['negative', 'text-red'] : []\n   *\n   * // Status-based styling\n   * cellClass: (value) => [`status-${value}`]\n   * ```\n   */\n  cellClass?: (value: unknown, row: TRow, column: ColumnConfig<TRow>) => string[];\n\n  /**\n   * Custom header label renderer. Customize the label content while the grid\n   * handles sort icons, filter buttons, resize handles, and click interactions.\n   *\n   * Use this for simple customizations like adding icons, badges, or units.\n   *\n   * @example\n   * ```typescript\n   * // Add required field indicator\n   * headerLabelRenderer: (ctx) => `${ctx.value} <span class=\"required\">*</span>`\n   *\n   * // Add unit to header\n   * headerLabelRenderer: (ctx) => {\n   *   const span = document.createElement('span');\n   *   span.innerHTML = `${ctx.value}<br/><small>(kg)</small>`;\n   *   return span;\n   * }\n   * ```\n   */\n  headerLabelRenderer?: HeaderLabelRenderer<TRow>;\n\n  /**\n   * Custom header cell renderer. Complete control over the entire header cell.\n   * Resize handles are added automatically for resizable columns.\n   *\n   * The context provides helper functions to include standard elements:\n   * - `renderSortIcon()` - Returns sort indicator element (null if not sortable)\n   * - `renderFilterButton()` - Returns filter button (null if not filterable)\n   *\n   * **Precedence**: `headerRenderer` > `headerLabelRenderer` > `header` > `field`\n   *\n   * @example\n   * ```typescript\n   * headerRenderer: (ctx) => {\n   *   const div = document.createElement('div');\n   *   div.className = 'custom-header';\n   *   div.innerHTML = `<span>${ctx.value}</span>`;\n   *   const sortIcon = ctx.renderSortIcon();\n   *   if (sortIcon) div.appendChild(sortIcon);\n   *   return div;\n   * }\n   * ```\n   */\n  headerRenderer?: HeaderRenderer<TRow>;\n}\n// #endregion\n\n// #region ColumnConfigMap Type\n/**\n * Array of column configurations.\n * Convenience type alias for `ColumnConfig<TRow>[]`.\n *\n * @example\n * ```typescript\n * const columns: ColumnConfigMap<Employee> = [\n *   { field: 'name', header: 'Full Name', sortable: true },\n *   { field: 'email', header: 'Email Address' },\n *   { field: 'department', type: 'select', options: deptOptions },\n * ];\n *\n * grid.columns = columns;\n * ```\n *\n * @see {@link ColumnConfig} for individual column options\n * @see {@link GridConfig.columns} for setting columns on the grid\n */\nexport type ColumnConfigMap<TRow = any> = ColumnConfig<TRow>[];\n// #endregion\n\n// #region Editor Types\n/**\n * Editor specification for inline cell editing.\n * Supports multiple formats for maximum flexibility.\n *\n * **Format Options:**\n * - `string` - Custom element tag name (e.g., 'my-date-picker')\n * - `function` - Factory function returning an editor element\n * - `object` - External component spec for framework integration\n *\n * @example\n * ```typescript\n * // 1. Custom element tag name\n * columns: [\n *   { field: 'date', editor: 'my-date-picker' }\n * ]\n *\n * // 2. Factory function (full control)\n * columns: [\n *   {\n *     field: 'status',\n *     editor: (ctx) => {\n *       const select = document.createElement('select');\n *       select.innerHTML = `\n *         <option value=\"active\">Active</option>\n *         <option value=\"inactive\">Inactive</option>\n *       `;\n *       select.value = ctx.value;\n *       select.onchange = () => ctx.commit(select.value);\n *       select.onkeydown = (e) => {\n *         if (e.key === 'Escape') ctx.cancel();\n *       };\n *       return select;\n *     }\n *   }\n * ]\n *\n * // 3. External component (React, Angular, Vue)\n * columns: [\n *   {\n *     field: 'country',\n *     editor: {\n *       component: CountrySelect,\n *       props: { showFlags: true }\n *     }\n *   }\n * ]\n * ```\n *\n * @see {@link ColumnEditorContext} for the context passed to factory functions\n */\nexport type ColumnEditorSpec<TRow = unknown, TValue = unknown> =\n  | string // custom element tag name\n  | ((context: ColumnEditorContext<TRow, TValue>) => HTMLElement | string)\n  | {\n      /** Arbitrary component reference (class, function, token) */\n      component: unknown;\n      /** Optional static props passed to mount */\n      props?: Record<string, unknown>;\n      /** Optional custom mount function; if provided we call it directly instead of emitting an event */\n      mount?: (options: {\n        placeholder: HTMLElement;\n        context: ColumnEditorContext<TRow, TValue>;\n        spec: unknown;\n      }) => void | { dispose?: () => void };\n    };\n\n/**\n * Context object provided to editor factories allowing mutation (commit/cancel) of a cell value.\n *\n * The `commit` and `cancel` functions control the editing lifecycle:\n * - Call `commit(newValue)` to save changes and exit edit mode\n * - Call `cancel()` to discard changes and exit edit mode\n *\n * @example\n * ```typescript\n * const myEditor: ColumnEditorSpec = (ctx: ColumnEditorContext) => {\n *   const input = document.createElement('input');\n *   input.value = ctx.value;\n *   input.className = 'my-editor';\n *\n *   // Save on Enter, cancel on Escape\n *   input.onkeydown = (e) => {\n *     if (e.key === 'Enter') {\n *       ctx.commit(input.value);\n *     } else if (e.key === 'Escape') {\n *       ctx.cancel();\n *     }\n *   };\n *\n *   // Access row data for validation\n *   if (ctx.row.locked) {\n *     input.disabled = true;\n *   }\n *\n *   return input;\n * };\n * ```\n *\n * @see {@link ColumnEditorSpec} for editor specification options\n */\nexport interface ColumnEditorContext<TRow = any, TValue = any> {\n  /** Underlying full row object for the active edit. */\n  row: TRow;\n  /** Current cell value (mutable only via commit). */\n  value: TValue;\n  /** Field name being edited. */\n  field: keyof TRow & string;\n  /** Column configuration reference. */\n  column: ColumnConfig<TRow>;\n  /**\n   * Stable row identifier (from `getRowId`).\n   * Empty string if no `getRowId` is configured.\n   */\n  rowId: string;\n  /** Accept the edit; triggers change tracking + rerender. */\n  commit: (newValue: TValue) => void;\n  /** Abort edit without persisting changes. */\n  cancel: () => void;\n  /**\n   * Update other fields in this row while the editor is open.\n   * Changes are committed with source `'cascade'`, triggering\n   * `cell-change` events and `onValueChange` pushes to sibling editors.\n   *\n   * Useful for editors that affect multiple fields (e.g., an address\n   * lookup that sets city + zip + state).\n   *\n   * @example\n   * ```typescript\n   * // In a cell-commit listener:\n   * grid.addEventListener('cell-commit', (e) => {\n   *   if (e.detail.field === 'quantity') {\n   *     e.detail.updateRow({ total: e.detail.row.price * e.detail.value });\n   *   }\n   * });\n   * ```\n   */\n  updateRow: (changes: Partial<TRow>) => void;\n  /**\n   * Register a callback invoked when the cell's underlying value changes\n   * while the editor is open (e.g., via `updateRow()` from another cell's commit).\n   *\n   * Built-in editors auto-update their input values. Custom/framework editors\n   * should use this to stay in sync with external mutations.\n   *\n   * @example\n   * ```typescript\n   * const editor = (ctx: ColumnEditorContext) => {\n   *   const input = document.createElement('input');\n   *   input.value = String(ctx.value);\n   *   ctx.onValueChange?.((newValue) => {\n   *     input.value = String(newValue);\n   *   });\n   *   return input;\n   * };\n   * ```\n   */\n  onValueChange?: (callback: (newValue: TValue) => void) => void;\n}\n// #endregion\n\n// #region Renderer Types\n/**\n * Context passed to custom view renderers (pure display – no commit helpers).\n *\n * Used by `viewRenderer` and `renderer` column properties to create\n * custom cell content. Return a DOM node or HTML string.\n *\n * @example\n * ```typescript\n * // Status badge renderer\n * const statusRenderer: ColumnViewRenderer = (ctx: CellRenderContext) => {\n *   const badge = document.createElement('span');\n *   badge.className = `badge badge-${ctx.value}`;\n *   badge.textContent = ctx.value;\n *   return badge;\n * };\n *\n * // Progress bar using row data\n * const progressRenderer: ColumnViewRenderer = (ctx) => {\n *   const bar = document.createElement('div');\n *   bar.className = 'progress-bar';\n *   bar.style.width = `${ctx.value}%`;\n *   bar.title = `${ctx.row.taskName}: ${ctx.value}%`;\n *   return bar;\n * };\n *\n * // Return HTML string (simpler, less performant)\n * const htmlRenderer: ColumnViewRenderer = (ctx) => {\n *   return `<strong>${ctx.value}</strong>`;\n * };\n * ```\n *\n * @see {@link ColumnViewRenderer} for the renderer function signature\n */\nexport interface CellRenderContext<TRow = any, TValue = any> {\n  /** Row object for the cell being rendered. */\n  row: TRow;\n  /** Value at field. */\n  value: TValue;\n  /** Field key. */\n  field: keyof TRow & string;\n  /** Column configuration reference. */\n  column: ColumnConfig<TRow>;\n  /**\n   * The cell DOM element being rendered into.\n   * Framework adapters can use this to cache per-cell state (e.g., React roots).\n   * @internal\n   */\n  cellEl?: HTMLElement;\n}\n\n/**\n * Custom view renderer function for cell content.\n *\n * Returns one of:\n * - `Node` - DOM element to display in the cell\n * - `string` - HTML string (parsed and inserted)\n * - `void | null` - Use default text rendering\n *\n * @example\n * ```typescript\n * // DOM element (recommended for interactivity)\n * const avatarRenderer: ColumnViewRenderer<Employee> = (ctx) => {\n *   const img = document.createElement('img');\n *   img.src = ctx.row.avatarUrl;\n *   img.alt = ctx.row.name;\n *   img.className = 'avatar';\n *   return img;\n * };\n *\n * // HTML string (simpler, good for static content)\n * const emailRenderer: ColumnViewRenderer = (ctx) => {\n *   return `<a href=\"mailto:${ctx.value}\">${ctx.value}</a>`;\n * };\n *\n * // Conditional rendering\n * const conditionalRenderer: ColumnViewRenderer = (ctx) => {\n *   if (!ctx.value) return null; // Use default\n *   return `<em>${ctx.value}</em>`;\n * };\n * ```\n *\n * @see {@link CellRenderContext} for available context properties\n */\nexport type ColumnViewRenderer<TRow = unknown, TValue = unknown> = (\n  ctx: CellRenderContext<TRow, TValue>,\n) => Node | string | void | null;\n// #endregion\n\n// #region Header Renderer Types\n/**\n * Context passed to `headerLabelRenderer` for customizing header label content.\n * The framework handles sort icons, filter buttons, resize handles, and click interactions.\n *\n * @example\n * ```typescript\n * headerLabelRenderer: (ctx) => {\n *   const span = document.createElement('span');\n *   span.innerHTML = `${ctx.value} <span class=\"required\">*</span>`;\n *   return span;\n * }\n * ```\n */\nexport interface HeaderLabelContext<TRow = unknown> {\n  /** Column configuration reference. */\n  column: ColumnConfig<TRow>;\n  /** The header text (from column.header or column.field). */\n  value: string;\n}\n\n/**\n * Context passed to `headerRenderer` for complete control over header cell content.\n * When using this, you control the header content. Resize handles are added automatically\n * for resizable columns.\n *\n * @example\n * ```typescript\n * headerRenderer: (ctx) => {\n *   const div = document.createElement('div');\n *   div.className = 'custom-header';\n *   div.innerHTML = `<span>${ctx.value}</span>`;\n *   // Optionally include sort icon\n *   const sortIcon = ctx.renderSortIcon();\n *   if (sortIcon) div.appendChild(sortIcon);\n *   return div;\n * }\n * ```\n */\nexport interface HeaderCellContext<TRow = unknown> {\n  /** Column configuration reference. */\n  column: ColumnConfig<TRow>;\n  /** The header text (from column.header or column.field). */\n  value: string;\n  /** Current sort state for this column. */\n  sortState: 'asc' | 'desc' | null;\n  /** Whether the column has an active filter. */\n  filterActive: boolean;\n  /** The header cell DOM element being rendered into. */\n  cellEl: HTMLElement;\n  /**\n   * Render the standard sort indicator icon.\n   * Returns null if column is not sortable.\n   */\n  renderSortIcon: () => HTMLElement | null;\n  /**\n   * Render the standard filter button.\n   * Returns null if FilteringPlugin is not active or column is not filterable.\n   * Note: The actual button is added by FilteringPlugin's afterRender hook.\n   */\n  renderFilterButton: () => HTMLElement | null;\n}\n\n/**\n * Header label renderer function type.\n * Customize the label while framework handles sort icons, filter buttons, resize handles.\n *\n * Use this for simple label customizations without taking over the entire header.\n * The grid automatically appends sort icons, filter buttons, and resize handles.\n *\n * @example\n * ```typescript\n * // Add required indicator\n * const requiredHeader: HeaderLabelRenderer = (ctx) => {\n *   return `${ctx.value} <span style=\"color: red;\">*</span>`;\n * };\n *\n * // Add unit suffix\n * const priceHeader: HeaderLabelRenderer = (ctx) => {\n *   const span = document.createElement('span');\n *   span.innerHTML = `${ctx.value} <small>(USD)</small>`;\n *   return span;\n * };\n *\n * // Column config usage\n * columns: [\n *   { field: 'name', headerLabelRenderer: requiredHeader },\n *   { field: 'price', headerLabelRenderer: priceHeader },\n * ]\n * ```\n *\n * @see {@link HeaderLabelContext} for context properties\n * @see {@link HeaderRenderer} for full header control\n */\nexport type HeaderLabelRenderer<TRow = unknown> = (ctx: HeaderLabelContext<TRow>) => Node | string | void | null;\n\n/**\n * Header cell renderer function type.\n * Full control over header cell content. User is responsible for all content and interactions.\n *\n * When using this, you have complete control but must manually include\n * sort icons, filter buttons, and resize handles using the helper functions.\n *\n * @example\n * ```typescript\n * // Custom header with all standard elements\n * const customHeader: HeaderRenderer = (ctx) => {\n *   const div = document.createElement('div');\n *   div.className = 'custom-header';\n *   div.innerHTML = `<span class=\"label\">${ctx.value}</span>`;\n *\n *   // Add sort icon (returns null if not sortable)\n *   const sortIcon = ctx.renderSortIcon();\n *   if (sortIcon) div.appendChild(sortIcon);\n *\n *   // Add filter button (returns null if not filterable)\n *   const filterBtn = ctx.renderFilterButton();\n *   if (filterBtn) div.appendChild(filterBtn);\n *\n *   // Resize handles are added automatically for resizable columns\n *   return div;\n * };\n *\n * // Minimal header (no sort/resize)\n * const minimalHeader: HeaderRenderer = (ctx) => {\n *   return `<div class=\"minimal\">${ctx.value}</div>`;\n * };\n *\n * // Column config usage\n * columns: [\n *   { field: 'name', headerRenderer: customHeader },\n * ]\n * ```\n *\n * @see {@link HeaderCellContext} for context properties and helper functions\n * @see {@link HeaderLabelRenderer} for simpler label-only customization\n */\nexport type HeaderRenderer<TRow = unknown> = (ctx: HeaderCellContext<TRow>) => Node | string | void | null;\n// #endregion\n\n// #region Framework Adapter Interface\n/**\n * Framework adapter interface for handling framework-specific component instantiation.\n * Allows framework libraries (Angular, React, Vue) to register handlers that convert\n * declarative light DOM elements into functional renderers/editors.\n *\n * @example\n * ```typescript\n * // In @toolbox-web/grid-angular\n * class AngularGridAdapter implements FrameworkAdapter {\n *   canHandle(element: HTMLElement): boolean {\n *     return element.tagName.startsWith('APP-');\n *   }\n *   createRenderer(element: HTMLElement): ColumnViewRenderer {\n *     return (ctx) => {\n *       // Angular-specific instantiation logic\n *       const componentRef = createComponent(...);\n *       componentRef.setInput('value', ctx.value);\n *       return componentRef.location.nativeElement;\n *     };\n *   }\n *   createEditor(element: HTMLElement): ColumnEditorSpec {\n *     return (ctx) => {\n *       // Angular-specific editor with commit/cancel\n *       const componentRef = createComponent(...);\n *       componentRef.setInput('value', ctx.value);\n *       // Subscribe to commit/cancel outputs\n *       return componentRef.location.nativeElement;\n *     };\n *   }\n * }\n *\n * // User registers adapter once in their app\n * GridElement.registerAdapter(new AngularGridAdapter(injector, appRef));\n * ```\n * @category Framework Adapters\n */\nexport interface FrameworkAdapter {\n  /**\n   * Determines if this adapter can handle the given element.\n   * Typically checks tag name, attributes, or other conventions.\n   */\n  canHandle(element: HTMLElement): boolean;\n\n  /**\n   * Creates a view renderer function from a light DOM element.\n   * The renderer receives cell context and returns DOM or string.\n   */\n  createRenderer<TRow = unknown, TValue = unknown>(element: HTMLElement): ColumnViewRenderer<TRow, TValue>;\n\n  /**\n   * Creates an editor spec from a light DOM element.\n   * The editor receives context with commit/cancel and returns DOM.\n   * Returns undefined if no editor template is registered, allowing the grid\n   * to use its default built-in editors.\n   */\n  createEditor<TRow = unknown, TValue = unknown>(element: HTMLElement): ColumnEditorSpec<TRow, TValue> | undefined;\n\n  /**\n   * Creates a tool panel renderer from a light DOM element.\n   * The renderer receives a container element and optionally returns a cleanup function.\n   */\n  createToolPanelRenderer?(element: HTMLElement): ((container: HTMLElement) => void | (() => void)) | undefined;\n\n  /**\n   * Gets type-level defaults from an application-level registry.\n   * Used by Angular's `GridTypeRegistry` and React's `GridTypeProvider`.\n   *\n   * @param type - The column type (e.g., 'date', 'currency', 'country')\n   * @returns Type defaults for renderer/editor, or undefined if not registered\n   */\n  getTypeDefault?<TRow = unknown>(type: string): TypeDefault<TRow> | undefined;\n\n  /**\n   * Called when a cell's content is about to be wiped (e.g., when exiting edit mode,\n   * scroll-recycling a row, or rebuilding a row).\n   *\n   * Framework adapters should use this to properly destroy cached views/components\n   * associated with the cell to prevent memory leaks.\n   *\n   * @param cellEl - The cell element whose content is being released\n   */\n  releaseCell?(cellEl: HTMLElement): void;\n\n  /**\n   * Unmount a specific framework container and free its resources.\n   *\n   * Called by the grid core (e.g., MasterDetailPlugin) when a container\n   * created by the adapter is about to be removed from the DOM.\n   * The adapter should destroy the associated framework instance\n   * (React root, Vue app, Angular view) and remove it from tracking arrays.\n   *\n   * @param container - The container element returned by a create* method\n   */\n  unmount?(container: HTMLElement): void;\n}\n// #endregion\n\n// #region Internal Types\n\n/**\n * Column internal properties used during light DOM parsing.\n * Stores attribute-based names before they're resolved to actual functions.\n * @internal\n */\nexport interface ColumnParsedAttributes {\n  /** Editor name from `editor` attribute (resolved later) */\n  __editorName?: string;\n  /** Renderer name from `renderer` attribute (resolved later) */\n  __rendererName?: string;\n}\n\n/**\n * Extended column config used internally.\n * Includes all internal properties needed during grid lifecycle.\n *\n * Plugin developers may need to access these when working with\n * column caching and compiled templates.\n *\n * @example\n * ```typescript\n * import type { ColumnInternal } from '@toolbox-web/grid';\n *\n * class MyPlugin extends BaseGridPlugin {\n *   afterRender(): void {\n *     // Access internal column properties\n *     const columns = this.columns as ColumnInternal[];\n *     for (const col of columns) {\n *       // Check if column was auto-sized\n *       if (col.__autoSized) {\n *         console.log(`${col.field} was auto-sized`);\n *       }\n *     }\n *   }\n * }\n * ```\n *\n * @see {@link ColumnConfig} for public column properties\n * @category Plugin Development\n * @internal\n */\nexport interface ColumnInternal<T = any> extends ColumnConfig<T>, ColumnParsedAttributes {\n  __autoSized?: boolean;\n  __userResized?: boolean;\n  __renderedWidth?: number;\n  /** Original configured width (for reset on double-click) */\n  __originalWidth?: number;\n  __viewTemplate?: HTMLElement;\n  __editorTemplate?: HTMLElement;\n  __headerTemplate?: HTMLElement;\n  __compiledView?: CompiledViewFunction<T>;\n  __compiledEditor?: (ctx: EditorExecContext<T>) => string;\n}\n\n/**\n * Row element with internal tracking properties.\n * Used during virtualization and row pooling.\n *\n * @category Plugin Development\n * @internal\n */\nexport interface RowElementInternal extends HTMLElement {\n  /** Epoch marker for row render invalidation */\n  __epoch?: number;\n  /** Reference to the row data object for change detection */\n  __rowDataRef?: unknown;\n  /** Count of cells currently in edit mode */\n  __editingCellCount?: number;\n  /** Flag indicating this is a custom-rendered row (group row, etc.) */\n  __isCustomRow?: boolean;\n}\n\n/**\n * Type-safe access to element.part API (DOMTokenList-like).\n * Used for CSS ::part styling support.\n * @internal\n */\nexport interface ElementWithPart {\n  part?: DOMTokenList;\n}\n\n/**\n * Compiled view function type with optional blocked flag.\n * The __blocked flag is set when a template contains unsafe expressions.\n *\n * @category Plugin Development\n * @internal\n */\nexport interface CompiledViewFunction<T = any> {\n  (ctx: CellContext<T>): string;\n  /** Set to true when template was blocked due to unsafe expressions */\n  __blocked?: boolean;\n}\n\n/**\n * Runtime cell context used internally for compiled template execution.\n *\n * Contains the minimal context needed to render a cell: the row data,\n * cell value, field name, and column configuration.\n *\n * @example\n * ```typescript\n * import type { CellContext, ColumnInternal } from '@toolbox-web/grid';\n *\n * // Used internally by compiled templates\n * const renderCell = (ctx: CellContext) => {\n *   return `<span title=\"${ctx.field}\">${ctx.value}</span>`;\n * };\n * ```\n *\n * @see {@link CellRenderContext} for public cell render context\n * @see {@link EditorExecContext} for editor context with commit/cancel\n * @category Plugin Development\n */\nexport interface CellContext<T = any> {\n  row: T;\n  value: unknown;\n  field: string;\n  column: ColumnInternal<T>;\n}\n\n/**\n * Internal editor execution context extending the generic cell context with commit helpers.\n *\n * Used internally by the editing system. For public editor APIs,\n * prefer using {@link ColumnEditorContext}.\n *\n * @example\n * ```typescript\n * import type { EditorExecContext } from '@toolbox-web/grid';\n *\n * // Internal editor template execution\n * const execEditor = (ctx: EditorExecContext) => {\n *   const input = document.createElement('input');\n *   input.value = String(ctx.value);\n *   input.onkeydown = (e) => {\n *     if (e.key === 'Enter') ctx.commit(input.value);\n *     if (e.key === 'Escape') ctx.cancel();\n *   };\n *   return input;\n * };\n * ```\n *\n * @see {@link ColumnEditorContext} for public editor context\n * @see {@link CellContext} for base cell context\n * @category Plugin Development\n */\nexport interface EditorExecContext<T = any> extends CellContext<T> {\n  commit: (newValue: unknown) => void;\n  cancel: () => void;\n}\n\n/**\n * Controller managing drag-based column resize lifecycle.\n *\n * Exposed internally for plugins that need to interact with resize behavior.\n *\n * @example\n * ```typescript\n * import type { ResizeController, InternalGrid } from '@toolbox-web/grid';\n *\n * class MyPlugin extends BaseGridPlugin {\n *   handleColumnAction(colIndex: number): void {\n *     const grid = this.grid as InternalGrid;\n *     const resizeCtrl = grid._resizeController;\n *\n *     // Check if resize is in progress\n *     if (resizeCtrl?.isResizing) {\n *       return; // Don't interfere\n *     }\n *\n *     // Reset column to configured width\n *     resizeCtrl?.resetColumn(colIndex);\n *   }\n * }\n * ```\n *\n * @see {@link ColumnResizeDetail} for resize event details\n * @category Plugin Development\n */\nexport interface ResizeController {\n  start: (e: MouseEvent, colIndex: number, cell: HTMLElement) => void;\n  /** Reset a column to its configured width (or auto-size if none configured). */\n  resetColumn: (colIndex: number) => void;\n  dispose: () => void;\n  /** True while a resize drag is in progress (used to suppress header click/sort). */\n  isResizing: boolean;\n}\n\n/**\n * Virtual window bookkeeping; modified in-place as scroll position changes.\n *\n * Tracks virtualization state for row rendering. The grid only renders\n * rows within the visible viewport window (start to end) plus overscan.\n *\n * @example\n * ```typescript\n * import type { VirtualState, InternalGrid } from '@toolbox-web/grid';\n *\n * class MyPlugin extends BaseGridPlugin {\n *   logVirtualWindow(): void {\n *     const grid = this.grid as InternalGrid;\n *     const vs = grid.virtualization;\n *\n *     console.log(`Row height: ${vs.rowHeight}px`);\n *     console.log(`Visible rows: ${vs.start} to ${vs.end}`);\n *     console.log(`Virtualization: ${vs.enabled ? 'on' : 'off'}`);\n *   }\n * }\n * ```\n *\n * @see {@link GridConfig.rowHeight} for configuring row height\n * @category Plugin Development\n */\nexport interface VirtualState {\n  enabled: boolean;\n  rowHeight: number;\n  /** Threshold for bypassing virtualization (renders all rows if totalRows <= bypassThreshold) */\n  bypassThreshold: number;\n  start: number;\n  end: number;\n  /** Faux scrollbar element that provides scroll events (AG Grid pattern) */\n  container: HTMLElement | null;\n  /** Rows viewport element for measuring visible area height */\n  viewportEl: HTMLElement | null;\n  /** Spacer element inside faux scrollbar for setting virtual height */\n  totalHeightEl: HTMLElement | null;\n\n  // --- Variable Row Height Support (Phase 1) ---\n\n  /**\n   * Position cache for variable row heights.\n   * Index-based array mapping row index → {offset, height, measured}.\n   * Rebuilt when row count changes (expand/collapse, filter).\n   * `null` when using uniform row heights (default).\n   */\n  positionCache: RowPositionEntry[] | null;\n\n  /**\n   * Height cache by row identity.\n   * Persists row heights across position cache rebuilds.\n   * Uses dual storage: Map for string keys (rowId, __rowCacheKey) and WeakMap for object refs.\n   */\n  heightCache: {\n    /** Heights keyed by string (synthetic rows with __rowCacheKey, or rowId-keyed rows) */\n    byKey: Map<string, number>;\n    /** Heights keyed by object reference (data rows without rowId) */\n    byRef: WeakMap<object, number>;\n  };\n\n  /** Running average of measured row heights. Used for estimating unmeasured rows. */\n  averageHeight: number;\n\n  /** Number of rows that have been measured. */\n  measuredCount: number;\n\n  /** Whether variable row height mode is active (rowHeight is a function). */\n  variableHeights: boolean;\n\n  // --- Cached Geometry (avoid forced layout reads on scroll hot path) ---\n\n  /** Cached viewport element height. Updated by ResizeObserver and force-refresh only. */\n  cachedViewportHeight: number;\n\n  /** Cached faux scrollbar element height. Updated alongside viewport height. */\n  cachedFauxHeight: number;\n\n  /** Cached scroll-area element height. Updated alongside viewport/faux heights. */\n  cachedScrollAreaHeight: number;\n\n  /** Cached reference to .tbw-scroll-area element. Set during scroll listener setup. */\n  scrollAreaEl: HTMLElement | null;\n}\n\n// RowElementInternal is now defined earlier in the file with all internal properties\n\n/**\n * Union type for input-like elements that have a `value` property.\n * Covers standard form elements and custom elements with value semantics.\n *\n * @category Plugin Development\n * @internal\n */\nexport type InputLikeElement = HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement | { value: unknown };\n// #endregion\n\n// #region Grouping & Footer Public Types\n/**\n * Group row rendering customization options.\n * Controls how group header rows are displayed in the GroupingRowsPlugin.\n *\n * @example\n * ```typescript\n * import { GroupingRowsPlugin } from '@toolbox-web/grid/all';\n *\n * new GroupingRowsPlugin({\n *   groupBy: ['department', 'team'],\n *   render: {\n *     // Group row spans all columns\n *     fullWidth: true,\n *\n *     // Custom label format\n *     formatLabel: (value, depth, key) => {\n *       if (depth === 0) return `Department: ${value}`;\n *       return `Team: ${value}`;\n *     },\n *\n *     // Show aggregates in group rows (when not fullWidth)\n *     aggregators: {\n *       salary: 'sum',\n *       age: 'avg',\n *     },\n *\n *     // Custom CSS class\n *     class: 'my-group-row',\n *   },\n * });\n * ```\n *\n * @see {@link AggregatorRef} for aggregation options\n */\nexport interface RowGroupRenderConfig {\n  /** If true, group rows span all columns (single full-width cell). Default false. */\n  fullWidth?: boolean;\n  /** Optional label formatter override. Receives raw group value + depth. */\n  formatLabel?: (value: unknown, depth: number, key: string) => string;\n  /** Optional aggregate overrides per field for group summary cells (only when not fullWidth). */\n  aggregators?: Record<string, AggregatorRef>;\n  /** Additional CSS class applied to each group row root element. */\n  class?: string;\n}\n\n/**\n * Reference to an aggregation function for footer/group summaries.\n *\n * Can be either:\n * - A built-in aggregator name: `'sum'`, `'avg'`, `'min'`, `'max'`, `'count'`\n * - A custom function that calculates the aggregate value\n *\n * @example\n * ```typescript\n * // Built-in aggregator\n * { field: 'amount', aggregator: 'sum' }\n *\n * // Custom aggregator function\n * { field: 'price', aggregator: (rows, field) => {\n *   const values = rows.map(r => r[field]).filter(v => v != null);\n *   return values.length ? Math.max(...values) : null;\n * }}\n * ```\n *\n * @see {@link RowGroupRenderConfig} for using aggregators in group rows\n */\nexport type AggregatorRef = string | ((rows: unknown[], field: string, column?: unknown) => unknown);\n\n/**\n * Result of automatic column inference from sample rows.\n *\n * When no columns are configured, the grid analyzes the first row of data\n * to automatically generate column definitions with inferred types.\n *\n * @example\n * ```typescript\n * // Automatic inference (no columns configured)\n * grid.rows = [\n *   { name: 'Alice', age: 30, active: true, hireDate: new Date() },\n * ];\n * // Grid infers:\n * // - name: type 'string'\n * // - age: type 'number'\n * // - active: type 'boolean'\n * // - hireDate: type 'date'\n *\n * // Access inferred result programmatically\n * const config = await grid.getConfig();\n * console.log(config.columns); // Inferred columns\n * ```\n *\n * @see {@link ColumnConfig} for column configuration options\n * @see {@link ColumnType} for type inference rules\n */\nexport interface InferredColumnResult<TRow = unknown> {\n  /** Generated column configurations based on data analysis */\n  columns: ColumnConfigMap<TRow>;\n  /** Map of field names to their inferred types */\n  typeMap: Record<string, ColumnType>;\n}\n\n/**\n * Column sizing mode.\n *\n * - `'fixed'` - Columns use their configured widths. Horizontal scrolling if content overflows.\n * - `'stretch'` - Columns stretch proportionally to fill available width. No horizontal scrolling.\n *\n * @example\n * ```typescript\n * // Fixed widths - good for many columns\n * grid.fitMode = 'fixed';\n *\n * // Stretch to fill - good for few columns\n * grid.fitMode = 'stretch';\n *\n * // Via gridConfig\n * grid.gridConfig = { fitMode: 'stretch' };\n * ```\n */\nexport const FitModeEnum = {\n  STRETCH: 'stretch',\n  FIXED: 'fixed',\n} as const;\nexport type FitMode = (typeof FitModeEnum)[keyof typeof FitModeEnum]; // evaluates to 'stretch' | 'fixed'\n// #endregion\n\n// #region Plugin Interface\n/**\n * Minimal plugin interface for type-checking.\n * This interface is defined here to avoid circular imports with BaseGridPlugin.\n * All plugins must satisfy this shape (BaseGridPlugin implements it).\n *\n * @example\n * ```typescript\n * // Using plugins in grid config\n * import { SelectionPlugin, FilteringPlugin } from '@toolbox-web/grid/all';\n *\n * grid.gridConfig = {\n *   plugins: [\n *     new SelectionPlugin({ mode: 'row' }),\n *     new FilteringPlugin({ debounceMs: 200 }),\n *   ],\n * };\n *\n * // Accessing plugin instance at runtime\n * const selection = grid.getPlugin(SelectionPlugin);\n * if (selection) {\n *   selection.selectAll();\n * }\n * ```\n *\n * @category Plugin Development\n */\nexport interface GridPlugin {\n  /** Unique plugin identifier */\n  readonly name: string;\n  /** Plugin version */\n  readonly version: string;\n  /** CSS styles to inject into the grid */\n  readonly styles?: string;\n}\n// #endregion\n\n// #region Grid Config\n/**\n * Grid configuration object - the **single source of truth** for grid behavior.\n *\n * Users can configure the grid via multiple input methods, all of which converge\n * into an effective `GridConfig` internally:\n *\n * **Configuration Input Methods:**\n * - `gridConfig` property - direct assignment of this object\n * - `columns` property - shorthand for `gridConfig.columns`\n * - `fitMode` property - shorthand for `gridConfig.fitMode`\n * - Light DOM `<tbw-grid-column>` - declarative columns (merged into `columns`)\n * - Light DOM `<tbw-grid-header>` - declarative shell header (merged into `shell.header`)\n *\n * **Precedence (when same property set multiple ways):**\n * Individual props (`fitMode`) > `columns` prop > Light DOM > `gridConfig`\n *\n * @example\n * ```ts\n * // Via gridConfig (recommended for complex setups)\n * grid.gridConfig = {\n *   columns: [{ field: 'name' }, { field: 'age' }],\n *   fitMode: 'stretch',\n *   plugins: [new SelectionPlugin()],\n *   shell: { header: { title: 'My Grid' } }\n * };\n *\n * // Via individual props (convenience for simple cases)\n * grid.columns = [{ field: 'name' }, { field: 'age' }];\n * grid.fitMode = 'stretch';\n * ```\n */\nexport interface GridConfig<TRow = any> {\n  /**\n   * Column definitions. Can also be set via `columns` prop or `<tbw-grid-column>` light DOM.\n   * @see {@link ColumnConfig} for column options\n   * @see {@link ColumnConfigMap}\n   */\n  columns?: ColumnConfigMap<TRow>;\n  /**\n   * Dynamic CSS class(es) for data rows.\n   * Called for each row during rendering. Return class names to add to the row element.\n   *\n   * @example\n   * ```typescript\n   * // Highlight inactive rows\n   * rowClass: (row) => row.active ? [] : ['inactive', 'dimmed']\n   *\n   * // Status-based row styling\n   * rowClass: (row) => [`priority-${row.priority}`]\n   * ```\n   */\n  rowClass?: (row: TRow) => string[];\n  /** Sizing mode for columns. Can also be set via `fitMode` prop. */\n  fitMode?: FitMode;\n\n  /**\n   * Grid-wide sorting toggle.\n   * When false, disables sorting for all columns regardless of their individual `sortable` setting.\n   * When true (default), columns with `sortable: true` can be sorted.\n   *\n   * This affects:\n   * - Header click handlers for sorting\n   * - Sort indicator visibility\n   * - Multi-sort plugin behavior (if loaded)\n   *\n   * @default true\n   *\n   * @example\n   * ```typescript\n   * // Disable all sorting\n   * gridConfig = { sortable: false };\n   *\n   * // Enable sorting (default) - individual columns still need sortable: true\n   * gridConfig = { sortable: true };\n   * ```\n   */\n  sortable?: boolean;\n\n  /**\n   * Grid-wide resizing toggle.\n   * When false, disables column resizing for all columns regardless of their individual `resizable` setting.\n   * When true (default), columns with `resizable: true` (or resizable not set, since it defaults to true) can be resized.\n   *\n   * This affects:\n   * - Resize handle visibility in header cells\n   * - Double-click to auto-size behavior\n   *\n   * @default true\n   *\n   * @example\n   * ```typescript\n   * // Disable all column resizing\n   * gridConfig = { resizable: false };\n   *\n   * // Enable resizing (default) - individual columns can opt out with resizable: false\n   * gridConfig = { resizable: true };\n   * ```\n   */\n  resizable?: boolean;\n\n  /**\n   * Row height in pixels for virtualization calculations.\n   * The virtualization system assumes uniform row heights for performance.\n   *\n   * If not specified, the grid measures the first rendered row's height,\n   * which respects the CSS variable `--tbw-row-height` set by themes.\n   *\n   * Set this explicitly when:\n   * - Row content may wrap to multiple lines (also set `--tbw-cell-white-space: normal`)\n   * - Using custom row templates with variable content\n   * - You want to override theme-defined row height\n   * - Rows have different heights based on content (use function form)\n   *\n   * **Variable Row Heights**: When a function is provided, the grid enables variable height\n   * virtualization. Heights are measured on first render and cached by row identity.\n   *\n   * @default Auto-measured from first row (respects --tbw-row-height CSS variable)\n   *\n   * @example\n   * ```ts\n   * // Fixed height for all rows\n   * gridConfig = { rowHeight: 56 };\n   *\n   * // Variable height based on content\n   * gridConfig = {\n   *   rowHeight: (row, index) => row.hasDetails ? 80 : 40,\n   * };\n   *\n   * // Return undefined to trigger DOM auto-measurement\n   * gridConfig = {\n   *   rowHeight: (row) => row.isExpanded ? undefined : 40,\n   * };\n   * ```\n   */\n  rowHeight?: number | ((row: TRow, index: number) => number | undefined);\n  /**\n   * Array of plugin instances.\n   * Each plugin is instantiated with its configuration and attached to this grid.\n   *\n   * @example\n   * ```ts\n   * plugins: [\n   *   new SelectionPlugin({ mode: 'range' }),\n   *   new MultiSortPlugin(),\n   *   new FilteringPlugin({ debounceMs: 150 }),\n   * ]\n   * ```\n   */\n  plugins?: GridPlugin[];\n\n  /**\n   * Saved column state to restore on initialization.\n   * Includes order, width, visibility, sort, and plugin-contributed state.\n   */\n  columnState?: GridColumnState;\n\n  /**\n   * Shell configuration for header bar and tool panels.\n   * When configured, adds an optional wrapper with title, toolbar, and collapsible side panels.\n   */\n  shell?: ShellConfig;\n\n  /**\n   * Grid-wide icon configuration.\n   * Provides consistent icons across all plugins (tree, grouping, sorting, etc.).\n   * Plugins will use these by default but can override with their own config.\n   */\n  icons?: GridIcons;\n\n  /**\n   * Grid-wide animation configuration.\n   * Controls animations for expand/collapse, reordering, and other visual transitions.\n   * Individual plugins can override these defaults in their own config.\n   */\n  animation?: AnimationConfig;\n\n  /**\n   * Custom sort handler for full control over sorting behavior.\n   *\n   * When provided, this handler is called instead of the built-in sorting logic.\n   * Enables custom sorting algorithms, server-side sorting, or plugin-specific sorting.\n   *\n   * The handler receives:\n   * - `rows`: Current row array to sort\n   * - `sortState`: Sort field and direction (1 = asc, -1 = desc)\n   * - `columns`: Column configurations (for accessing sortComparator)\n   *\n   * Return the sorted array (sync) or a Promise that resolves to the sorted array (async).\n   * For server-side sorting, return a Promise that resolves when data is fetched.\n   *\n   * @example\n   * ```ts\n   * // Custom stable sort\n   * sortHandler: (rows, state, cols) => {\n   *   return stableSort(rows, (a, b) => compare(a[state.field], b[state.field]) * state.direction);\n   * }\n   *\n   * // Server-side sorting\n   * sortHandler: async (rows, state) => {\n   *   const response = await fetch(`/api/data?sort=${state.field}&dir=${state.direction}`);\n   *   return response.json();\n   * }\n   * ```\n   */\n  sortHandler?: SortHandler<TRow>;\n\n  /**\n   * Function to extract a unique identifier from a row.\n   * Used by `updateRow()`, `getRow()`, and ID-based tracking.\n   *\n   * If not provided, falls back to `row.id` or `row._id` if present.\n   * Rows without IDs are silently skipped during map building.\n   * Only throws when explicitly calling `getRowId()` or `updateRow()` on a row without an ID.\n   *\n   * @example\n   * ```ts\n   * // Simple field\n   * getRowId: (row) => row.id\n   *\n   * // Composite key\n   * getRowId: (row) => `${row.voyageId}-${row.legNumber}`\n   *\n   * // UUID field\n   * getRowId: (row) => row.uuid\n   * ```\n   */\n  getRowId?: (row: TRow) => string;\n\n  /**\n   * Type-level renderer and editor defaults.\n   *\n   * Keys can be:\n   * - Built-in types: `'string'`, `'number'`, `'date'`, `'boolean'`, `'select'`\n   * - Custom types: `'currency'`, `'country'`, `'status'`, etc.\n   *\n   * Resolution order (highest priority first):\n   * 1. Column-level (`column.renderer` / `column.editor`)\n   * 2. Grid-level (`gridConfig.typeDefaults[column.type]`)\n   * 3. App-level (Angular `GridTypeRegistry`, React `GridTypeProvider`)\n   * 4. Built-in (checkbox for boolean, select for select, etc.)\n   * 5. Fallback (plain text / text input)\n   *\n   * @example\n   * ```typescript\n   * typeDefaults: {\n   *   date: { editor: myDatePickerEditor },\n   *   country: {\n   *     renderer: (ctx) => {\n   *       const span = document.createElement('span');\n   *       span.innerHTML = `<img src=\"/flags/${ctx.value}.svg\" /> ${ctx.value}`;\n   *       return span;\n   *     },\n   *     editor: (ctx) => createCountrySelect(ctx)\n   *   }\n   * }\n   * ```\n   */\n  typeDefaults?: Record<string, TypeDefault<TRow>>;\n\n  // #region Accessibility\n\n  /**\n   * Accessible label for the grid.\n   * Sets `aria-label` on the grid's internal table element for screen readers.\n   *\n   * If not provided and `shell.header.title` is set, the title is used automatically.\n   *\n   * @example\n   * ```ts\n   * gridConfig = { gridAriaLabel: 'Employee data' };\n   * ```\n   */\n  gridAriaLabel?: string;\n\n  /**\n   * ID of an element that describes the grid.\n   * Sets `aria-describedby` on the grid's internal table element.\n   *\n   * @example\n   * ```html\n   * <p id=\"grid-desc\">This table shows all active employees.</p>\n   * <tbw-grid></tbw-grid>\n   * ```\n   * ```ts\n   * gridConfig = { gridAriaDescribedBy: 'grid-desc' };\n   * ```\n   */\n  gridAriaDescribedBy?: string;\n\n  // #endregion\n\n  // #region Loading\n\n  /**\n   * Custom renderer for the loading overlay.\n   *\n   * When provided, replaces the default spinner with custom content.\n   * Receives a context object with the current loading size.\n   *\n   * @example\n   * ```typescript\n   * // Simple text loading indicator\n   * loadingRenderer: () => {\n   *   const el = document.createElement('div');\n   *   el.textContent = 'Loading...';\n   *   return el;\n   * }\n   *\n   * // Custom spinner component\n   * loadingRenderer: (ctx) => {\n   *   const spinner = document.createElement('my-spinner');\n   *   spinner.size = ctx.size === 'large' ? 48 : 24;\n   *   return spinner;\n   * }\n   * ```\n   */\n  loadingRenderer?: LoadingRenderer;\n\n  // #endregion\n}\n// #endregion\n\n// #region Animation\n\n/**\n * Sort state passed to custom sort handlers.\n * Represents the current sorting configuration for a column.\n *\n * @example\n * ```typescript\n * // In a custom sort handler\n * const sortHandler: SortHandler = (rows, sortState, columns) => {\n *   const { field, direction } = sortState;\n *   console.log(`Sorting by ${field} ${direction === 1 ? 'ASC' : 'DESC'}`);\n *\n *   return [...rows].sort((a, b) => {\n *     const aVal = a[field];\n *     const bVal = b[field];\n *     return (aVal < bVal ? -1 : aVal > bVal ? 1 : 0) * direction;\n *   });\n * };\n * ```\n *\n * @see {@link SortHandler} for custom sort handler signature\n * @see {@link SortChangeDetail} for sort change events\n */\nexport interface SortState {\n  /** Field to sort by */\n  field: string;\n  /** Sort direction: 1 = ascending, -1 = descending */\n  direction: 1 | -1;\n}\n\n/**\n * Custom sort handler function signature.\n *\n * Enables full control over sorting behavior including server-side sorting,\n * custom algorithms, or multi-column sorting.\n *\n * @param rows - Current row array to sort\n * @param sortState - Sort field and direction\n * @param columns - Column configurations (for accessing sortComparator)\n * @returns Sorted array (sync) or Promise resolving to sorted array (async)\n *\n * @example\n * ```typescript\n * // Custom client-side sort with locale awareness\n * const localeSortHandler: SortHandler<Employee> = (rows, state, cols) => {\n *   const col = cols.find(c => c.field === state.field);\n *   return [...rows].sort((a, b) => {\n *     const aVal = String(a[state.field] ?? '');\n *     const bVal = String(b[state.field] ?? '');\n *     return aVal.localeCompare(bVal) * state.direction;\n *   });\n * };\n *\n * // Server-side sorting\n * const serverSortHandler: SortHandler<Employee> = async (rows, state) => {\n *   const response = await fetch(\n *     `/api/employees?sortBy=${state.field}&dir=${state.direction}`\n *   );\n *   return response.json();\n * };\n *\n * grid.gridConfig = {\n *   sortHandler: localeSortHandler,\n * };\n * ```\n *\n * @see {@link SortState} for the sort state object\n * @see {@link GridConfig.sortHandler} for configuring the handler\n * @see {@link BaseColumnConfig.sortComparator} for column-level comparators\n */\nexport type SortHandler<TRow = any> = (\n  rows: TRow[],\n  sortState: SortState,\n  columns: ColumnConfig<TRow>[],\n) => TRow[] | Promise<TRow[]>;\n\n// #region Loading\n\n/**\n * Loading indicator size variant.\n *\n * - `'large'`: 48x48px max - used for grid-level loading overlay (`grid.loading = true`)\n * - `'small'`: Follows row height - used for row/cell loading states\n *\n * @example\n * ```typescript\n * // Custom loading renderer adapting to size\n * const myLoader: LoadingRenderer = (ctx) => {\n *   if (ctx.size === 'large') {\n *     // Full overlay spinner\n *     return '<div class=\"spinner-lg\"></div>';\n *   }\n *   // Inline row/cell spinner\n *   return '<span class=\"spinner-sm\"></span>';\n * };\n * ```\n *\n * @see {@link LoadingRenderer} for custom loading renderer\n * @see {@link LoadingContext} for context passed to renderers\n */\nexport type LoadingSize = 'large' | 'small';\n\n/**\n * Context passed to custom loading renderers.\n *\n * Provides information about the loading indicator being rendered,\n * allowing the renderer to adapt its appearance based on the size variant.\n *\n * @example\n * ```typescript\n * const myLoadingRenderer: LoadingRenderer = (ctx: LoadingContext) => {\n *   if (ctx.size === 'large') {\n *     // Full-size spinner for grid-level loading\n *     return '<div class=\"large-spinner\"></div>';\n *   } else {\n *     // Compact spinner for row/cell loading\n *     return '<div class=\"small-spinner\"></div>';\n *   }\n * };\n * ```\n *\n * @see {@link LoadingRenderer} for the renderer function signature\n * @see {@link LoadingSize} for available size variants\n */\nexport interface LoadingContext {\n  /** The size variant being rendered: 'large' for grid-level, 'small' for row/cell */\n  size: LoadingSize;\n}\n\n/**\n * Custom loading renderer function.\n * Returns an element or HTML string to display as the loading indicator.\n *\n * Used with the `loadingRenderer` property in {@link GridConfig} to replace\n * the default spinner with custom content.\n *\n * @param context - Context containing size information\n * @returns HTMLElement or HTML string\n *\n * @example\n * ```typescript\n * // Simple text loading indicator\n * const textLoader: LoadingRenderer = () => {\n *   const el = document.createElement('div');\n *   el.textContent = 'Loading...';\n *   return el;\n * };\n *\n * // Custom spinner with size awareness\n * const customSpinner: LoadingRenderer = (ctx) => {\n *   const spinner = document.createElement('my-spinner');\n *   spinner.size = ctx.size === 'large' ? 48 : 24;\n *   return spinner;\n * };\n *\n * // Material Design-style progress bar\n * const progressBar: LoadingRenderer = () => {\n *   const container = document.createElement('div');\n *   container.className = 'progress-bar-container';\n *   container.innerHTML = '<div class=\"progress-bar\"></div>';\n *   return container;\n * };\n *\n * grid.gridConfig = {\n *   loadingRenderer: customSpinner,\n * };\n * ```\n *\n * @see {@link LoadingContext} for the context object passed to the renderer\n * @see {@link LoadingSize} for size variants ('large' | 'small')\n */\nexport type LoadingRenderer = (context: LoadingContext) => HTMLElement | string;\n\n// #endregion\n\n// #region Data Update Management\n\n/**\n * Indicates the origin of a data change.\n * Used to prevent infinite loops in cascade update handlers.\n *\n * - `'user'`: Direct user interaction via EditingPlugin (typing, selecting)\n * - `'cascade'`: Triggered by `updateRow()` in an event handler\n * - `'api'`: External programmatic update via `grid.updateRow()`\n *\n * @example\n * ```typescript\n * grid.addEventListener('cell-change', (e) => {\n *   const { source, field, newValue } = e.detail;\n *\n *   // Only cascade updates for user edits\n *   if (source === 'user' && field === 'price') {\n *     // Update calculated field (marked as 'cascade')\n *     grid.updateRow(e.detail.rowId, {\n *       total: newValue * e.detail.row.quantity,\n *     });\n *   }\n *\n *   // Ignore cascade updates to prevent infinite loops\n *   if (source === 'cascade') return;\n * });\n * ```\n *\n * @see {@link CellChangeDetail} for the event detail containing source\n * @category Data Management\n */\nexport type UpdateSource = 'user' | 'cascade' | 'api';\n\n/**\n * Detail for cell-change event (emitted by core after mutation).\n * This is an informational event that fires for ALL data mutations.\n *\n * Use this event for:\n * - Logging/auditing changes\n * - Cascading updates (updating other fields based on a change)\n * - Syncing changes to external state\n *\n * @example\n * ```typescript\n * grid.addEventListener('cell-change', (e: CustomEvent<CellChangeDetail>) => {\n *   const { row, rowId, field, oldValue, newValue, source } = e.detail;\n *\n *   console.log(`${field} changed from ${oldValue} to ${newValue}`);\n *   console.log(`Change source: ${source}`);\n *\n *   // Cascade: update total when price changes\n *   if (source === 'user' && field === 'price') {\n *     grid.updateRow(rowId, { total: newValue * row.quantity });\n *   }\n * });\n * ```\n *\n * @see {@link UpdateSource} for understanding change origins\n * @see {@link CellCommitDetail} for the commit event (editing lifecycle)\n * @category Events\n */\nexport interface CellChangeDetail<TRow = unknown> {\n  /** The row object (after mutation) */\n  row: TRow;\n  /** Stable row identifier */\n  rowId: string;\n  /** Current index in rows array */\n  rowIndex: number;\n  /** Field that changed */\n  field: string;\n  /** Value before change */\n  oldValue: unknown;\n  /** Value after change */\n  newValue: unknown;\n  /** All changes passed to updateRow/updateRows (for context) */\n  changes: Partial<TRow>;\n  /** Origin of this change */\n  source: UpdateSource;\n}\n\n/**\n * Batch update specification for updateRows().\n *\n * Used when you need to update multiple rows at once efficiently.\n * The grid will batch all updates and trigger a single re-render.\n *\n * @example\n * ```typescript\n * // Update multiple rows in a single batch\n * const updates: RowUpdate<Employee>[] = [\n *   { id: 'emp-1', changes: { status: 'active', updatedAt: new Date() } },\n *   { id: 'emp-2', changes: { status: 'inactive' } },\n *   { id: 'emp-3', changes: { salary: 75000 } },\n * ];\n *\n * grid.updateRows(updates);\n * ```\n *\n * @see {@link CellChangeDetail} for individual change events\n * @see {@link GridConfig.getRowId} for row identification\n * @category Data Management\n */\nexport interface RowUpdate<TRow = unknown> {\n  /** Row identifier (from getRowId) */\n  id: string;\n  /** Fields to update */\n  changes: Partial<TRow>;\n}\n\n// #endregion\n\n/**\n * Animation behavior mode.\n * - `true` or `'on'`: Animations always enabled\n * - `false` or `'off'`: Animations always disabled\n * - `'reduced-motion'`: Respects `prefers-reduced-motion` media query (default)\n *\n * @example\n * ```typescript\n * // Force animations on (ignore system preference)\n * grid.gridConfig = { animation: { mode: 'on' } };\n *\n * // Disable all animations\n * grid.gridConfig = { animation: { mode: false } };\n *\n * // Respect user's accessibility settings (default)\n * grid.gridConfig = { animation: { mode: 'reduced-motion' } };\n * ```\n *\n * @see {@link AnimationConfig} for full animation configuration\n */\nexport type AnimationMode = boolean | 'on' | 'off' | 'reduced-motion';\n\n/**\n * Animation style for visual transitions.\n * - `'slide'`: Slide/transform animation (e.g., expand down, slide left/right)\n * - `'fade'`: Opacity fade animation\n * - `'flip'`: FLIP technique for position changes (First, Last, Invert, Play)\n * - `false`: No animation for this specific feature\n *\n * @example\n * ```typescript\n * // Plugin-specific animation styles\n * new TreePlugin({\n *   expandAnimation: 'slide', // Slide children down when expanding\n * });\n *\n * new ReorderPlugin({\n *   animation: 'flip', // FLIP animation for column reordering\n * });\n * ```\n *\n * @see {@link AnimationConfig} for grid-wide animation settings\n * @see {@link ExpandCollapseAnimation} for expand/collapse-specific styles\n */\nexport type AnimationStyle = 'slide' | 'fade' | 'flip' | false;\n\n/**\n * Animation style for expand/collapse operations.\n * Subset of AnimationStyle - excludes 'flip' which is for position changes.\n * - `'slide'`: Slide down/up animation for expanding/collapsing content\n * - `'fade'`: Fade in/out animation\n * - `false`: No animation\n *\n * @example\n * ```typescript\n * // Tree rows slide down when expanding\n * new TreePlugin({ expandAnimation: 'slide' });\n *\n * // Row groups fade in/out\n * new GroupingRowsPlugin({ expandAnimation: 'fade' });\n *\n * // Master-detail panels with no animation\n * new MasterDetailPlugin({ expandAnimation: false });\n * ```\n *\n * @see {@link AnimationStyle} for all animation styles\n * @see {@link AnimationConfig} for grid-wide settings\n */\nexport type ExpandCollapseAnimation = 'slide' | 'fade' | false;\n\n/**\n * Type of row animation.\n * - `'change'`: Flash highlight when row data changes (e.g., after cell edit)\n * - `'insert'`: Slide-in animation for newly added rows\n * - `'remove'`: Fade-out animation for rows being removed\n *\n * @example\n * ```typescript\n * // Internal usage - row animation is triggered automatically:\n * // - 'change' after cell-commit event\n * // - 'insert' when rows are added to the grid\n * // - 'remove' when rows are deleted\n *\n * // The animation respects AnimationConfig.mode\n * grid.gridConfig = {\n *   animation: { mode: 'on', duration: 300 },\n * };\n * ```\n *\n * @see {@link AnimationConfig} for animation configuration\n */\nexport type RowAnimationType = 'change' | 'insert' | 'remove';\n\n/**\n * Grid-wide animation configuration.\n * Controls global animation behavior - individual plugins define their own animation styles.\n * Duration and easing values set corresponding CSS variables on the grid element.\n *\n * @example\n * ```typescript\n * // Enable animations regardless of system preferences\n * grid.gridConfig = {\n *   animation: {\n *     mode: 'on',\n *     duration: 300,\n *     easing: 'cubic-bezier(0.4, 0, 0.2, 1)',\n *   },\n * };\n *\n * // Disable all animations\n * grid.gridConfig = {\n *   animation: { mode: 'off' },\n * };\n *\n * // Respect user's reduced-motion preference (default)\n * grid.gridConfig = {\n *   animation: { mode: 'reduced-motion' },\n * };\n * ```\n *\n * @see {@link AnimationMode} for mode options\n */\nexport interface AnimationConfig {\n  /**\n   * Global animation mode.\n   * @default 'reduced-motion'\n   */\n  mode?: AnimationMode;\n\n  /**\n   * Default animation duration in milliseconds.\n   * Sets `--tbw-animation-duration` CSS variable.\n   * @default 200\n   */\n  duration?: number;\n\n  /**\n   * Default easing function.\n   * Sets `--tbw-animation-easing` CSS variable.\n   * @default 'ease-out'\n   */\n  easing?: string;\n}\n\n/** Default animation configuration */\nexport const DEFAULT_ANIMATION_CONFIG: Required<Omit<AnimationConfig, 'sort'>> = {\n  mode: 'reduced-motion',\n  duration: 200,\n  easing: 'ease-out',\n};\n\n// #endregion\n\n// #region Grid Icons\n\n/** Icon value - can be a string (text/HTML) or HTMLElement */\nexport type IconValue = string | HTMLElement;\n\n/**\n * Grid-wide icon configuration.\n * All icons are optional - sensible defaults are used when not specified.\n *\n * Icons can be text (including emoji), HTML strings (for SVG), or HTMLElement instances.\n *\n * @example\n * ```typescript\n * grid.gridConfig = {\n *   icons: {\n *     // Emoji icons\n *     expand: '➕',\n *     collapse: '➖',\n *\n *     // Custom SVG icon\n *     sortAsc: '<svg viewBox=\"0 0 16 16\"><path d=\"M8 4l4 8H4z\"/></svg>',\n *\n *     // Font icon class (wrap in span)\n *     filter: '<span class=\"icon icon-filter\"></span>',\n *   },\n * };\n * ```\n *\n * @see {@link IconValue} for allowed icon formats\n */\nexport interface GridIcons {\n  /** Expand icon for collapsed items (trees, groups, details). Default: '▶' */\n  expand?: IconValue;\n  /** Collapse icon for expanded items (trees, groups, details). Default: '▼' */\n  collapse?: IconValue;\n  /** Sort ascending indicator. Default: '▲' */\n  sortAsc?: IconValue;\n  /** Sort descending indicator. Default: '▼' */\n  sortDesc?: IconValue;\n  /** Sort neutral/unsorted indicator. Default: '⇅' */\n  sortNone?: IconValue;\n  /** Submenu arrow for context menus. Default: '▶' */\n  submenuArrow?: IconValue;\n  /** Drag handle icon for reordering. Default: '⋮⋮' */\n  dragHandle?: IconValue;\n  /** Tool panel toggle icon in toolbar. Default: '☰' */\n  toolPanel?: IconValue;\n  /** Filter icon in column headers. Default: SVG funnel icon */\n  filter?: IconValue;\n  /** Filter icon when filter is active. Default: same as filter with accent color */\n  filterActive?: IconValue;\n  /** Print icon for print button. Default: '🖨️' */\n  print?: IconValue;\n}\n\n/** Default filter icon SVG */\nconst DEFAULT_FILTER_ICON =\n  '<svg viewBox=\"0 0 16 16\" width=\"12\" height=\"12\"><path fill=\"currentColor\" d=\"M6 10.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-2-3a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11a.5.5 0 0 1-.5-.5z\"/></svg>';\n\n/** Default icons used when not overridden */\nexport const DEFAULT_GRID_ICONS: Required<GridIcons> = {\n  expand: '▶',\n  collapse: '▼',\n  sortAsc: '▲',\n  sortDesc: '▼',\n  sortNone: '⇅',\n  submenuArrow: '▶',\n  dragHandle: '⋮⋮',\n  toolPanel: '☰',\n  filter: DEFAULT_FILTER_ICON,\n  filterActive: DEFAULT_FILTER_ICON,\n  print: '🖨️',\n};\n// #endregion\n\n// #region Shell Configuration\n\n/**\n * Shell configuration for the grid's optional header bar and tool panels.\n *\n * The shell provides a wrapper around the grid with:\n * - Header bar with title, toolbar buttons, and custom content\n * - Collapsible side panel for filters, column visibility, settings, etc.\n *\n * @example\n * ```typescript\n * grid.gridConfig = {\n *   shell: {\n *     header: {\n *       title: 'Employee Directory',\n *     },\n *     toolPanel: {\n *       position: 'right',\n *       defaultOpen: 'columns', // Open by default\n *     },\n *   },\n *   plugins: [new VisibilityPlugin()], // Adds \"Columns\" panel\n * };\n *\n * // Register custom tool panels\n * grid.registerToolPanel({\n *   id: 'filters',\n *   title: 'Filters',\n *   icon: '🔍',\n *   render: (container) => {\n *     container.innerHTML = '<div>Filter controls...</div>';\n *   },\n * });\n * ```\n *\n * @see {@link ShellHeaderConfig} for header options\n * @see {@link ToolPanelConfig} for tool panel options\n */\nexport interface ShellConfig {\n  /** Shell header bar configuration */\n  header?: ShellHeaderConfig;\n  /** Tool panel configuration */\n  toolPanel?: ToolPanelConfig;\n  /**\n   * Registered tool panels (from plugins, API, or Light DOM).\n   * These are the actual panel definitions that can be opened.\n   * @internal Set by ConfigManager during merge\n   */\n  toolPanels?: ToolPanelDefinition[];\n  /**\n   * Registered header content sections (from plugins or API).\n   * Content rendered in the center of the shell header.\n   * @internal Set by ConfigManager during merge\n   */\n  headerContents?: HeaderContentDefinition[];\n}\n\n/**\n * Shell header bar configuration\n */\nexport interface ShellHeaderConfig {\n  /** Grid title displayed on the left (optional) */\n  title?: string;\n  /** Custom toolbar content (rendered before tool panel toggle) */\n  toolbarContents?: ToolbarContentDefinition[];\n  /**\n   * Light DOM header content elements (parsed from <tbw-grid-header> children).\n   * @internal Set by ConfigManager during merge\n   */\n  lightDomContent?: HTMLElement[];\n  /**\n   * Whether a tool buttons container was found in light DOM.\n   * @internal Set by ConfigManager during merge\n   */\n  hasToolButtonsContainer?: boolean;\n}\n\n/**\n * Tool panel configuration\n */\nexport interface ToolPanelConfig {\n  /** Panel position: 'left' | 'right' (default: 'right') */\n  position?: 'left' | 'right';\n  /** Default panel width in pixels (default: 280) */\n  width?: number;\n  /** Panel ID to open by default on load */\n  defaultOpen?: string;\n  /** Whether to persist open/closed state (requires Column State Events) */\n  persistState?: boolean;\n  /**\n   * Close the tool panel when clicking outside of it.\n   * When `true`, clicking anywhere outside the tool panel (but inside the grid)\n   * will close the panel automatically.\n   * @default false\n   */\n  closeOnClickOutside?: boolean;\n}\n\n/**\n * Toolbar content definition for the shell header toolbar area.\n * Register via `registerToolbarContent()` or use light DOM `<tbw-grid-tool-buttons>`.\n *\n * @example\n * ```typescript\n * grid.registerToolbarContent({\n *   id: 'my-toolbar',\n *   order: 10,\n *   render: (container) => {\n *     const btn = document.createElement('button');\n *     btn.textContent = 'Refresh';\n *     btn.onclick = () => console.log('clicked');\n *     container.appendChild(btn);\n *     return () => btn.remove();\n *   },\n * });\n * ```\n */\nexport interface ToolbarContentDefinition {\n  /** Unique content ID */\n  id: string;\n  /** Content factory - called once when shell header renders */\n  render: (container: HTMLElement) => void | (() => void);\n  /** Called when content is removed (for cleanup) */\n  onDestroy?: () => void;\n  /** Order priority (lower = first, default: 100) */\n  order?: number;\n}\n\n/**\n * Tool panel definition registered by plugins or consumers.\n *\n * Register via `grid.registerToolPanel()` to add panels to the sidebar.\n * Panels appear as collapsible sections with icons and titles.\n *\n * @example\n * ```typescript\n * grid.registerToolPanel({\n *   id: 'filters',\n *   title: 'Filters',\n *   icon: '🔍',\n *   tooltip: 'Filter grid data',\n *   order: 10, // Lower = appears first\n *   render: (container) => {\n *     container.innerHTML = `\n *       <div class=\"filter-panel\">\n *         <input type=\"text\" placeholder=\"Search...\" />\n *       </div>\n *     `;\n *     // Return cleanup function\n *     return () => container.innerHTML = '';\n *   },\n *   onClose: () => {\n *     console.log('Filter panel closed');\n *   },\n * });\n * ```\n *\n * @see {@link ShellConfig} for shell configuration\n */\nexport interface ToolPanelDefinition {\n  /** Unique panel ID */\n  id: string;\n  /** Panel title shown in accordion header */\n  title: string;\n  /** Icon for accordion section header (optional, emoji or SVG) */\n  icon?: string;\n  /** Tooltip for accordion section header */\n  tooltip?: string;\n  /** Panel content factory - called when panel section opens */\n  render: (container: HTMLElement) => void | (() => void);\n  /** Called when panel closes (for cleanup) */\n  onClose?: () => void;\n  /** Panel order priority (lower = first, default: 100) */\n  order?: number;\n}\n\n/**\n * Header content definition for plugins contributing to shell header center section.\n *\n * Register via `grid.registerHeaderContent()` to add content between\n * the title and toolbar buttons.\n *\n * @example\n * ```typescript\n * grid.registerHeaderContent({\n *   id: 'row-count',\n *   order: 10,\n *   render: (container) => {\n *     const span = document.createElement('span');\n *     span.className = 'row-count';\n *     span.textContent = `${grid.rows.length} rows`;\n *     container.appendChild(span);\n *\n *     // Update on data changes\n *     const update = () => span.textContent = `${grid.rows.length} rows`;\n *     grid.addEventListener('data-change', update);\n *\n *     return () => {\n *       grid.removeEventListener('data-change', update);\n *     };\n *   },\n * });\n * ```\n *\n * @see {@link ShellConfig} for shell configuration\n */\nexport interface HeaderContentDefinition {\n  /** Unique content ID */\n  id: string;\n  /** Content factory - called once when shell header renders */\n  render: (container: HTMLElement) => void | (() => void);\n  /** Called when content is removed (for cleanup) */\n  onDestroy?: () => void;\n  /** Order priority (lower = first, default: 100) */\n  order?: number;\n}\n// #endregion\n\n// #region Column State (Persistence)\n\n/**\n * State for a single column. Captures user-driven changes at runtime.\n * Plugins can extend this interface via module augmentation to add their own state.\n *\n * Used with `grid.getColumnState()` and `grid.columnState` for persisting\n * user customizations (column widths, order, visibility, sort).\n *\n * @example\n * ```typescript\n * // Save column state to localStorage\n * const state = grid.getColumnState();\n * localStorage.setItem('gridState', JSON.stringify(state));\n *\n * // Restore on page load\n * const saved = localStorage.getItem('gridState');\n * if (saved) {\n *   grid.columnState = JSON.parse(saved);\n * }\n *\n * // Example column state structure\n * const state: GridColumnState = {\n *   columns: [\n *     { field: 'name', order: 0, width: 200, hidden: false },\n *     { field: 'email', order: 1, width: 300, hidden: false },\n *     { field: 'phone', order: 2, hidden: true }, // Hidden column\n *   ],\n *   sort: { field: 'name', direction: 1 },\n * };\n * ```\n *\n * @example\n * ```typescript\n * // Plugin augmentation example (in filtering plugin)\n * declare module '@toolbox-web/grid' {\n *   interface ColumnState {\n *     filter?: FilterValue;\n *   }\n * }\n * ```\n *\n * @see {@link GridColumnState} for the full state object\n */\nexport interface ColumnState {\n  /** Column field identifier */\n  field: string;\n  /** Position index after reordering (0-based) */\n  order: number;\n  /** Width in pixels (undefined = use default) */\n  width?: number;\n  /** Visibility state */\n  visible: boolean;\n  /** Sort state (undefined = not sorted). */\n  sort?: ColumnSortState;\n}\n\n/**\n * Sort state for a column.\n * Used within {@link ColumnState} to track sort direction and priority.\n *\n * @see {@link ColumnState} for column state persistence\n * @see {@link SortChangeDetail} for sort change events\n */\nexport interface ColumnSortState {\n  /** Sort direction */\n  direction: 'asc' | 'desc';\n  /** Priority for multi-sort (0 = primary, 1 = secondary, etc.) */\n  priority: number;\n}\n\n/**\n * Complete grid column state for persistence.\n * Contains state for all columns, including plugin-contributed properties.\n *\n * @example\n * ```typescript\n * // Save state\n * const state = grid.getColumnState();\n * localStorage.setItem('grid-state', JSON.stringify(state));\n *\n * // Restore state\n * grid.columnState = JSON.parse(localStorage.getItem('grid-state'));\n * ```\n *\n * @see {@link ColumnState} for individual column state\n * @see {@link PublicGrid.getColumnState} for retrieving state\n */\nexport interface GridColumnState {\n  /** Array of column states. */\n  columns: ColumnState[];\n}\n// #endregion\n\n// #region Public Event Detail Interfaces\n/**\n * Detail for a cell click event.\n * Provides full context about the clicked cell including row data.\n *\n * @example\n * ```typescript\n * grid.addEventListener('cell-click', (e: CustomEvent<CellClickDetail>) => {\n *   const { row, field, value, rowIndex, colIndex } = e.detail;\n *   console.log(`Clicked ${field} = ${value} in row ${rowIndex}`);\\n *\n *   // Access the full row data\n *   if (row.status === 'pending') {\n *     showApprovalDialog(row);\n *   }\n * });\n * ```\n *\n * @category Events\n */\nexport interface CellClickDetail<TRow = unknown> {\n  /** Zero-based row index of the clicked cell. */\n  rowIndex: number;\n  /** Zero-based column index of the clicked cell. */\n  colIndex: number;\n  /** Column configuration object for the clicked cell. */\n  column: ColumnConfig<TRow>;\n  /** Field name of the clicked column. */\n  field: string;\n  /** Cell value at the clicked position. */\n  value: unknown;\n  /** Full row data object. */\n  row: TRow;\n  /** The clicked cell element. */\n  cellEl: HTMLElement;\n  /** The original mouse event. */\n  originalEvent: MouseEvent;\n}\n\n/**\n * Detail for a row click event.\n * Provides context about the clicked row.\n *\n * @example\n * ```typescript\n * grid.addEventListener('row-click', (e: CustomEvent<RowClickDetail>) => {\n *   const { row, rowIndex, rowEl } = e.detail;\n *   console.log(`Clicked row ${rowIndex}: ${row.name}`);\n *\n *   // Highlight the row\n *   rowEl.classList.add('selected');\n *\n *   // Open detail panel\n *   showDetailPanel(row);\n * });\n * ```\n *\n * @category Events\n */\nexport interface RowClickDetail<TRow = unknown> {\n  /** Zero-based row index of the clicked row. */\n  rowIndex: number;\n  /** Full row data object. */\n  row: TRow;\n  /** The clicked row element. */\n  rowEl: HTMLElement;\n  /** The original mouse event. */\n  originalEvent: MouseEvent;\n}\n\n/**\n * Detail for a sort change (direction 0 indicates cleared sort).\n *\n * @example\n * ```typescript\n * grid.addEventListener('sort-change', (e: CustomEvent<SortChangeDetail>) => {\n *   const { field, direction } = e.detail;\n *\n *   if (direction === 0) {\n *     console.log(`Sort cleared on ${field}`);\n *   } else {\n *     const dir = direction === 1 ? 'ascending' : 'descending';\n *     console.log(`Sorted by ${field} ${dir}`);\n *   }\n *\n *   // Fetch sorted data from server\n *   fetchData({ sortBy: field, sortDir: direction });\n * });\n * ```\n *\n * @see {@link SortState} for the sort state object\n * @see {@link SortHandler} for custom sort handlers\n * @category Events\n */\nexport interface SortChangeDetail {\n  /** Sorted field key. */\n  field: string;\n  /** Direction: 1 ascending, -1 descending, 0 cleared. */\n  direction: 1 | -1 | 0;\n}\n\n/**\n * Column resize event detail containing final pixel width.\n *\n * @example\n * ```typescript\n * grid.addEventListener('column-resize', (e: CustomEvent<ColumnResizeDetail>) => {\n *   const { field, width } = e.detail;\n *   console.log(`Column ${field} resized to ${width}px`);\n *\n *   // Persist to user preferences\n *   saveColumnWidth(field, width);\n * });\n * ```\n *\n * @see {@link ColumnState} for persisting column state\n * @see {@link ResizeController} for resize implementation\n * @category Events\n */\nexport interface ColumnResizeDetail {\n  /** Resized column field key. */\n  field: string;\n  /** New width in pixels. */\n  width: number;\n}\n\n/**\n * Trigger type for cell activation.\n * - `'keyboard'`: Enter key pressed on focused cell\n * - `'pointer'`: Mouse/touch/pen click on cell\n *\n * @see {@link CellActivateDetail} for the activation event detail\n * @category Events\n */\nexport type CellActivateTrigger = 'keyboard' | 'pointer';\n\n/**\n * Fired when a cell is activated by user interaction (Enter key or click).\n * Unified event for both keyboard and pointer activation.\n *\n * @example\n * ```typescript\n * grid.addEventListener('cell-activate', (e: CustomEvent<CellActivateDetail>) => {\n *   const { row, field, value, trigger, cellEl } = e.detail;\n *\n *   if (trigger === 'keyboard') {\n *     console.log('Activated via Enter key');\n *   } else {\n *     console.log('Activated via click/tap');\n *   }\n *\n *   // Start custom editing for specific columns\n *   if (field === 'notes') {\n *     openNotesEditor(row, cellEl);\n *     e.preventDefault(); // Prevent default editing\n *   }\n * });\n * ```\n *\n * @see {@link CellClickDetail} for click-only events\n * @see {@link CellActivateTrigger} for trigger types\n * @category Events\n */\nexport interface CellActivateDetail<TRow = unknown> {\n  /** Zero-based row index of the activated cell. */\n  rowIndex: number;\n  /** Zero-based column index of the activated cell. */\n  colIndex: number;\n  /** Field name of the activated column. */\n  field: string;\n  /** Cell value at the activated position. */\n  value: unknown;\n  /** Full row data object. */\n  row: TRow;\n  /** The activated cell element. */\n  cellEl: HTMLElement;\n  /** What triggered the activation. */\n  trigger: CellActivateTrigger;\n  /** The original event (KeyboardEvent for keyboard, MouseEvent/PointerEvent for pointer). */\n  originalEvent: KeyboardEvent | MouseEvent | PointerEvent;\n}\n\n/**\n * @deprecated Use `CellActivateDetail` instead. Will be removed in next major version.\n * Kept for backwards compatibility.\n *\n * @category Events\n */\nexport interface ActivateCellDetail {\n  /** Zero-based row index now focused. */\n  row: number;\n  /** Zero-based column index now focused. */\n  col: number;\n}\n\n/**\n * Event detail for mounting external view renderers.\n *\n * Emitted when a cell uses an external component spec (React, Angular, Vue)\n * and needs the framework adapter to mount the component.\n *\n * @example\n * ```typescript\n * // Framework adapter listens for this event\n * grid.addEventListener('mount-external-view', (e: CustomEvent<ExternalMountViewDetail>) => {\n *   const { placeholder, spec, context } = e.detail;\n *   // Mount framework component into placeholder\n *   mountComponent(spec.component, placeholder, context);\n * });\n * ```\n *\n * @see {@link ColumnConfig.externalView} for external view spec\n * @see {@link FrameworkAdapter} for adapter interface\n * @category Framework Adapters\n */\nexport interface ExternalMountViewDetail<TRow = unknown> {\n  placeholder: HTMLElement;\n  spec: unknown;\n  context: { row: TRow; value: unknown; field: string; column: unknown };\n}\n\n/**\n * Event detail for mounting external editor renderers.\n *\n * Emitted when a cell uses an external editor component spec and needs\n * the framework adapter to mount the editor with commit/cancel bindings.\n *\n * @example\n * ```typescript\n * // Framework adapter listens for this event\n * grid.addEventListener('mount-external-editor', (e: CustomEvent<ExternalMountEditorDetail>) => {\n *   const { placeholder, spec, context } = e.detail;\n *   // Mount framework editor with commit/cancel wired\n *   mountEditor(spec.component, placeholder, {\n *     value: context.value,\n *     onCommit: context.commit,\n *     onCancel: context.cancel,\n *   });\n * });\n * ```\n *\n * @see {@link ColumnEditorSpec} for external editor spec\n * @see {@link FrameworkAdapter} for adapter interface\n * @category Framework Adapters\n */\nexport interface ExternalMountEditorDetail<TRow = unknown> {\n  placeholder: HTMLElement;\n  spec: unknown;\n  context: {\n    row: TRow;\n    value: unknown;\n    field: string;\n    column: unknown;\n    commit: (v: unknown) => void;\n    cancel: () => void;\n  };\n}\n\n/**\n * Maps event names to their detail payload types.\n *\n * Use this interface for strongly typed event handling.\n *\n * @example\n * ```typescript\n * // Type-safe event listener\n * function handleEvent<K extends keyof DataGridEventMap>(\n *   grid: DataGridElement,\n *   event: K,\n *   handler: (detail: DataGridEventMap[K]) => void,\n * ): void {\n *   grid.addEventListener(event, (e: CustomEvent) => handler(e.detail));\n * }\n *\n * handleEvent(grid, 'cell-click', (detail) => {\n *   console.log(detail.field); // Type-safe access\n * });\n * ```\n *\n * @see {@link DataGridCustomEvent} for typed CustomEvent wrapper\n * @see {@link DGEvents} for event name constants\n * @category Events\n */\nexport interface DataGridEventMap<TRow = unknown> {\n  'cell-click': CellClickDetail<TRow>;\n  'row-click': RowClickDetail<TRow>;\n  'cell-activate': CellActivateDetail<TRow>;\n  'cell-change': CellChangeDetail<TRow>;\n  'mount-external-view': ExternalMountViewDetail<TRow>;\n  'mount-external-editor': ExternalMountEditorDetail<TRow>;\n  'sort-change': SortChangeDetail;\n  'column-resize': ColumnResizeDetail;\n  /** @deprecated Use 'cell-activate' instead */\n  'activate-cell': ActivateCellDetail;\n  'column-state-change': GridColumnState;\n  // Note: 'cell-commit', 'row-commit', 'changed-rows-reset' are added via\n  // module augmentation by EditingPlugin when imported\n}\n\n/**\n * Extracts the event detail type for a given event name.\n *\n * Utility type for getting the detail payload type of a specific event.\n *\n * @example\n * ```typescript\n * // Extract detail type for specific event\n * type ClickDetail = DataGridEventDetail<'cell-click', Employee>;\n * // Equivalent to: CellClickDetail<Employee>\n *\n * // Use in generic handler\n * function logDetail<K extends keyof DataGridEventMap>(\n *   eventName: K,\n *   detail: DataGridEventDetail<K>,\n * ): void {\n *   console.log(`${eventName}:`, detail);\n * }\n * ```\n *\n * @see {@link DataGridEventMap} for all event types\n * @category Events\n */\nexport type DataGridEventDetail<K extends keyof DataGridEventMap<unknown>, TRow = unknown> = DataGridEventMap<TRow>[K];\n\n/**\n * Custom event type for DataGrid events with typed detail payload.\n *\n * Use this type when you need to cast or declare event handler parameters.\n *\n * @example\n * ```typescript\n * // Strongly typed event handler\n * function onCellClick(e: DataGridCustomEvent<'cell-click', Employee>): void {\n *   const { row, field, value } = e.detail;\n *   console.log(`Clicked ${field} = ${value} on ${row.name}`);\n * }\n *\n * grid.addEventListener('cell-click', onCellClick);\n * ```\n *\n * @see {@link DataGridEventMap} for all event types\n * @see {@link DataGridEventDetail} for extracting detail type only\n * @category Events\n */\nexport type DataGridCustomEvent<K extends keyof DataGridEventMap<unknown>, TRow = unknown> = CustomEvent<\n  DataGridEventMap<TRow>[K]\n>;\n\n/**\n * Template evaluation context for dynamic templates.\n *\n * @category Plugin Development\n */\nexport interface EvalContext {\n  value: unknown;\n  row: Record<string, unknown> | null;\n}\n// #endregion\n","/**\n * Base Grid Plugin Class\n *\n * All plugins extend this abstract class.\n * Plugins are instantiated per-grid and manage their own state.\n */\n\n// Injected by Vite at build time from package.json (same as grid.ts)\ndeclare const __GRID_VERSION__: string;\n\nimport type {\n  ColumnConfig,\n  ColumnState,\n  GridPlugin,\n  HeaderContentDefinition,\n  IconValue,\n  ToolPanelDefinition,\n} from '../types';\nimport { DEFAULT_GRID_ICONS } from '../types';\n\n// Re-export shared plugin types for convenience\nexport { PLUGIN_QUERIES } from './types';\nexport type {\n  AfterCellRenderContext,\n  AfterRowRenderContext,\n  CellClickEvent,\n  CellCoords,\n  CellEditor,\n  CellMouseEvent,\n  CellRenderer,\n  ContextMenuItem,\n  ContextMenuParams,\n  GridElementRef,\n  HeaderClickEvent,\n  HeaderRenderer,\n  KeyboardModifiers,\n  PluginCellRenderContext,\n  PluginQuery,\n  RowClickEvent,\n  ScrollEvent,\n} from './types';\n\nimport type {\n  AfterCellRenderContext,\n  AfterRowRenderContext,\n  CellClickEvent,\n  CellEditor,\n  CellMouseEvent,\n  CellRenderer,\n  GridElementRef,\n  HeaderClickEvent,\n  HeaderRenderer,\n  PluginQuery,\n  RowClickEvent,\n  ScrollEvent,\n} from './types';\n\n/**\n * Grid element interface for plugins.\n * Extends GridElementRef with plugin-specific methods.\n * Note: effectiveConfig is already available from GridElementRef.\n */\nexport interface GridElement extends GridElementRef {\n  getPlugin<T extends BaseGridPlugin>(PluginClass: new (...args: any[]) => T): T | undefined;\n  getPluginByName(name: string): BaseGridPlugin | undefined;\n  /**\n   * Get a plugin's state by plugin name.\n   * This is a loose-coupling method for plugins to access other plugins' state\n   * without importing the plugin class directly.\n   * @internal Plugin API\n   */\n  getPluginState?(name: string): unknown;\n}\n\n/**\n * Header render context for plugin header renderers.\n */\nexport interface PluginHeaderRenderContext {\n  /** Column configuration */\n  column: ColumnConfig;\n  /** Column index */\n  colIndex: number;\n}\n\n// ============================================================================\n// Plugin Dependency Types\n// ============================================================================\n\n/**\n * Declares a dependency on another plugin.\n *\n * @category Plugin Development\n * @example\n * ```typescript\n * export class UndoRedoPlugin extends BaseGridPlugin {\n *   static readonly dependencies: PluginDependency[] = [\n *     { name: 'editing', required: true },\n *   ];\n * }\n * ```\n */\nexport interface PluginDependency {\n  /**\n   * The name of the required plugin (matches the plugin's `name` property).\n   * Use string names for loose coupling - avoids static imports.\n   */\n  name: string;\n\n  /**\n   * Whether this dependency is required (hard) or optional (soft).\n   * - `true`: Plugin cannot function without it. Throws error if missing.\n   * - `false`: Plugin works with reduced functionality. Logs info if missing.\n   * @default true\n   */\n  required?: boolean;\n\n  /**\n   * Human-readable reason for this dependency.\n   * Shown in error/info messages to help users understand why.\n   * @example \"UndoRedoPlugin needs EditingPlugin to track cell edits\"\n   */\n  reason?: string;\n}\n\n/**\n * Declares an incompatibility between plugins.\n * When both plugins are loaded, a warning is logged to help users understand the conflict.\n *\n * @category Plugin Development\n */\nexport interface PluginIncompatibility {\n  /**\n   * The name of the incompatible plugin (matches the plugin's `name` property).\n   */\n  name: string;\n\n  /**\n   * Human-readable reason for the incompatibility.\n   * Should explain why the plugins conflict and any workarounds.\n   * @example \"Responsive card layout does not support row grouping yet\"\n   */\n  reason: string;\n}\n\n// ============================================================================\n// Plugin Query & Event Definitions\n// ============================================================================\n\n/**\n * Defines a query that a plugin can handle.\n * Other plugins or the grid can send this query type to retrieve data.\n *\n * @category Plugin Development\n *\n * @example\n * ```typescript\n * // In manifest\n * queries: [\n *   {\n *     type: 'canMoveColumn',\n *     description: 'Check if a column can be moved/reordered',\n *   },\n * ]\n *\n * // In plugin class\n * handleQuery(query: PluginQuery): unknown {\n *   if (query.type === 'canMoveColumn') {\n *     return this.canMoveColumn(query.context);\n *   }\n * }\n * ```\n */\nexport interface QueryDefinition {\n  /**\n   * The query type identifier (e.g., 'canMoveColumn', 'getContextMenuItems').\n   * Should be unique across all plugins.\n   */\n  type: string;\n\n  /**\n   * Human-readable description of what the query does.\n   */\n  description?: string;\n}\n\n/**\n * Defines an event that a plugin can emit.\n * Other plugins can subscribe to these events via the Event Bus.\n *\n * @category Plugin Development\n *\n * @example\n * ```typescript\n * // In manifest\n * events: [\n *   {\n *     type: 'filter-change',\n *     description: 'Emitted when filter criteria change',\n *   },\n * ]\n *\n * // In plugin class - emit\n * this.emitPluginEvent('filter-change', { field: 'name', value: 'Alice' });\n *\n * // In another plugin - subscribe\n * this.on('filter-change', (detail) => console.log('Filter changed:', detail));\n * ```\n */\nexport interface EventDefinition {\n  /**\n   * The event type identifier (e.g., 'filter-change', 'selection-change').\n   * Used when emitting and subscribing to events.\n   */\n  type: string;\n\n  /**\n   * Human-readable description of what the event represents.\n   */\n  description?: string;\n\n  /**\n   * Whether this event is cancelable via `event.preventDefault()`.\n   * @default false\n   */\n  cancelable?: boolean;\n}\n\n// ============================================================================\n// Plugin Manifest Types\n// ============================================================================\n\n/**\n * Defines a property that a plugin \"owns\" - used for configuration validation.\n * When this property is used without the owning plugin loaded, an error is thrown.\n *\n * @category Plugin Development\n */\nexport interface PluginPropertyDefinition {\n  /** The property name on column or grid config */\n  property: string;\n  /** Whether this is a column-level or config-level property */\n  level: 'column' | 'config';\n  /** Human-readable description for error messages (e.g., 'the \"editable\" column property') */\n  description: string;\n  /** Import path hint for error messages (e.g., \"import { EditingPlugin } from '@toolbox-web/grid/plugins/editing';\") */\n  importHint?: string;\n  /** Custom check for whether property is considered \"used\" (default: truthy value check) */\n  isUsed?: (value: unknown) => boolean;\n}\n\n/**\n * A configuration validation rule for detecting invalid/conflicting settings.\n * Plugins declare rules in their manifest; the validator executes them during grid initialization.\n *\n * @category Plugin Development\n * @template TConfig - The plugin's configuration type\n */\nexport interface PluginConfigRule<TConfig = unknown> {\n  /** Rule identifier for debugging (e.g., 'selection/range-dblclick') */\n  id: string;\n  /** Severity: 'error' throws, 'warn' logs warning */\n  severity: 'error' | 'warn';\n  /** Human-readable message shown when rule is violated */\n  message: string;\n  /** Predicate returning true if the rule is VIOLATED (i.e., config is invalid) */\n  check: (pluginConfig: TConfig) => boolean;\n}\n\n/**\n * Hook names that can have execution priority configured.\n *\n * @category Plugin Development\n */\nexport type HookName =\n  | 'processColumns'\n  | 'processRows'\n  | 'afterRender'\n  | 'afterCellRender'\n  | 'afterRowRender'\n  | 'onCellClick'\n  | 'onCellMouseDown'\n  | 'onCellMouseMove'\n  | 'onCellMouseUp'\n  | 'onKeyDown'\n  | 'onScroll'\n  | 'onScrollRender';\n\n/**\n * Static metadata about a plugin's capabilities and requirements.\n * Declared as a static property on plugin classes.\n *\n * @category Plugin Development\n * @template TConfig - The plugin's configuration type\n *\n * @example\n * ```typescript\n * export class MyPlugin extends BaseGridPlugin<MyConfig> {\n *   static override readonly manifest: PluginManifest<MyConfig> = {\n *     ownedProperties: [\n *       { property: 'myProp', level: 'column', description: 'the \"myProp\" column property' },\n *     ],\n *     configRules: [\n *       { id: 'my-plugin/invalid-combo', severity: 'warn', message: '...', check: (c) => c.a && c.b },\n *     ],\n *   };\n *   readonly name = 'myPlugin';\n * }\n * ```\n */\nexport interface PluginManifest<TConfig = unknown> {\n  /**\n   * Properties this plugin owns - validated by validate-config.ts.\n   * If a user uses one of these properties without loading the plugin, an error is thrown.\n   */\n  ownedProperties?: PluginPropertyDefinition[];\n\n  /**\n   * Hook execution priority (higher = later, default 0).\n   * Use negative values to run earlier, positive to run later.\n   */\n  hookPriority?: Partial<Record<HookName, number>>;\n\n  /**\n   * Configuration validation rules - checked during grid initialization.\n   * Rules with severity 'error' throw, 'warn' logs to console.\n   */\n  configRules?: PluginConfigRule<TConfig>[];\n\n  /**\n   * Plugins that are incompatible with this plugin.\n   * When both plugins are loaded together, a warning is shown.\n   *\n   * @example\n   * ```typescript\n   * incompatibleWith: [\n   *   { name: 'groupingRows', reason: 'Responsive card layout does not support row grouping yet' },\n   * ],\n   * ```\n   */\n  incompatibleWith?: PluginIncompatibility[];\n\n  /**\n   * Queries this plugin can handle.\n   * Declares what query types this plugin responds to via `handleQuery()`.\n   * This replaces the centralized PLUGIN_QUERIES approach with manifest-declared queries.\n   *\n   * @example\n   * ```typescript\n   * queries: [\n   *   { type: 'canMoveColumn', description: 'Check if a column can be moved' },\n   * ],\n   * ```\n   */\n  queries?: QueryDefinition[];\n\n  /**\n   * Events this plugin can emit.\n   * Declares what event types other plugins can subscribe to via `on()`.\n   *\n   * @example\n   * ```typescript\n   * events: [\n   *   { type: 'filter-change', description: 'Emitted when filter criteria change' },\n   * ],\n   * ```\n   */\n  events?: EventDefinition[];\n}\n\n/**\n * Abstract base class for all grid plugins.\n *\n * @category Plugin Development\n * @template TConfig - Configuration type for the plugin\n */\nexport abstract class BaseGridPlugin<TConfig = unknown> implements GridPlugin {\n  /**\n   * Plugin dependencies - declare other plugins this one requires.\n   *\n   * Dependencies are validated when the plugin is attached.\n   * Required dependencies throw an error if missing.\n   * Optional dependencies log an info message if missing.\n   *\n   * @example\n   * ```typescript\n   * static readonly dependencies: PluginDependency[] = [\n   *   { name: 'editing', required: true, reason: 'Tracks cell edits for undo/redo' },\n   *   { name: 'selection', required: false, reason: 'Enables selection-based undo' },\n   * ];\n   * ```\n   */\n  static readonly dependencies?: PluginDependency[];\n\n  /**\n   * Plugin manifest - declares owned properties, config rules, and hook priorities.\n   *\n   * This is read by the configuration validator to:\n   * - Validate that required plugins are loaded when their properties are used\n   * - Execute configRules to detect invalid/conflicting settings\n   * - Order hook execution based on priority\n   *\n   * @example\n   * ```typescript\n   * static override readonly manifest: PluginManifest<MyConfig> = {\n   *   ownedProperties: [\n   *     { property: 'myProp', level: 'column', description: 'the \"myProp\" column property' },\n   *   ],\n   *   configRules: [\n   *     { id: 'myPlugin/conflict', severity: 'warn', message: '...', check: (c) => c.a && c.b },\n   *   ],\n   * };\n   * ```\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  static readonly manifest?: PluginManifest<any>;\n\n  /** Unique plugin identifier (derived from class name by default) */\n  abstract readonly name: string;\n\n  /**\n   * Plugin version - defaults to grid version for built-in plugins.\n   * Third-party plugins can override with their own semver.\n   */\n  readonly version: string = typeof __GRID_VERSION__ !== 'undefined' ? __GRID_VERSION__ : 'dev';\n\n  /** CSS styles to inject into the grid's shadow DOM */\n  readonly styles?: string;\n\n  /** Custom cell renderers keyed by type name */\n  readonly cellRenderers?: Record<string, CellRenderer>;\n\n  /** Custom header renderers keyed by type name */\n  readonly headerRenderers?: Record<string, HeaderRenderer>;\n\n  /** Custom cell editors keyed by type name */\n  readonly cellEditors?: Record<string, CellEditor>;\n\n  /** The grid instance this plugin is attached to */\n  protected grid!: GridElement;\n\n  /** Plugin configuration - merged with defaults in attach() */\n  protected config!: TConfig;\n\n  /** User-provided configuration from constructor */\n  protected readonly userConfig: Partial<TConfig>;\n\n  /**\n   * Plugin-level AbortController for event listener cleanup.\n   * Created fresh in attach(), aborted in detach().\n   * This ensures event listeners are properly cleaned up when plugins are re-attached.\n   */\n  #abortController?: AbortController;\n\n  /**\n   * Default configuration - subclasses should override this getter.\n   * Note: This must be a getter (not property initializer) for proper inheritance\n   * since property initializers run after parent constructor.\n   */\n  protected get defaultConfig(): Partial<TConfig> {\n    return {};\n  }\n\n  constructor(config: Partial<TConfig> = {}) {\n    this.userConfig = config;\n  }\n\n  /**\n   * Called when the plugin is attached to a grid.\n   * Override to set up event listeners, initialize state, etc.\n   *\n   * @example\n   * ```ts\n   * attach(grid: GridElement): void {\n   *   super.attach(grid);\n   *   // Set up document-level listeners with auto-cleanup\n   *   document.addEventListener('keydown', this.handleEscape, {\n   *     signal: this.disconnectSignal\n   *   });\n   * }\n   * ```\n   */\n  attach(grid: GridElement): void {\n    // Abort any previous abort controller (in case of re-attach without detach)\n    this.#abortController?.abort();\n    // Create fresh abort controller for this attachment\n    this.#abortController = new AbortController();\n\n    this.grid = grid;\n    // Merge config here (after subclass construction is complete)\n    this.config = { ...this.defaultConfig, ...this.userConfig } as TConfig;\n  }\n\n  /**\n   * Called when the plugin is detached from a grid.\n   * Override to clean up event listeners, timers, etc.\n   *\n   * @example\n   * ```ts\n   * detach(): void {\n   *   // Clean up any state not handled by disconnectSignal\n   *   this.selectedRows.clear();\n   *   this.cache = null;\n   * }\n   * ```\n   */\n  detach(): void {\n    // Abort the plugin's abort controller to clean up all event listeners\n    // registered with { signal: this.disconnectSignal }\n    this.#abortController?.abort();\n    this.#abortController = undefined;\n    // Override in subclass for additional cleanup\n  }\n\n  /**\n   * Called when another plugin is attached to the same grid.\n   * Use for inter-plugin coordination, e.g., to integrate with new plugins.\n   *\n   * @param name - The name of the plugin that was attached\n   * @param plugin - The plugin instance (for direct access if needed)\n   *\n   * @example\n   * ```ts\n   * onPluginAttached(name: string, plugin: BaseGridPlugin): void {\n   *   if (name === 'selection') {\n   *     // Integrate with selection plugin\n   *     this.selectionPlugin = plugin as SelectionPlugin;\n   *   }\n   * }\n   * ```\n   */\n  onPluginAttached?(name: string, plugin: BaseGridPlugin): void;\n\n  /**\n   * Called when another plugin is detached from the same grid.\n   * Use to clean up inter-plugin references.\n   *\n   * @param name - The name of the plugin that was detached\n   *\n   * @example\n   * ```ts\n   * onPluginDetached(name: string): void {\n   *   if (name === 'selection') {\n   *     this.selectionPlugin = undefined;\n   *   }\n   * }\n   * ```\n   */\n  onPluginDetached?(name: string): void;\n\n  /**\n   * Get another plugin instance from the same grid.\n   * Use for inter-plugin communication.\n   *\n   * @example\n   * ```ts\n   * const selection = this.getPlugin(SelectionPlugin);\n   * if (selection) {\n   *   const selectedRows = selection.getSelectedRows();\n   * }\n   * ```\n   */\n  protected getPlugin<T extends BaseGridPlugin>(PluginClass: new (...args: any[]) => T): T | undefined {\n    return this.grid?.getPlugin(PluginClass);\n  }\n\n  /**\n   * Emit a custom event from the grid.\n   */\n  protected emit<T>(eventName: string, detail: T): void {\n    this.grid?.dispatchEvent?.(new CustomEvent(eventName, { detail, bubbles: true }));\n  }\n\n  /**\n   * Emit a cancelable custom event from the grid.\n   * @returns `true` if the event was cancelled (preventDefault called), `false` otherwise\n   */\n  protected emitCancelable<T>(eventName: string, detail: T): boolean {\n    const event = new CustomEvent(eventName, { detail, bubbles: true, cancelable: true });\n    this.grid?.dispatchEvent?.(event);\n    return event.defaultPrevented;\n  }\n\n  // =========================================================================\n  // Event Bus - Plugin-to-Plugin Communication\n  // =========================================================================\n\n  /**\n   * Subscribe to an event from another plugin.\n   * The subscription is automatically cleaned up when this plugin is detached.\n   *\n   * @category Plugin Development\n   * @param eventType - The event type to listen for (e.g., 'filter-change')\n   * @param callback - The callback to invoke when the event is emitted\n   *\n   * @example\n   * ```typescript\n   * // In attach() or other initialization\n   * this.on('filter-change', (detail) => {\n   *   console.log('Filter changed:', detail);\n   * });\n   * ```\n   */\n  protected on<T = unknown>(eventType: string, callback: (detail: T) => void): void {\n    this.grid?._pluginManager?.subscribe(this, eventType, callback as (detail: unknown) => void);\n  }\n\n  /**\n   * Unsubscribe from a plugin event.\n   *\n   * @category Plugin Development\n   * @param eventType - The event type to stop listening for\n   *\n   * @example\n   * ```typescript\n   * this.off('filter-change');\n   * ```\n   */\n  protected off(eventType: string): void {\n    this.grid?._pluginManager?.unsubscribe(this, eventType);\n  }\n\n  /**\n   * Emit an event to other plugins via the Event Bus.\n   * This is for inter-plugin communication only; it does NOT dispatch DOM events.\n   * Use `emit()` to dispatch DOM events that external consumers can listen to.\n   *\n   * @category Plugin Development\n   * @param eventType - The event type to emit (should be declared in manifest.events)\n   * @param detail - The event payload\n   *\n   * @example\n   * ```typescript\n   * // Emit to other plugins (not DOM)\n   * this.emitPluginEvent('filter-change', { field: 'name', value: 'Alice' });\n   *\n   * // For DOM events that consumers can addEventListener to:\n   * this.emit('filter-change', { field: 'name', value: 'Alice' });\n   * ```\n   */\n  protected emitPluginEvent<T>(eventType: string, detail: T): void {\n    this.grid?._pluginManager?.emitPluginEvent(eventType, detail);\n  }\n\n  /**\n   * Request a re-render of the grid.\n   * Uses ROWS phase - does NOT trigger processColumns hooks.\n   */\n  protected requestRender(): void {\n    this.grid?.requestRender?.();\n  }\n\n  /**\n   * Request a columns re-render of the grid.\n   * Uses COLUMNS phase - triggers processColumns hooks.\n   * Use this when your plugin needs to reprocess column configuration.\n   */\n  protected requestColumnsRender(): void {\n    (this.grid as { requestColumnsRender?: () => void })?.requestColumnsRender?.();\n  }\n\n  /**\n   * Request a re-render and restore focus styling afterward.\n   * Use this when a plugin action (like expand/collapse) triggers a render\n   * but needs to maintain keyboard navigation focus.\n   */\n  protected requestRenderWithFocus(): void {\n    this.grid?.requestRenderWithFocus?.();\n  }\n\n  /**\n   * Request a lightweight style update without rebuilding DOM.\n   * Use this instead of requestRender() when only CSS classes need updating.\n   */\n  protected requestAfterRender(): void {\n    this.grid?.requestAfterRender?.();\n  }\n\n  /**\n   * Get the current rows from the grid.\n   */\n  protected get rows(): any[] {\n    return this.grid?.rows ?? [];\n  }\n\n  /**\n   * Get the original unfiltered/unprocessed rows from the grid.\n   * Use this when you need all source data regardless of active filters.\n   */\n  protected get sourceRows(): any[] {\n    return this.grid?.sourceRows ?? [];\n  }\n\n  /**\n   * Get the current columns from the grid.\n   */\n  protected get columns(): ColumnConfig[] {\n    return this.grid?.columns ?? [];\n  }\n\n  /**\n   * Get only visible columns from the grid (excludes hidden).\n   * Use this for rendering that needs to match the grid template.\n   */\n  protected get visibleColumns(): ColumnConfig[] {\n    return this.grid?._visibleColumns ?? [];\n  }\n\n  /**\n   * Get the grid as an HTMLElement for direct DOM operations.\n   * Use sparingly - prefer the typed GridElementRef API when possible.\n   *\n   * @example\n   * ```ts\n   * const width = this.gridElement.clientWidth;\n   * this.gridElement.classList.add('my-plugin-active');\n   * ```\n   */\n  protected get gridElement(): HTMLElement {\n    return this.grid as unknown as HTMLElement;\n  }\n\n  /**\n   * Get the disconnect signal for event listener cleanup.\n   * This signal is aborted when the grid disconnects from the DOM.\n   * Use this when adding event listeners that should be cleaned up automatically.\n   *\n   * Best for:\n   * - Document/window-level listeners added in attach()\n   * - Listeners on the grid element itself\n   * - Any listener that should persist across renders\n   *\n   * Not needed for:\n   * - Listeners on elements created in afterRender() (removed with element)\n   *\n   * @example\n   * element.addEventListener('click', handler, { signal: this.disconnectSignal });\n   * document.addEventListener('keydown', handler, { signal: this.disconnectSignal });\n   */\n  protected get disconnectSignal(): AbortSignal {\n    // Return the plugin's own abort signal for proper cleanup on detach/re-attach\n    // Falls back to grid's signal if plugin's controller not yet created\n    return this.#abortController?.signal ?? this.grid?.disconnectSignal;\n  }\n\n  /**\n   * Get the grid-level icons configuration.\n   * Returns merged icons (user config + defaults).\n   */\n  protected get gridIcons(): typeof DEFAULT_GRID_ICONS {\n    const userIcons = this.grid?.gridConfig?.icons ?? {};\n    return { ...DEFAULT_GRID_ICONS, ...userIcons };\n  }\n\n  // #region Animation Helpers\n\n  /**\n   * Check if animations are enabled at the grid level.\n   * Respects gridConfig.animation.mode and the CSS variable set by the grid.\n   *\n   * Plugins should use this to skip animations when:\n   * - Animation mode is 'off' or `false`\n   * - User prefers reduced motion and mode is 'reduced-motion' (default)\n   *\n   * @example\n   * ```ts\n   * private get animationStyle(): 'slide' | 'fade' | false {\n   *   if (!this.isAnimationEnabled) return false;\n   *   return this.config.animation ?? 'slide';\n   * }\n   * ```\n   */\n  protected get isAnimationEnabled(): boolean {\n    const mode = this.grid?.effectiveConfig?.animation?.mode ?? 'reduced-motion';\n\n    // Explicit off = disabled\n    if (mode === false || mode === 'off') return false;\n\n    // Explicit on = always enabled\n    if (mode === true || mode === 'on') return true;\n\n    // reduced-motion: check CSS variable (set by grid based on media query)\n    const host = this.gridElement;\n    if (host) {\n      const enabled = getComputedStyle(host).getPropertyValue('--tbw-animation-enabled').trim();\n      return enabled !== '0';\n    }\n\n    return true; // Default to enabled\n  }\n\n  /**\n   * Get the animation duration in milliseconds from CSS variable.\n   * Falls back to 200ms if not set.\n   *\n   * Plugins can use this for their animation timing to stay consistent\n   * with the grid-level animation.duration setting.\n   *\n   * @example\n   * ```ts\n   * element.animate(keyframes, { duration: this.animationDuration });\n   * ```\n   */\n  protected get animationDuration(): number {\n    const host = this.gridElement;\n    if (host) {\n      const durationStr = getComputedStyle(host).getPropertyValue('--tbw-animation-duration').trim();\n      const parsed = parseInt(durationStr, 10);\n      if (!isNaN(parsed)) return parsed;\n    }\n    return 200; // Default\n  }\n\n  // #endregion\n\n  /**\n   * Resolve an icon value to string or HTMLElement.\n   * Checks plugin config first, then grid-level icons, then defaults.\n   *\n   * @param iconKey - The icon key in GridIcons (e.g., 'expand', 'collapse')\n   * @param pluginOverride - Optional plugin-level override\n   * @returns The resolved icon value\n   */\n  protected resolveIcon(iconKey: keyof typeof DEFAULT_GRID_ICONS, pluginOverride?: IconValue): IconValue {\n    // Plugin override takes precedence\n    if (pluginOverride !== undefined) {\n      return pluginOverride;\n    }\n    // Then grid-level config\n    return this.gridIcons[iconKey];\n  }\n\n  /**\n   * Set an icon value on an element.\n   * Handles both string (text/HTML) and HTMLElement values.\n   *\n   * @param element - The element to set the icon on\n   * @param icon - The icon value (string or HTMLElement)\n   */\n  protected setIcon(element: HTMLElement, icon: IconValue): void {\n    if (typeof icon === 'string') {\n      element.innerHTML = icon;\n    } else if (icon instanceof HTMLElement) {\n      element.innerHTML = '';\n      element.appendChild(icon.cloneNode(true));\n    }\n  }\n\n  /**\n   * Log a warning message.\n   */\n  protected warn(message: string): void {\n    console.warn(`[tbw-grid:${this.name}] ${message}`);\n  }\n\n  // #region Lifecycle Hooks\n\n  /**\n   * Transform rows before rendering.\n   * Called during each render cycle before rows are rendered to the DOM.\n   * Use this to filter, sort, or add computed properties to rows.\n   *\n   * @param rows - The current rows array (readonly to encourage returning a new array)\n   * @returns The modified rows array to render\n   *\n   * @example\n   * ```ts\n   * processRows(rows: readonly any[]): any[] {\n   *   // Filter out hidden rows\n   *   return rows.filter(row => !row._hidden);\n   * }\n   * ```\n   *\n   * @example\n   * ```ts\n   * processRows(rows: readonly any[]): any[] {\n   *   // Add computed properties\n   *   return rows.map(row => ({\n   *     ...row,\n   *     _fullName: `${row.firstName} ${row.lastName}`\n   *   }));\n   * }\n   * ```\n   */\n  processRows?(rows: readonly any[]): any[];\n\n  /**\n   * Transform columns before rendering.\n   * Called during each render cycle before column headers and cells are rendered.\n   * Use this to add, remove, or modify column definitions.\n   *\n   * @param columns - The current columns array (readonly to encourage returning a new array)\n   * @returns The modified columns array to render\n   *\n   * @example\n   * ```ts\n   * processColumns(columns: readonly ColumnConfig[]): ColumnConfig[] {\n   *   // Add a selection checkbox column\n   *   return [\n   *     { field: '_select', header: '', width: 40 },\n   *     ...columns\n   *   ];\n   * }\n   * ```\n   */\n  processColumns?(columns: readonly ColumnConfig[]): ColumnConfig[];\n\n  /**\n   * Called before each render cycle begins.\n   * Use this to prepare state or cache values needed during rendering.\n   *\n   * **Note:** This hook is currently a placeholder for future implementation.\n   * It is defined in the interface but not yet invoked by the grid's render pipeline.\n   * If you need this functionality, please open an issue or contribute an implementation.\n   *\n   * @example\n   * ```ts\n   * beforeRender(): void {\n   *   this.visibleRowCount = this.calculateVisibleRows();\n   * }\n   * ```\n   */\n  beforeRender?(): void;\n\n  /**\n   * Called after each render cycle completes.\n   * Use this for DOM manipulation, adding event listeners to rendered elements,\n   * or applying visual effects like selection highlights.\n   *\n   * @example\n   * ```ts\n   * afterRender(): void {\n   *   // Apply selection styling to rendered rows\n   *   const rows = this.gridElement?.querySelectorAll('.data-row');\n   *   rows?.forEach((row, i) => {\n   *     row.classList.toggle('selected', this.selectedRows.has(i));\n   *   });\n   * }\n   * ```\n   */\n  afterRender?(): void;\n\n  /**\n   * Called after each cell is rendered.\n   * This hook is more efficient than `afterRender()` for cell-level modifications\n   * because you receive the cell context directly - no DOM queries needed.\n   *\n   * Use cases:\n   * - Adding selection/highlight classes to specific cells\n   * - Injecting badges or decorations\n   * - Applying conditional styling based on cell value\n   *\n   * Performance note: Called for every visible cell during render. Keep implementation fast.\n   * This hook is also called during scroll when cells are recycled.\n   *\n   * @param context - The cell render context with row, column, value, and elements\n   *\n   * @example\n   * ```ts\n   * afterCellRender(context: AfterCellRenderContext): void {\n   *   // Add selection class without DOM queries\n   *   if (this.isSelected(context.rowIndex, context.colIndex)) {\n   *     context.cellElement.classList.add('selected');\n   *   }\n   *\n   *   // Add validation error styling\n   *   if (this.hasError(context.row, context.column.field)) {\n   *     context.cellElement.classList.add('has-error');\n   *   }\n   * }\n   * ```\n   */\n  afterCellRender?(context: AfterCellRenderContext): void;\n\n  /**\n   * Called after a row is fully rendered (all cells complete).\n   * Use this for row-level decorations, styling, or ARIA attributes.\n   *\n   * Common use cases:\n   * - Adding selection classes to entire rows (row-focus, selected)\n   * - Setting row-level ARIA attributes\n   * - Applying row validation highlighting\n   * - Tree indentation styling\n   *\n   * Performance note: Called for every visible row during render. Keep implementation fast.\n   * This hook is also called during scroll when rows are recycled.\n   *\n   * @param context - The row render context with row data and element\n   *\n   * @example\n   * ```ts\n   * afterRowRender(context: AfterRowRenderContext): void {\n   *   // Add row selection class without DOM queries\n   *   if (this.isRowSelected(context.rowIndex)) {\n   *     context.rowElement.classList.add('selected', 'row-focus');\n   *   }\n   *\n   *   // Add validation error styling\n   *   if (this.rowHasErrors(context.row)) {\n   *     context.rowElement.classList.add('has-errors');\n   *   }\n   * }\n   * ```\n   */\n  afterRowRender?(context: AfterRowRenderContext): void;\n\n  /**\n   * Called after scroll-triggered row rendering completes.\n   * This is a lightweight hook for applying visual state to recycled DOM elements.\n   * Use this instead of afterRender when you need to reapply styling during scroll.\n   *\n   * Performance note: This is called frequently during scroll. Keep implementation fast.\n   *\n   * @example\n   * ```ts\n   * onScrollRender(): void {\n   *   // Reapply selection state to visible cells\n   *   this.applySelectionToVisibleCells();\n   * }\n   * ```\n   */\n  onScrollRender?(): void;\n\n  /**\n   * Return extra height contributed by this plugin (e.g., expanded detail rows).\n   * Used to adjust scrollbar height calculations for virtualization.\n   *\n   * @returns Total extra height in pixels\n   *\n   * @deprecated Use {@link getRowHeight} instead. This hook will be removed in v3.0.\n   * The new `getRowHeight(row, index)` hook provides per-row height information which\n   * enables better position caching and variable row height support.\n   *\n   * @example\n   * ```ts\n   * // OLD (deprecated):\n   * getExtraHeight(): number {\n   *   return this.expandedRows.size * this.detailHeight;\n   * }\n   *\n   * // NEW (preferred):\n   * getRowHeight(row: unknown, index: number): number | undefined {\n   *   if (this.isExpanded(row)) {\n   *     return this.baseRowHeight + this.getDetailHeight(row);\n   *   }\n   *   return undefined;\n   * }\n   * ```\n   */\n  getExtraHeight?(): number;\n\n  /**\n   * Return extra height that appears before a given row index.\n   * Used by virtualization to correctly calculate scroll positions when\n   * there's variable height content (like expanded detail rows) above the viewport.\n   *\n   * @param beforeRowIndex - The row index to calculate extra height before\n   * @returns Extra height in pixels that appears before this row\n   *\n   * @deprecated Use {@link getRowHeight} instead. This hook will be removed in v3.0.\n   * The new `getRowHeight(row, index)` hook provides per-row height information which\n   * enables better position caching and variable row height support.\n   *\n   * @example\n   * ```ts\n   * // OLD (deprecated):\n   * getExtraHeightBefore(beforeRowIndex: number): number {\n   *   let height = 0;\n   *   for (const expandedRowIndex of this.expandedRowIndices) {\n   *     if (expandedRowIndex < beforeRowIndex) {\n   *       height += this.getDetailHeight(expandedRowIndex);\n   *     }\n   *   }\n   *   return height;\n   * }\n   *\n   * // NEW (preferred):\n   * getRowHeight(row: unknown, index: number): number | undefined {\n   *   if (this.isExpanded(row)) {\n   *     return this.baseRowHeight + this.getDetailHeight(row);\n   *   }\n   *   return undefined;\n   * }\n   * ```\n   */\n  getExtraHeightBefore?(beforeRowIndex: number): number;\n\n  /**\n   * Get the height of a specific row.\n   * Used for synthetic rows (group headers, detail panels, etc.) that have fixed heights.\n   * Return undefined if this plugin does not manage the height for this row.\n   *\n   * This hook is called during position cache rebuilds for variable row height virtualization.\n   * Plugins that create synthetic rows should implement this to provide accurate heights.\n   *\n   * @param row - The row data\n   * @param index - The row index in the processed rows array\n   * @returns The row height in pixels, or undefined if not managed by this plugin\n   *\n   * @example\n   * ```ts\n   * getRowHeight(row: unknown, index: number): number | undefined {\n   *   // Group headers have a fixed height\n   *   if (this.isGroupHeader(row)) {\n   *     return 32;\n   *   }\n   *   return undefined; // Let grid use default/measured height\n   * }\n   * ```\n   */\n  getRowHeight?(row: unknown, index: number): number | undefined;\n\n  /**\n   * Adjust the virtualization start index to render additional rows before the visible range.\n   * Use this when expanded content (like detail rows) needs its parent row to remain rendered\n   * even when the parent row itself has scrolled above the viewport.\n   *\n   * @param start - The calculated start row index\n   * @param scrollTop - The current scroll position\n   * @param rowHeight - The height of a single row\n   * @returns The adjusted start index (lower than or equal to original start)\n   *\n   * @example\n   * ```ts\n   * adjustVirtualStart(start: number, scrollTop: number, rowHeight: number): number {\n   *   // If row 5 is expanded and scrolled partially, keep it rendered\n   *   for (const expandedRowIndex of this.expandedRowIndices) {\n   *     const expandedRowTop = expandedRowIndex * rowHeight;\n   *     const expandedRowBottom = expandedRowTop + rowHeight + this.detailHeight;\n   *     if (expandedRowBottom > scrollTop && expandedRowIndex < start) {\n   *       return expandedRowIndex;\n   *     }\n   *   }\n   *   return start;\n   * }\n   * ```\n   */\n  adjustVirtualStart?(start: number, scrollTop: number, rowHeight: number): number;\n\n  /**\n   * Render a custom row, bypassing the default row rendering.\n   * Use this for special row types like group headers, detail rows, or footers.\n   *\n   * @param row - The row data object\n   * @param rowEl - The row DOM element to render into\n   * @param rowIndex - The index of the row in the data array\n   * @returns `true` if the plugin handled rendering (prevents default), `false`/`void` for default rendering\n   *\n   * @example\n   * ```ts\n   * renderRow(row: any, rowEl: HTMLElement, rowIndex: number): boolean | void {\n   *   if (row._isGroupHeader) {\n   *     rowEl.innerHTML = `<div class=\"group-header\">${row._groupLabel}</div>`;\n   *     return true; // Handled - skip default rendering\n   *   }\n   *   // Return void to let default rendering proceed\n   * }\n   * ```\n   */\n  renderRow?(row: any, rowEl: HTMLElement, rowIndex: number): boolean | void;\n\n  // #endregion\n\n  // #region Inter-Plugin Communication\n\n  /**\n   * Handle queries from other plugins.\n   * This is the generic mechanism for inter-plugin communication.\n   * Plugins can respond to well-known query types or define their own.\n   *\n   * **Prefer `handleQuery` for new plugins** - it has the same signature but\n   * a clearer name. `onPluginQuery` is kept for backwards compatibility.\n   *\n   * @category Plugin Development\n   * @param query - The query object with type and context\n   * @returns Query-specific response, or undefined if not handling this query\n   *\n   * @example\n   * ```ts\n   * onPluginQuery(query: PluginQuery): unknown {\n   *   switch (query.type) {\n   *     case PLUGIN_QUERIES.CAN_MOVE_COLUMN:\n   *       // Prevent moving pinned columns\n   *       const column = query.context as ColumnConfig;\n   *       if (column.sticky === 'left' || column.sticky === 'right') {\n   *         return false;\n   *       }\n   *       break;\n   *     case PLUGIN_QUERIES.GET_CONTEXT_MENU_ITEMS:\n   *       const params = query.context as ContextMenuParams;\n   *       return [{ id: 'my-action', label: 'My Action', action: () => {} }];\n   *   }\n   * }\n   * ```\n   * @deprecated Use `handleQuery` instead for new plugins.\n   */\n  onPluginQuery?(query: PluginQuery): unknown;\n\n  /**\n   * Handle queries from other plugins or the grid.\n   *\n   * Queries are declared in `manifest.queries` and dispatched via `grid.query()`.\n   * This enables type-safe, discoverable inter-plugin communication.\n   *\n   * @category Plugin Development\n   * @param query - The query object with type and context\n   * @returns Query-specific response, or undefined if not handling this query\n   *\n   * @example\n   * ```ts\n   * // In manifest\n   * static override readonly manifest: PluginManifest = {\n   *   queries: [\n   *     { type: 'canMoveColumn', description: 'Check if a column can be moved' },\n   *   ],\n   * };\n   *\n   * // In plugin class\n   * handleQuery(query: PluginQuery): unknown {\n   *   if (query.type === 'canMoveColumn') {\n   *     const column = query.context as ColumnConfig;\n   *     return !column.sticky; // Can't move sticky columns\n   *   }\n   * }\n   * ```\n   */\n  handleQuery?(query: PluginQuery): unknown;\n\n  // #endregion\n\n  // #region Interaction Hooks\n\n  /**\n   * Handle keyboard events on the grid.\n   * Called when a key is pressed while the grid or a cell has focus.\n   *\n   * @param event - The native KeyboardEvent\n   * @returns `true` to prevent default behavior and stop propagation, `false`/`void` to allow default\n   *\n   * @example\n   * ```ts\n   * onKeyDown(event: KeyboardEvent): boolean | void {\n   *   // Handle Ctrl+A for select all\n   *   if (event.ctrlKey && event.key === 'a') {\n   *     this.selectAllRows();\n   *     return true; // Prevent default browser select-all\n   *   }\n   * }\n   * ```\n   */\n  onKeyDown?(event: KeyboardEvent): boolean | void;\n\n  /**\n   * Handle cell click events.\n   * Called when a data cell is clicked (not headers).\n   *\n   * @param event - Cell click event with row/column context\n   * @returns `true` to prevent default behavior and stop propagation, `false`/`void` to allow default\n   *\n   * @example\n   * ```ts\n   * onCellClick(event: CellClickEvent): boolean | void {\n   *   if (event.field === '_select') {\n   *     this.toggleRowSelection(event.rowIndex);\n   *     return true; // Handled\n   *   }\n   * }\n   * ```\n   */\n  onCellClick?(event: CellClickEvent): boolean | void;\n\n  /**\n   * Handle row click events.\n   * Called when any part of a data row is clicked.\n   * Note: This is called in addition to onCellClick, not instead of.\n   *\n   * @param event - Row click event with row context\n   * @returns `true` to prevent default behavior and stop propagation, `false`/`void` to allow default\n   *\n   * @example\n   * ```ts\n   * onRowClick(event: RowClickEvent): boolean | void {\n   *   if (this.config.mode === 'row') {\n   *     this.selectRow(event.rowIndex, event.originalEvent);\n   *     return true;\n   *   }\n   * }\n   * ```\n   */\n  onRowClick?(event: RowClickEvent): boolean | void;\n\n  /**\n   * Handle header click events.\n   * Called when a column header is clicked. Commonly used for sorting.\n   *\n   * @param event - Header click event with column context\n   * @returns `true` to prevent default behavior and stop propagation, `false`/`void` to allow default\n   *\n   * @example\n   * ```ts\n   * onHeaderClick(event: HeaderClickEvent): boolean | void {\n   *   if (event.column.sortable !== false) {\n   *     this.toggleSort(event.field);\n   *     return true;\n   *   }\n   * }\n   * ```\n   */\n  onHeaderClick?(event: HeaderClickEvent): boolean | void;\n\n  /**\n   * Handle scroll events on the grid viewport.\n   * Called during scrolling. Note: This may be called frequently; debounce if needed.\n   *\n   * @param event - Scroll event with scroll position and viewport dimensions\n   *\n   * @example\n   * ```ts\n   * onScroll(event: ScrollEvent): void {\n   *   // Update sticky column positions\n   *   this.updateStickyPositions(event.scrollLeft);\n   * }\n   * ```\n   */\n  onScroll?(event: ScrollEvent): void;\n\n  /**\n   * Handle cell mousedown events.\n   * Used for initiating drag operations like range selection or column resize.\n   *\n   * @param event - Mouse event with cell context\n   * @returns `true` to indicate drag started (prevents text selection), `false`/`void` otherwise\n   *\n   * @example\n   * ```ts\n   * onCellMouseDown(event: CellMouseEvent): boolean | void {\n   *   if (event.rowIndex !== undefined && this.config.mode === 'range') {\n   *     this.startDragSelection(event.rowIndex, event.colIndex);\n   *     return true; // Prevent text selection\n   *   }\n   * }\n   * ```\n   */\n  onCellMouseDown?(event: CellMouseEvent): boolean | void;\n\n  /**\n   * Handle cell mousemove events during drag operations.\n   * Only called when a drag is in progress (after mousedown returned true).\n   *\n   * @param event - Mouse event with current cell context\n   * @returns `true` to continue handling the drag, `false`/`void` otherwise\n   *\n   * @example\n   * ```ts\n   * onCellMouseMove(event: CellMouseEvent): boolean | void {\n   *   if (this.isDragging && event.rowIndex !== undefined) {\n   *     this.extendSelection(event.rowIndex, event.colIndex);\n   *     return true;\n   *   }\n   * }\n   * ```\n   */\n  onCellMouseMove?(event: CellMouseEvent): boolean | void;\n\n  /**\n   * Handle cell mouseup events to end drag operations.\n   *\n   * @param event - Mouse event with final cell context\n   * @returns `true` if drag was finalized, `false`/`void` otherwise\n   *\n   * @example\n   * ```ts\n   * onCellMouseUp(event: CellMouseEvent): boolean | void {\n   *   if (this.isDragging) {\n   *     this.finalizeDragSelection();\n   *     this.isDragging = false;\n   *     return true;\n   *   }\n   * }\n   * ```\n   */\n  onCellMouseUp?(event: CellMouseEvent): boolean | void;\n\n  // Note: Context menu items are provided via handleQuery('getContextMenuItems').\n  // This keeps the core decoupled from the context-menu plugin specifics.\n\n  // #endregion\n\n  // #region Column State Hooks\n\n  /**\n   * Contribute plugin-specific state for a column.\n   * Called by the grid when collecting column state for serialization.\n   * Plugins can add their own properties to the column state.\n   *\n   * @param field - The field name of the column\n   * @returns Partial column state with plugin-specific properties, or undefined if no state to contribute\n   *\n   * @example\n   * ```ts\n   * getColumnState(field: string): Partial<ColumnState> | undefined {\n   *   const filterModel = this.filterModels.get(field);\n   *   if (filterModel) {\n   *     // Uses module augmentation to add filter property to ColumnState\n   *     return { filter: filterModel } as Partial<ColumnState>;\n   *   }\n   *   return undefined;\n   * }\n   * ```\n   */\n  getColumnState?(field: string): Partial<ColumnState> | undefined;\n\n  /**\n   * Apply plugin-specific state to a column.\n   * Called by the grid when restoring column state from serialized data.\n   * Plugins should restore their internal state based on the provided state.\n   *\n   * @param field - The field name of the column\n   * @param state - The column state to apply (may contain plugin-specific properties)\n   *\n   * @example\n   * ```ts\n   * applyColumnState(field: string, state: ColumnState): void {\n   *   // Check for filter property added via module augmentation\n   *   const filter = (state as any).filter;\n   *   if (filter) {\n   *     this.filterModels.set(field, filter);\n   *     this.applyFilter();\n   *   }\n   * }\n   * ```\n   */\n  applyColumnState?(field: string, state: ColumnState): void;\n\n  // #endregion\n\n  // #region Scroll Boundary Hooks\n\n  /**\n   * Report horizontal scroll boundary offsets for this plugin.\n   * Plugins that obscure part of the scroll area (e.g., pinned/sticky columns)\n   * should return how much space they occupy on each side.\n   * The keyboard navigation uses this to ensure focused cells are fully visible.\n   *\n   * @param rowEl - The row element (optional, for calculating widths from rendered cells)\n   * @param focusedCell - The currently focused cell element (optional, to determine if scrolling should be skipped)\n   * @returns Object with left/right pixel offsets and optional skipScroll flag, or undefined if plugin has no offsets\n   *\n   * @example\n   * ```ts\n   * getHorizontalScrollOffsets(rowEl?: HTMLElement, focusedCell?: HTMLElement): { left: number; right: number; skipScroll?: boolean } | undefined {\n   *   // Calculate total width of left-pinned columns\n   *   const leftCells = rowEl?.querySelectorAll('.sticky-left') ?? [];\n   *   let left = 0;\n   *   leftCells.forEach(el => { left += (el as HTMLElement).offsetWidth; });\n   *   // Skip scroll if focused cell is pinned (always visible)\n   *   const skipScroll = focusedCell?.classList.contains('sticky-left');\n   *   return { left, right: 0, skipScroll };\n   * }\n   * ```\n   */\n  getHorizontalScrollOffsets?(\n    rowEl?: HTMLElement,\n    focusedCell?: HTMLElement,\n  ): { left: number; right: number; skipScroll?: boolean } | undefined;\n\n  // #endregion\n\n  // #region Shell Integration Hooks\n\n  /**\n   * Register a tool panel for this plugin.\n   * Return undefined if plugin has no tool panel.\n   * The shell will create a toolbar toggle button and render the panel content\n   * when the user opens the panel.\n   *\n   * @returns Tool panel definition, or undefined if plugin has no panel\n   *\n   * @example\n   * ```ts\n   * getToolPanel(): ToolPanelDefinition | undefined {\n   *   return {\n   *     id: 'columns',\n   *     title: 'Columns',\n   *     icon: '☰',\n   *     tooltip: 'Show/hide columns',\n   *     order: 10,\n   *     render: (container) => {\n   *       this.renderColumnList(container);\n   *       return () => this.cleanup();\n   *     },\n   *   };\n   * }\n   * ```\n   */\n  getToolPanel?(): ToolPanelDefinition | undefined;\n\n  /**\n   * Register content for the shell header center section.\n   * Return undefined if plugin has no header content.\n   * Examples: search input, selection summary, status indicators.\n   *\n   * @returns Header content definition, or undefined if plugin has no header content\n   *\n   * @example\n   * ```ts\n   * getHeaderContent(): HeaderContentDefinition | undefined {\n   *   return {\n   *     id: 'quick-filter',\n   *     order: 10,\n   *     render: (container) => {\n   *       const input = document.createElement('input');\n   *       input.type = 'text';\n   *       input.placeholder = 'Search...';\n   *       input.addEventListener('input', this.handleInput);\n   *       container.appendChild(input);\n   *       return () => input.removeEventListener('input', this.handleInput);\n   *     },\n   *   };\n   * }\n   * ```\n   */\n  getHeaderContent?(): HeaderContentDefinition | undefined;\n\n  // #endregion\n}\n","/**\n * Shared Expander Column Utilities\n *\n * Provides a fixed expander column for plugins that need expand/collapse icons\n * (MasterDetail, Tree, RowGrouping). The column is:\n * - Always first in the grid\n * - Cannot be reordered (lockPosition: true)\n * - Has no header (empty string)\n * - Has no right border (borderless styling)\n * - Narrow width (just fits the icon)\n */\n\nimport type { ColumnConfig } from '../types';\n\n/** Special field name for the expander column */\nexport const EXPANDER_COLUMN_FIELD = '__tbw_expander';\n\n/** Default width for the expander column (pixels) */\nexport const EXPANDER_COLUMN_WIDTH = 32;\n\n/**\n * Marker interface for expander column renderers.\n * Used to detect if expander column is already present.\n */\nexport interface ExpanderColumnRenderer {\n  (ctx: any): HTMLElement;\n  __expanderColumn?: true;\n  /** Plugin name that created this expander */\n  __expanderPlugin?: string;\n}\n\n/**\n * Check if a column is an expander column.\n */\nexport function isExpanderColumn(column: ColumnConfig): boolean {\n  return column.field === EXPANDER_COLUMN_FIELD;\n}\n\n/**\n * Check if a column is a utility column (excluded from selection, clipboard, etc.).\n * Utility columns are non-data columns like expander columns.\n */\nexport function isUtilityColumn(column: ColumnConfig): boolean {\n  return column.meta?.utility === true;\n}\n\n/**\n * Find an existing expander column in the column array.\n */\nexport function findExpanderColumn(columns: readonly ColumnConfig[]): ColumnConfig | undefined {\n  return columns.find(isExpanderColumn);\n}\n\n/**\n * Create the base expander column config.\n * Plugins should add their own renderer to customize the expand icon behavior.\n *\n * @param pluginName - Name of the plugin creating the expander (for debugging)\n * @returns Base column config for the expander column\n */\nexport function createExpanderColumnConfig(pluginName: string): ColumnConfig {\n  return {\n    field: EXPANDER_COLUMN_FIELD as any,\n    header: '', // No header text - visually merges with next column\n    width: EXPANDER_COLUMN_WIDTH,\n    resizable: false,\n    sortable: false,\n    filterable: false, // No filter button for expander column\n    meta: {\n      lockPosition: true,\n      suppressMovable: true,\n      expanderColumn: true,\n      expanderPlugin: pluginName,\n      utility: true, // Marks this as a utility column (excluded from selection, clipboard, etc.)\n    },\n  };\n}\n\n/**\n * Create a container element for expand/collapse toggle icons.\n * Used by plugins to wrap their expand icons with consistent styling.\n *\n * @param expanded - Whether the item is currently expanded\n * @param pluginClass - CSS class prefix for the plugin (e.g., 'master-detail', 'tree')\n * @returns Container span element\n */\nexport function createExpanderContainer(expanded: boolean, pluginClass: string): HTMLSpanElement {\n  const container = document.createElement('span');\n  container.className = `${pluginClass}-expander expander-cell`;\n  if (expanded) {\n    container.classList.add('expanded');\n  }\n  return container;\n}\n\n/**\n * CSS styles for the expander column.\n * Plugins should include this in their styles to ensure consistent appearance.\n */\nexport const EXPANDER_COLUMN_STYLES = `\n/* Expander column data cells - always first, borderless right edge */\n.cell[data-field=\"${EXPANDER_COLUMN_FIELD}\"] {\n  border-right: none !important;\n  padding: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n/* Expander column header - completely hidden, no content, no border, no width contribution */\n.header-row .cell[data-field=\"${EXPANDER_COLUMN_FIELD}\"] {\n  visibility: hidden;\n  border: none !important;\n  padding: 0;\n  overflow: hidden;\n}\n\n/* The column after the expander should visually extend into the expander header space */\n.header-row .cell[data-field=\"${EXPANDER_COLUMN_FIELD}\"] + .cell {\n  /* Pull left to cover the hidden expander header */\n  margin-left: -${EXPANDER_COLUMN_WIDTH}px;\n  padding-left: calc(var(--tbw-cell-padding, 8px) + ${EXPANDER_COLUMN_WIDTH}px);\n}\n\n/* Expander cell contents */\n.expander-cell {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  height: 100%;\n  cursor: pointer;\n}\n`;\n","/**\n * Cell Range Selection Core Logic\n *\n * Pure functions for cell range selection operations.\n */\n\nimport type { InternalCellRange, CellRange } from './types';\n\n/**\n * Normalize a range so startRow/startCol are always <= endRow/endCol.\n * This handles cases where user drags from bottom-right to top-left.\n *\n * @param range - The range to normalize\n * @returns Normalized range with start <= end for both dimensions\n */\nexport function normalizeRange(range: InternalCellRange): InternalCellRange {\n  return {\n    startRow: Math.min(range.startRow, range.endRow),\n    startCol: Math.min(range.startCol, range.endCol),\n    endRow: Math.max(range.startRow, range.endRow),\n    endCol: Math.max(range.startCol, range.endCol),\n  };\n}\n\n/**\n * Convert an internal range to the public event format.\n *\n * @param range - The internal range to convert\n * @returns Public CellRange format with from/to coordinates\n */\nexport function toPublicRange(range: InternalCellRange): CellRange {\n  const normalized = normalizeRange(range);\n  return {\n    from: { row: normalized.startRow, col: normalized.startCol },\n    to: { row: normalized.endRow, col: normalized.endCol },\n  };\n}\n\n/**\n * Convert multiple internal ranges to public format.\n *\n * @param ranges - Array of internal ranges\n * @returns Array of public CellRange format\n */\nexport function toPublicRanges(ranges: InternalCellRange[]): CellRange[] {\n  return ranges.map(toPublicRange);\n}\n\n/**\n * Check if a cell is within a specific range.\n *\n * @param row - The row index to check\n * @param col - The column index to check\n * @param range - The range to check against\n * @returns True if the cell is within the range\n */\nexport function isCellInRange(row: number, col: number, range: InternalCellRange): boolean {\n  const normalized = normalizeRange(range);\n  return (\n    row >= normalized.startRow && row <= normalized.endRow && col >= normalized.startCol && col <= normalized.endCol\n  );\n}\n\n/**\n * Check if a cell is within any of the provided ranges.\n *\n * @param row - The row index to check\n * @param col - The column index to check\n * @param ranges - Array of ranges to check against\n * @returns True if the cell is within any range\n */\nexport function isCellInAnyRange(row: number, col: number, ranges: InternalCellRange[]): boolean {\n  return ranges.some((range) => isCellInRange(row, col, range));\n}\n\n/**\n * Get all cells within a range as an array of {row, col} objects.\n *\n * @param range - The range to enumerate\n * @returns Array of all cell coordinates in the range\n */\nexport function getCellsInRange(range: InternalCellRange): Array<{ row: number; col: number }> {\n  const cells: Array<{ row: number; col: number }> = [];\n  const normalized = normalizeRange(range);\n\n  for (let row = normalized.startRow; row <= normalized.endRow; row++) {\n    for (let col = normalized.startCol; col <= normalized.endCol; col++) {\n      cells.push({ row, col });\n    }\n  }\n\n  return cells;\n}\n\n/**\n * Get all unique cells across multiple ranges.\n * Deduplicates cells that appear in overlapping ranges.\n *\n * @param ranges - Array of ranges to enumerate\n * @returns Array of unique cell coordinates\n */\nexport function getAllCellsInRanges(ranges: InternalCellRange[]): Array<{ row: number; col: number }> {\n  const cellMap = new Map<string, { row: number; col: number }>();\n\n  for (const range of ranges) {\n    for (const cell of getCellsInRange(range)) {\n      cellMap.set(`${cell.row},${cell.col}`, cell);\n    }\n  }\n\n  return [...cellMap.values()];\n}\n\n/**\n * Merge overlapping or adjacent ranges into fewer ranges.\n * Simple implementation - returns ranges as-is for now.\n * More complex merging logic can be added later for optimization.\n *\n * @param ranges - Array of ranges to merge\n * @returns Merged array of ranges\n */\nexport function mergeRanges(ranges: InternalCellRange[]): InternalCellRange[] {\n  // Simple implementation - more complex merging can be added later\n  return ranges;\n}\n\n/**\n * Create a range from an anchor cell to a current cell position.\n * The range is not normalized - it preserves the direction of selection.\n *\n * @param anchor - The anchor cell (where selection started)\n * @param current - The current cell (where selection ends)\n * @returns An InternalCellRange from anchor to current\n */\nexport function createRangeFromAnchor(\n  anchor: { row: number; col: number },\n  current: { row: number; col: number }\n): InternalCellRange {\n  return {\n    startRow: anchor.row,\n    startCol: anchor.col,\n    endRow: current.row,\n    endCol: current.col,\n  };\n}\n\n/**\n * Calculate the number of cells in a range.\n *\n * @param range - The range to measure\n * @returns Total number of cells in the range\n */\nexport function getRangeCellCount(range: InternalCellRange): number {\n  const normalized = normalizeRange(range);\n  const rowCount = normalized.endRow - normalized.startRow + 1;\n  const colCount = normalized.endCol - normalized.startCol + 1;\n  return rowCount * colCount;\n}\n\n/**\n * Check if two ranges are equal (same boundaries).\n *\n * @param a - First range\n * @param b - Second range\n * @returns True if ranges have same boundaries after normalization\n */\nexport function rangesEqual(a: InternalCellRange, b: InternalCellRange): boolean {\n  const normA = normalizeRange(a);\n  const normB = normalizeRange(b);\n  return (\n    normA.startRow === normB.startRow &&\n    normA.startCol === normB.startCol &&\n    normA.endRow === normB.endRow &&\n    normA.endCol === normB.endCol\n  );\n}\n\n/**\n * Check if a range is a single cell (1x1).\n *\n * @param range - The range to check\n * @returns True if the range is exactly one cell\n */\nexport function isSingleCell(range: InternalCellRange): boolean {\n  const normalized = normalizeRange(range);\n  return normalized.startRow === normalized.endRow && normalized.startCol === normalized.endCol;\n}\n","/**\n * Selection Plugin (Class-based)\n *\n * Provides selection functionality for tbw-grid.\n * Supports three modes:\n * - 'cell': Single cell selection (default). No border, just focus highlight.\n * - 'row': Row selection. Clicking a cell selects the entire row.\n * - 'range': Range selection. Shift+click or drag to select rectangular cell ranges.\n */\n\nimport { clearCellFocus, getRowIndexFromCell } from '../../core/internal/utils';\nimport type { GridElement, PluginManifest, PluginQuery } from '../../core/plugin/base-plugin';\nimport { BaseGridPlugin, CellClickEvent, CellMouseEvent } from '../../core/plugin/base-plugin';\nimport { isExpanderColumn, isUtilityColumn } from '../../core/plugin/expander-column';\nimport type { ColumnConfig } from '../../core/types';\nimport {\n  createRangeFromAnchor,\n  getAllCellsInRanges,\n  isCellInAnyRange,\n  normalizeRange,\n  rangesEqual,\n  toPublicRanges,\n} from './range-selection';\nimport styles from './selection.css?inline';\nimport type {\n  CellRange,\n  InternalCellRange,\n  SelectionChangeDetail,\n  SelectionConfig,\n  SelectionMode,\n  SelectionResult,\n} from './types';\n\n/** Special field name for the selection checkbox column */\nconst CHECKBOX_COLUMN_FIELD = '__tbw_checkbox';\n\n/**\n * Build the selection change event detail for the current state.\n */\nfunction buildSelectionEvent(\n  mode: SelectionMode,\n  state: {\n    selectedCell: { row: number; col: number } | null;\n    selected: Set<number>;\n    ranges: InternalCellRange[];\n  },\n  colCount: number,\n): SelectionChangeDetail {\n  if (mode === 'cell' && state.selectedCell) {\n    return {\n      mode,\n      ranges: [\n        {\n          from: { row: state.selectedCell.row, col: state.selectedCell.col },\n          to: { row: state.selectedCell.row, col: state.selectedCell.col },\n        },\n      ],\n    };\n  }\n\n  if (mode === 'row' && state.selected.size > 0) {\n    // Sort rows and merge contiguous indices into minimal ranges\n    const sorted = [...state.selected].sort((a, b) => a - b);\n    const ranges: CellRange[] = [];\n    let start = sorted[0];\n    let end = start;\n    for (let i = 1; i < sorted.length; i++) {\n      if (sorted[i] === end + 1) {\n        end = sorted[i];\n      } else {\n        ranges.push({ from: { row: start, col: 0 }, to: { row: end, col: colCount - 1 } });\n        start = sorted[i];\n        end = start;\n      }\n    }\n    ranges.push({ from: { row: start, col: 0 }, to: { row: end, col: colCount - 1 } });\n    return { mode, ranges };\n  }\n\n  if (mode === 'range' && state.ranges.length > 0) {\n    return { mode, ranges: toPublicRanges(state.ranges) };\n  }\n\n  return { mode, ranges: [] };\n}\n\n/**\n * Selection Plugin for tbw-grid\n *\n * Adds cell, row, and range selection capabilities to the grid with full keyboard support.\n * Whether you need simple cell highlighting or complex multi-range selections, this plugin has you covered.\n *\n * ## Installation\n *\n * ```ts\n * import { SelectionPlugin } from '@toolbox-web/grid/plugins/selection';\n * ```\n *\n * ## Selection Modes\n *\n * Configure the plugin with one of three modes via {@link SelectionConfig}:\n *\n * - **`'cell'`** - Single cell selection (default). Click cells to select individually.\n * - **`'row'`** - Full row selection. Click anywhere in a row to select the entire row.\n * - **`'range'`** - Rectangular selection. Click and drag or Shift+Click to select ranges.\n *\n * ## Keyboard Shortcuts\n *\n * | Shortcut | Action |\n * |----------|--------|\n * | `Arrow Keys` | Move selection |\n * | `Shift + Arrow` | Extend selection (range mode) |\n * | `Ctrl/Cmd + Click` | Toggle selection (multi-select) |\n * | `Shift + Click` | Extend to clicked cell/row |\n * | `Ctrl/Cmd + A` | Select all (range mode) |\n * | `Escape` | Clear selection |\n *\n * > **Note:** When `multiSelect: false`, Ctrl/Shift modifiers are ignored —\n * > clicks always select a single item.\n *\n * ## CSS Custom Properties\n *\n * | Property | Description |\n * |----------|-------------|\n * | `--tbw-focus-background` | Focused row background |\n * | `--tbw-range-selection-bg` | Range selection fill |\n * | `--tbw-range-border-color` | Range selection border |\n *\n * @example Basic row selection\n * ```ts\n * grid.gridConfig = {\n *   columns: [...],\n *   plugins: [new SelectionPlugin({ mode: 'row' })],\n * };\n * ```\n *\n * @example Range selection with event handling\n * ```ts\n * grid.gridConfig = {\n *   plugins: [new SelectionPlugin({ mode: 'range' })],\n * };\n *\n * grid.addEventListener('selection-change', (e) => {\n *   const { mode, ranges } = e.detail;\n *   console.log(`Selected ${ranges.length} ranges in ${mode} mode`);\n * });\n * ```\n *\n * @example Programmatic selection control\n * ```ts\n * const plugin = grid.getPlugin(SelectionPlugin);\n *\n * // Get current selection\n * const selection = plugin.getSelection();\n * console.log(selection.ranges);\n *\n * // Set selection programmatically\n * plugin.setRanges([{ from: { row: 0, col: 0 }, to: { row: 5, col: 3 } }]);\n *\n * // Clear all selection\n * plugin.clearSelection();\n * ```\n *\n * @see {@link SelectionMode} for detailed mode descriptions\n * @see {@link SelectionConfig} for configuration options\n * @see {@link SelectionResult} for the selection result structure\n * @see [Live Demos](?path=/docs/grid-plugins-selection--docs) for interactive examples\n */\nexport class SelectionPlugin extends BaseGridPlugin<SelectionConfig> {\n  /**\n   * Plugin manifest - declares queries and configuration validation rules.\n   * @internal\n   */\n  static override readonly manifest: PluginManifest<SelectionConfig> = {\n    queries: [\n      { type: 'getSelection', description: 'Get the current selection state' },\n      { type: 'selectRows', description: 'Select specific rows by index (row mode only)' },\n      { type: 'getSelectedRowIndices', description: 'Get sorted array of selected row indices' },\n      { type: 'getSelectedRows', description: 'Get actual row objects for the current selection (works in all modes)' },\n    ],\n    configRules: [\n      {\n        id: 'selection/range-dblclick',\n        severity: 'warn',\n        message:\n          `\"triggerOn: 'dblclick'\" has no effect when mode is \"range\".\\n` +\n          `  → Range selection uses drag interaction (mousedown → mousemove), not click events.\\n` +\n          `  → The \"triggerOn\" option only affects \"cell\" and \"row\" selection modes.`,\n        check: (config) => config.mode === 'range' && config.triggerOn === 'dblclick',\n      },\n    ],\n  };\n\n  /** @internal */\n  readonly name = 'selection';\n  /** @internal */\n  override readonly styles = styles;\n\n  /** @internal */\n  protected override get defaultConfig(): Partial<SelectionConfig> {\n    return {\n      mode: 'cell',\n      triggerOn: 'click',\n      enabled: true,\n      multiSelect: true,\n    };\n  }\n\n  // #region Internal State\n  /** Row selection state (row mode) */\n  private selected = new Set<number>();\n  private lastSelected: number | null = null;\n  private anchor: number | null = null;\n\n  /** Range selection state (range mode) */\n  private ranges: InternalCellRange[] = [];\n  private activeRange: InternalCellRange | null = null;\n  private cellAnchor: { row: number; col: number } | null = null;\n  private isDragging = false;\n\n  /** Pending keyboard navigation update (processed in afterRender) */\n  private pendingKeyboardUpdate: { shiftKey: boolean } | null = null;\n\n  /** Cell selection state (cell mode) */\n  private selectedCell: { row: number; col: number } | null = null;\n\n  /** Last synced focus row — used to detect when grid focus moves so selection follows */\n  private lastSyncedFocusRow = -1;\n  /** Last synced focus col (cell mode) */\n  private lastSyncedFocusCol = -1;\n\n  /** True when selection was explicitly set (click/keyboard) — prevents #syncSelectionToFocus from overwriting */\n  private explicitSelection = false;\n\n  // #endregion\n\n  // #region Private Helpers - Selection Enabled Check\n\n  /**\n   * Check if selection is enabled at the grid level.\n   * Grid-wide `selectable: false` or plugin's `enabled: false` disables all selection.\n   */\n  private isSelectionEnabled(): boolean {\n    // Check plugin config first\n    if (this.config.enabled === false) return false;\n    // Check grid-level config\n    return this.grid.effectiveConfig?.selectable !== false;\n  }\n\n  // #endregion\n\n  // #region Private Helpers - Selectability\n\n  /**\n   * Check if a row/cell is selectable.\n   * Returns true if selectable, false if not.\n   */\n  private checkSelectable(rowIndex: number, colIndex?: number): boolean {\n    const { isSelectable } = this.config;\n    if (!isSelectable) return true; // No callback = all selectable\n\n    const row = this.rows[rowIndex];\n    if (!row) return false;\n\n    // colIndex is a visible-column index (from data-col), so use visibleColumns\n    const column = colIndex !== undefined ? this.visibleColumns[colIndex] : undefined;\n    return isSelectable(row, rowIndex, column, colIndex);\n  }\n\n  /**\n   * Check if an entire row is selectable (for row mode).\n   */\n  private isRowSelectable(rowIndex: number): boolean {\n    return this.checkSelectable(rowIndex);\n  }\n\n  /**\n   * Check if a cell is selectable (for cell/range modes).\n   */\n  private isCellSelectable(rowIndex: number, colIndex: number): boolean {\n    return this.checkSelectable(rowIndex, colIndex);\n  }\n\n  // #endregion\n\n  // #region Lifecycle\n\n  /** @internal */\n  override attach(grid: GridElement): void {\n    super.attach(grid);\n\n    // Subscribe to events that invalidate selection\n    // When rows change due to filtering/grouping/tree operations, selection indices become invalid\n    this.on('filter-applied', () => this.clearSelectionSilent());\n    this.on('grouping-state-change', () => this.clearSelectionSilent());\n    this.on('tree-state-change', () => this.clearSelectionSilent());\n  }\n\n  /**\n   * Handle queries from other plugins.\n   * @internal\n   */\n  override handleQuery(query: PluginQuery): unknown {\n    if (query.type === 'getSelection') {\n      return this.getSelection();\n    }\n    if (query.type === 'getSelectedRowIndices') {\n      return this.getSelectedRowIndices();\n    }\n    if (query.type === 'getSelectedRows') {\n      return this.getSelectedRows();\n    }\n    if (query.type === 'selectRows') {\n      this.selectRows(query.context as number[]);\n      return true;\n    }\n    return undefined;\n  }\n\n  /** @internal */\n  override detach(): void {\n    this.selected.clear();\n    this.ranges = [];\n    this.activeRange = null;\n    this.cellAnchor = null;\n    this.isDragging = false;\n    this.selectedCell = null;\n    this.pendingKeyboardUpdate = null;\n    this.lastSyncedFocusRow = -1;\n    this.lastSyncedFocusCol = -1;\n  }\n\n  /**\n   * Clear selection without emitting an event.\n   * Used when selection is invalidated by external changes (filtering, grouping, etc.)\n   */\n  private clearSelectionSilent(): void {\n    this.selected.clear();\n    this.ranges = [];\n    this.activeRange = null;\n    this.cellAnchor = null;\n    this.selectedCell = null;\n    this.lastSelected = null;\n    this.anchor = null;\n    this.lastSyncedFocusRow = -1;\n    this.lastSyncedFocusCol = -1;\n    this.requestAfterRender();\n  }\n\n  // #endregion\n\n  // #region Event Handlers\n\n  /** @internal */\n  override onCellClick(event: CellClickEvent): boolean {\n    // Skip all selection if disabled at grid level or plugin level\n    if (!this.isSelectionEnabled()) return false;\n\n    const { rowIndex, colIndex, originalEvent } = event;\n    const { mode, triggerOn = 'click' } = this.config;\n\n    // Skip if event type doesn't match configured trigger\n    // This allows dblclick mode to only select on double-click\n    if (originalEvent.type !== triggerOn) {\n      return false;\n    }\n\n    // Check if this is a utility column (expander columns, etc.)\n    // event.column is already resolved from _visibleColumns in the event builder\n    const column = event.column;\n    const isUtility = column && isUtilityColumn(column);\n\n    // CELL MODE: Single cell selection - skip utility columns and non-selectable cells\n    if (mode === 'cell') {\n      if (isUtility) {\n        return false; // Allow event to propagate, but don't select utility cells\n      }\n      if (!this.isCellSelectable(rowIndex, colIndex)) {\n        return false; // Cell is not selectable\n      }\n      // Only emit if selection actually changed\n      const currentCell = this.selectedCell;\n      if (currentCell && currentCell.row === rowIndex && currentCell.col === colIndex) {\n        return false; // Same cell already selected\n      }\n      this.selectedCell = { row: rowIndex, col: colIndex };\n      this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n      this.requestAfterRender();\n      return false;\n    }\n\n    // ROW MODE: Multi-select with Shift/Ctrl, checkbox toggle, or single select\n    if (mode === 'row') {\n      if (!this.isRowSelectable(rowIndex)) {\n        return false; // Row is not selectable\n      }\n\n      const multiSelect = this.config.multiSelect !== false;\n      const shiftKey = originalEvent.shiftKey && multiSelect;\n      const ctrlKey = (originalEvent.ctrlKey || originalEvent.metaKey) && multiSelect;\n      const isCheckbox = column?.meta?.checkboxColumn === true;\n\n      if (shiftKey && this.anchor !== null) {\n        // Shift+Click: Range select from anchor to clicked row\n        const start = Math.min(this.anchor, rowIndex);\n        const end = Math.max(this.anchor, rowIndex);\n        if (!ctrlKey) {\n          this.selected.clear();\n        }\n        for (let i = start; i <= end; i++) {\n          if (this.isRowSelectable(i)) {\n            this.selected.add(i);\n          }\n        }\n      } else if (ctrlKey || (isCheckbox && multiSelect)) {\n        // Ctrl+Click or checkbox click: Toggle individual row\n        if (this.selected.has(rowIndex)) {\n          this.selected.delete(rowIndex);\n        } else {\n          this.selected.add(rowIndex);\n        }\n        this.anchor = rowIndex;\n      } else {\n        // Plain click (or any click when multiSelect is false): select only clicked row\n        if (this.selected.size === 1 && this.selected.has(rowIndex)) {\n          return false; // Same row already selected\n        }\n        this.selected.clear();\n        this.selected.add(rowIndex);\n        this.anchor = rowIndex;\n      }\n\n      this.lastSelected = rowIndex;\n      this.explicitSelection = true;\n      this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n      this.requestAfterRender();\n      return false;\n    }\n\n    // RANGE MODE: Shift+click extends selection, click starts new\n    if (mode === 'range') {\n      // Skip utility columns in range mode - don't start selection from them\n      if (isUtility) {\n        return false;\n      }\n\n      // Skip non-selectable cells in range mode\n      if (!this.isCellSelectable(rowIndex, colIndex)) {\n        return false;\n      }\n\n      const shiftKey = originalEvent.shiftKey;\n      const ctrlKey = (originalEvent.ctrlKey || originalEvent.metaKey) && this.config.multiSelect !== false;\n\n      if (shiftKey && this.cellAnchor) {\n        // Extend selection from anchor\n        const newRange = createRangeFromAnchor(this.cellAnchor, { row: rowIndex, col: colIndex });\n\n        // Check if range actually changed\n        const currentRange = this.ranges.length > 0 ? this.ranges[this.ranges.length - 1] : null;\n        if (currentRange && rangesEqual(currentRange, newRange)) {\n          return false; // Same range already selected\n        }\n\n        if (ctrlKey) {\n          if (this.ranges.length > 0) {\n            this.ranges[this.ranges.length - 1] = newRange;\n          } else {\n            this.ranges.push(newRange);\n          }\n        } else {\n          this.ranges = [newRange];\n        }\n        this.activeRange = newRange;\n      } else if (ctrlKey) {\n        const newRange: InternalCellRange = {\n          startRow: rowIndex,\n          startCol: colIndex,\n          endRow: rowIndex,\n          endCol: colIndex,\n        };\n        this.ranges.push(newRange);\n        this.activeRange = newRange;\n        this.cellAnchor = { row: rowIndex, col: colIndex };\n      } else {\n        // Plain click - check if same single-cell range already selected\n        const newRange: InternalCellRange = {\n          startRow: rowIndex,\n          startCol: colIndex,\n          endRow: rowIndex,\n          endCol: colIndex,\n        };\n\n        // Only emit if selection actually changed\n        if (this.ranges.length === 1 && rangesEqual(this.ranges[0], newRange)) {\n          return false; // Same cell already selected\n        }\n\n        this.ranges = [newRange];\n        this.activeRange = newRange;\n        this.cellAnchor = { row: rowIndex, col: colIndex };\n      }\n\n      this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n\n      this.requestAfterRender();\n      return false;\n    }\n\n    return false;\n  }\n\n  /** @internal */\n  override onKeyDown(event: KeyboardEvent): boolean {\n    // Skip all selection if disabled at grid level or plugin level\n    if (!this.isSelectionEnabled()) return false;\n\n    const { mode } = this.config;\n    const navKeys = ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight', 'Tab', 'Home', 'End', 'PageUp', 'PageDown'];\n    const isNavKey = navKeys.includes(event.key);\n\n    // Escape clears selection in all modes\n    // But if editing is active, let the EditingPlugin handle Escape first\n    if (event.key === 'Escape') {\n      const isEditing = this.grid.query<boolean>('isEditing');\n      if (isEditing.some(Boolean)) {\n        return false; // Defer to EditingPlugin to cancel the active edit\n      }\n\n      if (mode === 'cell') {\n        this.selectedCell = null;\n      } else if (mode === 'row') {\n        this.selected.clear();\n        this.anchor = null;\n      } else if (mode === 'range') {\n        this.ranges = [];\n        this.activeRange = null;\n        this.cellAnchor = null;\n      }\n      this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n      this.requestAfterRender();\n      return true;\n    }\n\n    // CELL MODE: Selection follows focus (but respects selectability)\n    if (mode === 'cell' && isNavKey) {\n      // Use queueMicrotask so grid's handler runs first and updates focusRow/focusCol\n      queueMicrotask(() => {\n        const focusRow = this.grid._focusRow;\n        const focusCol = this.grid._focusCol;\n        // Only select if the cell is selectable\n        if (this.isCellSelectable(focusRow, focusCol)) {\n          this.selectedCell = { row: focusRow, col: focusCol };\n        } else {\n          // Clear selection when navigating to non-selectable cell\n          this.selectedCell = null;\n        }\n        this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n        this.requestAfterRender();\n      });\n      return false; // Let grid handle navigation\n    }\n\n    // ROW MODE: Arrow keys move selection, Shift+Arrow extends, Ctrl+A selects all\n    if (mode === 'row') {\n      const multiSelect = this.config.multiSelect !== false;\n\n      if (event.key === 'ArrowUp' || event.key === 'ArrowDown') {\n        const shiftKey = event.shiftKey && multiSelect;\n\n        // Set anchor before grid moves focus\n        if (shiftKey && this.anchor === null) {\n          this.anchor = this.grid._focusRow;\n        }\n\n        // Let grid move focus first, then sync row selection\n        queueMicrotask(() => {\n          const focusRow = this.grid._focusRow;\n\n          if (shiftKey && this.anchor !== null) {\n            // Shift+Arrow: Extend selection from anchor\n            this.selected.clear();\n            const start = Math.min(this.anchor, focusRow);\n            const end = Math.max(this.anchor, focusRow);\n            for (let i = start; i <= end; i++) {\n              if (this.isRowSelectable(i)) {\n                this.selected.add(i);\n              }\n            }\n          } else {\n            // Plain arrow: Single select\n            if (this.isRowSelectable(focusRow)) {\n              this.selected.clear();\n              this.selected.add(focusRow);\n              this.anchor = focusRow;\n            } else {\n              this.selected.clear();\n            }\n          }\n\n          this.lastSelected = focusRow;\n          this.explicitSelection = true;\n          this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n          this.requestAfterRender();\n        });\n        return false; // Let grid handle navigation\n      }\n\n      // Ctrl+A: Select all rows (skip when editing, skip when single-select)\n      if (multiSelect && event.key === 'a' && (event.ctrlKey || event.metaKey)) {\n        const isEditing = this.grid.query<boolean>('isEditing');\n        if (isEditing.some(Boolean)) return false;\n        event.preventDefault();\n        event.stopPropagation();\n        this.selectAll();\n        return true;\n      }\n    }\n\n    // RANGE MODE: Shift+Arrow extends, plain Arrow resets\n    // Tab key always navigates without extending (even with Shift)\n    if (mode === 'range' && isNavKey) {\n      // Tab should not extend selection - it just navigates to the next/previous cell\n      const isTabKey = event.key === 'Tab';\n      const shouldExtend = event.shiftKey && !isTabKey;\n\n      // Capture anchor BEFORE grid moves focus (synchronous)\n      // This ensures the anchor is the starting point, not the destination\n      if (shouldExtend && !this.cellAnchor) {\n        this.cellAnchor = { row: this.grid._focusRow, col: this.grid._focusCol };\n      }\n\n      // Mark pending update - will be processed in afterRender when grid updates focus\n      this.pendingKeyboardUpdate = { shiftKey: shouldExtend };\n\n      // Schedule afterRender to run after grid's keyboard handler completes\n      // Grid's refreshVirtualWindow(false) skips afterRender for performance,\n      // so we explicitly request it to process pendingKeyboardUpdate\n      queueMicrotask(() => this.requestAfterRender());\n\n      return false; // Let grid handle navigation\n    }\n\n    // Ctrl+A selects all in range mode (skip when editing, skip when single-select)\n    if (\n      mode === 'range' &&\n      this.config.multiSelect !== false &&\n      event.key === 'a' &&\n      (event.ctrlKey || event.metaKey)\n    ) {\n      const isEditing = this.grid.query<boolean>('isEditing');\n      if (isEditing.some(Boolean)) return false;\n      event.preventDefault();\n      event.stopPropagation();\n      this.selectAll();\n      return true;\n    }\n\n    return false;\n  }\n\n  /** @internal */\n  override onCellMouseDown(event: CellMouseEvent): boolean | void {\n    // Skip all selection if disabled at grid level or plugin level\n    if (!this.isSelectionEnabled()) return;\n\n    if (this.config.mode !== 'range') return;\n    if (event.rowIndex === undefined || event.colIndex === undefined) return;\n    if (event.rowIndex < 0) return; // Header\n\n    // Skip utility columns (expander columns, etc.)\n    // event.column is already resolved from _visibleColumns in the event builder\n    if (event.column && isUtilityColumn(event.column)) {\n      return; // Don't start selection on utility columns\n    }\n\n    // Skip non-selectable cells - don't start drag from them\n    if (!this.isCellSelectable(event.rowIndex, event.colIndex)) {\n      return;\n    }\n\n    // Let onCellClick handle shift+click for range extension\n    if (event.originalEvent.shiftKey && this.cellAnchor) {\n      return;\n    }\n\n    // Start drag selection\n    this.isDragging = true;\n    const rowIndex = event.rowIndex;\n    const colIndex = event.colIndex;\n\n    // When multiSelect is false, Ctrl+click starts a new single range instead of adding\n    const ctrlKey = (event.originalEvent.ctrlKey || event.originalEvent.metaKey) && this.config.multiSelect !== false;\n\n    const newRange: InternalCellRange = {\n      startRow: rowIndex,\n      startCol: colIndex,\n      endRow: rowIndex,\n      endCol: colIndex,\n    };\n\n    // Check if selection is actually changing (for non-Ctrl clicks)\n    if (!ctrlKey && this.ranges.length === 1 && rangesEqual(this.ranges[0], newRange)) {\n      // Same cell already selected, just update anchor for potential drag\n      this.cellAnchor = { row: rowIndex, col: colIndex };\n      return true;\n    }\n\n    this.cellAnchor = { row: rowIndex, col: colIndex };\n\n    if (!ctrlKey) {\n      this.ranges = [];\n    }\n\n    this.ranges.push(newRange);\n    this.activeRange = newRange;\n\n    this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n    this.requestAfterRender();\n    return true;\n  }\n\n  /** @internal */\n  override onCellMouseMove(event: CellMouseEvent): boolean | void {\n    // Skip all selection if disabled at grid level or plugin level\n    if (!this.isSelectionEnabled()) return;\n\n    if (this.config.mode !== 'range') return;\n    if (!this.isDragging || !this.cellAnchor) return;\n    if (event.rowIndex === undefined || event.colIndex === undefined) return;\n    if (event.rowIndex < 0) return;\n\n    // When dragging, clamp to first data column (skip utility columns)\n    // colIndex from events is a visible-column index (from data-col)\n    let targetCol = event.colIndex;\n    const column = this.visibleColumns[targetCol];\n    if (column && isUtilityColumn(column)) {\n      // Find the first non-utility visible column\n      const firstDataCol = this.visibleColumns.findIndex((col) => !isUtilityColumn(col));\n      if (firstDataCol >= 0) {\n        targetCol = firstDataCol;\n      }\n    }\n\n    const newRange = createRangeFromAnchor(this.cellAnchor, { row: event.rowIndex, col: targetCol });\n\n    // Only update and emit if the range actually changed\n    const currentRange = this.ranges.length > 0 ? this.ranges[this.ranges.length - 1] : null;\n    if (currentRange && rangesEqual(currentRange, newRange)) {\n      return true; // Range unchanged, no need to update\n    }\n\n    if (this.ranges.length > 0) {\n      this.ranges[this.ranges.length - 1] = newRange;\n    } else {\n      this.ranges.push(newRange);\n    }\n    this.activeRange = newRange;\n\n    this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n    this.requestAfterRender();\n    return true;\n  }\n\n  /** @internal */\n  override onCellMouseUp(_event: CellMouseEvent): boolean | void {\n    // Skip all selection if disabled at grid level or plugin level\n    if (!this.isSelectionEnabled()) return;\n\n    if (this.config.mode !== 'range') return;\n    if (this.isDragging) {\n      this.isDragging = false;\n      return true;\n    }\n  }\n\n  // #region Checkbox Column\n\n  /**\n   * Inject checkbox column when `checkbox: true` and mode is `'row'`.\n   * @internal\n   */\n  override processColumns(columns: ColumnConfig[]): ColumnConfig[] {\n    if (this.config.checkbox && this.config.mode === 'row') {\n      // Check if checkbox column already exists\n      if (columns.some((col) => col.field === CHECKBOX_COLUMN_FIELD)) {\n        return columns;\n      }\n      const checkboxCol = this.#createCheckboxColumn();\n      // Insert after expander column if present, otherwise first\n      const expanderIdx = columns.findIndex(isExpanderColumn);\n      const insertAt = expanderIdx >= 0 ? expanderIdx + 1 : 0;\n      return [...columns.slice(0, insertAt), checkboxCol, ...columns.slice(insertAt)];\n    }\n    return columns;\n  }\n\n  /**\n   * Create the checkbox utility column configuration.\n   */\n  #createCheckboxColumn(): ColumnConfig {\n    return {\n      field: CHECKBOX_COLUMN_FIELD,\n      header: '',\n      width: 32,\n      resizable: false,\n      sortable: false,\n      meta: {\n        lockPosition: true,\n        suppressMovable: true,\n        utility: true,\n        checkboxColumn: true,\n      },\n      headerRenderer: () => {\n        const container = document.createElement('div');\n        container.className = 'tbw-checkbox-header';\n        // Hide \"select all\" checkbox in single-select mode\n        if (this.config.multiSelect === false) return container;\n        const checkbox = document.createElement('input');\n        checkbox.type = 'checkbox';\n        checkbox.className = 'tbw-select-all-checkbox';\n        checkbox.addEventListener('click', (e) => {\n          e.stopPropagation(); // Prevent header sort\n          if ((e.target as HTMLInputElement).checked) {\n            this.selectAll();\n          } else {\n            this.clearSelection();\n          }\n        });\n        container.appendChild(checkbox);\n        return container;\n      },\n      renderer: (ctx) => {\n        const checkbox = document.createElement('input');\n        checkbox.type = 'checkbox';\n        checkbox.className = 'tbw-select-row-checkbox';\n        // Set initial checked state from current selection\n        const cellEl = ctx.cellEl;\n        if (cellEl) {\n          const rowIndex = parseInt(cellEl.getAttribute('data-row') ?? '-1', 10);\n          if (rowIndex >= 0) {\n            checkbox.checked = this.selected.has(rowIndex);\n          }\n        }\n        return checkbox;\n      },\n    };\n  }\n\n  /**\n   * Update checkbox checked states to reflect current selection.\n   * Called from #applySelectionClasses.\n   */\n  #updateCheckboxStates(gridEl: HTMLElement): void {\n    // Update row checkboxes\n    const rowCheckboxes = gridEl.querySelectorAll('.tbw-select-row-checkbox') as NodeListOf<HTMLInputElement>;\n    rowCheckboxes.forEach((checkbox) => {\n      const cell = checkbox.closest('.cell');\n      const rowIndex = cell ? getRowIndexFromCell(cell) : -1;\n      if (rowIndex >= 0) {\n        checkbox.checked = this.selected.has(rowIndex);\n      }\n    });\n\n    // Update header select-all checkbox\n    const headerCheckbox = gridEl.querySelector('.tbw-select-all-checkbox') as HTMLInputElement | null;\n    if (headerCheckbox) {\n      const rowCount = this.rows.length;\n      let selectableCount = 0;\n      if (this.config.isSelectable) {\n        for (let i = 0; i < rowCount; i++) {\n          if (this.isRowSelectable(i)) selectableCount++;\n        }\n      } else {\n        selectableCount = rowCount;\n      }\n      const allSelected = selectableCount > 0 && this.selected.size >= selectableCount;\n      const someSelected = this.selected.size > 0;\n      headerCheckbox.checked = allSelected;\n      headerCheckbox.indeterminate = someSelected && !allSelected;\n    }\n  }\n\n  // #endregion\n\n  /**\n   * Sync selection state to the grid's current focus position.\n   * In row mode, keeps `selected` in sync with `_focusRow`.\n   * In cell mode, keeps `selectedCell` in sync with `_focusRow`/`_focusCol`.\n   * Only updates when the focus has changed since the last sync.\n   * Skips when `explicitSelection` is set (click/keyboard set selection directly).\n   */\n  #syncSelectionToFocus(mode: string): void {\n    const focusRow = this.grid._focusRow;\n    const focusCol = this.grid._focusCol;\n\n    if (mode === 'row') {\n      // Skip auto-sync when selection was explicitly set (Shift/Ctrl click, keyboard)\n      if (this.explicitSelection) {\n        this.explicitSelection = false;\n        this.lastSyncedFocusRow = focusRow;\n        return;\n      }\n\n      if (focusRow !== this.lastSyncedFocusRow) {\n        this.lastSyncedFocusRow = focusRow;\n        if (this.isRowSelectable(focusRow)) {\n          if (!this.selected.has(focusRow) || this.selected.size !== 1) {\n            this.selected.clear();\n            this.selected.add(focusRow);\n            this.lastSelected = focusRow;\n            this.anchor = focusRow;\n            this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n          }\n        }\n      }\n    }\n\n    if (mode === 'cell') {\n      if (this.explicitSelection) {\n        this.explicitSelection = false;\n        this.lastSyncedFocusRow = focusRow;\n        this.lastSyncedFocusCol = focusCol;\n        return;\n      }\n\n      if (focusRow !== this.lastSyncedFocusRow || focusCol !== this.lastSyncedFocusCol) {\n        this.lastSyncedFocusRow = focusRow;\n        this.lastSyncedFocusCol = focusCol;\n        if (this.isCellSelectable(focusRow, focusCol)) {\n          const cur = this.selectedCell;\n          if (!cur || cur.row !== focusRow || cur.col !== focusCol) {\n            this.selectedCell = { row: focusRow, col: focusCol };\n            this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n          }\n        }\n      }\n    }\n  }\n\n  /**\n   * Apply CSS selection classes to row/cell elements.\n   * Shared by afterRender and onScrollRender.\n   */\n  #applySelectionClasses(): void {\n    const gridEl = this.gridElement;\n    if (!gridEl) return;\n\n    const { mode } = this.config;\n    const hasSelectableCallback = !!this.config.isSelectable;\n\n    // Clear all selection classes first\n    const allCells = gridEl.querySelectorAll('.cell');\n    allCells.forEach((cell) => {\n      cell.classList.remove('selected', 'top', 'bottom', 'first', 'last');\n      // Clear selectable attribute - will be re-applied below\n      if (hasSelectableCallback) {\n        cell.removeAttribute('data-selectable');\n      }\n    });\n\n    const allRows = gridEl.querySelectorAll('.data-grid-row');\n    allRows.forEach((row) => {\n      row.classList.remove('selected', 'row-focus');\n      // Clear selectable attribute - will be re-applied below\n      if (hasSelectableCallback) {\n        row.removeAttribute('data-selectable');\n      }\n    });\n\n    // ROW MODE: Add row-focus class to selected rows, disable cell-focus, update checkboxes\n    if (mode === 'row') {\n      // In row mode, disable ALL cell-focus styling - row selection takes precedence\n      clearCellFocus(gridEl);\n\n      allRows.forEach((row) => {\n        const firstCell = row.querySelector('.cell[data-row]');\n        const rowIndex = getRowIndexFromCell(firstCell);\n        if (rowIndex >= 0) {\n          // Mark non-selectable rows\n          if (hasSelectableCallback && !this.isRowSelectable(rowIndex)) {\n            row.setAttribute('data-selectable', 'false');\n          }\n          if (this.selected.has(rowIndex)) {\n            row.classList.add('selected', 'row-focus');\n          }\n        }\n      });\n\n      // Update checkbox states if checkbox column is enabled\n      if (this.config.checkbox) {\n        this.#updateCheckboxStates(gridEl);\n      }\n    }\n\n    // CELL/RANGE MODE: Mark non-selectable cells\n    if ((mode === 'cell' || mode === 'range') && hasSelectableCallback) {\n      const cells = gridEl.querySelectorAll('.cell[data-row][data-col]');\n      cells.forEach((cell) => {\n        const rowIndex = parseInt(cell.getAttribute('data-row') ?? '-1', 10);\n        const colIndex = parseInt(cell.getAttribute('data-col') ?? '-1', 10);\n        if (rowIndex >= 0 && colIndex >= 0) {\n          if (!this.isCellSelectable(rowIndex, colIndex)) {\n            cell.setAttribute('data-selectable', 'false');\n          }\n        }\n      });\n    }\n\n    // RANGE MODE: Add selected and edge classes to cells\n    // Uses neighbor-based edge detection for correct multi-range borders\n    if (mode === 'range' && this.ranges.length > 0) {\n      // Clear all cell-focus first - selection plugin manages focus styling in range mode\n      clearCellFocus(gridEl);\n\n      // Pre-normalize ranges for efficient neighbor checks\n      const normalizedRanges = this.ranges.map(normalizeRange);\n\n      // Fast selection check against pre-normalized ranges\n      const isInSelection = (r: number, c: number): boolean => {\n        for (const range of normalizedRanges) {\n          if (r >= range.startRow && r <= range.endRow && c >= range.startCol && c <= range.endCol) {\n            return true;\n          }\n        }\n        return false;\n      };\n\n      const cells = gridEl.querySelectorAll('.cell[data-row][data-col]');\n      cells.forEach((cell) => {\n        const rowIndex = parseInt(cell.getAttribute('data-row') ?? '-1', 10);\n        const colIndex = parseInt(cell.getAttribute('data-col') ?? '-1', 10);\n        if (rowIndex >= 0 && colIndex >= 0) {\n          // Skip utility columns entirely - don't add any selection classes\n          // colIndex from data-col is a visible-column index\n          const column = this.visibleColumns[colIndex];\n          if (column && isUtilityColumn(column)) {\n            return;\n          }\n\n          if (isInSelection(rowIndex, colIndex)) {\n            cell.classList.add('selected');\n\n            // Edge detection: add border class where neighbor is not selected\n            // This handles single ranges, multi-range, and irregular selections correctly\n            if (!isInSelection(rowIndex - 1, colIndex)) cell.classList.add('top');\n            if (!isInSelection(rowIndex + 1, colIndex)) cell.classList.add('bottom');\n            if (!isInSelection(rowIndex, colIndex - 1)) cell.classList.add('first');\n            if (!isInSelection(rowIndex, colIndex + 1)) cell.classList.add('last');\n          }\n        }\n      });\n    }\n\n    // CELL MODE: Let the grid's native .cell-focus styling handle cell highlighting\n    // No additional action needed - the grid already manages focus styling\n  }\n\n  /** @internal */\n  override afterRender(): void {\n    // Skip rendering selection if disabled at grid level or plugin level\n    if (!this.isSelectionEnabled()) return;\n\n    const gridEl = this.gridElement;\n    if (!gridEl) return;\n\n    const container = gridEl.children[0];\n    const { mode } = this.config;\n\n    // Process pending keyboard navigation update (range mode)\n    // This runs AFTER the grid has updated focusRow/focusCol\n    if (this.pendingKeyboardUpdate && mode === 'range') {\n      const { shiftKey } = this.pendingKeyboardUpdate;\n      this.pendingKeyboardUpdate = null;\n\n      const currentRow = this.grid._focusRow;\n      const currentCol = this.grid._focusCol;\n\n      if (shiftKey && this.cellAnchor) {\n        // Extend selection from anchor to current focus\n        const newRange = createRangeFromAnchor(this.cellAnchor, { row: currentRow, col: currentCol });\n        this.ranges = [newRange];\n        this.activeRange = newRange;\n      } else if (!shiftKey) {\n        // Without shift, clear selection (cell-focus will show instead)\n        this.ranges = [];\n        this.activeRange = null;\n        this.cellAnchor = { row: currentRow, col: currentCol }; // Reset anchor to current position\n      }\n\n      this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n    }\n\n    // Sync selection to grid's focus position.\n    // This ensures selection follows keyboard navigation (Tab, arrows, etc.)\n    // regardless of which plugin moved the focus.\n    this.#syncSelectionToFocus(mode);\n\n    // Set data attribute on host for CSS variable scoping\n    (this.grid as unknown as Element).setAttribute('data-selection-mode', mode);\n\n    // Toggle .selecting class during drag to prevent text selection\n    if (container) {\n      container.classList.toggle('selecting', this.isDragging);\n    }\n\n    this.#applySelectionClasses();\n  }\n\n  /**\n   * Called after scroll-triggered row rendering.\n   * Reapplies selection classes to recycled DOM elements.\n   * @internal\n   */\n  override onScrollRender(): void {\n    // Skip rendering selection classes if disabled\n    if (!this.isSelectionEnabled()) return;\n\n    this.#applySelectionClasses();\n  }\n\n  // #endregion\n\n  // #region Public API\n\n  /**\n   * Get the current selection as a unified result.\n   * Works for all selection modes and always returns ranges.\n   *\n   * @example\n   * ```ts\n   * const selection = plugin.getSelection();\n   * if (selection.ranges.length > 0) {\n   *   const { from, to } = selection.ranges[0];\n   *   // For cell mode: from === to (single cell)\n   *   // For row mode: from.col = 0, to.col = lastCol (full row)\n   *   // For range mode: rectangular selection\n   * }\n   * ```\n   */\n  getSelection(): SelectionResult {\n    return {\n      mode: this.config.mode,\n      ranges: this.#buildEvent().ranges,\n      anchor: this.cellAnchor,\n    };\n  }\n\n  /**\n   * Get all selected cells across all ranges.\n   */\n  getSelectedCells(): Array<{ row: number; col: number }> {\n    return getAllCellsInRanges(this.ranges);\n  }\n\n  /**\n   * Check if a specific cell is in range selection.\n   */\n  isCellSelected(row: number, col: number): boolean {\n    return isCellInAnyRange(row, col, this.ranges);\n  }\n\n  /**\n   * Select all selectable rows (row mode) or all cells (range mode).\n   *\n   * In row mode, selects every row where `isSelectable` returns true (or all rows if no callback).\n   * In range mode, creates a single range spanning all rows and columns.\n   * Has no effect in cell mode.\n   *\n   * @example\n   * ```ts\n   * const plugin = grid.getPlugin(SelectionPlugin);\n   * plugin.selectAll(); // Selects everything in current mode\n   * ```\n   */\n  selectAll(): void {\n    const { mode, multiSelect } = this.config;\n\n    // Single-select mode: selectAll is a no-op\n    if (multiSelect === false) return;\n\n    if (mode === 'row') {\n      this.selected.clear();\n      for (let i = 0; i < this.rows.length; i++) {\n        if (this.isRowSelectable(i)) {\n          this.selected.add(i);\n        }\n      }\n      this.explicitSelection = true;\n      this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n      this.requestAfterRender();\n    } else if (mode === 'range') {\n      const rowCount = this.rows.length;\n      const colCount = this.columns.length;\n      if (rowCount > 0 && colCount > 0) {\n        const allRange: InternalCellRange = {\n          startRow: 0,\n          startCol: 0,\n          endRow: rowCount - 1,\n          endCol: colCount - 1,\n        };\n        this.ranges = [allRange];\n        this.activeRange = allRange;\n        this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n        this.requestAfterRender();\n      }\n    }\n  }\n\n  /**\n   * Select specific rows by index (row mode only).\n   * Replaces the current selection with the provided row indices.\n   * Indices that are out of bounds or fail the `isSelectable` check are ignored.\n   *\n   * @param indices - Array of row indices to select\n   *\n   * @example\n   * ```ts\n   * const plugin = grid.getPlugin(SelectionPlugin);\n   * plugin.selectRows([0, 2, 4]); // Select rows 0, 2, and 4\n   * ```\n   */\n  selectRows(indices: number[]): void {\n    if (this.config.mode !== 'row') return;\n    // In single-select mode, only use the last index\n    const effectiveIndices =\n      this.config.multiSelect === false && indices.length > 1 ? [indices[indices.length - 1]] : indices;\n    this.selected.clear();\n    for (const idx of effectiveIndices) {\n      if (idx >= 0 && idx < this.rows.length && this.isRowSelectable(idx)) {\n        this.selected.add(idx);\n      }\n    }\n    this.anchor = effectiveIndices.length > 0 ? effectiveIndices[effectiveIndices.length - 1] : null;\n    this.explicitSelection = true;\n    this.emit<SelectionChangeDetail>('selection-change', this.#buildEvent());\n    this.requestAfterRender();\n  }\n\n  /**\n   * Get the indices of all selected rows (convenience for row mode).\n   * Returns indices sorted in ascending order.\n   *\n   * @example\n   * ```ts\n   * const plugin = grid.getPlugin(SelectionPlugin);\n   * const rows = plugin.getSelectedRowIndices(); // [0, 2, 4]\n   * ```\n   */\n  getSelectedRowIndices(): number[] {\n    return [...this.selected].sort((a, b) => a - b);\n  }\n\n  /**\n   * Get the actual row objects for the current selection.\n   *\n   * Works across all selection modes:\n   * - **Row mode**: Returns the row objects for all selected rows.\n   * - **Cell mode**: Returns the single row containing the selected cell, or `[]`.\n   * - **Range mode**: Returns the unique row objects that intersect any selected range.\n   *\n   * Row objects are resolved from the grid's processed (sorted/filtered) row array,\n   * so they always reflect the current visual order.\n   *\n   * @example\n   * ```ts\n   * const plugin = grid.getPlugin(SelectionPlugin);\n   * const selected = plugin.getSelectedRows(); // [{ id: 1, name: 'Alice' }, ...]\n   * ```\n   */\n  getSelectedRows<T = unknown>(): T[] {\n    const { mode } = this.config;\n    const rows = this.rows;\n\n    if (mode === 'row') {\n      return this.getSelectedRowIndices()\n        .filter((i) => i >= 0 && i < rows.length)\n        .map((i) => rows[i]) as T[];\n    }\n\n    if (mode === 'cell' && this.selectedCell) {\n      const { row } = this.selectedCell;\n      return row >= 0 && row < rows.length ? [rows[row] as T] : [];\n    }\n\n    if (mode === 'range' && this.ranges.length > 0) {\n      // Collect unique row indices across all ranges\n      const rowIndices = new Set<number>();\n      for (const range of this.ranges) {\n        const minRow = Math.max(0, Math.min(range.startRow, range.endRow));\n        const maxRow = Math.min(rows.length - 1, Math.max(range.startRow, range.endRow));\n        for (let r = minRow; r <= maxRow; r++) {\n          rowIndices.add(r);\n        }\n      }\n      return [...rowIndices].sort((a, b) => a - b).map((i) => rows[i]) as T[];\n    }\n\n    return [];\n  }\n\n  /**\n   * Clear all selection.\n   */\n  clearSelection(): void {\n    this.selectedCell = null;\n    this.selected.clear();\n    this.anchor = null;\n    this.ranges = [];\n    this.activeRange = null;\n    this.cellAnchor = null;\n    this.emit<SelectionChangeDetail>('selection-change', { mode: this.config.mode, ranges: [] });\n    this.requestAfterRender();\n  }\n\n  /**\n   * Set selected ranges programmatically.\n   */\n  setRanges(ranges: CellRange[]): void {\n    this.ranges = ranges.map((r) => ({\n      startRow: r.from.row,\n      startCol: r.from.col,\n      endRow: r.to.row,\n      endCol: r.to.col,\n    }));\n    this.activeRange = this.ranges.length > 0 ? this.ranges[this.ranges.length - 1] : null;\n    this.emit<SelectionChangeDetail>('selection-change', {\n      mode: this.config.mode,\n      ranges: toPublicRanges(this.ranges),\n    });\n    this.requestAfterRender();\n  }\n\n  // #endregion\n\n  // #region Private Helpers\n\n  #buildEvent(): SelectionChangeDetail {\n    return buildSelectionEvent(\n      this.config.mode,\n      {\n        selectedCell: this.selectedCell,\n        selected: this.selected,\n        ranges: this.ranges,\n      },\n      this.columns.length,\n    );\n  }\n\n  // #endregion\n}\n"],"names":["getRowIndexFromCell","cell","attr","rowEl","parent","rows","i","clearCellFocus","root","el","DEFAULT_FILTER_ICON","DEFAULT_GRID_ICONS","BaseGridPlugin","#abortController","config","grid","PluginClass","eventName","detail","event","eventType","callback","userIcons","mode","host","durationStr","parsed","iconKey","pluginOverride","element","icon","message","EXPANDER_COLUMN_FIELD","isExpanderColumn","column","isUtilityColumn","normalizeRange","range","toPublicRange","normalized","toPublicRanges","ranges","isCellInRange","row","col","isCellInAnyRange","getCellsInRange","cells","getAllCellsInRanges","cellMap","createRangeFromAnchor","anchor","current","rangesEqual","a","b","normA","normB","CHECKBOX_COLUMN_FIELD","buildSelectionEvent","state","colCount","sorted","start","end","SelectionPlugin","styles","rowIndex","colIndex","isSelectable","query","originalEvent","triggerOn","isUtility","currentCell","#buildEvent","multiSelect","shiftKey","ctrlKey","isCheckbox","newRange","currentRange","isNavKey","focusRow","focusCol","isTabKey","shouldExtend","targetCol","firstDataCol","_event","columns","checkboxCol","#createCheckboxColumn","expanderIdx","insertAt","container","checkbox","e","ctx","cellEl","#updateCheckboxStates","gridEl","headerCheckbox","rowCount","selectableCount","allSelected","someSelected","#syncSelectionToFocus","cur","#applySelectionClasses","hasSelectableCallback","allRows","firstCell","normalizedRanges","isInSelection","r","c","currentRow","currentCol","allRange","indices","effectiveIndices","idx","rowIndices","minRow","maxRow"],"mappings":"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"}