@skdx/web-components 0.28.0 → 0.30.0

package/dist/tree-select/TreeSelectEmpty.js

@@ -1,5 +1,5 @@
-var c=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var l=(s,t,i,r)=>{for(var e=r>1?void 0:r?p(t,i):t,n=s.length-1,d;n>=0;n--)(d=s[n])&&(e=(r?d(t,i,e):d(e))||e);return r&&e&&c(t,i,e),e};import{css as h,html as m,LitElement as v}from"lit";import{customElement as y}from"../internal/define.js";import{hiddenHostStyles as u}from"../internal/styles.js";import{findTreeSelectRoot as E,TREE_SELECT_INTERNAL_UPDATE as a}from"./TreeSelect.js";var o=class extends v{constructor(){super(...arguments);this.root=null;this.onRootUpdate=()=>this.sync()}connectedCallback(){super.connectedCallback(),this.root=E(this),this.root?.addEventListener(a,this.onRootUpdate),this.setAttribute("role","presentation"),this.sync()}disconnectedCallback(){this.root?.removeEventListener(a,this.onRootUpdate),super.disconnectedCallback()}updated(){this.sync()}sync(){this.hidden=(this.root?.flat.length??0)>0}render(){return m`<slot></slot>`}};o.styles=[u,h`
+var c=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var d=(s,t,i,r)=>{for(var e=r>1?void 0:r?p(t,i):t,l=s.length-1,n;l>=0;l--)(n=s[l])&&(e=(r?n(t,i,e):n(e))||e);return r&&e&&c(t,i,e),e};import{css as h,html as m,LitElement as v}from"lit";import{customElement as u}from"../internal/define.js";import{hiddenHostStyles as y}from"../internal/styles.js";import{findTreeSelectRoot as E,TREE_SELECT_INTERNAL_UPDATE as a}from"./TreeSelect.js";var o=class extends v{constructor(){super(...arguments);this.root=null;this.onRootUpdate=()=>this.sync()}connectedCallback(){super.connectedCallback(),this.root=E(this),this.root?.addEventListener(a,this.onRootUpdate),this.setAttribute("role","presentation"),this.sync()}disconnectedCallback(){this.root?.removeEventListener(a,this.onRootUpdate),super.disconnectedCallback()}updated(){this.sync()}sync(){this.hidden=(this.root?.flat.length??0)>0}render(){return m`<slot></slot>`}};o.styles=[y,h`
       :host {
         display: block;
       }
-    `],o=l([y("skdx-tree-select-empty","tree-select","empty")],o);export{o as SkdxTreeSelectEmpty};
+    `],o=d([u("skdx-tree-select-empty","tree-select","empty")],o);export{o as SkdxTreeSelectEmpty};

package/dist/tree-select/TreeSelectInput.cjs

@@ -1,17 +1,17 @@
-"use strict";var s=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var E=Object.prototype.hasOwnProperty;var b=(r,t)=>{for(var e in t)s(r,e,{get:t[e],enumerable:!0})},$=(r,t,e,a)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of f(t))!E.call(r,o)&&o!==e&&s(r,o,{get:()=>t[o],enumerable:!(a=u(t,o))||a.enumerable});return r};var g=r=>$(s({},"__esModule",{value:!0}),r),c=(r,t,e,a)=>{for(var o=a>1?void 0:a?u(t,e):t,d=r.length-1,p;d>=0;d--)(p=r[d])&&(o=(a?p(t,e,o):p(o))||o);return a&&o&&s(t,e,o),o};var L={};b(L,{SkdxTreeSelectInput:()=>l});module.exports=g(L);var i=require("lit"),h=require("lit/decorators.js"),v=require("../internal/aria-label.cjs"),m=require("../internal/define.cjs"),y=require("../internal/styles.cjs"),n=require("./TreeSelect.cjs");var l=class extends i.LitElement{constructor(){super(...arguments);this.root=null;this.label=null;this.onRootUpdate=()=>this.requestUpdate();this.handleInput=e=>{this.root?.setInputValue(e.target.value)};this.handleKeyDown=e=>{this.root?.onNavigationKeyDown(e,{typeahead:!1,selectOnSpace:!1})}}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),this.root=(0,n.findTreeSelectRoot)(this),this.root?.addEventListener(n.TREE_SELECT_INTERNAL_UPDATE,this.onRootUpdate),this.label??(this.label=(0,v.takeHostAriaLabel)(this)),(0,y.installLightDomStyles)(),this.root&&(this.root.inputEl=this,this.root.broadcast())}disconnectedCallback(){this.root?.removeEventListener(n.TREE_SELECT_INTERNAL_UPDATE,this.onRootUpdate),this.root?.inputEl===this&&(this.root.inputEl=null,this.root.broadcast()),super.disconnectedCallback()}focusInput(){this.querySelector("input")?.focus()}focus(e){this.querySelector("input")?.focus(e)}render(){let e=this.root,a=e?.activeValue??null;return i.html`
+"use strict";var s=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var b=Object.prototype.hasOwnProperty;var E=(a,t)=>{for(var e in t)s(a,e,{get:t[e],enumerable:!0})},T=(a,t,e,l)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of f(t))!b.call(a,o)&&o!==e&&s(a,o,{get:()=>t[o],enumerable:!(l=u(t,o))||l.enumerable});return a};var g=a=>T(s({},"__esModule",{value:!0}),a),p=(a,t,e,l)=>{for(var o=l>1?void 0:l?u(t,e):t,d=a.length-1,c;d>=0;d--)(c=a[d])&&(o=(l?c(t,e,o):c(o))||o);return l&&o&&s(t,e,o),o};var L={};E(L,{SkdxTreeSelectInput:()=>i});module.exports=g(L);var r=require("lit"),h=require("lit/decorators.js"),v=require("../internal/aria-label.cjs"),m=require("../internal/define.cjs"),y=require("../internal/light-dom-styles.cjs"),n=require("./TreeSelect.cjs");var i=class extends r.LitElement{constructor(){super(...arguments);this.root=null;this.label=null;this.onRootUpdate=()=>this.requestUpdate();this.handleInput=e=>{this.root?.setInputValue(e.target.value)};this.handleKeyDown=e=>{this.root?.onNavigationKeyDown(e,{typeahead:!1,selectOnSpace:!1})}}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),this.root=(0,n.findTreeSelectRoot)(this),this.root?.addEventListener(n.TREE_SELECT_INTERNAL_UPDATE,this.onRootUpdate),this.label??(this.label=(0,v.takeHostAriaLabel)(this)),(0,y.installLightDomStyles)(),this.root&&(this.root.inputEl=this,this.root.broadcast())}disconnectedCallback(){this.root?.removeEventListener(n.TREE_SELECT_INTERNAL_UPDATE,this.onRootUpdate),this.root?.inputEl===this&&(this.root.inputEl=null,this.root.broadcast()),super.disconnectedCallback()}focusInput(){this.querySelector("input")?.focus({preventScroll:!0})}focus(e){this.querySelector("input")?.focus(e)}renderState(){let e=this.root;if(!e)return{value:"",controls:r.nothing,activedescendant:r.nothing,readonly:!1,disabled:!1};let l=e.activeValue??null;return{value:e.inputValue??"",controls:e.activeTreeId??r.nothing,activedescendant:l===null?r.nothing:e.itemId(l),readonly:e.readOnly,disabled:e.disabled}}render(){let e=this.renderState();return r.html`
       <input
         part="input"
         type="text"
         autocomplete="off"
-        .value=${e?.inputValue??""}
-        placeholder=${this.placeholder??i.nothing}
-        aria-controls=${e?.treeId??i.nothing}
-        aria-activedescendant=${a===null?i.nothing:e.itemId(a)}
-        aria-readonly=${e?.readOnly?"true":i.nothing}
-        aria-label=${this.label??i.nothing}
-        data-readonly=${e?.readOnly?"":i.nothing}
-        ?disabled=${e?.disabled??!1}
+        .value=${e.value}
+        placeholder=${this.placeholder??r.nothing}
+        aria-controls=${e.controls}
+        aria-activedescendant=${e.activedescendant}
+        aria-readonly=${e.readonly?"true":r.nothing}
+        aria-label=${this.label??r.nothing}
+        data-readonly=${e.readonly?"":r.nothing}
+        ?disabled=${e.disabled}
         @input=${this.handleInput}
         @keydown=${this.handleKeyDown}
       />
-    `}};c([(0,h.property)({type:String})],l.prototype,"placeholder",2),l=c([(0,m.customElement)("skdx-tree-select-input","tree-select","input")],l);0&&(module.exports={SkdxTreeSelectInput});
+    `}};p([(0,h.property)({type:String})],i.prototype,"placeholder",2),i=p([(0,m.customElement)("skdx-tree-select-input","tree-select","input")],i);0&&(module.exports={SkdxTreeSelectInput});

