@skdx/vue 0.27.0 → 0.29.0

package/dist/autocomplete/AutocompleteInput.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const y=require("../utils/reassertValue.cjs"),I=require("../utils/popper.cjs"),c=require("./context.cjs");let n=require("vue");var h=["aria-expanded","aria-controls","aria-activedescendant","disabled","readonly","aria-invalid","aria-readonly","data-invalid","data-readonly","data-disabled","data-state","value"],x=(0,n.defineComponent)({__name:"AutocompleteInput",setup(A){const l=(0,n.inject)(c.AUTOCOMPLETE_CONTEXT);if(!l)throw new Error("SkdxAutocompleteInput must be used within SkdxAutocomplete.");const e=l,r=(0,n.inject)(I.POPPER_CONTEXT);if(!r)throw new Error("SkdxAutocompleteInput must be used within SkdxAutocomplete.");const i=(0,n.ref)(null);(0,n.onMounted)(()=>{e.inputRef.value=i.value,r.setAnchor(i.value)}),(0,n.onBeforeUnmount)(()=>{r.anchor.value===i.value&&r.setAnchor(null)});function d(t){const a=e.contentRef.value;if(!a)return;const u=Array.from(a.querySelectorAll(c.OPTION_SELECTOR));if(u.length===0)return;let o=u.findIndex(_=>_.id===e.activeId.value)+t;o<0&&(o=0),o>=u.length&&(o=u.length-1),e.setActiveId(u[o].id)}function p(){const t=e.activeId.value?e.getItem(e.activeId.value):void 0;return t?(e.commitItem(t.value,t.text||t.value),!0):!1}function s(t){const a=t.target;e.onInputValueChange(a.value),e.open.value||e.setOpen(!0),y.reassertValue(a,()=>e.inputValue.value)}function f(){e.openOnFocus&&!e.readOnly&&!e.open.value&&e.setOpen(!0)}function v(){e.commitInputValue()}function m(t){t.key==="ArrowDown"?(t.preventDefault(),e.open.value?d(1):e.openWithHighlight("first")):t.key==="ArrowUp"?(t.preventDefault(),e.open.value?d(-1):e.openWithHighlight("last")):t.key==="Enter"?p()?t.preventDefault():e.allowCustomValue&&e.inputValue.value!==""&&(t.preventDefault(),e.commitInputValue()):t.key==="Escape"?e.open.value&&!e.contentRef.value&&(t.preventDefault(),e.revert()):t.key==="Tab"&&e.commitInputValue()}return(t,a)=>((0,n.openBlock)(),(0,n.createElementBlock)("input",{class:"skdx-autocomplete__input","data-part":"input",ref_key:"elRef",ref:i,type:"text",role:"combobox","aria-expanded":(0,n.unref)(e).open.value,"aria-controls":(0,n.unref)(e).listId,"aria-autocomplete":"list","aria-activedescendant":(0,n.unref)(e).activeId.value??void 0,autocomplete:"off",disabled:(0,n.unref)(e).disabled||void 0,readonly:(0,n.unref)(e).readOnly||void 0,"aria-invalid":(0,n.unref)(e).invalid?!0:void 0,"aria-readonly":(0,n.unref)(e).readOnly?!0:void 0,"data-invalid":(0,n.unref)(e).invalid?"":void 0,"data-readonly":(0,n.unref)(e).readOnly?"":void 0,"data-disabled":(0,n.unref)(e).disabled?"":void 0,"data-state":(0,n.unref)(e).open.value?"open":"closed",value:(0,n.unref)(e).inputValue.value,onInput:s,onFocus:f,onBlur:v,onKeydown:m},null,40,h))}});exports.default=x;
+const I=require("../utils/injectRequired.cjs"),b=require("../utils/reassertValue.cjs"),x=require("../utils/popper.cjs"),O=require("./context.cjs");let n=require("vue");var w=["aria-expanded","aria-controls","aria-activedescendant","name","form","disabled","readonly","aria-invalid","aria-readonly","aria-busy","data-invalid","data-readonly","data-loading","data-disabled","data-state","value"],E=(0,n.defineComponent)({__name:"AutocompleteInput",setup(q,{expose:s}){const e=I.injectRequired(O.AUTOCOMPLETE_CONTEXT,"SkdxAutocompleteInput must be used within SkdxAutocomplete."),o=(0,n.inject)(x.POPPER_CONTEXT);if(!o)throw new Error("SkdxAutocompleteInput must be used within SkdxAutocomplete.");const r=(0,n.ref)(null);(0,n.onMounted)(()=>{e.inputRef.value=r.value,o.setAnchor(r.value)}),(0,n.onBeforeUnmount)(()=>{o.anchor.value===r.value&&o.setAnchor(null)});function i(t){e.setActiveId(t.id),t.scrollIntoView?.({block:"nearest"})}function p(t){const a=e.orderedOptions();if(a.length===0)return;const f=a.findIndex(A=>A.id===e.activeId.value);let u=f;f===-1&&(u=t===1?-1:0),i(a[e.loop?(u+t+a.length)%a.length:Math.min(a.length-1,Math.max(0,u+t))])}function c(t){const a=e.orderedOptions();a.length!==0&&i(t==="last"?a[a.length-1]:a[0])}function l(){const t=e.activeId.value?e.getItem(e.activeId.value):void 0;return t?(e.commitItem(t.value,t.text||t.value,"keyboard"),!0):!1}function v(t){const a=t.target;e.onInputValueChange(a.value),e.open.value||e.setOpen(!0),b.reassertValue(a,()=>e.inputValue.value)}function m(){e.openOnFocus&&!e.readOnly&&!e.open.value&&e.setOpen(!0)}function y(){e.commitInputValue("pointer")}function _(t){return t.key==="ArrowDown"?(t.preventDefault(),e.open.value||e.setOpen(!0),!0):t.key==="ArrowUp"?(t.preventDefault(),!l()&&e.open.value&&e.setOpen(!1),!0):!1}function d(t,a){t.preventDefault(),e.open.value?p(a):e.openWithHighlight(a===1?"first":"last")}function h(t){e.open.value&&(t.preventDefault(),c(t.key==="Home"?"first":"last"))}function k(t){l()?t.preventDefault():e.allowCustomValue&&e.inputValue.value!==""?(t.preventDefault(),e.commitInputValue("keyboard")):e.open.value&&e.setOpen(!1)}function g(t){e.disabled||t.altKey&&_(t)||(t.key==="ArrowDown"?d(t,1):t.key==="ArrowUp"?d(t,-1):t.key==="Home"||t.key==="End"?h(t):t.key==="Enter"?k(t):t.key==="Escape"?e.open.value&&!e.contentRef.value&&(t.preventDefault(),e.revert()):t.key==="Tab"&&e.commitInputValue("keyboard"))}return s({focus:t=>r.value?.focus(t),el:r}),(t,a)=>((0,n.openBlock)(),(0,n.createElementBlock)("input",{ref_key:"elRef",ref:r,class:"skdx-autocomplete__input","data-part":"input",type:"text",role:"combobox","aria-expanded":(0,n.unref)(e).open.value,"aria-controls":(0,n.unref)(e).listId,"aria-autocomplete":"list","aria-activedescendant":(0,n.unref)(e).activeId.value??void 0,autocomplete:"off",name:(0,n.unref)(e).name,form:(0,n.unref)(e).form,disabled:(0,n.unref)(e).disabled||void 0,readonly:(0,n.unref)(e).readOnly||void 0,"aria-invalid":(0,n.unref)(e).invalid?!0:void 0,"aria-readonly":(0,n.unref)(e).readOnly?!0:void 0,"aria-busy":(0,n.unref)(e).loading?!0:void 0,"data-invalid":(0,n.unref)(e).invalid?"":void 0,"data-readonly":(0,n.unref)(e).readOnly?"":void 0,"data-loading":(0,n.unref)(e).loading?"":void 0,"data-disabled":(0,n.unref)(e).disabled?"":void 0,"data-state":(0,n.unref)(e).open.value?"open":"closed",value:(0,n.unref)(e).inputValue.value,onInput:v,onFocus:m,onBlur:y,onKeydown:g},null,40,w))}});exports.default=E;

