@helixui/library 0.3.0 → 0.3.2

package/custom-elements.json

@@ -507,11 +507,19 @@
               "type": {
                 "text": "boolean"
               },
-              "default": "false",
               "deprecated": "Use `position=\"sticky\"` instead.\nWhen true, the bar sticks to the top of its scroll container.",
               "attribute": "sticky",
               "reflects": true
             },
+            {
+              "kind": "field",
+              "name": "_sticky",
+              "type": {
+                "text": "boolean"
+              },
+              "privacy": "private",
+              "default": "false"
+            },
             {
               "kind": "field",
               "name": "ariaLabel",
@@ -659,7 +667,6 @@
               "type": {
                 "text": "boolean"
               },
-              "default": "false",
               "deprecated": "Use `position=\"sticky\"` instead.\nWhen true, the bar sticks to the top of its scroll container.",
               "fieldName": "sticky",
               "attribute": "sticky"
@@ -1824,363 +1831,241 @@
             "name": "HelixBadge",
             "module": "./hx-badge.js"
           }
+        },
+        {
+          "kind": "js",
+          "name": "HxBadge",
+          "declaration": {
+            "name": "HxBadge",
+            "module": "./hx-badge.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "WcBadge",
+          "declaration": {
+            "name": "WcBadge",
+            "module": "./hx-badge.js"
+          }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/components/hx-breadcrumb/hx-breadcrumb-item.ts",
+      "path": "src/components/hx-button/hx-button.ts",
       "declarations": [
         {
           "kind": "class",
-          "description": "A single breadcrumb navigation item.",
-          "name": "HelixBreadcrumbItem",
+          "description": "A production-grade button component for user interaction. Supports multiple\nvisual variants, sizes, loading state, prefix/suffix slots, anchor rendering,\nand full ElementInternals form association.",
+          "name": "HelixButton",
           "cssProperties": [
             {
-              "description": "Link text color.",
-              "name": "--hx-breadcrumb-link-color",
-              "default": "var(--hx-color-primary-600)"
+              "description": "Button background color.",
+              "name": "--hx-button-bg",
+              "default": "var(--hx-color-primary-500)"
             },
             {
-              "description": "Link hover text color.",
-              "name": "--hx-breadcrumb-link-hover-color",
-              "default": "var(--hx-color-primary-700)"
+              "description": "Button text color.",
+              "name": "--hx-button-color",
+              "default": "var(--hx-color-neutral-0)"
             },
             {
-              "description": "Current page text color.",
-              "name": "--hx-breadcrumb-text-color",
-              "default": "var(--hx-color-neutral-700)"
+              "description": "Button border color.",
+              "name": "--hx-button-border-color",
+              "default": "transparent"
             },
             {
-              "description": "Separator character displayed after non-last items.",
-              "name": "--hx-breadcrumb-separator-content",
-              "default": "'/'"
+              "description": "Button border radius.",
+              "name": "--hx-button-border-radius",
+              "default": "var(--hx-border-radius-md)"
             },
             {
-              "description": "Separator color.",
-              "name": "--hx-breadcrumb-separator-color",
-              "default": "var(--hx-color-neutral-400)"
+              "description": "Button font family.",
+              "name": "--hx-button-font-family",
+              "default": "var(--hx-font-family-sans)"
             },
             {
-              "description": "Horizontal margin around separator.",
-              "name": "--hx-breadcrumb-separator-gap",
-              "default": "var(--hx-space-1)"
+              "description": "Button font weight.",
+              "name": "--hx-button-font-weight",
+              "default": "var(--hx-font-weight-semibold)"
             },
             {
-              "description": "Optional max-width for text truncation.",
-              "name": "--hx-breadcrumb-item-max-width"
+              "description": "Focus ring color.",
+              "name": "--hx-button-focus-ring-color",
+              "default": "var(--hx-focus-ring-color)"
             }
           ],
           "cssParts": [
             {
-              "description": "Wrapper around the link or text content.",
-              "name": "item"
+              "description": "The native button or anchor element.",
+              "name": "button"
             },
             {
-              "description": "The anchor element when href is provided (non-current items only).",
-              "name": "link"
+              "description": "The label text wrapper span.",
+              "name": "label"
             },
             {
-              "description": "The span element for the current page or items without href.",
-              "name": "text"
+              "description": "The prefix slot container span.",
+              "name": "prefix"
             },
             {
-              "description": "The separator element rendered after non-last items.",
-              "name": "separator"
+              "description": "The suffix slot container span.",
+              "name": "suffix"
+            },
+            {
+              "description": "The loading spinner SVG element.",
+              "name": "spinner"
             }
           ],
           "slots": [
             {
-              "description": "The link or page text content. Accepts text, HTML, or icon elements.",
+              "description": "Default slot for button label text or content.",
               "name": ""
+            },
+            {
+              "description": "Icon or content rendered before the label.",
+              "name": "prefix"
+            },
+            {
+              "description": "Icon or content rendered after the label.",
+              "name": "suffix"
             }
           ],
           "members": [
             {
               "kind": "field",
-              "name": "href",
+              "name": "formAssociated",
               "type": {
-                "text": "string | undefined"
+                "text": "boolean"
               },
-              "default": "undefined",
-              "description": "The URL for this breadcrumb link. Omit for the current page item.\nWhen `current` is true, this attribute is ignored and the item always\nrenders as static text per WAI-ARIA APG breadcrumb guidance.",
-              "attribute": "href",
-              "reflects": true
+              "static": true,
+              "default": "true"
             },
             {
               "kind": "field",
-              "name": "current",
+              "name": "_internals",
               "type": {
-                "text": "boolean"
+                "text": "ElementInternals"
               },
-              "default": "false",
-              "description": "Marks this item as the current page. When set, the item always renders as\nstatic text (never a navigable link) and `aria-current=\"page\"` is placed on\nthe inner text element per WAI-ARIA APG breadcrumb guidance, yielding the\ncanonical AT announcement (\"current page, Patient Records\").\n\nCan be set explicitly by consumers (e.g. Drupal Twig templates) to override\nthe default positional last-item detection in `hx-breadcrumb`. When any item\nin the breadcrumb has an explicit `current` attribute, the parent will not\noverride it.",
-              "attribute": "current",
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "variant",
+              "type": {
+                "text": "'primary' | 'secondary' | 'tertiary' | 'danger' | 'ghost' | 'outline'"
+              },
+              "default": "'primary'",
+              "description": "Visual style variant of the button.",
+              "attribute": "variant",
               "reflects": true
-            }
-          ],
-          "attributes": [
+            },
             {
-              "name": "href",
+              "kind": "field",
+              "name": "size",
               "type": {
-                "text": "string | undefined"
+                "text": "'sm' | 'md' | 'lg'"
               },
-              "default": "undefined",
-              "description": "The URL for this breadcrumb link. Omit for the current page item.\nWhen `current` is true, this attribute is ignored and the item always\nrenders as static text per WAI-ARIA APG breadcrumb guidance.",
-              "fieldName": "href",
-              "attribute": "href"
+              "default": "'md'",
+              "description": "Size of the button.",
+              "attribute": "hx-size",
+              "reflects": true
             },
             {
-              "name": "current",
+              "kind": "field",
+              "name": "disabled",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Marks this item as the current page. When set, the item always renders as\nstatic text (never a navigable link) and `aria-current=\"page\"` is placed on\nthe inner text element per WAI-ARIA APG breadcrumb guidance, yielding the\ncanonical AT announcement (\"current page, Patient Records\").\n\nCan be set explicitly by consumers (e.g. Drupal Twig templates) to override\nthe default positional last-item detection in `hx-breadcrumb`. When any item\nin the breadcrumb has an explicit `current` attribute, the parent will not\noverride it.",
-              "fieldName": "current",
-              "attribute": "current"
-            }
-          ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "tagName": "hx-breadcrumb-item",
-          "customElement": true,
-          "summary": "A navigation item within an hx-breadcrumb component. Renders as a link when `href` is\nprovided, or as static text for the current page item. The current page item is determined by\nthe `current` attribute (set explicitly or automatically by the parent `hx-breadcrumb`)."
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "HelixBreadcrumbItem",
-          "declaration": {
-            "name": "HelixBreadcrumbItem",
-            "module": "src/components/hx-breadcrumb/hx-breadcrumb-item.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "hx-breadcrumb-item",
-          "declaration": {
-            "name": "HelixBreadcrumbItem",
-            "module": "src/components/hx-breadcrumb/hx-breadcrumb-item.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/components/hx-breadcrumb/hx-breadcrumb.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "Hierarchical page path navigation showing current location in site structure.",
-          "name": "HelixBreadcrumb",
-          "cssProperties": [
+              "description": "Whether the button is disabled. Prevents all interaction and form actions.",
+              "attribute": "disabled",
+              "reflects": true
+            },
             {
-              "description": "Separator character between items. NOTE: If overriding this custom property directly in CSS (rather than via the `separator` attribute), the value MUST be quoted: `--hx-breadcrumb-separator-content: \">\"`. An unquoted value is invalid for the CSS `content` property and will silently render nothing.",
-              "name": "--hx-breadcrumb-separator-content",
-              "default": "'/'"
+              "kind": "field",
+              "name": "loading",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Whether the button is in a loading state. Shows spinner, prevents interaction,\nand sets aria-busy. Does not set the disabled attribute.",
+              "attribute": "loading",
+              "reflects": true
             },
             {
-              "description": "Separator color.",
-              "name": "--hx-breadcrumb-separator-color",
-              "default": "var(--hx-color-neutral-400)"
+              "kind": "field",
+              "name": "type",
+              "type": {
+                "text": "'button' | 'submit' | 'reset'"
+              },
+              "default": "'button'",
+              "description": "The type attribute for the underlying button element. Ignored when href is set.",
+              "attribute": "type"
             },
             {
-              "description": "Horizontal gap around separators.",
-              "name": "--hx-breadcrumb-separator-gap",
-              "default": "var(--hx-space-1)"
+              "kind": "field",
+              "name": "href",
+              "type": {
+                "text": "string | undefined"
+              },
+              "default": "undefined",
+              "description": "When set, renders an anchor element instead of a button.",
+              "attribute": "href"
             },
             {
-              "description": "Font size.",
-              "name": "--hx-breadcrumb-font-size",
-              "default": "var(--hx-font-size-sm)"
+              "kind": "field",
+              "name": "target",
+              "type": {
+                "text": "string | undefined"
+              },
+              "default": "undefined",
+              "description": "Anchor target attribute. Only used when href is set.",
+              "attribute": "target"
             },
             {
-              "description": "Link color.",
-              "name": "--hx-breadcrumb-link-color",
-              "default": "var(--hx-color-primary-600)"
+              "kind": "field",
+              "name": "name",
+              "type": {
+                "text": "string | undefined"
+              },
+              "default": "undefined",
+              "description": "Form field name submitted via ElementInternals.setFormValue on submit.",
+              "attribute": "name"
             },
             {
-              "description": "Link hover color.",
-              "name": "--hx-breadcrumb-link-hover-color",
-              "default": "var(--hx-color-primary-700)"
+              "kind": "field",
+              "name": "value",
+              "type": {
+                "text": "string | undefined"
+              },
+              "default": "undefined",
+              "description": "Form field value submitted via ElementInternals.setFormValue on submit.",
+              "attribute": "value"
             },
-            {
-              "description": "Current page text color.",
-              "name": "--hx-breadcrumb-text-color",
-              "default": "var(--hx-color-neutral-700)"
-            },
-            {
-              "description": "Max-width for item text truncation (e.g. `12rem`).",
-              "name": "--hx-breadcrumb-item-max-width"
-            }
-          ],
-          "cssParts": [
-            {
-              "description": "The nav landmark element.",
-              "name": "nav"
-            },
-            {
-              "description": "The ordered list containing items.",
-              "name": "list"
-            }
-          ],
-          "slots": [
-            {
-              "description": "Default slot for hx-breadcrumb-item children.",
-              "name": ""
-            },
-            {
-              "description": "Optional separator element. Its text content overrides the `separator` property.",
-              "name": "separator"
-            }
-          ],
-          "members": [
             {
               "kind": "field",
-              "name": "_instanceCounter",
-              "type": {
-                "text": "number"
-              },
-              "privacy": "private",
-              "static": true,
-              "default": "0",
-              "description": "Per-instance counter used to generate stable, deterministic IDs for the\ninjected JSON-LD script tags. Deterministic IDs (vs Math.random()) allow\nSSR frameworks to match server-rendered script tags during hydration."
-            },
-            {
-              "kind": "field",
-              "name": "separator",
-              "type": {
-                "text": "string"
-              },
-              "default": "'/'",
-              "description": "The separator character displayed between breadcrumb items.",
-              "attribute": "separator"
-            },
-            {
-              "kind": "field",
-              "name": "label",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Breadcrumb'",
-              "description": "The accessible label for the nav landmark.",
-              "attribute": "label"
-            },
-            {
-              "kind": "field",
-              "name": "maxItems",
-              "type": {
-                "text": "number"
-              },
-              "default": "0",
-              "description": "Maximum number of items to show before collapsing middle items with an ellipsis.\nSet to 0 (default) to show all items. The ellipsis is a keyboard-accessible\nbutton; activating it expands the full breadcrumb by setting maxItems to 0.",
-              "attribute": "max-items"
-            },
-            {
-              "kind": "field",
-              "name": "jsonLd",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "When true, injects a JSON-LD BreadcrumbList structured data script into the document head.\n\nNOTE: Drupal manages `<head>` content via its own render pipeline. Injecting a\n`<script>` directly via `document.head.appendChild()` in a Drupal context:\n1. Bypasses Drupal's deduplication and `hook_html_head_alter()` hook.\n2. Is not cacheable by Drupal's page cache.\n3. Will be wiped on BigPipe partial page replacements.\n\nFor Drupal integrations, leave `json-ld` false and use the structured data\nTwig template instead (see `hx-breadcrumb.twig` in the component directory).",
-              "attribute": "json-ld"
-            },
-            {
-              "kind": "field",
-              "name": "_ellipsisItem",
-              "type": {
-                "text": "Element | null"
-              },
-              "privacy": "private",
-              "default": "null"
-            },
-            {
-              "kind": "field",
-              "name": "_jsonLdScript",
-              "type": {
-                "text": "HTMLScriptElement | null"
-              },
-              "privacy": "private",
-              "default": "null"
-            },
-            {
-              "kind": "field",
-              "name": "_boundEllipsisClick",
+              "name": "ariaLabel",
               "type": {
-                "text": "(e: Event) => void"
+                "text": "string | null"
               },
-              "privacy": "private"
+              "default": "null",
+              "description": "Accessible label forwarded to the inner button/anchor. Required for icon-only usage.",
+              "attribute": "aria-label",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "_boundEllipsisKeydown",
+              "name": "form",
               "type": {
-                "text": "(e: KeyboardEvent) => void"
-              },
-              "privacy": "private"
-            },
-            {
-              "kind": "field",
-              "name": "_managedCurrentItems",
-              "privacy": "private",
-              "readonly": true,
-              "default": "new WeakSet<Element>()",
-              "description": "Tracks which items had their `current` attribute set by this component\n(as opposed to set by a consumer/Drupal template). This lets us re-evaluate\npositional current-page detection on each slotchange without incorrectly\ntreating a previously component-set `current` attribute as a consumer-set\nexplicit override."
-            },
-            {
-              "kind": "field",
-              "name": "_jsonLdId",
-              "privacy": "private",
-              "readonly": true,
-              "default": "`hx-breadcrumb-ld-${++HelixBreadcrumb._instanceCounter}`",
-              "description": "Stable per-instance ID used to tag the injected script element so that\nmultiple hx-breadcrumb instances on the same page don't produce conflicting\nor duplicate structured-data blocks. Each instance owns exactly one script\ntag identified by this ID; any stale tag from a previous render cycle is\nremoved before a new one is inserted.\n\nUses a static counter (not Math.random()) so IDs are deterministic across\nserver and client renders, enabling SSR hydration matching."
-            },
-            {
-              "kind": "method",
-              "name": "_getBreadcrumbItems",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "Element[]"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "slot",
-                  "type": {
-                    "text": "HTMLSlotElement"
-                  }
-                }
-              ],
-              "description": "Returns only real breadcrumb items, excluding the managed ellipsis element."
-            },
-            {
-              "kind": "method",
-              "name": "_applyItemAttributes",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
+                "text": "HTMLFormElement | null"
               },
-              "parameters": [
-                {
-                  "name": "items",
-                  "type": {
-                    "text": "Element[]"
-                  }
-                }
-              ],
-              "description": "Applies aria/state attributes to the item list.\n\nCurrent-page detection: if any item has an explicit `current` attribute\n(e.g. set by a Drupal Twig template), that item is treated as the current\npage. Otherwise the last item is the current page (default behaviour).\n\nThis separation allows Drupal to control current-page marking without\nrelying on item order."
+              "description": "Returns the associated form element, if any.",
+              "readonly": true
             },
             {
               "kind": "method",
-              "name": "_handleSlotChange",
+              "name": "_handleClick",
               "privacy": "private",
               "return": {
                 "type": {
@@ -2191,479 +2076,479 @@
                 {
                   "name": "e",
                   "type": {
-                    "text": "Event"
+                    "text": "MouseEvent"
                   }
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "_handleSeparatorSlotChange",
+              "name": "_renderSpinner",
               "privacy": "private",
               "return": {
                 "type": {
-                  "text": "void"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "e",
-                  "type": {
-                    "text": "Event"
-                  }
+                  "text": "TemplateResult"
                 }
-              ]
+              }
             },
             {
               "kind": "method",
-              "name": "_applyCollapse",
+              "name": "_renderInner",
               "privacy": "private",
               "return": {
                 "type": {
-                  "text": "void"
+                  "text": "TemplateResult"
                 }
+              }
+            }
+          ],
+          "events": [
+            {
+              "name": "hx-click",
+              "type": {
+                "text": "CustomEvent<{originalEvent: MouseEvent}>"
               },
-              "parameters": [
-                {
-                  "name": "items",
-                  "type": {
-                    "text": "Element[]"
-                  }
-                }
-              ]
-            },
+              "description": "Dispatched when the button is clicked and is neither disabled nor loading."
+            }
+          ],
+          "attributes": [
             {
-              "kind": "method",
-              "name": "_removeCollapse",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
+              "name": "variant",
+              "type": {
+                "text": "'primary' | 'secondary' | 'tertiary' | 'danger' | 'ghost' | 'outline'"
               },
-              "parameters": [
-                {
-                  "name": "items",
-                  "type": {
-                    "text": "Element[]"
-                  }
-                }
-              ]
+              "default": "'primary'",
+              "description": "Visual style variant of the button.",
+              "fieldName": "variant",
+              "attribute": "variant"
             },
             {
-              "kind": "method",
-              "name": "_handleEllipsisClick",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
+              "name": "hx-size",
+              "type": {
+                "text": "'sm' | 'md' | 'lg'"
               },
-              "parameters": [
-                {
-                  "name": "e",
-                  "type": {
-                    "text": "Event"
-                  }
-                }
-              ]
+              "default": "'md'",
+              "description": "Size of the button.",
+              "fieldName": "size",
+              "attribute": "hx-size"
             },
             {
-              "kind": "method",
-              "name": "_handleEllipsisKeydown",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
               },
-              "parameters": [
-                {
-                  "name": "e",
-                  "type": {
-                    "text": "KeyboardEvent"
-                  }
-                }
-              ]
+              "default": "false",
+              "description": "Whether the button is disabled. Prevents all interaction and form actions.",
+              "fieldName": "disabled",
+              "attribute": "disabled"
             },
             {
-              "kind": "method",
-              "name": "_expandBreadcrumb",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
+              "name": "loading",
+              "type": {
+                "text": "boolean"
               },
-              "description": "Expands a collapsed breadcrumb by resetting maxItems to 0.\nCalled by the ellipsis expand button (click or Enter/Space)."
+              "default": "false",
+              "description": "Whether the button is in a loading state. Shows spinner, prevents interaction,\nand sets aria-busy. Does not set the disabled attribute.",
+              "fieldName": "loading",
+              "attribute": "loading"
             },
             {
-              "kind": "method",
-              "name": "_buildListItem",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "{ '@type': string; position: number; name: string; item?: string }"
-                }
+              "name": "type",
+              "type": {
+                "text": "'button' | 'submit' | 'reset'"
               },
-              "parameters": [
-                {
-                  "name": "item",
-                  "type": {
-                    "text": "Element"
-                  }
-                },
-                {
-                  "name": "position",
-                  "type": {
-                    "text": "number"
-                  }
-                }
-              ],
-              "description": "JSON-LD ListItem entry with typed fields to avoid Record<string, unknown>."
+              "default": "'button'",
+              "description": "The type attribute for the underlying button element. Ignored when href is set.",
+              "fieldName": "type",
+              "attribute": "type"
             },
             {
-              "kind": "method",
-              "name": "_updateJsonLd",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
+              "name": "href",
+              "type": {
+                "text": "string | undefined"
               },
-              "parameters": [
-                {
-                  "name": "items",
-                  "type": {
-                    "text": "Element[]"
-                  }
-                }
-              ]
+              "default": "undefined",
+              "description": "When set, renders an anchor element instead of a button.",
+              "fieldName": "href",
+              "attribute": "href"
             },
             {
-              "kind": "method",
-              "name": "_removeJsonLd",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              }
-            }
-          ],
-          "attributes": [
-            {
-              "name": "separator",
+              "name": "target",
               "type": {
-                "text": "string"
+                "text": "string | undefined"
               },
-              "default": "'/'",
-              "description": "The separator character displayed between breadcrumb items.",
-              "fieldName": "separator",
-              "attribute": "separator"
+              "default": "undefined",
+              "description": "Anchor target attribute. Only used when href is set.",
+              "fieldName": "target",
+              "attribute": "target"
             },
             {
-              "name": "label",
+              "name": "name",
               "type": {
-                "text": "string"
+                "text": "string | undefined"
               },
-              "default": "'Breadcrumb'",
-              "description": "The accessible label for the nav landmark.",
-              "fieldName": "label",
-              "attribute": "label"
+              "default": "undefined",
+              "description": "Form field name submitted via ElementInternals.setFormValue on submit.",
+              "fieldName": "name",
+              "attribute": "name"
             },
             {
-              "name": "max-items",
+              "name": "value",
               "type": {
-                "text": "number"
+                "text": "string | undefined"
               },
-              "default": "0",
-              "description": "Maximum number of items to show before collapsing middle items with an ellipsis.\nSet to 0 (default) to show all items. The ellipsis is a keyboard-accessible\nbutton; activating it expands the full breadcrumb by setting maxItems to 0.",
-              "fieldName": "maxItems",
-              "attribute": "max-items"
+              "default": "undefined",
+              "description": "Form field value submitted via ElementInternals.setFormValue on submit.",
+              "fieldName": "value",
+              "attribute": "value"
             },
             {
-              "name": "json-ld",
+              "name": "aria-label",
               "type": {
-                "text": "boolean"
+                "text": "string | null"
               },
-              "default": "false",
-              "description": "When true, injects a JSON-LD BreadcrumbList structured data script into the document head.\n\nNOTE: Drupal manages `<head>` content via its own render pipeline. Injecting a\n`<script>` directly via `document.head.appendChild()` in a Drupal context:\n1. Bypasses Drupal's deduplication and `hook_html_head_alter()` hook.\n2. Is not cacheable by Drupal's page cache.\n3. Will be wiped on BigPipe partial page replacements.\n\nFor Drupal integrations, leave `json-ld` false and use the structured data\nTwig template instead (see `hx-breadcrumb.twig` in the component directory).",
-              "fieldName": "jsonLd",
-              "attribute": "json-ld"
+              "default": "null",
+              "description": "Accessible label forwarded to the inner button/anchor. Required for icon-only usage.",
+              "fieldName": "ariaLabel",
+              "attribute": "aria-label"
             }
           ],
           "superclass": {
             "name": "LitElement",
             "package": "lit"
           },
-          "tagName": "hx-breadcrumb",
+          "tagName": "hx-button",
           "customElement": true,
-          "summary": "Navigation breadcrumb showing the page hierarchy. Works with Drupal's breadcrumb system."
-        },
-        {
-          "kind": "variable",
-          "name": "name"
+          "summary": "Primary interactive element for triggering actions and form submission."
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "HelixBreadcrumb",
+          "name": "HelixButton",
           "declaration": {
-            "name": "HelixBreadcrumb",
-            "module": "src/components/hx-breadcrumb/hx-breadcrumb.ts"
+            "name": "HelixButton",
+            "module": "src/components/hx-button/hx-button.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "hx-breadcrumb",
+          "name": "hx-button",
           "declaration": {
-            "name": "HelixBreadcrumb",
-            "module": "src/components/hx-breadcrumb/hx-breadcrumb.ts"
+            "name": "HelixButton",
+            "module": "src/components/hx-button/hx-button.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/components/hx-breadcrumb/index.ts",
+      "path": "src/components/hx-button/index.ts",
       "declarations": [],
       "exports": [
         {
           "kind": "js",
-          "name": "HelixBreadcrumb",
-          "declaration": {
-            "name": "HelixBreadcrumb",
-            "module": "./hx-breadcrumb.js"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "HelixBreadcrumbItem",
+          "name": "HelixButton",
           "declaration": {
-            "name": "HelixBreadcrumbItem",
-            "module": "./hx-breadcrumb-item.js"
+            "name": "HelixButton",
+            "module": "./hx-button.js"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/components/hx-button/hx-button.ts",
+      "path": "src/components/hx-breadcrumb/hx-breadcrumb-item.ts",
       "declarations": [
         {
           "kind": "class",
-          "description": "A production-grade button component for user interaction. Supports multiple\nvisual variants, sizes, loading state, prefix/suffix slots, anchor rendering,\nand full ElementInternals form association.",
-          "name": "HelixButton",
+          "description": "A single breadcrumb navigation item.",
+          "name": "HelixBreadcrumbItem",
           "cssProperties": [
             {
-              "description": "Button background color.",
-              "name": "--hx-button-bg",
-              "default": "var(--hx-color-primary-500)"
+              "description": "Link text color.",
+              "name": "--hx-breadcrumb-link-color",
+              "default": "var(--hx-color-primary-600)"
             },
             {
-              "description": "Button text color.",
-              "name": "--hx-button-color",
-              "default": "var(--hx-color-neutral-0)"
+              "description": "Link hover text color.",
+              "name": "--hx-breadcrumb-link-hover-color",
+              "default": "var(--hx-color-primary-700)"
             },
             {
-              "description": "Button border color.",
-              "name": "--hx-button-border-color",
-              "default": "transparent"
+              "description": "Current page text color.",
+              "name": "--hx-breadcrumb-text-color",
+              "default": "var(--hx-color-neutral-700)"
             },
             {
-              "description": "Button border radius.",
-              "name": "--hx-button-border-radius",
-              "default": "var(--hx-border-radius-md)"
+              "description": "Separator character displayed after non-last items.",
+              "name": "--hx-breadcrumb-separator-content",
+              "default": "'/'"
             },
             {
-              "description": "Button font family.",
-              "name": "--hx-button-font-family",
-              "default": "var(--hx-font-family-sans)"
+              "description": "Separator color.",
+              "name": "--hx-breadcrumb-separator-color",
+              "default": "var(--hx-color-neutral-400)"
             },
             {
-              "description": "Button font weight.",
-              "name": "--hx-button-font-weight",
-              "default": "var(--hx-font-weight-semibold)"
+              "description": "Horizontal margin around separator.",
+              "name": "--hx-breadcrumb-separator-gap",
+              "default": "var(--hx-space-1)"
             },
             {
-              "description": "Focus ring color.",
-              "name": "--hx-button-focus-ring-color",
-              "default": "var(--hx-focus-ring-color)"
+              "description": "Optional max-width for text truncation.",
+              "name": "--hx-breadcrumb-item-max-width"
             }
           ],
           "cssParts": [
             {
-              "description": "The native button or anchor element.",
-              "name": "button"
-            },
-            {
-              "description": "The label text wrapper span.",
-              "name": "label"
+              "description": "Wrapper around the link or text content.",
+              "name": "item"
             },
             {
-              "description": "The prefix slot container span.",
-              "name": "prefix"
+              "description": "The anchor element when href is provided (non-current items only).",
+              "name": "link"
             },
             {
-              "description": "The suffix slot container span.",
-              "name": "suffix"
+              "description": "The span element for the current page or items without href.",
+              "name": "text"
             },
             {
-              "description": "The loading spinner SVG element.",
-              "name": "spinner"
+              "description": "The separator element rendered after non-last items.",
+              "name": "separator"
             }
           ],
           "slots": [
             {
-              "description": "Default slot for button label text or content.",
+              "description": "The link or page text content. Accepts text, HTML, or icon elements.",
               "name": ""
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "href",
+              "type": {
+                "text": "string | undefined"
+              },
+              "default": "undefined",
+              "description": "The URL for this breadcrumb link. Omit for the current page item.\nWhen `current` is true, this attribute is ignored and the item always\nrenders as static text per WAI-ARIA APG breadcrumb guidance.",
+              "attribute": "href",
+              "reflects": true
             },
             {
-              "description": "Icon or content rendered before the label.",
-              "name": "prefix"
+              "kind": "field",
+              "name": "current",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Marks this item as the current page. When set, the item always renders as\nstatic text (never a navigable link) and `aria-current=\"page\"` is placed on\nthe inner text element per WAI-ARIA APG breadcrumb guidance, yielding the\ncanonical AT announcement (\"current page, Patient Records\").\n\nCan be set explicitly by consumers (e.g. Drupal Twig templates) to override\nthe default positional last-item detection in `hx-breadcrumb`. When any item\nin the breadcrumb has an explicit `current` attribute, the parent will not\noverride it.",
+              "attribute": "current",
+              "reflects": true
+            }
+          ],
+          "attributes": [
+            {
+              "name": "href",
+              "type": {
+                "text": "string | undefined"
+              },
+              "default": "undefined",
+              "description": "The URL for this breadcrumb link. Omit for the current page item.\nWhen `current` is true, this attribute is ignored and the item always\nrenders as static text per WAI-ARIA APG breadcrumb guidance.",
+              "fieldName": "href",
+              "attribute": "href"
             },
             {
-              "description": "Icon or content rendered after the label.",
-              "name": "suffix"
+              "name": "current",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Marks this item as the current page. When set, the item always renders as\nstatic text (never a navigable link) and `aria-current=\"page\"` is placed on\nthe inner text element per WAI-ARIA APG breadcrumb guidance, yielding the\ncanonical AT announcement (\"current page, Patient Records\").\n\nCan be set explicitly by consumers (e.g. Drupal Twig templates) to override\nthe default positional last-item detection in `hx-breadcrumb`. When any item\nin the breadcrumb has an explicit `current` attribute, the parent will not\noverride it.",
+              "fieldName": "current",
+              "attribute": "current"
             }
           ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "hx-breadcrumb-item",
+          "customElement": true,
+          "summary": "A navigation item within an hx-breadcrumb component. Renders as a link when `href` is\nprovided, or as static text for the current page item. The current page item is determined by\nthe `current` attribute (set explicitly or automatically by the parent `hx-breadcrumb`)."
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "HelixBreadcrumbItem",
+          "declaration": {
+            "name": "HelixBreadcrumbItem",
+            "module": "src/components/hx-breadcrumb/hx-breadcrumb-item.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "hx-breadcrumb-item",
+          "declaration": {
+            "name": "HelixBreadcrumbItem",
+            "module": "src/components/hx-breadcrumb/hx-breadcrumb-item.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/components/hx-breadcrumb/hx-breadcrumb.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "HelixBreadcrumb",
           "members": [
             {
               "kind": "field",
-              "name": "formAssociated",
+              "name": "_instanceCounter",
               "type": {
-                "text": "boolean"
+                "text": "number"
               },
+              "privacy": "private",
               "static": true,
-              "default": "true"
+              "default": "0",
+              "description": "Per-instance counter used to generate stable, deterministic IDs for the\ninjected JSON-LD script tags. Deterministic IDs (vs Math.random()) allow\nSSR frameworks to match server-rendered script tags during hydration."
             },
             {
               "kind": "field",
-              "name": "_internals",
+              "name": "separator",
               "type": {
-                "text": "ElementInternals"
+                "text": "string"
               },
-              "privacy": "private"
+              "default": "'/'",
+              "description": "The separator character displayed between breadcrumb items.",
+              "attribute": "separator"
             },
             {
               "kind": "field",
-              "name": "variant",
+              "name": "label",
               "type": {
-                "text": "'primary' | 'secondary' | 'tertiary' | 'danger' | 'ghost' | 'outline'"
+                "text": "string"
               },
-              "default": "'primary'",
-              "description": "Visual style variant of the button.",
-              "attribute": "variant",
-              "reflects": true
+              "default": "'Breadcrumb'",
+              "description": "The accessible label for the nav landmark.",
+              "attribute": "label"
             },
             {
               "kind": "field",
-              "name": "size",
+              "name": "maxItems",
               "type": {
-                "text": "'sm' | 'md' | 'lg'"
+                "text": "number"
               },
-              "default": "'md'",
-              "description": "Size of the button.",
-              "attribute": "hx-size",
-              "reflects": true
+              "default": "0",
+              "description": "Maximum number of items to show before collapsing middle items with an ellipsis.\nSet to 0 (default) to show all items. The ellipsis is a keyboard-accessible\nbutton; activating it expands the full breadcrumb by setting maxItems to 0.",
+              "attribute": "max-items"
             },
             {
               "kind": "field",
-              "name": "disabled",
+              "name": "jsonLd",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Whether the button is disabled. Prevents all interaction and form actions.",
-              "attribute": "disabled",
-              "reflects": true
+              "description": "When true, injects a JSON-LD BreadcrumbList structured data script into the document head.\n\nNOTE: Drupal manages `<head>` content via its own render pipeline. Injecting a\n`<script>` directly via `document.head.appendChild()` in a Drupal context:\n1. Bypasses Drupal's deduplication and `hook_html_head_alter()` hook.\n2. Is not cacheable by Drupal's page cache.\n3. Will be wiped on BigPipe partial page replacements.\n\nFor Drupal integrations, leave `json-ld` false and use the structured data\nTwig template instead (see `hx-breadcrumb.twig` in the component directory).",
+              "attribute": "json-ld"
             },
             {
               "kind": "field",
-              "name": "loading",
+              "name": "_ellipsisItem",
               "type": {
-                "text": "boolean"
+                "text": "Element | null"
               },
-              "default": "false",
-              "description": "Whether the button is in a loading state. Shows spinner, prevents interaction,\nand sets aria-busy. Does not set the disabled attribute.",
-              "attribute": "loading",
-              "reflects": true
+              "privacy": "private",
+              "default": "null"
             },
             {
               "kind": "field",
-              "name": "type",
+              "name": "_jsonLdScript",
               "type": {
-                "text": "'button' | 'submit' | 'reset'"
+                "text": "HTMLScriptElement | null"
               },
-              "default": "'button'",
-              "description": "The type attribute for the underlying button element. Ignored when href is set.",
-              "attribute": "type"
+              "privacy": "private",
+              "default": "null"
             },
             {
               "kind": "field",
-              "name": "href",
+              "name": "_boundEllipsisClick",
               "type": {
-                "text": "string | undefined"
+                "text": "(e: Event) => void"
               },
-              "default": "undefined",
-              "description": "When set, renders an anchor element instead of a button.",
-              "attribute": "href"
+              "privacy": "private"
             },
             {
               "kind": "field",
-              "name": "target",
+              "name": "_boundEllipsisKeydown",
               "type": {
-                "text": "string | undefined"
+                "text": "(e: KeyboardEvent) => void"
               },
-              "default": "undefined",
-              "description": "Anchor target attribute. Only used when href is set.",
-              "attribute": "target"
+              "privacy": "private"
             },
             {
               "kind": "field",
-              "name": "name",
-              "type": {
-                "text": "string | undefined"
-              },
-              "default": "undefined",
-              "description": "Form field name submitted via ElementInternals.setFormValue on submit.",
-              "attribute": "name"
+              "name": "_managedCurrentItems",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new WeakSet<Element>()",
+              "description": "Tracks which items had their `current` attribute set by this component\n(as opposed to set by a consumer/Drupal template). This lets us re-evaluate\npositional current-page detection on each slotchange without incorrectly\ntreating a previously component-set `current` attribute as a consumer-set\nexplicit override."
             },
             {
               "kind": "field",
-              "name": "value",
-              "type": {
-                "text": "string | undefined"
-              },
-              "default": "undefined",
-              "description": "Form field value submitted via ElementInternals.setFormValue on submit.",
-              "attribute": "value"
+              "name": "_jsonLdId",
+              "privacy": "private",
+              "readonly": true,
+              "default": "`hx-breadcrumb-ld-${++HelixBreadcrumb._instanceCounter}`",
+              "description": "Stable per-instance ID used to tag the injected script element so that\nmultiple hx-breadcrumb instances on the same page don't produce conflicting\nor duplicate structured-data blocks. Each instance owns exactly one script\ntag identified by this ID; any stale tag from a previous render cycle is\nremoved before a new one is inserted.\n\nUses a static counter (not Math.random()) so IDs are deterministic across\nserver and client renders, enabling SSR hydration matching."
             },
             {
-              "kind": "field",
-              "name": "ariaLabel",
-              "type": {
-                "text": "string | null"
+              "kind": "method",
+              "name": "_getBreadcrumbItems",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "Element[]"
+                }
               },
-              "default": "null",
-              "description": "Accessible label forwarded to the inner button/anchor. Required for icon-only usage.",
-              "attribute": "aria-label",
-              "reflects": true
+              "parameters": [
+                {
+                  "name": "slot",
+                  "type": {
+                    "text": "HTMLSlotElement"
+                  }
+                }
+              ],
+              "description": "Returns only real breadcrumb items, excluding the managed ellipsis element."
             },
             {
-              "kind": "field",
-              "name": "form",
-              "type": {
-                "text": "HTMLFormElement | null"
+              "kind": "method",
+              "name": "_applyItemAttributes",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
               },
-              "description": "Returns the associated form element, if any.",
-              "readonly": true
+              "parameters": [
+                {
+                  "name": "items",
+                  "type": {
+                    "text": "Element[]"
+                  }
+                }
+              ],
+              "description": "Applies aria/state attributes to the item list.\n\nCurrent-page detection: if any item has an explicit `current` attribute\n(e.g. set by a Drupal Twig template), that item is treated as the current\npage. Otherwise the last item is the current page (default behaviour).\n\nThis separation allows Drupal to control current-page marking without\nrelying on item order."
             },
             {
               "kind": "method",
-              "name": "_handleClick",
+              "name": "_handleSlotChange",
               "privacy": "private",
               "return": {
                 "type": {
@@ -2674,182 +2559,258 @@
                 {
                   "name": "e",
                   "type": {
-                    "text": "MouseEvent"
+                    "text": "Event"
                   }
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "_renderSpinner",
+              "name": "_handleSeparatorSlotChange",
               "privacy": "private",
               "return": {
                 "type": {
-                  "text": "TemplateResult"
+                  "text": "void"
                 }
-              }
+              },
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ]
             },
             {
               "kind": "method",
-              "name": "_renderInner",
+              "name": "_applyCollapse",
               "privacy": "private",
               "return": {
                 "type": {
-                  "text": "TemplateResult"
+                  "text": "void"
                 }
-              }
-            }
-          ],
-          "events": [
-            {
-              "name": "hx-click",
-              "type": {
-                "text": "CustomEvent<{originalEvent: MouseEvent}>"
               },
-              "description": "Dispatched when the button is clicked and is neither disabled nor loading."
-            }
-          ],
-          "attributes": [
+              "parameters": [
+                {
+                  "name": "items",
+                  "type": {
+                    "text": "Element[]"
+                  }
+                }
+              ]
+            },
             {
-              "name": "variant",
-              "type": {
-                "text": "'primary' | 'secondary' | 'tertiary' | 'danger' | 'ghost' | 'outline'"
+              "kind": "method",
+              "name": "_removeCollapse",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
               },
-              "default": "'primary'",
-              "description": "Visual style variant of the button.",
-              "fieldName": "variant",
-              "attribute": "variant"
+              "parameters": [
+                {
+                  "name": "items",
+                  "type": {
+                    "text": "Element[]"
+                  }
+                }
+              ]
             },
             {
-              "name": "hx-size",
-              "type": {
-                "text": "'sm' | 'md' | 'lg'"
+              "kind": "method",
+              "name": "_handleEllipsisClick",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
               },
-              "default": "'md'",
-              "description": "Size of the button.",
-              "fieldName": "size",
-              "attribute": "hx-size"
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ]
             },
             {
-              "name": "disabled",
-              "type": {
-                "text": "boolean"
+              "kind": "method",
+              "name": "_handleEllipsisKeydown",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
               },
-              "default": "false",
-              "description": "Whether the button is disabled. Prevents all interaction and form actions.",
-              "fieldName": "disabled",
-              "attribute": "disabled"
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "KeyboardEvent"
+                  }
+                }
+              ]
             },
             {
-              "name": "loading",
-              "type": {
-                "text": "boolean"
+              "kind": "method",
+              "name": "_expandBreadcrumb",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
               },
-              "default": "false",
-              "description": "Whether the button is in a loading state. Shows spinner, prevents interaction,\nand sets aria-busy. Does not set the disabled attribute.",
-              "fieldName": "loading",
-              "attribute": "loading"
+              "description": "Expands a collapsed breadcrumb by resetting maxItems to 0.\nCalled by the ellipsis expand button (click or Enter/Space)."
             },
             {
-              "name": "type",
-              "type": {
-                "text": "'button' | 'submit' | 'reset'"
+              "kind": "method",
+              "name": "_buildListItem",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "JsonLdListItem"
+                }
               },
-              "default": "'button'",
-              "description": "The type attribute for the underlying button element. Ignored when href is set.",
-              "fieldName": "type",
-              "attribute": "type"
+              "parameters": [
+                {
+                  "name": "item",
+                  "type": {
+                    "text": "Element"
+                  }
+                },
+                {
+                  "name": "position",
+                  "type": {
+                    "text": "number"
+                  }
+                }
+              ],
+              "description": "JSON-LD ListItem entry with typed fields to avoid Record<string, unknown>."
             },
             {
-              "name": "href",
-              "type": {
-                "text": "string | undefined"
+              "kind": "method",
+              "name": "_updateJsonLd",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
               },
-              "default": "undefined",
-              "description": "When set, renders an anchor element instead of a button.",
-              "fieldName": "href",
-              "attribute": "href"
+              "parameters": [
+                {
+                  "name": "items",
+                  "type": {
+                    "text": "Element[]"
+                  }
+                }
+              ]
             },
             {
-              "name": "target",
+              "kind": "method",
+              "name": "_removeJsonLd",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
+            }
+          ],
+          "attributes": [
+            {
+              "name": "separator",
               "type": {
-                "text": "string | undefined"
-              },
-              "default": "undefined",
-              "description": "Anchor target attribute. Only used when href is set.",
-              "fieldName": "target",
-              "attribute": "target"
+                "text": "string"
+              },
+              "default": "'/'",
+              "description": "The separator character displayed between breadcrumb items.",
+              "fieldName": "separator",
+              "attribute": "separator"
             },
             {
-              "name": "name",
+              "name": "label",
               "type": {
-                "text": "string | undefined"
+                "text": "string"
               },
-              "default": "undefined",
-              "description": "Form field name submitted via ElementInternals.setFormValue on submit.",
-              "fieldName": "name",
-              "attribute": "name"
+              "default": "'Breadcrumb'",
+              "description": "The accessible label for the nav landmark.",
+              "fieldName": "label",
+              "attribute": "label"
             },
             {
-              "name": "value",
+              "name": "max-items",
               "type": {
-                "text": "string | undefined"
+                "text": "number"
               },
-              "default": "undefined",
-              "description": "Form field value submitted via ElementInternals.setFormValue on submit.",
-              "fieldName": "value",
-              "attribute": "value"
+              "default": "0",
+              "description": "Maximum number of items to show before collapsing middle items with an ellipsis.\nSet to 0 (default) to show all items. The ellipsis is a keyboard-accessible\nbutton; activating it expands the full breadcrumb by setting maxItems to 0.",
+              "fieldName": "maxItems",
+              "attribute": "max-items"
             },
             {
-              "name": "aria-label",
+              "name": "json-ld",
               "type": {
-                "text": "string | null"
+                "text": "boolean"
               },
-              "default": "null",
-              "description": "Accessible label forwarded to the inner button/anchor. Required for icon-only usage.",
-              "fieldName": "ariaLabel",
-              "attribute": "aria-label"
+              "default": "false",
+              "description": "When true, injects a JSON-LD BreadcrumbList structured data script into the document head.\n\nNOTE: Drupal manages `<head>` content via its own render pipeline. Injecting a\n`<script>` directly via `document.head.appendChild()` in a Drupal context:\n1. Bypasses Drupal's deduplication and `hook_html_head_alter()` hook.\n2. Is not cacheable by Drupal's page cache.\n3. Will be wiped on BigPipe partial page replacements.\n\nFor Drupal integrations, leave `json-ld` false and use the structured data\nTwig template instead (see `hx-breadcrumb.twig` in the component directory).",
+              "fieldName": "jsonLd",
+              "attribute": "json-ld"
             }
           ],
           "superclass": {
             "name": "LitElement",
             "package": "lit"
           },
-          "tagName": "hx-button",
-          "customElement": true,
-          "summary": "Primary interactive element for triggering actions and form submission."
+          "tagName": "hx-breadcrumb",
+          "customElement": true
+        },
+        {
+          "kind": "variable",
+          "name": "name"
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "HelixButton",
+          "name": "HelixBreadcrumb",
           "declaration": {
-            "name": "HelixButton",
-            "module": "src/components/hx-button/hx-button.ts"
+            "name": "HelixBreadcrumb",
+            "module": "src/components/hx-breadcrumb/hx-breadcrumb.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "hx-button",
+          "name": "hx-breadcrumb",
           "declaration": {
-            "name": "HelixButton",
-            "module": "src/components/hx-button/hx-button.ts"
+            "name": "HelixBreadcrumb",
+            "module": "src/components/hx-breadcrumb/hx-breadcrumb.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/components/hx-button/index.ts",
+      "path": "src/components/hx-breadcrumb/index.ts",
       "declarations": [],
       "exports": [
         {
           "kind": "js",
-          "name": "HelixButton",
+          "name": "HelixBreadcrumb",
           "declaration": {
-            "name": "HelixButton",
-            "module": "./hx-button.js"
+            "name": "HelixBreadcrumb",
+            "module": "./hx-breadcrumb.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "HelixBreadcrumbItem",
+          "declaration": {
+            "name": "HelixBreadcrumbItem",
+            "module": "./hx-breadcrumb-item.js"
           }
         }
       ]
@@ -2896,11 +2857,19 @@
               "type": {
                 "text": "'horizontal' | 'vertical'"
               },
-              "default": "'horizontal'",
               "description": "Layout orientation of the button group.",
               "attribute": "orientation",
               "reflects": true
             },
+            {
+              "kind": "field",
+              "name": "_orientation",
+              "type": {
+                "text": "'horizontal' | 'vertical'"
+              },
+              "privacy": "private",
+              "default": "'horizontal'"
+            },
             {
               "kind": "field",
               "name": "size",
@@ -2937,7 +2906,6 @@
               "type": {
                 "text": "'horizontal' | 'vertical'"
               },
-              "default": "'horizontal'",
               "description": "Layout orientation of the button group.",
               "fieldName": "orientation",
               "attribute": "orientation"
@@ -4990,11 +4958,19 @@
               "type": {
                 "text": "'vertical' | 'horizontal'"
               },
-              "default": "'vertical'",
               "description": "Layout orientation of the checkbox items.",
               "attribute": "orientation",
               "reflects": true
             },
+            {
+              "kind": "field",
+              "name": "_orientation",
+              "type": {
+                "text": "'vertical' | 'horizontal'"
+              },
+              "privacy": "private",
+              "default": "'vertical'"
+            },
             {
               "kind": "field",
               "name": "_hasErrorSlot",
@@ -5300,7 +5276,6 @@
               "type": {
                 "text": "'vertical' | 'horizontal'"
               },
-              "default": "'vertical'",
               "description": "Layout orientation of the checkbox items.",
               "fieldName": "orientation",
               "attribute": "orientation"
@@ -7516,7 +7491,7 @@
       "declarations": [
         {
           "kind": "class",
-          "description": "A layout container that constrains content width and provides\nconsistent vertical spacing and horizontal gutters.\n\nUses a two-layer model: the outer host spans full width (background,\nvertical padding), while the inner wrapper constrains max-width,\ncenters content, and applies horizontal gutters.",
+          "description": "A layout container that constrains content width and provides\nconsistent vertical spacing and horizontal gutters.\n\nUses a two-layer model: the outer host spans full width (background,\nvertical padding), while the inner wrapper constrains max-width,\ncenters content, and applies horizontal gutters.\n\n## Accessibility\n\n`hx-container` is a purely visual layout primitive with no semantic meaning.\nIt carries no ARIA role and is intentionally transparent to assistive\ntechnologies. Screen readers announce the container's children directly,\nnot the container itself.\n\nThe inner wrapper always centers content horizontally (via `margin: auto`).\nThis is by design for page-layout use cases. If you need non-centered\nalignment at a specific breakpoint, override `margin-left` and\n`margin-right` on `::part(inner)` from your stylesheet.",
           "name": "HelixContainer",
           "cssProperties": [
             {
@@ -7662,6 +7637,14 @@
             "name": "HelixContainer",
             "module": "./hx-container.js"
           }
+        },
+        {
+          "kind": "js",
+          "name": "WcContainer",
+          "declaration": {
+            "name": "WcContainer",
+            "module": "./hx-container.js"
+          }
         }
       ]
     },
@@ -7762,7 +7745,7 @@
                 "text": "'sm' | 'md' | 'lg'"
               },
               "default": "'md'",
-              "description": "Visual size of the button. Maps to fixed height and padding tokens.\nAccepts: 'sm' | 'md' | 'lg'. Invalid values are silently coerced to 'md'.",
+              "description": "Visual size of the button. Maps to fixed height and padding tokens.\nAccepts: 'sm' | 'md' | 'lg'. Invalid values are silently coerced to 'md'.\n\n**Accessibility (WCAG 2.5.8):** The `sm` variant uses `--hx-size-8` for\nits minimum width and height. Ensure this token resolves to at least 24×24 px\n(WCAG 2.5.8 AA minimum target size). For touch-primary interfaces such as\nmobile clinical apps, prefer `md` or `lg` to meet the 44×44 px recommended\ntarget size (WCAG 2.5.5 AAA / Apple HIG / Android guidelines).",
               "attribute": "hx-size",
               "reflects": true
             },
@@ -7933,7 +7916,7 @@
                 "text": "'sm' | 'md' | 'lg'"
               },
               "default": "'md'",
-              "description": "Visual size of the button. Maps to fixed height and padding tokens.\nAccepts: 'sm' | 'md' | 'lg'. Invalid values are silently coerced to 'md'.",
+              "description": "Visual size of the button. Maps to fixed height and padding tokens.\nAccepts: 'sm' | 'md' | 'lg'. Invalid values are silently coerced to 'md'.\n\n**Accessibility (WCAG 2.5.8):** The `sm` variant uses `--hx-size-8` for\nits minimum width and height. Ensure this token resolves to at least 24×24 px\n(WCAG 2.5.8 AA minimum target size). For touch-primary interfaces such as\nmobile clinical apps, prefer `md` or `lg` to meet the 44×44 px recommended\ntarget size (WCAG 2.5.5 AAA / Apple HIG / Android guidelines).",
               "fieldName": "size",
               "attribute": "hx-size"
             },
@@ -10328,7 +10311,7 @@
             },
             {
               "description": "The built-in close button.",
-              "name": "close-button"
+              "name": "close-btn"
             },
             {
               "description": "The scrollable body region.",
@@ -13870,455 +13853,793 @@
             "name": "LitElement",
             "package": "lit"
           },
-          "tagName": "hx-grid-item",
+          "tagName": "hx-grid-item",
+          "customElement": true,
+          "summary": "Grid item with explicit column/row placement."
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "HelixGrid",
+          "declaration": {
+            "name": "HelixGrid",
+            "module": "src/components/hx-grid/hx-grid.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "hx-grid",
+          "declaration": {
+            "name": "HelixGrid",
+            "module": "src/components/hx-grid/hx-grid.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "HelixGridItem",
+          "declaration": {
+            "name": "HelixGridItem",
+            "module": "src/components/hx-grid/hx-grid.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "hx-grid-item",
+          "declaration": {
+            "name": "HelixGridItem",
+            "module": "src/components/hx-grid/hx-grid.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/components/hx-grid/index.ts",
+      "declarations": [],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "HelixGrid",
+          "declaration": {
+            "name": "HelixGrid",
+            "module": "./hx-grid.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "HelixGridItem",
+          "declaration": {
+            "name": "HelixGridItem",
+            "module": "./hx-grid.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/components/hx-help-text/hx-help-text.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "Standardized help/hint text displayed below form fields.\nUsed by hx-field as a consistent sub-component for guidance and validation messages.\n\nNon-default variants render an inline icon alongside the text to satisfy\nWCAG 1.4.1 (color is not the sole visual indicator). The `error` variant\nuses `role=\"alert\"` for immediate screen-reader announcement; `warning`\nand `success` use `aria-live=\"polite\"` for non-intrusive announcements.",
+          "name": "HelixHelpText",
+          "cssProperties": [
+            {
+              "description": "Text color.",
+              "name": "--hx-help-text-color",
+              "default": "var(--hx-color-neutral-500)"
+            },
+            {
+              "description": "Font family.",
+              "name": "--hx-help-text-font-family",
+              "default": "var(--hx-font-family-sans)"
+            },
+            {
+              "description": "Font size.",
+              "name": "--hx-help-text-font-size",
+              "default": "var(--hx-font-size-sm)"
+            },
+            {
+              "description": "Font weight.",
+              "name": "--hx-help-text-font-weight",
+              "default": "var(--hx-font-weight-normal)"
+            },
+            {
+              "description": "Line height.",
+              "name": "--hx-help-text-line-height",
+              "default": "var(--hx-line-height-normal)"
+            },
+            {
+              "description": "Gap between icon and text.",
+              "name": "--hx-help-text-icon-gap",
+              "default": "0.375rem"
+            }
+          ],
+          "cssParts": [
+            {
+              "description": "The root element of the help text.",
+              "name": "base"
+            },
+            {
+              "description": "The icon wrapper (only rendered for non-default variants).",
+              "name": "icon"
+            },
+            {
+              "description": "The text wrapper around the default slot.",
+              "name": "text"
+            }
+          ],
+          "slots": [
+            {
+              "description": "The help text content.",
+              "name": ""
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "variant",
+              "type": {
+                "text": "'default' | 'error' | 'warning' | 'success'"
+              },
+              "default": "'default'",
+              "description": "Visual variant that determines the text color and icon.\nUse `error` for validation errors, `warning` for cautions, `success` for confirmation.",
+              "attribute": "variant",
+              "reflects": true
+            }
+          ],
+          "attributes": [
+            {
+              "name": "variant",
+              "type": {
+                "text": "'default' | 'error' | 'warning' | 'success'"
+              },
+              "default": "'default'",
+              "description": "Visual variant that determines the text color and icon.\nUse `error` for validation errors, `warning` for cautions, `success` for confirmation.",
+              "fieldName": "variant",
+              "attribute": "variant"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "hx-help-text",
           "customElement": true,
-          "summary": "Grid item with explicit column/row placement."
+          "summary": "Help text displayed below form controls for guidance or validation feedback."
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "HelixGrid",
-          "declaration": {
-            "name": "HelixGrid",
-            "module": "src/components/hx-grid/hx-grid.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "hx-grid",
-          "declaration": {
-            "name": "HelixGrid",
-            "module": "src/components/hx-grid/hx-grid.ts"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "HelixGridItem",
+          "name": "HelixHelpText",
           "declaration": {
-            "name": "HelixGridItem",
-            "module": "src/components/hx-grid/hx-grid.ts"
+            "name": "HelixHelpText",
+            "module": "src/components/hx-help-text/hx-help-text.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "hx-grid-item",
+          "name": "hx-help-text",
           "declaration": {
-            "name": "HelixGridItem",
-            "module": "src/components/hx-grid/hx-grid.ts"
+            "name": "HelixHelpText",
+            "module": "src/components/hx-help-text/hx-help-text.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/components/hx-grid/index.ts",
+      "path": "src/components/hx-help-text/index.ts",
       "declarations": [],
       "exports": [
         {
           "kind": "js",
-          "name": "HelixGrid",
-          "declaration": {
-            "name": "HelixGrid",
-            "module": "./hx-grid.js"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "HelixGridItem",
+          "name": "HelixHelpText",
           "declaration": {
-            "name": "HelixGridItem",
-            "module": "./hx-grid.js"
+            "name": "HelixHelpText",
+            "module": "./hx-help-text.js"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/components/hx-help-text/hx-help-text.ts",
+      "path": "src/components/hx-icon/hx-icon.ts",
       "declarations": [
         {
           "kind": "class",
-          "description": "Standardized help/hint text displayed below form fields.\nUsed by hx-field as a consistent sub-component for guidance and validation messages.\n\nNon-default variants render an inline icon alongside the text to satisfy\nWCAG 1.4.1 (color is not the sole visual indicator). The `error` variant\nuses `role=\"alert\"` for immediate screen-reader announcement; `warning`\nand `success` use `aria-live=\"polite\"` for non-intrusive announcements.",
-          "name": "HelixHelpText",
+          "description": "An icon component that supports inline SVG fetching and SVG sprite sheet references.\nDecorative icons are automatically hidden from assistive technology.\nWhen a label is provided the icon is announced as an image with that label.\n\n**Render modes:**\n- **Sprite mode** (recommended for Drupal/SSR): Set `name` and optionally `sprite-url`.\n  Renders an `<svg><use href=\"...#name\">` — works server-side without JavaScript.\n- **Inline mode**: Set `src` to a URL of a standalone SVG file. The component fetches,\n  sanitizes, and embeds the SVG markup. Requires JavaScript; not server-side renderable.\n  For Drupal/Twig templates use sprite mode to avoid content shift before hydration.",
+          "name": "HelixIcon",
           "cssProperties": [
             {
-              "description": "Text color.",
-              "name": "--hx-help-text-color",
-              "default": "var(--hx-color-neutral-500)"
+              "description": "Width and height of the icon.",
+              "name": "--hx-icon-size",
+              "default": "var(--hx-size-6,1.5rem)"
             },
             {
-              "description": "Font family.",
-              "name": "--hx-help-text-font-family",
-              "default": "var(--hx-font-family-sans)"
+              "description": "Icon color.",
+              "name": "--hx-icon-color",
+              "default": "currentColor"
+            }
+          ],
+          "cssParts": [
+            {
+              "description": "The SVG element rendered in sprite mode, or the inline SVG container in inline mode. In sprite mode this is an `<svg>` element; in inline mode it is a `<span>` element wrapping the fetched SVG. Both expose the same `part` name for consistent external styling via `::part(svg)`.",
+              "name": "svg"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "name",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "Icon name used as the fragment identifier when referencing a sprite sheet.\nFor sprite mode provide the bare symbol id (e.g. `check`). The component\nwill build the full href as `${spriteUrl}#${name}`. If `name` already\nstarts with `#` it is used as-is (inline sprite reference without a base\nURL).",
+              "attribute": "name"
             },
             {
-              "description": "Font size.",
-              "name": "--hx-help-text-font-size",
-              "default": "var(--hx-font-size-sm)"
+              "kind": "field",
+              "name": "src",
+              "type": {
+                "text": "string | undefined"
+              },
+              "default": "undefined",
+              "description": "URL of a standalone SVG file to fetch and render inline. Takes precedence\nover sprite mode when both `src` and `spriteUrl`/`name` are set.\n\n**Note:** Inline mode requires browser JavaScript (`fetch` + `DOMParser`).\nIt is not server-side renderable. For Drupal/Twig use sprite mode instead.",
+              "attribute": "src"
             },
             {
-              "description": "Font weight.",
-              "name": "--hx-help-text-font-weight",
-              "default": "var(--hx-font-weight-normal)"
+              "kind": "field",
+              "name": "spriteUrl",
+              "type": {
+                "text": "string | undefined"
+              },
+              "default": "undefined",
+              "description": "Base URL of the SVG sprite sheet. Used together with `name` to construct\nthe `<use>` href: `${spriteUrl}#${name}`.",
+              "attribute": "sprite-url"
             },
             {
-              "description": "Line height.",
-              "name": "--hx-help-text-line-height",
-              "default": "var(--hx-line-height-normal)"
+              "kind": "field",
+              "name": "size",
+              "type": {
+                "text": "'xs' | 'sm' | 'md' | 'lg' | 'xl'"
+              },
+              "default": "'md'",
+              "description": "Size variant of the icon.\n\nSet via the `hx-size` HTML attribute (e.g. `hx-size=\"lg\"`) or via the\n`size` JavaScript property (e.g. `el.size = 'lg'`). Both are equivalent —\nthe `attribute: 'hx-size'` mapping is used to avoid colliding with the\nnative `<input>` `size` attribute in Drupal attribute-passthrough scenarios.\nThe CEM exposes both the JS property name (`size`) and the HTML attribute\nname (`hx-size`).",
+              "attribute": "hx-size",
+              "reflects": true
             },
             {
-              "description": "Gap between icon and text.",
-              "name": "--hx-help-text-icon-gap",
-              "default": "0.375rem"
-            }
-          ],
-          "cssParts": [
+              "kind": "field",
+              "name": "label",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "Accessible label for the icon. When non-empty, `role=\"img\"` and\n`aria-label` are applied so assistive technology announces the icon.\nWhen empty the icon is treated as decorative and `aria-hidden=\"true\"` is\napplied.",
+              "attribute": "label"
+            },
             {
-              "description": "The root element of the help text.",
-              "name": "base"
+              "kind": "field",
+              "name": "_inlineSvg",
+              "type": {
+                "text": "string"
+              },
+              "privacy": "private",
+              "default": "''",
+              "description": "Stores the sanitized inner markup of an externally fetched SVG."
             },
             {
-              "description": "The icon wrapper (only rendered for non-default variants).",
-              "name": "icon"
+              "kind": "field",
+              "name": "_fetchedSrc",
+              "type": {
+                "text": "string | undefined"
+              },
+              "privacy": "private",
+              "default": "undefined",
+              "description": "Tracks the `src` URL that was last successfully fetched so that we only\nrefetch when it genuinely changes."
             },
             {
-              "description": "The text wrapper around the default slot.",
-              "name": "text"
-            }
-          ],
-          "slots": [
+              "kind": "field",
+              "name": "_fetchSeq",
+              "type": {
+                "text": "number"
+              },
+              "privacy": "private",
+              "default": "0",
+              "description": "Monotonically-increasing sequence number. Incremented before each fetch so\nthat stale out-of-order responses can be discarded."
+            },
             {
-              "description": "The help text content.",
-              "name": ""
+              "kind": "method",
+              "name": "_fetchInlineSvg",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "Promise<void>"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "url",
+                  "type": {
+                    "text": "string | undefined"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "_sanitizeSvg",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "string"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "raw",
+                  "type": {
+                    "text": "string"
+                  }
+                }
+              ],
+              "description": "Parses the raw SVG text, strips dangerous content (script elements,\nforeignObject, on* event-handler attributes, javascript:/data: URIs,\nand style attributes that could carry CSS injection payloads), and\nreturns the outer SVG markup safe for rendering via `unsafeHTML`.\n\nAdditionally injects `focusable=\"false\"` on the root SVG element to\nprevent IE11/old-Edge from making the SVG keyboard-focusable, and strips\nany ARIA attributes from the inner SVG to prevent conflicts with the\nwrapper's own ARIA semantics."
+            },
+            {
+              "kind": "method",
+              "name": "_spriteHref",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "string"
+                }
+              },
+              "description": "Returns the href used in the `<use>` element for sprite mode.\nIf `name` already begins with `#` it is treated as an inline reference."
+            },
+            {
+              "kind": "method",
+              "name": "_renderSprite",
+              "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "_renderInline",
+              "privacy": "private"
             }
           ],
-          "members": [
+          "attributes": [
+            {
+              "name": "name",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "Icon name used as the fragment identifier when referencing a sprite sheet.\nFor sprite mode provide the bare symbol id (e.g. `check`). The component\nwill build the full href as `${spriteUrl}#${name}`. If `name` already\nstarts with `#` it is used as-is (inline sprite reference without a base\nURL).",
+              "fieldName": "name",
+              "attribute": "name"
+            },
+            {
+              "name": "src",
+              "type": {
+                "text": "string | undefined"
+              },
+              "default": "undefined",
+              "description": "URL of a standalone SVG file to fetch and render inline. Takes precedence\nover sprite mode when both `src` and `spriteUrl`/`name` are set.\n\n**Note:** Inline mode requires browser JavaScript (`fetch` + `DOMParser`).\nIt is not server-side renderable. For Drupal/Twig use sprite mode instead.",
+              "fieldName": "src",
+              "attribute": "src"
+            },
+            {
+              "name": "sprite-url",
+              "type": {
+                "text": "string | undefined"
+              },
+              "default": "undefined",
+              "description": "Base URL of the SVG sprite sheet. Used together with `name` to construct\nthe `<use>` href: `${spriteUrl}#${name}`.",
+              "fieldName": "spriteUrl",
+              "attribute": "sprite-url"
+            },
             {
-              "kind": "field",
-              "name": "variant",
+              "name": "hx-size",
               "type": {
-                "text": "'default' | 'error' | 'warning' | 'success'"
+                "text": "'xs' | 'sm' | 'md' | 'lg' | 'xl'"
               },
-              "default": "'default'",
-              "description": "Visual variant that determines the text color and icon.\nUse `error` for validation errors, `warning` for cautions, `success` for confirmation.",
-              "attribute": "variant",
-              "reflects": true
-            }
-          ],
-          "attributes": [
+              "default": "'md'",
+              "description": "Size variant of the icon.\n\nSet via the `hx-size` HTML attribute (e.g. `hx-size=\"lg\"`) or via the\n`size` JavaScript property (e.g. `el.size = 'lg'`). Both are equivalent —\nthe `attribute: 'hx-size'` mapping is used to avoid colliding with the\nnative `<input>` `size` attribute in Drupal attribute-passthrough scenarios.\nThe CEM exposes both the JS property name (`size`) and the HTML attribute\nname (`hx-size`).",
+              "fieldName": "size",
+              "attribute": "hx-size"
+            },
             {
-              "name": "variant",
+              "name": "label",
               "type": {
-                "text": "'default' | 'error' | 'warning' | 'success'"
+                "text": "string"
               },
-              "default": "'default'",
-              "description": "Visual variant that determines the text color and icon.\nUse `error` for validation errors, `warning` for cautions, `success` for confirmation.",
-              "fieldName": "variant",
-              "attribute": "variant"
+              "default": "''",
+              "description": "Accessible label for the icon. When non-empty, `role=\"img\"` and\n`aria-label` are applied so assistive technology announces the icon.\nWhen empty the icon is treated as decorative and `aria-hidden=\"true\"` is\napplied.",
+              "fieldName": "label",
+              "attribute": "label"
             }
           ],
           "superclass": {
             "name": "LitElement",
             "package": "lit"
           },
-          "tagName": "hx-help-text",
+          "tagName": "hx-icon",
           "customElement": true,
-          "summary": "Help text displayed below form controls for guidance or validation feedback."
+          "summary": "SVG icon with sprite and inline fetch modes for healthcare applications."
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "HelixHelpText",
+          "name": "HelixIcon",
           "declaration": {
-            "name": "HelixHelpText",
-            "module": "src/components/hx-help-text/hx-help-text.ts"
+            "name": "HelixIcon",
+            "module": "src/components/hx-icon/hx-icon.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "hx-help-text",
+          "name": "hx-icon",
           "declaration": {
-            "name": "HelixHelpText",
-            "module": "src/components/hx-help-text/hx-help-text.ts"
+            "name": "HelixIcon",
+            "module": "src/components/hx-icon/hx-icon.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/components/hx-help-text/index.ts",
+      "path": "src/components/hx-icon/index.ts",
       "declarations": [],
       "exports": [
         {
           "kind": "js",
-          "name": "HelixHelpText",
+          "name": "HelixIcon",
           "declaration": {
-            "name": "HelixHelpText",
-            "module": "./hx-help-text.js"
+            "name": "HelixIcon",
+            "module": "./hx-icon.js"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/components/hx-icon/hx-icon.ts",
+      "path": "src/components/hx-icon-button/hx-icon-button.ts",
       "declarations": [
         {
           "kind": "class",
-          "description": "An icon component that supports inline SVG fetching and SVG sprite sheet references.\nDecorative icons are automatically hidden from assistive technology.\nWhen a label is provided the icon is announced as an image with that label.\n\n**Render modes:**\n- **Sprite mode** (recommended for Drupal/SSR): Set `name` and optionally `sprite-url`.\n  Renders an `<svg><use href=\"...#name\">` — works server-side without JavaScript.\n- **Inline mode**: Set `src` to a URL of a standalone SVG file. The component fetches,\n  sanitizes, and embeds the SVG markup. Requires JavaScript; not server-side renderable.\n  For Drupal/Twig templates use sprite mode to avoid content shift before hydration.",
-          "name": "HelixIcon",
+          "description": "An icon-only button component for compact, accessible actions.\nRenders a square button or anchor element containing a single icon.\nThe `label` property is required and provides the accessible name\nvia `aria-label` and a native tooltip via the `title` attribute.",
+          "name": "HelixIconButton",
           "cssProperties": [
             {
-              "description": "Width and height of the icon.",
-              "name": "--hx-icon-size",
-              "default": "var(--hx-size-6,1.5rem)"
+              "description": "Button background color.",
+              "name": "--hx-icon-button-bg",
+              "default": "transparent"
             },
             {
               "description": "Icon color.",
-              "name": "--hx-icon-color",
-              "default": "currentColor"
+              "name": "--hx-icon-button-color",
+              "default": "var(--hx-color-primary-500)"
+            },
+            {
+              "description": "Button border color.",
+              "name": "--hx-icon-button-border-color",
+              "default": "transparent"
+            },
+            {
+              "description": "Button border radius.",
+              "name": "--hx-icon-button-border-radius",
+              "default": "var(--hx-border-radius-md)"
+            },
+            {
+              "description": "Explicit width and height override for the button.",
+              "name": "--hx-icon-button-size"
+            },
+            {
+              "description": "Focus ring color.",
+              "name": "--hx-icon-button-focus-ring-color",
+              "default": "var(--hx-focus-ring-color)"
             }
           ],
           "cssParts": [
             {
-              "description": "The SVG element rendered in sprite mode, or the inline SVG container in inline mode. In sprite mode this is an `<svg>` element; in inline mode it is a `<span>` element wrapping the fetched SVG. Both expose the same `part` name for consistent external styling via `::part(svg)`.",
-              "name": "svg"
+              "description": "The native button or anchor element.",
+              "name": "button"
+            },
+            {
+              "description": "The icon container span wrapping the default slot.",
+              "name": "icon"
+            }
+          ],
+          "slots": [
+            {
+              "description": "Icon element to display (hx-icon, svg, or img).",
+              "name": ""
             }
           ],
           "members": [
             {
               "kind": "field",
-              "name": "name",
+              "name": "label",
               "type": {
                 "text": "string"
               },
               "default": "''",
-              "description": "Icon name used as the fragment identifier when referencing a sprite sheet.\nFor sprite mode provide the bare symbol id (e.g. `check`). The component\nwill build the full href as `${spriteUrl}#${name}`. If `name` already\nstarts with `#` it is used as-is (inline sprite reference without a base\nURL).",
-              "attribute": "name"
+              "description": "Accessible name for the button. Required. Rendered as `aria-label` and\n`title` on the underlying element. The component renders nothing when absent,\nand a console warning is emitted to alert developers during authoring.",
+              "attribute": "label"
             },
             {
               "kind": "field",
-              "name": "src",
+              "name": "variant",
               "type": {
-                "text": "string | undefined"
+                "text": "'primary' | 'secondary' | 'tertiary' | 'danger' | 'ghost'"
               },
-              "default": "undefined",
-              "description": "URL of a standalone SVG file to fetch and render inline. Takes precedence\nover sprite mode when both `src` and `spriteUrl`/`name` are set.\n\n**Note:** Inline mode requires browser JavaScript (`fetch` + `DOMParser`).\nIt is not server-side renderable. For Drupal/Twig use sprite mode instead.",
-              "attribute": "src"
+              "default": "'ghost'",
+              "description": "Visual style variant of the button.",
+              "attribute": "variant",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "spriteUrl",
+              "name": "size",
               "type": {
-                "text": "string | undefined"
+                "text": "'sm' | 'md' | 'lg'"
               },
-              "default": "undefined",
-              "description": "Base URL of the SVG sprite sheet. Used together with `name` to construct\nthe `<use>` href: `${spriteUrl}#${name}`.",
-              "attribute": "sprite-url"
+              "default": "'md'",
+              "description": "Size of the button.",
+              "attribute": "hx-size",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "size",
+              "name": "type",
               "type": {
-                "text": "'xs' | 'sm' | 'md' | 'lg' | 'xl'"
+                "text": "'button' | 'submit' | 'reset'"
               },
-              "default": "'md'",
-              "description": "Size variant of the icon.\n\nSet via the `hx-size` HTML attribute (e.g. `hx-size=\"lg\"`) or via the\n`size` JavaScript property (e.g. `el.size = 'lg'`). Both are equivalent —\nthe `attribute: 'hx-size'` mapping is used to avoid colliding with the\nnative `<input>` `size` attribute in Drupal attribute-passthrough scenarios.\nThe CEM exposes both the JS property name (`size`) and the HTML attribute\nname (`hx-size`).",
-              "attribute": "hx-size",
+              "default": "'button'",
+              "description": "The type attribute for the underlying button element.\nHas no effect when `href` is set.",
+              "attribute": "type"
+            },
+            {
+              "kind": "field",
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Whether the button is disabled.",
+              "attribute": "disabled",
               "reflects": true
             },
             {
               "kind": "field",
-              "name": "label",
+              "name": "href",
               "type": {
-                "text": "string"
+                "text": "string | undefined"
               },
-              "default": "''",
-              "description": "Accessible label for the icon. When non-empty, `role=\"img\"` and\n`aria-label` are applied so assistive technology announces the icon.\nWhen empty the icon is treated as decorative and `aria-hidden=\"true\"` is\napplied.",
-              "attribute": "label"
+              "default": "undefined",
+              "description": "When set, renders an `<a>` element instead of a `<button>`.",
+              "attribute": "href"
             },
             {
               "kind": "field",
-              "name": "_inlineSvg",
+              "name": "name",
               "type": {
-                "text": "string"
+                "text": "string | undefined"
               },
-              "privacy": "private",
-              "default": "''",
-              "description": "Stores the sanitized inner markup of an externally fetched SVG."
+              "default": "undefined",
+              "description": "Name submitted with form data. Only applicable when rendering as a button.",
+              "attribute": "name"
             },
             {
               "kind": "field",
-              "name": "_fetchedSrc",
+              "name": "value",
               "type": {
                 "text": "string | undefined"
               },
-              "privacy": "private",
               "default": "undefined",
-              "description": "Tracks the `src` URL that was last successfully fetched so that we only\nrefetch when it genuinely changes."
+              "description": "Value submitted with form data. Only applicable when rendering as a button.",
+              "attribute": "value"
             },
             {
               "kind": "field",
-              "name": "_fetchSeq",
+              "name": "formAssociated",
               "type": {
-                "text": "number"
+                "text": "boolean"
               },
-              "privacy": "private",
-              "default": "0",
-              "description": "Monotonically-increasing sequence number. Incremented before each fetch so\nthat stale out-of-order responses can be discarded."
+              "static": true,
+              "default": "true"
             },
             {
-              "kind": "method",
-              "name": "_fetchInlineSvg",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "Promise<void>"
-                }
+              "kind": "field",
+              "name": "_internals",
+              "type": {
+                "text": "ElementInternals"
               },
-              "parameters": [
-                {
-                  "name": "url",
-                  "type": {
-                    "text": "string | undefined"
-                  }
-                }
-              ]
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "form",
+              "type": {
+                "text": "HTMLFormElement | null"
+              },
+              "description": "Returns the associated form element, if any.",
+              "readonly": true
             },
             {
               "kind": "method",
-              "name": "_sanitizeSvg",
+              "name": "_handleClick",
               "privacy": "private",
               "return": {
                 "type": {
-                  "text": "string"
+                  "text": "void"
                 }
               },
               "parameters": [
                 {
-                  "name": "raw",
+                  "name": "e",
                   "type": {
-                    "text": "string"
+                    "text": "MouseEvent"
                   }
                 }
-              ],
-              "description": "Parses the raw SVG text, strips dangerous content (script elements,\nforeignObject, on* event-handler attributes, javascript:/data: URIs,\nand style attributes that could carry CSS injection payloads), and\nreturns the outer SVG markup safe for rendering via `unsafeHTML`.\n\nAdditionally injects `focusable=\"false\"` on the root SVG element to\nprevent IE11/old-Edge from making the SVG keyboard-focusable, and strips\nany ARIA attributes from the inner SVG to prevent conflicts with the\nwrapper's own ARIA semantics."
+              ]
             },
             {
               "kind": "method",
-              "name": "_spriteHref",
+              "name": "_normalizedLabel",
               "privacy": "private",
               "return": {
                 "type": {
                   "text": "string"
                 }
-              },
-              "description": "Returns the href used in the `<use>` element for sprite mode.\nIf `name` already begins with `#` it is treated as an inline reference."
+              }
             },
             {
               "kind": "method",
-              "name": "_renderSprite",
+              "name": "_classes",
               "privacy": "private"
             },
             {
               "kind": "method",
-              "name": "_renderInline",
+              "name": "_iconSlot",
               "privacy": "private"
             }
           ],
+          "events": [
+            {
+              "name": "hx-click",
+              "type": {
+                "text": "CustomEvent<{originalEvent: MouseEvent}>"
+              },
+              "description": "Dispatched when the button is clicked (not disabled)."
+            }
+          ],
           "attributes": [
             {
-              "name": "name",
+              "name": "label",
               "type": {
                 "text": "string"
               },
               "default": "''",
-              "description": "Icon name used as the fragment identifier when referencing a sprite sheet.\nFor sprite mode provide the bare symbol id (e.g. `check`). The component\nwill build the full href as `${spriteUrl}#${name}`. If `name` already\nstarts with `#` it is used as-is (inline sprite reference without a base\nURL).",
-              "fieldName": "name",
-              "attribute": "name"
+              "description": "Accessible name for the button. Required. Rendered as `aria-label` and\n`title` on the underlying element. The component renders nothing when absent,\nand a console warning is emitted to alert developers during authoring.",
+              "fieldName": "label",
+              "attribute": "label"
             },
             {
-              "name": "src",
+              "name": "variant",
+              "type": {
+                "text": "'primary' | 'secondary' | 'tertiary' | 'danger' | 'ghost'"
+              },
+              "default": "'ghost'",
+              "description": "Visual style variant of the button.",
+              "fieldName": "variant",
+              "attribute": "variant"
+            },
+            {
+              "name": "hx-size",
+              "type": {
+                "text": "'sm' | 'md' | 'lg'"
+              },
+              "default": "'md'",
+              "description": "Size of the button.",
+              "fieldName": "size",
+              "attribute": "hx-size"
+            },
+            {
+              "name": "type",
+              "type": {
+                "text": "'button' | 'submit' | 'reset'"
+              },
+              "default": "'button'",
+              "description": "The type attribute for the underlying button element.\nHas no effect when `href` is set.",
+              "fieldName": "type",
+              "attribute": "type"
+            },
+            {
+              "name": "disabled",
               "type": {
-                "text": "string | undefined"
+                "text": "boolean"
               },
-              "default": "undefined",
-              "description": "URL of a standalone SVG file to fetch and render inline. Takes precedence\nover sprite mode when both `src` and `spriteUrl`/`name` are set.\n\n**Note:** Inline mode requires browser JavaScript (`fetch` + `DOMParser`).\nIt is not server-side renderable. For Drupal/Twig use sprite mode instead.",
-              "fieldName": "src",
-              "attribute": "src"
+              "default": "false",
+              "description": "Whether the button is disabled.",
+              "fieldName": "disabled",
+              "attribute": "disabled"
             },
             {
-              "name": "sprite-url",
+              "name": "href",
               "type": {
                 "text": "string | undefined"
               },
               "default": "undefined",
-              "description": "Base URL of the SVG sprite sheet. Used together with `name` to construct\nthe `<use>` href: `${spriteUrl}#${name}`.",
-              "fieldName": "spriteUrl",
-              "attribute": "sprite-url"
+              "description": "When set, renders an `<a>` element instead of a `<button>`.",
+              "fieldName": "href",
+              "attribute": "href"
             },
             {
-              "name": "hx-size",
+              "name": "name",
               "type": {
-                "text": "'xs' | 'sm' | 'md' | 'lg' | 'xl'"
+                "text": "string | undefined"
               },
-              "default": "'md'",
-              "description": "Size variant of the icon.\n\nSet via the `hx-size` HTML attribute (e.g. `hx-size=\"lg\"`) or via the\n`size` JavaScript property (e.g. `el.size = 'lg'`). Both are equivalent —\nthe `attribute: 'hx-size'` mapping is used to avoid colliding with the\nnative `<input>` `size` attribute in Drupal attribute-passthrough scenarios.\nThe CEM exposes both the JS property name (`size`) and the HTML attribute\nname (`hx-size`).",
-              "fieldName": "size",
-              "attribute": "hx-size"
+              "default": "undefined",
+              "description": "Name submitted with form data. Only applicable when rendering as a button.",
+              "fieldName": "name",
+              "attribute": "name"
             },
             {
-              "name": "label",
+              "name": "value",
               "type": {
-                "text": "string"
+                "text": "string | undefined"
               },
-              "default": "''",
-              "description": "Accessible label for the icon. When non-empty, `role=\"img\"` and\n`aria-label` are applied so assistive technology announces the icon.\nWhen empty the icon is treated as decorative and `aria-hidden=\"true\"` is\napplied.",
-              "fieldName": "label",
-              "attribute": "label"
+              "default": "undefined",
+              "description": "Value submitted with form data. Only applicable when rendering as a button.",
+              "fieldName": "value",
+              "attribute": "value"
             }
           ],
           "superclass": {
             "name": "LitElement",
             "package": "lit"
           },
-          "tagName": "hx-icon",
+          "tagName": "hx-icon-button",
           "customElement": true,
-          "summary": "SVG icon with sprite and inline fetch modes for healthcare applications."
+          "summary": "Icon-only action button with full accessibility support."
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "HelixIcon",
+          "name": "HelixIconButton",
           "declaration": {
-            "name": "HelixIcon",
-            "module": "src/components/hx-icon/hx-icon.ts"
+            "name": "HelixIconButton",
+            "module": "src/components/hx-icon-button/hx-icon-button.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "hx-icon",
+          "name": "hx-icon-button",
           "declaration": {
-            "name": "HelixIcon",
-            "module": "src/components/hx-icon/hx-icon.ts"
+            "name": "HelixIconButton",
+            "module": "src/components/hx-icon-button/hx-icon-button.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/components/hx-icon/index.ts",
+      "path": "src/components/hx-icon-button/index.ts",
       "declarations": [],
       "exports": [
         {
           "kind": "js",
-          "name": "HelixIcon",
+          "name": "HelixIconButton",
           "declaration": {
-            "name": "HelixIcon",
-            "module": "./hx-icon.js"
+            "name": "HelixIconButton",
+            "module": "./hx-icon-button.js"
           }
         }
       ]
@@ -17326,7 +17647,7 @@
               "kind": "field",
               "name": "_input",
               "type": {
-                "text": "HTMLInputElement"
+                "text": "HTMLInputElement | null"
               },
               "privacy": "private"
             },
@@ -18807,6 +19128,14 @@
             "name": "HelixPagination",
             "module": "./hx-pagination.js"
           }
+        },
+        {
+          "kind": "js",
+          "name": "HxPagination",
+          "declaration": {
+            "name": "HxPagination",
+            "module": "./hx-pagination.js"
+          }
         }
       ]
     },
@@ -20534,6 +20863,11 @@
               "description": "Error message color.",
               "name": "--hx-radio-group-error-color",
               "default": "var(--hx-color-error-500, #dc3545)"
+            },
+            {
+              "description": "Help text color.",
+              "name": "--hx-radio-group-help-text-color",
+              "default": "var(--hx-color-neutral-500, #6c757d)"
             }
           ],
           "cssParts": [
@@ -20799,6 +21133,11 @@
                 "text": "HTMLFormElement | null"
               },
               "description": "Returns the associated form element, if any.",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
               "readonly": true
             },
             {
@@ -20808,6 +21147,11 @@
                 "text": "string"
               },
               "description": "Returns the validation message.",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
               "readonly": true
             },
             {
@@ -20817,6 +21161,11 @@
                 "text": "ValidityState"
               },
               "description": "Returns the ValidityState object.",
+              "return": {
+                "type": {
+                  "text": ""
+                }
+              },
               "readonly": true
             },
             {
@@ -20824,7 +21173,7 @@
               "name": "checkValidity",
               "return": {
                 "type": {
-                  "text": "boolean"
+                  "text": ""
                 }
               },
               "description": "Checks whether the group satisfies its constraints."
@@ -20834,7 +21183,7 @@
               "name": "reportValidity",
               "return": {
                 "type": {
-                  "text": "boolean"
+                  "text": ""
                 }
               },
               "description": "Reports validity and shows the browser's constraint validation UI."
@@ -20872,13 +21221,15 @@
                   "name": "state",
                   "type": {
                     "text": "string | File | FormData"
-                  }
+                  },
+                  "description": "The saved form state value."
                 },
                 {
                   "name": "_mode",
                   "type": {
                     "text": "'restore' | 'autocomplete'"
-                  }
+                  },
+                  "description": "The restore mode: `'restore'` or `'autocomplete'`."
                 }
               ],
               "description": "Called when the form restores state (e.g., back/forward navigation)."
@@ -20886,11 +21237,12 @@
           ],
           "events": [
             {
-              "type": {
-                "text": "CustomEvent<{value: string, checked: boolean}>"
-              },
-              "description": "Dispatched when the selected radio changes.",
+              "description": "Dispatched when the selected radio changes (detail: `{value: string, checked: boolean}`).",
               "name": "hx-change"
+            },
+            {
+              "description": "Internal event dispatched by `hx-radio` when selected; consumed by the group (detail: `{value: string}`).",
+              "name": "hx-radio-select"
             }
           ],
           "attributes": [
@@ -23582,7 +23934,7 @@
               "kind": "field",
               "name": "_input",
               "type": {
-                "text": "HTMLInputElement"
+                "text": "HTMLInputElement | null"
               },
               "privacy": "private",
               "description": "Reference to the native range `<input>` inside shadow DOM."
@@ -23639,9 +23991,18 @@
                 }
               }
             },
+            {
+              "kind": "field",
+              "name": "_cachedTicks",
+              "type": {
+                "text": "number[]"
+              },
+              "privacy": "private",
+              "default": "[]"
+            },
             {
               "kind": "method",
-              "name": "_ticks",
+              "name": "_computeTicks",
               "privacy": "private",
               "return": {
                 "type": {
@@ -23718,7 +24079,7 @@
                 {
                   "name": "state",
                   "type": {
-                    "text": "string"
+                    "text": "string | File | FormData | null"
                   },
                   "description": "The serialized value to restore."
                 },
@@ -24074,10 +24435,10 @@
               "kind": "field",
               "name": "size",
               "type": {
-                "text": "'sm' | 'md' | 'lg' | string"
+                "text": "SpinnerSize | string"
               },
               "default": "'md'",
-              "description": "Size of the spinner. Accepts 'sm' | 'md' | 'lg' token values, or any\nvalid CSS size string (e.g. \"3rem\", \"48px\").\n\nNote: `'sm' | 'md' | 'lg' | string` intentionally degrades to `string`\nat the TypeScript level to allow CSS size values as a convenience override.\nThis is a deliberate design choice — use token values for standard sizing.",
+              "description": "Size of the spinner. Accepts `SpinnerSize` token values ('sm' | 'md' | 'lg'),\nor any valid CSS size string (e.g. \"3rem\", \"48px\") for custom dimensions.\n\nThe type is `SpinnerSize | string` which widens to `string` at the TypeScript\nlevel — this is intentional to support CSS size overrides. Use `SpinnerSize`\nvalues for standard sizing; custom strings bypass token-based scaling.",
               "attribute": "size",
               "reflects": true
             },
@@ -24120,7 +24481,7 @@
               "privacy": "private",
               "return": {
                 "type": {
-                  "text": "boolean"
+                  "text": "this is { size: SpinnerSize }"
                 }
               }
             }
@@ -24129,10 +24490,10 @@
             {
               "name": "size",
               "type": {
-                "text": "'sm' | 'md' | 'lg' | string"
+                "text": "SpinnerSize | string"
               },
               "default": "'md'",
-              "description": "Size of the spinner. Accepts 'sm' | 'md' | 'lg' token values, or any\nvalid CSS size string (e.g. \"3rem\", \"48px\").\n\nNote: `'sm' | 'md' | 'lg' | string` intentionally degrades to `string`\nat the TypeScript level to allow CSS size values as a convenience override.\nThis is a deliberate design choice — use token values for standard sizing.",
+              "description": "Size of the spinner. Accepts `SpinnerSize` token values ('sm' | 'md' | 'lg'),\nor any valid CSS size string (e.g. \"3rem\", \"48px\") for custom dimensions.\n\nThe type is `SpinnerSize | string` which widens to `string` at the TypeScript\nlevel — this is intentional to support CSS size overrides. Use `SpinnerSize`\nvalues for standard sizing; custom strings bypass token-based scaling.",
               "fieldName": "size",
               "attribute": "size"
             },
@@ -24207,6 +24568,14 @@
             "name": "HelixSpinner",
             "module": "./hx-spinner.js"
           }
+        },
+        {
+          "kind": "js",
+          "name": "SpinnerSize",
+          "declaration": {
+            "name": "SpinnerSize",
+            "module": "./hx-spinner.js"
+          }
         }
       ]
     },
@@ -27681,6 +28050,22 @@
             "name": "HelixTag",
             "module": "./hx-tag.js"
           }
+        },
+        {
+          "kind": "js",
+          "name": "HxTag",
+          "declaration": {
+            "name": "HxTag",
+            "module": "./hx-tag.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "WcTag",
+          "declaration": {
+            "name": "WcTag",
+            "module": "./hx-tag.js"
+          }
         }
       ]
     },
@@ -28739,6 +29124,17 @@
               "description": "Maximum number of characters allowed.",
               "attribute": "maxlength"
             },
+            {
+              "kind": "field",
+              "name": "readonly",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Whether the textarea is read-only. Read-only fields are visible but\ncannot be edited by the user. Common in healthcare for displaying\nnon-editable patient data inline with editable fields.",
+              "attribute": "readonly",
+              "reflects": true
+            },
             {
               "kind": "field",
               "name": "resize",
@@ -29000,6 +29396,16 @@
               "fieldName": "maxlength",
               "attribute": "maxlength"
             },
+            {
+              "name": "readonly",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Whether the textarea is read-only. Read-only fields are visible but\ncannot be edited by the user. Common in healthcare for displaying\nnon-editable patient data inline with editable fields.",
+              "fieldName": "readonly",
+              "attribute": "readonly"
+            },
             {
               "name": "resize",
               "type": {
@@ -29235,6 +29641,22 @@
             "name": "TokenEntry",
             "module": "./hx-theme.js"
           }
+        },
+        {
+          "kind": "js",
+          "name": "HxTheme",
+          "declaration": {
+            "name": "HxTheme",
+            "module": "./hx-theme.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "WcTheme",
+          "declaration": {
+            "name": "WcTheme",
+            "module": "./hx-theme.js"
+          }
         }
       ]
     },
