@skdx/react 0.26.0

package/dist/tree/types.d.cts

@@ -0,0 +1,152 @@
+import type { PrimitivePropsWithRef } from '../utils/primitive.cjs';
+/** How many nodes a {@link Tree} allows selected at once: one, many, or no selection. */
+export type SelectionMode = 'single' | 'multiple' | 'none';
+/**
+ * Whether selecting a node also selects its subtree. `'descendants'` turns the
+ * tree into a tri-state checkbox tree: toggling a node applies to every one of
+ * its descendants, and a parent reports `aria-checked` of `true`, `false`, or
+ * `"mixed"` derived from them.
+ */
+export type TreeSelectionPropagation = 'none' | 'descendants';
+/** A node's tri-state checkbox value, as reported on `aria-checked`. */
+export type TreeCheckedState = boolean | 'mixed';
+/**
+ * A node's place among its siblings — the ones at its own level under its own
+ * parent, not a flat index over the tree — as reported on `aria-posinset`
+ * (1-based) and `aria-setsize`.
+ */
+export interface TreeNodePosition {
+    posinset: number;
+    setsize: number;
+}
+/** @internal Shared state distributed from {@link Tree} to its parts via context. Not part of the public API. */
+export interface TreeContextValue {
+    selectionMode: SelectionMode;
+    selectionPropagation: TreeSelectionPropagation;
+    expandedIds: Set<string>;
+    selectedIds: Set<string>;
+    /** Node ids whose `loadChildren` call is still pending. */
+    loadingIds: Set<string>;
+    activeNodeId: string | null;
+    setActiveNodeId: (nodeId: string) => void;
+    onExpandedChange: (nodeId: string, expanded: boolean) => void;
+    onSelectedChange: (nodeId: string) => void;
+    /**
+     * Tri-state value for a node: derived from its registered descendants when it
+     * has any, otherwise its own membership in `selectedIds`. Always `false` for
+     * every node unless `selectionPropagation` is `'descendants'`.
+     */
+    checkedState: (nodeId: string) => TreeCheckedState;
+    /**
+     * A node's `aria-posinset`/`aria-setsize`, measured off the rendered DOM in
+     * document order. `undefined` until the first measurement lands (one commit
+     * after mount) or for a node that isn't rendered.
+     */
+    positionOf: (nodeId: string) => TreeNodePosition | undefined;
+    /** Called by each `TreeItem` on mount so the root can walk the node hierarchy without touching the DOM. */
+    registerNode: (nodeId: string, parentId: string | null) => void;
+    unregisterNode: (nodeId: string) => void;
+}
+/** @internal Per-node state distributed from {@link TreeItem} to its descendants (e.g. `TreeGroup`, `TreeItemIndicator`) via context. Not part of the public API. */
+export interface TreeItemContextValue {
+    nodeId: string;
+    depth: number;
+    expanded: boolean;
+    selected: boolean;
+    disabled: boolean;
+    hasChildren: boolean;
+    /** Whether this node's `loadChildren` call is still pending. */
+    loading: boolean;
+}
+/** Props for the {@link Tree} root. */
+export interface TreeProps extends Omit<PrimitivePropsWithRef<'div'>, 'defaultValue'> {
+    /**
+     * `"single"`, `"multiple"`, or `"none"` (not selectable, just expand/collapse).
+     * @default 'single'
+     */
+    selectionMode?: SelectionMode;
+    /**
+     * Expanded node ids, for controlled usage. Pair with `onExpandedIdsChange`.
+     * @default undefined — uncontrolled, tracks its own expanded set internally.
+     */
+    expandedIds?: string[];
+    /**
+     * Initially expanded node ids, for uncontrolled usage.
+     * @default []
+     */
+    defaultExpandedIds?: string[];
+    /**
+     * Fires with the new set of expanded ids whenever a node is expanded or collapsed, controlled or not.
+     * @default undefined — no-op if omitted.
+     */
+    onExpandedIdsChange?: (ids: string[]) => void;
+    /**
+     * Selected node ids, for controlled usage. Pair with `onSelectedIdsChange`.
+     * @default undefined — uncontrolled, tracks its own selected set internally.
+     */
+    selectedIds?: string[];
+    /**
+     * Initially selected node ids, for uncontrolled usage.
+     * @default []
+     */
+    defaultSelectedIds?: string[];
+    /**
+     * Fires with the new set of selected ids whenever selection changes, controlled or not.
+     * @default undefined — no-op if omitted.
+     */
+    onSelectedIdsChange?: (ids: string[]) => void;
+    /**
+     * Turns the tree into a tri-state checkbox tree: toggling a node selects or
+     * deselects its whole subtree, and each node reports `aria-checked` of
+     * `true`/`false`/`"mixed"` derived from its descendants. Only meaningful with
+     * `selectionMode="multiple"`; ignored otherwise.
+     *
+     * Propagation reaches *rendered* descendants only — a collapsed `TreeGroup`
+     * is unmounted, so its nodes are not registered and cannot be toggled.
+     * @default 'none'
+     */
+    selectionPropagation?: TreeSelectionPropagation;
+    /**
+     * Loads a node's children the first time it is expanded. Return a promise to
+     * mark the node busy (`aria-busy="true"` plus `data-loading`) until it
+     * settles; when it resolves, `getLoadedLabel` is announced through the shared
+     * live region. A rejected promise clears the busy state, announces nothing,
+     * and leaves the node eligible to retry on the next expand.
+     *
+     * The node still needs a `TreeGroup` child to be expandable at all — render
+     * an empty one and fill it in when the promise resolves.
+     * @default undefined — children are always rendered eagerly.
+     */
+    loadChildren?: (nodeId: string) => void | Promise<void>;
+    /**
+     * Formats the message announced when a lazily-loaded node's children arrive —
+     * newly rendered children are otherwise silent. Return an empty string to
+     * announce nothing. Close over your own data if you want a count in it.
+     * @default defaultGetLoadedLabel — e.g. `"src loaded"`
+     */
+    getLoadedLabel?: (nodeId: string) => string;
+}
+/** Props for a single {@link TreeItem} node. */
+export interface TreeItemProps extends PrimitivePropsWithRef<'div'> {
+    /** Unique identifier tracked in the tree's expanded/selected/active state. */
+    nodeId: string;
+    /**
+     * Excludes this node (and its subtree's roving-focus/typeahead reach) from
+     * selection and keyboard activation.
+     * @default false
+     */
+    disabled?: boolean;
+}
+/** Props for {@link TreeGroup}, the collapsible container of a `TreeItem`'s children. */
+export interface TreeGroupProps extends PrimitivePropsWithRef<'div'> {
+    /**
+     * Keep this group mounted even while its parent `TreeItem` is collapsed,
+     * instead of unmounting it. Useful for animation libraries that need the
+     * outgoing content present in the DOM during an exit transition.
+     * @default false
+     */
+    forceMount?: boolean;
+}
+/** Props for {@link TreeItemIndicator}, the expand/collapse affordance (e.g. a chevron) within a `TreeItem`. */
+export interface TreeItemIndicatorProps extends PrimitivePropsWithRef<'span'> {
+}

package/dist/tree/types.d.ts

