@skdx/vue 0.27.0 → 0.29.0

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

@@ -1,102 +1,102 @@
-import { type TreeSelectCheckStrategy, type TreeSelectFilter, type TreeSelectNode, type TreeSelectValueStrategy } from './context.cjs';
+import { type TreeSelectCheckStrategy, type TreeSelectFilter, type TreeSelectNode, type TreeSelectRenderLabel, type TreeSelectValueStrategy } from './context.cjs';
 /**
- * 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 `SkdxTreeSelect*` part via provide/inject. Renders no DOM
- * of its own.
+ * Root of a tree select: a `role="combobox"` trigger whose popup is a tree, for picking from hierarchical data.
  *
- * Real DOM focus never enters the tree: it stays on the trigger, or on
- * `SkdxTreeSelectInput` 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"` 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.
- *
- * Emits `open-change` the instant the state flips and `open-change-complete`
- * once the change has finished on screen — after `SkdxTreeSelectContent`'s enter
- * or exit animation ends, or in the same task when it declares none.
- *
- * Works controlled (`v-model:value`, `v-model:expanded-value`, `v-model:open`,
- * `v-model:input-value`) or uncontrolled (`default-value`,
- * `default-expanded-value`, `default-open`, `default-input-value`).
+ * @example
+ * ```vue
+ * <SkdxTreeSelect :collection="[{ value: 'src', label: 'src', children: [...] }]" />
+ * ```
  */
 type __VLS_Props = {
-    /**
-     * The hierarchical data the popup's tree is built from. Node `value`s must
-     * be unique across the whole collection — every event, `value` entry and
-     * DOM id is keyed by them.
-     */
+    /** Hierarchical data the tree is built from; node values must be unique across the whole collection. */
     collection: readonly TreeSelectNode[];
-    /**
-     * Checked node values, for controlled usage — always an array, whether or
-     * not `multiple`, and always in the shape `valueStrategy` describes. Pair
-     * with `v-model:value` or `@value-change`.
-     */
-    value?: string[];
-    /** Initially checked node values, for uncontrolled usage. Same shape as `value`. */
+    /** Controlled checked node values, always in the shape `valueStrategy` describes. */
+    value?: string[] | undefined;
+    /** Initially checked node values, for uncontrolled usage. */
     defaultValue?: string[];
-    /**
-     * Allows more than one node to be checked: the tree gets
-     * `aria-multiselectable`, activating a node toggles it rather than
-     * replacing the selection, and `checkStrategy` starts to mean something.
-     */
+    /** Allows more than one node to be checked; tree gets `aria-multiselectable` and `checkStrategy` becomes meaningful. */
     multiple?: boolean;
-    /** Whether checking a node propagates through its subtree. Ignored unless `multiple`. */
+    /** Whether and in which direction checking propagates; see TreeSelectCheckStrategy. Ignored unless `multiple`. */
     checkStrategy?: TreeSelectCheckStrategy;
-    /** Which checked nodes appear in the emitted `value`. Ignored under `check-strategy="independent"`. */
+    /** Which checked nodes appear in the emitted `value`; see TreeSelectValueStrategy. Ignored where `check-strategy` lacks the direction to rebuild. */
     valueStrategy?: TreeSelectValueStrategy;
+    /** Controlled expanded node ids, paired with `v-model:expanded`; while filtering, ancestors of every match are expanded on top of this value. */
+    expanded?: string[] | undefined;
+    /** Initially expanded node values, for uncontrolled usage. */
+    defaultExpanded?: string[];
     /**
-     * Expanded node values, for controlled usage. Pair with
-     * `v-model:expanded-value` or `@expanded-change`. While filtering, the
-     * ancestors of every match are expanded *on top of* this value without
-     * being written back to it.
+     * How the popup presents the hierarchy: one indented tree, or one tree per open level side by side.
+     * @default 'tree' — `'columns'` still draws as a tree while a filter narrows the popup.
      */
-    expandedValue?: string[];
-    /** Initially expanded node values, for uncontrolled usage. Every branch starts collapsed. */
-    defaultExpandedValue?: string[];
-    /** Whether the popup is open, for controlled usage. Pair with `v-model:open` or `@open-change`. */
-    open?: boolean;
+    layout?: 'tree' | 'columns';
+    /** Whether the popup is open, for controlled usage. Pair with `v-model:open`. */
+    open?: boolean | undefined;
     /** Initial open state, for uncontrolled usage. */
     defaultOpen?: boolean;
-    /** The `SkdxTreeSelectInput`'s filter text, for controlled usage. Pair with `v-model:input-value`. */
-    inputValue?: string;
+    /** The filter text for the input, for controlled usage. Pair with `v-model:input-value`. */
+    inputValue?: string | undefined;
     /** Initial filter text, for uncontrolled usage — unfiltered. */
     defaultInputValue?: string;
-    /**
-     * Decides whether a node matches the filter text. A match keeps its whole
-     * ancestor chain visible (a matched leaf under a hidden parent would be
-     * unreachable) and its whole subtree visible.
-     */
+    /** Decides whether a node matches the filter; matches keep their ancestor chain and subtree visible. */
     filter?: TreeSelectFilter;
+    /** Loads a node's children the first time it expands, for non-materialized collection. Mark branches with `hasChildren`; does not run while filtering. */
+    loadChildren?: ((nodeValue: string) => void | Promise<void>) | undefined;
+    /** Blocks the whole control — the trigger is a disabled `<button>` and no key changes anything. */
+    disabled?: boolean;
     /**
-     * Blocks the whole control: the trigger is a disabled `<button>`, the popup
-     * cannot open, and no key changes anything.
+     * Form field name; each selected value submits as its own entry, like a native `<select multiple>`.
+     * @default undefined — the control submits nothing, like a nameless native input.
      */
-    disabled?: boolean;
+    name?: string;
     /**
-     * Lets the user open, navigate and read the tree but never change the
-     * value — unlike `disabled`, which also removes it from the tab order.
+     * Id of the `<form>` the submitted entries belong to, for a TreeSelect that isn't a DOM descendant of it.
+     * @default undefined — the entries belong to the nearest ancestor form.
      */
+    form?: string;
+    /** Lets the user open, navigate and read the tree but never change the value. */
     readOnly?: boolean;
     /**
-     * Closes the popup as soon as a node is checked, returning focus to the
-     * trigger.
+     * Closes the popup as soon as a node is checked, returning focus to the trigger.
      * @default !multiple — a single-select answer is complete on the first pick; a multi-select one is not.
      */
-    closeOnSelect?: boolean;
+    closeOnSelect?: boolean | undefined;
+    /** Formats the message announced when the number of filter matches changes while open. */
+    getMatchCountLabel?: (count: number) => string;
     /**
-     * Formats the message announced (through the shared live announcer) each
-     * time the number of filter matches changes while the popup is open —
-     * filtering is silent for screen-reader users otherwise. Return an empty
-     * string to announce nothing.
+     * Supplies the label for a value whose node is not in `collection`.
+     * @default undefined
      */
-    getMatchCountLabel?: (count: number) => string;
+    getValueLabel?: ((value: string) => string) | undefined;
+    /**
+     * Whether clicking a branch row also toggles its expansion, vs. leaving that to the chevron alone.
+     * @default false
+     */
+    expandOnClick?: boolean;
+    /**
+     * Stand-in content the derived trigger shows while nothing is checked.
+     * @default undefined — the trigger renders nothing while empty.
+     */
+    placeholder?: string | undefined;
+    /**
+     * The derived panel's empty-state message, shown when no node matches the filter.
+     * @default 'No matches'
+     */
+    emptyMessage?: string;
+    /**
+     * Renders a node's content in the derived tree: the label and anything beside it, such as a checkmark.
+     * @default undefined — renders the node's `label ?? value` plus a checkmark indicator.
+     */
+    renderNode?: TreeSelectRenderLabel | undefined;
+    /**
+     * Accessible name for the derived Trigger, Tree and filter Input, none of which takes a name from content.
+     * @default undefined — falls back to `placeholder`, and with neither the Trigger is unnamed.
+     */
+    ariaLabel?: string | undefined;
+    /**
+     * Size rung the skin renders the panel at, applied to the derived Content part.
+     * @default undefined — falls back to a `data-size` attribute.
+     */
+    size?: 'sm' | 'lg' | (string & {}) | undefined;
 };
 declare var __VLS_5: {};
 type __VLS_Slots = {} & {
@@ -110,34 +110,39 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}
     "open-change-complete": (open: boolean) => any;
     "update:inputValue": (inputValue: string) => any;
     "input-value-change": (inputValue: string) => any;
