@skdx/vue 0.27.0 → 0.29.0

package/dist/scroll-area/ScrollAreaThumb.vue.d.ts

@@ -1,11 +1,4 @@
-/**
- * The draggable handle inside a `SkdxScrollAreaScrollbar`, sized and
- * positioned as a percentage of its track to match the viewport's visible
- * fraction and scroll offset. Renders `<div data-skdx-scroll-area-thumb>`
- * with `data-orientation` inherited from the enclosing scrollbar. Dragging it
- * (pointer capture-based) scrolls the viewport proportionally along that axis.
- * Must be used inside `SkdxScrollArea`.
- */
+/** Draggable handle in `SkdxScrollAreaScrollbar`, sized and positioned as a percentage of the track. */
 type __VLS_Props = {};
 declare const _default: 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>;
 export default _default;

package/dist/scroll-area/ScrollAreaThumb.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const w=require("./context.cjs");let o=require("vue");var M=["data-orientation"],C=.1,E=(0,o.defineComponent)({__name:"ScrollAreaThumb",setup(L){const d=(0,o.inject)(w.SCROLL_AREA_CONTEXT);if(!d)throw new Error("SkdxScrollAreaThumb must be used within SkdxScrollArea.");const n=d,r=(0,o.inject)(w.SCROLLBAR_ORIENTATION_CONTEXT,(0,o.computed)(()=>"vertical")),h=(0,o.ref)(null),a=(0,o.ref)(0),m=(0,o.ref)(0),f=(0,o.ref)(null);function c(){const e=n.viewportRef.value;if(!e)return;const[t,l,i]=r.value==="vertical"?[e.clientHeight,e.scrollHeight,e.scrollTop]:[e.clientWidth,e.scrollWidth,e.scrollLeft],u=l>0?t/l:1;a.value=Math.min(Math.max(u,C),1);const v=l-t;m.value=v>0?i/v:0}let s,_;(0,o.onMounted)(()=>{c();const e=n.viewportRef.value;if(e&&(_=e,e.addEventListener("scroll",c),typeof ResizeObserver<"u")){s=new ResizeObserver(c),s.observe(e);const t=n.contentRef.value;t&&s.observe(t)}}),(0,o.onBeforeUnmount)(()=>{_?.removeEventListener("scroll",c),s?.disconnect()});function g(e){const t=n.viewportRef.value;t&&(e.target.setPointerCapture?.(e.pointerId),f.value={startPointer:r.value==="vertical"?e.clientY:e.clientX,startScroll:r.value==="vertical"?t.scrollTop:t.scrollLeft})}function P(e){if(!e.target.hasPointerCapture?.(e.pointerId))return;const t=n.viewportRef.value,l=h.value?.parentElement,i=f.value;if(!t||!l||!i)return;const u=r.value==="vertical"?l.clientHeight:l.clientWidth,v=r.value==="vertical"?t.clientHeight:t.clientWidth,p=(r.value==="vertical"?t.scrollHeight:t.scrollWidth)-v;if(p<=0)return;const k=u*a.value,z=Math.max(u-k,1),A=((r.value==="vertical"?e.clientY:e.clientX)-i.startPointer)/z*p,R=Math.min(Math.max(i.startScroll+A,0),p);r.value==="vertical"?t.scrollTop=R:t.scrollLeft=R}function T(e){e.target.hasPointerCapture?.(e.pointerId)&&e.target.releasePointerCapture(e.pointerId),f.value=null}const b=(0,o.computed)(()=>`${a.value*100}%`),S=(0,o.computed)(()=>`${m.value*(100-a.value*100)}%`),x=(0,o.computed)(()=>r.value==="vertical"?{position:"absolute",top:S.value,height:b.value,left:0,right:0}:{position:"absolute",left:S.value,width:b.value,top:0,bottom:0});return(e,t)=>((0,o.openBlock)(),(0,o.createElementBlock)("div",{class:"skdx-scroll-area__thumb","data-part":"thumb",ref_key:"thumbRef",ref:h,"data-skdx-scroll-area-thumb":"","data-orientation":(0,o.unref)(r),style:(0,o.normalizeStyle)({touchAction:"none",...x.value}),onPointerdown:g,onPointermove:P,onPointerup:T},null,44,M))}});exports.default=E;
+const I=require("../utils/injectRequired.cjs"),L=require("../utils/direction.cjs"),w=require("./context.cjs");let r=require("vue");var O=["data-orientation"],C=.1,E=(0,r.defineComponent)({__name:"ScrollAreaThumb",setup(B){const n=I.injectRequired(w.SCROLL_AREA_CONTEXT,"SkdxScrollAreaThumb must be used within SkdxScrollArea."),o=(0,r.inject)(w.SCROLLBAR_ORIENTATION_CONTEXT,(0,r.computed)(()=>"vertical")),f=(0,r.ref)(null),a=(0,r.ref)(0),h=(0,r.ref)(0),p=(0,r.ref)(null);function c(){const e=n.viewportRef.value;if(!e)return;const[t,l,i]=o.value==="vertical"?[e.clientHeight,e.scrollHeight,e.scrollTop]:[e.clientWidth,e.scrollWidth,e.scrollLeft],u=l>0?t/l:1;a.value=Math.min(Math.max(u,C),1);const v=l-t;h.value=v>0?Math.abs(i)/v:0}let s,m;(0,r.onMounted)(()=>{c();const e=n.viewportRef.value;if(e&&(m=e,e.addEventListener("scroll",c,{passive:!0}),typeof ResizeObserver<"u")){s=new ResizeObserver(c),s.observe(e);const t=n.contentRef.value;t&&s.observe(t)}}),(0,r.onBeforeUnmount)(()=>{m?.removeEventListener("scroll",c,{passive:!0}),s?.disconnect()});function g(e){const t=n.viewportRef.value;t&&(e.target.setPointerCapture?.(e.pointerId),p.value={startPointer:o.value==="vertical"?e.clientY:e.clientX,startScroll:o.value==="vertical"?t.scrollTop:t.scrollLeft})}function T(e){const t=n.viewportRef.value,l=f.value?.parentElement,i=p.value;if(!t||!l||!i)return;const u=o.value==="vertical"?l.clientHeight:l.clientWidth,v=o.value==="vertical"?t.clientHeight:t.clientWidth,d=(o.value==="vertical"?t.scrollHeight:t.scrollWidth)-v;if(d<=0)return;const z=u*a.value,M=Math.max(u-z,1),k=((o.value==="vertical"?e.clientY:e.clientX)-i.startPointer)/M*d,R=o.value==="horizontal"&&L.resolveDirection(t)==="rtl",A=R?-d:0,q=R?0:d,S=Math.min(Math.max(i.startScroll+k,A),q);o.value==="vertical"?t.scrollTop=S:t.scrollLeft=S}function P(e){e.target.hasPointerCapture?.(e.pointerId)&&e.target.releasePointerCapture(e.pointerId),p.value=null}const _=(0,r.computed)(()=>`${a.value*100}%`),b=(0,r.computed)(()=>`${h.value*(100-a.value*100)}%`),x=(0,r.computed)(()=>o.value==="vertical"?{position:"absolute",top:b.value,height:_.value,left:0,right:0}:{position:"absolute",insetInlineStart:b.value,width:_.value,top:0,bottom:0});return(e,t)=>((0,r.openBlock)(),(0,r.createElementBlock)("div",{ref_key:"thumbRef",ref:f,class:"skdx-scroll-area__thumb","data-part":"thumb","data-skdx-scroll-area-thumb":"","aria-hidden":"true","data-orientation":(0,r.unref)(o),style:(0,r.normalizeStyle)({touchAction:"none",...x.value}),onPointerdown:g,onPointermove:T,onPointerup:P},null,44,O))}});exports.default=E;

package/dist/scroll-area/ScrollAreaThumb.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{SCROLLBAR_ORIENTATION_CONTEXT as e,SCROLL_AREA_CONTEXT as t}from"./context.js";import{computed as l,createElementBlock as r,defineComponent as a,inject as o,normalizeStyle as n,onBeforeUnmount as i,onMounted as s,openBlock as c,ref as u,unref as v}from"vue";var f=["data-orientation"],h=/* @__PURE__ */a({__name:"ScrollAreaThumb",setup(a){const h=o(t);if(!h)throw new Error("SkdxScrollAreaThumb must be used within SkdxScrollArea.");const p=h,d=o(e,l(()=>"vertical")),m=u(null),b=u(0),R=u(0),g=u(null);function T(){const e=p.viewportRef.value;if(!e)return;const[t,l,r]="vertical"===d.value?[e.clientHeight,e.scrollHeight,e.scrollTop]:[e.clientWidth,e.scrollWidth,e.scrollLeft],a=l>0?t/l:1;b.value=Math.min(Math.max(a,.1),1);const o=l-t;R.value=o>0?r/o:0}let w,S;function x(e){const t=p.viewportRef.value;t&&(e.target.setPointerCapture?.(e.pointerId),g.value={startPointer:"vertical"===d.value?e.clientY:e.clientX,startScroll:"vertical"===d.value?t.scrollTop:t.scrollLeft})}function C(e){if(!e.target.hasPointerCapture?.(e.pointerId))return;const t=p.viewportRef.value,l=m.value?.parentElement,r=g.value;if(!t||!l||!r)return;const a="vertical"===d.value?l.clientHeight:l.clientWidth,o="vertical"===d.value?t.clientHeight:t.clientWidth,n=("vertical"===d.value?t.scrollHeight:t.scrollWidth)-o;if(n<=0)return;const i=a*b.value,s=Math.max(a-i,1),c=(("vertical"===d.value?e.clientY:e.clientX)-r.startPointer)/s*n,u=Math.min(Math.max(r.startScroll+c,0),n);"vertical"===d.value?t.scrollTop=u:t.scrollLeft=u}function E(e){e.target.hasPointerCapture?.(e.pointerId)&&e.target.releasePointerCapture(e.pointerId),g.value=null}s(()=>{T();const e=p.viewportRef.value;if(e&&(S=e,e.addEventListener("scroll",T),typeof ResizeObserver<"u")){w=new ResizeObserver(T),w.observe(e);const t=p.contentRef.value;t&&w.observe(t)}}),i(()=>{S?.removeEventListener("scroll",T),w?.disconnect()});const L=l(()=>100*b.value+"%"),P=l(()=>R.value*(100-100*b.value)+"%"),_=l(()=>"vertical"===d.value?{position:"absolute",top:P.value,height:L.value,left:0,right:0}:{position:"absolute",left:P.value,width:L.value,top:0,bottom:0});return(e,t)=>(c(),r("div",{class:"skdx-scroll-area__thumb","data-part":"thumb",ref_key:"thumbRef",ref:m,"data-skdx-scroll-area-thumb":"","data-orientation":v(d),style:n({touchAction:"none",..._.value}),onPointerdown:x,onPointermove:C,onPointerup:E},null,44,f))}});export{h as default};
+import{injectRequired as e}from"../utils/injectRequired.js";import{resolveDirection as t}from"../utils/direction.js";import{SCROLLBAR_ORIENTATION_CONTEXT as l,SCROLL_AREA_CONTEXT as a}from"./context.js";import{computed as r,createElementBlock as o,defineComponent as i,inject as n,normalizeStyle as s,onBeforeUnmount as c,onMounted as u,openBlock as v,ref as d,unref as p}from"vue";var h=["data-orientation"],f=/* @__PURE__ */i({__name:"ScrollAreaThumb",setup(i){const f=e(a,"SkdxScrollAreaThumb must be used within SkdxScrollArea."),m=n(l,r(()=>"vertical")),b=d(null),R=d(0),S=d(0),T=d(null);function g(){const e=f.viewportRef.value;if(!e)return;const[t,l,a]="vertical"===m.value?[e.clientHeight,e.scrollHeight,e.scrollTop]:[e.clientWidth,e.scrollWidth,e.scrollLeft],r=l>0?t/l:1;R.value=Math.min(Math.max(r,.1),1);const o=l-t;S.value=o>0?Math.abs(a)/o:0}let x,L;function _(e){const t=f.viewportRef.value;t&&(e.target.setPointerCapture?.(e.pointerId),T.value={startPointer:"vertical"===m.value?e.clientY:e.clientX,startScroll:"vertical"===m.value?t.scrollTop:t.scrollLeft})}function w(e){const l=f.viewportRef.value,a=b.value?.parentElement,r=T.value;if(!l||!a||!r)return;const o="vertical"===m.value?a.clientHeight:a.clientWidth,i="vertical"===m.value?l.clientHeight:l.clientWidth,n=("vertical"===m.value?l.scrollHeight:l.scrollWidth)-i;if(n<=0)return;const s=o*R.value,c=Math.max(o-s,1),u=(("vertical"===m.value?e.clientY:e.clientX)-r.startPointer)/c*n,v="horizontal"===m.value&&"rtl"===t(l),d=v?-n:0,p=v?0:n,h=Math.min(Math.max(r.startScroll+u,d),p);"vertical"===m.value?l.scrollTop=h:l.scrollLeft=h}function A(e){e.target.hasPointerCapture?.(e.pointerId)&&e.target.releasePointerCapture(e.pointerId),T.value=null}u(()=>{g();const e=f.viewportRef.value;if(e&&(L=e,e.addEventListener("scroll",g,{passive:!0}),typeof ResizeObserver<"u")){x=new ResizeObserver(g),x.observe(e);const t=f.contentRef.value;t&&x.observe(t)}}),c(()=>{L?.removeEventListener("scroll",g,{passive:!0}),x?.disconnect()});const C=r(()=>100*R.value+"%"),E=r(()=>S.value*(100-100*R.value)+"%"),O=r(()=>"vertical"===m.value?{position:"absolute",top:E.value,height:C.value,left:0,right:0}:{position:"absolute",insetInlineStart:E.value,width:C.value,top:0,bottom:0});return(e,t)=>(v(),o("div",{ref_key:"thumbRef",ref:b,class:"skdx-scroll-area__thumb","data-part":"thumb","data-skdx-scroll-area-thumb":"","aria-hidden":"true","data-orientation":p(m),style:s({touchAction:"none",...O.value}),onPointerdown:_,onPointermove:w,onPointerup:A},null,44,h))}});export{f as default};