@@ -0,0 +1,152 @@
+import type { PrimitivePropsWithRef } from '../utils/primitive.js';
+/** How many nodes a {@link Tree} allows selected at once: one, many, or no selection. */
+export type SelectionMode = 'single' | 'multiple' | 'none';
+/**
+ * Whether selecting a node also selects its subtree. `'descendants'` turns the
+ * tree into a tri-state checkbox tree: toggling a node applies to every one of
+ * its descendants, and a parent reports `aria-checked` of `true`, `false`, or
+ * `"mixed"` derived from them.
+ */
+export type TreeSelectionPropagation = 'none' | 'descendants';
+/** A node's tri-state checkbox value, as reported on `aria-checked`. */
+export type TreeCheckedState = boolean | 'mixed';
+/**
+ * A node's place among its siblings — the ones at its own level under its own
+ * parent, not a flat index over the tree — as reported on `aria-posinset`
+ * (1-based) and `aria-setsize`.
+ */
+export interface TreeNodePosition {
+    posinset: number;
+    setsize: number;
+}
+/** @internal Shared state distributed from {@link Tree} to its parts via context. Not part of the public API. */
+export interface TreeContextValue {
+    selectionMode: SelectionMode;
+    selectionPropagation: TreeSelectionPropagation;
+    expandedIds: Set<string>;
+    selectedIds: Set<string>;
+    /** Node ids whose `loadChildren` call is still pending. */
+    loadingIds: Set<string>;
+    activeNodeId: string | null;
+    setActiveNodeId: (nodeId: string) => void;
+    onExpandedChange: (nodeId: string, expanded: boolean) => void;
+    onSelectedChange: (nodeId: string) => void;
+    /**
+     * Tri-state value for a node: derived from its registered descendants when it
+     * has any, otherwise its own membership in `selectedIds`. Always `false` for
+     * every node unless `selectionPropagation` is `'descendants'`.
+     */
+    checkedState: (nodeId: string) => TreeCheckedState;
+    /**
+     * A node's `aria-posinset`/`aria-setsize`, measured off the rendered DOM in
+     * document order. `undefined` until the first measurement lands (one commit
+     * after mount) or for a node that isn't rendered.
+     */
+    positionOf: (nodeId: string) => TreeNodePosition | undefined;
+    /** Called by each `TreeItem` on mount so the root can walk the node hierarchy without touching the DOM. */
+    registerNode: (nodeId: string, parentId: string | null) => void;
+    unregisterNode: (nodeId: string) => void;
+}
+/** @internal Per-node state distributed from {@link TreeItem} to its descendants (e.g. `TreeGroup`, `TreeItemIndicator`) via context. Not part of the public API. */
+export interface TreeItemContextValue {
+    nodeId: string;
+    depth: number;
+    expanded: boolean;
+    selected: boolean;
+    disabled: boolean;
+    hasChildren: boolean;
+    /** Whether this node's `loadChildren` call is still pending. */
+    loading: boolean;
+}
+/** Props for the {@link Tree} root. */
+export interface TreeProps extends Omit<PrimitivePropsWithRef<'div'>, 'defaultValue'> {
+    /**
+     * `"single"`, `"multiple"`, or `"none"` (not selectable, just expand/collapse).
+     * @default 'single'
+     */
+    selectionMode?: SelectionMode;
+    /**
+     * Expanded node ids, for controlled usage. Pair with `onExpandedIdsChange`.
+     * @default undefined — uncontrolled, tracks its own expanded set internally.
+     */
+    expandedIds?: string[];
+    /**
+     * Initially expanded node ids, for uncontrolled usage.
+     * @default []
+     */
+    defaultExpandedIds?: string[];
+    /**
+     * Fires with the new set of expanded ids whenever a node is expanded or collapsed, controlled or not.
+     * @default undefined — no-op if omitted.
+     */
+    onExpandedIdsChange?: (ids: string[]) => void;
+    /**
+     * Selected node ids, for controlled usage. Pair with `onSelectedIdsChange`.
+     * @default undefined — uncontrolled, tracks its own selected set internally.
+     */
+    selectedIds?: string[];
+    /**
+     * Initially selected node ids, for uncontrolled usage.
+     * @default []
+     */
+    defaultSelectedIds?: string[];
+    /**
+     * Fires with the new set of selected ids whenever selection changes, controlled or not.
+     * @default undefined — no-op if omitted.
+     */
+    onSelectedIdsChange?: (ids: string[]) => void;
+    /**
+     * Turns the tree into a tri-state checkbox tree: toggling a node selects or
+     * deselects its whole subtree, and each node reports `aria-checked` of
+     * `true`/`false`/`"mixed"` derived from its descendants. Only meaningful with
+     * `selectionMode="multiple"`; ignored otherwise.
+     *
+     * Propagation reaches *rendered* descendants only — a collapsed `TreeGroup`
+     * is unmounted, so its nodes are not registered and cannot be toggled.
+     * @default 'none'
+     */
+    selectionPropagation?: TreeSelectionPropagation;
+    /**
+     * Loads a node's children the first time it is expanded. Return a promise to
+     * mark the node busy (`aria-busy="true"` plus `data-loading`) until it
+     * settles; when it resolves, `getLoadedLabel` is announced through the shared
+     * live region. A rejected promise clears the busy state, announces nothing,
+     * and leaves the node eligible to retry on the next expand.
+     *
+     * The node still needs a `TreeGroup` child to be expandable at all — render
+     * an empty one and fill it in when the promise resolves.
+     * @default undefined — children are always rendered eagerly.
+     */
+    loadChildren?: (nodeId: string) => void | Promise<void>;
+    /**
+     * Formats the message announced when a lazily-loaded node's children arrive —
+     * newly rendered children are otherwise silent. Return an empty string to
+     * announce nothing. Close over your own data if you want a count in it.
+     * @default defaultGetLoadedLabel — e.g. `"src loaded"`
+     */
+    getLoadedLabel?: (nodeId: string) => string;
+}
+/** Props for a single {@link TreeItem} node. */
+export interface TreeItemProps extends PrimitivePropsWithRef<'div'> {
+    /** Unique identifier tracked in the tree's expanded/selected/active state. */
+    nodeId: string;
+    /**
+     * Excludes this node (and its subtree's roving-focus/typeahead reach) from
+     * selection and keyboard activation.
+     * @default false
+     */
+    disabled?: boolean;
+}
+/** Props for {@link TreeGroup}, the collapsible container of a `TreeItem`'s children. */
+export interface TreeGroupProps extends PrimitivePropsWithRef<'div'> {
+    /**
+     * Keep this group mounted even while its parent `TreeItem` is collapsed,
+     * instead of unmounting it. Useful for animation libraries that need the
+     * outgoing content present in the DOM during an exit transition.
+     * @default false
+     */
+    forceMount?: boolean;
+}
+/** Props for {@link TreeItemIndicator}, the expand/collapse affordance (e.g. a chevron) within a `TreeItem`. */
+export interface TreeItemIndicatorProps extends PrimitivePropsWithRef<'span'> {
+}

package/dist/tree-select/TreeSelect.cjs

@@ -0,0 +1 @@
+"use strict";var Yt=Object.create;var Q=Object.defineProperty;var Jt=Object.getOwnPropertyDescriptor;var Qt=Object.getOwnPropertyNames;var Xt=Object.getPrototypeOf,Zt=Object.prototype.hasOwnProperty;var jt=(e,r)=>{for(var t in r)Q(e,t,{get:r[t],enumerable:!0})},Oe=(e,r,t,l)=>{if(r&&typeof r=="object"||typeof r=="function")for(let n of Qt(r))!Zt.call(e,n)&&n!==t&&Q(e,n,{get:()=>r[n],enumerable:!(l=Jt(r,n))||l.enumerable});return e};var N=(e,r,t)=>(t=e!=null?Yt(Xt(e)):{},Oe(r||!e||!e.__esModule?Q(t,"default",{value:e,enumerable:!0}):t,e)),er=e=>Oe(Q({},"__esModule",{value:!0}),e);var or={};jt(or,{TreeSelect:()=>fe,TreeSelectContent:()=>he,TreeSelectEmpty:()=>Re,TreeSelectInput:()=>Ie,TreeSelectItem:()=>B,TreeSelectItemIndicator:()=>ve,TreeSelectPortal:()=>ge,TreeSelectTree:()=>xe,TreeSelectTrigger:()=>me,TreeSelectValue:()=>Te,defaultGetMatchCountLabel:()=>ue,defaultTreeSelectFilter:()=>de});module.exports=er(or);var d=N(require("react"),1),$e=require("../utils/clamp.cjs"),Be=require("../utils/createContext.cjs"),Z=require("../utils/direction.cjs"),_e=require("../utils/liveAnnouncer.cjs"),qe=require("../utils/popper.cjs"),G=require("../utils/useControllableState.cjs"),Ue=require("../utils/useOpenChangeComplete.cjs"),j=require("../utils/useTypeahead.cjs");function He(e){let r=new Map,t=[],l=(n,a,c,s)=>{for(let i of n){let u=s||i.disabled===!0,f=i.children??[],y={node:i,parent:a,depth:c,childValues:f.map(p=>p.value),descendants:[],leaves:[],disabled:u};if(r.set(i.value,y),t.push(i.value),l(f,i.value,c+1,u),f.length===0)u||y.leaves.push(i.value);else for(let p of f){let x=r.get(p.value);x&&(y.descendants.push(p.value,...x.descendants),y.leaves.push(...x.leaves))}}};return l(e,null,1,!1),{index:r,order:t}}function Le(e,r){let t=[],l=r.get(e)?.parent??null;for(;l!==null;)t.push(l),l=r.get(l)?.parent??null;return t}function X(e,r,t,l){if(!l)return r.has(e);let n=t.get(e);if(!n||n.leaves.length===0)return r.has(e);let a=0;for(let c of n.leaves)r.has(c)&&a++;return a===0?!1:a===n.leaves.length?!0:"mixed"}function Fe(e,r,t,l){let n=new Set;for(let a of e)r.has(a)&&n.add(a);if(!l)return n;for(let a of[...n]){let c=r.get(a);if(c)for(let s of c.descendants)r.get(s)?.disabled||n.add(s)}for(let a of t){let c=r.get(a);c&&(c.leaves.length===0||c.childValues.length===0||(c.leaves.every(s=>n.has(s))?n.add(a):n.delete(a)))}return n}function Ke(e,r,t,l){let n=t.filter(a=>e.has(a));return l==="all"?n:l==="leaf"?n.filter(a=>r.get(a)?.childValues.length===0):n.filter(a=>{let c=r.get(a)?.parent??null;return c===null||!e.has(c)})}function Ae(e,r,t,l,n){if(!n)return new Set([e]);let a=new Set(r),c=t.get(e);if(!l||!c)return a.has(e)?a.delete(e):a.add(e),a;let s=X(e,r,t,!0)!==!0;for(let i of[e,...c.descendants])t.get(i)?.disabled||(s?a.add(i):a.delete(i));for(let i of Le(e,t)){let u=t.get(i);u&&(u.leaves.length>0&&u.leaves.every(f=>a.has(f))?a.add(i):a.delete(i))}return a}function ze(e,r,t){let l=new Set,n=new Set,a=0;for(let c of r){let s=e.get(c);if(s&&t(s.node)){a++,l.add(c);for(let i of Le(c,e))l.add(i),n.add(i);for(let i of s.descendants)l.add(i)}}return{visible:l,autoExpanded:n,matchCount:a}}function Ge(e,r,t,l){let n=[],a=s=>t===null||t.has(s.value),c=(s,i)=>{let u=s.filter(a);u.forEach((f,y)=>{let p=r.get(f.value);if(!p)return;let x=(f.children??[]).filter(a),V=l.has(f.value);n.push({value:f.value,parent:i,depth:p.depth,disabled:p.disabled,hasChildren:x.length>0,expanded:V,posinset:y+1,setsize:u.length}),x.length>0&&V&&c(x,f.value)})};return c(e,null),n}var ie=require("react/jsx-runtime");function de(e,r){return(e.label??e.value).toLowerCase().includes(r.trim().toLowerCase())}function ue(e){return`${e} match${e===1?"":"es"} available`}var[tr,g]=(0,Be.createSafeContext)("TreeSelect"),rr=new Set;function fe({children:e,collection:r,value:t,defaultValue:l,onValueChange:n,multiple:a=!1,checkStrategy:c="cascade",valueStrategy:s="all",expandedValue:i,defaultExpandedValue:u,onExpandedChange:f,open:y,defaultOpen:p=!1,onOpenChange:x,onOpenChangeComplete:V,inputValue:H,defaultInputValue:h="",onInputValueChange:Nt,filter:be=de,disabled:L=!1,readOnly:re=!1,closeOnSelect:Ce=!a,getMatchCountLabel:Pe=ue}){let ne=d.useRef(null),ae=d.useRef(null),wt=d.useRef(null),[Vt,Mt]=d.useState(!1),[I,w]=d.useState(null),Ee=d.useId(),Dt=d.useId(),Ot=d.useId(),ke=(0,Z.useDirection)(),[oe=[],Ne]=(0,G.useControllableState)({prop:t,defaultProp:l??[],onChange:n}),[le=[],we]=(0,G.useControllableState)({prop:i,defaultProp:u??[],onChange:f}),[S=!1,E]=(0,G.useControllableState)({prop:y,defaultProp:p,onChange:x});(0,Ue.useOpenChangeComplete)(S,ae,V);let[U="",Ht]=(0,G.useControllableState)({prop:H,defaultProp:h,onChange:Nt}),{index:m,order:b}=d.useMemo(()=>He(r),[r]),C=a&&c==="cascade",O=d.useMemo(()=>Fe(oe,m,b,C),[oe,m,b,C]),W=U.trim()!=="",{visible:F,autoExpanded:se,matchCount:Ve}=d.useMemo(()=>W?ze(m,b,o=>be(o,U)):{visible:null,autoExpanded:rr,matchCount:b.length},[W,m,b,be,U]),K=d.useMemo(()=>{if(se.size===0)return le;let o=new Set(le);for(let v of se)o.add(v);return[...o]},[le,se]),A=d.useMemo(()=>new Set(K),[K]),Lt=d.useCallback(o=>F===null||F.has(o),[F]),k=d.useMemo(()=>Ge(r,m,F,A),[r,m,F,A]),Y=d.useMemo(()=>new Map(k.map(o=>[o.value,o])),[k]),Ft=d.useCallback(o=>X(o,O,m,C),[O,m,C]),Kt=d.useMemo(()=>b.filter(o=>X(o,O,m,C)===!0),[b,O,m,C]),M=d.useCallback((o,v)=>{we((T=[])=>v?T.includes(o)?T:[...T,o]:T.filter(R=>R!==o))},[we]),At=d.useCallback(o=>{let v=new Set(o),T=o.find(z=>!A.has(z));if(T!==void 0){M(T,!0);return}let R=K.find(z=>!v.has(z));R!==void 0&&M(R,!1)},[A,K,M]),ce=d.useCallback(o=>{if(L||re)return;let v=m.get(o);if(!v||v.disabled)return;let T=Ae(o,O,m,C,a);Ne(Ke(T,m,b,C?s:"all")),Ce&&(E(!1),ne.current?.focus())},[L,re,m,O,C,a,b,s,Ne,Ce,E]),[zt,Gt]=d.useState(!1),[$t,Bt]=d.useState(k);(S!==zt||k!==$t)&&(Gt(S),Bt(k),S?(I===null||Y.get(I)?.disabled!==!1)&&w(k.find(o=>!o.disabled)?.value??null):w(null)),d.useEffect(()=>{!S||!W||(0,_e.announce)(Pe(Ve))},[S,W,Ve,Pe]);let _t=d.useCallback(o=>`${Ee}item-${o}`,[Ee]),qt=d.useCallback(o=>m.get(o)?.node.label??o,[m]),P=d.useMemo(()=>k.filter(o=>!o.disabled),[k]),J=d.useRef(P);d.useEffect(()=>{J.current=P});let Me=(0,j.useTypeahead)(d.useCallback(()=>J.current.map(o=>m.get(o.value)?.node.label??o.value),[m])),D=d.useCallback(o=>{if(P.length===0)return;if(o==="first"){w(P[0].value);return}if(o==="last"){w(P[P.length-1].value);return}let v=P.findIndex(T=>T.value===I);w(P[(0,$e.clamp)(v+o,0,P.length-1)].value)},[P,I]),Ut=d.useCallback((o,v)=>{if(L)return;let T=(0,Z.directionalKey)(o.key,o.currentTarget,ke),R=I===null?void 0:Y.get(I);if(o.key==="Escape"){if(!S||ae.current)return;o.preventDefault(),E(!1),ne.current?.focus();return}if(o.key==="Tab"){S&&E(!1);return}if(T==="ArrowDown"){o.preventDefault(),S?D(1):(E(!0),D("first"));return}if(T==="ArrowUp"){o.preventDefault(),S?D(-1):(E(!0),D("last"));return}if(T==="ArrowRight"){if(!S)return;o.preventDefault(),R?.hasChildren&&!R.expanded?M(R.value,!0):D(1);return}if(T==="ArrowLeft"){if(!S)return;o.preventDefault(),R?.hasChildren&&R.expanded?M(R.value,!1):R?.parent&&w(R.parent);return}if(o.key==="Home"||o.key==="End"){if(!S)return;o.preventDefault(),D(o.key==="Home"?"first":"last");return}if(o.key==="Enter"||o.key===" "&&v.selectOnSpace){if(o.preventDefault(),!S){E(!0);return}I!==null&&ce(I);return}if(v.typeahead&&S&&(0,j.isTypeaheadKey)(o)){o.preventDefault();let z=J.current.findIndex(Wt=>Wt.value===I),De=Me(o.key,z);De!==-1&&w(J.current[De].value)}},[L,ke,I,Y,S,E,D,M,ce,Me]);return(0,ie.jsx)(qe.PopperRoot,{children:(0,ie.jsx)(tr,{collection:r,index:m,order:b,value:oe,multiple:a,cascade:C,disabled:L,readOnly:re,checkStateOf:Ft,commit:ce,open:S,onOpenChange:E,expandedIds:K,expanded:A,setExpanded:M,onTreeExpandedIdsChange:At,selectedIds:Kt,isVisible:Lt,flat:k,flatMap:Y,activeValue:I,setActiveValue:w,itemId:_t,treeId:Dt,contentId:Ot,triggerRef:ne,contentRef:ae,inputRef:wt,hasInput:Vt,setHasInput:Mt,inputValue:U,onInputValueChange:Ht,getLabel:qt,onNavigationKeyDown:Ut,children:e})})}fe.displayName="TreeSelect";var We=N(require("react"),1),Ye=require("../utils/composeRefs.cjs"),Je=require("../utils/part.cjs"),Qe=require("../utils/popper.cjs"),$=require("../utils/primitive.cjs");var pe=require("react/jsx-runtime"),me=We.forwardRef((e,r)=>{let t=g("TreeSelectTrigger"),l=(0,Ye.useComposedRefs)(r,t.triggerRef),n=t.disabled||e.disabled,a=t.open&&!t.hasInput?t.activeValue:null;return(0,pe.jsx)(Qe.PopperAnchor,{asChild:!0,children:(0,pe.jsx)($.Primitive.button,{type:"button",role:"combobox","aria-haspopup":"tree","aria-expanded":t.open,"aria-controls":t.treeId,"aria-activedescendant":a===null?void 0:t.itemId(a),"aria-readonly":t.readOnly?!0:void 0,"data-state":t.open?"open":"closed","data-disabled":n?"":void 0,"data-readonly":t.readOnly?"":void 0,"data-multiple":t.multiple?"":void 0,"data-placeholder":t.value.length===0?"":void 0,disabled:n,...e,...(0,Je.skdxPart)("tree-select","trigger",e.className),ref:l,onClick:(0,$.composeEventHandlers)(e.onClick,()=>t.onOpenChange(!t.open)),onKeyDown:(0,$.composeEventHandlers)(e.onKeyDown,c=>t.onNavigationKeyDown(c,{typeahead:!0,selectOnSpace:!0}))})})});me.displayName="TreeSelectTrigger";var Xe=N(require("react"),1),Ze=require("../utils/part.cjs"),je=require("../utils/primitive.cjs");var Se=require("react/jsx-runtime"),Te=Xe.forwardRef(({placeholder:e,children:r,...t},l)=>{let{value:n,multiple:a,getLabel:c}=g("TreeSelectValue"),s,i=!1;return r!==void 0?s=r:n.length===0?(s=e,i=!0):a?s=n.map(u=>(0,Se.jsx)("span",{"data-chip":"","data-value":u,children:c(u)},u)):s=c(n[0]),(0,Se.jsx)(je.Primitive.span,{"data-multiple":a?"":void 0,"data-placeholder":i?"":void 0,...t,...(0,Ze.skdxPart)("tree-select","value",t.className),ref:l,style:{pointerEvents:"none",...t.style},children:s})});Te.displayName="TreeSelectValue";var et=require("../utils/portal.cjs");var tt=require("react/jsx-runtime"),ge=({forceMount:e,children:r,...t})=>{let l=g("TreeSelectPortal");return e||l.open?(0,tt.jsx)(et.Portal,{...t,children:r}):null};ge.displayName="TreeSelectPortal";var ee=N(require("react"),1),rt=require("../utils/composeRefs.cjs"),nt=require("../utils/part.cjs"),at=require("../utils/popper.cjs"),ot=require("../utils/primitive.cjs"),lt=require("../utils/useDismiss.cjs");var st=require("react/jsx-runtime"),he=ee.forwardRef(({forceMount:e,side:r="bottom",align:t="start",sideOffset:l=4,onEscapeKeyDown:n,onPointerDownOutside:a,onFocusOutside:c,onInteractOutside:s,...i},u)=>{let f=g("TreeSelectContent"),y=(0,rt.useComposedRefs)(u,f.contentRef),{open:p,onOpenChange:x,triggerRef:V,inputRef:H}=f;return(0,lt.useDismiss)({enabled:p,onEscapeKeyDown:h=>{n?.(h),!h.defaultPrevented&&(x(!1),V.current?.focus())},onInteractOutside:s,onPointerDownOutside:h=>{a?.(h),h.defaultPrevented||x(!1)},onFocusOutside:h=>{c?.(h),h.defaultPrevented||x(!1)}},[f.contentRef,V]),ee.useEffect(()=>{if(!p)return;let h=requestAnimationFrame(()=>H.current?.focus());return()=>cancelAnimationFrame(h)},[p,H]),e||p?(0,st.jsx)(at.PopperContent,{component:"tree-select",id:f.contentId,"data-state":p?"open":"closed","data-multiple":f.multiple?"":void 0,side:r,align:t,sideOffset:l,...i,...(0,nt.skdxPart)("tree-select","content",i.className),ref:y,onMouseDown:(0,ot.composeEventHandlers)(i.onMouseDown,h=>{h.target!==H.current&&h.preventDefault()})}):null});he.displayName="TreeSelectContent";var mt=N(require("react"),1),St=require("../tree/Tree.cjs"),Tt=require("../tree/Tree.cjs"),gt=require("../utils/part.cjs");var ct=N(require("react"),1),it=require("../tree/Tree.cjs"),dt=require("../utils/createContext.cjs"),ut=require("../utils/part.cjs"),ft=require("../utils/primitive.cjs");var ye=require("react/jsx-runtime"),[nr,pt]=(0,dt.createSafeContext)("TreeSelectItem");function ar(e){return e.target.closest('[role="treeitem"]')!==e.currentTarget}var B=ct.forwardRef(({node:e,children:r,...t},l)=>{let n=g("TreeSelectItem"),a=n.index.get(e.value),c=n.flatMap.get(e.value),s=n.checkStateOf(e.value),i=a?.disabled??e.disabled??!1,u=n.expanded.has(e.value),f=c?.hasChildren??!1,y=n.activeValue===e.value;return(0,ye.jsx)(nr,{value:e.value,checkState:s,disabled:i,expanded:u,hasChildren:f,active:y,children:(0,ye.jsx)(it.TreeItem,{nodeId:e.value,disabled:i,id:n.itemId(e.value),"data-value":e.value,"data-highlighted":y?"":void 0,"aria-checked":n.multiple?s==="mixed"?"mixed":s:void 0,"data-checked":s==="mixed"?"indeterminate":s?"checked":"unchecked","aria-posinset":c?.posinset,"aria-setsize":c?.setsize,tabIndex:-1,...t,...(0,ut.skdxPart)("tree-select","item",t.className),ref:l,onClick:(0,ft.composeEventHandlers)(t.onClick,p=>{ar(p)||(p.preventDefault(),!i&&(n.setActiveValue(e.value),n.commit(e.value)))}),children:r})})});B.displayName="TreeSelectItem";var _=require("react/jsx-runtime"),xe=mt.forwardRef(({renderLabel:e,...r},t)=>{let l=g("TreeSelectTree"),{isVisible:n}=l,a=c=>c.filter(s=>n(s.value)).map(s=>{let i=(s.children??[]).filter(u=>n(u.value));return(0,_.jsxs)(B,{node:s,children:[e?e(s):s.label??s.value,i.length>0?(0,_.jsx)(Tt.TreeGroup,{children:a(i)}):null]},s.value)});return(0,_.jsx)(St.Tree,{id:l.treeId,selectionMode:l.multiple?"multiple":"single","aria-readonly":l.readOnly||void 0,expandedIds:l.expandedIds,onExpandedIdsChange:l.onTreeExpandedIdsChange,selectedIds:l.selectedIds,...r,...(0,gt.skdxPart)("tree-select","tree",r.className),ref:t,children:a(l.collection)})});xe.displayName="TreeSelectTree";var ht=N(require("react"),1),yt=require("../utils/part.cjs"),xt=require("../utils/primitive.cjs");var vt=require("react/jsx-runtime"),ve=ht.forwardRef(({forceMount:e,...r},t)=>{let l=pt("TreeSelectItemIndicator"),{checkState:n}=l;return e||n!==!1?(0,vt.jsx)(xt.Primitive.span,{"aria-hidden":!0,"data-state":n==="mixed"?"indeterminate":n?"checked":"unchecked",...r,...(0,yt.skdxPart)("tree-select","item-indicator",r.className),ref:t}):null});ve.displayName="TreeSelectItemIndicator";var Rt=N(require("react"),1),It=require("../utils/part.cjs"),bt=require("../utils/primitive.cjs");var Ct=require("react/jsx-runtime"),Re=Rt.forwardRef((e,r)=>g("TreeSelectEmpty").flat.length===0?(0,Ct.jsx)(bt.Primitive.div,{role:"presentation",...e,...(0,It.skdxPart)("tree-select","empty",e.className),ref:r}):null);Re.displayName="TreeSelectEmpty";var te=N(require("react"),1),Pt=require("../utils/composeRefs.cjs"),Et=require("../utils/part.cjs"),q=require("../utils/primitive.cjs");var kt=require("react/jsx-runtime"),Ie=te.forwardRef((e,r)=>{let t=g("TreeSelectInput"),l=(0,Pt.useComposedRefs)(r,t.inputRef),{setHasInput:n}=t;return te.useEffect(()=>(n(!0),()=>n(!1)),[n]),(0,kt.jsx)(q.Primitive.input,{type:"text",autoComplete:"off","aria-controls":t.treeId,"aria-activedescendant":t.activeValue===null?void 0:t.itemId(t.activeValue),"aria-readonly":t.readOnly?!0:void 0,"data-readonly":t.readOnly?"":void 0,disabled:t.disabled||void 0,...e,...(0,Et.skdxPart)("tree-select","input",e.className),ref:l,value:t.inputValue,onChange:(0,q.composeEventHandlers)(e.onChange,a=>t.onInputValueChange(a.target.value)),onKeyDown:(0,q.composeEventHandlers)(e.onKeyDown,a=>t.onNavigationKeyDown(a,{typeahead:!1,selectOnSpace:!1}))})});Ie.displayName="TreeSelectInput";0&&(module.exports={TreeSelect,TreeSelectContent,TreeSelectEmpty,TreeSelectInput,TreeSelectItem,TreeSelectItemIndicator,TreeSelectPortal,TreeSelectTree,TreeSelectTrigger,TreeSelectValue,defaultGetMatchCountLabel,defaultTreeSelectFilter});

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

