@toolbox-web/grid 1.26.1 → 1.26.2

package/umd/plugins/grouping-columns.umd.js.map

@@ -1 +1 @@
-{"version":3,"file":"grouping-columns.umd.js","sources":["../../../../../libs/grid/src/lib/plugins/grouping-columns/grouping-columns.ts","../../../../../libs/grid/src/lib/plugins/grouping-columns/GroupingColumnsPlugin.ts"],"sourcesContent":["/**\n * Column Groups Core Logic\n *\n * Pure functions for computing and managing column header groups.\n */\n\n// Import types to enable module augmentation\nimport { COLUMN_GROUP_NO_ID, throwDiagnostic } from '../../core/internal/diagnostics';\nimport type { ColumnConfig } from '../../core/types';\nimport './types';\nimport type {\n  ColumnGroup,\n  ColumnGroupDefinition,\n  ColumnGroupInternal,\n  GroupHeaderRenderParams,\n  GroupingColumnsConfig,\n} from './types';\n\n/**\n * Generate a stable slug from a header string for use as auto-generated group id.\n * E.g. `'Personal Info'` → `'personal-info'`\n */\nexport function slugifyHeader(header: string): string {\n  return header\n    .toLowerCase()\n    .trim()\n    .replace(/[^a-z0-9]+/g, '-')\n    .replace(/^-|-$/g, '');\n}\n\n/**\n * Validate column group definitions and resolve auto-generated ids.\n * Throws if a group has neither `id` nor `header`.\n *\n * @returns A new array with `id` resolved on every definition.\n */\nexport function resolveColumnGroupDefs(defs: ColumnGroupDefinition[]): (ColumnGroupDefinition & { id: string })[] {\n  return defs.map((def) => {\n    if (def.id) return def as ColumnGroupDefinition & { id: string };\n    if (!def.header) {\n      throwDiagnostic(\n        COLUMN_GROUP_NO_ID,\n        'ColumnGroupDefinition requires either an \"id\" or a \"header\" to generate an id from.',\n      );\n    }\n    return { ...def, id: slugifyHeader(def.header) };\n  });\n}\n\n/**\n * Compute column groups from column configuration.\n * Handles explicit groups (via column.group) and creates implicit groups for ungrouped columns.\n *\n * @param columns - Array of column configurations\n * @returns Array of column groups, or empty if no meaningful groups\n */\nexport function computeColumnGroups<T>(columns: ColumnConfig<T>[]): ColumnGroup<T>[] {\n  if (!columns.length) return [];\n\n  const explicitMap = new Map<string, ColumnGroupInternal<T>>();\n  const groupsOrdered: ColumnGroupInternal<T>[] = [];\n\n  // Helper to push unnamed implicit group for a run of ungrouped columns\n  const pushImplicit = (startIdx: number, cols: ColumnConfig<T>[]) => {\n    if (!cols.length) return;\n    // Merge with previous implicit group if adjacent to reduce noise\n    const prev = groupsOrdered[groupsOrdered.length - 1];\n    if (prev && prev.implicit && prev.firstIndex + prev.columns.length === startIdx) {\n      prev.columns.push(...cols);\n      return;\n    }\n    groupsOrdered.push({\n      id: '__implicit__' + startIdx,\n      label: undefined,\n      columns: cols,\n      firstIndex: startIdx,\n      implicit: true,\n    });\n  };\n\n  let run: ColumnConfig<T>[] = [];\n  let runStart = 0;\n\n  columns.forEach((col, idx) => {\n    const g = col.group;\n    if (!g) {\n      if (run.length === 0) runStart = idx;\n      run.push(col);\n      return;\n    }\n    // Close any pending implicit run\n    if (run.length) {\n      pushImplicit(runStart, run.slice());\n      run = [];\n    }\n    const id = typeof g === 'string' ? g : g.id;\n    let group = explicitMap.get(id);\n    if (!group) {\n      group = {\n        id,\n        label: typeof g === 'string' ? undefined : g.label,\n        columns: [],\n        firstIndex: idx,\n      };\n      explicitMap.set(id, group);\n      groupsOrdered.push(group);\n    }\n    group.columns.push(col);\n  });\n\n  // Trailing implicit run\n  if (run.length) pushImplicit(runStart, run);\n\n  // If we only have a single implicit group covering all columns, treat as no groups\n  if (groupsOrdered.length === 1 && groupsOrdered[0].implicit && groupsOrdered[0].columns.length === columns.length) {\n    return [];\n  }\n\n  return groupsOrdered as ColumnGroup<T>[];\n}\n\n/**\n * Apply CSS classes to header cells based on their group membership.\n *\n * @param headerRowEl - The header row element\n * @param groups - The computed column groups\n * @param columns - The column configurations\n */\nexport function applyGroupedHeaderCellClasses(\n  headerRowEl: HTMLElement | null,\n  groups: ColumnGroup[],\n  columns: ColumnConfig[],\n): void {\n  if (!groups.length || !headerRowEl) return;\n\n  const embedded = findEmbeddedImplicitGroups(groups, columns);\n\n  const fieldToGroup = new Map<string, string>();\n  for (const g of groups) {\n    // Skip embedded implicit groups — their columns inherit the enclosing explicit group\n    if (String(g.id).startsWith('__implicit__') && embedded.has(String(g.id))) continue;\n    for (const c of g.columns) {\n      if (c.field) {\n        fieldToGroup.set(c.field, g.id);\n      }\n    }\n  }\n\n  const headerCells = Array.from(headerRowEl.querySelectorAll('.cell[data-field]')) as HTMLElement[];\n  headerCells.forEach((cell) => {\n    const f = cell.getAttribute('data-field') || '';\n    const gid = fieldToGroup.get(f);\n    if (gid) {\n      cell.classList.add('grouped');\n      if (!cell.getAttribute('data-group')) {\n        cell.setAttribute('data-group', gid);\n      }\n    }\n  });\n\n  // Mark group end cells for styling (skip embedded implicit groups)\n  for (const g of groups) {\n    if (String(g.id).startsWith('__implicit__') && embedded.has(String(g.id))) continue;\n    const last = g.columns[g.columns.length - 1];\n    const cell = headerCells.find((c) => c.getAttribute('data-field') === last.field);\n    if (cell) cell.classList.add('group-end');\n  }\n}\n\n/**\n * Compute the grid range [start, end] for a group based on its first and last\n * column positions in the final columns array.\n */\nfunction computeGroupGridRange(group: ColumnGroup, columns: ColumnConfig[]): [number, number] | null {\n  const first = group.columns[0];\n  const last = group.columns[group.columns.length - 1];\n  const start = first ? columns.findIndex((c) => c.field === first.field) : -1;\n  const end = last ? columns.findIndex((c) => c.field === last.field) : -1;\n  return start !== -1 && end !== -1 ? [start, end] : null;\n}\n\n/**\n * Find implicit groups whose column range falls entirely within an explicit\n * group's range (e.g. a utility column inserted between members of the same group).\n *\n * @returns Set of implicit group IDs that are visually embedded.\n */\nexport function findEmbeddedImplicitGroups(groups: ColumnGroup[], columns: ColumnConfig[]): Set<string> {\n  const embedded = new Set<string>();\n\n  // Collect ranges for explicit groups\n  const explicitRanges: [number, number][] = [];\n  for (const g of groups) {\n    if (String(g.id).startsWith('__implicit__')) continue;\n    const range = computeGroupGridRange(g, columns);\n    if (range) explicitRanges.push(range);\n  }\n\n  // Check each implicit group\n  for (const g of groups) {\n    if (!String(g.id).startsWith('__implicit__')) continue;\n    const range = computeGroupGridRange(g, columns);\n    if (!range) continue;\n    const [iStart, iEnd] = range;\n    if (explicitRanges.some(([eStart, eEnd]) => iStart >= eStart && iEnd <= eEnd)) {\n      embedded.add(String(g.id));\n    }\n  }\n\n  return embedded;\n}\n\n/**\n * Build the group header row element.\n *\n * @param groups - The computed column groups\n * @param columns - The column configurations (final array including any plugin-added columns)\n * @returns The group header row element, or null if no groups\n */\nexport function buildGroupHeaderRow(\n  groups: ColumnGroup[],\n  columns: ColumnConfig[],\n  renderer?: GroupingColumnsConfig['groupHeaderRenderer'],\n): HTMLElement | null {\n  if (groups.length === 0) return null;\n\n  const groupRow = document.createElement('div');\n  groupRow.className = 'header-group-row';\n  groupRow.setAttribute('role', 'row');\n\n  const embedded = findEmbeddedImplicitGroups(groups, columns);\n\n  for (const g of groups) {\n    const gid = String(g.id);\n    const isImplicit = gid.startsWith('__implicit__');\n\n    // Skip implicit groups that are visually embedded within an explicit group\n    if (isImplicit && embedded.has(gid)) continue;\n\n    // Compute actual range from first to last member in the final columns array.\n    // This correctly spans over any interleaved utility columns (e.g. checkbox).\n    const range = computeGroupGridRange(g, columns);\n    if (!range) continue;\n    const [startIndex, endIndex] = range;\n    const span = endIndex - startIndex + 1;\n\n    const label = isImplicit ? '' : g.label || g.id;\n\n    const cell = document.createElement('div');\n    cell.className = 'cell header-group-cell';\n    if (isImplicit) cell.classList.add('implicit-group');\n    cell.setAttribute('data-group', gid);\n    cell.style.gridColumn = `${startIndex + 1} / span ${span}`;\n\n    // Apply per-group renderer → fallback renderer → plain text label\n    const activeRenderer = (!isImplicit && (g.renderer || renderer)) || undefined;\n    if (activeRenderer && !isImplicit) {\n      const params: GroupHeaderRenderParams = {\n        id: gid,\n        label: String(label),\n        columns: g.columns as ColumnConfig[],\n        firstIndex: startIndex,\n        isImplicit: false,\n      };\n      const result = activeRenderer(params);\n      if (result instanceof HTMLElement) {\n        cell.appendChild(result);\n      } else if (typeof result === 'string') {\n        cell.innerHTML = result;\n      } else {\n        cell.textContent = label;\n      }\n    } else {\n      // Always use textContent for non-rendered labels to prevent HTML injection\n      cell.textContent = label;\n    }\n\n    groupRow.appendChild(cell);\n  }\n\n  return groupRow;\n}\n\n/**\n * Check if any columns have group configuration.\n *\n * @param columns - The column configurations\n * @returns True if at least one column has a group\n */\nexport function hasColumnGroups(columns: ColumnConfig[]): boolean {\n  return columns.some((col) => col.group != null);\n}\n\n/**\n * Get group ID for a specific column.\n *\n * @param column - The column configuration\n * @returns The group ID, or undefined if not grouped\n */\nexport function getColumnGroupId(column: ColumnConfig): string | undefined {\n  const g = column.group;\n  if (!g) return undefined;\n  return typeof g === 'string' ? g : g.id;\n}\n","/**\n * Column Groups Plugin (Class-based)\n *\n * Enables multi-level column header grouping.\n */\n\n/* eslint-disable @typescript-eslint/no-explicit-any */\n\nimport { COLUMN_GROUPS_CONFLICT } from '../../core/internal/diagnostics';\nimport type { AfterCellRenderContext, PluginManifest, PluginQuery } from '../../core/plugin/base-plugin';\nimport { BaseGridPlugin } from '../../core/plugin/base-plugin';\nimport type { ColumnConfig } from '../../core/types';\nimport type { ColumnGroupInfo } from '../visibility/types';\nimport {\n  applyGroupedHeaderCellClasses,\n  buildGroupHeaderRow,\n  computeColumnGroups,\n  findEmbeddedImplicitGroups,\n  hasColumnGroups,\n  resolveColumnGroupDefs,\n} from './grouping-columns';\nimport styles from './grouping-columns.css?inline';\nimport type { ColumnGroup, ColumnGroupDefinition, GroupingColumnsConfig } from './types';\n\n/**\n * Column Grouping Plugin for tbw-grid\n *\n * Enables visual grouping of columns under shared headers. Supports two approaches:\n * declarative `columnGroups` at the grid level, or inline `group` property on columns.\n *\n * ## Installation\n *\n * ```ts\n * import { GroupingColumnsPlugin } from '@toolbox-web/grid/plugins/grouping-columns';\n * ```\n *\n * ## Configuration Options\n *\n * | Option | Type | Default | Description |\n * |--------|------|---------|-------------|\n * | `showGroupBorders` | `boolean` | `true` | Show borders between groups |\n * | `groupHeaderRenderer` | `function` | - | Custom renderer for group header content |\n *\n * ## Grid Config: `columnGroups`\n *\n * | Property | Type | Description |\n * |----------|------|-------------|\n * | `id` | `string` | Unique group identifier |\n * | `header` | `string` | Display label for the group header |\n * | `children` | `string[]` | Array of column field names in this group |\n *\n * ## Column Config: `group`\n *\n * | Type | Description |\n * |------|-------------|\n * | `string` | Simple group ID (used as both id and label) |\n * | `{ id: string; label?: string }` | Group object with explicit id and optional label |\n *\n * ## Programmatic API\n *\n * | Method | Signature | Description |\n * |--------|-----------|-------------|\n * | `isGroupingActive` | `() => boolean` | Check if grouping is active |\n * | `getGroups` | `() => ColumnGroup[]` | Get all computed groups |\n * | `getGroupColumns` | `(groupId) => ColumnConfig[]` | Get columns in a specific group |\n * | `refresh` | `() => void` | Force refresh of column groups |\n *\n * @example Declarative columnGroups (Recommended)\n * ```ts\n * import '@toolbox-web/grid';\n * import { GroupingColumnsPlugin } from '@toolbox-web/grid/plugins/grouping-columns';\n *\n * grid.gridConfig = {\n *   columnGroups: [\n *     { id: 'personal', header: 'Personal Info', children: ['firstName', 'lastName', 'email'] },\n *     { id: 'work', header: 'Work Info', children: ['department', 'title', 'salary'] },\n *   ],\n *   columns: [\n *     { field: 'firstName', header: 'First Name' },\n *     { field: 'lastName', header: 'Last Name' },\n *     // ...\n *   ],\n *   plugins: [new GroupingColumnsPlugin()],\n * };\n * ```\n *\n * @example Inline group Property\n * ```ts\n * grid.gridConfig = {\n *   columns: [\n *     { field: 'firstName', header: 'First Name', group: { id: 'personal', label: 'Personal Info' } },\n *     { field: 'lastName', header: 'Last Name', group: 'personal' }, // string shorthand\n *   ],\n *   plugins: [new GroupingColumnsPlugin()],\n * };\n * ```\n *\n * @see {@link GroupingColumnsConfig} for all configuration options\n * @see {@link ColumnGroup} for the group structure\n * @see {@link ReorderPlugin} for drag-to-reorder within groups\n *\n * @internal Extends BaseGridPlugin\n */\nexport class GroupingColumnsPlugin extends BaseGridPlugin<GroupingColumnsConfig> {\n  /**\n   * Plugin manifest - declares owned properties for configuration validation.\n   * @internal\n   */\n  static override readonly manifest: PluginManifest = {\n    ownedProperties: [\n      {\n        property: 'group',\n        level: 'column',\n        description: 'the \"group\" column property',\n      },\n      {\n        property: 'columnGroups',\n        level: 'config',\n        description: 'the \"columnGroups\" config property',\n        isUsed: (v) => Array.isArray(v) && v.length > 0,\n      },\n    ],\n    queries: [{ type: 'getColumnGrouping', description: 'Returns column group metadata for the visibility panel' }],\n  };\n\n  /** @internal */\n  readonly name = 'groupingColumns';\n  /** @internal */\n  override readonly styles = styles;\n\n  /** @internal */\n  protected override get defaultConfig(): Partial<GroupingColumnsConfig> {\n    return {\n      showGroupBorders: true,\n      lockGroupOrder: false,\n    };\n  }\n\n  // #region Internal State\n  private groups: ColumnGroup[] = [];\n  private isActive = false;\n  /** Fields that are the last column in a group (for group-end border class). */\n  #groupEndFields = new Set<string>();\n  /** Resolved column group definitions (with auto-generated ids). */\n  #resolvedGroupDefs: (ColumnGroupDefinition & { id: string })[] = [];\n  /** Map of group id → per-group renderer from ColumnGroupDefinition.renderer */\n  #groupRenderers = new Map<string, NonNullable<ColumnGroupDefinition['renderer']>>();\n  // #endregion\n\n  // #region Lifecycle\n\n  /** @internal */\n  override attach(grid: import('../../core/plugin/base-plugin').GridElement): void {\n    super.attach(grid);\n\n    // Listen for cancelable column-move events to enforce group contiguity\n    this.gridElement.addEventListener('column-move', this.#onColumnMove, {\n      signal: this.disconnectSignal,\n    });\n  }\n\n  /** @internal */\n  override detach(): void {\n    this.groups = [];\n    this.isActive = false;\n    this.#groupEndFields.clear();\n    this.#resolvedGroupDefs = [];\n    this.#groupRenderers.clear();\n  }\n\n  // #region Column Move Guard\n\n  /**\n   * Handle the cancelable column-move event.\n   * - When lockGroupOrder is enabled, prevents moves that would break group contiguity.\n   * - Always refreshes #groupEndFields after a successful move so that afterCellRender\n   *   applies group-end borders to the correct (reordered) last column.\n   */\n  #onColumnMove = (e: Event): void => {\n    if (!this.isActive) return;\n\n    const event = e as CustomEvent<{ field: string; columnOrder: string[] }>;\n    const { field, columnOrder } = event.detail;\n\n    if (this.config.lockGroupOrder) {\n      // Check ALL explicit groups — moving any column (grouped or not) could break contiguity\n      for (const group of this.groups) {\n        if (group.id.startsWith('__implicit__')) continue;\n        if (!this.#isGroupContiguous(group, columnOrder)) {\n          event.preventDefault();\n          this.#flashHeaderCell(field);\n          return;\n        }\n      }\n    }\n\n    // Recompute group-end fields based on proposed column order.\n    // setColumnOrder runs synchronously after this handler returns,\n    // but afterCellRender (which reads #groupEndFields) fires during\n    // the subsequent refreshVirtualWindow. Precompute using the\n    // proposed columnOrder so the borders are correct immediately.\n    this.#recomputeGroupEndFields(columnOrder);\n  };\n\n  /**\n   * Recompute which fields are group-end based on a column order.\n   * The last field of each explicit group in the order gets the group-end class.\n   */\n  #recomputeGroupEndFields(columnOrder: string[]): void {\n    this.#groupEndFields.clear();\n    // Find the last field of each group (including implicit groups between explicit ones).\n    // Skip the very last group overall — no adjacent group follows it, so no separator needed.\n    const lastGroupEndField = this.#findLastGroupEndField(columnOrder);\n    for (const group of this.groups) {\n      const groupFields = new Set(group.columns.map((c) => c.field));\n      // Walk the column order in reverse to find the last member of this group\n      for (let i = columnOrder.length - 1; i >= 0; i--) {\n        if (groupFields.has(columnOrder[i])) {\n          const field = columnOrder[i];\n          // Don't mark the last group's trailing field — nothing follows it\n          if (field !== lastGroupEndField) {\n            this.#groupEndFields.add(field);\n          }\n          break;\n        }\n      }\n    }\n  }\n\n  /**\n   * Find the trailing field of the last group in column order (to exclude from group-end marking).\n   */\n  #findLastGroupEndField(columnOrder: string[]): string | null {\n    if (this.groups.length === 0) return null;\n    // Determine which group contains the last field in column order\n    for (let i = columnOrder.length - 1; i >= 0; i--) {\n      const field = columnOrder[i];\n      for (const group of this.groups) {\n        if (group.columns.some((c) => c.field === field)) {\n          // This group is the last in display order — find its last field\n          const groupFields = new Set(group.columns.map((c) => c.field));\n          for (let j = columnOrder.length - 1; j >= 0; j--) {\n            if (groupFields.has(columnOrder[j])) return columnOrder[j];\n          }\n        }\n      }\n    }\n    return null;\n  }\n\n  /**\n   * Check if all columns in a group are contiguous in the proposed column order.\n   */\n  #isGroupContiguous(group: ColumnGroup, columnOrder: string[]): boolean {\n    const indices = group.columns\n      .map((c) => columnOrder.indexOf(c.field))\n      .filter((i) => i !== -1)\n      .sort((a, b) => a - b);\n    if (indices.length <= 1) return true;\n    return indices.length === indices[indices.length - 1] - indices[0] + 1;\n  }\n\n  /**\n   * Flash the header cell with an error color to indicate a blocked move.\n   */\n  #flashHeaderCell(field: string): void {\n    const headerCell = this.gridElement?.querySelector(\n      `.header-row [part~=\"header-cell\"][data-field=\"${field}\"]`,\n    ) as HTMLElement;\n    if (!headerCell) return;\n\n    headerCell.style.setProperty('--_flash-color', 'var(--tbw-color-error)');\n    headerCell.animate(\n      [{ backgroundColor: 'rgba(from var(--_flash-color) r g b / 30%)' }, { backgroundColor: 'transparent' }],\n      { duration: 400, easing: 'ease-out' },\n    );\n  }\n  // #endregion\n\n  /** @internal */\n  override handleQuery(query: PluginQuery): unknown {\n    if (query.type === 'getColumnGrouping') {\n      return this.#getStableColumnGrouping();\n    }\n    return undefined;\n  }\n\n  /**\n   * Get stable column grouping info that includes ALL columns (visible and hidden).\n   * Used by the visibility panel to maintain group structure regardless of visibility state.\n   * Fields within each group are sorted by current display order.\n   */\n  #getStableColumnGrouping(): ColumnGroupInfo[] {\n    let result: ColumnGroupInfo[];\n\n    // 1. Prefer resolved declarative columnGroups (from plugin config or gridConfig)\n    if (this.#resolvedGroupDefs.length > 0) {\n      result = this.#resolvedGroupDefs\n        .filter((g) => g.children.length > 0)\n        .map((g) => ({\n          id: g.id,\n          label: g.header,\n          fields: [...g.children],\n        }));\n    } else if (this.isActive && this.groups.length > 0) {\n      // 2. If active groups exist from processColumns, use them\n      result = this.groups\n        .filter((g) => !g.id.startsWith('__implicit__'))\n        .map<ColumnGroupInfo>((g) => ({\n          id: g.id,\n          label: g.label ?? g.id,\n          fields: g.columns.map((c) => c.field),\n        }));\n\n      // Also check hidden columns for inline group properties not in active groups\n      const allCols = this.columns as ColumnConfig[];\n      for (const col of allCols) {\n        if ((col as any).hidden && col.group) {\n          const gId = typeof col.group === 'string' ? col.group : col.group.id;\n          const gLabel = typeof col.group === 'string' ? col.group : (col.group.label ?? col.group.id);\n          const existing = result.find((g) => g.id === gId);\n          if (existing) {\n            if (!existing.fields.includes(col.field)) existing.fields.push(col.field);\n          } else {\n            result.push({ id: gId, label: gLabel, fields: [col.field] });\n          }\n        }\n      }\n    } else {\n      // 3. Fall back: scan ALL columns (including hidden) for inline group properties\n      const allCols = this.columns as ColumnConfig[];\n      const groupMap = new Map<string, ColumnGroupInfo>();\n      for (const col of allCols) {\n        if (!col.group) continue;\n        const gId = typeof col.group === 'string' ? col.group : col.group.id;\n        const gLabel = typeof col.group === 'string' ? col.group : (col.group.label ?? col.group.id);\n        const existing = groupMap.get(gId);\n        if (existing) {\n          if (!existing.fields.includes(col.field)) existing.fields.push(col.field);\n        } else {\n          groupMap.set(gId, { id: gId, label: gLabel, fields: [col.field] });\n        }\n      }\n      result = Array.from(groupMap.values());\n    }\n\n    // Sort fields within each group by current display order so consumers\n    // (e.g. the visibility panel) render columns in their reordered positions.\n    const displayOrder = this.grid?.getColumnOrder();\n    if (displayOrder && displayOrder.length > 0) {\n      const orderIndex = new Map(displayOrder.map((f, i) => [f, i]));\n      for (const group of result) {\n        group.fields.sort((a, b) => (orderIndex.get(a) ?? Infinity) - (orderIndex.get(b) ?? Infinity));\n      }\n    }\n\n    return result;\n  }\n  // #endregion\n\n  // #region Static Detection\n\n  /**\n   * Auto-detect column groups from column configuration.\n   * Detects both inline `column.group` properties and declarative `columnGroups` config.\n   */\n  static detect(rows: readonly any[], config: any): boolean {\n    // Check for declarative columnGroups in plugin feature config\n    const featureConfig = config?.features?.groupingColumns;\n    if (\n      featureConfig &&\n      typeof featureConfig === 'object' &&\n      Array.isArray(featureConfig.columnGroups) &&\n      featureConfig.columnGroups.length > 0\n    ) {\n      return true;\n    }\n    // Check for declarative columnGroups in gridConfig\n    if (config?.columnGroups && Array.isArray(config.columnGroups) && config.columnGroups.length > 0) {\n      return true;\n    }\n    // Check for inline group properties on columns\n    const columns = config?.columns;\n    if (!Array.isArray(columns)) return false;\n    return hasColumnGroups(columns);\n  }\n  // #endregion\n\n  // #region Hooks\n\n  /** @internal */\n  override processColumns(columns: readonly ColumnConfig[]): ColumnConfig[] {\n    // Resolve columnGroups source — plugin config takes precedence over gridConfig\n    const pluginColumnGroups = this.config?.columnGroups;\n    const gridColumnGroups = this.grid?.gridConfig?.columnGroups;\n    let columnGroupDefs: ColumnGroupDefinition[] | undefined;\n\n    if (pluginColumnGroups && Array.isArray(pluginColumnGroups) && pluginColumnGroups.length > 0) {\n      // Warn if both sources are defined\n      if (gridColumnGroups && Array.isArray(gridColumnGroups) && gridColumnGroups.length > 0) {\n        this.warn(\n          COLUMN_GROUPS_CONFLICT,\n          'columnGroups defined in both gridConfig and groupingColumns feature config. ' +\n            'Using feature config (higher precedence).',\n        );\n      }\n      columnGroupDefs = pluginColumnGroups;\n    } else if (gridColumnGroups && Array.isArray(gridColumnGroups) && gridColumnGroups.length > 0) {\n      columnGroupDefs = gridColumnGroups;\n    }\n\n    let processedColumns: ColumnConfig[];\n\n    if (columnGroupDefs && columnGroupDefs.length > 0) {\n      // Resolve ids (auto-generate from header when missing) and validate\n      const resolved = resolveColumnGroupDefs(columnGroupDefs);\n      this.#resolvedGroupDefs = resolved;\n\n      // Collect per-group renderers\n      this.#groupRenderers.clear();\n      for (const def of resolved) {\n        if (def.renderer) {\n          this.#groupRenderers.set(def.id, def.renderer);\n        }\n      }\n\n      // Build a map of field → group info from the declarative config\n      const fieldToGroup = new Map<string, { id: string; label: string }>();\n      for (const group of resolved) {\n        for (const field of group.children) {\n          fieldToGroup.set(field, { id: group.id, label: group.header });\n        }\n      }\n\n      // Apply group property to columns that don't already have one\n      processedColumns = columns.map((col) => {\n        const groupInfo = fieldToGroup.get(col.field);\n        if (groupInfo && !col.group) {\n          return { ...col, group: groupInfo };\n        }\n        return col;\n      });\n    } else {\n      this.#resolvedGroupDefs = [];\n      this.#groupRenderers.clear();\n      processedColumns = [...columns];\n    }\n\n    // Compute groups from column definitions (now including applied groups)\n    const groups = computeColumnGroups(processedColumns);\n\n    if (groups.length === 0) {\n      this.isActive = false;\n      this.groups = [];\n      return processedColumns;\n    }\n\n    // Attach per-group renderers to computed groups\n    if (this.#groupRenderers.size > 0) {\n      for (const g of groups) {\n        const r = this.#groupRenderers.get(g.id);\n        if (r) g.renderer = r;\n      }\n    }\n\n    this.isActive = true;\n    this.groups = groups;\n\n    // Pre-compute group-end fields for the afterCellRender hook\n    this.#groupEndFields.clear();\n    for (const g of groups) {\n      const lastCol = g.columns[g.columns.length - 1];\n      if (lastCol?.field) {\n        this.#groupEndFields.add(lastCol.field);\n      }\n    }\n\n    // Return columns with group info applied\n    return processedColumns;\n  }\n\n  /** @internal */\n  override afterRender(): void {\n    if (!this.isActive) {\n      // Remove any existing group header\n      const header = this.gridElement?.querySelector('.header');\n      const existingGroupRow = header?.querySelector('.header-group-row');\n      if (existingGroupRow) existingGroupRow.remove();\n      return;\n    }\n\n    const header = this.gridElement?.querySelector('.header');\n    if (!header) return;\n\n    // Remove existing group row if present\n    const existingGroupRow = header.querySelector('.header-group-row');\n    if (existingGroupRow) existingGroupRow.remove();\n\n    // Recompute groups from visible columns only (hidden columns have no CSS grid track).\n    // This also picks up any plugin-added columns (e.g. expander) that weren't present\n    // during processColumns.\n    const finalColumns = this.visibleColumns as ColumnConfig[];\n    const groups = computeColumnGroups(finalColumns);\n    if (groups.length === 0) return;\n\n    // Attach per-group renderers from resolved definitions\n    if (this.#groupRenderers.size > 0) {\n      for (const g of groups) {\n        const r = this.#groupRenderers.get(g.id);\n        if (r) g.renderer = r;\n      }\n    }\n\n    // Keep #groupEndFields in sync for afterCellRender (covers scheduler-driven renders)\n    this.#groupEndFields.clear();\n    const embedded = findEmbeddedImplicitGroups(groups, finalColumns);\n    for (let gi = 0; gi < groups.length; gi++) {\n      const g = groups[gi];\n      // Skip embedded implicit groups (e.g. checkbox column within a pinned group)\n      if (String(g.id).startsWith('__implicit__') && embedded.has(String(g.id))) continue;\n      const lastCol = g.columns[g.columns.length - 1];\n      // Don't mark the last group — no adjacent group follows it\n      if (lastCol?.field && gi < groups.length - 1) {\n        this.#groupEndFields.add(lastCol.field);\n      }\n    }\n\n    // Build and insert group header row\n    const groupRow = buildGroupHeaderRow(groups, finalColumns, this.config.groupHeaderRenderer);\n    if (groupRow) {\n      // Toggle border visibility class\n      groupRow.classList.toggle('no-borders', !this.config.showGroupBorders);\n\n      const headerRow = header.querySelector('.header-row');\n      if (headerRow) {\n        header.insertBefore(groupRow, headerRow);\n      } else {\n        header.appendChild(groupRow);\n      }\n    }\n\n    // Apply classes to header cells\n    const headerRow = header.querySelector('.header-row') as HTMLElement;\n    if (headerRow) {\n      // Toggle border visibility on header cells\n      headerRow.classList.toggle('no-group-borders', !this.config.showGroupBorders);\n      applyGroupedHeaderCellClasses(headerRow, groups, finalColumns);\n    }\n  }\n\n  /**\n   * Apply group-end class to individual cells during render and scroll.\n   * This is more efficient than querySelectorAll in afterRender and ensures\n   * cells recycled during scroll also get the class applied.\n   * @internal\n   */\n  override afterCellRender(context: AfterCellRenderContext): void {\n    if (!this.isActive || !this.config.showGroupBorders) return;\n    context.cellElement.classList.toggle('group-end', this.#groupEndFields.has(context.column.field));\n  }\n  // #endregion\n\n  // #region Public API\n\n  /**\n   * Check if column groups are active.\n   * @returns Whether grouping is active\n   */\n  isGroupingActive(): boolean {\n    return this.isActive;\n  }\n\n  /**\n   * Get the computed column groups.\n   * @returns Array of column groups\n   */\n  getGroups(): ColumnGroup[] {\n    return this.groups;\n  }\n\n  /**\n   * Get columns in a specific group.\n   * @param groupId - The group ID to find\n   * @returns Array of columns in the group\n   */\n  getGroupColumns(groupId: string): ColumnConfig[] {\n    const group = this.groups.find((g) => g.id === groupId);\n    return group ? group.columns : [];\n  }\n\n  /**\n   * Refresh column groups (recompute from current columns).\n   */\n  refresh(): void {\n    this.requestRender();\n  }\n  // #endregion\n}\n"],"names":["slugifyHeader","header","toLowerCase","trim","replace","resolveColumnGroupDefs","defs","map","def","id","throwDiagnostic","COLUMN_GROUP_NO_ID","computeColumnGroups","columns","length","explicitMap","Map","groupsOrdered","pushImplicit","startIdx","cols","prev","implicit","firstIndex","push","label","run","runStart","forEach","col","idx","g","group","slice","get","set","computeGroupGridRange","first","last","start","findIndex","c","field","end","findEmbeddedImplicitGroups","groups","embedded","Set","explicitRanges","String","startsWith","range","iStart","iEnd","some","eStart","eEnd","add","GroupingColumnsPlugin","BaseGridPlugin","static","ownedProperties","property","level","description","isUsed","v","Array","isArray","queries","type","name","styles","defaultConfig","showGroupBorders","lockGroupOrder","isActive","groupEndFields","resolvedGroupDefs","groupRenderers","attach","grid","super","this","gridElement","addEventListener","onColumnMove","signal","disconnectSignal","detach","clear","e","event","columnOrder","detail","config","isGroupContiguous","preventDefault","flashHeaderCell","recomputeGroupEndFields","lastGroupEndField","findLastGroupEndField","groupFields","i","has","j","indices","indexOf","filter","sort","a","b","headerCell","querySelector","style","setProperty","animate","backgroundColor","duration","easing","handleQuery","query","getStableColumnGrouping","result","children","fields","allCols","hidden","gId","gLabel","existing","find","includes","groupMap","from","values","displayOrder","getColumnOrder","orderIndex","f","Infinity","detect","rows","featureConfig","features","groupingColumns","columnGroups","hasColumnGroups","processColumns","pluginColumnGroups","gridColumnGroups","gridConfig","columnGroupDefs","processedColumns","warn","COLUMN_GROUPS_CONFLICT","resolved","renderer","fieldToGroup","groupInfo","size","r","lastCol","afterRender","existingGroupRow","remove","finalColumns","visibleColumns","gi","groupRow","document","createElement","className","setAttribute","gid","isImplicit","startIndex","endIndex","span","cell","classList","gridColumn","activeRenderer","HTMLElement","appendChild","innerHTML","textContent","buildGroupHeaderRow","groupHeaderRenderer","toggle","headerRow","insertBefore","headerRowEl","headerCells","querySelectorAll","getAttribute","applyGroupedHeaderCellClasses","afterCellRender","context","cellElement","column","isGroupingActive","getGroups","getGroupColumns","groupId","refresh","requestRender"],"mappings":"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"}
+{"version":3,"file":"grouping-columns.umd.js","sources":["../../../../../libs/grid/src/lib/plugins/grouping-columns/grouping-columns.ts","../../../../../libs/grid/src/lib/plugins/grouping-columns/GroupingColumnsPlugin.ts"],"sourcesContent":["/**\n * Column Groups Core Logic\n *\n * Pure functions for computing and managing column header groups.\n */\n\n// Import types to enable module augmentation\nimport { COLUMN_GROUP_NO_ID, throwDiagnostic } from '../../core/internal/diagnostics';\nimport type { ColumnConfig } from '../../core/types';\nimport './types';\nimport type {\n  ColumnGroup,\n  ColumnGroupDefinition,\n  ColumnGroupInternal,\n  GroupHeaderRenderParams,\n  GroupingColumnsConfig,\n} from './types';\n\n/**\n * Generate a stable slug from a header string for use as auto-generated group id.\n * E.g. `'Personal Info'` → `'personal-info'`\n */\nexport function slugifyHeader(header: string): string {\n  return header\n    .toLowerCase()\n    .trim()\n    .replace(/[^a-z0-9]+/g, '-')\n    .replace(/^-|-$/g, '');\n}\n\n/**\n * Validate column group definitions and resolve auto-generated ids.\n * Throws if a group has neither `id` nor `header`.\n *\n * @returns A new array with `id` resolved on every definition.\n */\nexport function resolveColumnGroupDefs(defs: ColumnGroupDefinition[]): (ColumnGroupDefinition & { id: string })[] {\n  return defs.map((def) => {\n    if (def.id) return def as ColumnGroupDefinition & { id: string };\n    if (!def.header) {\n      throwDiagnostic(\n        COLUMN_GROUP_NO_ID,\n        'ColumnGroupDefinition requires either an \"id\" or a \"header\" to generate an id from.',\n      );\n    }\n    return { ...def, id: slugifyHeader(def.header) };\n  });\n}\n\n/**\n * Compute column groups from column configuration.\n * Handles explicit groups (via column.group) and creates implicit groups for ungrouped columns.\n *\n * @param columns - Array of column configurations\n * @returns Array of column groups, or empty if no meaningful groups\n */\nexport function computeColumnGroups<T>(columns: ColumnConfig<T>[]): ColumnGroup<T>[] {\n  if (!columns.length) return [];\n\n  const explicitMap = new Map<string, ColumnGroupInternal<T>>();\n  const groupsOrdered: ColumnGroupInternal<T>[] = [];\n\n  // Helper to push unnamed implicit group for a run of ungrouped columns\n  const pushImplicit = (startIdx: number, cols: ColumnConfig<T>[]) => {\n    if (!cols.length) return;\n    // Merge with previous implicit group if adjacent to reduce noise\n    const prev = groupsOrdered[groupsOrdered.length - 1];\n    if (prev && prev.implicit && prev.firstIndex + prev.columns.length === startIdx) {\n      prev.columns.push(...cols);\n      return;\n    }\n    groupsOrdered.push({\n      id: '__implicit__' + startIdx,\n      label: undefined,\n      columns: cols,\n      firstIndex: startIdx,\n      implicit: true,\n    });\n  };\n\n  let run: ColumnConfig<T>[] = [];\n  let runStart = 0;\n\n  columns.forEach((col, idx) => {\n    const g = col.group;\n    if (!g) {\n      if (run.length === 0) runStart = idx;\n      run.push(col);\n      return;\n    }\n    // Close any pending implicit run\n    if (run.length) {\n      pushImplicit(runStart, run.slice());\n      run = [];\n    }\n    const id = typeof g === 'string' ? g : g.id;\n    let group = explicitMap.get(id);\n    if (!group) {\n      group = {\n        id,\n        label: typeof g === 'string' ? undefined : g.label,\n        columns: [],\n        firstIndex: idx,\n      };\n      explicitMap.set(id, group);\n      groupsOrdered.push(group);\n    }\n    group.columns.push(col);\n  });\n\n  // Trailing implicit run\n  if (run.length) pushImplicit(runStart, run);\n\n  // If we only have a single implicit group covering all columns, treat as no groups\n  if (groupsOrdered.length === 1 && groupsOrdered[0].implicit && groupsOrdered[0].columns.length === columns.length) {\n    return [];\n  }\n\n  return groupsOrdered as ColumnGroup<T>[];\n}\n\n/**\n * Apply CSS classes to header cells based on their group membership.\n *\n * @param headerRowEl - The header row element\n * @param groups - The computed column groups\n * @param columns - The column configurations\n */\nexport function applyGroupedHeaderCellClasses(\n  headerRowEl: HTMLElement | null,\n  groups: ColumnGroup[],\n  columns: ColumnConfig[],\n): void {\n  if (!groups.length || !headerRowEl) return;\n\n  const embedded = findEmbeddedImplicitGroups(groups, columns);\n\n  const fieldToGroup = new Map<string, string>();\n  for (const g of groups) {\n    // Skip embedded implicit groups — their columns inherit the enclosing explicit group\n    if (String(g.id).startsWith('__implicit__') && embedded.has(String(g.id))) continue;\n    for (const c of g.columns) {\n      if (c.field) {\n        fieldToGroup.set(c.field, g.id);\n      }\n    }\n  }\n\n  const headerCells = Array.from(headerRowEl.querySelectorAll('.cell[data-field]')) as HTMLElement[];\n  headerCells.forEach((cell) => {\n    const f = cell.getAttribute('data-field') || '';\n    const gid = fieldToGroup.get(f);\n    if (gid) {\n      cell.classList.add('grouped');\n      if (!cell.getAttribute('data-group')) {\n        cell.setAttribute('data-group', gid);\n      }\n    }\n  });\n\n  // Mark group end cells for styling (skip embedded implicit groups)\n  for (const g of groups) {\n    if (String(g.id).startsWith('__implicit__') && embedded.has(String(g.id))) continue;\n    const last = g.columns[g.columns.length - 1];\n    const cell = headerCells.find((c) => c.getAttribute('data-field') === last.field);\n    if (cell) cell.classList.add('group-end');\n  }\n}\n\n/**\n * Compute the grid range [start, end] for a group based on its first and last\n * column positions in the final columns array.\n */\nfunction computeGroupGridRange(group: ColumnGroup, columns: ColumnConfig[]): [number, number] | null {\n  const first = group.columns[0];\n  const last = group.columns[group.columns.length - 1];\n  const start = first ? columns.findIndex((c) => c.field === first.field) : -1;\n  const end = last ? columns.findIndex((c) => c.field === last.field) : -1;\n  return start !== -1 && end !== -1 ? [start, end] : null;\n}\n\n/**\n * Find implicit groups whose column range falls entirely within an explicit\n * group's range (e.g. a utility column inserted between members of the same group).\n *\n * @returns Set of implicit group IDs that are visually embedded.\n */\nexport function findEmbeddedImplicitGroups(groups: ColumnGroup[], columns: ColumnConfig[]): Set<string> {\n  const embedded = new Set<string>();\n\n  // Collect ranges for explicit groups\n  const explicitRanges: [number, number][] = [];\n  for (const g of groups) {\n    if (String(g.id).startsWith('__implicit__')) continue;\n    const range = computeGroupGridRange(g, columns);\n    if (range) explicitRanges.push(range);\n  }\n\n  // Check each implicit group\n  for (const g of groups) {\n    if (!String(g.id).startsWith('__implicit__')) continue;\n    const range = computeGroupGridRange(g, columns);\n    if (!range) continue;\n    const [iStart, iEnd] = range;\n    if (explicitRanges.some(([eStart, eEnd]) => iStart >= eStart && iEnd <= eEnd)) {\n      embedded.add(String(g.id));\n    }\n  }\n\n  return embedded;\n}\n\n/**\n * Build the group header row element.\n *\n * @param groups - The computed column groups\n * @param columns - The column configurations (final array including any plugin-added columns)\n * @returns The group header row element, or null if no groups\n */\nexport function buildGroupHeaderRow(\n  groups: ColumnGroup[],\n  columns: ColumnConfig[],\n  renderer?: GroupingColumnsConfig['groupHeaderRenderer'],\n): HTMLElement | null {\n  if (groups.length === 0) return null;\n\n  const groupRow = document.createElement('div');\n  groupRow.className = 'header-group-row';\n  groupRow.setAttribute('role', 'row');\n\n  const embedded = findEmbeddedImplicitGroups(groups, columns);\n\n  for (const g of groups) {\n    const gid = String(g.id);\n    const isImplicit = gid.startsWith('__implicit__');\n\n    // Skip implicit groups that are visually embedded within an explicit group\n    if (isImplicit && embedded.has(gid)) continue;\n\n    // Compute actual range from first to last member in the final columns array.\n    // This correctly spans over any interleaved utility columns (e.g. checkbox).\n    const range = computeGroupGridRange(g, columns);\n    if (!range) continue;\n    const [startIndex, endIndex] = range;\n    const span = endIndex - startIndex + 1;\n\n    const label = isImplicit ? '' : g.label || g.id;\n\n    const cell = document.createElement('div');\n    cell.className = 'cell header-group-cell';\n    if (isImplicit) cell.classList.add('implicit-group');\n    cell.setAttribute('data-group', gid);\n    cell.style.gridColumn = `${startIndex + 1} / span ${span}`;\n\n    // Apply per-group renderer → fallback renderer → plain text label\n    const activeRenderer = (!isImplicit && (g.renderer || renderer)) || undefined;\n    if (activeRenderer && !isImplicit) {\n      const params: GroupHeaderRenderParams = {\n        id: gid,\n        label: String(label),\n        columns: g.columns as ColumnConfig[],\n        firstIndex: startIndex,\n        isImplicit: false,\n      };\n      const result = activeRenderer(params);\n      if (result instanceof HTMLElement) {\n        cell.appendChild(result);\n      } else if (typeof result === 'string') {\n        cell.innerHTML = result;\n      } else {\n        cell.textContent = label;\n      }\n    } else {\n      // Always use textContent for non-rendered labels to prevent HTML injection\n      cell.textContent = label;\n    }\n\n    groupRow.appendChild(cell);\n  }\n\n  return groupRow;\n}\n\n/**\n * Check if any columns have group configuration.\n *\n * @param columns - The column configurations\n * @returns True if at least one column has a group\n */\nexport function hasColumnGroups(columns: ColumnConfig[]): boolean {\n  return columns.some((col) => col.group != null);\n}\n\n/**\n * Get group ID for a specific column.\n *\n * @param column - The column configuration\n * @returns The group ID, or undefined if not grouped\n */\nexport function getColumnGroupId(column: ColumnConfig): string | undefined {\n  const g = column.group;\n  if (!g) return undefined;\n  return typeof g === 'string' ? g : g.id;\n}\n","/**\n * Column Groups Plugin (Class-based)\n *\n * Enables multi-level column header grouping.\n */\n\n/* eslint-disable @typescript-eslint/no-explicit-any */\n\nimport { COLUMN_GROUPS_CONFLICT } from '../../core/internal/diagnostics';\nimport type { AfterCellRenderContext, PluginManifest, PluginQuery } from '../../core/plugin/base-plugin';\nimport { BaseGridPlugin } from '../../core/plugin/base-plugin';\nimport type { ColumnConfig } from '../../core/types';\nimport type { ColumnGroupInfo } from '../visibility/types';\nimport {\n  applyGroupedHeaderCellClasses,\n  buildGroupHeaderRow,\n  computeColumnGroups,\n  findEmbeddedImplicitGroups,\n  hasColumnGroups,\n  resolveColumnGroupDefs,\n} from './grouping-columns';\nimport styles from './grouping-columns.css?inline';\nimport type { ColumnGroup, ColumnGroupDefinition, GroupingColumnsConfig } from './types';\n\n/**\n * Column Grouping Plugin for tbw-grid\n *\n * Enables visual grouping of columns under shared headers. Supports two approaches:\n * declarative `columnGroups` at the grid level, or inline `group` property on columns.\n *\n * ## Installation\n *\n * ```ts\n * import { GroupingColumnsPlugin } from '@toolbox-web/grid/plugins/grouping-columns';\n * ```\n *\n * ## Configuration Options\n *\n * | Option | Type | Default | Description |\n * |--------|------|---------|-------------|\n * | `showGroupBorders` | `boolean` | `true` | Show borders between groups |\n * | `groupHeaderRenderer` | `function` | - | Custom renderer for group header content |\n *\n * ## Grid Config: `columnGroups`\n *\n * | Property | Type | Description |\n * |----------|------|-------------|\n * | `id` | `string` | Unique group identifier |\n * | `header` | `string` | Display label for the group header |\n * | `children` | `string[]` | Array of column field names in this group |\n *\n * ## Column Config: `group`\n *\n * | Type | Description |\n * |------|-------------|\n * | `string` | Simple group ID (used as both id and label) |\n * | `{ id: string; label?: string }` | Group object with explicit id and optional label |\n *\n * ## Programmatic API\n *\n * | Method | Signature | Description |\n * |--------|-----------|-------------|\n * | `isGroupingActive` | `() => boolean` | Check if grouping is active |\n * | `getGroups` | `() => ColumnGroup[]` | Get all computed groups |\n * | `getGroupColumns` | `(groupId) => ColumnConfig[]` | Get columns in a specific group |\n * | `refresh` | `() => void` | Force refresh of column groups |\n *\n * @example Declarative columnGroups (Recommended)\n * ```ts\n * import '@toolbox-web/grid';\n * import { GroupingColumnsPlugin } from '@toolbox-web/grid/plugins/grouping-columns';\n *\n * grid.gridConfig = {\n *   columnGroups: [\n *     { id: 'personal', header: 'Personal Info', children: ['firstName', 'lastName', 'email'] },\n *     { id: 'work', header: 'Work Info', children: ['department', 'title', 'salary'] },\n *   ],\n *   columns: [\n *     { field: 'firstName', header: 'First Name' },\n *     { field: 'lastName', header: 'Last Name' },\n *     // ...\n *   ],\n *   plugins: [new GroupingColumnsPlugin()],\n * };\n * ```\n *\n * @example Inline group Property\n * ```ts\n * grid.gridConfig = {\n *   columns: [\n *     { field: 'firstName', header: 'First Name', group: { id: 'personal', label: 'Personal Info' } },\n *     { field: 'lastName', header: 'Last Name', group: 'personal' }, // string shorthand\n *   ],\n *   plugins: [new GroupingColumnsPlugin()],\n * };\n * ```\n *\n * @see {@link GroupingColumnsConfig} for all configuration options\n * @see {@link ColumnGroup} for the group structure\n * @see {@link ReorderPlugin} for drag-to-reorder within groups\n *\n * @internal Extends BaseGridPlugin\n */\nexport class GroupingColumnsPlugin extends BaseGridPlugin<GroupingColumnsConfig> {\n  /**\n   * Plugin manifest - declares owned properties for configuration validation.\n   * @internal\n   */\n  static override readonly manifest: PluginManifest = {\n    ownedProperties: [\n      {\n        property: 'group',\n        level: 'column',\n        description: 'the \"group\" column property',\n      },\n      {\n        property: 'columnGroups',\n        level: 'config',\n        description: 'the \"columnGroups\" config property',\n        isUsed: (v) => Array.isArray(v) && v.length > 0,\n      },\n    ],\n    queries: [{ type: 'getColumnGrouping', description: 'Returns column group metadata for the visibility panel' }],\n  };\n\n  /** @internal */\n  readonly name = 'groupingColumns';\n  /** @internal */\n  override readonly styles = styles;\n\n  /** @internal */\n  protected override get defaultConfig(): Partial<GroupingColumnsConfig> {\n    return {\n      showGroupBorders: true,\n      lockGroupOrder: false,\n    };\n  }\n\n  // #region Internal State\n  private groups: ColumnGroup[] = [];\n  private isActive = false;\n  /** Fields that are the last column in a group (for group-end border class). */\n  #groupEndFields = new Set<string>();\n  /** Resolved column group definitions (with auto-generated ids). */\n  #resolvedGroupDefs: (ColumnGroupDefinition & { id: string })[] = [];\n  /** Map of group id → per-group renderer from ColumnGroupDefinition.renderer */\n  #groupRenderers = new Map<string, NonNullable<ColumnGroupDefinition['renderer']>>();\n  // #endregion\n\n  // #region Lifecycle\n\n  /** @internal */\n  override attach(grid: import('../../core/plugin/base-plugin').GridElement): void {\n    super.attach(grid);\n\n    // Listen for cancelable column-move events to enforce group contiguity\n    this.gridElement.addEventListener('column-move', this.#onColumnMove, {\n      signal: this.disconnectSignal,\n    });\n  }\n\n  /** @internal */\n  override detach(): void {\n    this.groups = [];\n    this.isActive = false;\n    this.#groupEndFields.clear();\n    this.#resolvedGroupDefs = [];\n    this.#groupRenderers.clear();\n  }\n\n  // #region Column Move Guard\n\n  /**\n   * Handle the cancelable column-move event.\n   * - When lockGroupOrder is enabled, prevents moves that would break group contiguity.\n   * - Always refreshes #groupEndFields after a successful move so that afterCellRender\n   *   applies group-end borders to the correct (reordered) last column.\n   */\n  #onColumnMove = (e: Event): void => {\n    if (!this.isActive) return;\n\n    const event = e as CustomEvent<{ field: string; columnOrder: string[] }>;\n    const { field, columnOrder } = event.detail;\n\n    if (this.config.lockGroupOrder) {\n      // Check ALL explicit groups — moving any column (grouped or not) could break contiguity\n      for (const group of this.groups) {\n        if (group.id.startsWith('__implicit__')) continue;\n        if (!this.#isGroupContiguous(group, columnOrder)) {\n          event.preventDefault();\n          this.#flashHeaderCell(field);\n          return;\n        }\n      }\n    }\n\n    // Recompute group-end fields based on proposed column order.\n    // setColumnOrder runs synchronously after this handler returns,\n    // but afterCellRender (which reads #groupEndFields) fires during\n    // the subsequent refreshVirtualWindow. Precompute using the\n    // proposed columnOrder so the borders are correct immediately.\n    this.#recomputeGroupEndFields(columnOrder);\n  };\n\n  /**\n   * Recompute which fields are group-end based on a column order.\n   * The last field of each explicit group in the order gets the group-end class.\n   */\n  #recomputeGroupEndFields(columnOrder: string[]): void {\n    this.#groupEndFields.clear();\n    // Find the last field of each group (including implicit groups between explicit ones).\n    // Skip the very last group overall — no adjacent group follows it, so no separator needed.\n    const lastGroupEndField = this.#findLastGroupEndField(columnOrder);\n    for (const group of this.groups) {\n      const groupFields = new Set(group.columns.map((c) => c.field));\n      // Walk the column order in reverse to find the last member of this group\n      for (let i = columnOrder.length - 1; i >= 0; i--) {\n        if (groupFields.has(columnOrder[i])) {\n          const field = columnOrder[i];\n          // Don't mark the last group's trailing field — nothing follows it\n          if (field !== lastGroupEndField) {\n            this.#groupEndFields.add(field);\n          }\n          break;\n        }\n      }\n    }\n  }\n\n  /**\n   * Find the trailing field of the last group in column order (to exclude from group-end marking).\n   */\n  #findLastGroupEndField(columnOrder: string[]): string | null {\n    if (this.groups.length === 0) return null;\n    // Determine which group contains the last field in column order\n    for (let i = columnOrder.length - 1; i >= 0; i--) {\n      const field = columnOrder[i];\n      for (const group of this.groups) {\n        if (group.columns.some((c) => c.field === field)) {\n          // This group is the last in display order — find its last field\n          const groupFields = new Set(group.columns.map((c) => c.field));\n          for (let j = columnOrder.length - 1; j >= 0; j--) {\n            if (groupFields.has(columnOrder[j])) return columnOrder[j];\n          }\n        }\n      }\n    }\n    return null;\n  }\n\n  /**\n   * Check if all columns in a group are contiguous in the proposed column order.\n   */\n  #isGroupContiguous(group: ColumnGroup, columnOrder: string[]): boolean {\n    const indices = group.columns\n      .map((c) => columnOrder.indexOf(c.field))\n      .filter((i) => i !== -1)\n      .sort((a, b) => a - b);\n    if (indices.length <= 1) return true;\n    return indices.length === indices[indices.length - 1] - indices[0] + 1;\n  }\n\n  /**\n   * Flash the header cell with an error color to indicate a blocked move.\n   */\n  #flashHeaderCell(field: string): void {\n    const headerCell = this.gridElement?.querySelector(\n      `.header-row [part~=\"header-cell\"][data-field=\"${field}\"]`,\n    ) as HTMLElement;\n    if (!headerCell) return;\n\n    headerCell.style.setProperty('--_flash-color', 'var(--tbw-color-error)');\n    headerCell.animate(\n      [{ backgroundColor: 'rgba(from var(--_flash-color) r g b / 30%)' }, { backgroundColor: 'transparent' }],\n      { duration: 400, easing: 'ease-out' },\n    );\n  }\n  // #endregion\n\n  /** @internal */\n  override handleQuery(query: PluginQuery): unknown {\n    if (query.type === 'getColumnGrouping') {\n      return this.#getStableColumnGrouping();\n    }\n    return undefined;\n  }\n\n  /**\n   * Get stable column grouping info that includes ALL columns (visible and hidden).\n   * Used by the visibility panel to maintain group structure regardless of visibility state.\n   * Fields within each group are sorted by current display order.\n   */\n  #getStableColumnGrouping(): ColumnGroupInfo[] {\n    let result: ColumnGroupInfo[];\n\n    // 1. Prefer resolved declarative columnGroups (from plugin config or gridConfig)\n    if (this.#resolvedGroupDefs.length > 0) {\n      result = this.#resolvedGroupDefs\n        .filter((g) => g.children.length > 0)\n        .map((g) => ({\n          id: g.id,\n          label: g.header,\n          fields: [...g.children],\n        }));\n    } else if (this.isActive && this.groups.length > 0) {\n      // 2. If active groups exist from processColumns, use them\n      result = this.groups\n        .filter((g) => !g.id.startsWith('__implicit__'))\n        .map<ColumnGroupInfo>((g) => ({\n          id: g.id,\n          label: g.label ?? g.id,\n          fields: g.columns.map((c) => c.field),\n        }));\n\n      // Also check hidden columns for inline group properties not in active groups\n      const allCols = this.columns as ColumnConfig[];\n      for (const col of allCols) {\n        if ((col as any).hidden && col.group) {\n          const gId = typeof col.group === 'string' ? col.group : col.group.id;\n          const gLabel = typeof col.group === 'string' ? col.group : (col.group.label ?? col.group.id);\n          const existing = result.find((g) => g.id === gId);\n          if (existing) {\n            if (!existing.fields.includes(col.field)) existing.fields.push(col.field);\n          } else {\n            result.push({ id: gId, label: gLabel, fields: [col.field] });\n          }\n        }\n      }\n    } else {\n      // 3. Fall back: scan ALL columns (including hidden) for inline group properties\n      const allCols = this.columns as ColumnConfig[];\n      const groupMap = new Map<string, ColumnGroupInfo>();\n      for (const col of allCols) {\n        if (!col.group) continue;\n        const gId = typeof col.group === 'string' ? col.group : col.group.id;\n        const gLabel = typeof col.group === 'string' ? col.group : (col.group.label ?? col.group.id);\n        const existing = groupMap.get(gId);\n        if (existing) {\n          if (!existing.fields.includes(col.field)) existing.fields.push(col.field);\n        } else {\n          groupMap.set(gId, { id: gId, label: gLabel, fields: [col.field] });\n        }\n      }\n      result = Array.from(groupMap.values());\n    }\n\n    // Sort fields within each group by current display order so consumers\n    // (e.g. the visibility panel) render columns in their reordered positions.\n    const displayOrder = this.grid?.getColumnOrder();\n    if (displayOrder && displayOrder.length > 0) {\n      const orderIndex = new Map(displayOrder.map((f, i) => [f, i]));\n      for (const group of result) {\n        group.fields.sort((a, b) => (orderIndex.get(a) ?? Infinity) - (orderIndex.get(b) ?? Infinity));\n      }\n    }\n\n    return result;\n  }\n  // #endregion\n\n  // #region Static Detection\n\n  /**\n   * Auto-detect column groups from column configuration.\n   * Detects both inline `column.group` properties and declarative `columnGroups` config.\n   */\n  static detect(rows: readonly any[], config: any): boolean {\n    // Check for declarative columnGroups in plugin feature config\n    const featureConfig = config?.features?.groupingColumns;\n    if (\n      featureConfig &&\n      typeof featureConfig === 'object' &&\n      Array.isArray(featureConfig.columnGroups) &&\n      featureConfig.columnGroups.length > 0\n    ) {\n      return true;\n    }\n    // Check for declarative columnGroups in gridConfig\n    if (config?.columnGroups && Array.isArray(config.columnGroups) && config.columnGroups.length > 0) {\n      return true;\n    }\n    // Check for inline group properties on columns\n    const columns = config?.columns;\n    if (!Array.isArray(columns)) return false;\n    return hasColumnGroups(columns);\n  }\n  // #endregion\n\n  // #region Hooks\n\n  /** @internal */\n  override processColumns(columns: readonly ColumnConfig[]): ColumnConfig[] {\n    // Resolve columnGroups source — plugin config takes precedence over gridConfig\n    const pluginColumnGroups = this.config?.columnGroups;\n    const gridColumnGroups = this.grid?.gridConfig?.columnGroups;\n    let columnGroupDefs: ColumnGroupDefinition[] | undefined;\n\n    if (pluginColumnGroups && Array.isArray(pluginColumnGroups) && pluginColumnGroups.length > 0) {\n      // Warn if both sources are defined\n      if (gridColumnGroups && Array.isArray(gridColumnGroups) && gridColumnGroups.length > 0) {\n        this.warn(\n          COLUMN_GROUPS_CONFLICT,\n          'columnGroups defined in both gridConfig and groupingColumns feature config. ' +\n            'Using feature config (higher precedence).',\n        );\n      }\n      columnGroupDefs = pluginColumnGroups;\n    } else if (gridColumnGroups && Array.isArray(gridColumnGroups) && gridColumnGroups.length > 0) {\n      columnGroupDefs = gridColumnGroups;\n    }\n\n    let processedColumns: ColumnConfig[];\n\n    if (columnGroupDefs && columnGroupDefs.length > 0) {\n      // Resolve ids (auto-generate from header when missing) and validate\n      const resolved = resolveColumnGroupDefs(columnGroupDefs);\n      this.#resolvedGroupDefs = resolved;\n\n      // Collect per-group renderers\n      this.#groupRenderers.clear();\n      for (const def of resolved) {\n        if (def.renderer) {\n          this.#groupRenderers.set(def.id, def.renderer);\n        }\n      }\n\n      // Build a map of field → group info from the declarative config\n      const fieldToGroup = new Map<string, { id: string; label: string }>();\n      for (const group of resolved) {\n        for (const field of group.children) {\n          fieldToGroup.set(field, { id: group.id, label: group.header });\n        }\n      }\n\n      // Apply group property to columns that don't already have one\n      processedColumns = columns.map((col) => {\n        const groupInfo = fieldToGroup.get(col.field);\n        if (groupInfo && !col.group) {\n          return { ...col, group: groupInfo };\n        }\n        return col;\n      });\n    } else {\n      this.#resolvedGroupDefs = [];\n      this.#groupRenderers.clear();\n      processedColumns = [...columns];\n    }\n\n    // Compute groups from column definitions (now including applied groups)\n    const groups = computeColumnGroups(processedColumns);\n\n    if (groups.length === 0) {\n      this.isActive = false;\n      this.groups = [];\n      return processedColumns;\n    }\n\n    // Attach per-group renderers to computed groups\n    if (this.#groupRenderers.size > 0) {\n      for (const g of groups) {\n        const r = this.#groupRenderers.get(g.id);\n        if (r) g.renderer = r;\n      }\n    }\n\n    this.isActive = true;\n    this.groups = groups;\n\n    // Pre-compute group-end fields for the afterCellRender hook\n    this.#groupEndFields.clear();\n    for (const g of groups) {\n      const lastCol = g.columns[g.columns.length - 1];\n      if (lastCol?.field) {\n        this.#groupEndFields.add(lastCol.field);\n      }\n    }\n\n    // Return columns with group info applied\n    return processedColumns;\n  }\n\n  /** @internal */\n  override afterRender(): void {\n    if (!this.isActive) {\n      // Remove any existing group header\n      const header = this.gridElement?.querySelector('.header');\n      const existingGroupRow = header?.querySelector('.header-group-row');\n      if (existingGroupRow) existingGroupRow.remove();\n      return;\n    }\n\n    const header = this.gridElement?.querySelector('.header');\n    if (!header) return;\n\n    // Remove existing group row if present\n    const existingGroupRow = header.querySelector('.header-group-row');\n    if (existingGroupRow) existingGroupRow.remove();\n\n    // Recompute groups from visible columns only (hidden columns have no CSS grid track).\n    // This also picks up any plugin-added columns (e.g. expander) that weren't present\n    // during processColumns.\n    const finalColumns = this.visibleColumns as ColumnConfig[];\n    const groups = computeColumnGroups(finalColumns);\n    if (groups.length === 0) return;\n\n    // Attach per-group renderers from resolved definitions\n    if (this.#groupRenderers.size > 0) {\n      for (const g of groups) {\n        const r = this.#groupRenderers.get(g.id);\n        if (r) g.renderer = r;\n      }\n    }\n\n    // Keep #groupEndFields in sync for afterCellRender (covers scheduler-driven renders)\n    this.#groupEndFields.clear();\n    const embedded = findEmbeddedImplicitGroups(groups, finalColumns);\n    for (let gi = 0; gi < groups.length; gi++) {\n      const g = groups[gi];\n      // Skip embedded implicit groups (e.g. checkbox column within a pinned group)\n      if (String(g.id).startsWith('__implicit__') && embedded.has(String(g.id))) continue;\n      const lastCol = g.columns[g.columns.length - 1];\n      // Don't mark the last group — no adjacent group follows it\n      if (lastCol?.field && gi < groups.length - 1) {\n        this.#groupEndFields.add(lastCol.field);\n      }\n    }\n\n    // Build and insert group header row\n    const groupRow = buildGroupHeaderRow(groups, finalColumns, this.config.groupHeaderRenderer);\n    if (groupRow) {\n      // Toggle border visibility class\n      groupRow.classList.toggle('no-borders', !this.config.showGroupBorders);\n\n      const headerRow = header.querySelector('.header-row');\n      if (headerRow) {\n        header.insertBefore(groupRow, headerRow);\n      } else {\n        header.appendChild(groupRow);\n      }\n    }\n\n    // Apply classes to header cells\n    const headerRow = header.querySelector('.header-row') as HTMLElement;\n    if (headerRow) {\n      // Toggle border visibility on header cells\n      headerRow.classList.toggle('no-group-borders', !this.config.showGroupBorders);\n      applyGroupedHeaderCellClasses(headerRow, groups, finalColumns);\n    }\n  }\n\n  /**\n   * Apply group-end class to individual cells during render and scroll.\n   * This is more efficient than querySelectorAll in afterRender and ensures\n   * cells recycled during scroll also get the class applied.\n   * @internal\n   */\n  override afterCellRender(context: AfterCellRenderContext): void {\n    if (!this.isActive || !this.config.showGroupBorders) return;\n    context.cellElement.classList.toggle('group-end', this.#groupEndFields.has(context.column.field));\n  }\n  // #endregion\n\n  // #region Public API\n\n  /**\n   * Check if column groups are active.\n   * @returns Whether grouping is active\n   */\n  isGroupingActive(): boolean {\n    return this.isActive;\n  }\n\n  /**\n   * Get the computed column groups.\n   * @returns Array of column groups\n   */\n  getGroups(): ColumnGroup[] {\n    return this.groups;\n  }\n\n  /**\n   * Get columns in a specific group.\n   * @param groupId - The group ID to find\n   * @returns Array of columns in the group\n   */\n  getGroupColumns(groupId: string): ColumnConfig[] {\n    const group = this.groups.find((g) => g.id === groupId);\n    return group ? group.columns : [];\n  }\n\n  /**\n   * Refresh column groups (recompute from current columns).\n   */\n  refresh(): void {\n    this.requestRender();\n  }\n  // #endregion\n}\n"],"names":["slugifyHeader","header","toLowerCase","trim","replace","resolveColumnGroupDefs","defs","map","def","id","throwDiagnostic","COLUMN_GROUP_NO_ID","computeColumnGroups","columns","length","explicitMap","Map","groupsOrdered","pushImplicit","startIdx","cols","prev","implicit","firstIndex","push","label","run","runStart","forEach","col","idx","g","group","slice","get","set","computeGroupGridRange","first","last","start","findIndex","c","field","end","findEmbeddedImplicitGroups","groups","embedded","Set","explicitRanges","String","startsWith","range","iStart","iEnd","some","eStart","eEnd","add","GroupingColumnsPlugin","BaseGridPlugin","static","ownedProperties","property","level","description","isUsed","v","Array","isArray","queries","type","name","styles","defaultConfig","showGroupBorders","lockGroupOrder","isActive","groupEndFields","resolvedGroupDefs","groupRenderers","attach","grid","super","this","gridElement","addEventListener","onColumnMove","signal","disconnectSignal","detach","clear","e","event","columnOrder","detail","config","isGroupContiguous","preventDefault","flashHeaderCell","recomputeGroupEndFields","lastGroupEndField","findLastGroupEndField","groupFields","i","has","j","indices","indexOf","filter","sort","a","b","headerCell","querySelector","style","setProperty","animate","backgroundColor","duration","easing","handleQuery","query","getStableColumnGrouping","result","children","fields","allCols","hidden","gId","gLabel","existing","find","includes","groupMap","from","values","displayOrder","getColumnOrder","orderIndex","f","Infinity","detect","rows","featureConfig","features","groupingColumns","columnGroups","hasColumnGroups","processColumns","pluginColumnGroups","gridColumnGroups","gridConfig","columnGroupDefs","processedColumns","warn","COLUMN_GROUPS_CONFLICT","resolved","renderer","fieldToGroup","groupInfo","size","r","lastCol","afterRender","existingGroupRow","remove","finalColumns","visibleColumns","gi","groupRow","document","createElement","className","setAttribute","gid","isImplicit","startIndex","endIndex","span","cell","classList","gridColumn","activeRenderer","HTMLElement","appendChild","innerHTML","textContent","buildGroupHeaderRow","groupHeaderRenderer","toggle","headerRow","insertBefore","headerRowEl","headerCells","querySelectorAll","getAttribute","applyGroupedHeaderCellClasses","afterCellRender","context","cellElement","column","isGroupingActive","getGroups","getGroupColumns","groupId","refresh","requestRender"],"mappings":"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"}