@@ -30766,7 +31188,13 @@
                 {
                   "name": "state",
                   "type": {
-                    "text": "string"
+                    "text": "string | File | FormData | null"
+                  }
+                },
+                {
+                  "name": "_mode",
+                  "type": {
+                    "text": "'restore' | 'autocomplete'"
                   }
                 }
               ],
@@ -31524,56 +31952,65 @@
             },
             {
               "kind": "field",
-              "name": "hasChildItems",
+              "name": "_level",
               "type": {
-                "text": "boolean"
+                "text": "number"
               },
-              "description": "Whether this item has slotted children.",
-              "readonly": true
+              "privacy": "private",
+              "default": "1",
+              "description": "Cached ARIA position metadata. Computed once on connect and on slotchange\nof the parent container, avoiding repeated DOM traversal on every render."
             },
             {
-              "kind": "method",
-              "name": "_getLevel",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "number"
-                }
+              "kind": "field",
+              "name": "_posInSet",
+              "type": {
+                "text": "number"
               },
-              "description": "Compute nesting depth by counting ancestor hx-tree-item elements."
+              "privacy": "private",
+              "default": "1"
             },
             {
-              "kind": "method",
-              "name": "_getPosInSet",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "number"
-                }
+              "kind": "field",
+              "name": "_setSize",
+              "type": {
+                "text": "number"
               },
