@skdx/vue 0.27.0 → 0.29.0

package/dist/autocomplete/Autocomplete.vue.d.cts

@@ -1,164 +1,173 @@
-import { type AutocompleteFilter } from './context.cjs';
+import { type AutocompleteFilter, type AutocompleteOption, type AutocompleteOptionGroup, type AutocompleteValueChangeDetail } from './context.cjs';
 /**
- * The Vue implementation of the shared Autocomplete contract (see
- * `@skdx/shared`'s `autocompleteContract`). A WAI-ARIA 1.2 "combobox with
- * list autocomplete", with one deliberate difference from `SkdxCombobox`: the
- * committed value does not have to come from the list. Type "foo", blur, and
- * "foo" is the answer.
+ * A free-text field with a suggestion popup: the input owns real DOM focus, the highlighted suggestion is virtual.
  *
- * Owns **two separate** pieces of state — the draft text in the input
- * (`inputValue`) and the committed value (`value`) — plus the popup's open
- * state, and hands all three down to every other `SkdxAutocomplete*` part via
- * provide/inject. Renders no DOM of its own.
- *
- * Collapsing the two states would mean either firing a change per character or
- * losing the ability to show text the user has not committed yet — and it is
- * the gap between the two that lets Escape put the last committed text back.
- *
- * Filtering is the consumer's job by default: you filter your data by
- * `inputValue` and render only the `SkdxAutocompleteItem`s that match, which is
- * what an async or server-side search needs. Pass a `filter` predicate instead
- * and the component filters its own items.
- *
- * Keyboard: Arrow Down/Up move the highlight **without moving DOM focus**
- * (real focus never leaves the input; the highlight is virtual, via
- * `aria-activedescendant`). Enter commits the highlighted suggestion. Escape
- * closes and puts the last committed text back. Tab commits the raw draft.
- *
- * Emits `open-change` the instant the state flips and `open-change-complete`
- * once the change has finished on screen — after `SkdxAutocompleteContent`'s
- * enter or exit animation ends, or in the same task when it declares none.
- *
- * Works controlled (`v-model:value`, `v-model:input-value`, `v-model:open`) or
- * uncontrolled (`default-value`, `default-input-value`, `default-open`).
+ * @example
+ * ```vue
+ * <SkdxAutocomplete :options="[{ value: 'react', label: 'Ruby' }]" />
+ * ```
  */
 type __VLS_Props = {
     /**
-     * The committed value, for controlled usage. Pair with `v-model:value` or
-     * `@value-change`. A *separate* state from `inputValue`: the draft text
-     * moves on every keystroke, the value only when something is committed.
+     * The committed value, for controlled usage (pair with v-model:value).
      * @default undefined — uncontrolled, tracks its own committed value internally.
      */
-    value?: string;
+    value?: string | undefined;
     /**
-     * Initial committed value, for uncontrolled usage. Also seeds
-     * `defaultInputValue`, so an autocomplete restored from saved state shows
-     * the text it committed rather than an empty field.
+     * Initial committed value; also seeds `defaultInputValue`.
      * @default '' — nothing committed, so blurring an untouched field commits nothing.
      */
     defaultValue?: string;
     /**
-     * The draft text in the input, for controlled usage. Pair with
-     * `v-model:input-value` or `@input-value-change` — typically used to drive
-     * filtering of the suggestion list, since filtering is the consumer's job
-     * unless `filter` is supplied.
+     * Controlled draft text; with no `filter` set, this prop is the filtering mechanism itself.
      * @default undefined — uncontrolled, tracks its own draft text internally.
      */
-    inputValue?: string;
+    inputValue?: string | undefined;
     /**
-     * Initial draft text, for uncontrolled usage.
+     * Initial draft text, falls back to defaultValue if unset.
      * @default defaultValue — the field opens showing whatever value it starts committed to.
      */
-    defaultInputValue?: string;
+    defaultInputValue?: string | undefined;
+    /**
+     * Suggestion collection (flat or grouped via `{ label, options }`).
+     * @default undefined — the default slot must supply the field itself.
+     */
+    options?: AutocompleteOption[] | AutocompleteOptionGroup[] | undefined;
     /**
-     * Whether the suggestion popup is open, for controlled usage. Pair with
-     * `v-model:open` or `@open-change`.
+     * Whether the suggestion popup is open, for controlled usage.
      * @default undefined — uncontrolled, tracks its own open state internally.
      */
-    open?: boolean;
+    open?: boolean | undefined;
     /**
-     * Initial open state, for uncontrolled usage.
+     * Initial open state; popup waits for keystroke or trigger if false.
      * @default false — the popup waits for a keystroke, an arrow key, or the trigger.
      */
     defaultOpen?: boolean;
     /**
-     * Lets the committed value be text that is not in the suggestion list — Tab,
-     * Enter with nothing highlighted, and blur all commit the raw draft. This is
-     * the whole point of the family: an autocomplete *suggests*, it does not
-     * constrain. Turn it off and an unmatched draft is discarded on blur and the
-     * last committed text is put back, which makes this a `SkdxCombobox` with
-     * extra steps — reach for that instead.
+     * Lets the committed value be text outside the suggestion list; off, an unmatched draft reverts
+     * to the last committed text on blur.
      * @default true — free text is committed verbatim.
      */
     allowCustomValue?: boolean;
     /**
-     * Opens the suggestion popup as soon as the input takes focus, instead of
-     * waiting for the first keystroke.
-     * @default false — an empty field usually means an unfiltered list, and dropping the entire dataset over the page on focus is rarely what the user asked for.
+     * Opens the suggestion popup on focus instead of waiting for the first keystroke.
+     * @default false
      */
     openOnFocus?: boolean;
     /**
-     * Predicate deciding which `SkdxAutocompleteItem`s survive the current draft
-     * text. Every item is measured (its `textValue`, or its rendered text) and
-     * the rejected ones render nothing at all, so they leave the suggestion
-     * count, the highlight order, and `SkdxAutocompleteEmpty` exactly as if the
-     * consumer had removed them.
-     * @default undefined — nothing is filtered; the consumer renders only the matching items, which is what an async or server-side search needs.
+     * Keeps the first suggestion highlighted as the filtered list changes while open, so Enter
+     * always has a target.
+     * @default false
+     */
+    autoHighlight?: boolean;
+    /**
+     * Wraps arrow navigation around list ends; set false to clamp.
+     * @default true
      */
-    filter?: AutocompleteFilter;
+    loop?: boolean;
     /**
-     * Blocks all interaction: the input is natively `disabled`, so it is not
-     * focusable and the popup can never open.
+     * Filters and ranks Items: 'manual' filters nothing, a predicate filters and ranks by score.
+     * @default undefined — nothing is filtered; the consumer renders only matching items.
+     */
+    filter?: AutocompleteFilter | undefined;
+    /**
+     * Blocks all interaction; the input is natively disabled and the popup can't open.
      * @default false
      */
     disabled?: boolean;
     /**
-     * Shows the committed text but blocks any change to it — the input is
-     * natively `readonly` and still focusable (unlike `disabled`), and no
-     * keystroke, Tab or blur commits anything.
+     * Shows the committed text but blocks changes, while remaining focusable, unlike `disabled`.
      * @default false
      */
     readOnly?: boolean;
     /**
-     * Marks the field as invalid, exposed as `aria-invalid`/`data-invalid` on
-     * `SkdxAutocompleteInput`.
+     * Marks the field as invalid, exposed as `aria-invalid`/`data-invalid` on the Input.
      * @default false
      */
     invalid?: boolean;
     /**
-     * Formats the message announced (through the shared live announcer) each
-     * time the number of rendered suggestions changes while the popup is open.
-     * Filtering changes nothing `aria-expanded` or `aria-activedescendant`
-     * reports, so this count is the only signal a screen-reader user gets that
-     * typing narrowed anything. Return an empty string to announce nothing.
+     * Marks suggestions as in flight, exposed as `aria-busy`/`data-loading`, suppressing the
+     * suggestion-count announcement.
+     * @default false
+     */
+    loading?: boolean;
+    /**
+     * Form field name; needed on the root since a shadow-root input can't associate with the ancestor form.
+     * @default undefined — the field submits nothing at all.
+     */
+    name?: string | undefined;
+    /**
+     * Id of the `<form>` the field submits into; requires `name` to have any effect.
+     * @default undefined — associates with the nearest ancestor `<form>`.
+     */
+    form?: string | undefined;
+    /**
+     * Formats the polite announcement when the rendered suggestion count changes while open;
+     * return an empty string to announce nothing.
      * @default defaultGetSuggestionCountLabel — e.g. `"3 suggestions available"`.
      */
-    getSuggestionCountLabel?: (count: number) => string;
+    getResultCountLabel?: (count: number) => string;
+    /**
+     * Accessible name for the derived Input and List, neither of which takes a name from content.
+     * @default undefined — the Input is unnamed, which axe reports under `aria-input-field-name`.
+     */
+    ariaLabel?: string | undefined;
+    /**
+     * Placeholder text forwarded to the derived Input.
+     * @default undefined
+     */
+    placeholder?: string | undefined;
+    /**
+     * Whether the derived anatomy renders a Clear button that empties the draft text and committed value.
+     * @default false — no Clear button is derived.
+     */
+    clearable?: boolean;
 };
