@vielzeug/refine 1.1.1

package/dist/datagrid.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"datagrid.cjs","names":[],"sources":["../src/inputs/datagrid/datagrid.ts"],"sourcesContent":["import { debounce } from '@vielzeug/arsenal';\nimport { define, html, prop } from '@vielzeug/ore';\nimport { raw } from '@vielzeug/ore/directives';\nimport { computed, signal, watch } from '@vielzeug/ripple';\n\nimport { warn } from '../../_dev';\nimport '../../content/icon/icon';\nimport '../../inputs/button/button';\nimport '../../inputs/checkbox/checkbox';\nimport '../../inputs/combobox/combobox';\nimport '../../inputs/select/select';\nimport '../../overlay/popover/popover';\nimport {\n  lifecycleSignal,\n  createDataGridControl,\n  type DataGridColumn,\n  type DataGridControl,\n  type SelectionMode,\n  type SortDirection,\n  type SortState,\n} from '../../headless';\nimport { disablableBundle, loadableBundle } from '../../shared';\nimport { tableBaseMixin } from '../../styles';\nimport { COLUMN_OBSERVED_ATTRS, parseColumnChildren } from './datagrid-column';\nimport { createDataGridControls, type FilterOption, type DataGridView, type FilterOperator } from './datagrid-controls';\nimport { type GridNavHandle, createGridNav } from './datagrid-nav';\nimport componentStyles from './datagrid.css?inline';\n\ntype SortMode = 'client' | 'server';\n\nexport { COLUMN_TAG } from './datagrid-column';\nexport type { DataGridView, FilterOption, FilterOperator } from './datagrid-controls';\n\n// ── Pure module-level helpers ─────────────────────────────────────────────────\n\n/**\n * Returns the Lucide icon name for a column's sort state.\n * Pure function — no closure dependency on ctrl.\n */\nexport function sortIconName(state: SortState, key: string): string {\n  if (state.key !== key || state.direction === 'none') return 'chevrons-up-down';\n\n  return state.direction === 'asc' ? 'chevron-up' : 'chevron-down';\n}\n\n/**\n * Returns the WAI-ARIA `aria-sort` value for a column.\n * Pure function — independently unit-testable.\n */\nexport function ariaSortValue(state: SortState, key: string): 'ascending' | 'descending' | 'none' {\n  if (state.key !== key || state.direction === 'none') return 'none';\n\n  return state.direction === 'asc' ? 'ascending' : 'descending';\n}\n\n// ── Types ──────────────────────────────────────────────────────────────────────\n\nexport type OreDataGridEvents<T = Record<string, unknown>> = {\n  /** Fired when the user cycles the density via the toolbar button. */\n  'density-change': { density: 'compact' | 'cozy' | 'comfortable' };\n  /** Fired when the active page changes. */\n  'page-change': { pageIndex: number; pageSize: number };\n  /** Fired when a row is expanded or collapsed. */\n  'row-expand': { expanded: boolean; key: string };\n  /** Fired when row selection changes. */\n  'selection-change': { keys: string[]; rows: T[] };\n  /** Fired when the sort column or direction changes. */\n  'sort-change': { direction: SortDirection; key: string };\n  /** Fired when the active view tab changes. detail: { id, label } */\n  'view-change': { id: string; label: string };\n};\n\nexport type OreDataGridProps<T = Record<string, unknown>> = {\n  /**\n   * The ID of the currently active view. Must match an `id` in `views`.\n   * When omitted, no view is active (all data shown).\n   * @example `grid.activeView = 'open'`\n   */\n  activeView?: string;\n  /**\n   * Column definitions (imperative API). Takes precedence over `<ore-column>` children.\n   * Passing `[]` explicitly clears declarative children.\n   * Pass `undefined` (or omit) to use `<ore-column>` children instead.\n   * @example\n   * ```js\n   * grid.columns = [\n   *   { key: 'name', label: 'Name', sortable: true },\n   *   { key: 'email', label: 'Email' },\n   * ];\n   * ```\n   */\n  columns?: DataGridColumn<T>[];\n  /** Cell density: `'compact'` | `'cozy'` (default) | `'comfortable'` */\n  density?: 'compact' | 'cozy' | 'comfortable';\n  /** Disable all interaction. */\n  disabled?: boolean;\n  /** Text shown when there are no rows. */\n  emptyText?: string;\n  /**\n   * Enable row expansion. When set, each row gets a toggle button.\n   * Requires at least one column to have a `renderExpanded` function.\n   *\n   * @security The `renderExpanded` callback's returned HTML string is inserted via ore's\n   * `raw()` directive (participates in `setRawSanitizer()` if one is registered). If data\n   * originates from untrusted user input, sanitize it before returning\n   * (e.g. with DOMPurify or your CSP-compliant sanitizer).\n   */\n  expandable?: boolean;\n  /**\n   * Pre-defined filter option definitions per column key.\n   * When provided, these options replace the auto-derived ones in the Filter popover.\n   * @example\n   * ```js\n   * grid.filterOptions = [\n   *   { key: 'role', label: 'Role', options: [{ value: 'Admin' }, { value: 'Editor' }] },\n   * ];\n   * ```\n   */\n  filterOptions?: FilterOption[];\n  /** Stretch the grid to fill its container's width. */\n  fullwidth?: boolean;\n  /**\n   * Function that returns a unique string key per row.\n   * Defaults to `(row) => String(row['id'])`.\n   */\n  getRowKey?: (row: T) => string;\n  /** Accessible label for the grid. Recommended for screen readers. */\n  label?: string;\n  /** Show a busy/loading state with reduced opacity. */\n  loading?: boolean;\n  /** Number of rows per page. Defaults to `10`. Set to `0` to disable pagination. */\n  pageSize?: number;\n  /**\n   * Options for the per-page size selector rendered in the footer.\n   * When provided, a `ore-select` is shown next to the pagination controls.\n   * @example `grid.pageSizeOptions = [10, 25, 50, 100]`\n   */\n  pageSizeOptions?: number[];\n  /**\n   * Row data. Pass as a JS property — not serialisable to an HTML attribute.\n   * @example\n   * ```js\n   * grid.rows = [{ id: '1', name: 'Alice', email: 'alice@example.com' }];\n   * ```\n   */\n  rows?: T[];\n  /**\n   * Accessible label for the search toggle button. Supports localization.\n   * Defaults to `'Search'` (open) and `'Close search'` (close).\n   * Pass a tuple `[openLabel, closeLabel]` to override both.\n   * @example `grid.searchLabel = ['Suchen', 'Suche schließen']`\n   */\n  searchLabel?: [open: string, close: string];\n  /** Placeholder text for the inline search input in the controls bar. */\n  searchPlaceholder?: string;\n  /**\n   * Pre-selected row keys. Setting this from outside will update the internal selection.\n   * @example `grid.selectedKeys = ['1', '3']`\n   */\n  selectedKeys?: string[];\n  /** Row selection mode. */\n  selectionMode?: SelectionMode;\n  /**\n   * Whether sorting is client-side (default) or server-side.\n   * When `'server'`, `sort-change` fires but items are not sorted by the control.\n   */\n  sortMode?: SortMode;\n  /**\n   * A reactive data source from `@vielzeug/sourcerer` (or any compatible object).\n   * When set, the source drives row data, pagination, and search — the `rows` prop is ignored.\n   * Client-side sort and filter are bypassed; wire `sort-change` to `source.patch()` externally.\n   * @example\n   * ```js\n   * import { createRemoteSource } from '@vielzeug/sourcerer';\n   * const source = createRemoteSource({ fetch: (q, sig) => api.users(q, sig), limit: 20 });\n   * grid.source = source;\n   * ```\n   */\n  source?: DataGridSource<T>;\n  /** Apply alternating row backgrounds. */\n  striped?: boolean;\n  /**\n   * Named view definitions for the controls bar tab strip.\n   * Each view is a label displayed as a tab; switching tabs fires `view-change`.\n   * The consumer is responsible for restoring filter/sort state per view.\n   * @example\n   * ```js\n   * grid.views = [\n   *   { id: 'all', label: 'All' },\n   *   { id: 'open', label: 'Open' },\n   *   { id: 'mine', label: 'Mine' },\n   * ];\n   * grid.activeView = 'all';\n   * ```\n   */\n  views?: DataGridView[];\n};\n\n/**\n * An accessible, keyboard-navigable data grid with sorting, pagination,\n * single/multi row selection, inline search, filter, and named views.\n *\n * @element ore-datagrid\n * @element ore-column - Optional declarative column definition child\n *\n * @attr {boolean} disabled - Disable all interaction\n * @attr {boolean} loading - Show busy/loading state\n * @attr {boolean} striped - Apply alternating row backgrounds\n * @attr {boolean} fullwidth - Stretch the grid to fill its container's width\n * @attr {data} search-label - Tuple [openLabel, closeLabel] for the search toggle button\n * @attr {string} search-placeholder - Placeholder for the inline search input\n * @attr {number} page-size - Rows per page (0 = no pagination, default 10)\n * @attr {string} selection-mode - Row selection: 'none' | 'single' | 'multi'\n * @attr {string} sort-mode - Sorting: 'client' (default) | 'server'\n * @attr {string} density - Cell density: compact | cozy (default) | comfortable\n * @attr {string} empty-text - Text shown when there are no rows\n * @attr {string} label - Accessible label for the grid\n * @attr {string} active-view - ID of the currently active view tab\n *\n * @fires selection-change - Fired when row selection changes. detail: { keys: string[], rows: T[] }\n * @fires sort-change - Fired when sort state changes. detail: { key: string, direction: SortDirection }\n * @fires page-change - Fired when page changes. detail: { pageIndex: number, pageSize: number }\n * @fires row-expand - Fired when a row is expanded or collapsed. detail: { expanded: boolean; key: string }\n * @fires view-change - Fired when the active view tab changes. detail: { id: string, label: string }\n *\n * @cssprop --datagrid-bg - Grid background color\n * @cssprop --datagrid-border-color - Grid and cell border color\n * @cssprop --datagrid-radius - Grid border radius\n * @cssprop --datagrid-shadow - Grid box shadow\n * @cssprop --datagrid-header-bg - Column header background\n * @cssprop --datagrid-row-hover-bg - Row hover background\n * @cssprop --datagrid-row-selected-bg - Selected row background\n * @cssprop --datagrid-stripe-bg - Even-row stripe background\n * @cssprop --datagrid-cell-padding-x - Cell horizontal padding\n * @cssprop --datagrid-cell-padding-y - Cell vertical padding\n * @cssprop --datagrid-cell-max-width - Maximum cell content width before truncating\n * @cssprop --datagrid-max-height - Max scrollable height of the table area\n * @cssprop --datagrid-font-size - Base font size for cells\n *\n * @part controls - The controls bar (tabs + action row)\n * @part table - The `<table>` element\n * @part thead - The `<thead>` element\n * @part tbody - The `<tbody>` element\n * @part row - A body `<tr>` element\n * @part cell - A body `<td>` element\n * @part footer - The pagination footer bar\n *\n * @example\n * ```html\n * <ore-datagrid id=\"grid\" label=\"Users\" selection-mode=\"multi\"></ore-datagrid>\n * <script>\n *   const grid = document.getElementById('grid');\n *   grid.columns = [\n *     { key: 'name', label: 'Name', sortable: true },\n *     { key: 'role', label: 'Role' },\n *   ];\n *   grid.rows = [\n *     { id: '1', name: 'Alice', role: 'Admin' },\n *     { id: '2', name: 'Bob',   role: 'Viewer' },\n *   ];\n *   grid.views = [{ id: 'all', label: 'All' }, { id: 'open', label: 'Open' }];\n *   grid.activeView = 'all';\n * </script>\n * ```\n */\n/**\n * Minimal structural interface for a reactive data source accepted by `ore-datagrid`.\n *\n * Any `@vielzeug/sourcerer` source (`LocalSource<T>`, `RemoteSource<T>`, `PageNavigator<T>`)\n * satisfies this interface automatically — no direct sourcerer import is required in refine.\n *\n * When `source` is set on the grid:\n * - `rows` prop is ignored; `source.current` drives the displayed items.\n * - Pagination is driven by `source.meta` (pageCount, pageNumber, totalItems).\n * - Prev/next buttons call `source.prev()` / `source.next()`.\n * - The search input calls `source.search(query)` when available.\n * - `source.meta.isLoading` contributes to the grid's `aria-busy` state.\n * - Client-side sort and filter are bypassed; wire `sort-change` to `source.patch()` externally.\n *\n * @example\n * ```ts\n * import { createRemoteSource } from '@vielzeug/sourcerer';\n *\n * const source = createRemoteSource({\n *   fetch: (q, signal) =>\n *     fetch(`/api/users?page=${q.page}&limit=${q.limit}&search=${q.search ?? ''}`, { signal })\n *       .then(r => r.json()),\n *   limit: 20,\n * });\n *\n * const grid = document.querySelector('ore-datagrid');\n * grid.source = source;\n * ```\n */\nexport type DataGridSource<T = Record<string, unknown>> = {\n  /** Current page of items. Updated reactively after each fetch or patch. */\n  readonly current: readonly T[];\n  /** Navigate to a specific 1-indexed page number. */\n  goTo?(page: number): Promise<void>;\n  /** Pagination and loading metadata. */\n  readonly meta: {\n    readonly error: { message: string } | null;\n    readonly isLoading: boolean;\n    readonly pageCount: number;\n    readonly pageNumber: number;\n    readonly pageSize: number;\n    readonly totalItems: number;\n  };\n  /** Navigate to the next page. No-op when on the last page. */\n  next?(): Promise<void>;\n  /** Navigate to the previous page. No-op when on the first page. */\n  prev?(): Promise<void>;\n  /** Debounced text search. No-op when not implemented by the source. */\n  search?(query: string, opts?: { immediate?: boolean }): Promise<void>;\n  /** Subscribe to source updates. Returns an unsubscribe function. */\n  subscribe(listener: () => void): () => void;\n};\n\nexport const DATAGRID_TAG = 'ore-datagrid' as const;\n\ndefine<OreDataGridProps, OreDataGridEvents>(DATAGRID_TAG, {\n  props: {\n    activeView: prop.string(),\n    density: prop.string<'compact' | 'cozy' | 'comfortable'>(),\n    ...disablableBundle,\n    ...loadableBundle,\n    columns: prop.data<DataGridColumn[]>(),\n    emptyText: prop.string('No data'),\n    expandable: prop.bool(false),\n    filterOptions: prop.data<FilterOption[]>(),\n    fullwidth: prop.bool(false),\n    getRowKey: prop.data<(row: Record<string, unknown>) => string>(),\n    label: prop.string(),\n    pageSize: prop.number(10),\n    pageSizeOptions: prop.data<number[]>(),\n    rows: prop.data<Record<string, unknown>[]>(),\n    searchLabel: prop.data<[string, string]>(),\n    searchPlaceholder: prop.string('Search…'),\n    selectedKeys: prop.data<string[]>(),\n    selectionMode: prop.string<SelectionMode>('none'),\n    sortMode: prop.string<SortMode>('client'),\n    source: prop.data<DataGridSource>(),\n    striped: prop.bool(false),\n    views: prop.data<DataGridView[]>(),\n  },\n\n  setup(props, { el, emit, onCleanup, onMounted, slots }) {\n    const isDisabled = computed(() => props.disabled.value === true);\n    const selectionMode = computed(() => props.selectionMode.value ?? 'none');\n\n    // ── Row expansion (hoisted — needed by checkOffset + effectiveColCount) ──\n    const expandedKeys = signal(new Set<string>());\n\n    // resolvedColumns is declared further below; this callback is lazy and only\n    // evaluates when .value is first read (after setup completes), so the\n    // forward closure reference is safe at runtime.\n    const hasExpander = computed(\n      () =>\n        props.expandable.value === true && resolvedColumns.value.some((c) => typeof c.renderExpanded === 'function'),\n    );\n\n    const checkOffset = computed(() => (selectionMode.value === 'multi' ? 1 : 0));\n\n    // ── Page size ────────────────────────────────────────────────────────\n    // Signal driven by the `page-size` prop. Stays in sync with prop changes\n    // so consumers can set grid.pageSize = n reactively after mount.\n    // The per-page size selector also writes to this signal directly.\n    const pageSize = signal<number>(props.pageSize.value ?? 10);\n\n    watch(props.pageSize, (n) => {\n      if (n != null) pageSize.value = n;\n    });\n\n    // ── Declarative ore-column children ─────────────────────────────────────\n    // A writable signal holding columns parsed from <ore-column> children.\n    // Updated on mount and whenever children change. The JS `columns` prop\n    // takes precedence when explicitly set (non-empty).\n    const declarativeColumns = signal<DataGridColumn[]>([]);\n\n    onMounted(() => {\n      declarativeColumns.value = parseColumnChildren(el);\n\n      const columnObserver = new MutationObserver(() => {\n        declarativeColumns.value = parseColumnChildren(el);\n      });\n\n      columnObserver.observe(el, {\n        attributeFilter: COLUMN_OBSERVED_ATTRS as unknown as string[],\n        attributes: true,\n        childList: true,\n        subtree: true,\n      });\n\n      return () => columnObserver.disconnect();\n    });\n\n    // Resolved columns: prop wins when explicitly set (even to []); undefined = not set → use declarative children.\n    const resolvedColumns = computed<DataGridColumn[]>(() => {\n      const propCols = props.columns.value;\n\n      return propCols !== undefined ? propCols : declarativeColumns.value;\n    });\n\n    // ── Key resolution ─────────────────────────────────────────────────────────\n    // Reads getRowKey prop dynamically so changes after mount are reflected.\n\n    const resolveKey = (item: Record<string, unknown>): string => {\n      const fn = props.getRowKey.value;\n\n      if (fn) return fn(item);\n\n      const id = item['id'];\n\n      if (id == null) {\n        warn('ore-datagrid: row missing `id` — keys will collide. Provide `getRowKey` or add a unique `id` field.');\n\n        return `__missing_${Math.random().toString(36).slice(2)}`;\n      }\n\n      return String(id);\n    };\n\n    // ── Controls (search, filter, column visibility) ──────────────────────────\n    // Extracted into a dedicated headless module so this scope stays focused\n    // on table rendering machinery.\n\n    const controls = createDataGridControls({\n      columns: resolvedColumns,\n      filterOptions: props.filterOptions,\n      rows: computed(() => props.rows.value ?? []),\n    });\n\n    const debouncedSearch = debounce((q: unknown) => {\n      // `debounce`'s generic constraint requires the parameter type to accept `unknown`;\n      // the only call site below always passes the search input's string value.\n      const query = q as string;\n      const src = props.source.value;\n\n      if (src?.search) void src.search(query);\n      else controls.setSearchQuery(query);\n    }, 250);\n\n    // ── Reactive source bridge ────────────────────────────────────────────────\n    // When `source` is provided it drives rows, pagination, and search.\n    // The `rows` prop and client-side filter pipeline are bypassed.\n\n    type SourceMetaState = {\n      error: { message: string } | null;\n      isLoading: boolean;\n      pageCount: number;\n      pageNumber: number;\n      pageSize: number;\n      totalItems: number;\n    };\n\n    const hasSource = computed(() => props.source.value != null);\n    const sourceItems = signal<Record<string, unknown>[]>([]);\n    const sourceMeta = signal<SourceMetaState>({\n      error: null,\n      isLoading: false,\n      pageCount: 1,\n      pageNumber: 1,\n      pageSize: pageSize.value,\n      totalItems: 0,\n    });\n\n    let _sourceUnsub: (() => void) | null = null;\n\n    onCleanup(() => {\n      _sourceUnsub?.();\n      _sourceUnsub = null;\n    });\n\n    watch(\n      props.source,\n      (src) => {\n        _sourceUnsub?.();\n        _sourceUnsub = null;\n\n        if (!src) {\n          sourceItems.value = [];\n          sourceMeta.value = {\n            error: null,\n            isLoading: false,\n            pageCount: 1,\n            pageNumber: 1,\n            pageSize: pageSize.value,\n            totalItems: 0,\n          };\n\n          return;\n        }\n\n        const update = (): void => {\n          sourceItems.value = src.current as Record<string, unknown>[];\n          sourceMeta.value = src.meta as SourceMetaState;\n        };\n\n        update();\n        _sourceUnsub = src.subscribe(update);\n      },\n      { immediate: true },\n    );\n\n    // Items fed to ctrl: source.current when source is active, filtered rows otherwise.\n    const itemsForCtrl = computed<Record<string, unknown>[]>(() =>\n      hasSource.value ? sourceItems.value : controls.filteredRows.value,\n    );\n\n    // ── Headless control ──────────────────────────────────────────────────────\n\n    const ctrl: DataGridControl = createDataGridControl({\n      columns: () => resolvedColumns.value,\n      getRowKey: resolveKey,\n      items: itemsForCtrl,\n      onSelectionChange: (keys: Set<string>) => {\n        emit('selection-change', { keys: [...keys], rows: ctrl.selectedRows.value as Record<string, unknown>[] });\n      },\n      onSortChange: (sort) => {\n        emit('sort-change', sort);\n      },\n      pageSize: () => (hasSource.value ? 0 : pageSize.value),\n      selectionMode: () => selectionMode.value,\n      signal: lifecycleSignal(onCleanup),\n    });\n\n    // ── Sync external selected-keys prop into ctrl ────────────────────────────\n\n    watch(\n      props.selectedKeys,\n      (keys) => {\n        if (Array.isArray(keys)) ctrl.setSelection(new Set(keys));\n      },\n      { immediate: true },\n    );\n\n    // ── Column resize (F4) ───────────────────────────────────────────────────\n    // Stores user-dragged widths as { key → px } so they survive re-renders.\n    // Only columns with `resizable: true` get a drag handle.\n\n    const colWidths = signal<Record<string, number>>({});\n\n    const createColResizeHandler =\n      (key: string, th: HTMLElement): ((e: PointerEvent) => void) =>\n      (e: PointerEvent): void => {\n        e.preventDefault();\n\n        const startX = e.clientX;\n        const startW = th.getBoundingClientRect().width;\n        // AbortController ensures listeners are removed even if the component\n        // is destroyed mid-drag (e.g. during SPA navigation).\n        const ac = new AbortController();\n        const { signal: sig } = ac;\n\n        window.addEventListener(\n          'pointermove',\n          (mv: PointerEvent) => {\n            colWidths.value = { ...colWidths.value, [key]: Math.max(40, startW + mv.clientX - startX) };\n          },\n          { signal: sig },\n        );\n\n        window.addEventListener('pointerup', () => ac.abort(), { signal: sig });\n      };\n\n    // ── Visible columns (respects hide/show from column menu) ────────────────\n\n    const visibleColumns = computed<DataGridColumn[]>(() =>\n      resolvedColumns.value.filter((c) => !controls.hiddenColumns.value.has(c.key)),\n    );\n\n    // ── Cell value helper ────────────────────────────────────────────────────\n\n    const getCellValue = (col: DataGridColumn, item: Record<string, unknown>): string => {\n      if (col.cell) return col.cell(item);\n\n      const v = item[col.key];\n\n      return v == null ? '' : String(v);\n    };\n\n    // B4: reactive page reset — any change to the filtered result set resets to page 0.\n    // Removes the need to call ctrl.goToPage(0) manually in every event handler.\n    watch(controls.filteredRows, () => ctrl.goToPage(0), { immediate: false });\n\n    // ── Pagination handlers ───────────────────────────────────────────────────\n\n    function handlePage(direction: 'next' | 'prev'): void {\n      const src = props.source.value;\n\n      if (src) {\n        if (direction === 'prev') void src.prev?.();\n        else void src.next?.();\n\n        return;\n      }\n\n      // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n      direction === 'prev' ? ctrl.prevPage() : ctrl.nextPage();\n      emit('page-change', { pageIndex: ctrl.pageIndex.value, pageSize: pageSize.value });\n    }\n\n    // ── Select-all helpers ────────────────────────────────\n\n    const isSomeSelected = computed(() => {\n      const page = ctrl.currentPageItems.value;\n\n      if (!page.length || ctrl.isAllSelected()) return false;\n\n      return page.some((item) => ctrl.selectedKeys.value.has(resolveKey(item as Record<string, unknown>)));\n    });\n\n    // ── Column count (used in keyboard nav + empty colspan) ───────────────────\n\n    const effectiveColCount = computed(\n      () => visibleColumns.value.length + (selectionMode.value === 'multi' ? 1 : 0) + (hasExpander.value ? 1 : 0),\n    );\n\n    // ── Pagination info text ──────────────────────────────────────────────────\n\n    const paginationEnabled = computed(() => {\n      if (hasSource.value) return sourceMeta.value.pageCount > 1;\n\n      return pageSize.value > 0;\n    });\n\n    const paginationInfo = computed(() => {\n      if (hasSource.value) {\n        const { pageNumber, pageSize: pSize, totalItems } = sourceMeta.value;\n        const safePSize = Math.max(1, pSize);\n\n        if (!paginationEnabled.value) return `${totalItems} row${totalItems !== 1 ? 's' : ''}`;\n\n        if (totalItems === 0) return '0 to 0 of 0';\n\n        const start = (pageNumber - 1) * safePSize + 1;\n        const end = Math.min(start + safePSize - 1, totalItems);\n\n        return `${start} to ${end} of ${totalItems}`;\n      }\n\n      const total = ctrl.totalItems.value;\n\n      if (!paginationEnabled.value) return `${total} row${total !== 1 ? 's' : ''}`;\n\n      if (total === 0) return '0 to 0 of 0';\n\n      const start = ctrl.pageIndex.value * pageSize.value + 1;\n      const end = Math.min(start + pageSize.value - 1, total);\n\n      return `${start} to ${end} of ${total}`;\n    });\n\n    // ── Source-aware loading and pagination helpers ───────────────────────────\n\n    const isLoading = computed(() => props.loading.value === true || (hasSource.value && sourceMeta.value.isLoading));\n\n    const effectiveHasPrev = computed(() =>\n      hasSource.value ? sourceMeta.value.pageNumber > 1 : ctrl.hasPrevPage.value,\n    );\n\n    const effectiveHasNext = computed(() =>\n      hasSource.value ? sourceMeta.value.pageNumber < sourceMeta.value.pageCount : ctrl.hasNextPage.value,\n    );\n\n    const effectivePageLabel = computed(() => {\n      if (hasSource.value) {\n        return sourceMeta.value.totalItems === 0\n          ? '0 / 0'\n          : `${sourceMeta.value.pageNumber} / ${sourceMeta.value.pageCount}`;\n      }\n\n      return `${ctrl.pageIndex.value + 1} / ${ctrl.pageCount.value}`;\n    });\n\n    // ── Density toggle (E5) ──────────────────────────────────────────────────\n    // Local signal so the toolbar button can cycle density without requiring\n    // the consumer to wire up an external prop. Stays in sync with the `density`\n    // prop: prop changes win; button clicks write back to the host attribute so\n    // the CSS layer picks them up immediately.\n\n    type Density = 'compact' | 'cozy' | 'comfortable';\n\n    const DENSITY_CYCLE: Density[] = ['compact', 'cozy', 'comfortable'];\n    const DENSITY_ICONS: Record<Density, string> = {\n      comfortable: 'rows-2',\n      compact: 'rows-4',\n      cozy: 'rows-3',\n    };\n    const DENSITY_LABELS: Record<Density, string> = {\n      comfortable: 'Density: Comfortable',\n      compact: 'Density: Compact',\n      cozy: 'Density: Cozy',\n    };\n\n    const densitySignal = signal<Density>(props.density.value ?? 'cozy');\n\n    watch(props.density, (d) => {\n      if (d) densitySignal.value = d;\n    });\n\n    const cycleDensity = (): void => {\n      const idx = DENSITY_CYCLE.indexOf(densitySignal.value);\n      const next = DENSITY_CYCLE[(idx + 1) % DENSITY_CYCLE.length]!;\n\n      densitySignal.value = next;\n      el.setAttribute('density', next);\n      emit('density-change', { density: next });\n    };\n\n    // ── Filter badge hover state ────────────────────────────────────────────\n    // Drives the dot↔count toggle on the filter toolbar badge: dot at rest,\n    // count on hover/focus so the number is revealed on interaction only.\n    const filterBadgeActive = signal(false);\n\n    // ── Row expansion (toggle handler) ───────────────────────────────────────\n\n    const toggleExpand = (key: string): void => {\n      const next = new Set(expandedKeys.value);\n      const expanded = !next.has(key);\n\n      // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n      expanded ? next.add(key) : next.delete(key);\n      expandedKeys.value = next;\n      emit('row-expand', { expanded, key });\n    };\n\n    // ── Keyboard cell navigation (roving tabindex — extracted to datagrid-nav.ts) ──\n    // navHandle is initialised with a real sentinel signal so the first render\n    // produces correct tabindex values (row=0, col=0 → '0') before onMounted.\n    // onMounted replaces it with the live handle from createGridNav.\n\n    let navHandle: GridNavHandle = {\n      activeCell: signal({ col: 0, row: 0 }),\n      focusCell: () => {},\n    };\n\n    onMounted(() => {\n      const shadow = el.shadowRoot!;\n      const table = shadow.querySelector<HTMLElement>('.dg-table');\n\n      if (!table) return;\n\n      const { cleanup, handle } = createGridNav(table, shadow);\n\n      navHandle = handle;\n\n      return cleanup;\n    });\n\n    // Expose programmatic focusCell API on the host element (F6)\n    (el as HTMLElement & { focusCell: (pos: { col: number; row: number }) => void }).focusCell = (pos) =>\n      navHandle.focusCell(pos);\n\n    // ── Render helpers ────────────────────────────────────────────────────────\n    // Each helper renders one self-contained region, closing only over the\n    // signals it actually needs. This keeps the root template readable.\n\n    const renderViewTabs = (): unknown => {\n      const views = props.views.value ?? [];\n      const activeId = props.activeView.value;\n\n      return html`<div\n        class=\"dg-tabs\"\n        role=\"tablist\"\n        aria-label=\"Views\"\n        aria-controls=\"dg-tabpanel\"\n        @keydown=\"${(e: KeyboardEvent) => {\n          if (!['ArrowLeft', 'ArrowRight', 'Home', 'End'].includes(e.key)) return;\n\n          const tabs = Array.from((e.currentTarget as HTMLElement).querySelectorAll('.dg-tab'));\n          const activeIdx = tabs.findIndex((t) => t.classList.contains('dg-tab--active'));\n\n          let nextIdx = activeIdx;\n\n          if (e.key === 'ArrowLeft') nextIdx = Math.max(0, activeIdx - 1);\n          else if (e.key === 'ArrowRight') nextIdx = Math.min(tabs.length - 1, activeIdx + 1);\n          else if (e.key === 'Home') nextIdx = 0;\n          else if (e.key === 'End') nextIdx = tabs.length - 1;\n\n          if (nextIdx !== activeIdx) {\n            e.preventDefault();\n\n            const nextTab = tabs[nextIdx] as HTMLElement;\n\n            nextTab.focus();\n            nextTab.click();\n          }\n        }}\">\n        ${views.map(\n          (view) =>\n            html`<ore-button\n              class=\"${() => `dg-tab${activeId === view.id ? ' dg-tab--active' : ''}`}\"\n              role=\"tab\"\n              variant=\"ghost\"\n              rounded=\"full\"\n              size=\"sm\"\n              :tabindex=\"${() => (activeId === view.id ? '0' : '-1')}\"\n              :aria-selected=\"${() => String(activeId === view.id)}\"\n              aria-controls=\"dg-tabpanel\"\n              @click=\"${() => {\n                emit('view-change', { id: view.id, label: view.label });\n              }}\">\n              ${view.label}\n            </ore-button>`,\n        )}\n      </div>`;\n    };\n\n    const renderSortPopover = (): unknown =>\n      html`<ore-popover class=\"dg-action-popover\" placement=\"bottom-end\" label=\"Sort\" style=\"--popover-min-width:18rem\">\n        <ore-button variant=\"ghost\" size=\"sm\" icon-only label=\"Sort\">\n          <ore-icon name=\"arrow-up-down\" size=\"15\" stroke-width=\"1.75\" aria-hidden=\"true\"></ore-icon>\n        </ore-button>\n        <div slot=\"content\" class=\"dg-pop-sort\">\n          <div class=\"dg-pop-header\">\n            <span class=\"dg-pop-title\">Sort by</span>\n            <ore-button\n              class=\"dg-icon-btn\"\n              variant=\"ghost\"\n              size=\"sm\"\n              icon-only\n              label=\"Clear sort\"\n              :disabled=\"${() => ctrl.sortState.value.direction === 'none' || undefined}\"\n              @click=\"${() => ctrl.sortTo('', 'none')}\">\n              <ore-icon name=\"trash-2\" size=\"14\" stroke-width=\"1.75\" aria-hidden=\"true\"></ore-icon>\n            </ore-button>\n          </div>\n          <div class=\"dg-pop-sort-row\">\n            <ore-select\n              class=\"dg-pop-select\"\n              variant=\"flat\"\n              size=\"sm\"\n              rounded=\"lg\"\n              placeholder=\"Property\"\n              fullwidth\n              :value=\"${() => ctrl.sortState.value.key}\"\n              :options=\"${() => resolvedColumns.value.map((c) => ({ label: c.label, value: c.key }))}\"\n              @change=\"${(e: CustomEvent<{ values: string[] }>) => {\n                const key = e.detail.values[0] ?? '';\n                const dir = ctrl.sortState.value.direction === 'none' ? 'asc' : ctrl.sortState.value.direction;\n\n                ctrl.sortTo(key, dir);\n              }}\"></ore-select>\n            <ore-select\n              class=\"dg-pop-dir-select\"\n              variant=\"flat\"\n              size=\"sm\"\n              rounded=\"lg\"\n              fullwidth\n              :disabled=\"${() => !ctrl.sortState.value.key || undefined}\"\n              :value=\"${() => (ctrl.sortState.value.direction === 'none' ? 'asc' : ctrl.sortState.value.direction)}\"\n              :options=\"${() => [\n                { label: 'A → Z', value: 'asc' },\n                { label: 'Z → A', value: 'desc' },\n              ]}\"\n              @change=\"${(e: CustomEvent<{ values: string[] }>) => {\n                if (ctrl.sortState.value.key) {\n                  ctrl.sortTo(ctrl.sortState.value.key, (e.detail.values[0] ?? 'asc') as 'asc' | 'desc');\n                }\n              }}\"></ore-select>\n          </div>\n        </div>\n      </ore-popover>`;\n\n    const renderFilterPopover = (): unknown =>\n      html`<ore-popover\n        class=\"dg-action-popover\"\n        placement=\"bottom-end\"\n        label=\"Filter\"\n        style=\"--popover-min-width:16rem;--popover-max-height:min(90vh,48rem)\">\n        ${() =>\n          controls.filterDefs.value.length\n            ? html`<ore-badge\n                anchor=\"top-end\"\n                color=\"primary\"\n                size=\"xs\"\n                :count=\"${() => (filterBadgeActive.value ? controls.filterDefs.value.length : undefined)}\"\n                :dot=\"${() => !filterBadgeActive.value || undefined}\"\n                :label=\"${() =>\n                  `${controls.filterDefs.value.length} active filter${controls.filterDefs.value.length > 1 ? 's' : ''}`}\"\n                aria-hidden=\"true\"\n                @mouseenter=\"${() => (filterBadgeActive.value = true)}\"\n                @mouseleave=\"${() => (filterBadgeActive.value = false)}\"\n                @focusin=\"${() => (filterBadgeActive.value = true)}\"\n                @focusout=\"${() => (filterBadgeActive.value = false)}\">\n                <ore-button slot=\"target\" variant=\"ghost\" size=\"sm\" icon-only label=\"Filter\">\n                  <ore-icon name=\"filter\" size=\"15\" stroke-width=\"1.75\" aria-hidden=\"true\"></ore-icon>\n                </ore-button>\n              </ore-badge>`\n            : html`<ore-button class=\"dg-icon-btn\" variant=\"ghost\" size=\"sm\" icon-only label=\"Filter\">\n                <ore-icon name=\"filter\" size=\"15\" stroke-width=\"1.75\" aria-hidden=\"true\"></ore-icon>\n              </ore-button>`}\n        <div slot=\"content\" class=\"dg-pop-filter\">\n          <div class=\"dg-pop-header\">\n            <span class=\"dg-pop-title\">Filter by</span>\n            ${() =>\n              controls.filterDefs.value.length\n                ? html`<ore-button\n                    class=\"dg-icon-btn\"\n                    variant=\"ghost\"\n                    size=\"sm\"\n                    icon-only\n                    label=\"Clear all filters\"\n                    @click=\"${() => controls.clearAllFilters()}\">\n                    <ore-icon name=\"trash-2\" size=\"14\" stroke-width=\"1.75\" aria-hidden=\"true\"></ore-icon>\n                  </ore-button>`\n                : html``}\n          </div>\n\n          <!-- Always-visible field picker: select columns to add filter rules -->\n          <div class=\"dg-pop-filter-fields\">\n            <ore-combobox\n              placeholder=\"Add filter…\"\n              multiple\n              fullwidth\n              autoclose\n              :options=\"${() =>\n                resolvedColumns.value.map((col) => ({\n                  label: col.label,\n                  value: col.key,\n                }))}\"\n              :value=\"${() => controls.filterDefs.value.map((f) => f.key)}\"\n              @change=\"${(e: CustomEvent<{ values: string[] }>) => {\n                controls.setActiveFilterKeys(e.detail.values);\n              }}\">\n            </ore-combobox>\n          </div>\n\n          <!-- Active filter rules (appear below the field picker as rules are added) -->\n          <div class=\"dg-pop-filter-rules\" ?hidden=\"${() => !controls.filterDefs.value.length}\">\n            ${() =>\n              controls.filterDefs.value.map(\n                (f) => html`\n                  <div class=\"dg-pop-filter-rule\">\n                    <div class=\"dg-pop-filter-rule-header\">\n                      <span class=\"dg-pop-filter-field\">${f.label}</span>\n                      <ore-select\n                        class=\"dg-pop-filter-op-select\"\n                        variant=\"ghost\"\n                        size=\"sm\"\n                        fullwidth\n                        :value=\"${() => controls.filterValues.value.get(f.key)?.operator ?? 'contains'}\"\n                        :options=\"${() => f.operators ?? []}\"\n                        @change=\"${(e: CustomEvent<{ values: string[] }>) => {\n                          controls.setFilterOperator(f.key, e.detail.values[0] as FilterOperator);\n                        }}\"></ore-select>\n                      <ore-button\n                        class=\"dg-icon-btn\"\n                        variant=\"ghost\"\n                        size=\"sm\"\n                        icon-only\n                        label=\"Remove filter\"\n                        @click=\"${() => controls.removeFilter(f.key)}\">\n                        <ore-icon name=\"trash-2\" size=\"13\" stroke-width=\"1.75\" aria-hidden=\"true\"></ore-icon>\n                      </ore-button>\n                    </div>\n                    <ore-combobox\n                      class=\"dg-filter\"\n                      :placeholder=\"${() => f.label}\"\n                      :options=\"${() => f.options}\"\n                      :value=\"${() => [...(controls.filterValues.value.get(f.key)?.values ?? [])]}\"\n                      :disabled=\"${() => isDisabled.value || undefined}\"\n                      multiple\n                      fullwidth\n                      autoclose\n                      @change=\"${(e: CustomEvent<{ values: string[] }>) => {\n                        controls.setFilter(f.key, e.detail.values);\n                      }}\"></ore-combobox>\n                  </div>\n                `,\n              )}\n          </div>\n        </div>\n      </ore-popover>`;\n\n    const renderColumnMenu = (): unknown =>\n      html`<ore-popover\n        class=\"dg-action-popover\"\n        placement=\"bottom-end\"\n        label=\"Column options\"\n        style=\"--popover-min-width:18rem\">\n        <ore-button class=\"dg-icon-btn\" variant=\"ghost\" size=\"sm\" icon-only label=\"Column options\">\n          <ore-icon name=\"columns-2\" size=\"15\" stroke-width=\"1.75\" aria-hidden=\"true\"></ore-icon>\n        </ore-button>\n        <div slot=\"content\" class=\"dg-pop-col-list\" role=\"menu\" aria-label=\"Column visibility\">\n          ${() =>\n            resolvedColumns.value.map(\n              (col) =>\n                html`<ore-button\n                  class=\"dg-pop-col-item\"\n                  role=\"menuitemcheckbox\"\n                  variant=\"ghost\"\n                  size=\"sm\"\n                  :aria-checked=\"${() => String(!controls.hiddenColumns.value.has(col.key))}\"\n                  @click=\"${() => controls.toggleColumnVisibility(col.key)}\">\n                  <ore-icon\n                    slot=\"prefix\"\n                    :name=\"${() => (controls.hiddenColumns.value.has(col.key) ? 'eye-off' : 'eye')}\"\n                    size=\"13\"\n                    stroke-width=\"2\"\n                    aria-hidden=\"true\"></ore-icon>\n                  ${col.label}\n                </ore-button>`,\n            )}\n        </div>\n      </ore-popover>`;\n\n    // ── Template ──────────────────────────────────────────────────────────────\n\n    return html`\n      <!-- ── Controls Bar ────────────────────────────────────────────────── -->\n      <div class=\"dg-controls\" part=\"controls\">\n        <!-- Left: view tabs -->\n        ${() => renderViewTabs()}\n\n        <!-- Right: Action bar -->\n        <div class=\"dg-actions\">\n          ${() => renderSortPopover()} ${() => renderFilterPopover()} ${() => renderColumnMenu()}\n\n          <!-- Density toggle -->\n          <ore-button\n            class=\"dg-icon-btn\"\n            variant=\"ghost\"\n            size=\"sm\"\n            icon-only\n            :label=\"${() => DENSITY_LABELS[densitySignal.value]}\"\n            @click=\"${cycleDensity}\">\n            <ore-icon\n              :name=\"${() => DENSITY_ICONS[densitySignal.value]}\"\n              size=\"15\"\n              stroke-width=\"1.75\"\n              aria-hidden=\"true\"></ore-icon>\n          </ore-button>\n\n          <span class=\"dg-action-divider\" aria-hidden=\"true\" ?hidden=\"${() => !slots.has('actions').value}\"></span>\n\n          <slot name=\"actions\"></slot>\n\n          <!-- Search toggle: rightmost, expands in-place -->\n          <div class=\"${() => `dg-search${controls.searchActive.value ? ' dg-search--open' : ''}`}\">\n            ${() =>\n              controls.searchActive.value\n                ? html`<ore-input\n                    class=\"dg-search-input\"\n                    type=\"search\"\n                    variant=\"flat\"\n                    size=\"sm\"\n                    rounded=\"full\"\n                    :placeholder=\"${() => props.searchPlaceholder.value ?? 'Search…'}\"\n                    :disabled=\"${() => isDisabled.value || undefined}\"\n                    ref=\"${(inputEl: HTMLElement | null) => {\n                      if (inputEl) requestAnimationFrame(() => (inputEl as HTMLElement).focus());\n                    }}\"\n                    @input=\"${(e: CustomEvent<{ value: string }>) => {\n                      debouncedSearch(e.detail.value);\n                    }}\"\n                    @keydown=\"${(e: KeyboardEvent) => {\n                      if (e.key === 'Escape') {\n                        const src = props.source.value;\n\n                        if (src?.search) void src.search('');\n\n                        controls.toggleSearch();\n                      }\n                    }}\">\n                    <ore-icon slot=\"prefix\" name=\"search\" size=\"13\" stroke-width=\"1.75\" aria-hidden=\"true\"></ore-icon>\n                  </ore-input>`\n                : html``}\n            <ore-button\n              variant=\"ghost\"\n              size=\"sm\"\n              icon-only\n              :label=\"${() => {\n                const [open, close] = props.searchLabel.value ?? ['Search', 'Close search'];\n\n                return controls.searchActive.value ? close : open;\n              }}\"\n              @click=\"${() => {\n                const src = props.source.value;\n\n                if (src?.search && controls.searchActive.value) void src.search('');\n\n                controls.toggleSearch();\n              }}\">\n              <ore-icon\n                :name=\"${() => (controls.searchActive.value ? 'x' : 'search')}\"\n                size=\"15\"\n                stroke-width=\"1.75\"\n                aria-hidden=\"true\"></ore-icon>\n            </ore-button>\n          </div>\n        </div>\n      </div>\n\n      <div id=\"dg-tabpanel\" class=\"dg-scroll\" role=\"tabpanel\" aria-label=\"Data\">\n        <div class=\"dg-loading-overlay\">\n          <ore-icon name=\"loader-2\" size=\"24\" class=\"dg-spin\" aria-hidden=\"true\"></ore-icon>\n        </div>\n        <table\n          class=\"dg-table\"\n          part=\"table\"\n          role=\"grid\"\n          :aria-label=\"${() => props.label.value ?? undefined}\"\n          :aria-busy=\"${() => (isLoading.value ? 'true' : null)}\"\n          :aria-disabled=\"${() => (isDisabled.value ? 'true' : null)}\">\n          <!-- Head -->\n          <thead class=\"dg-head\" part=\"thead\">\n            <tr role=\"row\">\n              ${() =>\n                selectionMode.value === 'multi'\n                  ? html`<th\n                      class=\"dg-th dg-th-check\"\n                      role=\"columnheader\"\n                      scope=\"col\"\n                      :tabindex=\"${() =>\n                        navHandle.activeCell.value.row === 0 &&\n                        navHandle.activeCell.value.col === 0 &&\n                        checkOffset.value >= 1\n                          ? '0'\n                          : '-1'}\">\n                      <ore-checkbox\n                        class=\"dg-check\"\n                        :checked=\"${() => ctrl.isAllSelected()}\"\n                        :indeterminate=\"${isSomeSelected}\"\n                        ?disabled=\"${isDisabled}\"\n                        aria-label=\"Select all rows on this page\"\n                        @change=\"${() => {\n                          if (!isDisabled.value) ctrl.selectAll();\n                        }}\"></ore-checkbox>\n                    </th>`\n                  : html``}\n              ${() =>\n                visibleColumns.value.map((col: DataGridColumn, colIdx: number) => {\n                  const isLast = colIdx === visibleColumns.value.length - 1;\n\n                  return html`<th\n                    class=\"${`dg-th${isLast && hasExpander.value ? ' dg-th-last' : ''}`}\"\n                    role=\"columnheader\"\n                    scope=\"col\"\n                    :tabindex=\"${() => {\n                      const ac = navHandle.activeCell.value;\n\n                      return ac.row === 0 && ac.col === colIdx + checkOffset.value ? '0' : '-1';\n                    }}\"\n                    data-align=\"${col.align ?? 'left'}\"\n                    :aria-sort=\"${() => (col.sortable ? ariaSortValue(ctrl.sortState.value, col.key) : undefined)}\"\n                    :aria-label=\"${col.sortable ? undefined : (col.headerLabel ?? col.label)}\"\n                    :style=\"${() => {\n                      const dragged = colWidths.value[col.key];\n\n                      return dragged ? `width:${dragged}px` : col.width ? `width:${col.width}` : '';\n                    }}\">\n                    <div class=\"dg-th-inner\">\n                      ${() =>\n                        col.sortable\n                          ? html`<ore-button\n                              class=\"dg-sort-btn\"\n                              variant=\"text\"\n                              size=\"sm\"\n                              fullwidth\n                              :label=\"${col.headerLabel ?? col.label}\"\n                              :disabled=\"${() => isDisabled.value || undefined}\"\n                              @click=\"${() => {\n                                if (!isDisabled.value) ctrl.sortBy(col.key);\n                              }}\">\n                              ${col.label}\n                              <ore-icon\n                                slot=\"suffix\"\n                                class=\"dg-sort-icon\"\n                                :name=\"${() => sortIconName(ctrl.sortState.value, col.key)}\"\n                                size=\"14\"\n                                stroke-width=\"2\"></ore-icon>\n                            </ore-button>`\n                          : col.label}\n                      ${\n                        col.resizable\n                          ? html`<span\n                              class=\"dg-col-resize\"\n                              aria-hidden=\"true\"\n                              ref=\"${(handleEl: HTMLElement | null) => {\n                                if (!handleEl) return;\n\n                                const th = handleEl.closest('th') as HTMLElement | null;\n\n                                if (th) handleEl.addEventListener('pointerdown', createColResizeHandler(col.key, th));\n                              }}\"></span>`\n                          : html``\n                      }\n                    </div>\n                  </th>`;\n                })}\n              ${() =>\n                hasExpander.value\n                  ? html`<th\n                      class=\"dg-th dg-th-expand\"\n                      role=\"columnheader\"\n                      scope=\"col\"\n                      aria-label=\"Row details\"\n                      tabindex=\"-1\"></th>`\n                  : html``}\n            </tr>\n          </thead>\n\n          <!-- Body -->\n          <tbody class=\"dg-body\" part=\"tbody\">\n            ${() =>\n              ctrl.currentPageItems.value.length === 0\n                ? html`<tr role=\"row\">\n                    <td class=\"dg-empty\" role=\"gridcell\" :colspan=\"${() => String(effectiveColCount.value)}\">\n                      <div class=\"dg-empty-content\">\n                        ${() => props.emptyText.value ?? 'No data'}\n                        ${() =>\n                          controls.searchQuery.value || controls.filterValues.value.size\n                            ? html`<div class=\"dg-empty-actions\">\n                                <ore-button\n                                  variant=\"text\"\n                                  size=\"sm\"\n                                  @click=\"${() => {\n                                    controls.resetSearch();\n                                    controls.resetFilters();\n                                  }}\">\n                                  Clear all filters & search\n                                </ore-button>\n                              </div>`\n                            : html``}\n                      </div>\n                    </td>\n                  </tr>`\n                : ctrl.currentPageItems.value.map((item: Record<string, unknown>, itemIdx: number) => {\n                    const key = resolveKey(item);\n                    const isSelectable = selectionMode.value !== 'none' && !isDisabled.value;\n                    const rowIdx = itemIdx + 1;\n\n                    return html`<tr\n                        class=\"dg-tr\"\n                        part=\"row\"\n                        role=\"row\"\n                        :aria-selected=\"${() =>\n                          selectionMode.value !== 'none' ? String(ctrl.selectedKeys.value.has(key)) : null}\"\n                        :aria-expanded=\"${() => (hasExpander.value ? String(expandedKeys.value.has(key)) : null)}\"\n                        ?data-selectable=\"${isSelectable}\"\n                        ?data-disabled=\"${isDisabled}\"\n                        @click=\"${() => {\n                          if (isSelectable && selectionMode.value === 'single') ctrl.toggleRow(key);\n                        }}\"\n                        @keydown=\"${(e: KeyboardEvent) => {\n                          if (\n                            (e.key === 'Enter' || e.key === ' ') &&\n                            isSelectable &&\n                            selectionMode.value === 'single'\n                          ) {\n                            e.preventDefault();\n                            ctrl.toggleRow(key);\n                          }\n                        }}\">\n                        ${() =>\n                          selectionMode.value === 'multi'\n                            ? html`<td\n                                class=\"dg-td dg-td-check\"\n                                role=\"gridcell\"\n                                :tabindex=\"${() => {\n                                  const ac = navHandle.activeCell.value;\n\n                                  return ac.row === rowIdx && ac.col === 0 ? '0' : '-1';\n                                }}\"\n                                @keydown=\"${(e: KeyboardEvent) => {\n                                  if (e.key === 'Enter' || e.key === ' ') {\n                                    e.preventDefault();\n\n                                    if (!isDisabled.value) ctrl.toggleRow(key);\n                                  }\n                                }}\">\n                                <ore-checkbox\n                                  class=\"dg-check\"\n                                  :checked=\"${() => ctrl.selectedKeys.value.has(key)}\"\n                                  ?disabled=\"${isDisabled}\"\n                                  aria-label=\"Select row\"\n                                  tabindex=\"-1\"\n                                  @click=\"${(e: MouseEvent) => e.stopPropagation()}\"\n                                  @change=\"${() => {\n                                    if (!isDisabled.value) ctrl.toggleRow(key);\n                                  }}\"></ore-checkbox>\n                              </td>`\n                            : html``}\n                        ${visibleColumns.value.map((col: DataGridColumn, colIdx: number) => {\n                          const value = getCellValue(col, item as Record<string, unknown>);\n\n                          const isLastCol = colIdx === visibleColumns.value.length - 1;\n\n                          return html`<td\n                            class=\"${`dg-td${isLastCol && hasExpander.value ? ' dg-td-last' : ''}`}\"\n                            part=\"cell\"\n                            role=\"gridcell\"\n                            data-align=\"${col.align ?? 'left'}\"\n                            :tabindex=\"${() => {\n                              const ac = navHandle.activeCell.value;\n\n                              return ac.row === rowIdx && ac.col === colIdx + checkOffset.value ? '0' : '-1';\n                            }}\"\n                            :title=\"${value}\">\n                            ${value}\n                          </td>`;\n                        })}\n                        ${() =>\n                          hasExpander.value\n                            ? html`<td\n                                class=\"dg-td dg-td-expand\"\n                                role=\"gridcell\"\n                                :tabindex=\"${() => {\n                                  const ac = navHandle.activeCell.value;\n\n                                  return ac.row === rowIdx && ac.col === effectiveColCount.value - 1 ? '0' : '-1';\n                                }}\"\n                                @keydown=\"${(e: KeyboardEvent) => {\n                                  if (e.key === 'Enter' || e.key === ' ') {\n                                    e.preventDefault();\n\n                                    if (!isDisabled.value) toggleExpand(key);\n                                  }\n                                }}\">\n                                <ore-button\n                                  class=\"dg-expand-btn\"\n                                  variant=\"ghost\"\n                                  size=\"sm\"\n                                  icon-only\n                                  tabindex=\"-1\"\n                                  :label=\"${() => (expandedKeys.value.has(key) ? 'Collapse row' : 'Expand row')}\"\n                                  :aria-expanded=\"${() => String(expandedKeys.value.has(key))}\"\n                                  :disabled=\"${() => isDisabled.value || undefined}\"\n                                  @click=\"${(e: MouseEvent) => {\n                                    e.stopPropagation();\n\n                                    if (!isDisabled.value) toggleExpand(key);\n                                  }}\">\n                                  <ore-icon\n                                    :name=\"${() => (expandedKeys.value.has(key) ? 'chevron-up' : 'chevron-down')}\"\n                                    size=\"14\"\n                                    stroke-width=\"2\"\n                                    aria-hidden=\"true\"></ore-icon>\n                                </ore-button>\n                              </td>`\n                            : html``}\n                      </tr>\n                      ${() =>\n                        hasExpander.value && expandedKeys.value.has(key)\n                          ? html`<tr class=\"dg-tr-expanded\" role=\"row\">\n                              <td\n                                class=\"dg-td-expanded\"\n                                role=\"gridcell\"\n                                :colspan=\"${() => String(effectiveColCount.value)}\">\n                                ${\n                                  // Routed through raw() (not a bare innerHTML= write) so it\n                                  // participates in the app's registered setRawSanitizer() and\n                                  // the dev-mode unsanitized-HTML warning — see the @security\n                                  // note above: consumers are still responsible for sanitizing\n                                  // any row-derived content their renderExpanded returns.\n                                  raw(() => {\n                                    const renderer = resolvedColumns.value.find(\n                                      (c) => typeof c.renderExpanded === 'function',\n                                    );\n\n                                    return renderer?.renderExpanded?.(item) ?? '';\n                                  })\n                                }\n                              </td>\n                            </tr>`\n                          : html``} `;\n                  })}\n          </tbody>\n        </table>\n      </div>\n\n      <!-- Footer / Pagination -->\n      ${() =>\n        paginationEnabled.value\n          ? html`<div class=\"dg-footer\" part=\"footer\" role=\"navigation\" aria-label=\"Pagination\">\n              ${() =>\n                !(props.pageSizeOptions.value ?? []).length\n                  ? html`<span class=\"dg-footer-info\" dir=\"ltr\" aria-live=\"polite\" aria-atomic=\"true\"\n                      >${paginationInfo}</span\n                    >`\n                  : html``}\n              <div class=\"dg-footer-end\">\n                ${() => {\n                  const opts = props.pageSizeOptions.value ?? [];\n\n                  return opts.length\n                    ? html`<div class=\"dg-page-size-wrap\">\n                        <ore-select\n                          class=\"dg-page-size-select\"\n                          fullwidth\n                          aria-label=\"Rows per page\"\n                          :value=\"${() => String(pageSize.value)}\"\n                          :options=\"${() => opts.map((n) => ({ label: String(n), value: String(n) }))}\"\n                          :disabled=\"${() => isDisabled.value || undefined}\"\n                          @change=\"${(e: CustomEvent<{ values: string[] }>) => {\n                            const n = parseInt(e.detail.values[0], 10);\n\n                            if (!isNaN(n)) {\n                              pageSize.value = n;\n                              ctrl.goToPage(0);\n                              emit('page-change', { pageIndex: 0, pageSize: n });\n                            }\n                          }}\"></ore-select>\n                      </div>`\n                    : html``;\n                }}\n                <div class=\"dg-pagination\" role=\"group\" aria-label=\"Page navigation\">\n                  <ore-button\n                    class=\"dg-page-btn\"\n                    variant=\"ghost\"\n                    size=\"sm\"\n                    icon-only\n                    label=\"Previous page\"\n                    :disabled=\"${() => !effectiveHasPrev.value || isDisabled.value}\"\n                    @click=\"${() => handlePage('prev')}\">\n                    <ore-icon name=\"chevron-left\" size=\"14\" stroke-width=\"2\" aria-hidden=\"true\"></ore-icon>\n                  </ore-button>\n                  <span\n                    class=\"dg-page-label\"\n                    dir=\"ltr\"\n                    aria-current=\"page\"\n                    role=\"status\"\n                    aria-live=\"polite\"\n                    aria-atomic=\"true\">\n                    ${() => effectivePageLabel.value}\n                  </span>\n                  <ore-button\n                    class=\"dg-page-btn\"\n                    variant=\"ghost\"\n                    size=\"sm\"\n                    icon-only\n                    label=\"Next page\"\n                    :disabled=\"${() => !effectiveHasNext.value || isDisabled.value}\"\n                    @click=\"${() => handlePage('next')}\">\n                    <ore-icon name=\"chevron-right\" size=\"14\" stroke-width=\"2\" aria-hidden=\"true\"></ore-icon>\n                  </ore-button>\n                </div>\n              </div>\n            </div>`\n          : html``}\n    `;\n  },\n\n  shadow: { delegatesFocus: true },\n  styles: [tableBaseMixin('datagrid'), componentStyles],\n});\n"],"mappings":"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"}