@helixui/library 2.1.2-next.52 → 2.1.2-next.53

package/dist/shared/{hx-checkbox-C82GjRXe.js → hx-checkbox-DyDbR1B9.js}

@@ -1,14 +1,14 @@
-import { css as k, nothing as s, html as d } from "lit";
+import { css as p, nothing as s, html as d } from "lit";
 import "./document-token-adoption-DuYNKd4k.js";
-import { property as c, query as m, state as p, customElement as v } from "lit/decorators.js";
-import { classMap as _ } from "lit/directives/class-map.js";
+import { property as i, query as _, state as k, customElement as u } from "lit/decorators.js";
+import { classMap as m } from "lit/directives/class-map.js";
 import { ifDefined as l } from "lit/directives/if-defined.js";
 import { live as b } from "lit/directives/live.js";
-import { F as u } from "./FormMixin-Bjvw20G5.js";
-import { m as f } from "./aria-delegation-CBP9eQ0M.js";
+import { F as v } from "./FormMixin-Bjvw20G5.js";
+import { m as f } from "./aria-delegation-Doq6RRUy.js";
 import { c as g } from "./id-counter-PTgF-zcG.js";
-import { H as y } from "./helix-element-CZvaIEQP.js";
-const z = k`
+import { H as y } from "./helix-element-BJh1Ffvi.js";
+const z = p`
   :host {
     display: block;
   }
@@ -227,14 +227,80 @@ const z = k`
       transition: none;
     }
   }
+
+  /* ─── High Contrast Mode (forced-colors) ─── */
+
+  @media (forced-colors: active) {
+    .checkbox__box {
+      forced-color-adjust: none;
+      background-color: ButtonFace;
+      border: 2px solid ButtonText;
+    }
+
+    .checkbox__input:focus-visible ~ .checkbox__box {
+      outline: 3px solid Highlight;
+      outline-offset: 2px;
+    }
+
+    .checkbox--checked .checkbox__box,
+    .checkbox--indeterminate .checkbox__box {
+      background-color: Highlight;
+      border-color: Highlight;
+    }
+
+    .checkbox__icon {
+      stroke: HighlightText;
+    }
+
+    .checkbox--error .checkbox__box {
+      border-color: LinkText;
+    }
+
+    .checkbox--error.checkbox--checked .checkbox__box,
+    .checkbox--error.checkbox--indeterminate .checkbox__box {
+      background-color: LinkText;
+      border-color: LinkText;
+    }
+
+    :host([disabled]) {
+      opacity: 1;
+    }
+
+    :host([disabled]) .checkbox__box {
+      border-color: GrayText;
+      background-color: ButtonFace;
+    }
+
+    :host([disabled]) .checkbox--checked .checkbox__box,
+    :host([disabled]) .checkbox--indeterminate .checkbox__box {
+      background-color: GrayText;
+      border-color: GrayText;
+    }
+
+    :host([disabled]) .checkbox__label {
+      color: GrayText;
+    }
+
+    .checkbox__label {
+      color: CanvasText;
+    }
+
+    .checkbox__help-text {
+      color: GrayText;
+    }
+
+    .checkbox__error {
+      color: LinkText;
+    }
+  }
 `;
 var w = Object.defineProperty, $ = Object.getOwnPropertyDescriptor, o = (e, t, a, h) => {
-  for (var i = h > 1 ? void 0 : h ? $(t, a) : t, n = e.length - 1, x; n >= 0; n--)
-    (x = e[n]) && (i = (h ? x(t, a, i) : x(i)) || i);
-  return h && i && w(t, a, i), i;
+  for (var c = h > 1 ? void 0 : h ? $(t, a) : t, n = e.length - 1, x; n >= 0; n--)
+    (x = e[n]) && (c = (h ? x(t, a, c) : x(c)) || c);
+  return h && c && w(t, a, c), c;
 };
 const E = g("hx-checkbox");
