@helixui/library 1.0.1 → 1.1.2

package/dist/shared/{hx-data-table-BwoJCFgs.js → hx-data-table-BWvd5NNx.js}

@@ -1,7 +1,8 @@
 import { css as u, LitElement as m, html as l, nothing as p } from "lit";
-import { property as d, state as f, customElement as y } from "lit/decorators.js";
-import { tokenStyles as w } from "@helixui/tokens/lit";
-const x = u`
+import { property as d, state as f, customElement as w } from "lit/decorators.js";
+import { repeat as y } from "lit/directives/repeat.js";
+import { tokenStyles as x } from "@helixui/tokens/lit";
+const g = u`
   :host {
     display: block;
     overflow-x: auto;
@@ -43,7 +44,7 @@ const x = u`
   th,
   td {
     padding: var(--hx-space-3, 0.75rem) var(--hx-space-4, 1rem);
-    text-align: left;
+    text-align: start;
     border-bottom: var(--hx-border-width-thin, 1px) solid
       var(--hx-data-table-border-color, var(--hx-color-neutral-200, #e2e8f0));
     vertical-align: middle;
@@ -66,7 +67,7 @@ const x = u`
     /* WCAG 2.5.5 (healthcare mandate): minimum 44x44px touch target */
     width: var(--hx-touch-target-min, 2.75rem);
     min-width: var(--hx-touch-target-min, 2.75rem);
-    padding-right: var(--hx-space-2, 0.5rem);
+    padding-inline-end: var(--hx-space-2, 0.5rem);
   }
 
   th.col-checkbox {
@@ -176,6 +177,14 @@ const x = u`
       animation: none;
       opacity: 0.6;
     }
+
+    .sort-icon {
+      transition: none;
+    }
+
+    tbody tr {
+      transition: none;
+    }
   }
 
   /* ─── Cell Focus ─── */
@@ -198,36 +207,41 @@ const x = u`
     padding: var(--hx-space-8, 2rem) var(--hx-space-4, 1rem);
   }
 `;
-var g = Object.defineProperty, v = Object.getOwnPropertyDescriptor, h = (t, e, r, o) => {
-  for (var s = o > 1 ? void 0 : o ? v(e, r) : e, a = t.length - 1, n; a >= 0; a--)
-    (n = t[a]) && (s = (o ? n(e, r, s) : n(s)) || s);
-  return o && s && g(e, r, s), s;
+var v = Object.defineProperty, k = Object.getOwnPropertyDescriptor, n = (t, e, r, s) => {
+  for (var o = s > 1 ? void 0 : s ? k(e, r) : e, a = t.length - 1, c; a >= 0; a--)
+    (c = t[a]) && (o = (s ? c(e, r, o) : c(o)) || o);
+  return s && o && v(e, r, o), o;
 };
 let i = class extends m {
   constructor() {
-    super(...arguments), this.columns = [], this.rows = [], this.selectable = !1, this.sortKey = "", this.sortDirection = "asc", this.loading = !1, this.emptyLabel = "No data", this.label = "", this.stickyHeader = !1, this.page = 1, this.pageSize = 0, this._selectedRows = /* @__PURE__ */ new Set();
+    super(...arguments), this.columns = [], this.rows = [], this.selectable = !1, this.sortKey = "", this.sortDirection = "asc", this.loading = !1, this.emptyLabel = "No data", this.label = "", this.selectAllLabel = "Select all rows", this.stickyHeader = !1, this.page = 1, this.pageSize = 0, this._selectedRows = /* @__PURE__ */ new Set();
   }
   // ─── Lifecycle ───
   willUpdate(t) {
-    if (t.has("columns"))
-      if (typeof this.columns == "string")
+    if (t.has("columns")) {
+      const e = this.columns;
+      if (typeof e == "string")
         try {
-          this.columns = JSON.parse(this.columns);
+          this.columns = JSON.parse(e);
         } catch {
           this.columns = [];
         }
       else Array.isArray(this.columns) || (this.columns = []);
-    if (t.has("rows"))
-      if (typeof this.rows == "string")
+    }
+    if (t.has("rows")) {
+      const e = this.rows;
+      if (typeof e == "string")
         try {
-          this.rows = JSON.parse(this.rows);
+          this.rows = JSON.parse(e);
         } catch {
           this.rows = [];
         }
       else Array.isArray(this.rows) || (this.rows = []);
+    }
     t.has("rows") && this.rows.length > 500, (t.has("label") || t.has("columns")) && this.columns.length > 0 && this.label;
   }
   // ─── Event Handlers ───
+  /** @internal */
   _handleSort(t) {
     const e = this.sortKey === t && this.sortDirection === "asc" ? "desc" : "asc";
     this.sortKey = t, this.sortDirection = e, this.dispatchEvent(
@@ -238,6 +252,7 @@ let i = class extends m {
       })
     );
   }
+  /** @internal */
   _handleRowClick(t, e) {
     this.dispatchEvent(
       new CustomEvent("hx-row-click", {
@@ -247,25 +262,32 @@ let i = class extends m {
       })
     );
   }
+  /** @internal */
   _handleSelect(t, e) {
     const r = new Set(this._selectedRows);
     e ? r.add(t) : r.delete(t), this._selectedRows = r, this._dispatchSelect();
   }
+  /** @internal */
   _handleSelectAll(t) {
     this._selectedRows = t ? new Set(this.rows.map((e, r) => r)) : /* @__PURE__ */ new Set(), this._dispatchSelect();
   }
+  /** @internal */
   _dispatchSelect() {
     this.dispatchEvent(
       new CustomEvent("hx-select", {
         bubbles: !0,
         composed: !0,
         detail: {
-          selectedRows: [...this._selectedRows].map((t) => this.rows[t])
+          selectedRows: [...this._selectedRows].flatMap((t) => {
+            const e = this.rows[t];
+            return e !== void 0 ? [e] : [];
+          })
         }
       })
     );
   }
   // ─── Keyboard Navigation ───
+  /** @internal */
   _handleKeydown(t) {
     var b;
     if (!["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight", "Home", "End", " "].includes(t.key))
@@ -273,43 +295,44 @@ let i = class extends m {
     const e = this.shadowRoot;
     if (!e) return;
     const r = Array.from(e.querySelectorAll('[part~="td"],[part~="th"]'));
-    let o = e.activeElement;
-    if (!o) return;
-    if (r.indexOf(o) === -1) {
-      let c = o.parentElement;
-      for (; c; ) {
-        if (r.includes(c)) {
-          o = c;
+    let s = e.activeElement;
+    if (!s) return;
+    if (r.indexOf(s) === -1) {
+      let h = s.parentElement;
+      for (; h; ) {
+        if (r.includes(h)) {
+          s = h;
           break;
         }
-        c = c.parentElement;
+        h = h.parentElement;
       }
     }
-    const s = this.columns.length + (this.selectable ? 1 : 0), a = r.indexOf(o);
+    const o = this.columns.length + (this.selectable ? 1 : 0), a = r.indexOf(s);
     if (a === -1) return;
-    let n = null;
+    let c = null;
     if (t.key === "ArrowRight" && a + 1 < r.length)
-      n = r[a + 1] ?? null;
+      c = r[a + 1] ?? null;
     else if (t.key === "ArrowLeft" && a - 1 >= 0)
-      n = r[a - 1] ?? null;
-    else if (t.key === "ArrowDown" && a + s < r.length)
-      n = r[a + s] ?? null;
-    else if (t.key === "ArrowUp" && a - s >= 0)
-      n = r[a - s] ?? null;
+      c = r[a - 1] ?? null;
+    else if (t.key === "ArrowDown" && a + o < r.length)
+      c = r[a + o] ?? null;
+    else if (t.key === "ArrowUp" && a - o >= 0)
+      c = r[a - o] ?? null;
     else if (t.key === "Home") {
-      const c = a - a % s;
-      n = r[c] ?? null;
+      const h = a - a % o;
+      c = r[h] ?? null;
     } else if (t.key === "End") {
-      const c = Math.min(a - a % s + s - 1, r.length - 1);
-      n = r[c] ?? null;
-    } else if (t.key === " " && ((b = o.getAttribute("part")) != null && b.includes("td"))) {
-      const c = Number(o.dataset.rowIndex);
-      this.selectable && !isNaN(c) && (t.preventDefault(), this._handleSelect(c, !this._selectedRows.has(c)));
+      const h = Math.min(a - a % o + o - 1, r.length - 1);
+      c = r[h] ?? null;
+    } else if (t.key === " " && ((b = s.getAttribute("part")) != null && b.includes("td"))) {
+      const h = Number(s.dataset.rowIndex);
+      this.selectable && !isNaN(h) && (t.preventDefault(), this._handleSelect(h, !this._selectedRows.has(h)));
       return;
     }
-    n && (t.preventDefault(), n.setAttribute("tabindex", "0"), n.focus(), o.setAttribute("tabindex", "-1"));
+    c && (t.preventDefault(), c.setAttribute("tabindex", "0"), c.focus(), s.setAttribute("tabindex", "-1"));
   }
   // ─── Render Helpers ───
+  /** @internal */
   _renderSortIcon(t) {
     const e = this.sortKey === t, r = [
       "sort-icon",
@@ -330,6 +353,7 @@ let i = class extends m {
       </span>
     `;
   }
+  /** @internal */
   _renderHeaderRow() {
     return l`
       <tr part="tr">
@@ -338,7 +362,7 @@ let i = class extends m {
                 <input
                   type="checkbox"
                   part="checkbox"
-                  aria-label="Select all rows"
+                  aria-label=${this.selectAllLabel}
                   .indeterminate=${this._selectedRows.size > 0 && this._selectedRows.size < this.rows.length}
                   .checked=${this._selectedRows.size === this.rows.length && this.rows.length > 0}
                   @change=${(t) => this._handleSelectAll(t.target.checked)}
@@ -368,11 +392,12 @@ let i = class extends m {
       </tr>
     `;
   }
+  /** @internal */
   _renderSkeletonRows() {
     return Array.from(
       { length: 3 },
-      (t, e) => l`
-        <tr part="tr" aria-hidden="true" key=${e}>
+      (t) => l`
+        <tr part="tr" aria-hidden="true">
           ${this.selectable ? l`<td part="td" class="col-checkbox">
                 <span class="skeleton-cell" style="width:1rem;margin:auto"></span>
               </td>` : p}
@@ -387,6 +412,7 @@ let i = class extends m {
       `
     );
   }
+  /** @internal */
   _renderEmptyRow() {
     const t = this.columns.length + (this.selectable ? 1 : 0);
     return l`
@@ -397,42 +423,47 @@ let i = class extends m {
       </tr>
     `;
   }
+  /** @internal */
   _renderDataRows() {
     let t = this.rows;
     if (this.pageSize > 0) {
       const e = (this.page - 1) * this.pageSize;
       t = this.rows.slice(e, e + this.pageSize);
     }
-    return t.map((e, r) => {
-      const o = this.pageSize > 0 ? (this.page - 1) * this.pageSize + r : r;
-      return l`
-        <tr
-          part="tr"
-          aria-selected=${this.selectable ? String(this._selectedRows.has(o)) : p}
-          @click=${() => this._handleRowClick(e, o)}
-        >
-          ${this.selectable ? l`
-                <td part="td" class="col-checkbox" tabindex="-1" data-row-index=${o}>
-                  <input
-                    type="checkbox"
-                    part="checkbox"
-                    aria-label=${`Select row ${o + 1}`}
-                    .checked=${this._selectedRows.has(o)}
-                    @click=${(s) => s.stopPropagation()}
-                    @change=${(s) => this._handleSelect(o, s.target.checked)}
-                  />
+    return y(
+      t,
+      (e, r) => this.pageSize > 0 ? (this.page - 1) * this.pageSize + r : r,
+      (e, r) => {
+        const s = this.pageSize > 0 ? (this.page - 1) * this.pageSize + r : r;
+        return l`
+          <tr
+            part="tr"
+            aria-selected=${this.selectable ? String(this._selectedRows.has(s)) : p}
+            @click=${() => this._handleRowClick(e, s)}
+          >
+            ${this.selectable ? l`
+                  <td part="td" class="col-checkbox" tabindex="-1" data-row-index=${s}>
+                    <input
+                      type="checkbox"
+                      part="checkbox"
+                      aria-label=${`Select row ${s + 1}`}
+                      .checked=${this._selectedRows.has(s)}
+                      @click=${(o) => o.stopPropagation()}
+                      @change=${(o) => this._handleSelect(s, o.target.checked)}
+                    />
+                  </td>
+                ` : p}
+            ${this.columns.map(
+          (o) => l`
+                <td part="td" tabindex="-1" data-row-index=${s}>
+                  ${e[o.key] != null ? String(e[o.key]) : ""}
                 </td>
-              ` : p}
-          ${this.columns.map(
-        (s) => l`
-              <td part="td" tabindex="-1" data-row-index=${o}>
-                ${e[s.key] != null ? String(e[s.key]) : ""}
-              </td>
-            `
-      )}
-        </tr>
-      `;
-    });
+              `
+        )}
+          </tr>
+        `;
+      }
+    );
   }
   // ─── Render ───
   render() {
@@ -457,47 +488,50 @@ let i = class extends m {
     `;
   }
 };
-i.styles = [w, x];
-h([
+i.styles = [x, g];
+n([
   d({ type: Array })
 ], i.prototype, "columns", 2);
-h([
+n([
   d({ type: Array })
 ], i.prototype, "rows", 2);
-h([
+n([
   d({ type: Boolean, reflect: !0 })
 ], i.prototype, "selectable", 2);
-h([
+n([
   d({ type: String, attribute: "sort-key" })
 ], i.prototype, "sortKey", 2);
-h([
+n([
   d({ type: String, attribute: "sort-direction" })
 ], i.prototype, "sortDirection", 2);
-h([
+n([
   d({ type: Boolean, reflect: !0 })
 ], i.prototype, "loading", 2);
-h([
+n([
   d({ type: String, attribute: "empty-label" })
 ], i.prototype, "emptyLabel", 2);
-h([
+n([
   d({ type: String })
 ], i.prototype, "label", 2);
-h([
+n([
+  d({ attribute: "select-all-label" })
+], i.prototype, "selectAllLabel", 2);
+n([
   d({ type: Boolean, reflect: !0, attribute: "sticky-header" })
 ], i.prototype, "stickyHeader", 2);
-h([
+n([
   d({ type: Number })
 ], i.prototype, "page", 2);
-h([
+n([
   d({ type: Number, attribute: "page-size" })
 ], i.prototype, "pageSize", 2);
-h([
+n([
   f()
 ], i.prototype, "_selectedRows", 2);
-i = h([
-  y("hx-data-table")
+i = n([
+  w("hx-data-table")
 ], i);
 export {
   i as H
 };
-//# sourceMappingURL=hx-data-table-BwoJCFgs.js.map
+//# sourceMappingURL=hx-data-table-BWvd5NNx.js.map

package/dist/shared/hx-data-table-BWvd5NNx.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hx-data-table-BWvd5NNx.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-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-neutral-50, #f8fafc));\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-neutral-50, #f8fafc));\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-neutral-200, #e2e8f0));\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-neutral-700, #334155));\n    white-space: nowrap;\n  }\n\n  td {\n    color: var(--hx-data-table-cell-color, var(--hx-color-neutral-900, #0f172a));\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-focus-ring-color, var(--hx-color-primary-500, #2563eb));\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: 0.4;\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: 1;\n    color: var(--hx-color-primary-500, #2563eb);\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-neutral-50, #f8fafc));\n  }\n\n  tbody tr[aria-selected='true'] {\n    background-color: var(--hx-data-table-row-selected-bg, var(--hx-color-primary-50, #eff6ff));\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-color-primary-500, #2563eb);\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    background: linear-gradient(\n      90deg,\n      var(--hx-color-neutral-200, #e2e8f0) 25%,\n      var(--hx-color-neutral-100, #f1f5f9) 50%,\n      var(--hx-color-neutral-200, #e2e8f0) 75%\n    );\n    background-size: 200% 100%;\n    animation: hx-shimmer 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: 0.6;\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-focus-ring-color, var(--hx-color-primary-500, #2563eb));\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-neutral-600, #475569));\n    padding: var(--hx-space-8, 2rem) var(--hx-space-4, 1rem);\n  }\n`;\n","import { LitElement, html, nothing, type PropertyValues } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { tokenStyles } from '@helixui/tokens/lit';\nimport { helixDataTableStyles } from './hx-data-table.styles.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/**\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 */\n@customElement('hx-data-table')\nexport class HelixDataTable extends LitElement {\n  static override styles = [tokenStyles, helixDataTableStyles];\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({ type: Array })\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({ type: Array })\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  // ─── 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    if (changed.has('columns')) {\n      const rawColumns: unknown = this.columns;\n      if (typeof rawColumns === 'string') {\n        try {\n          this.columns = JSON.parse(rawColumns) as HxDataTableColumn[];\n        } catch {\n          this.columns = [];\n        }\n      } else if (!Array.isArray(this.columns)) {\n        this.columns = [];\n      }\n    }\n    if (changed.has('rows')) {\n      const rawRows: unknown = this.rows;\n      if (typeof rawRows === 'string') {\n        try {\n          this.rows = JSON.parse(rawRows) as Record<string, unknown>[];\n        } catch {\n          this.rows = [];\n        }\n      } else if (!Array.isArray(this.rows)) {\n        this.rows = [];\n      }\n    }\n    // Only warn when rows actually changes to avoid noise on every property update.\n    if (changed.has('rows') && this.rows.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.columns.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  // ─── 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.rows.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.rows[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    const cells = Array.from(root.querySelectorAll<HTMLElement>('[part~=\"td\"],[part~=\"th\"]'));\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.columns.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  /** @internal */\n  private _renderHeaderRow() {\n    return html`\n      <tr part=\"tr\">\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.rows.length}\n                  .checked=${this._selectedRows.size === this.rows.length && this.rows.length > 0}\n                  @change=${(e: Event) =>\n                    this._handleSelectAll((e.target as HTMLInputElement).checked)}\n                />\n              </th>\n            `\n          : nothing}\n        ${this.columns.map(\n          (col) => html`\n            <th\n              part=\"th\"\n              tabindex=\"0\"\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            >\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.columns.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.columns.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.rows;\n\n    // Client-side pagination when pageSize > 0\n    if (this.pageSize > 0) {\n      const start = (this.page - 1) * this.pageSize;\n      displayRows = this.rows.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          >\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.columns.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.rows.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","LitElement","changed","rawColumns","rawRows","key","direction","row","index","checked","next","_","i","e","root","cells","focused","ancestor","colCount","idx","target","rowStart","rowEnd","_a","rowIdx","isActive","iconClass","html","nothing","col","colSpan","displayRows","start","repeat","_row","pageIndex","globalIndex","tokenStyles","__decorateClass","property","state","customElement"],"mappings":"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"}