@deepfuture/dui-cdn 1.2.0 → 1.3.0

package/dui.js

@@ -18924,12 +18924,799 @@ var DuiTooltipTrigger = class extends DuiTooltipTriggerPrimitive {
 };
 customElements.define(DuiTooltipTrigger.tagName, DuiTooltipTrigger);
 
-// ../dui-primitives/packages/primitives/src/trunc/trunc.ts
+// ../dui-primitives/packages/primitives/src/tree/tree-context.ts
+var treeContext = n8(Symbol("dui-tree"));
+
+// ../dui-primitives/packages/primitives/src/tree/tree-item.ts
+var loadChildrenEvent = customEvent(
+  "dui-load-children",
+  { bubbles: true, composed: true }
+);
 var styles144 = i5`
   :host {
     display: block;
   }
 
+  [part="root"] {
+    outline: none;
+  }
+
+  [part="content"] {
+    display: flex;
+    align-items: center;
+  }
+
+  [part="indicator"] {
+    display: inline-flex;
+    flex-shrink: 0;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .spacer {
+    flex: 1;
+    min-width: 0;
+  }
+
+  [part="group"][hidden] {
+    display: none;
+  }
+`;
+var _hasSlottedChildren_dec, __ctx_dec23, _loading_dec, _hasChildren_dec, _disabled_dec30, _value_dec24, _a61, _init61, _value24, _disabled30, _hasChildren, _loading, __ctx23, _hasSlottedChildren, _b40, hasSlottedChildren_get, hasSlottedChildren_set, _DuiTreeItemPrimitive_instances, _hasFiredLoad, level_get, isExpanded_get, isSelected_get2, isDisabled_get7, isFocused_get, siblings_get, reflect_fn, _onSlotChange, _onRowClick, _onIndicatorClick;
+var DuiTreeItemPrimitive = class extends (_a61 = i8, _value_dec24 = [n7()], _disabled_dec30 = [n7({ type: Boolean, reflect: true })], _hasChildren_dec = [n7({ type: Boolean, attribute: "has-children", reflect: true })], _loading_dec = [n7({ type: Boolean, reflect: true })], __ctx_dec23 = [c7({ context: treeContext, subscribe: true }), r8()], _hasSlottedChildren_dec = [r8()], _a61) {
+  constructor() {
+    super(...arguments);
+    __privateAdd(this, _DuiTreeItemPrimitive_instances);
+    __privateAdd(this, _value24, __runInitializers(_init61, 8, this, "")), __runInitializers(_init61, 11, this);
+    __privateAdd(this, _disabled30, __runInitializers(_init61, 12, this, false)), __runInitializers(_init61, 15, this);
+    __privateAdd(this, _hasChildren, __runInitializers(_init61, 16, this, false)), __runInitializers(_init61, 19, this);
+    __privateAdd(this, _loading, __runInitializers(_init61, 20, this, false)), __runInitializers(_init61, 23, this);
+    __privateAdd(this, __ctx23, __runInitializers(_init61, 24, this)), __runInitializers(_init61, 27, this);
+    __privateAdd(this, _hasSlottedChildren, __runInitializers(_init61, 28, this, false)), __runInitializers(_init61, 31, this);
+    // Tracks whether we've already fired dui-load-children for this expansion.
+    // Reset when the branch collapses so re-expanding can re-fire if children
+    // are still empty (e.g. previous load failed).
+    __privateAdd(this, _hasFiredLoad, false);
+    // ─── Event handlers ───────────────────────────────────────────────────────
+    __privateAdd(this, _onSlotChange, (e11) => {
+      const slot = e11.target;
+      const has = slot.assignedElements().some((el) => el.tagName === "DUI-TREE-ITEM");
+      if (has !== __privateGet(this, _DuiTreeItemPrimitive_instances, hasSlottedChildren_get)) {
+        __privateSet(this, _DuiTreeItemPrimitive_instances, has, hasSlottedChildren_set);
+      }
+    });
+    /**
+     * Row click. Stops propagation so a click on a nested item doesn't bubble
+     * to ancestor items' click handlers (which would also activate them).
+     */
+    __privateAdd(this, _onRowClick, (e11) => {
+      e11.stopPropagation();
+      if (__privateGet(this, _DuiTreeItemPrimitive_instances, isDisabled_get7)) return;
+      this._ctx?.activate(this.value, this.isBranch);
+    });
+    /**
+     * Indicator click. Branches: stop propagation + toggle expand. Leaves:
+     * let it bubble to the row handler (treat as row click).
+     */
+    __privateAdd(this, _onIndicatorClick, (e11) => {
+      if (!this.isBranch) return;
+      e11.stopPropagation();
+      if (__privateGet(this, _DuiTreeItemPrimitive_instances, isDisabled_get7)) return;
+      this._ctx?.toggleExpand(this.value);
+    });
+  }
+  /**
+   * Public: whether this item is treated as a branch — either has slotted
+   * `<dui-tree-item>` children OR has `has-children` set for lazy loading.
+   * Used by the parent tree for keyboard nav and ARIA.
+   */
+  get isBranch() {
+    return __privateGet(this, _DuiTreeItemPrimitive_instances, hasSlottedChildren_get) || this.hasChildren;
+  }
+  // ─── Lifecycle ────────────────────────────────────────────────────────────
+  willUpdate(_changed) {
+    if (this.isBranch && __privateGet(this, _DuiTreeItemPrimitive_instances, isExpanded_get)) {
+      const empty = !__privateGet(this, _DuiTreeItemPrimitive_instances, hasSlottedChildren_get);
+      if (empty && !__privateGet(this, _hasFiredLoad)) {
+        __privateSet(this, _hasFiredLoad, true);
+        this.dispatchEvent(loadChildrenEvent({ value: this.value }));
+      }
+    } else if (!__privateGet(this, _DuiTreeItemPrimitive_instances, isExpanded_get)) {
+      __privateSet(this, _hasFiredLoad, false);
+    }
+  }
+  updated() {
+    this.style.setProperty("--dui-tree-level", String(__privateGet(this, _DuiTreeItemPrimitive_instances, level_get)));
+    __privateMethod(this, _DuiTreeItemPrimitive_instances, reflect_fn).call(this, "data-expanded", __privateGet(this, _DuiTreeItemPrimitive_instances, isExpanded_get) && this.isBranch);
+    __privateMethod(this, _DuiTreeItemPrimitive_instances, reflect_fn).call(this, "data-selected", __privateGet(this, _DuiTreeItemPrimitive_instances, isSelected_get2));
+    __privateMethod(this, _DuiTreeItemPrimitive_instances, reflect_fn).call(this, "data-disabled", __privateGet(this, _DuiTreeItemPrimitive_instances, isDisabled_get7));
+    __privateMethod(this, _DuiTreeItemPrimitive_instances, reflect_fn).call(this, "data-branch", this.isBranch);
+    __privateMethod(this, _DuiTreeItemPrimitive_instances, reflect_fn).call(this, "data-leaf", !this.isBranch);
+    __privateMethod(this, _DuiTreeItemPrimitive_instances, reflect_fn).call(this, "data-focus", __privateGet(this, _DuiTreeItemPrimitive_instances, isFocused_get));
+    __privateMethod(this, _DuiTreeItemPrimitive_instances, reflect_fn).call(this, "data-loading", this.loading);
+    this.setAttribute("data-level", String(__privateGet(this, _DuiTreeItemPrimitive_instances, level_get)));
+    if (this.loading) {
+      this.setAttribute("aria-busy", "true");
+    } else {
+      this.removeAttribute("aria-busy");
+    }
+  }
+  // ─── Render ───────────────────────────────────────────────────────────────
+  render() {
+    const isBranch = this.isBranch;
+    const isExpanded = __privateGet(this, _DuiTreeItemPrimitive_instances, isExpanded_get) && isBranch;
+    const isDisabled = __privateGet(this, _DuiTreeItemPrimitive_instances, isDisabled_get7);
+    const isSelected = __privateGet(this, _DuiTreeItemPrimitive_instances, isSelected_get2);
+    const isFocused = __privateGet(this, _DuiTreeItemPrimitive_instances, isFocused_get);
+    const isLoading = this.loading;
+    const level = __privateGet(this, _DuiTreeItemPrimitive_instances, level_get);
+    const siblings = __privateGet(this, _DuiTreeItemPrimitive_instances, siblings_get);
+    const selectionMode = this._ctx?.selectionMode ?? "none";
+    return b4`
+      <div
+        part="root"
+        role="treeitem"
+        tabindex=${isFocused ? 0 : -1}
+        aria-level=${level}
+        aria-setsize=${siblings.length}
+        aria-posinset=${siblings.indexOf(this) + 1}
+        aria-expanded=${isBranch ? String(isExpanded) : A2}
+        aria-selected=${selectionMode !== "none" ? String(isSelected) : A2}
+        aria-disabled=${isDisabled ? "true" : A2}
+        aria-busy=${isLoading ? "true" : A2}
+        data-level=${level}
+        ?data-expanded=${isExpanded}
+        ?data-selected=${isSelected}
+        ?data-disabled=${isDisabled}
+        ?data-branch=${isBranch}
+        ?data-leaf=${!isBranch}
+        ?data-focus=${isFocused}
+        ?data-loading=${isLoading}
+        @click=${__privateGet(this, _onRowClick)}
+      >
+        <div part="content">
+          <span
+            part="indicator"
+            ?data-branch=${isBranch}
+            ?data-leaf=${!isBranch}
+            ?data-loading=${isLoading}
+            @click=${__privateGet(this, _onIndicatorClick)}
+          ></span>
+          <slot name="label"></slot>
+          <span class="spacer"></span>
+          <slot name="end"></slot>
+        </div>
+        <div
+          part="group"
+          role=${isBranch ? "group" : A2}
+          ?hidden=${!isBranch || !isExpanded}
+        >
+          <slot @slotchange=${__privateGet(this, _onSlotChange)}></slot>
+        </div>
+      </div>
+    `;
+  }
+};
+_init61 = __decoratorStart(_a61);
+_value24 = new WeakMap();
+_disabled30 = new WeakMap();
+_hasChildren = new WeakMap();
+_loading = new WeakMap();
+__ctx23 = new WeakMap();
+_hasSlottedChildren = new WeakMap();
+_DuiTreeItemPrimitive_instances = new WeakSet();
+_hasFiredLoad = new WeakMap();
+level_get = function() {
+  let level = 1;
+  let el = this.parentElement;
+  while (el) {
+    if (el.tagName === "DUI-TREE-ITEM") level++;
+    if (el.tagName === "DUI-TREE") break;
+    el = el.parentElement;
+  }
+  return level;
+};
+isExpanded_get = function() {
+  return this._ctx?.expandedValues.includes(this.value) ?? false;
+};
+isSelected_get2 = function() {
+  return this._ctx?.selectedValues.includes(this.value) ?? false;
+};
+isDisabled_get7 = function() {
+  if (this.disabled) return true;
+  if (this._ctx?.disabled) return true;
+  let el = this.parentElement;
+  while (el) {
+    if (el.tagName === "DUI-TREE") break;
+    if (el.tagName === "DUI-TREE-ITEM" && el.hasAttribute("disabled")) {
+      return true;
+    }
+    el = el.parentElement;
+  }
+  return false;
+};
+isFocused_get = function() {
+  return this._ctx?.focusedValue === this.value;
+};
+siblings_get = function() {
+  return Array.from(this.parentElement?.children ?? []).filter(
+    (el) => el.tagName === "DUI-TREE-ITEM"
+  );
+};
+reflect_fn = function(name, on) {
+  if (on) {
+    if (!this.hasAttribute(name)) this.setAttribute(name, "");
+  } else if (this.hasAttribute(name)) {
+    this.removeAttribute(name);
+  }
+};
+_onSlotChange = new WeakMap();
+_onRowClick = new WeakMap();
+_onIndicatorClick = new WeakMap();
+__decorateElement(_init61, 4, "value", _value_dec24, DuiTreeItemPrimitive, _value24);
+__decorateElement(_init61, 4, "disabled", _disabled_dec30, DuiTreeItemPrimitive, _disabled30);
+__decorateElement(_init61, 4, "hasChildren", _hasChildren_dec, DuiTreeItemPrimitive, _hasChildren);
+__decorateElement(_init61, 4, "loading", _loading_dec, DuiTreeItemPrimitive, _loading);
+__decorateElement(_init61, 4, "_ctx", __ctx_dec23, DuiTreeItemPrimitive, __ctx23);
+_b40 = __decorateElement(_init61, 20, "#hasSlottedChildren", _hasSlottedChildren_dec, _DuiTreeItemPrimitive_instances, _hasSlottedChildren), hasSlottedChildren_get = _b40.get, hasSlottedChildren_set = _b40.set;
+__decoratorMetadata(_init61, DuiTreeItemPrimitive);
+__publicField(DuiTreeItemPrimitive, "tagName", "dui-tree-item");
+__publicField(DuiTreeItemPrimitive, "styles", [base, styles144]);
+
+// ../dui-primitives/packages/primitives/src/tree/tree.ts
+var expandedChangeEvent = customEvent(
+  "dui-expanded-change",
+  { bubbles: true, composed: true }
+);
+var selectionChangeEvent = customEvent(
+  "dui-selection-change",
+  { bubbles: true, composed: true }
+);
+var actionEvent2 = customEvent(
+  "dui-action",
+  { bubbles: true, composed: true }
+);
+var styles145 = i5`
+  :host {
+    display: block;
+  }
+
+  [part="root"] {
+    outline: none;
+  }
+`;
+var __ctx_dec24, _focusedValue_dec, _internalSelected_dec, _internalExpanded_dec, _disabled_dec31, _defaultSelectedValues_dec, _selectedValues_dec, _selectionMode_dec, _defaultExpandedValues_dec, _expandedValues_dec, _a62, _init62, _expandedValues, _defaultExpandedValues, _selectionMode, _selectedValues, _defaultSelectedValues, _disabled31, _internalExpanded, _b41, internalExpanded_get, internalExpanded_set, _DuiTreePrimitive_instances, _internalSelected, _c20, internalSelected_get, internalSelected_set, _focusedValue, _d12, focusedValue_get, focusedValue_set, _typeAheadBuffer, _typeAheadTimeout, _observer, _getExpanded, _getSelected, _toggleExpand, _toggleSelect, _activate, _setFocused, __ctx24, buildContext_fn11, getAllItems_fn, getItem_fn, getVisibleItems_fn2, isVisible_fn, getParentItem_fn, focusItem_fn, findItemFromEvent_fn, _onFocusIn2, _onKeyDown10, expandSiblings_fn, typeAhead_fn;
+var DuiTreePrimitive = class extends (_a62 = i8, _expandedValues_dec = [n7({ type: Array })], _defaultExpandedValues_dec = [n7({ type: Array, attribute: "default-expanded-values" })], _selectionMode_dec = [n7({ attribute: "selection-mode", reflect: true })], _selectedValues_dec = [n7({ type: Array })], _defaultSelectedValues_dec = [n7({ type: Array, attribute: "default-selected-values" })], _disabled_dec31 = [n7({ type: Boolean, reflect: true })], _internalExpanded_dec = [r8()], _internalSelected_dec = [r8()], _focusedValue_dec = [r8()], __ctx_dec24 = [e9({ context: treeContext }), r8()], _a62) {
+  constructor() {
+    super(...arguments);
+    __privateAdd(this, _DuiTreePrimitive_instances);
+    __privateAdd(this, _expandedValues, __runInitializers(_init62, 8, this)), __runInitializers(_init62, 11, this);
+    __privateAdd(this, _defaultExpandedValues, __runInitializers(_init62, 12, this, [])), __runInitializers(_init62, 15, this);
+    __privateAdd(this, _selectionMode, __runInitializers(_init62, 16, this, "none")), __runInitializers(_init62, 19, this);
+    __privateAdd(this, _selectedValues, __runInitializers(_init62, 20, this)), __runInitializers(_init62, 23, this);
+    __privateAdd(this, _defaultSelectedValues, __runInitializers(_init62, 24, this, [])), __runInitializers(_init62, 27, this);
+    __privateAdd(this, _disabled31, __runInitializers(_init62, 28, this, false)), __runInitializers(_init62, 31, this);
+    __privateAdd(this, _internalExpanded, __runInitializers(_init62, 32, this, [])), __runInitializers(_init62, 35, this);
+    __privateAdd(this, _internalSelected, __runInitializers(_init62, 36, this, [])), __runInitializers(_init62, 39, this);
+    __privateAdd(this, _focusedValue, __runInitializers(_init62, 40, this, null)), __runInitializers(_init62, 43, this);
+    // Type-ahead buffer
+    __privateAdd(this, _typeAheadBuffer, "");
+    __privateAdd(this, _typeAheadTimeout, null);
+    // Watches descendant tree-items for `disabled` attr changes (so descendants
+    // re-evaluate their inherited disabled state) and for childList changes (so
+    // initial-focus init catches late-added items, e.g. async-loaded children).
+    __privateAdd(this, _observer, null);
+    // ─── State accessors (controlled vs uncontrolled) ─────────────────────────
+    __privateAdd(this, _getExpanded, () => this.expandedValues ?? __privateGet(this, _DuiTreePrimitive_instances, internalExpanded_get));
+    __privateAdd(this, _getSelected, () => this.selectedValues ?? __privateGet(this, _DuiTreePrimitive_instances, internalSelected_get));
+    // ─── Mutations exposed via context ────────────────────────────────────────
+    __privateAdd(this, _toggleExpand, (value) => {
+      const current = [...__privateGet(this, _getExpanded).call(this)];
+      const idx = current.indexOf(value);
+      const next = idx >= 0 ? current.filter((v4) => v4 !== value) : [...current, value];
+      if (this.expandedValues === void 0) {
+        __privateSet(this, _DuiTreePrimitive_instances, next, internalExpanded_set);
+      }
+      this.dispatchEvent(expandedChangeEvent({ values: next }));
+    });
+    __privateAdd(this, _toggleSelect, (value) => {
+      const current = [...__privateGet(this, _getSelected).call(this)];
+      const idx = current.indexOf(value);
+      let next;
+      if (this.selectionMode === "single") {
+        next = idx >= 0 ? [] : [value];
+      } else {
+        next = idx >= 0 ? current.filter((v4) => v4 !== value) : [...current, value];
+      }
+      if (this.selectedValues === void 0) {
+        __privateSet(this, _DuiTreePrimitive_instances, next, internalSelected_set);
+      }
+      this.dispatchEvent(selectionChangeEvent({ values: next }));
+    });
+    /**
+     * Activate an item:
+     * - selectionMode != "none" → toggle selection (works for branches AND leaves).
+     *   Branches are still expandable via the indicator or Arrow keys.
+     * - selectionMode == "none" + branch → toggle expand.
+     * - selectionMode == "none" + leaf → fire `dui-action`.
+     */
+    __privateAdd(this, _activate, (value, isBranch) => {
+      if (this.disabled) return;
+      if (this.selectionMode !== "none") {
+        __privateGet(this, _toggleSelect).call(this, value);
+      } else if (isBranch) {
+        __privateGet(this, _toggleExpand).call(this, value);
+      } else {
+        this.dispatchEvent(actionEvent2({ value }));
+      }
+    });
+    __privateAdd(this, _setFocused, (value) => {
+      if (__privateGet(this, _DuiTreePrimitive_instances, focusedValue_get) !== value) __privateSet(this, _DuiTreePrimitive_instances, value, focusedValue_set);
+    });
+    __privateAdd(this, __ctx24, __runInitializers(_init62, 44, this, __privateMethod(this, _DuiTreePrimitive_instances, buildContext_fn11).call(this))), __runInitializers(_init62, 47, this);
+    __privateAdd(this, _onFocusIn2, (e11) => {
+      const item = __privateMethod(this, _DuiTreePrimitive_instances, findItemFromEvent_fn).call(this, e11);
+      if (item) __privateGet(this, _setFocused).call(this, item.value);
+    });
+    __privateAdd(this, _onKeyDown10, (e11) => {
+      if (this.disabled) return;
+      const item = __privateMethod(this, _DuiTreePrimitive_instances, findItemFromEvent_fn).call(this, e11);
+      if (!item) return;
+      const visible = __privateMethod(this, _DuiTreePrimitive_instances, getVisibleItems_fn2).call(this);
+      const idx = visible.indexOf(item);
+      switch (e11.key) {
+        case "ArrowDown": {
+          e11.preventDefault();
+          if (idx < visible.length - 1) __privateMethod(this, _DuiTreePrimitive_instances, focusItem_fn).call(this, visible[idx + 1]);
+          break;
+        }
+        case "ArrowUp": {
+          e11.preventDefault();
+          if (idx > 0) __privateMethod(this, _DuiTreePrimitive_instances, focusItem_fn).call(this, visible[idx - 1]);
+          break;
+        }
+        case "ArrowRight": {
+          e11.preventDefault();
+          if (!item.isBranch) break;
+          if (!__privateGet(this, _getExpanded).call(this).includes(item.value)) {
+            __privateGet(this, _toggleExpand).call(this, item.value);
+          } else if (idx < visible.length - 1) {
+            __privateMethod(this, _DuiTreePrimitive_instances, focusItem_fn).call(this, visible[idx + 1]);
+          }
+          break;
+        }
+        case "ArrowLeft": {
+          e11.preventDefault();
+          if (item.isBranch && __privateGet(this, _getExpanded).call(this).includes(item.value)) {
+            __privateGet(this, _toggleExpand).call(this, item.value);
+          } else {
+            const parent = __privateMethod(this, _DuiTreePrimitive_instances, getParentItem_fn).call(this, item);
+            if (parent) __privateMethod(this, _DuiTreePrimitive_instances, focusItem_fn).call(this, parent);
+          }
+          break;
+        }
+        case "Enter":
+        case " ": {
+          e11.preventDefault();
+          if (!item.disabled) __privateGet(this, _activate).call(this, item.value, item.isBranch);
+          break;
+        }
+        case "Home": {
+          e11.preventDefault();
+          if (visible[0]) __privateMethod(this, _DuiTreePrimitive_instances, focusItem_fn).call(this, visible[0]);
+          break;
+        }
+        case "End": {
+          e11.preventDefault();
+          const last = visible[visible.length - 1];
+          if (last) __privateMethod(this, _DuiTreePrimitive_instances, focusItem_fn).call(this, last);
+          break;
+        }
+        case "*": {
+          e11.preventDefault();
+          __privateMethod(this, _DuiTreePrimitive_instances, expandSiblings_fn).call(this, item);
+          break;
+        }
+        default: {
+          if (e11.key.length === 1 && !e11.ctrlKey && !e11.metaKey && !e11.altKey) {
+            __privateMethod(this, _DuiTreePrimitive_instances, typeAhead_fn).call(this, item, e11.key);
+          }
+        }
+      }
+    });
+  }
+  // ─── Lifecycle ────────────────────────────────────────────────────────────
+  connectedCallback() {
+    super.connectedCallback();
+    if (!this.hasAttribute("role")) {
+      this.setAttribute("role", "tree");
+    }
+    if (this.expandedValues === void 0 && this.defaultExpandedValues.length > 0) {
+      __privateSet(this, _DuiTreePrimitive_instances, [...this.defaultExpandedValues], internalExpanded_set);
+    }
+    if (this.selectedValues === void 0 && this.defaultSelectedValues.length > 0) {
+      __privateSet(this, _DuiTreePrimitive_instances, [...this.defaultSelectedValues], internalSelected_set);
+    }
+    this._ctx = __privateMethod(this, _DuiTreePrimitive_instances, buildContext_fn11).call(this);
+    __privateSet(this, _observer, new MutationObserver(() => this.requestUpdate()));
+    __privateGet(this, _observer).observe(this, {
+      childList: true,
+      subtree: true,
+      attributes: true,
+      attributeFilter: ["disabled"]
+    });
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    __privateGet(this, _observer)?.disconnect();
+    __privateSet(this, _observer, null);
+    if (__privateGet(this, _typeAheadTimeout)) clearTimeout(__privateGet(this, _typeAheadTimeout));
+    __privateSet(this, _typeAheadTimeout, null);
+    __privateSet(this, _typeAheadBuffer, "");
+  }
+  willUpdate(changed) {
+    if (this.selectionMode === "multiple") {
+      this.setAttribute("aria-multiselectable", "true");
+    } else {
+      this.removeAttribute("aria-multiselectable");
+    }
+    if (changed.has("selectionMode") && this.selectedValues === void 0) {
+      const current = __privateGet(this, _DuiTreePrimitive_instances, internalSelected_get);
+      if (this.selectionMode === "none" && current.length > 0) {
+        __privateSet(this, _DuiTreePrimitive_instances, [], internalSelected_set);
+      } else if (this.selectionMode === "single" && current.length > 1) {
+        __privateSet(this, _DuiTreePrimitive_instances, [current[0]], internalSelected_set);
+      }
+    }
+    this._ctx = __privateMethod(this, _DuiTreePrimitive_instances, buildContext_fn11).call(this);
+  }
+  updated() {
+    if (__privateGet(this, _DuiTreePrimitive_instances, focusedValue_get) === null) {
+      const first = __privateMethod(this, _DuiTreePrimitive_instances, getVisibleItems_fn2).call(this).find((i13) => !i13.disabled);
+      if (first) __privateSet(this, _DuiTreePrimitive_instances, first.value, focusedValue_set);
+    }
+  }
+  render() {
+    return b4`
+      <div
+        part="root"
+        ?data-disabled=${this.disabled}
+        @keydown=${__privateGet(this, _onKeyDown10)}
+        @focusin=${__privateGet(this, _onFocusIn2)}
+      >
+        <slot></slot>
+      </div>
+    `;
+  }
+};
+_init62 = __decoratorStart(_a62);
+_expandedValues = new WeakMap();
+_defaultExpandedValues = new WeakMap();
+_selectionMode = new WeakMap();
+_selectedValues = new WeakMap();
+_defaultSelectedValues = new WeakMap();
+_disabled31 = new WeakMap();
+_internalExpanded = new WeakMap();
+_DuiTreePrimitive_instances = new WeakSet();
+_internalSelected = new WeakMap();
+_focusedValue = new WeakMap();
+_typeAheadBuffer = new WeakMap();
+_typeAheadTimeout = new WeakMap();
+_observer = new WeakMap();
+_getExpanded = new WeakMap();
+_getSelected = new WeakMap();
+_toggleExpand = new WeakMap();
+_toggleSelect = new WeakMap();
+_activate = new WeakMap();
+_setFocused = new WeakMap();
+__ctx24 = new WeakMap();
+buildContext_fn11 = function() {
+  return {
+    expandedValues: __privateGet(this, _getExpanded).call(this),
+    selectedValues: __privateGet(this, _getSelected).call(this),
+    selectionMode: this.selectionMode,
+    disabled: this.disabled,
+    focusedValue: __privateGet(this, _DuiTreePrimitive_instances, focusedValue_get),
+    toggleExpand: __privateGet(this, _toggleExpand),
+    activate: __privateGet(this, _activate),
+    setFocused: __privateGet(this, _setFocused)
+  };
+};
+// ─── Item discovery (light DOM, document order) ───────────────────────────
+getAllItems_fn = function() {
+  return [
+    ...this.querySelectorAll("dui-tree-item")
+  ];
+};
+getItem_fn = function(value) {
+  return __privateMethod(this, _DuiTreePrimitive_instances, getAllItems_fn).call(this).find((i13) => i13.value === value);
+};
+getVisibleItems_fn2 = function() {
+  return __privateMethod(this, _DuiTreePrimitive_instances, getAllItems_fn).call(this).filter((i13) => __privateMethod(this, _DuiTreePrimitive_instances, isVisible_fn).call(this, i13));
+};
+isVisible_fn = function(item) {
+  let el = item.parentElement;
+  while (el) {
+    if (el === this) return true;
+    if (el instanceof DuiTreeItemPrimitive && !__privateGet(this, _getExpanded).call(this).includes(el.value)) {
+      return false;
+    }
+    el = el.parentElement;
+  }
+  return false;
+};
+getParentItem_fn = function(item) {
+  let el = item.parentElement;
+  while (el) {
+    if (el === this) return null;
+    if (el instanceof DuiTreeItemPrimitive) return el;
+    el = el.parentElement;
+  }
+  return null;
+};
+// ─── Focus management ─────────────────────────────────────────────────────
+focusItem_fn = function(item) {
+  __privateSet(this, _DuiTreePrimitive_instances, item.value, focusedValue_set);
+  const inner = item.shadowRoot?.querySelector(
+    "[part='root']"
+  );
+  inner?.focus();
+};
+// ─── Event handlers ───────────────────────────────────────────────────────
+findItemFromEvent_fn = function(e11) {
+  return e11.composedPath().find(
+    (el) => el instanceof DuiTreeItemPrimitive
+  ) ?? null;
+};
+_onFocusIn2 = new WeakMap();
+_onKeyDown10 = new WeakMap();
+expandSiblings_fn = function(item) {
+  const siblings = Array.from(item.parentElement?.children ?? []).filter(
+    (el) => el instanceof DuiTreeItemPrimitive && el.isBranch && !el.disabled
+  );
+  const current = __privateGet(this, _getExpanded).call(this);
+  const toAdd = siblings.map((s11) => s11.value).filter((v4) => !current.includes(v4));
+  if (toAdd.length === 0) return;
+  const next = [...current, ...toAdd];
+  if (this.expandedValues === void 0) {
+    __privateSet(this, _DuiTreePrimitive_instances, next, internalExpanded_set);
+  }
+  this.dispatchEvent(expandedChangeEvent({ values: next }));
+};
+typeAhead_fn = function(from, char) {
+  __privateSet(this, _typeAheadBuffer, __privateGet(this, _typeAheadBuffer) + char.toLowerCase());
+  if (__privateGet(this, _typeAheadTimeout)) clearTimeout(__privateGet(this, _typeAheadTimeout));
+  __privateSet(this, _typeAheadTimeout, setTimeout(() => {
+    __privateSet(this, _typeAheadBuffer, "");
+    __privateSet(this, _typeAheadTimeout, null);
+  }, 500));
+  const visible = __privateMethod(this, _DuiTreePrimitive_instances, getVisibleItems_fn2).call(this);
+  const fromIdx = visible.indexOf(from);
+  const ordered = [
+    ...visible.slice(fromIdx + 1),
+    ...visible.slice(0, fromIdx + 1)
+  ];
+  const match = ordered.find((it) => {
+    const label = it.querySelector("[slot='label']")?.textContent?.trim().toLowerCase() ?? "";
+    return label.startsWith(__privateGet(this, _typeAheadBuffer));
+  });
+  if (match) __privateMethod(this, _DuiTreePrimitive_instances, focusItem_fn).call(this, match);
+};
+__decorateElement(_init62, 4, "expandedValues", _expandedValues_dec, DuiTreePrimitive, _expandedValues);
+__decorateElement(_init62, 4, "defaultExpandedValues", _defaultExpandedValues_dec, DuiTreePrimitive, _defaultExpandedValues);
+__decorateElement(_init62, 4, "selectionMode", _selectionMode_dec, DuiTreePrimitive, _selectionMode);
+__decorateElement(_init62, 4, "selectedValues", _selectedValues_dec, DuiTreePrimitive, _selectedValues);
+__decorateElement(_init62, 4, "defaultSelectedValues", _defaultSelectedValues_dec, DuiTreePrimitive, _defaultSelectedValues);
+__decorateElement(_init62, 4, "disabled", _disabled_dec31, DuiTreePrimitive, _disabled31);
+_b41 = __decorateElement(_init62, 20, "#internalExpanded", _internalExpanded_dec, _DuiTreePrimitive_instances, _internalExpanded), internalExpanded_get = _b41.get, internalExpanded_set = _b41.set;
+_c20 = __decorateElement(_init62, 20, "#internalSelected", _internalSelected_dec, _DuiTreePrimitive_instances, _internalSelected), internalSelected_get = _c20.get, internalSelected_set = _c20.set;
+_d12 = __decorateElement(_init62, 20, "#focusedValue", _focusedValue_dec, _DuiTreePrimitive_instances, _focusedValue), focusedValue_get = _d12.get, focusedValue_set = _d12.set;
+__decorateElement(_init62, 4, "_ctx", __ctx_dec24, DuiTreePrimitive, __ctx24);
+__decoratorMetadata(_init62, DuiTreePrimitive);
+__publicField(DuiTreePrimitive, "tagName", "dui-tree");
+__publicField(DuiTreePrimitive, "styles", [base, styles145]);
+
+// packages/components/src/tree/tree.ts
+var styles146 = i`
+  /* ── Sizes — write to public tokens on :host so consumer overrides win ── */
+
+  :host {
+    /* Default = sm */
+    --dui-tree-row-height: var(--component-height-sm);
+    --dui-tree-indent: var(--space-4);
+    --dui-tree-row-spacing: 0;
+    --dui-tree-row-radius: var(--radius-sm);
+    --dui-tree-hover-bg: oklch(from var(--foreground) l c h / 0.05);
+    --dui-tree-selected-bg: oklch(from var(--foreground) l c h / 0.10);
+
+    /* Internal-only (not part of public token surface) */
+    --_tree-label-font-size: var(--text-xs);
+    --_tree-label-line-height: var(--text-xs--line-height);
+    --_tree-end-font-size: var(--text-2xs);
+    --_tree-end-line-height: var(--text-2xs--line-height);
+    --_tree-indicator-size: 14px;
+    --_tree-row-px: var(--space-2);
+    --_tree-inline-gap: var(--space-2);
+  }
+
+  :host([size="md"]) {
+    --dui-tree-row-height: var(--component-height-md);
+    --dui-tree-indent: var(--space-5);
+    --_tree-label-font-size: var(--text-sm);
+    --_tree-label-line-height: var(--text-sm--line-height);
+    --_tree-end-font-size: var(--text-xs);
+    --_tree-end-line-height: var(--text-xs--line-height);
+    --_tree-indicator-size: var(--space-4);
+    --_tree-inline-gap: var(--space-2);
+  }
+
+  :host([size="lg"]) {
+    --dui-tree-row-height: var(--component-height-lg);
+    --dui-tree-indent: var(--space-6);
+    --_tree-label-font-size: var(--text-sm);
+    --_tree-label-line-height: var(--text-sm--line-height);
+    --_tree-end-font-size: var(--text-xs);
+    --_tree-end-line-height: var(--text-xs--line-height);
+    --_tree-indicator-size: var(--space-4);
+    --_tree-inline-gap: var(--space-2_5);
+  }
+`;
+var DuiTree = class extends DuiTreePrimitive {
+  static styles = [...DuiTreePrimitive.styles, styles146];
+};
+customElements.define(DuiTree.tagName, DuiTree);
+
+// packages/components/src/tree/tree-item.ts
+var chevronMask3 = r(
+  `url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E")`
+);
+var spinnerMask = r(
+  `url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 1 1-6.219-8.56'/%3E%3C/svg%3E")`
+);
+var styles147 = i`
+  /* ── Row container ─────────────────────────────────────────────────── */
+
+  /*
+  * IMPORTANT: All visual styling lives on [part="content"], NOT [part="root"].
+  * [part="root"] wraps both the row and the children group, so :hover on it
+  * would bleed onto descendant rows. See the hover-bleed regression demo.
+  */
+  [part="content"] {
+    height: var(--dui-tree-row-height);
+    padding-inline-start: calc(
+      var(--_tree-row-px) +
+        (var(--dui-tree-level, 1) - 1) * var(--dui-tree-indent)
+      );
+      padding-inline-end: var(--_tree-row-px);
+      margin-block: calc(var(--dui-tree-row-spacing) / 2);
+      margin-inline: var(--space-1);
+      border-radius: var(--dui-tree-row-radius);
+      gap: var(--_tree-inline-gap);
+      color: var(--text-1);
+      font-family: var(--font-sans);
+      font-size: var(--_tree-label-font-size);
+      line-height: var(--_tree-label-line-height);
+      cursor: pointer;
+      transition-property: background, box-shadow, color;
+      transition-duration: var(--duration-faster);
+      transition-timing-function: var(--ease-out-3);
+      /* Allow children to truncate */
+      min-width: 0;
+    }
+
+    @media (hover: hover) {
+      [part="content"]:hover {
+        background: var(--dui-tree-hover-bg);
+      }
+    }
+
+    :host([data-selected]) [part="content"] {
+      background: var(--dui-tree-selected-bg);
+    }
+
+    :host([data-disabled]) [part="content"] {
+      opacity: 0.4;
+      cursor: not-allowed;
+    }
+
+    /* ── Focus ring ─────────────────────────────────────────────────────── */
+
+    [part="root"]:focus-visible {
+      outline: none;
+    }
+
+    [part="root"]:focus-visible [part="content"] {
+      box-shadow:
+        0 0 0 var(--focus-ring-offset) var(--background),
+        0 0 0 calc(var(--focus-ring-offset) + var(--focus-ring-width))
+        var(--focus-ring-color);
+      /* Keep the highlighted row above siblings so the ring isn't clipped. */
+      position: relative;
+      z-index: 1;
+    }
+
+    /* ── Indicator (chevron / spinner / leaf placeholder) ─────────────── */
+
+    [part="indicator"] {
+      width: var(--_tree-indicator-size);
+      height: var(--_tree-indicator-size);
+      color: var(--text-2);
+    }
+
+    /* Branch chevron */
+    :host([data-branch]) [part="indicator"]::before {
+      content: "";
+      display: block;
+      width: 100%;
+      height: 100%;
+      background: currentColor;
+      -webkit-mask: ${chevronMask3} center / contain no-repeat;
+      mask: ${chevronMask3} center / contain no-repeat;
+      transition-property: transform;
+      transition-duration: var(--duration-fast);
+      transition-timing-function: var(--ease-out-3);
+    }
+
+    :host([data-expanded]) [part="indicator"]::before {
+      transform: rotate(90deg);
+    }
+
+    /* Loading spinner replaces the chevron in-place */
+    :host([data-loading]) [part="indicator"]::before {
+      -webkit-mask: ${spinnerMask} center / contain no-repeat;
+      mask: ${spinnerMask} center / contain no-repeat;
+      transform: none;
+      animation: dui-tree-spin 0.9s linear infinite;
+    }
+
+    @keyframes dui-tree-spin {
+      from {
+        transform: rotate(0deg);
+      }
+      to {
+        transform: rotate(360deg);
+      }
+    }
+
+    /* ── Slotted content ────────────────────────────────────────────────── */
+
+    ::slotted([slot="label"]) {
+      min-width: 0;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+
+    ::slotted([slot="end"]) {
+      flex-shrink: 0;
+      color: var(--text-2);
+      font-size: var(--_tree-end-font-size);
+      line-height: var(--_tree-end-line-height);
+    }
+
+    /* ── Reduced motion ────────────────────────────────────────────────── */
+
+    @media (prefers-reduced-motion: reduce) {
+      [part="content"],
+      :host([data-branch]) [part="indicator"]::before {
+        transition-duration: 0s;
+      }
+      :host([data-loading]) [part="indicator"]::before {
+        animation: none;
+      }
+    }
+  `;
+var DuiTreeItem = class extends DuiTreeItemPrimitive {
+  static styles = [...DuiTreeItemPrimitive.styles, styles147];
+};
+customElements.define(DuiTreeItem.tagName, DuiTreeItem);
+
+// ../dui-primitives/packages/primitives/src/trunc/trunc.ts
+var styles148 = i5`
+  :host {
+    display: block;
+  }
+
   [part="root"] {
     overflow: hidden;
   }
@@ -18945,12 +19732,12 @@ var styles144 = i5`
     -webkit-box-orient: vertical;
   }
 `;
-var _maxLines_dec, _maxWidth_dec, _a61, _init61, _maxWidth, _maxLines;
-var DuiTruncPrimitive = class extends (_a61 = i8, _maxWidth_dec = [n7({ attribute: "max-width" })], _maxLines_dec = [n7({ attribute: "max-lines", type: Number, reflect: true })], _a61) {
+var _maxLines_dec, _maxWidth_dec, _a63, _init63, _maxWidth, _maxLines;
+var DuiTruncPrimitive = class extends (_a63 = i8, _maxWidth_dec = [n7({ attribute: "max-width" })], _maxLines_dec = [n7({ attribute: "max-lines", type: Number, reflect: true })], _a63) {
   constructor() {
     super(...arguments);
-    __privateAdd(this, _maxWidth, __runInitializers(_init61, 8, this, "20rem")), __runInitializers(_init61, 11, this);
-    __privateAdd(this, _maxLines, __runInitializers(_init61, 12, this)), __runInitializers(_init61, 15, this);
+    __privateAdd(this, _maxWidth, __runInitializers(_init63, 8, this, "20rem")), __runInitializers(_init63, 11, this);
+    __privateAdd(this, _maxLines, __runInitializers(_init63, 12, this)), __runInitializers(_init63, 15, this);
   }
   render() {
     const clamp2 = this.maxLines !== void 0 ? Math.max(1, this.maxLines).toString() : void 0;
@@ -18962,17 +19749,17 @@ var DuiTruncPrimitive = class extends (_a61 = i8, _maxWidth_dec = [n7({ attribut
     return b4`<div part="root" style=${dynamicStyles}><slot></slot></div>`;
   }
 };
-_init61 = __decoratorStart(_a61);
+_init63 = __decoratorStart(_a63);
 _maxWidth = new WeakMap();
 _maxLines = new WeakMap();
-__decorateElement(_init61, 4, "maxWidth", _maxWidth_dec, DuiTruncPrimitive, _maxWidth);
-__decorateElement(_init61, 4, "maxLines", _maxLines_dec, DuiTruncPrimitive, _maxLines);
-__decoratorMetadata(_init61, DuiTruncPrimitive);
+__decorateElement(_init63, 4, "maxWidth", _maxWidth_dec, DuiTruncPrimitive, _maxWidth);
+__decorateElement(_init63, 4, "maxLines", _maxLines_dec, DuiTruncPrimitive, _maxLines);
+__decoratorMetadata(_init63, DuiTruncPrimitive);
 __publicField(DuiTruncPrimitive, "tagName", "dui-trunc");
-__publicField(DuiTruncPrimitive, "styles", [base, styles144]);
+__publicField(DuiTruncPrimitive, "styles", [base, styles148]);
 
 // packages/components/src/trunc/trunc.ts
-var styles145 = i`
+var styles149 = i`
   [part="root"] {
     font-family: var(--font-sans);
     font-size: var(--text-sm); line-height: var(--text-sm--line-height);
@@ -18980,6 +19767,6 @@ var styles145 = i`
   }
 `;
 var DuiTrunc = class extends DuiTruncPrimitive {
-  static styles = [...DuiTruncPrimitive.styles, styles145];
+  static styles = [...DuiTruncPrimitive.styles, styles149];
 };
 customElements.define(DuiTrunc.tagName, DuiTrunc);