@skdx/web-components 0.28.0 → 0.29.0

package/dist/tree/TreeItem.d.cts

@@ -1,10 +1,6 @@
-import { LitElement } from 'lit';
+import { LitElement, type TemplateResult } from 'lit';
 /**
- * Single tree node (`role="treeitem"`). Renders `aria-level` (depth), `aria-posinset` / `aria-setsize`
- * (position in siblings), `aria-selected` (unless `selection-mode="none"`), `aria-expanded` (if has children),
- * `data-state`, `data-disabled`. Click selects / toggles expansion; focus activates (roving tabindex).
- * Under `selection-propagation="descendants"`: `aria-checked` / `data-checked` instead of `aria-selected`.
- * While loading: `aria-busy="true"` / `data-loading`.
+ * Single tree node (`role="treeitem"`), rendering `aria-level`, `aria-posinset`/`aria-setsize`, `aria-selected` or `aria-checked`, and `aria-expanded` as applicable.
  *
  * @example
  * ```html
@@ -21,30 +17,15 @@ export declare class SkdxTreeItem extends LitElement {
     static styles: import("lit").CSSResult[];
     /** Unique identifier tracked in the tree's expanded/selected/active state. */
     nodeId: string;
-    /**
-     * Excludes **this node** from selection and keyboard activation, and — under
-     * the root's default `disabled-behavior="all"` — from the roving-focus and
-     * typeahead order too. It is not inherited: a node's subtree stays fully
-     * navigable and selectable, because a disabled folder is a folder you may not
-     * pick, not a folder whose contents vanish.
-     */
+    /** Excludes this node from selection and keyboard activation; not inherited by its subtree. */
     disabled: boolean;
     /**
-     * The text typeahead matches this node against, instead of its rendered
-     * label. Published as `data-text-value`. Use it when the label is not plain
-     * text, or when the searchable text differs from the visible one.
+     * The text typeahead matches this node against, instead of its rendered label; published as `data-text-value`.
      * @default undefined — typeahead matches the node's rendered text instead.
      */
     textValue?: string;
     /**
-     * Declares whether this node is a branch, overriding the
-     * `<skdx-tree-group>` scan that decides it otherwise. Present (or set to
-     * `true`) makes the node report `aria-expanded` and accept ArrowRight (and a
-     * click) with no group in it at all, which is what a lazily-loaded branch
-     * needs: `loadChildren` only runs because the node was expanded, and until
-     * then there is nothing to render a group around. Set the *property* to
-     * `false` to force the node to read as a leaf even with a group inside it —
-     * the attribute is boolean, so it can only say "yes".
+     * Declares whether this node is a branch, overriding the `<skdx-tree-group>` scan that decides it otherwise.
      * @default undefined — the group scan decides.
      */
     hasChildren?: boolean;