package/dist/scroll-area/ScrollAreaViewport.vue.d.cts

@@ -1,14 +1,15 @@
-/**
- * The natively-scrollable region (`overflow: auto`) that renders slotted
- * content. Wraps it in an inner `<div data-skdx-scroll-area-content>` used to
- * measure content size, and watches both elements with a `ResizeObserver` to
- * keep `SkdxScrollArea`'s scrollbar-enabled flags current. Sets
- * `data-skdx-scroll-area-viewport` on the scrollable element and flips
- * `scrolling` true for the root's `scrollHideDelay` (600ms by default) after
- * each scroll event (used to drive
- * `type="scroll"` visibility). Must be used inside `SkdxScrollArea`.
- */
-type __VLS_Props = {};
+import { type StyleValue } from 'vue';
+/** Natively-scrollable region that wraps content in a div for overflow measurement. */
+type __VLS_Props = {
+    /**
+     * Class and style for the internal content wrapper; style merges onto, not replaces, its measurement defaults.
+     * @default undefined
+     */
+    contentProps?: {
+        class?: string;
+        style?: StyleValue;
+    };
+};
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;

package/dist/scroll-area/ScrollAreaViewport.vue.d.ts

@@ -1,14 +1,15 @@
-/**
- * The natively-scrollable region (`overflow: auto`) that renders slotted
- * content. Wraps it in an inner `<div data-skdx-scroll-area-content>` used to
- * measure content size, and watches both elements with a `ResizeObserver` to
- * keep `SkdxScrollArea`'s scrollbar-enabled flags current. Sets
- * `data-skdx-scroll-area-viewport` on the scrollable element and flips
- * `scrolling` true for the root's `scrollHideDelay` (600ms by default) after
- * each scroll event (used to drive
- * `type="scroll"` visibility). Must be used inside `SkdxScrollArea`.
- */
-type __VLS_Props = {};
+import { type StyleValue } from 'vue';
+/** Natively-scrollable region that wraps content in a div for overflow measurement. */
+type __VLS_Props = {
+    /**
+     * Class and style for the internal content wrapper; style merges onto, not replaces, its measurement defaults.
+     * @default undefined
+     */
+    contentProps?: {
+        class?: string;
+        style?: StyleValue;
+    };
+};
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;