package/dist/tree-select/TreeSelectInput.d.cts

@@ -1,23 +1,8 @@
-import { LitElement } from 'lit';
+import { LitElement, type TemplateResult } from 'lit';
 /**
- * Optional filter field inside `<skdx-tree-select-content>`, holding real DOM
- * focus for the whole interaction. Carries `aria-controls` and
- * `aria-activedescendant` naming the virtual node (the trigger drops its own).
- * Plain textbox, not another combobox (the trigger already owns that role).
+ * Optional filter field inside `<skdx-tree-select-content>`, holding real DOM focus for the whole interaction.
  *
- * Typing filters the tree; matches expand their ancestor chain transiently,
- * restoring prior state when cleared. Arrow/Home/End/Enter/Escape behave as on
- * the trigger; Space is left (it's a typing character). Host `aria-label` moves
- * to the inner `<input>`.
- *
- * Renders into light DOM (no shadow root) because `aria-controls` and
- * `aria-activedescendant` are IDREFs that resolve only within their tree.
- * Light-DOM rendering lets them reach the tree and items.
- *
- * @csspart input - The native `<input>` element. **`::part(input)` does not
- * reach it** (renders into light DOM; `::part()` only matches in shadow roots).
- * Kept for contract consistency. Style as an ordinary descendant:
- * `skdx-tree-select-input > input { … }`.
+ * @csspart input - The native `<input>` element; `::part(input)` does not reach it since it renders into light DOM. Style as `skdx-tree-select-input > input { … }`.
  *
  * @example
  * ```html
@@ -25,8 +10,8 @@ import { LitElement } from 'lit';
  * ```
  */
 export declare class SkdxTreeSelectInput extends LitElement {
-    /** Light DOM, for the IDREF reasons in the class docblock. */
-    createRenderRoot(): this;
+    /** Light DOM, so aria-controls/aria-activedescendant IDREFs can resolve. */
+    createRenderRoot(): HTMLElement | DocumentFragment;
     /**
      * Placeholder text for the filter field.
      * @default undefined — renders no placeholder attribute at all.
@@ -43,7 +28,8 @@ export declare class SkdxTreeSelectInput extends LitElement {
     focus(options?: FocusOptions): void;
     private readonly handleInput;
     private readonly handleKeyDown;
-    render(): import("lit").TemplateResult<1>;
+    private renderState;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/tree-select/TreeSelectInput.d.ts

@@ -1,23 +1,8 @@
-import { LitElement } from 'lit';
+import { LitElement, type TemplateResult } from 'lit';
 /**
- * Optional filter field inside `<skdx-tree-select-content>`, holding real DOM
- * focus for the whole interaction. Carries `aria-controls` and
- * `aria-activedescendant` naming the virtual node (the trigger drops its own).
- * Plain textbox, not another combobox (the trigger already owns that role).
+ * Optional filter field inside `<skdx-tree-select-content>`, holding real DOM focus for the whole interaction.
  *
- * Typing filters the tree; matches expand their ancestor chain transiently,
- * restoring prior state when cleared. Arrow/Home/End/Enter/Escape behave as on
- * the trigger; Space is left (it's a typing character). Host `aria-label` moves
- * to the inner `<input>`.
- *
- * Renders into light DOM (no shadow root) because `aria-controls` and
- * `aria-activedescendant` are IDREFs that resolve only within their tree.
- * Light-DOM rendering lets them reach the tree and items.
- *
- * @csspart input - The native `<input>` element. **`::part(input)` does not
- * reach it** (renders into light DOM; `::part()` only matches in shadow roots).
- * Kept for contract consistency. Style as an ordinary descendant:
- * `skdx-tree-select-input > input { … }`.
+ * @csspart input - The native `<input>` element; `::part(input)` does not reach it since it renders into light DOM. Style as `skdx-tree-select-input > input { … }`.
  *
  * @example
  * ```html
@@ -25,8 +10,8 @@ import { LitElement } from 'lit';
  * ```
  */
 export declare class SkdxTreeSelectInput extends LitElement {
-    /** Light DOM, for the IDREF reasons in the class docblock. */
-    createRenderRoot(): this;
+    /** Light DOM, so aria-controls/aria-activedescendant IDREFs can resolve. */
+    createRenderRoot(): HTMLElement | DocumentFragment;
     /**
      * Placeholder text for the filter field.
      * @default undefined — renders no placeholder attribute at all.
@@ -43,7 +28,8 @@ export declare class SkdxTreeSelectInput extends LitElement {
     focus(options?: FocusOptions): void;
     private readonly handleInput;
     private readonly handleKeyDown;
-    render(): import("lit").TemplateResult<1>;
+    private renderState;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/tree-select/TreeSelectInput.js

@@ -1,17 +1,17 @@
-var c=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var d=(l,i,e,t)=>{for(var o=t>1?void 0:t?u(i,e):i,n=l.length-1,s;n>=0;n--)(s=l[n])&&(o=(t?s(i,e,o):s(o))||o);return t&&o&&c(i,e,o),o};import{html as h,LitElement as v,nothing as r}from"lit";import{property as m}from"lit/decorators.js";import{takeHostAriaLabel as y}from"../internal/aria-label.js";import{customElement as f}from"../internal/define.js";import{installLightDomStyles as E}from"../internal/styles.js";import{findTreeSelectRoot as b,TREE_SELECT_INTERNAL_UPDATE as p}from"./TreeSelect.js";var a=class extends v{constructor(){super(...arguments);this.root=null;this.label=null;this.onRootUpdate=()=>this.requestUpdate();this.handleInput=e=>{this.root?.setInputValue(e.target.value)};this.handleKeyDown=e=>{this.root?.onNavigationKeyDown(e,{typeahead:!1,selectOnSpace:!1})}}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),this.root=b(this),this.root?.addEventListener(p,this.onRootUpdate),this.label??(this.label=y(this)),E(),this.root&&(this.root.inputEl=this,this.root.broadcast())}disconnectedCallback(){this.root?.removeEventListener(p,this.onRootUpdate),this.root?.inputEl===this&&(this.root.inputEl=null,this.root.broadcast()),super.disconnectedCallback()}focusInput(){this.querySelector("input")?.focus()}focus(e){this.querySelector("input")?.focus(e)}render(){let e=this.root,t=e?.activeValue??null;return h`
+var p=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var d=(i,a,e,o)=>{for(var r=o>1?void 0:o?u(a,e):a,n=i.length-1,s;n>=0;n--)(s=i[n])&&(r=(o?s(a,e,r):s(r))||r);return o&&r&&p(a,e,r),r};import{html as h,LitElement as v,nothing as t}from"lit";import{property as m}from"lit/decorators.js";import{takeHostAriaLabel as y}from"../internal/aria-label.js";import{customElement as f}from"../internal/define.js";import{installLightDomStyles as b}from"../internal/light-dom-styles.js";import{findTreeSelectRoot as E,TREE_SELECT_INTERNAL_UPDATE as c}from"./TreeSelect.js";var l=class extends v{constructor(){super(...arguments);this.root=null;this.label=null;this.onRootUpdate=()=>this.requestUpdate();this.handleInput=e=>{this.root?.setInputValue(e.target.value)};this.handleKeyDown=e=>{this.root?.onNavigationKeyDown(e,{typeahead:!1,selectOnSpace:!1})}}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),this.root=E(this),this.root?.addEventListener(c,this.onRootUpdate),this.label??(this.label=y(this)),b(),this.root&&(this.root.inputEl=this,this.root.broadcast())}disconnectedCallback(){this.root?.removeEventListener(c,this.onRootUpdate),this.root?.inputEl===this&&(this.root.inputEl=null,this.root.broadcast()),super.disconnectedCallback()}focusInput(){this.querySelector("input")?.focus({preventScroll:!0})}focus(e){this.querySelector("input")?.focus(e)}renderState(){let e=this.root;if(!e)return{value:"",controls:t,activedescendant:t,readonly:!1,disabled:!1};let o=e.activeValue??null;return{value:e.inputValue??"",controls:e.activeTreeId??t,activedescendant:o===null?t:e.itemId(o),readonly:e.readOnly,disabled:e.disabled}}render(){let e=this.renderState();return h`
       <input
         part="input"
         type="text"
         autocomplete="off"
-        .value=${e?.inputValue??""}
-        placeholder=${this.placeholder??r}
-        aria-controls=${e?.treeId??r}
-        aria-activedescendant=${t===null?r:e.itemId(t)}
-        aria-readonly=${e?.readOnly?"true":r}
-        aria-label=${this.label??r}
-        data-readonly=${e?.readOnly?"":r}
-        ?disabled=${e?.disabled??!1}
+        .value=${e.value}
+        placeholder=${this.placeholder??t}
+        aria-controls=${e.controls}
+        aria-activedescendant=${e.activedescendant}
+        aria-readonly=${e.readonly?"true":t}
+        aria-label=${this.label??t}
+        data-readonly=${e.readonly?"":t}
+        ?disabled=${e.disabled}
         @input=${this.handleInput}
         @keydown=${this.handleKeyDown}
       />
-    `}};d([m({type:String})],a.prototype,"placeholder",2),a=d([f("skdx-tree-select-input","tree-select","input")],a);export{a as SkdxTreeSelectInput};
+    `}};d([m({type:String})],l.prototype,"placeholder",2),l=d([f("skdx-tree-select-input","tree-select","input")],l);export{l as SkdxTreeSelectInput};

package/dist/tree-select/TreeSelectItem.cjs

@@ -1 +1 @@
-"use strict";var l=Object.defineProperty;var c=Object.getOwnPropertyDescriptor;var A=Object.getOwnPropertyNames;var k=Object.prototype.hasOwnProperty;var g=(r,s)=>{for(var e in s)l(r,e,{get:s[e],enumerable:!0})},x=(r,s,e,i)=>{if(s&&typeof s=="object"||typeof s=="function")for(let t of A(s))!k.call(r,t)&&t!==e&&l(r,t,{get:()=>s[t],enumerable:!(i=c(s,t))||i.enumerable});return r};var E=r=>x(l({},"__esModule",{value:!0}),r),h=(r,s,e,i)=>{for(var t=i>1?void 0:i?c(s,e):s,o=r.length-1,a;o>=0;o--)(a=r[o])&&(t=(i?a(s,e,t):a(t))||t);return i&&t&&l(s,e,t),t};var S={};g(S,{SkdxTreeSelectItem:()=>d});module.exports=E(S);var u=require("lit"),m=require("lit/decorators.js"),p=require("../internal/define.cjs"),b=require("../internal/part.cjs"),v=require("../internal/styles.cjs"),n=require("./TreeSelect.cjs");var d=class extends u.LitElement{constructor(){super(...arguments);this.root=null;this.onRootUpdate=()=>this.requestUpdate();this.handleClick=e=>{if(this.isFromNestedItem(e)||e.target.closest("[data-skdx-tree-select-expand]"))return;let i=this.node?.value;if(i===void 0||this.isDisabled)return;this.root?.setActiveValue(i),this.root?.commit(i);let t=this.root?.flatMap.get(i);this.root?.expandOnClick&&t?.hasChildren&&this.root.setExpanded(i,!t.expanded)}}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),(0,v.installLightDomStyles)(),(0,b.applyHostPart)(this,"tree","item"),this.root=(0,n.findTreeSelectRoot)(this),this.root?.addEventListener(n.TREE_SELECT_INTERNAL_UPDATE,this.onRootUpdate),this.addEventListener("click",this.handleClick)}disconnectedCallback(){this.root?.removeEventListener(n.TREE_SELECT_INTERNAL_UPDATE,this.onRootUpdate),this.removeEventListener("click",this.handleClick),super.disconnectedCallback()}get checkState(){let e=this.node?.value;return e===void 0?!1:this.root?.checkStateOf(e)??!1}get isDisabled(){let e=this.node?.value;return e===void 0?!1:this.root?.index.get(e)?.disabled??this.node?.disabled??!1}isFromNestedItem(e){return e.target.closest('[role="treeitem"]')!==this}updated(){let e=this.root,i=this.node?.value;if(!e||i===void 0)return;let t=e.flatMap.get(i),o=e.index.get(i),a=this.checkState,f=this.isDisabled;this.setAttribute("role","treeitem"),this.id||(this.id=e.itemId(i)),this.setAttribute("data-value",i),this.setAttribute("aria-level",String(o?.depth??1)),this.tabIndex=-1,e.multiple?(this.removeAttribute("aria-selected"),this.setAttribute("aria-checked",a==="mixed"?"mixed":String(a))):(this.setAttribute("aria-selected",String(a===!0)),this.removeAttribute("aria-checked")),this.setAttribute("data-checked",a==="mixed"?"indeterminate":a?"checked":"unchecked"),t?.hasChildren?(this.setAttribute("aria-expanded",String(t.expanded)),this.setAttribute("data-state",t.expanded?"expanded":"collapsed")):(this.removeAttribute("aria-expanded"),this.removeAttribute("data-state")),t&&(this.setAttribute("aria-posinset",String(t.posinset)),this.setAttribute("aria-setsize",String(t.setsize))),f?(this.setAttribute("aria-disabled","true"),this.setAttribute("data-disabled","")):(this.removeAttribute("aria-disabled"),this.removeAttribute("data-disabled")),e.isLoading(i)?(this.setAttribute("aria-busy","true"),this.setAttribute("data-loading","")):(this.removeAttribute("aria-busy"),this.removeAttribute("data-loading")),e.activeValue===i?this.setAttribute("data-highlighted",""):this.removeAttribute("data-highlighted")}};h([(0,m.property)({attribute:!1})],d.prototype,"node",2),d=h([(0,p.customElement)("skdx-tree-select-item","tree-select","item")],d);0&&(module.exports={SkdxTreeSelectItem});
+"use strict";var o=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var k=Object.prototype.hasOwnProperty;var A=(s,r)=>{for(var e in r)o(s,e,{get:r[e],enumerable:!0})},S=(s,r,e,t)=>{if(r&&typeof r=="object"||typeof r=="function")for(let i of f(r))!k.call(s,i)&&i!==e&&o(s,i,{get:()=>r[i],enumerable:!(t=u(r,i))||t.enumerable});return s};var g=s=>S(o({},"__esModule",{value:!0}),s),h=(s,r,e,t)=>{for(var i=t>1?void 0:t?u(r,e):r,d=s.length-1,l;d>=0;d--)(l=s[d])&&(i=(t?l(r,e,i):l(i))||i);return t&&i&&o(r,e,i),i};var y={};A(y,{SkdxTreeSelectItem:()=>a});module.exports=g(y);var p=require("lit"),c=require("lit/decorators.js"),m=require("../internal/define.cjs"),b=require("../internal/light-dom-styles.cjs"),v=require("../internal/part.cjs"),n=require("./TreeSelect.cjs");function x(s){return s==="mixed"?"indeterminate":s?"checked":"unchecked"}var a=class extends p.LitElement{constructor(){super(...arguments);this.root=null;this.onRootUpdate=()=>this.requestUpdate();this.handleClick=e=>{if(this.isFromNestedItem(e))return;let t=this.node?.value;if(t===void 0||this.isDisabled)return;this.root?.setActiveValue(t),this.root?.commit(t);let i=this.root?.flatMap.get(t);this.root?.expandsOnClick&&i?.hasChildren&&this.root.setExpanded(t,!i.expanded)}}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),(0,b.installLightDomStyles)(),(0,v.applyHostPart)(this,"tree","item"),this.root=(0,n.findTreeSelectRoot)(this),this.root?.addEventListener(n.TREE_SELECT_INTERNAL_UPDATE,this.onRootUpdate),this.addEventListener("click",this.handleClick)}disconnectedCallback(){this.root?.removeEventListener(n.TREE_SELECT_INTERNAL_UPDATE,this.onRootUpdate),this.removeEventListener("click",this.handleClick),super.disconnectedCallback()}get checkState(){let e=this.node?.value;return e===void 0?!1:this.root?.checkStateOf(e)??!1}get isDisabled(){let e=this.node?.value;return e===void 0?!1:this.root?.index.get(e)?.disabled??this.node?.disabled??!1}isFromNestedItem(e){return e.target.closest('[role="treeitem"]')!==this}updated(){let e=this.root,t=this.node?.value;!e||t===void 0||(this.syncIdentity(e,t),this.syncCheckState(e),this.syncBranchState(e,t),this.syncAvailability(e,t))}syncIdentity(e,t){let i=e.index.get(t);this.setAttribute("role","treeitem"),this.id||(this.id=e.itemId(t)),this.setAttribute("data-value",t),this.setAttribute("data-skdx-tree-node-id",t),i?.parent?this.setAttribute("data-skdx-tree-parent-id",i.parent):this.removeAttribute("data-skdx-tree-parent-id");let d=this.depth??i?.depth??1;this.setAttribute("aria-level",String(d)),this.style.setProperty("--skdx-tree-node-depth",String(d)),this.tabIndex=-1}syncCheckState(e){let t=this.checkState;e.multiple?(this.removeAttribute("aria-selected"),this.setAttribute("aria-checked",t==="mixed"?"mixed":String(t))):(this.setAttribute("aria-selected",String(t===!0)),this.removeAttribute("aria-checked")),this.setAttribute("data-checked",x(t))}syncBranchState(e,t){let i=e.flatMap.get(t);i?.hasChildren?(this.setAttribute("aria-expanded",String(i.expanded)),this.setAttribute("data-state",i.expanded?"expanded":"collapsed")):(this.removeAttribute("aria-expanded"),this.removeAttribute("data-state")),i&&(this.setAttribute("aria-posinset",String(i.posinset)),this.setAttribute("aria-setsize",String(i.setsize)))}syncAvailability(e,t){this.isDisabled?(this.setAttribute("aria-disabled","true"),this.setAttribute("data-disabled","")):(this.removeAttribute("aria-disabled"),this.removeAttribute("data-disabled")),e.isLoading(t)?(this.setAttribute("aria-busy","true"),this.setAttribute("data-loading","")):(this.removeAttribute("aria-busy"),this.removeAttribute("data-loading")),e.activeValue===t?this.setAttribute("data-highlighted",""):this.removeAttribute("data-highlighted")}};h([(0,c.property)({attribute:!1})],a.prototype,"node",2),h([(0,c.property)({attribute:!1})],a.prototype,"depth",2),a=h([(0,m.customElement)("skdx-tree-select-item","tree-select","item")],a);0&&(module.exports={SkdxTreeSelectItem});

package/dist/tree-select/TreeSelectItem.d.cts

@@ -1,21 +1,15 @@
 import { LitElement } from 'lit';
 import type { SkdxTreeCheckedState } from '../tree/Tree.cjs';
 import type { TreeSelectNode } from './types.cjs';
-/**
- * `<skdx-tree-select-item>` — one node in a tree select, rendered by `<skdx-tree-select-tree>`.
- *
- * Renders **into light DOM** (no shadow root), required for ARIA `treeitem` relationships to work within the `role="tree"` ancestor.
- * Carries `role="treeitem"`, `aria-level`, `aria-selected` (single) / `aria-checked` (multiple, with `"mixed"` for half-checked), `aria-expanded` (branches only), `aria-posinset` / `aria-setsize` (against visible siblings), `data-highlighted` for virtual focus, and `aria-busy` while loading.
- * `tabindex="-1"`: tree navigated by `aria-activedescendant`, no roving tab stop.
- * Click checks the node (cascade under `check-strategy="cascade"`); expansion stays on the chevron.
- * Does not compose `<skdx-tree-item>` (which would own real DOM focus and a derived tri-state — both forbidden here).
- */
+/** `<skdx-tree-select-item>` — one node in a tree select, rendered by `<skdx-tree-select-tree>`. */
 export declare class SkdxTreeSelectItem extends LitElement {
-    /** The collection node this row stands for. Set as a property. */
+    /** The collection node this row stands for; set as a property. */
     node?: TreeSelectNode;
+    /** @internal Depth this row renders at, set by a windowed Tree whose `rows` re-base it. */
+    depth?: number;
     private root;
     private readonly onRootUpdate;
-    /** Light DOM (ARIA requirement). No `render()`: `<skdx-tree-select-tree>` owns the full subtree. */
+    /** Light DOM, an ARIA requirement; `<skdx-tree-select-tree>` owns the full subtree, so no `render()`. */
     protected createRenderRoot(): HTMLElement;
     connectedCallback(): void;
     disconnectedCallback(): void;
@@ -27,6 +21,10 @@ export declare class SkdxTreeSelectItem extends LitElement {
     private isFromNestedItem;
     private readonly handleClick;
     protected updated(): void;
+    private syncIdentity;
+    private syncCheckState;
+    private syncBranchState;
+    private syncAvailability;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/tree-select/TreeSelectItem.d.ts

@@ -1,21 +1,15 @@
 import { LitElement } from 'lit';
 import type { SkdxTreeCheckedState } from '../tree/Tree.js';
 import type { TreeSelectNode } from './types.js';
-/**
- * `<skdx-tree-select-item>` — one node in a tree select, rendered by `<skdx-tree-select-tree>`.
- *
- * Renders **into light DOM** (no shadow root), required for ARIA `treeitem` relationships to work within the `role="tree"` ancestor.
- * Carries `role="treeitem"`, `aria-level`, `aria-selected` (single) / `aria-checked` (multiple, with `"mixed"` for half-checked), `aria-expanded` (branches only), `aria-posinset` / `aria-setsize` (against visible siblings), `data-highlighted` for virtual focus, and `aria-busy` while loading.
- * `tabindex="-1"`: tree navigated by `aria-activedescendant`, no roving tab stop.
- * Click checks the node (cascade under `check-strategy="cascade"`); expansion stays on the chevron.
- * Does not compose `<skdx-tree-item>` (which would own real DOM focus and a derived tri-state — both forbidden here).
- */
+/** `<skdx-tree-select-item>` — one node in a tree select, rendered by `<skdx-tree-select-tree>`. */
 export declare class SkdxTreeSelectItem extends LitElement {
-    /** The collection node this row stands for. Set as a property. */
+    /** The collection node this row stands for; set as a property. */
     node?: TreeSelectNode;
+    /** @internal Depth this row renders at, set by a windowed Tree whose `rows` re-base it. */
+    depth?: number;
     private root;
     private readonly onRootUpdate;
-    /** Light DOM (ARIA requirement). No `render()`: `<skdx-tree-select-tree>` owns the full subtree. */
+    /** Light DOM, an ARIA requirement; `<skdx-tree-select-tree>` owns the full subtree, so no `render()`. */
     protected createRenderRoot(): HTMLElement;
     connectedCallback(): void;
     disconnectedCallback(): void;
@@ -27,6 +21,10 @@ export declare class SkdxTreeSelectItem extends LitElement {
     private isFromNestedItem;
     private readonly handleClick;
     protected updated(): void;
+    private syncIdentity;
+    private syncCheckState;
+    private syncBranchState;
+    private syncAvailability;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/tree-select/TreeSelectItem.js

@@ -1 +1 @@
-var c=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var n=(o,r,e,t)=>{for(var i=t>1?void 0:t?u(r,e):r,a=o.length-1,s;a>=0;a--)(s=o[a])&&(i=(t?s(r,e,i):s(i))||i);return t&&i&&c(r,e,i),i};import{LitElement as m}from"lit";import{property as p}from"lit/decorators.js";import{customElement as b}from"../internal/define.js";import{applyHostPart as v}from"../internal/part.js";import{installLightDomStyles as f}from"../internal/styles.js";import{findTreeSelectRoot as A,TREE_SELECT_INTERNAL_UPDATE as l}from"./TreeSelect.js";var d=class extends m{constructor(){super(...arguments);this.root=null;this.onRootUpdate=()=>this.requestUpdate();this.handleClick=e=>{if(this.isFromNestedItem(e)||e.target.closest("[data-skdx-tree-select-expand]"))return;let t=this.node?.value;if(t===void 0||this.isDisabled)return;this.root?.setActiveValue(t),this.root?.commit(t);let i=this.root?.flatMap.get(t);this.root?.expandOnClick&&i?.hasChildren&&this.root.setExpanded(t,!i.expanded)}}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),f(),v(this,"tree","item"),this.root=A(this),this.root?.addEventListener(l,this.onRootUpdate),this.addEventListener("click",this.handleClick)}disconnectedCallback(){this.root?.removeEventListener(l,this.onRootUpdate),this.removeEventListener("click",this.handleClick),super.disconnectedCallback()}get checkState(){let e=this.node?.value;return e===void 0?!1:this.root?.checkStateOf(e)??!1}get isDisabled(){let e=this.node?.value;return e===void 0?!1:this.root?.index.get(e)?.disabled??this.node?.disabled??!1}isFromNestedItem(e){return e.target.closest('[role="treeitem"]')!==this}updated(){let e=this.root,t=this.node?.value;if(!e||t===void 0)return;let i=e.flatMap.get(t),a=e.index.get(t),s=this.checkState,h=this.isDisabled;this.setAttribute("role","treeitem"),this.id||(this.id=e.itemId(t)),this.setAttribute("data-value",t),this.setAttribute("aria-level",String(a?.depth??1)),this.tabIndex=-1,e.multiple?(this.removeAttribute("aria-selected"),this.setAttribute("aria-checked",s==="mixed"?"mixed":String(s))):(this.setAttribute("aria-selected",String(s===!0)),this.removeAttribute("aria-checked")),this.setAttribute("data-checked",s==="mixed"?"indeterminate":s?"checked":"unchecked"),i?.hasChildren?(this.setAttribute("aria-expanded",String(i.expanded)),this.setAttribute("data-state",i.expanded?"expanded":"collapsed")):(this.removeAttribute("aria-expanded"),this.removeAttribute("data-state")),i&&(this.setAttribute("aria-posinset",String(i.posinset)),this.setAttribute("aria-setsize",String(i.setsize))),h?(this.setAttribute("aria-disabled","true"),this.setAttribute("data-disabled","")):(this.removeAttribute("aria-disabled"),this.removeAttribute("data-disabled")),e.isLoading(t)?(this.setAttribute("aria-busy","true"),this.setAttribute("data-loading","")):(this.removeAttribute("aria-busy"),this.removeAttribute("data-loading")),e.activeValue===t?this.setAttribute("data-highlighted",""):this.removeAttribute("data-highlighted")}};n([p({attribute:!1})],d.prototype,"node",2),d=n([b("skdx-tree-select-item","tree-select","item")],d);export{d as SkdxTreeSelectItem};
+var c=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var n=(r,d,t,e)=>{for(var i=e>1?void 0:e?u(d,t):d,s=r.length-1,o;s>=0;s--)(o=r[s])&&(i=(e?o(d,t,i):o(i))||i);return e&&i&&c(d,t,i),i};import{LitElement as p}from"lit";import{property as h}from"lit/decorators.js";import{customElement as m}from"../internal/define.js";import{installLightDomStyles as b}from"../internal/light-dom-styles.js";import{applyHostPart as v}from"../internal/part.js";import{findTreeSelectRoot as f,TREE_SELECT_INTERNAL_UPDATE as l}from"./TreeSelect.js";function k(r){return r==="mixed"?"indeterminate":r?"checked":"unchecked"}var a=class extends p{constructor(){super(...arguments);this.root=null;this.onRootUpdate=()=>this.requestUpdate();this.handleClick=t=>{if(this.isFromNestedItem(t))return;let e=this.node?.value;if(e===void 0||this.isDisabled)return;this.root?.setActiveValue(e),this.root?.commit(e);let i=this.root?.flatMap.get(e);this.root?.expandsOnClick&&i?.hasChildren&&this.root.setExpanded(e,!i.expanded)}}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),b(),v(this,"tree","item"),this.root=f(this),this.root?.addEventListener(l,this.onRootUpdate),this.addEventListener("click",this.handleClick)}disconnectedCallback(){this.root?.removeEventListener(l,this.onRootUpdate),this.removeEventListener("click",this.handleClick),super.disconnectedCallback()}get checkState(){let t=this.node?.value;return t===void 0?!1:this.root?.checkStateOf(t)??!1}get isDisabled(){let t=this.node?.value;return t===void 0?!1:this.root?.index.get(t)?.disabled??this.node?.disabled??!1}isFromNestedItem(t){return t.target.closest('[role="treeitem"]')!==this}updated(){let t=this.root,e=this.node?.value;!t||e===void 0||(this.syncIdentity(t,e),this.syncCheckState(t),this.syncBranchState(t,e),this.syncAvailability(t,e))}syncIdentity(t,e){let i=t.index.get(e);this.setAttribute("role","treeitem"),this.id||(this.id=t.itemId(e)),this.setAttribute("data-value",e),this.setAttribute("data-skdx-tree-node-id",e),i?.parent?this.setAttribute("data-skdx-tree-parent-id",i.parent):this.removeAttribute("data-skdx-tree-parent-id");let s=this.depth??i?.depth??1;this.setAttribute("aria-level",String(s)),this.style.setProperty("--skdx-tree-node-depth",String(s)),this.tabIndex=-1}syncCheckState(t){let e=this.checkState;t.multiple?(this.removeAttribute("aria-selected"),this.setAttribute("aria-checked",e==="mixed"?"mixed":String(e))):(this.setAttribute("aria-selected",String(e===!0)),this.removeAttribute("aria-checked")),this.setAttribute("data-checked",k(e))}syncBranchState(t,e){let i=t.flatMap.get(e);i?.hasChildren?(this.setAttribute("aria-expanded",String(i.expanded)),this.setAttribute("data-state",i.expanded?"expanded":"collapsed")):(this.removeAttribute("aria-expanded"),this.removeAttribute("data-state")),i&&(this.setAttribute("aria-posinset",String(i.posinset)),this.setAttribute("aria-setsize",String(i.setsize)))}syncAvailability(t,e){this.isDisabled?(this.setAttribute("aria-disabled","true"),this.setAttribute("data-disabled","")):(this.removeAttribute("aria-disabled"),this.removeAttribute("data-disabled")),t.isLoading(e)?(this.setAttribute("aria-busy","true"),this.setAttribute("data-loading","")):(this.removeAttribute("aria-busy"),this.removeAttribute("data-loading")),t.activeValue===e?this.setAttribute("data-highlighted",""):this.removeAttribute("data-highlighted")}};n([h({attribute:!1})],a.prototype,"node",2),n([h({attribute:!1})],a.prototype,"depth",2),a=n([m("skdx-tree-select-item","tree-select","item")],a);export{a as SkdxTreeSelectItem};

package/dist/tree-select/TreeSelectItemIndicator.cjs

@@ -1,5 +1,5 @@
-"use strict";var n=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var f=Object.getOwnPropertyNames;var k=Object.prototype.hasOwnProperty;var y=(o,e)=>{for(var i in e)n(o,i,{get:e[i],enumerable:!0})},E=(o,e,i,s)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of f(e))!k.call(o,t)&&t!==i&&n(o,t,{get:()=>e[t],enumerable:!(s=h(e,t))||s.enumerable});return o};var b=o=>E(n({},"__esModule",{value:!0}),o),m=(o,e,i,s)=>{for(var t=s>1?void 0:s?h(e,i):e,d=o.length-1,a;d>=0;d--)(a=o[d])&&(t=(s?a(e,i,t):a(t))||t);return s&&t&&n(e,i,t),t};var T={};y(T,{SkdxTreeSelectItemIndicator:()=>r});module.exports=b(T);var l=require("lit"),p=require("lit/decorators.js"),u=require("../internal/define.cjs"),v=require("../internal/styles.cjs"),c=require("./TreeSelect.cjs");var r=class extends l.LitElement{constructor(){super(...arguments);this.forceMount=!1;this.root=null;this.item=null;this.onRootUpdate=()=>this.sync()}connectedCallback(){super.connectedCallback(),this.root=(0,c.findTreeSelectRoot)(this),this.item=this.closest("skdx-tree-select-item"),this.root?.addEventListener(c.TREE_SELECT_INTERNAL_UPDATE,this.onRootUpdate),this.setAttribute("aria-hidden","true"),this.sync()}disconnectedCallback(){this.root?.removeEventListener(c.TREE_SELECT_INTERNAL_UPDATE,this.onRootUpdate),super.disconnectedCallback()}updated(){this.sync()}sync(){this.item??(this.item=this.closest("skdx-tree-select-item"));let i=this.item?.checkState??!1;this.setAttribute("data-state",i==="mixed"?"indeterminate":i?"checked":"unchecked"),this.hidden=!this.forceMount&&i===!1}render(){return l.html`<slot></slot>`}};r.styles=[v.hiddenHostStyles,l.css`
+"use strict";var d=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var v=Object.getOwnPropertyNames;var k=Object.prototype.hasOwnProperty;var y=(t,e)=>{for(var o in e)d(t,o,{get:e[o],enumerable:!0})},E=(t,e,o,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of v(e))!k.call(t,i)&&i!==o&&d(t,i,{get:()=>e[i],enumerable:!(r=h(e,i))||r.enumerable});return t};var b=t=>E(d({},"__esModule",{value:!0}),t),m=(t,e,o,r)=>{for(var i=r>1?void 0:r?h(e,o):e,c=t.length-1,a;c>=0;c--)(a=t[c])&&(i=(r?a(e,o,i):a(i))||i);return r&&i&&d(e,o,i),i};var x={};y(x,{SkdxTreeSelectItemIndicator:()=>s});module.exports=b(x);var n=require("lit"),p=require("lit/decorators.js"),u=require("../internal/define.cjs"),f=require("../internal/styles.cjs"),l=require("./TreeSelect.cjs");function T(t){return t==="mixed"?"indeterminate":t?"checked":"unchecked"}var s=class extends n.LitElement{constructor(){super(...arguments);this.forceMount=!1;this.root=null;this.item=null;this.onRootUpdate=()=>this.sync()}connectedCallback(){super.connectedCallback(),this.root=(0,l.findTreeSelectRoot)(this),this.item=this.closest("skdx-tree-select-item"),this.root?.addEventListener(l.TREE_SELECT_INTERNAL_UPDATE,this.onRootUpdate),this.setAttribute("aria-hidden","true"),this.sync()}disconnectedCallback(){this.root?.removeEventListener(l.TREE_SELECT_INTERNAL_UPDATE,this.onRootUpdate),super.disconnectedCallback()}updated(){this.sync()}sync(){this.item??(this.item=this.closest("skdx-tree-select-item"));let o=this.item?.checkState??!1;this.setAttribute("data-state",T(o)),this.hidden=!this.forceMount&&o===!1}render(){return n.html`<slot></slot>`}};s.styles=[f.hiddenHostStyles,n.css`
       :host {
         display: inline-block;
       }
-    `],m([(0,p.property)({type:Boolean,attribute:"force-mount"})],r.prototype,"forceMount",2),r=m([(0,u.customElement)("skdx-tree-select-item-indicator","tree-select","item-indicator")],r);0&&(module.exports={SkdxTreeSelectItemIndicator});
+    `],m([(0,p.property)({type:Boolean,attribute:"force-mount"})],s.prototype,"forceMount",2),s=m([(0,u.customElement)("skdx-tree-select-item-indicator","tree-select","item-indicator")],s);0&&(module.exports={SkdxTreeSelectItemIndicator});