-let r = class extends f(u(y)) {
+let r = class extends f(v(y)) {
   constructor() {
     super(...arguments), this.checked = !1, this.indeterminate = !1, this.disabled = !1, this.required = !1, this.name = "", this.value = "on", this.label = "", this.error = "", this.helpText = "", this.requiredMessage = "This field is required.", this.size = "md", this._hasErrorSlot = !1, this._announcedError = "", this._id = E(), this._helpTextId = `${this._id}-help`, this._errorId = `${this._id}-error`, this._labelId = `${this._id}-label`;
   }
@@ -315,7 +381,7 @@ let r = class extends f(u(y)) {
       "checkbox--lg": this.size === "lg"
     }, a = [e ? this._errorId : null, this.helpText && !e ? this._helpTextId : null].filter(Boolean).join(" ") || void 0, h = this.ariaLabel ?? void 0;
     return d`
-      <div class=${_(t)}>
+      <div class=${m(t)}>
         <label part="control" class="checkbox__control" @click=${this._handleChange}>
           <input
             class="checkbox__input"
@@ -333,10 +399,10 @@ let r = class extends f(u(y)) {
             aria-label=${l(h)}
             aria-labelledby=${l(h ? void 0 : this._labelId)}
             @keydown=${this._handleKeyDown}
-            @click=${(i) => {
-      i.preventDefault(), i.stopPropagation();
+            @click=${(c) => {
+      c.preventDefault(), c.stopPropagation();
     }}
-            @change=${(i) => i.stopPropagation()}
+            @change=${(c) => c.stopPropagation()}
           />
 
           <span part="checkbox" class="checkbox__box">
@@ -393,51 +459,51 @@ let r = class extends f(u(y)) {
 r.styles = [z];
 r.formAssociated = !0;
 o([
-  c({ type: Boolean, reflect: !0 })
+  i({ type: Boolean, reflect: !0 })
 ], r.prototype, "checked", 2);
 o([
-  c({ type: Boolean, reflect: !0 })
+  i({ type: Boolean, reflect: !0 })
 ], r.prototype, "indeterminate", 2);
 o([
-  c({ type: Boolean, reflect: !0 })
+  i({ type: Boolean, reflect: !0 })
 ], r.prototype, "disabled", 2);
 o([
-  c({ type: Boolean, reflect: !0 })
+  i({ type: Boolean, reflect: !0 })
 ], r.prototype, "required", 2);
 o([
-  c({ type: String })
+  i({ type: String, reflect: !0 })
 ], r.prototype, "name", 2);
 o([
-  c({ type: String })
+  i({ type: String, reflect: !0 })
 ], r.prototype, "value", 2);
 o([
-  c({ type: String })
+  i({ type: String })
 ], r.prototype, "label", 2);
 o([
-  c({ type: String })
+  i({ type: String })
 ], r.prototype, "error", 2);
 o([
-  c({ type: String, attribute: "help-text" })
+  i({ type: String, attribute: "help-text" })
 ], r.prototype, "helpText", 2);
 o([
-  c({ attribute: "required-message" })
+  i({ attribute: "required-message" })
 ], r.prototype, "requiredMessage", 2);
 o([
-  c({ type: String, attribute: "hx-size", reflect: !0 })
+  i({ type: String, attribute: "hx-size", reflect: !0 })
 ], r.prototype, "size", 2);
 o([
-  m(".checkbox__input")
+  _(".checkbox__input")
 ], r.prototype, "_inputEl", 2);
 o([
-  p()
+  k()
 ], r.prototype, "_hasErrorSlot", 2);
 o([
-  p()
+  k()
 ], r.prototype, "_announcedError", 2);
 r = o([
-  v("hx-checkbox")
+  u("hx-checkbox")
 ], r);
 export {
   r as H
 };
-//# sourceMappingURL=hx-checkbox-C82GjRXe.js.map
+//# sourceMappingURL=hx-checkbox-DyDbR1B9.js.map

package/dist/shared/hx-checkbox-DyDbR1B9.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hx-checkbox-DyDbR1B9.js","sources":["../../src/components/hx-checkbox/hx-checkbox.styles.ts","../../src/components/hx-checkbox/hx-checkbox.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixCheckboxStyles = 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  .checkbox {\n    display: flex;\n    flex-direction: column;\n    gap: var(--hx-space-1, 0.25rem);\n    font-family: var(--hx-font-family-sans, sans-serif);\n  }\n\n  /* ─── Control (checkbox + label row) ─── */\n\n  .checkbox__control {\n    display: inline-flex;\n    align-items: flex-start;\n    gap: var(--hx-space-2, 0.5rem);\n    /* WCAG 2.5.5 (healthcare mandate): minimum 44px touch target height */\n    min-height: var(--hx-touch-target-min, 2.75rem);\n    cursor: pointer;\n  }\n\n  :host([disabled]) .checkbox__control {\n    cursor: not-allowed;\n  }\n\n  /* ─── Hidden Native Input ─── */\n\n  .checkbox__input {\n    position: absolute;\n    width: 1px;\n    height: 1px;\n    padding: 0;\n    margin: -1px;\n    overflow: hidden;\n    clip-path: inset(50%);\n    white-space: nowrap;\n    border: 0;\n  }\n\n  /* ─── Visual Checkbox ─── */\n\n  .checkbox__box {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    width: var(--hx-checkbox-size, var(--hx-size-5, 1.25rem));\n    height: var(--hx-checkbox-size, var(--hx-size-5, 1.25rem));\n    border: var(--hx-border-width-medium, 2px) solid\n      var(--hx-checkbox-border-color, var(--hx-color-neutral-300, #ced4da));\n    border-radius: var(--hx-checkbox-border-radius, var(--hx-border-radius-sm, 0.25rem));\n    background-color: var(--hx-checkbox-bg, var(--hx-color-neutral-0, #ffffff));\n    transition:\n      background-color var(--hx-transition-fast, 150ms ease),\n      border-color var(--hx-transition-fast, 150ms ease),\n      box-shadow var(--hx-transition-fast, 150ms ease);\n    margin-top: var(--hx-space-px, 1px);\n  }\n\n  /* ─── Focus Ring ─── */\n\n  .checkbox__input:focus-visible ~ .checkbox__box {\n    outline: var(--hx-focus-ring-width, 2px) solid\n      var(\n        --hx-checkbox-focus-ring-color,\n        var(--hx-focus-ring-color, var(--hx-color-primary-400, #60a5fa))\n      );\n    outline-offset: var(--hx-focus-ring-offset, 2px);\n  }\n\n  /* ─── Checked State ─── */\n\n  .checkbox--checked .checkbox__box {\n    background-color: var(--hx-checkbox-checked-bg, var(--hx-color-primary-500, #2563eb));\n    border-color: var(--hx-checkbox-checked-border-color, var(--hx-color-primary-500, #2563eb));\n  }\n\n  /* ─── Indeterminate State ─── */\n\n  .checkbox--indeterminate .checkbox__box {\n    background-color: var(--hx-checkbox-checked-bg, var(--hx-color-primary-500, #2563eb));\n    border-color: var(--hx-checkbox-checked-border-color, var(--hx-color-primary-500, #2563eb));\n  }\n\n  /* ─── Error State ─── */\n\n  .checkbox--error .checkbox__box {\n    border-color: var(--hx-checkbox-error-color, var(--hx-color-error-500, #dc3545));\n  }\n\n  .checkbox--error.checkbox--checked .checkbox__box,\n  .checkbox--error.checkbox--indeterminate .checkbox__box {\n    background-color: var(--hx-checkbox-error-color, var(--hx-color-error-500, #dc3545));\n    border-color: var(--hx-checkbox-error-color, var(--hx-color-error-500, #dc3545));\n  }\n\n  /* ─── Hover ─── */\n\n  /* P1-03: use component token so consumer overrides of --hx-checkbox-border-color work on hover */\n  .checkbox__control:hover .checkbox__box {\n    border-color: var(\n      --hx-checkbox-hover-border-color,\n      var(--hx-checkbox-border-color, var(--hx-color-primary-500, #2563eb))\n    );\n  }\n\n  .checkbox--checked .checkbox__control:hover .checkbox__box {\n    filter: brightness(var(--hx-filter-brightness-hover, 0.9));\n  }\n\n  .checkbox--error .checkbox__control:hover .checkbox__box {\n    border-color: var(--hx-checkbox-error-color, var(--hx-color-error-500, #dc3545));\n  }\n\n  /* ─── Checkmark Icon ─── */\n\n  .checkbox__icon {\n    display: none;\n    width: calc(var(--hx-checkbox-size, var(--hx-size-5, 1.25rem)) * 0.65);\n    height: calc(var(--hx-checkbox-size, var(--hx-size-5, 1.25rem)) * 0.65);\n    fill: none;\n    stroke: var(--hx-checkbox-checkmark-color, var(--hx-color-neutral-0, #ffffff));\n    stroke-width: 2.5;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n  }\n\n  .checkbox--checked .checkbox__icon--check {\n    display: block;\n  }\n\n  .checkbox--indeterminate .checkbox__icon--indeterminate {\n    display: block;\n  }\n\n  /* ─── Label ─── */\n\n  .checkbox__label {\n    font-size: var(--hx-font-size-sm, 0.875rem);\n    font-weight: var(--hx-font-weight-medium, 500);\n    color: var(--hx-checkbox-label-color, var(--hx-color-neutral-700, #343a40));\n    line-height: var(--hx-line-height-normal, 1.5);\n    user-select: none;\n    -webkit-user-select: none;\n  }\n\n  .checkbox__required-marker {\n    color: var(--hx-checkbox-error-color, var(--hx-color-error-text, #b91c1c));\n    font-weight: var(--hx-font-weight-bold, 700);\n  }\n\n  /* ─── Help Text & Error Messages ─── */\n\n  .checkbox__help-text {\n    font-size: var(--hx-font-size-xs, 0.75rem);\n    color: var(--hx-checkbox-help-text-color, var(--hx-color-neutral-500, #6c757d));\n    line-height: var(--hx-line-height-normal, 1.5);\n    padding-inline-start: calc(\n      var(--hx-checkbox-size, var(--hx-size-5, 1.25rem)) + var(--hx-space-2, 0.5rem)\n    );\n  }\n\n  .checkbox__error {\n    font-size: var(--hx-font-size-xs, 0.75rem);\n    color: var(--hx-checkbox-error-color, var(--hx-color-error-text, #b91c1c));\n    line-height: var(--hx-line-height-normal, 1.5);\n    padding-inline-start: calc(\n      var(--hx-checkbox-size, var(--hx-size-5, 1.25rem)) + var(--hx-space-2, 0.5rem)\n    );\n  }\n\n  /* ─── Size Variants ─── */\n\n  :host([hx-size='sm']) {\n    --hx-checkbox-size: var(--hx-size-4, 1rem);\n  }\n\n  :host([hx-size='sm']) .checkbox__label {\n    font-size: var(--hx-font-size-xs, 0.75rem);\n  }\n\n  :host([hx-size='sm']) .checkbox__help-text,\n  :host([hx-size='sm']) .checkbox__error {\n    font-size: var(--hx-font-size-xs, 0.75rem);\n    padding-inline-start: calc(var(--hx-size-4, 1rem) + var(--hx-space-2, 0.5rem));\n  }\n\n  :host([hx-size='lg']) {\n    --hx-checkbox-size: var(--hx-size-6, 1.5rem);\n  }\n\n  :host([hx-size='lg']) .checkbox__label {\n    font-size: var(--hx-font-size-md, 1rem);\n  }\n\n  :host([hx-size='lg']) .checkbox__help-text,\n  :host([hx-size='lg']) .checkbox__error {\n    font-size: var(--hx-font-size-sm, 0.875rem);\n    padding-inline-start: calc(var(--hx-size-6, 1.5rem) + var(--hx-space-2, 0.5rem));\n  }\n\n  /* ─── Reduced Motion ─── */\n\n  @media (prefers-reduced-motion: reduce) {\n    .checkbox__box {\n      transition: none;\n    }\n  }\n\n  /* ─── High Contrast Mode (forced-colors) ─── */\n\n  @media (forced-colors: active) {\n    .checkbox__box {\n      forced-color-adjust: none;\n      background-color: ButtonFace;\n      border: 2px solid ButtonText;\n    }\n\n    .checkbox__input:focus-visible ~ .checkbox__box {\n      outline: 3px solid Highlight;\n      outline-offset: 2px;\n    }\n\n    .checkbox--checked .checkbox__box,\n    .checkbox--indeterminate .checkbox__box {\n      background-color: Highlight;\n      border-color: Highlight;\n    }\n\n    .checkbox__icon {\n      stroke: HighlightText;\n    }\n\n    .checkbox--error .checkbox__box {\n      border-color: LinkText;\n    }\n\n    .checkbox--error.checkbox--checked .checkbox__box,\n    .checkbox--error.checkbox--indeterminate .checkbox__box {\n      background-color: LinkText;\n      border-color: LinkText;\n    }\n\n    :host([disabled]) {\n      opacity: 1;\n    }\n\n    :host([disabled]) .checkbox__box {\n      border-color: GrayText;\n      background-color: ButtonFace;\n    }\n\n    :host([disabled]) .checkbox--checked .checkbox__box,\n    :host([disabled]) .checkbox--indeterminate .checkbox__box {\n      background-color: GrayText;\n      border-color: GrayText;\n    }\n\n    :host([disabled]) .checkbox__label {\n      color: GrayText;\n    }\n\n    .checkbox__label {\n      color: CanvasText;\n    }\n\n    .checkbox__help-text {\n      color: GrayText;\n    }\n\n    .checkbox__error {\n      color: LinkText;\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 { mixinDelegatesAria } from '../../mixins/index.js';\nimport { FormMixin } from '../../mixins/FormMixin.js';\nimport { helixCheckboxStyles } from './hx-checkbox.styles.js';\n\n// P2-05: monotonic counter — collision-free, deterministic, SSR-safe\nconst _nextCheckboxId = createIdCounter('hx-checkbox');\n\n/**\n * A checkbox component with label, validation, and form association.\n *\n * @summary Form-associated checkbox with built-in label, error, and help text.\n *\n * @tag hx-checkbox\n *\n * @slot - Custom label content (overrides the label property). Rich HTML allowed — Drupal can include links in consent labels.\n * @slot error - Custom error content (overrides the error property).\n * @slot help-text - Custom help text content (overrides the helpText property).\n *\n * @fires {CustomEvent<{checked: boolean, value: string}>} hx-change - Dispatched when the checkbox is toggled.\n *\n * @csspart checkbox - The visual checkbox element.\n * @csspart checkmark - The SVG checkmark icon inside the checkbox.\n * @csspart label - The label element.\n * @csspart help-text - The help text container.\n * @csspart error - The error message container.\n * @csspart control - The wrapper around checkbox and label.\n *\n * @cssprop [--hx-checkbox-size=var(--hx-size-5, 1.25rem)] - Checkbox dimensions.\n * @cssprop [--hx-checkbox-bg=var(--hx-color-neutral-0, #ffffff)] - Unchecked background color.\n * @cssprop [--hx-checkbox-border-color=var(--hx-color-neutral-300, #ced4da)] - Checkbox border color.\n * @cssprop [--hx-checkbox-border-radius=var(--hx-border-radius-sm, 0.25rem)] - Checkbox border radius.\n * @cssprop [--hx-checkbox-checked-bg=var(--hx-color-primary-500, #2563EB)] - Checked background color.\n * @cssprop [--hx-checkbox-checked-border-color=var(--hx-color-primary-500, #2563EB)] - Checked border color.\n * @cssprop [--hx-checkbox-checkmark-color=var(--hx-color-neutral-0, #ffffff)] - Checkmark color.\n * @cssprop [--hx-checkbox-focus-ring-color=var(--hx-focus-ring-color, #2563EB)] - Focus ring color.\n * @cssprop [--hx-checkbox-label-color=var(--hx-color-neutral-700, #343a40)] - Label text color.\n * @cssprop [--hx-checkbox-help-text-color=var(--hx-color-neutral-500, #6c757d)] - Help text color.\n * @cssprop [--hx-checkbox-hover-border-color=var(--hx-checkbox-border-color)] - Border color on hover.\n * @cssprop [--hx-checkbox-error-color=var(--hx-color-error-500, #dc3545)] - Error state color.\n */\n@customElement('hx-checkbox')\nexport class HelixCheckbox extends mixinDelegatesAria(FormMixin(HelixElement)) {\n  static override styles = [helixCheckboxStyles];\n\n  // ─── Form Association ───\n\n  /** @internal */\n  static override formAssociated = true;\n\n  // ─── Properties ───\n\n  /**\n   * Whether the checkbox is checked.\n   * @attr checked\n   */\n  @property({ type: Boolean, reflect: true })\n  checked = false;\n\n  /**\n   * Whether the checkbox is in an indeterminate state (e.g., for \"select all\" patterns).\n   * @attr indeterminate\n   */\n  @property({ type: Boolean, reflect: true })\n  indeterminate = false;\n\n  /**\n   * Whether the checkbox is disabled.\n   * @attr disabled\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * Whether the checkbox is required for form submission.\n   * @attr required\n   */\n  @property({ type: Boolean, reflect: true })\n  required = false;\n\n  /**\n   * The name of the checkbox, used for form submission.\n   * @attr name\n   */\n  @property({ type: String, reflect: true })\n  name = '';\n\n  /**\n   * The value submitted when the checkbox is checked.\n   * @attr value\n   */\n  @property({ type: String, reflect: true })\n  value = 'on';\n\n  /**\n   * The visible label text for the checkbox.\n   * @attr label\n   */\n  @property({ type: String })\n  label = '';\n\n  /**\n   * Error message to display. When set, the checkbox enters an error state.\n   * @attr error\n   */\n  @property({ type: String })\n  error = '';\n\n  /**\n   * Help text displayed below the checkbox for guidance.\n   * @attr help-text\n   */\n  @property({ type: String, attribute: 'help-text' })\n  helpText = '';\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   * The size of the checkbox.\n   * @attr hx-size\n   */\n  @property({ type: String, attribute: 'hx-size', reflect: true })\n  size: 'sm' | 'md' | 'lg' = 'md';\n\n  /** @internal */\n  @query('.checkbox__input')\n  private _inputEl: HTMLInputElement | undefined;\n\n  /** @internal */\n  @state() private _hasErrorSlot = false;\n\n  /**\n   * Deferred copy of this.error used inside the live region. Injected after\n   * the region is visible (via requestAnimationFrame) so screen readers\n   * re-announce the message even if it was set before the region became\n   * visible — see WCAG 4.1.3.\n   * @internal\n   */\n  @state() private _announcedError = '';\n\n  // ─── Slot Handlers ───\n\n  /** @internal */\n  private _handleErrorSlotChange(e: Event): void {\n    const slot = e.target as HTMLSlotElement;\n    this._hasErrorSlot = slot.assignedNodes({ flatten: true }).length > 0;\n  }\n\n  // ─── Lifecycle ───\n\n  override updated(changedProperties: PropertyValues<this>): void {\n    super.updated(changedProperties);\n    if (changedProperties.has('checked') || changedProperties.has('value')) {\n      this._internals.setFormValue(this.checked ? this.value : null);\n    }\n    // WCAG 4.1.3: Keep _announcedError in sync with the error property.\n    // When error changes from one non-empty value to another, clear the live region\n    // first then re-inject after a rAF tick so screen readers re-announce the updated\n    // message (clearing content before the region is re-populated triggers a new event).\n    // When transitioning from empty to non-empty (initial display), set directly so\n    // the text is immediately available for synchronous DOM assertions.\n    if (changedProperties.has('error')) {\n      const previousError = changedProperties.get('error') as string;\n      if (previousError && this.error) {\n        // Changing from one error message to another: defer to trigger re-announcement.\n        this._announcedError = '';\n        requestAnimationFrame(() => {\n          this._announcedError = this.error;\n        });\n      } else {\n        // Transitioning from empty→error or error→empty: set directly.\n        this._announcedError = this.error;\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.checked) {\n      this._internals.setValidity(\n        { valueMissing: true },\n        this.error || this.requiredMessage,\n        this._inputEl ?? undefined,\n      );\n    } else {\n      this._internals.setValidity({});\n    }\n  }\n\n  // ─── Form Lifecycle Hooks ───\n\n  protected override _onFormReset(): void {\n    this.checked = false;\n    this.indeterminate = false;\n    this._internals.setFormValue(null);\n    this._resetInteractionState();\n  }\n\n  protected override _onFormStateRestore(\n    state: File | string | FormData | null,\n    _mode: 'restore' | 'autocomplete',\n  ): void {\n    this.checked = typeof state === 'string' && state === this.value;\n  }\n\n  protected override _onFormDisabled(disabled: boolean): void {\n    this.disabled = disabled;\n  }\n\n  // ─── Event Handling ───\n\n  /** @internal */\n  private _handleChange(): void {\n    if (this.disabled) return;\n\n    this.indeterminate = false;\n    this.checked = !this.checked;\n\n    this._internals.setFormValue(this.checked ? this.value : null);\n    this._handleInteractionInput();\n\n    /**\n     * Dispatched when the checkbox is toggled.\n     * @event hx-change\n     */\n    this.dispatchEvent(\n      new CustomEvent<{ checked: boolean; value: string }>('hx-change', {\n        bubbles: true,\n        composed: true,\n        detail: { checked: this.checked, value: this.value },\n      }),\n    );\n  }\n\n  /** @internal */\n  private _handleKeyDown(e: KeyboardEvent): void {\n    if (e.key === ' ') {\n      e.preventDefault();\n      e.stopPropagation();\n      this._handleChange();\n    }\n  }\n\n  // ─── Public Methods ───\n\n  /** Moves focus to the checkbox input element. */\n  override focus(options?: FocusOptions): void {\n    this._inputEl?.focus(options);\n  }\n\n  // ─── Render ───\n\n  // P2-05: monotonic counter — collision-free and deterministic\n  /** @internal */\n  private _id = _nextCheckboxId();\n  /** @internal */\n  private _helpTextId = `${this._id}-help`;\n  /** @internal */\n  private _errorId = `${this._id}-error`;\n  /** @internal */\n  private _labelId = `${this._id}-label`;\n\n  override render() {\n    const hasError = !!this.error || this._hasErrorSlot;\n\n    const containerClasses = {\n      checkbox: true,\n      'checkbox--checked': this.checked,\n      'checkbox--indeterminate': this.indeterminate,\n      'checkbox--error': hasError,\n      'checkbox--disabled': this.disabled,\n      'checkbox--required': this.required,\n      'checkbox--sm': this.size === 'sm',\n      'checkbox--md': this.size === 'md',\n      'checkbox--lg': this.size === 'lg',\n    };\n\n    // P2-06: simplified — hasError already includes _hasErrorSlot\n    const describedBy =\n      [hasError ? this._errorId : null, this.helpText && !hasError ? this._helpTextId : null]\n        .filter(Boolean)\n        .join(' ') || undefined;\n\n    const hostAriaLabel = this.ariaLabel ?? undefined;\n\n    return html`\n      <div class=${classMap(containerClasses)}>\n        <label part=\"control\" class=\"checkbox__control\" @click=${this._handleChange}>\n          <input\n            class=\"checkbox__input\"\n            type=\"checkbox\"\n            id=${this._id}\n            .checked=${live(this.checked)}\n            .indeterminate=${live(this.indeterminate)}\n            ?disabled=${this.disabled}\n            ?required=${this.required}\n            name=${ifDefined(this.name || undefined)}\n            .value=${this.value}\n            aria-checked=${this.indeterminate ? 'mixed' : nothing}\n            aria-invalid=${hasError ? 'true' : nothing}\n            aria-describedby=${ifDefined(describedBy)}\n            aria-label=${ifDefined(hostAriaLabel)}\n            aria-labelledby=${ifDefined(!hostAriaLabel ? this._labelId : undefined)}\n            @keydown=${this._handleKeyDown}\n            @click=${(e: Event) => {\n              e.preventDefault();\n              e.stopPropagation();\n            }}\n            @change=${(e: Event) => e.stopPropagation()}\n          />\n\n          <span part=\"checkbox\" class=\"checkbox__box\">\n            <svg\n              part=\"checkmark\"\n              class=\"checkbox__icon checkbox__icon--check\"\n              viewBox=\"0 0 16 16\"\n              aria-hidden=\"true\"\n            >\n              <polyline points=\"3.5 8 6.5 11 12.5 5\"></polyline>\n            </svg>\n            <svg\n              class=\"checkbox__icon checkbox__icon--indeterminate\"\n              viewBox=\"0 0 16 16\"\n              aria-hidden=\"true\"\n            >\n              <line x1=\"4\" y1=\"8\" x2=\"12\" y2=\"8\"></line>\n            </svg>\n          </span>\n\n          <span part=\"label\" class=\"checkbox__label\" id=${this._labelId}>\n            <slot>${this.label}</slot>\n            ${this.required\n              ? html`<span class=\"checkbox__required-marker\" aria-hidden=\"true\">*</span>`\n              : nothing}\n          </span>\n        </label>\n\n        <!--\n          P0-01: wrapper div always owns _errorId so aria-describedby works regardless\n          of whether error content comes from the .error property or the named slot.\n          P1-02: role=\"status\" (implicit aria-live=\"polite\") replaces role=\"alert\" +\n          aria-live=\"polite\" which was semantically contradictory.\n        -->\n        <div\n          part=\"error\"\n          class=\"checkbox__error\"\n          id=${this._errorId}\n          role=\"status\"\n          ?hidden=${!hasError}\n        >\n          <slot name=\"error\" @slotchange=${this._handleErrorSlotChange}>\n            ${this._announcedError}\n          </slot>\n        </div>\n\n        ${this.helpText && !hasError\n          ? html`\n              <div part=\"help-text\" class=\"checkbox__help-text\" id=${this._helpTextId}>\n                <slot name=\"help-text\">${this.helpText}</slot>\n              </div>\n            `\n          : nothing}\n      </div>\n    `;\n  }\n}\n\n/** Canonical type alias for the hx-checkbox component. */\nexport type HxCheckbox = HelixCheckbox;\n\n/** @deprecated Use {@link HxCheckbox} instead. The `Wc` prefix was a legacy naming convention. */\nexport type WcCheckbox = HelixCheckbox;\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'hx-checkbox': HelixCheckbox;\n  }\n  interface HTMLElementEventMap {\n    'hx-change': CustomEvent<{ value: string } | { checked: boolean; value: string }>;\n  }\n}\n"],"names":["helixCheckboxStyles","css","_nextCheckboxId","createIdCounter","HelixCheckbox","mixinDelegatesAria","FormMixin","HelixElement","slot","changedProperties","state","_mode","disabled","options","_a","hasError","containerClasses","describedBy","hostAriaLabel","html","classMap","live","ifDefined","nothing","e","__decorateClass","property","query","customElement"],"mappings":";;;;;;;;;;AAEO,MAAMA,IAAsBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA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"}