@@ -0,0 +1,60 @@
+import * as React from 'react';
+import type { TreeSelectContextValue, TreeSelectNode, TreeSelectProps } from './types.cjs';
+/** Default `filter`: case-insensitive substring match on the node's `label ?? value`. */
+export declare function defaultTreeSelectFilter(node: TreeSelectNode, inputValue: string): boolean;
+/** Default `getMatchCountLabel`: `"1 match available"` / `"3 matches available"`. */
+export declare function defaultGetMatchCountLabel(count: number): string;
+export declare const TreeSelectProvider: {
+    (props: TreeSelectContextValue & {
+        children: React.ReactNode;
+    }): React.JSX.Element;
+    displayName: string;
+}, useTreeSelectContext: (consumerName: string) => TreeSelectContextValue;
+/**
+ * Root of a tree select: a `role="combobox"` trigger whose popup is a
+ * WAI-ARIA `treeview`, for picking from hierarchical data. Owns the checked
+ * set, expansion, filter text, open state and virtual focus, and hands all of
+ * them to every other `TreeSelect*` part via context. Renders no DOM of its
+ * own.
+ *
+ * Real DOM focus never enters the tree: it stays on the trigger, or on
+ * `TreeSelectInput` when one is mounted, and the focused node is tracked as
+ * virtual focus through `aria-activedescendant`. The popup composes the
+ * `Tree` family for its `role="tree"`/`role="treeitem"` markup, but drives
+ * navigation itself for exactly that reason.
+ *
+ * The data is a `collection` of plain nodes rather than children, because the
+ * three things this component exists to do — cascade a check through a
+ * subtree, project the checked set through `valueStrategy`, and keep the
+ * ancestors of a filter match visible — all have to be correct for branches
+ * that are collapsed, and a collapsed branch is not in the DOM.
+ *
+ * Works controlled (`value` + `onValueChange`, `expandedValue` +
+ * `onExpandedChange`, `open` + `onOpenChange`, `inputValue` +
+ * `onInputValueChange`) or uncontrolled (`defaultValue`,
+ * `defaultExpandedValue`, `defaultOpen`, `defaultInputValue`).
+ *
+ * @example
+ * ```tsx
+ * const REGIONS = [
+ *   { value: 'emea', label: 'EMEA', children: [{ value: 'uk', label: 'United Kingdom' }] },
+ * ];
+ *
+ * <TreeSelect collection={REGIONS} multiple valueStrategy="shallowest">
+ *   <TreeSelectTrigger>
+ *     <TreeSelectValue placeholder="Pick regions" />
+ *   </TreeSelectTrigger>
+ *   <TreeSelectPortal>
+ *     <TreeSelectContent>
+ *       <TreeSelectInput placeholder="Filter regions…" />
+ *       <TreeSelectTree aria-label="Regions" />
+ *       <TreeSelectEmpty>No regions match</TreeSelectEmpty>
+ *     </TreeSelectContent>
+ *   </TreeSelectPortal>
+ * </TreeSelect>
+ * ```
+ */
+export declare function TreeSelect({ children, collection, value: valueProp, defaultValue, onValueChange, multiple, checkStrategy, valueStrategy, expandedValue: expandedProp, defaultExpandedValue, onExpandedChange, open: openProp, defaultOpen, onOpenChange, onOpenChangeComplete, inputValue: inputValueProp, defaultInputValue, onInputValueChange, filter, disabled, readOnly, closeOnSelect, getMatchCountLabel, }: TreeSelectProps): React.JSX.Element;
+export declare namespace TreeSelect {
+    var displayName: string;
+}

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