package/dist/tree-select/TreeSelectItemIndicator.d.cts

@@ -1,8 +1,6 @@
-import { LitElement } from 'lit';
+import { LitElement, type TemplateResult } from 'lit';
 /**
- * `<skdx-tree-select-item-indicator>` — marker for a checked (or partially
- * checked) node. Renders `data-state="indeterminate"` for half-chosen branches.
- * Hidden when unchecked unless `force-mount` is set. Render from `renderLabel`.
+ * `<skdx-tree-select-item-indicator>` — marker for a checked (or partially checked) node.
  *
  * @example
  * ```js
@@ -26,7 +24,7 @@ export declare class SkdxTreeSelectItemIndicator extends LitElement {
     disconnectedCallback(): void;
     protected updated(): void;
     private sync;
-    render(): import("lit").TemplateResult<1>;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/tree-select/TreeSelectItemIndicator.d.ts

@@ -1,8 +1,6 @@
-import { LitElement } from 'lit';
+import { LitElement, type TemplateResult } from 'lit';
 /**
- * `<skdx-tree-select-item-indicator>` — marker for a checked (or partially
- * checked) node. Renders `data-state="indeterminate"` for half-chosen branches.
- * Hidden when unchecked unless `force-mount` is set. Render from `renderLabel`.
+ * `<skdx-tree-select-item-indicator>` — marker for a checked (or partially checked) node.
  *
  * @example
  * ```js
@@ -26,7 +24,7 @@ export declare class SkdxTreeSelectItemIndicator extends LitElement {
     disconnectedCallback(): void;
     protected updated(): void;
     private sync;
-    render(): import("lit").TemplateResult<1>;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/tree-select/TreeSelectItemIndicator.js

@@ -1,5 +1,5 @@
-var a=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var n=(r,o,e,s)=>{for(var t=s>1?void 0:s?m(o,e):o,l=r.length-1,c;l>=0;l--)(c=r[l])&&(t=(s?c(o,e,t):c(t))||t);return s&&t&&a(o,e,t),t};import{css as h,html as p,LitElement as u}from"lit";import{property as v}from"lit/decorators.js";import{customElement as f}from"../internal/define.js";import{hiddenHostStyles as k}from"../internal/styles.js";import{findTreeSelectRoot as y,TREE_SELECT_INTERNAL_UPDATE as d}from"./TreeSelect.js";var i=class extends u{constructor(){super(...arguments);this.forceMount=!1;this.root=null;this.item=null;this.onRootUpdate=()=>this.sync()}connectedCallback(){super.connectedCallback(),this.root=y(this),this.item=this.closest("skdx-tree-select-item"),this.root?.addEventListener(d,this.onRootUpdate),this.setAttribute("aria-hidden","true"),this.sync()}disconnectedCallback(){this.root?.removeEventListener(d,this.onRootUpdate),super.disconnectedCallback()}updated(){this.sync()}sync(){this.item??(this.item=this.closest("skdx-tree-select-item"));let e=this.item?.checkState??!1;this.setAttribute("data-state",e==="mixed"?"indeterminate":e?"checked":"unchecked"),this.hidden=!this.forceMount&&e===!1}render(){return p`<slot></slot>`}};i.styles=[k,h`
+var a=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var d=(t,r,i,s)=>{for(var e=s>1?void 0:s?m(r,i):r,n=t.length-1,l;n>=0;n--)(l=t[n])&&(e=(s?l(r,i,e):l(e))||e);return s&&e&&a(r,i,e),e};import{css as h,html as p,LitElement as u}from"lit";import{property as f}from"lit/decorators.js";import{customElement as v}from"../internal/define.js";import{hiddenHostStyles as k}from"../internal/styles.js";import{findTreeSelectRoot as y,TREE_SELECT_INTERNAL_UPDATE as c}from"./TreeSelect.js";function E(t){return t==="mixed"?"indeterminate":t?"checked":"unchecked"}var o=class extends u{constructor(){super(...arguments);this.forceMount=!1;this.root=null;this.item=null;this.onRootUpdate=()=>this.sync()}connectedCallback(){super.connectedCallback(),this.root=y(this),this.item=this.closest("skdx-tree-select-item"),this.root?.addEventListener(c,this.onRootUpdate),this.setAttribute("aria-hidden","true"),this.sync()}disconnectedCallback(){this.root?.removeEventListener(c,this.onRootUpdate),super.disconnectedCallback()}updated(){this.sync()}sync(){this.item??(this.item=this.closest("skdx-tree-select-item"));let i=this.item?.checkState??!1;this.setAttribute("data-state",E(i)),this.hidden=!this.forceMount&&i===!1}render(){return p`<slot></slot>`}};o.styles=[k,h`
       :host {
         display: inline-block;
       }
-    `],n([v({type:Boolean,attribute:"force-mount"})],i.prototype,"forceMount",2),i=n([f("skdx-tree-select-item-indicator","tree-select","item-indicator")],i);export{i as SkdxTreeSelectItemIndicator};
+    `],d([f({type:Boolean,attribute:"force-mount"})],o.prototype,"forceMount",2),o=d([v("skdx-tree-select-item-indicator","tree-select","item-indicator")],o);export{o as SkdxTreeSelectItemIndicator};

package/dist/tree-select/TreeSelectPortal.d.cts

@@ -1,11 +1,6 @@
 import { SkdxPortal } from '../utils/portal.cjs';
 /**
- * `<skdx-tree-select-portal>` — teleports the popup to `document.body` so it
- * escapes clipping and `overflow` ancestors. Wraps the content in a layer carrying
- * a back-reference to the root, since moved children have no `<skdx-tree-select>`
- * ancestor to `closest()`.
- *
- * The host element stays where you wrote it; only the children move.
+ * `<skdx-tree-select-portal>` — teleports the popup to `document.body` so it escapes clipping and `overflow` ancestors.
  *
  * @example
  * ```html
@@ -19,11 +14,7 @@ import { SkdxPortal } from '../utils/portal.cjs';
 export declare class SkdxTreeSelectPortal extends SkdxPortal {
     /** The node the popup lives in — created once, reused across reconnects. */
     private readonly layer;