-    "update:expandedValue": (expandedValue: string[]) => any;
-    "expanded-change": (expandedValue: string[]) => any;
+    "update:expanded": (expanded: string[]) => any;
+    "expanded-change": (expanded: string[]) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onUpdate:open"?: ((open: boolean) => any) | undefined;
-    "onOpen-change"?: ((open: boolean) => any) | undefined;
-    "onUpdate:value"?: ((value: string[]) => any) | undefined;
-    "onValue-change"?: ((value: string[]) => any) | undefined;
-    "onOpen-change-complete"?: ((open: boolean) => any) | undefined;
-    "onUpdate:inputValue"?: ((inputValue: string) => any) | undefined;
-    "onInput-value-change"?: ((inputValue: string) => any) | undefined;
-    "onUpdate:expandedValue"?: ((expandedValue: string[]) => any) | undefined;
-    "onExpanded-change"?: ((expandedValue: string[]) => any) | undefined;
+    "onUpdate:open"?: (open: boolean) => any;
+    "onOpen-change"?: (open: boolean) => any;
+    "onUpdate:value"?: (value: string[]) => any;
+    "onValue-change"?: (value: string[]) => any;
+    "onOpen-change-complete"?: (open: boolean) => any;
+    "onUpdate:inputValue"?: (inputValue: string) => any;
+    "onInput-value-change"?: (inputValue: string) => any;
+    "onUpdate:expanded"?: (expanded: string[]) => any;
+    "onExpanded-change"?: (expanded: string[]) => any;
 }>, {
-    disabled: boolean;
     filter: TreeSelectFilter;
-    open: boolean;
+    disabled: boolean;
+    size: "sm" | "lg" | (string & {}) | undefined;
+    open: boolean | undefined;
     defaultOpen: boolean;
-    value: string[];
     defaultValue: string[];
     multiple: boolean;
     readOnly: boolean;
-    inputValue: string;
+    value: string[] | undefined;
+    inputValue: string | undefined;
     defaultInputValue: string;
-    closeOnSelect: boolean;
+    closeOnSelect: boolean | undefined;
+    layout: "tree" | "columns";
+    expanded: string[] | undefined;
+    loadChildren: ((nodeValue: string) => void | Promise<void>) | undefined;
+    expandOnClick: boolean;
+    emptyMessage: string;
     checkStrategy: TreeSelectCheckStrategy;
     valueStrategy: TreeSelectValueStrategy;
-    expandedValue: string[];
-    defaultExpandedValue: string[];
+    defaultExpanded: string[];
     getMatchCountLabel: (count: number) => string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;

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

@@ -1,102 +1,102 @@
-import { type TreeSelectCheckStrategy, type TreeSelectFilter, type TreeSelectNode, type TreeSelectValueStrategy } from './context.js';
+import { type TreeSelectCheckStrategy, type TreeSelectFilter, type TreeSelectNode, type TreeSelectRenderLabel, type TreeSelectValueStrategy } from './context.js';
 /**
- * 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 `SkdxTreeSelect*` part via provide/inject. Renders no DOM
- * of its own.
+ * Root of a tree select: a `role="combobox"` trigger whose popup is a tree, for picking from hierarchical data.
  *
- * Real DOM focus never enters the tree: it stays on the trigger, or on
- * `SkdxTreeSelectInput` 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"` 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.
- *
- * Emits `open-change` the instant the state flips and `open-change-complete`
- * once the change has finished on screen — after `SkdxTreeSelectContent`'s enter
- * or exit animation ends, or in the same task when it declares none.
- *
- * Works controlled (`v-model:value`, `v-model:expanded-value`, `v-model:open`,
- * `v-model:input-value`) or uncontrolled (`default-value`,
- * `default-expanded-value`, `default-open`, `default-input-value`).
+ * @example
+ * ```vue
+ * <SkdxTreeSelect :collection="[{ value: 'src', label: 'src', children: [...] }]" />
+ * ```
  */
 type __VLS_Props = {
-    /**
-     * The hierarchical data the popup's tree is built from. Node `value`s must
-     * be unique across the whole collection — every event, `value` entry and
-     * DOM id is keyed by them.
-     */
+    /** Hierarchical data the tree is built from; node values must be unique across the whole collection. */
     collection: readonly TreeSelectNode[];
-    /**
-     * Checked node values, for controlled usage — always an array, whether or
-     * not `multiple`, and always in the shape `valueStrategy` describes. Pair
-     * with `v-model:value` or `@value-change`.
-     */
-    value?: string[];
-    /** Initially checked node values, for uncontrolled usage. Same shape as `value`. */
+    /** Controlled checked node values, always in the shape `valueStrategy` describes. */
+    value?: string[] | undefined;
+    /** Initially checked node values, for uncontrolled usage. */
     defaultValue?: string[];
-    /**
-     * Allows more than one node to be checked: the tree gets
-     * `aria-multiselectable`, activating a node toggles it rather than
-     * replacing the selection, and `checkStrategy` starts to mean something.
-     */
+    /** Allows more than one node to be checked; tree gets `aria-multiselectable` and `checkStrategy` becomes meaningful. */
     multiple?: boolean;
-    /** Whether checking a node propagates through its subtree. Ignored unless `multiple`. */
+    /** Whether and in which direction checking propagates; see TreeSelectCheckStrategy. Ignored unless `multiple`. */
     checkStrategy?: TreeSelectCheckStrategy;
-    /** Which checked nodes appear in the emitted `value`. Ignored under `check-strategy="independent"`. */
+    /** Which checked nodes appear in the emitted `value`; see TreeSelectValueStrategy. Ignored where `check-strategy` lacks the direction to rebuild. */
     valueStrategy?: TreeSelectValueStrategy;
+    /** Controlled expanded node ids, paired with `v-model:expanded`; while filtering, ancestors of every match are expanded on top of this value. */
+    expanded?: string[] | undefined;
+    /** Initially expanded node values, for uncontrolled usage. */
+    defaultExpanded?: string[];
     /**
-     * Expanded node values, for controlled usage. Pair with
-     * `v-model:expanded-value` or `@expanded-change`. While filtering, the
-     * ancestors of every match are expanded *on top of* this value without
-     * being written back to it.
+     * How the popup presents the hierarchy: one indented tree, or one tree per open level side by side.
+     * @default 'tree' — `'columns'` still draws as a tree while a filter narrows the popup.
      */
-    expandedValue?: string[];
-    /** Initially expanded node values, for uncontrolled usage. Every branch starts collapsed. */
-    defaultExpandedValue?: string[];
-    /** Whether the popup is open, for controlled usage. Pair with `v-model:open` or `@open-change`. */
-    open?: boolean;
+    layout?: 'tree' | 'columns';
+    /** Whether the popup is open, for controlled usage. Pair with `v-model:open`. */
+    open?: boolean | undefined;
     /** Initial open state, for uncontrolled usage. */
     defaultOpen?: boolean;
-    /** The `SkdxTreeSelectInput`'s filter text, for controlled usage. Pair with `v-model:input-value`. */
-    inputValue?: string;
+    /** The filter text for the input, for controlled usage. Pair with `v-model:input-value`. */
+    inputValue?: string | undefined;
     /** Initial filter text, for uncontrolled usage — unfiltered. */
     defaultInputValue?: string;
-    /**
-     * Decides whether a node matches the filter text. A match keeps its whole
-     * ancestor chain visible (a matched leaf under a hidden parent would be
-     * unreachable) and its whole subtree visible.
-     */
+    /** Decides whether a node matches the filter; matches keep their ancestor chain and subtree visible. */
     filter?: TreeSelectFilter;
+    /** Loads a node's children the first time it expands, for non-materialized collection. Mark branches with `hasChildren`; does not run while filtering. */
+    loadChildren?: ((nodeValue: string) => void | Promise<void>) | undefined;
+    /** Blocks the whole control — the trigger is a disabled `<button>` and no key changes anything. */
+    disabled?: boolean;
     /**
-     * Blocks the whole control: the trigger is a disabled `<button>`, the popup
-     * cannot open, and no key changes anything.
+     * Form field name; each selected value submits as its own entry, like a native `<select multiple>`.
+     * @default undefined — the control submits nothing, like a nameless native input.
      */
-    disabled?: boolean;
+    name?: string;
     /**
-     * Lets the user open, navigate and read the tree but never change the
-     * value — unlike `disabled`, which also removes it from the tab order.
+     * Id of the `<form>` the submitted entries belong to, for a TreeSelect that isn't a DOM descendant of it.
+     * @default undefined — the entries belong to the nearest ancestor form.
      */
+    form?: string;
+    /** Lets the user open, navigate and read the tree but never change the value. */
     readOnly?: boolean;
     /**
-     * Closes the popup as soon as a node is checked, returning focus to the
-     * trigger.
+     * Closes the popup as soon as a node is checked, returning focus to the trigger.
      * @default !multiple — a single-select answer is complete on the first pick; a multi-select one is not.
      */
-    closeOnSelect?: boolean;
+    closeOnSelect?: boolean | undefined;
+    /** Formats the message announced when the number of filter matches changes while open. */
+    getMatchCountLabel?: (count: number) => string;
     /**
-     * Formats the message announced (through the shared live announcer) each
-     * time the number of filter matches changes while the popup is open —
-     * filtering is silent for screen-reader users otherwise. Return an empty
-     * string to announce nothing.
+     * Supplies the label for a value whose node is not in `collection`.
+     * @default undefined
      */
-    getMatchCountLabel?: (count: number) => string;
+    getValueLabel?: ((value: string) => string) | undefined;
+    /**
+     * Whether clicking a branch row also toggles its expansion, vs. leaving that to the chevron alone.
+     * @default false
+     */
+    expandOnClick?: boolean;
+    /**
+     * Stand-in content the derived trigger shows while nothing is checked.
+     * @default undefined — the trigger renders nothing while empty.
+     */
+    placeholder?: string | undefined;
+    /**
+     * The derived panel's empty-state message, shown when no node matches the filter.
+     * @default 'No matches'
+     */
+    emptyMessage?: string;
+    /**
+     * Renders a node's content in the derived tree: the label and anything beside it, such as a checkmark.
+     * @default undefined — renders the node's `label ?? value` plus a checkmark indicator.
+     */
+    renderNode?: TreeSelectRenderLabel | undefined;
+    /**
+     * Accessible name for the derived Trigger, Tree and filter Input, none of which takes a name from content.
+     * @default undefined — falls back to `placeholder`, and with neither the Trigger is unnamed.
+     */
+    ariaLabel?: string | undefined;
+    /**
+     * Size rung the skin renders the panel at, applied to the derived Content part.
+     * @default undefined — falls back to a `data-size` attribute.
+     */
+    size?: 'sm' | 'lg' | (string & {}) | undefined;
 };
 declare var __VLS_5: {};
 type __VLS_Slots = {} & {
@@ -110,34 +110,39 @@ declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}
     "open-change-complete": (open: boolean) => any;
     "update:inputValue": (inputValue: string) => any;
     "input-value-change": (inputValue: string) => any;
-    "update:expandedValue": (expandedValue: string[]) => any;
-    "expanded-change": (expandedValue: string[]) => any;
+    "update:expanded": (expanded: string[]) => any;
+    "expanded-change": (expanded: string[]) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onUpdate:open"?: ((open: boolean) => any) | undefined;
-    "onOpen-change"?: ((open: boolean) => any) | undefined;
-    "onUpdate:value"?: ((value: string[]) => any) | undefined;
-    "onValue-change"?: ((value: string[]) => any) | undefined;
-    "onOpen-change-complete"?: ((open: boolean) => any) | undefined;
-    "onUpdate:inputValue"?: ((inputValue: string) => any) | undefined;
-    "onInput-value-change"?: ((inputValue: string) => any) | undefined;
-    "onUpdate:expandedValue"?: ((expandedValue: string[]) => any) | undefined;
-    "onExpanded-change"?: ((expandedValue: string[]) => any) | undefined;
+    "onUpdate:open"?: (open: boolean) => any;
+    "onOpen-change"?: (open: boolean) => any;
+    "onUpdate:value"?: (value: string[]) => any;
+    "onValue-change"?: (value: string[]) => any;
+    "onOpen-change-complete"?: (open: boolean) => any;
+    "onUpdate:inputValue"?: (inputValue: string) => any;
+    "onInput-value-change"?: (inputValue: string) => any;
+    "onUpdate:expanded"?: (expanded: string[]) => any;
+    "onExpanded-change"?: (expanded: string[]) => any;
 }>, {
-    disabled: boolean;
     filter: TreeSelectFilter;
-    open: boolean;
+    disabled: boolean;
+    size: "sm" | "lg" | (string & {}) | undefined;
+    open: boolean | undefined;
     defaultOpen: boolean;
-    value: string[];
     defaultValue: string[];
     multiple: boolean;
     readOnly: boolean;
-    inputValue: string;
+    value: string[] | undefined;
+    inputValue: string | undefined;
     defaultInputValue: string;
-    closeOnSelect: boolean;
+    closeOnSelect: boolean | undefined;
+    layout: "tree" | "columns";
+    expanded: string[] | undefined;
+    loadChildren: ((nodeValue: string) => void | Promise<void>) | undefined;
+    expandOnClick: boolean;
+    emptyMessage: string;
     checkStrategy: TreeSelectCheckStrategy;
     valueStrategy: TreeSelectValueStrategy;
-    expandedValue: string[];
-    defaultExpandedValue: string[];
+    defaultExpanded: string[];
     getMatchCountLabel: (count: number) => string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;

package/dist/tree-select/TreeSelect.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const P=require("../utils/direction.cjs"),ie=require("../utils/useOpenChangeComplete.cjs"),$=require("../utils/useTypeahead.cjs"),de=require("../utils/clamp.cjs"),fe=require("../utils/liveAnnouncer.cjs"),se=require("../utils/PopperRoot.vue.cjs"),d=require("./collection.cjs"),g=require("./context.cjs");let t=require("vue");var pe=(0,t.defineComponent)({inheritAttrs:!1,__name:"TreeSelect",props:{collection:{},value:{default:void 0},defaultValue:{default:()=>[]},multiple:{type:Boolean,default:!1},checkStrategy:{default:"cascade"},valueStrategy:{default:"all"},expandedValue:{default:void 0},defaultExpandedValue:{default:()=>[]},open:{type:Boolean,default:void 0},defaultOpen:{type:Boolean,default:!1},inputValue:{default:void 0},defaultInputValue:{default:""},filter:{type:Function,default:g.defaultTreeSelectFilter},disabled:{type:Boolean,default:!1},readOnly:{type:Boolean,default:!1},closeOnSelect:{type:Boolean,default:void 0},getMatchCountLabel:{type:Function,default:g.defaultGetMatchCountLabel}},emits:["update:value","value-change","update:expandedValue","expanded-change","update:open","open-change","update:inputValue","input-value-change","open-change-complete"],setup(z,{emit:N}){const u=z,i=N,j=new Set,w=(0,t.ref)(null),C=(0,t.ref)(null),G=(0,t.ref)(null),D=(0,t.ref)(!1),a=(0,t.ref)(null),U=g.nextTreeSelectId("item"),X=g.nextTreeSelectId("tree"),Y=g.nextTreeSelectId("content"),J=P.useDirection(),B=(0,t.ref)(u.defaultValue),x=(0,t.computed)(()=>u.value??B.value),A=(0,t.ref)(u.defaultExpandedValue),S=(0,t.computed)(()=>u.expandedValue??A.value),L=(0,t.ref)(u.defaultOpen),n=(0,t.computed)(()=>u.open??L.value),M=(0,t.ref)(u.defaultInputValue),V=(0,t.computed)(()=>u.inputValue??M.value);ie.useOpenChangeComplete(n,C,e=>i("open-change-complete",e));function Q(e){e!==x.value&&(u.value===void 0&&(B.value=e),i("update:value",e),i("value-change",e))}function W(e){e!==S.value&&(u.expandedValue===void 0&&(A.value=e),i("update:expandedValue",e),i("expanded-change",e))}function f(e){e!==n.value&&(u.open===void 0&&(L.value=e),i("update:open",e),i("open-change",e))}function Z(e){e!==V.value&&(u.inputValue===void 0&&(M.value=e),i("update:inputValue",e),i("input-value-change",e))}const R=(0,t.computed)(()=>d.indexCollection(u.collection)),c=(0,t.computed)(()=>R.value.index),p=(0,t.computed)(()=>R.value.order),v=(0,t.computed)(()=>u.multiple&&u.checkStrategy==="cascade"),k=(0,t.computed)(()=>d.normalizeChecked(x.value,c.value,p.value,v.value)),T=(0,t.computed)(()=>V.value.trim()!==""),m=(0,t.computed)(()=>T.value?d.computeFilter(c.value,p.value,e=>u.filter(e,V.value)):{visible:null,autoExpanded:j,matchCount:p.value.length}),E=(0,t.computed)(()=>{const e=m.value.autoExpanded;if(e.size===0)return S.value;const l=new Set(S.value);for(const r of e)l.add(r);return[...l]}),O=(0,t.computed)(()=>new Set(E.value)),y=(0,t.computed)(()=>d.flattenVisible(u.collection,c.value,m.value.visible,O.value)),I=(0,t.computed)(()=>new Map(y.value.map(e=>[e.value,e]))),ee=(0,t.computed)(()=>p.value.filter(e=>d.checkStateOf(e,k.value,c.value,v.value)===!0)),F=(0,t.computed)(()=>y.value.filter(e=>!e.disabled)),te=(0,t.computed)(()=>u.closeOnSelect??!u.multiple);function b(e,l){const r=S.value;W(l?r.includes(e)?r:[...r,e]:r.filter(o=>o!==e))}function ue(e){const l=new Set(e),r=e.find(s=>!O.value.has(s));if(r!==void 0){b(r,!0);return}const o=E.value.find(s=>!l.has(s));o!==void 0&&b(o,!1)}function q(){w.value?.focus()}function H(e){if(u.disabled||u.readOnly)return;const l=c.value.get(e);!l||l.disabled||(Q(d.projectValue(d.toggleChecked(e,k.value,c.value,v.value,u.multiple),c.value,p.value,v.value?u.valueStrategy:"all")),te.value&&(f(!1),q()))}(0,t.watch)(n,e=>{e||(a.value=null)}),(0,t.watch)([n,a,y],()=>{n.value&&(a.value!==null&&I.value.get(a.value)?.disabled===!1||(a.value=y.value.find(e=>!e.disabled)?.value??null))},{flush:"post",immediate:!0}),(0,t.watch)([n,T,()=>m.value.matchCount],()=>{!n.value||!T.value||fe.announce(u.getMatchCountLabel(m.value.matchCount))},{immediate:!0});function le(e){return`${U}-${e}`}function ae(e){return c.value.get(e)?.node.label??e}const ne=$.useTypeahead();function h(e){const l=F.value;if(l.length===0)return;if(e==="first"){a.value=l[0].value;return}if(e==="last"){a.value=l[l.length-1].value;return}const r=l.findIndex(o=>o.value===a.value);a.value=l[de.clamp(r+e,0,l.length-1)].value}function re(e,l){if(u.disabled)return;const r=P.directionalKey(e.key,e.currentTarget,J()),o=a.value===null?void 0:I.value.get(a.value);if(e.key==="Escape"){if(!n.value||C.value)return;e.preventDefault(),f(!1),q();return}if(e.key==="Tab"){n.value&&f(!1);return}if(r==="ArrowDown"){e.preventDefault(),n.value?h(1):(f(!0),h("first"));return}if(r==="ArrowUp"){e.preventDefault(),n.value?h(-1):(f(!0),h("last"));return}if(r==="ArrowRight"){if(!n.value)return;e.preventDefault(),o?.hasChildren&&!o.expanded?b(o.value,!0):h(1);return}if(r==="ArrowLeft"){if(!n.value)return;e.preventDefault(),o?.hasChildren&&o.expanded?b(o.value,!1):o?.parent&&(a.value=o.parent);return}if(e.key==="Home"||e.key==="End"){if(!n.value)return;e.preventDefault(),h(e.key==="Home"?"first":"last");return}if(e.key==="Enter"||e.key===" "&&l.selectOnSpace){if(e.preventDefault(),!n.value){f(!0);return}a.value!==null&&H(a.value);return}if(l.typeahead&&n.value&&$.isTypeaheadKey(e)){e.preventDefault();const s=F.value,oe=s.findIndex(_=>_.value===a.value),ce=s.map(_=>c.value.get(_.value)?.node.label??_.value),K=ne(e.key,ce,oe);K!==-1&&(a.value=s[K].value)}}return(0,t.provide)(g.TREE_SELECT_CONTEXT,{collection:(0,t.computed)(()=>u.collection),index:c,order:p,value:x,get multiple(){return u.multiple},cascade:v,get disabled(){return u.disabled},get readOnly(){return u.readOnly},checkStateOf:e=>d.checkStateOf(e,k.value,c.value,v.value),commit:H,open:n,onOpenChange:f,expandedIds:E,expanded:O,setExpanded:b,onTreeExpandedIdsChange:ue,selectedIds:ee,isVisible:e=>m.value.visible===null||m.value.visible.has(e),flat:y,flatMap:I,activeValue:a,setActiveValue:e=>{a.value=e},itemId:le,treeId:X,contentId:Y,triggerRef:w,contentRef:C,inputRef:G,hasInput:D,setHasInput:e=>{D.value=e},inputValue:V,onInputValueChange:Z,getLabel:ae,focusTrigger:q,onNavigationKeyDown:re}),(e,l)=>((0,t.openBlock)(),(0,t.createBlock)(se.default,null,{default:(0,t.withCtx)(()=>[(0,t.renderSlot)(e.$slots,"default")]),_:3}))}});exports.default=pe;
+const ze=require("../utils/liveAnnouncer.cjs"),ne=require("../utils/direction.cjs"),Me=require("../utils/typeahead.cjs"),Fe=require("../utils/useOpenChangeComplete.cjs"),Ke=require("../utils/useTypeahead.cjs"),Ne=require("../utils/mirroredValues.cjs"),Pe=require("../utils/PopperRoot.vue.cjs"),$e=require("../utils/clamp.cjs"),B=require("../utils/tree-columns.cjs"),m=require("./collection.cjs"),I=require("./context.cjs"),He=require("./TreeSelectAnatomy.vue.cjs");let l=require("vue");var je=["name","^value","disabled","form"],Ge=(0,l.defineComponent)({inheritAttrs:!1,__name:"TreeSelect",props:{collection:{},value:{default:void 0},defaultValue:{default:()=>[]},multiple:{type:Boolean,default:!1},checkStrategy:{default:"cascade"},valueStrategy:{default:"all"},expanded:{default:void 0},defaultExpanded:{default:()=>[]},layout:{default:"tree"},open:{type:Boolean,default:void 0},defaultOpen:{type:Boolean,default:!1},inputValue:{default:void 0},defaultInputValue:{default:""},filter:{type:Function,default:I.defaultTreeSelectFilter},loadChildren:{type:Function,default:void 0},disabled:{type:Boolean,default:!1},name:{},form:{},readOnly:{type:Boolean,default:!1},closeOnSelect:{type:Boolean,default:void 0},getMatchCountLabel:{type:Function,default:I.defaultGetMatchCountLabel},getValueLabel:{},expandOnClick:{type:Boolean,default:!1},placeholder:{},emptyMessage:{default:"No matches"},renderNode:{},ariaLabel:{},size:{default:void 0}},emits:["update:value","value-change","update:expanded","expanded-change","update:open","open-change","update:inputValue","input-value-change","open-change-complete"],setup(f,{emit:re}){const a=f,P=(0,l.useAttrs)(),oe=(0,l.computed)(()=>a.size??P["data-size"]),ie=(0,l.computed)(()=>{const{"data-size":e,...t}=P;return t}),v=re,ce=new Set,$=(0,l.ref)(null),T=(0,l.ref)(null),de=(0,l.ref)(null),H=(0,l.ref)(!1),r=(0,l.ref)(null),h=(0,l.ref)(null),se=I.nextTreeSelectId("item"),A=I.nextTreeSelectId("tree"),fe=ne.useDirection(),j=(0,l.ref)(a.defaultValue),b=(0,l.computed)(()=>a.value??j.value),G=(0,l.ref)(a.defaultExpanded),S=(0,l.computed)(()=>a.expanded??G.value),U=(0,l.ref)(a.defaultOpen),o=(0,l.computed)(()=>a.open??U.value),X=(0,l.ref)(a.defaultInputValue),O=(0,l.computed)(()=>a.inputValue??X.value);Fe.useOpenChangeComplete(o,T,e=>v("open-change-complete",e));function ve(e){e!==b.value&&(a.value===void 0&&(j.value=e),v("update:value",e),v("value-change",e))}function pe(e){e!==S.value&&(a.expanded===void 0&&(G.value=e),v("update:expanded",e),v("expanded-change",e))}function w(e){e!==o.value&&(a.open===void 0&&(U.value=e),v("update:open",e),v("open-change",e))}function me(e){e!==O.value&&(a.inputValue===void 0&&(X.value=e),v("update:inputValue",e),v("input-value-change",e))}const Y=(0,l.computed)(()=>m.indexCollection(a.collection)),i=(0,l.computed)(()=>Y.value.index),q=(0,l.computed)(()=>Y.value.order),k=(0,l.computed)(()=>a.multiple?a.checkStrategy:"independent"),he=(0,l.computed)(()=>k.value!=="independent"),J=(0,l.computed)(()=>m.normalizeChecked(b.value,i.value,q.value,k.value)),L=(0,l.computed)(()=>O.value.trim()!==""),x=(0,l.computed)(()=>L.value?m.computeFilter(i.value,q.value,e=>a.filter(e,O.value)):{visible:null,autoExpanded:ce,matchCount:q.value.length}),Q=(0,l.computed)(()=>a.layout==="columns"&&!L.value?"columns":"tree"),c=(0,l.computed)(()=>Q.value==="columns"),s=(0,l.computed)(()=>c.value?B.treeColumns(a.collection,S.value):[]),W=(0,l.computed)(()=>new Set(s.value.slice(1).map(e=>e.parent))),D=(0,l.computed)(()=>{const e=x.value.autoExpanded;if(e.size===0)return S.value;const t=new Set(S.value);for(const u of e)t.add(u);return[...t]}),R=(0,l.computed)(()=>c.value?W.value:new Set(D.value)),C=(0,l.computed)(()=>m.flattenVisible(a.collection,i.value,x.value.visible,R.value)),z=(0,l.computed)(()=>new Map(C.value.map(e=>[e.value,e]))),Z=(0,l.computed)(()=>h.value===null?C.value:C.value.filter(e=>h.value.has(e.value)));function M(e){return e.filter(t=>i.value.get(t.value)?.disabled!==!0)}const F=(0,l.computed)(()=>{const e=r.value===null?-1:B.columnIndexOf(s.value,r.value);return e===-1?0:e}),ge=(0,l.computed)(()=>s.value.flatMap(e=>M(e.nodes))),ee=(0,l.computed)(()=>c.value?M(s.value[F.value]?.nodes??[]):Z.value.filter(e=>!e.disabled)),ye=(0,l.computed)(()=>a.closeOnSelect??!a.multiple),K=new Set,E=(0,l.ref)(new Set);function be(e){const t=a.loadChildren;if(!t||K.has(e))return;K.add(e),E.value=new Set(E.value).add(e);const u=()=>{const n=new Set(E.value);n.delete(e),E.value=n};Promise.resolve(t(e)).then(u,()=>{K.delete(e),u()})}function p(e,t){const u=S.value;let n;if(c.value){const d=B.pathTo(a.collection,e);n=t?d:d.slice(0,-1)}else t?n=u.includes(e)?u:[...u,e]:n=u.filter(d=>d!==e);pe(n),t&&!L.value&&be(e)}function we(e){const t=new Set(e),u=e.find(d=>!R.value.has(d));if(u!==void 0){p(u,!0);return}const n=D.value.find(d=>!t.has(d));n!==void 0&&p(n,!1)}function N(){$.value?.focus()}function te(e){if(a.disabled||a.readOnly)return;const t=i.value.get(e);!t||t.disabled||(ve(m.projectValue(m.toggleChecked(e,J.value,i.value,k.value,a.multiple),i.value,q.value,m.effectiveValueStrategy(k.value,a.valueStrategy))),ye.value&&(w(!1),N()))}(0,l.watch)(o,e=>{e||(r.value=null)});function xe(){const e=ge.value;return e.some(t=>t.value===r.value)?r.value:e.find(t=>b.value.includes(t.value))?.value??e[0]?.value??null}function Ce(){return r.value!==null&&z.value.get(r.value)?.disabled===!1&&(h.value===null||h.value.has(r.value))}function Se(){const e=Z.value.filter(t=>!t.disabled);return e.find(t=>b.value.includes(t.value))?.value??e[0]?.value??null}(0,l.watch)([o,r,C,h,s],()=>{if(o.value){if(c.value){r.value=xe();return}Ce()||(r.value=Se())}},{flush:"post",immediate:!0}),(0,l.watch)([o,()=>x.value.matchCount],()=>{o.value&&ze.announce(a.getMatchCountLabel(x.value.matchCount))},{immediate:!0});function qe(e){return`${se}-${e}`}function le(e){return e===0?A:`${A}-${e}`}const ke=(0,l.computed)(()=>c.value?le(F.value):A);function Ee(e){return i.value.get(e)?.node.label??a.getValueLabel?.(e)??e}const Ie=Ke.useTypeahead();function ue(e){const t=T.value?.querySelectorAll('[role="treeitem"][data-value]');for(const u of t??[])if(u.getAttribute("data-value")===e){u.scrollIntoView?.(c.value?{block:"nearest",inline:"nearest"}:{block:"nearest"});return}}function g(e){r.value=e,c.value?(0,l.nextTick)(()=>ue(e)):ue(e)}function V(e){const t=ee.value;if(t.length!==0){if(e==="first"){g(t[0].value);return}if(e==="last"){g(t[t.length-1].value);return}g(t[$e.clamp(t.findIndex(u=>u.value===r.value)+e,0,t.length-1)].value)}}function Te(e){return e.key!=="Escape"?!1:(!o.value||T.value||(e.preventDefault(),w(!1),N()),!0)}function Ae(e,t){return t!=="ArrowDown"&&t!=="ArrowUp"?!1:(e.preventDefault(),o.value?V(t==="ArrowDown"?1:-1):(w(!0),V(t==="ArrowDown"?"first":"last")),!0)}let y=null;function ae(e){const t=B.columnIndexOf(s.value,e),u=t===-1?void 0:s.value[t+1],n=u?M(u.nodes)[0]:void 0;return n?(g(n.value),!0):!1}(0,l.watch)(s,()=>{if(y!==null){if(r.value!==y){y=null;return}ae(y)&&(y=null)}});function Oe(e,t){if(e==="ArrowRight"){if(!t?.hasChildren)return;W.value.has(t.value)||p(t.value,!0),y=ae(t.value)?null:t.value;return}const u=F.value,n=u>0?s.value[u]?.parent??null:null;n!==null&&(y=null,p(n,!1),g(n))}function Ve(e,t,u){return t!=="ArrowRight"&&t!=="ArrowLeft"?!1:o.value?(e.preventDefault(),c.value?(Oe(t,u),!0):t==="ArrowRight"?(u?.hasChildren&&!u.expanded?p(u.value,!0):V(1),!0):(u?.hasChildren&&u.expanded?p(u.value,!1):u?.parent&&g(u.parent),!0)):!0}function _e(e){return e.key!=="Home"&&e.key!=="End"?!1:(o.value&&(e.preventDefault(),V(e.key==="Home"?"first":"last")),!0)}function Be(e,t){if(e.key!=="*"||c.value)return!1;if(!o.value)return!0;e.preventDefault();const u=t?.parent??null;for(const n of C.value)n.parent===u&&n.hasChildren&&!n.expanded&&p(n.value,!0);return!0}function Le(e,t){return e.key!=="Enter"&&!(e.key===" "&&t)?!1:(e.preventDefault(),o.value?(r.value!==null&&te(r.value),!0):(w(!0),!0))}function De(e){e.preventDefault();const t=ee.value,u=t.findIndex(_=>_.value===r.value),n=t.map(_=>i.value.get(_.value)?.node.label??_.value),d=Ie(e.key,n,u);d!==-1&&g(t[d].value)}function Re(e,t){if(a.disabled)return;const u=ne.directionalKey(e.key,e.currentTarget,fe()),n=r.value===null?void 0:z.value.get(r.value);if(!Te(e)){if(e.key==="Tab"){o.value&&w(!1);return}Ae(e,u)||Ve(e,u,n)||_e(e)||Be(e,n)||Le(e,t.selectOnSpace)||t.typeahead&&o.value&&Me.isTypeaheadKey(e)&&De(e)}}return(0,l.provide)(I.TREE_SELECT_CONTEXT,{collection:(0,l.computed)(()=>a.collection),index:i,order:q,value:b,get multiple(){return a.multiple},cascade:he,get disabled(){return a.disabled},get readOnly(){return a.readOnly},checkStateOf:e=>m.checkStateOf(e,J.value,i.value,k.value),commit:te,open:o,onOpenChange:w,expandedIds:D,expanded:R,setExpanded:p,loadingValues:E,onTreeExpandedIdsChange:we,get expandOnClick(){return c.value||a.expandOnClick},isVisible:e=>x.value.visible===null||x.value.visible.has(e),flat:C,flatMap:z,activeValue:r,setActiveValue:e=>{r.value=e},itemId:qe,treeId:A,layout:Q,columns:s,columnTreeId:le,activeTreeId:ke,triggerRef:$,contentRef:T,inputRef:de,hasInput:H,setHasInput:e=>{H.value=e},inputValue:O,onInputValueChange:me,getLabel:Ee,focusTrigger:N,onNavigationKeyDown:Re,visibleRowValues:h,setVisibleRowValues:e=>{h.value=e}}),(e,t)=>((0,l.openBlock)(),(0,l.createBlock)(Pe.default,null,{default:(0,l.withCtx)(()=>[(0,l.renderSlot)(e.$slots,"default",{},()=>[(0,l.createVNode)(He.default,(0,l.mergeProps)(ie.value,{size:oe.value,placeholder:f.placeholder,"empty-message":f.emptyMessage,"render-label":f.renderNode,"aria-label":f.ariaLabel}),null,16,["size","placeholder","empty-message","render-label","aria-label"])]),f.name?((0,l.openBlock)(!0),(0,l.createElementBlock)(l.Fragment,{key:0},(0,l.renderList)((0,l.unref)(Ne.mirroredFormValues)(b.value),(u,n)=>((0,l.openBlock)(),(0,l.createElementBlock)("input",{key:u||n,type:"text","aria-hidden":"true",tabindex:"-1",name:f.name,"^value":u,disabled:f.disabled||void 0,form:f.form,style:{position:"absolute","pointer-events":"none",opacity:"0",margin:"0",width:"1px",height:"1px"}},null,8,je))),128)):(0,l.createCommentVNode)("",!0)]),_:3}))}});exports.default=Ge;

package/dist/tree-select/TreeSelect.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{directionalKey as e,useDirection as a}from"../utils/direction.js";import{useOpenChangeComplete as l}from"../utils/useOpenChangeComplete.js";import{isTypeaheadKey as t,useTypeahead as u}from"../utils/useTypeahead.js";import{clamp as n}from"../utils/clamp.js";import{announce as i}from"../utils/liveAnnouncer.js";import o from"../utils/PopperRoot.vue.js";import{checkStateOf as d,computeFilter as v,flattenVisible as r,indexCollection as s,normalizeChecked as p,projectValue as c,toggleChecked as f}from"./collection.js";import{TREE_SELECT_CONTEXT as m,defaultGetMatchCountLabel as h,defaultTreeSelectFilter as g,nextTreeSelectId as y}from"./context.js";import{computed as x,createBlock as V,defineComponent as b,openBlock as C,provide as S,ref as k,renderSlot as O,watch as E,withCtx as I}from"vue";var T=/* @__PURE__ */b({inheritAttrs:!1,__name:"TreeSelect",props:{collection:{},value:{default:void 0},defaultValue:{default:()=>[]},multiple:{type:Boolean,default:!1},checkStrategy:{default:"cascade"},valueStrategy:{default:"all"},expandedValue:{default:void 0},defaultExpandedValue:{default:()=>[]},open:{type:Boolean,default:void 0},defaultOpen:{type:Boolean,default:!1},inputValue:{default:void 0},defaultInputValue:{default:""},filter:{type:Function,default:g},disabled:{type:Boolean,default:!1},readOnly:{type:Boolean,default:!1},closeOnSelect:{type:Boolean,default:void 0},getMatchCountLabel:{type:Function,default:h}},emits:["update:value","value-change","update:expandedValue","expanded-change","update:open","open-change","update:inputValue","input-value-change","open-change-complete"],setup(h,{emit:g}){const b=h,T=g,w=/* @__PURE__ */new Set,D=k(null),j=k(null),B=k(null),A=k(!1),L=k(null),R=y("item"),M=y("tree"),_=y("content"),F=a(),H=k(b.defaultValue),K=x(()=>b.value??H.value),$=k(b.defaultExpandedValue),z=x(()=>b.expandedValue??$.value),N=k(b.defaultOpen),G=x(()=>b.open??N.value),P=k(b.defaultInputValue),U=x(()=>b.inputValue??P.value);function X(e){e!==G.value&&(void 0===b.open&&(N.value=e),T("update:open",e),T("open-change",e))}l(G,j,e=>T("open-change-complete",e));const q=x(()=>s(b.collection)),J=x(()=>q.value.index),Q=x(()=>q.value.order),W=x(()=>b.multiple&&"cascade"===b.checkStrategy),Y=x(()=>p(K.value,J.value,Q.value,W.value)),Z=x(()=>""!==U.value.trim()),ee=x(()=>Z.value?v(J.value,Q.value,e=>b.filter(e,U.value)):{visible:null,autoExpanded:w,matchCount:Q.value.length}),ae=x(()=>{const e=ee.value.autoExpanded;if(0===e.size)return z.value;const a=new Set(z.value);for(const l of e)a.add(l);return[...a]}),le=x(()=>new Set(ae.value)),te=x(()=>r(b.collection,J.value,ee.value.visible,le.value)),ue=x(()=>new Map(te.value.map(e=>[e.value,e]))),ne=x(()=>Q.value.filter(e=>!0===d(e,Y.value,J.value,W.value))),ie=x(()=>te.value.filter(e=>!e.disabled)),oe=x(()=>b.closeOnSelect??!b.multiple);function de(e,a){const l=z.value;!function(e){e!==z.value&&(void 0===b.expandedValue&&($.value=e),T("update:expandedValue",e),T("expanded-change",e))}(a?l.includes(e)?l:[...l,e]:l.filter(a=>a!==e))}function ve(){D.value?.focus()}function re(e){if(b.disabled||b.readOnly)return;const a=J.value.get(e);!a||a.disabled||(function(e){e!==K.value&&(void 0===b.value&&(H.value=e),T("update:value",e),T("value-change",e))}(c(f(e,Y.value,J.value,W.value,b.multiple),J.value,Q.value,W.value?b.valueStrategy:"all")),oe.value&&(X(!1),ve()))}E(G,e=>{e||(L.value=null)}),E([G,L,te],()=>{G.value&&(null!==L.value&&!1===ue.value.get(L.value)?.disabled||(L.value=te.value.find(e=>!e.disabled)?.value??null))},{flush:"post",immediate:!0}),E([G,Z,()=>ee.value.matchCount],()=>{!G.value||!Z.value||i(b.getMatchCountLabel(ee.value.matchCount))},{immediate:!0});const se=u();function pe(e){const a=ie.value;if(0===a.length)return;if("first"===e)return void(L.value=a[0].value);if("last"===e)return void(L.value=a[a.length-1].value);const l=a.findIndex(e=>e.value===L.value);L.value=a[n(l+e,0,a.length-1)].value}return S(m,{collection:x(()=>b.collection),index:J,order:Q,value:K,get multiple(){return b.multiple},cascade:W,get disabled(){return b.disabled},get readOnly(){return b.readOnly},checkStateOf:e=>d(e,Y.value,J.value,W.value),commit:re,open:G,onOpenChange:X,expandedIds:ae,expanded:le,setExpanded:de,onTreeExpandedIdsChange:function(e){const a=new Set(e),l=e.find(e=>!le.value.has(e));if(void 0!==l)return void de(l,!0);const t=ae.value.find(e=>!a.has(e));void 0!==t&&de(t,!1)},selectedIds:ne,isVisible:e=>null===ee.value.visible||ee.value.visible.has(e),flat:te,flatMap:ue,activeValue:L,setActiveValue:e=>{L.value=e},itemId:function(e){return`${R}-${e}`},treeId:M,contentId:_,triggerRef:D,contentRef:j,inputRef:B,hasInput:A,setHasInput:e=>{A.value=e},inputValue:U,onInputValueChange:function(e){e!==U.value&&(void 0===b.inputValue&&(P.value=e),T("update:inputValue",e),T("input-value-change",e))},getLabel:function(e){return J.value.get(e)?.node.label??e},focusTrigger:ve,onNavigationKeyDown:function(a,l){if(b.disabled)return;const u=e(a.key,a.currentTarget,F()),n=null===L.value?void 0:ue.value.get(L.value);if("Escape"===a.key){if(!G.value||j.value)return;return a.preventDefault(),X(!1),void ve()}if("Tab"!==a.key){if("ArrowDown"===u)return a.preventDefault(),void(G.value?pe(1):(X(!0),pe("first")));if("ArrowUp"===u)return a.preventDefault(),void(G.value?pe(-1):(X(!0),pe("last")));if("ArrowRight"===u){if(!G.value)return;return a.preventDefault(),void(n?.hasChildren&&!n.expanded?de(n.value,!0):pe(1))}if("ArrowLeft"===u){if(!G.value)return;return a.preventDefault(),void(n?.hasChildren&&n.expanded?de(n.value,!1):n?.parent&&(L.value=n.parent))}if("Home"===a.key||"End"===a.key){if(!G.value)return;return a.preventDefault(),void pe("Home"===a.key?"first":"last")}if("Enter"===a.key||" "===a.key&&l.selectOnSpace)return a.preventDefault(),G.value?void(null!==L.value&&re(L.value)):void X(!0);if(l.typeahead&&G.value&&t(a)){a.preventDefault();const e=ie.value,l=e.findIndex(e=>e.value===L.value),t=e.map(e=>J.value.get(e.value)?.node.label??e.value),u=se(a.key,t,l);-1!==u&&(L.value=e[u].value)}}else G.value&&X(!1)}}),(e,a)=>(C(),V(o,null,{default:I(()=>[O(e.$slots,"default")]),_:3}))}});export{T as default};
+import{announce as e}from"../utils/liveAnnouncer.js";import{directionalKey as a,useDirection as l}from"../utils/direction.js";import{isTypeaheadKey as u}from"../utils/typeahead.js";import{useOpenChangeComplete as t}from"../utils/useOpenChangeComplete.js";import{useTypeahead as n}from"../utils/useTypeahead.js";import{mirroredFormValues as o}from"../utils/mirroredValues.js";import i from"../utils/PopperRoot.vue.js";import{clamp as r}from"../utils/clamp.js";import{columnIndexOf as v,pathTo as d,treeColumns as s}from"../utils/tree-columns.js";import{checkStateOf as c,computeFilter as p,effectiveValueStrategy as f,flattenVisible as m,indexCollection as h,normalizeChecked as g,projectValue as y,toggleChecked as b}from"./collection.js";import{TREE_SELECT_CONTEXT as x,defaultGetMatchCountLabel as C,defaultTreeSelectFilter as w,nextTreeSelectId as V}from"./context.js";import k from"./TreeSelectAnatomy.vue.js";import{Fragment as S,computed as O,createBlock as T,createCommentVNode as I,createElementBlock as A,createVNode as E,defineComponent as j,mergeProps as D,nextTick as L,openBlock as B,provide as R,ref as z,renderList as M,renderSlot as F,unref as N,useAttrs as $,watch as _,withCtx as H}from"vue";var K=["name","^value","disabled","form"],P=/* @__PURE__ */j({inheritAttrs:!1,__name:"TreeSelect",props:{collection:{},value:{default:void 0},defaultValue:{default:()=>[]},multiple:{type:Boolean,default:!1},checkStrategy:{default:"cascade"},valueStrategy:{default:"all"},expanded:{default:void 0},defaultExpanded:{default:()=>[]},layout:{default:"tree"},open:{type:Boolean,default:void 0},defaultOpen:{type:Boolean,default:!1},inputValue:{default:void 0},defaultInputValue:{default:""},filter:{type:Function,default:w},loadChildren:{type:Function,default:void 0},disabled:{type:Boolean,default:!1},name:{},form:{},readOnly:{type:Boolean,default:!1},closeOnSelect:{type:Boolean,default:void 0},getMatchCountLabel:{type:Function,default:C},getValueLabel:{},expandOnClick:{type:Boolean,default:!1},placeholder:{},emptyMessage:{default:"No matches"},renderNode:{},ariaLabel:{},size:{default:void 0}},emits:["update:value","value-change","update:expanded","expanded-change","update:open","open-change","update:inputValue","input-value-change","open-change-complete"],setup(C,{emit:w}){const j=C,P=$(),q=O(()=>j.size??P["data-size"]),G=O(()=>{const{"data-size":e,...a}=P;return a}),U=w,X=/* @__PURE__ */new Set,J=z(null),Q=z(null),W=z(null),Y=z(!1),Z=z(null),ee=z(null),ae=V("item"),le=V("tree"),ue=l(),te=z(j.defaultValue),ne=O(()=>j.value??te.value),oe=z(j.defaultExpanded),ie=O(()=>j.expanded??oe.value),re=z(j.defaultOpen),ve=O(()=>j.open??re.value),de=z(j.defaultInputValue),se=O(()=>j.inputValue??de.value);function ce(e){e!==ve.value&&(void 0===j.open&&(re.value=e),U("update:open",e),U("open-change",e))}t(ve,Q,e=>U("open-change-complete",e));const pe=O(()=>h(j.collection)),fe=O(()=>pe.value.index),me=O(()=>pe.value.order),he=O(()=>j.multiple?j.checkStrategy:"independent"),ge=O(()=>"independent"!==he.value),ye=O(()=>g(ne.value,fe.value,me.value,he.value)),be=O(()=>""!==se.value.trim()),xe=O(()=>be.value?p(fe.value,me.value,e=>j.filter(e,se.value)):{visible:null,autoExpanded:X,matchCount:me.value.length}),Ce=O(()=>"columns"!==j.layout||be.value?"tree":"columns"),we=O(()=>"columns"===Ce.value),Ve=O(()=>we.value?s(j.collection,ie.value):[]),ke=O(()=>new Set(Ve.value.slice(1).map(e=>e.parent))),Se=O(()=>{const e=xe.value.autoExpanded;if(0===e.size)return ie.value;const a=new Set(ie.value);for(const l of e)a.add(l);return[...a]}),Oe=O(()=>we.value?ke.value:new Set(Se.value)),Te=O(()=>m(j.collection,fe.value,xe.value.visible,Oe.value)),Ie=O(()=>new Map(Te.value.map(e=>[e.value,e]))),Ae=O(()=>null===ee.value?Te.value:Te.value.filter(e=>ee.value.has(e.value)));function Ee(e){return e.filter(e=>!0!==fe.value.get(e.value)?.disabled)}const je=O(()=>{const e=null===Z.value?-1:v(Ve.value,Z.value);return-1===e?0:e}),De=O(()=>Ve.value.flatMap(e=>Ee(e.nodes))),Le=O(()=>we.value?Ee(Ve.value[je.value]?.nodes??[]):Ae.value.filter(e=>!e.disabled)),Be=O(()=>j.closeOnSelect??!j.multiple),Re=/* @__PURE__ */new Set,ze=z(/* @__PURE__ */new Set);function Me(e,a){const l=ie.value;let u;if(we.value){const l=d(j.collection,e);u=a?l:l.slice(0,-1)}else u=a?l.includes(e)?l:[...l,e]:l.filter(a=>a!==e);(function(e){e!==ie.value&&(void 0===j.expanded&&(oe.value=e),U("update:expanded",e),U("expanded-change",e))})(u),a&&!be.value&&function(e){const a=j.loadChildren;if(!a||Re.has(e))return;Re.add(e),ze.value=new Set(ze.value).add(e);const l=()=>{const a=new Set(ze.value);a.delete(e),ze.value=a};Promise.resolve(a(e)).then(l,()=>{Re.delete(e),l()})}(e)}function Fe(){J.value?.focus()}function Ne(e){if(j.disabled||j.readOnly)return;const a=fe.value.get(e);!a||a.disabled||(function(e){e!==ne.value&&(void 0===j.value&&(te.value=e),U("update:value",e),U("value-change",e))}(y(b(e,ye.value,fe.value,he.value,j.multiple),fe.value,me.value,f(he.value,j.valueStrategy))),Be.value&&(ce(!1),Fe()))}function $e(e){return 0===e?le:`${le}-${e}`}_(ve,e=>{e||(Z.value=null)}),_([ve,Z,Te,ee,Ve],()=>{if(ve.value){if(we.value)return void(Z.value=function(){const e=De.value;return e.some(e=>e.value===Z.value)?Z.value:e.find(e=>ne.value.includes(e.value))?.value??e[0]?.value??null}());null!==Z.value&&!1===Ie.value.get(Z.value)?.disabled&&(null===ee.value||ee.value.has(Z.value))||(Z.value=function(){const e=Ae.value.filter(e=>!e.disabled);return e.find(e=>ne.value.includes(e.value))?.value??e[0]?.value??null}())}},{flush:"post",immediate:!0}),_([ve,()=>xe.value.matchCount],()=>{ve.value&&e(j.getMatchCountLabel(xe.value.matchCount))},{immediate:!0});const _e=O(()=>we.value?$e(je.value):le),He=n();function Ke(e){const a=Q.value?.querySelectorAll('[role="treeitem"][data-value]');for(const l of a??[])if(l.getAttribute("data-value")===e)return void l.scrollIntoView?.(we.value?{block:"nearest",inline:"nearest"}:{block:"nearest"})}function Pe(e){Z.value=e,we.value?L(()=>Ke(e)):Ke(e)}function qe(e){const a=Le.value;if(0!==a.length){if("first"===e)return void Pe(a[0].value);if("last"===e)return void Pe(a[a.length-1].value);Pe(a[r(a.findIndex(e=>e.value===Z.value)+e,0,a.length-1)].value)}}let Ge=null;function Ue(e){const a=v(Ve.value,e),l=-1===a?void 0:Ve.value[a+1],u=l?Ee(l.nodes)[0]:void 0;return!!u&&(Pe(u.value),!0)}return _(Ve,()=>{if(null!==Ge){if(Z.value!==Ge)return void(Ge=null);Ue(Ge)&&(Ge=null)}}),R(x,{collection:O(()=>j.collection),index:fe,order:me,value:ne,get multiple(){return j.multiple},cascade:ge,get disabled(){return j.disabled},get readOnly(){return j.readOnly},checkStateOf:e=>c(e,ye.value,fe.value,he.value),commit:Ne,open:ve,onOpenChange:ce,expandedIds:Se,expanded:Oe,setExpanded:Me,loadingValues:ze,onTreeExpandedIdsChange:function(e){const a=new Set(e),l=e.find(e=>!Oe.value.has(e));if(void 0!==l)return void Me(l,!0);const u=Se.value.find(e=>!a.has(e));void 0!==u&&Me(u,!1)},get expandOnClick(){return we.value||j.expandOnClick},isVisible:e=>null===xe.value.visible||xe.value.visible.has(e),flat:Te,flatMap:Ie,activeValue:Z,setActiveValue:e=>{Z.value=e},itemId:function(e){return`${ae}-${e}`},treeId:le,layout:Ce,columns:Ve,columnTreeId:$e,activeTreeId:_e,triggerRef:J,contentRef:Q,inputRef:W,hasInput:Y,setHasInput:e=>{Y.value=e},inputValue:se,onInputValueChange:function(e){e!==se.value&&(void 0===j.inputValue&&(de.value=e),U("update:inputValue",e),U("input-value-change",e))},getLabel:function(e){return fe.value.get(e)?.node.label??j.getValueLabel?.(e)??e},focusTrigger:Fe,onNavigationKeyDown:function(e,l){if(j.disabled)return;const t=a(e.key,e.currentTarget,ue()),n=null===Z.value?void 0:Ie.value.get(Z.value);if(!function(e){return"Escape"===e.key&&(!ve.value||Q.value||(e.preventDefault(),ce(!1),Fe()),!0)}(e)){if("Tab"===e.key)return void(ve.value&&ce(!1));(function(e,a){return("ArrowDown"===a||"ArrowUp"===a)&&(e.preventDefault(),ve.value?qe("ArrowDown"===a?1:-1):(ce(!0),qe("ArrowDown"===a?"first":"last")),!0)})(e,t)||function(e,a,l){return!("ArrowRight"!==a&&"ArrowLeft"!==a||ve.value&&(e.preventDefault(),we.value?(function(e,a){if("ArrowRight"===e){if(!a?.hasChildren)return;return ke.value.has(a.value)||Me(a.value,!0),void(Ge=Ue(a.value)?null:a.value)}const l=je.value,u=l>0?Ve.value[l]?.parent??null:null;null!==u&&(Ge=null,Me(u,!1),Pe(u))}(a,l),0):"ArrowRight"===a?(l?.hasChildren&&!l.expanded?Me(l.value,!0):qe(1),0):(l?.hasChildren&&l.expanded?Me(l.value,!1):l?.parent&&Pe(l.parent),0)))}(e,t,n)||function(e){return("Home"===e.key||"End"===e.key)&&(ve.value&&(e.preventDefault(),qe("Home"===e.key?"first":"last")),!0)}(e)||function(e,a){if("*"!==e.key||we.value)return!1;if(!ve.value)return!0;e.preventDefault();const l=a?.parent??null;for(const e of Te.value)e.parent===l&&e.hasChildren&&!e.expanded&&Me(e.value,!0);return!0}(e,n)||function(e,a){return!!("Enter"===e.key||" "===e.key&&a)&&(e.preventDefault(),ve.value?(null!==Z.value&&Ne(Z.value),!0):(ce(!0),!0))}(e,l.selectOnSpace)||l.typeahead&&ve.value&&u(e)&&function(e){e.preventDefault();const a=Le.value,l=a.findIndex(e=>e.value===Z.value),u=a.map(e=>fe.value.get(e.value)?.node.label??e.value),t=He(e.key,u,l);-1!==t&&Pe(a[t].value)}(e)}},visibleRowValues:ee,setVisibleRowValues:e=>{ee.value=e}}),(e,a)=>(B(),T(i,null,{default:H(()=>[F(e.$slots,"default",{},()=>[E(k,D(G.value,{size:q.value,placeholder:C.placeholder,"empty-message":C.emptyMessage,"render-label":C.renderNode,"aria-label":C.ariaLabel}),null,16,["size","placeholder","empty-message","render-label","aria-label"])]),C.name?(B(!0),A(S,{key:0},M(N(o)(ne.value),(e,a)=>(B(),A("input",{key:e||a,type:"text","aria-hidden":"true",tabindex:"-1",name:C.name,"^value":e,disabled:C.disabled||void 0,form:C.form,style:{position:"absolute","pointer-events":"none",opacity:"0",margin:"0",width:"1px",height:"1px"}},null,8,K))),128)):I("",!0)]),_:3}))}});export{P as default};

package/dist/tree-select/TreeSelectAnatomy.vue.cjs

@@ -0,0 +1 @@
+const e=require("./TreeSelectAnatomy.vue_vue_type_script_setup_true_lang.cjs");var t=e.default;exports.default=t;

package/dist/tree-select/TreeSelectAnatomy.vue.d.cts

@@ -0,0 +1,27 @@
+import { type TreeSelectRenderLabel } from './context.cjs';
+/**
+ * Derives the complete anatomy from props when no slot is provided: trigger, portal with input and tree, empty state.
+ * @internal
+ */
+type __VLS_Props = {
+    placeholder?: string | undefined;
+    emptyMessage?: string | undefined;
+    renderLabel?: TreeSelectRenderLabel | undefined;
+    /** Accessible name for derived components; falls back to `placeholder`. */
+    ariaLabel?: string | undefined;
+    ariaLabelledby?: string | undefined;
+    /**
+     * Size rung the skin renders the panel at, applied to the derived Content part.
+     * @default undefined — falls back to a `data-size` attribute.
+     */
+    size?: 'sm' | 'lg' | (string & {}) | undefined;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    size: "sm" | "lg" | (string & {}) | undefined;
+    placeholder: string | undefined;
+    ariaLabel: string | undefined;
+    ariaLabelledby: string | undefined;
+    renderLabel: TreeSelectRenderLabel | undefined;
+    emptyMessage: string | undefined;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;