package/dist/scroll-area/ScrollAreaViewport.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +1 @@
-const u=require("./context.cjs");let r=require("vue");var d=(0,r.defineComponent)({__name:"ScrollAreaViewport",setup(v){const c=(0,r.inject)(u.SCROLL_AREA_CONTEXT);if(!c)throw new Error("SkdxScrollAreaViewport must be used within SkdxScrollArea.");const e=c;function l(){const t=e.viewportRef.value;t&&(e.scrollbarXEnabled.value=t.scrollWidth>t.clientWidth,e.scrollbarYEnabled.value=t.scrollHeight>t.clientHeight)}let n;function s(){l(),e.scrolling.value=!0,clearTimeout(n),n=setTimeout(()=>{e.scrolling.value=!1},e.scrollHideDelay.value)}let o;return(0,r.onMounted)(()=>{l();const t=e.viewportRef.value;if(!t||typeof ResizeObserver>"u")return;o=new ResizeObserver(l),o.observe(t);const a=e.contentRef.value;a&&o.observe(a)}),(0,r.onBeforeUnmount)(()=>{o?.disconnect(),clearTimeout(n)}),(t,a)=>((0,r.openBlock)(),(0,r.createElementBlock)("div",{class:"skdx-scroll-area__viewport","data-part":"viewport","data-skdx-scroll-area-viewport":"",tabindex:"0",ref:i=>(0,r.unref)(e).viewportRef.value=i,style:{overflow:"auto"},onScroll:s},[(0,r.createElementVNode)("div",{"data-skdx-scroll-area-content":"",ref:i=>(0,r.unref)(e).contentRef.value=i,style:{"min-width":"100%",display:"table"}},[(0,r.renderSlot)(t.$slots,"default")],512)],544))}});exports.default=d;
+const S=require("../utils/injectRequired.cjs"),R=require("./context.cjs");let t=require("vue");var x=["role"],c=1,y=(0,t.defineComponent)({__name:"ScrollAreaViewport",props:{contentProps:{}},setup(m){function u(e,o,l){const f=o-l;if(f<=c)return"none";const p=Math.abs(e),_=p>c,h=p<f-c;return _&&h?"both":_?"start":"end"}const d=m,r=S.injectRequired(R.SCROLL_AREA_CONTEXT,"SkdxScrollAreaViewport must be used within SkdxScrollArea."),v=(0,t.useAttrs)(),b=(0,t.computed)(()=>v["aria-label"]!=null||v["aria-labelledby"]!=null?"region":void 0);function n(){const e=r.viewportRef.value;e&&(r.scrollbarXEnabled.value=e.scrollWidth>e.clientWidth,r.scrollbarYEnabled.value=e.scrollHeight>e.clientHeight,r.reportScrollPosition({x:e.scrollLeft,y:e.scrollTop},{x:u(e.scrollLeft,e.scrollWidth,e.clientWidth),y:u(e.scrollTop,e.scrollHeight,e.clientHeight)}))}let s;function w(){n(),r.scrolling.value=!0,clearTimeout(s),s=setTimeout(()=>{r.scrolling.value=!1},r.scrollHideDelay.value)}let i,a;return(0,t.onMounted)(()=>{n();const e=r.viewportRef.value;if(!e||typeof ResizeObserver>"u")return;i=new ResizeObserver(n),i.observe(e);const o=r.contentRef.value;o&&i.observe(o),a=requestAnimationFrame(n)}),(0,t.onBeforeUnmount)(()=>{i?.disconnect(),a!==void 0&&cancelAnimationFrame(a),clearTimeout(s)}),(e,o)=>((0,t.openBlock)(),(0,t.createElementBlock)("div",{ref:l=>(0,t.unref)(r).viewportRef.value=l,class:"skdx-scroll-area__viewport","data-part":"viewport","data-skdx-scroll-area-viewport":"",tabindex:"0",role:b.value,style:{overflow:"auto"},onScroll:w},[(0,t.createElementVNode)("div",{ref:l=>(0,t.unref)(r).contentRef.value=l,"data-skdx-scroll-area-content":"",class:(0,t.normalizeClass)(d.contentProps?.class),style:(0,t.normalizeStyle)([{minWidth:"100%",display:"table"},d.contentProps?.style])},[(0,t.renderSlot)(e.$slots,"default")],6)],40,x))}});exports.default=y;

package/dist/scroll-area/ScrollAreaViewport.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{SCROLL_AREA_CONTEXT as e}from"./context.js";import{createElementBlock as t,createElementVNode as o,defineComponent as r,inject as l,onBeforeUnmount as a,onMounted as s,openBlock as n,renderSlot as i,unref as c}from"vue";var u=/* @__PURE__ */r({__name:"ScrollAreaViewport",setup(r){const u=l(e);if(!u)throw new Error("SkdxScrollAreaViewport must be used within SkdxScrollArea.");const d=u;function v(){const e=d.viewportRef.value;e&&(d.scrollbarXEnabled.value=e.scrollWidth>e.clientWidth,d.scrollbarYEnabled.value=e.scrollHeight>e.clientHeight)}let f,p;function m(){v(),d.scrolling.value=!0,clearTimeout(f),f=setTimeout(()=>{d.scrolling.value=!1},d.scrollHideDelay.value)}return s(()=>{v();const e=d.viewportRef.value;if(!e||typeof ResizeObserver>"u")return;p=new ResizeObserver(v),p.observe(e);const t=d.contentRef.value;t&&p.observe(t)}),a(()=>{p?.disconnect(),clearTimeout(f)}),(e,r)=>(n(),t("div",{class:"skdx-scroll-area__viewport","data-part":"viewport","data-skdx-scroll-area-viewport":"",tabindex:"0",ref:e=>c(d).viewportRef.value=e,style:{overflow:"auto"},onScroll:m},[o("div",{"data-skdx-scroll-area-content":"",ref:e=>c(d).contentRef.value=e,style:{"min-width":"100%",display:"table"}},[i(e.$slots,"default")],512)],544))}});export{u as default};
+import{injectRequired as e}from"../utils/injectRequired.js";import{SCROLL_AREA_CONTEXT as t}from"./context.js";import{computed as l,createElementBlock as o,createElementVNode as r,defineComponent as a,normalizeClass as s,normalizeStyle as n,onBeforeUnmount as i,onMounted as c,openBlock as u,renderSlot as d,unref as v,useAttrs as p}from"vue";var f=["role"],m=/* @__PURE__ */a({__name:"ScrollAreaViewport",props:{contentProps:{}},setup(a){function m(e,t,l){const o=t-l;if(o<=1)return"none";const r=Math.abs(e),a=r>1;return a&&r<o-1?"both":a?"start":"end"}const b=a,h=e(t,"SkdxScrollAreaViewport must be used within SkdxScrollArea."),w=p(),R=l(()=>null!=w["aria-label"]||null!=w["aria-labelledby"]?"region":void 0);function x(){const e=h.viewportRef.value;e&&(h.scrollbarXEnabled.value=e.scrollWidth>e.clientWidth,h.scrollbarYEnabled.value=e.scrollHeight>e.clientHeight,h.reportScrollPosition({x:e.scrollLeft,y:e.scrollTop},{x:m(e.scrollLeft,e.scrollWidth,e.clientWidth),y:m(e.scrollTop,e.scrollHeight,e.clientHeight)}))}let y,S,A;function g(){x(),h.scrolling.value=!0,clearTimeout(y),y=setTimeout(()=>{h.scrolling.value=!1},h.scrollHideDelay.value)}return c(()=>{x();const e=h.viewportRef.value;if(!e||typeof ResizeObserver>"u")return;S=new ResizeObserver(x),S.observe(e);const t=h.contentRef.value;t&&S.observe(t),A=requestAnimationFrame(x)}),i(()=>{S?.disconnect(),void 0!==A&&cancelAnimationFrame(A),clearTimeout(y)}),(e,t)=>(u(),o("div",{ref:e=>v(h).viewportRef.value=e,class:"skdx-scroll-area__viewport","data-part":"viewport","data-skdx-scroll-area-viewport":"",tabindex:"0",role:R.value,style:{overflow:"auto"},onScroll:g},[r("div",{ref:e=>v(h).contentRef.value=e,"data-skdx-scroll-area-content":"",class:s(b.contentProps?.class),style:n([{minWidth:"100%",display:"table"},b.contentProps?.style])},[d(e.$slots,"default")],6)],40,f))}});export{m as default};