-    /**
-     * Where the *layer* goes. `container` (inherited) is kept pointing at the
-     * layer at all times, so the consumer's choice is tracked separately rather
-     * than read back off a property this element has already overwritten.
-     */
+    /** Where the *layer* goes, tracked separately since `container` always points at the layer itself. */
     private layerParent;
     connectedCallback(): void;
     disconnectedCallback(): void;

package/dist/tree-select/TreeSelectPortal.d.ts

@@ -1,11 +1,6 @@
 import { SkdxPortal } from '../utils/portal.js';
 /**
- * `<skdx-tree-select-portal>` — teleports the popup to `document.body` so it
- * escapes clipping and `overflow` ancestors. Wraps the content in a layer carrying
- * a back-reference to the root, since moved children have no `<skdx-tree-select>`
- * ancestor to `closest()`.
- *
- * The host element stays where you wrote it; only the children move.
+ * `<skdx-tree-select-portal>` — teleports the popup to `document.body` so it escapes clipping and `overflow` ancestors.
  *
  * @example
  * ```html
@@ -19,11 +14,7 @@ import { SkdxPortal } from '../utils/portal.js';
 export declare class SkdxTreeSelectPortal extends SkdxPortal {
     /** The node the popup lives in — created once, reused across reconnects. */
     private readonly layer;