@@ -0,0 +1,60 @@
+import * as React from 'react';
+import type { TreeSelectContextValue, TreeSelectNode, TreeSelectProps } from './types.js';
+/** Default `filter`: case-insensitive substring match on the node's `label ?? value`. */
+export declare function defaultTreeSelectFilter(node: TreeSelectNode, inputValue: string): boolean;
+/** Default `getMatchCountLabel`: `"1 match available"` / `"3 matches available"`. */
+export declare function defaultGetMatchCountLabel(count: number): string;
+export declare const TreeSelectProvider: {
+    (props: TreeSelectContextValue & {
+        children: React.ReactNode;
+    }): React.JSX.Element;
+    displayName: string;
+}, useTreeSelectContext: (consumerName: string) => TreeSelectContextValue;
+/**
+ * Root of a tree select: a `role="combobox"` trigger whose popup is a
+ * WAI-ARIA `treeview`, for picking from hierarchical data. Owns the checked
+ * set, expansion, filter text, open state and virtual focus, and hands all of
+ * them to every other `TreeSelect*` part via context. Renders no DOM of its
+ * own.
+ *
+ * Real DOM focus never enters the tree: it stays on the trigger, or on
+ * `TreeSelectInput` when one is mounted, and the focused node is tracked as
+ * virtual focus through `aria-activedescendant`. The popup composes the
+ * `Tree` family for its `role="tree"`/`role="treeitem"` markup, but drives
+ * navigation itself for exactly that reason.
+ *
+ * The data is a `collection` of plain nodes rather than children, because the
+ * three things this component exists to do — cascade a check through a
+ * subtree, project the checked set through `valueStrategy`, and keep the
+ * ancestors of a filter match visible — all have to be correct for branches
+ * that are collapsed, and a collapsed branch is not in the DOM.
+ *
+ * Works controlled (`value` + `onValueChange`, `expandedValue` +
+ * `onExpandedChange`, `open` + `onOpenChange`, `inputValue` +
+ * `onInputValueChange`) or uncontrolled (`defaultValue`,
+ * `defaultExpandedValue`, `defaultOpen`, `defaultInputValue`).
+ *
+ * @example
+ * ```tsx
+ * const REGIONS = [
+ *   { value: 'emea', label: 'EMEA', children: [{ value: 'uk', label: 'United Kingdom' }] },
+ * ];
+ *
+ * <TreeSelect collection={REGIONS} multiple valueStrategy="shallowest">
+ *   <TreeSelectTrigger>
+ *     <TreeSelectValue placeholder="Pick regions" />
+ *   </TreeSelectTrigger>
+ *   <TreeSelectPortal>
+ *     <TreeSelectContent>
+ *       <TreeSelectInput placeholder="Filter regions…" />
+ *       <TreeSelectTree aria-label="Regions" />
+ *       <TreeSelectEmpty>No regions match</TreeSelectEmpty>
+ *     </TreeSelectContent>
+ *   </TreeSelectPortal>
+ * </TreeSelect>
+ * ```
+ */
+export declare function TreeSelect({ children, collection, value: valueProp, defaultValue, onValueChange, multiple, checkStrategy, valueStrategy, expandedValue: expandedProp, defaultExpandedValue, onExpandedChange, open: openProp, defaultOpen, onOpenChange, onOpenChangeComplete, inputValue: inputValueProp, defaultInputValue, onInputValueChange, filter, disabled, readOnly, closeOnSelect, getMatchCountLabel, }: TreeSelectProps): React.JSX.Element;
+export declare namespace TreeSelect {
+    var displayName: string;
+}

package/dist/tree-select/TreeSelect.js

@@ -0,0 +1 @@
+import*as d from"react";import{clamp as it}from"../utils/clamp.js";import{createSafeContext as dt}from"../utils/createContext.js";import{directionalKey as ut,useDirection as ft}from"../utils/direction.js";import{announce as pt}from"../utils/liveAnnouncer.js";import{PopperRoot as mt}from"../utils/popper.js";import{useControllableState as q}from"../utils/useControllableState.js";import{useOpenChangeComplete as St}from"../utils/useOpenChangeComplete.js";import{isTypeaheadKey as Tt,useTypeahead as gt}from"../utils/useTypeahead.js";function fe(e){let o=new Map,t=[],l=(n,r,c,s)=>{for(let i of n){let u=s||i.disabled===!0,f=i.children??[],y={node:i,parent:r,depth:c,childValues:f.map(p=>p.value),descendants:[],leaves:[],disabled:u};if(o.set(i.value,y),t.push(i.value),l(f,i.value,c+1,u),f.length===0)u||y.leaves.push(i.value);else for(let p of f){let x=o.get(p.value);x&&(y.descendants.push(p.value,...x.descendants),y.leaves.push(...x.leaves))}}};return l(e,null,1,!1),{index:o,order:t}}function pe(e,o){let t=[],l=o.get(e)?.parent??null;for(;l!==null;)t.push(l),l=o.get(l)?.parent??null;return t}function _(e,o,t,l){if(!l)return o.has(e);let n=t.get(e);if(!n||n.leaves.length===0)return o.has(e);let r=0;for(let c of n.leaves)o.has(c)&&r++;return r===0?!1:r===n.leaves.length?!0:"mixed"}function me(e,o,t,l){let n=new Set;for(let r of e)o.has(r)&&n.add(r);if(!l)return n;for(let r of[...n]){let c=o.get(r);if(c)for(let s of c.descendants)o.get(s)?.disabled||n.add(s)}for(let r of t){let c=o.get(r);c&&(c.leaves.length===0||c.childValues.length===0||(c.leaves.every(s=>n.has(s))?n.add(r):n.delete(r)))}return n}function Se(e,o,t,l){let n=t.filter(r=>e.has(r));return l==="all"?n:l==="leaf"?n.filter(r=>o.get(r)?.childValues.length===0):n.filter(r=>{let c=o.get(r)?.parent??null;return c===null||!e.has(c)})}function Te(e,o,t,l,n){if(!n)return new Set([e]);let r=new Set(o),c=t.get(e);if(!l||!c)return r.has(e)?r.delete(e):r.add(e),r;let s=_(e,o,t,!0)!==!0;for(let i of[e,...c.descendants])t.get(i)?.disabled||(s?r.add(i):r.delete(i));for(let i of pe(e,t)){let u=t.get(i);u&&(u.leaves.length>0&&u.leaves.every(f=>r.has(f))?r.add(i):r.delete(i))}return r}function ge(e,o,t){let l=new Set,n=new Set,r=0;for(let c of o){let s=e.get(c);if(s&&t(s.node)){r++,l.add(c);for(let i of pe(c,e))l.add(i),n.add(i);for(let i of s.descendants)l.add(i)}}return{visible:l,autoExpanded:n,matchCount:r}}function he(e,o,t,l){let n=[],r=s=>t===null||t.has(s.value),c=(s,i)=>{let u=s.filter(r);u.forEach((f,y)=>{let p=o.get(f.value);if(!p)return;let x=(f.children??[]).filter(r),w=l.has(f.value);n.push({value:f.value,parent:i,depth:p.depth,disabled:p.disabled,hasChildren:x.length>0,expanded:w,posinset:y+1,setsize:u.length}),x.length>0&&w&&c(x,f.value)})};return c(e,null),n}import{jsx as ye}from"react/jsx-runtime";function xe(e,o){return(e.label??e.value).toLowerCase().includes(o.trim().toLowerCase())}function ve(e){return`${e} match${e===1?"":"es"} available`}var[ht,g]=dt("TreeSelect"),yt=new Set;function Re({children:e,collection:o,value:t,defaultValue:l,onValueChange:n,multiple:r=!1,checkStrategy:c="cascade",valueStrategy:s="all",expandedValue:i,defaultExpandedValue:u,onExpandedChange:f,open:y,defaultOpen:p=!1,onOpenChange:x,onOpenChangeComplete:w,inputValue:O,defaultInputValue:h="",onInputValueChange:_e,filter:re=xe,disabled:H=!1,readOnly:J=!1,closeOnSelect:ne=!r,getMatchCountLabel:ae=ve}){let Q=d.useRef(null),X=d.useRef(null),qe=d.useRef(null),[Ue,We]=d.useState(!1),[I,N]=d.useState(null),oe=d.useId(),Ye=d.useId(),Je=d.useId(),le=ft(),[Z=[],se]=q({prop:t,defaultProp:l??[],onChange:n}),[j=[],ce]=q({prop:i,defaultProp:u??[],onChange:f}),[S=!1,E]=q({prop:y,defaultProp:p,onChange:x});St(S,X,w);let[z="",Qe]=q({prop:O,defaultProp:h,onChange:_e}),{index:m,order:b}=d.useMemo(()=>fe(o),[o]),C=r&&c==="cascade",D=d.useMemo(()=>me(Z,m,b,C),[Z,m,b,C]),G=z.trim()!=="",{visible:L,autoExpanded:ee,matchCount:ie}=d.useMemo(()=>G?ge(m,b,a=>re(a,z)):{visible:null,autoExpanded:yt,matchCount:b.length},[G,m,b,re,z]),F=d.useMemo(()=>{if(ee.size===0)return j;let a=new Set(j);for(let v of ee)a.add(v);return[...a]},[j,ee]),K=d.useMemo(()=>new Set(F),[F]),Xe=d.useCallback(a=>L===null||L.has(a),[L]),k=d.useMemo(()=>he(o,m,L,K),[o,m,L,K]),$=d.useMemo(()=>new Map(k.map(a=>[a.value,a])),[k]),Ze=d.useCallback(a=>_(a,D,m,C),[D,m,C]),je=d.useMemo(()=>b.filter(a=>_(a,D,m,C)===!0),[b,D,m,C]),V=d.useCallback((a,v)=>{ce((T=[])=>v?T.includes(a)?T:[...T,a]:T.filter(R=>R!==a))},[ce]),et=d.useCallback(a=>{let v=new Set(a),T=a.find(A=>!K.has(A));if(T!==void 0){V(T,!0);return}let R=F.find(A=>!v.has(A));R!==void 0&&V(R,!1)},[K,F,V]),te=d.useCallback(a=>{if(H||J)return;let v=m.get(a);if(!v||v.disabled)return;let T=Te(a,D,m,C,r);se(Se(T,m,b,C?s:"all")),ne&&(E(!1),Q.current?.focus())},[H,J,m,D,C,r,b,s,se,ne,E]),[tt,rt]=d.useState(!1),[nt,at]=d.useState(k);(S!==tt||k!==nt)&&(rt(S),at(k),S?(I===null||$.get(I)?.disabled!==!1)&&N(k.find(a=>!a.disabled)?.value??null):N(null)),d.useEffect(()=>{!S||!G||pt(ae(ie))},[S,G,ie,ae]);let ot=d.useCallback(a=>`${oe}item-${a}`,[oe]),lt=d.useCallback(a=>m.get(a)?.node.label??a,[m]),P=d.useMemo(()=>k.filter(a=>!a.disabled),[k]),B=d.useRef(P);d.useEffect(()=>{B.current=P});let de=gt(d.useCallback(()=>B.current.map(a=>m.get(a.value)?.node.label??a.value),[m])),M=d.useCallback(a=>{if(P.length===0)return;if(a==="first"){N(P[0].value);return}if(a==="last"){N(P[P.length-1].value);return}let v=P.findIndex(T=>T.value===I);N(P[it(v+a,0,P.length-1)].value)},[P,I]),st=d.useCallback((a,v)=>{if(H)return;let T=ut(a.key,a.currentTarget,le),R=I===null?void 0:$.get(I);if(a.key==="Escape"){if(!S||X.current)return;a.preventDefault(),E(!1),Q.current?.focus();return}if(a.key==="Tab"){S&&E(!1);return}if(T==="ArrowDown"){a.preventDefault(),S?M(1):(E(!0),M("first"));return}if(T==="ArrowUp"){a.preventDefault(),S?M(-1):(E(!0),M("last"));return}if(T==="ArrowRight"){if(!S)return;a.preventDefault(),R?.hasChildren&&!R.expanded?V(R.value,!0):M(1);return}if(T==="ArrowLeft"){if(!S)return;a.preventDefault(),R?.hasChildren&&R.expanded?V(R.value,!1):R?.parent&&N(R.parent);return}if(a.key==="Home"||a.key==="End"){if(!S)return;a.preventDefault(),M(a.key==="Home"?"first":"last");return}if(a.key==="Enter"||a.key===" "&&v.selectOnSpace){if(a.preventDefault(),!S){E(!0);return}I!==null&&te(I);return}if(v.typeahead&&S&&Tt(a)){a.preventDefault();let A=B.current.findIndex(ct=>ct.value===I),ue=de(a.key,A);ue!==-1&&N(B.current[ue].value)}},[H,le,I,$,S,E,M,V,te,de]);return ye(mt,{children:ye(ht,{collection:o,index:m,order:b,value:Z,multiple:r,cascade:C,disabled:H,readOnly:J,checkStateOf:Ze,commit:te,open:S,onOpenChange:E,expandedIds:F,expanded:K,setExpanded:V,onTreeExpandedIdsChange:et,selectedIds:je,isVisible:Xe,flat:k,flatMap:$,activeValue:I,setActiveValue:N,itemId:ot,treeId:Ye,contentId:Je,triggerRef:Q,contentRef:X,inputRef:qe,hasInput:Ue,setHasInput:We,inputValue:z,onInputValueChange:Qe,getLabel:lt,onNavigationKeyDown:st,children:e})})}Re.displayName="TreeSelect";import*as Ce from"react";import{useComposedRefs as xt}from"../utils/composeRefs.js";import{skdxPart as vt}from"../utils/part.js";import{PopperAnchor as Rt}from"../utils/popper.js";import{composeEventHandlers as Ie,Primitive as It}from"../utils/primitive.js";import{jsx as be}from"react/jsx-runtime";var Pe=Ce.forwardRef((e,o)=>{let t=g("TreeSelectTrigger"),l=xt(o,t.triggerRef),n=t.disabled||e.disabled,r=t.open&&!t.hasInput?t.activeValue:null;return be(Rt,{asChild:!0,children:be(It.button,{type:"button",role:"combobox","aria-haspopup":"tree","aria-expanded":t.open,"aria-controls":t.treeId,"aria-activedescendant":r===null?void 0:t.itemId(r),"aria-readonly":t.readOnly?!0:void 0,"data-state":t.open?"open":"closed","data-disabled":n?"":void 0,"data-readonly":t.readOnly?"":void 0,"data-multiple":t.multiple?"":void 0,"data-placeholder":t.value.length===0?"":void 0,disabled:n,...e,...vt("tree-select","trigger",e.className),ref:l,onClick:Ie(e.onClick,()=>t.onOpenChange(!t.open)),onKeyDown:Ie(e.onKeyDown,c=>t.onNavigationKeyDown(c,{typeahead:!0,selectOnSpace:!0}))})})});Pe.displayName="TreeSelectTrigger";import*as ke from"react";import{skdxPart as bt}from"../utils/part.js";import{Primitive as Ct}from"../utils/primitive.js";import{jsx as Ee}from"react/jsx-runtime";var Ne=ke.forwardRef(({placeholder:e,children:o,...t},l)=>{let{value:n,multiple:r,getLabel:c}=g("TreeSelectValue"),s,i=!1;return o!==void 0?s=o:n.length===0?(s=e,i=!0):r?s=n.map(u=>Ee("span",{"data-chip":"","data-value":u,children:c(u)},u)):s=c(n[0]),Ee(Ct.span,{"data-multiple":r?"":void 0,"data-placeholder":i?"":void 0,...t,...bt("tree-select","value",t.className),ref:l,style:{pointerEvents:"none",...t.style},children:s})});Ne.displayName="TreeSelectValue";import{Portal as Pt}from"../utils/portal.js";import{jsx as Et}from"react/jsx-runtime";var we=({forceMount:e,children:o,...t})=>{let l=g("TreeSelectPortal");return e||l.open?Et(Pt,{...t,children:o}):null};we.displayName="TreeSelectPortal";import*as U from"react";import{useComposedRefs as kt}from"../utils/composeRefs.js";import{skdxPart as Nt}from"../utils/part.js";import{PopperContent as wt}from"../utils/popper.js";import{composeEventHandlers as Vt}from"../utils/primitive.js";import{useDismiss as Mt}from"../utils/useDismiss.js";import{jsx as Dt}from"react/jsx-runtime";var Ve=U.forwardRef(({forceMount:e,side:o="bottom",align:t="start",sideOffset:l=4,onEscapeKeyDown:n,onPointerDownOutside:r,onFocusOutside:c,onInteractOutside:s,...i},u)=>{let f=g("TreeSelectContent"),y=kt(u,f.contentRef),{open:p,onOpenChange:x,triggerRef:w,inputRef:O}=f;return Mt({enabled:p,onEscapeKeyDown:h=>{n?.(h),!h.defaultPrevented&&(x(!1),w.current?.focus())},onInteractOutside:s,onPointerDownOutside:h=>{r?.(h),h.defaultPrevented||x(!1)},onFocusOutside:h=>{c?.(h),h.defaultPrevented||x(!1)}},[f.contentRef,w]),U.useEffect(()=>{if(!p)return;let h=requestAnimationFrame(()=>O.current?.focus());return()=>cancelAnimationFrame(h)},[p,O]),e||p?Dt(wt,{component:"tree-select",id:f.contentId,"data-state":p?"open":"closed","data-multiple":f.multiple?"":void 0,side:o,align:t,sideOffset:l,...i,...Nt("tree-select","content",i.className),ref:y,onMouseDown:Vt(i.onMouseDown,h=>{h.target!==O.current&&h.preventDefault()})}):null});Ve.displayName="TreeSelectContent";import*as Le from"react";import{Tree as zt}from"../tree/Tree.js";import{TreeGroup as Gt}from"../tree/Tree.js";import{skdxPart as $t}from"../utils/part.js";import*as De from"react";import{TreeItem as Ot}from"../tree/Tree.js";import{createSafeContext as Ht}from"../utils/createContext.js";import{skdxPart as Lt}from"../utils/part.js";import{composeEventHandlers as Ft}from"../utils/primitive.js";import{jsx as Me}from"react/jsx-runtime";var[Kt,Oe]=Ht("TreeSelectItem");function At(e){return e.target.closest('[role="treeitem"]')!==e.currentTarget}var W=De.forwardRef(({node:e,children:o,...t},l)=>{let n=g("TreeSelectItem"),r=n.index.get(e.value),c=n.flatMap.get(e.value),s=n.checkStateOf(e.value),i=r?.disabled??e.disabled??!1,u=n.expanded.has(e.value),f=c?.hasChildren??!1,y=n.activeValue===e.value;return Me(Kt,{value:e.value,checkState:s,disabled:i,expanded:u,hasChildren:f,active:y,children:Me(Ot,{nodeId:e.value,disabled:i,id:n.itemId(e.value),"data-value":e.value,"data-highlighted":y?"":void 0,"aria-checked":n.multiple?s==="mixed"?"mixed":s:void 0,"data-checked":s==="mixed"?"indeterminate":s?"checked":"unchecked","aria-posinset":c?.posinset,"aria-setsize":c?.setsize,tabIndex:-1,...t,...Lt("tree-select","item",t.className),ref:l,onClick:Ft(t.onClick,p=>{At(p)||(p.preventDefault(),!i&&(n.setActiveValue(e.value),n.commit(e.value)))}),children:o})})});W.displayName="TreeSelectItem";import{jsx as He,jsxs as Bt}from"react/jsx-runtime";var Fe=Le.forwardRef(({renderLabel:e,...o},t)=>{let l=g("TreeSelectTree"),{isVisible:n}=l,r=c=>c.filter(s=>n(s.value)).map(s=>{let i=(s.children??[]).filter(u=>n(u.value));return Bt(W,{node:s,children:[e?e(s):s.label??s.value,i.length>0?He(Gt,{children:r(i)}):null]},s.value)});return He(zt,{id:l.treeId,selectionMode:l.multiple?"multiple":"single","aria-readonly":l.readOnly||void 0,expandedIds:l.expandedIds,onExpandedIdsChange:l.onTreeExpandedIdsChange,selectedIds:l.selectedIds,...o,...$t("tree-select","tree",o.className),ref:t,children:r(l.collection)})});Fe.displayName="TreeSelectTree";import*as Ke from"react";import{skdxPart as _t}from"../utils/part.js";import{Primitive as qt}from"../utils/primitive.js";import{jsx as Ut}from"react/jsx-runtime";var Ae=Ke.forwardRef(({forceMount:e,...o},t)=>{let l=Oe("TreeSelectItemIndicator"),{checkState:n}=l;return e||n!==!1?Ut(qt.span,{"aria-hidden":!0,"data-state":n==="mixed"?"indeterminate":n?"checked":"unchecked",...o,..._t("tree-select","item-indicator",o.className),ref:t}):null});Ae.displayName="TreeSelectItemIndicator";import*as ze from"react";import{skdxPart as Wt}from"../utils/part.js";import{Primitive as Yt}from"../utils/primitive.js";import{jsx as Jt}from"react/jsx-runtime";var Ge=ze.forwardRef((e,o)=>g("TreeSelectEmpty").flat.length===0?Jt(Yt.div,{role:"presentation",...e,...Wt("tree-select","empty",e.className),ref:o}):null);Ge.displayName="TreeSelectEmpty";import*as Y from"react";import{useComposedRefs as Qt}from"../utils/composeRefs.js";import{skdxPart as Xt}from"../utils/part.js";import{composeEventHandlers as $e,Primitive as Zt}from"../utils/primitive.js";import{jsx as jt}from"react/jsx-runtime";var Be=Y.forwardRef((e,o)=>{let t=g("TreeSelectInput"),l=Qt(o,t.inputRef),{setHasInput:n}=t;return Y.useEffect(()=>(n(!0),()=>n(!1)),[n]),jt(Zt.input,{type:"text",autoComplete:"off","aria-controls":t.treeId,"aria-activedescendant":t.activeValue===null?void 0:t.itemId(t.activeValue),"aria-readonly":t.readOnly?!0:void 0,"data-readonly":t.readOnly?"":void 0,disabled:t.disabled||void 0,...e,...Xt("tree-select","input",e.className),ref:l,value:t.inputValue,onChange:$e(e.onChange,r=>t.onInputValueChange(r.target.value)),onKeyDown:$e(e.onKeyDown,r=>t.onNavigationKeyDown(r,{typeahead:!1,selectOnSpace:!1}))})});Be.displayName="TreeSelectInput";export{Re as TreeSelect,Ve as TreeSelectContent,Ge as TreeSelectEmpty,Be as TreeSelectInput,W as TreeSelectItem,Ae as TreeSelectItemIndicator,we as TreeSelectPortal,Fe as TreeSelectTree,Pe as TreeSelectTrigger,Ne as TreeSelectValue,ve as defaultGetMatchCountLabel,xe as defaultTreeSelectFilter};

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

