@helixui/library 3.1.0-next.66 → 3.1.0-next.67

package/dist/css/hx-status-indicator.css

@@ -70,7 +70,7 @@
       --hx-status-indicator-label-font-size,
       var(--hx-font-size-sm, var(--hx-text-sm, 0.875rem))
     );
-    color: var(--hx-status-indicator-label-color, var(--hx-color-neutral-700, #334155));
+    color: var(--hx-status-indicator-label-color, var(--hx-color-text-strong, #334155));
     line-height: 1;
     white-space: nowrap;
   }

package/dist/css/hx-table.css

@@ -31,7 +31,7 @@
     text-align: start;
     padding: var(--hx-space-2, 0.5rem) var(--hx-space-4, 1rem);
     font-weight: var(--hx-font-weight-semibold, 600);
-    color: var(--hx-table-header-color, var(--hx-color-neutral-700, #334155));
+    color: var(--hx-table-header-color, var(--hx-color-text-strong, #1e293b));
     font-size: var(--hx-font-size-md, 1rem);
   }
 
@@ -47,12 +47,12 @@
 
   /* Header background via CSS vars that cascade through display:contents */
   ::slotted(hx-thead) {
-    --_hx-table-cell-bg: var(--hx-table-header-bg, var(--hx-color-neutral-50, #f8fafc));
+    --_hx-table-cell-bg: var(--hx-table-header-bg, var(--hx-color-surface-raised, #f8fafc));
   }
 
   /* Striped variant: set stripe signal on hx-tbody (direct slotted child) so hx-tbody can apply to even rows */
   :host([variant='striped']) ::slotted(hx-tbody) {
-    --_hx-table-row-stripe-bg: var(--hx-table-stripe-bg, var(--hx-color-neutral-50, #f8fafc));
+    --_hx-table-row-stripe-bg: var(--hx-table-stripe-bg, var(--hx-color-surface-raised, #f8fafc));
   }
 
   /* Hover variant: set hover bg variable on direct slotted section elements */
@@ -62,7 +62,7 @@
   :host([variant='striped']) ::slotted(hx-thead),
   :host([variant='default']) ::slotted(hx-tbody),
   :host([variant='default']) ::slotted(hx-thead) {
-    --_hx-table-row-hover-bg: var(--hx-table-row-hover-bg, var(--hx-color-neutral-50, #f8fafc));
+    --_hx-table-row-hover-bg: var(--hx-table-row-hover-bg, var(--hx-color-surface-raised, #f8fafc));
   }
 
   /* Compact variant: reduced padding signal set on section elements that cascade to cells */
@@ -78,7 +78,7 @@
     --_hx-table-th-position: sticky;
     --_hx-table-th-top: 0;
     --_hx-table-th-z-index: 1;
-    --_hx-table-th-bg: var(--hx-table-header-bg, var(--hx-color-neutral-50, #f8fafc));
+    --_hx-table-th-bg: var(--hx-table-header-bg, var(--hx-color-surface-raised, #f8fafc));
   }
 
   /* ─── Focus ─── */

package/dist/css/hx-toast.css

@@ -18,8 +18,8 @@
     gap: var(--hx-space-3, 0.75rem);
     padding: var(--hx-space-3, 0.75rem) var(--hx-space-4, 1rem);
     border-radius: var(--hx-toast-border-radius, var(--hx-border-radius-md, 0.375rem));
-    background-color: var(--hx-toast-bg, var(--hx-color-neutral-900, #0f172a));
-    color: var(--hx-toast-color, var(--hx-color-neutral-0, #ffffff));
+    background-color: var(--hx-toast-bg, var(--hx-color-surface-inverse, #0f172a));
+    color: var(--hx-toast-color, var(--hx-color-text-inverse, #ffffff));
     font-family: var(--hx-toast-font-family, var(--hx-font-family-sans, sans-serif));
     font-size: var(--hx-font-size-sm, 0.875rem);
     line-height: var(--hx-line-height-normal, 1.5);
@@ -46,22 +46,22 @@
 
   .toast--success {
     --hx-toast-bg: var(--hx-color-success-600, #15803d);
-    --hx-toast-color: var(--hx-color-neutral-0, #ffffff);
+    --hx-toast-color: var(--hx-color-text-on-success, #ffffff);
   }
 
   .toast--warning {
     --hx-toast-bg: var(--hx-color-warning-500, #d97706);
-    --hx-toast-color: var(--hx-color-neutral-900, #0f172a);
+    --hx-toast-color: var(--hx-color-text-on-warning, #0f172a);
   }
 
   .toast--danger {
     --hx-toast-bg: var(--hx-color-error-600, #b91c1c);
-    --hx-toast-color: var(--hx-color-neutral-0, #ffffff);
+    --hx-toast-color: var(--hx-color-text-on-error, #ffffff);
   }
 
   .toast--info {
     --hx-toast-bg: var(--hx-color-primary-600, #1d4ed8);
-    --hx-toast-color: var(--hx-color-neutral-0, #ffffff);
+    --hx-toast-color: var(--hx-color-text-on-primary, #ffffff);
   }
 
   /* ─── Severity Label (WCAG 1.4.1) ─── */

package/dist/css/index.css

@@ -1,4 +1,4 @@
-/* index.css — generated 2026-04-24T18:37:35.804Z */
+/* index.css — generated 2026-04-24T19:28:50.110Z */
 /* Imports all per-component CSS files for Drupal asset pipeline */
 
 @import './hx-accordion.css';

package/dist/css/manifest.json

@@ -1,5 +1,5 @@
 {
-  "generated": "2026-04-24T18:37:35.803Z",
+  "generated": "2026-04-24T19:28:50.109Z",
   "components": [
     {
       "name": "hx-accordion",
@@ -517,15 +517,14 @@
         "--hx-code-snippet-line-number-color",
         "--hx-code-snippet-padding",
         "--hx-code-snippet-tab-size",
-        "--hx-color-neutral-100",
-        "--hx-color-neutral-200",
-        "--hx-color-neutral-300",
-        "--hx-color-neutral-500",
-        "--hx-color-neutral-600",
-        "--hx-color-neutral-700",
-        "--hx-color-neutral-800",
-        "--hx-color-neutral-900",
+        "--hx-color-border-default",
+        "--hx-color-border-strong",
         "--hx-color-primary-400",
+        "--hx-color-surface-inverse",
+        "--hx-color-surface-sunken",
+        "--hx-color-text-inverse",
+        "--hx-color-text-muted",
+        "--hx-color-text-primary",
         "--hx-filter-brightness-active",
         "--hx-focus-ring-color",
         "--hx-focus-ring-offset",
@@ -1630,7 +1629,7 @@
       "file": "hx-rating.css",
       "tokens": [
         "--hx-border-radius-sm",
-        "--hx-color-neutral-300",
+        "--hx-color-border-strong",
         "--hx-color-primary-400",
         "--hx-color-warning-300",
         "--hx-color-warning-400",
@@ -1927,12 +1926,12 @@
         "--hx-border-radius-sm",
         "--hx-color-error-50",
         "--hx-color-error-700",
-        "--hx-color-neutral-500",
-        "--hx-color-neutral-800",
-        "--hx-color-neutral-900",
         "--hx-color-primary-500",
         "--hx-color-success-50",
         "--hx-color-success-700",
+        "--hx-color-text-muted",
+        "--hx-color-text-primary",
+        "--hx-color-text-strong",
         "--hx-font-family-sans",
         "--hx-font-size-3xl",
         "--hx-font-size-5xl",
@@ -1975,8 +1974,8 @@
         "--hx-color-error-500",
         "--hx-color-neutral-300",
         "--hx-color-neutral-400",
-        "--hx-color-neutral-700",
         "--hx-color-success-500",
+        "--hx-color-text-strong",
         "--hx-color-warning-500",
         "--hx-font-size-sm",
         "--hx-space-2",
@@ -2103,9 +2102,9 @@
       "name": "hx-table",
       "file": "hx-table.css",
       "tokens": [
-        "--hx-color-neutral-50",
-        "--hx-color-neutral-700",
         "--hx-color-primary-500",
+        "--hx-color-surface-raised",
+        "--hx-color-text-strong",
         "--hx-focus-ring-color",
         "--hx-focus-ring-offset",
         "--hx-focus-ring-width",
@@ -2372,10 +2371,14 @@
         "--hx-border-radius-md",
         "--hx-border-radius-sm",
         "--hx-color-error-600",
-        "--hx-color-neutral-0",
-        "--hx-color-neutral-900",
         "--hx-color-primary-600",
         "--hx-color-success-600",
+        "--hx-color-surface-inverse",
+        "--hx-color-text-inverse",
+        "--hx-color-text-on-error",
+        "--hx-color-text-on-primary",
+        "--hx-color-text-on-success",
+        "--hx-color-text-on-warning",
         "--hx-color-warning-500",
         "--hx-focus-ring-offset",
         "--hx-focus-ring-width",

package/dist/index.js

@@ -13,7 +13,7 @@ import { H as G, a as U } from "./shared/hx-carousel-item-D_dCv61-.js";
 import { H as O } from "./shared/hx-checkbox-ZKjOF7_3.js";
 import { H as K } from "./shared/hx-checkbox-group-XjOBHLiP.js";
 import { H as Y } from "./shared/hx-clinical-status-BS5lcddT.js";
-import { H as q } from "./shared/hx-code-snippet-B7wUKzyb.js";
+import { H as q } from "./shared/hx-code-snippet-DssubcYM.js";
 import { H as J } from "./shared/hx-color-picker-DBaKTVLr.js";
 import { H as Z } from "./shared/hx-combobox-DLwnvHVd.js";
 import { H as oe } from "./shared/hx-container-DVI7sxfX.js";
@@ -51,7 +51,7 @@ import { H as fo } from "./shared/hx-progress-bar-CJdwAeDg.js";
 import { H as ho } from "./shared/hx-progress-ring-3zMwvrwD.js";
 import { H as So } from "./shared/hx-prose-BCtK7YL6.js";
 import { H as To, a as bo } from "./shared/hx-radio-QHrhL908.js";
-import { H as go } from "./shared/hx-rating-C3E3ENJb.js";
+import { H as go } from "./shared/hx-rating-BO9kl9pb.js";
 import { H as vo } from "./shared/hx-select-BuMvRDkY.js";
 import { H as Eo, a as Do } from "./shared/hx-nav-item-BTMMQv6c.js";
 import { H as wo } from "./shared/hx-skeleton-LxkI0pxr.js";
@@ -60,21 +60,21 @@ import { H as Mo } from "./shared/hx-spinner-BKjuCdZB.js";
 import { H as No } from "./shared/hx-split-button-CEkQqbF9.js";
 import { H as Ao } from "./shared/hx-split-panel-BymHlV5e.js";
 import { H as Go } from "./shared/hx-stack-DGfcOfWJ.js";
-import { H as Vo } from "./shared/hx-stat-BTpykQAt.js";
-import { H as Xo } from "./shared/hx-status-indicator-X2QEWNFt.js";
-import { H as Wo, a as Yo } from "./shared/hx-step-CRNQlmSo.js";
+import { H as Vo } from "./shared/hx-stat-DTRyLF3a.js";
+import { H as Xo } from "./shared/hx-status-indicator-DIGRGM2G.js";
+import { H as Wo, a as Yo } from "./shared/hx-step-D15gtcLm.js";
 import { H as qo, a as zo } from "./shared/hx-structured-list-CqNbaEXg.js";
 import { H as Qo } from "./shared/hx-style-scope-TDnR8H4O.js";
 import { H as et } from "./shared/hx-switch-CbunfMHW.js";
-import { H as tt, a as rt, b as at, c as it, d as st, e as xt, f as Ht } from "./shared/hx-td-Bra35cH4.js";
+import { H as tt, a as rt, b as at, c as it, d as st, e as xt, f as Ht } from "./shared/hx-td-B737T0_c.js";
 import { H as nt, a as pt, b as mt } from "./shared/hx-tab-panel-BIzKfW5i.js";
 import { H as ct } from "./shared/hx-tag-CgnrNnte.js";
 import { H as ht } from "./shared/hx-text-DMC2CPlL.js";
 import { F as St, H as yt } from "./shared/hx-text-input-eSPVURd5.js";
 import { H as bt } from "./shared/hx-textarea-C4DjRmo4.js";
-import { H as gt } from "./shared/hx-theme-DP4oPU1i.js";
+import { H as gt } from "./shared/hx-theme-BiyQ7UUK.js";
 import { H as vt } from "./shared/hx-time-picker-BtbHX7A4.js";
-import { H as Et, a as Dt, t as kt } from "./shared/toast-factory-BPPnG3mM.js";
+import { H as Et, a as Dt, t as kt } from "./shared/toast-factory-M373dTcz.js";
 import { H as Bt } from "./shared/hx-toggle-button-FOvw-ebx.js";
 import { H as Ft } from "./shared/hx-tooltip-BoZi2crX.js";
 import { H as Lt } from "./shared/hx-top-nav-Cd9zvv1B.js";

package/dist/shared/{hx-code-snippet-B7wUKzyb.js → hx-code-snippet-DssubcYM.js}

@@ -1,8 +1,8 @@
-import { css as u, html as p, nothing as h } from "lit";
-import { property as r, state as d, customElement as m } from "lit/decorators.js";
+import { css as f, html as p, nothing as h } from "lit";
+import { property as r, state as d, customElement as u } from "lit/decorators.js";
 import { classMap as x } from "lit/directives/class-map.js";
-import { H as f } from "./helix-element-BNEYeiys.js";
-const b = u`
+import { H as m } from "./helix-element-BNEYeiys.js";
+const b = f`
   :host {
     display: block;
   }
@@ -17,8 +17,8 @@ const b = u`
     display: inline;
     font-family: var(--hx-code-snippet-font-family, var(--hx-font-family-mono, monospace));
     font-size: var(--hx-code-snippet-font-size, var(--hx-font-size-sm, 0.875em));
-    background-color: var(--hx-code-snippet-inline-bg, var(--hx-color-neutral-100, #f1f5f9));
-    color: var(--hx-code-snippet-inline-color, var(--hx-color-neutral-900, #0f172a));
+    background-color: var(--hx-code-snippet-inline-bg, var(--hx-color-surface-sunken, #f1f5f9));
+    color: var(--hx-code-snippet-inline-color, var(--hx-color-text-primary, #0f172a));
     padding: var(--hx-code-snippet-inline-padding-y, 0.125em)
       var(--hx-code-snippet-inline-padding-x, 0.375em);
     border-radius: var(--hx-code-snippet-border-radius, var(--hx-border-radius-sm, 0.25rem));
@@ -28,7 +28,7 @@ const b = u`
 
   .code-snippet {
     position: relative;
-    background-color: var(--hx-code-snippet-bg, var(--hx-color-neutral-900, #0f172a));
+    background-color: var(--hx-code-snippet-bg, var(--hx-color-surface-inverse, #0f172a));
     border-radius: var(--hx-code-snippet-border-radius, var(--hx-border-radius-md, 0.375rem));
     overflow: hidden;
   }
@@ -68,7 +68,7 @@ const b = u`
     font-family: var(--hx-code-snippet-font-family, var(--hx-font-family-mono, monospace));
     font-size: var(--hx-code-snippet-font-size, var(--hx-font-size-sm, 0.875rem));
     line-height: var(--hx-line-height-relaxed, 1.75);
-    color: var(--hx-code-snippet-color, var(--hx-color-neutral-100, #f1f5f9));
+    color: var(--hx-code-snippet-color, var(--hx-color-text-inverse, #ffffff));
     tab-size: var(--hx-code-snippet-tab-size, 2);
   }
 
@@ -82,10 +82,11 @@ const b = u`
     min-width: var(--hx-touch-target-min, 2.75rem);
     min-height: var(--hx-touch-target-min, 2.75rem);
     padding: var(--hx-space-1, 0.25rem) var(--hx-space-2, 0.5rem);
-    border: var(--hx-border-width-thin, 1px) solid var(--hx-color-neutral-600, #475569);
+    border: var(--hx-border-width-thin, 1px) solid var(--hx-color-border-strong, #94a3b8);
     border-radius: var(--hx-border-radius-sm, 0.25rem);
-    background-color: var(--hx-color-neutral-800, #1e293b);
-    color: var(--hx-color-neutral-200, #e2e8f0);
+    /* Copy button sits on the always-dark block snippet surface; uses inverse family for contrast on the terminal background. */
+    background-color: var(--hx-color-surface-inverse, #0f172a);
+    color: var(--hx-color-text-inverse, #ffffff);
     font-family: var(--hx-code-snippet-font-family, var(--hx-font-family-sans, sans-serif));
     font-size: var(--hx-font-size-xs, 0.75rem);
     font-weight: var(--hx-font-weight-medium, 500);
@@ -100,8 +101,9 @@ const b = u`
   }
 
   .code-snippet__copy-button:hover {
-    background-color: var(--hx-color-neutral-700, #334155);
-    border-color: var(--hx-color-neutral-500, #64748b);
+    /* Hover on inverse terminal surface — keep semantic inverse family; border lifts via border-default in inverse context. */
+    background-color: var(--hx-color-surface-inverse, #0f172a);
+    border-color: var(--hx-color-border-default, #e2e8f0);
   }
 
   .code-snippet__copy-button:focus-visible {
@@ -125,9 +127,10 @@ const b = u`
     min-height: var(--hx-touch-target-min, 2.75rem);
     padding: var(--hx-space-2, 0.5rem) var(--hx-space-4, 1rem);
     border: none;
-    border-top: var(--hx-border-width-thin, 1px) solid var(--hx-color-neutral-700, #334155);
-    background-color: var(--hx-color-neutral-800, #1e293b);
-    color: var(--hx-color-neutral-300, #cbd5e1);
+    border-top: var(--hx-border-width-thin, 1px) solid var(--hx-color-border-strong, #94a3b8);
+    /* Expand button is attached to the always-dark block snippet — inverse family maintains the terminal aesthetic. */
+    background-color: var(--hx-color-surface-inverse, #0f172a);
+    color: var(--hx-color-text-inverse, #ffffff);
     font-family: var(--hx-code-snippet-font-family, var(--hx-font-family-sans, sans-serif));
     font-size: var(--hx-font-size-sm, 0.875rem);
     font-weight: var(--hx-font-weight-medium, 500);
@@ -137,8 +140,8 @@ const b = u`
   }
 
   .code-snippet__expand-button:hover {
-    background-color: var(--hx-color-neutral-700, #334155);
-    color: var(--hx-color-neutral-100, #f1f5f9);
+    background-color: var(--hx-color-surface-inverse, #0f172a);
+    color: var(--hx-color-text-inverse, #ffffff);
   }
 
   .code-snippet__expand-button:focus-visible {
@@ -153,7 +156,7 @@ const b = u`
     display: inline-block;
     min-width: var(--hx-space-8, 2rem);
     padding-inline-end: var(--hx-space-3, 0.75rem);
-    color: var(--hx-code-snippet-line-number-color, var(--hx-color-neutral-500, #64748b));
+    color: var(--hx-code-snippet-line-number-color, var(--hx-color-text-muted, #64748b));
     user-select: none;
     text-align: end;
   }
@@ -204,12 +207,12 @@ const b = u`
     border: 0;
   }
 `;
-var v = Object.defineProperty, _ = Object.getOwnPropertyDescriptor, i = (e, t, n, a) => {
-  for (var s = a > 1 ? void 0 : a ? _(t, n) : t, l = e.length - 1, c; l >= 0; l--)
+var v = Object.defineProperty, y = Object.getOwnPropertyDescriptor, i = (e, t, n, a) => {
+  for (var s = a > 1 ? void 0 : a ? y(t, n) : t, l = e.length - 1, c; l >= 0; l--)
     (c = e[l]) && (s = (a ? c(t, n, s) : c(s)) || s);
   return a && s && v(t, n, s), s;
 };
-let o = class extends f {
+let o = class extends m {
   constructor() {
     super(...arguments), this.language = "", this.inline = !1, this.wrap = !1, this.copyable = !1, this.maxLines = 0, this.lineNumbers = !1, this.labelCopy = "Copy code", this.labelCopied = "Copied!", this.labelShowMore = "Show more", this.labelShowLess = "Show less", this._copied = !1, this._expanded = !1, this._codeText = "", this._copyTimer = null;
   }
@@ -374,9 +377,9 @@ i([
   d()
 ], o.prototype, "_codeText", 2);
 o = i([
-  m("hx-code-snippet")
+  u("hx-code-snippet")
 ], o);
 export {
   o as H
 };
-//# sourceMappingURL=hx-code-snippet-B7wUKzyb.js.map
+//# sourceMappingURL=hx-code-snippet-DssubcYM.js.map

package/dist/shared/hx-code-snippet-DssubcYM.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hx-code-snippet-DssubcYM.js","sources":["../../src/components/hx-code-snippet/hx-code-snippet.styles.ts","../../src/components/hx-code-snippet/hx-code-snippet.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixCodeSnippetStyles = css`\n  :host {\n    display: block;\n  }\n\n  :host([inline]) {\n    display: inline;\n  }\n\n  /* ─── Inline Mode ─── */\n\n  .code-snippet--inline {\n    display: inline;\n    font-family: var(--hx-code-snippet-font-family, var(--hx-font-family-mono, monospace));\n    font-size: var(--hx-code-snippet-font-size, var(--hx-font-size-sm, 0.875em));\n    background-color: var(--hx-code-snippet-inline-bg, var(--hx-color-surface-sunken, #f1f5f9));\n    color: var(--hx-code-snippet-inline-color, var(--hx-color-text-primary, #0f172a));\n    padding: var(--hx-code-snippet-inline-padding-y, 0.125em)\n      var(--hx-code-snippet-inline-padding-x, 0.375em);\n    border-radius: var(--hx-code-snippet-border-radius, var(--hx-border-radius-sm, 0.25rem));\n  }\n\n  /* ─── Block Mode Container ─── */\n\n  .code-snippet {\n    position: relative;\n    background-color: var(--hx-code-snippet-bg, var(--hx-color-surface-inverse, #0f172a));\n    border-radius: var(--hx-code-snippet-border-radius, var(--hx-border-radius-md, 0.375rem));\n    overflow: hidden;\n  }\n\n  /* ─── Hidden Slot ─── */\n\n  .code-snippet__slot {\n    display: none;\n  }\n\n  /* ─── Header ─── */\n\n  .code-snippet__header {\n    display: flex;\n    align-items: center;\n    justify-content: flex-end;\n    padding: var(--hx-space-2, 0.5rem) var(--hx-space-2, 0.5rem) 0;\n    min-height: var(--hx-space-8, 2rem);\n  }\n\n  /* ─── Pre / Code ─── */\n\n  .code-snippet__pre {\n    margin: 0;\n    padding: var(--hx-code-snippet-padding, var(--hx-space-4, 1rem));\n    overflow-x: auto;\n    white-space: pre;\n  }\n\n  .code-snippet__pre--wrap {\n    white-space: pre-wrap;\n    word-break: break-word;\n  }\n\n  .code-snippet__code {\n    display: block;\n    font-family: var(--hx-code-snippet-font-family, var(--hx-font-family-mono, monospace));\n    font-size: var(--hx-code-snippet-font-size, var(--hx-font-size-sm, 0.875rem));\n    line-height: var(--hx-line-height-relaxed, 1.75);\n    color: var(--hx-code-snippet-color, var(--hx-color-text-inverse, #ffffff));\n    tab-size: var(--hx-code-snippet-tab-size, 2);\n  }\n\n  /* ─── Copy Button ─── */\n\n  .code-snippet__copy-button {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--hx-space-1, 0.25rem);\n    /* WCAG 2.5.5: minimum 44×44px touch target */\n    min-width: var(--hx-touch-target-min, 2.75rem);\n    min-height: var(--hx-touch-target-min, 2.75rem);\n    padding: var(--hx-space-1, 0.25rem) var(--hx-space-2, 0.5rem);\n    border: var(--hx-border-width-thin, 1px) solid var(--hx-color-border-strong, #94a3b8);\n    border-radius: var(--hx-border-radius-sm, 0.25rem);\n    /* Copy button sits on the always-dark block snippet surface; uses inverse family for contrast on the terminal background. */\n    background-color: var(--hx-color-surface-inverse, #0f172a);\n    color: var(--hx-color-text-inverse, #ffffff);\n    font-family: var(--hx-code-snippet-font-family, var(--hx-font-family-sans, sans-serif));\n    font-size: var(--hx-font-size-xs, 0.75rem);\n    font-weight: var(--hx-font-weight-medium, 500);\n    line-height: 1; /* intentional literal: icon/action button needs line-height 1; no token maps to exactly 1 */\n    cursor: pointer;\n    transition:\n      background-color var(--hx-transition-fast, 150ms ease),\n      color var(--hx-transition-fast, 150ms ease),\n      border-color var(--hx-transition-fast, 150ms ease);\n    white-space: nowrap;\n    z-index: 1; /* @audit-exception: local stacking context within shadow root */\n  }\n\n  .code-snippet__copy-button:hover {\n    /* Hover on inverse terminal surface — keep semantic inverse family; border lifts via border-default in inverse context. */\n    background-color: var(--hx-color-surface-inverse, #0f172a);\n    border-color: var(--hx-color-border-default, #e2e8f0);\n  }\n\n  .code-snippet__copy-button:focus-visible {\n    outline: var(--hx-focus-ring-width, 2px) solid\n      var(--hx-focus-ring-color, var(--hx-color-primary-400, #60a5fa));\n    outline-offset: var(--hx-focus-ring-offset, 2px);\n  }\n\n  .code-snippet__copy-button:active {\n    /* Non-standard token — fallback 0.8 applies if token is absent */\n    filter: brightness(var(--hx-filter-brightness-active, 0.8));\n  }\n\n  /* ─── Expand Button ─── */\n\n  .code-snippet__expand-button {\n    display: block;\n    width: 100%;\n    /* WCAG 2.5.5: minimum 44×44px touch target */\n    min-width: var(--hx-touch-target-min, 2.75rem);\n    min-height: var(--hx-touch-target-min, 2.75rem);\n    padding: var(--hx-space-2, 0.5rem) var(--hx-space-4, 1rem);\n    border: none;\n    border-top: var(--hx-border-width-thin, 1px) solid var(--hx-color-border-strong, #94a3b8);\n    /* Expand button is attached to the always-dark block snippet — inverse family maintains the terminal aesthetic. */\n    background-color: var(--hx-color-surface-inverse, #0f172a);\n    color: var(--hx-color-text-inverse, #ffffff);\n    font-family: var(--hx-code-snippet-font-family, var(--hx-font-family-sans, sans-serif));\n    font-size: var(--hx-font-size-sm, 0.875rem);\n    font-weight: var(--hx-font-weight-medium, 500);\n    text-align: center;\n    cursor: pointer;\n    transition: background-color var(--hx-transition-fast, 150ms ease);\n  }\n\n  .code-snippet__expand-button:hover {\n    background-color: var(--hx-color-surface-inverse, #0f172a);\n    color: var(--hx-color-text-inverse, #ffffff);\n  }\n\n  .code-snippet__expand-button:focus-visible {\n    outline: var(--hx-focus-ring-width, 2px) solid\n      var(--hx-focus-ring-color, var(--hx-color-primary-400, #60a5fa));\n    outline-offset: var(--hx-focus-ring-offset, 2px);\n  }\n\n  /* ─── Line Numbers ─── */\n\n  .code-snippet__line-number {\n    display: inline-block;\n    min-width: var(--hx-space-8, 2rem);\n    padding-inline-end: var(--hx-space-3, 0.75rem);\n    color: var(--hx-code-snippet-line-number-color, var(--hx-color-text-muted, #64748b));\n    user-select: none;\n    text-align: end;\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .code-snippet__copy-button {\n      transition: none;\n    }\n\n    .code-snippet__expand-button {\n      transition: none;\n    }\n  }\n\n  /* ─── Forced Colors (Windows High Contrast) ─── */\n\n  @media (forced-colors: active) {\n    .code-snippet {\n      border: 1px solid CanvasText;\n    }\n\n    .code-snippet--inline {\n      border: 1px solid CanvasText;\n    }\n\n    .code-snippet__copy-button {\n      border-color: ButtonText;\n      color: ButtonText;\n    }\n\n    .code-snippet__expand-button {\n      border-top-color: CanvasText;\n      color: ButtonText;\n    }\n  }\n\n  /* ─── Screen-reader only ─── */\n\n  .sr-only {\n    position: absolute;\n    width: 1px;\n    height: 1px;\n    padding: 0;\n    margin: -1px;\n    overflow: hidden;\n    clip: rect(0, 0, 0, 0);\n    white-space: nowrap;\n    border: 0;\n  }\n`;\n","import { html, nothing, TemplateResult } from 'lit';\nimport '../../utilities/document-token-adoption.js';\nimport { HelixElement } from '../../base/index.js';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { helixCodeSnippetStyles } from './hx-code-snippet.styles.js';\n\n/**\n * A styled code block with optional copy button and max-lines truncation.\n * Supports block (`<pre><code>`) and inline (`<code>`) rendering modes.\n * No external syntax highlighting dependency — use the `language` attribute\n * as a hint for consumers integrating their own highlighter via slotted content.\n *\n * @summary Styled code display component with copy-to-clipboard and expand/collapse.\n *\n * @tag hx-code-snippet\n *\n * @slot - Code content as plain text. Note: HTML markup in slot content will be\n *   stripped — only text content is extracted. Pre-highlighted HTML is not supported.\n *\n * @fires {CustomEvent<{text: string}>} hx-copy - Dispatched when the copy button is clicked.\n *\n * @csspart base - The outermost container (block: `<div>`, inline: `<code>`).\n * @csspart header - The header bar containing the copy button (block mode only).\n * @csspart code - The `<code>` element containing the content.\n * @csspart copy-button - The copy-to-clipboard button.\n * @csspart expand-button - The \"Show more / Show less\" button.\n *\n * @cssprop [--hx-code-snippet-bg=var(--hx-color-neutral-900,#0f172a)] - Background color.\n * @cssprop [--hx-code-snippet-color=var(--hx-color-neutral-100,#f1f5f9)] - Text color.\n * @cssprop [--hx-code-snippet-font-family=var(--hx-font-family-mono,monospace)] - Font family.\n * @cssprop [--hx-code-snippet-font-size=var(--hx-font-size-sm,0.875rem)] - Font size.\n * @cssprop [--hx-code-snippet-border-radius=var(--hx-border-radius-md,0.375rem)] - Border radius.\n * @cssprop [--hx-code-snippet-padding=var(--hx-space-4,1rem)] - Inner padding (block mode).\n * @cssprop [--hx-border-radius-md] - CSS custom property.\n * @cssprop [--hx-border-radius-sm] - CSS custom property.\n * @cssprop [--hx-border-width-thin] - Width.\n * @cssprop [--hx-code-snippet-inline-bg=var(--hx-color-neutral-100)] - Background color.\n * @cssprop [--hx-code-snippet-inline-color=var(--hx-color-neutral-900)] - Color.\n * @cssprop [--hx-code-snippet-inline-padding-x=0.375em] - Padding.\n * @cssprop [--hx-code-snippet-inline-padding-y=0.125em] - Padding.\n * @cssprop [--hx-code-snippet-line-number-color=var(--hx-color-neutral-500)] - Color.\n * @cssprop [--hx-code-snippet-tab-size=2] - Number of spaces per tab character.\n * @cssprop [--hx-color-neutral-100] - Color.\n * @cssprop [--hx-color-neutral-200] - Color.\n * @cssprop [--hx-color-neutral-300] - Color.\n * @cssprop [--hx-color-neutral-500] - Color.\n * @cssprop [--hx-color-neutral-600] - Color.\n * @cssprop [--hx-color-neutral-700] - Color.\n * @cssprop [--hx-color-neutral-800] - Color.\n * @cssprop [--hx-color-neutral-900] - Color.\n * @cssprop [--hx-color-primary-400] - Color.\n * @cssprop [--hx-filter-brightness-active] - CSS filter.\n * @cssprop [--hx-focus-ring-color] - Color.\n * @cssprop [--hx-focus-ring-offset] - CSS custom property.\n * @cssprop [--hx-focus-ring-width] - Width.\n * @cssprop [--hx-font-family-mono] - Font family.\n * @cssprop [--hx-font-family-sans] - Font family.\n * @cssprop [--hx-font-size-sm] - Font size.\n * @cssprop [--hx-font-size-xs] - Font size.\n * @cssprop [--hx-font-weight-medium] - Font weight.\n * @cssprop [--hx-line-height-relaxed] - Line height.\n * @cssprop [--hx-space-1] - Spacing token.\n * @cssprop [--hx-space-2] - Spacing token.\n * @cssprop [--hx-space-3] - Spacing token.\n * @cssprop [--hx-space-4] - Spacing token.\n * @cssprop [--hx-space-8] - Spacing token.\n * @cssprop [--hx-touch-target-min] - Minimum touch target size.\n * @cssprop [--hx-transition-fast] - Transition timing.\n */\n@customElement('hx-code-snippet')\nexport class HelixCodeSnippet extends HelixElement {\n  static override styles = [helixCodeSnippetStyles];\n\n  // ─── Public Properties ───\n\n  /**\n   * Language hint for consumers to apply syntax highlighting.\n   * Does not affect rendering directly; it is applied as a `language-*` class\n   * on the `<code>` element so external highlighters can target it.\n   * @attr language\n   */\n  @property({ type: String, reflect: true })\n  language: string = '';\n\n  /**\n   * When true, renders as an inline `<code>` element instead of a `<pre><code>` block.\n   * @attr inline\n   */\n  @property({ type: Boolean, reflect: true })\n  inline: boolean = false;\n\n  /**\n   * When true, enables word-wrap in block mode.\n   * @attr wrap\n   */\n  @property({ type: Boolean, reflect: true })\n  wrap: boolean = false;\n\n  /**\n   * When true, shows a copy-to-clipboard button. Add the `copyable` attribute to enable it.\n   * @attr copyable\n   */\n  @property({ type: Boolean, reflect: true })\n  copyable: boolean = false;\n\n  /**\n   * Maximum number of lines to display before showing a \"Show more\" button.\n   * Set to 0 (default) to disable truncation.\n   * @attr max-lines\n   */\n  @property({ type: Number, attribute: 'max-lines', reflect: true })\n  maxLines: number = 0;\n\n  /**\n   * When true, prepends line numbers to each displayed line in block mode.\n   * Line numbers are rendered as `aria-hidden` spans so screen readers skip them.\n   * @attr line-numbers\n   */\n  @property({ type: Boolean, attribute: 'line-numbers', reflect: true })\n  lineNumbers: boolean = false;\n\n  /**\n   * Label for the copy button in idle state.\n   * @attr label-copy\n   */\n  @property({ type: String, attribute: 'label-copy' })\n  labelCopy = 'Copy code';\n\n  /**\n   * Label for the copy button after successful copy.\n   * @attr label-copied\n   */\n  @property({ type: String, attribute: 'label-copied' })\n  labelCopied = 'Copied!';\n\n  /**\n   * Label for the expand button when content is collapsed.\n   * @attr label-show-more\n   */\n  @property({ type: String, attribute: 'label-show-more' })\n  labelShowMore = 'Show more';\n\n  /**\n   * Label for the expand button when content is expanded.\n   * @attr label-show-less\n   */\n  @property({ type: String, attribute: 'label-show-less' })\n  labelShowLess = 'Show less';\n\n  // ─── Internal State ───\n\n  /** @internal */\n  @state() private _copied: boolean = false;\n  /** @internal */\n  @state() private _expanded: boolean = false;\n  /** @internal */\n  @state() private _codeText: string = '';\n\n  /** @internal */\n  private _copyTimer: ReturnType<typeof setTimeout> | null = null;\n\n  // ─── Lifecycle ───\n\n  override firstUpdated(): void {\n    // Prevent flash of empty <code> before slotchange fires by eagerly reading\n    // text content from host children that are already present on first render.\n    if (!this._codeText) {\n      const text = this.textContent?.trim() ?? '';\n      if (text) {\n        this._codeText = text;\n      }\n    }\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    if (this._copyTimer !== null) {\n      clearTimeout(this._copyTimer);\n      this._copyTimer = null;\n    }\n  }\n\n  // ─── Event Handlers ───\n\n  /** @internal */\n  private _handleSlotChange(e: Event): void {\n    const slot = e.target as HTMLSlotElement | null;\n    if (!slot) return;\n    const nodes = slot.assignedNodes({ flatten: true });\n    this._codeText = nodes.map((n) => n.textContent ?? '').join('');\n  }\n\n  /** @internal */\n  private _handleCopy(): void {\n    const text = this._codeText;\n\n    navigator?.clipboard?.writeText(text).catch(() => {\n      // Clipboard API unavailable (non-HTTPS environments such as Drupal staging) — emit event only.\n      // Note: navigator.clipboard requires a secure context (HTTPS or localhost).\n      // On HTTP, the copy event still fires but the clipboard is not populated.\n    });\n\n    this.dispatchEvent(\n      new CustomEvent<{ text: string }>('hx-copy', {\n        bubbles: true,\n        composed: true,\n        detail: { text },\n      }),\n    );\n\n    this._copied = true;\n    if (this._copyTimer !== null) clearTimeout(this._copyTimer);\n    this._copyTimer = setTimeout(() => {\n      this._copied = false;\n    }, 2000);\n  }\n\n  /** @internal */\n  private _handleExpand(): void {\n    this._expanded = !this._expanded;\n  }\n\n  // ─── Helpers ───\n\n  /** @internal */\n  private _getDisplayLines(): string[] {\n    const lines = this._codeText.split('\\n');\n    if (!this.maxLines || this.maxLines <= 0 || this._expanded) {\n      return lines;\n    }\n    if (lines.length <= this.maxLines) {\n      return lines;\n    }\n    return lines.slice(0, this.maxLines);\n  }\n\n  /** @internal */\n  private _isTruncated(): boolean {\n    if (!this.maxLines || this.maxLines <= 0) return false;\n    const lines = this._codeText.split('\\n');\n    return lines.length > this.maxLines;\n  }\n\n  /** @internal */\n  private _renderLines(lines: string[]): TemplateResult {\n    if (!this.lineNumbers) {\n      return html`${lines.join('\\n')}`;\n    }\n    return html`${lines.map(\n      (line, i) =>\n        html`<span aria-hidden=\"true\" class=\"code-snippet__line-number\">${i + 1}</span>${line +\n          '\\n'}`,\n    )}`;\n  }\n\n  // ─── Render ───\n\n  override render(): TemplateResult | typeof nothing {\n    if (this.inline) {\n      return html`\n        <code part=\"base code\" class=\"code-snippet code-snippet--inline\">\n          <slot @slotchange=${this._handleSlotChange}></slot>\n        </code>\n      `;\n    }\n\n    const displayLines = this._getDisplayLines();\n    const truncated = this._isTruncated();\n    const preLabel = this.language ? `Code snippet: ${this.language}` : 'Code snippet';\n    const codeClasses = classMap({\n      'code-snippet__code': true,\n      [`language-${this.language}`]: Boolean(this.language),\n    });\n\n    return html`\n      <div part=\"base\" class=\"code-snippet\">\n        <div part=\"header\" class=\"code-snippet__header\">\n          ${this.copyable\n            ? html`\n                <button\n                  part=\"copy-button\"\n                  class=\"code-snippet__copy-button\"\n                  type=\"button\"\n                  aria-label=${this._copied ? this.labelCopied : this.labelCopy}\n                  @click=${this._handleCopy}\n                >\n                  ${this._copied ? this.labelCopied : this.labelCopy}\n                </button>\n              `\n            : nothing}\n        </div>\n\n        <!-- Visually-hidden live region announces copy confirmation to assistive technology -->\n        <span\n          aria-live=\"polite\"\n          style=\"position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0;\"\n          >${this._copied ? this.labelCopied : ''}</span\n        >\n\n        <pre\n          role=\"region\"\n          aria-label=${preLabel}\n          class=${classMap({\n            'code-snippet__pre': true,\n            'code-snippet__pre--wrap': this.wrap,\n          })}\n        ><code part=\"code\" class=${codeClasses}>${this._renderLines(displayLines)}</code></pre>\n\n        <!-- Hidden slot to capture text content for display and copy -->\n        <slot class=\"code-snippet__slot\" @slotchange=${this._handleSlotChange}></slot>\n\n        ${truncated\n          ? html`\n              <button\n                part=\"expand-button\"\n                class=\"code-snippet__expand-button\"\n                type=\"button\"\n                aria-expanded=${this._expanded ? 'true' : 'false'}\n                @click=${this._handleExpand}\n              >\n                ${this._expanded ? this.labelShowLess : this.labelShowMore}\n              </button>\n            `\n          : nothing}\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'hx-code-snippet': HelixCodeSnippet;\n  }\n}\n"],"names":["helixCodeSnippetStyles","css","HelixCodeSnippet","HelixElement","text","_a","slot","nodes","n","lines","html","line","i","displayLines","truncated","preLabel","codeClasses","classMap","nothing","__decorateClass","property","state","customElement"],"mappings":";;;;AAEO,MAAMA,IAAyBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;ACqE/B,IAAMC,IAAN,cAA+BC,EAAa;AAAA,EAA5C,cAAA;AAAA,UAAA,GAAA,SAAA,GAYL,KAAA,WAAmB,IAOnB,KAAA,SAAkB,IAOlB,KAAA,OAAgB,IAOhB,KAAA,WAAoB,IAQpB,KAAA,WAAmB,GAQnB,KAAA,cAAuB,IAOvB,KAAA,YAAY,aAOZ,KAAA,cAAc,WAOd,KAAA,gBAAgB,aAOhB,KAAA,gBAAgB,aAKP,KAAQ,UAAmB,IAE3B,KAAQ,YAAqB,IAE7B,KAAQ,YAAoB,IAGrC,KAAQ,aAAmD;AAAA,EAAA;AAAA;AAAA,EAIlD,eAAqB;;AAG5B,QAAI,CAAC,KAAK,WAAW;AACnB,YAAMC,MAAOC,IAAA,KAAK,gBAAL,gBAAAA,EAAkB,WAAU;AACzC,MAAID,MACF,KAAK,YAAYA;AAAA,IAErB;AAAA,EACF;AAAA,EAES,uBAA6B;AACpC,UAAM,qBAAA,GACF,KAAK,eAAe,SACtB,aAAa,KAAK,UAAU,GAC5B,KAAK,aAAa;AAAA,EAEtB;AAAA;AAAA;AAAA,EAKQ,kBAAkB,GAAgB;AACxC,UAAME,IAAO,EAAE;AACf,QAAI,CAACA,EAAM;AACX,UAAMC,IAAQD,EAAK,cAAc,EAAE,SAAS,IAAM;AAClD,SAAK,YAAYC,EAAM,IAAI,CAACC,MAAMA,EAAE,eAAe,EAAE,EAAE,KAAK,EAAE;AAAA,EAChE;AAAA;AAAA,EAGQ,cAAoB;;AAC1B,UAAMJ,IAAO,KAAK;AAElB,KAAAC,IAAA,uCAAW,cAAX,QAAAA,EAAsB,UAAUD,GAAM,MAAM,MAAM;AAAA,IAIlD,IAEA,KAAK;AAAA,MACH,IAAI,YAA8B,WAAW;AAAA,QAC3C,SAAS;AAAA,QACT,UAAU;AAAA,QACV,QAAQ,EAAE,MAAAA,EAAA;AAAA,MAAK,CAChB;AAAA,IAAA,GAGH,KAAK,UAAU,IACX,KAAK,eAAe,QAAM,aAAa,KAAK,UAAU,GAC1D,KAAK,aAAa,WAAW,MAAM;AACjC,WAAK,UAAU;AAAA,IACjB,GAAG,GAAI;AAAA,EACT;AAAA;AAAA,EAGQ,gBAAsB;AAC5B,SAAK,YAAY,CAAC,KAAK;AAAA,EACzB;AAAA;AAAA;AAAA,EAKQ,mBAA6B;AACnC,UAAMK,IAAQ,KAAK,UAAU,MAAM;AAAA,CAAI;AAIvC,WAHI,CAAC,KAAK,YAAY,KAAK,YAAY,KAAK,KAAK,aAG7CA,EAAM,UAAU,KAAK,WAChBA,IAEFA,EAAM,MAAM,GAAG,KAAK,QAAQ;AAAA,EACrC;AAAA;AAAA,EAGQ,eAAwB;AAC9B,WAAI,CAAC,KAAK,YAAY,KAAK,YAAY,IAAU,KACnC,KAAK,UAAU,MAAM;AAAA,CAAI,EAC1B,SAAS,KAAK;AAAA,EAC7B;AAAA;AAAA,EAGQ,aAAaA,GAAiC;AACpD,WAAK,KAAK,cAGHC,IAAOD,EAAM;AAAA,MAClB,CAACE,GAAMC,MACLF,+DAAkEE,IAAI,CAAC,UAAUD,IAC/E;AAAA,CAAI;AAAA,IAAA,CACT,KANQD,IAAOD,EAAM,KAAK;AAAA,CAAI,CAAC;AAAA,EAOlC;AAAA;AAAA,EAIS,SAA0C;AACjD,QAAI,KAAK;AACP,aAAOC;AAAA;AAAA,8BAEiB,KAAK,iBAAiB;AAAA;AAAA;AAKhD,UAAMG,IAAe,KAAK,iBAAA,GACpBC,IAAY,KAAK,aAAA,GACjBC,IAAW,KAAK,WAAW,iBAAiB,KAAK,QAAQ,KAAK,gBAC9DC,IAAcC,EAAS;AAAA,MAC3B,sBAAsB;AAAA,MACtB,CAAC,YAAY,KAAK,QAAQ,EAAE,GAAG,EAAQ,KAAK;AAAA,IAAQ,CACrD;AAED,WAAOP;AAAA;AAAA;AAAA,YAGC,KAAK,WACHA;AAAA;AAAA;AAAA;AAAA;AAAA,+BAKiB,KAAK,UAAU,KAAK,cAAc,KAAK,SAAS;AAAA,2BACpD,KAAK,WAAW;AAAA;AAAA,oBAEvB,KAAK,UAAU,KAAK,cAAc,KAAK,SAAS;AAAA;AAAA,kBAGtDQ,CAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAOR,KAAK,UAAU,KAAK,cAAc,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA,uBAK1BH,CAAQ;AAAA,kBACbE,EAAS;AAAA,MACf,qBAAqB;AAAA,MACrB,2BAA2B,KAAK;AAAA,IAAA,CACjC,CAAC;AAAA,mCACuBD,CAAW,IAAI,KAAK,aAAaH,CAAY,CAAC;AAAA;AAAA;AAAA,uDAG1B,KAAK,iBAAiB;AAAA;AAAA,UAEnEC,IACEJ;AAAA;AAAA;AAAA;AAAA;AAAA,gCAKoB,KAAK,YAAY,SAAS,OAAO;AAAA,yBACxC,KAAK,aAAa;AAAA;AAAA,kBAEzB,KAAK,YAAY,KAAK,gBAAgB,KAAK,aAAa;AAAA;AAAA,gBAG9DQ,CAAO;AAAA;AAAA;AAAA,EAGjB;AACF;AAjQahB,EACK,SAAS,CAACF,CAAsB;AAWhDmB,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAX9BlB,EAYX,WAAA,YAAA,CAAA;AAOAiB,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAlB/BlB,EAmBX,WAAA,UAAA,CAAA;AAOAiB,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAzB/BlB,EA0BX,WAAA,QAAA,CAAA;AAOAiB,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAhC/BlB,EAiCX,WAAA,YAAA,CAAA;AAQAiB,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,WAAW,aAAa,SAAS,IAAM;AAAA,GAxCtDlB,EAyCX,WAAA,YAAA,CAAA;AAQAiB,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,SAAS,WAAW,gBAAgB,SAAS,IAAM;AAAA,GAhD1DlB,EAiDX,WAAA,eAAA,CAAA;AAOAiB,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,WAAW,cAAc;AAAA,GAvDxClB,EAwDX,WAAA,aAAA,CAAA;AAOAiB,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,WAAW,gBAAgB;AAAA,GA9D1ClB,EA+DX,WAAA,eAAA,CAAA;AAOAiB,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,WAAW,mBAAmB;AAAA,GArE7ClB,EAsEX,WAAA,iBAAA,CAAA;AAOAiB,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,WAAW,mBAAmB;AAAA,GA5E7ClB,EA6EX,WAAA,iBAAA,CAAA;AAKiBiB,EAAA;AAAA,EAAhBE,EAAA;AAAM,GAlFInB,EAkFM,WAAA,WAAA,CAAA;AAEAiB,EAAA;AAAA,EAAhBE,EAAA;AAAM,GApFInB,EAoFM,WAAA,aAAA,CAAA;AAEAiB,EAAA;AAAA,EAAhBE,EAAA;AAAM,GAtFInB,EAsFM,WAAA,aAAA,CAAA;AAtFNA,IAANiB,EAAA;AAAA,EADNG,EAAc,iBAAiB;AAAA,GACnBpB,CAAA;"}

package/dist/shared/{hx-rating-C3E3ENJb.js → hx-rating-BO9kl9pb.js}

@@ -1,8 +1,8 @@
 import { css as f, html as d, nothing as p } from "lit";
 import { property as h, state as v, customElement as y } from "lit/decorators.js";
 import { F as _ } from "./FormMixin-B8PXk5RQ.js";
-import { H as x } from "./helix-element-BNEYeiys.js";
-const g = f`
+import { H as g } from "./helix-element-BNEYeiys.js";
+const x = f`
   :host {
     display: inline-block;
   }
@@ -37,7 +37,7 @@ const g = f`
     justify-content: center;
     position: relative;
     cursor: pointer;
-    color: var(--hx-rating-empty-color, var(--hx-color-neutral-300, #cbd5e1));
+    color: var(--hx-rating-empty-color, var(--hx-color-border-strong, #cbd5e1));
     line-height: 1;
     min-width: var(--hx-touch-target-min, 2.75rem);
     min-height: var(--hx-touch-target-min, 2.75rem);
@@ -88,7 +88,7 @@ const g = f`
     position: absolute;
     left: 0;
     top: 0;
-    color: var(--hx-rating-empty-color, var(--hx-color-neutral-300, #cbd5e1));
+    color: var(--hx-rating-empty-color, var(--hx-color-border-strong, #cbd5e1));
     /* Clip to right 50% for the empty half */
     clip-path: inset(0 0 0 50%);
   }
@@ -141,11 +141,11 @@ const g = f`
   }
 `;
 var w = Object.defineProperty, S = Object.getOwnPropertyDescriptor, n = (e, t, s, o) => {
-  for (var r = o > 1 ? void 0 : o ? S(t, s) : t, a = e.length - 1, l; a >= 0; a--)
-    (l = e[a]) && (r = (o ? l(t, s, r) : l(r)) || r);
+  for (var r = o > 1 ? void 0 : o ? S(t, s) : t, a = e.length - 1, i; a >= 0; a--)
+    (i = e[a]) && (r = (o ? i(t, s, r) : i(r)) || r);
   return o && r && w(t, s, r), r;
 };
-let i = class extends _(x) {
+let l = class extends _(g) {
   constructor() {
     super(...arguments), this.value = 0, this.max = 5, this.precision = 1, this.readonly = !1, this.disabled = !1, this.name = "", this.label = "", this.required = !1, this.labelStar = (e) => e === 1 ? "1 star" : `${e} stars`, this.labelValueText = (e, t) => `${e} out of ${t} stars`, this._hoverValue = null, this._defaultValue = 0;
   }
@@ -362,10 +362,10 @@ let i = class extends _(x) {
     return this.readonly ? d`
         <div part="base" class="base base--readonly" role="img" aria-label=${s}>
           ${Array.from({ length: this.max }, (o, r) => {
-      const a = r + 1, l = this._getStarState(a);
+      const a = r + 1, i = this._getStarState(a);
       return d`
-              <span part="symbol" class="symbol symbol--${l}" data-index="${a}">
-                <slot name="icon" data-state="${l}">${this._renderStarIcon(l)}</slot>
+              <span part="symbol" class="symbol symbol--${i}" data-index="${a}">
+                <slot name="icon" data-state="${i}">${this._renderStarIcon(i)}</slot>
               </span>
             `;
     })}
@@ -386,11 +386,11 @@ let i = class extends _(x) {
           @mouseleave="${this._handleMouseLeave}"
         >
           ${Array.from({ length: this.max }, (o, r) => {
-      const a = r + 1, l = this._getStarState(a);
+      const a = r + 1, i = this._getStarState(a);
       return d`
               <span
                 part="symbol"
-                class="symbol symbol--${l}${this.disabled ? " symbol--disabled" : ""}"
+                class="symbol symbol--${i}${this.disabled ? " symbol--disabled" : ""}"
                 role="presentation"
                 aria-hidden="true"
                 data-index="${a}"
@@ -398,7 +398,7 @@ let i = class extends _(x) {
                 @mouseenter="${(u) => this._handleSymbolMouseEnter(u, a)}"
                 @mousemove="${(u) => this._handleSymbolMouseMove(u, a)}"
               >
-                <slot name="icon" data-state="${l}">${this._renderStarIcon(l)}</slot>
+                <slot name="icon" data-state="${i}">${this._renderStarIcon(i)}</slot>
               </span>
             `;
     })}
@@ -415,11 +415,11 @@ let i = class extends _(x) {
         @mouseleave="${this._handleMouseLeave}"
       >
         ${Array.from({ length: this.max }, (o, r) => {
-      const a = r + 1, l = this._getStarState(a), u = this._isChecked(a), m = this.labelStar(a), b = this.value > 0 ? Math.ceil(this.value) === a : a === 1;
+      const a = r + 1, i = this._getStarState(a), u = this._isChecked(a), m = this.labelStar(a), b = this.value > 0 ? Math.ceil(this.value) === a : a === 1;
       return d`
             <span
               part="symbol"
-              class="symbol symbol--${l}${this.disabled ? " symbol--disabled" : ""}"
+              class="symbol symbol--${i}${this.disabled ? " symbol--disabled" : ""}"
               role="radio"
               aria-label="${m}"
               aria-checked="${u ? "true" : "false"}"
@@ -429,7 +429,7 @@ let i = class extends _(x) {
               @mouseenter="${(c) => this._handleSymbolMouseEnter(c, a)}"
               @mousemove="${(c) => this._handleSymbolMouseMove(c, a)}"
             >
-              <slot name="icon" data-state="${l}">${this._renderStarIcon(l)}</slot>
+              <slot name="icon" data-state="${i}">${this._renderStarIcon(i)}</slot>
             </span>
           `;
     })}
@@ -437,45 +437,45 @@ let i = class extends _(x) {
     `;
   }
 };
-i.styles = [g];
-i.formAssociated = !0;
+l.styles = [x];
+l.formAssociated = !0;
 n([
   h({ type: Number, reflect: !0 })
-], i.prototype, "value", 2);
+], l.prototype, "value", 2);
 n([
   h({ type: Number, reflect: !0 })
-], i.prototype, "max", 2);
+], l.prototype, "max", 2);
 n([
   h({ type: Number, reflect: !0 })
-], i.prototype, "precision", 2);
+], l.prototype, "precision", 2);
 n([
   h({ type: Boolean, reflect: !0 })
-], i.prototype, "readonly", 2);
+], l.prototype, "readonly", 2);
 n([
   h({ type: Boolean, reflect: !0 })
-], i.prototype, "disabled", 2);
+], l.prototype, "disabled", 2);
 n([
   h({ type: String, reflect: !0 })
-], i.prototype, "name", 2);
+], l.prototype, "name", 2);
 n([
   h({ type: String })
-], i.prototype, "label", 2);
+], l.prototype, "label", 2);
 n([
   h({ type: Boolean, reflect: !0 })
-], i.prototype, "required", 2);
+], l.prototype, "required", 2);
 n([
   h({ attribute: !1 })
-], i.prototype, "labelStar", 2);
+], l.prototype, "labelStar", 2);
 n([
   h({ attribute: !1 })
-], i.prototype, "labelValueText", 2);
+], l.prototype, "labelValueText", 2);
 n([
   v()
-], i.prototype, "_hoverValue", 2);
-i = n([
+], l.prototype, "_hoverValue", 2);
+l = n([
   y("hx-rating")
-], i);
+], l);
 export {
-  i as H
+  l as H
 };
-//# sourceMappingURL=hx-rating-C3E3ENJb.js.map
+//# sourceMappingURL=hx-rating-BO9kl9pb.js.map