package/dist/shared/{hx-checkbox-group-DThZeN5d.js → hx-checkbox-group-C8TaFqy0.js}

@@ -1,8 +1,10 @@
-import { css as _, LitElement as u, nothing as d, html as h } from "lit";
+import { css as _, nothing as c, html as h } from "lit";
 import "./document-token-adoption-DuYNKd4k.js";
-import { property as a, state as p, customElement as x } from "lit/decorators.js";
-import { classMap as g } from "lit/directives/class-map.js";
-const f = _`
+import { property as l, state as p, customElement as u } from "lit/decorators.js";
+import { classMap as x } from "lit/directives/class-map.js";
+import { H as f } from "./helix-element-BJh1Ffvi.js";
+import { c as g } from "./id-counter-PTgF-zcG.js";
+const m = _`
   :host {
     display: block;
   }
@@ -79,15 +81,48 @@ const f = _`
     color: var(--hx-checkbox-group-error-color, var(--hx-color-error-500, #dc3545));
     line-height: var(--hx-line-height-normal);
   }
+
+  /* ─── High Contrast Mode (forced-colors) ─── */
+
+  @media (forced-colors: active) {
+    .fieldset {
+      border: none;
+    }
+
+    .fieldset__legend {
+      color: CanvasText;
+    }
+
+    .fieldset--error .fieldset__legend {
+      color: LinkText;
+    }
+
+    :host([disabled]) {
+      opacity: 1;
+    }
+
+    :host([disabled]) .fieldset__legend {
+      color: GrayText;
+    }
+
+    .fieldset__help-text {
+      color: GrayText;
+    }
+
+    .fieldset__error {
+      color: LinkText;
+    }
+  }
 `;