package/dist/autocomplete/AutocompleteInput.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{reassertValue as e}from"../utils/reassertValue.js";import{POPPER_CONTEXT as a}from"../utils/popper.js";import{AUTOCOMPLETE_CONTEXT as t,OPTION_SELECTOR as n}from"./context.js";import{createElementBlock as o,defineComponent as l,inject as u,onBeforeUnmount as i,onMounted as r,openBlock as d,ref as s,unref as p}from"vue";var v=["aria-expanded","aria-controls","aria-activedescendant","disabled","readonly","aria-invalid","aria-readonly","data-invalid","data-readonly","data-disabled","data-state","value"],c=/* @__PURE__ */l({__name:"AutocompleteInput",setup(l){const c=u(t);if(!c)throw new Error("SkdxAutocompleteInput must be used within SkdxAutocomplete.");const f=c,m=u(a);if(!m)throw new Error("SkdxAutocompleteInput must be used within SkdxAutocomplete.");const y=s(null);function I(e){const a=f.contentRef.value;if(!a)return;const t=Array.from(a.querySelectorAll(n));if(0===t.length)return;let o=t.findIndex(e=>e.id===f.activeId.value)+e;o<0&&(o=0),o>=t.length&&(o=t.length-1),f.setActiveId(t[o].id)}function h(a){const t=a.target;f.onInputValueChange(t.value),f.open.value||f.setOpen(!0),e(t,()=>f.inputValue.value)}function O(){f.openOnFocus&&!f.readOnly&&!f.open.value&&f.setOpen(!0)}function k(){f.commitInputValue()}function x(e){"ArrowDown"===e.key?(e.preventDefault(),f.open.value?I(1):f.openWithHighlight("first")):"ArrowUp"===e.key?(e.preventDefault(),f.open.value?I(-1):f.openWithHighlight("last")):"Enter"===e.key?function(){const e=f.activeId.value?f.getItem(f.activeId.value):void 0;return!!e&&(f.commitItem(e.value,e.text||e.value),!0)}()?e.preventDefault():f.allowCustomValue&&""!==f.inputValue.value&&(e.preventDefault(),f.commitInputValue()):"Escape"===e.key?f.open.value&&!f.contentRef.value&&(e.preventDefault(),f.revert()):"Tab"===e.key&&f.commitInputValue()}return r(()=>{f.inputRef.value=y.value,m.setAnchor(y.value)}),i(()=>{m.anchor.value===y.value&&m.setAnchor(null)}),(e,a)=>(d(),o("input",{class:"skdx-autocomplete__input","data-part":"input",ref_key:"elRef",ref:y,type:"text",role:"combobox","aria-expanded":p(f).open.value,"aria-controls":p(f).listId,"aria-autocomplete":"list","aria-activedescendant":p(f).activeId.value??void 0,autocomplete:"off",disabled:p(f).disabled||void 0,readonly:p(f).readOnly||void 0,"aria-invalid":!!p(f).invalid||void 0,"aria-readonly":!!p(f).readOnly||void 0,"data-invalid":p(f).invalid?"":void 0,"data-readonly":p(f).readOnly?"":void 0,"data-disabled":p(f).disabled?"":void 0,"data-state":p(f).open.value?"open":"closed",value:p(f).inputValue.value,onInput:h,onFocus:O,onBlur:k,onKeydown:x},null,40,v))}});export{c as default};
+import{injectRequired as e}from"../utils/injectRequired.js";import{reassertValue as a}from"../utils/reassertValue.js";import{POPPER_CONTEXT as t}from"../utils/popper.js";import{AUTOCOMPLETE_CONTEXT as n}from"./context.js";import{createElementBlock as o,defineComponent as l,inject as i,onBeforeUnmount as u,onMounted as r,openBlock as d,ref as s,unref as p}from"vue";var c=["aria-expanded","aria-controls","aria-activedescendant","name","form","disabled","readonly","aria-invalid","aria-readonly","aria-busy","data-invalid","data-readonly","data-loading","data-disabled","data-state","value"],v=/* @__PURE__ */l({__name:"AutocompleteInput",setup(l,{expose:v}){const f=e(n,"SkdxAutocompleteInput must be used within SkdxAutocomplete."),m=i(t);if(!m)throw new Error("SkdxAutocompleteInput must be used within SkdxAutocomplete.");const y=s(null);function k(e){f.setActiveId(e.id),e.scrollIntoView?.({block:"nearest"})}function b(){const e=f.activeId.value?f.getItem(f.activeId.value):void 0;return!!e&&(f.commitItem(e.value,e.text||e.value,"keyboard"),!0)}function h(e){const t=e.target;f.onInputValueChange(t.value),f.open.value||f.setOpen(!0),a(t,()=>f.inputValue.value)}function I(){f.openOnFocus&&!f.readOnly&&!f.open.value&&f.setOpen(!0)}function O(){f.commitInputValue("pointer")}function g(e,a){e.preventDefault(),f.open.value?function(e){const a=f.orderedOptions();if(0===a.length)return;const t=a.findIndex(e=>e.id===f.activeId.value);let n=t;-1===t&&(n=1===e?-1:0),k(a[f.loop?(n+e+a.length)%a.length:Math.min(a.length-1,Math.max(0,n+e))])}(a):f.openWithHighlight(1===a?"first":"last")}function x(e){f.disabled||e.altKey&&function(e){return"ArrowDown"===e.key?(e.preventDefault(),f.open.value||f.setOpen(!0),!0):"ArrowUp"===e.key&&(e.preventDefault(),!b()&&f.open.value&&f.setOpen(!1),!0)}(e)||("ArrowDown"===e.key?g(e,1):"ArrowUp"===e.key?g(e,-1):"Home"===e.key||"End"===e.key?function(e){f.open.value&&(e.preventDefault(),function(e){const a=f.orderedOptions();0!==a.length&&k("last"===e?a[a.length-1]:a[0])}("Home"===e.key?"first":"last"))}(e):"Enter"===e.key?function(e){b()?e.preventDefault():f.allowCustomValue&&""!==f.inputValue.value?(e.preventDefault(),f.commitInputValue("keyboard")):f.open.value&&f.setOpen(!1)}(e):"Escape"===e.key?f.open.value&&!f.contentRef.value&&(e.preventDefault(),f.revert()):"Tab"===e.key&&f.commitInputValue("keyboard"))}return r(()=>{f.inputRef.value=y.value,m.setAnchor(y.value)}),u(()=>{m.anchor.value===y.value&&m.setAnchor(null)}),v({focus:e=>y.value?.focus(e),el:y}),(e,a)=>(d(),o("input",{ref_key:"elRef",ref:y,class:"skdx-autocomplete__input","data-part":"input",type:"text",role:"combobox","aria-expanded":p(f).open.value,"aria-controls":p(f).listId,"aria-autocomplete":"list","aria-activedescendant":p(f).activeId.value??void 0,autocomplete:"off",name:p(f).name,form:p(f).form,disabled:p(f).disabled||void 0,readonly:p(f).readOnly||void 0,"aria-invalid":!!p(f).invalid||void 0,"aria-readonly":!!p(f).readOnly||void 0,"aria-busy":!!p(f).loading||void 0,"data-invalid":p(f).invalid?"":void 0,"data-readonly":p(f).readOnly?"":void 0,"data-loading":p(f).loading?"":void 0,"data-disabled":p(f).disabled?"":void 0,"data-state":p(f).open.value?"open":"closed",value:p(f).inputValue.value,onInput:h,onFocus:I,onBlur:O,onKeydown:x},null,40,c))}});export{v as default};

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