package/dist/scroll-area/context.d.cts

@@ -1,6 +1,26 @@
 import type { InjectionKey, Ref } from 'vue';
-/** @internal When a ScrollArea shows its scrollbars: auto per overflow, always, only while hovering, or only while scrolling. */
+/** When a ScrollArea shows its scrollbars: auto per overflow, always, only while hovering, or only while scrolling. */
 export type ScrollAreaType = 'auto' | 'always' | 'hover' | 'scroll';
+/** Which axes the `SkdxScrollArea` recipe derives a Scrollbar for. */
+export type ScrollAreaScrollbars = 'vertical' | 'horizontal' | 'both';
+/** How much content sits outside the viewport on one axis. Logical, not physical. */
+export type ScrollAreaOverflow = 'none' | 'start' | 'end' | 'both';
+/** The scroll position a ScrollArea reports through `scroll-position-change`. */
+export interface ScrollAreaScrollPosition {
+    /** The viewport's `scrollLeft`, negative in RTL containers. */
+    x: number;
+    /** The viewport's `scrollTop`. */
+    y: number;
+}
+/** Options for the ScrollArea's `scrollTo` method — the subset of `ScrollToOptions` that makes sense here. */
+export interface ScrollAreaScrollToOptions {
+    /** Target `scrollTop`. Omit to leave the block axis where it is. */
+    top?: number;
+    /** Target `scrollLeft`. Omit to leave the inline axis where it is. */
+    left?: number;
+    /** Whether to animate the scroll. @default 'auto' */
+    behavior?: 'auto' | 'smooth';
+}
 /** @internal Injection key a ScrollArea provides so its parts can read/drive shared state. */
 export interface ScrollAreaContext {
     type: Ref<ScrollAreaType>;
@@ -11,6 +31,13 @@ export interface ScrollAreaContext {
     hovering: Ref<boolean>;
     scrolling: Ref<boolean>;
     scrollHideDelay: Ref<number>;
+    /** Emits `scroll-position-change` to the root. */
+    reportScrollPosition(position: ScrollAreaScrollPosition, overflow: {
+        x: ScrollAreaOverflow;
+        y: ScrollAreaOverflow;
+    }): void;
+    /** Scrolls the Viewport, exposed via `defineExpose`. */
+    scrollTo(options: ScrollAreaScrollToOptions): void;
 }
 /** @internal Injection key a ScrollArea provides so its Viewport/Scrollbar/Thumb parts share type and hover/scroll state. */
 export declare const SCROLL_AREA_CONTEXT: InjectionKey<ScrollAreaContext>;

package/dist/scroll-area/context.d.ts

@@ -1,6 +1,26 @@
 import type { InjectionKey, Ref } from 'vue';
-/** @internal When a ScrollArea shows its scrollbars: auto per overflow, always, only while hovering, or only while scrolling. */
+/** When a ScrollArea shows its scrollbars: auto per overflow, always, only while hovering, or only while scrolling. */
 export type ScrollAreaType = 'auto' | 'always' | 'hover' | 'scroll';
+/** Which axes the `SkdxScrollArea` recipe derives a Scrollbar for. */
+export type ScrollAreaScrollbars = 'vertical' | 'horizontal' | 'both';
+/** How much content sits outside the viewport on one axis. Logical, not physical. */
+export type ScrollAreaOverflow = 'none' | 'start' | 'end' | 'both';
+/** The scroll position a ScrollArea reports through `scroll-position-change`. */
+export interface ScrollAreaScrollPosition {
+    /** The viewport's `scrollLeft`, negative in RTL containers. */
+    x: number;
+    /** The viewport's `scrollTop`. */
+    y: number;
+}
+/** Options for the ScrollArea's `scrollTo` method — the subset of `ScrollToOptions` that makes sense here. */
+export interface ScrollAreaScrollToOptions {
+    /** Target `scrollTop`. Omit to leave the block axis where it is. */
+    top?: number;
+    /** Target `scrollLeft`. Omit to leave the inline axis where it is. */
+    left?: number;
+    /** Whether to animate the scroll. @default 'auto' */
+    behavior?: 'auto' | 'smooth';
+}
 /** @internal Injection key a ScrollArea provides so its parts can read/drive shared state. */
 export interface ScrollAreaContext {
     type: Ref<ScrollAreaType>;
@@ -11,6 +31,13 @@ export interface ScrollAreaContext {
     hovering: Ref<boolean>;
     scrolling: Ref<boolean>;
     scrollHideDelay: Ref<number>;
+    /** Emits `scroll-position-change` to the root. */
+    reportScrollPosition(position: ScrollAreaScrollPosition, overflow: {
+        x: ScrollAreaOverflow;
+        y: ScrollAreaOverflow;
+    }): void;
+    /** Scrolls the Viewport, exposed via `defineExpose`. */
+    scrollTo(options: ScrollAreaScrollToOptions): void;
 }
 /** @internal Injection key a ScrollArea provides so its Viewport/Scrollbar/Thumb parts share type and hover/scroll state. */
 export declare const SCROLL_AREA_CONTEXT: InjectionKey<ScrollAreaContext>;

package/dist/scroll-area/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./ScrollArea.vue.cjs"),e=require("./ScrollAreaViewport.vue.cjs"),l=require("./ScrollAreaScrollbar.vue.cjs"),o=require("./ScrollAreaThumb.vue.cjs"),a=require("./ScrollAreaCorner.vue.cjs");exports.SkdxScrollArea=r.default;exports.SkdxScrollAreaCorner=a.default;exports.SkdxScrollAreaScrollbar=l.default;exports.SkdxScrollAreaThumb=o.default;exports.SkdxScrollAreaViewport=e.default;
+Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./ScrollArea.vue.cjs");exports.SkdxScrollArea=e.default;

package/dist/scroll-area/index.d.cts

@@ -1,5 +1,2 @@
 export { default as SkdxScrollArea } from './ScrollArea.vue.cjs';
-export { default as SkdxScrollAreaViewport } from './ScrollAreaViewport.vue.cjs';
-export { default as SkdxScrollAreaScrollbar } from './ScrollAreaScrollbar.vue.cjs';
-export { default as SkdxScrollAreaThumb } from './ScrollAreaThumb.vue.cjs';
-export { default as SkdxScrollAreaCorner } from './ScrollAreaCorner.vue.cjs';
+export type { ScrollAreaScrollbars, ScrollAreaScrollPosition, ScrollAreaScrollToOptions, ScrollAreaType, } from './context.cjs';

package/dist/scroll-area/index.d.ts

@@ -1,5 +1,2 @@
 export { default as SkdxScrollArea } from './ScrollArea.vue.js';
-export { default as SkdxScrollAreaViewport } from './ScrollAreaViewport.vue.js';
-export { default as SkdxScrollAreaScrollbar } from './ScrollAreaScrollbar.vue.js';
-export { default as SkdxScrollAreaThumb } from './ScrollAreaThumb.vue.js';
-export { default as SkdxScrollAreaCorner } from './ScrollAreaCorner.vue.js';
+export type { ScrollAreaScrollbars, ScrollAreaScrollPosition, ScrollAreaScrollToOptions, ScrollAreaType, } from './context.js';

package/dist/scroll-area/index.js

@@ -1 +1 @@
-import r from"./ScrollArea.vue.js";import o from"./ScrollAreaViewport.vue.js";import l from"./ScrollAreaScrollbar.vue.js";import e from"./ScrollAreaThumb.vue.js";import a from"./ScrollAreaCorner.vue.js";export{r as SkdxScrollArea,a as SkdxScrollAreaCorner,l as SkdxScrollAreaScrollbar,e as SkdxScrollAreaThumb,o as SkdxScrollAreaViewport};
+import r from"./ScrollArea.vue.js";export{r as SkdxScrollArea};

package/dist/scroll-area/primitives.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./ScrollAreaCorner.vue.cjs"),e=require("./ScrollAreaScrollbar.vue.cjs"),l=require("./ScrollAreaThumb.vue.cjs"),o=require("./ScrollAreaViewport.vue.cjs"),a=require("./ScrollAreaRoot.vue.cjs");exports.SkdxScrollAreaCorner=r.default;exports.SkdxScrollAreaRoot=a.default;exports.SkdxScrollAreaScrollbar=e.default;exports.SkdxScrollAreaThumb=l.default;exports.SkdxScrollAreaViewport=o.default;

package/dist/scroll-area/primitives.d.cts

@@ -0,0 +1,26 @@
+/**
+ * Advanced primitives for custom `SkdxScrollArea` layouts; the recipe is built from these.
+ *
+ * @example
+ * ```vue
+ * <script setup lang="ts">
+ * import { SkdxScrollAreaCorner, SkdxScrollAreaRoot, SkdxScrollAreaScrollbar, SkdxScrollAreaThumb, SkdxScrollAreaViewport } from '@skdx/vue/primitives/scroll-area';
+ * </script>
+ *
+ * <template>
+ *   <SkdxScrollAreaRoot>
+ *     <SkdxScrollAreaViewport aria-label="Release notes">Scrollable body</SkdxScrollAreaViewport>
+ *     <SkdxScrollAreaScrollbar orientation="vertical">
+ *       <SkdxScrollAreaThumb />
+ *     </SkdxScrollAreaScrollbar>
+ *     <SkdxScrollAreaCorner />
+ *   </SkdxScrollAreaRoot>
+ * </template>
+ * ```
+ */
+export { default as SkdxScrollAreaRoot } from './ScrollAreaRoot.vue.cjs';
+export { default as SkdxScrollAreaViewport } from './ScrollAreaViewport.vue.cjs';
+export { default as SkdxScrollAreaScrollbar } from './ScrollAreaScrollbar.vue.cjs';
+export { default as SkdxScrollAreaThumb } from './ScrollAreaThumb.vue.cjs';
+export { default as SkdxScrollAreaCorner } from './ScrollAreaCorner.vue.cjs';
+export type { ScrollAreaScrollPosition, ScrollAreaScrollToOptions, ScrollAreaType, } from './context.cjs';

package/dist/scroll-area/primitives.d.ts

@@ -0,0 +1,26 @@
+/**
+ * Advanced primitives for custom `SkdxScrollArea` layouts; the recipe is built from these.
+ *
+ * @example
+ * ```vue
+ * <script setup lang="ts">
+ * import { SkdxScrollAreaCorner, SkdxScrollAreaRoot, SkdxScrollAreaScrollbar, SkdxScrollAreaThumb, SkdxScrollAreaViewport } from '@skdx/vue/primitives/scroll-area';
+ * </script>
+ *
+ * <template>
+ *   <SkdxScrollAreaRoot>
+ *     <SkdxScrollAreaViewport aria-label="Release notes">Scrollable body</SkdxScrollAreaViewport>
+ *     <SkdxScrollAreaScrollbar orientation="vertical">
+ *       <SkdxScrollAreaThumb />
+ *     </SkdxScrollAreaScrollbar>
+ *     <SkdxScrollAreaCorner />
+ *   </SkdxScrollAreaRoot>
+ * </template>
+ * ```
+ */
+export { default as SkdxScrollAreaRoot } from './ScrollAreaRoot.vue.js';
+export { default as SkdxScrollAreaViewport } from './ScrollAreaViewport.vue.js';
+export { default as SkdxScrollAreaScrollbar } from './ScrollAreaScrollbar.vue.js';
+export { default as SkdxScrollAreaThumb } from './ScrollAreaThumb.vue.js';
+export { default as SkdxScrollAreaCorner } from './ScrollAreaCorner.vue.js';
+export type { ScrollAreaScrollPosition, ScrollAreaScrollToOptions, ScrollAreaType, } from './context.js';

package/dist/scroll-area/primitives.js

@@ -0,0 +1 @@
+import r from"./ScrollAreaCorner.vue.js";import o from"./ScrollAreaScrollbar.vue.js";import l from"./ScrollAreaThumb.vue.js";import e from"./ScrollAreaViewport.vue.js";import a from"./ScrollAreaRoot.vue.js";export{r as SkdxScrollAreaCorner,a as SkdxScrollAreaRoot,o as SkdxScrollAreaScrollbar,l as SkdxScrollAreaThumb,e as SkdxScrollAreaViewport};

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

@@ -1,95 +1,219 @@
-import { type SelectItemDescriptor } from './context.cjs';
+import { type SelectionChangeDetail } from '../utils/selection.cjs';
+import { type SelectFilter, type SelectItemDescriptor, type SelectOptionGroup } from './context.cjs';
 /**
- * The Vue implementation of the shared Select contract (see `@skdx/shared`'s
- * `selectContract`). Owns the selected value and the listbox's open state,
- * `provide()`-ing both to `SkdxSelectTrigger`/`SkdxSelectContent`/
- * `SkdxSelectOption` (and friends) — Vue's equivalent of React's
- * SelectContext. Supports `v-model:value` and `v-model:open`, each
- * independently controlled (bind the prop) or uncontrolled (`defaultValue`/
- * `defaultOpen`). When `name` is set, visually-hidden native text inputs
- * mirror `value` so the select participates in native form submission,
- * `checkValidity()`/`reportValidity()` (exposed on the root) delegate to them,
- * and resetting the owning `<form>` restores the selection the select was
- * declared with, emitting `value-change` so a controlled parent follows it.
+ * Button trigger that displays the current value and opens a positioned popup listbox of options.
  *
- * Set `multiple` for a multi-select: `value` becomes a `string[]`, choosing an
- * option toggles it, the listbox stays open, and `SkdxSelectValue` renders one
- * chip per selection. Pass `items` to declare the option collection up front,
- * which is what lets a closed trigger run typeahead and render a
- * `defaultValue`'s label before the listbox has ever been opened.
- *
- * Emits `open-change` the instant the open state flips and
- * `open-change-complete` once the change has finished on screen — after
- * `SkdxSelectContent`'s enter or exit animation ends, or in the same task when
- * it declares none.
+ * @example
+ * ```vue
+ * <SkdxSelect :options="[{ value: 'react', label: 'Ruby' }]" placeholder="Framework" />
+ * ```
  */
 type __VLS_Props = {
-    /** Selected option's value, for controlled usage via `v-model:value`. A `string[]` when `multiple`. */
-    value?: string | string[];
-    /** Initially selected value, for uncontrolled usage. Same shape as `value`. */
-    defaultValue?: string | string[];
+    /** Selected option value(s) for controlled usage via `v-model:value`; accepts string or string[] under either cardinality. */
+    value?: string | string[] | undefined;
+    /** Initially selected value for uncontrolled usage, with the same lenient shape as `value`. */
+    defaultValue?: string | string[] | undefined;
     /**
-     * Allows more than one option to be selected: `value` becomes a `string[]`,
-     * the listbox gets `aria-multiselectable`, choosing an option toggles it
-     * instead of replacing the selection, and the listbox stays open so
-     * several options can be picked in one pass.
+     * Picking the already-selected option in single-select mode clears it; ignored in multiple mode.
+     * @default false
      */
+    deselectable?: boolean;
+    /** Allows more than one option selected, setting aria-multiselectable and keeping the listbox open on pick. */
     multiple?: boolean;
     /**
-     * The full option collection, declared up front. Options otherwise
-     * register their label only once the listbox has been opened, which leaves
-     * `SkdxSelectValue` rendering a raw `defaultValue` and leaves the closed
-     * trigger with nothing to run typeahead against. Renders nothing; a
-     * mounted option's own text still wins over an entry's `label`.
+     * Largest number of values selectable while multiple; unselected options go aria-disabled once reached.
+     * @default undefined — the selection grows without a cap.
+     */
+    maxSelected?: number | undefined;
+    /**
+     * Whether Control+A selects every enabled option while multiple, and the derived anatomy offers a SelectAll row.
+     * @default true
+     */
+    allowSelectAll?: boolean;
+    /**
+     * Renders a filter Input in the trigger's place, narrowing the options as the consumer types.
+     * @default false
+     */
+    filterable?: boolean;
+    /**
+     * Draft text in the filter Input, for controlled usage via `v-model:input-value`.
+     * @default undefined
+     */
+    inputValue?: string | undefined;
+    /**
+     * Initial draft text in the filter Input, for uncontrolled usage.
+     * @default ''
+     */
+    defaultInputValue?: string;
+    /**
+     * Predicate deciding which options survive the draft text, returning a boolean to filter or a number to rank.
+     * @default undefined — every option survives, and filtering is the consumer's job.
+     */
+    filter?: SelectFilter | undefined;
+    /**
+     * Whether the option list is in flight, published as aria-busy and data-loading without blocking interaction.
+     * @default false
+     */
+    loading?: boolean;
+    /**
+     * Whether the derived anatomy renders a Clear button emptying selection and draft text in one press.
+     * @default false
+     */
+    clearable?: boolean;
+    /**
+     * Formats the message announced after each selection change while multiple; return an empty string to stay silent.
+     * @default defaultGetSelectionLabel
+     */
+    getSelectionLabel?: (count: number) => string;
+    /**
+     * Accessible name for the derived Trigger or filter Input, and for the tag list beside it.
+     * @default undefined — the consumer must name the field some other way.
+     */
+    ariaLabel?: string | undefined;
+    /**
+     * Option collection declared up front, enabling closed-trigger typeahead and labels before Content mounts.
+     * @default undefined
+     */
+    items?: SelectItemDescriptor[] | undefined;
+    /**
+     * Flat or grouped option data that renders the trigger, listbox, and items automatically instead of hand composition.
+     * @default undefined — the default slot must supply the listbox itself.
+     */
+    options?: SelectItemDescriptor[] | SelectOptionGroup[] | undefined;
+    /**
+     * Placeholder shown by the derived trigger while nothing is selected; ignored when default slot
+     * supplies its own SkdxSelectValue.
+     * @default undefined — the trigger renders nothing while empty.
      */
-    items?: SelectItemDescriptor[];
+    placeholder?: string | undefined;
+    /**
+     * Whether picking an option closes the listbox; Escape, outside interaction, and Tab close regardless.
+     * @default !multiple
+     */
+    closeOnSelect?: boolean | undefined;
     /** Whether the listbox is open, for controlled usage via `v-model:open`. */
-    open?: boolean;
+    open?: boolean | undefined;
     /** Initial open state, for uncontrolled usage. */
     defaultOpen?: boolean;
-    /** Disables the trigger and prevents opening the listbox. */
+    /**
+     * Disables the trigger and prevents opening; distinct from readOnly, which keeps it focusable and submitting.
+     */
     disabled?: boolean;
-    /** Marks the hidden form input required. Only meaningful with `name`. */
+    /**
+     * Locks the selection: trigger stays focusable and submitting, carries aria-readonly, and the listbox refuses to open.
+     */
+    readOnly?: boolean;
+    /** Marks the hidden form input required; only meaningful with `name`. */
     required?: boolean;
     /** Marks the select as invalid, exposed as aria-invalid/data-invalid on the trigger. */
     invalid?: boolean;
-    /** Name for native form participation via a hidden input. */
-    name?: string;
+    /**
+     * Name for native form participation via a hidden input.
+     * @default undefined
+     */
+    name?: string | undefined;
+    /**
+     * Form id the select submits into, forwarded to every hidden control so it can live outside its form.
+     * @default undefined
+     */
+    form?: string | undefined;
+    /**
+     * Browser autofill hint, forwarded to the first mirrored hidden control, the one that answers for validity.
+     * @default undefined
+     */
+    autoComplete?: string | undefined;
+    /**
+     * Outline the skin gives the trigger, applied to the derived Trigger part.
+     * @default undefined — falls back to a `data-shape` attribute.
+     */
+    shape?: 'rounded' | 'square' | 'pill' | (string & {}) | undefined;
+    /**
+     * Size rung the skin renders the trigger at, applied to the derived Trigger part.
+     * @default undefined — falls back to a `data-size` attribute.
+     */
+    size?: 'sm' | 'lg' | (string & {}) | undefined;
+    /**
+     * Meaning each derived Tag carries, applied to the derived Tag parts.
+     * @default undefined — falls back to a `data-status` attribute.
+     */
+    status?: 'info' | 'success' | 'warning' | 'danger' | (string & {}) | undefined;
+    /**
+     * How tightly the skin packs the tag strip, applied to the derived TagList part.
+     * @default undefined — falls back to a `data-density` attribute.
+     */
+    density?: 'comfortable' | 'compact' | (string & {}) | undefined;
+    /**
+     * Whether the skin sizes the panel to the trigger, applied to the derived Content part.
+     * @default undefined — falls back to a `data-match-width` attribute.
+     */
+    matchWidth?: boolean | undefined;
 };
-declare var __VLS_1: {};
-type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_1) => any;
+type __VLS_Slots = {
+    /** Manual composition of the trigger and listbox, replacing the derived `options` anatomy. */
+    default?(): unknown;
+    /** Body of a derived option row, for markup its `label` string cannot express. */
+    option?(props: {
+        option: SelectItemDescriptor;
+    }): unknown;
+    /** Replacement body for the derived `SkdxSelectValue`, rendered in place of the resolved label. */
+    value?(): unknown;
+    /** Body of a derived tag, for markup the resolved option label cannot express. */
+    tag?(props: {
+        value: string;
+    }): unknown;
 };
 declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
-    /** Focuses the underlying trigger button. */
+    /** Moves focus to the underlying trigger button, or the filter Input standing in for it. */
     focus: () => void | undefined;
     /** Reports whether the hidden form inputs satisfy their constraints. `true` without a `name`. */
     checkValidity: () => boolean;
     /** Like `checkValidity()`, but also shows the browser's validation message. */
     reportValidity: () => boolean;
+    /** Pushes an externally-computed error onto the hidden input, like `HTMLInputElement.setCustomValidity()`. */
+    setCustomValidity: (message: string) => void | undefined;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:open": (open: boolean) => any;
     "open-change": (open: boolean) => any;
-    "update:value": (value: string | string[]) => any;
-    "value-change": (value: string | string[]) => any;
+    "update:value": (value: string[]) => any;
+    "value-change": (detail: SelectionChangeDetail) => any;
     "open-change-complete": (open: boolean) => any;
+    "update:inputValue": (value: string) => any;
+    "input-value-change": (value: string) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onUpdate:open"?: ((open: boolean) => any) | undefined;
-    "onOpen-change"?: ((open: boolean) => any) | undefined;
-    "onUpdate:value"?: ((value: string | string[]) => any) | undefined;
-    "onValue-change"?: ((value: string | string[]) => any) | undefined;
-    "onOpen-change-complete"?: ((open: boolean) => any) | undefined;
+    "onUpdate:open"?: (open: boolean) => any;
+    "onOpen-change"?: (open: boolean) => any;
+    "onUpdate:value"?: (value: string[]) => any;
+    "onValue-change"?: (detail: SelectionChangeDetail) => any;
+    "onOpen-change-complete"?: (open: boolean) => any;
+    "onUpdate:inputValue"?: (value: string) => any;
+    "onInput-value-change"?: (value: string) => any;
 }>, {
+    filter: SelectFilter | undefined;
+    loading: boolean;
     disabled: boolean;
-    open: boolean;
+    size: "sm" | "lg" | (string & {}) | undefined;
+    status: "info" | "success" | "warning" | "danger" | (string & {}) | undefined;
+    shape: "rounded" | "square" | "pill" | (string & {}) | undefined;
+    open: boolean | undefined;
     defaultOpen: boolean;
+    defaultValue: string | string[] | undefined;
+    multiple: boolean;
+    readOnly: boolean;
     required: boolean;
-    name: string;
-    value: string | string[];
+    value: string | string[] | undefined;
+    ariaLabel: string | undefined;
     invalid: boolean;
-    defaultValue: string | string[];
-    multiple: boolean;
-    items: SelectItemDescriptor[];
+    clearable: boolean;
+    allowSelectAll: boolean;
+    density: "comfortable" | "compact" | (string & {}) | undefined;
+    matchWidth: boolean | undefined;
+    deselectable: boolean;
+    maxSelected: number | undefined;
+    filterable: boolean;
+    inputValue: string | undefined;
+    defaultInputValue: string;
+    getSelectionLabel: (count: number) => string;
+    closeOnSelect: boolean | undefined;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;