@@ -58,13 +39,9 @@ export declare class SkdxTreeItem extends LitElement {
     /** The `aria-setsize` this instance last wrote, mirroring {@link _writtenLevel}. */
     private _writtenSetsize;
     private readonly onRootUpdate;
-    /**
-     * @internal Whether this node is a branch: its own `has-children` declaration
-     * when it makes one, otherwise whether it has a direct `<skdx-tree-group>`
-     * child. The declaration wins in both directions.
-     */
+    /** @internal Whether this node is a branch: its own `has-children` declaration, or a `<skdx-tree-group>` of its own at any depth. */
     get resolvedHasChildren(): boolean;
-    /** @internal */
+    /** @internal Guarded against a root whose custom-element definition hasn't loaded yet. */
     get expanded(): boolean;
     /** @internal */
     get selected(): boolean;
@@ -73,36 +50,22 @@ export declare class SkdxTreeItem extends LitElement {
     protected updated(changed: Map<string, unknown>): void;
     /** @internal Toggles this node's expansion, if it has children. Used by `<skdx-tree-item-indicator>`. */
     toggleExpanded(): void;
-    /**
-     * True when the click started inside a *nested* `<skdx-tree-item>` rather than
-     * this one. A nested item renders inside its ancestors, so its click bubbles
-     * to every ancestor's own listener as well; without this, clicking a leaf
-     * would select and collapse the whole branch above it.
-     *
-     * Focus needs no such guard here: the tree listens for `focusin` once on the
-     * root and resolves `event.target.closest('[role="treeitem"]')`, which is
-     * already the innermost item.
-     */
+    /** True when the click started inside a *nested* `<skdx-tree-item>` rather than this one. */
     private isFromNestedItem;
     private readonly handleClick;
     private computeDepth;
     private computeParentId;
-    /**
-     * Writes `aria-level` unless the current value is an author override — one
-     * that doesn't match what this method itself last wrote. A windowed tree
-     * can only report its true depth through this attribute, so an explicit
-     * author value must survive every later render.
-     */
+    /** Writes `aria-level` unless the current value is an author override that doesn't match what this method last wrote. */
     private syncLevel;
-    /**
-     * @internal Writes `aria-posinset`/`aria-setsize` unless the author
-     * overrode one, mirroring {@link syncLevel}. Called by the root's
-     * `syncNodePositions` rather than from `sync()`, since only the root knows
-     * the sibling counts.
-     */
+    /** @internal Writes `aria-posinset`/`aria-setsize` unless the author overrode one, mirroring {@link syncLevel}. */
     syncPosition(posinset: number, setsize: number): void;
+    private _syncAriaState;
+    private _syncDataState;
+    private _syncTextValue;
+    private _syncIdentity;
+    private _syncTabIndex;
     private sync;
-    render(): import("lit").TemplateResult<1>;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/tree/TreeItem.d.ts

@@ -1,10 +1,6 @@
-import { LitElement } from 'lit';
+import { LitElement, type TemplateResult } from 'lit';
 /**
- * Single tree node (`role="treeitem"`). Renders `aria-level` (depth), `aria-posinset` / `aria-setsize`
- * (position in siblings), `aria-selected` (unless `selection-mode="none"`), `aria-expanded` (if has children),
- * `data-state`, `data-disabled`. Click selects / toggles expansion; focus activates (roving tabindex).
- * Under `selection-propagation="descendants"`: `aria-checked` / `data-checked` instead of `aria-selected`.
- * While loading: `aria-busy="true"` / `data-loading`.
+ * Single tree node (`role="treeitem"`), rendering `aria-level`, `aria-posinset`/`aria-setsize`, `aria-selected` or `aria-checked`, and `aria-expanded` as applicable.
  *
  * @example
  * ```html
@@ -21,30 +17,15 @@ export declare class SkdxTreeItem extends LitElement {
     static styles: import("lit").CSSResult[];
     /** Unique identifier tracked in the tree's expanded/selected/active state. */
     nodeId: string;
-    /**
-     * Excludes **this node** from selection and keyboard activation, and — under
-     * the root's default `disabled-behavior="all"` — from the roving-focus and
-     * typeahead order too. It is not inherited: a node's subtree stays fully
-     * navigable and selectable, because a disabled folder is a folder you may not
-     * pick, not a folder whose contents vanish.
-     */
+    /** Excludes this node from selection and keyboard activation; not inherited by its subtree. */
     disabled: boolean;
     /**
-     * The text typeahead matches this node against, instead of its rendered
-     * label. Published as `data-text-value`. Use it when the label is not plain
-     * text, or when the searchable text differs from the visible one.
+     * The text typeahead matches this node against, instead of its rendered label; published as `data-text-value`.
      * @default undefined — typeahead matches the node's rendered text instead.
      */
     textValue?: string;
     /**
-     * Declares whether this node is a branch, overriding the
-     * `<skdx-tree-group>` scan that decides it otherwise. Present (or set to
-     * `true`) makes the node report `aria-expanded` and accept ArrowRight (and a
-     * click) with no group in it at all, which is what a lazily-loaded branch
-     * needs: `loadChildren` only runs because the node was expanded, and until
-     * then there is nothing to render a group around. Set the *property* to
-     * `false` to force the node to read as a leaf even with a group inside it —
-     * the attribute is boolean, so it can only say "yes".
+     * Declares whether this node is a branch, overriding the `<skdx-tree-group>` scan that decides it otherwise.
      * @default undefined — the group scan decides.
      */
     hasChildren?: boolean;
@@ -58,13 +39,9 @@ export declare class SkdxTreeItem extends LitElement {
     /** The `aria-setsize` this instance last wrote, mirroring {@link _writtenLevel}. */
     private _writtenSetsize;
     private readonly onRootUpdate;
-    /**
-     * @internal Whether this node is a branch: its own `has-children` declaration
-     * when it makes one, otherwise whether it has a direct `<skdx-tree-group>`
-     * child. The declaration wins in both directions.
-     */
+    /** @internal Whether this node is a branch: its own `has-children` declaration, or a `<skdx-tree-group>` of its own at any depth. */
     get resolvedHasChildren(): boolean;
-    /** @internal */
+    /** @internal Guarded against a root whose custom-element definition hasn't loaded yet. */
     get expanded(): boolean;
     /** @internal */
     get selected(): boolean;
@@ -73,36 +50,22 @@ export declare class SkdxTreeItem extends LitElement {
     protected updated(changed: Map<string, unknown>): void;
     /** @internal Toggles this node's expansion, if it has children. Used by `<skdx-tree-item-indicator>`. */
     toggleExpanded(): void;
-    /**
-     * True when the click started inside a *nested* `<skdx-tree-item>` rather than
-     * this one. A nested item renders inside its ancestors, so its click bubbles
-     * to every ancestor's own listener as well; without this, clicking a leaf
-     * would select and collapse the whole branch above it.
-     *
-     * Focus needs no such guard here: the tree listens for `focusin` once on the
-     * root and resolves `event.target.closest('[role="treeitem"]')`, which is
-     * already the innermost item.
-     */
+    /** True when the click started inside a *nested* `<skdx-tree-item>` rather than this one. */
     private isFromNestedItem;
     private readonly handleClick;
     private computeDepth;
     private computeParentId;
-    /**
-     * Writes `aria-level` unless the current value is an author override — one
-     * that doesn't match what this method itself last wrote. A windowed tree
-     * can only report its true depth through this attribute, so an explicit
-     * author value must survive every later render.
-     */
+    /** Writes `aria-level` unless the current value is an author override that doesn't match what this method last wrote. */
     private syncLevel;
-    /**
-     * @internal Writes `aria-posinset`/`aria-setsize` unless the author
-     * overrode one, mirroring {@link syncLevel}. Called by the root's
-     * `syncNodePositions` rather than from `sync()`, since only the root knows
-     * the sibling counts.
-     */
+    /** @internal Writes `aria-posinset`/`aria-setsize` unless the author overrode one, mirroring {@link syncLevel}. */
     syncPosition(posinset: number, setsize: number): void;
+    private _syncAriaState;
+    private _syncDataState;
+    private _syncTextValue;
+    private _syncIdentity;
+    private _syncTabIndex;
     private sync;
-    render(): import("lit").TemplateResult<1>;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/tree/TreeItem.js

@@ -1,5 +1,5 @@
-var b=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var n=(h,o,t,e)=>{for(var i=e>1?void 0:e?m(o,t):o,r=h.length-1,d;r>=0;r--)(d=h[r])&&(i=(e?d(o,t,i):d(i))||i);return e&&i&&b(o,t,i),i};import{css as g,html as x,LitElement as A}from"lit";import{property as l}from"lit/decorators.js";import{customElement as f,whenUpgraded as k}from"../internal/define.js";import{hiddenHostStyles as y}from"../internal/styles.js";var s=class extends A{constructor(){super(...arguments);this.nodeId="";this.disabled=!1;this.root=null;this._ownsTextValue=!1;this._writtenLevel=null;this._writtenPosinset=null;this._writtenSetsize=null;this.onRootUpdate=()=>this.sync();this.handleClick=t=>{this.disabled||this.isFromNestedItem(t)||(this.root?.toggleSelected(this.nodeId),this.root?.emitActivate(this.nodeId),this.root?.expandOnClick!==!1&&this.toggleExpanded())}}get resolvedHasChildren(){return this.hasChildren??this.querySelector(":scope > skdx-tree-group")!==null}get expanded(){return this.root?.expandedIdSet.has(this.nodeId)??!1}get selected(){return this.root?.selectedIdSet.has(this.nodeId)??!1}connectedCallback(){super.connectedCallback(),this.root=this.closest("skdx-tree"),this.root?.addEventListener("skdx-tree-internal-update",this.onRootUpdate),this.addEventListener("click",this.handleClick),this.root?k(this.root,()=>{this.root?.registerNode(this.nodeId,this.computeParentId()||null),this.sync(),this.root?.ensureActiveNodeId(),this.root?.syncNodePositions()}):this.sync()}disconnectedCallback(){this.root?.removeEventListener("skdx-tree-internal-update",this.onRootUpdate),this.removeEventListener("click",this.handleClick),this.root?.unregisterNode(this.nodeId),super.disconnectedCallback(),this.root?.ensureActiveNodeId(),this.root?.syncNodePositions()}updated(t){(t.has("disabled")||t.has("nodeId")||t.has("hasChildren")||t.has("textValue"))&&this.sync()}toggleExpanded(){this.resolvedHasChildren&&this.root?.setExpanded(this.nodeId,!this.expanded)}isFromNestedItem(t){return t.target.closest('[role="treeitem"]')!==this}computeDepth(){let t=1,e=this.parentElement;for(;e;)e.tagName==="SKDX-TREE-ITEM"&&t++,e=e.parentElement;return t}computeParentId(){return this.closest("skdx-tree-group")?.closest("skdx-tree-item")?.getAttribute("data-skdx-tree-node-id")??""}syncLevel(){let t=this.getAttribute("aria-level");t!==null&&t!==this._writtenLevel||(this._writtenLevel=String(this.computeDepth()),this.setAttribute("aria-level",this._writtenLevel))}syncPosition(t,e){let i=this.getAttribute("aria-posinset");(i===null||i===this._writtenPosinset)&&(this._writtenPosinset=String(t),this.setAttribute("aria-posinset",this._writtenPosinset));let r=this.getAttribute("aria-setsize");(r===null||r===this._writtenSetsize)&&(this._writtenSetsize=String(e),this.setAttribute("aria-setsize",this._writtenSetsize))}sync(){let t=this.root,e=this.resolvedHasChildren,i=this.expanded,r=this.selected,d=t?.selectionMode??"single";this.setAttribute("role","treeitem"),this.syncLevel();let u=t?.selectionPropagation==="descendants";if(d==="none"||u?this.removeAttribute("aria-selected"):this.setAttribute("aria-selected",String(r)),e?this.setAttribute("aria-expanded",String(i)):this.removeAttribute("aria-expanded"),this.disabled?(this.setAttribute("aria-disabled","true"),this.setAttribute("data-disabled","")):(this.removeAttribute("aria-disabled"),this.removeAttribute("data-disabled")),e?this.setAttribute("data-state",i?"expanded":"collapsed"):this.removeAttribute("data-state"),t?.isLoading(this.nodeId)?(this.setAttribute("aria-busy","true"),this.setAttribute("data-loading","")):(this.removeAttribute("aria-busy"),this.removeAttribute("data-loading")),u){let a=t.checkedState(this.nodeId);this.setAttribute("aria-checked",a==="mixed"?"mixed":String(a)),this.setAttribute("data-checked",a==="mixed"?"indeterminate":a?"checked":"unchecked")}else this.removeAttribute("aria-checked"),this.removeAttribute("data-checked");this.textValue===void 0?(this._ownsTextValue&&this.removeAttribute("data-text-value"),this._ownsTextValue=!1):(this.setAttribute("data-text-value",this.textValue),this._ownsTextValue=!0),this.style.setProperty("--skdx-tree-node-depth",String(this.computeDepth())),this.setAttribute("data-skdx-tree-node-id",this.nodeId);let c=this.computeParentId();c?this.setAttribute("data-skdx-tree-parent-id",c):this.removeAttribute("data-skdx-tree-parent-id");let p=t?.activeNodeId===this.nodeId,v=this.disabled&&t?.disabledBehavior!=="selection";this.tabIndex=v?-1:p?0:-1,this.dispatchEvent(new CustomEvent("skdx-tree-item-internal-update"))}render(){return x`<slot></slot>`}};s.styles=[y,g`
+var b=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var a=(o,d,t,e)=>{for(var i=e>1?void 0:e?m(d,t):d,s=o.length-1,n;s>=0;s--)(n=o[s])&&(i=(e?n(d,t,i):n(i))||i);return e&&i&&b(d,t,i),i};import{css as g,html as f,LitElement as x}from"lit";import{property as l}from"lit/decorators.js";import{customElement as y,isUpgraded as u,whenUpgraded as A}from"../internal/define.js";import{hiddenHostStyles as k}from"../internal/styles.js";import{TREE_FAMILY as c,TREE_ITEM_FAMILY as v}from"./family.js";function _(o){return o==="mixed"?"indeterminate":o?"checked":"unchecked"}var r=class extends x{constructor(){super(...arguments);this.nodeId="";this.disabled=!1;this.root=null;this._ownsTextValue=!1;this._writtenLevel=null;this._writtenPosinset=null;this._writtenSetsize=null;this.onRootUpdate=()=>this.sync();this.handleClick=t=>{this.disabled||this.isFromNestedItem(t)||(this.root?.toggleSelected(this.nodeId),this.root?.emitActivate(this.nodeId),this.root?.expandOnClick!==!1&&this.toggleExpanded())}}get resolvedHasChildren(){if(this.hasChildren!==void 0)return this.hasChildren;for(let t of this.querySelectorAll("skdx-tree-group"))if(v.root(t)===this)return!0;return!1}get expanded(){return this.root&&u(this.root)?this.root.expandedIdSet.has(this.nodeId):!1}get selected(){return this.root&&u(this.root)?this.root.selectedIdSet.has(this.nodeId):!1}connectedCallback(){super.connectedCallback(),this.root=c.root(this),this.root?.addEventListener(c.event,this.onRootUpdate),this.addEventListener("click",this.handleClick),this.root?A(this.root,()=>{this.root?.registerNode(this.nodeId,this.computeParentId()||null),this.sync(),this.root?.ensureActiveNodeId(),this.root?.syncNodePositions()}):this.sync()}disconnectedCallback(){this.root?.removeEventListener(c.event,this.onRootUpdate),this.removeEventListener("click",this.handleClick),this.root?.unregisterNode(this.nodeId),super.disconnectedCallback(),this.root?.ensureActiveNodeId(),this.root?.syncNodePositions()}updated(t){(t.has("disabled")||t.has("nodeId")||t.has("hasChildren")||t.has("textValue"))&&this.sync()}toggleExpanded(){this.resolvedHasChildren&&this.root?.setExpanded(this.nodeId,!this.expanded)}isFromNestedItem(t){return t.target.closest('[role="treeitem"]')!==this}computeDepth(){let t=1,e=this.parentElement;for(;e;)e.tagName==="SKDX-TREE-ITEM"&&t++,e=e.parentElement;return t}computeParentId(){return this.closest("skdx-tree-group")?.closest("skdx-tree-item")?.getAttribute("data-skdx-tree-node-id")??""}syncLevel(){let t=this.getAttribute("aria-level");t!==null&&t!==this._writtenLevel||(this._writtenLevel=String(this.computeDepth()),this.setAttribute("aria-level",this._writtenLevel))}syncPosition(t,e){let i=this.getAttribute("aria-posinset");(i===null||i===this._writtenPosinset)&&(this._writtenPosinset=String(t),this.setAttribute("aria-posinset",this._writtenPosinset));let s=this.getAttribute("aria-setsize");(s===null||s===this._writtenSetsize)&&(this._writtenSetsize=String(e),this.setAttribute("aria-setsize",this._writtenSetsize))}_syncAriaState(t,e,i,s,n){let p=t?.selectionPropagation==="descendants";if(n==="none"||p?this.removeAttribute("aria-selected"):this.setAttribute("aria-selected",String(s)),e?this.setAttribute("aria-expanded",String(i)):this.removeAttribute("aria-expanded"),this.disabled?(this.setAttribute("aria-disabled","true"),this.setAttribute("data-disabled","")):(this.removeAttribute("aria-disabled"),this.removeAttribute("data-disabled")),p&&t){let h=t.checkedState(this.nodeId);this.setAttribute("aria-checked",h==="mixed"?"mixed":String(h)),this.setAttribute("data-checked",_(h))}else this.removeAttribute("aria-checked"),this.removeAttribute("data-checked")}_syncDataState(t,e,i){e?this.setAttribute("data-state",i?"expanded":"collapsed"):this.removeAttribute("data-state"),t?.isLoading(this.nodeId)?(this.setAttribute("aria-busy","true"),this.setAttribute("data-loading","")):(this.removeAttribute("aria-busy"),this.removeAttribute("data-loading"))}_syncTextValue(){this.textValue===void 0?(this._ownsTextValue&&this.removeAttribute("data-text-value"),this._ownsTextValue=!1):(this.setAttribute("data-text-value",this.textValue),this._ownsTextValue=!0)}_syncIdentity(){this.style.setProperty("--skdx-tree-node-depth",String(this.computeDepth())),this.setAttribute("data-skdx-tree-node-id",this.nodeId);let t=this.computeParentId();t?this.setAttribute("data-skdx-tree-parent-id",t):this.removeAttribute("data-skdx-tree-parent-id")}_syncTabIndex(t){let e=t?.activeNodeId===this.nodeId,i=this.disabled&&t?.disabledBehavior!=="selection";this.tabIndex=!i&&e?0:-1}sync(){if(this.root&&!u(this.root))return;let t=this.root,e=this.resolvedHasChildren,i=this.expanded,s=this.selected,n=t?.selectionMode??"single";this.setAttribute("role","treeitem"),this.syncLevel(),this._syncAriaState(t,e,i,s,n),this._syncDataState(t,e,i),this._syncTextValue(),this._syncIdentity(),this._syncTabIndex(t),v.notify(this)}render(){return f`<slot></slot>`}};r.styles=[k,g`
       :host {
         display: block;
       }
-    `],n([l({type:String,attribute:"node-id"})],s.prototype,"nodeId",2),n([l({type:Boolean,reflect:!0})],s.prototype,"disabled",2),n([l({type:String,attribute:"text-value"})],s.prototype,"textValue",2),n([l({type:Boolean,attribute:"has-children"})],s.prototype,"hasChildren",2),s=n([f("skdx-tree-item","tree","item")],s);export{s as SkdxTreeItem};
+    `],a([l({type:String,attribute:"node-id"})],r.prototype,"nodeId",2),a([l({type:Boolean,reflect:!0})],r.prototype,"disabled",2),a([l({type:String,attribute:"text-value"})],r.prototype,"textValue",2),a([l({type:Boolean,attribute:"has-children"})],r.prototype,"hasChildren",2),r=a([y("skdx-tree-item","tree","item")],r);export{r as SkdxTreeItem};

package/dist/tree/TreeItemIndicator.cjs

@@ -1,5 +1,5 @@
-"use strict";var a=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var v=Object.getOwnPropertyNames;var k=Object.prototype.hasOwnProperty;var u=(i,e)=>{for(var s in e)a(i,s,{get:e[s],enumerable:!0})},b=(i,e,s,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of v(e))!k.call(i,t)&&t!==s&&a(i,t,{get:()=>e[t],enumerable:!(r=m(e,t))||r.enumerable});return i};var x=i=>b(a({},"__esModule",{value:!0}),i),c=(i,e,s,r)=>{for(var t=r>1?void 0:r?m(e,s):e,l=i.length-1,o;l>=0;l--)(o=i[l])&&(t=(r?o(e,s,t):o(t))||t);return r&&t&&a(e,s,t),t};var y={};u(y,{SkdxTreeItemIndicator:()=>d});module.exports=x(y);var n=require("lit"),h=require("../internal/define.cjs"),p=require("../internal/styles.cjs");var d=class extends n.LitElement{constructor(){super(...arguments);this.item=null;this.onItemUpdate=()=>this.sync();this.handleClick=s=>{s.stopPropagation(),this.item?.toggleExpanded()}}connectedCallback(){super.connectedCallback(),this.setAttribute("aria-hidden","true"),this.item=this.closest("skdx-tree-item"),this.item?.addEventListener("skdx-tree-item-internal-update",this.onItemUpdate),this.addEventListener("click",this.handleClick),this.sync()}disconnectedCallback(){this.item?.removeEventListener("skdx-tree-item-internal-update",this.onItemUpdate),this.removeEventListener("click",this.handleClick),super.disconnectedCallback()}sync(){if(!this.item?.resolvedHasChildren){this.removeAttribute("data-state");return}this.setAttribute("data-state",this.item.expanded?"expanded":"collapsed")}render(){return n.html`<slot></slot>`}};d.styles=[p.hiddenHostStyles,n.css`
+"use strict";var o=Object.defineProperty;var c=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var E=Object.prototype.hasOwnProperty;var k=(i,e)=>{for(var s in e)o(i,s,{get:e[s],enumerable:!0})},y=(i,e,s,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of u(e))!E.call(i,t)&&t!==s&&o(i,t,{get:()=>e[t],enumerable:!(r=c(e,t))||r.enumerable});return i};var b=i=>y(o({},"__esModule",{value:!0}),i),p=(i,e,s,r)=>{for(var t=r>1?void 0:r?c(e,s):e,l=i.length-1,m;l>=0;l--)(m=i[l])&&(t=(r?m(e,s,t):m(t))||t);return r&&t&&o(e,s,t),t};var C={};k(C,{SkdxTreeItemIndicator:()=>n});module.exports=b(C);var a=require("lit"),h=require("../internal/define.cjs"),v=require("../internal/styles.cjs"),d=require("./family.cjs");var n=class extends a.LitElement{constructor(){super(...arguments);this.item=null;this.onItemUpdate=()=>this.sync();this.handleClick=s=>{s.stopPropagation(),this.item?.toggleExpanded()}}connectedCallback(){super.connectedCallback(),this.setAttribute("aria-hidden","true"),this.item=d.TREE_ITEM_FAMILY.root(this),this.item?.addEventListener(d.TREE_ITEM_FAMILY.event,this.onItemUpdate),this.addEventListener("click",this.handleClick),this.sync()}disconnectedCallback(){this.item?.removeEventListener(d.TREE_ITEM_FAMILY.event,this.onItemUpdate),this.removeEventListener("click",this.handleClick),super.disconnectedCallback()}sync(){if(!this.item?.resolvedHasChildren){this.removeAttribute("data-state");return}this.setAttribute("data-state",this.item.expanded?"expanded":"collapsed")}render(){return a.html`<slot></slot>`}};n.styles=[v.hiddenHostStyles,a.css`
       :host {
         display: inline-block;
       }
-    `],d=c([(0,h.customElement)("skdx-tree-item-indicator","tree","item-indicator")],d);0&&(module.exports={SkdxTreeItemIndicator});
+    `],n=p([(0,h.customElement)("skdx-tree-item-indicator","tree","item-indicator")],n);0&&(module.exports={SkdxTreeItemIndicator});

package/dist/tree/TreeItemIndicator.d.cts

@@ -1,8 +1,6 @@
-import { LitElement } from 'lit';
+import { LitElement, type TemplateResult } from 'lit';
 /**
- * An expand/collapse affordance (e.g. chevron) in a `<skdx-tree-item>`.
- * Sets `data-state` to `"expanded"` or `"collapsed"` (unset if no children).
- * Stops click propagation to prevent double-toggling.
+ * An expand/collapse affordance (e.g. chevron) in a `<skdx-tree-item>`, setting `data-state` accordingly.
  *
  * @example
  * ```html
@@ -20,7 +18,7 @@ export declare class SkdxTreeItemIndicator extends LitElement {
     disconnectedCallback(): void;
     private sync;
     private readonly handleClick;
-    render(): import("lit").TemplateResult<1>;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/tree/TreeItemIndicator.d.ts

@@ -1,8 +1,6 @@
-import { LitElement } from 'lit';
+import { LitElement, type TemplateResult } from 'lit';
 /**
- * An expand/collapse affordance (e.g. chevron) in a `<skdx-tree-item>`.
- * Sets `data-state` to `"expanded"` or `"collapsed"` (unset if no children).
- * Stops click propagation to prevent double-toggling.
+ * An expand/collapse affordance (e.g. chevron) in a `<skdx-tree-item>`, setting `data-state` accordingly.
  *
  * @example
  * ```html
@@ -20,7 +18,7 @@ export declare class SkdxTreeItemIndicator extends LitElement {
     disconnectedCallback(): void;
     private sync;
     private readonly handleClick;
-    render(): import("lit").TemplateResult<1>;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/tree/TreeItemIndicator.js

@@ -1,5 +1,5 @@
-var o=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var l=(d,t,i,r)=>{for(var e=r>1?void 0:r?m(t,i):t,n=d.length-1,a;n>=0;n--)(a=d[n])&&(e=(r?a(t,i,e):a(e))||e);return r&&e&&o(t,i,e),e};import{css as c,html as h,LitElement as p}from"lit";import{customElement as v}from"../internal/define.js";import{hiddenHostStyles as k}from"../internal/styles.js";var s=class extends p{constructor(){super(...arguments);this.item=null;this.onItemUpdate=()=>this.sync();this.handleClick=i=>{i.stopPropagation(),this.item?.toggleExpanded()}}connectedCallback(){super.connectedCallback(),this.setAttribute("aria-hidden","true"),this.item=this.closest("skdx-tree-item"),this.item?.addEventListener("skdx-tree-item-internal-update",this.onItemUpdate),this.addEventListener("click",this.handleClick),this.sync()}disconnectedCallback(){this.item?.removeEventListener("skdx-tree-item-internal-update",this.onItemUpdate),this.removeEventListener("click",this.handleClick),super.disconnectedCallback()}sync(){if(!this.item?.resolvedHasChildren){this.removeAttribute("data-state");return}this.setAttribute("data-state",this.item.expanded?"expanded":"collapsed")}render(){return h`<slot></slot>`}};s.styles=[k,c`
+var m=Object.defineProperty;var c=Object.getOwnPropertyDescriptor;var l=(n,t,i,r)=>{for(var e=r>1?void 0:r?c(t,i):t,a=n.length-1,o;a>=0;a--)(o=n[a])&&(e=(r?o(t,i,e):o(e))||e);return r&&e&&m(t,i,e),e};import{css as p,html as h,LitElement as v}from"lit";import{customElement as u}from"../internal/define.js";import{hiddenHostStyles as E}from"../internal/styles.js";import{TREE_ITEM_FAMILY as d}from"./family.js";var s=class extends v{constructor(){super(...arguments);this.item=null;this.onItemUpdate=()=>this.sync();this.handleClick=i=>{i.stopPropagation(),this.item?.toggleExpanded()}}connectedCallback(){super.connectedCallback(),this.setAttribute("aria-hidden","true"),this.item=d.root(this),this.item?.addEventListener(d.event,this.onItemUpdate),this.addEventListener("click",this.handleClick),this.sync()}disconnectedCallback(){this.item?.removeEventListener(d.event,this.onItemUpdate),this.removeEventListener("click",this.handleClick),super.disconnectedCallback()}sync(){if(!this.item?.resolvedHasChildren){this.removeAttribute("data-state");return}this.setAttribute("data-state",this.item.expanded?"expanded":"collapsed")}render(){return h`<slot></slot>`}};s.styles=[E,p`
       :host {
         display: inline-block;
       }
-    `],s=l([v("skdx-tree-item-indicator","tree","item-indicator")],s);export{s as SkdxTreeItemIndicator};
+    `],s=l([u("skdx-tree-item-indicator","tree","item-indicator")],s);export{s as SkdxTreeItemIndicator};

package/dist/tree/family.cjs

@@ -0,0 +1 @@
+"use strict";var o=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var i=Object.getOwnPropertyNames;var p=Object.prototype.hasOwnProperty;var k=(r,e)=>{for(var m in e)o(r,m,{get:e[m],enumerable:!0})},s=(r,e,m,x)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of i(e))!p.call(r,t)&&t!==m&&o(r,t,{get:()=>e[t],enumerable:!(x=d(e,t))||x.enumerable});return r};var I=r=>s(o({},"__esModule",{value:!0}),r);var f={};k(f,{TREE_FAMILY:()=>E,TREE_ITEM_FAMILY:()=>c});module.exports=I(f);var T=require("../internal/family.cjs"),E=(0,T.defineFamily)("tree",{selector:"skdx-tree"}),c=(0,T.defineFamily)("tree-item",{selector:"skdx-tree-item"});0&&(module.exports={TREE_FAMILY,TREE_ITEM_FAMILY});

package/dist/tree/family.d.cts

@@ -0,0 +1,6 @@
+import type { SkdxTree } from './Tree.cjs';
+import type { SkdxTreeItem } from './TreeItem.cjs';
+/** @internal The broadcast every `<skdx-tree-*>` part re-renders on, and the lookup that finds their root. */
+export declare const TREE_FAMILY: import("../internal/family.cjs").SkdxFamily<SkdxTree>;
+/** @internal The broadcast every `<skdx-tree-item-*>` part re-renders on, and the lookup that finds their root. */
+export declare const TREE_ITEM_FAMILY: import("../internal/family.cjs").SkdxFamily<SkdxTreeItem>;

package/dist/tree/family.d.ts

@@ -0,0 +1,6 @@
+import type { SkdxTree } from './Tree.js';
+import type { SkdxTreeItem } from './TreeItem.js';
+/** @internal The broadcast every `<skdx-tree-*>` part re-renders on, and the lookup that finds their root. */
+export declare const TREE_FAMILY: import("../internal/family.js").SkdxFamily<SkdxTree>;
+/** @internal The broadcast every `<skdx-tree-item-*>` part re-renders on, and the lookup that finds their root. */
+export declare const TREE_ITEM_FAMILY: import("../internal/family.js").SkdxFamily<SkdxTreeItem>;

package/dist/tree/family.js

@@ -0,0 +1 @@
+import{defineFamily as e}from"../internal/family.js";var t=e("tree",{selector:"skdx-tree"}),m=e("tree-item",{selector:"skdx-tree-item"});export{t as TREE_FAMILY,m as TREE_ITEM_FAMILY};

package/dist/tree-select/TreeSelect.cjs

@@ -1,5 +1,5 @@
-"use strict";var g=Object.defineProperty;var V=Object.getOwnPropertyDescriptor;var L=Object.getOwnPropertyNames;var R=Object.prototype.hasOwnProperty;var k=(a,l)=>{for(var e in l)g(a,e,{get:l[e],enumerable:!0})},N=(a,l,e,i)=>{if(l&&typeof l=="object"||typeof l=="function")for(let t of L(l))!R.call(a,t)&&t!==e&&g(a,t,{get:()=>l[t],enumerable:!(i=V(l,t))||i.enumerable});return a};var F=a=>N(g({},"__esModule",{value:!0}),a),s=(a,l,e,i)=>{for(var t=i>1?void 0:i?V(l,e):l,o=a.length-1,u;o>=0;o--)(u=a[o])&&(t=(i?u(l,e,t):u(t))||t);return i&&t&&g(l,e,t),t};var q={};k(q,{SkdxTreeSelect:()=>n,TREE_SELECT_INTERNAL_UPDATE:()=>O,defaultGetMatchCountLabel:()=>M,defaultTreeSelectFilter:()=>T,findTreeSelectRoot:()=>D});module.exports=F(q);var f=require("lit"),r=require("lit/decorators.js"),v=require("../internal/authored.cjs"),C=require("../internal/define.cjs"),_=require("../internal/direction.cjs"),w=require("../internal/form-associated.cjs"),A=require("../internal/ids.cjs"),S=require("../internal/open-change-complete.cjs"),m=require("../internal/typeahead.cjs"),I=require("../utils/live-announcer.cjs"),d=require("./collection.cjs"),h=require("./TreeSelectAnatomy.cjs");var O="skdx-tree-select-internal-update";function D(a){let l=a.closest("skdx-tree-select");return l||(a.closest("[data-skdx-tree-select-layer]")?.treeSelectRoot??null)}function T(a,l){return(a.label??a.value).toLowerCase().includes(l.trim().toLowerCase())}function M(a){return`${a} match${a===1?"":"es"} available`}var x=new Set,H={fromAttribute(a){if(a!==null)return a!=="false"},toAttribute(a){return a===void 0?null:a?"":"false"}};function P(a,l,e){return Math.min(Math.max(a,l),e)}var n=class extends(0,w.FormAssociated)(f.LitElement){constructor(){super(...arguments);this.collection=[];this.value=[];this.defaultValue=[];this.multiple=!1;this.checkStrategy="cascade";this.valueStrategy="all";this.expandedIds=[];this.defaultExpandedIds=[];this.open=!1;this.defaultOpen=!1;this.inputValue="";this.defaultInputValue="";this.filter=T;this.disabled=!1;this.readOnly=!1;this.getMatchCountLabel=M;this.emptyMessage="No matches";this.expandOnClick=!1;this.idPrefix=(0,A.nextId)("skdx-tree-select");this.treeId=`${this.idPrefix}-tree`;this._activeValue=null;this._initialized=!1;this._hasUpdatedOnce=!1;this._lastAnnouncedCount=null;this.typeahead=new m.Typeahead;this._loadingValues=x;this.requested=new Set;this._visibleRowValues=null;this.triggerEl=null;this.inputEl=null;this.contentEl=null;this.fillAnatomy=()=>{(0,v.hasAuthoredParts)(this,h.TREE_SELECT_ANATOMY_GENERATED,h.TREE_SELECT_RENDER_SLOTS)||((0,v.hasGeneratedContent)(this,h.TREE_SELECT_ANATOMY_GENERATED)?(0,h.refreshTreeSelectAnatomyText)(this):(0,h.fillTreeSelectAnatomy)(this))};this._indexCache=null}connectedCallback(){super.connectedCallback();let e=this.querySelector("skdx-tree-select-tree")?.id;e&&(this.treeId=e),this._initialized||(this.defaultValue.length>0&&(this.value=[...this.defaultValue]),this.defaultExpandedIds.length>0&&(this.expandedIds=[...this.defaultExpandedIds]),this.defaultOpen&&(this.open=!0),this.defaultInputValue!==""&&(this.inputValue=this.defaultInputValue),this._initialized=!0),queueMicrotask(this.fillAnatomy)}disconnectedCallback(){this.typeahead.clear(),this._teardownOpenChangeComplete?.(),super.disconnectedCallback()}get strategy(){return this.multiple?this.checkStrategy:"independent"}get shouldCloseOnSelect(){return this.closeOnSelect??!this.multiple}get indexed(){return this._indexCache?.collection!==this.collection&&(this._indexCache={collection:this.collection,...(0,d.indexCollection)(this.collection)}),this._indexCache}get index(){return this.indexed.index}get order(){return this.indexed.order}get checked(){return(0,d.normalizeChecked)(this.value,this.index,this.order,this.strategy)}get filtering(){return this.inputValue.trim()!==""}get filtered(){return this.filtering?(0,d.computeFilter)(this.index,this.order,e=>this.filter(e,this.inputValue)):{visible:null,autoExpanded:x,matchCount:this.order.length}}get effectiveExpandedIds(){let{autoExpanded:e}=this.filtered;return e.size===0?[...this.expandedIds]:[...new Set([...this.expandedIds,...e])]}get expanded(){return new Set(this.effectiveExpandedIds)}isVisible(e){let{visible:i}=this.filtered;return i===null||i.has(e)}get flat(){let{visible:e}=this.filtered;return(0,d.flattenVisible)(this.collection,this.index,e,this.expanded)}get flatMap(){return new Map(this.flat.map(e=>[e.value,e]))}checkStateOf(e){return(0,d.checkStateOf)(e,this.checked,this.index,this.strategy)}getLabel(e){return this.index.get(e)?.node.label??this.getValueLabel?.(e)??e}itemId(e){return`${this.idPrefix}-item-${e}`}get activeValue(){return this._activeValue}setActiveValue(e){this._activeValue!==e&&(this._activeValue=e,this.broadcast())}get hasInput(){return this.inputEl!==null}get visibleRowValues(){return this._visibleRowValues}setVisibleRowValues(e){this._visibleRowValues!==e&&(this._visibleRowValues=e,this.ensureActiveValue())}setOpen(e){this.open!==e&&(this.open=e,e||(this._activeValue=null),this.dispatchEvent(new CustomEvent("open-change",{detail:e,bubbles:!0,composed:!0})),this.broadcast(),e&&this.ensureActiveValue())}setInputValue(e){this.inputValue!==e&&(this.inputValue=e,this.dispatchEvent(new CustomEvent("input-value-change",{detail:e,bubbles:!0,composed:!0})),this.broadcast(),this.announceMatches(),this.ensureActiveValue())}setExpanded(e,i){let t=this.expandedIds,o=i?t.includes(e)?[...t]:[...t,e]:t.filter(u=>u!==e);this.expandedIds=o,this.dispatchEvent(new CustomEvent("expanded-change",{detail:o,bubbles:!0,composed:!0})),i&&!this.filtering&&this.startLoad(e),this.broadcast(),this.ensureActiveValue()}startLoad(e){let i=this.loadChildren;if(!i||this.requested.has(e))return;this.requested.add(e),this._loadingValues=new Set(this._loadingValues).add(e);let t=()=>{let o=new Set(this._loadingValues);o.delete(e),this._loadingValues=o,this.broadcast()};Promise.resolve(i(e)).then(t,()=>{this.requested.delete(e),t()})}isLoading(e){return this._loadingValues.has(e)}commit(e){if(this.disabled||this.readOnly)return;let i=this.index.get(e);if(!i||i.disabled)return;let t=(0,d.toggleChecked)(e,this.checked,this.index,this.strategy,this.multiple),o=(0,d.projectValue)(t,this.index,this.order,(0,d.effectiveValueStrategy)(this.strategy,this.valueStrategy));this.value=o,this.dispatchEvent(new CustomEvent("value-change",{detail:o,bubbles:!0,composed:!0})),this.broadcast(),this.shouldCloseOnSelect&&(this.setOpen(!1),this.triggerEl?.focus())}broadcast(){this.dispatchEvent(new CustomEvent(O))}willUpdate(){this.open&&this.ensureActiveValue()}updated(e){let i=!this._hasUpdatedOnce;this._hasUpdatedOnce=!0,this.fillAnatomy(),(e.has("collection")||e.has("value")||e.has("expandedIds")||e.has("open")||e.has("inputValue")||e.has("multiple")||e.has("checkStrategy")||e.has("disabled")||e.has("readOnly"))&&this.broadcast(),(e.has("value")||e.has("name"))&&this.setFormValue(this.multiFormValue(this.value)),e.has("open")&&!i&&(this._teardownOpenChangeComplete?.(),this._teardownOpenChangeComplete=(0,S.notifyOpenChangeComplete)(()=>this.contentEl,this.open,t=>this.dispatchEvent(new CustomEvent("open-change-complete",{detail:t,bubbles:!0,composed:!0}))))}ensureActiveValue(){if(!this.open)return;let e=this.flatMap,i=this._visibleRowValues;if(this._activeValue!==null&&e.get(this._activeValue)?.disabled===!1&&(i===null||i.has(this._activeValue)))return;let t=this.navigableFlat.filter(c=>!c.disabled),o=this.value,u=t.find(c=>o.includes(c.value));this.setActiveValue(u?.value??t[0]?.value??null)}announceMatches(){if(!this.open){this._lastAnnouncedCount=null;return}let{matchCount:e}=this.filtered;e!==this._lastAnnouncedCount&&(this._lastAnnouncedCount=e,(0,I.announce)(this.getMatchCountLabel(e)))}get navigableFlat(){let e=this.flat,i=this._visibleRowValues;return i===null?e:e.filter(t=>i.has(t.value))}get navigable(){return this.navigableFlat.filter(e=>!e.disabled)}activate(e){this.setActiveValue(e);let i=this.contentEl?.querySelectorAll('[role="treeitem"][data-value]');for(let t of i??[])if(t.getAttribute("data-value")===e){t.scrollIntoView?.({block:"nearest"});return}}move(e){let i=this.navigable;if(i.length===0)return;if(e==="first"){this.activate(i[0].value);return}if(e==="last"){this.activate(i[i.length-1].value);return}let t=i.findIndex(o=>o.value===this._activeValue);this.activate(i[P(t+e,0,i.length-1)].value)}onNavigationKeyDown(e,i){if(this.disabled)return;let t=this.open,o=(0,_.directionalKey)(e.key,e.currentTarget),u=this._activeValue===null?void 0:this.flatMap.get(this._activeValue);if(e.key==="Escape"){if(!t||this.contentEl)return;e.preventDefault(),this.setOpen(!1),this.triggerEl?.focus();return}if(e.key==="Tab"){t&&this.setOpen(!1);return}if(o==="ArrowDown"){e.preventDefault(),t?this.move(1):(this.setOpen(!0),this.move("first"));return}if(o==="ArrowUp"){e.preventDefault(),t?this.move(-1):(this.setOpen(!0),this.move("last"));return}if(o==="ArrowRight"){if(!t)return;e.preventDefault(),u?.hasChildren&&!u.expanded?this.setExpanded(u.value,!0):this.move(1);return}if(o==="ArrowLeft"){if(!t)return;e.preventDefault(),u?.hasChildren&&u.expanded?this.setExpanded(u.value,!1):u?.parent&&this.activate(u.parent);return}if(e.key==="Home"||e.key==="End"){if(!t)return;e.preventDefault(),this.move(e.key==="Home"?"first":"last");return}if(e.key==="*"){if(!t)return;e.preventDefault();let b=(this._activeValue===null?void 0:this.flatMap.get(this._activeValue))?.parent??null;for(let p of this.flat)p.parent===b&&p.hasChildren&&!p.expanded&&this.setExpanded(p.value,!0);return}if(e.key==="Enter"||e.key===" "&&i.selectOnSpace){if(e.preventDefault(),!t){this.setOpen(!0);return}this._activeValue!==null&&this.commit(this._activeValue);return}if(i.typeahead&&t&&(0,m.isTypeaheadKey)(e)){e.preventDefault();let c=this.navigable,b=c.map(y=>this.getLabel(y.value)),p=c.findIndex(y=>y.value===this._activeValue),E=this.typeahead.match(e.key,b,p);E!==-1&&this.activate(c[E].value)}}render(){return f.html`<slot @slotchange=${this.fillAnatomy}></slot>`}};n.styles=f.css`
+"use strict";var g=Object.defineProperty;var w=Object.getOwnPropertyDescriptor;var O=Object.getOwnPropertyNames;var R=Object.prototype.hasOwnProperty;var N=(a,o)=>{for(var e in o)g(a,e,{get:o[e],enumerable:!0})},k=(a,o,e,t)=>{if(o&&typeof o=="object"||typeof o=="function")for(let i of O(o))!R.call(a,i)&&i!==e&&g(a,i,{get:()=>o[i],enumerable:!(t=w(o,i))||t.enumerable});return a};var F=a=>k(g({},"__esModule",{value:!0}),a),l=(a,o,e,t)=>{for(var i=t>1?void 0:t?w(o,e):o,n=a.length-1,u;n>=0;n--)(u=a[n])&&(i=(t?u(o,e,i):u(i))||i);return t&&i&&g(o,e,i),i};var z={};N(z,{SkdxTreeSelect:()=>r,TREE_SELECT_INTERNAL_UPDATE:()=>K,defaultGetMatchCountLabel:()=>M,defaultTreeSelectFilter:()=>I,findTreeSelectRoot:()=>H});module.exports=F(z);var p=require("lit"),s=require("lit/decorators.js"),m=require("../internal/authored.cjs"),x=require("../internal/define.cjs"),y=require("../internal/derive.cjs"),A=require("../internal/direction.cjs"),c=require("../internal/events.cjs"),L=require("../internal/form-associated.cjs"),T=require("../internal/ids.cjs"),D=require("../internal/open-change-complete.cjs"),f=require("../internal/tree-columns.cjs"),b=require("../internal/typeahead.cjs"),S=require("../utils/live-announcer.cjs"),d=require("./collection.cjs"),h=require("./TreeSelectAnatomy.cjs");var K="skdx-tree-select-internal-update";function H(a){let o=a.closest("skdx-tree-select");return o||(a.closest("[data-skdx-tree-select-layer]")?.treeSelectRoot??null)}function I(a,o){return(a.label??a.value).toLowerCase().includes(o.trim().toLowerCase())}function M(a){return`${a} match${a===1?"":"es"} available`}var C=new Set,P=["collection","value","expanded","open","inputValue","layout","multiple","checkStrategy","disabled","readOnly"],q={fromAttribute(a){if(a!==null)return a!=="false"},toAttribute(a){return a===void 0?null:a?"":"false"}};function V(a,o,e){return Math.min(Math.max(a,o),e)}var r=class extends(0,L.FormAssociated)(p.LitElement){constructor(){super(...arguments);this.collection=[];this.value=[];this.defaultValue=[];this.multiple=!1;this.checkStrategy="cascade";this.valueStrategy="all";this.expanded=[];this.defaultExpanded=[];this.layout="tree";this.open=!1;this.defaultOpen=!1;this.inputValue="";this.defaultInputValue="";this.filter=I;this.disabled=!1;this.readOnly=!1;this.getMatchCountLabel=M;this.emptyMessage="No matches";this.expandOnClick=!1;this.idPrefix=(0,T.nextId)("skdx-tree-select");this.treeId=`${this.idPrefix}-tree`;this._activeValue=null;this._initialized=!1;this._hasUpdatedOnce=!1;this._lastAnnouncedCount=null;this.typeahead=new b.Typeahead;this._loadingValues=C;this.requested=new Set;this._pendingColumn=null;this._visibleRowValues=null;this.triggerEl=null;this.inputEl=null;this.contentEl=null;this.fillAnatomy=()=>{(0,m.hasAuthoredParts)(this,h.TREE_SELECT_ANATOMY_GENERATED,h.TREE_SELECT_RENDER_SLOTS)||((0,m.hasGeneratedContent)(this,h.TREE_SELECT_ANATOMY_GENERATED)?(0,h.refreshTreeSelectAnatomyText)(this):(0,h.fillTreeSelectAnatomy)(this))};this._indexCache=null}invalidateLoad(e){e===void 0?this.requested.clear():this.requested.delete(e)}connectedCallback(){super.connectedCallback();let e=this.querySelector("skdx-tree-select-tree")?.id;e&&(this.treeId=e),this._initialized||(this.defaultValue.length>0&&(this.value=[...this.defaultValue]),this.defaultExpanded.length>0&&(this.expanded=[...this.defaultExpanded]),this.defaultOpen&&(this.open=!0),this.defaultInputValue!==""&&(this.inputValue=this.defaultInputValue),this._initialized=!0),queueMicrotask(this.fillAnatomy)}disconnectedCallback(){this.typeahead.clear(),this._teardownOpenChangeComplete?.(),super.disconnectedCallback()}get strategy(){return this.multiple?this.checkStrategy:"independent"}get shouldCloseOnSelect(){return this.closeOnSelect??!this.multiple}get indexed(){return this._indexCache?.collection!==this.collection&&(this._indexCache={collection:this.collection,...(0,d.indexCollection)(this.collection)}),this._indexCache}get index(){return this.indexed.index}get order(){return this.indexed.order}get checked(){return(0,d.normalizeChecked)(this.value,this.index,this.order,this.strategy)}get filtering(){return this.inputValue.trim()!==""}get filtered(){return this.filtering?(0,d.computeFilter)(this.index,this.order,e=>this.filter(e,this.inputValue)):{visible:null,autoExpanded:C,matchCount:this.order.length}}get effectiveExpandedIds(){let{autoExpanded:e}=this.filtered;return e.size===0?[...this.expanded]:[...new Set([...this.expanded,...e])]}get expandedSet(){return this.effectiveLayout==="columns"?new Set(this.columns.flatMap(e=>e.parent===null?[]:[e.parent])):new Set(this.effectiveExpandedIds)}isVisible(e){let{visible:t}=this.filtered;return t===null||t.has(e)}get flat(){let{visible:e}=this.filtered;return(0,d.flattenVisible)(this.collection,this.index,e,this.expandedSet)}get flatMap(){return new Map(this.flat.map(e=>[e.value,e]))}checkStateOf(e){return(0,d.checkStateOf)(e,this.checked,this.index,this.strategy)}getLabel(e){return this.index.get(e)?.node.label??this.getValueLabel?.(e)??e}itemId(e){return`${this.idPrefix}-item-${e}`}columnId(e){return`${this.idPrefix}-column-${e}`}get effectiveLayout(){return this.layout==="columns"&&!this.filtering?"columns":"tree"}get columns(){return(0,f.treeColumns)(this.collection,this.expanded)}get activeTreeId(){return this.effectiveLayout!=="columns"?this.treeId:this.columnId(this.activeColumnIndex)}get activeColumnIndex(){return this._activeValue===null?0:Math.max((0,f.columnIndexOf)(this.columns,this._activeValue),0)}enabledIn(e){return(e?.nodes??[]).filter(t=>this.index.get(t.value)?.disabled!==!0)}get activeValue(){return this._activeValue}setActiveValue(e){this._activeValue!==e&&(this._activeValue=e,this.broadcast())}get hasInput(){return this.inputEl!==null}get visibleRowValues(){return this._visibleRowValues}setVisibleRowValues(e){this.effectiveLayout!=="columns"&&this._visibleRowValues!==e&&(this._visibleRowValues=e,this.ensureActiveValue())}setOpen(e){this.open!==e&&(this.open=e,e||(this._activeValue=null),(0,c.emit)(this,"open-change",e),this.broadcast(),e&&this.ensureActiveValue())}setInputValue(e){this.inputValue!==e&&(this.inputValue=e,(0,c.emit)(this,"input-value-change",e),this.broadcast(),this.announceMatches(),this.ensureActiveValue())}get expandsOnClick(){return this.expandOnClick||this.effectiveLayout==="columns"}setExpanded(e,t){if(this.effectiveLayout==="columns"){let u=(0,f.pathTo)(this.collection,e);if(u.length>0){this.setExpandedPath(t?u:u.slice(0,-1),t?e:void 0);return}}let i=this.expanded;if(i.includes(e)===t)return;let n=t?[...i,e]:i.filter(u=>u!==e);this.expanded=n,(0,c.emit)(this,"expanded-change",n),t&&!this.filtering&&this.startLoad(e),this.broadcast(),this.ensureActiveValue()}setExpandedPath(e,t){(e.length!==this.expanded.length||e.some((i,n)=>i!==this.expanded[n]))&&(this.expanded=e,(0,c.emit)(this,"expanded-change",e)),t!==void 0&&!this.filtering&&this.startLoad(t),this.broadcast(),this.ensureActiveValue()}startLoad(e){let t=this.loadChildren;if(!t||this.requested.has(e))return;this.requested.add(e),this._loadingValues=new Set(this._loadingValues).add(e);let i=()=>{let n=new Set(this._loadingValues);n.delete(e),this._loadingValues=n,this._pendingColumn===e&&(this._pendingColumn=null,this._activeValue===e&&this.enterColumn(e)),this.broadcast()};Promise.resolve(t(e)).then(i,()=>{this.requested.delete(e),i()})}isLoading(e){return this._loadingValues.has(e)}commit(e){if(this.disabled||this.readOnly)return;let t=this.index.get(e);if(!t||t.disabled)return;let i=(0,d.toggleChecked)(e,this.checked,this.index,this.strategy,this.multiple),n=(0,d.projectValue)(i,this.index,this.order,(0,d.effectiveValueStrategy)(this.strategy,this.valueStrategy));this.value=n,(0,c.emit)(this,"value-change",n),this.broadcast(),this.shouldCloseOnSelect&&(this.setOpen(!1),this.triggerEl?.focus())}broadcast(){this.dispatchEvent(new CustomEvent(K))}willUpdate(){this.open&&this.ensureActiveValue()}updated(e){let t=!this._hasUpdatedOnce;this._hasUpdatedOnce=!0,this.fillAnatomy(),P.some(i=>e.has(i))&&this.broadcast(),(e.has("value")||e.has("name"))&&this.setFormValue(this.multiFormValue(this.value)),e.has("open")&&!t&&(this._teardownOpenChangeComplete?.(),this._teardownOpenChangeComplete=(0,D.notifyOpenChangeComplete)(()=>this.contentEl,this.open,i=>(0,c.emit)(this,"open-change-complete",i))),(0,y.threadAppearance)(this,{size:this.size},[...(0,y.derivedParts)(this,"skdx-tree-select-content")])}ensureActiveValue(){if(!this.open)return;let e=this.flatMap,t=this._visibleRowValues;if(this._activeValue!==null&&e.get(this._activeValue)?.disabled===!1&&(t===null||t.has(this._activeValue)))return;let i=this.navigableFlat.filter(v=>!v.disabled),n=this.value,u=i.find(v=>n.includes(v.value));this.setActiveValue(u?.value??i[0]?.value??null)}announceMatches(){if(!this.open){this._lastAnnouncedCount=null;return}let{matchCount:e}=this.filtered;e!==this._lastAnnouncedCount&&(this._lastAnnouncedCount=e,(0,S.announce)(this.getMatchCountLabel(e)))}get navigableFlat(){let e=this.flat,t=this._visibleRowValues;return t===null?e:e.filter(i=>t.has(i.value))}get navigable(){return this.navigableFlat.filter(e=>!e.disabled)}activate(e){this.setActiveValue(e);let t=this.contentEl?.querySelectorAll('[role="treeitem"][data-value]');for(let i of t??[])if(i.getAttribute("data-value")===e){i.scrollIntoView?.(this.effectiveLayout==="columns"?{block:"nearest",inline:"nearest"}:{block:"nearest"});return}}columnMove(e){let t=this.enabledIn(this.columns[this.activeColumnIndex]);if(t.length===0)return;if(e==="first"){this.activate(t[0].value);return}if(e==="last"){this.activate(t[t.length-1].value);return}let i=t.findIndex(n=>n.value===this._activeValue);this.activate(t[V(i+e,0,t.length-1)].value)}enterColumn(e){let t=this.columns,i=this.enabledIn(t[(0,f.columnIndexOf)(t,e)+1]);return i.length===0?!1:(this.activate(i[0].value),!0)}columnArrowRight(){let e=this._activeValue;e===null||this.flatMap.get(e)?.hasChildren!==!0||(this.setExpanded(e,!0),!this.enterColumn(e)&&this.isLoading(e)&&(this._pendingColumn=e))}columnArrowLeft(){let e=this.columns[this.activeColumnIndex]?.parent??null;e!==null&&(this.activate(e),this.setExpanded(e,!1))}_handleColumnsKeyDown(e,t){return e==="ArrowDown"||e==="ArrowUp"?(t.preventDefault(),this.columnMove(e==="ArrowDown"?1:-1),!0):e==="Home"||e==="End"?(t.preventDefault(),this.columnMove(e==="Home"?"first":"last"),!0):e==="ArrowRight"?(this.columnArrowRight(),!0):e==="ArrowLeft"?(this.columnArrowLeft(),!0):e==="*"}move(e){let t=this.navigable;if(t.length===0)return;if(e==="first"){this.activate(t[0].value);return}if(e==="last"){this.activate(t[t.length-1].value);return}let i=t.findIndex(n=>n.value===this._activeValue);this.activate(t[V(i+e,0,t.length-1)].value)}_handleEscapeKeyDown(e,t){return e.key!=="Escape"?!1:(!t||this.contentEl||(e.preventDefault(),this.setOpen(!1),this.triggerEl?.focus()),!0)}_handleTabKeyDown(e,t){return e.key!=="Tab"?!1:(t&&this.setOpen(!1),!0)}_handleArrowDownKeyDown(e,t,i){return e!=="ArrowDown"?!1:(t.preventDefault(),i?this.move(1):(this.setOpen(!0),this.move("first")),!0)}_handleArrowUpKeyDown(e,t,i){return e!=="ArrowUp"?!1:(t.preventDefault(),i?this.move(-1):(this.setOpen(!0),this.move("last")),!0)}_handleArrowRightKeyDown(e,t,i,n){return e!=="ArrowRight"?!1:(i&&(t.preventDefault(),n?.hasChildren&&!n.expanded?this.setExpanded(n.value,!0):this.move(1)),!0)}_handleArrowLeftKeyDown(e,t,i,n){return e!=="ArrowLeft"?!1:(i&&(t.preventDefault(),n?.hasChildren&&n.expanded?this.setExpanded(n.value,!1):n?.parent&&this.activate(n.parent)),!0)}_handleHomeEndKeyDown(e,t){return e.key!=="Home"&&e.key!=="End"?!1:(t&&(e.preventDefault(),this.move(e.key==="Home"?"first":"last")),!0)}_handleExpandAllSiblingsKeyDown(e,t){if(e.key!=="*")return!1;if(!t)return!0;e.preventDefault();let n=(this._activeValue===null?void 0:this.flatMap.get(this._activeValue))?.parent??null;for(let u of this.flat)u.parent===n&&u.hasChildren&&!u.expanded&&this.setExpanded(u.value,!0);return!0}_handleCommitKeyDown(e,t,i){return e.key!=="Enter"&&!(e.key===" "&&i)?!1:(e.preventDefault(),t?(this._activeValue!==null&&this.commit(this._activeValue),!0):(this.setOpen(!0),!0))}_handleTypeaheadKeyDown(e,t,i){if(!i||!t||!(0,b.isTypeaheadKey)(e))return!1;e.preventDefault();let n=this.effectiveLayout==="columns"?this.enabledIn(this.columns[this.activeColumnIndex]):this.navigable,u=n.map(_=>this.getLabel(_.value)),v=n.findIndex(_=>_.value===this._activeValue),E=this.typeahead.match(e.key,u,v);return E!==-1&&this.activate(n[E].value),!0}onNavigationKeyDown(e,t){if(this.disabled)return;let i=this.open,n=(0,A.directionalKey)(e.key,e.currentTarget),u=this._activeValue===null?void 0:this.flatMap.get(this._activeValue);this._handleEscapeKeyDown(e,i)||this._handleTabKeyDown(e,i)||i&&this.effectiveLayout==="columns"&&this._handleColumnsKeyDown(n,e)||this._handleArrowDownKeyDown(n,e,i)||this._handleArrowUpKeyDown(n,e,i)||this._handleArrowRightKeyDown(n,e,i,u)||this._handleArrowLeftKeyDown(n,e,i,u)||this._handleHomeEndKeyDown(e,i)||this._handleExpandAllSiblingsKeyDown(e,i)||this._handleCommitKeyDown(e,i,t.selectOnSpace)||this._handleTypeaheadKeyDown(e,i,t.typeahead)}render(){return p.html`<slot @slotchange=${this.fillAnatomy}></slot>`}};r.styles=p.css`
     :host {
       display: contents;
     }
-  `,s([(0,r.property)({type:Array})],n.prototype,"collection",2),s([(0,r.property)({attribute:!1})],n.prototype,"value",2),s([(0,r.property)({type:Array,attribute:"default-value"})],n.prototype,"defaultValue",2),s([(0,r.property)({type:Boolean,reflect:!0})],n.prototype,"multiple",2),s([(0,r.property)({type:String,attribute:"check-strategy"})],n.prototype,"checkStrategy",2),s([(0,r.property)({type:String,attribute:"value-strategy"})],n.prototype,"valueStrategy",2),s([(0,r.property)({attribute:!1})],n.prototype,"expandedIds",2),s([(0,r.property)({type:Array,attribute:"default-expanded-ids"})],n.prototype,"defaultExpandedIds",2),s([(0,r.property)({type:Boolean,reflect:!0})],n.prototype,"open",2),s([(0,r.property)({type:Boolean,attribute:"default-open"})],n.prototype,"defaultOpen",2),s([(0,r.property)({type:String,attribute:"input-value"})],n.prototype,"inputValue",2),s([(0,r.property)({type:String,attribute:"default-input-value"})],n.prototype,"defaultInputValue",2),s([(0,r.property)({attribute:!1})],n.prototype,"filter",2),s([(0,r.property)({type:Boolean,reflect:!0})],n.prototype,"disabled",2),s([(0,r.property)({type:String,reflect:!0})],n.prototype,"name",2),s([(0,r.property)({type:Boolean,attribute:"read-only",reflect:!0})],n.prototype,"readOnly",2),s([(0,r.property)({converter:H,attribute:"close-on-select"})],n.prototype,"closeOnSelect",2),s([(0,r.property)({attribute:!1})],n.prototype,"getMatchCountLabel",2),s([(0,r.property)({attribute:!1})],n.prototype,"getValueLabel",2),s([(0,r.property)({type:String})],n.prototype,"placeholder",2),s([(0,r.property)({type:String,attribute:"empty-message"})],n.prototype,"emptyMessage",2),s([(0,r.property)({type:Boolean,attribute:"expand-on-click"})],n.prototype,"expandOnClick",2),s([(0,r.property)({attribute:!1})],n.prototype,"loadChildren",2),s([(0,r.state)()],n.prototype,"_activeValue",2),n=s([(0,C.customElement)("skdx-tree-select")],n);0&&(module.exports={SkdxTreeSelect,TREE_SELECT_INTERNAL_UPDATE,defaultGetMatchCountLabel,defaultTreeSelectFilter,findTreeSelectRoot});
+  `,l([(0,s.property)({type:Array})],r.prototype,"collection",2),l([(0,s.property)({attribute:!1})],r.prototype,"value",2),l([(0,s.property)({type:Array,attribute:"default-value"})],r.prototype,"defaultValue",2),l([(0,s.property)({type:Boolean,reflect:!0})],r.prototype,"multiple",2),l([(0,s.property)({type:String,attribute:"check-strategy"})],r.prototype,"checkStrategy",2),l([(0,s.property)({type:String,attribute:"value-strategy"})],r.prototype,"valueStrategy",2),l([(0,s.property)({attribute:!1})],r.prototype,"expanded",2),l([(0,s.property)({type:Array,attribute:"default-expanded"})],r.prototype,"defaultExpanded",2),l([(0,s.property)({type:String,reflect:!0})],r.prototype,"layout",2),l([(0,s.property)({type:Boolean,reflect:!0})],r.prototype,"open",2),l([(0,s.property)({type:Boolean,attribute:"default-open"})],r.prototype,"defaultOpen",2),l([(0,s.property)({type:String,attribute:"input-value"})],r.prototype,"inputValue",2),l([(0,s.property)({type:String,attribute:"default-input-value"})],r.prototype,"defaultInputValue",2),l([(0,s.property)({attribute:!1})],r.prototype,"filter",2),l([(0,s.property)({type:Boolean,reflect:!0})],r.prototype,"disabled",2),l([(0,s.property)({type:String,reflect:!0})],r.prototype,"name",2),l([(0,s.property)({type:Boolean,attribute:"read-only",reflect:!0})],r.prototype,"readOnly",2),l([(0,s.property)({converter:q,attribute:"close-on-select"})],r.prototype,"closeOnSelect",2),l([(0,s.property)({attribute:!1})],r.prototype,"getMatchCountLabel",2),l([(0,s.property)({attribute:!1})],r.prototype,"getValueLabel",2),l([(0,s.property)({type:String})],r.prototype,"placeholder",2),l([(0,s.property)({type:String,attribute:"empty-message"})],r.prototype,"emptyMessage",2),l([(0,s.property)({type:Boolean,attribute:"expand-on-click"})],r.prototype,"expandOnClick",2),l([(0,s.property)({attribute:!1})],r.prototype,"loadChildren",2),l([(0,s.property)({type:String,attribute:"data-size"})],r.prototype,"size",2),l([(0,s.state)()],r.prototype,"_activeValue",2),r=l([(0,x.customElement)("skdx-tree-select")],r);0&&(module.exports={SkdxTreeSelect,TREE_SELECT_INTERNAL_UPDATE,defaultGetMatchCountLabel,defaultTreeSelectFilter,findTreeSelectRoot});

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

@@ -1,7 +1,8 @@
-import { LitElement } from 'lit';
+import { LitElement, type TemplateResult } from 'lit';
+import { type TreeColumn } from '../internal/tree-columns.cjs';
 import type { SkdxTreeCheckedState } from '../tree/Tree.cjs';
 import { type TreeSelectFlatNode, type TreeSelectIndexEntry } from './collection.cjs';
-import type { TreeSelectCheckStrategy, TreeSelectFilter, TreeSelectNode, TreeSelectValueStrategy } from './types.cjs';
+import type { TreeSelectCheckStrategy, TreeSelectFilter, TreeSelectLayout, TreeSelectNode, TreeSelectValueStrategy } from './types.cjs';
 /** @internal The broadcast every `<skdx-tree-select-*>` part subscribes to for re-render. */
 export declare const TREE_SELECT_INTERNAL_UPDATE = "skdx-tree-select-internal-update";
 /** @internal The portal layer div, carrying a back-reference to the root that owns it. */
@@ -14,14 +15,11 @@ export declare function findTreeSelectRoot(el: Element): SkdxTreeSelect | null;
 export declare function defaultTreeSelectFilter(node: TreeSelectNode, inputValue: string): boolean;
 /** Default `getMatchCountLabel`: `"1 match available"` / `"3 matches available"`. */
 export declare function defaultGetMatchCountLabel(count: number): string;
-declare const SkdxTreeSelect_base: typeof LitElement & (new (...args: any[]) => import("../internal/form-associated.cjs").SkdxFormAssociated) & {
+declare const SkdxTreeSelect_base: typeof LitElement & (new (...args: any[]) => import("../index.cjs").SkdxFormAssociated) & {
     formAssociated: boolean;
 };
 /**
  * A `role="combobox"` trigger with a WAI-ARIA `treeview` popup for hierarchical data.
- * Owns checked set, expansion, filter text, open state, and virtual focus (aria-activedescendant).
- * Data is a `collection` of plain nodes, not child elements (needed for filtering collapsed branches).
- * `value`, `expandedIds`, `open`, `inputValue` are single sources of truth with `default-*` seeds.
  *
  * @fires value-change - Fired with the checked set projected through `value-strategy` whenever a node is toggled.
  * @fires expanded-change - Fired with the expanded node values whenever a branch is opened or closed by the user. Filter-driven auto-expansion is not a user expansion and does not fire.
@@ -62,9 +60,11 @@ export declare class SkdxTreeSelect extends SkdxTreeSelect_base {
     /** Which checked nodes appear in emitted value (all, parents-only, leaves-only, etc). @default 'all' */
     valueStrategy: TreeSelectValueStrategy;
     /** Expanded node values; filter auto-expands ancestors without writing back (preserves user expansion). */
-    expandedIds: string[];
+    expanded: string[];
     /** Initially expanded nodes, applied once on connect; JSON array attribute. */
-    defaultExpandedIds: string[];
+    defaultExpanded: string[];
+    /** Draws the popup as one indented tree or as one tree per open level, side by side. @default 'tree' */
+    layout: TreeSelectLayout;
     /** Whether the popup is open. Listen for `open-change`. */
     open: boolean;
     /** Initial open state, applied once on connect. */
@@ -95,6 +95,11 @@ export declare class SkdxTreeSelect extends SkdxTreeSelect_base {
     expandOnClick: boolean;
     /** Lazy-loads node children on first expand; mark branch with hasChildren. Skips loading while filtering. @default undefined */
     loadChildren?: (nodeValue: string) => void | Promise<void>;
+    /**
+     * Row scale for the derived `<skdx-tree-select-content>` panel, which is the element the skin sizes.
+     * @default undefined — the part keeps its own value.
+     */
+    size?: 'sm' | 'lg' | (string & {}) | undefined;
     /** @internal Unique per instance, so two tree selects on a page never share a node's DOM id. */
     readonly idPrefix: string;
     /** @internal The `role="tree"`'s id, which the trigger's `aria-controls` points at. */
@@ -107,6 +112,9 @@ export declare class SkdxTreeSelect extends SkdxTreeSelect_base {
     private readonly typeahead;
     private _loadingValues;
     private readonly requested;
+    private _pendingColumn;
+    /** @internal Clears cached load state for a node, or the whole tree when omitted, so a failed branch can be retried. */
+    invalidateLoad(value?: string): void;
     private _visibleRowValues;
     /** @internal Trigger and input register themselves for real focus management. */
     triggerEl: HTMLElement | null;
@@ -137,7 +145,7 @@ export declare class SkdxTreeSelect extends SkdxTreeSelect_base {
     /** @internal Effective expanded ids: user expansion plus filter auto-expansion of match ancestors (not written back). */
     get effectiveExpandedIds(): string[];
     /** @internal Effective expanded ids as a set. */
-    get expanded(): Set<string>;
+    get expandedSet(): Set<string>;
     /** @internal Whether a node survives the current filter (always `true` when not filtering). */
     isVisible(value: string): boolean;
     /** @internal Visible, expanded nodes in navigation order. */
@@ -150,18 +158,23 @@ export declare class SkdxTreeSelect extends SkdxTreeSelect_base {
     getLabel(value: string): string;
     /** @internal DOM id of a node's `treeitem`, for `aria-activedescendant`. */
     itemId(value: string): string;
+    /** @internal DOM id of the column tree at `index`, which `aria-controls` names as focus crosses columns. */
+    columnId(index: number): string;
+    /** @internal The layout actually drawn, which is `'tree'` while a filter narrows a columns popup. */
+    get effectiveLayout(): TreeSelectLayout;
+    /** @internal The columns showing for the current expanded set, left to right. */
+    get columns(): TreeColumn[];
+    /** @internal The tree `aria-controls` names — the active node's column while columns render. */
+    get activeTreeId(): string;
+    private get activeColumnIndex();
+    private enabledIn;
     /** @internal The virtually-focused node, or `null`. */
     get activeValue(): string | null;
     /** @internal Moves virtual focus to the specified node. */
     setActiveValue(value: string | null): void;
     /** @internal Whether a `<skdx-tree-select-input>` is mounted — it takes the activedescendant off the trigger. */
     get hasInput(): boolean;
-    /**
-     * @internal Node values `<skdx-tree-select-tree>` actually renders when its
-     * `rows` property windows below `flat`; `null` when unrestricted.
-     * Navigation and the initial active node draw from this so
-     * `aria-activedescendant` never names a node with no rendered `treeitem`.
-     */
+    /** @internal Node values `<skdx-tree-select-tree>` actually renders when `rows` windows below `flat`; `null` when unrestricted. */
     get visibleRowValues(): ReadonlySet<string> | null;
     /** @internal Reported by `<skdx-tree-select-tree>` whenever its `rows` property changes. */
     setVisibleRowValues(values: ReadonlySet<string> | null): void;
@@ -169,8 +182,15 @@ export declare class SkdxTreeSelect extends SkdxTreeSelect_base {
     setOpen(open: boolean): void;
     /** @internal Sets the filter text and announces matches. */
     setInputValue(value: string): void;
-    /** @internal Expands or collapses node; writes to expandedIds (filter expansion is transient). */
+    /**
+     * @internal Whether a row click toggles expansion; forced on under the columns
+     * layout, where the row is the only thing that opens the next column.
+     */
+    get expandsOnClick(): boolean;
+    /** @internal Expands or collapses node; writes to expanded (filter expansion is transient). */
     setExpanded(value: string, expand: boolean): void;
+    /** Replaces the whole expanded set at once, which the columns layout's single open path needs. */
+    private setExpandedPath;
     /** Starts load for node on first expansion. */
     private startLoad;
     /** @internal Whether loadChildren call is pending (publishes aria-busy/data-loading). */
@@ -191,13 +211,30 @@ export declare class SkdxTreeSelect extends SkdxTreeSelect_base {
     private get navigable();
     /** Sets value as active node and scrolls into view (scrollIntoView required for aria-activedescendant). */
     private activate;
+    /** Moves within the active column alone, staying put at either end. */
+    private columnMove;
+    /** Makes the first enabled node of `branch`'s column active; `false` when that column has none. */
+    private enterColumn;
+    private columnArrowRight;
+    private columnArrowLeft;
+    private _handleColumnsKeyDown;
     private move;
+    private _handleEscapeKeyDown;
+    private _handleTabKeyDown;
+    private _handleArrowDownKeyDown;
+    private _handleArrowUpKeyDown;
+    private _handleArrowRightKeyDown;
+    private _handleArrowLeftKeyDown;
+    private _handleHomeEndKeyDown;
+    private _handleExpandAllSiblingsKeyDown;
+    private _handleCommitKeyDown;
+    private _handleTypeaheadKeyDown;
     /** @internal Shared keydown handler for trigger and input; trigger enables typeahead and selectOnSpace. */
     onNavigationKeyDown(event: KeyboardEvent, options: {
         typeahead: boolean;
         selectOnSpace: boolean;
     }): void;
-    render(): import("lit").TemplateResult<1>;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {