@helixui/library 1.1.2 → 2.0.0-next.31

package/dist/shared/{hx-tree-item-BP6UF_H1.js → hx-tree-item-CPQ9dJiK.js}

@@ -1,8 +1,8 @@
-import { css as b, LitElement as g, html as f, nothing as x } from "lit";
-import { property as p, state as c, customElement as _, query as w } from "lit/decorators.js";
-import { tokenStyles as y } from "@helixui/tokens/lit";
-import { classMap as I } from "lit/directives/class-map.js";
-const C = b`
+import { css as b, LitElement as _, nothing as p, html as x } from "lit";
+import "./document-token-adoption-DuYNKd4k.js";
+import { property as m, state as c, customElement as g, query as y } from "lit/decorators.js";
+import { classMap as w } from "lit/directives/class-map.js";
+const I = b`
   :host {
     display: block;
     contain: layout style;
@@ -19,38 +19,46 @@ const C = b`
   }
 
   .tree:focus-visible {
-    outline: var(--hx-focus-ring-width, 2px) solid var(--hx-focus-ring-color, #2563eb);
+    outline: var(--hx-focus-ring-width, 2px) solid
+      var(--hx-focus-ring-color, var(--hx-color-primary-400, #60a5fa));
     outline-offset: var(--hx-focus-ring-offset, 2px);
     border-radius: var(--hx-border-radius-sm, 0.25rem);
   }
 `;
-var k = Object.defineProperty, S = Object.getOwnPropertyDescriptor, m = (e, t, r, s) => {
-  for (var i = s > 1 ? void 0 : s ? S(t, r) : t, l = e.length - 1, h; l >= 0; l--)
-    (h = e[l]) && (i = (s ? h(t, r, i) : h(i)) || i);
-  return s && i && k(t, r, i), i;
+var C = Object.defineProperty, k = Object.getOwnPropertyDescriptor, f = (e, t, i, s) => {
+  for (var r = s > 1 ? void 0 : s ? k(t, i) : t, n = e.length - 1, o; n >= 0; n--)
+    (o = e[n]) && (r = (s ? o(t, i, r) : o(r)) || r);
+  return s && r && C(t, i, r), r;
 };
-let d = class extends g {
+let d = class extends _ {
   constructor() {
-    super(...arguments), this.label = "", this.selection = "none", this._currentIndex = 0, this._hasVisibleItems = !1;
+    super(...arguments), this.label = "", this.selection = "none", this._currentIndex = 0, this._hasVisibleItems = !1, this._cachedVisibleItems = null;
+  }
+  /**
+   * Invalidate the visible-items cache. Call after any expand/collapse or structural change.
+   * @internal
+   */
+  _invalidateVisibleItemsCache() {
+    this._cachedVisibleItems = null;
   }
   // ─── Internal Helpers ───
   /**
    * Returns a flat ordered list of all visible (not inside a collapsed item) hx-tree-items
-   * in depth-first order.
+   * in depth-first order. Result is cached; invalidated on expand/collapse/slotchange.
    */
   /** @internal */
   _getVisibleItems() {
-    return this._collectVisibleItems(this);
+    return this._cachedVisibleItems || (this._cachedVisibleItems = this._collectVisibleItems(this)), this._cachedVisibleItems;
   }
   /** @internal */
   _collectVisibleItems(e) {
     const t = [];
-    for (const r of Array.from(e.children))
-      if (r.tagName.toLowerCase() === "hx-tree-item") {
-        const s = r;
+    for (const i of Array.from(e.children))
+      if (i.tagName.toLowerCase() === "hx-tree-item") {
+        const s = i;
         t.push(s), s.expanded && t.push(...this._collectVisibleItems(s));
       } else
-        t.push(...this._collectVisibleItems(r));
+        t.push(...this._collectVisibleItems(i));
     return t;
   }
   /** @internal */
@@ -64,8 +72,8 @@ let d = class extends g {
    */
   /** @internal */
   _updateRovingTabindex(e, t) {
-    e.forEach((r, s) => {
-      r.setRovingActive(s === t);
+    e.forEach((i, s) => {
+      i.setRovingActive(s === t);
     });
   }
   /** @internal */
@@ -73,63 +81,63 @@ let d = class extends g {
     var s;
     const t = this._getVisibleItems();
     if (t.length === 0) return;
-    const r = Math.max(0, Math.min(e, t.length - 1));
-    this._currentIndex = r, this._updateRovingTabindex(t, r), (s = t[r]) == null || s.focus();
+    const i = Math.max(0, Math.min(e, t.length - 1));
+    this._currentIndex = i, this._updateRovingTabindex(t, i), (s = t[i]) == null || s.focus();
   }
   // ─── Event Handling ───
   /** @internal */
   _handleTreeItemSelect(e) {
     if (!(e instanceof CustomEvent)) return;
-    const r = e.detail.item;
+    const i = e.detail.item;
     if (this.selection !== "none") {
       if (this.selection === "single") {
-        const s = r.selected;
-        this._getSelectedItems().forEach((i) => {
-          i.selected = !1;
-        }), r.selected = !s;
-      } else this.selection === "multiple" && (r.selected = !r.selected);
+        const s = i.selected;
+        this._getSelectedItems().forEach((r) => {
+          r.selected = !1;
+        }), i.selected = !s;
+      } else this.selection === "multiple" && (i.selected = !i.selected);
       this.dispatchEvent(
         new CustomEvent("hx-select", {
           bubbles: !0,
           composed: !0,
-          detail: { item: r, selected: r.selected }
+          detail: { item: i, selected: i.selected }
         })
       );
     }
   }
   /** @internal */
   _handleKeyDown(e) {
-    var i, l, h;
+    var r, n, o;
     const t = this._getVisibleItems();
     if (t.length === 0) return;
-    let r = this._currentIndex;
+    let i = this._currentIndex;
     const s = document.activeElement;
     for (let a = 0; a < t.length; a++)
-      if (t[a] === s || (l = (i = t[a]) == null ? void 0 : i.shadowRoot) != null && l.activeElement) {
-        r = a;
+      if (t[a] === s || (n = (r = t[a]) == null ? void 0 : r.shadowRoot) != null && n.activeElement) {
+        i = a;
         break;
       }
     switch (e.key) {
       case "ArrowDown": {
         e.preventDefault();
-        const a = r < t.length - 1 ? r + 1 : 0;
+        const a = i < t.length - 1 ? i + 1 : 0;
         this._focusItem(a);
         break;
       }
       case "ArrowUp": {
         e.preventDefault();
-        const a = r > 0 ? r - 1 : t.length - 1;
+        const a = i > 0 ? i - 1 : t.length - 1;
         this._focusItem(a);
         break;
       }
       case "ArrowLeft": {
         e.preventDefault();
-        const a = t[r];
+        const a = t[i];
         if (!a) break;
         if (a.expanded && a.hasChildItems)
-          a.expanded = !1;
+          a.expanded = !1, this._invalidateVisibleItemsCache();
         else {
-          const u = (h = a.parentElement) == null ? void 0 : h.closest("hx-tree-item");
+          const u = (o = a.parentElement) == null ? void 0 : o.closest("hx-tree-item");
           if (u) {
             const v = t.indexOf(u);
             v >= 0 && this._focusItem(v);
@@ -139,9 +147,9 @@ let d = class extends g {
       }
       case "ArrowRight": {
         e.preventDefault();
-        const a = t[r];
+        const a = t[i];
         if (!a) break;
-        a.hasChildItems && (a.expanded ? this._focusItem(r + 1) : a.expanded = !0);
+        a.hasChildItems && (a.expanded ? this._focusItem(i + 1) : (a.expanded = !0, this._invalidateVisibleItemsCache()));
         break;
       }
       case "Home": {
@@ -152,20 +160,59 @@ let d = class extends g {
         e.preventDefault(), this._focusItem(t.length - 1);
         break;
       }
+      default: {
+        if (e.key.length === 1) {
+          e.preventDefault();
+          const a = this._findTypeaheadMatch(e.key.toLowerCase(), i);
+          a !== -1 && this._focusItem(a);
+        }
+        break;
+      }
+    }
+  }
+  /**
+   * Finds the next visible item (starting after `currentIndex`, wrapping around) whose
+   * label text begins with the given lowercase character. Returns -1 if no match.
+   * @internal
+   */
+  _findTypeaheadMatch(e, t) {
+    const i = this._getVisibleItems();
+    if (i.length === 0) return -1;
+    for (let s = 1; s <= i.length; s++) {
+      const r = (t + s) % i.length, n = i[r];
+      if (n && n.labelText.toLowerCase().startsWith(e))
+        return r;
     }
+    return -1;
   }
   /** @internal */
   _handleFocusIn(e) {
     e.target === e.currentTarget && this._getVisibleItems().length > 0 && this._focusItem(this._currentIndex);
   }
+  /**
+   * Compute and push ARIA position metadata (level, posInSet, setSize, selectable) to all
+   * direct hx-tree-item children of a container in a single O(n) pass.
+   * Each item also recurses for its own children, building the full tree in O(total-items) total.
+   * @internal
+   */
+  _updateAriaMetadataForContainer(e, t) {
+    const i = this.selection === "single" || this.selection === "multiple", s = Array.from(e.children).filter(
+      (n) => n.tagName.toLowerCase() === "hx-tree-item"
+    ), r = s.length;
+    s.forEach((n, o) => {
+      n.setAriaMetadata(t, o + 1, r, i), this._updateAriaMetadataForContainer(n, t + 1);
+    });
+  }
   /**
    * Initializes the roving tabindex after items are first slotted in.
    * Ensures the active item (index 0 by default) has tabindex="0" from the start,
    * so a Tab into the tree lands directly on the first item without a redirect.
    * Also updates `_hasVisibleItems` so the container tabindex re-renders correctly.
+   * Pushes O(n) ARIA metadata to all items to replace the O(n^2) per-item ancestor walk.
    */
   /** @internal */
   _handleSlotChange() {
+    this._invalidateVisibleItemsCache(), this._updateAriaMetadataForContainer(this, 1);
     const e = this._getVisibleItems();
     if (this._hasVisibleItems = e.length > 0, e.length === 0) return;
     const t = Math.min(this._currentIndex, e.length - 1);
@@ -178,14 +225,14 @@ let d = class extends g {
   // ─── Render ───
   render() {
     const e = this._hasVisibleItems ? "-1" : "0";
-    return f`
+    return x`
       <div
         part="tree"
         class="tree"
         role="tree"
         tabindex=${e}
         aria-label=${this.label || "Tree"}
-        aria-multiselectable=${this.selection === "multiple" ? "true" : "false"}
+        aria-multiselectable=${this.selection === "none" ? p : this.selection === "multiple" ? "true" : "false"}
         @hx-tree-item-select=${this._handleTreeItemSelect}
         @keydown=${this._handleKeyDown}
         @focusin=${this._handleFocusIn}
@@ -195,23 +242,23 @@ let d = class extends g {
     `;
   }
 };
-d.styles = [y, C];
-m([
-  p({ type: String, reflect: !0 })
+d.styles = [I];
+f([
+  m({ type: String, reflect: !0 })
 ], d.prototype, "label", 2);
-m([
-  p({ type: String, reflect: !0 })
+f([
+  m({ type: String, reflect: !0 })
 ], d.prototype, "selection", 2);
-m([
+f([
   c()
 ], d.prototype, "_currentIndex", 2);
-m([
+f([
   c()
 ], d.prototype, "_hasVisibleItems", 2);
-d = m([
-  _("hx-tree-view")
+d = f([
+  g("hx-tree-view")
 ], d);
-const E = b`
+const S = b`
   :host {
     display: block;
     contain: layout style;
@@ -235,7 +282,7 @@ const E = b`
     gap: var(--hx-tree-item-gap, var(--hx-space-2, 0.5rem));
     padding: var(--hx-tree-item-padding-y, var(--hx-space-1, 0.25rem))
       var(--hx-tree-item-padding-x, var(--hx-space-2, 0.5rem));
-    padding-left: calc(
+    padding-inline-start: calc(
       var(--hx-tree-item-padding-x, var(--hx-space-2, 0.5rem)) + var(--_indent-level, 0) *
         var(--hx-tree-indent-size, 1.5rem)
     );
@@ -274,7 +321,7 @@ const E = b`
   /* ─── Disabled State ─── */
 
   :host([disabled]) .item-row {
-    opacity: 0.4;
+    opacity: var(--hx-opacity-disabled, 0.5);
     cursor: not-allowed;
     pointer-events: none;
   }
@@ -389,12 +436,12 @@ const E = b`
     overflow: hidden;
   }
 `;
-var $ = Object.defineProperty, A = Object.getOwnPropertyDescriptor, o = (e, t, r, s) => {
-  for (var i = s > 1 ? void 0 : s ? A(t, r) : t, l = e.length - 1, h; l >= 0; l--)
-    (h = e[l]) && (i = (s ? h(t, r, i) : h(i)) || i);
-  return s && i && $(t, r, i), i;
+var E = Object.defineProperty, $ = Object.getOwnPropertyDescriptor, h = (e, t, i, s) => {
+  for (var r = s > 1 ? void 0 : s ? $(t, i) : t, n = e.length - 1, o; n >= 0; n--)
+    (o = e[n]) && (r = (s ? o(t, i, r) : o(r)) || r);
+  return s && r && E(t, i, r), r;
 };
-let n = class extends g {
+let l = class extends _ {
   constructor() {
     super(...arguments), this.expanded = !1, this.selected = !1, this.disabled = !1, this._hasChildren = !1, this._rovingActive = !1, this._labelText = "", this._level = 1, this._posInSet = 1, this._setSize = 1, this._selectable = !1;
   }
@@ -406,6 +453,13 @@ let n = class extends g {
   get hasChildItems() {
     return this._hasChildren;
   }
+  /**
+   * The text content of the item's label slot, used for typeahead keyboard navigation.
+   * Returns an empty string until the label slot has been assigned.
+   */
+  get labelText() {
+    return this._labelText;
+  }
   /**
    * Recompute all cached ARIA metadata in a single DOM pass.
    * Called on connect, slotchange, and whenever structural context may change.
@@ -416,21 +470,30 @@ let n = class extends g {
     for (; t; )
       t.tagName.toLowerCase() === "hx-tree-item" && e++, t = t.parentElement;
     this._level = e;
-    const r = this.parentElement;
-    if (r) {
-      const i = Array.from(r.children).filter(
-        (l) => l.tagName.toLowerCase() === "hx-tree-item"
+    const i = this.parentElement;
+    if (i) {
+      const r = Array.from(i.children).filter(
+        (n) => n.tagName.toLowerCase() === "hx-tree-item"
       );
-      this._posInSet = i.indexOf(this) + 1, this._setSize = i.length;
+      this._posInSet = r.indexOf(this) + 1, this._setSize = r.length;
     } else
       this._posInSet = 1, this._setSize = 1;
     const s = this.closest("hx-tree-view");
     if (s) {
-      const i = s.getAttribute("selection");
-      this._selectable = i === "single" || i === "multiple";
+      const r = s.getAttribute("selection");
+      this._selectable = r === "single" || r === "multiple";
     } else
       this._selectable = !1;
   }
+  /**
+   * Set ARIA position metadata from the parent hx-tree-view in a single O(n) pass.
+   * Calling this avoids the O(n^2) ancestor-walk + sibling-iteration in _updateAriaMetadata
+   * when the parent already knows the layout.
+   * @internal
+   */
+  setAriaMetadata(e, t, i, s) {
+    this._level = e, this._posInSet = t, this._setSize = i, this._selectable = s;
+  }
   // ─── Lifecycle ───
   connectedCallback() {
     super.connectedCallback(), this._updateAriaMetadata();
@@ -449,8 +512,8 @@ let n = class extends g {
    * @internal
    */
   _handleLabelSlotChange(e) {
-    const r = e.target.assignedNodes({ flatten: !0 });
-    this._labelText = r.map((s) => s.textContent ?? "").join("").trim();
+    const i = e.target.assignedNodes({ flatten: !0 });
+    this._labelText = i.map((s) => s.textContent ?? "").join("").trim();
   }
   // ─── Event Handlers ───
   /**
@@ -513,7 +576,7 @@ let n = class extends g {
    * @internal
    */
   _renderExpandIcon() {
-    return this._hasChildren ? f`
+    return this._hasChildren ? x`
       <button
         part="expand-icon"
         class="expand-btn"
@@ -525,11 +588,11 @@ let n = class extends g {
           <polyline points="6 4 10 8 6 12" />
         </svg>
       </button>
-    ` : f`<span class="expand-placeholder" aria-hidden="true"></span>`;
+    ` : x`<span class="expand-placeholder" aria-hidden="true"></span>`;
   }
   render() {
-    const e = this._hasChildren ? String(this.expanded) : x, t = this._selectable ? String(this.selected) : x;
-    return f`
+    const e = this._hasChildren ? String(this.expanded) : p, t = this._selectable ? String(this.selected) : p;
+    return x`
       <div part="item" class="item">
         <div
           part="row"
@@ -538,7 +601,7 @@ let n = class extends g {
           tabindex=${this._rovingActive ? "0" : "-1"}
           aria-expanded=${e}
           aria-selected=${t}
-          aria-disabled=${this.disabled ? "true" : x}
+          aria-disabled=${this.disabled ? "true" : p}
           aria-level=${this._level}
           aria-posinset=${this._posInSet}
           aria-setsize=${this._setSize}
@@ -555,9 +618,10 @@ let n = class extends g {
         </div>
         <div
           part="children"
-          class=${I({ children: !0, "children--expanded": this.expanded })}
+          class=${w({ children: !0, "children--expanded": this.expanded })}
           role="group"
           aria-label=${this._labelText ? `${this._labelText} children` : "children"}
+          aria-hidden=${!this.expanded || p}
         >
           <div class="children-inner">
             <slot name="children" @slotchange=${this._handleChildrenSlotChange}></slot>
@@ -567,45 +631,45 @@ let n = class extends g {
     `;
   }
 };
-n.styles = [y, E];
-o([
-  p({ type: Boolean, reflect: !0 })
-], n.prototype, "expanded", 2);
-o([
-  p({ type: Boolean, reflect: !0 })
-], n.prototype, "selected", 2);
-o([
-  p({ type: Boolean, reflect: !0 })
-], n.prototype, "disabled", 2);
-o([
+l.styles = [S];
+h([
+  m({ type: Boolean, reflect: !0 })
+], l.prototype, "expanded", 2);
+h([
+  m({ type: Boolean, reflect: !0 })
+], l.prototype, "selected", 2);
+h([
+  m({ type: Boolean, reflect: !0 })
+], l.prototype, "disabled", 2);
+h([
   c()
-], n.prototype, "_hasChildren", 2);
-o([
+], l.prototype, "_hasChildren", 2);
+h([
   c()
-], n.prototype, "_rovingActive", 2);
-o([
+], l.prototype, "_rovingActive", 2);
+h([
   c()
-], n.prototype, "_labelText", 2);
-o([
+], l.prototype, "_labelText", 2);
+h([
   c()
-], n.prototype, "_level", 2);
-o([
+], l.prototype, "_level", 2);
+h([
   c()
-], n.prototype, "_posInSet", 2);
-o([
+], l.prototype, "_posInSet", 2);
+h([
   c()
-], n.prototype, "_setSize", 2);
-o([
+], l.prototype, "_setSize", 2);
+h([
   c()
-], n.prototype, "_selectable", 2);
-o([
-  w(".item-row")
-], n.prototype, "_itemRowEl", 2);
-n = o([
-  _("hx-tree-item")
-], n);
+], l.prototype, "_selectable", 2);
+h([
+  y(".item-row")
+], l.prototype, "_itemRowEl", 2);
+l = h([
+  g("hx-tree-item")
+], l);
 export {
-  n as H,
+  l as H,
   d as a
 };
-//# sourceMappingURL=hx-tree-item-BP6UF_H1.js.map
+//# sourceMappingURL=hx-tree-item-CPQ9dJiK.js.map

package/dist/shared/hx-tree-item-CPQ9dJiK.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hx-tree-item-CPQ9dJiK.js","sources":["../../src/components/hx-tree-view/hx-tree-view.styles.ts","../../src/components/hx-tree-view/hx-tree-view.ts","../../src/components/hx-tree-view/hx-tree-item.styles.ts","../../src/components/hx-tree-view/hx-tree-item.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const helixTreeViewStyles = css`\n  :host {\n    display: block;\n    contain: layout style;\n    font-family: var(--hx-tree-font-family, var(--hx-font-family-sans, sans-serif));\n  }\n\n  * {\n    box-sizing: border-box;\n  }\n\n  .tree {\n    display: block;\n    outline: none;\n  }\n\n  .tree:focus-visible {\n    outline: var(--hx-focus-ring-width, 2px) solid\n      var(--hx-focus-ring-color, var(--hx-color-primary-400, #60a5fa));\n    outline-offset: var(--hx-focus-ring-offset, 2px);\n    border-radius: var(--hx-border-radius-sm, 0.25rem);\n  }\n`;\n","import { LitElement, html, nothing } from 'lit';\nimport '../../utilities/document-token-adoption.js';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { helixTreeViewStyles } from './hx-tree-view.styles.js';\nimport type { HelixTreeItem, HxTreeItemSelectDetail } from './hx-tree-item.js';\nimport { devWarn } from '../../utils/dev-warn.js';\n\n/** Selection mode for the tree. */\nexport type TreeSelection = 'none' | 'single' | 'multiple';\n\n/** Detail type for the `hx-select` event. */\nexport interface HxSelectDetail {\n  /** The tree item that was selected or deselected. */\n  item: HelixTreeItem;\n  /** Whether the item is now selected. */\n  selected: boolean;\n}\n\n/**\n * A hierarchical tree component for navigating nested data structures.\n * Used in healthcare applications for org charts, ICD-10 code hierarchies, and department navigation.\n *\n * Implements WAI-ARIA tree view pattern with `role=\"tree\"` on the container\n * and `role=\"treeitem\"` on each item. Supports `aria-label` via the `label` property\n * for screen reader identification. Full keyboard navigation: Arrow keys for movement,\n * Enter/Space for selection, Home/End for first/last item.\n *\n * ## Scale Limits\n *\n * This component renders all tree items simultaneously in the DOM. It is suitable for\n * trees with up to ~500 visible items. For large taxonomies (e.g., ICD-10 with 70,000+\n * codes), use async/lazy loading: only render top-level nodes initially and populate\n * child nodes on `hx-select` or expand events. The component exposes the `expanded`\n * property on `hx-tree-item` for programmatic control of subtrees, enabling consumer-level\n * virtualization strategies without requiring changes to this component.\n *\n * @summary Hierarchical tree view with expand/collapse and keyboard navigation.\n *\n * @tag hx-tree-view\n *\n * @slot - Default slot for hx-tree-item elements.\n *\n * @fires {CustomEvent<HxSelectDetail>} hx-select - Dispatched when a tree item is selected or deselected.\n *\n * @csspart tree - The tree container element with role=\"tree\".\n *\n * @cssprop [--hx-tree-font-family=var(--hx-font-family-sans)] - Tree font family.\n */\n@customElement('hx-tree-view')\nexport class HelixTreeView extends LitElement {\n  static override styles = [helixTreeViewStyles];\n\n  // ─── Properties ───\n\n  /**\n   * Accessible label for the tree. Applied as `aria-label` on the tree container.\n   * Provides context to screen readers about the tree's purpose.\n   * @attr label\n   */\n  @property({ type: String, reflect: true })\n  label = '';\n\n  /**\n   * Selection mode for the tree.\n   * - `none` — items cannot be selected\n   * - `single` — only one item can be selected at a time\n   * - `multiple` — multiple items can be selected\n   * @attr selection\n   */\n  @property({ type: String, reflect: true })\n  selection: 'none' | 'single' | 'multiple' = 'none';\n\n  // ─── Internal State ───\n\n  /** @internal */\n  @state() private _currentIndex = 0;\n\n  /** Tracks whether the tree has any visible items, to decide the container tabindex. */\n  /** @internal */\n  @state() private _hasVisibleItems = false;\n\n  // ─── Visible items cache ───\n\n  /**\n   * Cached flat list of visible items (depth-first, respects collapsed nodes).\n   * Set to null to invalidate; rebuilt on next access.\n   * @internal\n   */\n  private _cachedVisibleItems: HelixTreeItem[] | null = null;\n\n  /**\n   * Invalidate the visible-items cache. Call after any expand/collapse or structural change.\n   * @internal\n   */\n  private _invalidateVisibleItemsCache(): void {\n    this._cachedVisibleItems = null;\n  }\n\n  // ─── Internal Helpers ───\n\n  /**\n   * Returns a flat ordered list of all visible (not inside a collapsed item) hx-tree-items\n   * in depth-first order. Result is cached; invalidated on expand/collapse/slotchange.\n   */\n  /** @internal */\n  private _getVisibleItems(): HelixTreeItem[] {\n    if (!this._cachedVisibleItems) {\n      this._cachedVisibleItems = this._collectVisibleItems(this);\n    }\n    return this._cachedVisibleItems;\n  }\n\n  /** @internal */\n  private _collectVisibleItems(container: Element): HelixTreeItem[] {\n    const items: HelixTreeItem[] = [];\n    for (const child of Array.from(container.children)) {\n      if (child.tagName.toLowerCase() === 'hx-tree-item') {\n        const item = child as HelixTreeItem;\n        items.push(item);\n        if (item.expanded) {\n          items.push(...this._collectVisibleItems(item));\n        }\n      } else {\n        items.push(...this._collectVisibleItems(child));\n      }\n    }\n    return items;\n  }\n\n  /** @internal */\n  private _getSelectedItems(): HelixTreeItem[] {\n    return Array.from(this.querySelectorAll<HelixTreeItem>('hx-tree-item[selected]'));\n  }\n\n  /**\n   * Updates the roving tabindex across all visible items so that only the\n   * item at `activeIndex` has `tabindex=\"0\"`. All others receive `tabindex=\"-1\"`.\n   * This is called whenever the active item changes (navigation, initial render).\n   */\n  /** @internal */\n  private _updateRovingTabindex(items: HelixTreeItem[], activeIndex: number): void {\n    items.forEach((item, i) => {\n      item.setRovingActive(i === activeIndex);\n    });\n  }\n\n  /** @internal */\n  private _focusItem(index: number): void {\n    const items = this._getVisibleItems();\n    if (items.length === 0) return;\n    const clamped = Math.max(0, Math.min(index, items.length - 1));\n    this._currentIndex = clamped;\n    this._updateRovingTabindex(items, clamped);\n    items[clamped]?.focus();\n  }\n\n  // ─── Event Handling ───\n\n  /** @internal */\n  private _handleTreeItemSelect(e: Event): void {\n    if (!(e instanceof CustomEvent)) return;\n    const event = e as CustomEvent<HxTreeItemSelectDetail>;\n    const item = event.detail.item;\n\n    if (this.selection === 'none') return;\n\n    if (this.selection === 'single') {\n      const wasSelected = item.selected;\n      this._getSelectedItems().forEach((i) => {\n        i.selected = false;\n      });\n      item.selected = !wasSelected;\n    } else if (this.selection === 'multiple') {\n      item.selected = !item.selected;\n    }\n\n    this.dispatchEvent(\n      new CustomEvent<HxSelectDetail>('hx-select', {\n        bubbles: true,\n        composed: true,\n        detail: { item, selected: item.selected },\n      }),\n    );\n  }\n\n  /** @internal */\n  private _handleKeyDown(e: KeyboardEvent): void {\n    const items = this._getVisibleItems();\n    if (items.length === 0) return;\n\n    let currentIndex = this._currentIndex;\n    const focused = document.activeElement;\n\n    for (let i = 0; i < items.length; i++) {\n      if (items[i] === focused || items[i]?.shadowRoot?.activeElement) {\n        currentIndex = i;\n        break;\n      }\n    }\n\n    switch (e.key) {\n      case 'ArrowDown': {\n        e.preventDefault();\n        // Intentional design: wrap-around from last to first item provides\n        // a continuous navigation loop, consistent with the component's\n        // circular keyboard navigation model.\n        const next = currentIndex < items.length - 1 ? currentIndex + 1 : 0;\n        this._focusItem(next);\n        break;\n      }\n      case 'ArrowUp': {\n        e.preventDefault();\n        // Intentional design: wrap-around from first to last item (see ArrowDown note).\n        const prev = currentIndex > 0 ? currentIndex - 1 : items.length - 1;\n        this._focusItem(prev);\n        break;\n      }\n      case 'ArrowLeft': {\n        e.preventDefault();\n        const currentItem = items[currentIndex];\n        if (!currentItem) break;\n        if (currentItem.expanded && currentItem.hasChildItems) {\n          currentItem.expanded = false;\n          this._invalidateVisibleItemsCache();\n        } else {\n          const parentItem = currentItem.parentElement?.closest('hx-tree-item') as\n            | HelixTreeItem\n            | undefined;\n          if (parentItem) {\n            const parentIndex = items.indexOf(parentItem);\n            if (parentIndex >= 0) {\n              this._focusItem(parentIndex);\n            }\n          }\n        }\n        break;\n      }\n      case 'ArrowRight': {\n        e.preventDefault();\n        const currentItem = items[currentIndex];\n        if (!currentItem) break;\n        if (currentItem.hasChildItems) {\n          if (!currentItem.expanded) {\n            currentItem.expanded = true;\n            this._invalidateVisibleItemsCache();\n          } else {\n            this._focusItem(currentIndex + 1);\n          }\n        }\n        break;\n      }\n      case 'Home': {\n        e.preventDefault();\n        this._focusItem(0);\n        break;\n      }\n      case 'End': {\n        e.preventDefault();\n        this._focusItem(items.length - 1);\n        break;\n      }\n      default: {\n        // WAI-ARIA APG typeahead: a printable character moves focus to the next visible\n        // item whose label starts with that character (case-insensitive).\n        if (e.key.length === 1) {\n          e.preventDefault();\n          const matchIndex = this._findTypeaheadMatch(e.key.toLowerCase(), currentIndex);\n          if (matchIndex !== -1) {\n            this._focusItem(matchIndex);\n          }\n        }\n        break;\n      }\n    }\n  }\n\n  /**\n   * Finds the next visible item (starting after `currentIndex`, wrapping around) whose\n   * label text begins with the given lowercase character. Returns -1 if no match.\n   * @internal\n   */\n  private _findTypeaheadMatch(char: string, currentIndex: number): number {\n    const items = this._getVisibleItems();\n    if (items.length === 0) return -1;\n    for (let i = 1; i <= items.length; i++) {\n      const index = (currentIndex + i) % items.length;\n      const item = items[index];\n      if (item && item.labelText.toLowerCase().startsWith(char)) {\n        return index;\n      }\n    }\n    return -1;\n  }\n\n  /** @internal */\n  private _handleFocusIn(e: FocusEvent): void {\n    // With roving tabindex, the tree container (tabindex=\"-1\") should only receive\n    // focus when the tree is empty. If focus does land on the container (e.g. the\n    // tree is empty or programmatic focus), redirect to the active item if present.\n    if (e.target === e.currentTarget) {\n      const items = this._getVisibleItems();\n      if (items.length > 0) {\n        this._focusItem(this._currentIndex);\n      }\n    }\n  }\n\n  /**\n   * Compute and push ARIA position metadata (level, posInSet, setSize, selectable) to all\n   * direct hx-tree-item children of a container in a single O(n) pass.\n   * Each item also recurses for its own children, building the full tree in O(total-items) total.\n   * @internal\n   */\n  private _updateAriaMetadataForContainer(container: Element, level: number): void {\n    const selectable = this.selection === 'single' || this.selection === 'multiple';\n    const children = Array.from(container.children).filter(\n      (c) => c.tagName.toLowerCase() === 'hx-tree-item',\n    ) as HelixTreeItem[];\n    const setSize = children.length;\n    children.forEach((item, index) => {\n      item.setAriaMetadata(level, index + 1, setSize, selectable);\n      // Recurse into child items so the full tree is updated in one traversal\n      this._updateAriaMetadataForContainer(item, level + 1);\n    });\n  }\n\n  /**\n   * Initializes the roving tabindex after items are first slotted in.\n   * Ensures the active item (index 0 by default) has tabindex=\"0\" from the start,\n   * so a Tab into the tree lands directly on the first item without a redirect.\n   * Also updates `_hasVisibleItems` so the container tabindex re-renders correctly.\n   * Pushes O(n) ARIA metadata to all items to replace the O(n^2) per-item ancestor walk.\n   */\n  /** @internal */\n  private _handleSlotChange(): void {\n    this._invalidateVisibleItemsCache();\n    // Push ARIA metadata from parent in a single O(n) traversal\n    this._updateAriaMetadataForContainer(this, 1);\n    const items = this._getVisibleItems();\n    this._hasVisibleItems = items.length > 0;\n    if (items.length === 0) return;\n    // Clamp _currentIndex in case items were removed.\n    const clamped = Math.min(this._currentIndex, items.length - 1);\n    this._currentIndex = clamped;\n    this._updateRovingTabindex(items, clamped);\n  }\n\n  // ─── Lifecycle ───\n\n  override firstUpdated(): void {\n    if (!this.label) {\n      devWarn(\n        'hx-tree-view',\n        'No accessible label provided. Set the `label` attribute on hx-tree-view so screen readers can identify this tree (WCAG 4.1.2).',\n      );\n    }\n  }\n\n  // ─── Render ───\n\n  override render() {\n    // Roving tabindex pattern (WCAG 2.4.3 Fix):\n    // The tree container is NOT a Tab stop (tabindex=\"-1\"). Tab focus goes\n    // directly to the active item, which carries tabindex=\"0\". The container\n    // is only a landing target (tabindex=\"0\") when the tree is empty.\n    const containerTabindex = this._hasVisibleItems ? '-1' : '0';\n\n    return html`\n      <div\n        part=\"tree\"\n        class=\"tree\"\n        role=\"tree\"\n        tabindex=${containerTabindex}\n        aria-label=${this.label || 'Tree'}\n        aria-multiselectable=${this.selection === 'none'\n          ? nothing\n          : this.selection === 'multiple'\n            ? 'true'\n            : 'false'}\n        @hx-tree-item-select=${this._handleTreeItemSelect}\n        @keydown=${this._handleKeyDown}\n        @focusin=${this._handleFocusIn}\n      >\n        <slot @slotchange=${this._handleSlotChange}></slot>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'hx-tree-view': HelixTreeView;\n  }\n}\n\n/** Canonical type alias for HelixTreeView. Use this when typing hx-tree-view element references. */\nexport type HxTreeView = HelixTreeView;\n\n/** @deprecated Use {@link HxTreeView} instead. The `Wc` prefix was a legacy naming convention. */\nexport type WcTreeView = HelixTreeView;\n","import { css } from 'lit';\n\nexport const helixTreeItemStyles = css`\n  :host {\n    display: block;\n    contain: layout style;\n  }\n\n  * {\n    box-sizing: border-box;\n  }\n\n  /* ─── Item Container ─── */\n\n  .item {\n    display: block;\n  }\n\n  /* ─── Item Row ─── */\n\n  .item-row {\n    display: flex;\n    align-items: center;\n    gap: var(--hx-tree-item-gap, var(--hx-space-2, 0.5rem));\n    padding: var(--hx-tree-item-padding-y, var(--hx-space-1, 0.25rem))\n      var(--hx-tree-item-padding-x, var(--hx-space-2, 0.5rem));\n    padding-inline-start: calc(\n      var(--hx-tree-item-padding-x, var(--hx-space-2, 0.5rem)) + var(--_indent-level, 0) *\n        var(--hx-tree-indent-size, 1.5rem)\n    );\n    border-radius: var(--hx-tree-item-border-radius, var(--hx-border-radius-sm, 0.25rem));\n    cursor: pointer;\n    outline: none;\n    color: var(--hx-tree-item-color, var(--hx-color-neutral-900, #111827));\n    font-family: var(--hx-tree-item-font-family, var(--hx-font-family-sans, sans-serif));\n    font-size: var(--hx-tree-item-font-size, var(--hx-font-size-sm, 0.875rem));\n    line-height: var(--hx-line-height-normal, 1.5);\n    transition: background-color var(--hx-transition-fast, 150ms ease);\n    user-select: none;\n  }\n\n  .item-row:hover {\n    background-color: var(--hx-tree-item-hover-bg, var(--hx-color-neutral-100, #f3f4f6));\n  }\n\n  .item-row:focus-visible {\n    outline: var(--hx-focus-ring-width, 2px) solid\n      var(--hx-tree-item-focus-ring-color, var(--hx-focus-ring-color, var(--hx-color-primary-500)));\n    outline-offset: var(--hx-focus-ring-offset, -2px);\n  }\n\n  /* ─── Selected State ─── */\n\n  :host([selected]) .item-row {\n    background-color: var(--hx-tree-item-selected-bg, var(--hx-color-primary-100, #dbeafe));\n    color: var(--hx-tree-item-selected-color, var(--hx-color-primary-800, #1e40af));\n  }\n\n  :host([selected]) .item-row:hover {\n    background-color: var(--hx-tree-item-selected-hover-bg, var(--hx-color-primary-200, #bfdbfe));\n  }\n\n  /* ─── Disabled State ─── */\n\n  :host([disabled]) .item-row {\n    opacity: var(--hx-opacity-disabled, 0.5);\n    cursor: not-allowed;\n    pointer-events: none;\n  }\n\n  /* ─── Expand Icon ─── */\n\n  .expand-icon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    width: var(--hx-space-4, 1rem);\n    height: var(--hx-space-4, 1rem);\n  }\n\n  .expand-btn {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: var(--hx-space-4, 1rem);\n    height: var(--hx-space-4, 1rem);\n    padding: 0;\n    border: none;\n    background: transparent;\n    color: var(--hx-tree-item-expand-icon-color, var(--hx-color-neutral-500, #6b7280));\n    cursor: pointer;\n    border-radius: var(--hx-border-radius-sm, 0.25rem);\n    transition: transform var(--hx-transition-fast, 150ms ease);\n    pointer-events: auto;\n  }\n\n  .expand-btn:hover {\n    background-color: var(\n      --hx-tree-item-expand-hover-bg,\n      var(--hx-overlay-black-6, rgba(0, 0, 0, 0.06))\n    );\n  }\n\n  .expand-btn:focus-visible {\n    outline: var(--hx-focus-ring-width, 2px) solid\n      var(--hx-tree-item-focus-ring-color, var(--hx-focus-ring-color, var(--hx-color-primary-500)));\n    outline-offset: var(--hx-focus-ring-offset, 2px);\n  }\n\n  .expand-btn svg {\n    width: var(--hx-space-3, 0.75rem);\n    height: var(--hx-space-3, 0.75rem);\n    stroke: currentColor;\n    fill: none;\n    stroke-width: 2;\n    stroke-linecap: round;\n    stroke-linejoin: round;\n    transition: transform var(--hx-transition-fast, 150ms ease);\n  }\n\n  :host([expanded]) .expand-btn svg {\n    transform: rotate(90deg);\n  }\n\n  .expand-placeholder {\n    display: block;\n    width: var(--hx-space-4, 1rem);\n    flex-shrink: 0;\n  }\n\n  /* ─── Icon Slot ─── */\n\n  .item-icon {\n    display: flex;\n    align-items: center;\n    flex-shrink: 0;\n    color: var(--hx-tree-item-icon-color, var(--hx-color-neutral-500, #6b7280));\n  }\n\n  .item-icon:empty {\n    display: none;\n  }\n\n  /* ─── Label ─── */\n\n  .item-label {\n    flex: 1;\n    min-width: 0;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  /* ─── Children (animated) ─── */\n\n  .children {\n    display: grid;\n    grid-template-rows: 0fr;\n    transition: grid-template-rows var(--hx-transition-base, 200ms ease);\n    --_indent-level: calc(var(--_indent-level, 0) + 1);\n  }\n\n  .children--expanded {\n    grid-template-rows: 1fr;\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    .item-row,\n    .expand-btn,\n    .expand-btn svg,\n    .children {\n      transition: none;\n    }\n  }\n\n  .children-inner {\n    overflow: hidden;\n  }\n`;\n","import { LitElement, html, nothing } from 'lit';\nimport '../../utilities/document-token-adoption.js';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { helixTreeItemStyles } from './hx-tree-item.styles.js';\n\n/** Detail type for the `hx-tree-item-select` event. */\nexport interface HxTreeItemSelectDetail {\n  /** The tree item that was selected or activated. */\n  item: HelixTreeItem;\n}\n\n/**\n * A tree item used within an hx-tree-view component.\n * Supports expand/collapse, selection, keyboard navigation, and icon/children slots.\n *\n * @summary Individual item within an hx-tree-view hierarchical tree.\n *\n * @tag hx-tree-item\n *\n * @slot - Default slot for the item label content. This text is also used to label the children group.\n * @slot icon - Custom icon shown before the label.\n * @slot children - Nested hx-tree-item elements for sub-tree.\n *\n * @csspart item - The outer item container.\n * @csspart row - The interactive item row (contains expand icon, icon slot, and label).\n * @csspart expand-icon - The expand/collapse toggle button.\n * @csspart label - The label text content area.\n * @csspart children - The children container.\n *\n * @cssprop [--hx-tree-item-color=var(--hx-color-neutral-900)] - Item text color.\n * @cssprop [--hx-tree-item-hover-bg=var(--hx-color-neutral-100)] - Hover background color.\n * @cssprop [--hx-tree-item-selected-bg=var(--hx-color-primary-100)] - Selected background color.\n * @cssprop [--hx-tree-item-selected-color=var(--hx-color-primary-800)] - Selected text color.\n * @cssprop [--hx-tree-item-padding-x=var(--hx-space-2)] - Horizontal padding.\n * @cssprop [--hx-tree-item-padding-y=var(--hx-space-1)] - Vertical padding.\n * @cssprop [--hx-tree-indent-size=1.5rem] - Indentation size per level.\n *\n * @fires {CustomEvent<HxTreeItemSelectDetail>} hx-tree-item-select - Dispatched when this item is clicked or activated via keyboard.\n */\n@customElement('hx-tree-item')\nexport class HelixTreeItem extends LitElement {\n  static override styles = [helixTreeItemStyles];\n\n  // ─── Properties ───\n\n  /**\n   * Whether the item is expanded (showing children).\n   * @attr expanded\n   */\n  @property({ type: Boolean, reflect: true })\n  expanded = false;\n\n  /**\n   * Whether the item is selected.\n   * @attr selected\n   */\n  @property({ type: Boolean, reflect: true })\n  selected = false;\n\n  /**\n   * Whether the item is disabled (non-interactive).\n   * @attr disabled\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  // ─── Internal State ───\n\n  /**\n   * Tracks whether any elements are assigned to the children slot, controlling expand icon visibility.\n   * @internal\n   */\n  @state() private _hasChildren = false;\n\n  /**\n   * Whether this item is the roving-tabindex active item in the tree.\n   * @internal\n   */\n  @state() private _rovingActive = false;\n\n  /**\n   * Text content from the default slot, used to label the children group for screen readers.\n   * @internal\n   */\n  @state() private _labelText = '';\n\n  /**\n   * Cached ARIA position metadata. Computed once on connect and on slotchange\n   * of the parent container, avoiding repeated DOM traversal on every render.\n   * @internal\n   */\n  @state() private _level = 1;\n  /**\n   * One-based position of this item within its sibling set, set as aria-posinset.\n   * @internal\n   */\n  @state() private _posInSet = 1;\n  /**\n   * Total count of sibling hx-tree-item elements at the same level, set as aria-setsize.\n   * @internal\n   */\n  @state() private _setSize = 1;\n  /**\n   * Whether the owning hx-tree-view supports item selection (single or multiple mode).\n   * @internal\n   */\n  @state() private _selectable = false;\n\n  /** @internal */\n  @query('.item-row') private _itemRowEl!: HTMLElement | null;\n\n  // ─── Computed ARIA ───\n\n  /**\n   * Whether this item has slotted children.\n   * @returns True if one or more elements are assigned to the children slot.\n   */\n  get hasChildItems(): boolean {\n    return this._hasChildren;\n  }\n\n  /**\n   * The text content of the item's label slot, used for typeahead keyboard navigation.\n   * Returns an empty string until the label slot has been assigned.\n   */\n  get labelText(): string {\n    return this._labelText;\n  }\n\n  /**\n   * Recompute all cached ARIA metadata in a single DOM pass.\n   * Called on connect, slotchange, and whenever structural context may change.\n   * @internal\n   */\n  private _updateAriaMetadata(): void {\n    // Compute nesting level by counting ancestor hx-tree-item elements.\n    let level = 1;\n    let el: Element | null = this.parentElement;\n    while (el) {\n      if (el.tagName.toLowerCase() === 'hx-tree-item') level++;\n      el = el.parentElement;\n    }\n    this._level = level;\n\n    // Compute position-in-set and set-size from sibling hx-tree-item elements.\n    const parent = this.parentElement;\n    if (parent) {\n      const siblings = Array.from(parent.children).filter(\n        (c) => c.tagName.toLowerCase() === 'hx-tree-item',\n      );\n      this._posInSet = siblings.indexOf(this) + 1;\n      this._setSize = siblings.length;\n    } else {\n      this._posInSet = 1;\n      this._setSize = 1;\n    }\n\n    // Determine if the owning tree supports selection.\n    const tree = this.closest('hx-tree-view');\n    if (tree) {\n      const selection = tree.getAttribute('selection');\n      this._selectable = selection === 'single' || selection === 'multiple';\n    } else {\n      this._selectable = false;\n    }\n  }\n\n  /**\n   * Set ARIA position metadata from the parent hx-tree-view in a single O(n) pass.\n   * Calling this avoids the O(n^2) ancestor-walk + sibling-iteration in _updateAriaMetadata\n   * when the parent already knows the layout.\n   * @internal\n   */\n  setAriaMetadata(level: number, posInSet: number, setSize: number, selectable: boolean): void {\n    this._level = level;\n    this._posInSet = posInSet;\n    this._setSize = setSize;\n    this._selectable = selectable;\n  }\n\n  // ─── Lifecycle ───\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    this._updateAriaMetadata();\n  }\n\n  // ─── Children Detection ───\n\n  /**\n   * Updates _hasChildren and recomputes ARIA metadata when the children slot assignment changes.\n   * @internal\n   */\n  private _handleChildrenSlotChange(e: Event): void {\n    const slot = e.target as HTMLSlotElement;\n    this._hasChildren = slot.assignedElements().length > 0;\n    this._updateAriaMetadata();\n  }\n\n  /**\n   * Captures the text content from the default (label) slot for use on the children group label.\n   * @internal\n   */\n  private _handleLabelSlotChange(e: Event): void {\n    const slot = e.target as HTMLSlotElement;\n    const nodes = slot.assignedNodes({ flatten: true });\n    this._labelText = nodes\n      .map((n) => n.textContent ?? '')\n      .join('')\n      .trim();\n  }\n\n  // ─── Event Handlers ───\n\n  /**\n   * Toggles the expanded state when the expand/collapse button is clicked, stopping event propagation.\n   * @internal\n   */\n  private _handleExpandClick(e: Event): void {\n    e.stopPropagation();\n    if (this.disabled) return;\n    this.expanded = !this.expanded;\n  }\n\n  /**\n   * Dispatches the hx-tree-item-select event when the item is activated via click or keyboard.\n   * @internal\n   */\n  private _handleRowClick(): void {\n    if (this.disabled) return;\n    this.dispatchEvent(\n      new CustomEvent<HxTreeItemSelectDetail>('hx-tree-item-select', {\n        bubbles: true,\n        composed: true,\n        detail: { item: this },\n      }),\n    );\n  }\n\n  /**\n   * Handles keyboard interaction for the tree item, including expand/collapse, activation, and delegation of list-navigation keys to the parent tree.\n   * @internal\n   */\n  private _handleKeyDown(e: KeyboardEvent): void {\n    if (this.disabled) return;\n\n    switch (e.key) {\n      case 'ArrowRight':\n        e.preventDefault();\n        if (this._hasChildren && !this.expanded) {\n          this.expanded = true;\n        }\n        break;\n      case 'ArrowLeft':\n        e.preventDefault();\n        if (this._hasChildren && this.expanded) {\n          this.expanded = false;\n        }\n        break;\n      case 'Enter':\n      case ' ':\n        e.preventDefault();\n        this._handleRowClick();\n        break;\n      case 'ArrowDown':\n      case 'ArrowUp':\n      case 'Home':\n      case 'End':\n        // Bubble up to hx-tree-view for navigation\n        break;\n    }\n  }\n\n  // ─── Public API ───\n\n  /**\n   * Sets the roving tabindex state for this item.\n   * When `active` is true, the item row gets `tabindex=\"0\"` making it the\n   * Tab-reachable item in the tree. All other items should be set to false.\n   * Called by the parent hx-tree-view to manage the roving tabindex pattern.\n   */\n  setRovingActive(active: boolean): void {\n    this._rovingActive = active;\n  }\n\n  /** Focus this item's interactive row element. */\n  override focus(): void {\n    this._itemRowEl?.focus();\n  }\n\n  // ─── Render ───\n\n  /**\n   * Renders the expand/collapse chevron button, or a placeholder span when the item has no children.\n   * @internal\n   */\n  private _renderExpandIcon() {\n    if (!this._hasChildren) {\n      return html`<span class=\"expand-placeholder\" aria-hidden=\"true\"></span>`;\n    }\n    return html`\n      <button\n        part=\"expand-icon\"\n        class=\"expand-btn\"\n        tabindex=\"-1\"\n        aria-label=\"${this.expanded ? 'Collapse' : 'Expand'}\"\n        @click=${this._handleExpandClick}\n      >\n        <svg viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n          <polyline points=\"6 4 10 8 6 12\" />\n        </svg>\n      </button>\n    `;\n  }\n\n  override render() {\n    const ariaExpanded = this._hasChildren ? String(this.expanded) : nothing;\n    const ariaSelected = this._selectable ? String(this.selected) : nothing;\n\n    return html`\n      <div part=\"item\" class=\"item\">\n        <div\n          part=\"row\"\n          class=\"item-row\"\n          role=\"treeitem\"\n          tabindex=${this._rovingActive ? '0' : '-1'}\n          aria-expanded=${ariaExpanded}\n          aria-selected=${ariaSelected}\n          aria-disabled=${this.disabled ? 'true' : nothing}\n          aria-level=${this._level}\n          aria-posinset=${this._posInSet}\n          aria-setsize=${this._setSize}\n          @click=${this._handleRowClick}\n          @keydown=${this._handleKeyDown}\n        >\n          ${this._renderExpandIcon()}\n          <span class=\"item-icon\">\n            <slot name=\"icon\"></slot>\n          </span>\n          <span part=\"label\" class=\"item-label\">\n            <slot @slotchange=${this._handleLabelSlotChange}></slot>\n          </span>\n        </div>\n        <div\n          part=\"children\"\n          class=${classMap({ children: true, 'children--expanded': this.expanded })}\n          role=\"group\"\n          aria-label=${this._labelText ? `${this._labelText} children` : 'children'}\n          aria-hidden=${!this.expanded || nothing}\n        >\n          <div class=\"children-inner\">\n            <slot name=\"children\" @slotchange=${this._handleChildrenSlotChange}></slot>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'hx-tree-item': HelixTreeItem;\n  }\n}\n\n/** Canonical type alias for HelixTreeItem. Use this when typing hx-tree-item element references. */\nexport type HxTreeItem = HelixTreeItem;\n\n/** @deprecated Use {@link HxTreeItem} instead. The `Wc` prefix was a legacy naming convention. */\nexport type WcTreeItem = HelixTreeItem;\n"],"names":["helixTreeViewStyles","css","HelixTreeView","LitElement","container","items","child","item","activeIndex","i","index","clamped","_a","wasSelected","currentIndex","focused","_b","next","prev","currentItem","parentItem","_c","parentIndex","matchIndex","char","level","selectable","children","c","setSize","containerTabindex","html","nothing","__decorateClass","property","state","customElement","helixTreeItemStyles","HelixTreeItem","el","parent","siblings","tree","selection","posInSet","slot","nodes","n","active","ariaExpanded","ariaSelected","classMap","query"],"mappings":"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"}

package/dist/shared/{hx-visually-hidden-CCTQTjbR.js → hx-visually-hidden-vKX8QjeX.js}

@@ -1,7 +1,7 @@
 import { css as l, LitElement as m, html as c } from "lit";
+import "./document-token-adoption-DuYNKd4k.js";
 import { property as h, customElement as u } from "lit/decorators.js";
-import { tokenStyles as d } from "@helixui/tokens/lit";
-const f = l`
+const d = l`
   :host {
     position: absolute !important;
     width: 1px !important;
@@ -28,12 +28,12 @@ const f = l`
     border: 0 !important;
   }
 `;
-var b = Object.defineProperty, v = Object.getOwnPropertyDescriptor, s = (n, o, i, r) => {
-  for (var t = r > 1 ? void 0 : r ? v(o, i) : o, p = n.length - 1, a; p >= 0; p--)
-    (a = n[p]) && (t = (r ? a(o, i, t) : a(t)) || t);
-  return r && t && b(o, i, t), t;
+var f = Object.defineProperty, b = Object.getOwnPropertyDescriptor, s = (n, o, e, r) => {
+  for (var t = r > 1 ? void 0 : r ? b(o, e) : o, p = n.length - 1, a; p >= 0; p--)
+    (a = n[p]) && (t = (r ? a(o, e, t) : a(t)) || t);
+  return r && t && f(o, e, t), t;
 };
-let e = class extends m {
+let i = class extends m {
   constructor() {
     super(...arguments), this.focusable = !1;
   }
@@ -41,14 +41,14 @@ let e = class extends m {
     return c`<span part="base"><slot></slot></span>`;
   }
 };
-e.styles = [d, f];
+i.styles = [d];
 s([
   h({ type: Boolean, reflect: !0 })
-], e.prototype, "focusable", 2);
-e = s([
+], i.prototype, "focusable", 2);
+i = s([
   u("hx-visually-hidden")
-], e);
+], i);
 export {
-  e as H
+  i as H
 };
-//# sourceMappingURL=hx-visually-hidden-CCTQTjbR.js.map
+//# sourceMappingURL=hx-visually-hidden-vKX8QjeX.js.map