@@ -0,0 +1,34 @@
+import * as React from 'react';
+import type { TreeSelectContentProps } from './types.cjs';
+/**
+ * The popup panel for a {@link TreeSelect}, positioned relative to the trigger
+ * via floating-ui (see {@link TreeSelectContentProps}). Renders a plain
+ * `<div>` — the tree role lives on `TreeSelectTree` inside it, so the panel
+ * can also hold a `TreeSelectInput` and a `TreeSelectEmpty` without lying
+ * about its contents. Carries `data-state` and `data-side`/`data-align` from
+ * the popper, and exposes the popper's measurement custom properties under
+ * `--skdx-tree-select-*`.
+ *
+ * On open it moves real DOM focus to `TreeSelectInput` if one is mounted, and
+ * otherwise leaves it on the trigger — either way focus never enters the tree,
+ * which is navigated through `aria-activedescendant`. `mousedown` inside the
+ * panel is prevented (except on the input) so clicking a node cannot steal
+ * focus away from whichever element is holding it.
+ *
+ * Closes on Escape (returning focus to the trigger) or on an outside
+ * interaction — pointer-down outside or focus moving outside, each reported to
+ * `onPointerDownOutside`/`onFocusOutside` and, just before them and with the
+ * same event, to `onInteractOutside`. Any of those (or `onEscapeKeyDown`)
+ * calling `event.preventDefault()` keeps it open. Unmounts when closed unless
+ * `forceMount` is set.
+ *
+ * @example
+ * ```tsx
+ * <TreeSelectContent>
+ *   <TreeSelectInput placeholder="Filter…" />
+ *   <TreeSelectTree aria-label="Regions" />
+ *   <TreeSelectEmpty>No matches</TreeSelectEmpty>
+ * </TreeSelectContent>
+ * ```
+ */
+export declare const TreeSelectContent: React.ForwardRefExoticComponent<Omit<TreeSelectContentProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

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