-var b = Object.defineProperty, m = Object.getOwnPropertyDescriptor, o = (e, t, r, l) => {
-  for (var i = l > 1 ? void 0 : l ? m(t, r) : t, n = e.length - 1, c; n >= 0; n--)
-    (c = e[n]) && (i = (l ? c(t, r, i) : c(i)) || i);
-  return l && i && b(t, r, i), i;
+var b = Object.defineProperty, y = Object.getOwnPropertyDescriptor, i = (e, t, r, a) => {
+  for (var o = a > 1 ? void 0 : a ? y(t, r) : t, n = e.length - 1, d; n >= 0; n--)
+    (d = e[n]) && (o = (a ? d(t, r, o) : d(o)) || o);
+  return a && o && b(t, r, o), o;
 };
-let k = 0, s = class extends u {
+const k = g("hx-checkbox-group");
+let s = class extends f {
   constructor() {
-    super(), this.name = "", this.label = "", this.required = !1, this.disabled = !1, this.error = "", this.helpText = "", this._orientation = "vertical", this._hasErrorSlot = !1, this._hasHelpSlot = !1, this._groupId = `hx-checkbox-group-${++k}`, this._helpTextId = `${this._groupId}-help`, this._errorId = `${this._groupId}-error`, this._handleCheckboxChange = (e) => {
+    super(...arguments), this.name = "", this.label = "", this.required = !1, this.disabled = !1, this.error = "", this.helpText = "", this._orientation = "vertical", this._hasErrorSlot = !1, this._hasHelpSlot = !1, this._groupId = k(), this._helpTextId = `${this._groupId}-help`, this._errorId = `${this._groupId}-error`, this._handleCheckboxChange = (e) => {
       if (e.target === this) return;
       e.stopImmediatePropagation();
       const t = this._getCheckedValues();
@@ -98,7 +133,7 @@ let k = 0, s = class extends u {
           detail: { values: t }
         })
       );
-    }, this._internals = this.attachInternals();
+    };
   }
   get orientation() {
     return this._orientation;
@@ -204,21 +239,21 @@ let k = 0, s = class extends u {
     return this._internals.reportValidity();
   }
   /** @internal */
-  formResetCallback() {
+  _onFormReset() {
     this._getCheckboxes().forEach((t) => {
       t.checked = !1;
     }), this._internals.setFormValue(null), this._updateValidity([]);
   }
   /** @internal */
-  formStateRestoreCallback(e, t) {
+  _onFormStateRestore(e, t) {
     if (!(e instanceof FormData)) return;
-    const r = e.getAll(this.name).map((i) => String(i));
-    this._getCheckboxes().forEach((i) => {
-      i.checked = r.includes(i.value);
+    const r = e.getAll(this.name).map((o) => String(o));
+    this._getCheckboxes().forEach((o) => {
+      o.checked = r.includes(o.value);
     }), this._updateFormValue(r), this._updateValidity(r);
   }
   /** @internal */
-  formDisabledCallback(e) {
+  _onFormDisabled(e) {
     this.disabled = e;
   }
   // ─── Render ───
@@ -235,12 +270,12 @@ let k = 0, s = class extends u {
     return h`
       <fieldset
         part="group"
-        class=${g(t)}
-        aria-describedby=${r ?? d}
+        class=${x(t)}
+        aria-describedby=${r ?? c}
       >
         <legend part="label" class="fieldset__legend">
           <slot name="label">${this.label}</slot>
-          ${this.required ? h`<span class="fieldset__required-marker" aria-hidden="true">*</span>` : d}
+          ${this.required ? h`<span class="fieldset__required-marker" aria-hidden="true">*</span>` : c}
         </legend>
 
         <div class="fieldset__items">
@@ -258,39 +293,39 @@ let k = 0, s = class extends u {
     `;
   }
 };
-s.styles = [f];
+s.styles = [m];
 s.formAssociated = !0;
-o([
-  a({ type: String })
+i([
+  l({ type: String, reflect: !0 })
 ], s.prototype, "name", 2);
-o([
-  a({ type: String })
+i([
+  l({ type: String })
 ], s.prototype, "label", 2);
-o([
-  a({ type: Boolean, reflect: !0 })
+i([
+  l({ type: Boolean, reflect: !0 })
 ], s.prototype, "required", 2);
-o([
-  a({ type: Boolean, reflect: !0 })
+i([
+  l({ type: Boolean, reflect: !0 })
 ], s.prototype, "disabled", 2);
-o([
-  a({ type: String })
+i([
+  l({ type: String })
 ], s.prototype, "error", 2);
-o([
-  a({ type: String, attribute: "help-text" })
+i([
+  l({ type: String, attribute: "help-text" })
 ], s.prototype, "helpText", 2);
-o([
-  a({ type: String, reflect: !0 })
+i([
+  l({ type: String, reflect: !0 })
 ], s.prototype, "orientation", 1);
-o([
+i([
   p()
 ], s.prototype, "_hasErrorSlot", 2);
-o([
+i([
   p()
 ], s.prototype, "_hasHelpSlot", 2);
-s = o([
-  x("hx-checkbox-group")
+s = i([
+  u("hx-checkbox-group")
 ], s);
 export {
   s as H
 };
-//# sourceMappingURL=hx-checkbox-group-DThZeN5d.js.map
+//# sourceMappingURL=hx-checkbox-group-C8TaFqy0.js.map

package/dist/shared/hx-checkbox-group-C8TaFqy0.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hx-checkbox-group-C8TaFqy0.js","sources":["../../src/components/hx-checkbox-group/hx-checkbox-group.styles.ts","../../src/components/hx-checkbox-group/hx-checkbox-group.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixCheckboxGroupStyles = css`\n  :host {\n    display: block;\n  }\n\n  :host([disabled]) {\n    opacity: var(--hx-opacity-disabled);\n    cursor: not-allowed;\n  }\n\n  * {\n    box-sizing: border-box;\n  }\n\n  /* ─── Fieldset ─── */\n\n  .fieldset {\n    border: none;\n    margin: 0;\n    padding: 0;\n    display: flex;\n    flex-direction: column;\n    gap: var(--hx-space-2);\n    font-family: var(--hx-font-family-sans);\n  }\n\n  /* ─── Legend ─── */\n\n  .fieldset__legend {\n    display: flex;\n    align-items: baseline;\n    gap: var(--hx-space-1);\n    font-size: var(--hx-font-size-sm);\n    font-weight: var(--hx-font-weight-medium);\n    color: var(--hx-checkbox-group-label-color, var(--hx-color-neutral-700));\n    line-height: var(--hx-line-height-normal);\n    padding: 0;\n    margin-bottom: var(--hx-space-1);\n  }\n\n  .fieldset__required-marker {\n    color: var(--hx-checkbox-group-error-color, var(--hx-color-error-500, #dc3545));\n    font-weight: var(--hx-font-weight-bold);\n  }\n\n  /* ─── Items Container ─── */\n\n  .fieldset__items {\n    display: flex;\n    flex-direction: column;\n    gap: var(--hx-checkbox-group-gap, var(--hx-space-3));\n  }\n\n  :host([orientation='horizontal']) .fieldset__items {\n    flex-direction: row;\n    flex-wrap: wrap;\n  }\n\n  /* ─── Error State ─── */\n\n  .fieldset--error .fieldset__legend {\n    color: var(--hx-checkbox-group-error-color, var(--hx-color-error-500, #dc3545));\n  }\n\n  /* ─── Help Text & Error Messages ─── */\n\n  .fieldset__help-text {\n    font-size: var(--hx-font-size-xs);\n    color: var(--hx-checkbox-group-help-text-color, var(--hx-color-neutral-500));\n    line-height: var(--hx-line-height-normal);\n  }\n\n  .fieldset__error {\n    font-size: var(--hx-font-size-xs);\n    color: var(--hx-checkbox-group-error-color, var(--hx-color-error-500, #dc3545));\n    line-height: var(--hx-line-height-normal);\n  }\n\n  /* ─── High Contrast Mode (forced-colors) ─── */\n\n  @media (forced-colors: active) {\n    .fieldset {\n      border: none;\n    }\n\n    .fieldset__legend {\n      color: CanvasText;\n    }\n\n    .fieldset--error .fieldset__legend {\n      color: LinkText;\n    }\n\n    :host([disabled]) {\n      opacity: 1;\n    }\n\n    :host([disabled]) .fieldset__legend {\n      color: GrayText;\n    }\n\n    .fieldset__help-text {\n      color: GrayText;\n    }\n\n    .fieldset__error {\n      color: LinkText;\n    }\n  }\n`;\n","import { html, nothing, type PropertyValues } from 'lit';\nimport '../../utilities/document-token-adoption.js';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { HelixElement, createIdCounter } from '../../base/index.js';\nimport { helixCheckboxGroupStyles } from './hx-checkbox-group.styles.js';\nimport type { HelixCheckbox } from '../hx-checkbox/hx-checkbox.js';\nimport { devWarn } from '../../utils/dev-warn.js';\n\nconst _nextCheckboxGroupId = createIdCounter('hx-checkbox-group');\n\n/**\n * A form-associated checkbox group that manages a set of `<hx-checkbox>` children.\n *\n * @summary Form-associated checkbox group with label, validation, help text, and multi-value form submission.\n *\n * @tag hx-checkbox-group\n *\n * @slot - `<hx-checkbox>` elements.\n * @slot label - Rich HTML group label (overrides the label property when used).\n * @slot error - Custom error content (overrides the error property).\n * @slot help-text - Group-level help text.\n *\n * @fires {CustomEvent<{values: string[]}>} hx-change - Dispatched when any child checkbox changes.\n *\n * @csspart group - The fieldset wrapper.\n * @csspart label - The legend/label.\n * @csspart help-text - The help text container.\n * @csspart error-message - The error message container.\n *\n * @cssprop [--hx-checkbox-group-gap=var(--hx-space-3, 0.75rem)] - Gap between checkbox items.\n * @cssprop [--hx-checkbox-group-label-color=var(--hx-color-neutral-700, #343a40)] - Label text color.\n * @cssprop [--hx-checkbox-group-error-color=var(--hx-color-error-500, #dc3545)] - Error message color.\n * @cssprop [--hx-checkbox-group-help-text-color=var(--hx-color-neutral-500)] - Help text color.\n *\n * @drupal\n * Form-associated; render via Twig:\n * ```twig\n * <hx-checkbox-group name=\"{{ field_name }}\" label=\"{{ label }}\"{{ required ? ' required' : '' }}>\n *   {% for option in options %}\n *     <hx-checkbox value=\"{{ option.value }}\" label=\"{{ option.label }}\"></hx-checkbox>\n *   {% endfor %}\n * </hx-checkbox-group>\n * ```\n * The `name` attribute propagates automatically to child checkboxes — no Drupal behavior required.\n */\n@customElement('hx-checkbox-group')\nexport class HelixCheckboxGroup extends HelixElement {\n  static override styles = [helixCheckboxGroupStyles];\n\n  // ─── Form Association ───\n\n  /** Marks this element as form-associated for ElementInternals support. @internal */\n  static override formAssociated = true;\n\n  // ─── Properties ───\n\n  /**\n   * The name used for form submission. Passed to child `hx-checkbox` elements.\n   * @attr name\n   */\n  @property({ type: String, reflect: true })\n  name = '';\n\n  /**\n   * The fieldset legend/label text.\n   * @attr label\n   */\n  @property({ type: String })\n  label = '';\n\n  /**\n   * Whether at least one checkbox must be checked for form submission.\n   * @attr required\n   */\n  @property({ type: Boolean, reflect: true })\n  required = false;\n\n  /**\n   * Whether the entire group 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 group enters an error state.\n   * @attr error\n   */\n  @property({ type: String })\n  error = '';\n\n  /**\n   * Help text to display below the group. Can also be provided via the help-text slot.\n   * @attr help-text\n   */\n  @property({ type: String, attribute: 'help-text' })\n  helpText = '';\n\n  /**\n   * Layout orientation of the checkbox items.\n   * @attr orientation\n   */\n  @property({ type: String, reflect: true })\n  get orientation(): 'vertical' | 'horizontal' {\n    return this._orientation;\n  }\n  set orientation(value: string) {\n    if (value !== 'vertical' && value !== 'horizontal') {\n      devWarn('hx-checkbox-group', `Invalid orientation \"${value}\", defaulting to \"vertical\".`);\n      value = 'vertical';\n    }\n    this._orientation = value as 'vertical' | 'horizontal';\n  }\n  /** @internal */\n  private _orientation: 'vertical' | 'horizontal' = 'vertical';\n\n  /** Whether the named error slot contains projected content. @internal */\n  @state() private _hasErrorSlot = false;\n  /** Whether the named help-text slot contains projected content. @internal */\n  @state() private _hasHelpSlot = false;\n\n  // ─── Internal IDs ───\n\n  /** @internal */\n  private _groupId = _nextCheckboxGroupId();\n  /** @internal */\n  private _helpTextId = `${this._groupId}-help`;\n  /** @internal */\n  private _errorId = `${this._groupId}-error`;\n\n  // ─── Slot Handlers ───\n\n  /** @internal */\n  private _handleErrorSlotChange(e: Event): void {\n    const slot = e.target as HTMLSlotElement;\n    this._hasErrorSlot = slot.assignedNodes({ flatten: true }).length > 0;\n  }\n\n  /** @internal */\n  private _handleHelpSlotChange(e: Event): void {\n    const slot = e.target as HTMLSlotElement;\n    this._hasHelpSlot = slot.assignedNodes({ flatten: true }).length > 0;\n  }\n\n  // ─── Lifecycle ───\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    this.addEventListener('hx-change', this._handleCheckboxChange);\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.removeEventListener('hx-change', this._handleCheckboxChange);\n  }\n\n  override updated(changedProperties: PropertyValues<this>): void {\n    super.updated(changedProperties);\n    if (changedProperties.has('disabled')) {\n      this._syncCheckboxes();\n    }\n    if (changedProperties.has('name')) {\n      this._syncCheckboxNames();\n    }\n    if (changedProperties.has('required')) {\n      this._updateValidity();\n    }\n  }\n\n  override firstUpdated(changedProperties: PropertyValues<this>): void {\n    super.firstUpdated(changedProperties);\n    this._syncCheckboxes();\n    this._syncCheckboxNames();\n    const checkedValues = this._getCheckedValues();\n    this._updateFormValue(checkedValues);\n    this._updateValidity(checkedValues);\n  }\n\n  // ─── Checkbox Management ───\n\n  /** @internal */\n  private _getCheckboxes(): HelixCheckbox[] {\n    return Array.from(this.children).filter((c): c is HelixCheckbox => c.tagName === 'HX-CHECKBOX');\n  }\n\n  /** @internal */\n  private _getCheckedValues(): string[] {\n    return this._getCheckboxes()\n      .filter((cb) => cb.checked)\n      .map((cb) => cb.value);\n  }\n\n  /** @internal */\n  private _syncCheckboxes(): void {\n    const checkboxes = this._getCheckboxes();\n    checkboxes.forEach((cb) => {\n      cb.disabled = this.disabled;\n    });\n  }\n\n  /** @internal */\n  private _syncCheckboxNames(): void {\n    if (!this.name) return;\n    const checkboxes = this._getCheckboxes();\n    checkboxes.forEach((cb) => {\n      cb.name = this.name;\n    });\n  }\n\n  // ─── Event Handling ───\n\n  /** @internal */\n  private _handleCheckboxChange = (e: Event): void => {\n    // Only intercept events from direct hx-checkbox children — do not re-intercept\n    // the hx-change we dispatch ourselves from this element.\n    if (e.target === this) return;\n\n    e.stopImmediatePropagation();\n\n    const values = this._getCheckedValues();\n    this._updateFormValue(values);\n    this._updateValidity(values);\n\n    /**\n     * Dispatched when any child checkbox changes.\n     * @event hx-change\n     */\n    this.dispatchEvent(\n      new CustomEvent<{ values: string[] }>('hx-change', {\n        bubbles: true,\n        composed: true,\n        detail: { values },\n      }),\n    );\n  };\n\n  /** @internal */\n  private _handleSlotChange(): void {\n    this._syncCheckboxes();\n    this._syncCheckboxNames();\n    const checkedValues = this._getCheckedValues();\n    this._updateFormValue(checkedValues);\n    this._updateValidity(checkedValues);\n  }\n\n  // ─── Form Integration ───\n\n  /** @internal */\n  private _updateFormValue(values: string[]): void {\n    if (values.length === 0) {\n      this._internals.setFormValue(null);\n      return;\n    }\n    const formData = new FormData();\n    values.forEach((v) => formData.append(this.name, v));\n    this._internals.setFormValue(formData);\n  }\n\n  /** @internal */\n  private _updateValidity(values?: string[]): void {\n    const checkedValues = values ?? this._getCheckedValues();\n    if (this.required && checkedValues.length === 0) {\n      const firstCheckbox = this._getCheckboxes()[0];\n      this._internals.setValidity(\n        { valueMissing: true },\n        this.error || 'Please select at least one option.',\n        firstCheckbox,\n      );\n    } else {\n      this._internals.setValidity({});\n    }\n  }\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 group 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  protected override _onFormReset(): void {\n    const checkboxes = this._getCheckboxes();\n    checkboxes.forEach((cb) => {\n      cb.checked = false;\n    });\n    this._internals.setFormValue(null);\n    this._updateValidity([]);\n  }\n\n  /** @internal */\n  protected override _onFormStateRestore(\n    state: File | string | FormData | null,\n    _mode: 'restore' | 'autocomplete',\n  ): void {\n    if (!(state instanceof FormData)) return;\n    const restoredValues = state.getAll(this.name).map((v) => String(v));\n    const checkboxes = this._getCheckboxes();\n    checkboxes.forEach((cb) => {\n      cb.checked = restoredValues.includes(cb.value);\n    });\n    this._updateFormValue(restoredValues);\n    this._updateValidity(restoredValues);\n  }\n\n  /** @internal */\n  protected override _onFormDisabled(disabled: boolean): void {\n    this.disabled = disabled;\n  }\n\n  // ─── Render ───\n\n  override render() {\n    const hasError = !!this.error || this._hasErrorSlot;\n\n    const fieldsetClasses = {\n      fieldset: true,\n      'fieldset--error': hasError,\n      'fieldset--disabled': this.disabled,\n      'fieldset--required': this.required,\n    };\n\n    const describedBy =\n      [\n        hasError ? this._errorId : null,\n        this.helpText || this._hasHelpSlot ? this._helpTextId : null,\n      ]\n        .filter(Boolean)\n        .join(' ') || undefined;\n\n    return html`\n      <fieldset\n        part=\"group\"\n        class=${classMap(fieldsetClasses)}\n        aria-describedby=${describedBy ?? nothing}\n      >\n        <legend part=\"label\" class=\"fieldset__legend\">\n          <slot name=\"label\">${this.label}</slot>\n          ${this.required\n            ? html`<span class=\"fieldset__required-marker\" aria-hidden=\"true\">*</span>`\n            : nothing}\n        </legend>\n\n        <div class=\"fieldset__items\">\n          <slot @slotchange=${this._handleSlotChange}></slot>\n        </div>\n\n        ${hasError\n          ? html`<div part=\"error-message\" class=\"fieldset__error\" id=${this._errorId} role=\"alert\">\n              <slot name=\"error\" @slotchange=${this._handleErrorSlotChange}> ${this.error} </slot>\n            </div>`\n          : html`<slot name=\"error\" @slotchange=${this._handleErrorSlotChange}></slot>`}\n\n        <div part=\"help-text\" class=\"fieldset__help-text\" id=${this._helpTextId}>\n          <slot name=\"help-text\" @slotchange=${this._handleHelpSlotChange}>${this.helpText}</slot>\n        </div>\n      </fieldset>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'hx-checkbox-group': HelixCheckboxGroup;\n  }\n}\n"],"names":["helixCheckboxGroupStyles","css","_nextCheckboxGroupId","createIdCounter","HelixCheckboxGroup","HelixElement","values","value","slot","changedProperties","checkedValues","c","cb","formData","v","firstCheckbox","state","_mode","restoredValues","disabled","hasError","fieldsetClasses","describedBy","html","classMap","nothing","__decorateClass","property","customElement"],"mappings":"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"}

package/dist/shared/{hx-clinical-status-BjtT5c0M.js → hx-clinical-status-dDyk5oj1.js}

@@ -1,10 +1,10 @@
-import { css as v, html as e, nothing as d } from "lit";
+import { css as p, html as e, nothing as d } from "lit";
 import "./document-token-adoption-DuYNKd4k.js";
-import { property as o, state as p, customElement as x } from "lit/decorators.js";
+import { property as o, state as v, customElement as x } from "lit/decorators.js";
 import { classMap as u } from "lit/directives/class-map.js";
-import { H as g } from "./helix-element-CZvaIEQP.js";
+import { H as g } from "./helix-element-BJh1Ffvi.js";
 import { c as m } from "./id-counter-PTgF-zcG.js";
-const f = v`
+const f = p`
   :host {
     display: block;
   }
@@ -252,14 +252,37 @@ const f = v`
       transition: none;
     }
   }
+
+  /* ─── Forced Colors (Windows High Contrast) ─── */
+
+  @media (forced-colors: active) {
+    .clinical-status {
+      border-color: CanvasText;
+      border-inline-start-color: CanvasText;
+    }
+
+    .clinical-status__icon svg {
+      fill: CanvasText;
+    }
+
+    .clinical-status__dismiss-button {
+      color: ButtonText;
+      border: 1px solid ButtonText;
+    }
+
+    .clinical-status__acknowledge-button {
+      border-color: ButtonText;
+      color: ButtonText;
+    }
+  }
 `;
-var b = Object.defineProperty, _ = Object.getOwnPropertyDescriptor, r = (t, s, a, c) => {
-  for (var n = c > 1 ? void 0 : c ? _(s, a) : s, l = t.length - 1, h; l >= 0; l--)
-    (h = t[l]) && (n = (c ? h(s, a, n) : h(n)) || n);
-  return c && n && b(s, a, n), n;
+var b = Object.defineProperty, _ = Object.getOwnPropertyDescriptor, r = (t, i, a, c) => {
+  for (var n = c > 1 ? void 0 : c ? _(i, a) : i, l = t.length - 1, h; l >= 0; l--)
+    (h = t[l]) && (n = (c ? h(i, a, n) : h(n)) || n);
+  return c && n && b(i, a, n), n;
 };
 const y = m("hx-clinical-status");
-let i = class extends g {
+let s = class extends g {
   constructor() {
     super(...arguments), this._elInternals = this.attachInternals(), this.severity = "info", this.message = "", this.dismissible = !1, this.persistent = !1, this.icon = "", this.compact = !1, this._hasSlottedContent = !1, this._acknowledged = !1, this._componentId = y(), this._persistentExplicitlySet = !1;
   }
@@ -293,8 +316,8 @@ let i = class extends g {
   connectedCallback() {
     super.connectedCallback(), this._elInternals.role = this._role;
   }
-  attributeChangedCallback(t, s, a) {
-    super.attributeChangedCallback(t, s, a), t === "persistent" && (this._persistentExplicitlySet = a !== null);
+  attributeChangedCallback(t, i, a) {
+    super.attributeChangedCallback(t, i, a), t === "persistent" && (this._persistentExplicitlySet = a !== null);
   }
   updated(t) {
     super.updated(t), t.has("severity") && (this._elInternals.role = this._role);
@@ -357,8 +380,8 @@ let i = class extends g {
   // ─── Slot Change Handling ───
   /** @internal */
   _handleSlotChange(t) {
-    const s = t.target;
-    this._hasSlottedContent = s.assignedNodes({ flatten: !0 }).length > 0;
+    const i = t.target;
+    this._hasSlottedContent = i.assignedNodes({ flatten: !0 }).length > 0;
   }
   // ─── Event Handling ───
   /** @internal */
@@ -389,10 +412,10 @@ let i = class extends g {
       "clinical-status": !0,
       [`clinical-status--${this.severity}`]: !0,
       "clinical-status--compact": this.compact
-    }, s = this._severityLabel(), a = `${this._componentId}-message`;
+    }, i = this._severityLabel(), a = `${this._componentId}-message`;
     return e`
       <div part="container" class=${u(t)} aria-labelledby=${a}>
-        <span class="clinical-status__severity-label">${s}</span>
+        <span class="clinical-status__severity-label">${i}</span>
 
         <div part="icon" class="clinical-status__icon">
           ${this.icon ? e`<span class="clinical-status__custom-icon">${this.icon}</span>` : this._renderDefaultIcon()}
@@ -436,35 +459,35 @@ let i = class extends g {
     `;
   }
 };
-i.styles = [f];
+s.styles = [f];
 r([
   o({ type: String, reflect: !0 })
-], i.prototype, "severity", 2);
+], s.prototype, "severity", 2);
 r([
   o({ type: String })
-], i.prototype, "message", 2);
+], s.prototype, "message", 2);
 r([
   o({ type: Boolean, reflect: !0 })
-], i.prototype, "dismissible", 2);
+], s.prototype, "dismissible", 2);
 r([
   o({ type: Boolean, reflect: !0 })
-], i.prototype, "persistent", 2);
+], s.prototype, "persistent", 2);
 r([
   o({ type: String })
-], i.prototype, "icon", 2);
+], s.prototype, "icon", 2);
 r([
   o({ type: Boolean, reflect: !0 })
-], i.prototype, "compact", 2);
+], s.prototype, "compact", 2);
 r([
-  p()
-], i.prototype, "_hasSlottedContent", 2);
+  v()
+], s.prototype, "_hasSlottedContent", 2);
 r([
-  p()
-], i.prototype, "_acknowledged", 2);
-i = r([
+  v()
+], s.prototype, "_acknowledged", 2);
+s = r([
   x("hx-clinical-status")
-], i);
+], s);
 export {
-  i as H
+  s as H
 };
-//# sourceMappingURL=hx-clinical-status-BjtT5c0M.js.map
+//# sourceMappingURL=hx-clinical-status-dDyk5oj1.js.map