-              "description": "Compute position in set among siblings."
+              "privacy": "private",
+              "default": "1"
             },
             {
-              "kind": "method",
-              "name": "_getSetSize",
+              "kind": "field",
+              "name": "_selectable",
+              "type": {
+                "text": "boolean"
+              },
               "privacy": "private",
+              "default": "false"
+            },
+            {
+              "kind": "field",
+              "name": "hasChildItems",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "Whether this item has slotted children.",
               "return": {
                 "type": {
-                  "text": "number"
+                  "text": ""
                 }
               },
-              "description": "Compute set size among siblings."
+              "readonly": true
             },
             {
               "kind": "method",
-              "name": "_isSelectable",
+              "name": "_updateAriaMetadata",
               "privacy": "private",
               "return": {
                 "type": {
-                  "text": "boolean"
+                  "text": "void"
                 }
               },
-              "description": "Determine if selection is active on the parent tree."
+              "description": "Recompute all cached ARIA metadata in a single DOM pass.\nCalled on connect, slotchange, and whenever structural context may change."
             },
             {
               "kind": "method",
@@ -31659,8 +32096,9 @@
             {
               "name": "hx-tree-item-select",
               "type": {
-                "text": "CustomEvent"
-              }
+                "text": "CustomEvent<HxTreeItemSelectDetail>"
+              },
+              "description": "Dispatched when this item is clicked or activated via keyboard."
             }
           ],
           "attributes": [
@@ -31720,14 +32158,6 @@
             "name": "HelixTreeItem",
             "module": "src/components/hx-tree-view/hx-tree-item.ts"
           }