@@ -0,0 +1,34 @@
+import * as React from 'react';
+import type { TreeSelectContentProps } from './types.js';
+/**
+ * The popup panel for a {@link TreeSelect}, positioned relative to the trigger
+ * via floating-ui (see {@link TreeSelectContentProps}). Renders a plain
+ * `<div>` — the tree role lives on `TreeSelectTree` inside it, so the panel
+ * can also hold a `TreeSelectInput` and a `TreeSelectEmpty` without lying
+ * about its contents. Carries `data-state` and `data-side`/`data-align` from
+ * the popper, and exposes the popper's measurement custom properties under
+ * `--skdx-tree-select-*`.
+ *
+ * On open it moves real DOM focus to `TreeSelectInput` if one is mounted, and
+ * otherwise leaves it on the trigger — either way focus never enters the tree,
+ * which is navigated through `aria-activedescendant`. `mousedown` inside the
+ * panel is prevented (except on the input) so clicking a node cannot steal
+ * focus away from whichever element is holding it.
+ *
+ * Closes on Escape (returning focus to the trigger) or on an outside
+ * interaction — pointer-down outside or focus moving outside, each reported to
+ * `onPointerDownOutside`/`onFocusOutside` and, just before them and with the
+ * same event, to `onInteractOutside`. Any of those (or `onEscapeKeyDown`)
+ * calling `event.preventDefault()` keeps it open. Unmounts when closed unless
+ * `forceMount` is set.
+ *
+ * @example
+ * ```tsx
+ * <TreeSelectContent>
+ *   <TreeSelectInput placeholder="Filter…" />
+ *   <TreeSelectTree aria-label="Regions" />
+ *   <TreeSelectEmpty>No matches</TreeSelectEmpty>
+ * </TreeSelectContent>
+ * ```
+ */
+export declare const TreeSelectContent: React.ForwardRefExoticComponent<Omit<TreeSelectContentProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

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

@@ -0,0 +1,18 @@
+import * as React from 'react';
+import type { TreeSelectEmptyProps } from './types.cjs';
+/**
+ * Fallback shown in place of the tree when nothing is left to show — because
+ * the filter matched no node, or because the `collection` itself is empty.
+ * Renders a `<div role="presentation">`; renders nothing while at least one
+ * node is visible.
+ *
+ * @example
+ * ```tsx
+ * <TreeSelectContent>
+ *   <TreeSelectInput placeholder="Filter…" />
+ *   <TreeSelectTree aria-label="Regions" />
+ *   <TreeSelectEmpty>No regions match</TreeSelectEmpty>
+ * </TreeSelectContent>
+ * ```
+ */
+export declare const TreeSelectEmpty: React.ForwardRefExoticComponent<Omit<TreeSelectEmptyProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

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

@@ -0,0 +1,18 @@
+import * as React from 'react';
+import type { TreeSelectEmptyProps } from './types.js';
+/**
+ * Fallback shown in place of the tree when nothing is left to show — because
+ * the filter matched no node, or because the `collection` itself is empty.
+ * Renders a `<div role="presentation">`; renders nothing while at least one
+ * node is visible.
+ *
+ * @example
+ * ```tsx
+ * <TreeSelectContent>
+ *   <TreeSelectInput placeholder="Filter…" />
+ *   <TreeSelectTree aria-label="Regions" />
+ *   <TreeSelectEmpty>No regions match</TreeSelectEmpty>
+ * </TreeSelectContent>
+ * ```
+ */
+export declare const TreeSelectEmpty: React.ForwardRefExoticComponent<Omit<TreeSelectEmptyProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

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

@@ -0,0 +1,26 @@
+import * as React from 'react';
+import type { TreeSelectInputProps } from './types.cjs';
+/**
+ * Optional filter field inside {@link TreeSelectContent}. Renders an
+ * `<input type="text">` that takes real DOM focus when the popup opens and
+ * keeps it for the whole interaction, carrying `aria-controls` pointing at the
+ * tree and `aria-activedescendant` naming the virtually-focused node — which
+ * is why the trigger drops its own `aria-activedescendant` as soon as one of
+ * these is mounted.
+ *
+ * It is a plain textbox rather than a second `role="combobox"`: the trigger
+ * already owns that role, and two comboboxes for one popup would be announced
+ * as two separate controls.
+ *
+ * Typing filters the tree. A match keeps its whole ancestor chain visible and
+ * expands it *transiently* — clearing the field restores exactly the expansion
+ * the user had before. Arrow keys, Home/End, Enter and Escape all behave as
+ * they do on the trigger; Space is left alone, because here it is a character
+ * the user is typing.
+ *
+ * @example
+ * ```tsx
+ * <TreeSelectInput placeholder="Filter regions…" aria-label="Filter regions" />
+ * ```
+ */
+export declare const TreeSelectInput: React.ForwardRefExoticComponent<Omit<TreeSelectInputProps, "ref"> & React.RefAttributes<HTMLInputElement>>;