package/umd/plugins/responsive.umd.js

@@ -1,2 +1,2 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("../../core/internal/diagnostics"),require("../../core/internal/keyboard"),require("../../core/internal/sanitize"),require("../../core/plugin/base-plugin")):"function"==typeof define&&define.amd?define(["exports","../../core/internal/diagnostics","../../core/internal/keyboard","../../core/internal/sanitize","../../core/plugin/base-plugin"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).TbwGridPlugin_responsive={},e.TbwGrid,e.TbwGrid,e.TbwGrid,e.TbwGrid)}(this,function(e,t,i,r,s){"use strict";class o extends s.BaseGridPlugin{name="responsive";version="1.0.0";styles='tbw-grid[data-responsive-animate] .data-grid-row,tbw-grid[data-responsive-animate] .data-grid-row>.cell{transition:opacity var(--tbw-responsive-duration, .2s) ease-out,transform var(--tbw-responsive-duration, .2s) ease-out}tbw-grid[data-responsive][data-responsive-animate] .data-grid-row{animation:responsive-card-enter var(--tbw-responsive-duration, .2s) ease-out}@keyframes responsive-card-enter{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}tbw-grid[data-responsive] .header{display:none!important}tbw-grid[data-responsive] .footer-row{display:none}tbw-grid[data-responsive] .tbw-scroll-area{overflow-x:hidden;min-width:0!important}tbw-grid[data-responsive] .rows-body-wrapper{min-width:0!important}tbw-grid[data-responsive] .data-grid-row:not(.group-row){display:block!important;grid-template-columns:none!important;padding:var(--tbw-cell-padding);padding-inline-start:var(--tbw-spacing-xl);border-bottom:1px solid var(--tbw-color-border);min-height:auto!important;height:auto!important;contain:none!important;content-visibility:visible!important;background:var(--tbw-color-bg);position:relative}tbw-grid[data-responsive] .data-grid-row:not(.group-row):nth-child(2n){background:var(--tbw-color-row-alt)}tbw-grid[data-responsive] .data-grid-row:not(.group-row):hover{background:var(--tbw-color-row-hover)}tbw-grid[data-responsive] .data-grid-row:not(.group-row)[aria-selected=true]{background:var(--tbw-color-selection)}tbw-grid[data-responsive] .data-grid-row:not(.group-row)[aria-selected=true]:before{content:"";position:absolute;inset-inline-start:0;top:0;bottom:0;width:4px;background:var(--tbw-color-accent)}tbw-grid[data-responsive] .data-grid-row:not(.group-row)>.cell{display:flex!important;justify-content:space-between;align-items:center;padding:var(--tbw-spacing-xs) var(--tbw-spacing-md);width:100%!important;min-width:0!important;min-height:auto!important;height:auto!important;line-height:1.5!important;position:static!important;left:auto!important;right:auto!important;border:none!important;border-bottom:none!important;border-inline-end:none!important;background:transparent!important;white-space:normal!important;overflow:visible!important}tbw-grid[data-responsive] .data-grid-row:not(.group-row)>.cell:before{content:attr(data-header) ": ";font-weight:600;color:var(--tbw-color-header-fg);flex-shrink:0;margin-inline-end:var(--tbw-spacing-md);min-width:100px}tbw-grid[data-responsive] .data-grid-row:not(.group-row)>.cell:after{content:none}tbw-grid[data-responsive] .cell[data-utility]{display:none!important}tbw-grid[data-responsive] .data-grid-row>.cell[data-responsive-hidden]{display:none!important}tbw-grid[data-responsive] .data-grid-row>.cell[data-responsive-value-only]{justify-content:flex-start!important;font-weight:500}tbw-grid[data-responsive] .data-grid-row>.cell[data-responsive-value-only]:before{display:none!important}tbw-grid:not([data-responsive]) .cell[data-responsive-hidden]{display:none!important}tbw-grid[data-responsive] .tbw-footer,tbw-grid[data-responsive] .tbw-pinned-rows,tbw-grid[data-responsive] .tbw-aggregation-rows{display:none!important}tbw-grid[data-responsive] .tbw-pinned-rows,tbw-grid[data-responsive] .tbw-aggregation-rows,tbw-grid[data-responsive] .tbw-aggregation-row{min-width:0!important}tbw-grid[data-responsive] .data-grid-row.responsive-card{display:block!important;padding:var(--tbw-cell-padding);border-bottom:1px solid var(--tbw-color-border)}tbw-grid[data-responsive] .data-grid-row.responsive-card>*{width:100%}tbw-grid[data-responsive] .data-grid-row.responsive-card .cell:before{display:none}';static manifest={incompatibleWith:[{name:"groupingRows",reason:"Responsive card layout does not yet support row grouping. The variable row heights (cards vs group headers) cause scroll calculation issues."}],queries:[{type:"isCardMode",description:"Returns whether the grid is currently in responsive card mode"}]};#e;#t=!1;#i;#r=!1;#s=0;#o=new Set;#n=new Set;#a=null;#d=[];get#h(){return this.grid}isResponsive(){return this.#t}setResponsive(e){e!==this.#t&&(this.#t=e,this.#l(),this.emit("responsive-change",{isResponsive:e,width:this.#s,breakpoint:this.config.breakpoint??0}),this.requestRender())}setBreakpoint(e){this.config.breakpoint=e,this.#u(this.#s)}setCardRenderer(e){this.config.cardRenderer=e,this.#t&&this.requestRender()}getWidth(){return this.#s}getActiveBreakpoint(){return this.#a}attach(e){super.attach(e),this.#p(),this.#g(this.config.hiddenColumns),this.config.breakpoints?.length&&(this.#d=[...this.config.breakpoints].sort((e,t)=>t.maxWidth-e.maxWidth)),this.#e=new ResizeObserver(e=>{const t=e[0]?.contentRect.width??0;this.#s=t,clearTimeout(this.#i),this.#i=setTimeout(()=>{this.#u(t)},this.config.debounceMs??100)}),this.#e.observe(this.gridElement)}#p(){const e=this.gridElement;if(!e)return;const t=e.querySelector("tbw-grid-responsive-card");if(!t)return;const i=this.#h.__frameworkAdapter;if(i?.parseResponsiveCardElement){const e=i.parseResponsiveCardElement(t);e&&(this.config={...this.config,cardRenderer:e})}const s=t.getAttribute("breakpoint"),o=t.getAttribute("card-row-height"),n=t.getAttribute("hidden-columns"),a=t.getAttribute("hide-header"),d=t.getAttribute("debounce-ms"),h={};if(null!==s){const e=parseInt(s,10);isNaN(e)||(h.breakpoint=e)}if(null!==o&&(h.cardRowHeight="auto"===o?"auto":parseInt(o,10)),null!==n&&(h.hiddenColumns=n.split(",").map(e=>e.trim()).filter(e=>e.length>0)),null!==a&&(h.hideHeader="false"!==a),null!==d){const e=parseInt(d,10);isNaN(e)||(h.debounceMs=e)}const l=t.innerHTML.trim();!l||this.config.cardRenderer||i?.parseResponsiveCardElement||(h.cardRenderer=e=>{const t=r.evalTemplateString(l,{value:e,row:e}),i=r.sanitizeHTML(t),s=document.createElement("div");return s.className="tbw-responsive-card-content",s.innerHTML=i,s}),Object.keys(h).length>0&&(this.config={...this.config,...h})}#g(e){if(this.#o.clear(),this.#n.clear(),e)for(const t of e)"string"==typeof t?this.#o.add(t):t.showValue?this.#n.add(t.field):this.#o.add(t.field)}detach(){this.#e?.disconnect(),this.#e=void 0,clearTimeout(this.#i),this.#i=void 0,this.gridElement&&this.gridElement.removeAttribute("data-responsive"),super.detach()}handleQuery(e){if("isCardMode"===e.type)return this.#t}afterRender(){this.#c();if(!(this.#d.length>0?null!==this.#a:this.#t))return;const e=this.#o.size>0,t=this.#n.size>0;if(!e&&!t)return;const i=this.gridElement.querySelectorAll(".cell[data-field]");for(const r of i){const e=r.getAttribute("data-field");e&&(this.#o.has(e)?(r.setAttribute("data-responsive-hidden",""),r.removeAttribute("data-responsive-value-only")):this.#n.has(e)?(r.setAttribute("data-responsive-value-only",""),r.removeAttribute("data-responsive-hidden")):(r.removeAttribute("data-responsive-hidden"),r.removeAttribute("data-responsive-value-only")))}}#u(e){if(this.#d.length>0)return void this.#w(e);const i=this.config.breakpoint??0;0!==i||this.#r||(this.#r=!0,this.warn(t.MISSING_BREAKPOINT,"No breakpoint configured. Responsive mode is disabled. Set a breakpoint based on your grid's column count."));const r=i>0&&e<i;r!==this.#t&&(this.#t=r,this.#l(),this.emit("responsive-change",{isResponsive:r,width:e,breakpoint:i}),this.requestRender())}#w(e){let t=null;for(const i of this.#d)e<=i.maxWidth&&(t=i);if(t!==this.#a){this.#a=t,t?.hiddenColumns?this.#g(t.hiddenColumns):this.#g(this.config.hiddenColumns);const i=!0===t?.cardLayout;i!==this.#t&&(this.#t=i,this.#l()),this.emit("responsive-change",{isResponsive:this.#t,width:e,breakpoint:t?.maxWidth??0}),this.requestRender()}}#v;#l(){this.gridElement.toggleAttribute("data-responsive",this.#t);const e=!1!==this.config.animate;this.gridElement.toggleAttribute("data-responsive-animate",e),this.config.animationDuration&&this.gridElement.style.setProperty("--tbw-responsive-duration",`${this.config.animationDuration}ms`);const t=this.#h;if(this.#t){t._virtualization&&(this.#v=t._virtualization.rowHeight);const e=this.gridElement.querySelector(".tbw-scroll-area");e&&(e.scrollLeft=0)}else{const e=this.gridElement.querySelectorAll(".data-grid-row");for(const t of e)t.style.height="",t.classList.remove("responsive-card");this.#v&&this.#v>0&&t._virtualization&&(t._virtualization.rowHeight=this.#v,this.#v=void 0),this.#m=void 0,this.#b=void 0,this.#f=void 0}}renderRow(e,t,i){if(!this.#t||!this.config.cardRenderer)return;if(e.__isGroupRow)return;t.replaceChildren();const r=this.config.cardRenderer(e,i);t.className="data-grid-row responsive-card";const s=this.config.cardRowHeight;return t.style.height="auto"===s||void 0===s?"auto":`${this.#R()}px`,t.appendChild(r),!0}onKeyDown(e){if(!this.#t)return!1;if(this.config.cardRenderer){if(["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"].includes(e.key))return!1}const t=this.rows.length-1,r=this.visibleColumns.length-1;switch(e.key){case"ArrowDown":if(this.grid._focusCol<r)return this.grid._focusCol+=1,e.preventDefault(),i.ensureCellVisible(this.#h),!0;if(this.grid._focusRow<t)return this.grid._focusRow+=1,this.grid._focusCol=0,e.preventDefault(),i.ensureCellVisible(this.#h),!0;break;case"ArrowUp":if(this.grid._focusCol>0)return this.grid._focusCol-=1,e.preventDefault(),i.ensureCellVisible(this.#h),!0;if(this.grid._focusRow>0)return this.grid._focusRow-=1,this.grid._focusCol=r,e.preventDefault(),i.ensureCellVisible(this.#h),!0;break;case"ArrowRight":if(this.grid._focusRow<t)return this.grid._focusRow+=1,e.preventDefault(),i.ensureCellVisible(this.#h),!0;break;case"ArrowLeft":if(this.grid._focusRow>0)return this.grid._focusRow-=1,e.preventDefault(),i.ensureCellVisible(this.#h),!0}return!1}#m;#b;#f;#R(){if(this.#m&&this.#m>0)return this.#m;const e=this.config.cardRowHeight;return"number"==typeof e&&e>0?e:80}#C(){return this.#b&&this.#b>0?this.#b:this.#v??28}#y(){for(const e of this.rows)if(e.__isGroupRow)return!0;return!1}#k(){let e=0,t=0;for(const i of this.rows)i.__isGroupRow?e++:t++;return{groupCount:e,cardCount:t}}getExtraHeight(){if(!this.#t||!this.config.cardRenderer)return 0;if(!this.#y())return 0;const e=this.#v??28,t=this.#C(),i=this.#R(),{groupCount:r,cardCount:s}=this.#k();return r*Math.max(0,t-e)+s*Math.max(0,i-e)}getExtraHeightBefore(e){if(!this.#t||!this.config.cardRenderer)return 0;if(!this.#y())return 0;const t=this.#v??28,i=this.#C(),r=this.#R(),s=Math.max(0,i-t),o=Math.max(0,r-t);let n=0,a=0;const d=this.rows,h=Math.min(e,d.length);for(let l=0;l<h;l++)d[l].__isGroupRow?n++:a++;return n*s+a*o}getRowHeight(e,t){if(this.#t&&this.config.cardRenderer)return e.__isGroupRow?this.#C():this.#R()}#H(){let e=0;for(const t of this.rows)t.__isGroupRow||e++;return e}#G=!1;#c(){if(!this.#t||!this.config.cardRenderer)return;let e=!1;const t=this.#h,i=this.#y(),r=this.#H();if(r!==this.#f&&(this.#f=r,e=!0),i){const t=this.gridElement.querySelector(".data-grid-row.group-row");if(t){const i=t.getBoundingClientRect().height;i>0&&i!==this.#b&&(this.#b=i,e=!0)}}const s=this.gridElement.querySelector(".data-grid-row.responsive-card");if(s){const r=s.getBoundingClientRect().height;r>0&&r!==this.#m&&(this.#m=r,e=!0,!i&&t._virtualization&&(t._virtualization.rowHeight=r))}e&&!this.#G&&(this.#G=!0,queueMicrotask(()=>{this.#G=!1,this.grid&&this.#t&&this.#h.refreshVirtualWindow?.(!0,!0)}))}}e.ResponsivePlugin=o,Object.defineProperty(e,Symbol.toStringTag,{value:"Module"})});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("../../core/internal/diagnostics"),require("../../core/internal/keyboard"),require("../../core/internal/sanitize"),require("../../core/plugin/base-plugin")):"function"==typeof define&&define.amd?define(["exports","../../core/internal/diagnostics","../../core/internal/keyboard","../../core/internal/sanitize","../../core/plugin/base-plugin"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).TbwGridPlugin_responsive={},e.TbwGrid,e.TbwGrid,e.TbwGrid,e.TbwGrid)}(this,function(e,t,i,r,s){"use strict";class o extends s.BaseGridPlugin{name="responsive";version="1.0.0";styles='tbw-grid[data-responsive-animate] .data-grid-row,tbw-grid[data-responsive-animate] .data-grid-row>.cell{transition:opacity var(--tbw-responsive-duration, .2s) ease-out,transform var(--tbw-responsive-duration, .2s) ease-out}tbw-grid[data-responsive][data-responsive-animate] .data-grid-row{animation:responsive-card-enter var(--tbw-responsive-duration, .2s) ease-out}@keyframes responsive-card-enter{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}tbw-grid[data-responsive] .header{display:none!important}tbw-grid[data-responsive] .footer-row{display:none}tbw-grid[data-responsive] .tbw-scroll-area{overflow-x:hidden;min-width:0!important}tbw-grid[data-responsive] .rows-body-wrapper{min-width:0!important}tbw-grid[data-responsive] .data-grid-row:not(.group-row){display:block!important;grid-template-columns:none!important;padding:var(--tbw-cell-padding);padding-inline-start:var(--tbw-spacing-xl);border-bottom:1px solid var(--tbw-color-border);min-height:auto!important;height:auto!important;contain:none!important;content-visibility:visible!important;background:var(--tbw-color-bg);position:relative}tbw-grid[data-responsive] .data-grid-row:not(.group-row):nth-child(2n){background:var(--tbw-color-row-alt)}tbw-grid[data-responsive] .data-grid-row:not(.group-row):hover{background:var(--tbw-color-row-hover)}tbw-grid[data-responsive] .data-grid-row:not(.group-row)[aria-selected=true]{background:var(--tbw-color-selection)}tbw-grid[data-responsive] .data-grid-row:not(.group-row)[aria-selected=true]:before{content:"";position:absolute;inset-inline-start:0;top:0;bottom:0;width:4px;background:var(--tbw-color-accent)}tbw-grid[data-responsive] .data-grid-row:not(.group-row)>.cell{display:flex!important;justify-content:space-between;align-items:center;padding:var(--tbw-spacing-xs) var(--tbw-spacing-md);width:100%!important;min-width:0!important;min-height:auto!important;height:auto!important;line-height:1.5!important;position:static!important;left:auto!important;right:auto!important;border:none!important;border-bottom:none!important;border-inline-end:none!important;background:transparent!important;white-space:normal!important;overflow:visible!important}tbw-grid[data-responsive] .data-grid-row:not(.group-row)>.cell:before{content:attr(data-header) ": ";font-weight:600;color:var(--tbw-color-header-fg);flex-shrink:0;margin-inline-end:var(--tbw-spacing-md);min-width:100px}tbw-grid[data-responsive] .data-grid-row:not(.group-row)>.cell:after{content:none}tbw-grid[data-responsive] .cell[data-utility]{display:none!important}tbw-grid[data-responsive] .data-grid-row>.cell[data-responsive-hidden]{display:none!important}tbw-grid[data-responsive] .data-grid-row>.cell[data-responsive-value-only]{justify-content:flex-start!important;font-weight:500}tbw-grid[data-responsive] .data-grid-row>.cell[data-responsive-value-only]:before{display:none!important}tbw-grid:not([data-responsive]) .cell[data-responsive-hidden]{display:none!important}tbw-grid[data-responsive] .tbw-footer,tbw-grid[data-responsive] .tbw-pinned-rows,tbw-grid[data-responsive] .tbw-aggregation-rows{display:none!important}tbw-grid[data-responsive] .tbw-pinned-rows,tbw-grid[data-responsive] .tbw-aggregation-rows,tbw-grid[data-responsive] .tbw-aggregation-row{min-width:0!important}tbw-grid[data-responsive] .data-grid-row.responsive-card{display:block!important;padding:var(--tbw-cell-padding);border-bottom:1px solid var(--tbw-color-border)}tbw-grid[data-responsive] .data-grid-row.responsive-card>*{width:100%}tbw-grid[data-responsive] .data-grid-row.responsive-card .cell:before{display:none}';static manifest={incompatibleWith:[{name:"groupingRows",reason:"Responsive card layout does not yet support row grouping. The variable row heights (cards vs group headers) cause scroll calculation issues."}],queries:[{type:"isCardMode",description:"Returns whether the grid is currently in responsive card mode"}]};#e;#t=!1;#i;#r=!1;#s=0;#o=new Set;#n=new Set;#a=null;#d=[];get#h(){return this.grid}isResponsive(){return this.#t}setResponsive(e){e!==this.#t&&(this.#t=e,this.#l(),this.emit("responsive-change",{isResponsive:e,width:this.#s,breakpoint:this.config.breakpoint??0}),this.requestRender())}setBreakpoint(e){this.config.breakpoint=e,this.#u(this.#s)}setCardRenderer(e){this.config.cardRenderer=e,this.#t&&this.requestRender()}getWidth(){return this.#s}getActiveBreakpoint(){return this.#a}attach(e){super.attach(e),this.#p(),this.#g(this.config.hiddenColumns),this.config.breakpoints?.length&&(this.#d=[...this.config.breakpoints].sort((e,t)=>t.maxWidth-e.maxWidth)),this.#e=new ResizeObserver(e=>{const t=e[0]?.contentRect.width??0;this.#s=t,clearTimeout(this.#i),this.#i=setTimeout(()=>{this.#u(t)},this.config.debounceMs??100)}),this.#e.observe(this.gridElement)}#p(){const e=this.gridElement;if(!e)return;const t=e.querySelector("tbw-grid-responsive-card");if(!t)return;const i=this.#h.__frameworkAdapter;if(i?.parseResponsiveCardElement){const e=i.parseResponsiveCardElement(t);e&&(this.config={...this.config,cardRenderer:e})}const s=t.getAttribute("breakpoint"),o=t.getAttribute("card-row-height"),n=t.getAttribute("hidden-columns"),a=t.getAttribute("hide-header"),d=t.getAttribute("debounce-ms"),h={};if(null!==s){const e=parseInt(s,10);isNaN(e)||(h.breakpoint=e)}if(null!==o&&(h.cardRowHeight="auto"===o?"auto":parseInt(o,10)),null!==n&&(h.hiddenColumns=n.split(",").map(e=>e.trim()).filter(e=>e.length>0)),null!==a&&(h.hideHeader="false"!==a),null!==d){const e=parseInt(d,10);isNaN(e)||(h.debounceMs=e)}const l=t.innerHTML.trim();!l||this.config.cardRenderer||i?.parseResponsiveCardElement||(h.cardRenderer=e=>{const t=r.evalTemplateString(l,{value:e,row:e}),i=r.sanitizeHTML(t),s=document.createElement("div");return s.className="tbw-responsive-card-content",s.innerHTML=i,s}),Object.keys(h).length>0&&(this.config={...this.config,...h})}#g(e){if(this.#o.clear(),this.#n.clear(),e)for(const t of e)"string"==typeof t?this.#o.add(t):t.showValue?this.#n.add(t.field):this.#o.add(t.field)}detach(){this.#e?.disconnect(),this.#e=void 0,clearTimeout(this.#i),this.#i=void 0,this.gridElement&&this.gridElement.removeAttribute("data-responsive"),super.detach()}handleQuery(e){if("isCardMode"===e.type)return this.#t}afterRender(){this.#c();if(!(this.#d.length>0?null!==this.#a:this.#t))return;const e=this.#o.size>0,t=this.#n.size>0;if(!e&&!t)return;const i=this.gridElement.querySelectorAll(".cell[data-field]");for(const r of i){const e=r.getAttribute("data-field");e&&(this.#o.has(e)?(r.setAttribute("data-responsive-hidden",""),r.removeAttribute("data-responsive-value-only")):this.#n.has(e)?(r.setAttribute("data-responsive-value-only",""),r.removeAttribute("data-responsive-hidden")):(r.removeAttribute("data-responsive-hidden"),r.removeAttribute("data-responsive-value-only")))}}#u(e){if(this.#d.length>0)return void this.#w(e);const i=this.config.breakpoint??0;0!==i||this.#r||(this.#r=!0,this.warn(t.MISSING_BREAKPOINT,"No breakpoint configured. Responsive mode is disabled. Set a breakpoint based on your grid's column count."));const r=i>0&&e<i;r!==this.#t&&(this.#t=r,this.#l(),this.emit("responsive-change",{isResponsive:r,width:e,breakpoint:i}),this.requestRender())}#w(e){let t=null;for(const i of this.#d)e<=i.maxWidth&&(t=i);if(t!==this.#a){this.#a=t,t?.hiddenColumns?this.#g(t.hiddenColumns):this.#g(this.config.hiddenColumns);const i=!0===t?.cardLayout;i!==this.#t&&(this.#t=i,this.#l()),this.emit("responsive-change",{isResponsive:this.#t,width:e,breakpoint:t?.maxWidth??0}),this.requestRender()}}#v;#l(){this.gridElement.toggleAttribute("data-responsive",this.#t);const e=!1!==this.config.animate;this.gridElement.toggleAttribute("data-responsive-animate",e),this.config.animationDuration&&this.gridElement.style.setProperty("--tbw-responsive-duration",`${this.config.animationDuration}ms`);const t=this.#h;if(this.#t){t._virtualization&&(this.#v=t._virtualization.rowHeight);const e=this.gridElement.querySelector(".tbw-scroll-area");e&&(e.scrollLeft=0)}else{const e=this.gridElement.querySelectorAll(".data-grid-row");for(const t of e)t.style.height="",t.classList.remove("responsive-card");this.#v&&this.#v>0&&t._virtualization&&(t._virtualization.rowHeight=this.#v,this.#v=void 0),this.#m=void 0,this.#b=void 0,this.#f=void 0}}renderRow(e,t,i){if(!this.#t||!this.config.cardRenderer)return;if(e.__isGroupRow)return;t.replaceChildren();const r=this.config.cardRenderer(e,i);t.className="data-grid-row responsive-card";const s=this.config.cardRowHeight;return t.style.height="auto"===s||void 0===s?"auto":`${this.#R()}px`,t.appendChild(r),!0}onKeyDown(e){if(!this.#t)return!1;if(this.config.cardRenderer){if(["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"].includes(e.key))return!1}const t=this.rows.length-1,r=this.visibleColumns.length-1;switch(e.key){case"ArrowDown":if(this.grid._focusCol<r)return this.grid._focusCol+=1,e.preventDefault(),i.ensureCellVisible(this.#h),!0;if(this.grid._focusRow<t)return this.grid._focusRow+=1,this.grid._focusCol=0,e.preventDefault(),i.ensureCellVisible(this.#h),!0;break;case"ArrowUp":if(this.grid._focusCol>0)return this.grid._focusCol-=1,e.preventDefault(),i.ensureCellVisible(this.#h),!0;if(this.grid._focusRow>0)return this.grid._focusRow-=1,this.grid._focusCol=r,e.preventDefault(),i.ensureCellVisible(this.#h),!0;break;case"ArrowRight":if(this.grid._focusRow<t)return this.grid._focusRow+=1,e.preventDefault(),i.ensureCellVisible(this.#h),!0;break;case"ArrowLeft":if(this.grid._focusRow>0)return this.grid._focusRow-=1,e.preventDefault(),i.ensureCellVisible(this.#h),!0}return!1}#m;#b;#f;#R(){if(this.#m&&this.#m>0)return this.#m;const e=this.config.cardRowHeight;return"number"==typeof e&&e>0?e:80}#C(){return this.#b&&this.#b>0?this.#b:this.#v??28}#y(){for(const e of this.rows)if(e.__isGroupRow)return!0;return!1}#k(){let e=0,t=0;for(const i of this.rows)i.__isGroupRow?e++:t++;return{groupCount:e,cardCount:t}}getExtraHeight(){if(!this.#t||!this.config.cardRenderer)return 0;if(!this.#y())return 0;const e=this.#v??28,t=this.#C(),i=this.#R(),{groupCount:r,cardCount:s}=this.#k();return r*Math.max(0,t-e)+s*Math.max(0,i-e)}getExtraHeightBefore(e){if(!this.#t||!this.config.cardRenderer)return 0;if(!this.#y())return 0;const t=this.#v??28,i=this.#C(),r=this.#R(),s=Math.max(0,i-t),o=Math.max(0,r-t);let n=0,a=0;const d=this.rows,h=Math.min(e,d.length);for(let l=0;l<h;l++)d[l].__isGroupRow?n++:a++;return n*s+a*o}getRowHeight(e,t){if(this.#t&&this.config.cardRenderer)return e.__isGroupRow?this.#C():this.#R()}#H(){let e=0;for(const t of this.rows)t.__isGroupRow||e++;return e}#G=!1;#c(){if(!this.#t)return;let e=!1;const t=this.#h,i=this.#y(),r=this.#H();if(r!==this.#f&&(this.#f=r,e=!0),i){const t=this.gridElement.querySelector(".data-grid-row.group-row");if(t){const i=t.getBoundingClientRect().height;i>0&&i!==this.#b&&(this.#b=i,e=!0)}}const s=this.config.cardRenderer?".data-grid-row.responsive-card":".data-grid-row:not(.group-row)",o=this.gridElement.querySelector(s);if(o){const r=o.getBoundingClientRect().height;r>0&&r!==this.#m&&(this.#m=r,e=!0,!i&&t._virtualization&&(t._virtualization.rowHeight=r))}e&&!this.#G&&(this.#G=!0,queueMicrotask(()=>{this.#G=!1,this.grid&&this.#t&&this.#h.refreshVirtualWindow?.(!0,!0)}))}}e.ResponsivePlugin=o,Object.defineProperty(e,Symbol.toStringTag,{value:"Module"})});
 //# sourceMappingURL=responsive.umd.js.map

package/umd/plugins/responsive.umd.js.map

@@ -1 +1 @@
-{"version":3,"file":"responsive.umd.js","sources":["../../../../../libs/grid/src/lib/plugins/responsive/ResponsivePlugin.ts"],"sourcesContent":["/**\n * Responsive Plugin\n *\n * Transforms the grid from tabular layout to a card/list layout when the grid\n * width falls below a configurable breakpoint. This enables grids to work in\n * narrow containers (split-pane UIs, mobile viewports, dashboard widgets).\n *\n * ## Installation\n *\n * ```ts\n * import { ResponsivePlugin } from '@toolbox-web/grid/plugins/responsive';\n *\n * const config: GridConfig = {\n *   plugins: [new ResponsivePlugin({ breakpoint: 500 })],\n * };\n * ```\n *\n * ## How It Works\n *\n * 1. ResizeObserver monitors the grid element's width\n * 2. When `width < breakpoint`, adds `data-responsive` attribute to grid\n * 3. CSS transforms cells from horizontal to vertical layout\n * 4. Each cell displays \"Header: Value\" using CSS `::before` pseudo-element\n *\n * @see [Responsive Demo](?path=/story/grid-plugins-responsive--default)\n */\n\nimport { MISSING_BREAKPOINT } from '../../core/internal/diagnostics';\nimport { ensureCellVisible } from '../../core/internal/keyboard';\nimport { evalTemplateString, sanitizeHTML } from '../../core/internal/sanitize';\nimport { BaseGridPlugin, type GridElement, type PluginManifest, type PluginQuery } from '../../core/plugin/base-plugin';\nimport type { GridHost } from '../../core/types';\nimport styles from './responsive.css?inline';\nimport type { BreakpointConfig, HiddenColumnConfig, ResponsiveChangeDetail, ResponsivePluginConfig } from './types';\n\n/**\n * Responsive Plugin for tbw-grid\n *\n * Adds automatic card layout mode when the grid width falls below a configurable\n * breakpoint. Perfect for responsive designs, split-pane UIs, and mobile viewports.\n *\n * @template T The row data type\n *\n * @example\n * ```ts\n * // Basic usage - switch to card layout below 500px\n * const config: GridConfig = {\n *   plugins: [new ResponsivePlugin({ breakpoint: 500 })],\n * };\n * ```\n *\n * @example\n * ```ts\n * // Hide less important columns in card mode\n * const config: GridConfig = {\n *   plugins: [\n *     new ResponsivePlugin({\n *       breakpoint: 600,\n *       hiddenColumns: ['createdAt', 'updatedAt'],\n *     }),\n *   ],\n * };\n * ```\n *\n * @example\n * ```ts\n * // Custom card renderer for advanced layouts\n * const config: GridConfig = {\n *   plugins: [\n *     new ResponsivePlugin({\n *       breakpoint: 400,\n *       cardRenderer: (row) => {\n *         const card = document.createElement('div');\n *         card.className = 'custom-card';\n *         card.innerHTML = `<strong>${row.name}</strong><br>${row.email}`;\n *         return card;\n *       },\n *     }),\n *   ],\n * };\n * ```\n */\nexport class ResponsivePlugin<T = unknown> extends BaseGridPlugin<ResponsivePluginConfig<T>> {\n  readonly name = 'responsive';\n  override readonly version = '1.0.0';\n  override readonly styles = styles;\n\n  /**\n   * Plugin manifest declaring incompatibilities with other plugins.\n   */\n  static override readonly manifest: PluginManifest = {\n    incompatibleWith: [\n      {\n        name: 'groupingRows',\n        reason:\n          'Responsive card layout does not yet support row grouping. ' +\n          'The variable row heights (cards vs group headers) cause scroll calculation issues.',\n      },\n    ],\n    queries: [\n      {\n        type: 'isCardMode',\n        description: 'Returns whether the grid is currently in responsive card mode',\n      },\n    ],\n  };\n\n  #resizeObserver?: ResizeObserver;\n  #isResponsive = false;\n  #debounceTimer?: ReturnType<typeof setTimeout>;\n  #warnedAboutMissingBreakpoint = false;\n  #currentWidth = 0;\n  /** Set of column fields to completely hide */\n  #hiddenColumnSet: Set<string> = new Set();\n  /** Set of column fields to show value only (no header label) */\n  #valueOnlyColumnSet: Set<string> = new Set();\n  /** Currently active breakpoint, or null if none */\n  #activeBreakpoint: BreakpointConfig | null = null;\n  /** Sorted breakpoints from largest to smallest */\n  #sortedBreakpoints: BreakpointConfig[] = [];\n\n  /** Typed internal grid accessor — centralizes the single required cast. */\n  get #internalGrid(): GridHost {\n    return this.grid as unknown as GridHost;\n  }\n\n  /**\n   * Check if currently in responsive mode.\n   * @returns `true` if the grid is in card layout mode\n   */\n  isResponsive(): boolean {\n    return this.#isResponsive;\n  }\n\n  /**\n   * Force responsive mode regardless of width.\n   * Useful for testing or manual control.\n   * @param enabled - Whether to enable responsive mode\n   */\n  setResponsive(enabled: boolean): void {\n    if (enabled !== this.#isResponsive) {\n      this.#isResponsive = enabled;\n      this.#applyResponsiveState();\n      this.emit('responsive-change', {\n        isResponsive: enabled,\n        width: this.#currentWidth,\n        breakpoint: this.config.breakpoint ?? 0,\n      } satisfies ResponsiveChangeDetail);\n      this.requestRender();\n    }\n  }\n\n  /**\n   * Update breakpoint dynamically.\n   * @param width - New breakpoint width in pixels\n   */\n  setBreakpoint(width: number): void {\n    this.config.breakpoint = width;\n    this.#checkBreakpoint(this.#currentWidth);\n  }\n\n  /**\n   * Set a custom card renderer.\n   * This allows framework adapters to provide template-based renderers at runtime.\n   * @param renderer - The card renderer function, or undefined to use default\n   */\n  setCardRenderer(renderer: ResponsivePluginConfig<T>['cardRenderer']): void {\n    this.config.cardRenderer = renderer;\n    // If already in responsive mode, trigger a re-render to apply the new renderer\n    if (this.#isResponsive) {\n      this.requestRender();\n    }\n  }\n\n  /**\n   * Get current grid width.\n   * @returns Width of the grid element in pixels\n   */\n  getWidth(): number {\n    return this.#currentWidth;\n  }\n\n  /**\n   * Get the currently active breakpoint config (multi-breakpoint mode only).\n   * @returns The active BreakpointConfig, or null if no breakpoint is active\n   */\n  getActiveBreakpoint(): BreakpointConfig | null {\n    return this.#activeBreakpoint;\n  }\n\n  override attach(grid: GridElement): void {\n    super.attach(grid);\n\n    // Parse light DOM configuration first (may update this.config)\n    this.#parseLightDomCard();\n\n    // Build hidden column sets from config\n    this.#buildHiddenColumnSets(this.config.hiddenColumns);\n\n    // Sort breakpoints from largest to smallest for evaluation\n    if (this.config.breakpoints?.length) {\n      this.#sortedBreakpoints = [...this.config.breakpoints].sort((a, b) => b.maxWidth - a.maxWidth);\n    }\n\n    // Observe the grid element itself (not internal viewport)\n    // This captures the container width including when shell panels open/close\n    this.#resizeObserver = new ResizeObserver((entries) => {\n      const width = entries[0]?.contentRect.width ?? 0;\n      this.#currentWidth = width;\n\n      // Debounce to avoid thrashing during resize drag\n      clearTimeout(this.#debounceTimer);\n      this.#debounceTimer = setTimeout(() => {\n        this.#checkBreakpoint(width);\n      }, this.config.debounceMs ?? 100);\n    });\n\n    this.#resizeObserver.observe(this.gridElement);\n  }\n\n  // #region Light DOM Parsing\n\n  /**\n   * Parse `<tbw-grid-responsive-card>` elements from the grid's light DOM.\n   *\n   * Allows declarative configuration:\n   * ```html\n   * <tbw-grid [rows]=\"data\">\n   *   <tbw-grid-responsive-card breakpoint=\"500\" card-row-height=\"80\">\n   *     <div class=\"custom-card\">\n   *       <strong>{{ row.name }}</strong>\n   *       <span>{{ row.email }}</span>\n   *     </div>\n   *   </tbw-grid-responsive-card>\n   * </tbw-grid>\n   * ```\n   *\n   * Attributes:\n   * - `breakpoint`: number - Width threshold for responsive mode\n   * - `card-row-height`: number | 'auto' - Card height (default: 'auto')\n   * - `hidden-columns`: string - Comma-separated fields to hide\n   * - `hide-header`: 'true' | 'false' - Hide header row (default: 'true')\n   * - `debounce-ms`: number - Resize debounce delay (default: 100)\n   */\n  #parseLightDomCard(): void {\n    const gridEl = this.gridElement;\n    if (!gridEl) return;\n\n    const cardEl = gridEl.querySelector('tbw-grid-responsive-card');\n    if (!cardEl) return;\n\n    // Check if a framework adapter wants to handle this element\n    // (e.g., React adapter intercepts for JSX rendering)\n    const adapter = this.#internalGrid.__frameworkAdapter;\n    if (adapter?.parseResponsiveCardElement) {\n      const adapterRenderer = adapter.parseResponsiveCardElement(cardEl);\n      if (adapterRenderer) {\n        this.config = { ...this.config, cardRenderer: adapterRenderer };\n        // Continue to parse attributes even if adapter provides renderer\n      }\n    }\n\n    // Parse attributes for configuration\n    const breakpointAttr = cardEl.getAttribute('breakpoint');\n    const cardRowHeightAttr = cardEl.getAttribute('card-row-height');\n    const hiddenColumnsAttr = cardEl.getAttribute('hidden-columns');\n    const hideHeaderAttr = cardEl.getAttribute('hide-header');\n    const debounceMsAttr = cardEl.getAttribute('debounce-ms');\n\n    const configUpdates: Partial<ResponsivePluginConfig<T>> = {};\n\n    if (breakpointAttr !== null) {\n      const breakpoint = parseInt(breakpointAttr, 10);\n      if (!isNaN(breakpoint)) {\n        configUpdates.breakpoint = breakpoint;\n      }\n    }\n\n    if (cardRowHeightAttr !== null) {\n      configUpdates.cardRowHeight = cardRowHeightAttr === 'auto' ? 'auto' : parseInt(cardRowHeightAttr, 10);\n    }\n\n    if (hiddenColumnsAttr !== null) {\n      // Parse comma-separated field names\n      configUpdates.hiddenColumns = hiddenColumnsAttr\n        .split(',')\n        .map((s) => s.trim())\n        .filter((s) => s.length > 0);\n    }\n\n    if (hideHeaderAttr !== null) {\n      configUpdates.hideHeader = hideHeaderAttr !== 'false';\n    }\n\n    if (debounceMsAttr !== null) {\n      const debounceMs = parseInt(debounceMsAttr, 10);\n      if (!isNaN(debounceMs)) {\n        configUpdates.debounceMs = debounceMs;\n      }\n    }\n\n    // Get template content from innerHTML (only if no renderer already set)\n    const templateHTML = cardEl.innerHTML.trim();\n    if (templateHTML && !this.config.cardRenderer && !adapter?.parseResponsiveCardElement) {\n      // Create a template-based renderer using the inner HTML\n      configUpdates.cardRenderer = (row: T): HTMLElement => {\n        // Evaluate template expressions like {{ row.field }}\n        const evaluated = evalTemplateString(templateHTML, { value: row, row: row as Record<string, unknown> });\n        // Sanitize the result to prevent XSS\n        const sanitized = sanitizeHTML(evaluated);\n        const container = document.createElement('div');\n        container.className = 'tbw-responsive-card-content';\n        container.innerHTML = sanitized;\n        return container;\n      };\n    }\n\n    // Merge updates into config (light DOM values override constructor config)\n    if (Object.keys(configUpdates).length > 0) {\n      this.config = { ...this.config, ...configUpdates };\n    }\n  }\n\n  // #endregion\n\n  /**\n   * Build the hidden and value-only column sets from config.\n   */\n  #buildHiddenColumnSets(hiddenColumns?: HiddenColumnConfig[]): void {\n    this.#hiddenColumnSet.clear();\n    this.#valueOnlyColumnSet.clear();\n\n    if (!hiddenColumns) return;\n\n    for (const col of hiddenColumns) {\n      if (typeof col === 'string') {\n        this.#hiddenColumnSet.add(col);\n      } else if (col.showValue) {\n        this.#valueOnlyColumnSet.add(col.field);\n      } else {\n        this.#hiddenColumnSet.add(col.field);\n      }\n    }\n  }\n\n  override detach(): void {\n    this.#resizeObserver?.disconnect();\n    this.#resizeObserver = undefined;\n    clearTimeout(this.#debounceTimer);\n    this.#debounceTimer = undefined;\n\n    // Clean up attribute\n    if (this.gridElement) {\n      this.gridElement.removeAttribute('data-responsive');\n    }\n\n    super.detach();\n  }\n\n  /**\n   * Handle plugin queries.\n   * @internal\n   */\n  override handleQuery(query: PluginQuery): unknown {\n    if (query.type === 'isCardMode') {\n      return this.#isResponsive;\n    }\n    return undefined;\n  }\n\n  /**\n   * Apply hidden and value-only columns.\n   * In legacy mode (single breakpoint), only applies when in responsive mode.\n   * In multi-breakpoint mode, applies whenever there's an active breakpoint.\n   */\n  override afterRender(): void {\n    // Measure card height for virtualization calculations\n    this.#measureCardHeightFromDOM();\n\n    // In single breakpoint mode, only apply when responsive\n    // In multi-breakpoint mode, apply when there's an active breakpoint\n    const shouldApply = this.#sortedBreakpoints.length > 0 ? this.#activeBreakpoint !== null : this.#isResponsive;\n\n    if (!shouldApply) {\n      return;\n    }\n\n    const hasHiddenColumns = this.#hiddenColumnSet.size > 0;\n    const hasValueOnlyColumns = this.#valueOnlyColumnSet.size > 0;\n\n    if (!hasHiddenColumns && !hasValueOnlyColumns) {\n      return;\n    }\n\n    // Mark cells for hidden columns and value-only columns\n    const cells = this.gridElement.querySelectorAll('.cell[data-field]');\n    for (const cell of cells) {\n      const field = cell.getAttribute('data-field');\n      if (!field) continue;\n\n      // Apply hidden attribute\n      if (this.#hiddenColumnSet.has(field)) {\n        cell.setAttribute('data-responsive-hidden', '');\n        cell.removeAttribute('data-responsive-value-only');\n      }\n      // Apply value-only attribute (shows value without header label)\n      else if (this.#valueOnlyColumnSet.has(field)) {\n        cell.setAttribute('data-responsive-value-only', '');\n        cell.removeAttribute('data-responsive-hidden');\n      }\n      // Clear any previous responsive attributes\n      else {\n        cell.removeAttribute('data-responsive-hidden');\n        cell.removeAttribute('data-responsive-value-only');\n      }\n    }\n  }\n\n  /**\n   * Check if width has crossed any breakpoint threshold.\n   * Handles both single breakpoint (legacy) and multi-breakpoint modes.\n   */\n  #checkBreakpoint(width: number): void {\n    // Multi-breakpoint mode\n    if (this.#sortedBreakpoints.length > 0) {\n      this.#checkMultiBreakpoint(width);\n      return;\n    }\n\n    // Legacy single breakpoint mode\n    const breakpoint = this.config.breakpoint ?? 0;\n\n    // Warn once if breakpoint not configured (0 means never responsive)\n    if (breakpoint === 0 && !this.#warnedAboutMissingBreakpoint) {\n      this.#warnedAboutMissingBreakpoint = true;\n      this.warn(\n        MISSING_BREAKPOINT,\n        \"No breakpoint configured. Responsive mode is disabled. Set a breakpoint based on your grid's column count.\",\n      );\n    }\n\n    const shouldBeResponsive = breakpoint > 0 && width < breakpoint;\n\n    if (shouldBeResponsive !== this.#isResponsive) {\n      this.#isResponsive = shouldBeResponsive;\n      this.#applyResponsiveState();\n      this.emit('responsive-change', {\n        isResponsive: shouldBeResponsive,\n        width,\n        breakpoint,\n      } satisfies ResponsiveChangeDetail);\n      this.requestRender();\n    }\n  }\n\n  /**\n   * Check breakpoints in multi-breakpoint mode.\n   * Evaluates breakpoints from largest to smallest, applying the first match.\n   */\n  #checkMultiBreakpoint(width: number): void {\n    // Find the active breakpoint (first one where width <= maxWidth)\n    // Since sorted largest to smallest, we find the largest matching breakpoint\n    let newActiveBreakpoint: BreakpointConfig | null = null;\n\n    for (const bp of this.#sortedBreakpoints) {\n      if (width <= bp.maxWidth) {\n        newActiveBreakpoint = bp;\n        // Continue to find the most specific (smallest) matching breakpoint\n      }\n    }\n\n    // Check if breakpoint changed\n    const breakpointChanged = newActiveBreakpoint !== this.#activeBreakpoint;\n\n    if (breakpointChanged) {\n      this.#activeBreakpoint = newActiveBreakpoint;\n\n      // Update hidden column sets from active breakpoint\n      if (newActiveBreakpoint?.hiddenColumns) {\n        this.#buildHiddenColumnSets(newActiveBreakpoint.hiddenColumns);\n      } else {\n        // Fall back to top-level hiddenColumns config\n        this.#buildHiddenColumnSets(this.config.hiddenColumns);\n      }\n\n      // Determine if we should be in card layout\n      const shouldBeResponsive = newActiveBreakpoint?.cardLayout === true;\n\n      if (shouldBeResponsive !== this.#isResponsive) {\n        this.#isResponsive = shouldBeResponsive;\n        this.#applyResponsiveState();\n      }\n\n      // Emit event for any breakpoint change\n      this.emit('responsive-change', {\n        isResponsive: this.#isResponsive,\n        width,\n        breakpoint: newActiveBreakpoint?.maxWidth ?? 0,\n      } satisfies ResponsiveChangeDetail);\n\n      this.requestRender();\n    }\n  }\n\n  /** Original row height before entering responsive mode, for restoration on exit */\n  #originalRowHeight?: number;\n\n  /**\n   * Apply the responsive state to the grid element.\n   * Handles scroll reset when entering responsive mode and row height restoration on exit.\n   */\n  #applyResponsiveState(): void {\n    this.gridElement.toggleAttribute('data-responsive', this.#isResponsive);\n\n    // Apply animation attribute if enabled (default: true)\n    const animate = this.config.animate !== false;\n    this.gridElement.toggleAttribute('data-responsive-animate', animate);\n\n    // Set custom animation duration if provided\n    if (this.config.animationDuration) {\n      this.gridElement.style.setProperty('--tbw-responsive-duration', `${this.config.animationDuration}ms`);\n    }\n\n    // Cast to internal type for virtualization access\n    const internalGrid = this.#internalGrid;\n\n    if (this.#isResponsive) {\n      // Store original row height before responsive mode changes it\n      if (internalGrid._virtualization) {\n        this.#originalRowHeight = internalGrid._virtualization.rowHeight;\n      }\n\n      // Reset horizontal scroll position when entering responsive mode\n      // The CSS hides overflow but doesn't reset the scroll position\n      const scrollArea = this.gridElement.querySelector('.tbw-scroll-area') as HTMLElement | null;\n      if (scrollArea) {\n        scrollArea.scrollLeft = 0;\n      }\n    } else {\n      // Exiting responsive mode - clean up inline styles set by renderRow\n      // The rows are reused from the pool, so we need to remove the card-specific styles\n      const rows = this.gridElement.querySelectorAll('.data-grid-row');\n      for (const row of rows) {\n        (row as HTMLElement).style.height = '';\n        row.classList.remove('responsive-card');\n      }\n\n      // Restore original row height\n      if (this.#originalRowHeight && this.#originalRowHeight > 0 && internalGrid._virtualization) {\n        internalGrid._virtualization.rowHeight = this.#originalRowHeight;\n        this.#originalRowHeight = undefined;\n      }\n\n      // Clear cached measurements so they're remeasured fresh when re-entering responsive mode\n      // Without this, stale measurements cause incorrect height calculations after scrolling\n      this.#measuredCardHeight = undefined;\n      this.#measuredGroupRowHeight = undefined;\n      this.#lastCardRowCount = undefined;\n    }\n  }\n\n  /**\n   * Custom row rendering when cardRenderer is provided and in responsive mode.\n   *\n   * When a cardRenderer is configured, this hook takes over row rendering to display\n   * the custom card layout instead of the default cell structure.\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 rendered (prevents default), `void` for default rendering\n   */\n  override renderRow(row: unknown, rowEl: HTMLElement, rowIndex: number): boolean | void {\n    // Only override when in responsive mode AND cardRenderer is provided\n    if (!this.#isResponsive || !this.config.cardRenderer) {\n      return; // Let default rendering proceed\n    }\n\n    // Skip group rows from GroupingRowsPlugin - they have special structure\n    // and should use their own renderer\n    if ((row as { __isGroupRow?: boolean }).__isGroupRow) {\n      return; // Let GroupingRowsPlugin handle group row rendering\n    }\n\n    // Clear existing content\n    rowEl.replaceChildren();\n\n    // Call user's cardRenderer to get custom content\n    const cardContent = this.config.cardRenderer(row as T, rowIndex);\n\n    // Reset className - clears any stale classes from previous use (e.g., 'group-row' from recycled element)\n    // This follows the same pattern as GroupingRowsPlugin which sets className explicitly\n    rowEl.className = 'data-grid-row responsive-card';\n\n    // Handle card row height — when a numeric height is configured, use the effective\n    // height from #getCardHeight() which incorporates DOM measurement after first render.\n    // This keeps inline height in sync with the position cache used for virtualization.\n    const configuredHeight = this.config.cardRowHeight;\n    if (configuredHeight === 'auto' || configuredHeight === undefined) {\n      rowEl.style.height = 'auto';\n    } else {\n      rowEl.style.height = `${this.#getCardHeight()}px`;\n    }\n\n    // Append the custom card content\n    rowEl.appendChild(cardContent);\n\n    return true; // We handled rendering\n  }\n\n  /**\n   * Handle keyboard navigation in responsive mode.\n   *\n   * In responsive mode, the visual layout is inverted:\n   * - Cells are stacked vertically within each \"card\" (row)\n   * - DOWN/UP visually moves within the card (between fields)\n   * - Page Down/Page Up or Ctrl+Down/Up moves between cards\n   *\n   * For custom cardRenderers, keyboard navigation is disabled entirely\n   * since the implementor controls the card content and should handle\n   * navigation via their own event handlers.\n   *\n   * @returns `true` if the event was handled and default behavior should be prevented\n   */\n  override onKeyDown(e: KeyboardEvent): boolean {\n    if (!this.#isResponsive) {\n      return false;\n    }\n\n    // If custom cardRenderer is provided, disable grid's keyboard navigation\n    // The implementor is responsible for their own navigation\n    if (this.config.cardRenderer) {\n      const navKeys = ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'];\n      if (navKeys.includes(e.key)) {\n        // Let the event bubble - implementor can handle it\n        return false;\n      }\n    }\n\n    // Swap arrow key behavior for CSS-only responsive mode\n    // In card layout, cells are stacked vertically:\n    //   Card 1:       Card 2:\n    //     ID: 1         ID: 2\n    //     Name: Alice   Name: Bob  <- ArrowRight goes here\n    //     Dept: Eng     Dept: Mkt\n    //       ↓ ArrowDown goes here\n    //\n    // ArrowDown/Up = move within card (change column/field)\n    // ArrowRight/Left = move between cards (change row)\n    const maxRow = this.rows.length - 1;\n    const maxCol = this.visibleColumns.length - 1;\n\n    switch (e.key) {\n      case 'ArrowDown':\n        // Move down WITHIN card (to next field/column)\n        if (this.grid._focusCol < maxCol) {\n          this.grid._focusCol += 1;\n          e.preventDefault();\n          ensureCellVisible(this.#internalGrid);\n          return true;\n        }\n        // At bottom of card - optionally move to next card's first field\n        if (this.grid._focusRow < maxRow) {\n          this.grid._focusRow += 1;\n          this.grid._focusCol = 0;\n          e.preventDefault();\n          ensureCellVisible(this.#internalGrid);\n          return true;\n        }\n        break;\n\n      case 'ArrowUp':\n        // Move up WITHIN card (to previous field/column)\n        if (this.grid._focusCol > 0) {\n          this.grid._focusCol -= 1;\n          e.preventDefault();\n          ensureCellVisible(this.#internalGrid);\n          return true;\n        }\n        // At top of card - optionally move to previous card's last field\n        if (this.grid._focusRow > 0) {\n          this.grid._focusRow -= 1;\n          this.grid._focusCol = maxCol;\n          e.preventDefault();\n          ensureCellVisible(this.#internalGrid);\n          return true;\n        }\n        break;\n\n      case 'ArrowRight':\n        // Move to NEXT card (same field)\n        if (this.grid._focusRow < maxRow) {\n          this.grid._focusRow += 1;\n          e.preventDefault();\n          ensureCellVisible(this.#internalGrid);\n          return true;\n        }\n        break;\n\n      case 'ArrowLeft':\n        // Move to PREVIOUS card (same field)\n        if (this.grid._focusRow > 0) {\n          this.grid._focusRow -= 1;\n          e.preventDefault();\n          ensureCellVisible(this.#internalGrid);\n          return true;\n        }\n        break;\n    }\n\n    return false;\n  }\n\n  // ============================================\n  // Variable Height Support for Mixed Row Types\n  // ============================================\n\n  /** Measured card height from DOM for virtualization calculations */\n  #measuredCardHeight?: number;\n\n  /** Measured group row height from DOM for virtualization calculations */\n  #measuredGroupRowHeight?: number;\n\n  /** Last known card row count for detecting changes (e.g., group expand/collapse) */\n  #lastCardRowCount?: number;\n\n  /**\n   * Get the effective card height for virtualization calculations.\n   * Prioritizes DOM-measured height (actual rendered size) over config,\n   * since content can overflow the configured height.\n   */\n  #getCardHeight(): number {\n    // Prefer measured height - it reflects actual rendered size including overflow\n    if (this.#measuredCardHeight && this.#measuredCardHeight > 0) {\n      return this.#measuredCardHeight;\n    }\n    // Fall back to explicit config\n    const configHeight = this.config.cardRowHeight;\n    if (typeof configHeight === 'number' && configHeight > 0) {\n      return configHeight;\n    }\n    // Default fallback\n    return 80;\n  }\n\n  /**\n   * Get the effective group row height for virtualization calculations.\n   * Uses DOM-measured height, falling back to original row height.\n   */\n  #getGroupRowHeight(): number {\n    if (this.#measuredGroupRowHeight && this.#measuredGroupRowHeight > 0) {\n      return this.#measuredGroupRowHeight;\n    }\n    // Fall back to original row height (before responsive mode)\n    return this.#originalRowHeight ?? 28;\n  }\n\n  /**\n   * Check if there are any group rows in the current dataset.\n   * Used to determine if we have mixed row heights.\n   */\n  #hasGroupRows(): boolean {\n    for (const row of this.rows) {\n      if ((row as { __isGroupRow?: boolean }).__isGroupRow) {\n        return true;\n      }\n    }\n    return false;\n  }\n\n  /**\n   * Count group rows and card rows in the current dataset.\n   */\n  #countRowTypes(): { groupCount: number; cardCount: number } {\n    let groupCount = 0;\n    let cardCount = 0;\n    for (const row of this.rows) {\n      if ((row as { __isGroupRow?: boolean }).__isGroupRow) {\n        groupCount++;\n      } else {\n        cardCount++;\n      }\n    }\n    return { groupCount, cardCount };\n  }\n\n  /**\n   * Return total extra height contributed by mixed row heights.\n   * This is called by the grid's virtualization system to adjust scrollbar height.\n   *\n   * The grid calculates: totalRows * baseRowHeight + pluginExtraHeight\n   *\n   * For mixed layouts (groups + cards), we need to report the difference between\n   * actual heights and what the base calculation assumes:\n   * - Extra for groups: groupCount * (groupHeight - baseHeight)\n   * - Extra for cards: cardCount * (cardHeight - baseHeight)\n   *\n   * @deprecated Use getRowHeight() instead. This hook will be removed in v2.0.\n   */\n  override getExtraHeight(): number {\n    // Only applies when in responsive mode with cardRenderer\n    if (!this.#isResponsive || !this.config.cardRenderer) {\n      return 0;\n    }\n\n    // Only report extra height when there are mixed row types (groups + cards)\n    // If all rows are cards, we update the virtualization row height instead\n    if (!this.#hasGroupRows()) {\n      return 0;\n    }\n\n    const baseHeight = this.#originalRowHeight ?? 28;\n    const groupHeight = this.#getGroupRowHeight();\n    const cardHeight = this.#getCardHeight();\n\n    const { groupCount, cardCount } = this.#countRowTypes();\n\n    // Calculate extra height for both row types\n    const groupExtra = groupCount * Math.max(0, groupHeight - baseHeight);\n    const cardExtra = cardCount * Math.max(0, cardHeight - baseHeight);\n\n    return groupExtra + cardExtra;\n  }\n\n  /**\n   * Return extra height that appears before a given row index.\n   * Used by virtualization to correctly calculate scroll positions.\n   *\n   * Like getExtraHeight, this accounts for both group and card row heights.\n   *\n   * @deprecated Use getRowHeight() instead. This hook will be removed in v2.0.\n   */\n  override getExtraHeightBefore(beforeRowIndex: number): number {\n    // Only applies when in responsive mode with cardRenderer\n    if (!this.#isResponsive || !this.config.cardRenderer) {\n      return 0;\n    }\n\n    // Only report extra height when there are mixed row types\n    if (!this.#hasGroupRows()) {\n      return 0;\n    }\n\n    const baseHeight = this.#originalRowHeight ?? 28;\n    const groupHeight = this.#getGroupRowHeight();\n    const cardHeight = this.#getCardHeight();\n\n    const groupHeightDiff = Math.max(0, groupHeight - baseHeight);\n    const cardHeightDiff = Math.max(0, cardHeight - baseHeight);\n\n    // Count group rows and card rows before the given index\n    let groupsBefore = 0;\n    let cardsBefore = 0;\n    const rows = this.rows;\n    const maxIndex = Math.min(beforeRowIndex, rows.length);\n\n    for (let i = 0; i < maxIndex; i++) {\n      if ((rows[i] as { __isGroupRow?: boolean }).__isGroupRow) {\n        groupsBefore++;\n      } else {\n        cardsBefore++;\n      }\n    }\n\n    return groupsBefore * groupHeightDiff + cardsBefore * cardHeightDiff;\n  }\n\n  /**\n   * Get the height of a specific row based on its type (group row vs card row).\n   * Returns undefined if not in responsive mode.\n   *\n   * @param row - The row data\n   * @param _index - The row index (unused, but part of the interface)\n   * @returns The row height in pixels, or undefined if not in responsive mode\n   */\n  override getRowHeight(row: unknown, _index: number): number | undefined {\n    // Only applies when in responsive mode with cardRenderer\n    if (!this.#isResponsive || !this.config.cardRenderer) {\n      return undefined;\n    }\n\n    // Check if this is a group row\n    if ((row as { __isGroupRow?: boolean }).__isGroupRow) {\n      return this.#getGroupRowHeight();\n    }\n\n    // Regular card row\n    return this.#getCardHeight();\n  }\n\n  /**\n   * Count the number of card rows (non-group rows) in the current dataset.\n   */\n  #countCardRows(): number {\n    let count = 0;\n    for (const row of this.rows) {\n      if (!(row as { __isGroupRow?: boolean }).__isGroupRow) {\n        count++;\n      }\n    }\n    return count;\n  }\n\n  /** Pending refresh scheduled via microtask */\n  #pendingRefresh = false;\n\n  /**\n   * Measure card height from DOM after render and detect row count changes.\n   * Called in afterRender to ensure scroll calculations are accurate.\n   *\n   * This handles two scenarios:\n   * 1. Card height changes (content overflow, dynamic sizing)\n   * 2. Card row count changes (group expand/collapse)\n   * 3. Group row height changes\n   *\n   * For uniform card layouts (no groups), we update the virtualization row height\n   * directly to the card height. For mixed layouts (groups + cards), we use the\n   * getExtraHeight mechanism to report height differences.\n   *\n   * The refresh is deferred via microtask to avoid nested render cycles.\n   */\n  #measureCardHeightFromDOM(): void {\n    if (!this.#isResponsive || !this.config.cardRenderer) {\n      return;\n    }\n\n    let needsRefresh = false;\n    const internalGrid = this.#internalGrid;\n    const hasGroups = this.#hasGroupRows();\n\n    // Check if card row count changed (e.g., group expanded/collapsed)\n    const currentCardRowCount = this.#countCardRows();\n    if (currentCardRowCount !== this.#lastCardRowCount) {\n      this.#lastCardRowCount = currentCardRowCount;\n      needsRefresh = true;\n    }\n\n    // Measure actual group row height from DOM (for mixed layouts)\n    if (hasGroups) {\n      const groupRow = this.gridElement.querySelector('.data-grid-row.group-row') as HTMLElement | null;\n      if (groupRow) {\n        const height = groupRow.getBoundingClientRect().height;\n        if (height > 0 && height !== this.#measuredGroupRowHeight) {\n          this.#measuredGroupRowHeight = height;\n          needsRefresh = true;\n        }\n      }\n    }\n\n    // Measure actual card height from DOM\n    const cardRow = this.gridElement.querySelector('.data-grid-row.responsive-card') as HTMLElement | null;\n    if (cardRow) {\n      const height = cardRow.getBoundingClientRect().height;\n      if (height > 0 && height !== this.#measuredCardHeight) {\n        this.#measuredCardHeight = height;\n        needsRefresh = true;\n\n        // For uniform card layouts (no groups), update virtualization row height directly\n        // This ensures proper row recycling and translateY calculations\n        if (!hasGroups && internalGrid._virtualization) {\n          internalGrid._virtualization.rowHeight = height;\n        }\n      }\n    }\n\n    // Defer virtualization refresh to avoid nested render cycles\n    // This is called from afterRender, so we can't call refreshVirtualWindow synchronously\n    // Use scheduler's VIRTUALIZATION phase to batch properly and avoid duplicate afterRender calls\n    if (needsRefresh && !this.#pendingRefresh) {\n      this.#pendingRefresh = true;\n      queueMicrotask(() => {\n        this.#pendingRefresh = false;\n        // Only refresh if still attached and in responsive mode\n        if (this.grid && this.#isResponsive) {\n          // Request virtualization phase through grid's public API\n          // This goes through the scheduler which batches and handles afterRender properly\n          this.#internalGrid.refreshVirtualWindow?.(true, true);\n        }\n      });\n    }\n  }\n}\n"],"names":["ResponsivePlugin","BaseGridPlugin","name","version","styles","static","incompatibleWith","reason","queries","type","description","resizeObserver","isResponsive","debounceTimer","warnedAboutMissingBreakpoint","currentWidth","hiddenColumnSet","Set","valueOnlyColumnSet","activeBreakpoint","sortedBreakpoints","internalGrid","this","grid","setResponsive","enabled","applyResponsiveState","emit","width","breakpoint","config","requestRender","setBreakpoint","checkBreakpoint","setCardRenderer","renderer","cardRenderer","getWidth","getActiveBreakpoint","attach","super","parseLightDomCard","buildHiddenColumnSets","hiddenColumns","breakpoints","length","sort","a","b","maxWidth","ResizeObserver","entries","contentRect","clearTimeout","setTimeout","debounceMs","observe","gridElement","gridEl","cardEl","querySelector","adapter","__frameworkAdapter","parseResponsiveCardElement","adapterRenderer","breakpointAttr","getAttribute","cardRowHeightAttr","hiddenColumnsAttr","hideHeaderAttr","debounceMsAttr","configUpdates","parseInt","isNaN","cardRowHeight","split","map","s","trim","filter","hideHeader","templateHTML","innerHTML","row","evaluated","evalTemplateString","value","sanitized","sanitizeHTML","container","document","createElement","className","Object","keys","clear","col","add","showValue","field","detach","disconnect","removeAttribute","handleQuery","query","afterRender","measureCardHeightFromDOM","hasHiddenColumns","size","hasValueOnlyColumns","cells","querySelectorAll","cell","has","setAttribute","checkMultiBreakpoint","warn","MISSING_BREAKPOINT","shouldBeResponsive","newActiveBreakpoint","bp","cardLayout","originalRowHeight","toggleAttribute","animate","animationDuration","style","setProperty","_virtualization","rowHeight","scrollArea","scrollLeft","rows","height","classList","remove","measuredCardHeight","measuredGroupRowHeight","lastCardRowCount","renderRow","rowEl","rowIndex","__isGroupRow","replaceChildren","cardContent","configuredHeight","getCardHeight","appendChild","onKeyDown","e","includes","key","maxRow","maxCol","visibleColumns","_focusCol","preventDefault","ensureCellVisible","_focusRow","configHeight","getGroupRowHeight","hasGroupRows","countRowTypes","groupCount","cardCount","getExtraHeight","baseHeight","groupHeight","cardHeight","Math","max","getExtraHeightBefore","beforeRowIndex","groupHeightDiff","cardHeightDiff","groupsBefore","cardsBefore","maxIndex","min","i","getRowHeight","_index","countCardRows","count","pendingRefresh","needsRefresh","hasGroups","currentCardRowCount","groupRow","getBoundingClientRect","cardRow","queueMicrotask","refreshVirtualWindow"],"mappings":"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"}
+{"version":3,"file":"responsive.umd.js","sources":["../../../../../libs/grid/src/lib/plugins/responsive/ResponsivePlugin.ts"],"sourcesContent":["/**\n * Responsive Plugin\n *\n * Transforms the grid from tabular layout to a card/list layout when the grid\n * width falls below a configurable breakpoint. This enables grids to work in\n * narrow containers (split-pane UIs, mobile viewports, dashboard widgets).\n *\n * ## Installation\n *\n * ```ts\n * import { ResponsivePlugin } from '@toolbox-web/grid/plugins/responsive';\n *\n * const config: GridConfig = {\n *   plugins: [new ResponsivePlugin({ breakpoint: 500 })],\n * };\n * ```\n *\n * ## How It Works\n *\n * 1. ResizeObserver monitors the grid element's width\n * 2. When `width < breakpoint`, adds `data-responsive` attribute to grid\n * 3. CSS transforms cells from horizontal to vertical layout\n * 4. Each cell displays \"Header: Value\" using CSS `::before` pseudo-element\n *\n * @see [Responsive Demo](?path=/story/grid-plugins-responsive--default)\n */\n\nimport { MISSING_BREAKPOINT } from '../../core/internal/diagnostics';\nimport { ensureCellVisible } from '../../core/internal/keyboard';\nimport { evalTemplateString, sanitizeHTML } from '../../core/internal/sanitize';\nimport { BaseGridPlugin, type GridElement, type PluginManifest, type PluginQuery } from '../../core/plugin/base-plugin';\nimport type { GridHost } from '../../core/types';\nimport styles from './responsive.css?inline';\nimport type { BreakpointConfig, HiddenColumnConfig, ResponsiveChangeDetail, ResponsivePluginConfig } from './types';\n\n/**\n * Responsive Plugin for tbw-grid\n *\n * Adds automatic card layout mode when the grid width falls below a configurable\n * breakpoint. Perfect for responsive designs, split-pane UIs, and mobile viewports.\n *\n * @template T The row data type\n *\n * @example\n * ```ts\n * // Basic usage - switch to card layout below 500px\n * const config: GridConfig = {\n *   plugins: [new ResponsivePlugin({ breakpoint: 500 })],\n * };\n * ```\n *\n * @example\n * ```ts\n * // Hide less important columns in card mode\n * const config: GridConfig = {\n *   plugins: [\n *     new ResponsivePlugin({\n *       breakpoint: 600,\n *       hiddenColumns: ['createdAt', 'updatedAt'],\n *     }),\n *   ],\n * };\n * ```\n *\n * @example\n * ```ts\n * // Custom card renderer for advanced layouts\n * const config: GridConfig = {\n *   plugins: [\n *     new ResponsivePlugin({\n *       breakpoint: 400,\n *       cardRenderer: (row) => {\n *         const card = document.createElement('div');\n *         card.className = 'custom-card';\n *         card.innerHTML = `<strong>${row.name}</strong><br>${row.email}`;\n *         return card;\n *       },\n *     }),\n *   ],\n * };\n * ```\n */\nexport class ResponsivePlugin<T = unknown> extends BaseGridPlugin<ResponsivePluginConfig<T>> {\n  readonly name = 'responsive';\n  override readonly version = '1.0.0';\n  override readonly styles = styles;\n\n  /**\n   * Plugin manifest declaring incompatibilities with other plugins.\n   */\n  static override readonly manifest: PluginManifest = {\n    incompatibleWith: [\n      {\n        name: 'groupingRows',\n        reason:\n          'Responsive card layout does not yet support row grouping. ' +\n          'The variable row heights (cards vs group headers) cause scroll calculation issues.',\n      },\n    ],\n    queries: [\n      {\n        type: 'isCardMode',\n        description: 'Returns whether the grid is currently in responsive card mode',\n      },\n    ],\n  };\n\n  #resizeObserver?: ResizeObserver;\n  #isResponsive = false;\n  #debounceTimer?: ReturnType<typeof setTimeout>;\n  #warnedAboutMissingBreakpoint = false;\n  #currentWidth = 0;\n  /** Set of column fields to completely hide */\n  #hiddenColumnSet: Set<string> = new Set();\n  /** Set of column fields to show value only (no header label) */\n  #valueOnlyColumnSet: Set<string> = new Set();\n  /** Currently active breakpoint, or null if none */\n  #activeBreakpoint: BreakpointConfig | null = null;\n  /** Sorted breakpoints from largest to smallest */\n  #sortedBreakpoints: BreakpointConfig[] = [];\n\n  /** Typed internal grid accessor — centralizes the single required cast. */\n  get #internalGrid(): GridHost {\n    return this.grid as unknown as GridHost;\n  }\n\n  /**\n   * Check if currently in responsive mode.\n   * @returns `true` if the grid is in card layout mode\n   */\n  isResponsive(): boolean {\n    return this.#isResponsive;\n  }\n\n  /**\n   * Force responsive mode regardless of width.\n   * Useful for testing or manual control.\n   * @param enabled - Whether to enable responsive mode\n   */\n  setResponsive(enabled: boolean): void {\n    if (enabled !== this.#isResponsive) {\n      this.#isResponsive = enabled;\n      this.#applyResponsiveState();\n      this.emit('responsive-change', {\n        isResponsive: enabled,\n        width: this.#currentWidth,\n        breakpoint: this.config.breakpoint ?? 0,\n      } satisfies ResponsiveChangeDetail);\n      this.requestRender();\n    }\n  }\n\n  /**\n   * Update breakpoint dynamically.\n   * @param width - New breakpoint width in pixels\n   */\n  setBreakpoint(width: number): void {\n    this.config.breakpoint = width;\n    this.#checkBreakpoint(this.#currentWidth);\n  }\n\n  /**\n   * Set a custom card renderer.\n   * This allows framework adapters to provide template-based renderers at runtime.\n   * @param renderer - The card renderer function, or undefined to use default\n   */\n  setCardRenderer(renderer: ResponsivePluginConfig<T>['cardRenderer']): void {\n    this.config.cardRenderer = renderer;\n    // If already in responsive mode, trigger a re-render to apply the new renderer\n    if (this.#isResponsive) {\n      this.requestRender();\n    }\n  }\n\n  /**\n   * Get current grid width.\n   * @returns Width of the grid element in pixels\n   */\n  getWidth(): number {\n    return this.#currentWidth;\n  }\n\n  /**\n   * Get the currently active breakpoint config (multi-breakpoint mode only).\n   * @returns The active BreakpointConfig, or null if no breakpoint is active\n   */\n  getActiveBreakpoint(): BreakpointConfig | null {\n    return this.#activeBreakpoint;\n  }\n\n  override attach(grid: GridElement): void {\n    super.attach(grid);\n\n    // Parse light DOM configuration first (may update this.config)\n    this.#parseLightDomCard();\n\n    // Build hidden column sets from config\n    this.#buildHiddenColumnSets(this.config.hiddenColumns);\n\n    // Sort breakpoints from largest to smallest for evaluation\n    if (this.config.breakpoints?.length) {\n      this.#sortedBreakpoints = [...this.config.breakpoints].sort((a, b) => b.maxWidth - a.maxWidth);\n    }\n\n    // Observe the grid element itself (not internal viewport)\n    // This captures the container width including when shell panels open/close\n    this.#resizeObserver = new ResizeObserver((entries) => {\n      const width = entries[0]?.contentRect.width ?? 0;\n      this.#currentWidth = width;\n\n      // Debounce to avoid thrashing during resize drag\n      clearTimeout(this.#debounceTimer);\n      this.#debounceTimer = setTimeout(() => {\n        this.#checkBreakpoint(width);\n      }, this.config.debounceMs ?? 100);\n    });\n\n    this.#resizeObserver.observe(this.gridElement);\n  }\n\n  // #region Light DOM Parsing\n\n  /**\n   * Parse `<tbw-grid-responsive-card>` elements from the grid's light DOM.\n   *\n   * Allows declarative configuration:\n   * ```html\n   * <tbw-grid [rows]=\"data\">\n   *   <tbw-grid-responsive-card breakpoint=\"500\" card-row-height=\"80\">\n   *     <div class=\"custom-card\">\n   *       <strong>{{ row.name }}</strong>\n   *       <span>{{ row.email }}</span>\n   *     </div>\n   *   </tbw-grid-responsive-card>\n   * </tbw-grid>\n   * ```\n   *\n   * Attributes:\n   * - `breakpoint`: number - Width threshold for responsive mode\n   * - `card-row-height`: number | 'auto' - Card height (default: 'auto')\n   * - `hidden-columns`: string - Comma-separated fields to hide\n   * - `hide-header`: 'true' | 'false' - Hide header row (default: 'true')\n   * - `debounce-ms`: number - Resize debounce delay (default: 100)\n   */\n  #parseLightDomCard(): void {\n    const gridEl = this.gridElement;\n    if (!gridEl) return;\n\n    const cardEl = gridEl.querySelector('tbw-grid-responsive-card');\n    if (!cardEl) return;\n\n    // Check if a framework adapter wants to handle this element\n    // (e.g., React adapter intercepts for JSX rendering)\n    const adapter = this.#internalGrid.__frameworkAdapter;\n    if (adapter?.parseResponsiveCardElement) {\n      const adapterRenderer = adapter.parseResponsiveCardElement(cardEl);\n      if (adapterRenderer) {\n        this.config = { ...this.config, cardRenderer: adapterRenderer };\n        // Continue to parse attributes even if adapter provides renderer\n      }\n    }\n\n    // Parse attributes for configuration\n    const breakpointAttr = cardEl.getAttribute('breakpoint');\n    const cardRowHeightAttr = cardEl.getAttribute('card-row-height');\n    const hiddenColumnsAttr = cardEl.getAttribute('hidden-columns');\n    const hideHeaderAttr = cardEl.getAttribute('hide-header');\n    const debounceMsAttr = cardEl.getAttribute('debounce-ms');\n\n    const configUpdates: Partial<ResponsivePluginConfig<T>> = {};\n\n    if (breakpointAttr !== null) {\n      const breakpoint = parseInt(breakpointAttr, 10);\n      if (!isNaN(breakpoint)) {\n        configUpdates.breakpoint = breakpoint;\n      }\n    }\n\n    if (cardRowHeightAttr !== null) {\n      configUpdates.cardRowHeight = cardRowHeightAttr === 'auto' ? 'auto' : parseInt(cardRowHeightAttr, 10);\n    }\n\n    if (hiddenColumnsAttr !== null) {\n      // Parse comma-separated field names\n      configUpdates.hiddenColumns = hiddenColumnsAttr\n        .split(',')\n        .map((s) => s.trim())\n        .filter((s) => s.length > 0);\n    }\n\n    if (hideHeaderAttr !== null) {\n      configUpdates.hideHeader = hideHeaderAttr !== 'false';\n    }\n\n    if (debounceMsAttr !== null) {\n      const debounceMs = parseInt(debounceMsAttr, 10);\n      if (!isNaN(debounceMs)) {\n        configUpdates.debounceMs = debounceMs;\n      }\n    }\n\n    // Get template content from innerHTML (only if no renderer already set)\n    const templateHTML = cardEl.innerHTML.trim();\n    if (templateHTML && !this.config.cardRenderer && !adapter?.parseResponsiveCardElement) {\n      // Create a template-based renderer using the inner HTML\n      configUpdates.cardRenderer = (row: T): HTMLElement => {\n        // Evaluate template expressions like {{ row.field }}\n        const evaluated = evalTemplateString(templateHTML, { value: row, row: row as Record<string, unknown> });\n        // Sanitize the result to prevent XSS\n        const sanitized = sanitizeHTML(evaluated);\n        const container = document.createElement('div');\n        container.className = 'tbw-responsive-card-content';\n        container.innerHTML = sanitized;\n        return container;\n      };\n    }\n\n    // Merge updates into config (light DOM values override constructor config)\n    if (Object.keys(configUpdates).length > 0) {\n      this.config = { ...this.config, ...configUpdates };\n    }\n  }\n\n  // #endregion\n\n  /**\n   * Build the hidden and value-only column sets from config.\n   */\n  #buildHiddenColumnSets(hiddenColumns?: HiddenColumnConfig[]): void {\n    this.#hiddenColumnSet.clear();\n    this.#valueOnlyColumnSet.clear();\n\n    if (!hiddenColumns) return;\n\n    for (const col of hiddenColumns) {\n      if (typeof col === 'string') {\n        this.#hiddenColumnSet.add(col);\n      } else if (col.showValue) {\n        this.#valueOnlyColumnSet.add(col.field);\n      } else {\n        this.#hiddenColumnSet.add(col.field);\n      }\n    }\n  }\n\n  override detach(): void {\n    this.#resizeObserver?.disconnect();\n    this.#resizeObserver = undefined;\n    clearTimeout(this.#debounceTimer);\n    this.#debounceTimer = undefined;\n\n    // Clean up attribute\n    if (this.gridElement) {\n      this.gridElement.removeAttribute('data-responsive');\n    }\n\n    super.detach();\n  }\n\n  /**\n   * Handle plugin queries.\n   * @internal\n   */\n  override handleQuery(query: PluginQuery): unknown {\n    if (query.type === 'isCardMode') {\n      return this.#isResponsive;\n    }\n    return undefined;\n  }\n\n  /**\n   * Apply hidden and value-only columns.\n   * In legacy mode (single breakpoint), only applies when in responsive mode.\n   * In multi-breakpoint mode, applies whenever there's an active breakpoint.\n   */\n  override afterRender(): void {\n    // Measure card height for virtualization calculations\n    this.#measureCardHeightFromDOM();\n\n    // In single breakpoint mode, only apply when responsive\n    // In multi-breakpoint mode, apply when there's an active breakpoint\n    const shouldApply = this.#sortedBreakpoints.length > 0 ? this.#activeBreakpoint !== null : this.#isResponsive;\n\n    if (!shouldApply) {\n      return;\n    }\n\n    const hasHiddenColumns = this.#hiddenColumnSet.size > 0;\n    const hasValueOnlyColumns = this.#valueOnlyColumnSet.size > 0;\n\n    if (!hasHiddenColumns && !hasValueOnlyColumns) {\n      return;\n    }\n\n    // Mark cells for hidden columns and value-only columns\n    const cells = this.gridElement.querySelectorAll('.cell[data-field]');\n    for (const cell of cells) {\n      const field = cell.getAttribute('data-field');\n      if (!field) continue;\n\n      // Apply hidden attribute\n      if (this.#hiddenColumnSet.has(field)) {\n        cell.setAttribute('data-responsive-hidden', '');\n        cell.removeAttribute('data-responsive-value-only');\n      }\n      // Apply value-only attribute (shows value without header label)\n      else if (this.#valueOnlyColumnSet.has(field)) {\n        cell.setAttribute('data-responsive-value-only', '');\n        cell.removeAttribute('data-responsive-hidden');\n      }\n      // Clear any previous responsive attributes\n      else {\n        cell.removeAttribute('data-responsive-hidden');\n        cell.removeAttribute('data-responsive-value-only');\n      }\n    }\n  }\n\n  /**\n   * Check if width has crossed any breakpoint threshold.\n   * Handles both single breakpoint (legacy) and multi-breakpoint modes.\n   */\n  #checkBreakpoint(width: number): void {\n    // Multi-breakpoint mode\n    if (this.#sortedBreakpoints.length > 0) {\n      this.#checkMultiBreakpoint(width);\n      return;\n    }\n\n    // Legacy single breakpoint mode\n    const breakpoint = this.config.breakpoint ?? 0;\n\n    // Warn once if breakpoint not configured (0 means never responsive)\n    if (breakpoint === 0 && !this.#warnedAboutMissingBreakpoint) {\n      this.#warnedAboutMissingBreakpoint = true;\n      this.warn(\n        MISSING_BREAKPOINT,\n        \"No breakpoint configured. Responsive mode is disabled. Set a breakpoint based on your grid's column count.\",\n      );\n    }\n\n    const shouldBeResponsive = breakpoint > 0 && width < breakpoint;\n\n    if (shouldBeResponsive !== this.#isResponsive) {\n      this.#isResponsive = shouldBeResponsive;\n      this.#applyResponsiveState();\n      this.emit('responsive-change', {\n        isResponsive: shouldBeResponsive,\n        width,\n        breakpoint,\n      } satisfies ResponsiveChangeDetail);\n      this.requestRender();\n    }\n  }\n\n  /**\n   * Check breakpoints in multi-breakpoint mode.\n   * Evaluates breakpoints from largest to smallest, applying the first match.\n   */\n  #checkMultiBreakpoint(width: number): void {\n    // Find the active breakpoint (first one where width <= maxWidth)\n    // Since sorted largest to smallest, we find the largest matching breakpoint\n    let newActiveBreakpoint: BreakpointConfig | null = null;\n\n    for (const bp of this.#sortedBreakpoints) {\n      if (width <= bp.maxWidth) {\n        newActiveBreakpoint = bp;\n        // Continue to find the most specific (smallest) matching breakpoint\n      }\n    }\n\n    // Check if breakpoint changed\n    const breakpointChanged = newActiveBreakpoint !== this.#activeBreakpoint;\n\n    if (breakpointChanged) {\n      this.#activeBreakpoint = newActiveBreakpoint;\n\n      // Update hidden column sets from active breakpoint\n      if (newActiveBreakpoint?.hiddenColumns) {\n        this.#buildHiddenColumnSets(newActiveBreakpoint.hiddenColumns);\n      } else {\n        // Fall back to top-level hiddenColumns config\n        this.#buildHiddenColumnSets(this.config.hiddenColumns);\n      }\n\n      // Determine if we should be in card layout\n      const shouldBeResponsive = newActiveBreakpoint?.cardLayout === true;\n\n      if (shouldBeResponsive !== this.#isResponsive) {\n        this.#isResponsive = shouldBeResponsive;\n        this.#applyResponsiveState();\n      }\n\n      // Emit event for any breakpoint change\n      this.emit('responsive-change', {\n        isResponsive: this.#isResponsive,\n        width,\n        breakpoint: newActiveBreakpoint?.maxWidth ?? 0,\n      } satisfies ResponsiveChangeDetail);\n\n      this.requestRender();\n    }\n  }\n\n  /** Original row height before entering responsive mode, for restoration on exit */\n  #originalRowHeight?: number;\n\n  /**\n   * Apply the responsive state to the grid element.\n   * Handles scroll reset when entering responsive mode and row height restoration on exit.\n   */\n  #applyResponsiveState(): void {\n    this.gridElement.toggleAttribute('data-responsive', this.#isResponsive);\n\n    // Apply animation attribute if enabled (default: true)\n    const animate = this.config.animate !== false;\n    this.gridElement.toggleAttribute('data-responsive-animate', animate);\n\n    // Set custom animation duration if provided\n    if (this.config.animationDuration) {\n      this.gridElement.style.setProperty('--tbw-responsive-duration', `${this.config.animationDuration}ms`);\n    }\n\n    // Cast to internal type for virtualization access\n    const internalGrid = this.#internalGrid;\n\n    if (this.#isResponsive) {\n      // Store original row height before responsive mode changes it\n      if (internalGrid._virtualization) {\n        this.#originalRowHeight = internalGrid._virtualization.rowHeight;\n      }\n\n      // Reset horizontal scroll position when entering responsive mode\n      // The CSS hides overflow but doesn't reset the scroll position\n      const scrollArea = this.gridElement.querySelector('.tbw-scroll-area') as HTMLElement | null;\n      if (scrollArea) {\n        scrollArea.scrollLeft = 0;\n      }\n    } else {\n      // Exiting responsive mode - clean up inline styles set by renderRow\n      // The rows are reused from the pool, so we need to remove the card-specific styles\n      const rows = this.gridElement.querySelectorAll('.data-grid-row');\n      for (const row of rows) {\n        (row as HTMLElement).style.height = '';\n        row.classList.remove('responsive-card');\n      }\n\n      // Restore original row height\n      if (this.#originalRowHeight && this.#originalRowHeight > 0 && internalGrid._virtualization) {\n        internalGrid._virtualization.rowHeight = this.#originalRowHeight;\n        this.#originalRowHeight = undefined;\n      }\n\n      // Clear cached measurements so they're remeasured fresh when re-entering responsive mode\n      // Without this, stale measurements cause incorrect height calculations after scrolling\n      this.#measuredCardHeight = undefined;\n      this.#measuredGroupRowHeight = undefined;\n      this.#lastCardRowCount = undefined;\n    }\n  }\n\n  /**\n   * Custom row rendering when cardRenderer is provided and in responsive mode.\n   *\n   * When a cardRenderer is configured, this hook takes over row rendering to display\n   * the custom card layout instead of the default cell structure.\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 rendered (prevents default), `void` for default rendering\n   */\n  override renderRow(row: unknown, rowEl: HTMLElement, rowIndex: number): boolean | void {\n    // Only override when in responsive mode AND cardRenderer is provided\n    if (!this.#isResponsive || !this.config.cardRenderer) {\n      return; // Let default rendering proceed\n    }\n\n    // Skip group rows from GroupingRowsPlugin - they have special structure\n    // and should use their own renderer\n    if ((row as { __isGroupRow?: boolean }).__isGroupRow) {\n      return; // Let GroupingRowsPlugin handle group row rendering\n    }\n\n    // Clear existing content\n    rowEl.replaceChildren();\n\n    // Call user's cardRenderer to get custom content\n    const cardContent = this.config.cardRenderer(row as T, rowIndex);\n\n    // Reset className - clears any stale classes from previous use (e.g., 'group-row' from recycled element)\n    // This follows the same pattern as GroupingRowsPlugin which sets className explicitly\n    rowEl.className = 'data-grid-row responsive-card';\n\n    // Handle card row height — when a numeric height is configured, use the effective\n    // height from #getCardHeight() which incorporates DOM measurement after first render.\n    // This keeps inline height in sync with the position cache used for virtualization.\n    const configuredHeight = this.config.cardRowHeight;\n    if (configuredHeight === 'auto' || configuredHeight === undefined) {\n      rowEl.style.height = 'auto';\n    } else {\n      rowEl.style.height = `${this.#getCardHeight()}px`;\n    }\n\n    // Append the custom card content\n    rowEl.appendChild(cardContent);\n\n    return true; // We handled rendering\n  }\n\n  /**\n   * Handle keyboard navigation in responsive mode.\n   *\n   * In responsive mode, the visual layout is inverted:\n   * - Cells are stacked vertically within each \"card\" (row)\n   * - DOWN/UP visually moves within the card (between fields)\n   * - Page Down/Page Up or Ctrl+Down/Up moves between cards\n   *\n   * For custom cardRenderers, keyboard navigation is disabled entirely\n   * since the implementor controls the card content and should handle\n   * navigation via their own event handlers.\n   *\n   * @returns `true` if the event was handled and default behavior should be prevented\n   */\n  override onKeyDown(e: KeyboardEvent): boolean {\n    if (!this.#isResponsive) {\n      return false;\n    }\n\n    // If custom cardRenderer is provided, disable grid's keyboard navigation\n    // The implementor is responsible for their own navigation\n    if (this.config.cardRenderer) {\n      const navKeys = ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'];\n      if (navKeys.includes(e.key)) {\n        // Let the event bubble - implementor can handle it\n        return false;\n      }\n    }\n\n    // Swap arrow key behavior for CSS-only responsive mode\n    // In card layout, cells are stacked vertically:\n    //   Card 1:       Card 2:\n    //     ID: 1         ID: 2\n    //     Name: Alice   Name: Bob  <- ArrowRight goes here\n    //     Dept: Eng     Dept: Mkt\n    //       ↓ ArrowDown goes here\n    //\n    // ArrowDown/Up = move within card (change column/field)\n    // ArrowRight/Left = move between cards (change row)\n    const maxRow = this.rows.length - 1;\n    const maxCol = this.visibleColumns.length - 1;\n\n    switch (e.key) {\n      case 'ArrowDown':\n        // Move down WITHIN card (to next field/column)\n        if (this.grid._focusCol < maxCol) {\n          this.grid._focusCol += 1;\n          e.preventDefault();\n          ensureCellVisible(this.#internalGrid);\n          return true;\n        }\n        // At bottom of card - optionally move to next card's first field\n        if (this.grid._focusRow < maxRow) {\n          this.grid._focusRow += 1;\n          this.grid._focusCol = 0;\n          e.preventDefault();\n          ensureCellVisible(this.#internalGrid);\n          return true;\n        }\n        break;\n\n      case 'ArrowUp':\n        // Move up WITHIN card (to previous field/column)\n        if (this.grid._focusCol > 0) {\n          this.grid._focusCol -= 1;\n          e.preventDefault();\n          ensureCellVisible(this.#internalGrid);\n          return true;\n        }\n        // At top of card - optionally move to previous card's last field\n        if (this.grid._focusRow > 0) {\n          this.grid._focusRow -= 1;\n          this.grid._focusCol = maxCol;\n          e.preventDefault();\n          ensureCellVisible(this.#internalGrid);\n          return true;\n        }\n        break;\n\n      case 'ArrowRight':\n        // Move to NEXT card (same field)\n        if (this.grid._focusRow < maxRow) {\n          this.grid._focusRow += 1;\n          e.preventDefault();\n          ensureCellVisible(this.#internalGrid);\n          return true;\n        }\n        break;\n\n      case 'ArrowLeft':\n        // Move to PREVIOUS card (same field)\n        if (this.grid._focusRow > 0) {\n          this.grid._focusRow -= 1;\n          e.preventDefault();\n          ensureCellVisible(this.#internalGrid);\n          return true;\n        }\n        break;\n    }\n\n    return false;\n  }\n\n  // ============================================\n  // Variable Height Support for Mixed Row Types\n  // ============================================\n\n  /** Measured card height from DOM for virtualization calculations */\n  #measuredCardHeight?: number;\n\n  /** Measured group row height from DOM for virtualization calculations */\n  #measuredGroupRowHeight?: number;\n\n  /** Last known card row count for detecting changes (e.g., group expand/collapse) */\n  #lastCardRowCount?: number;\n\n  /**\n   * Get the effective card height for virtualization calculations.\n   * Prioritizes DOM-measured height (actual rendered size) over config,\n   * since content can overflow the configured height.\n   */\n  #getCardHeight(): number {\n    // Prefer measured height - it reflects actual rendered size including overflow\n    if (this.#measuredCardHeight && this.#measuredCardHeight > 0) {\n      return this.#measuredCardHeight;\n    }\n    // Fall back to explicit config\n    const configHeight = this.config.cardRowHeight;\n    if (typeof configHeight === 'number' && configHeight > 0) {\n      return configHeight;\n    }\n    // Default fallback\n    return 80;\n  }\n\n  /**\n   * Get the effective group row height for virtualization calculations.\n   * Uses DOM-measured height, falling back to original row height.\n   */\n  #getGroupRowHeight(): number {\n    if (this.#measuredGroupRowHeight && this.#measuredGroupRowHeight > 0) {\n      return this.#measuredGroupRowHeight;\n    }\n    // Fall back to original row height (before responsive mode)\n    return this.#originalRowHeight ?? 28;\n  }\n\n  /**\n   * Check if there are any group rows in the current dataset.\n   * Used to determine if we have mixed row heights.\n   */\n  #hasGroupRows(): boolean {\n    for (const row of this.rows) {\n      if ((row as { __isGroupRow?: boolean }).__isGroupRow) {\n        return true;\n      }\n    }\n    return false;\n  }\n\n  /**\n   * Count group rows and card rows in the current dataset.\n   */\n  #countRowTypes(): { groupCount: number; cardCount: number } {\n    let groupCount = 0;\n    let cardCount = 0;\n    for (const row of this.rows) {\n      if ((row as { __isGroupRow?: boolean }).__isGroupRow) {\n        groupCount++;\n      } else {\n        cardCount++;\n      }\n    }\n    return { groupCount, cardCount };\n  }\n\n  /**\n   * Return total extra height contributed by mixed row heights.\n   * This is called by the grid's virtualization system to adjust scrollbar height.\n   *\n   * The grid calculates: totalRows * baseRowHeight + pluginExtraHeight\n   *\n   * For mixed layouts (groups + cards), we need to report the difference between\n   * actual heights and what the base calculation assumes:\n   * - Extra for groups: groupCount * (groupHeight - baseHeight)\n   * - Extra for cards: cardCount * (cardHeight - baseHeight)\n   *\n   * @deprecated Use getRowHeight() instead. This hook will be removed in v2.0.\n   */\n  override getExtraHeight(): number {\n    // Only applies when in responsive mode with cardRenderer\n    if (!this.#isResponsive || !this.config.cardRenderer) {\n      return 0;\n    }\n\n    // Only report extra height when there are mixed row types (groups + cards)\n    // If all rows are cards, we update the virtualization row height instead\n    if (!this.#hasGroupRows()) {\n      return 0;\n    }\n\n    const baseHeight = this.#originalRowHeight ?? 28;\n    const groupHeight = this.#getGroupRowHeight();\n    const cardHeight = this.#getCardHeight();\n\n    const { groupCount, cardCount } = this.#countRowTypes();\n\n    // Calculate extra height for both row types\n    const groupExtra = groupCount * Math.max(0, groupHeight - baseHeight);\n    const cardExtra = cardCount * Math.max(0, cardHeight - baseHeight);\n\n    return groupExtra + cardExtra;\n  }\n\n  /**\n   * Return extra height that appears before a given row index.\n   * Used by virtualization to correctly calculate scroll positions.\n   *\n   * Like getExtraHeight, this accounts for both group and card row heights.\n   *\n   * @deprecated Use getRowHeight() instead. This hook will be removed in v2.0.\n   */\n  override getExtraHeightBefore(beforeRowIndex: number): number {\n    // Only applies when in responsive mode with cardRenderer\n    if (!this.#isResponsive || !this.config.cardRenderer) {\n      return 0;\n    }\n\n    // Only report extra height when there are mixed row types\n    if (!this.#hasGroupRows()) {\n      return 0;\n    }\n\n    const baseHeight = this.#originalRowHeight ?? 28;\n    const groupHeight = this.#getGroupRowHeight();\n    const cardHeight = this.#getCardHeight();\n\n    const groupHeightDiff = Math.max(0, groupHeight - baseHeight);\n    const cardHeightDiff = Math.max(0, cardHeight - baseHeight);\n\n    // Count group rows and card rows before the given index\n    let groupsBefore = 0;\n    let cardsBefore = 0;\n    const rows = this.rows;\n    const maxIndex = Math.min(beforeRowIndex, rows.length);\n\n    for (let i = 0; i < maxIndex; i++) {\n      if ((rows[i] as { __isGroupRow?: boolean }).__isGroupRow) {\n        groupsBefore++;\n      } else {\n        cardsBefore++;\n      }\n    }\n\n    return groupsBefore * groupHeightDiff + cardsBefore * cardHeightDiff;\n  }\n\n  /**\n   * Get the height of a specific row based on its type (group row vs card row).\n   * Returns undefined if not in responsive mode.\n   *\n   * @param row - The row data\n   * @param _index - The row index (unused, but part of the interface)\n   * @returns The row height in pixels, or undefined if not in responsive mode\n   */\n  override getRowHeight(row: unknown, _index: number): number | undefined {\n    // Only applies when in responsive mode with cardRenderer\n    if (!this.#isResponsive || !this.config.cardRenderer) {\n      return undefined;\n    }\n\n    // Check if this is a group row\n    if ((row as { __isGroupRow?: boolean }).__isGroupRow) {\n      return this.#getGroupRowHeight();\n    }\n\n    // Regular card row\n    return this.#getCardHeight();\n  }\n\n  /**\n   * Count the number of card rows (non-group rows) in the current dataset.\n   */\n  #countCardRows(): number {\n    let count = 0;\n    for (const row of this.rows) {\n      if (!(row as { __isGroupRow?: boolean }).__isGroupRow) {\n        count++;\n      }\n    }\n    return count;\n  }\n\n  /** Pending refresh scheduled via microtask */\n  #pendingRefresh = false;\n\n  /**\n   * Measure card height from DOM after render and detect row count changes.\n   * Called in afterRender to ensure scroll calculations are accurate.\n   *\n   * This handles two scenarios:\n   * 1. Card height changes (content overflow, dynamic sizing)\n   * 2. Card row count changes (group expand/collapse)\n   * 3. Group row height changes\n   *\n   * For uniform card layouts (no groups), we update the virtualization row height\n   * directly to the card height. For mixed layouts (groups + cards), we use the\n   * getExtraHeight mechanism to report height differences.\n   *\n   * The refresh is deferred via microtask to avoid nested render cycles.\n   */\n  #measureCardHeightFromDOM(): void {\n    if (!this.#isResponsive) {\n      return;\n    }\n\n    let needsRefresh = false;\n    const internalGrid = this.#internalGrid;\n    const hasGroups = this.#hasGroupRows();\n\n    // Check if card row count changed (e.g., group expanded/collapsed)\n    const currentCardRowCount = this.#countCardRows();\n    if (currentCardRowCount !== this.#lastCardRowCount) {\n      this.#lastCardRowCount = currentCardRowCount;\n      needsRefresh = true;\n    }\n\n    // Measure actual group row height from DOM (for mixed layouts)\n    if (hasGroups) {\n      const groupRow = this.gridElement.querySelector('.data-grid-row.group-row') as HTMLElement | null;\n      if (groupRow) {\n        const height = groupRow.getBoundingClientRect().height;\n        if (height > 0 && height !== this.#measuredGroupRowHeight) {\n          this.#measuredGroupRowHeight = height;\n          needsRefresh = true;\n        }\n      }\n    }\n\n    // Measure actual card height from DOM.\n    // With cardRenderer, rows have the `.responsive-card` class.\n    // Without cardRenderer (CSS-only card mode), rows are plain `.data-grid-row`\n    // elements whose CSS height is `auto` — we need to measure their actual\n    // rendered height so the faux scrollbar spacer is sized correctly.\n    const cardSelector = this.config.cardRenderer ? '.data-grid-row.responsive-card' : '.data-grid-row:not(.group-row)';\n    const cardRow = this.gridElement.querySelector(cardSelector) as HTMLElement | null;\n    if (cardRow) {\n      const height = cardRow.getBoundingClientRect().height;\n      if (height > 0 && height !== this.#measuredCardHeight) {\n        this.#measuredCardHeight = height;\n        needsRefresh = true;\n\n        // For uniform card layouts (no groups), update virtualization row height directly\n        // This ensures proper row recycling and translateY calculations\n        if (!hasGroups && internalGrid._virtualization) {\n          internalGrid._virtualization.rowHeight = height;\n        }\n      }\n    }\n\n    // Defer virtualization refresh to avoid nested render cycles\n    // This is called from afterRender, so we can't call refreshVirtualWindow synchronously\n    // Use scheduler's VIRTUALIZATION phase to batch properly and avoid duplicate afterRender calls\n    if (needsRefresh && !this.#pendingRefresh) {\n      this.#pendingRefresh = true;\n      queueMicrotask(() => {\n        this.#pendingRefresh = false;\n        // Only refresh if still attached and in responsive mode\n        if (this.grid && this.#isResponsive) {\n          // Request virtualization phase through grid's public API\n          // This goes through the scheduler which batches and handles afterRender properly\n          this.#internalGrid.refreshVirtualWindow?.(true, true);\n        }\n      });\n    }\n  }\n}\n"],"names":["ResponsivePlugin","BaseGridPlugin","name","version","styles","static","incompatibleWith","reason","queries","type","description","resizeObserver","isResponsive","debounceTimer","warnedAboutMissingBreakpoint","currentWidth","hiddenColumnSet","Set","valueOnlyColumnSet","activeBreakpoint","sortedBreakpoints","internalGrid","this","grid","setResponsive","enabled","applyResponsiveState","emit","width","breakpoint","config","requestRender","setBreakpoint","checkBreakpoint","setCardRenderer","renderer","cardRenderer","getWidth","getActiveBreakpoint","attach","super","parseLightDomCard","buildHiddenColumnSets","hiddenColumns","breakpoints","length","sort","a","b","maxWidth","ResizeObserver","entries","contentRect","clearTimeout","setTimeout","debounceMs","observe","gridElement","gridEl","cardEl","querySelector","adapter","__frameworkAdapter","parseResponsiveCardElement","adapterRenderer","breakpointAttr","getAttribute","cardRowHeightAttr","hiddenColumnsAttr","hideHeaderAttr","debounceMsAttr","configUpdates","parseInt","isNaN","cardRowHeight","split","map","s","trim","filter","hideHeader","templateHTML","innerHTML","row","evaluated","evalTemplateString","value","sanitized","sanitizeHTML","container","document","createElement","className","Object","keys","clear","col","add","showValue","field","detach","disconnect","removeAttribute","handleQuery","query","afterRender","measureCardHeightFromDOM","hasHiddenColumns","size","hasValueOnlyColumns","cells","querySelectorAll","cell","has","setAttribute","checkMultiBreakpoint","warn","MISSING_BREAKPOINT","shouldBeResponsive","newActiveBreakpoint","bp","cardLayout","originalRowHeight","toggleAttribute","animate","animationDuration","style","setProperty","_virtualization","rowHeight","scrollArea","scrollLeft","rows","height","classList","remove","measuredCardHeight","measuredGroupRowHeight","lastCardRowCount","renderRow","rowEl","rowIndex","__isGroupRow","replaceChildren","cardContent","configuredHeight","getCardHeight","appendChild","onKeyDown","e","includes","key","maxRow","maxCol","visibleColumns","_focusCol","preventDefault","ensureCellVisible","_focusRow","configHeight","getGroupRowHeight","hasGroupRows","countRowTypes","groupCount","cardCount","getExtraHeight","baseHeight","groupHeight","cardHeight","Math","max","getExtraHeightBefore","beforeRowIndex","groupHeightDiff","cardHeightDiff","groupsBefore","cardsBefore","maxIndex","min","i","getRowHeight","_index","countCardRows","count","pendingRefresh","needsRefresh","hasGroups","currentCardRowCount","groupRow","getBoundingClientRect","cardSelector","cardRow","queueMicrotask","refreshVirtualWindow"],"mappings":"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"}