@skdx/vue 0.27.0 → 0.28.0

package/dist/select/SelectAnatomy.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const s=require("./SelectContent.vue.cjs"),f=require("./SelectGroup.vue.cjs"),k=require("./SelectIcon.vue.cjs"),d=require("./SelectItem.vue.cjs"),i=require("./SelectItemIndicator.vue.cjs"),n=require("./SelectItemText.vue.cjs"),p=require("./SelectLabel.vue.cjs"),h=require("./SelectTrigger.vue.cjs"),c=require("./SelectValue.vue.cjs"),v=require("./SelectViewport.vue.cjs");let e=require("vue");var m=(0,e.defineComponent)({inheritAttrs:!1,__name:"SelectAnatomy",props:{options:{},placeholder:{}},setup(o){function u(l){return"options"in l}return(l,a)=>((0,e.openBlock)(),(0,e.createElementBlock)(e.Fragment,null,[(0,e.createVNode)(h.default,(0,e.normalizeProps)((0,e.guardReactiveProps)(l.$attrs)),{default:(0,e.withCtx)(()=>[l.$slots.value?((0,e.openBlock)(),(0,e.createBlock)(c.default,{key:0,placeholder:o.placeholder},{default:(0,e.withCtx)(()=>[(0,e.renderSlot)(l.$slots,"value")]),_:3},8,["placeholder"])):((0,e.openBlock)(),(0,e.createBlock)(c.default,{key:1,placeholder:o.placeholder},null,8,["placeholder"])),(0,e.createVNode)(k.default)]),_:3},16),(0,e.createVNode)(s.default,null,{default:(0,e.withCtx)(()=>[(0,e.createVNode)(v.default,null,{default:(0,e.withCtx)(()=>[((0,e.openBlock)(!0),(0,e.createElementBlock)(e.Fragment,null,(0,e.renderList)(o.options,t=>((0,e.openBlock)(),(0,e.createElementBlock)(e.Fragment,{key:u(t)?t.label:t.value},[u(t)?((0,e.openBlock)(),(0,e.createBlock)(f.default,{key:0},{default:(0,e.withCtx)(()=>[(0,e.createVNode)(p.default,null,{default:(0,e.withCtx)(()=>[(0,e.createTextVNode)((0,e.toDisplayString)(t.label),1)]),_:2},1024),((0,e.openBlock)(!0),(0,e.createElementBlock)(e.Fragment,null,(0,e.renderList)(t.options,r=>((0,e.openBlock)(),(0,e.createBlock)(d.default,{key:r.value,value:r.value,disabled:r.disabled,"text-value":r.label},{default:(0,e.withCtx)(()=>[(0,e.renderSlot)(l.$slots,"option",{option:r},()=>[(0,e.createVNode)(n.default,null,{default:(0,e.withCtx)(()=>[(0,e.createTextVNode)((0,e.toDisplayString)(r.label??r.value),1)]),_:2},1024),(0,e.createVNode)(i.default,null,{default:(0,e.withCtx)(()=>[...a[0]||(a[0]=[(0,e.createElementVNode)("svg",{viewBox:"0 0 16 16",width:"1em",height:"1em","aria-hidden":"true"},[(0,e.createElementVNode)("path",{d:"M3 8.5 6.5 12 13 4.5",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"})],-1)])]),_:1})])]),_:2},1032,["value","disabled","text-value"]))),128))]),_:2},1024)):((0,e.openBlock)(),(0,e.createBlock)(d.default,{key:1,value:t.value,disabled:t.disabled,"text-value":t.label},{default:(0,e.withCtx)(()=>[(0,e.renderSlot)(l.$slots,"option",{option:t},()=>[(0,e.createVNode)(n.default,null,{default:(0,e.withCtx)(()=>[(0,e.createTextVNode)((0,e.toDisplayString)(t.label??t.value),1)]),_:2},1024),(0,e.createVNode)(i.default,null,{default:(0,e.withCtx)(()=>[...a[1]||(a[1]=[(0,e.createElementVNode)("svg",{viewBox:"0 0 16 16",width:"1em",height:"1em","aria-hidden":"true"},[(0,e.createElementVNode)("path",{d:"M3 8.5 6.5 12 13 4.5",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"})],-1)])]),_:1})])]),_:2},1032,["value","disabled","text-value"]))],64))),128))]),_:3})]),_:3})],64))}});exports.default=m;

package/dist/select/SelectAnatomy.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import e from"./SelectContent.vue.js";import l from"./SelectGroup.vue.js";import t from"./SelectIcon.vue.js";import o from"./SelectItem.vue.js";import a from"./SelectItemIndicator.vue.js";import r from"./SelectItemText.vue.js";import u from"./SelectLabel.vue.js";import s from"./SelectTrigger.vue.js";import n from"./SelectValue.vue.js";import i from"./SelectViewport.vue.js";import{Fragment as d,createBlock as p,createElementBlock as m,createElementVNode as c,createTextVNode as v,createVNode as f,defineComponent as h,guardReactiveProps as k,normalizeProps as _,openBlock as b,renderList as S,renderSlot as j,toDisplayString as x,withCtx as g}from"vue";var w=/* @__PURE__ */h({inheritAttrs:!1,__name:"SelectAnatomy",props:{options:{},placeholder:{}},setup(h){function w(e){return"options"in e}return(y,B)=>(b(),m(d,null,[f(s,_(k(y.$attrs)),{default:g(()=>[y.$slots.value?(b(),p(n,{key:0,placeholder:h.placeholder},{default:g(()=>[j(y.$slots,"value")]),_:3},8,["placeholder"])):(b(),p(n,{key:1,placeholder:h.placeholder},null,8,["placeholder"])),f(t)]),_:3},16),f(e,null,{default:g(()=>[f(i,null,{default:g(()=>[(b(!0),m(d,null,S(h.options,e=>(b(),m(d,{key:w(e)?e.label:e.value},[w(e)?(b(),p(l,{key:0},{default:g(()=>[f(u,null,{default:g(()=>[v(x(e.label),1)]),_:2},1024),(b(!0),m(d,null,S(e.options,e=>(b(),p(o,{key:e.value,value:e.value,disabled:e.disabled,"text-value":e.label},{default:g(()=>[j(y.$slots,"option",{option:e},()=>[f(r,null,{default:g(()=>[v(x(e.label??e.value),1)]),_:2},1024),f(a,null,{default:g(()=>[...B[0]||(B[0]=[c("svg",{viewBox:"0 0 16 16",width:"1em",height:"1em","aria-hidden":"true"},[c("path",{d:"M3 8.5 6.5 12 13 4.5",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"})],-1)])]),_:1})])]),_:2},1032,["value","disabled","text-value"]))),128))]),_:2},1024)):(b(),p(o,{key:1,value:e.value,disabled:e.disabled,"text-value":e.label},{default:g(()=>[j(y.$slots,"option",{option:e},()=>[f(r,null,{default:g(()=>[v(x(e.label??e.value),1)]),_:2},1024),f(a,null,{default:g(()=>[...B[1]||(B[1]=[c("svg",{viewBox:"0 0 16 16",width:"1em",height:"1em","aria-hidden":"true"},[c("path",{d:"M3 8.5 6.5 12 13 4.5",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"})],-1)])]),_:1})])]),_:2},1032,["value","disabled","text-value"]))],64))),128))]),_:3})]),_:3})],64))}});export{w as default};

package/dist/select/SelectContent.vue.d.cts

@@ -1,46 +1,29 @@
 import { type PopperPositionOptions } from '../utils/popper.cjs';
 import { type FocusOutsideEvent, type InteractOutsideEvent } from '../utils/useDismiss.cjs';
+import type { AutoFocusEvent } from '../utils/useFocusTrap.cjs';
 /**
- * The listbox popup for a {@link SelectContext}, positioned relative to the
- * trigger via `@floating-ui/dom` (`strategy: 'fixed'`, so it isn't clipped
- * by `overflow: hidden` ancestors even without a portal — unlike React's
- * `SelectPortal`, this content renders in normal document flow). Renders
- * `<div role="listbox">` only while open, with `data-state` and the resolved
- * `data-side`/`data-align` placement hooks, plus `aria-multiselectable="true"`
- * and `data-multiple` while the root is `multiple`. Collisions are avoided
- * against `collisionBoundary` when one is given and the listbox's clipping
- * ancestors otherwise, and each reposition writes the measurement custom
- * properties `--skdx-select-available-width` / `-available-height` /
- * `-trigger-width` / `-transform-origin`, so the popup can be sized and
- * animated from CSS (`max-height: var(--skdx-select-available-height)`) without
- * measuring anything by hand. Owns roving-focus +
- * typeahead keyboard navigation between `SkdxSelectOption`s, focuses the
- * selected (or first) option on open, and closes on Tab.
- *
- * Closes on Escape (returning focus to the trigger) or on an outside
- * interaction — pointer-down outside or focus moving outside — unless
- * `escape-key-down`/`pointer-down-outside`/`focus-outside`/`interact-outside`
- * call `event.preventDefault()`. `interact-outside` fires for either kind of
- * outside interaction, immediately before the specific event and with the same
- * event object, so one veto covers both.
+ * The floating listbox (role="listbox"), positioned relative to the trigger via @floating-ui/dom
+ * (strategy: 'fixed'). Renders only while open with data-state and resolved data-side/data-align
+ * placement hooks, plus aria-multiselectable="true" when multiple. Measurement properties
+ * (`--skdx-select-available-*`, `--skdx-select-trigger-width`, `--skdx-select-transform-origin`)
+ * allow CSS-only sizing and animation. Not focusable (real DOM focus stays on trigger);
+ * only moves virtual active option and handles opening/closing.
  */
 type __VLS_Props = {
-    /** Preferred edge of the trigger to place the listbox against. */
+    /** Preferred edge of the trigger to place the listbox. */
     side?: PopperPositionOptions['side'];
-    /** Preferred alignment along that edge relative to the trigger. */
+    /** Preferred alignment along the chosen edge, relative to trigger. */
     align?: PopperPositionOptions['align'];
-    /** Pixel gap between the listbox and the trigger's edge. */
+    /** Pixel gap between listbox and trigger. */
     sideOffset?: number;
     /** Pixel offset along the alignment axis. */
     alignOffset?: number;
-    /** Flip/shift to stay within the viewport instead of overflowing it. */
+    /** Flip the listbox or shift it to stay within the viewport. */
     avoidCollisions?: boolean;
-    /** Minimum pixel distance to keep from the collision boundary. A number applies to every side; an object sets only the sides it names. */
+    /** Minimum distance from collision boundary; a number applies to all sides, an object sets only named sides. */
     collisionPadding?: PopperPositionOptions['collisionPadding'];
     /**
-     * Element (or elements) collisions are measured against, instead of the
-     * listbox's clipping ancestors. Use it to keep the listbox inside a scroll
-     * container or one pane of a split layout rather than the whole viewport.
+     * Elements collisions are measured against; use it to keep the listbox inside a scroll container or split pane.
      * @default undefined — the listbox's clipping ancestors.
      */
     collisionBoundary?: PopperPositionOptions['collisionBoundary'];
@@ -51,17 +34,19 @@ type __VLS_Slots = {} & {
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "focus-outside": (event: FocusOutsideEvent) => any;
+    "close-auto-focus": (event: AutoFocusEvent) => any;
     "escape-key-down": (event: KeyboardEvent) => any;
     "pointer-down-outside": (event: PointerEvent) => any;
     "interact-outside": (event: InteractOutsideEvent) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     "onFocus-outside"?: ((event: FocusOutsideEvent) => any) | undefined;
+    "onClose-auto-focus"?: ((event: AutoFocusEvent) => any) | undefined;
     "onEscape-key-down"?: ((event: KeyboardEvent) => any) | undefined;
     "onPointer-down-outside"?: ((event: PointerEvent) => any) | undefined;
     "onInteract-outside"?: ((event: InteractOutsideEvent) => any) | undefined;
 }>, {
-    side: import("../utils/popper.cjs").Side;
     align: import("../utils/popper.cjs").Align;
+    side: import("../utils/popper.cjs").Side;
     sideOffset: number;
     alignOffset: number;
     avoidCollisions: boolean;

package/dist/select/SelectContent.vue.d.ts

@@ -1,46 +1,29 @@
 import { type PopperPositionOptions } from '../utils/popper.js';
 import { type FocusOutsideEvent, type InteractOutsideEvent } from '../utils/useDismiss.js';
+import type { AutoFocusEvent } from '../utils/useFocusTrap.js';
 /**
- * The listbox popup for a {@link SelectContext}, positioned relative to the
- * trigger via `@floating-ui/dom` (`strategy: 'fixed'`, so it isn't clipped
- * by `overflow: hidden` ancestors even without a portal — unlike React's
- * `SelectPortal`, this content renders in normal document flow). Renders
- * `<div role="listbox">` only while open, with `data-state` and the resolved
- * `data-side`/`data-align` placement hooks, plus `aria-multiselectable="true"`
- * and `data-multiple` while the root is `multiple`. Collisions are avoided
- * against `collisionBoundary` when one is given and the listbox's clipping
- * ancestors otherwise, and each reposition writes the measurement custom
- * properties `--skdx-select-available-width` / `-available-height` /
- * `-trigger-width` / `-transform-origin`, so the popup can be sized and
- * animated from CSS (`max-height: var(--skdx-select-available-height)`) without
- * measuring anything by hand. Owns roving-focus +
- * typeahead keyboard navigation between `SkdxSelectOption`s, focuses the
- * selected (or first) option on open, and closes on Tab.
- *
- * Closes on Escape (returning focus to the trigger) or on an outside
- * interaction — pointer-down outside or focus moving outside — unless
- * `escape-key-down`/`pointer-down-outside`/`focus-outside`/`interact-outside`
- * call `event.preventDefault()`. `interact-outside` fires for either kind of
- * outside interaction, immediately before the specific event and with the same
- * event object, so one veto covers both.
+ * The floating listbox (role="listbox"), positioned relative to the trigger via @floating-ui/dom
+ * (strategy: 'fixed'). Renders only while open with data-state and resolved data-side/data-align
+ * placement hooks, plus aria-multiselectable="true" when multiple. Measurement properties
+ * (`--skdx-select-available-*`, `--skdx-select-trigger-width`, `--skdx-select-transform-origin`)
+ * allow CSS-only sizing and animation. Not focusable (real DOM focus stays on trigger);
+ * only moves virtual active option and handles opening/closing.
  */
 type __VLS_Props = {
-    /** Preferred edge of the trigger to place the listbox against. */
+    /** Preferred edge of the trigger to place the listbox. */
     side?: PopperPositionOptions['side'];
-    /** Preferred alignment along that edge relative to the trigger. */
+    /** Preferred alignment along the chosen edge, relative to trigger. */
     align?: PopperPositionOptions['align'];
-    /** Pixel gap between the listbox and the trigger's edge. */
+    /** Pixel gap between listbox and trigger. */
     sideOffset?: number;
     /** Pixel offset along the alignment axis. */
     alignOffset?: number;
-    /** Flip/shift to stay within the viewport instead of overflowing it. */
+    /** Flip the listbox or shift it to stay within the viewport. */
     avoidCollisions?: boolean;
-    /** Minimum pixel distance to keep from the collision boundary. A number applies to every side; an object sets only the sides it names. */
+    /** Minimum distance from collision boundary; a number applies to all sides, an object sets only named sides. */
     collisionPadding?: PopperPositionOptions['collisionPadding'];
     /**
-     * Element (or elements) collisions are measured against, instead of the
-     * listbox's clipping ancestors. Use it to keep the listbox inside a scroll
-     * container or one pane of a split layout rather than the whole viewport.
+     * Elements collisions are measured against; use it to keep the listbox inside a scroll container or split pane.
      * @default undefined — the listbox's clipping ancestors.
      */
     collisionBoundary?: PopperPositionOptions['collisionBoundary'];
@@ -51,17 +34,19 @@ type __VLS_Slots = {} & {
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "focus-outside": (event: FocusOutsideEvent) => any;
+    "close-auto-focus": (event: AutoFocusEvent) => any;
     "escape-key-down": (event: KeyboardEvent) => any;
     "pointer-down-outside": (event: PointerEvent) => any;
     "interact-outside": (event: InteractOutsideEvent) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     "onFocus-outside"?: ((event: FocusOutsideEvent) => any) | undefined;
+    "onClose-auto-focus"?: ((event: AutoFocusEvent) => any) | undefined;
     "onEscape-key-down"?: ((event: KeyboardEvent) => any) | undefined;
     "onPointer-down-outside"?: ((event: PointerEvent) => any) | undefined;
     "onInteract-outside"?: ((event: InteractOutsideEvent) => any) | undefined;
 }>, {
-    side: import("../utils/popper.js").Side;
     align: import("../utils/popper.js").Align;
+    side: import("../utils/popper.js").Side;
     sideOffset: number;
     alignOffset: number;
     avoidCollisions: boolean;

package/dist/select/SelectContent.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const k=require("../utils/composeRefs.cjs"),O=require("../utils/useDismiss.cjs"),h=require("../utils/useRovingFocus.cjs"),q=require("./context.cjs"),E=require("../utils/popper.cjs");let t=require("vue");var C=["id","aria-multiselectable","data-state","data-multiple","data-side","data-align","hidden"],f='[role="option"]:not([data-disabled])',S=(0,t.defineComponent)({__name:"SelectContent",props:{side:{default:"bottom"},align:{default:"start"},sideOffset:{default:4},alignOffset:{default:0},avoidCollisions:{type:Boolean,default:!0},collisionPadding:{default:8},collisionBoundary:{}},emits:["escape-key-down","pointer-down-outside","focus-outside","interact-outside"],setup(p,{emit:m}){const i=p,a=m,o=(0,t.inject)(q.SELECT_CONTEXT);if(!o)throw new Error("[skdx] SkdxSelectContent must be used within SkdxSelect.");const s=(0,t.ref)(null),g=k.composeRefs(s,e=>{o.contentEl=e});let l="",u;const{placedSide:y,placedAlign:_}=E.usePopperPosition((0,t.computed)(()=>o.triggerEl),s,(0,t.computed)(()=>o.open),()=>({side:i.side,align:i.align,sideOffset:i.sideOffset,alignOffset:i.alignOffset,avoidCollisions:i.avoidCollisions,collisionPadding:i.collisionPadding,collisionBoundary:i.collisionBoundary,component:"select"}));(0,t.watch)(()=>o.open,e=>{!e||typeof document>"u"||requestAnimationFrame(()=>{const n=s.value;if(!n)return;const r=n.querySelector('[role="option"][data-state="checked"]'),d=n.querySelector(f);(r??d??n).focus()})},{immediate:!0}),(0,t.onBeforeUnmount)(()=>{clearTimeout(u)}),O.useDismiss({enabled:(0,t.computed)(()=>o.open),onEscapeKeyDown:e=>{a("escape-key-down",e),!e.defaultPrevented&&(o.setOpen(!1),o.focusTrigger())},onPointerDownOutside:e=>{a("pointer-down-outside",e),e.defaultPrevented||o.setOpen(!1)},onFocusOutside:e=>{a("focus-outside",e),e.defaultPrevented||o.setOpen(!1)},onInteractOutside:e=>a("interact-outside",e)},[s,(0,t.computed)(()=>o.triggerEl)]);function w(e){const n=s.value;if(!n)return;const r=Array.from(n.querySelectorAll(f)),d=r.indexOf(document.activeElement);if(e.key==="Tab"){e.preventDefault(),o.setOpen(!1),o.focusTrigger();return}if(e.key==="ArrowDown"||e.key==="ArrowUp"){if(e.preventDefault(),r.length===0)return;const c=e.key==="ArrowDown"?1:-1;r[Math.min(r.length-1,Math.max(0,d+c))]?.focus();return}if(e.key==="Enter"||e.key===" "){e.preventDefault(),document.activeElement?.click();return}e.key.length===1&&(l+=e.key.toLowerCase(),clearTimeout(u),u=setTimeout(()=>l="",500),r.find(c=>h.itemText(c).trim().toLowerCase().startsWith(l))?.focus())}return(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)("div",{class:"skdx-select__content","data-part":"content",ref:(0,t.unref)(g),role:"listbox",tabindex:"-1",id:(0,t.unref)(o).contentId,"aria-multiselectable":(0,t.unref)(o).multiple?!0:void 0,"data-state":(0,t.unref)(o).open?"open":"closed","data-multiple":(0,t.unref)(o).multiple?"":void 0,"data-side":(0,t.unref)(y),"data-align":(0,t.unref)(_),hidden:!(0,t.unref)(o).open,onKeydown:w},[(0,t.renderSlot)(e.$slots,"default")],40,C))}});exports.default=S;
+const y=require("../utils/composeRefs.cjs"),C=require("../utils/useDismiss.cjs"),u=require("./context.cjs"),S=require("../utils/popper.cjs");let n=require("vue");var w=["id","aria-multiselectable","data-state","data-multiple","data-side","data-align","hidden"],E=(0,n.defineComponent)({__name:"SelectContent",props:{side:{default:"bottom"},align:{default:"start"},sideOffset:{default:4},alignOffset:{default:0},avoidCollisions:{type:Boolean,default:!0},collisionPadding:{default:8},collisionBoundary:{}},emits:["escape-key-down","pointer-down-outside","focus-outside","interact-outside","close-auto-focus"],setup(f,{emit:p}){function m(e,o){const s=e.querySelector('[data-part="viewport"]')??e;if(s===o||!s.contains(o))return;const l=s.getBoundingClientRect(),d=o.getBoundingClientRect();s.scrollTop+=d.top-l.top-(l.height-d.height)/2}const i=f,r=p,t=(0,n.inject)(u.SELECT_CONTEXT);if(!t)throw new Error("[skdx] SkdxSelectContent must be used within SkdxSelect.");t.closeAutoFocus.current=e=>r("close-auto-focus",e);const a=(0,n.ref)(null),g=y.composeRefs(a,e=>{t.contentEl=e}),{placedSide:_,placedAlign:O}=S.usePopperPosition((0,n.computed)(()=>t.triggerEl),a,(0,n.computed)(()=>t.open),()=>({side:i.side,align:i.align,sideOffset:i.sideOffset,alignOffset:i.alignOffset,avoidCollisions:i.avoidCollisions,collisionPadding:i.collisionPadding,collisionBoundary:i.collisionBoundary,component:"select"}));(0,n.watch)(()=>t.open,e=>{!e||typeof document>"u"||requestAnimationFrame(()=>{const o=a.value;if(!o)return;const s=t.openIntent;t.openIntent="selected";const l=Array.from(o.querySelectorAll(u.OPTION_SELECTOR)),d=l[0],h=l[l.length-1],q=o.querySelector('[role="option"][data-state="checked"]'),c=s==="first"?d:s==="last"?h:q??d;c&&(t.setActiveId(c.id),m(o,c))})},{immediate:!0}),C.useDismiss({enabled:(0,n.computed)(()=>t.open),onEscapeKeyDown:e=>{r("escape-key-down",e),!e.defaultPrevented&&(t.setOpen(!1),t.focusTrigger())},onPointerDownOutside:e=>{r("pointer-down-outside",e),e.defaultPrevented||t.setOpen(!1)},onFocusOutside:e=>{r("focus-outside",e),e.defaultPrevented||t.setOpen(!1)},onInteractOutside:e=>r("interact-outside",e)},[a,(0,n.computed)(()=>t.triggerEl)]);function v(e){e.preventDefault()}return(e,o)=>((0,n.openBlock)(),(0,n.createElementBlock)("div",{class:"skdx-select__content","data-part":"content",ref:(0,n.unref)(g),role:"listbox",tabindex:"-1",id:(0,n.unref)(t).contentId,"aria-multiselectable":(0,n.unref)(t).multiple?!0:void 0,"data-state":(0,n.unref)(t).open?"open":"closed","data-multiple":(0,n.unref)(t).multiple?"":void 0,"data-side":(0,n.unref)(_),"data-align":(0,n.unref)(O),hidden:!(0,n.unref)(t).open,onMousedown:v},[(0,n.renderSlot)(e.$slots,"default")],40,w))}});exports.default=E;

package/dist/select/SelectContent.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{composeRefs as e}from"../utils/composeRefs.js";import{useDismiss as t}from"../utils/useDismiss.js";import{itemText as o}from"../utils/useRovingFocus.js";import{SELECT_CONTEXT as n}from"./context.js";import{usePopperPosition as i}from"../utils/popper.js";import{computed as s,createElementBlock as a,defineComponent as l,inject as r,onBeforeUnmount as d,openBlock as u,ref as c,renderSlot as f,unref as p,watch as m}from"vue";var g=["id","aria-multiselectable","data-state","data-multiple","data-side","data-align","hidden"],v='[role="option"]:not([data-disabled])',y=/* @__PURE__ */l({__name:"SelectContent",props:{side:{default:"bottom"},align:{default:"start"},sideOffset:{default:4},alignOffset:{default:0},avoidCollisions:{type:Boolean,default:!0},collisionPadding:{default:8},collisionBoundary:{}},emits:["escape-key-down","pointer-down-outside","focus-outside","interact-outside"],setup(l,{emit:y}){const k=l,w=y,O=r(n);if(!O)throw new Error("[skdx] SkdxSelectContent must be used within SkdxSelect.");const h=c(null),E=e(h,e=>{O.contentEl=e});let x,S="";const{placedSide:C,placedAlign:T}=i(s(()=>O.triggerEl),h,s(()=>O.open),()=>({side:k.side,align:k.align,sideOffset:k.sideOffset,alignOffset:k.alignOffset,avoidCollisions:k.avoidCollisions,collisionPadding:k.collisionPadding,collisionBoundary:k.collisionBoundary,component:"select"}));function b(e){const t=h.value;if(!t)return;const n=Array.from(t.querySelectorAll(v)),i=n.indexOf(document.activeElement);if("Tab"===e.key)return e.preventDefault(),O.setOpen(!1),void O.focusTrigger();if("ArrowDown"===e.key||"ArrowUp"===e.key){if(e.preventDefault(),0===n.length)return;const t="ArrowDown"===e.key?1:-1;return void n[Math.min(n.length-1,Math.max(0,i+t))]?.focus()}if("Enter"===e.key||" "===e.key)return e.preventDefault(),void document.activeElement?.click();1===e.key.length&&(S+=e.key.toLowerCase(),clearTimeout(x),x=setTimeout(()=>S="",500),n.find(e=>o(e).trim().toLowerCase().startsWith(S))?.focus())}return m(()=>O.open,e=>{!e||typeof document>"u"||requestAnimationFrame(()=>{const e=h.value;if(!e)return;const t=e.querySelector('[role="option"][data-state="checked"]'),o=e.querySelector(v);(t??o??e).focus()})},{immediate:!0}),d(()=>{clearTimeout(x)}),t({enabled:s(()=>O.open),onEscapeKeyDown:e=>{w("escape-key-down",e),!e.defaultPrevented&&(O.setOpen(!1),O.focusTrigger())},onPointerDownOutside:e=>{w("pointer-down-outside",e),e.defaultPrevented||O.setOpen(!1)},onFocusOutside:e=>{w("focus-outside",e),e.defaultPrevented||O.setOpen(!1)},onInteractOutside:e=>w("interact-outside",e)},[h,s(()=>O.triggerEl)]),(e,t)=>(u(),a("div",{class:"skdx-select__content","data-part":"content",ref:p(E),role:"listbox",tabindex:"-1",id:p(O).contentId,"aria-multiselectable":!!p(O).multiple||void 0,"data-state":p(O).open?"open":"closed","data-multiple":p(O).multiple?"":void 0,"data-side":p(C),"data-align":p(T),hidden:!p(O).open,onKeydown:b},[f(e.$slots,"default")],40,g))}});export{y as default};
+import{composeRefs as e}from"../utils/composeRefs.js";import{useDismiss as t}from"../utils/useDismiss.js";import{OPTION_SELECTOR as o,SELECT_CONTEXT as s}from"./context.js";import{usePopperPosition as n}from"../utils/popper.js";import{computed as i,createElementBlock as a,defineComponent as l,inject as d,openBlock as r,ref as c,renderSlot as u,unref as p,watch as f}from"vue";var m=["id","aria-multiselectable","data-state","data-multiple","data-side","data-align","hidden"],g=/* @__PURE__ */l({__name:"SelectContent",props:{side:{default:"bottom"},align:{default:"start"},sideOffset:{default:4},alignOffset:{default:0},avoidCollisions:{type:Boolean,default:!0},collisionPadding:{default:8},collisionBoundary:{}},emits:["escape-key-down","pointer-down-outside","focus-outside","interact-outside","close-auto-focus"],setup(l,{emit:g}){const O=l,v=g,w=d(s);if(!w)throw new Error("[skdx] SkdxSelectContent must be used within SkdxSelect.");w.closeAutoFocus.current=e=>v("close-auto-focus",e);const y=c(null),S=e(y,e=>{w.contentEl=e}),{placedSide:h,placedAlign:C}=n(i(()=>w.triggerEl),y,i(()=>w.open),()=>({side:O.side,align:O.align,sideOffset:O.sideOffset,alignOffset:O.alignOffset,avoidCollisions:O.avoidCollisions,collisionPadding:O.collisionPadding,collisionBoundary:O.collisionBoundary,component:"select"}));function E(e){e.preventDefault()}return f(()=>w.open,e=>{!e||typeof document>"u"||requestAnimationFrame(()=>{const e=y.value;if(!e)return;const t=w.openIntent;w.openIntent="selected";const s=Array.from(e.querySelectorAll(o)),n=s[0],i=s[s.length-1],a=e.querySelector('[role="option"][data-state="checked"]'),l="first"===t?n:"last"===t?i:a??n;l&&(w.setActiveId(l.id),function(e,t){const o=e.querySelector('[data-part="viewport"]')??e;if(o===t||!o.contains(t))return;const s=o.getBoundingClientRect(),n=t.getBoundingClientRect();o.scrollTop+=n.top-s.top-(s.height-n.height)/2}(e,l))})},{immediate:!0}),t({enabled:i(()=>w.open),onEscapeKeyDown:e=>{v("escape-key-down",e),!e.defaultPrevented&&(w.setOpen(!1),w.focusTrigger())},onPointerDownOutside:e=>{v("pointer-down-outside",e),e.defaultPrevented||w.setOpen(!1)},onFocusOutside:e=>{v("focus-outside",e),e.defaultPrevented||w.setOpen(!1)},onInteractOutside:e=>v("interact-outside",e)},[y,i(()=>w.triggerEl)]),(e,t)=>(r(),a("div",{class:"skdx-select__content","data-part":"content",ref:p(S),role:"listbox",tabindex:"-1",id:p(w).contentId,"aria-multiselectable":!!p(w).multiple||void 0,"data-state":p(w).open?"open":"closed","data-multiple":p(w).multiple?"":void 0,"data-side":p(h),"data-align":p(C),hidden:!p(w).open,onMousedown:E},[u(e.$slots,"default")],40,m))}});export{g as default};

package/dist/select/SelectGroup.vue.d.cts

@@ -1,6 +1,6 @@
 /**
- * Groups related `SkdxSelectOption`s together, typically preceded by a
- * {@link SelectLabel}. Renders `<div role="group">`.
+ * Groups related SelectItems under a SelectLabel (role="group"). Automatically wires aria-labelledby.
+ * Label is required inside Group.
  */
 type __VLS_Props = {};
 declare var __VLS_1: {};

package/dist/select/SelectGroup.vue.d.ts

@@ -1,6 +1,6 @@
 /**
- * Groups related `SkdxSelectOption`s together, typically preceded by a
- * {@link SelectLabel}. Renders `<div role="group">`.
+ * Groups related SelectItems under a SelectLabel (role="group"). Automatically wires aria-labelledby.
+ * Label is required inside Group.
  */
 type __VLS_Props = {};
 declare var __VLS_1: {};

package/dist/select/SelectGroup.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-let e=require("vue");var r={class:"skdx-select__group","data-part":"group",role:"group"},u=(0,e.defineComponent)({__name:"SelectGroup",setup(_){return(t,l)=>((0,e.openBlock)(),(0,e.createElementBlock)("div",r,[(0,e.renderSlot)(t.$slots,"default")]))}});exports.default=u;
+const t=require("./context.cjs");let e=require("vue");var a=["aria-labelledby"],u=(0,e.defineComponent)({__name:"SelectGroup",setup(o){const r=t.nextSelectGroupLabelId();return(0,e.provide)(t.SELECT_GROUP_CONTEXT,{labelId:r}),(l,_)=>((0,e.openBlock)(),(0,e.createElementBlock)("div",{class:"skdx-select__group","data-part":"group",role:"group","aria-labelledby":(0,e.unref)(r)},[(0,e.renderSlot)(l.$slots,"default")],8,a))}});exports.default=u;

package/dist/select/SelectGroup.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{createElementBlock as e,defineComponent as o,openBlock as a,renderSlot as t}from"vue";var r={class:"skdx-select__group","data-part":"group",role:"group"},s=/* @__PURE__ */o({__name:"SelectGroup",setup:o=>(o,s)=>(a(),e("div",r,[t(o.$slots,"default")]))});export{s as default};
+import{SELECT_GROUP_CONTEXT as e,nextSelectGroupLabelId as a}from"./context.js";import{createElementBlock as r,defineComponent as l,openBlock as o,provide as t,renderSlot as s,unref as p}from"vue";var d=["aria-labelledby"],n=/* @__PURE__ */l({__name:"SelectGroup",setup(l){const n=a();return t(e,{labelId:n}),(e,a)=>(o(),r("div",{class:"skdx-select__group","data-part":"group",role:"group","aria-labelledby":p(n)},[s(e.$slots,"default")],8,d))}});export{n as default};

package/dist/select/SelectItem.vue.cjs

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

package/dist/select/SelectItem.vue.d.cts

@@ -0,0 +1,32 @@
+/**
+ * One selectable option within SelectContent (role="option"). Captures its slotted
+ * text for SelectValue. Click selects and closes (or toggles in multiple mode). Uses
+ * aria-disabled and data-disabled, not native disabled (inert on role="option").
+ * Not focusable — real DOM focus stays on trigger; this element only publishes virtual focus via data-highlighted.
+ */
+type __VLS_Props = {
+    /** Identifier committed to the root's value when chosen. */
+    value: string;
+    /**
+     * Excludes from selection and keyboard navigation.
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * Text for Trigger label and typeahead, published as data-text-value; falls back to rendered text.
+     * @default undefined — falls back to the option's rendered text content.
+     */
+    textValue?: string;
+};
+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<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/select/SelectItem.vue.d.ts

@@ -0,0 +1,32 @@
+/**
+ * One selectable option within SelectContent (role="option"). Captures its slotted
+ * text for SelectValue. Click selects and closes (or toggles in multiple mode). Uses
+ * aria-disabled and data-disabled, not native disabled (inert on role="option").
+ * Not focusable — real DOM focus stays on trigger; this element only publishes virtual focus via data-highlighted.
+ */
+type __VLS_Props = {
+    /** Identifier committed to the root's value when chosen. */
+    value: string;
+    /**
+     * Excludes from selection and keyboard navigation.
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * Text for Trigger label and typeahead, published as data-text-value; falls back to rendered text.
+     * @default undefined — falls back to the option's rendered text content.
+     */
+    textValue?: string;
+};
+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<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/select/SelectItem.vue.js

@@ -0,0 +1 @@
+import e from"./SelectItem.vue_vue_type_script_setup_true_lang.js";var t=e;export{t as default};

package/dist/select/SelectItem.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const n=require("./context.cjs");let e=require("vue");var f=["id","data-value","aria-selected","data-state","data-highlighted","data-text-value","aria-disabled","data-disabled"],h=(0,e.defineComponent)({__name:"SelectItem",props:{value:{},disabled:{type:Boolean},textValue:{}},setup(d){const a=d,t=(0,e.inject)(n.SELECT_CONTEXT);if(!t)throw new Error("[skdx] SkdxSelectItem must be used within SkdxSelect.");const l=n.nextSelectItemId(),o=(0,e.ref)(null),i=(0,e.computed)(()=>t.isSelected(a.value)),r=(0,e.computed)(()=>t.activeId===l);(0,e.provide)(n.SELECT_ITEM_CONTEXT,{selected:i,disabled:(0,e.computed)(()=>a.disabled??!1)});function c(){t.registerOptionLabel(a.value,a.textValue??o.value?.textContent?.trim()??"")}(0,e.onMounted)(c),(0,e.onUpdated)(c);function s(){a.disabled||(t.selectItem(a.value),t.closeOnSelect&&(t.setOpen(!1),t.focusTrigger()))}function u(){a.disabled||t.setActiveId(l)}return(v,m)=>((0,e.openBlock)(),(0,e.createElementBlock)("div",{ref_key:"optionRef",ref:o,class:"skdx-select__item","data-part":"item",role:"option",id:(0,e.unref)(l),"data-value":d.value,"aria-selected":i.value,"data-state":i.value?"checked":"unchecked","data-highlighted":r.value?"":void 0,"data-text-value":d.textValue,"aria-disabled":d.disabled||void 0,"data-disabled":d.disabled?"":void 0,onClick:s,onPointerenter:u},[(0,e.renderSlot)(v.$slots,"default")],40,f))}});exports.default=h;

package/dist/select/SelectItem.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import{SELECT_CONTEXT as e,SELECT_ITEM_CONTEXT as t,nextSelectItemId as a}from"./context.js";import{computed as d,createElementBlock as l,defineComponent as s,inject as i,onMounted as o,onUpdated as n,openBlock as r,provide as c,ref as u,renderSlot as v,unref as p}from"vue";var m=["id","data-value","aria-selected","data-state","data-highlighted","data-text-value","aria-disabled","data-disabled"],f=/* @__PURE__ */s({__name:"SelectItem",props:{value:{},disabled:{type:Boolean},textValue:{}},setup(s){const f=s,b=i(e);if(!b)throw new Error("[skdx] SkdxSelectItem must be used within SkdxSelect.");const x=a(),S=u(null),h=d(()=>b.isSelected(f.value)),k=d(()=>b.activeId===x);function E(){b.registerOptionLabel(f.value,f.textValue??S.value?.textContent?.trim()??"")}function I(){f.disabled||(b.selectItem(f.value),b.closeOnSelect&&(b.setOpen(!1),b.focusTrigger()))}function T(){f.disabled||b.setActiveId(x)}return c(t,{selected:h,disabled:d(()=>f.disabled??!1)}),o(E),n(E),(e,t)=>(r(),l("div",{ref_key:"optionRef",ref:S,class:"skdx-select__item","data-part":"item",role:"option",id:p(x),"data-value":s.value,"aria-selected":h.value,"data-state":h.value?"checked":"unchecked","data-highlighted":k.value?"":void 0,"data-text-value":s.textValue,"aria-disabled":s.disabled||void 0,"data-disabled":s.disabled?"":void 0,onClick:I,onPointerenter:T},[v(e.$slots,"default")],40,m))}});export{f as default};

package/dist/select/SelectItemIndicator.vue.d.cts

@@ -1,16 +1,9 @@
 /**
- * The marker shown inside a `<SkdxSelectOption>` while it is the selected one —
- * a checkmark, typically. Renders an `aria-hidden` `<span>` (the selection is
- * already announced by the option's `aria-selected`), and renders nothing at
- * all while its option is unselected unless `forceMount` is set.
- *
- * Optional: `data-state="checked"` on the option is still the styling hook for
- * consumers who would rather draw the mark in CSS. This part exists for the
- * ones who want a real glyph, and it is what the skin aligns to the end of the
- * row (`margin-inline-start: auto`).
+ * Selected-state glyph inside an Item, rendered only while selected (role="option").
+ * Renders aria-hidden (selection already announced by aria-selected).
  */
 type __VLS_Props = {
-    /** Keeps the marker mounted while unselected, so it can be animated in and out. */
+    /** Mount this indicator even while its item isn't selected, for animation exit transitions. */
     forceMount?: boolean;
 };
 declare var __VLS_1: {};

package/dist/select/SelectItemIndicator.vue.d.ts

@@ -1,16 +1,9 @@
 /**
- * The marker shown inside a `<SkdxSelectOption>` while it is the selected one —
- * a checkmark, typically. Renders an `aria-hidden` `<span>` (the selection is
- * already announced by the option's `aria-selected`), and renders nothing at
- * all while its option is unselected unless `forceMount` is set.
- *
- * Optional: `data-state="checked"` on the option is still the styling hook for
- * consumers who would rather draw the mark in CSS. This part exists for the
- * ones who want a real glyph, and it is what the skin aligns to the end of the
- * row (`margin-inline-start: auto`).
+ * Selected-state glyph inside an Item, rendered only while selected (role="option").
+ * Renders aria-hidden (selection already announced by aria-selected).
  */
 type __VLS_Props = {
-    /** Keeps the marker mounted while unselected, so it can be animated in and out. */
+    /** Mount this indicator even while its item isn't selected, for animation exit transitions. */
     forceMount?: boolean;
 };
 declare var __VLS_1: {};

package/dist/select/SelectItemIndicator.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const a=require("./context.cjs");let e=require("vue");var u={key:0,class:"skdx-select__item-indicator","data-part":"item-indicator","aria-hidden":"true"},d=(0,e.defineComponent)({__name:"SelectItemIndicator",props:{forceMount:{type:Boolean,default:!1}},setup(r){const o=r,t=(0,e.inject)(a.SELECT_OPTION_CONTEXT);if(!t)throw new Error("<SkdxSelectItemIndicator> must be used inside <SkdxSelectOption>.");const n=(0,e.computed)(()=>o.forceMount||t.selected.value);return(c,s)=>n.value?((0,e.openBlock)(),(0,e.createElementBlock)("span",u,[(0,e.renderSlot)(c.$slots,"default")])):(0,e.createCommentVNode)("",!0)}});exports.default=d;
+const a=require("./context.cjs");let e=require("vue");var u={key:0,class:"skdx-select__item-indicator","data-part":"item-indicator","aria-hidden":"true"},d=(0,e.defineComponent)({__name:"SelectItemIndicator",props:{forceMount:{type:Boolean,default:!1}},setup(r){const o=r,t=(0,e.inject)(a.SELECT_ITEM_CONTEXT);if(!t)throw new Error("<SkdxSelectItemIndicator> must be used inside <SkdxSelectItem>.");const n=(0,e.computed)(()=>o.forceMount||t.selected.value);return(c,s)=>n.value?((0,e.openBlock)(),(0,e.createElementBlock)("span",u,[(0,e.renderSlot)(c.$slots,"default")])):(0,e.createCommentVNode)("",!0)}});exports.default=d;

package/dist/select/SelectItemIndicator.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{SELECT_OPTION_CONTEXT as e}from"./context.js";import{computed as t,createCommentVNode as o,createElementBlock as a,defineComponent as r,inject as n,openBlock as s,renderSlot as c}from"vue";var d={key:0,class:"skdx-select__item-indicator","data-part":"item-indicator","aria-hidden":"true"},i=/* @__PURE__ */r({__name:"SelectItemIndicator",props:{forceMount:{type:Boolean,default:!1}},setup(r){const i=r,l=n(e);if(!l)throw new Error("<SkdxSelectItemIndicator> must be used inside <SkdxSelectOption>.");const m=t(()=>i.forceMount||l.selected.value);return(e,t)=>m.value?(s(),a("span",d,[c(e.$slots,"default")])):o("",!0)}});export{i as default};
+import{SELECT_ITEM_CONTEXT as e}from"./context.js";import{computed as t,createCommentVNode as o,createElementBlock as a,defineComponent as r,inject as s,openBlock as n,renderSlot as c}from"vue";var d={key:0,class:"skdx-select__item-indicator","data-part":"item-indicator","aria-hidden":"true"},i=/* @__PURE__ */r({__name:"SelectItemIndicator",props:{forceMount:{type:Boolean,default:!1}},setup(r){const i=r,l=s(e);if(!l)throw new Error("<SkdxSelectItemIndicator> must be used inside <SkdxSelectItem>.");const m=t(()=>i.forceMount||l.selected.value);return(e,t)=>m.value?(n(),a("span",d,[c(e.$slots,"default")])):o("",!0)}});export{i as default};

package/dist/select/SelectItemText.vue.d.cts

@@ -1,12 +1,5 @@
 /**
- * The label of a `<SkdxSelectOption>`, as a part of its own.
- *
- * Optional. Slotted text alone is still the option's label — `SelectOption`
- * reads its own `textContent` either way, so wrapping changes nothing about
- * what the trigger displays. What it changes is styling: the skin gives this
- * part the ellipsis treatment (`overflow: hidden; text-overflow: ellipsis`),
- * so an option whose label is longer than the popup truncates instead of
- * forcing the popup wider.
+ * An Item's label content, captured so Value can render it inside Trigger.
  */
 type __VLS_Props = {};
 declare var __VLS_1: {};

package/dist/select/SelectItemText.vue.d.ts

@@ -1,12 +1,5 @@
 /**
- * The label of a `<SkdxSelectOption>`, as a part of its own.
- *
- * Optional. Slotted text alone is still the option's label — `SelectOption`
- * reads its own `textContent` either way, so wrapping changes nothing about
- * what the trigger displays. What it changes is styling: the skin gives this
- * part the ellipsis treatment (`overflow: hidden; text-overflow: ellipsis`),
- * so an option whose label is longer than the popup truncates instead of
- * forcing the popup wider.
+ * An Item's label content, captured so Value can render it inside Trigger.
  */
 type __VLS_Props = {};
 declare var __VLS_1: {};

package/dist/select/SelectLabel.vue.d.cts

@@ -1,6 +1,5 @@
 /**
- * Heading for a {@link SelectGroup}. Purely presentational, with no
- * implicit `aria-labelledby` wiring to the group.
+ * Non-interactive heading for Group, providing its accessible name. Outside a Group it renders but does not name anything.
  */
 type __VLS_Props = {};
 declare var __VLS_1: {};

package/dist/select/SelectLabel.vue.d.ts

@@ -1,6 +1,5 @@
 /**
- * Heading for a {@link SelectGroup}. Purely presentational, with no
- * implicit `aria-labelledby` wiring to the group.
+ * Non-interactive heading for Group, providing its accessible name. Outside a Group it renders but does not name anything.
  */
 type __VLS_Props = {};
 declare var __VLS_1: {};

package/dist/select/SelectLabel.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-let e=require("vue");var l={class:"skdx-select__label","data-part":"label"},a=(0,e.defineComponent)({__name:"SelectLabel",setup(_){return(t,r)=>((0,e.openBlock)(),(0,e.createElementBlock)("div",l,[(0,e.renderSlot)(t.$slots,"default")]))}});exports.default=a;
+const r=require("./context.cjs");let e=require("vue");var _=["id"],a=(0,e.defineComponent)({__name:"SelectLabel",setup(u){const t=(0,e.inject)(r.SELECT_GROUP_CONTEXT,null);return(l,n)=>((0,e.openBlock)(),(0,e.createElementBlock)("div",{class:"skdx-select__label","data-part":"label",id:(0,e.unref)(t)?.labelId},[(0,e.renderSlot)(l.$slots,"default")],8,_))}});exports.default=a;

package/dist/select/SelectLabel.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{createElementBlock as e,defineComponent as a,openBlock as l,renderSlot as t}from"vue";var s={class:"skdx-select__label","data-part":"label"},o=/* @__PURE__ */a({__name:"SelectLabel",setup:a=>(a,o)=>(l(),e("div",s,[t(a.$slots,"default")]))});export{o as default};
+import{SELECT_GROUP_CONTEXT as e}from"./context.js";import{createElementBlock as a,defineComponent as t,inject as l,openBlock as s,renderSlot as o,unref as n}from"vue";var r=["id"],d=/* @__PURE__ */t({__name:"SelectLabel",setup(t){const d=l(e,null);return(e,t)=>(s(),a("div",{class:"skdx-select__label","data-part":"label",id:n(d)?.labelId},[o(e.$slots,"default")],8,r))}});export{d as default};

package/dist/select/SelectSeparator.vue.d.cts

@@ -1,5 +1,5 @@
 /**
- * Visual divider between `SkdxSelectOption`s or `SkdxSelectGroup`s inside
+ * Visual divider between `SkdxSelectItem`s or `SkdxSelectGroup`s inside
  * {@link SelectContent}. Renders an `aria-hidden` `<div>`.
  */
 type __VLS_Props = {};

package/dist/select/SelectSeparator.vue.d.ts

@@ -1,5 +1,5 @@
 /**
- * Visual divider between `SkdxSelectOption`s or `SkdxSelectGroup`s inside
+ * Visual divider between `SkdxSelectItem`s or `SkdxSelectGroup`s inside
  * {@link SelectContent}. Renders an `aria-hidden` `<div>`.
  */
 type __VLS_Props = {};

package/dist/select/SelectTrigger.vue.d.cts

@@ -1,18 +1,8 @@
 /**
- * Opens the {@link SelectContext}'s listbox and displays the current value;
- * also registers itself as the anchor `SkdxSelectContent` positions against.
- * Renders `<button type="button" role="combobox">` with
- * `aria-haspopup="listbox"`, `aria-expanded`, `aria-controls`,
- * `aria-required`, `data-state`, `data-disabled`, `data-invalid`,
- * `data-placeholder`, and `data-multiple`. Click, Enter, Space, or Arrow
- * Up/Down opens the listbox.
- *
- * Printable characters run typeahead against the root's option collection
- * *without* opening the listbox, the way a native closed `<select>` behaves —
- * which needs labels the root already knows, so pass `items` on the root if
- * the listbox has never been opened. A `multiple` select opens the listbox
- * instead: changing an unseen selection blind would silently toggle an option
- * the user cannot check.
+ * Combobox trigger; keeps DOM focus throughout interaction. Opens listbox
+ * (unless readOnly), owns keyboard navigation (arrows, Home/End, typeahead,
+ * Enter/Space/Tab to commit). Multiple select: Tab adds, never removes.
+ * Requires `aria-label` or explicit label via `aria-labelledby`.
  */
 type __VLS_Props = {};
 declare var __VLS_1: {};

package/dist/select/SelectTrigger.vue.d.ts

@@ -1,18 +1,8 @@
 /**
- * Opens the {@link SelectContext}'s listbox and displays the current value;
- * also registers itself as the anchor `SkdxSelectContent` positions against.
- * Renders `<button type="button" role="combobox">` with
- * `aria-haspopup="listbox"`, `aria-expanded`, `aria-controls`,
- * `aria-required`, `data-state`, `data-disabled`, `data-invalid`,
- * `data-placeholder`, and `data-multiple`. Click, Enter, Space, or Arrow
- * Up/Down opens the listbox.
- *
- * Printable characters run typeahead against the root's option collection
- * *without* opening the listbox, the way a native closed `<select>` behaves —
- * which needs labels the root already knows, so pass `items` on the root if
- * the listbox has never been opened. A `multiple` select opens the listbox
- * instead: changing an unseen selection blind would silently toggle an option
- * the user cannot check.
+ * Combobox trigger; keeps DOM focus throughout interaction. Opens listbox
+ * (unless readOnly), owns keyboard navigation (arrows, Home/End, typeahead,
+ * Enter/Space/Tab to commit). Multiple select: Tab adds, never removes.
+ * Requires `aria-label` or explicit label via `aria-labelledby`.
  */
 type __VLS_Props = {};
 declare var __VLS_1: {};

package/dist/select/SelectTrigger.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const o=require("../utils/useTypeahead.cjs"),c=require("./context.cjs");let t=require("vue");var p=["aria-expanded","aria-controls","aria-required","aria-invalid","data-state","data-disabled","data-invalid","data-placeholder","data-multiple","disabled"],f=(0,t.defineComponent)({__name:"SelectTrigger",setup(v){const e=(0,t.inject)(c.SELECT_CONTEXT);if(!e)throw new Error("[skdx] SkdxSelectTrigger must be used within SkdxSelect.");const d=(0,t.ref)(null);(0,t.onMounted)(()=>{e.triggerEl=d.value});const u=o.useTypeahead();function s(r){if(["ArrowDown","ArrowUp"," ","Enter"].includes(r.key)){r.preventDefault(),e.setOpen(!0);return}if(e.open||!o.isTypeaheadKey(r))return;if(r.preventDefault(),e.multiple){e.setOpen(!0);return}const a=e.collection.filter(n=>!n.disabled),i=a.findIndex(n=>e.isSelected(n.value)),l=u(r.key,a.map(n=>n.label??n.value),i);l!==-1&&e.selectItem(a[l].value)}return(r,a)=>((0,t.openBlock)(),(0,t.createElementBlock)("button",{class:"skdx-select__trigger","data-part":"trigger",ref_key:"buttonRef",ref:d,type:"button",role:"combobox","aria-haspopup":"listbox","aria-expanded":(0,t.unref)(e).open,"aria-controls":(0,t.unref)(e).contentId,"aria-required":(0,t.unref)(e).required||void 0,"aria-invalid":(0,t.unref)(e).invalid?!0:void 0,"data-state":(0,t.unref)(e).open?"open":"closed","data-disabled":(0,t.unref)(e).disabled?"":void 0,"data-invalid":(0,t.unref)(e).invalid?"":void 0,"data-placeholder":(0,t.unref)(e).selectedValues.length===0?"":void 0,"data-multiple":(0,t.unref)(e).multiple?"":void 0,disabled:(0,t.unref)(e).disabled,onClick:a[0]||(a[0]=i=>(0,t.unref)(e).setOpen(!(0,t.unref)(e).open)),onKeydown:s},[(0,t.renderSlot)(r.$slots,"default")],40,p))}});exports.default=f;
+const _=require("../utils/useRovingFocus.cjs"),u=require("../utils/useTypeahead.cjs"),v=require("./context.cjs");let a=require("vue");var x=["aria-expanded","aria-controls","aria-activedescendant","aria-required","aria-invalid","aria-readonly","data-state","data-disabled","data-readonly","data-invalid","data-placeholder","data-multiple","disabled","aria-labelledby"],A=10,D=(0,a.defineComponent)({inheritAttrs:!1,__name:"SelectTrigger",setup(E){const p={ArrowDown:"first",Home:"first",ArrowUp:"last",End:"last",Enter:"selected"," ":"selected"},t=(0,a.inject)(v.SELECT_CONTEXT);if(!t)throw new Error("[skdx] SkdxSelectTrigger must be used within SkdxSelect.");const s=(0,a.useAttrs)(),c=(0,a.ref)(null);(0,a.onMounted)(()=>{t.triggerEl=c.value});const y=u.useTypeahead(),m=u.useTypeahead(),b=(0,a.computed)(()=>{const e=s["aria-labelledby"];return s["aria-label"]!==void 0||!t.hasValuePart?e:[e,t.valueId].filter(Boolean).join(" ")});function k(){return Array.from(t.contentEl?.querySelectorAll('[role="option"]:not([data-disabled])')??[])}function o(e){e&&(t.setActiveId(e.id),e.scrollIntoView?.({block:"nearest"}))}function f(e){const r=e?.getAttribute("data-value");r!=null&&(t.selectItem(r),t.closeOnSelect&&t.setOpen(!1))}function h(e){const r=e?.getAttribute("data-value");r!=null&&(t.multiple&&t.isSelected(r)||t.selectItem(r))}function g(e){const r=k(),n=r.findIndex(i=>i.id===t.activeId);if(e.altKey&&(e.key==="ArrowUp"||e.key==="ArrowDown")){e.preventDefault(),e.key==="ArrowUp"&&(f(r[n]),t.setOpen(!1));return}if(e.key==="ArrowDown"||e.key==="ArrowUp"){if(e.preventDefault(),r.length===0)return;const i=e.key==="ArrowDown"?1:-1;o(r[Math.min(r.length-1,Math.max(0,n+i))]);return}if(e.key==="PageDown"||e.key==="PageUp"){if(e.preventDefault(),r.length===0)return;const i=e.key==="PageDown"?A:-10;o(r[Math.min(r.length-1,Math.max(0,n+i))]);return}if(e.key==="Home"||e.key==="End"){e.preventDefault(),o(e.key==="Home"?r[0]:r[r.length-1]);return}if(e.key==="Enter"||e.key===" "){e.preventDefault(),f(r[n]);return}if(e.key==="Tab"){h(r[n]),t.setOpen(!1);return}if(!u.isTypeaheadKey(e))return;e.preventDefault();const d=m(e.key,r.map(i=>_.itemText(i)),n);d!==-1&&o(r[d])}function w(e){if(t.open){g(e);return}const r=p[e.key];if(e.altKey&&e.key==="ArrowUp")return;if(r!==void 0){e.preventDefault(),t.openIntent=e.altKey&&e.key==="ArrowDown"?"selected":r,t.setOpen(!0);return}if(!u.isTypeaheadKey(e))return;if(e.preventDefault(),t.multiple){t.setOpen(!0);return}const n=t.collection.filter(l=>!l.disabled),d=n.findIndex(l=>t.isSelected(l.value)),i=y(e.key,n.map(l=>l.label??l.value),d);i!==-1&&t.selectItem(n[i].value)}return(e,r)=>((0,a.openBlock)(),(0,a.createElementBlock)("button",(0,a.mergeProps)({class:"skdx-select__trigger","data-part":"trigger",ref_key:"buttonRef",ref:c,type:"button",role:"combobox","aria-haspopup":"listbox","aria-expanded":(0,a.unref)(t).open,"aria-controls":(0,a.unref)(t).contentId,"aria-activedescendant":(0,a.unref)(t).activeId??void 0,"aria-required":(0,a.unref)(t).required||void 0,"aria-invalid":(0,a.unref)(t).invalid?!0:void 0,"aria-readonly":(0,a.unref)(t).readOnly?!0:void 0,"data-state":(0,a.unref)(t).open?"open":"closed","data-disabled":(0,a.unref)(t).disabled?"":void 0,"data-readonly":(0,a.unref)(t).readOnly?"":void 0,"data-invalid":(0,a.unref)(t).invalid?"":void 0,"data-placeholder":(0,a.unref)(t).selectedValues.length===0?"":void 0,"data-multiple":(0,a.unref)(t).multiple?"":void 0,disabled:(0,a.unref)(t).disabled},e.$attrs,{"aria-labelledby":b.value,onClick:r[0]||(r[0]=n=>(0,a.unref)(t).setOpen(!(0,a.unref)(t).open)),onKeydown:w}),[(0,a.renderSlot)(e.$slots,"default")],16,x))}});exports.default=D;

package/dist/select/SelectTrigger.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{isTypeaheadKey as e,useTypeahead as a}from"../utils/useTypeahead.js";import{SELECT_CONTEXT as t}from"./context.js";import{createElementBlock as d,defineComponent as i,inject as r,onMounted as l,openBlock as o,ref as n,renderSlot as s,unref as u}from"vue";var p=["aria-expanded","aria-controls","aria-required","aria-invalid","data-state","data-disabled","data-invalid","data-placeholder","data-multiple","disabled"],c=/* @__PURE__ */i({__name:"SelectTrigger",setup(i){const c=r(t);if(!c)throw new Error("[skdx] SkdxSelectTrigger must be used within SkdxSelect.");const v=n(null);l(()=>{c.triggerEl=v.value});const f=a();function m(a){if(["ArrowDown","ArrowUp"," ","Enter"].includes(a.key))return a.preventDefault(),void c.setOpen(!0);if(c.open||!e(a))return;if(a.preventDefault(),c.multiple)return void c.setOpen(!0);const t=c.collection.filter(e=>!e.disabled),d=t.findIndex(e=>c.isSelected(e.value)),i=f(a.key,t.map(e=>e.label??e.value),d);-1!==i&&c.selectItem(t[i].value)}return(e,a)=>(o(),d("button",{class:"skdx-select__trigger","data-part":"trigger",ref_key:"buttonRef",ref:v,type:"button",role:"combobox","aria-haspopup":"listbox","aria-expanded":u(c).open,"aria-controls":u(c).contentId,"aria-required":u(c).required||void 0,"aria-invalid":!!u(c).invalid||void 0,"data-state":u(c).open?"open":"closed","data-disabled":u(c).disabled?"":void 0,"data-invalid":u(c).invalid?"":void 0,"data-placeholder":0===u(c).selectedValues.length?"":void 0,"data-multiple":u(c).multiple?"":void 0,disabled:u(c).disabled,onClick:a[0]||(a[0]=e=>u(c).setOpen(!u(c).open)),onKeydown:m},[s(e.$slots,"default")],40,p))}});export{c as default};
+import{itemText as e}from"../utils/useRovingFocus.js";import{isTypeaheadKey as t,useTypeahead as a}from"../utils/useTypeahead.js";import{SELECT_CONTEXT as r}from"./context.js";import{computed as n,createElementBlock as i,defineComponent as o,inject as l,mergeProps as d,onMounted as s,openBlock as u,ref as c,renderSlot as p,unref as v,useAttrs as f}from"vue";var y=["aria-expanded","aria-controls","aria-activedescendant","aria-required","aria-invalid","aria-readonly","data-state","data-disabled","data-readonly","data-invalid","data-placeholder","data-multiple","disabled","aria-labelledby"],m=/* @__PURE__ */o({inheritAttrs:!1,__name:"SelectTrigger",setup(o){const m={ArrowDown:"first",Home:"first",ArrowUp:"last",End:"last",Enter:"selected"," ":"selected"},k=l(r);if(!k)throw new Error("[skdx] SkdxSelectTrigger must be used within SkdxSelect.");const b=f(),g=c(null);s(()=>{k.triggerEl=g.value});const w=a(),h=a(),A=n(()=>{const e=b["aria-labelledby"];return void 0===b["aria-label"]&&k.hasValuePart?[e,k.valueId].filter(Boolean).join(" "):e});function x(e){e&&(k.setActiveId(e.id),e.scrollIntoView?.({block:"nearest"}))}function D(e){const t=e?.getAttribute("data-value");null!=t&&(k.selectItem(t),k.closeOnSelect&&k.setOpen(!1))}function I(a){if(k.open)return void function(a){const r=Array.from(k.contentEl?.querySelectorAll('[role="option"]:not([data-disabled])')??[]),n=r.findIndex(e=>e.id===k.activeId);if(a.altKey&&("ArrowUp"===a.key||"ArrowDown"===a.key))return a.preventDefault(),void("ArrowUp"===a.key&&(D(r[n]),k.setOpen(!1)));if("ArrowDown"===a.key||"ArrowUp"===a.key){if(a.preventDefault(),0===r.length)return;const e="ArrowDown"===a.key?1:-1;return void x(r[Math.min(r.length-1,Math.max(0,n+e))])}if("PageDown"===a.key||"PageUp"===a.key){if(a.preventDefault(),0===r.length)return;const e="PageDown"===a.key?10:-10;return void x(r[Math.min(r.length-1,Math.max(0,n+e))])}if("Home"===a.key||"End"===a.key)return a.preventDefault(),void x("Home"===a.key?r[0]:r[r.length-1]);if("Enter"===a.key||" "===a.key)return a.preventDefault(),void D(r[n]);if("Tab"===a.key)return function(e){const t=e?.getAttribute("data-value");null!=t&&(k.multiple&&k.isSelected(t)||k.selectItem(t))}(r[n]),void k.setOpen(!1);if(!t(a))return;a.preventDefault();const i=h(a.key,r.map(t=>e(t)),n);-1!==i&&x(r[i])}(a);const r=m[a.key];if(a.altKey&&"ArrowUp"===a.key)return;if(void 0!==r)return a.preventDefault(),k.openIntent=a.altKey&&"ArrowDown"===a.key?"selected":r,void k.setOpen(!0);if(!t(a))return;if(a.preventDefault(),k.multiple)return void k.setOpen(!0);const n=k.collection.filter(e=>!e.disabled),i=n.findIndex(e=>k.isSelected(e.value)),o=w(a.key,n.map(e=>e.label??e.value),i);-1!==o&&k.selectItem(n[o].value)}return(e,t)=>(u(),i("button",d({class:"skdx-select__trigger","data-part":"trigger",ref_key:"buttonRef",ref:g,type:"button",role:"combobox","aria-haspopup":"listbox","aria-expanded":v(k).open,"aria-controls":v(k).contentId,"aria-activedescendant":v(k).activeId??void 0,"aria-required":v(k).required||void 0,"aria-invalid":!!v(k).invalid||void 0,"aria-readonly":!!v(k).readOnly||void 0,"data-state":v(k).open?"open":"closed","data-disabled":v(k).disabled?"":void 0,"data-readonly":v(k).readOnly?"":void 0,"data-invalid":v(k).invalid?"":void 0,"data-placeholder":0===v(k).selectedValues.length?"":void 0,"data-multiple":v(k).multiple?"":void 0,disabled:v(k).disabled},e.$attrs,{"aria-labelledby":A.value,onClick:t[0]||(t[0]=e=>v(k).setOpen(!v(k).open)),onKeydown:I}),[p(e.$slots,"default")],16,y))}});export{m as default};