@helixui/library 2.0.0 → 2.1.0-next.33

package/dist/shared/{hx-text-DoEVOf47.js → hx-text-DcWBqZwx.js}

@@ -1,11 +1,11 @@
 import { css as c, LitElement as g } from "lit";
+import "./document-token-adoption-DuYNKd4k.js";
 import { unsafeStatic as f, html as m } from "lit/static-html.js";
 import { property as a, customElement as p } from "lit/decorators.js";
 import { classMap as v } from "lit/directives/class-map.js";
 import { styleMap as w } from "lit/directives/style-map.js";
 import { ifDefined as d } from "lit/directives/if-defined.js";
-import { tokenStyles as u } from "@helixui/tokens/lit";
-const y = c`
+const u = c`
   :host {
     display: inline;
   }
@@ -155,10 +155,10 @@ const y = c`
     display: block;
   }
 `;
-var b = Object.defineProperty, z = Object.getOwnPropertyDescriptor, h = (r, o, i, n) => {
-  for (var t = n > 1 ? void 0 : n ? z(o, i) : o, l = r.length - 1, x; l >= 0; l--)
-    (x = r[l]) && (t = (n ? x(o, i, t) : x(t)) || t);
-  return n && t && b(o, i, t), t;
+var y = Object.defineProperty, b = Object.getOwnPropertyDescriptor, h = (r, i, o, n) => {
+  for (var t = n > 1 ? void 0 : n ? b(i, o) : i, l = r.length - 1, x; l >= 0; l--)
+    (x = r[l]) && (t = (n ? x(i, o, t) : x(t)) || t);
+  return n && t && y(i, o, t), t;
 };
 let e = class extends g {
   constructor() {
@@ -171,14 +171,14 @@ let e = class extends g {
   }
   render() {
     var s;
-    const r = Math.max(0, this.lines), o = this.truncate && r === 0, i = r > 0, n = {
+    const r = Math.max(0, this.lines), i = this.truncate && r === 0, o = r > 0, n = {
       text: !0,
       [`text--${this.variant}`]: !0,
       [`text--color-${this.color}`]: !0,
       [`text--weight-${this.weight}`]: this.weight !== void 0,
-      "text--truncate": o,
-      "text--clamp": i
-    }, t = i ? { "-webkit-line-clamp": String(r) } : {}, l = o || i ? (s = this.textContent) == null ? void 0 : s.trim() : void 0, x = f(this._safeTag);
+      "text--truncate": i,
+      "text--clamp": o
+    }, t = o ? { "-webkit-line-clamp": String(r) } : {}, l = i || o ? (s = this.textContent) == null ? void 0 : s.trim() : void 0, x = f(this._safeTag);
     return m`
       <${x}
         part="base"
@@ -191,7 +191,7 @@ let e = class extends g {
     `;
   }
 };
-e.styles = [u, y];
+e.styles = [u];
 h([
   a({ type: String, reflect: !0 })
 ], e.prototype, "variant", 2);
@@ -216,4 +216,4 @@ e = h([
 export {
   e as H
 };
-//# sourceMappingURL=hx-text-DoEVOf47.js.map
+//# sourceMappingURL=hx-text-DcWBqZwx.js.map

package/dist/shared/hx-text-DcWBqZwx.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hx-text-DcWBqZwx.js","sources":["../../src/components/hx-text/hx-text.styles.ts","../../src/components/hx-text/hx-text.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixTextStyles = css`\n  :host {\n    display: inline;\n  }\n\n  /* ─── Base ─── */\n\n  .text {\n    display: inline;\n    font-family: var(--hx-font-family-sans, sans-serif);\n    font-size: var(--hx-text-font-size);\n    font-weight: var(--hx-text-font-weight);\n    line-height: var(--hx-text-line-height);\n    letter-spacing: var(--hx-text-letter-spacing);\n    color: var(--hx-text-color);\n    margin: 0;\n    padding: 0;\n  }\n\n  /* ─── Variants ─── */\n\n  .text--body {\n    --hx-text-font-size: var(--hx-font-size-md, 1rem);\n    --hx-text-font-weight: var(--hx-font-weight-normal, 400);\n    --hx-text-line-height: var(--hx-line-height-normal, 1.5);\n    --hx-text-letter-spacing: var(--hx-letter-spacing-normal, 0);\n  }\n\n  .text--body-sm {\n    --hx-text-font-size: var(--hx-font-size-sm, 0.875rem);\n    --hx-text-font-weight: var(--hx-font-weight-normal, 400);\n    --hx-text-line-height: var(--hx-line-height-normal, 1.5);\n    --hx-text-letter-spacing: var(--hx-letter-spacing-normal, 0);\n  }\n\n  .text--body-lg {\n    --hx-text-font-size: var(--hx-font-size-lg, 1.125rem);\n    --hx-text-font-weight: var(--hx-font-weight-normal, 400);\n    --hx-text-line-height: var(--hx-line-height-normal, 1.5);\n    --hx-text-letter-spacing: var(--hx-letter-spacing-normal, 0);\n  }\n\n  .text--label {\n    --hx-text-font-size: var(--hx-font-size-md, 1rem);\n    --hx-text-font-weight: var(--hx-font-weight-medium, 500);\n    --hx-text-line-height: var(--hx-line-height-tight, 1.25);\n    --hx-text-letter-spacing: var(--hx-letter-spacing-normal, 0);\n  }\n\n  .text--label-sm {\n    --hx-text-font-size: var(--hx-font-size-sm, 0.875rem);\n    --hx-text-font-weight: var(--hx-font-weight-medium, 500);\n    --hx-text-line-height: var(--hx-line-height-tight, 1.25);\n    --hx-text-letter-spacing: var(--hx-letter-spacing-normal, 0);\n  }\n\n  .text--caption {\n    --hx-text-font-size: var(--hx-font-size-xs, 0.75rem);\n    --hx-text-font-weight: var(--hx-font-weight-normal, 400);\n    --hx-text-line-height: var(--hx-line-height-normal, 1.5);\n    --hx-text-letter-spacing: var(--hx-letter-spacing-normal, 0);\n  }\n\n  .text--code {\n    --hx-text-font-size: var(--hx-font-size-sm, 0.875rem);\n    --hx-text-font-weight: var(--hx-font-weight-normal, 400);\n    --hx-text-line-height: var(--hx-line-height-normal, 1.5);\n    --hx-text-letter-spacing: var(--hx-letter-spacing-normal, 0);\n    font-family: var(--hx-font-family-mono, monospace);\n  }\n\n  .text--overline {\n    --hx-text-font-size: var(--hx-font-size-xs, 0.75rem);\n    --hx-text-font-weight: var(--hx-font-weight-semibold, 600);\n    --hx-text-line-height: var(--hx-line-height-tight, 1.25);\n    --hx-text-letter-spacing: var(--hx-letter-spacing-wide, 0.05em);\n    text-transform: uppercase;\n  }\n\n  /* ─── Colors ─── */\n\n  .text--color-default {\n    --hx-text-color: var(--hx-color-neutral-900, #0f172a);\n  }\n\n  .text--color-subtle {\n    --hx-text-color: var(--hx-color-neutral-500, #64748b);\n  }\n\n  .text--color-disabled {\n    --hx-text-color: var(--hx-color-neutral-400, #94a3b8);\n  }\n\n  .text--color-inverse {\n    --hx-text-color: var(--hx-color-neutral-0, #ffffff);\n  }\n\n  .text--color-danger {\n    --hx-text-color: var(--hx-color-error-600, #dc2626);\n  }\n\n  .text--color-success {\n    --hx-text-color: var(--hx-color-success-600, #16a34a);\n  }\n\n  .text--color-warning {\n    --hx-text-color: var(--hx-color-warning-600, #d97706);\n  }\n\n  /* ─── Weight Overrides ─── */\n\n  .text--weight-regular {\n    --hx-text-font-weight: var(--hx-font-weight-normal, 400);\n  }\n\n  .text--weight-medium {\n    --hx-text-font-weight: var(--hx-font-weight-medium, 500);\n  }\n\n  .text--weight-semibold {\n    --hx-text-font-weight: var(--hx-font-weight-semibold, 600);\n  }\n\n  .text--weight-bold {\n    --hx-text-font-weight: var(--hx-font-weight-bold, 700);\n  }\n\n  /* ─── Truncation ─── */\n\n  .text--truncate {\n    display: block;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  .text--clamp {\n    display: -webkit-box;\n    -webkit-box-orient: vertical;\n    overflow: hidden;\n  }\n\n  :host([truncate]) {\n    display: block;\n  }\n\n  :host([lines]:not([lines='0'])) {\n    display: block;\n  }\n`;\n","import { LitElement } from 'lit';\nimport '../../utilities/document-token-adoption.js';\nimport { html as staticHtml, unsafeStatic } from 'lit/static-html.js';\nimport { customElement, property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { helixTextStyles } from './hx-text.styles.js';\n\n/**\n * A semantic typography wrapper that applies consistent text styles using design tokens.\n *\n * @summary Presentational text wrapper for consistent typography across variants, weights, and colors.\n *\n * @tag hx-text\n *\n * @slot - Default slot for text content.\n *\n * @csspart base - The inner element (tag determined by the `as` property).\n *\n * @cssprop [--hx-text-font-size] - Font size (set per variant).\n * @cssprop [--hx-text-font-weight] - Font weight (overridden by weight prop).\n * @cssprop [--hx-text-line-height] - Line height (set per variant).\n * @cssprop [--hx-text-letter-spacing] - Letter spacing (set per variant).\n * @cssprop [--hx-text-color] - Text color (set per color prop).\n *\n * @example\n * <!-- Drupal/Twig usage (CDN):\n *   <hx-text variant=\"body\" color=\"default\">Patient name here</hx-text>\n *   <hx-text variant=\"label\" weight=\"semibold\">Date of Birth</hx-text>\n *   <hx-text variant=\"caption\" color=\"subtle\">Last reviewed on 2026-03-05</hx-text>\n *   <!-- Truncate (boolean attr — omit to disable, include to enable): -->\n *   <hx-text truncate>Long patient note that gets clipped</hx-text>\n *   <!-- Multi-line clamp (numeric attr): -->\n *   <hx-text lines=\"3\">Paragraph of clinical notes...</hx-text>\n *   <!-- Semantic element override: -->\n *   <hx-text as=\"p\" variant=\"body\">Paragraph-level content.</hx-text>\n *   <hx-text as=\"strong\" variant=\"label\">Bold label</hx-text>\n * -->\n */\n@customElement('hx-text')\nexport class HelixText extends LitElement {\n  static override styles = [helixTextStyles];\n\n  /**\n   * Typography variant controlling font size, line height, and letter spacing.\n   *\n   * Note: The public variant set (body / body-sm / body-lg / label / label-sm / caption / code /\n   * overline) intentionally extends the original audit spec (body / lead / small / caption /\n   * overline). `lead` and `small` were replaced with the more granular `body-lg`, `body-sm`,\n   * `label`, `label-sm`, and `code` variants to better serve healthcare UI density requirements.\n   * There are no `lead` or `small` variants — consumers must use `body-lg` and `body-sm`\n   * respectively.\n   *\n   * @attr variant\n   */\n  @property({ type: String, reflect: true })\n  variant: 'body' | 'body-sm' | 'body-lg' | 'label' | 'label-sm' | 'caption' | 'code' | 'overline' =\n    'body';\n\n  /**\n   * Font weight override. When unset, the variant's default weight is used.\n   * @attr weight\n   */\n  @property({ type: String, reflect: true })\n  weight: 'regular' | 'medium' | 'semibold' | 'bold' | undefined = undefined;\n\n  /**\n   * Semantic color intent.\n   * @attr color\n   */\n  @property({ type: String, reflect: true })\n  color: 'default' | 'subtle' | 'disabled' | 'inverse' | 'danger' | 'success' | 'warning' =\n    'default';\n\n  /**\n   * When true, clips text to a single line with an ellipsis overflow.\n   * @attr truncate\n   */\n  @property({ type: Boolean, reflect: true })\n  truncate = false;\n\n  /**\n   * Maximum number of lines to display before clamping with ellipsis.\n   * When set, overrides `truncate`. Set to 0 to disable.\n   * @attr lines\n   */\n  @property({ type: Number, reflect: true })\n  lines = 0;\n\n  /**\n   * The HTML element to render as the inner base element.\n   * Use to produce semantically appropriate markup (e.g., `p`, `strong`, `em`).\n   * Defaults to `span` for inline usage.\n   *\n   * In Drupal Twig: `<hx-text as=\"p\" variant=\"body\">...</hx-text>`\n   *\n   * @attr as\n   */\n  @property({ type: String, reflect: true })\n  as: 'span' | 'p' | 'strong' | 'em' | 'div' = 'span';\n\n  /** Validates `as` against the allowed element list to prevent injection. */\n  /** @internal */\n  private get _safeTag(): string {\n    const allowed = new Set(['span', 'p', 'strong', 'em', 'div']);\n    return allowed.has(this.as) ? this.as : 'span';\n  }\n\n  override render() {\n    const effectiveLines = Math.max(0, this.lines);\n    const isTruncated = this.truncate && effectiveLines === 0;\n    const isClamped = effectiveLines > 0;\n    const classes = {\n      text: true,\n      [`text--${this.variant}`]: true,\n      [`text--color-${this.color}`]: true,\n      [`text--weight-${this.weight}`]: this.weight !== undefined,\n      'text--truncate': isTruncated,\n      'text--clamp': isClamped,\n    };\n\n    const inlineStyles = isClamped ? { '-webkit-line-clamp': String(effectiveLines) } : {};\n\n    const titleText = isTruncated || isClamped ? this.textContent?.trim() : undefined;\n\n    const tag = unsafeStatic(this._safeTag);\n\n    return staticHtml`\n      <${tag}\n        part=\"base\"\n        class=${classMap(classes)}\n        style=${styleMap(inlineStyles)}\n        title=${ifDefined(titleText || undefined)}\n      >\n        <slot></slot>\n      </${tag}>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'hx-text': HelixText;\n  }\n}\n"],"names":["helixTextStyles","css","HelixText","LitElement","effectiveLines","isTruncated","isClamped","classes","inlineStyles","titleText","_a","tag","unsafeStatic","staticHtml","classMap","styleMap","ifDefined","__decorateClass","property","customElement"],"mappings":"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"}

package/dist/shared/{hx-text-input-DTKWPVdy.js → hx-text-input-Scyeefec.js}

@@ -1,18 +1,18 @@
 import { css as _, nothing as c, html as h } from "lit";
+import "./document-token-adoption-DuYNKd4k.js";
 import { property as s, query as v, state as u, customElement as m } from "lit/decorators.js";
 import { classMap as f } from "lit/directives/class-map.js";
 import { ifDefined as n } from "lit/directives/if-defined.js";
 import { live as g } from "lit/directives/live.js";
-import { tokenStyles as b } from "@helixui/tokens/lit";
-import { F as y } from "./FormMixin-Bjvw20G5.js";
-import { d as S } from "./dev-warn-YlwPHjtX.js";
-import { c as w, H as $ } from "./id-counter-JhvVCnjh.js";
-var I = Object.defineProperty, x = (e, t, a, l) => {
+import { F as b } from "./FormMixin-Bjvw20G5.js";
+import { d as y } from "./dev-warn-YlwPHjtX.js";
+import { c as S, H as w } from "./id-counter-JhvVCnjh.js";
+var $ = Object.defineProperty, x = (e, t, a, l) => {
   for (var o = void 0, d = e.length - 1, p; d >= 0; d--)
     (p = e[d]) && (o = p(t, a, o) || o);
-  return o && I(t, a, o), o;
+  return o && $(t, a, o), o;
 };
-const E = (e) => {
+const I = (e) => {
   class t extends e {
     constructor() {
       super(...arguments), this.focused = !1, this.focusedVisible = !1, this._focusPending = !1, this._lastInteractionWasPointer = !1, this._handleFocusIn = () => {
@@ -64,7 +64,7 @@ const E = (e) => {
   ], t.prototype, "focused"), x([
     s({ type: Boolean, reflect: !0, attribute: "focused-visible" })
   ], t.prototype, "focusedVisible"), t;
-}, C = _`
+}, E = _`
   :host {
     display: block;
   }
@@ -279,15 +279,15 @@ const E = (e) => {
     }
   }
 `;
-var z = Object.defineProperty, T = Object.getOwnPropertyDescriptor, i = (e, t, a, l) => {
-  for (var o = l > 1 ? void 0 : l ? T(t, a) : t, d = e.length - 1, p; d >= 0; d--)
+var C = Object.defineProperty, z = Object.getOwnPropertyDescriptor, i = (e, t, a, l) => {
+  for (var o = l > 1 ? void 0 : l ? z(t, a) : t, d = e.length - 1, p; d >= 0; d--)
     (p = e[d]) && (o = (l ? p(t, a, o) : p(o)) || o);
-  return l && o && z(t, a, o), o;
+  return l && o && C(t, a, o), o;
 };
-const P = w("hx-text-input");
-let r = class extends E(y($)) {
+const T = S("hx-text-input");
+let r = class extends I(b(w)) {
   constructor() {
-    super(...arguments), this.label = "", this.placeholder = "", this.value = "", this.type = "text", this.required = !1, this.disabled = !1, this.error = "", this.helpText = "", this.name = "", this.ariaLabel = null, this.readonly = !1, this.minlength = void 0, this.maxlength = void 0, this.pattern = "", this.autocomplete = "", this.requiredMessage = "This field is required.", this.size = "md", this._hasLabelSlot = !1, this._hasErrorSlot = !1, this._hasPrefixSlot = !1, this._hasSuffixSlot = !1, this._hasHelpTextSlot = !1, this._inputId = P(), this._helpTextId = `${this._inputId}-help`, this._errorId = `${this._inputId}-error`;
+    super(...arguments), this.label = "", this.placeholder = "", this.value = "", this.type = "text", this.required = !1, this.disabled = !1, this.error = "", this.helpText = "", this.name = "", this.ariaLabel = null, this.readonly = !1, this.minlength = void 0, this.maxlength = void 0, this.pattern = "", this.autocomplete = "", this.requiredMessage = "This field is required.", this.size = "md", this._hasLabelSlot = !1, this._hasErrorSlot = !1, this._hasPrefixSlot = !1, this._hasSuffixSlot = !1, this._hasHelpTextSlot = !1, this._inputId = T(), this._helpTextId = `${this._inputId}-help`, this._errorId = `${this._inputId}-error`;
   }
   // ─── FocusMixin integration ───
   /**
@@ -327,7 +327,7 @@ let r = class extends E(y($)) {
   }
   // ─── Lifecycle ───
   updated(e) {
-    super.updated(e), e.has("value") && this._internals.setFormValue(this.value), (e.has("value") || e.has("type")) && this.type === "number" && this.value !== "" && isNaN(Number(this.value)) && S(
+    super.updated(e), e.has("value") && this._internals.setFormValue(this.value), (e.has("value") || e.has("type")) && this.type === "number" && this.value !== "" && isNaN(Number(this.value)) && y(
       "hx-text-input",
       `type="number" received non-numeric value "${this.value}". Browser will display empty input.`
     );
@@ -495,7 +495,7 @@ let r = class extends E(y($)) {
     `;
   }
 };
-r.styles = [b, C];
+r.styles = [E];
 r.formAssociated = !0;
 i([
   s({ type: String })
@@ -570,7 +570,7 @@ r = i([
   m("hx-text-input")
 ], r);
 export {
-  E as F,
+  I as F,
   r as H
 };
-//# sourceMappingURL=hx-text-input-DTKWPVdy.js.map
+//# sourceMappingURL=hx-text-input-Scyeefec.js.map

package/dist/shared/hx-text-input-Scyeefec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hx-text-input-Scyeefec.js","sources":["../../src/mixins/FocusMixin.ts","../../src/components/hx-text-input/hx-text-input.styles.ts","../../src/components/hx-text-input/hx-text-input.ts"],"sourcesContent":["import { LitElement, type PropertyValues } from 'lit';\nimport { property } from 'lit/decorators.js';\n\n/**\n * Mixin constructor type — must use `any[]` args per TypeScript mixin requirements (TS2545).\n * @internal\n */\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\ntype Constructor<T = object> = new (...args: any[]) => T;\n\n/**\n * The public interface added by FocusMixin.\n * Consumers can use this type for typed references.\n *\n * @public\n */\nexport interface FocusMixinInterface {\n  /** True when the component host has focus (including descendant focus). */\n  readonly focused: boolean;\n  /** True when focus arrived via keyboard (not pointer). */\n  readonly focusedVisible: boolean;\n}\n\n/**\n * FocusMixin — standardized focus delegation for HELiX web components.\n *\n * Modeled after Lion's `FocusMixin` and Material Web's `mixinDelegatesAria`.\n * Provides:\n * - `_focusableNode` getter for subclasses to declare the inner focusable element\n * - `focused` reflected attribute as a styling hook for `:host([focused])`\n * - `focusedVisible` reflected attribute for keyboard-only focus rings\n * - Delegated `focus()` / `blur()` routing to the inner element\n * - Autofocus support after first render\n *\n * ### Usage\n *\n * ```ts\n * class MyInput extends FocusMixin(HelixElement) {\n *   @query('input') private _input: HTMLInputElement | undefined;\n *\n *   protected override get _focusableNode(): HTMLElement | null {\n *     return this._input ?? null;\n *   }\n * }\n * ```\n *\n * @param superClass - A Lit element constructor to mix into\n * @returns A new class with focus management capabilities\n *\n * @public\n */\nexport const FocusMixin = <T extends Constructor<LitElement>>(superClass: T) => {\n  class FocusMixinClass extends superClass implements FocusMixinInterface {\n    /**\n     * True when the component or any of its descendants has focus.\n     * Reflects to attribute `focused` for CSS selector use.\n     *\n     * @attr focused\n     */\n    @property({ type: Boolean, reflect: true })\n    focused = false;\n\n    /**\n     * True when focus was reached via keyboard navigation (Tab / Shift+Tab)\n     * rather than pointer interaction. Reflects to attribute `focused-visible`\n     * for rendering keyboard-only focus rings.\n     *\n     * @attr focused-visible\n     */\n    @property({ type: Boolean, reflect: true, attribute: 'focused-visible' })\n    focusedVisible = false;\n\n    /** @internal — whether a `focus()` call was queued before first render */\n    private _focusPending = false;\n\n    /**\n     * @internal — tracks whether the most recent interaction toward this\n     * element was via pointer (true) or keyboard (false).\n     *\n     * Set to false on `pointerdown` so that the subsequent `focusin` can\n     * determine it is not keyboard-initiated.\n     */\n    private _lastInteractionWasPointer = false;\n\n    /**\n     * Returns the inner focusable element that `focus()` and `blur()` will\n     * delegate to. Subclasses MUST override this getter.\n     *\n     * @returns The inner focusable element, or `null` if not yet rendered.\n     * @internal\n     */\n    protected get _focusableNode(): HTMLElement | null {\n      return null;\n    }\n\n    /**\n     * Delegates focus to the inner focusable element.\n     * If the element has not yet rendered, queues the focus call for\n     * `firstUpdated`.\n     */\n    override focus(options?: FocusOptions): void {\n      const node = this._focusableNode;\n      if (node !== null) {\n        node.focus(options);\n      } else {\n        this._focusPending = true;\n      }\n    }\n\n    /** Delegates blur to the inner focusable element. */\n    override blur(): void {\n      this._focusableNode?.blur();\n    }\n\n    override connectedCallback(): void {\n      super.connectedCallback();\n      this.addEventListener('focusin', this._handleFocusIn);\n      this.addEventListener('focusout', this._handleFocusOut);\n      this.addEventListener('pointerdown', this._handlePointerDown);\n      this.addEventListener('keydown', this._handleKeyDown);\n    }\n\n    override disconnectedCallback(): void {\n      super.disconnectedCallback();\n      this.removeEventListener('focusin', this._handleFocusIn);\n      this.removeEventListener('focusout', this._handleFocusOut);\n      this.removeEventListener('pointerdown', this._handlePointerDown);\n      this.removeEventListener('keydown', this._handleKeyDown);\n    }\n\n    override firstUpdated(changedProperties: PropertyValues): void {\n      super.firstUpdated(changedProperties);\n\n      // Honour the native `autofocus` attribute after the first render cycle\n      if (this.hasAttribute('autofocus')) {\n        this.focus();\n      }\n\n      // Flush any focus() call that arrived before the shadow DOM was stamped\n      if (this._focusPending) {\n        this._focusPending = false;\n        this.focus();\n      }\n    }\n\n    // ─── Private Event Handlers ────────────────────────────────────────────────\n\n    /** @internal */\n    private _handleFocusIn = (): void => {\n      this.focused = true;\n      // focusedVisible is true only when focus arrived via keyboard\n      this.focusedVisible = !this._lastInteractionWasPointer;\n    };\n\n    /** @internal */\n    private _handleFocusOut = (): void => {\n      this.focused = false;\n      this.focusedVisible = false;\n      // Reset for the next interaction cycle\n      this._lastInteractionWasPointer = false;\n    };\n\n    /**\n     * Marks the next focusin as pointer-initiated.\n     * @internal\n     */\n    private _handlePointerDown = (): void => {\n      this._lastInteractionWasPointer = true;\n    };\n\n    /**\n     * Ensures that keyboard navigation (Tab / Shift+Tab arriving from outside)\n     * is correctly flagged as keyboard-initiated even when no prior `pointerdown`\n     * fired on this element.\n     *\n     * This fires BEFORE `focusin` so the flag is in the correct state when\n     * `_handleFocusIn` runs.\n     * @internal\n     */\n    private _handleKeyDown = (): void => {\n      this._lastInteractionWasPointer = false;\n    };\n  }\n\n  return FocusMixinClass as unknown as T & Constructor<FocusMixinInterface>;\n};\n","import { css } from 'lit';\n\nexport const helixTextInputStyles = css`\n  :host {\n    display: block;\n  }\n\n  :host([disabled]) {\n    opacity: var(--hx-opacity-disabled, 0.5);\n    pointer-events: none;\n  }\n\n  /*\n   * Attribute-based focus hooks set by FocusMixin.\n   * :host([focused]) — fires whenever the component or any descendant has focus.\n   * :host([focused-visible]) — fires only for keyboard-initiated focus.\n   * These complement the :focus-within rules on .field__input-wrapper and are\n   * exposed as theming hooks for consumers who target the host element.\n   */\n  :host([focused]) .field__input-wrapper {\n    border-color: var(\n      --hx-input-focus-ring-color,\n      var(--hx-focus-ring-color, var(--hx-color-primary-400, #60a5fa))\n    );\n    box-shadow: 0 0 0 var(--hx-focus-ring-width, 2px)\n      color-mix(\n        in srgb,\n        var(\n            --hx-input-focus-ring-color,\n            var(--hx-focus-ring-color, var(--hx-color-primary-400, #60a5fa))\n          )\n          calc(var(--hx-focus-ring-opacity, 0.25) * 100%),\n        transparent\n      );\n  }\n\n  :host([focused-visible]) .field__input-wrapper {\n    border-color: var(\n      --hx-input-focus-ring-color,\n      var(--hx-focus-ring-color, var(--hx-color-primary-400, #60a5fa))\n    );\n    box-shadow: 0 0 0 var(--hx-focus-ring-width, 2px)\n      color-mix(\n        in srgb,\n        var(\n            --hx-input-focus-ring-color,\n            var(--hx-focus-ring-color, var(--hx-color-primary-400, #60a5fa))\n          )\n          calc(var(--hx-focus-ring-opacity, 0.25) * 100%),\n        transparent\n      );\n  }\n\n  * {\n    box-sizing: border-box;\n  }\n\n  .field {\n    display: flex;\n    flex-direction: column;\n    gap: var(--hx-space-1, 0.25rem);\n    font-family: var(--hx-input-font-family, var(--hx-font-family-sans, sans-serif));\n  }\n\n  /* ─── Label ─── */\n\n  .field__label-wrapper {\n    display: contents;\n  }\n\n  .field__label {\n    display: flex;\n    align-items: baseline;\n    gap: var(--hx-space-1, 0.25rem);\n    font-size: var(--hx-font-size-sm, 0.875rem);\n    font-weight: var(--hx-font-weight-medium, 500);\n    color: var(--hx-input-label-color, var(--hx-color-neutral-700, #343a40));\n    line-height: var(--hx-line-height-normal, 1.5);\n  }\n\n  .field__required-marker {\n    color: var(--hx-input-error-color, var(--hx-color-error-text, #b91c1c));\n    font-weight: var(--hx-font-weight-bold, 700);\n  }\n\n  /* ─── Input Wrapper ─── */\n\n  .field__input-wrapper {\n    display: flex;\n    align-items: center;\n    border: var(--hx-border-width-thin, 1px) solid\n      var(--hx-input-border-color, var(--hx-color-neutral-300, #ced4da));\n    border-radius: var(--hx-input-border-radius, var(--hx-border-radius-md, 0.375rem));\n    background-color: var(--hx-input-bg, var(--hx-color-neutral-0, #ffffff));\n    transition:\n      border-color var(--hx-transition-fast, 150ms ease),\n      box-shadow var(--hx-transition-fast, 150ms ease);\n    overflow: hidden;\n  }\n\n  .field__input-wrapper:focus-within {\n    border-color: var(\n      --hx-input-focus-ring-color,\n      var(--hx-focus-ring-color, var(--hx-color-primary-400, #60a5fa))\n    );\n    box-shadow: 0 0 0 var(--hx-focus-ring-width, 2px)\n      color-mix(\n        in srgb,\n        var(\n            --hx-input-focus-ring-color,\n            var(--hx-focus-ring-color, var(--hx-color-primary-400, #60a5fa))\n          )\n          calc(var(--hx-focus-ring-opacity, 0.25) * 100%),\n        transparent\n      );\n  }\n\n  /* ─── Error State ─── */\n\n  .field--error .field__input-wrapper {\n    border-color: var(--hx-input-error-color, var(--hx-color-error-500, #dc3545));\n  }\n\n  .field--error .field__input-wrapper:focus-within {\n    border-color: var(--hx-input-error-color, var(--hx-color-error-500, #dc3545));\n    box-shadow: 0 0 0 var(--hx-focus-ring-width, 2px)\n      color-mix(\n        in srgb,\n        var(--hx-input-error-color, var(--hx-color-error-500, #dc3545))\n          calc(var(--hx-focus-ring-opacity, 0.25) * 100%),\n        transparent\n      );\n  }\n\n  /* ─── Slots (Prefix / Suffix) ─── */\n\n  .field__prefix,\n  .field__suffix {\n    display: flex;\n    align-items: center;\n    color: var(--hx-color-neutral-500, #6c757d);\n    flex-shrink: 0;\n  }\n\n  /* Only add padding when slot has content — avoids phantom space on empty slots */\n  .field__prefix--filled {\n    padding: 0 var(--hx-space-3, 0.75rem);\n  }\n\n  .field__suffix--filled {\n    padding: 0 var(--hx-space-3, 0.75rem);\n  }\n\n  /* ─── Native Input ─── */\n\n  .field__input {\n    flex: 1;\n    border: none;\n    outline: none;\n    background: transparent;\n    padding: var(--hx-space-2, 0.5rem) var(--hx-space-3, 0.75rem);\n    font-family: inherit;\n    font-size: var(--hx-font-size-md, 1rem);\n    color: var(--hx-input-color, var(--hx-color-neutral-800, #212529));\n    line-height: var(--hx-line-height-normal, 1.5);\n    min-height: var(--hx-size-10, 2.5rem);\n    width: 100%;\n  }\n\n  .field__input::placeholder {\n    color: var(--hx-color-neutral-400, #adb5bd);\n  }\n\n  .field__input:disabled {\n    cursor: not-allowed;\n  }\n\n  /* ─── Size Variants ─── */\n\n  .field--size-sm .field__input {\n    padding: var(--hx-space-1, 0.25rem) var(--hx-space-2, 0.5rem);\n    min-height: var(--hx-size-8, 2rem);\n    font-size: var(--hx-input-sm-font-size, 0.875rem);\n  }\n\n  .field--size-md .field__input {\n    /* md is the default — no overrides needed */\n  }\n\n  .field--size-lg .field__input {\n    padding: var(--hx-space-3, 0.75rem) var(--hx-space-4, 1rem);\n    min-height: var(--hx-size-12, 3rem);\n    font-size: var(--hx-input-lg-font-size, 1.125rem);\n  }\n\n  /* ─── Help Text & Error Messages ─── */\n\n  .field__help-text {\n    font-size: var(--hx-font-size-xs, 0.75rem);\n    color: var(--hx-color-neutral-500, #6c757d);\n    line-height: var(--hx-line-height-normal, 1.5);\n  }\n\n  .field__error {\n    font-size: var(--hx-font-size-xs, 0.75rem);\n    color: var(--hx-input-error-color, var(--hx-color-error-text, #b91c1c));\n    line-height: var(--hx-line-height-normal, 1.5);\n  }\n\n  /* ─── Motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .field__input-wrapper {\n      transition: none;\n    }\n  }\n`;\n","import { html, nothing, type PropertyValues } from 'lit';\nimport '../../utilities/document-token-adoption.js';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { live } from 'lit/directives/live.js';\nimport { HelixElement, createIdCounter } from '../../base/index.js';\nimport { FocusMixin } from '../../mixins/index.js';\nimport { FormMixin } from '../../mixins/FormMixin.js';\nimport { helixTextInputStyles } from './hx-text-input.styles.js';\nimport { devWarn } from '../../utils/dev-warn.js';\n\n// Module-level counter for stable, SSR-compatible IDs (avoids Math.random() hydration mismatch)\nconst _nextTextInputId = createIdCounter('hx-text-input');\n\n/**\n * A text input component with label, validation, and form association.\n * Supports accessible labeling via `label` property, `aria-label` attribute, or the `label` slot.\n * Uses `aria-invalid` and `aria-describedby` on the native input for screen reader support. Native `required` provides implicit aria-required mapping per HTML-AAM.\n * Error messages are announced via `role=\"alert\"`. Keyboard navigation follows native input behavior.\n *\n * @summary Form-associated text input with built-in label, error, and help text.\n *\n * @tag hx-text-input\n *\n * @slot label - Custom label content (overrides the label property). Use for Drupal Form API rendered labels.\n * @slot prefix - Content rendered before the input (e.g., icon).\n * @slot suffix - Content rendered after the input (e.g., icon or button).\n * @slot help-text - Custom help text content (overrides the helpText property).\n * @slot error - Custom error content (overrides the error property). Use for Drupal Form API rendered errors.\n *\n * @fires {CustomEvent<{value: string}>} hx-input - Dispatched on every keystroke as the user types.\n * @fires {CustomEvent<{value: string}>} hx-change - Dispatched when the input loses focus after its value changed.\n *\n * @csspart field - The outer field container.\n * @csspart label - The label element.\n * @csspart input-wrapper - The wrapper around prefix, input, and suffix.\n * @csspart input - The native input element.\n * @csspart help-text - The help text container.\n * @csspart error - The error message container.\n *\n * @cssprop [--hx-input-bg=var(--hx-color-neutral-0)] - Input background color.\n * @cssprop [--hx-input-color=var(--hx-color-neutral-800)] - Input text color.\n * @cssprop [--hx-input-border-color=var(--hx-color-neutral-300)] - Input border color.\n * @cssprop [--hx-input-border-radius=var(--hx-border-radius-md)] - Input border radius.\n * @cssprop [--hx-input-font-family=var(--hx-font-family-sans)] - Input font family.\n * @cssprop [--hx-input-focus-ring-color=var(--hx-focus-ring-color)] - Focus ring color.\n * @cssprop [--hx-input-error-color=var(--hx-color-error-500)] - Error state color.\n * @cssprop [--hx-input-label-color=var(--hx-color-neutral-700)] - Label text color.\n * @cssprop [--hx-input-sm-font-size=0.875rem] - Font size for the sm size variant.\n * @cssprop [--hx-input-lg-font-size=1.125rem] - Font size for the lg size variant.\n */\n@customElement('hx-text-input')\nexport class HelixTextInput extends FocusMixin(FormMixin(HelixElement)) {\n  static override styles = [helixTextInputStyles];\n\n  // ─── Form Association ───\n\n  /** @internal */\n  static override formAssociated = true;\n\n  // ─── Properties ───\n\n  /**\n   * The visible label text for the input.\n   * @attr label\n   */\n  @property({ type: String })\n  label = '';\n\n  /**\n   * Placeholder text shown when the input is empty.\n   * @attr placeholder\n   */\n  @property({ type: String })\n  placeholder = '';\n\n  /**\n   * The current value of the input.\n   * @attr value\n   * @remarks When `null` is passed programmatically, Lit coerces it to an empty string.\n   *   This is expected behavior — the input treats null as equivalent to an empty string value.\n   */\n  @property({ type: String })\n  value = '';\n\n  /**\n   * The type of the native input element.\n   * @attr type\n   */\n  @property({ type: String })\n  type: 'text' | 'email' | 'password' | 'tel' | 'url' | 'search' | 'number' | 'date' = 'text';\n\n  /**\n   * Whether the input is required for form submission.\n   * @attr required\n   */\n  @property({ type: Boolean, reflect: true })\n  required = false;\n\n  /**\n   * Whether the input is disabled.\n   * @attr disabled\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * Error message to display. When set, the input enters an error state.\n   * @attr error\n   */\n  @property({ type: String })\n  error = '';\n\n  /**\n   * Help text displayed below the input for guidance.\n   * @attr help-text\n   */\n  @property({ type: String, attribute: 'help-text' })\n  helpText = '';\n\n  /**\n   * The name of the input, used for form submission.\n   * @attr name\n   */\n  @property({ type: String })\n  name = '';\n\n  /**\n   * Accessible name for screen readers, if different from the visible label.\n   * @attr aria-label\n   */\n  @property({ type: String, attribute: 'aria-label' })\n  override ariaLabel: string | null = null;\n\n  /**\n   * Whether the input is read-only.\n   * @attr readonly\n   */\n  @property({ type: Boolean, reflect: true })\n  readonly = false;\n\n  /**\n   * Minimum number of characters allowed.\n   * @attr minlength\n   */\n  @property({ type: Number })\n  minlength: number | undefined = undefined;\n\n  /**\n   * Maximum number of characters allowed.\n   * @attr maxlength\n   */\n  @property({ type: Number })\n  maxlength: number | undefined = undefined;\n\n  /**\n   * A regular expression pattern the value must match for form validation.\n   * @attr pattern\n   */\n  @property({ type: String })\n  pattern = '';\n\n  /**\n   * Hint for the browser's autocomplete feature. Accepts standard HTML autocomplete values.\n   * @attr autocomplete\n   */\n  @property({ type: String })\n  autocomplete = '';\n\n  /**\n   * Validation message shown when the field is required but empty.\n   * @attr required-message\n   */\n  @property({ attribute: 'required-message' })\n  requiredMessage = 'This field is required.';\n\n  /**\n   * Visual size of the input field.\n   * @attr hx-size\n   */\n  @property({ type: String, attribute: 'hx-size', reflect: true })\n  size: 'sm' | 'md' | 'lg' = 'md';\n\n  // ─── Internal References ───\n\n  /** @internal */\n  @query('.field__input')\n  private _input: HTMLInputElement | undefined;\n\n  // ─── FocusMixin integration ───\n\n  /**\n   * Declares the inner focusable element for FocusMixin delegation.\n   * @internal\n   */\n  protected get _focusableNode(): HTMLElement | null {\n    return this._input ?? null;\n  }\n\n  // ─── Slot Tracking ───\n\n  /** @internal */\n  @state() private _hasLabelSlot = false;\n  /** @internal */\n  @state() private _hasErrorSlot = false;\n  /** @internal */\n  @state() private _hasPrefixSlot = false;\n  /** @internal */\n  @state() private _hasSuffixSlot = false;\n  /** @internal */\n  @state() private _hasHelpTextSlot = false;\n\n  /** @internal */\n  private _handleLabelSlotChange(e: Event): void {\n    const slot = e.target as HTMLSlotElement;\n    this._hasLabelSlot = slot.assignedElements().length > 0;\n    if (this._hasLabelSlot) {\n      const slottedLabel = slot.assignedElements()[0];\n      if (slottedLabel && !slottedLabel.id) {\n        slottedLabel.id = `${this._inputId}-slotted-label`;\n      }\n    }\n  }\n\n  /** @internal */\n  private _handleErrorSlotChange(e: Event): void {\n    const slot = e.target as HTMLSlotElement;\n    this._hasErrorSlot = slot.assignedElements().length > 0;\n  }\n\n  /** @internal */\n  private _handlePrefixSlotChange(e: Event): void {\n    const slot = e.target as HTMLSlotElement;\n    this._hasPrefixSlot = slot.assignedElements().length > 0;\n  }\n\n  /** @internal */\n  private _handleSuffixSlotChange(e: Event): void {\n    const slot = e.target as HTMLSlotElement;\n    this._hasSuffixSlot = slot.assignedElements().length > 0;\n  }\n\n  /** @internal */\n  private _handleHelpTextSlotChange(e: Event): void {\n    const slot = e.target as HTMLSlotElement;\n    this._hasHelpTextSlot = slot.assignedElements().length > 0;\n  }\n\n  // ─── Lifecycle ───\n\n  override updated(changedProperties: PropertyValues<this>): void {\n    super.updated(changedProperties);\n    if (changedProperties.has('value')) {\n      this._internals.setFormValue(this.value);\n    }\n    if (\n      (changedProperties.has('value') || changedProperties.has('type')) &&\n      this.type === 'number' &&\n      this.value !== '' &&\n      isNaN(Number(this.value))\n    ) {\n      devWarn(\n        'hx-text-input',\n        `type=\"number\" received non-numeric value \"${this.value}\". Browser will display empty input.`,\n      );\n    }\n  }\n\n  // ─── Form Integration ───\n\n  /** Returns the associated form element, if any. */\n  override get form(): HTMLFormElement | null {\n    return this._internals.form;\n  }\n\n  /** Returns the validation message. */\n  override get validationMessage(): string {\n    return this._internals.validationMessage;\n  }\n\n  /** Returns the ValidityState object. */\n  override get validity(): ValidityState {\n    return this._internals.validity;\n  }\n\n  /** @internal */\n  protected _updateValidity(): void {\n    if (this.required && !this.value) {\n      this._internals.setValidity(\n        { valueMissing: true },\n        this.error || this.requiredMessage,\n        this._input,\n      );\n    } else if (\n      this.minlength !== undefined &&\n      this.value.length > 0 &&\n      this.value.length < this.minlength\n    ) {\n      this._internals.setValidity(\n        { tooShort: true },\n        this.error || `Please lengthen this text to ${this.minlength} characters or more.`,\n        this._input,\n      );\n    } else if (this.maxlength !== undefined && this.value.length > this.maxlength) {\n      this._internals.setValidity(\n        { tooLong: true },\n        this.error || `Please shorten this text to ${this.maxlength} characters or fewer.`,\n        this._input,\n      );\n    } else {\n      this._internals.setValidity({});\n    }\n  }\n\n  // ─── Form Lifecycle Hooks ───\n\n  protected override _onFormReset(): void {\n    this.value = '';\n    this._internals.setFormValue('');\n    this._resetInteractionState();\n  }\n\n  protected override _onFormStateRestore(\n    state: File | string | FormData | null,\n    _mode: 'restore' | 'autocomplete',\n  ): void {\n    if (typeof state === 'string') {\n      this.value = state;\n    }\n  }\n\n  protected override _onFormDisabled(disabled: boolean): void {\n    this.disabled = disabled;\n  }\n\n  // ─── Event Handling ───\n\n  /** @internal */\n  private _handleInput(e: Event): void {\n    const target = e.target as HTMLInputElement;\n    this.value = target.value;\n    this._internals.setFormValue(this.value);\n    this._handleInteractionInput();\n\n    /**\n     * Dispatched on every keystroke as the user types.\n     * @event hx-input\n     */\n    this.dispatchEvent(\n      new CustomEvent<{ value: string }>('hx-input', {\n        bubbles: true,\n        composed: true,\n        detail: { value: this.value },\n      }),\n    );\n  }\n\n  /** @internal */\n  private _handleChange(e: Event): void {\n    const target = e.target as HTMLInputElement;\n    this.value = target.value;\n    this._internals.setFormValue(this.value);\n    this._handleInteractionBlur();\n\n    /**\n     * Dispatched when the input loses focus after its value changed.\n     * @event hx-change\n     */\n    this.dispatchEvent(\n      new CustomEvent<{ value: string }>('hx-change', {\n        bubbles: true,\n        composed: true,\n        detail: { value: this.value },\n      }),\n    );\n  }\n\n  // ─── Public Methods ───\n\n  /** Selects all text in the input. */\n  select(): void {\n    this._input?.select();\n  }\n\n  // ─── Render ───\n\n  /** @internal */\n  private _inputId = _nextTextInputId();\n  /** @internal */\n  private _helpTextId = `${this._inputId}-help`;\n  /** @internal */\n  private _errorId = `${this._inputId}-error`;\n\n  override render() {\n    const hasError = !!this.error || this._hasErrorSlot;\n\n    const fieldClasses = {\n      field: true,\n      'field--error': hasError,\n      'field--disabled': this.disabled,\n      'field--required': this.required,\n      [`field--size-${this.size}`]: true,\n    };\n\n    const describedBy =\n      [\n        hasError ? this._errorId : null,\n        this.helpText || this._hasHelpTextSlot ? this._helpTextId : null,\n      ]\n        .filter(Boolean)\n        .join(' ') || undefined;\n\n    return html`\n      <div part=\"field\" class=${classMap(fieldClasses)}>\n        <div class=\"field__label-wrapper\">\n          <slot name=\"label\" @slotchange=${this._handleLabelSlotChange}>\n            ${this.label\n              ? html`\n                  <label part=\"label\" class=\"field__label\" for=${this._inputId}>\n                    ${this.label}\n                    ${this.required\n                      ? html`<span class=\"field__required-marker\" aria-hidden=\"true\">*</span>`\n                      : nothing}\n                  </label>\n                `\n              : nothing}\n          </slot>\n        </div>\n\n        <div part=\"input-wrapper\" class=\"field__input-wrapper\">\n          <span\n            class=${classMap({\n              field__prefix: true,\n              'field__prefix--filled': this._hasPrefixSlot,\n            })}\n          >\n            <slot name=\"prefix\" @slotchange=${this._handlePrefixSlotChange}></slot>\n          </span>\n\n          <input\n            part=\"input\"\n            class=\"field__input\"\n            id=${this._inputId}\n            type=${this.type}\n            .value=${live(this.value)}\n            placeholder=${ifDefined(this.placeholder || undefined)}\n            ?required=${this.required}\n            ?disabled=${this.disabled}\n            ?readonly=${this.readonly}\n            name=${ifDefined(this.name || undefined)}\n            minlength=${ifDefined(this.minlength)}\n            maxlength=${ifDefined(this.maxlength)}\n            pattern=${ifDefined(this.pattern || undefined)}\n            autocomplete=${ifDefined(this.autocomplete || undefined)}\n            aria-label=${ifDefined(this.ariaLabel || undefined)}\n            aria-labelledby=${ifDefined(\n              this._hasLabelSlot ? `${this._inputId}-slotted-label` : undefined,\n            )}\n            aria-invalid=${hasError ? 'true' : nothing}\n            aria-describedby=${ifDefined(describedBy)}\n            @input=${this._handleInput}\n            @change=${this._handleChange}\n          />\n\n          <span\n            class=${classMap({\n              field__suffix: true,\n              'field__suffix--filled': this._hasSuffixSlot,\n            })}\n          >\n            <slot name=\"suffix\" @slotchange=${this._handleSuffixSlotChange}></slot>\n          </span>\n        </div>\n\n        ${hasError\n          ? html`<div\n              part=\"error\"\n              class=\"field__error\"\n              id=${this._errorId}\n              role=\"alert\"\n              aria-atomic=\"true\"\n            >\n              <slot name=\"error\" @slotchange=${this._handleErrorSlotChange}>${this.error}</slot>\n            </div>`\n          : html`<slot name=\"error\" @slotchange=${this._handleErrorSlotChange}></slot>`}\n        ${this._hasHelpTextSlot\n          ? html`\n              <div part=\"help-text\" class=\"field__help-text\" id=${this._helpTextId}>\n                <slot name=\"help-text\" @slotchange=${this._handleHelpTextSlotChange}>\n                  ${this.helpText}\n                </slot>\n              </div>\n            `\n          : this.helpText && !hasError\n            ? html`\n                <div part=\"help-text\" class=\"field__help-text\" id=${this._helpTextId}>\n                  <slot name=\"help-text\" @slotchange=${this._handleHelpTextSlotChange}>\n                    ${this.helpText}\n                  </slot>\n                </div>\n              `\n            : html`<slot name=\"help-text\" @slotchange=${this._handleHelpTextSlotChange}></slot>`}\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'hx-text-input': HelixTextInput;\n  }\n}\n\n/** Primary type alias for hx-text-input */\nexport type HxTextInput = HelixTextInput;\n\n/** @deprecated Use HxTextInput instead */\nexport type WcTextInput = HelixTextInput;\n"],"names":["FocusMixin","superClass","FocusMixinClass","options","node","_a","changedProperties","__decorateClass","property","helixTextInputStyles","css","_nextTextInputId","createIdCounter","HelixTextInput","FormMixin","HelixElement","slot","slottedLabel","devWarn","state","_mode","disabled","target","hasError","fieldClasses","describedBy","html","classMap","nothing","live","ifDefined","query","customElement"],"mappings":"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"}

package/dist/shared/{hx-textarea-BkSiU8oM.js → hx-textarea-BfSJJtA1.js}

@@ -1,10 +1,10 @@
 import { css as x, LitElement as f, nothing as d, html as o } from "lit";
+import "./document-token-adoption-DuYNKd4k.js";
 import { property as i, query as v, state as u, customElement as _ } from "lit/decorators.js";
 import { classMap as m } from "lit/directives/class-map.js";
 import { ifDefined as h } from "lit/directives/if-defined.js";
 import { live as g } from "lit/directives/live.js";
-import { tokenStyles as b } from "@helixui/tokens/lit";
-const y = x`
+const b = x`
   :host {
     display: block;
   }
@@ -185,14 +185,14 @@ const y = x`
     line-height: var(--hx-line-height-normal, 1.5);
   }
 `;
-var w = Object.defineProperty, $ = Object.getOwnPropertyDescriptor, a = (e, t, l, n) => {
-  for (var s = n > 1 ? void 0 : n ? $(t, l) : t, c = e.length - 1, p; c >= 0; c--)
+var y = Object.defineProperty, w = Object.getOwnPropertyDescriptor, a = (e, t, l, n) => {
+  for (var s = n > 1 ? void 0 : n ? w(t, l) : t, c = e.length - 1, p; c >= 0; c--)
     (p = e[c]) && (s = (n ? p(t, l, s) : p(s)) || s);
-  return n && s && w(t, l, s), s;
+  return n && s && y(t, l, s), s;
 };
-let S = 0, r = class extends f {
+let $ = 0, r = class extends f {
   constructor() {
-    super(), this.label = "", this.placeholder = "", this.value = "", this.required = !1, this.disabled = !1, this.error = "", this.helpText = "", this.name = "", this.rows = 4, this.readonly = !1, this.resize = "vertical", this.showCount = !1, this.requiredMessage = "This field is required.", this.ariaLabel = null, this._hasLabelSlot = !1, this._hasErrorSlot = !1, this._hasHelpTextSlot = !1, this._liveAnnouncement = "", this._announceTimer = null, this._textareaId = `hx-textarea-${++S}`, this._helpTextId = `${this._textareaId}-help`, this._errorId = `${this._textareaId}-error`, this._counterId = `${this._textareaId}-counter`, this._internals = this.attachInternals();
+    super(), this.label = "", this.placeholder = "", this.value = "", this.required = !1, this.disabled = !1, this.error = "", this.helpText = "", this.name = "", this.rows = 4, this.readonly = !1, this.resize = "vertical", this.showCount = !1, this.requiredMessage = "This field is required.", this.ariaLabel = null, this._hasLabelSlot = !1, this._hasErrorSlot = !1, this._hasHelpTextSlot = !1, this._liveAnnouncement = "", this._announceTimer = null, this._textareaId = `hx-textarea-${++$}`, this._helpTextId = `${this._textareaId}-help`, this._errorId = `${this._textareaId}-error`, this._counterId = `${this._textareaId}-counter`, this._internals = this.attachInternals();
   }
   /** @internal */
   _handleLabelSlotChange(e) {
@@ -386,7 +386,7 @@ let S = 0, r = class extends f {
     `;
   }
 };
-r.styles = [b, y];
+r.styles = [b];
 r.formAssociated = !0;
 a([
   i({ type: String })
@@ -457,4 +457,4 @@ r = a([
 export {
   r as H
 };
-//# sourceMappingURL=hx-textarea-BkSiU8oM.js.map
+//# sourceMappingURL=hx-textarea-BfSJJtA1.js.map

package/dist/shared/hx-textarea-BfSJJtA1.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hx-textarea-BfSJJtA1.js","sources":["../../src/components/hx-textarea/hx-textarea.styles.ts","../../src/components/hx-textarea/hx-textarea.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixTextareaStyles = css`\n  :host {\n    display: block;\n  }\n\n  :host([disabled]) {\n    opacity: var(--hx-opacity-disabled, 0.5);\n    pointer-events: none;\n  }\n\n  * {\n    box-sizing: border-box;\n  }\n\n  .field {\n    display: flex;\n    flex-direction: column;\n    gap: var(--hx-space-1, 0.25rem);\n    font-family: var(--hx-input-font-family, var(--hx-font-family-sans, sans-serif));\n  }\n\n  /* --- Label --- */\n\n  .field__label-wrapper {\n    display: contents;\n  }\n\n  .field__label {\n    display: flex;\n    align-items: baseline;\n    gap: var(--hx-space-1, 0.25rem);\n    font-size: var(--hx-font-size-sm, 0.875rem);\n    font-weight: var(--hx-font-weight-medium, 500);\n    color: var(--hx-input-label-color, var(--hx-color-neutral-700, #343a40));\n    line-height: var(--hx-line-height-normal, 1.5);\n  }\n\n  .field__required-marker {\n    color: var(--hx-input-error-color, var(--hx-color-error-text, #b91c1c));\n    font-weight: var(--hx-font-weight-bold, 700);\n  }\n\n  /* --- Textarea Wrapper --- */\n\n  .field__textarea-wrapper {\n    display: flex;\n    flex-direction: column;\n    border: var(--hx-border-width-thin, 1px) solid\n      var(--hx-input-border-color, var(--hx-color-neutral-300, #ced4da));\n    border-radius: var(--hx-input-border-radius, var(--hx-border-radius-md, 0.375rem));\n    background-color: var(--hx-input-bg, var(--hx-color-neutral-0, #ffffff));\n    transition:\n      border-color var(--hx-transition-fast, 150ms ease),\n      box-shadow var(--hx-transition-fast, 150ms ease);\n    overflow: hidden;\n  }\n\n  .field__textarea-wrapper:focus-within {\n    border-color: var(\n      --hx-input-focus-ring-color,\n      var(--hx-focus-ring-color, var(--hx-color-primary-400, #60a5fa))\n    );\n    /* Solid fallback for browsers without color-mix() (Chrome < 111, Safari < 16.2) — WCAG 1.4.11 */\n    box-shadow: 0 0 0 var(--hx-focus-ring-width, 2px)\n      rgba(37, 99, 235, var(--hx-focus-ring-opacity, 0.25));\n    box-shadow: 0 0 0 var(--hx-focus-ring-width, 2px)\n      color-mix(\n        in srgb,\n        var(\n            --hx-input-focus-ring-color,\n            var(--hx-focus-ring-color, var(--hx-color-primary-400, #60a5fa))\n          )\n          calc(var(--hx-focus-ring-opacity, 0.25) * 100%),\n        transparent\n      );\n  }\n\n  /* --- Error State --- */\n\n  .field--error .field__textarea-wrapper {\n    border-color: var(--hx-input-error-color, var(--hx-color-error-500, #dc3545));\n  }\n\n  .field--error .field__textarea-wrapper:focus-within {\n    border-color: var(--hx-input-error-color, var(--hx-color-error-500, #dc3545));\n    /* Solid fallback for browsers without color-mix() — WCAG 1.4.11 */\n    box-shadow: 0 0 0 var(--hx-focus-ring-width, 2px)\n      rgba(220, 53, 69, var(--hx-focus-ring-opacity, 0.25));\n    box-shadow: 0 0 0 var(--hx-focus-ring-width, 2px)\n      color-mix(\n        in srgb,\n        var(--hx-input-error-color, var(--hx-color-error-500, #dc3545))\n          calc(var(--hx-focus-ring-opacity, 0.25) * 100%),\n        transparent\n      );\n  }\n\n  /* --- Native Textarea --- */\n\n  .field__textarea {\n    border: none;\n    outline: none;\n    background: transparent;\n    padding: var(--hx-space-2, 0.5rem) var(--hx-space-3, 0.75rem);\n    font-family: inherit;\n    font-size: var(--hx-font-size-md, 1rem);\n    color: var(--hx-input-color, var(--hx-color-neutral-800, #212529));\n    line-height: var(--hx-line-height-normal, 1.5);\n    min-height: var(--hx-textarea-min-height, var(--hx-size-20, 5rem));\n    width: 100%;\n    resize: vertical;\n  }\n\n  .field__textarea::placeholder {\n    color: var(--hx-color-neutral-400, #adb5bd);\n  }\n\n  .field__textarea:disabled {\n    cursor: not-allowed;\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .field__textarea-wrapper {\n      transition: none;\n    }\n  }\n\n  /* --- Resize Variants --- */\n\n  :host([resize='none']) .field__textarea {\n    resize: none;\n  }\n\n  /* resize: vertical is the base default — no override needed for [resize='vertical'] */\n\n  :host([resize='both']) .field__textarea {\n    resize: both;\n  }\n\n  :host([resize='auto']) .field__textarea {\n    resize: none;\n    overflow: hidden;\n  }\n\n  /* --- Character Counter --- */\n\n  .field__counter {\n    font-size: var(--hx-font-size-xs, 0.75rem);\n    color: var(--hx-color-neutral-500, #6c757d);\n    line-height: var(--hx-line-height-normal, 1.5);\n    text-align: end;\n  }\n\n  /* --- Visually Hidden (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  /* --- Help Text & Error Messages --- */\n\n  .field__help-text {\n    font-size: var(--hx-font-size-xs, 0.75rem);\n    color: var(--hx-color-neutral-500, #6c757d);\n    line-height: var(--hx-line-height-normal, 1.5);\n  }\n\n  .field__error {\n    font-size: var(--hx-font-size-xs, 0.75rem);\n    color: var(--hx-input-error-color, var(--hx-color-error-text, #b91c1c));\n    line-height: var(--hx-line-height-normal, 1.5);\n  }\n`;\n","import { LitElement, html, nothing, type PropertyValues } from 'lit';\nimport '../../utilities/document-token-adoption.js';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { live } from 'lit/directives/live.js';\nimport { helixTextareaStyles } from './hx-textarea.styles.js';\n\n// Module-level counter for stable, SSR-safe IDs (avoids Math.random() hydration mismatch)\nlet _hxTextareaIdCounter = 0;\n\n/**\n * A multi-line text area component with label, validation, and form association.\n *\n * Uses `aria-invalid` to convey error state and `aria-describedby` to link\n * error/help text to the textarea. Label association is handled through\n * `aria-labelledby` (for slotted labels) or the standard `<label for>` pattern.\n * Supports `aria-label` for cases where a visible label is not present.\n * Validation errors are announced via `role=\"alert\"` (assertive live region).\n *\n * @summary Form-associated textarea with built-in label, error, help text, character counter, and auto-resize.\n *\n * @tag hx-textarea\n *\n * @slot label - Custom label content (overrides the label property). Use for Drupal Form API rendered labels.\n * @slot help-text - Custom help text content (overrides the helpText property).\n * @slot error - Custom error content (overrides the error property). Use for Drupal Form API rendered errors.\n *\n * @fires {CustomEvent<{value: string}>} hx-input - Dispatched on every keystroke as the user types.\n * @fires {CustomEvent<{value: string}>} hx-change - Dispatched when the textarea loses focus after its value changed.\n *\n * @csspart field - The outer field container.\n * @csspart label - The label element.\n * @csspart textarea-wrapper - The wrapper around the textarea.\n * @csspart textarea - The native textarea element.\n * @csspart counter - The character count display.\n * @csspart help-text - The help text container.\n * @csspart error - The error message container.\n *\n * @cssprop [--hx-input-bg=var(--hx-color-neutral-0)] - Input background color.\n * @cssprop [--hx-input-color=var(--hx-color-neutral-800)] - Input text color.\n * @cssprop [--hx-input-border-color=var(--hx-color-neutral-300)] - Input border color.\n * @cssprop [--hx-input-border-radius=var(--hx-border-radius-md)] - Input border radius.\n * @cssprop [--hx-input-font-family=var(--hx-font-family-sans)] - Input font family.\n * @cssprop [--hx-input-focus-ring-color=var(--hx-focus-ring-color)] - Focus ring color.\n * @cssprop [--hx-input-error-color=var(--hx-color-error-500)] - Error state color.\n * @cssprop [--hx-input-label-color=var(--hx-color-neutral-700)] - Label text color.\n * @cssprop [--hx-textarea-min-height=var(--hx-size-20, 5rem)] - Minimum textarea height.\n */\n@customElement('hx-textarea')\nexport class HelixTextarea extends LitElement {\n  static override styles = [helixTextareaStyles];\n\n  // ─── Form Association ───\n\n  /** @internal */\n  static formAssociated = true;\n\n  /** ElementInternals instance for form association, validation, and ARIA. */\n  /** @internal */\n  private _internals: ElementInternals;\n\n  constructor() {\n    super();\n    /** @internal */\n    this._internals = this.attachInternals();\n  }\n\n  // ─── Properties ───\n\n  /**\n   * The visible label text for the textarea.\n   * @attr label\n   */\n  @property({ type: String })\n  label = '';\n\n  /**\n   * Placeholder text shown when the textarea is empty.\n   * @attr placeholder\n   */\n  @property({ type: String })\n  placeholder = '';\n\n  /**\n   * The current value of the textarea.\n   * @attr value\n   */\n  @property({ type: String })\n  value = '';\n\n  /**\n   * Whether the textarea is required for form submission.\n   * @attr required\n   */\n  @property({ type: Boolean, reflect: true })\n  required = false;\n\n  /**\n   * Whether the textarea is disabled.\n   * @attr disabled\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * Error message to display. When set, the textarea enters an error state.\n   * @attr error\n   */\n  @property({ type: String })\n  error = '';\n\n  /**\n   * Help text displayed below the textarea for guidance.\n   * @attr help-text\n   */\n  @property({ type: String, attribute: 'help-text' })\n  helpText = '';\n\n  /**\n   * The name of the textarea, used for form submission.\n   * @attr name\n   */\n  @property({ type: String })\n  name = '';\n\n  /**\n   * The number of visible text rows. Must be a positive integer (minimum 1).\n   * Invalid values are clamped to the nearest valid value.\n   * @attr rows\n   */\n  @property({ type: Number })\n  rows = 4;\n\n  /**\n   * Minimum number of characters required.\n   * @attr minlength\n   */\n  @property({ type: Number, attribute: 'minlength' })\n  minlength: number | undefined;\n\n  /**\n   * Maximum number of characters allowed.\n   * @attr maxlength\n   */\n  @property({ type: Number, attribute: 'maxlength' })\n  maxlength: number | undefined;\n\n  /**\n   * Whether the textarea is read-only. Read-only fields are visible but\n   * cannot be edited by the user. Common in healthcare for displaying\n   * non-editable patient data inline with editable fields.\n   * @attr readonly\n   */\n  @property({ type: Boolean, reflect: true })\n  readonly = false;\n\n  /**\n   * Controls how the textarea can be resized. Use 'auto' for auto-grow behavior.\n   * @attr resize\n   */\n  @property({ type: String, reflect: true })\n  resize: 'none' | 'vertical' | 'both' | 'auto' = 'vertical';\n\n  /**\n   * Whether to show a character count below the textarea.\n   * @attr show-count\n   */\n  @property({ type: Boolean, attribute: 'show-count' })\n  showCount = false;\n\n  /**\n   * Validation message shown when the field is required but empty.\n   * @attr required-message\n   */\n  @property({ attribute: 'required-message' })\n  requiredMessage = 'This field is required.';\n\n  /**\n   * Accessible name for screen readers, if different from the visible label.\n   * @attr aria-label\n   */\n  @property({ type: String, attribute: 'aria-label' })\n  override ariaLabel: string | null = null;\n\n  // ─── Internal References ───\n\n  /** @internal */\n  @query('.field__textarea')\n  private _textarea: HTMLTextAreaElement | undefined;\n\n  // ─── Slot Tracking ───\n\n  /** @internal */\n  @state() private _hasLabelSlot = false;\n  /** @internal */\n  @state() private _hasErrorSlot = false;\n  /** @internal */\n  @state() private _hasHelpTextSlot = false;\n\n  // ─── Live Announcement ───\n\n  /**\n   * Debounced announcement text for the hidden polite live region.\n   * Only populated when the user is approaching the character limit.\n   * @internal\n   */\n  @state() private _liveAnnouncement = '';\n\n  /** Timer handle for the debounced character-count announcement. @internal */\n  private _announceTimer: ReturnType<typeof setTimeout> | null = null;\n\n  /** @internal */\n  private _handleLabelSlotChange(e: Event): void {\n    const slot = e.target as HTMLSlotElement;\n    this._hasLabelSlot = slot.assignedElements().length > 0;\n    if (this._hasLabelSlot) {\n      const slottedLabel = slot.assignedElements()[0];\n      if (slottedLabel && !slottedLabel.id) {\n        slottedLabel.id = `${this._textareaId}-slotted-label`;\n      }\n    }\n  }\n\n  /** @internal */\n  private _handleErrorSlotChange(e: Event): void {\n    const slot = e.target as HTMLSlotElement;\n    this._hasErrorSlot = slot.assignedElements().length > 0;\n  }\n\n  /** @internal */\n  private _handleHelpTextSlotChange(e: Event): void {\n    const slot = e.target as HTMLSlotElement;\n    this._hasHelpTextSlot = slot.assignedElements().length > 0;\n  }\n\n  // ─── Lifecycle ───\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    if (this._announceTimer !== null) {\n      clearTimeout(this._announceTimer);\n      this._announceTimer = null;\n    }\n  }\n\n  override updated(changedProperties: PropertyValues<this>): void {\n    super.updated(changedProperties);\n    if (changedProperties.has('rows')) {\n      const clamped = Math.max(1, Math.round(this.rows));\n      if (clamped !== this.rows) {\n        this.rows = clamped;\n      }\n    }\n    if (changedProperties.has('value')) {\n      this._internals.setFormValue(this.value);\n    }\n    if (\n      changedProperties.has('value') ||\n      changedProperties.has('required') ||\n      changedProperties.has('minlength') ||\n      changedProperties.has('maxlength')\n    ) {\n      this._updateValidity();\n    }\n    // Auto-grow: respond to programmatic value changes\n    if (changedProperties.has('value') && this.resize === 'auto' && this._textarea) {\n      this._textarea.style.height = 'auto';\n      this._textarea.style.height = `${this._textarea.scrollHeight}px`;\n    }\n  }\n\n  // ─── Form Integration ───\n\n  /** Returns the associated form element, if any. */\n  get form(): HTMLFormElement | null {\n    return this._internals.form;\n  }\n\n  /** Returns the validation message. */\n  get validationMessage(): string {\n    return this._internals.validationMessage;\n  }\n\n  /** Returns the ValidityState object. */\n  get validity(): ValidityState {\n    return this._internals.validity;\n  }\n\n  /** Checks whether the textarea satisfies its constraints. */\n  checkValidity(): boolean {\n    return this._internals.checkValidity();\n  }\n\n  /** Reports validity and shows the browser's constraint validation UI. */\n  reportValidity(): boolean {\n    return this._internals.reportValidity();\n  }\n\n  /** @internal */\n  private _updateValidity(): void {\n    const anchor = this._textarea ?? undefined;\n    if (this.required && !this.value) {\n      this._internals.setValidity(\n        { valueMissing: true },\n        this.error || this.requiredMessage,\n        anchor,\n      );\n    } else if (\n      this.minlength !== undefined &&\n      this.value.length > 0 &&\n      this.value.length < this.minlength\n    ) {\n      this._internals.setValidity(\n        { tooShort: true },\n        this.error || `Value must be at least ${this.minlength} characters.`,\n        anchor,\n      );\n    } else if (this.maxlength !== undefined && this.value.length > this.maxlength) {\n      this._internals.setValidity(\n        { tooLong: true },\n        this.error || `Value must be ${this.maxlength} characters or fewer.`,\n        anchor,\n      );\n    } else {\n      this._internals.setValidity({});\n    }\n  }\n\n  /** @internal */\n  formResetCallback(): void {\n    this.value = '';\n    this._internals.setFormValue('');\n  }\n\n  /** @internal */\n  formStateRestoreCallback(\n    state: string | File | FormData | null,\n    _mode: 'restore' | 'autocomplete',\n  ): void {\n    if (typeof state === 'string') {\n      this.value = state;\n    }\n  }\n\n  /** @internal */\n  formDisabledCallback(disabled: boolean): void {\n    this.disabled = disabled;\n  }\n\n  // ─── Event Handling ───\n\n  /** @internal */\n  private _handleInput(e: Event): void {\n    const target = e.target as HTMLTextAreaElement;\n    this.value = target.value;\n    // Note: setFormValue is called in updated() via the value change — no double-call here (P1-06 fix)\n\n    // Auto-grow: reset height then set to scrollHeight\n    if (this.resize === 'auto') {\n      target.style.height = 'auto';\n      target.style.height = `${target.scrollHeight}px`;\n    }\n\n    // Debounced character-count announcement (WCAG 4.1.3):\n    // Only announce when near/at the maxlength limit; suppress every-keystroke noise.\n    if (this._announceTimer !== null) {\n      clearTimeout(this._announceTimer);\n    }\n    this._announceTimer = setTimeout(() => {\n      this._announceTimer = null;\n      if (this.maxlength !== undefined && this.value.length >= this.maxlength * 0.8) {\n        this._liveAnnouncement = `${this.value.length} of ${this.maxlength} characters`;\n      } else {\n        this._liveAnnouncement = '';\n      }\n    }, 1000);\n\n    /**\n     * Dispatched on every keystroke as the user types.\n     * @event hx-input\n     */\n    this.dispatchEvent(\n      new CustomEvent<{ value: string }>('hx-input', {\n        bubbles: true,\n        composed: true,\n        detail: { value: this.value },\n      }),\n    );\n  }\n\n  /** @internal */\n  private _handleChange(e: Event): void {\n    const target = e.target as HTMLTextAreaElement;\n    this.value = target.value;\n    this._internals.setFormValue(this.value);\n    this._updateValidity();\n\n    /**\n     * Dispatched when the textarea loses focus after its value changed.\n     * @event hx-change\n     */\n    this.dispatchEvent(\n      new CustomEvent<{ value: string }>('hx-change', {\n        bubbles: true,\n        composed: true,\n        detail: { value: this.value },\n      }),\n    );\n  }\n\n  // ─── Public Methods ───\n\n  /** Moves focus to the textarea element. */\n  override focus(options?: FocusOptions): void {\n    this._textarea?.focus(options);\n  }\n\n  /** Selects all text in the textarea. */\n  select(): void {\n    this._textarea?.select();\n  }\n\n  // ─── Render ───\n\n  /** @internal */\n  private _textareaId = `hx-textarea-${++_hxTextareaIdCounter}`;\n  /** @internal */\n  private _helpTextId = `${this._textareaId}-help`;\n  /** @internal */\n  private _errorId = `${this._textareaId}-error`;\n  /** @internal */\n  private _counterId = `${this._textareaId}-counter`;\n\n  /** @internal */\n  private _renderCounter() {\n    if (!this.showCount) return nothing;\n\n    // Use Array.from() to count grapheme clusters (handles emoji correctly)\n    const count = Array.from(this.value ?? '').length;\n    const display = this.maxlength !== undefined ? `${count} / ${this.maxlength}` : `${count}`;\n\n    // aria-live=\"polite\" announces counter changes without interrupting the user.\n    // The debounced _liveAnnouncement region provides additional context when nearing the limit.\n    return html`\n      <div part=\"counter\" class=\"field__counter\" id=${this._counterId} aria-hidden=\"true\">\n        ${display}\n      </div>\n    `;\n  }\n\n  override render() {\n    const hasError = !!this.error || this._hasErrorSlot;\n\n    const fieldClasses = {\n      field: true,\n      'field--error': hasError,\n      'field--disabled': this.disabled,\n      'field--required': this.required,\n    };\n\n    // P0-02 fix: help text container renders when slot is used OR property is set\n    const hasHelpText = (!!this.helpText || this._hasHelpTextSlot) && !hasError;\n\n    // Include counter in aria-describedby so screen readers associate it with the textarea.\n    // The counter also has aria-live=\"polite\" for dynamic updates (WCAG 4.1.3).\n    const describedBy =\n      [\n        hasError ? this._errorId : null,\n        hasHelpText ? this._helpTextId : null,\n        this.showCount ? this._counterId : null,\n      ]\n        .filter(Boolean)\n        .join(' ') || undefined;\n\n    return html`\n      <div part=\"field\" class=${classMap(fieldClasses)}>\n        <div class=\"field__label-wrapper\">\n          <slot name=\"label\" @slotchange=${this._handleLabelSlotChange}>\n            ${this.label\n              ? html`\n                  <label part=\"label\" class=\"field__label\" for=${this._textareaId}>\n                    ${this.label}\n                    ${this.required\n                      ? html`<span class=\"field__required-marker\" aria-hidden=\"true\">*</span>`\n                      : nothing}\n                  </label>\n                `\n              : nothing}\n          </slot>\n        </div>\n\n        <div part=\"textarea-wrapper\" class=\"field__textarea-wrapper\">\n          <textarea\n            part=\"textarea\"\n            class=\"field__textarea\"\n            id=${this._textareaId}\n            .value=${live(this.value)}\n            placeholder=${ifDefined(this.placeholder || undefined)}\n            ?required=${this.required}\n            ?disabled=${this.disabled}\n            ?readonly=${this.readonly}\n            rows=${this.rows}\n            minlength=${ifDefined(this.minlength)}\n            maxlength=${ifDefined(this.maxlength)}\n            name=${ifDefined(this.name || undefined)}\n            aria-label=${ifDefined(this.ariaLabel ?? undefined)}\n            aria-labelledby=${ifDefined(\n              this._hasLabelSlot ? `${this._textareaId}-slotted-label` : undefined,\n            )}\n            aria-invalid=${hasError ? 'true' : nothing}\n            aria-describedby=${ifDefined(describedBy)}\n            @input=${this._handleInput}\n            @change=${this._handleChange}\n          ></textarea>\n        </div>\n\n        ${this._renderCounter()}\n        <div aria-live=\"polite\" aria-atomic=\"true\" class=\"sr-only\">${this._liveAnnouncement}</div>\n        ${hasError\n          ? html`\n              <div part=\"error\" class=\"field__error\" id=${this._errorId} role=\"alert\">\n                <slot name=\"error\" @slotchange=${this._handleErrorSlotChange}>${this.error}</slot>\n              </div>\n            `\n          : html`<slot name=\"error\" @slotchange=${this._handleErrorSlotChange}></slot>`}\n        ${hasHelpText\n          ? html`\n              <div part=\"help-text\" class=\"field__help-text\" id=${this._helpTextId}>\n                <slot name=\"help-text\" @slotchange=${this._handleHelpTextSlotChange}>\n                  ${this.helpText}\n                </slot>\n              </div>\n            `\n          : html`<slot name=\"help-text\" @slotchange=${this._handleHelpTextSlotChange}></slot>`}\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'hx-textarea': HelixTextarea;\n  }\n}\n\n/** Canonical type alias for the hx-textarea component. */\nexport type HxTextarea = HelixTextarea;\n\n/** @deprecated Use {@link HxTextarea} instead. The `Wc` prefix was a legacy naming convention. */\nexport type WcTextarea = HelixTextarea;\n"],"names":["helixTextareaStyles","css","_hxTextareaIdCounter","HelixTextarea","LitElement","slot","slottedLabel","changedProperties","clamped","anchor","state","_mode","disabled","target","options","_a","nothing","count","display","html","hasError","fieldClasses","hasHelpText","describedBy","classMap","live","ifDefined","__decorateClass","property","query","customElement"],"mappings":"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"}

package/dist/shared/{hx-theme-Aag8QJvT.js → hx-theme-pc1V7dyL.js}

@@ -1,4 +1,5 @@
 import { css as m, LitElement as p, html as u } from "lit";
+import "./document-token-adoption-DuYNKd4k.js";
 import { property as l, customElement as x } from "lit/decorators.js";
 import { HelixBrandRegistry as f, tokenEntries as y, darkTokenEntries as _ } from "@helixui/tokens";
 const g = m`
@@ -296,4 +297,4 @@ o = a([
 export {
   o as H
 };
-//# sourceMappingURL=hx-theme-Aag8QJvT.js.map
+//# sourceMappingURL=hx-theme-pc1V7dyL.js.map

package/dist/shared/hx-theme-pc1V7dyL.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hx-theme-pc1V7dyL.js","sources":["../../src/components/hx-theme/hx-theme.styles.ts","../../src/utils/token-merger.ts","../../src/components/hx-theme/hx-theme.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixThemeStyles = css`\n  :host {\n    display: contents;\n  }\n\n  /* display: contents makes this wrapper layout-invisible; exposed as [part=\"base\"]\n     for consumer targeting via CSS parts without affecting layout */\n  .theme-base {\n    display: contents;\n  }\n\n  /* Visually hidden but accessible to screen readers — used for aria-live announcements */\n  .visually-hidden {\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 type { BrandTokenMap } from '@helixui/tokens';\n\n/**\n * Merges brand token overrides on top of a base theme CSS string.\n *\n * Brand tokens are appended as a `:host` block after the base theme CSS,\n * which gives them higher cascade precedence within the adopted stylesheet.\n * This preserves all primitive and semantic tokens from the base theme while\n * allowing brand-specific values to override selectively.\n *\n * @param baseCSS - The base theme CSS string (from `_buildThemeCss`).\n * @param brandTokens - CSS custom property overrides for the active brand.\n * @returns Combined CSS string with brand overrides applied after the base theme.\n *\n * @example\n * ```ts\n * const merged = mergeBrandTokens(lightCSS, {\n *   '--hx-color-primary-500': '#003DA5',\n *   '--hx-color-primary-600': '#002D8A',\n * });\n * // merged === lightCSS + \"\\n\\n:host {\\n  --hx-color-primary-500: #003DA5;\\n  ...}\\n\"\n * ```\n */\nexport function mergeBrandTokens(baseCSS: string, brandTokens: BrandTokenMap): string {\n  if (Object.keys(brandTokens).length === 0) {\n    return baseCSS;\n  }\n\n  const brandOverrides = Object.entries(brandTokens)\n    .map(([name, value]) => `  ${name}: ${value};`)\n    .join('\\n');\n\n  return `${baseCSS}\\n\\n/* Brand token overrides */\\n:host {\\n${brandOverrides}\\n}`;\n}\n","import { LitElement, html, type PropertyValues } from 'lit';\nimport '../../utilities/document-token-adoption.js';\nimport { customElement, property } from 'lit/decorators.js';\nimport { tokenEntries, darkTokenEntries, HelixBrandRegistry } from '@helixui/tokens';\nimport { helixThemeStyles } from './hx-theme.styles.js';\nimport { mergeBrandTokens } from '../../utils/token-merger.js';\n\nexport type { TokenDefinition, TokenEntry } from '@helixui/tokens';\n\n/**\n * Controls the spacing density for all descendant `hx-*` components.\n * - `\"comfortable\"` (default): Standard spacing tokens.\n * - `\"compact\"`: Reduces `--hx-space-*` tokens ~25%. For data-dense clinical dashboards.\n * - `\"spacious\"`: Increases `--hx-space-*` tokens ~25%. For touch-optimized bedside tablets.\n */\nexport type DensityMode = 'comfortable' | 'compact' | 'spacious';\n\n/**\n * Controls the motion behavior applied to all descendant `hx-*` components.\n * - `\"full\"` (default): Full animations. Respects OS `prefers-reduced-motion`.\n * - `\"reduced\"`: Collapses all animation durations to 0ms and easings to linear.\n * - `\"none\"`: Same as `\"reduced\"` — all motion tokens resolve to instant/linear.\n */\nexport type MotionMode = 'full' | 'reduced' | 'none';\n\n/**\n * Supported theme names.\n *\n * Three-tier token cascade applied by this component:\n * - **Primitive tier** (`--hx-color-primary-500`, `--hx-space-4`, etc.) — raw values, always injected\n * - **Semantic tier** (`--hx-color-text-primary`, `--hx-color-surface-default`, etc.) — theme-sensitive,\n *   override primitives for dark / high-contrast themes\n * - **Component tier** (`--hx-button-bg`, `--hx-card-padding`, etc.) — set by individual components,\n *   consumed via semantic fallbacks; not managed by `hx-theme` directly\n *\n * Consumers should override at the semantic tier to respect theme scoping.\n */\nexport type ThemeName = 'light' | 'dark' | 'high-contrast' | 'auto';\n\n/**\n * High-contrast token overrides. Targets WCAG 7:1+ contrast ratios for low-vision users.\n * These are injected on top of the light primitives when theme=\"high-contrast\".\n * Values here mirror the `high-contrast` section of tokens.json; kept in sync manually\n * until HC tokens are promoted to the published @helixui/tokens package.\n */\nconst _hcOverrides: Array<[string, string]> = [\n  ['--hx-color-text-primary', '#FFFFFF'],\n  ['--hx-color-text-secondary', '#FFFFFF'],\n  ['--hx-color-text-muted', '#E0E0E0'],\n  ['--hx-color-text-disabled', '#767676'],\n  ['--hx-color-text-inverse', '#000000'],\n  ['--hx-color-text-link', '#FFFF00'],\n  ['--hx-color-text-link-hover', '#FFFF99'],\n  ['--hx-color-text-link-visited', '#FF80FF'],\n  ['--hx-color-text-link-active', '#FFFFFF'],\n  ['--hx-color-surface-default', '#000000'],\n  ['--hx-color-surface-raised', '#1A1A1A'],\n  ['--hx-color-surface-sunken', '#000000'],\n  ['--hx-color-surface-overlay', 'rgba(0, 0, 0, 0.95)'],\n  ['--hx-color-border-default', '#FFFFFF'],\n  ['--hx-color-border-subtle', '#C0C0C0'],\n  ['--hx-color-border-strong', '#FFFFFF'],\n  ['--hx-color-border-focus', '#FFFF00'],\n  ['--hx-color-focus-ring', '#FFFF00'],\n  ['--hx-color-selection-bg', '#1AEBFF'],\n  ['--hx-color-selection-color', '#000000'],\n  ['--hx-body-bg', '#000000'],\n  ['--hx-body-color', '#FFFFFF'],\n  ['--hx-shadow-sm', '0 1px 2px 0 rgb(255 255 255 / 0.2)'],\n  [\n    '--hx-shadow-md',\n    '0 4px 6px -1px rgb(255 255 255 / 0.3), 0 2px 4px -2px rgb(255 255 255 / 0.2)',\n  ],\n  [\n    '--hx-shadow-lg',\n    '0 10px 15px -3px rgb(255 255 255 / 0.3), 0 4px 6px -4px rgb(255 255 255 / 0.2)',\n  ],\n  [\n    '--hx-shadow-xl',\n    '0 20px 25px -5px rgb(255 255 255 / 0.3), 0 8px 10px -6px rgb(255 255 255 / 0.2)',\n  ],\n  ['--hx-shadow-2xl', '0 25px 50px -12px rgb(255 255 255 / 0.4)'],\n];\n\n/**\n * Compact density overrides: ~75% of original --hx-space-* values.\n * Fixed tokens (--hx-space-0 and --hx-space-px) are intentionally omitted — they stay fixed.\n * Component height tokens are reduced one step to match the tighter spacing.\n */\nconst _compactDensityOverrides: Array<[string, string]> = [\n  ['--hx-space-1', '0.1875rem'],\n  ['--hx-space-2', '0.375rem'],\n  ['--hx-space-3', '0.5625rem'],\n  ['--hx-space-4', '0.75rem'],\n  ['--hx-space-5', '0.9375rem'],\n  ['--hx-space-6', '1.125rem'],\n  ['--hx-space-7', '1.3125rem'],\n  ['--hx-space-8', '1.5rem'],\n  ['--hx-space-10', '1.875rem'],\n  ['--hx-space-12', '2.25rem'],\n  ['--hx-space-14', '2.625rem'],\n  ['--hx-space-16', '3rem'],\n  ['--hx-space-20', '3.75rem'],\n  ['--hx-space-24', '4.5rem'],\n  ['--hx-space-32', '6rem'],\n  ['--hx-space-40', '7.5rem'],\n  ['--hx-space-48', '9rem'],\n  ['--hx-space-64', '12rem'],\n  // Component heights — one step smaller\n  ['--hx-input-height-sm', '1.75rem'],\n  ['--hx-input-height-md', '2rem'],\n  ['--hx-input-height-lg', '2.25rem'],\n];\n\n/**\n * Spacious density overrides: ~125% of original --hx-space-* values.\n * Fixed tokens (--hx-space-0 and --hx-space-px) are intentionally omitted — they stay fixed.\n * Component height tokens are increased one step to match the looser spacing.\n */\nconst _spaciousDensityOverrides: Array<[string, string]> = [\n  ['--hx-space-1', '0.3125rem'],\n  ['--hx-space-2', '0.625rem'],\n  ['--hx-space-3', '0.9375rem'],\n  ['--hx-space-4', '1.25rem'],\n  ['--hx-space-5', '1.5625rem'],\n  ['--hx-space-6', '1.875rem'],\n  ['--hx-space-7', '2.1875rem'],\n  ['--hx-space-8', '2.5rem'],\n  ['--hx-space-10', '3.125rem'],\n  ['--hx-space-12', '3.75rem'],\n  ['--hx-space-14', '4.375rem'],\n  ['--hx-space-16', '5rem'],\n  ['--hx-space-20', '6.25rem'],\n  ['--hx-space-24', '7.5rem'],\n  ['--hx-space-32', '10rem'],\n  ['--hx-space-40', '12.5rem'],\n  ['--hx-space-48', '15rem'],\n  ['--hx-space-64', '20rem'],\n  // Component heights — one step larger\n  ['--hx-input-height-sm', '2.25rem'],\n  ['--hx-input-height-md', '2.75rem'],\n  ['--hx-input-height-lg', '3.5rem'],\n];\n\n/**\n * Motion token overrides applied when reduced or no motion is requested.\n * All durations collapse to 0ms and all easings become linear so that\n * every animated component goes instantaneous without modifying its own CSS.\n */\nconst _reducedMotionOverrides: Array<[string, string]> = [\n  ['--hx-duration-fast', '0ms'],\n  ['--hx-duration-normal', '0ms'],\n  ['--hx-duration-slow', '0ms'],\n  ['--hx-duration-slower', '0ms'],\n  ['--hx-duration-spinner', '0ms'],\n  ['--hx-transition-fast', '0ms linear'],\n  ['--hx-transition-normal', '0ms linear'],\n  ['--hx-transition-slow', '0ms linear'],\n  ['--hx-easing-default', 'linear'],\n  ['--hx-easing-in', 'linear'],\n  ['--hx-easing-out', 'linear'],\n  ['--hx-easing-in-out', 'linear'],\n  ['--hx-easing-decelerate', 'linear'],\n  ['--hx-easing-accelerate', 'linear'],\n  ['--hx-easing-spring', 'linear'],\n];\n\nfunction _buildProps(entries: Iterable<[string, string]>): string {\n  return Array.from(entries)\n    .map(([name, value]) => `  ${name}: ${value};`)\n    .join('\\n');\n}\n\n/** Module-level CSS cache: one string per ThemeName — avoids re-building on every theme change */\nconst _cssCache = new Map<ThemeName, string>();\n\nfunction _buildThemeCss(theme: ThemeName): string {\n  const cached = _cssCache.get(theme);\n  if (cached) return cached;\n\n  // Build light token base map from the @helixui/tokens package\n  const lightMap = new Map(tokenEntries.map((t) => [t.name, t.value]));\n\n  let css: string;\n  if (theme === 'dark') {\n    // Apply dark semantic overrides on top of light primitives\n    const merged = new Map(lightMap);\n    for (const t of darkTokenEntries) {\n      merged.set(t.name, t.value);\n    }\n    css = `:host {\\n${_buildProps(merged)}\\n  color-scheme: dark;\\n}`;\n  } else if (theme === 'high-contrast') {\n    // Apply HC overrides on top of light primitives — distinct WCAG 7:1+ token set\n    const merged = new Map(lightMap);\n    for (const [name, value] of _hcOverrides) {\n      merged.set(name, value);\n    }\n    css = `:host {\\n${_buildProps(merged)}\\n  color-scheme: dark;\\n}`;\n  } else {\n    // 'light' — 'auto' resolves to 'light' or 'dark' at runtime via effectiveTheme\n    css = `:host {\\n${_buildProps(lightMap)}\\n  color-scheme: light;\\n}`;\n  }\n\n  _cssCache.set(theme, css);\n  return css;\n}\n\n/**\n * A theme provider that injects CSS custom property tokens for a named theme\n * onto a scoped root element. Wrapping content with this component scopes\n * all `--hx-*` design tokens to the selected theme.\n *\n * This is a pure infrastructure component with `display: contents` — it does\n * not affect layout. Use it to apply a theme to a subtree of components.\n *\n * Supported themes:\n * - `\"light\"` — standard light-mode token set (default)\n * - `\"dark\"` — dark-mode semantic overrides applied on top of light primitives\n * - `\"high-contrast\"` — WCAG 7:1+ contrast token set for low-vision accessibility\n * - `\"auto\"` — follows the OS `prefers-color-scheme` media query (light or dark)\n *\n * @summary Injects --hx-* design tokens for the specified theme scope and controls motion behavior.\n *\n * @tag hx-theme\n *\n * @slot - Default slot for themed content.\n *\n * @csspart base - The inner slot wrapper element. `display: contents` — no layout effect.\n *\n * @cssprop [--hx-*] - All design tokens for the selected theme are injected\n *   as CSS custom properties on the host element.\n *\n * @example Drupal Twig — wrap a region with a dark theme:\n * ```twig\n * <hx-theme theme=\"dark\">\n *   {{ content }}\n * </hx-theme>\n * ```\n *\n * @example Nested scoping — dark sidebar inside a light page:\n * ```html\n * <hx-theme theme=\"light\">\n *   <main>...</main>\n *   <hx-theme theme=\"dark\">\n *     <aside>...</aside>\n *   </hx-theme>\n * </hx-theme>\n * ```\n *\n * @example Compact density for clinical dashboards:\n * ```html\n * <hx-theme theme=\"dark\" density=\"compact\">\n *   <!-- Clinical dashboard content -->\n * </hx-theme>\n * ```\n */\n@customElement('hx-theme')\nexport class HelixTheme extends LitElement {\n  static override styles = [helixThemeStyles];\n\n  /**\n   * The theme to apply. Determines which set of --hx-* tokens are injected.\n   * - `\"light\"` (default): standard light-mode tokens\n   * - `\"dark\"`: dark-mode semantic overrides applied on top of light primitives\n   * - `\"high-contrast\"`: WCAG 7:1+ contrast tokens for low-vision users\n   * - `\"auto\"`: follows OS `prefers-color-scheme`; resolves to `\"light\"` or `\"dark\"` at runtime\n   * @attr theme\n   */\n  @property({ type: String, reflect: true })\n  theme: 'light' | 'dark' | 'high-contrast' | 'auto' = 'light';\n\n  /**\n   * @deprecated Use `theme=\"auto\"` instead.\n   * When true, auto-detects the preferred color scheme via the\n   * `prefers-color-scheme` media query, overriding the `theme` prop.\n   * @attr system\n   */\n  @property({ type: Boolean, reflect: true })\n  system = false;\n\n  /**\n   * The registered brand name to apply on top of the base theme.\n   * When set, brand-specific CSS custom property overrides are merged\n   * after the base theme tokens in the adopted stylesheet, enabling\n   * hospital system white-label implementations.\n   *\n   * The brand must first be registered via `HelixBrandRegistry.register()`.\n   * If the brand name is non-empty but not registered, a warning is logged\n   * and the base theme is applied without brand overrides.\n   *\n   * @attr brand\n   * @example\n   * ```html\n   * <hx-theme theme=\"light\" brand=\"mercy-health\">\n   *   <!-- Content inherits Mercy Health brand tokens -->\n   * </hx-theme>\n   * ```\n   */\n  @property({ type: String, reflect: true })\n  brand = '';\n\n  /**\n   * Controls motion behavior for all descendant `hx-*` components.\n   * - `\"full\"` (default): Full animations. Respects OS `prefers-reduced-motion`.\n   * - `\"reduced\"`: Collapses all animation durations to 0ms and easings to linear.\n   *   Use this for devices where OS accessibility settings cannot be relied on\n   *   (e.g. healthcare bedside terminals).\n   * - `\"none\"`: Same as `\"reduced\"` — all motion tokens resolve to instant/linear.\n   *\n   * When `motion=\"full\"` and the OS reports `prefers-reduced-motion: reduce`,\n   * the same token overrides are applied automatically.\n   * @attr motion\n   */\n  @property({ type: String, reflect: true })\n  motion: MotionMode = 'full';\n\n  /**\n   * Controls the spacing density for all descendant `hx-*` components.\n   * - `\"comfortable\"` (default): Standard spacing tokens.\n   * - `\"compact\"`: Reduces `--hx-space-*` tokens ~25%. For data-dense clinical dashboards.\n   * - `\"spacious\"`: Increases `--hx-space-*` tokens ~25%. For touch-optimized bedside tablets.\n   * @attr density\n   */\n  @property({ type: String, reflect: true })\n  density: DensityMode = 'comfortable';\n\n  /** @internal */\n  private _mediaQuery: MediaQueryList | null = null;\n  /** @internal */\n  private _mediaHandler: (() => void) | null = null;\n  /** @internal */\n  private _themeSheet: CSSStyleSheet | null = null;\n  /** @internal */\n  private _densitySheet: CSSStyleSheet | null = null;\n  /** @internal — media query for OS prefers-reduced-motion */\n  private _motionQuery: MediaQueryList | null = null;\n  /** @internal */\n  private _motionHandler: (() => void) | null = null;\n\n  override firstUpdated(changed: PropertyValues<this>): void {\n    super.firstUpdated(changed);\n    this._initThemeSheet();\n    if (this.system || this.theme === 'auto') {\n      this._attachMediaQuery();\n    }\n    if (this.motion === 'full') {\n      this._attachMotionQuery();\n    }\n  }\n\n  override updated(changed: PropertyValues<this>): void {\n    super.updated(changed);\n    const autoMode = this.system || this.theme === 'auto';\n    if (changed.has('system') || changed.has('theme')) {\n      if (autoMode) {\n        this._attachMediaQuery();\n      } else {\n        this._detachMediaQuery();\n      }\n      this._applyEffectiveTheme();\n    }\n    if (changed.has('motion')) {\n      if (this.motion === 'full') {\n        this._attachMotionQuery();\n      } else {\n        this._detachMotionQuery();\n      }\n      this._applyEffectiveTheme();\n    }\n    if (changed.has('brand')) {\n      this._applyEffectiveTheme();\n    }\n    if (changed.has('density')) {\n      this._applyDensity();\n    }\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this._detachMediaQuery();\n    this._detachMotionQuery();\n  }\n\n  /**\n   * Returns the currently active theme name.\n   * When `system=true` or `theme=\"auto\"`, reflects the OS preference (`\"light\"` or `\"dark\"`).\n   * Otherwise returns the `theme` property value.\n   */\n  get effectiveTheme(): 'light' | 'dark' | 'high-contrast' | 'auto' {\n    if (this.system || this.theme === 'auto') {\n      if (typeof window === 'undefined') return 'light';\n      return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';\n    }\n    return this.theme;\n  }\n\n  /**\n   * Returns the resolved motion level after considering the `motion` attribute and OS preference.\n   * When `motion=\"full\"` and the OS reports `prefers-reduced-motion: reduce`, returns `\"reduced\"`.\n   * Otherwise returns `\"full\"` or `\"reduced\"` based on the `motion` attribute.\n   */\n  get effectiveMotion(): 'full' | 'reduced' {\n    if (this.motion === 'reduced' || this.motion === 'none') return 'reduced';\n    if (\n      typeof window !== 'undefined' &&\n      window.matchMedia('(prefers-reduced-motion: reduce)').matches\n    ) {\n      return 'reduced';\n    }\n    return 'full';\n  }\n\n  /** @internal */\n  private _initThemeSheet(): void {\n    if (this.shadowRoot) {\n      this._themeSheet = new CSSStyleSheet();\n      this._densitySheet = new CSSStyleSheet();\n      this.shadowRoot.adoptedStyleSheets = [\n        ...this.shadowRoot.adoptedStyleSheets,\n        this._themeSheet,\n        this._densitySheet,\n      ];\n      this._applyEffectiveTheme();\n      this._applyDensity();\n    }\n  }\n\n  /** @internal */\n  private _attachMediaQuery(): void {\n    if (this._mediaQuery || typeof window === 'undefined') return;\n    this._mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');\n    this._mediaHandler = () => {\n      this._applyEffectiveTheme();\n      this._announceThemeChange();\n    };\n    this._mediaQuery.addEventListener('change', this._mediaHandler);\n  }\n\n  /** @internal */\n  private _detachMediaQuery(): void {\n    if (this._mediaQuery && this._mediaHandler) {\n      this._mediaQuery.removeEventListener('change', this._mediaHandler);\n    }\n    this._mediaQuery = null;\n    this._mediaHandler = null;\n  }\n\n  /** @internal — attach OS prefers-reduced-motion listener when motion=\"full\" */\n  private _attachMotionQuery(): void {\n    if (this._motionQuery || typeof window === 'undefined') return;\n    this._motionQuery = window.matchMedia('(prefers-reduced-motion: reduce)');\n    this._motionHandler = () => {\n      this._applyEffectiveTheme();\n    };\n    this._motionQuery.addEventListener('change', this._motionHandler);\n  }\n\n  /** @internal */\n  private _detachMotionQuery(): void {\n    if (this._motionQuery && this._motionHandler) {\n      this._motionQuery.removeEventListener('change', this._motionHandler);\n    }\n    this._motionQuery = null;\n    this._motionHandler = null;\n  }\n\n  /** @internal — notifies AT users when system theme changes programmatically */\n  private _announceThemeChange(): void {\n    const announcer = this.shadowRoot?.querySelector('[role=\"status\"]');\n    if (announcer) {\n      announcer.textContent = `Theme changed to ${this.effectiveTheme}`;\n    }\n  }\n\n  /** @internal */\n  private _applyEffectiveTheme(): void {\n    if (!this._themeSheet) return;\n\n    let css = _buildThemeCss(this.effectiveTheme);\n\n    if (this.brand !== '') {\n      const brandTokens = HelixBrandRegistry.getBrandTokens(this.brand);\n      if (brandTokens !== undefined) {\n        css = mergeBrandTokens(css, brandTokens);\n      } else {\n        console.warn(\n          `[hx-theme] Brand \"${this.brand}\" is not registered. ` +\n            `Register it via HelixBrandRegistry.register() before use. ` +\n            `Applying base theme only.`,\n        );\n      }\n    }\n\n    if (this.effectiveMotion === 'reduced') {\n      css += `\\n:host {\\n${_buildProps(_reducedMotionOverrides)}\\n}`;\n    }\n\n    void this._themeSheet.replace(css);\n  }\n\n  /** @internal */\n  private _applyDensity(): void {\n    if (!this._densitySheet) return;\n\n    let css = '';\n    if (this.density === 'compact') {\n      css = `:host {\\n${_buildProps(_compactDensityOverrides)}\\n}`;\n    } else if (this.density === 'spacious') {\n      css = `:host {\\n${_buildProps(_spaciousDensityOverrides)}\\n}`;\n    }\n    // comfortable = no overrides needed (defaults from theme sheet)\n\n    void this._densitySheet.replace(css);\n  }\n\n  override render() {\n    return html`\n      <div part=\"base\" class=\"theme-base\">\n        <slot></slot>\n      </div>\n      <span role=\"status\" aria-live=\"polite\" aria-atomic=\"true\" class=\"visually-hidden\"></span>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'hx-theme': HelixTheme;\n  }\n}\n\n/** Canonical type alias for HelixTheme. Use this when typing hx-theme element references. */\nexport type HxTheme = HelixTheme;\n\n/** @deprecated Use {@link HxTheme} instead. The `Wc` prefix was a legacy naming convention. */\nexport type WcTheme = HelixTheme;\n"],"names":["helixThemeStyles","css","mergeBrandTokens","baseCSS","brandTokens","brandOverrides","name","value","_hcOverrides","_compactDensityOverrides","_spaciousDensityOverrides","_reducedMotionOverrides","_buildProps","entries","_cssCache","_buildThemeCss","theme","cached","lightMap","tokenEntries","t","merged","darkTokenEntries","HelixTheme","LitElement","changed","autoMode","announcer","_a","HelixBrandRegistry","html","__decorateClass","property","customElement"],"mappings":"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"}