@@ -1,24 +1,4 @@
-/**
- * One suggestion inside `SkdxAutocompleteList`. Renders a `<div role="option">`
- * with `data-value`, `aria-selected` (true only for the suggestion matching the
- * *committed* value), `data-state` (`"checked" | "unchecked"`),
- * `data-highlighted` for virtual focus — the attribute the brand layer styles
- * the "keyboard cursor" from, since real DOM focus stays on the input — and
- * `data-disabled`.
- *
- * Registers itself, and its text, with the root: that is how
- * `SkdxAutocompleteEmpty` knows the list is empty, how the suggestion-count
- * announcement gets its number, and how Enter knows what the highlighted option
- * commits to. Click commits the suggestion, writes its text into the input,
- * closes the popup and returns focus to the input. Pointer hover moves the
- * highlight onto it.
- *
- * With a `filter` predicate on the root, a rejected item renders **nothing at
- * all** and unregisters itself — it is absent from the DOM rather than hidden,
- * because a hidden option is still reachable through `aria-activedescendant`
- * and would still be counted as a suggestion. Must be used inside
- * `SkdxAutocomplete`.
- */
+/** One suggestion inside the List; renders a div role="option" with aria-selected and data-highlighted state. */
 type __VLS_Props = {
     /** Value committed to the autocomplete root when this suggestion is chosen. */
     value: string;
@@ -26,22 +6,20 @@ type __VLS_Props = {
      * Excludes this suggestion from selection and pointer highlight.
      * @default false
      */
-    disabled?: boolean;
+    disabled?: boolean | undefined;
     /**
-     * Text the root's `filter` predicate matches against, and the text a commit
-     * writes back into `SkdxAutocompleteInput`. Only needed when the item renders
-     * more than its label (an icon, a secondary line).
+     * Text matched by the filter predicate and written to the Input on commit.
      * @default undefined — falls back to the item's rendered text content.
      */
-    textValue?: string;
+    textValue?: string | undefined;
 };
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
-    disabled: boolean;
-    textValue: string;
+    disabled: boolean | undefined;
+    textValue: string | undefined;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

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

@@ -1,24 +1,4 @@
-/**
- * One suggestion inside `SkdxAutocompleteList`. Renders a `<div role="option">`
- * with `data-value`, `aria-selected` (true only for the suggestion matching the
- * *committed* value), `data-state` (`"checked" | "unchecked"`),
- * `data-highlighted` for virtual focus — the attribute the brand layer styles
- * the "keyboard cursor" from, since real DOM focus stays on the input — and
- * `data-disabled`.
- *
- * Registers itself, and its text, with the root: that is how
- * `SkdxAutocompleteEmpty` knows the list is empty, how the suggestion-count
- * announcement gets its number, and how Enter knows what the highlighted option
- * commits to. Click commits the suggestion, writes its text into the input,
- * closes the popup and returns focus to the input. Pointer hover moves the
- * highlight onto it.
- *
- * With a `filter` predicate on the root, a rejected item renders **nothing at
- * all** and unregisters itself — it is absent from the DOM rather than hidden,
- * because a hidden option is still reachable through `aria-activedescendant`
- * and would still be counted as a suggestion. Must be used inside
- * `SkdxAutocomplete`.
- */
+/** One suggestion inside the List; renders a div role="option" with aria-selected and data-highlighted state. */
 type __VLS_Props = {
     /** Value committed to the autocomplete root when this suggestion is chosen. */
     value: string;
@@ -26,22 +6,20 @@ type __VLS_Props = {
      * Excludes this suggestion from selection and pointer highlight.
      * @default false
      */
-    disabled?: boolean;
+    disabled?: boolean | undefined;
     /**
-     * Text the root's `filter` predicate matches against, and the text a commit
-     * writes back into `SkdxAutocompleteInput`. Only needed when the item renders
-     * more than its label (an icon, a secondary line).
+     * Text matched by the filter predicate and written to the Input on commit.
      * @default undefined — falls back to the item's rendered text content.
      */
-    textValue?: string;
+    textValue?: string | undefined;
 };
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
-    disabled: boolean;
-    textValue: string;
+    disabled: boolean | undefined;
+    textValue: string | undefined;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/autocomplete/AutocompleteItem.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const f=require("./context.cjs");let e=require("vue");var x=["id","data-value","aria-selected","aria-disabled","data-state","data-highlighted","data-disabled"],g=(0,e.defineComponent)({__name:"AutocompleteItem",props:{value:{},disabled:{type:Boolean,default:!1},textValue:{default:void 0}},setup(i){const a=i,r=(0,e.inject)(f.AUTOCOMPLETE_CONTEXT);if(!r)throw new Error("SkdxAutocompleteItem must be used within SkdxAutocomplete.");const t=r,u=f.nextAutocompleteItemId(),c=(0,e.ref)(null),s=(0,e.computed)(()=>t.isSelected(a.value)),p=(0,e.computed)(()=>t.activeId.value===u),n=(0,e.computed)(()=>a.disabled||t.disabled||t.readOnly),l=(0,e.ref)(a.textValue??null);function v(){const o=a.textValue??c.value?.textContent;o!=null&&o!==l.value&&(l.value=o)}const d=(0,e.computed)(()=>l.value===null||t.matchesFilter(l.value));function m(){d.value?t.registerItem(u,{value:a.value,text:l.value??""}):t.unregisterItem(u)}(0,e.onMounted)(()=>{v(),m()}),(0,e.onUpdated)(v),(0,e.watch)([d,()=>a.value,l],m),(0,e.onBeforeUnmount)(()=>t.unregisterItem(u));function h(){n.value||(t.commitItem(a.value,l.value??a.value),t.inputRef.value?.focus())}function _(){n.value||t.setActiveId(u)}return(o,I)=>d.value?((0,e.openBlock)(),(0,e.createElementBlock)("div",{key:0,class:"skdx-autocomplete__item","data-part":"item",ref_key:"itemRef",ref:c,role:"option",id:(0,e.unref)(u),"data-value":i.value,"aria-selected":s.value,"aria-disabled":n.value?!0:void 0,"data-state":s.value?"checked":"unchecked","data-highlighted":p.value?"":void 0,"data-disabled":n.value?"":void 0,onClick:h,onPointerenter:_},[(0,e.renderSlot)(o.$slots,"default")],40,x)):(0,e.createCommentVNode)("",!0)}});exports.default=g;
+const h=require("../utils/injectRequired.cjs"),m=require("./context.cjs");let e=require("vue");var x=["id","data-value","aria-selected","aria-disabled","data-state","data-highlighted","data-disabled"],g=(0,e.defineComponent)({__name:"AutocompleteItem",props:{value:{},disabled:{type:Boolean,default:!1},textValue:{default:void 0}},setup(d){const a=d,t=h.injectRequired(m.AUTOCOMPLETE_CONTEXT,"SkdxAutocompleteItem must be used within SkdxAutocomplete."),l=m.nextAutocompleteItemId(),r=(0,e.ref)(null),c=(0,e.computed)(()=>t.isSelected(a.value)),f=(0,e.computed)(()=>t.activeId.value===l),o=(0,e.computed)(()=>a.disabled||t.disabled||t.readOnly),u=(0,e.ref)(a.textValue??null);function s(){const i=a.textValue??r.value?.textContent;i!=null&&i!==u.value&&(u.value=i)}const n=(0,e.computed)(()=>u.value===null||t.matchesFilter(u.value));function v(){n.value?t.registerItem(l,{value:a.value,text:u.value??""}):t.unregisterItem(l)}(0,e.onMounted)(()=>{s(),v()}),(0,e.onUpdated)(s),(0,e.watch)([n,()=>a.value,u],v),(0,e.onBeforeUnmount)(()=>t.unregisterItem(l));function p(){o.value||(t.commitItem(a.value,u.value??a.value,"pointer"),t.inputRef.value?.focus())}function _(){o.value||t.setActiveId(l)}return(i,I)=>n.value?((0,e.openBlock)(),(0,e.createElementBlock)("div",{key:0,id:(0,e.unref)(l),ref_key:"itemRef",ref:r,class:"skdx-autocomplete__item","data-part":"item",role:"option","data-value":d.value,"aria-selected":c.value,"aria-disabled":o.value?!0:void 0,"data-state":c.value?"checked":"unchecked","data-highlighted":f.value?"":void 0,"data-disabled":o.value?"":void 0,onClick:p,onPointerenter:_},[(0,e.renderSlot)(i.$slots,"default")],40,x)):(0,e.createCommentVNode)("",!0)}});exports.default=g;

package/dist/autocomplete/AutocompleteItem.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{AUTOCOMPLETE_CONTEXT as e,nextAutocompleteItemId as t}from"./context.js";import{computed as a,createCommentVNode as l,createElementBlock as u,defineComponent as o,inject as d,onBeforeUnmount as n,onMounted as i,onUpdated as s,openBlock as r,ref as v,renderSlot as c,unref as m,watch as f}from"vue";var p=["id","data-value","aria-selected","aria-disabled","data-state","data-highlighted","data-disabled"],h=/* @__PURE__ */o({__name:"AutocompleteItem",props:{value:{},disabled:{type:Boolean,default:!1},textValue:{default:void 0}},setup(o){const h=o,x=d(e);if(!x)throw new Error("SkdxAutocompleteItem must be used within SkdxAutocomplete.");const k=x,I=t(),b=v(null),g=a(()=>k.isSelected(h.value)),A=a(()=>k.activeId.value===I),C=a(()=>h.disabled||k.disabled||k.readOnly),_=v(h.textValue??null);function E(){const e=h.textValue??b.value?.textContent;null!=e&&e!==_.value&&(_.value=e)}const w=a(()=>null===_.value||k.matchesFilter(_.value));function y(){w.value?k.registerItem(I,{value:h.value,text:_.value??""}):k.unregisterItem(I)}function B(){C.value||(k.commitItem(h.value,_.value??h.value),k.inputRef.value?.focus())}function O(){C.value||k.setActiveId(I)}return i(()=>{E(),y()}),s(E),f([w,()=>h.value,_],y),n(()=>k.unregisterItem(I)),(e,t)=>w.value?(r(),u("div",{key:0,class:"skdx-autocomplete__item","data-part":"item",ref_key:"itemRef",ref:b,role:"option",id:m(I),"data-value":o.value,"aria-selected":g.value,"aria-disabled":!!C.value||void 0,"data-state":g.value?"checked":"unchecked","data-highlighted":A.value?"":void 0,"data-disabled":C.value?"":void 0,onClick:B,onPointerenter:O},[c(e.$slots,"default")],40,p)):l("",!0)}});export{h as default};
+import{injectRequired as e}from"../utils/injectRequired.js";import{AUTOCOMPLETE_CONTEXT as t,nextAutocompleteItemId as a}from"./context.js";import{computed as l,createCommentVNode as u,createElementBlock as d,defineComponent as o,onBeforeUnmount as i,onMounted as n,onUpdated as s,openBlock as r,ref as v,renderSlot as c,unref as m,watch as p}from"vue";var f=["id","data-value","aria-selected","aria-disabled","data-state","data-highlighted","data-disabled"],h=/* @__PURE__ */o({__name:"AutocompleteItem",props:{value:{},disabled:{type:Boolean,default:!1},textValue:{default:void 0}},setup(o){const h=o,x=e(t,"SkdxAutocompleteItem must be used within SkdxAutocomplete."),k=a(),I=v(null),b=l(()=>x.isSelected(h.value)),g=l(()=>x.activeId.value===k),A=l(()=>h.disabled||x.disabled||x.readOnly),C=v(h.textValue??null);function _(){const e=h.textValue??I.value?.textContent;null!=e&&e!==C.value&&(C.value=e)}const j=l(()=>null===C.value||x.matchesFilter(C.value));function y(){j.value?x.registerItem(k,{value:h.value,text:C.value??""}):x.unregisterItem(k)}function B(){A.value||(x.commitItem(h.value,C.value??h.value,"pointer"),x.inputRef.value?.focus())}function E(){A.value||x.setActiveId(k)}return n(()=>{_(),y()}),s(_),p([j,()=>h.value,C],y),i(()=>x.unregisterItem(k)),(e,t)=>j.value?(r(),d("div",{key:0,id:m(k),ref_key:"itemRef",ref:I,class:"skdx-autocomplete__item","data-part":"item",role:"option","data-value":o.value,"aria-selected":b.value,"aria-disabled":!!A.value||void 0,"data-state":b.value?"checked":"unchecked","data-highlighted":g.value?"":void 0,"data-disabled":A.value?"":void 0,onClick:B,onPointerenter:E},[c(e.$slots,"default")],40,f)):u("",!0)}});export{h as default};

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

@@ -1,17 +1,4 @@
-/**
- * The `role="listbox"` holding an `SkdxAutocomplete`'s suggestions. Carries the
- * id the input's `aria-controls` points at, so it must be rendered whenever the
- * popup is — a dangling `aria-controls` is an axe violation.
- *
- * Split out from `SkdxAutocompleteContent` rather than merged into it so the
- * popup can also hold things that are *not* options — a heading, a "showing 10
- * of 400" footer, an `SkdxAutocompleteEmpty` — without those becoming children
- * of a listbox, where a screen reader would report them as broken options.
- *
- * `role="listbox"` has no implicit accessible name: pass `aria-label` or
- * `aria-labelledby` saying what the list is *of*. Must be used inside
- * `SkdxAutocomplete`.
- */
+/** The role="listbox" holding suggestions, with the id the input's aria-controls points at. */
 type __VLS_Props = {};
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {

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

@@ -1,17 +1,4 @@
-/**
- * The `role="listbox"` holding an `SkdxAutocomplete`'s suggestions. Carries the
- * id the input's `aria-controls` points at, so it must be rendered whenever the
- * popup is — a dangling `aria-controls` is an axe violation.
- *
- * Split out from `SkdxAutocompleteContent` rather than merged into it so the
- * popup can also hold things that are *not* options — a heading, a "showing 10
- * of 400" footer, an `SkdxAutocompleteEmpty` — without those becoming children
- * of a listbox, where a screen reader would report them as broken options.
- *
- * `role="listbox"` has no implicit accessible name: pass `aria-label` or
- * `aria-labelledby` saying what the list is *of*. Must be used inside
- * `SkdxAutocomplete`.
- */
+/** The role="listbox" holding suggestions, with the id the input's aria-controls points at. */
 type __VLS_Props = {};
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {

package/dist/autocomplete/AutocompleteList.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const r=require("./context.cjs");let e=require("vue");var u=["id"],l=(0,e.defineComponent)({__name:"AutocompleteList",setup(s){const t=(0,e.inject)(r.AUTOCOMPLETE_CONTEXT);if(!t)throw new Error("SkdxAutocompleteList must be used within SkdxAutocomplete.");return(o,i)=>((0,e.openBlock)(),(0,e.createElementBlock)("div",{class:"skdx-autocomplete__list","data-part":"list",role:"listbox",id:(0,e.unref)(t).listId},[(0,e.renderSlot)(o.$slots,"default")],8,u))}});exports.default=l;
+const o=require("../utils/injectRequired.cjs"),u=require("./context.cjs");let e=require("vue");var i=["id"],s=(0,e.defineComponent)({__name:"AutocompleteList",setup(l){const t=o.injectRequired(u.AUTOCOMPLETE_CONTEXT,"SkdxAutocompleteList must be used within SkdxAutocomplete.");return(r,_)=>((0,e.openBlock)(),(0,e.createElementBlock)("div",{id:(0,e.unref)(t).listId,class:"skdx-autocomplete__list","data-part":"list",role:"listbox"},[(0,e.renderSlot)(r.$slots,"default")],8,i))}});exports.default=s;

package/dist/autocomplete/AutocompleteList.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{AUTOCOMPLETE_CONTEXT as t}from"./context.js";import{createElementBlock as e,defineComponent as o,inject as s,openBlock as a,renderSlot as r,unref as l}from"vue";var i=["id"],n=/* @__PURE__ */o({__name:"AutocompleteList",setup(o){const n=s(t);if(!n)throw new Error("SkdxAutocompleteList must be used within SkdxAutocomplete.");return(t,o)=>(a(),e("div",{class:"skdx-autocomplete__list","data-part":"list",role:"listbox",id:l(n).listId},[r(t.$slots,"default")],8,i))}});export{n as default};
+import{injectRequired as t}from"../utils/injectRequired.js";import{AUTOCOMPLETE_CONTEXT as e}from"./context.js";import{createElementBlock as o,defineComponent as s,openBlock as i,renderSlot as a,unref as l}from"vue";var r=["id"],d=/* @__PURE__ */s({__name:"AutocompleteList",setup(s){const d=t(e,"SkdxAutocompleteList must be used within SkdxAutocomplete.");return(t,e)=>(i(),o("div",{id:l(d).listId,class:"skdx-autocomplete__list","data-part":"list",role:"listbox"},[a(t.$slots,"default")],8,r))}});export{d as default};

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

@@ -1,22 +1,13 @@
 import type { PortalContainer } from '../utils/portal.cjs';
-/**
- * Teleports its children (typically `SkdxAutocompleteContent`) to
- * `document.body` (or a custom `container`) while the `SkdxAutocomplete`'s popup
- * is open, so the
- * suggestions escape clipping and `overflow: hidden` from ancestors. Renders
- * nothing while closed unless `forceMount` is set. Must be used inside
- * `SkdxAutocomplete`.
- */
+/** Teleports its children to document.body (or a custom container) while the popup is open. */
 type __VLS_Props = {
     /**
-     * DOM node (or CSS selector) the children are rendered into.
+     * DOM node or CSS selector the children are rendered into.
      * @default document.body
      */
     container?: PortalContainer;
     /**
-     * Render (and mount `SkdxAutocompleteContent`) even while closed, instead of
-     * unmounting. Useful for animation libraries that need the outgoing content
-     * present in the DOM during an exit transition.
+     * Mount Content even while closed for animation libraries (exit transition).
      * @default false — the popup leaves the DOM entirely while closed.
      */
     forceMount?: boolean;

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

@@ -1,22 +1,13 @@
 import type { PortalContainer } from '../utils/portal.js';
-/**
- * Teleports its children (typically `SkdxAutocompleteContent`) to
- * `document.body` (or a custom `container`) while the `SkdxAutocomplete`'s popup
- * is open, so the
- * suggestions escape clipping and `overflow: hidden` from ancestors. Renders
- * nothing while closed unless `forceMount` is set. Must be used inside
- * `SkdxAutocomplete`.
- */
+/** Teleports its children to document.body (or a custom container) while the popup is open. */
 type __VLS_Props = {
     /**
-     * DOM node (or CSS selector) the children are rendered into.
+     * DOM node or CSS selector the children are rendered into.
      * @default document.body
      */
     container?: PortalContainer;
     /**
-     * Render (and mount `SkdxAutocompleteContent`) even while closed, instead of
-     * unmounting. Useful for animation libraries that need the outgoing content
-     * present in the DOM during an exit transition.
+     * Mount Content even while closed for animation libraries (exit transition).
      * @default false — the popup leaves the DOM entirely while closed.
      */
     forceMount?: boolean;

package/dist/autocomplete/AutocompletePortal.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const n=require("../utils/Portal.vue.cjs"),u=require("./context.cjs");let e=require("vue");var l=(0,e.defineComponent)({__name:"AutocompletePortal",props:{container:{default:null},forceMount:{type:Boolean,default:!1}},setup(t){const o=(0,e.inject)(u.AUTOCOMPLETE_CONTEXT);if(!o)throw new Error("SkdxAutocompletePortal must be used within SkdxAutocomplete.");return(r,a)=>t.forceMount||(0,e.unref)(o).open.value?((0,e.openBlock)(),(0,e.createBlock)(n.default,{key:0,container:t.container},{default:(0,e.withCtx)(()=>[(0,e.renderSlot)(r.$slots,"default")]),_:3},8,["container"])):(0,e.createCommentVNode)("",!0)}});exports.default=l;
+const u=require("../utils/injectRequired.cjs"),n=require("../utils/Portal.vue.cjs"),l=require("./context.cjs");let e=require("vue");var c=(0,e.defineComponent)({__name:"AutocompletePortal",props:{container:{default:null},forceMount:{type:Boolean,default:!1}},setup(t){const r=u.injectRequired(l.AUTOCOMPLETE_CONTEXT,"SkdxAutocompletePortal must be used within SkdxAutocomplete.");return(o,a)=>t.forceMount||(0,e.unref)(r).open.value?((0,e.openBlock)(),(0,e.createBlock)(n.default,{key:0,container:t.container},{default:(0,e.withCtx)(()=>[(0,e.renderSlot)(o.$slots,"default")]),_:3},8,["container"])):(0,e.createCommentVNode)("",!0)}});exports.default=c;

package/dist/autocomplete/AutocompletePortal.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import e from"../utils/Portal.vue.js";import{AUTOCOMPLETE_CONTEXT as t}from"./context.js";import{createBlock as o,createCommentVNode as r,defineComponent as a,inject as n,openBlock as l,renderSlot as s,unref as u,withCtx as c}from"vue";var i=/* @__PURE__ */a({__name:"AutocompletePortal",props:{container:{default:null},forceMount:{type:Boolean,default:!1}},setup(a){const i=n(t);if(!i)throw new Error("SkdxAutocompletePortal must be used within SkdxAutocomplete.");return(t,n)=>a.forceMount||u(i).open.value?(l(),o(e,{key:0,container:a.container},{default:c(()=>[s(t.$slots,"default")]),_:3},8,["container"])):r("",!0)}});export{i as default};
+import{injectRequired as e}from"../utils/injectRequired.js";import t from"../utils/Portal.vue.js";import{AUTOCOMPLETE_CONTEXT as o}from"./context.js";import{createBlock as r,createCommentVNode as a,defineComponent as n,openBlock as u,renderSlot as s,unref as l,withCtx as i}from"vue";var c=/* @__PURE__ */n({__name:"AutocompletePortal",props:{container:{default:null},forceMount:{type:Boolean,default:!1}},setup(n){const c=e(o,"SkdxAutocompletePortal must be used within SkdxAutocomplete.");return(e,o)=>n.forceMount||l(c).open.value?(u(),r(t,{key:0,container:n.container},{default:i(()=>[s(e.$slots,"default")]),_:3},8,["container"])):a("",!0)}});export{c as default};

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

@@ -1,16 +1,4 @@
-/**
- * Optional button that toggles an `SkdxAutocomplete`'s suggestion popup — the
- * "▾" affordance that tells a pointer user there is a list at all, since a
- * plain text field looks like a plain text field.
- *
- * Renders a `<button type="button">` with `aria-expanded`, `aria-controls`
- * pointing at `SkdxAutocompleteList`, and `data-state="open" | "closed"`. It is
- * deliberately **not** a Tab stop: the input is the widget, and the keyboard
- * path to the list is Arrow Down on the input, so a second stop here would make
- * every autocomplete cost two Tab presses to skip. Give it an `aria-label` — a
- * chevron glyph is not an accessible name. Must be used inside
- * `SkdxAutocomplete`.
- */
+/** Optional button that toggles the suggestion popup; renders a button with aria-expanded and aria-controls. */
 type __VLS_Props = {};
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {

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

@@ -1,16 +1,4 @@
-/**
- * Optional button that toggles an `SkdxAutocomplete`'s suggestion popup — the
- * "▾" affordance that tells a pointer user there is a list at all, since a
- * plain text field looks like a plain text field.
- *
- * Renders a `<button type="button">` with `aria-expanded`, `aria-controls`
- * pointing at `SkdxAutocompleteList`, and `data-state="open" | "closed"`. It is
- * deliberately **not** a Tab stop: the input is the widget, and the keyboard
- * path to the list is Arrow Down on the input, so a second stop here would make
- * every autocomplete cost two Tab presses to skip. Give it an `aria-label` — a
- * chevron glyph is not an accessible name. Must be used inside
- * `SkdxAutocomplete`.
- */
+/** Optional button that toggles the suggestion popup; renders a button with aria-expanded and aria-controls. */
 type __VLS_Props = {};
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {

package/dist/autocomplete/AutocompleteTrigger.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const l=require("./context.cjs");let e=require("vue");var d=["aria-expanded","aria-controls","disabled","data-disabled","data-readonly","data-state"],i=(0,e.defineComponent)({__name:"AutocompleteTrigger",setup(s){const n=(0,e.inject)(l.AUTOCOMPLETE_CONTEXT);if(!n)throw new Error("SkdxAutocompleteTrigger must be used within SkdxAutocomplete.");const t=n,r=(0,e.ref)(null);(0,e.onMounted)(()=>{t.triggerRef.value=r.value}),(0,e.onBeforeUnmount)(()=>{t.triggerRef.value===r.value&&(t.triggerRef.value=null)});function o(a){a.preventDefault()}function u(){t.readOnly||(t.setOpen(!t.open.value),t.inputRef.value?.focus())}return(a,c)=>((0,e.openBlock)(),(0,e.createElementBlock)("button",{class:"skdx-autocomplete__trigger","data-part":"trigger",ref_key:"elRef",ref:r,type:"button",tabindex:-1,"aria-expanded":(0,e.unref)(t).open.value,"aria-controls":(0,e.unref)(t).listId,disabled:(0,e.unref)(t).disabled||void 0,"data-disabled":(0,e.unref)(t).disabled?"":void 0,"data-readonly":(0,e.unref)(t).readOnly?"":void 0,"data-state":(0,e.unref)(t).open.value?"open":"closed",onMousedown:o,onClick:u},[(0,e.renderSlot)(a.$slots,"default")],40,d))}});exports.default=i;
+const u=require("../utils/injectRequired.cjs"),d=require("./context.cjs");let t=require("vue");var l=["aria-expanded","aria-controls","disabled","data-disabled","data-readonly","data-state"],i=(0,t.defineComponent)({__name:"AutocompleteTrigger",setup(s){const e=u.injectRequired(d.AUTOCOMPLETE_CONTEXT,"SkdxAutocompleteTrigger must be used within SkdxAutocomplete."),r=(0,t.ref)(null);(0,t.onMounted)(()=>{e.triggerRef.value=r.value}),(0,t.onBeforeUnmount)(()=>{e.triggerRef.value===r.value&&(e.triggerRef.value=null)});function n(a){a.preventDefault()}function o(){e.readOnly||(e.setOpen(!e.open.value),e.inputRef.value?.focus())}return(a,c)=>((0,t.openBlock)(),(0,t.createElementBlock)("button",{ref_key:"elRef",ref:r,class:"skdx-autocomplete__trigger","data-part":"trigger",type:"button",tabindex:-1,"aria-expanded":(0,t.unref)(e).open.value,"aria-controls":(0,t.unref)(e).listId,disabled:(0,t.unref)(e).disabled||void 0,"data-disabled":(0,t.unref)(e).disabled?"":void 0,"data-readonly":(0,t.unref)(e).readOnly?"":void 0,"data-state":(0,t.unref)(e).open.value?"open":"closed",onMousedown:n,onClick:o},[(0,t.renderSlot)(a.$slots,"default")],40,l))}});exports.default=i;

package/dist/autocomplete/AutocompleteTrigger.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{AUTOCOMPLETE_CONTEXT as e}from"./context.js";import{createElementBlock as a,defineComponent as t,inject as o,onBeforeUnmount as n,onMounted as r,openBlock as d,ref as l,renderSlot as s,unref as i}from"vue";var u=["aria-expanded","aria-controls","disabled","data-disabled","data-readonly","data-state"],p=/* @__PURE__ */t({__name:"AutocompleteTrigger",setup(t){const p=o(e);if(!p)throw new Error("SkdxAutocompleteTrigger must be used within SkdxAutocomplete.");const f=p,c=l(null);function v(e){e.preventDefault()}function g(){f.readOnly||(f.setOpen(!f.open.value),f.inputRef.value?.focus())}return r(()=>{f.triggerRef.value=c.value}),n(()=>{f.triggerRef.value===c.value&&(f.triggerRef.value=null)}),(e,t)=>(d(),a("button",{class:"skdx-autocomplete__trigger","data-part":"trigger",ref_key:"elRef",ref:c,type:"button",tabindex:-1,"aria-expanded":i(f).open.value,"aria-controls":i(f).listId,disabled:i(f).disabled||void 0,"data-disabled":i(f).disabled?"":void 0,"data-readonly":i(f).readOnly?"":void 0,"data-state":i(f).open.value?"open":"closed",onMousedown:v,onClick:g},[s(e.$slots,"default")],40,u))}});export{p as default};
+import{injectRequired as e}from"../utils/injectRequired.js";import{AUTOCOMPLETE_CONTEXT as a}from"./context.js";import{createElementBlock as t,defineComponent as o,onBeforeUnmount as n,onMounted as r,openBlock as d,ref as l,renderSlot as s,unref as i}from"vue";var u=["aria-expanded","aria-controls","disabled","data-disabled","data-readonly","data-state"],p=/* @__PURE__ */o({__name:"AutocompleteTrigger",setup(o){const p=e(a,"SkdxAutocompleteTrigger must be used within SkdxAutocomplete."),f=l(null);function c(e){e.preventDefault()}function m(){p.readOnly||(p.setOpen(!p.open.value),p.inputRef.value?.focus())}return r(()=>{p.triggerRef.value=f.value}),n(()=>{p.triggerRef.value===f.value&&(p.triggerRef.value=null)}),(e,a)=>(d(),t("button",{ref_key:"elRef",ref:f,class:"skdx-autocomplete__trigger","data-part":"trigger",type:"button",tabindex:-1,"aria-expanded":i(p).open.value,"aria-controls":i(p).listId,disabled:i(p).disabled||void 0,"data-disabled":i(p).disabled?"":void 0,"data-readonly":i(p).readOnly?"":void 0,"data-state":i(p).open.value?"open":"closed",onMousedown:c,onClick:m},[s(e.$slots,"default")],40,u))}});export{p as default};

package/dist/autocomplete/context.cjs

@@ -1 +1 @@
-const e=require("../utils/id.cjs");var o='[role="option"]:not([data-disabled])',n=Symbol("skdx-autocomplete-context");function u(){return e.nextId("autocomplete-list")}function l(){return e.nextId("autocomplete-item")}function i(t){return`${t} suggestion${t===1?"":"s"} available`}exports.AUTOCOMPLETE_CONTEXT=n;exports.OPTION_SELECTOR=o;exports.defaultGetSuggestionCountLabel=i;exports.nextAutocompleteItemId=l;exports.nextAutocompleteListId=u;
+const n=require("../utils/id.cjs");var r='[role="option"]:not([data-disabled])';function c(t,e){const o=t.querySelector('[data-part="viewport"]')??t;if(o===e||!o.contains(e))return;const l=o.getBoundingClientRect(),u=e.getBoundingClientRect();o.scrollTop+=u.top-l.top-(l.height-u.height)/2}var i=Symbol("skdx-autocomplete-group-context");function a(){return n.nextId("autocomplete-group-label")}var p=Symbol("skdx-autocomplete-context");function s(){return n.nextId("autocomplete-list")}function d(){return n.nextId("autocomplete-item")}function O(t){return`${t} suggestion${t===1?"":"s"} available`}function T(t,e){return t.toLowerCase().includes(e.trim().toLowerCase())}exports.AUTOCOMPLETE_CONTEXT=p;exports.AUTOCOMPLETE_GROUP_CONTEXT=i;exports.OPTION_SELECTOR=r;exports.defaultGetSuggestionCountLabel=O;exports.defaultOptionsFilter=T;exports.nextAutocompleteGroupLabelId=a;exports.nextAutocompleteItemId=d;exports.nextAutocompleteListId=s;exports.scrollIntoPopup=c;

package/dist/autocomplete/context.d.cts

@@ -1,76 +1,112 @@
 import type { InjectionKey, Ref } from 'vue';
-/** @internal CSS selector matching enabled (non-disabled) suggestion elements for keyboard navigation. */
+/** @internal Selector for enabled option elements in keyboard navigation. */
 export declare const OPTION_SELECTOR = "[role=\"option\"]:not([data-disabled])";
-/**
- * Decides which `SkdxAutocompleteItem`s survive the current draft text.
- * `undefined` filters nothing — the consumer renders only the suggestions that
- * match, which is what an async or server-side search needs.
- */
-export type AutocompleteFilter = (itemText: string, inputValue: string) => boolean;
-/** @internal What one registered `SkdxAutocompleteItem` contributes to the root's collection. */
+/** @internal Scrolls the option into view inside the popup only, centered like a native select. */
+export declare function scrollIntoPopup(content: HTMLElement, option: HTMLElement): void;
+/** Filter strategy for suggestions: 'manual' (default, no filtering) or a ranking predicate. */
+export type AutocompleteFilter = 'manual' | ((itemText: string, inputValue: string) => boolean | number);
+/** Payload the value-change event carries; Enter, a suggestion click, Tab, and blur all use this shape. */
+export interface AutocompleteValueChangeDetail {
+    /** New committed value. */
+    value: string;
+    /** Previous value or `null` if none. */
+    previousValue: string | null;
+    /** Change driver. */
+    reason: 'keyboard' | 'pointer' | 'programmatic';
+    /** Whether committed value was draft text, not an existing suggestion. */
+    created: boolean;
+}
+/** One suggestion for `options` recipe. */
+export interface AutocompleteOption {
+    /** Value committed when chosen. */
+    value: string;
+    /** Label (matched against draft text). @default undefined → `value` */
+    label?: string;
+    /** Non-selectable suggestion. @default false */
+    disabled?: boolean;
+}
+/** Labelled suggestion group for `options` recipe. */
+export interface AutocompleteOptionGroup {
+    /** Group heading text. */
+    label: string;
+    /** Grouped suggestions. */
+    options: AutocompleteOption[];
+}
+/** @internal One registered item's contribution. */
 export interface AutocompleteItemEntry {
-    /** Identifier committed to the root's value when this suggestion is chosen. */
+    /** Value committed when chosen. */
     value: string;
-    /** The item's `textValue`, or its rendered text — matched by `filter` and written back into the input. */
+    /** Text used for filtering and written back to input. */
     text: string;
 }
-/** @internal Shared state distributed from `SkdxAutocomplete` to its parts via provide/inject. */
+/** @internal Shared state from Autocomplete to parts. */
 export interface AutocompleteContext {
     inputRef: Ref<HTMLElement | null>;
-    /**
-     * The optional `SkdxAutocompleteTrigger`, when one is mounted. Content's
-     * dismissal layer needs it: the trigger toggles the popup on *click*, so a
-     * pointer-down on it that counted as "outside" would close the popup and let
-     * the click reopen it.
-     */
+    /** Optional Trigger ref, so the dismissal layer can distinguish trigger clicks from outside pointer-down. */
     triggerRef: Ref<HTMLElement | null>;
     contentRef: Ref<HTMLElement | null>;
-    /** Id of `SkdxAutocompleteList`, referenced by the input's `aria-controls`. */
+    /** List id (`aria-controls` target). */
     listId: string;
-    /** The committed value — the answer the form takes, which need not be one of the suggestions. */
+    /** Committed value (need not be a suggestion). */
     value: Readonly<Ref<string>>;
-    /** Whether an option value is the committed one, for `aria-selected`. */
+    /** Whether value is committed (for `aria-selected`). */
     isSelected(value: string): boolean;
-    /** The draft text currently in the input. */
+    /** Draft text in input. */
     inputValue: Readonly<Ref<string>>;
     onInputValueChange(value: string): void;
     open: Readonly<Ref<boolean>>;
     setOpen(open: boolean): void;
     activeId: Readonly<Ref<string | null>>;
     setActiveId(id: string | null): void;
-    /** Opens the popup and, once its suggestions are mounted, highlights the first (or last) one. */
+    /** Open and highlight first (or last) suggestion once mounted. */
     openWithHighlight(edge: 'first' | 'last'): void;
     itemCount: Readonly<Ref<number>>;
     registerItem(id: string, entry: AutocompleteItemEntry): void;
     unregisterItem(id: string): void;
-    /** The registered entry behind a suggestion id, for committing the virtually-focused one. */
+    /** Entry for a suggestion id. */
     getItem(id: string): AutocompleteItemEntry | undefined;
-    /** Whether an item with this text survives the current `filter` and draft text. */
+    /** Whether item text survives current filter and draft. */
     matchesFilter(itemText: string): boolean;
-    /** Commits a suggestion: writes its text into the input, its value into `value`, and closes. */
-    commitItem(value: string, text: string): void;
-    /** Commits the raw draft text as the value (Tab, blur) — or restores the last committed text when `allowCustomValue` is off. */
-    commitInputValue(): void;
-    /** Closes and puts the last committed text back in the input (Escape). */
+    /** Visible suggestions in traversal order (score-sorted or DOM order). */
+    orderedOptions(): HTMLElement[];
+    /** Commit a suggestion: write text to input, value to field, close, and emit value-change. */
+    commitItem(value: string, text: string, reason: AutocompleteValueChangeDetail['reason']): void;
+    /** Commit draft text as value (Tab, blur), or restore the last committed value if allowCustomValue is off. */
+    commitInputValue(reason: AutocompleteValueChangeDetail['reason']): void;
+    /** Close and restore last committed text to input (Escape). */
     revert(): void;
+    /** Empty draft and value together, clearing the remembered value so blur cannot restore it. */
+    clear(reason: AutocompleteValueChangeDetail['reason']): void;
     allowCustomValue: boolean;
     openOnFocus: boolean;
+    /** Whether arrow keys wrap around suggestion list ends. */
+    loop: boolean;
     disabled: boolean;
     readOnly: boolean;
     invalid: boolean;
+    /** Suggestions in flight (`aria-busy` / `data-loading`, no count). */
+    loading: boolean;
+    /** Input field name. */
+    name: string | undefined;
+    /** Form id the field submits into. */
+    form: string | undefined;
+}
+/** @internal Group context for its label. */
+export interface AutocompleteGroupContext {
+    /** Label id (`aria-labelledby` target). */
+    labelId: string;
 }
-/** @internal Injection key the Autocomplete root provides so its Input, Trigger, Content, List and Items share draft text, committed value, open and active-item state. */
+/** @internal Injection key for group's label id. */
+export declare const AUTOCOMPLETE_GROUP_CONTEXT: InjectionKey<AutocompleteGroupContext>;
+/** @internal Generates a unique id for an AutocompleteGroup's label. */
+export declare function nextAutocompleteGroupLabelId(): string;
+/** @internal Injection key for Autocomplete parts. */
 export declare const AUTOCOMPLETE_CONTEXT: InjectionKey<AutocompleteContext>;
 /** @internal Generates a unique id for an Autocomplete's list, for the input's `aria-controls`. */
 export declare function nextAutocompleteListId(): string;
 /** @internal Generates a unique, stable-per-instance id for an AutocompleteItem. */
 export declare function nextAutocompleteItemId(): string;
-/**
- * @internal Default `getSuggestionCountLabel`: `"1 suggestion available"` /
- * `"3 suggestions available"`.
- *
- * Lives here rather than in `Autocomplete.vue` because `withDefaults(defineProps())`
- * is hoisted out of `setup()`, so it cannot reference a binding declared
- * locally in the same `<script setup>` — only an imported one.
- */
+/** @internal Default suggestion count label: "1 suggestion available" / "3 suggestions available". */
 export declare function defaultGetSuggestionCountLabel(count: number): string;
+/** Case-insensitive substring match — the default filter for a derived `options` autocomplete. */
+export declare function defaultOptionsFilter(text: string, inputValue: string): boolean;