npm - @helixui/library - Versions diffs - 3.3.1-next.118 → 3.4.0 - Mend

@helixui/library 3.3.1-next.118 → 3.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (249) hide show

package/dist/shared/{hx-data-table-CLqVqdxr.js → hx-data-table-Ct3gQ6ya.js} RENAMED Viewed

@@ -543,13 +543,14 @@ let i = class extends v {
   }
   // ─── Render ───
   render() {
+    const e = this.label.trim();
     return c`
       <slot name="toolbar"></slot>
       <div class="table-wrapper">
         <table
           part="table"
           role="grid"
-          aria-label=${this.label.trim() || "Table"}
+          aria-label=${e || p}
           aria-busy=${this.loading ? "true" : p}
           @keydown=${this._handleKeydown}
         >
@@ -643,4 +644,4 @@ i = n([
 export {
   i as H
 };
-//# sourceMappingURL=hx-data-table-CLqVqdxr.js.map
+//# sourceMappingURL=hx-data-table-Ct3gQ6ya.js.map

package/dist/shared/{hx-data-table-CLqVqdxr.js.map → hx-data-table-Ct3gQ6ya.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"hx-data-table-CLqVqdxr.js","sources":["../../src/components/hx-data-table/hx-data-table.styles.ts","../../src/components/hx-data-table/hx-data-table.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixDataTableStyles = css`\n :host {\n display: block;\n overflow-x: auto;\n font-family: var(--hx-data-table-font-family, var(--hx-font-family-sans, sans-serif));\n font-size: var(--hx-font-size-sm, 0.875rem);\n }\n\n /* ─── Scroll Wrapper ─── /\n\n .table-wrapper {\n min-width: 0;\n width: 100%;\n }\n\n / ─── Table ─── /\n\n table {\n width: 100%;\n border-collapse: collapse;\n border-spacing: 0;\n min-width: var(--hx-data-table-min-width, 600px);\n }\n\n / ─── Head ─── /\n\n thead {\n background-color: var(--hx-data-table-header-bg, var(--hx-color-surface-raised, #f5f8f3));\n }\n\n :host([sticky-header]) thead th {\n position: sticky;\n top: 0;\n z-index: 1;\n background-color: var(--hx-data-table-header-bg, var(--hx-color-surface-raised, #f5f8f3));\n }\n\n / ─── Cells ─── /\n\n th,\n td {\n padding: var(--hx-space-3, 0.75rem) var(--hx-space-4, 1rem);\n text-align: start;\n border-bottom: var(--hx-border-width-thin, 1px) solid\n var(--hx-data-table-border-color, var(--hx-color-border-default, #d6dbd5));\n vertical-align: middle;\n }\n\n th {\n font-weight: var(--hx-font-weight-semibold, 600);\n color: var(--hx-data-table-header-color, var(--hx-color-text-strong, #202b39));\n white-space: nowrap;\n }\n\n td {\n color: var(--hx-data-table-cell-color, var(--hx-color-text-primary, #0d1825));\n }\n\n / ─── Checkbox Column ─── /\n\n th.col-checkbox,\n td.col-checkbox {\n / WCAG 2.5.5 (healthcare mandate): minimum 44x44px touch target /\n width: var(--hx-touch-target-min, 2.75rem);\n min-width: var(--hx-touch-target-min, 2.75rem);\n padding-inline-end: var(--hx-space-2, 0.5rem);\n }\n\n th.col-checkbox {\n text-align: center;\n }\n\n td.col-checkbox {\n text-align: center;\n }\n\n / ─── Sort Button ─── /\n\n .sort-btn {\n display: inline-flex;\n align-items: center;\n gap: var(--hx-space-1, 0.25rem);\n background: none;\n border: none;\n padding: 0;\n font: inherit;\n font-weight: inherit;\n color: inherit;\n cursor: pointer;\n white-space: nowrap;\n }\n\n .sort-btn:focus-visible {\n outline: var(--hx-focus-ring-width, 2px) solid\n var(--hx-data-table-focus-ring-color, var(--hx-focus-ring-color, #0f7078));\n outline-offset: var(--hx-focus-ring-offset, 2px);\n border-radius: var(--hx-border-radius-sm, 2px);\n }\n\n / ─── Sort Icon ─── /\n\n .sort-icon {\n display: inline-flex;\n align-items: center;\n flex-shrink: 0;\n width: 1em;\n height: 1em;\n opacity: var(--hx-opacity-25, 0.25); / sort icon inactive — intentionally subtle /\n transition:\n opacity var(--hx-transition-fast, 150ms ease),\n transform var(--hx-transition-fast, 150ms ease);\n }\n\n .sort-icon--active {\n opacity: var(--hx-opacity-100, 1);\n color: var(--hx-data-table-sort-icon-active-color, var(--hx-color-primary-500, #429797));\n }\n\n .sort-icon--desc {\n transform: rotate(180deg);\n }\n\n / ─── Row States ─── /\n\n tbody tr {\n transition: background-color var(--hx-transition-fast, 150ms ease);\n }\n\n tbody tr:hover {\n background-color: var(--hx-data-table-row-hover-bg, var(--hx-color-surface-raised, #f5f8f3));\n }\n\n tbody tr[aria-selected='true'] {\n background-color: var(--hx-data-table-row-selected-bg, var(--hx-color-primary-50, #ebf8f8));\n }\n\n / ─── Checkbox Input ─── /\n\n input[type='checkbox'] {\n width: var(--hx-size-4, 1rem);\n height: var(--hx-size-4, 1rem);\n cursor: pointer;\n accent-color: var(--hx-data-table-checkbox-accent-color, var(--hx-color-primary-500, #429797));\n }\n\n / ─── Loading Skeleton ─── /\n\n .skeleton-cell {\n display: block;\n height: 1em;\n border-radius: var(--hx-border-radius-sm, 2px);\n / Skeleton shimmer: intentionally primitive so the animation reads the same across all modes. /\n background: linear-gradient(\n 90deg,\n var(--hx-color-neutral-200, #d6dbd5) 25%,\n var(--hx-color-neutral-100, #ebeee9) 50%,\n var(--hx-color-neutral-200, #d6dbd5) 75%\n );\n background-size: 200% 100%;\n animation: hx-shimmer var(--hx-data-table-shimmer-duration, 1.5s) infinite;\n }\n\n @keyframes hx-shimmer {\n 0% {\n background-position: 200% 0;\n }\n 100% {\n background-position: -200% 0;\n }\n }\n\n @media (prefers-reduced-motion: reduce) {\n .skeleton-cell {\n animation: none;\n opacity: var(\n --hx-opacity-50,\n 0.5\n ); / reduced from animation; approximate to available token /\n }\n\n .sort-icon {\n transition: none;\n }\n\n tbody tr {\n transition: none;\n }\n }\n\n / ─── Cell Focus ─── /\n\n td:focus-visible,\n th:focus-visible,\n [part~='td']:focus-visible,\n [part~='th']:focus-visible {\n outline: var(--hx-focus-ring-width, 2px) solid\n var(--hx-data-table-focus-ring-color, var(--hx-focus-ring-color, #0f7078));\n outline-offset: var(--hx-focus-ring-offset, -2px);\n border-radius: var(--hx-border-radius-sm, 2px);\n }\n\n / ─── Empty State ─── /\n\n .empty-cell {\n text-align: center;\n color: var(--hx-data-table-empty-color, var(--hx-color-text-secondary, #313e4b));\n padding: var(--hx-space-8, 2rem) var(--hx-space-4, 1rem);\n }\n\n / ─── Forced Colors (Windows High Contrast) ─── /\n\n @media (forced-colors: active) {\n table {\n border: 1px solid CanvasText;\n }\n\n th,\n td {\n border-bottom-color: CanvasText;\n }\n\n tbody tr[aria-selected='true'] {\n outline: 2px solid Highlight;\n }\n\n .skeleton-cell {\n animation: none;\n border: 1px solid GrayText;\n background: none;\n }\n }\n`;\n","import { html, nothing, type PropertyValues } from 'lit';\nimport '../../utilities/document-token-adoption.js';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { HelixElement } from '../../base/index.js';\nimport { helixDataTableStyles } from './hx-data-table.styles.js';\nimport { forcedColorsSurface } from '../../styles/forced-colors.js';\nimport { devWarn } from '../../utils/dev-warn.js';\n\n/\n Column definition for `hx-data-table`.\n /\nexport interface HxDataTableColumn {\n key: string;\n label: string;\n sortable?: boolean;\n width?: string;\n}\n\n/\n Sort state exported for TypeScript consumers and CEM event types.\n /\nexport interface HxDataTableSortState {\n key: string;\n direction: 'asc' \| 'desc';\n}\n\n/* Detail for the hx-select event dispatched by hx-data-table. /\nexport interface HxDataTableSelectDetail {\n selectedRows: Record<string, unknown>[];\n}\n\n/* Detail for the hx-row-click event dispatched by hx-data-table. /\nexport interface HxDataTableRowClickDetail {\n row: Record<string, unknown>;\n index: number;\n}\n\n/\n An enterprise data table with sorting, row selection, and keyboard navigation.\n \n @summary Enterprise data table with sorting, selection, and responsive scroll.\n \n @tag hx-data-table\n \n @slot toolbar - Content rendered above the table (e.g., search, actions).\n * @slot empty - Custom empty-state content rendered when `rows` is empty and not loading.\n * @slot loading - Custom loading content rendered when `loading` is true.\n \n @fires {CustomEvent<HxDataTableSortState>} hx-sort - Dispatched when a sortable column header is clicked.\n * @fires {CustomEvent<{selectedRows: Record<string, unknown>[]}>} hx-select - Dispatched when row selection changes.\n * @fires {CustomEvent<{row: Record<string, unknown>, index: number}>} hx-row-click - Dispatched when a data row is clicked.\n \n @csspart table - The `<table>` element.\n * @csspart thead - The `<thead>` element.\n * @csspart tbody - The `<tbody>` element.\n * @csspart tr - Each `<tr>` element.\n * @csspart th - Each `<th>` element.\n * @csspart td - Each `<td>` element.\n * @csspart sort-icon - The sort indicator icon `<span>` inside sortable headers.\n * @csspart checkbox - Each `<input type=\"checkbox\">` element.\n \n @cssprop [--hx-data-table-header-bg=var(--hx-color-neutral-50)] - Header background color.\n * @cssprop [--hx-data-table-header-color=var(--hx-color-neutral-700)] - Header text color.\n * @cssprop [--hx-data-table-cell-color=var(--hx-color-neutral-900)] - Cell text color.\n * @cssprop [--hx-data-table-border-color=var(--hx-color-neutral-200)] - Row border color.\n * @cssprop [--hx-data-table-row-hover-bg=var(--hx-color-neutral-50)] - Row hover background.\n * @cssprop [--hx-data-table-row-selected-bg=var(--hx-color-primary-50)] - Selected row background.\n * @cssprop [--hx-data-table-empty-color=var(--hx-color-neutral-600)] - Empty state text color.\n * @cssprop [--hx-data-table-min-width=600px] - Minimum table width before horizontal scrolling.\n * @cssprop [--hx-data-table-font-family=var(--hx-font-family-sans)] - CSS custom property.\n * @cssprop [--hx-data-table-shimmer-duration=1.5s] - CSS custom property.\n * @cssprop [--hx-font-family-sans] - Font family.\n * @cssprop [--hx-font-size-sm] - Font size.\n * @cssprop [--hx-space-3] - Spacing token.\n * @cssprop [--hx-space-4] - Spacing token.\n * @cssprop [--hx-border-width-thin] - Width.\n * @cssprop [--hx-font-weight-semibold] - Font weight.\n * @cssprop [--hx-touch-target-min] - Minimum touch target size.\n * @cssprop [--hx-space-2] - Spacing token.\n * @cssprop [--hx-space-1] - Spacing token.\n * @cssprop [--hx-focus-ring-width] - Width.\n * @cssprop [--hx-focus-ring-color] - Color.\n * @cssprop [--hx-focus-ring-offset] - CSS custom property.\n * @cssprop [--hx-border-radius-sm] - CSS custom property.\n * @cssprop [--hx-opacity-25] - Opacity.\n * @cssprop [--hx-transition-fast] - Transition timing.\n * @cssprop [--hx-opacity-100] - Opacity.\n * @cssprop [--hx-color-primary-500] - Color.\n * @cssprop [--hx-size-4] - Size token.\n * @cssprop [--hx-color-neutral-50] - Color.\n * @cssprop [--hx-color-neutral-200] - Color.\n * @cssprop [--hx-color-neutral-100] - Color.\n * @cssprop [--hx-color-neutral-700] - Color.\n * @cssprop [--hx-color-neutral-900] - Color.\n * @cssprop [--hx-color-neutral-600] - Color.\n * @cssprop [--hx-color-primary-50] - Color.\n * @cssprop [--hx-opacity-50] - Opacity.\n * @cssprop [--hx-space-8] - Spacing token.\n /\n@customElement('hx-data-table')\nexport class HelixDataTable extends HelixElement {\n static override styles = [helixDataTableStyles, forcedColorsSurface];\n\n // ─── Public Properties ───\n\n /\n Column definitions. Each item: `{ key, label, sortable?, width? }`.\n * Can be set as a JS array or a JSON string (e.g., from a Drupal Twig attribute).\n * @attr columns\n /\n @property({\n type: Array,\n converter: {\n fromAttribute(value: string \| null) {\n if (!value) return [];\n try {\n return JSON.parse(value);\n } catch {\n return [];\n }\n },\n },\n })\n columns: HxDataTableColumn[] = [];\n\n /\n Row data. Each item is a plain object keyed by column `key` values.\n * Can be set as a JS array or a JSON string (e.g., from a Drupal Twig attribute).\n * @attr rows\n /\n @property({\n type: Array,\n converter: {\n fromAttribute(value: string \| null) {\n if (!value) return [];\n try {\n return JSON.parse(value);\n } catch {\n return [];\n }\n },\n },\n })\n rows: Record<string, unknown>[] = [];\n\n /\n When true, renders a checkbox column for row selection.\n * @attr selectable\n /\n @property({ type: Boolean, reflect: true })\n selectable = false;\n\n /\n The column key currently used for sorting.\n * @attr sort-key\n /\n @property({ type: String, attribute: 'sort-key' })\n sortKey = '';\n\n /\n Current sort direction.\n * @attr sort-direction\n /\n @property({ type: String, attribute: 'sort-direction' })\n sortDirection: 'asc' \| 'desc' = 'asc';\n\n /\n When true, renders a loading skeleton and sets `aria-busy=\"true\"` on the host.\n * @attr loading\n /\n @property({ type: Boolean, reflect: true })\n loading = false;\n\n /\n Text displayed in the default empty state when `rows` is empty and not loading.\n * @attr empty-label\n /\n @property({ type: String, attribute: 'empty-label' })\n emptyLabel = 'No data';\n\n /\n Accessible name for the table. Exposed via `aria-label` on the `<table>` element.\n * Required when the table has columns — a missing label is a WCAG 4.1.2 violation.\n * @attr label\n /\n @property({ type: String })\n label = '';\n\n /\n Accessible label for the \"select all rows\" checkbox in the table header.\n * @attr select-all-label\n /\n @property({ attribute: 'select-all-label' })\n selectAllLabel = 'Select all rows';\n\n /\n When true, the header row is sticky (position: sticky; top: 0).\n * @attr sticky-header\n /\n @property({ type: Boolean, reflect: true, attribute: 'sticky-header' })\n stickyHeader = false;\n\n /\n Current page (1-based). Set to 0 or leave at default (0) to disable pagination.\n * @attr page\n /\n @property({ type: Number })\n page = 1;\n\n /\n Number of rows per page. Set to 0 to disable pagination (show all rows).\n * @attr page-size\n /\n @property({ type: Number, attribute: 'page-size' })\n pageSize = 0;\n\n // ─── Internal State ───\n\n /* @internal /\n @state()\n private _selectedRows: Set<number> = new Set();\n\n /\n Cached flat list of all td/th cells in the shadow DOM.\n * Invalidated (set to null) whenever rows or columns change so the next keydown\n * re-queries the DOM and re-caches. Avoids repeated querySelectorAll on every keypress.\n * @internal\n /\n private _cachedCells: HTMLElement[] \| null = null;\n\n /\n Index (within the columns array) of the sortable header that currently holds\n * roving tabindex focus. -1 means no sortable header has been focused yet;\n * the first sortable column will receive tabindex=\"0\" by default.\n * @internal\n /\n @state() private _focusedHeaderIndex = -1;\n\n /\n Resolved columns array. Computed in willUpdate from the public `columns`\n * property which may be a JSON string (Drupal/Twig path) or a JS array.\n * All internal reads use this field to avoid mutating reactive properties\n * inside willUpdate (which would trigger extra update cycles).\n * @internal\n /\n @state() private _resolvedColumns: HxDataTableColumn[] = [];\n\n /\n Resolved rows array. Computed in willUpdate from the public `rows`\n * property which may be a JSON string (Drupal/Twig path) or a JS array.\n * @internal\n /\n @state() private _resolvedRows: Record<string, unknown>[] = [];\n\n // ─── Lifecycle ───\n\n override willUpdate(changed: PropertyValues<this>): void {\n // Coerce JSON strings to arrays — this is the Drupal/Twig integration path.\n // Lit does not JSON-parse array attributes automatically, so we do it here.\n // Note: Lit's defaultConverter returns null (not a string) when JSON.parse fails for\n // type: Array — so we guard against both string and any non-array value.\n //\n // We write to private @state() resolved fields instead of mutating the public\n // reactive properties. Mutating @property fields inside willUpdate triggers an\n // additional update cycle; writing to separate @state fields does not because\n // Lit batches all changes within the same willUpdate into a single render.\n if (changed.has('columns')) {\n const rawColumns: unknown = this.columns;\n if (typeof rawColumns === 'string') {\n try {\n this._resolvedColumns = JSON.parse(rawColumns) as HxDataTableColumn[];\n } catch {\n this._resolvedColumns = [];\n }\n } else if (Array.isArray(this.columns)) {\n this._resolvedColumns = this.columns;\n } else {\n this._resolvedColumns = [];\n }\n }\n if (changed.has('rows')) {\n const rawRows: unknown = this.rows;\n if (typeof rawRows === 'string') {\n try {\n this._resolvedRows = JSON.parse(rawRows) as Record<string, unknown>[];\n } catch {\n this._resolvedRows = [];\n }\n } else if (Array.isArray(this.rows)) {\n this._resolvedRows = this.rows;\n } else {\n this._resolvedRows = [];\n }\n }\n // Only warn when rows actually changes to avoid noise on every property update.\n if (changed.has('rows') && this._resolvedRows.length > 500) {\n devWarn(\n 'hx-data-table',\n 'Rendering more than 500 rows may impact performance. Consider server-side pagination.',\n );\n }\n // WCAG 4.1.2: data tables must have an accessible name so screen readers can identify them.\n if (\n (changed.has('label') \|\| changed.has('columns')) &&\n this._resolvedColumns.length > 0 &&\n !this.label\n ) {\n devWarn(\n 'hx-data-table',\n 'No accessible name provided. Set the `label` attribute so screen readers can identify this table (WCAG 4.1.2).',\n );\n }\n }\n\n override updated(changed: PropertyValues<this>): void {\n // Invalidate cell cache when rows or columns change so the next keyboard\n // navigation re-queries and re-caches the updated DOM. We check the public\n // properties because _resolvedColumns/_resolvedRows are derived from them\n // in willUpdate and always change in lockstep.\n if (changed.has('rows') \|\| changed.has('columns')) {\n this._cachedCells = null;\n }\n }\n\n // ─── Event Handlers ───\n\n /* @internal /\n private _handleSort(key: string): void {\n const direction =\n this.sortKey === key ? (this.sortDirection === 'asc' ? 'desc' : 'asc') : 'asc';\n this.sortKey = key;\n this.sortDirection = direction;\n this.dispatchEvent(\n new CustomEvent<HxDataTableSortState>('hx-sort', {\n bubbles: true,\n composed: true,\n detail: { key, direction },\n }),\n );\n }\n\n /* @internal /\n private _handleRowClick(row: Record<string, unknown>, index: number): void {\n this.dispatchEvent(\n new CustomEvent<{ row: Record<string, unknown>; index: number }>('hx-row-click', {\n bubbles: true,\n composed: true,\n detail: { row, index },\n }),\n );\n }\n\n /* @internal /\n private _handleSelect(index: number, checked: boolean): void {\n const next = new Set(this._selectedRows);\n if (checked) {\n next.add(index);\n } else {\n next.delete(index);\n }\n this._selectedRows = next;\n this._dispatchSelect();\n }\n\n /* @internal /\n private _handleSelectAll(checked: boolean): void {\n this._selectedRows = checked ? new Set(this._resolvedRows.map((_, i) => i)) : new Set<number>();\n this._dispatchSelect();\n }\n\n /* @internal /\n private _dispatchSelect(): void {\n this.dispatchEvent(\n new CustomEvent<{ selectedRows: Record<string, unknown>[] }>('hx-select', {\n bubbles: true,\n composed: true,\n detail: {\n selectedRows: [...this._selectedRows].flatMap((i) => {\n const row = this._resolvedRows[i];\n return row !== undefined ? [row] : [];\n }),\n },\n }),\n );\n }\n\n // ─── Keyboard Navigation ───\n\n /* @internal /\n private _handleKeydown(e: KeyboardEvent): void {\n if (!['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight', 'Home', 'End', ' '].includes(e.key))\n return;\n\n const root = this.shadowRoot;\n if (!root) return;\n\n // Use cached cell list; re-query only when invalidated by rows/columns change\n if (!this._cachedCells) {\n this._cachedCells = Array.from(\n root.querySelectorAll<HTMLElement>('[part~=\"td\"],[part~=\"th\"]'),\n );\n }\n const cells = this._cachedCells;\n\n // When focus is inside a child element (e.g., the sort <button> inside a <th>),\n // shadowRoot.activeElement returns the child, not the cell. Walk up to find the cell.\n let focused = root.activeElement as HTMLElement \| null;\n if (!focused) return;\n\n if (cells.indexOf(focused) === -1) {\n let ancestor = focused.parentElement;\n while (ancestor) {\n if (cells.includes(ancestor as HTMLElement)) {\n focused = ancestor as HTMLElement;\n break;\n }\n ancestor = ancestor.parentElement;\n }\n }\n\n const colCount = this._resolvedColumns.length + (this.selectable ? 1 : 0);\n const idx = cells.indexOf(focused);\n if (idx === -1) return;\n\n let target: HTMLElement \| null = null;\n\n if (e.key === 'ArrowRight' && idx + 1 < cells.length) {\n target = cells[idx + 1] ?? null;\n } else if (e.key === 'ArrowLeft' && idx - 1 >= 0) {\n target = cells[idx - 1] ?? null;\n } else if (e.key === 'ArrowDown' && idx + colCount < cells.length) {\n target = cells[idx + colCount] ?? null;\n } else if (e.key === 'ArrowUp' && idx - colCount >= 0) {\n target = cells[idx - colCount] ?? null;\n } else if (e.key === 'Home') {\n // First cell of the current row\n const rowStart = idx - (idx % colCount);\n target = cells[rowStart] ?? null;\n } else if (e.key === 'End') {\n // Last cell of the current row\n const rowEnd = Math.min(idx - (idx % colCount) + colCount - 1, cells.length - 1);\n target = cells[rowEnd] ?? null;\n } else if (e.key === ' ' && focused.getAttribute('part')?.includes('td')) {\n // Toggle selection on Space in a data row\n const rowIdx = Number(focused.dataset['rowIndex']);\n if (this.selectable && !isNaN(rowIdx)) {\n e.preventDefault();\n this._handleSelect(rowIdx, !this._selectedRows.has(rowIdx));\n }\n return;\n }\n\n if (target) {\n e.preventDefault();\n target.setAttribute('tabindex', '0');\n target.focus();\n focused.setAttribute('tabindex', '-1');\n }\n }\n\n // ─── Render Helpers ───\n\n /* @internal /\n private _renderSortIcon(key: string) {\n const isActive = this.sortKey === key;\n const iconClass = [\n 'sort-icon',\n isActive ? 'sort-icon--active' : '',\n isActive && this.sortDirection === 'desc' ? 'sort-icon--desc' : '',\n ]\n .filter(Boolean)\n .join(' ');\n\n return html`\n <span part=\"sort-icon\" class=${iconClass} aria-hidden=\"true\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 16 16\"\n fill=\"currentColor\"\n width=\"16\"\n height=\"16\"\n >\n <path d=\"M8 3L5 7h6L8 3zM8 13l3-4H5l3 4z\" fill-rule=\"evenodd\" />\n </svg>\n </span>\n `;\n }\n\n /\n Returns the indices (within the columns array) of all sortable columns.\n * @internal\n /\n private get _sortableIndices(): number[] {\n return this._resolvedColumns.reduce<number[]>((acc, col, i) => {\n if (col.sortable) acc.push(i);\n return acc;\n }, []);\n }\n\n /\n Handles keyboard navigation between sortable column headers using the\n * roving tabindex pattern (ARIA Grid specification). Supports ArrowLeft/Right\n * to move between sortable headers, Home/End to jump to first/last, and\n * Enter/Space to trigger sort on the focused sortable header.\n * @internal\n /\n private _handleHeaderKeydown(e: KeyboardEvent): void {\n const sortable = this._sortableIndices;\n if (sortable.length === 0) return;\n\n // Enter/Space on a sortable header triggers sort\n if (e.key === 'Enter' \|\| e.key === ' ') {\n const col = this._resolvedColumns[this._focusedHeaderIndex];\n if (col?.sortable) {\n e.preventDefault();\n this._handleSort(col.key);\n }\n return;\n }\n\n if (!['ArrowLeft', 'ArrowRight', 'Home', 'End'].includes(e.key)) return;\n\n // Determine which sortable position is currently focused.\n // If no sortable header is focused (currentPos === -1), let the\n // table-level _handleKeydown handle grid navigation instead.\n const currentPos = sortable.indexOf(this._focusedHeaderIndex);\n if (currentPos === -1) return;\n let nextPos: number;\n\n if (e.key === 'ArrowRight') {\n nextPos = currentPos === -1 ? 0 : Math.min(currentPos + 1, sortable.length - 1);\n } else if (e.key === 'ArrowLeft') {\n nextPos = currentPos <= 0 ? 0 : currentPos - 1;\n } else if (e.key === 'Home') {\n nextPos = 0;\n } else {\n // End\n nextPos = sortable.length - 1;\n }\n\n const nextIndex = sortable[nextPos];\n if (nextIndex === undefined) return;\n\n e.preventDefault();\n this._focusedHeaderIndex = nextIndex;\n\n // Focus the <th> element for the target column\n const headers = this.shadowRoot?.querySelectorAll<HTMLElement>('thead th[data-col-index]');\n const target = headers?.[nextIndex] ?? null;\n if (target) {\n target.focus();\n }\n }\n\n /* @internal /\n private _renderHeaderRow() {\n // Determine which sortable header gets tabindex=\"0\" (roving tabindex).\n // If _focusedHeaderIndex is -1 (initial), the first sortable column wins.\n const sortable = this._sortableIndices;\n const activeIndex =\n this._focusedHeaderIndex >= 0 ? this._focusedHeaderIndex : (sortable[0] ?? -1);\n\n return html`\n <tr part=\"tr\" @keydown=${this._handleHeaderKeydown}>\n ${this.selectable\n ? html`\n <th part=\"th\" class=\"col-checkbox\" tabindex=\"0\">\n <input\n type=\"checkbox\"\n part=\"checkbox\"\n aria-label=${this.selectAllLabel}\n .indeterminate=${this._selectedRows.size > 0 &&\n this._selectedRows.size < this._resolvedRows.length}\n .checked=${this._selectedRows.size === this._resolvedRows.length &&\n this._resolvedRows.length > 0}\n @change=${(e: Event) =>\n this._handleSelectAll((e.target as HTMLInputElement).checked)}\n />\n </th>\n `\n : nothing}\n ${this._resolvedColumns.map(\n (col, i) => html`\n <th\n part=\"th\"\n data-col-index=${i}\n tabindex=${col.sortable ? (i === activeIndex ? '0' : '-1') : '-1'}\n style=${col.width ? `width: ${col.width}` : ''}\n aria-sort=${col.sortable\n ? this.sortKey === col.key\n ? this.sortDirection === 'asc'\n ? 'ascending'\n : 'descending'\n : 'none'\n : nothing}\n @focus=${col.sortable\n ? () => {\n this._focusedHeaderIndex = i;\n }\n : nothing}\n >\n ${col.sortable\n ? html`\n <button\n class=\"sort-btn\"\n @click=${() => this._handleSort(col.key)}\n aria-label=${this.sortKey === col.key\n ? `Sort by ${col.label}, currently sorted ${this.sortDirection === 'asc' ? 'ascending' : 'descending'}`\n : `Sort by ${col.label}`}\n >\n ${col.label} ${this._renderSortIcon(col.key)}\n </button>\n `\n : col.label}\n </th>\n `,\n )}\n </tr>\n `;\n }\n\n /* @internal /\n private _renderSkeletonRows() {\n return Array.from(\n { length: 3 },\n (_) => html`\n <tr part=\"tr\" aria-hidden=\"true\">\n ${this.selectable\n ? html`<td part=\"td\" class=\"col-checkbox\">\n <span class=\"skeleton-cell\" style=\"width:1rem;margin:auto\"></span>\n </td>`\n : nothing}\n ${this._resolvedColumns.map(\n () => html`\n <td part=\"td\">\n <span class=\"skeleton-cell\"></span>\n </td>\n `,\n )}\n </tr>\n `,\n );\n }\n\n /* @internal /\n private _renderEmptyRow() {\n const colSpan = this._resolvedColumns.length + (this.selectable ? 1 : 0);\n return html`\n <tr part=\"tr\">\n <td part=\"td\" colspan=${colSpan} class=\"empty-cell\">\n <slot name=\"empty\">${this.emptyLabel}</slot>\n </td>\n </tr>\n `;\n }\n\n /* @internal /\n private _renderDataRows() {\n let displayRows = this._resolvedRows;\n\n // Client-side pagination when pageSize > 0\n if (this.pageSize > 0) {\n const start = (this.page - 1) this.pageSize;\n displayRows = this._resolvedRows.slice(start, start + this.pageSize);\n }\n\n return repeat(\n displayRows,\n (_row, pageIndex) => {\n const globalIndex =\n this.pageSize > 0 ? (this.page - 1) * this.pageSize + pageIndex : pageIndex;\n return globalIndex;\n },\n (row, pageIndex) => {\n // The global row index for selection and events\n const globalIndex =\n this.pageSize > 0 ? (this.page - 1) * this.pageSize + pageIndex : pageIndex;\n return html`\n <tr\n part=\"tr\"\n aria-selected=${this.selectable ? String(this._selectedRows.has(globalIndex)) : nothing}\n @click=${() => this._handleRowClick(row, globalIndex)}\n @keydown=${(e: KeyboardEvent) => {\n // WCAG 2.1.1: rows are keyboard-activatable via Enter and Space so that\n // the hx-row-click event fires equivalently for keyboard users.\n if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault();\n this._handleRowClick(row, globalIndex);\n }\n }}\n >\n ${this.selectable\n ? html`\n <td part=\"td\" class=\"col-checkbox\" tabindex=\"-1\" data-row-index=${globalIndex}>\n <input\n type=\"checkbox\"\n part=\"checkbox\"\n aria-label=${`Select row ${globalIndex + 1}`}\n .checked=${this._selectedRows.has(globalIndex)}\n @click=${(e: Event) => e.stopPropagation()}\n @change=${(e: Event) =>\n this._handleSelect(globalIndex, (e.target as HTMLInputElement).checked)}\n />\n </td>\n `\n : nothing}\n ${this._resolvedColumns.map(\n (col) => html`\n <td part=\"td\" tabindex=\"-1\" data-row-index=${globalIndex}>\n ${row[col.key] != null ? String(row[col.key]) : ''}\n </td>\n `,\n )}\n </tr>\n `;\n },\n );\n }\n\n // ─── Render ───\n\n override render() {\n return html`\n <slot name=\"toolbar\"></slot>\n <div class=\"table-wrapper\">\n <table\n part=\"table\"\n role=\"grid\"\n aria-label=${this.label.trim() \|\| 'Table'}\n aria-busy=${this.loading ? 'true' : nothing}\n @keydown=${this._handleKeydown}\n >\n <thead part=\"thead\">\n ${this._renderHeaderRow()}\n </thead>\n <tbody part=\"tbody\">\n ${this.loading\n ? html`<slot name=\"loading\">${this._renderSkeletonRows()}</slot>`\n : this._resolvedRows.length === 0\n ? this._renderEmptyRow()\n : this._renderDataRows()}\n </tbody>\n </table>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-data-table': HelixDataTable;\n }\n}\n"],"names":["helixDataTableStyles","css","HelixDataTable","HelixElement","changed","rawColumns","rawRows","key","direction","row","index","checked","next","_","i","root","cells","focused","ancestor","colCount","idx","target","rowStart","rowEnd","_a","rowIdx","isActive","iconClass","html","acc","col","sortable","currentPos","nextPos","nextIndex","headers","activeIndex","e","nothing","colSpan","displayRows","start","repeat","_row","pageIndex","globalIndex","forcedColorsSurface","__decorateClass","property","value","state","customElement"],"mappings":";;;;;AAEO,MAAMA,IAAuBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;ACmG7B,IAAMC,IAAN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"}
1	+ {"version":3,"file":"hx-data-table-Ct3gQ6ya.js","sources":["../../src/components/hx-data-table/hx-data-table.styles.ts","../../src/components/hx-data-table/hx-data-table.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixDataTableStyles = css`\n :host {\n display: block;\n overflow-x: auto;\n font-family: var(--hx-data-table-font-family, var(--hx-font-family-sans, sans-serif));\n font-size: var(--hx-font-size-sm, 0.875rem);\n }\n\n /* ─── Scroll Wrapper ─── /\n\n .table-wrapper {\n min-width: 0;\n width: 100%;\n }\n\n / ─── Table ─── /\n\n table {\n width: 100%;\n border-collapse: collapse;\n border-spacing: 0;\n min-width: var(--hx-data-table-min-width, 600px);\n }\n\n / ─── Head ─── /\n\n thead {\n background-color: var(--hx-data-table-header-bg, var(--hx-color-surface-raised, #f5f8f3));\n }\n\n :host([sticky-header]) thead th {\n position: sticky;\n top: 0;\n z-index: 1;\n background-color: var(--hx-data-table-header-bg, var(--hx-color-surface-raised, #f5f8f3));\n }\n\n / ─── Cells ─── /\n\n th,\n td {\n padding: var(--hx-space-3, 0.75rem) var(--hx-space-4, 1rem);\n text-align: start;\n border-bottom: var(--hx-border-width-thin, 1px) solid\n var(--hx-data-table-border-color, var(--hx-color-border-default, #d6dbd5));\n vertical-align: middle;\n }\n\n th {\n font-weight: var(--hx-font-weight-semibold, 600);\n color: var(--hx-data-table-header-color, var(--hx-color-text-strong, #202b39));\n white-space: nowrap;\n }\n\n td {\n color: var(--hx-data-table-cell-color, var(--hx-color-text-primary, #0d1825));\n }\n\n / ─── Checkbox Column ─── /\n\n th.col-checkbox,\n td.col-checkbox {\n / WCAG 2.5.5 (healthcare mandate): minimum 44x44px touch target /\n width: var(--hx-touch-target-min, 2.75rem);\n min-width: var(--hx-touch-target-min, 2.75rem);\n padding-inline-end: var(--hx-space-2, 0.5rem);\n }\n\n th.col-checkbox {\n text-align: center;\n }\n\n td.col-checkbox {\n text-align: center;\n }\n\n / ─── Sort Button ─── /\n\n .sort-btn {\n display: inline-flex;\n align-items: center;\n gap: var(--hx-space-1, 0.25rem);\n background: none;\n border: none;\n padding: 0;\n font: inherit;\n font-weight: inherit;\n color: inherit;\n cursor: pointer;\n white-space: nowrap;\n }\n\n .sort-btn:focus-visible {\n outline: var(--hx-focus-ring-width, 2px) solid\n var(--hx-data-table-focus-ring-color, var(--hx-focus-ring-color, #0f7078));\n outline-offset: var(--hx-focus-ring-offset, 2px);\n border-radius: var(--hx-border-radius-sm, 2px);\n }\n\n / ─── Sort Icon ─── /\n\n .sort-icon {\n display: inline-flex;\n align-items: center;\n flex-shrink: 0;\n width: 1em;\n height: 1em;\n opacity: var(--hx-opacity-25, 0.25); / sort icon inactive — intentionally subtle /\n transition:\n opacity var(--hx-transition-fast, 150ms ease),\n transform var(--hx-transition-fast, 150ms ease);\n }\n\n .sort-icon--active {\n opacity: var(--hx-opacity-100, 1);\n color: var(--hx-data-table-sort-icon-active-color, var(--hx-color-primary-500, #429797));\n }\n\n .sort-icon--desc {\n transform: rotate(180deg);\n }\n\n / ─── Row States ─── /\n\n tbody tr {\n transition: background-color var(--hx-transition-fast, 150ms ease);\n }\n\n tbody tr:hover {\n background-color: var(--hx-data-table-row-hover-bg, var(--hx-color-surface-raised, #f5f8f3));\n }\n\n tbody tr[aria-selected='true'] {\n background-color: var(--hx-data-table-row-selected-bg, var(--hx-color-primary-50, #ebf8f8));\n }\n\n / ─── Checkbox Input ─── /\n\n input[type='checkbox'] {\n width: var(--hx-size-4, 1rem);\n height: var(--hx-size-4, 1rem);\n cursor: pointer;\n accent-color: var(--hx-data-table-checkbox-accent-color, var(--hx-color-primary-500, #429797));\n }\n\n / ─── Loading Skeleton ─── /\n\n .skeleton-cell {\n display: block;\n height: 1em;\n border-radius: var(--hx-border-radius-sm, 2px);\n / Skeleton shimmer: intentionally primitive so the animation reads the same across all modes. /\n background: linear-gradient(\n 90deg,\n var(--hx-color-neutral-200, #d6dbd5) 25%,\n var(--hx-color-neutral-100, #ebeee9) 50%,\n var(--hx-color-neutral-200, #d6dbd5) 75%\n );\n background-size: 200% 100%;\n animation: hx-shimmer var(--hx-data-table-shimmer-duration, 1.5s) infinite;\n }\n\n @keyframes hx-shimmer {\n 0% {\n background-position: 200% 0;\n }\n 100% {\n background-position: -200% 0;\n }\n }\n\n @media (prefers-reduced-motion: reduce) {\n .skeleton-cell {\n animation: none;\n opacity: var(\n --hx-opacity-50,\n 0.5\n ); / reduced from animation; approximate to available token /\n }\n\n .sort-icon {\n transition: none;\n }\n\n tbody tr {\n transition: none;\n }\n }\n\n / ─── Cell Focus ─── /\n\n td:focus-visible,\n th:focus-visible,\n [part~='td']:focus-visible,\n [part~='th']:focus-visible {\n outline: var(--hx-focus-ring-width, 2px) solid\n var(--hx-data-table-focus-ring-color, var(--hx-focus-ring-color, #0f7078));\n outline-offset: var(--hx-focus-ring-offset, -2px);\n border-radius: var(--hx-border-radius-sm, 2px);\n }\n\n / ─── Empty State ─── /\n\n .empty-cell {\n text-align: center;\n color: var(--hx-data-table-empty-color, var(--hx-color-text-secondary, #313e4b));\n padding: var(--hx-space-8, 2rem) var(--hx-space-4, 1rem);\n }\n\n / ─── Forced Colors (Windows High Contrast) ─── /\n\n @media (forced-colors: active) {\n table {\n border: 1px solid CanvasText;\n }\n\n th,\n td {\n border-bottom-color: CanvasText;\n }\n\n tbody tr[aria-selected='true'] {\n outline: 2px solid Highlight;\n }\n\n .skeleton-cell {\n animation: none;\n border: 1px solid GrayText;\n background: none;\n }\n }\n`;\n","import { html, nothing, type PropertyValues } from 'lit';\nimport '../../utilities/document-token-adoption.js';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { HelixElement } from '../../base/index.js';\nimport { helixDataTableStyles } from './hx-data-table.styles.js';\nimport { forcedColorsSurface } from '../../styles/forced-colors.js';\nimport { devWarn } from '../../utils/dev-warn.js';\n\n/\n Column definition for `hx-data-table`.\n /\nexport interface HxDataTableColumn {\n key: string;\n label: string;\n sortable?: boolean;\n width?: string;\n}\n\n/\n Sort state exported for TypeScript consumers and CEM event types.\n /\nexport interface HxDataTableSortState {\n key: string;\n direction: 'asc' \| 'desc';\n}\n\n/* Detail for the hx-select event dispatched by hx-data-table. /\nexport interface HxDataTableSelectDetail {\n selectedRows: Record<string, unknown>[];\n}\n\n/* Detail for the hx-row-click event dispatched by hx-data-table. /\nexport interface HxDataTableRowClickDetail {\n row: Record<string, unknown>;\n index: number;\n}\n\n/\n An enterprise data table with sorting, row selection, and keyboard navigation.\n \n @summary Enterprise data table with sorting, selection, and responsive scroll.\n \n @tag hx-data-table\n \n @slot toolbar - Content rendered above the table (e.g., search, actions).\n * @slot empty - Custom empty-state content rendered when `rows` is empty and not loading.\n * @slot loading - Custom loading content rendered when `loading` is true.\n \n @fires {CustomEvent<HxDataTableSortState>} hx-sort - Dispatched when a sortable column header is clicked.\n * @fires {CustomEvent<{selectedRows: Record<string, unknown>[]}>} hx-select - Dispatched when row selection changes.\n * @fires {CustomEvent<{row: Record<string, unknown>, index: number}>} hx-row-click - Dispatched when a data row is clicked.\n \n @csspart table - The `<table>` element.\n * @csspart thead - The `<thead>` element.\n * @csspart tbody - The `<tbody>` element.\n * @csspart tr - Each `<tr>` element.\n * @csspart th - Each `<th>` element.\n * @csspart td - Each `<td>` element.\n * @csspart sort-icon - The sort indicator icon `<span>` inside sortable headers.\n * @csspart checkbox - Each `<input type=\"checkbox\">` element.\n \n @cssprop [--hx-data-table-header-bg=var(--hx-color-neutral-50)] - Header background color.\n * @cssprop [--hx-data-table-header-color=var(--hx-color-neutral-700)] - Header text color.\n * @cssprop [--hx-data-table-cell-color=var(--hx-color-neutral-900)] - Cell text color.\n * @cssprop [--hx-data-table-border-color=var(--hx-color-neutral-200)] - Row border color.\n * @cssprop [--hx-data-table-row-hover-bg=var(--hx-color-neutral-50)] - Row hover background.\n * @cssprop [--hx-data-table-row-selected-bg=var(--hx-color-primary-50)] - Selected row background.\n * @cssprop [--hx-data-table-empty-color=var(--hx-color-neutral-600)] - Empty state text color.\n * @cssprop [--hx-data-table-min-width=600px] - Minimum table width before horizontal scrolling.\n * @cssprop [--hx-data-table-font-family=var(--hx-font-family-sans)] - CSS custom property.\n * @cssprop [--hx-data-table-shimmer-duration=1.5s] - CSS custom property.\n * @cssprop [--hx-font-family-sans] - Font family.\n * @cssprop [--hx-font-size-sm] - Font size.\n * @cssprop [--hx-space-3] - Spacing token.\n * @cssprop [--hx-space-4] - Spacing token.\n * @cssprop [--hx-border-width-thin] - Width.\n * @cssprop [--hx-font-weight-semibold] - Font weight.\n * @cssprop [--hx-touch-target-min] - Minimum touch target size.\n * @cssprop [--hx-space-2] - Spacing token.\n * @cssprop [--hx-space-1] - Spacing token.\n * @cssprop [--hx-focus-ring-width] - Width.\n * @cssprop [--hx-focus-ring-color] - Color.\n * @cssprop [--hx-focus-ring-offset] - CSS custom property.\n * @cssprop [--hx-border-radius-sm] - CSS custom property.\n * @cssprop [--hx-opacity-25] - Opacity.\n * @cssprop [--hx-transition-fast] - Transition timing.\n * @cssprop [--hx-opacity-100] - Opacity.\n * @cssprop [--hx-color-primary-500] - Color.\n * @cssprop [--hx-size-4] - Size token.\n * @cssprop [--hx-color-neutral-50] - Color.\n * @cssprop [--hx-color-neutral-200] - Color.\n * @cssprop [--hx-color-neutral-100] - Color.\n * @cssprop [--hx-color-neutral-700] - Color.\n * @cssprop [--hx-color-neutral-900] - Color.\n * @cssprop [--hx-color-neutral-600] - Color.\n * @cssprop [--hx-color-primary-50] - Color.\n * @cssprop [--hx-opacity-50] - Opacity.\n * @cssprop [--hx-space-8] - Spacing token.\n /\n@customElement('hx-data-table')\nexport class HelixDataTable extends HelixElement {\n static override styles = [helixDataTableStyles, forcedColorsSurface];\n\n // ─── Public Properties ───\n\n /\n Column definitions. Each item: `{ key, label, sortable?, width? }`.\n * Can be set as a JS array or a JSON string (e.g., from a Drupal Twig attribute).\n * @attr columns\n /\n @property({\n type: Array,\n converter: {\n fromAttribute(value: string \| null) {\n if (!value) return [];\n try {\n return JSON.parse(value);\n } catch {\n return [];\n }\n },\n },\n })\n columns: HxDataTableColumn[] = [];\n\n /\n Row data. Each item is a plain object keyed by column `key` values.\n * Can be set as a JS array or a JSON string (e.g., from a Drupal Twig attribute).\n * @attr rows\n /\n @property({\n type: Array,\n converter: {\n fromAttribute(value: string \| null) {\n if (!value) return [];\n try {\n return JSON.parse(value);\n } catch {\n return [];\n }\n },\n },\n })\n rows: Record<string, unknown>[] = [];\n\n /\n When true, renders a checkbox column for row selection.\n * @attr selectable\n /\n @property({ type: Boolean, reflect: true })\n selectable = false;\n\n /\n The column key currently used for sorting.\n * @attr sort-key\n /\n @property({ type: String, attribute: 'sort-key' })\n sortKey = '';\n\n /\n Current sort direction.\n * @attr sort-direction\n /\n @property({ type: String, attribute: 'sort-direction' })\n sortDirection: 'asc' \| 'desc' = 'asc';\n\n /\n When true, renders a loading skeleton and sets `aria-busy=\"true\"` on the host.\n * @attr loading\n /\n @property({ type: Boolean, reflect: true })\n loading = false;\n\n /\n Text displayed in the default empty state when `rows` is empty and not loading.\n * @attr empty-label\n /\n @property({ type: String, attribute: 'empty-label' })\n emptyLabel = 'No data';\n\n /\n Accessible name for the table. Exposed via `aria-label` on the `<table>` element.\n * Required when the table has columns — a missing label is a WCAG 4.1.2 violation.\n * @attr label\n /\n @property({ type: String })\n label = '';\n\n /\n Accessible label for the \"select all rows\" checkbox in the table header.\n * @attr select-all-label\n /\n @property({ attribute: 'select-all-label' })\n selectAllLabel = 'Select all rows';\n\n /\n When true, the header row is sticky (position: sticky; top: 0).\n * @attr sticky-header\n /\n @property({ type: Boolean, reflect: true, attribute: 'sticky-header' })\n stickyHeader = false;\n\n /\n Current page (1-based). Set to 0 or leave at default (0) to disable pagination.\n * @attr page\n /\n @property({ type: Number })\n page = 1;\n\n /\n Number of rows per page. Set to 0 to disable pagination (show all rows).\n * @attr page-size\n /\n @property({ type: Number, attribute: 'page-size' })\n pageSize = 0;\n\n // ─── Internal State ───\n\n /* @internal /\n @state()\n private _selectedRows: Set<number> = new Set();\n\n /\n Cached flat list of all td/th cells in the shadow DOM.\n * Invalidated (set to null) whenever rows or columns change so the next keydown\n * re-queries the DOM and re-caches. Avoids repeated querySelectorAll on every keypress.\n * @internal\n /\n private _cachedCells: HTMLElement[] \| null = null;\n\n /\n Index (within the columns array) of the sortable header that currently holds\n * roving tabindex focus. -1 means no sortable header has been focused yet;\n * the first sortable column will receive tabindex=\"0\" by default.\n * @internal\n /\n @state() private _focusedHeaderIndex = -1;\n\n /\n Resolved columns array. Computed in willUpdate from the public `columns`\n * property which may be a JSON string (Drupal/Twig path) or a JS array.\n * All internal reads use this field to avoid mutating reactive properties\n * inside willUpdate (which would trigger extra update cycles).\n * @internal\n /\n @state() private _resolvedColumns: HxDataTableColumn[] = [];\n\n /\n Resolved rows array. Computed in willUpdate from the public `rows`\n * property which may be a JSON string (Drupal/Twig path) or a JS array.\n * @internal\n /\n @state() private _resolvedRows: Record<string, unknown>[] = [];\n\n // ─── Lifecycle ───\n\n override willUpdate(changed: PropertyValues<this>): void {\n // Coerce JSON strings to arrays — this is the Drupal/Twig integration path.\n // Lit does not JSON-parse array attributes automatically, so we do it here.\n // Note: Lit's defaultConverter returns null (not a string) when JSON.parse fails for\n // type: Array — so we guard against both string and any non-array value.\n //\n // We write to private @state() resolved fields instead of mutating the public\n // reactive properties. Mutating @property fields inside willUpdate triggers an\n // additional update cycle; writing to separate @state fields does not because\n // Lit batches all changes within the same willUpdate into a single render.\n if (changed.has('columns')) {\n const rawColumns: unknown = this.columns;\n if (typeof rawColumns === 'string') {\n try {\n this._resolvedColumns = JSON.parse(rawColumns) as HxDataTableColumn[];\n } catch {\n this._resolvedColumns = [];\n }\n } else if (Array.isArray(this.columns)) {\n this._resolvedColumns = this.columns;\n } else {\n this._resolvedColumns = [];\n }\n }\n if (changed.has('rows')) {\n const rawRows: unknown = this.rows;\n if (typeof rawRows === 'string') {\n try {\n this._resolvedRows = JSON.parse(rawRows) as Record<string, unknown>[];\n } catch {\n this._resolvedRows = [];\n }\n } else if (Array.isArray(this.rows)) {\n this._resolvedRows = this.rows;\n } else {\n this._resolvedRows = [];\n }\n }\n // Only warn when rows actually changes to avoid noise on every property update.\n if (changed.has('rows') && this._resolvedRows.length > 500) {\n devWarn(\n 'hx-data-table',\n 'Rendering more than 500 rows may impact performance. Consider server-side pagination.',\n );\n }\n // WCAG 4.1.2: data tables must have an accessible name so screen readers can identify them.\n if (\n (changed.has('label') \|\| changed.has('columns')) &&\n this._resolvedColumns.length > 0 &&\n !this.label\n ) {\n devWarn(\n 'hx-data-table',\n 'No accessible name provided. Set the `label` attribute so screen readers can identify this table (WCAG 4.1.2).',\n );\n }\n }\n\n override updated(changed: PropertyValues<this>): void {\n // Invalidate cell cache when rows or columns change so the next keyboard\n // navigation re-queries and re-caches the updated DOM. We check the public\n // properties because _resolvedColumns/_resolvedRows are derived from them\n // in willUpdate and always change in lockstep.\n if (changed.has('rows') \|\| changed.has('columns')) {\n this._cachedCells = null;\n }\n }\n\n // ─── Event Handlers ───\n\n /* @internal /\n private _handleSort(key: string): void {\n const direction =\n this.sortKey === key ? (this.sortDirection === 'asc' ? 'desc' : 'asc') : 'asc';\n this.sortKey = key;\n this.sortDirection = direction;\n this.dispatchEvent(\n new CustomEvent<HxDataTableSortState>('hx-sort', {\n bubbles: true,\n composed: true,\n detail: { key, direction },\n }),\n );\n }\n\n /* @internal /\n private _handleRowClick(row: Record<string, unknown>, index: number): void {\n this.dispatchEvent(\n new CustomEvent<{ row: Record<string, unknown>; index: number }>('hx-row-click', {\n bubbles: true,\n composed: true,\n detail: { row, index },\n }),\n );\n }\n\n /* @internal /\n private _handleSelect(index: number, checked: boolean): void {\n const next = new Set(this._selectedRows);\n if (checked) {\n next.add(index);\n } else {\n next.delete(index);\n }\n this._selectedRows = next;\n this._dispatchSelect();\n }\n\n /* @internal /\n private _handleSelectAll(checked: boolean): void {\n this._selectedRows = checked ? new Set(this._resolvedRows.map((_, i) => i)) : new Set<number>();\n this._dispatchSelect();\n }\n\n /* @internal /\n private _dispatchSelect(): void {\n this.dispatchEvent(\n new CustomEvent<{ selectedRows: Record<string, unknown>[] }>('hx-select', {\n bubbles: true,\n composed: true,\n detail: {\n selectedRows: [...this._selectedRows].flatMap((i) => {\n const row = this._resolvedRows[i];\n return row !== undefined ? [row] : [];\n }),\n },\n }),\n );\n }\n\n // ─── Keyboard Navigation ───\n\n /* @internal /\n private _handleKeydown(e: KeyboardEvent): void {\n if (!['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight', 'Home', 'End', ' '].includes(e.key))\n return;\n\n const root = this.shadowRoot;\n if (!root) return;\n\n // Use cached cell list; re-query only when invalidated by rows/columns change\n if (!this._cachedCells) {\n this._cachedCells = Array.from(\n root.querySelectorAll<HTMLElement>('[part~=\"td\"],[part~=\"th\"]'),\n );\n }\n const cells = this._cachedCells;\n\n // When focus is inside a child element (e.g., the sort <button> inside a <th>),\n // shadowRoot.activeElement returns the child, not the cell. Walk up to find the cell.\n let focused = root.activeElement as HTMLElement \| null;\n if (!focused) return;\n\n if (cells.indexOf(focused) === -1) {\n let ancestor = focused.parentElement;\n while (ancestor) {\n if (cells.includes(ancestor as HTMLElement)) {\n focused = ancestor as HTMLElement;\n break;\n }\n ancestor = ancestor.parentElement;\n }\n }\n\n const colCount = this._resolvedColumns.length + (this.selectable ? 1 : 0);\n const idx = cells.indexOf(focused);\n if (idx === -1) return;\n\n let target: HTMLElement \| null = null;\n\n if (e.key === 'ArrowRight' && idx + 1 < cells.length) {\n target = cells[idx + 1] ?? null;\n } else if (e.key === 'ArrowLeft' && idx - 1 >= 0) {\n target = cells[idx - 1] ?? null;\n } else if (e.key === 'ArrowDown' && idx + colCount < cells.length) {\n target = cells[idx + colCount] ?? null;\n } else if (e.key === 'ArrowUp' && idx - colCount >= 0) {\n target = cells[idx - colCount] ?? null;\n } else if (e.key === 'Home') {\n // First cell of the current row\n const rowStart = idx - (idx % colCount);\n target = cells[rowStart] ?? null;\n } else if (e.key === 'End') {\n // Last cell of the current row\n const rowEnd = Math.min(idx - (idx % colCount) + colCount - 1, cells.length - 1);\n target = cells[rowEnd] ?? null;\n } else if (e.key === ' ' && focused.getAttribute('part')?.includes('td')) {\n // Toggle selection on Space in a data row\n const rowIdx = Number(focused.dataset['rowIndex']);\n if (this.selectable && !isNaN(rowIdx)) {\n e.preventDefault();\n this._handleSelect(rowIdx, !this._selectedRows.has(rowIdx));\n }\n return;\n }\n\n if (target) {\n e.preventDefault();\n target.setAttribute('tabindex', '0');\n target.focus();\n focused.setAttribute('tabindex', '-1');\n }\n }\n\n // ─── Render Helpers ───\n\n /* @internal /\n private _renderSortIcon(key: string) {\n const isActive = this.sortKey === key;\n const iconClass = [\n 'sort-icon',\n isActive ? 'sort-icon--active' : '',\n isActive && this.sortDirection === 'desc' ? 'sort-icon--desc' : '',\n ]\n .filter(Boolean)\n .join(' ');\n\n return html`\n <span part=\"sort-icon\" class=${iconClass} aria-hidden=\"true\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 16 16\"\n fill=\"currentColor\"\n width=\"16\"\n height=\"16\"\n >\n <path d=\"M8 3L5 7h6L8 3zM8 13l3-4H5l3 4z\" fill-rule=\"evenodd\" />\n </svg>\n </span>\n `;\n }\n\n /\n Returns the indices (within the columns array) of all sortable columns.\n * @internal\n /\n private get _sortableIndices(): number[] {\n return this._resolvedColumns.reduce<number[]>((acc, col, i) => {\n if (col.sortable) acc.push(i);\n return acc;\n }, []);\n }\n\n /\n Handles keyboard navigation between sortable column headers using the\n * roving tabindex pattern (ARIA Grid specification). Supports ArrowLeft/Right\n * to move between sortable headers, Home/End to jump to first/last, and\n * Enter/Space to trigger sort on the focused sortable header.\n * @internal\n /\n private _handleHeaderKeydown(e: KeyboardEvent): void {\n const sortable = this._sortableIndices;\n if (sortable.length === 0) return;\n\n // Enter/Space on a sortable header triggers sort\n if (e.key === 'Enter' \|\| e.key === ' ') {\n const col = this._resolvedColumns[this._focusedHeaderIndex];\n if (col?.sortable) {\n e.preventDefault();\n this._handleSort(col.key);\n }\n return;\n }\n\n if (!['ArrowLeft', 'ArrowRight', 'Home', 'End'].includes(e.key)) return;\n\n // Determine which sortable position is currently focused.\n // If no sortable header is focused (currentPos === -1), let the\n // table-level _handleKeydown handle grid navigation instead.\n const currentPos = sortable.indexOf(this._focusedHeaderIndex);\n if (currentPos === -1) return;\n let nextPos: number;\n\n if (e.key === 'ArrowRight') {\n nextPos = currentPos === -1 ? 0 : Math.min(currentPos + 1, sortable.length - 1);\n } else if (e.key === 'ArrowLeft') {\n nextPos = currentPos <= 0 ? 0 : currentPos - 1;\n } else if (e.key === 'Home') {\n nextPos = 0;\n } else {\n // End\n nextPos = sortable.length - 1;\n }\n\n const nextIndex = sortable[nextPos];\n if (nextIndex === undefined) return;\n\n e.preventDefault();\n this._focusedHeaderIndex = nextIndex;\n\n // Focus the <th> element for the target column\n const headers = this.shadowRoot?.querySelectorAll<HTMLElement>('thead th[data-col-index]');\n const target = headers?.[nextIndex] ?? null;\n if (target) {\n target.focus();\n }\n }\n\n /* @internal /\n private _renderHeaderRow() {\n // Determine which sortable header gets tabindex=\"0\" (roving tabindex).\n // If _focusedHeaderIndex is -1 (initial), the first sortable column wins.\n const sortable = this._sortableIndices;\n const activeIndex =\n this._focusedHeaderIndex >= 0 ? this._focusedHeaderIndex : (sortable[0] ?? -1);\n\n return html`\n <tr part=\"tr\" @keydown=${this._handleHeaderKeydown}>\n ${this.selectable\n ? html`\n <th part=\"th\" class=\"col-checkbox\" tabindex=\"0\">\n <input\n type=\"checkbox\"\n part=\"checkbox\"\n aria-label=${this.selectAllLabel}\n .indeterminate=${this._selectedRows.size > 0 &&\n this._selectedRows.size < this._resolvedRows.length}\n .checked=${this._selectedRows.size === this._resolvedRows.length &&\n this._resolvedRows.length > 0}\n @change=${(e: Event) =>\n this._handleSelectAll((e.target as HTMLInputElement).checked)}\n />\n </th>\n `\n : nothing}\n ${this._resolvedColumns.map(\n (col, i) => html`\n <th\n part=\"th\"\n data-col-index=${i}\n tabindex=${col.sortable ? (i === activeIndex ? '0' : '-1') : '-1'}\n style=${col.width ? `width: ${col.width}` : ''}\n aria-sort=${col.sortable\n ? this.sortKey === col.key\n ? this.sortDirection === 'asc'\n ? 'ascending'\n : 'descending'\n : 'none'\n : nothing}\n @focus=${col.sortable\n ? () => {\n this._focusedHeaderIndex = i;\n }\n : nothing}\n >\n ${col.sortable\n ? html`\n <button\n class=\"sort-btn\"\n @click=${() => this._handleSort(col.key)}\n aria-label=${this.sortKey === col.key\n ? `Sort by ${col.label}, currently sorted ${this.sortDirection === 'asc' ? 'ascending' : 'descending'}`\n : `Sort by ${col.label}`}\n >\n ${col.label} ${this._renderSortIcon(col.key)}\n </button>\n `\n : col.label}\n </th>\n `,\n )}\n </tr>\n `;\n }\n\n /* @internal /\n private _renderSkeletonRows() {\n return Array.from(\n { length: 3 },\n (_) => html`\n <tr part=\"tr\" aria-hidden=\"true\">\n ${this.selectable\n ? html`<td part=\"td\" class=\"col-checkbox\">\n <span class=\"skeleton-cell\" style=\"width:1rem;margin:auto\"></span>\n </td>`\n : nothing}\n ${this._resolvedColumns.map(\n () => html`\n <td part=\"td\">\n <span class=\"skeleton-cell\"></span>\n </td>\n `,\n )}\n </tr>\n `,\n );\n }\n\n /* @internal /\n private _renderEmptyRow() {\n const colSpan = this._resolvedColumns.length + (this.selectable ? 1 : 0);\n return html`\n <tr part=\"tr\">\n <td part=\"td\" colspan=${colSpan} class=\"empty-cell\">\n <slot name=\"empty\">${this.emptyLabel}</slot>\n </td>\n </tr>\n `;\n }\n\n /* @internal /\n private _renderDataRows() {\n let displayRows = this._resolvedRows;\n\n // Client-side pagination when pageSize > 0\n if (this.pageSize > 0) {\n const start = (this.page - 1) this.pageSize;\n displayRows = this._resolvedRows.slice(start, start + this.pageSize);\n }\n\n return repeat(\n displayRows,\n (_row, pageIndex) => {\n const globalIndex =\n this.pageSize > 0 ? (this.page - 1) * this.pageSize + pageIndex : pageIndex;\n return globalIndex;\n },\n (row, pageIndex) => {\n // The global row index for selection and events\n const globalIndex =\n this.pageSize > 0 ? (this.page - 1) * this.pageSize + pageIndex : pageIndex;\n return html`\n <tr\n part=\"tr\"\n aria-selected=${this.selectable ? String(this._selectedRows.has(globalIndex)) : nothing}\n @click=${() => this._handleRowClick(row, globalIndex)}\n @keydown=${(e: KeyboardEvent) => {\n // WCAG 2.1.1: rows are keyboard-activatable via Enter and Space so that\n // the hx-row-click event fires equivalently for keyboard users.\n if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault();\n this._handleRowClick(row, globalIndex);\n }\n }}\n >\n ${this.selectable\n ? html`\n <td part=\"td\" class=\"col-checkbox\" tabindex=\"-1\" data-row-index=${globalIndex}>\n <input\n type=\"checkbox\"\n part=\"checkbox\"\n aria-label=${`Select row ${globalIndex + 1}`}\n .checked=${this._selectedRows.has(globalIndex)}\n @click=${(e: Event) => e.stopPropagation()}\n @change=${(e: Event) =>\n this._handleSelect(globalIndex, (e.target as HTMLInputElement).checked)}\n />\n </td>\n `\n : nothing}\n ${this._resolvedColumns.map(\n (col) => html`\n <td part=\"td\" tabindex=\"-1\" data-row-index=${globalIndex}>\n ${row[col.key] != null ? String(row[col.key]) : ''}\n </td>\n `,\n )}\n </tr>\n `;\n },\n );\n }\n\n // ─── Render ───\n\n override render() {\n // Group 7 audit fix: drop the meaningless `\|\| 'Table'` fallback.\n // Falling back to a generic literal silently labelled every consumer\n // who forgot to set the `label` property as just \"Table\" — a WCAG\n // 4.1.2 by-default violation. The devWarn (line ~309) already nudges\n // consumers to provide a real label; let `aria-label` omit when empty.\n const trimmedLabel = this.label.trim();\n return html`\n <slot name=\"toolbar\"></slot>\n <div class=\"table-wrapper\">\n <table\n part=\"table\"\n role=\"grid\"\n aria-label=${trimmedLabel \|\| nothing}\n aria-busy=${this.loading ? 'true' : nothing}\n @keydown=${this._handleKeydown}\n >\n <thead part=\"thead\">\n ${this._renderHeaderRow()}\n </thead>\n <tbody part=\"tbody\">\n ${this.loading\n ? html`<slot name=\"loading\">${this._renderSkeletonRows()}</slot>`\n : this._resolvedRows.length === 0\n ? this._renderEmptyRow()\n : this._renderDataRows()}\n </tbody>\n </table>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'hx-data-table': HelixDataTable;\n }\n}\n"],"names":["helixDataTableStyles","css","HelixDataTable","HelixElement","changed","rawColumns","rawRows","key","direction","row","index","checked","next","_","i","root","cells","focused","ancestor","colCount","idx","target","rowStart","rowEnd","_a","rowIdx","isActive","iconClass","html","acc","col","sortable","currentPos","nextPos","nextIndex","headers","activeIndex","e","nothing","colSpan","displayRows","start","repeat","_row","pageIndex","globalIndex","trimmedLabel","forcedColorsSurface","__decorateClass","property","value","state","customElement"],"mappings":";;;;;AAEO,MAAMA,IAAuBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;ACmG7B,IAAMC,IAAN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"}

package/dist/shared/{hx-date-picker-N-0aG5XL.js → hx-date-picker-CiR7FVnR.js} RENAMED Viewed

@@ -4,7 +4,7 @@ import { F as G } from "./FormMixin-B8PXk5RQ.js";
 import { classMap as B } from "lit/directives/class-map.js";
 import { ifDefined as U } from "lit/directives/if-defined.js";
 import { b as V } from "./forced-colors-CTEDFRGa.js";
-import { s as j, i as P, r as q } from "./aria-idref-Q0yiSR3p.js";
+import { s as j, i as P, r as q } from "./aria-idref-CxvyzfQS.js";
 import { f as k } from "./aria-flatten-DY6v2vah.js";
 import { H as K } from "./helix-element-BNEYeiys.js";
 import { c as X } from "./id-counter-DuX8vsui.js";
@@ -1395,4 +1395,4 @@ l = n([
 export {
   l as H
 };
-//# sourceMappingURL=hx-date-picker-N-0aG5XL.js.map
+//# sourceMappingURL=hx-date-picker-CiR7FVnR.js.map