-    /**
-     * Where the *layer* goes. `container` (inherited) is kept pointing at the
-     * layer at all times, so the consumer's choice is tracked separately rather
-     * than read back off a property this element has already overwritten.
-     */
+    /** Where the *layer* goes, tracked separately since `container` always points at the layer itself. */
     private layerParent;
     connectedCallback(): void;
     disconnectedCallback(): void;

package/dist/tree-select/TreeSelectTree.cjs

@@ -1,24 +1,27 @@
-"use strict";var u=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var E=Object.getOwnPropertyNames;var g=Object.prototype.hasOwnProperty;var w=(o,i)=>{for(var s in i)u(o,s,{get:i[s],enumerable:!0})},y=(o,i,s,r)=>{if(i&&typeof i=="object"||typeof i=="function")for(let e of E(i))!g.call(o,e)&&e!==s&&u(o,e,{get:()=>i[e],enumerable:!(r=x(i,e))||r.enumerable});return o};var C=o=>y(u({},"__esModule",{value:!0}),o),v=(o,i,s,r)=>{for(var e=r>1?void 0:r?x(i,s):i,t=o.length-1,l;t>=0;t--)(l=o[t])&&(e=(r?l(i,s,e):l(e))||e);return r&&e&&u(i,s,e),e};var $={};w($,{SkdxTreeSelectTree:()=>n});module.exports=C($);var a=require("lit"),f=require("lit/decorators.js"),b=require("lit/directives/repeat.js"),R=require("../internal/define.cjs"),k=require("../internal/styles.cjs"),d=require("./TreeSelect.cjs"),N=require("./TreeSelectItem.cjs");var n=class extends a.LitElement{constructor(){super(...arguments);this.root=null;this.onRootUpdate=()=>this.requestUpdate();this.handleExpandClick=(s,r)=>{s.stopPropagation();let e=this.root,t=e?.flatMap.get(r);!e||!t?.hasChildren||e.setExpanded(r,!t.expanded)}}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),(0,k.installLightDomStyles)(),this.root=(0,d.findTreeSelectRoot)(this),this.root?.addEventListener(d.TREE_SELECT_INTERNAL_UPDATE,this.onRootUpdate),this.setAttribute("role","tree"),this.root&&(this.id?this.root.treeId=this.id:this.id=this.root.treeId)}disconnectedCallback(){this.root?.removeEventListener(d.TREE_SELECT_INTERNAL_UPDATE,this.onRootUpdate),this.root?.setVisibleRowValues(null),super.disconnectedCallback()}updated(){this.root?.multiple?this.setAttribute("aria-multiselectable","true"):this.removeAttribute("aria-multiselectable"),this.root?.readOnly?this.setAttribute("aria-readonly","true"):this.removeAttribute("aria-readonly"),this.rows!==this._lastReportedRows&&(this._lastReportedRows=this.rows,this.root?.setVisibleRowValues(this.rows?new Set(this.rows.map(s=>s.value)):null))}renderNodes(s){let r=this.root;if(!r)return a.nothing;let e=s.filter(t=>r.isVisible(t.value));return(0,b.repeat)(e,t=>t.value,t=>{let l=r.flatMap.get(t.value),p=(t.children??[]).filter(m=>r.isVisible(m.value)),h=l?.hasChildren??p.length>0,c=l?.expanded??!1;return a.html`<skdx-tree-select-item .node=${t}>
-          ${h?a.html`<span
+"use strict";var c=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var R=Object.getOwnPropertyNames;var g=Object.prototype.hasOwnProperty;var y=(a,o)=>{for(var r in o)c(a,r,{get:o[r],enumerable:!0})},w=(a,o,r,s)=>{if(o&&typeof o=="object"||typeof o=="function")for(let e of R(o))!g.call(a,e)&&e!==r&&c(a,e,{get:()=>o[e],enumerable:!(s=x(o,e))||s.enumerable});return a};var C=a=>w(c({},"__esModule",{value:!0}),a),m=(a,o,r,s)=>{for(var e=s>1?void 0:s?x(o,r):o,t=a.length-1,n;t>=0;t--)(n=a[t])&&(e=(s?n(o,r,e):n(e))||e);return s&&e&&c(o,r,e),e};var L={};y(L,{SkdxTreeSelectTree:()=>l});module.exports=C(L);var i=require("lit"),f=require("lit/decorators.js"),b=require("lit/directives/repeat.js"),k=require("../internal/define.cjs"),E=require("../internal/light-dom-styles.cjs"),d=require("./TreeSelect.cjs"),N=require("./TreeSelectItem.cjs");var l=class extends i.LitElement{constructor(){super(...arguments);this.root=null;this.onRootUpdate=()=>this.requestUpdate();this.handleExpandClick=(r,s)=>{r.stopPropagation();let e=this.root,t=e?.flatMap.get(s);!e||!t?.hasChildren||e.setExpanded(s,!t.expanded)}}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),(0,E.installLightDomStyles)(),this.root=(0,d.findTreeSelectRoot)(this),this.root?.addEventListener(d.TREE_SELECT_INTERNAL_UPDATE,this.onRootUpdate),this.setAttribute("role","tree");let r=this.parentElement?.localName==="skdx-tree-select-columns";this.root&&!r&&(this.id?this.root.treeId=this.id:this.id=this.root.treeId)}disconnectedCallback(){this.root?.removeEventListener(d.TREE_SELECT_INTERNAL_UPDATE,this.onRootUpdate),this.root?.setVisibleRowValues(null),super.disconnectedCallback()}invalidate(r){this.root?.invalidateLoad(r)}updated(){let r=this.rows===void 0&&this.root?.effectiveLayout==="columns";this.hidden=r,r?this.setAttribute("aria-hidden","true"):this.removeAttribute("aria-hidden"),this.root?.multiple?this.setAttribute("aria-multiselectable","true"):this.removeAttribute("aria-multiselectable"),this.root?.readOnly?this.setAttribute("aria-readonly","true"):this.removeAttribute("aria-readonly"),this.rows!==this._lastReportedRows&&(this._lastReportedRows=this.rows,this.root?.setVisibleRowValues(this.rows?new Set(this.rows.map(s=>s.value)):null))}renderNodes(r){let s=this.root;if(!s)return i.nothing;let e=r.filter(t=>s.isVisible(t.value));return(0,b.repeat)(e,t=>t.value,t=>{let n=s.flatMap.get(t.value),h=(t.children??[]).filter(v=>s.isVisible(v.value)),p=n?.hasChildren??h.length>0,u=n?.expanded??!1;return i.html`<skdx-tree-select-item .node=${t}>
+          ${p?i.html`<span
                   data-skdx-tree-select-expand
-                  data-state=${c?"expanded":"collapsed"}
+                  data-state=${u?"expanded":"collapsed"}
                   aria-hidden="true"
-                  @click=${m=>this.handleExpandClick(m,t.value)}
+                  @click=${v=>this.handleExpandClick(v,t.value)}
                   >▸</span
-                >`:a.nothing}
+                >`:i.nothing}
           <span data-skdx-tree-select-label
             >${this.renderLabel?.(t)??t.label??t.value}</span
           >
-          ${h&&c?a.html`<div role="group">${this.renderNodes(p)}</div>`:a.nothing}
-        </skdx-tree-select-item>`})}renderRows(s){let r=this.root;return r?(0,b.repeat)(s,e=>e.value,e=>{let t=r.index.get(e.value)?.node;if(!t)return a.nothing;let l=r.flatMap.get(e.value),p=l?.hasChildren??!1,h=l?.expanded??!1;return a.html`<skdx-tree-select-item .node=${t}>
-          ${p?a.html`<span
+          ${p&&u?i.html`<div role="group">${this.renderNodes(h)}</div>`:i.nothing}
+        </skdx-tree-select-item>`})}renderRows(r){let s=this.root;return s?(0,b.repeat)(r,e=>e.value,e=>{let t=s.index.get(e.value)?.node;if(!t)return i.nothing;let n=s.flatMap.get(e.value),h=n?.hasChildren??!1,p=n?.expanded??!1;return i.html`<skdx-tree-select-item
+          .node=${t}
+          .depth=${e.depth}
+        >
+          ${h?i.html`<span
                   data-skdx-tree-select-expand
-                  data-state=${h?"expanded":"collapsed"}
+                  data-state=${p?"expanded":"collapsed"}
                   aria-hidden="true"
-                  @click=${c=>this.handleExpandClick(c,e.value)}
+                  @click=${u=>this.handleExpandClick(u,e.value)}
                   >▸</span
-                >`:a.nothing}
+                >`:i.nothing}
           <span data-skdx-tree-select-label
             >${this.renderLabel?.(t)??t.label??t.value}</span
           >
-        </skdx-tree-select-item>`}):a.nothing}render(){return this.rows?this.renderRows(this.rows):this.renderNodes(this.root?.collection??[])}};v([(0,f.property)({attribute:!1})],n.prototype,"renderLabel",2),v([(0,f.property)({attribute:!1})],n.prototype,"rows",2),n=v([(0,R.customElement)("skdx-tree-select-tree","tree-select","tree")],n);0&&(module.exports={SkdxTreeSelectTree});
+        </skdx-tree-select-item>`}):i.nothing}render(){return this.rows?this.renderRows(this.rows):this.root?.effectiveLayout==="columns"?i.nothing:this.renderNodes(this.root?.collection??[])}};m([(0,f.property)({attribute:!1})],l.prototype,"renderLabel",2),m([(0,f.property)({attribute:!1})],l.prototype,"rows",2),l=m([(0,k.customElement)("skdx-tree-select-tree","tree-select","tree")],l);0&&(module.exports={SkdxTreeSelectTree});