-declare var __VLS_5: {};
-type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_5) => any;
+type __VLS_Slots = {
+    /** Manual composition of the input, list and items, replacing the derived `options` anatomy. */
+    default?(): unknown;
+    /** Body of a derived option row, for markup its `label` string cannot express. */
+    option?(props: {
+        option: AutocompleteOption;
+    }): unknown;
 };
-declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
+    /** Reports whether the field satisfies its constraints, delegating to the real input; true with no Input mounted. */
+    checkValidity: () => boolean;
+    /** Like `checkValidity()`, but also shows the browser's validation message. */
+    reportValidity: () => boolean;
+    /** Pushes an externally-computed error onto the Input's real input, like HTMLInputElement.setCustomValidity(). */
+    setCustomValidity: (message: string) => void | undefined;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:open": (open: boolean) => any;
     "open-change": (open: boolean) => any;
     "update:value": (value: string) => any;
-    "value-change": (value: string) => any;
+    "value-change": (detail: AutocompleteValueChangeDetail) => any;
     "open-change-complete": (open: boolean) => any;
     "update:inputValue": (value: string) => any;
     "input-value-change": (value: 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"?: ((value: string) => any) | undefined;
-    "onInput-value-change"?: ((value: string) => any) | undefined;
+    "onUpdate:open"?: (open: boolean) => any;
+    "onOpen-change"?: (open: boolean) => any;
+    "onUpdate:value"?: (value: string) => any;
+    "onValue-change"?: (detail: AutocompleteValueChangeDetail) => any;
+    "onOpen-change-complete"?: (open: boolean) => any;
+    "onUpdate:inputValue"?: (value: string) => any;
+    "onInput-value-change"?: (value: string) => any;
 }>, {
+    loading: boolean;
     disabled: boolean;
-    filter: AutocompleteFilter;
-    open: boolean;
+    open: boolean | undefined;
     defaultOpen: boolean;
-    value: string;
-    invalid: boolean;
     defaultValue: string;
     readOnly: boolean;
-    inputValue: string;
-    defaultInputValue: string;
+    invalid: boolean;
+    clearable: boolean;
+    loop: boolean;
     allowCustomValue: boolean;
+    autoHighlight: boolean;
+    getResultCountLabel: (count: number) => string;
     openOnFocus: boolean;
-    getSuggestionCountLabel: (count: number) => string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/autocomplete/Autocomplete.vue.d.ts

@@ -1,164 +1,173 @@
-import { type AutocompleteFilter } from './context.js';
+import { type AutocompleteFilter, type AutocompleteOption, type AutocompleteOptionGroup, type AutocompleteValueChangeDetail } from './context.js';
 /**
- * The Vue implementation of the shared Autocomplete contract (see
- * `@skdx/shared`'s `autocompleteContract`). A WAI-ARIA 1.2 "combobox with
- * list autocomplete", with one deliberate difference from `SkdxCombobox`: the
- * committed value does not have to come from the list. Type "foo", blur, and
- * "foo" is the answer.
+ * A free-text field with a suggestion popup: the input owns real DOM focus, the highlighted suggestion is virtual.
  *
- * Owns **two separate** pieces of state — the draft text in the input
- * (`inputValue`) and the committed value (`value`) — plus the popup's open
- * state, and hands all three down to every other `SkdxAutocomplete*` part via
- * provide/inject. Renders no DOM of its own.
- *
- * Collapsing the two states would mean either firing a change per character or
- * losing the ability to show text the user has not committed yet — and it is
- * the gap between the two that lets Escape put the last committed text back.
- *
- * Filtering is the consumer's job by default: you filter your data by
- * `inputValue` and render only the `SkdxAutocompleteItem`s that match, which is
- * what an async or server-side search needs. Pass a `filter` predicate instead
- * and the component filters its own items.
- *
- * Keyboard: Arrow Down/Up move the highlight **without moving DOM focus**
- * (real focus never leaves the input; the highlight is virtual, via
- * `aria-activedescendant`). Enter commits the highlighted suggestion. Escape
- * closes and puts the last committed text back. Tab commits the raw draft.
- *
- * Emits `open-change` the instant the state flips and `open-change-complete`
- * once the change has finished on screen — after `SkdxAutocompleteContent`'s
- * enter or exit animation ends, or in the same task when it declares none.
- *
- * Works controlled (`v-model:value`, `v-model:input-value`, `v-model:open`) or
- * uncontrolled (`default-value`, `default-input-value`, `default-open`).
+ * @example
+ * ```vue
+ * <SkdxAutocomplete :options="[{ value: 'react', label: 'Ruby' }]" />
+ * ```
  */
 type __VLS_Props = {
     /**
-     * The committed value, for controlled usage. Pair with `v-model:value` or
-     * `@value-change`. A *separate* state from `inputValue`: the draft text
-     * moves on every keystroke, the value only when something is committed.
+     * The committed value, for controlled usage (pair with v-model:value).
      * @default undefined — uncontrolled, tracks its own committed value internally.
      */
-    value?: string;
+    value?: string | undefined;
     /**
-     * Initial committed value, for uncontrolled usage. Also seeds
-     * `defaultInputValue`, so an autocomplete restored from saved state shows
-     * the text it committed rather than an empty field.
+     * Initial committed value; also seeds `defaultInputValue`.
      * @default '' — nothing committed, so blurring an untouched field commits nothing.
      */
     defaultValue?: string;
     /**
-     * The draft text in the input, for controlled usage. Pair with
-     * `v-model:input-value` or `@input-value-change` — typically used to drive
-     * filtering of the suggestion list, since filtering is the consumer's job
-     * unless `filter` is supplied.
+     * Controlled draft text; with no `filter` set, this prop is the filtering mechanism itself.
      * @default undefined — uncontrolled, tracks its own draft text internally.
      */
-    inputValue?: string;
+    inputValue?: string | undefined;
     /**
-     * Initial draft text, for uncontrolled usage.
+     * Initial draft text, falls back to defaultValue if unset.
      * @default defaultValue — the field opens showing whatever value it starts committed to.
      */
-    defaultInputValue?: string;
+    defaultInputValue?: string | undefined;
+    /**
+     * Suggestion collection (flat or grouped via `{ label, options }`).
+     * @default undefined — the default slot must supply the field itself.
+     */
+    options?: AutocompleteOption[] | AutocompleteOptionGroup[] | undefined;
     /**
-     * Whether the suggestion popup is open, for controlled usage. Pair with
-     * `v-model:open` or `@open-change`.
+     * Whether the suggestion popup is open, for controlled usage.
      * @default undefined — uncontrolled, tracks its own open state internally.
      */
-    open?: boolean;
+    open?: boolean | undefined;
     /**
-     * Initial open state, for uncontrolled usage.
+     * Initial open state; popup waits for keystroke or trigger if false.
      * @default false — the popup waits for a keystroke, an arrow key, or the trigger.
      */
     defaultOpen?: boolean;
     /**
-     * Lets the committed value be text that is not in the suggestion list — Tab,
-     * Enter with nothing highlighted, and blur all commit the raw draft. This is
-     * the whole point of the family: an autocomplete *suggests*, it does not
-     * constrain. Turn it off and an unmatched draft is discarded on blur and the
-     * last committed text is put back, which makes this a `SkdxCombobox` with
-     * extra steps — reach for that instead.
+     * Lets the committed value be text outside the suggestion list; off, an unmatched draft reverts
+     * to the last committed text on blur.
      * @default true — free text is committed verbatim.
      */
     allowCustomValue?: boolean;
     /**
-     * Opens the suggestion popup as soon as the input takes focus, instead of
-     * waiting for the first keystroke.
-     * @default false — an empty field usually means an unfiltered list, and dropping the entire dataset over the page on focus is rarely what the user asked for.
+     * Opens the suggestion popup on focus instead of waiting for the first keystroke.
+     * @default false
      */
     openOnFocus?: boolean;
     /**
-     * Predicate deciding which `SkdxAutocompleteItem`s survive the current draft
-     * text. Every item is measured (its `textValue`, or its rendered text) and
-     * the rejected ones render nothing at all, so they leave the suggestion
-     * count, the highlight order, and `SkdxAutocompleteEmpty` exactly as if the
-     * consumer had removed them.
-     * @default undefined — nothing is filtered; the consumer renders only the matching items, which is what an async or server-side search needs.
+     * Keeps the first suggestion highlighted as the filtered list changes while open, so Enter
+     * always has a target.
+     * @default false
+     */
+    autoHighlight?: boolean;
+    /**
+     * Wraps arrow navigation around list ends; set false to clamp.
+     * @default true
      */
-    filter?: AutocompleteFilter;
+    loop?: boolean;
     /**
-     * Blocks all interaction: the input is natively `disabled`, so it is not
-     * focusable and the popup can never open.
+     * Filters and ranks Items: 'manual' filters nothing, a predicate filters and ranks by score.
+     * @default undefined — nothing is filtered; the consumer renders only matching items.
+     */
+    filter?: AutocompleteFilter | undefined;
+    /**
+     * Blocks all interaction; the input is natively disabled and the popup can't open.
      * @default false
      */
     disabled?: boolean;
     /**
-     * Shows the committed text but blocks any change to it — the input is
-     * natively `readonly` and still focusable (unlike `disabled`), and no
-     * keystroke, Tab or blur commits anything.
+     * Shows the committed text but blocks changes, while remaining focusable, unlike `disabled`.
      * @default false
      */
     readOnly?: boolean;
     /**
-     * Marks the field as invalid, exposed as `aria-invalid`/`data-invalid` on
-     * `SkdxAutocompleteInput`.
+     * Marks the field as invalid, exposed as `aria-invalid`/`data-invalid` on the Input.
      * @default false
      */
     invalid?: boolean;
     /**
-     * Formats the message announced (through the shared live announcer) each
-     * time the number of rendered suggestions changes while the popup is open.
-     * Filtering changes nothing `aria-expanded` or `aria-activedescendant`
-     * reports, so this count is the only signal a screen-reader user gets that
-     * typing narrowed anything. Return an empty string to announce nothing.
+     * Marks suggestions as in flight, exposed as `aria-busy`/`data-loading`, suppressing the
+     * suggestion-count announcement.
+     * @default false
+     */
+    loading?: boolean;
+    /**
+     * Form field name; needed on the root since a shadow-root input can't associate with the ancestor form.
+     * @default undefined — the field submits nothing at all.
+     */
+    name?: string | undefined;
+    /**
+     * Id of the `<form>` the field submits into; requires `name` to have any effect.
+     * @default undefined — associates with the nearest ancestor `<form>`.
+     */
+    form?: string | undefined;
+    /**
+     * Formats the polite announcement when the rendered suggestion count changes while open;
+     * return an empty string to announce nothing.
      * @default defaultGetSuggestionCountLabel — e.g. `"3 suggestions available"`.
      */
-    getSuggestionCountLabel?: (count: number) => string;
+    getResultCountLabel?: (count: number) => string;
+    /**
+     * Accessible name for the derived Input and List, neither of which takes a name from content.
+     * @default undefined — the Input is unnamed, which axe reports under `aria-input-field-name`.
+     */
+    ariaLabel?: string | undefined;
+    /**
+     * Placeholder text forwarded to the derived Input.
+     * @default undefined
+     */
+    placeholder?: string | undefined;
+    /**
+     * Whether the derived anatomy renders a Clear button that empties the draft text and committed value.
+     * @default false — no Clear button is derived.
+     */
+    clearable?: boolean;
 };
-declare var __VLS_5: {};
-type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_5) => any;
+type __VLS_Slots = {
+    /** Manual composition of the input, list and items, replacing the derived `options` anatomy. */
+    default?(): unknown;
+    /** Body of a derived option row, for markup its `label` string cannot express. */
+    option?(props: {
+        option: AutocompleteOption;
+    }): unknown;
 };
-declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
+    /** Reports whether the field satisfies its constraints, delegating to the real input; true with no Input mounted. */
+    checkValidity: () => boolean;
+    /** Like `checkValidity()`, but also shows the browser's validation message. */
+    reportValidity: () => boolean;
+    /** Pushes an externally-computed error onto the Input's real input, like HTMLInputElement.setCustomValidity(). */
+    setCustomValidity: (message: string) => void | undefined;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:open": (open: boolean) => any;
     "open-change": (open: boolean) => any;
     "update:value": (value: string) => any;
-    "value-change": (value: string) => any;
+    "value-change": (detail: AutocompleteValueChangeDetail) => any;
     "open-change-complete": (open: boolean) => any;
     "update:inputValue": (value: string) => any;
     "input-value-change": (value: 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"?: ((value: string) => any) | undefined;
-    "onInput-value-change"?: ((value: string) => any) | undefined;
+    "onUpdate:open"?: (open: boolean) => any;
+    "onOpen-change"?: (open: boolean) => any;
+    "onUpdate:value"?: (value: string) => any;
+    "onValue-change"?: (detail: AutocompleteValueChangeDetail) => any;
+    "onOpen-change-complete"?: (open: boolean) => any;
+    "onUpdate:inputValue"?: (value: string) => any;
+    "onInput-value-change"?: (value: string) => any;
 }>, {
+    loading: boolean;
     disabled: boolean;
-    filter: AutocompleteFilter;
-    open: boolean;
+    open: boolean | undefined;
     defaultOpen: boolean;
-    value: string;
-    invalid: boolean;
     defaultValue: string;
     readOnly: boolean;
-    inputValue: string;
-    defaultInputValue: string;
+    invalid: boolean;
+    clearable: boolean;
+    loop: boolean;
     allowCustomValue: boolean;
+    autoHighlight: boolean;
+    getResultCountLabel: (count: number) => string;
     openOnFocus: boolean;
-    getSuggestionCountLabel: (count: number) => string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/autocomplete/Autocomplete.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const R=require("../utils/useOpenChangeComplete.cjs"),M=require("../utils/liveAnnouncer.cjs"),P=require("../utils/PopperRoot.vue.cjs"),g=require("./context.cjs");let u=require("vue");var k=(0,u.defineComponent)({__name:"Autocomplete",props:{value:{default:void 0},defaultValue:{default:""},inputValue:{default:void 0},defaultInputValue:{default:void 0},open:{type:Boolean,default:void 0},defaultOpen:{type:Boolean,default:!1},allowCustomValue:{type:Boolean,default:!0},openOnFocus:{type:Boolean,default:!1},filter:{type:Function,default:void 0},disabled:{type:Boolean,default:!1},readOnly:{type:Boolean,default:!1},invalid:{type:Boolean,default:!1},getSuggestionCountLabel:{type:Function,default:g.defaultGetSuggestionCountLabel}},emits:["update:value","value-change","update:inputValue","input-value-change","update:open","open-change","open-change-complete"],setup(q,{emit:A}){const t=q,o=A,w=(0,u.ref)(null),B=(0,u.ref)(null),p=(0,u.ref)(null),i=(0,u.ref)(null),a=(0,u.ref)(new Map),h=(0,u.ref)(null),V=(0,u.ref)(t.defaultValue),O=(0,u.computed)(()=>t.value===void 0?V.value:t.value),C=(0,u.ref)(t.defaultInputValue??t.defaultValue),r=(0,u.computed)(()=>t.inputValue===void 0?C.value:t.inputValue),_=(0,u.ref)(t.defaultOpen),c=(0,u.computed)(()=>t.open??_.value);R.useOpenChangeComplete(c,p,e=>o("open-change-complete",e));let s=r.value;function y(e){e!==O.value&&(t.value===void 0&&(V.value=e),o("update:value",e),o("value-change",e))}function v(e){e!==r.value&&(t.inputValue===void 0&&(C.value=e),o("update:inputValue",e),o("input-value-change",e))}function d(e){e!==c.value&&(t.open===void 0&&(_.value=e),o("update:open",e),o("open-change",e))}function b(e,l){t.disabled||t.readOnly||(y(e),v(l),s=l,d(!1))}function F(){if(!(t.disabled||t.readOnly)){if(!t.allowCustomValue){v(s),d(!1);return}y(r.value),s=r.value,d(!1)}}function S(){v(s),d(!1)}function T(e){h.value=e,d(!0)}function L(e,l){const n=a.value.get(e);if(n?.value===l.value&&n.text===l.text)return;const m=new Map(a.value);m.set(e,l),a.value=m}function E(e){if(!a.value.has(e))return;const l=new Map(a.value);l.delete(e),a.value=l}let f;(0,u.watch)(c,e=>{if(f!==void 0&&cancelAnimationFrame(f),!e){i.value=null;return}f=requestAnimationFrame(()=>{const l=h.value;if(h.value=null,!l)return;const n=p.value?.querySelectorAll(g.OPTION_SELECTOR);if(!n||n.length===0)return;const m=l==="last"?n[n.length-1]:n[0];i.value===null&&(i.value=m.id)})}),(0,u.onBeforeUnmount)(()=>{f!==void 0&&cancelAnimationFrame(f)});const I=(0,u.computed)(()=>a.value.size);return(0,u.watch)([a,i],([,e])=>{if(e===null)return;const l=Array.from(p.value?.querySelectorAll('[role="option"]:not([data-disabled])')??[]);l.some(n=>n.id===e)||(i.value=l[0]?.id??null)},{flush:"post"}),(0,u.watch)([c,I],([e,l])=>{e&&M.announce(t.getSuggestionCountLabel(l))},{immediate:!0}),(0,u.provide)(g.AUTOCOMPLETE_CONTEXT,{inputRef:w,triggerRef:B,contentRef:p,listId:g.nextAutocompleteListId(),value:O,isSelected:e=>e!==""&&e===O.value,inputValue:r,onInputValueChange:v,open:c,setOpen:d,activeId:i,setActiveId:e=>{i.value=e},openWithHighlight:T,itemCount:I,registerItem:L,unregisterItem:E,getItem:e=>a.value.get(e),matchesFilter:e=>t.filter===void 0||t.filter(e,r.value),commitItem:b,commitInputValue:F,revert:S,get allowCustomValue(){return t.allowCustomValue},get openOnFocus(){return t.openOnFocus},get disabled(){return t.disabled},get readOnly(){return t.readOnly},get invalid(){return t.invalid}}),(e,l)=>((0,u.openBlock)(),(0,u.createBlock)(P.default,null,{default:(0,u.withCtx)(()=>[(0,u.renderSlot)(e.$slots,"default")]),_:3}))}});exports.default=k;
+const z=require("../utils/liveAnnouncer.cjs"),G=require("../utils/useOpenChangeComplete.cjs"),L=require("../utils/scoredFilter.cjs"),K=require("../utils/PopperRoot.vue.cjs"),d=require("./context.cjs"),W=require("./AutocompleteAnatomy.vue.cjs");let t=require("vue");var X=(0,t.defineComponent)({inheritAttrs:!1,__name:"Autocomplete",props:{value:{},defaultValue:{default:""},inputValue:{},defaultInputValue:{},options:{},open:{type:Boolean,default:void 0},defaultOpen:{type:Boolean,default:!1},allowCustomValue:{type:Boolean,default:!0},openOnFocus:{type:Boolean,default:!1},autoHighlight:{type:Boolean,default:!1},loop:{type:Boolean,default:!0},filter:{},disabled:{type:Boolean,default:!1},readOnly:{type:Boolean,default:!1},invalid:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},name:{},form:{},getResultCountLabel:{type:Function,default:d.defaultGetSuggestionCountLabel},ariaLabel:{},placeholder:{},clearable:{type:Boolean,default:!1}},emits:["update:value","value-change","update:inputValue","input-value-change","update:open","open-change","open-change-complete"],setup(v,{expose:R,emit:P}){const l=v,s=P,V=(0,t.ref)(null),S=(0,t.ref)(null),O=(0,t.ref)(null),r=(0,t.ref)(null),o=(0,t.ref)(new Map),b=(0,t.ref)(null),F=(0,t.ref)(l.defaultValue),C=(0,t.computed)(()=>l.value===void 0?F.value:l.value),I=(0,t.ref)(l.defaultInputValue??l.defaultValue),i=(0,t.computed)(()=>l.inputValue===void 0?I.value:l.inputValue),w=(0,t.ref)(l.defaultOpen),c=(0,t.computed)(()=>l.open??w.value);G.useOpenChangeComplete(c,O,e=>s("open-change-complete",e));let m=i.value;function B(e,n,u){if(e===C.value)return;const a=C.value;l.value===void 0&&(F.value=e),s("update:value",e),s("value-change",{value:e,previousValue:a===""?null:a,reason:n,created:u})}function g(e){e!==i.value&&(l.inputValue===void 0&&(I.value=e),s("update:inputValue",e),s("input-value-change",e))}function f(e){e!==c.value&&(l.open===void 0&&(w.value=e),s("update:open",e),s("open-change",e))}function T(e,n,u){l.disabled||l.readOnly||(B(e,u,!1),g(n),m=n,f(!1))}function H(e){if(!(l.disabled||l.readOnly)){if(!l.allowCustomValue){g(m),f(!1);return}B(i.value,e,!0),m=i.value,f(!1)}}function k(e){B("",e,!0),g(""),m="",f(!1)}function E(){g(m),f(!1)}function M(e){b.value=e,f(!0)}function $(e,n){const u=o.value.get(e);if(u?.value===n.value&&u.text===n.text)return;const a=new Map(o.value);a.set(e,n),o.value=a}function N(e){if(!o.value.has(e))return;const n=new Map(o.value);n.delete(e),o.value=n}let h;(0,t.watch)(c,e=>{if(h!==void 0&&cancelAnimationFrame(h),!e){r.value=null;return}h=requestAnimationFrame(()=>{const n=b.value;if(b.value=null,!n)return;const u=O.value;if(!u)return;const a=y();if(a.length===0)return;const _=n==="last"?a[a.length-1]:a[0];r.value===null&&(r.value=_.id,d.scrollIntoPopup(u,_))})}),(0,t.onBeforeUnmount)(()=>{h!==void 0&&cancelAnimationFrame(h)});const q=(0,t.computed)(()=>o.value.size),A=(0,t.computed)(()=>typeof l.filter=="function"?l.filter:l.options?d.defaultOptionsFilter:void 0);function U(e){const n=A.value;if(typeof n!="function")return null;const u=o.value.get(e);if(!u)return null;const a=n(u.text,i.value);return typeof a=="number"?a:null}function y(){const e=O.value;return e?L.orderByScore(e,d.OPTION_SELECTOR,U):[]}(0,t.watch)([o,i,A],()=>y(),{flush:"post"}),(0,t.watch)([o,r],([,e])=>{if(e===null)return;const n=y();n.some(u=>u.id===e)||(r.value=n[0]?.id??null)},{flush:"post"});let p;return(0,t.watch)([()=>l.autoHighlight,c,r,q],([e,n,u])=>{!e||!n||u!==null||(p!==void 0&&cancelAnimationFrame(p),p=requestAnimationFrame(()=>{if(p=void 0,!l.autoHighlight||!c.value||r.value!==null)return;const a=y()[0];a&&(r.value=a.id)}))},{flush:"post"}),(0,t.onBeforeUnmount)(()=>{p!==void 0&&cancelAnimationFrame(p)}),(0,t.watch)([c,q,()=>l.loading],([e,n,u])=>{e&&!u&&z.announce(l.getResultCountLabel(n))},{immediate:!0}),R({checkValidity:()=>V.value?.checkValidity()??!0,reportValidity:()=>V.value?.reportValidity()??!0,setCustomValidity:e=>V.value?.setCustomValidity(e)}),(0,t.provide)(d.AUTOCOMPLETE_CONTEXT,{inputRef:V,triggerRef:S,contentRef:O,listId:d.nextAutocompleteListId(),value:C,isSelected:e=>e!==""&&e===C.value,inputValue:i,onInputValueChange:g,open:c,setOpen:f,activeId:r,setActiveId:e=>{r.value=e},openWithHighlight:M,itemCount:q,registerItem:$,unregisterItem:N,getItem:e=>o.value.get(e),matchesFilter:e=>{const n=A.value;return typeof n!="function"||L.filterKeeps(n(e,i.value))},orderedOptions:y,commitItem:T,commitInputValue:H,revert:E,clear:k,get allowCustomValue(){return l.allowCustomValue},get openOnFocus(){return l.openOnFocus},get loop(){return l.loop},get disabled(){return l.disabled},get readOnly(){return l.readOnly},get invalid(){return l.invalid},get loading(){return l.loading},get name(){return l.name},get form(){return l.form}}),(e,n)=>((0,t.openBlock)(),(0,t.createBlock)(K.default,null,{default:(0,t.withCtx)(()=>[(0,t.renderSlot)(e.$slots,"default",{},()=>[(0,t.createVNode)(W.default,(0,t.mergeProps)(e.$attrs,{options:v.options??[],"aria-label":v.ariaLabel,placeholder:v.placeholder,clearable:v.clearable}),(0,t.createSlots)({_:2},[e.$slots.option?{name:"option",fn:(0,t.withCtx)(u=>[(0,t.renderSlot)(e.$slots,"option",(0,t.normalizeProps)((0,t.guardReactiveProps)(u)))]),key:"0"}:void 0]),1040,["options","aria-label","placeholder","clearable"])])]),_:3}))}});exports.default=X;