-        },
-        {
-          "kind": "js",
-          "name": "WcTreeItem",
-          "declaration": {
-            "name": "HelixTreeItem",
-            "module": "src/components/hx-tree-view/hx-tree-item.ts"
-          }
         }
       ]
     },
@@ -31737,7 +32167,7 @@
       "declarations": [
         {
           "kind": "class",
-          "description": "A hierarchical tree component for navigating nested data structures.\nUsed in healthcare applications for org charts, ICD-10 code hierarchies, and department navigation.\n\nImplements WAI-ARIA tree view pattern with `role=\"tree\"` on the container\nand `role=\"treeitem\"` on each item. Supports `aria-label` via the `label` property\nfor screen reader identification. Full keyboard navigation: Arrow keys for movement,\nEnter/Space for selection, Home/End for first/last item.",
+          "description": "A hierarchical tree component for navigating nested data structures.\nUsed in healthcare applications for org charts, ICD-10 code hierarchies, and department navigation.\n\nImplements WAI-ARIA tree view pattern with `role=\"tree\"` on the container\nand `role=\"treeitem\"` on each item. Supports `aria-label` via the `label` property\nfor screen reader identification. Full keyboard navigation: Arrow keys for movement,\nEnter/Space for selection, Home/End for first/last item.\n\n## Scale Limits\n\nThis component renders all tree items simultaneously in the DOM. It is suitable for\ntrees with up to ~500 visible items. For large taxonomies (e.g., ICD-10 with 70,000+\ncodes), use async/lazy loading: only render top-level nodes initially and populate\nchild nodes on `hx-select` or expand events. The component exposes the `expanded`\nproperty on `hx-tree-item` for programmatic control of subtrees, enabling consumer-level\nvirtualization strategies without requiring changes to this component.",
           "name": "HelixTreeView",
           "cssProperties": [
             {
@@ -31906,7 +32336,7 @@
             {
               "name": "hx-select",
               "type": {
-                "text": "CustomEvent<{item: HelixTreeItem, selected: boolean}>"
+                "text": "CustomEvent<HxSelectDetail>"
               },
               "description": "Dispatched when a tree item is selected or deselected."
             }
@@ -31958,14 +32388,6 @@
             "name": "HelixTreeView",
             "module": "src/components/hx-tree-view/hx-tree-view.ts"
           }
-        },
-        {
-          "kind": "js",
-          "name": "WcTreeView",
-          "declaration": {
-            "name": "HelixTreeView",
-            "module": "src/components/hx-tree-view/hx-tree-view.ts"
-          }
         }
       ]
     },
@@ -31997,6 +32419,54 @@
             "name": "TreeSelection",
             "module": "./hx-tree-view.js"
           }
+        },
+        {
+          "kind": "js",
+          "name": "HxTreeView",
+          "declaration": {
+            "name": "HxTreeView",
+            "module": "./hx-tree-view.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "HxSelectDetail",
+          "declaration": {
+            "name": "HxSelectDetail",
+            "module": "./hx-tree-view.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "HxTreeItem",
+          "declaration": {
+            "name": "HxTreeItem",
+            "module": "./hx-tree-item.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "HxTreeItemSelectDetail",
+          "declaration": {
+            "name": "HxTreeItemSelectDetail",
+            "module": "./hx-tree-item.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "WcTreeView",
+          "declaration": {
+            "name": "WcTreeView",
+            "module": "./hx-tree-view.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "WcTreeItem",
+          "declaration": {
+            "name": "WcTreeItem",
+            "module": "./hx-tree-item.js"
+          }
         }
       ]
     },