package/dist/tree-select/TreeSelectTree.d.cts

@@ -2,8 +2,7 @@ import { LitElement, type TemplateResult } from 'lit';
 import type { TreeSelectNode } from './types.cjs';
 import './TreeSelectItem.cjs';
 /**
- * Tree (`role="tree"`) inside popup, one item per visible node. Light DOM for ARIA relationships.
- * Navigation on trigger/filter; each node has `tabindex="-1"`. Needs `aria-label` or `aria-labelledby`.
+ * Tree (`role="tree"`) inside the popup, one item per visible node.
  *
  * @example
  * ```html
@@ -17,20 +16,25 @@ export declare class SkdxTreeSelectTree extends LitElement {
      */
     renderLabel?: (node: TreeSelectNode) => TemplateResult | string;
     /**
-     * Renders exactly this row set instead of the whole collection — seam for windowing libraries. Rows render flat, one item each; `aria-level`/`aria-posinset`/`aria-setsize` stay correct from unwindowed collection.
+     * Renders exactly this row set instead of the whole collection, a seam for windowing libraries.
      * @default undefined — renders every visible node from `collection`, nested.
      */
     rows?: readonly {
         value: string;
         depth: number;
-    }[];
+    }[] | undefined;
     private root;
     private readonly onRootUpdate;
     private _lastReportedRows?;