package/dist/autocomplete/Autocomplete.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{useOpenChangeComplete as e}from"../utils/useOpenChangeComplete.js";import{announce as t}from"../utils/liveAnnouncer.js";import l from"../utils/PopperRoot.vue.js";import{AUTOCOMPLETE_CONTEXT as u,OPTION_SELECTOR as a,defaultGetSuggestionCountLabel as n,nextAutocompleteListId as o}from"./context.js";import{computed as i,createBlock as d,defineComponent as p,onBeforeUnmount as r,openBlock as s,provide as v,ref as c,renderSlot as f,watch as m,withCtx as g}from"vue";var h=/* @__PURE__ */p({__name:"Autocomplete",props:{value:{default:void 0},defaultValue:{default:""},inputValue:{default:void 0},defaultInputValue:{default:void 0},open:{type:Boolean,default:void 0},defaultOpen:{type:Boolean,default:!1},allowCustomValue:{type:Boolean,default:!0},openOnFocus:{type:Boolean,default:!1},filter:{type:Function,default:void 0},disabled:{type:Boolean,default:!1},readOnly:{type:Boolean,default:!1},invalid:{type:Boolean,default:!1},getSuggestionCountLabel:{type:Function,default:n}},emits:["update:value","value-change","update:inputValue","input-value-change","update:open","open-change","open-change-complete"],setup(n,{emit:p}){const h=n,O=p,C=c(null),V=c(null),y=c(null),I=c(null),A=c(/* @__PURE__ */new Map),B=c(null),b=c(h.defaultValue),w=i(()=>void 0===h.value?b.value:h.value),F=c(h.defaultInputValue??h.defaultValue),S=i(()=>void 0===h.inputValue?F.value:h.inputValue),x=c(h.defaultOpen),L=i(()=>h.open??x.value);e(L,y,e=>O("open-change-complete",e));let T,E=S.value;function R(e){e!==w.value&&(void 0===h.value&&(b.value=e),O("update:value",e),O("value-change",e))}function _(e){e!==S.value&&(void 0===h.inputValue&&(F.value=e),O("update:inputValue",e),O("input-value-change",e))}function j(e){e!==L.value&&(void 0===h.open&&(x.value=e),O("update:open",e),O("open-change",e))}m(L,e=>{void 0!==T&&cancelAnimationFrame(T),e?T=requestAnimationFrame(()=>{const e=B.value;if(B.value=null,!e)return;const t=y.value?.querySelectorAll(a);if(!t||0===t.length)return;const l="last"===e?t[t.length-1]:t[0];null===I.value&&(I.value=l.id)}):I.value=null}),r(()=>{void 0!==T&&cancelAnimationFrame(T)});const M=i(()=>A.value.size);return m([A,I],([,e])=>{if(null===e)return;const t=Array.from(y.value?.querySelectorAll('[role="option"]:not([data-disabled])')??[]);t.some(t=>t.id===e)||(I.value=t[0]?.id??null)},{flush:"post"}),m([L,M],([e,l])=>{e&&t(h.getSuggestionCountLabel(l))},{immediate:!0}),v(u,{inputRef:C,triggerRef:V,contentRef:y,listId:o(),value:w,isSelected:e=>""!==e&&e===w.value,inputValue:S,onInputValueChange:_,open:L,setOpen:j,activeId:I,setActiveId:e=>{I.value=e},openWithHighlight:function(e){B.value=e,j(!0)},itemCount:M,registerItem:function(e,t){const l=A.value.get(e);if(l?.value===t.value&&l.text===t.text)return;const u=new Map(A.value);u.set(e,t),A.value=u},unregisterItem:function(e){if(!A.value.has(e))return;const t=new Map(A.value);t.delete(e),A.value=t},getItem:e=>A.value.get(e),matchesFilter:e=>void 0===h.filter||h.filter(e,S.value),commitItem:function(e,t){h.disabled||h.readOnly||(R(e),_(t),E=t,j(!1))},commitInputValue:function(){if(!h.disabled&&!h.readOnly){if(!h.allowCustomValue)return _(E),void j(!1);R(S.value),E=S.value,j(!1)}},revert:function(){_(E),j(!1)},get allowCustomValue(){return h.allowCustomValue},get openOnFocus(){return h.openOnFocus},get disabled(){return h.disabled},get readOnly(){return h.readOnly},get invalid(){return h.invalid}}),(e,t)=>(s(),d(l,null,{default:g(()=>[f(e.$slots,"default")]),_:3}))}});export{h as default};
+import{announce as e}from"../utils/liveAnnouncer.js";import{useOpenChangeComplete as t}from"../utils/useOpenChangeComplete.js";import{filterKeeps as l,orderByScore as a}from"../utils/scoredFilter.js";import n from"../utils/PopperRoot.vue.js";import{AUTOCOMPLETE_CONTEXT as u,OPTION_SELECTOR as o,defaultGetSuggestionCountLabel as i,defaultOptionsFilter as r,nextAutocompleteListId as s,scrollIntoPopup as p}from"./context.js";import d from"./AutocompleteAnatomy.vue.js";import{computed as c,createBlock as v,createSlots as f,createVNode as m,defineComponent as g,guardReactiveProps as h,mergeProps as y,normalizeProps as V,onBeforeUnmount as O,openBlock as C,provide as b,ref as B,renderSlot as A,watch as I,withCtx as F}from"vue";var w=/* @__PURE__ */g({inheritAttrs:!1,__name:"Autocomplete",props:{value:{},defaultValue:{default:""},inputValue:{},defaultInputValue:{},options:{},open:{type:Boolean,default:void 0},defaultOpen:{type:Boolean,default:!1},allowCustomValue:{type:Boolean,default:!0},openOnFocus:{type:Boolean,default:!1},autoHighlight:{type:Boolean,default:!1},loop:{type:Boolean,default:!0},filter:{},disabled:{type:Boolean,default:!1},readOnly:{type:Boolean,default:!1},invalid:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},name:{},form:{},getResultCountLabel:{type:Function,default:i},ariaLabel:{},placeholder:{},clearable:{type:Boolean,default:!1}},emits:["update:value","value-change","update:inputValue","input-value-change","update:open","open-change","open-change-complete"],setup(i,{expose:g,emit:w}){const x=i,L=w,R=B(null),P=B(null),j=B(null),S=B(null),T=B(/* @__PURE__ */new Map),_=B(null),k=B(x.defaultValue),E=c(()=>void 0===x.value?k.value:x.value),H=B(x.defaultInputValue??x.defaultValue),M=c(()=>void 0===x.inputValue?H.value:x.inputValue),$=B(x.defaultOpen),N=c(()=>x.open??$.value);t(N,j,e=>L("open-change-complete",e));let q,z=M.value;function U(e,t,l){if(e===E.value)return;const a=E.value;void 0===x.value&&(k.value=e),L("update:value",e),L("value-change",{value:e,previousValue:""===a?null:a,reason:t,created:l})}function G(e){e!==M.value&&(void 0===x.inputValue&&(H.value=e),L("update:inputValue",e),L("input-value-change",e))}function K(e){e!==N.value&&(void 0===x.open&&($.value=e),L("update:open",e),L("open-change",e))}I(N,e=>{void 0!==q&&cancelAnimationFrame(q),e?q=requestAnimationFrame(()=>{const e=_.value;if(_.value=null,!e)return;const t=j.value;if(!t)return;const l=J();if(0===l.length)return;const a="last"===e?l[l.length-1]:l[0];null===S.value&&(S.value=a.id,p(t,a))}):S.value=null}),O(()=>{void 0!==q&&cancelAnimationFrame(q)});const W=c(()=>T.value.size),X=c(()=>"function"==typeof x.filter?x.filter:x.options?r:void 0);function D(e){const t=X.value;if("function"!=typeof t)return null;const l=T.value.get(e);if(!l)return null;const a=t(l.text,M.value);return"number"==typeof a?a:null}function J(){const e=j.value;return e?a(e,o,D):[]}let Q;return I([T,M,X],()=>J(),{flush:"post"}),I([T,S],([,e])=>{if(null===e)return;const t=J();t.some(t=>t.id===e)||(S.value=t[0]?.id??null)},{flush:"post"}),I([()=>x.autoHighlight,N,S,W],([e,t,l])=>{!e||!t||null!==l||(void 0!==Q&&cancelAnimationFrame(Q),Q=requestAnimationFrame(()=>{if(Q=void 0,!x.autoHighlight||!N.value||null!==S.value)return;const e=J()[0];e&&(S.value=e.id)}))},{flush:"post"}),O(()=>{void 0!==Q&&cancelAnimationFrame(Q)}),I([N,W,()=>x.loading],([t,l,a])=>{t&&!a&&e(x.getResultCountLabel(l))},{immediate:!0}),g({checkValidity:()=>R.value?.checkValidity()??!0,reportValidity:()=>R.value?.reportValidity()??!0,setCustomValidity:e=>R.value?.setCustomValidity(e)}),b(u,{inputRef:R,triggerRef:P,contentRef:j,listId:s(),value:E,isSelected:e=>""!==e&&e===E.value,inputValue:M,onInputValueChange:G,open:N,setOpen:K,activeId:S,setActiveId:e=>{S.value=e},openWithHighlight:function(e){_.value=e,K(!0)},itemCount:W,registerItem:function(e,t){const l=T.value.get(e);if(l?.value===t.value&&l.text===t.text)return;const a=new Map(T.value);a.set(e,t),T.value=a},unregisterItem:function(e){if(!T.value.has(e))return;const t=new Map(T.value);t.delete(e),T.value=t},getItem:e=>T.value.get(e),matchesFilter:e=>{const t=X.value;return"function"!=typeof t||l(t(e,M.value))},orderedOptions:J,commitItem:function(e,t,l){x.disabled||x.readOnly||(U(e,l,!1),G(t),z=t,K(!1))},commitInputValue:function(e){if(!x.disabled&&!x.readOnly){if(!x.allowCustomValue)return G(z),void K(!1);U(M.value,e,!0),z=M.value,K(!1)}},revert:function(){G(z),K(!1)},clear:function(e){U("",e,!0),G(""),z="",K(!1)},get allowCustomValue(){return x.allowCustomValue},get openOnFocus(){return x.openOnFocus},get loop(){return x.loop},get disabled(){return x.disabled},get readOnly(){return x.readOnly},get invalid(){return x.invalid},get loading(){return x.loading},get name(){return x.name},get form(){return x.form}}),(e,t)=>(C(),v(n,null,{default:F(()=>[A(e.$slots,"default",{},()=>[m(d,y(e.$attrs,{options:i.options??[],"aria-label":i.ariaLabel,placeholder:i.placeholder,clearable:i.clearable}),f({_:2},[e.$slots.option?{name:"option",fn:F(t=>[A(e.$slots,"option",V(h(t)))]),key:"0"}:void 0]),1040,["options","aria-label","placeholder","clearable"])])]),_:3}))}});export{w as default};

package/dist/autocomplete/AutocompleteAnatomy.vue.cjs

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