-    /** Light DOM, for the ARIA reasons in the class docblock. */
+    /** Light DOM, an ARIA requirement for treeitem relationships within `role="tree"`. */
     protected createRenderRoot(): HTMLElement;
     connectedCallback(): void;
     disconnectedCallback(): void;
+    /**
+     * Clears cached load state for a node, or the whole tree when omitted.
+     * @default n/a
+     */
+    invalidate(nodeId?: string): void;
     protected updated(): void;
     private readonly handleExpandClick;
     private renderNodes;

package/dist/tree-select/TreeSelectTree.d.ts

@@ -2,8 +2,7 @@ import { LitElement, type TemplateResult } from 'lit';
 import type { TreeSelectNode } from './types.js';
 import './TreeSelectItem.js';
 /**
- * Tree (`role="tree"`) inside popup, one item per visible node. Light DOM for ARIA relationships.
- * Navigation on trigger/filter; each node has `tabindex="-1"`. Needs `aria-label` or `aria-labelledby`.
+ * Tree (`role="tree"`) inside the popup, one item per visible node.
  *
  * @example
  * ```html
@@ -17,20 +16,25 @@ export declare class SkdxTreeSelectTree extends LitElement {
      */
     renderLabel?: (node: TreeSelectNode) => TemplateResult | string;
     /**
-     * Renders exactly this row set instead of the whole collection — seam for windowing libraries. Rows render flat, one item each; `aria-level`/`aria-posinset`/`aria-setsize` stay correct from unwindowed collection.
+     * Renders exactly this row set instead of the whole collection, a seam for windowing libraries.
      * @default undefined — renders every visible node from `collection`, nested.
      */
     rows?: readonly {
         value: string;
         depth: number;
-    }[];
+    }[] | undefined;
     private root;
     private readonly onRootUpdate;
     private _lastReportedRows?;
-    /** Light DOM, for the ARIA reasons in the class docblock. */
+    /** Light DOM, an ARIA requirement for treeitem relationships within `role="tree"`. */
     protected createRenderRoot(): HTMLElement;
     connectedCallback(): void;
     disconnectedCallback(): void;
+    /**
+     * Clears cached load state for a node, or the whole tree when omitted.
+     * @default n/a
+     */
+    invalidate(nodeId?: string): void;
     protected updated(): void;
     private readonly handleExpandClick;
     private renderNodes;