@skdx/vue 0.26.0

package/dist/transfer/TransferItem.vue.d.ts

@@ -0,0 +1,47 @@
+/**
+ * One option inside an `SkdxTransferList` — a `role="option"` that also knows
+ * which side it is on. Marking it does **not** move it: marking is the
+ * transient "I want to move this" state, and an `SkdxTransferMoveTrigger` (or
+ * the outward arrow key) is what commits the move.
+ *
+ * Click, Enter, or Space toggles it into the marked set; **Shift+Click** marks
+ * the whole range from the anchor — the last option marked without Shift —
+ * mirroring Shift+ArrowUp/Down.
+ *
+ * Publishes `aria-selected`, `data-side`, `data-value`, `data-state`,
+ * `data-selected` while marked, `data-disabled`, and the roving `tabindex` its
+ * list owns.
+ *
+ * You only render this yourself when `SkdxTransferList`'s default rendering is
+ * not enough — it otherwise renders one per visible item on its side.
+ */
+type __VLS_Props = {
+    /** The id of the `TransferItemData` entry this option renders. */
+    value: string;
+    /**
+     * Excludes this option from marking, navigation, and moves.
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * Text typeahead matches this option against, published as
+     * `data-text-value`.
+     * @default undefined — falls back to the option's rendered text content, indicator glyph included.
+     */
+    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<{}>, {
+    disabled: boolean;
+    textValue: string;
+}, {}, {}, {}, 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/transfer/TransferItem.vue.js

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

package/dist/transfer/TransferItem.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const E=require("../utils/useSelection.cjs"),v=require("./context.cjs");let t=require("vue");var y=["aria-selected","aria-disabled","data-side","data-value","data-text-value","data-state","data-selected","data-disabled","tabindex"],w=(0,t.defineComponent)({inheritAttrs:!1,__name:"TransferItem",props:{value:{},disabled:{type:Boolean,default:!1},textValue:{default:void 0}},setup(s){const a=s,f=(0,t.inject)(v.TRANSFER_CONTEXT);if(!f)throw new Error("SkdxTransferItem must be used within SkdxTransfer.");const l=f,m=(0,t.inject)(v.TRANSFER_LIST_CONTEXT);if(!m)throw new Error("SkdxTransferItem must be used within SkdxTransferList.");const b=m,u=(0,t.computed)(()=>b.side.value),r=(0,t.computed)(()=>a.disabled||l.disabled.value),d=(0,t.computed)(()=>l.marked.value[u.value].includes(a.value)),p=(0,t.computed)(()=>r.value?-1:l.active.value[u.value]===a.value?0:-1);function T(e){const n=e.closest('[role="listbox"]');return n?Array.from(n.querySelectorAll(v.OPTION_SELECTOR),i=>i.getAttribute("data-value")).filter(i=>i!==null):[]}function k(){r.value||(l.anchor[u.value]=a.value)}function x(){r.value||l.setMarked(u.value,E.nextSelection(l.marked.value[u.value],a.value,!0))}function _(e){if(r.value||!e.shiftKey){k(),x();return}e.preventDefault();const n=T(e.currentTarget),i=l.anchor[u.value]??a.value,o=n.indexOf(i),c=n.indexOf(a.value);l.setMarked(u.value,o===-1||c===-1?[a.value]:n.slice(Math.min(o,c),Math.max(o,c)+1))}function h(){r.value||l.setActive(u.value,a.value)}function S(e){e.key!==" "&&e.key!=="Enter"||(k(),e.preventDefault(),x())}return(e,n)=>((0,t.openBlock)(),(0,t.createElementBlock)("div",(0,t.mergeProps)({class:"skdx-transfer__item","data-part":"item",role:"option","aria-selected":d.value,"aria-disabled":r.value||void 0,"data-side":u.value,"data-value":s.value,"data-text-value":s.textValue,"data-state":d.value?"checked":"unchecked","data-selected":d.value?"":void 0,"data-disabled":r.value?"":void 0,tabindex:p.value},e.$attrs,{onClick:_,onFocus:h,onKeydown:S}),[(0,t.renderSlot)(e.$slots,"default")],16,y))}});exports.default=w;

package/dist/transfer/TransferItem.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import{nextSelection as e}from"../utils/useSelection.js";import{OPTION_SELECTOR as a,TRANSFER_CONTEXT as t,TRANSFER_LIST_CONTEXT as l}from"./context.js";import{computed as u,createElementBlock as r,defineComponent as s,inject as d,mergeProps as n,openBlock as i,renderSlot as o}from"vue";var v=["aria-selected","aria-disabled","data-side","data-value","data-text-value","data-state","data-selected","data-disabled","tabindex"],c=/* @__PURE__ */s({inheritAttrs:!1,__name:"TransferItem",props:{value:{},disabled:{type:Boolean,default:!1},textValue:{default:void 0}},setup(s){const c=s,f=d(t);if(!f)throw new Error("SkdxTransferItem must be used within SkdxTransfer.");const m=f,x=d(l);if(!x)throw new Error("SkdxTransferItem must be used within SkdxTransferList.");const k=x,p=u(()=>k.side.value),T=u(()=>c.disabled||m.disabled.value),b=u(()=>m.marked.value[p.value].includes(c.value)),h=u(()=>T.value?-1:m.active.value[p.value]===c.value?0:-1);function S(){T.value||(m.anchor[p.value]=c.value)}function E(){T.value||m.setMarked(p.value,e(m.marked.value[p.value],c.value,!0))}function _(e){if(T.value||!e.shiftKey)return S(),void E();e.preventDefault();const t=function(e){const t=e.closest('[role="listbox"]');return t?Array.from(t.querySelectorAll(a),e=>e.getAttribute("data-value")).filter(e=>null!==e):[]}(e.currentTarget),l=m.anchor[p.value]??c.value,u=t.indexOf(l),r=t.indexOf(c.value);m.setMarked(p.value,-1===u||-1===r?[c.value]:t.slice(Math.min(u,r),Math.max(u,r)+1))}function w(){T.value||m.setActive(p.value,c.value)}function y(e){" "!==e.key&&"Enter"!==e.key||(S(),e.preventDefault(),E())}return(e,a)=>(i(),r("div",n({class:"skdx-transfer__item","data-part":"item",role:"option","aria-selected":b.value,"aria-disabled":T.value||void 0,"data-side":p.value,"data-value":s.value,"data-text-value":s.textValue,"data-state":b.value?"checked":"unchecked","data-selected":b.value?"":void 0,"data-disabled":T.value?"":void 0,tabindex:h.value},e.$attrs,{onClick:_,onFocus:w,onKeydown:y}),[o(e.$slots,"default")],16,v))}});export{c as default};

package/dist/transfer/TransferList.vue.cjs

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

package/dist/transfer/TransferList.vue.d.cts

@@ -0,0 +1,42 @@
+import { type TransferSide } from './context.cjs';
+/**
+ * One side of an `SkdxTransfer`: a multi-select `role="listbox"` with its own tab
+ * stop, its own roving focus, its own typeahead, and its own marked-for-move
+ * selection. The two lists are two independent roving-focus groups — Tab moves
+ * *between* them, arrows only ever move within one.
+ *
+ * Renders one `SkdxTransferItem` per visible item on its side by default, using
+ * each item's `label` as both its content and its typeahead `textValue`. Pass
+ * slot content to render the options yourself; they still get their side, their
+ * marked state, and their tab stop from the root.
+ *
+ * Beyond the plain listbox keyboard it adds three paths:
+ *
+ * - **Shift+ArrowUp/Down** extends the marked range from the anchor (the last
+ *   option marked without Shift), the keyboard equivalent of Shift+Click.
+ * - **Ctrl/Cmd+A** marks every enabled option currently visible in this list.
+ * - **The outward horizontal arrow** moves the marked items to the other list
+ *   — ArrowRight from the source under LTR, and ArrowLeft under `dir="rtl"`,
+ *   because the target list is on the left there. With nothing marked it moves
+ *   the focused option alone.
+ *
+ * Publishes `data-side` and, while it has nothing to render, `data-empty` plus
+ * `tabindex="0"` — an empty list stays reachable so focus after a move that
+ * empties it has somewhere to land.
+ */
+type __VLS_Props = {
+    /** Which of the two sides this list renders the items for. */
+    side: TransferSide;
+};
+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/transfer/TransferList.vue.d.ts

@@ -0,0 +1,42 @@
+import { type TransferSide } from './context.js';
+/**
+ * One side of an `SkdxTransfer`: a multi-select `role="listbox"` with its own tab
+ * stop, its own roving focus, its own typeahead, and its own marked-for-move
+ * selection. The two lists are two independent roving-focus groups — Tab moves
+ * *between* them, arrows only ever move within one.
+ *
+ * Renders one `SkdxTransferItem` per visible item on its side by default, using
+ * each item's `label` as both its content and its typeahead `textValue`. Pass
+ * slot content to render the options yourself; they still get their side, their
+ * marked state, and their tab stop from the root.
+ *
+ * Beyond the plain listbox keyboard it adds three paths:
+ *
+ * - **Shift+ArrowUp/Down** extends the marked range from the anchor (the last
+ *   option marked without Shift), the keyboard equivalent of Shift+Click.
+ * - **Ctrl/Cmd+A** marks every enabled option currently visible in this list.
+ * - **The outward horizontal arrow** moves the marked items to the other list
+ *   — ArrowRight from the source under LTR, and ArrowLeft under `dir="rtl"`,
+ *   because the target list is on the left there. With nothing marked it moves
+ *   the focused option alone.
+ *
+ * Publishes `data-side` and, while it has nothing to render, `data-empty` plus
+ * `tabindex="0"` — an empty list stays reachable so focus after a move that
+ * empties it has somewhere to land.
+ */
+type __VLS_Props = {
+    /** Which of the two sides this list renders the items for. */
+    side: TransferSide;
+};
+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/transfer/TransferList.vue.js

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

package/dist/transfer/TransferList.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const y=require("../utils/direction.cjs"),m=require("../utils/useRovingFocus.cjs"),h=require("../utils/useTypeahead.cjs"),R=require("../utils/clamp.cjs"),d=require("./context.cjs"),D=require("./TransferItem.vue.cjs");let t=require("vue");var K=["id","aria-disabled","data-side","data-disabled","data-empty","aria-labelledby","aria-label","tabindex"],B=(0,t.defineComponent)({inheritAttrs:!1,__name:"TransferList",props:{side:{}},setup(u){const n=u,b=(0,t.inject)(d.TRANSFER_CONTEXT);if(!b)throw new Error("SkdxTransferList must be used within SkdxTransfer.");const a=b,T={source:"Available items",target:"Selected items"},g={source:"ArrowRight",target:"ArrowLeft"};function x(e,i,r){const l=e.indexOf(i),o=e.indexOf(r);return l===-1||o===-1?e.includes(r)?[r]:[]:e.slice(Math.min(l,o),Math.max(l,o)+1)}const s=(0,t.ref)(null),k=y.useDirection();(0,t.provide)(d.TRANSFER_LIST_CONTEXT,{side:(0,t.computed)(()=>n.side)}),(0,t.watchEffect)(e=>{const i=n.side;a.registerList(i,s.value),e(()=>a.registerList(i,null))},{flush:"post"}),m.useRovingTabStop(s,d.OPTION_SELECTOR,"data-value",(0,t.computed)({get:()=>a.active.value[n.side],set:e=>a.setActive(n.side,e)}));const f=(0,t.computed)(()=>a.visibleItems.value[n.side]),p=(0,t.computed)(()=>a.labelled.value[n.side]?`${a.baseId}-${n.side}-header`:void 0),_=(0,t.computed)(()=>a.disabled.value||f.value.some(e=>!e.disabled)?void 0:0);function A(){return Array.from(s.value?.querySelectorAll('[role="option"]:not([data-disabled])')??[],e=>e.getAttribute("data-value")).filter(e=>e!==null)}function w(e){return e.getAttribute("data-text-value")??e.textContent??""}const L=m.useRovingFocus({orientation:"vertical",loop:!1,itemSelector:d.OPTION_SELECTOR,typeahead:!1}),O=h.useTypeahead();function E(e){if(a.disabled.value)return;const i=n.side,r=A();if(r.length===0)return;const l=e.target.getAttribute?.("data-value")??null;if((e.ctrlKey||e.metaKey)&&e.key.toLowerCase()==="a"){e.preventDefault(),a.setMarked(i,r);return}if(e.shiftKey&&(e.key==="ArrowDown"||e.key==="ArrowUp")){const o=l===null?-1:r.indexOf(l);if(o===-1)return;const c=R.clamp(o+(e.key==="ArrowDown"?1:-1),0,r.length-1),v=a.anchor[i]??r[o];a.anchor[i]=v,a.setMarked(i,x(r,v,r[c]));return}if(y.directionalKey(e.key,e.currentTarget,k())===g[i]){const o=a.marked.value[i],c=o.length>0?o:l?[l]:[];if(c.length===0)return;e.preventDefault(),a.move(i==="source"?"toTarget":"toSource",c)}}function S(e){if(L(e),e.defaultPrevented||!h.isTypeaheadKey(e))return;const i=s.value;if(!i)return;const r=Array.from(i.querySelectorAll(d.OPTION_SELECTOR)),l=O(e.key,r.map(w),r.indexOf(e.target));l!==-1&&(e.preventDefault(),r[l].focus())}function q(e){E(e),!e.defaultPrevented&&S(e)}return(e,i)=>((0,t.openBlock)(),(0,t.createElementBlock)("div",(0,t.mergeProps)({id:`${(0,t.unref)(a).baseId}-${u.side}-list`,class:"skdx-listbox","data-part":"root","data-skdx-component":"listbox",ref_key:"listRef",ref:s,role:"listbox","aria-multiselectable":"true","data-multiple":"","aria-disabled":(0,t.unref)(a).disabled.value||void 0,"data-side":u.side,"data-disabled":(0,t.unref)(a).disabled.value?"":void 0,"data-empty":f.value.length===0?"":void 0,"aria-labelledby":p.value,"aria-label":p.value?void 0:T[u.side],tabindex:_.value},e.$attrs,{onKeydown:q}),[(0,t.renderSlot)(e.$slots,"default",{},()=>[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(f.value,r=>((0,t.openBlock)(),(0,t.createBlock)(D.default,{key:r.value,value:r.value,disabled:r.disabled,"text-value":r.label},{default:(0,t.withCtx)(()=>[(0,t.createTextVNode)((0,t.toDisplayString)(r.label),1)]),_:2},1032,["value","disabled","text-value"]))),128))])],16,K))}});exports.default=B;

package/dist/transfer/TransferList.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import{directionalKey as e,useDirection as t}from"../utils/direction.js";import{useRovingFocus as a,useRovingTabStop as r}from"../utils/useRovingFocus.js";import{isTypeaheadKey as s,useTypeahead as i}from"../utils/useTypeahead.js";import{clamp as l}from"../utils/clamp.js";import{OPTION_SELECTOR as o,TRANSFER_CONTEXT as d,TRANSFER_LIST_CONTEXT as n}from"./context.js";import u from"./TransferItem.vue.js";import{Fragment as c,computed as v,createBlock as f,createElementBlock as m,createTextVNode as b,defineComponent as p,inject as y,mergeProps as g,openBlock as h,provide as x,ref as T,renderList as k,renderSlot as A,toDisplayString as w,unref as S,watchEffect as R,withCtx as E}from"vue";var L=["id","aria-disabled","data-side","data-disabled","data-empty","aria-labelledby","aria-label","tabindex"],O=/* @__PURE__ */p({inheritAttrs:!1,__name:"TransferList",props:{side:{}},setup(p){const O=p,_=y(d);if(!_)throw new Error("SkdxTransferList must be used within SkdxTransfer.");const j=_,C={source:"Available items",target:"Selected items"},D={source:"ArrowRight",target:"ArrowLeft"},I=T(null),K=t();x(n,{side:v(()=>O.side)}),R(e=>{const t=O.side;j.registerList(t,I.value),e(()=>j.registerList(t,null))},{flush:"post"}),r(I,o,"data-value",v({get:()=>j.active.value[O.side],set:e=>j.setActive(O.side,e)}));const N=v(()=>j.visibleItems.value[O.side]),$=v(()=>j.labelled.value[O.side]?`${j.baseId}-${O.side}-header`:void 0),F=v(()=>j.disabled.value||N.value.some(e=>!e.disabled)?void 0:0);function M(e){return e.getAttribute("data-text-value")??e.textContent??""}const P=a({orientation:"vertical",loop:!1,itemSelector:o,typeahead:!1}),B=i();function q(t){(function(t){if(j.disabled.value)return;const a=O.side,r=Array.from(I.value?.querySelectorAll('[role="option"]:not([data-disabled])')??[],e=>e.getAttribute("data-value")).filter(e=>null!==e);if(0===r.length)return;const s=t.target.getAttribute?.("data-value")??null;if((t.ctrlKey||t.metaKey)&&"a"===t.key.toLowerCase())return t.preventDefault(),void j.setMarked(a,r);if(t.shiftKey&&("ArrowDown"===t.key||"ArrowUp"===t.key)){const e=null===s?-1:r.indexOf(s);if(-1===e)return;const i=l(e+("ArrowDown"===t.key?1:-1),0,r.length-1),o=j.anchor[a]??r[e];return j.anchor[a]=o,void j.setMarked(a,function(e,t,a){const r=e.indexOf(t),s=e.indexOf(a);return-1===r||-1===s?e.includes(a)?[a]:[]:e.slice(Math.min(r,s),Math.max(r,s)+1)}(r,o,r[i]))}if(e(t.key,t.currentTarget,K())===D[a]){const e=j.marked.value[a],r=e.length>0?e:s?[s]:[];if(0===r.length)return;t.preventDefault(),j.move("source"===a?"toTarget":"toSource",r)}})(t),!t.defaultPrevented&&function(e){if(P(e),e.defaultPrevented||!s(e))return;const t=I.value;if(!t)return;const a=Array.from(t.querySelectorAll(o)),r=B(e.key,a.map(M),a.indexOf(e.target));-1!==r&&(e.preventDefault(),a[r].focus())}(t)}return(e,t)=>(h(),m("div",g({id:`${S(j).baseId}-${p.side}-list`,class:"skdx-listbox","data-part":"root","data-skdx-component":"listbox",ref_key:"listRef",ref:I,role:"listbox","aria-multiselectable":"true","data-multiple":"","aria-disabled":S(j).disabled.value||void 0,"data-side":p.side,"data-disabled":S(j).disabled.value?"":void 0,"data-empty":0===N.value.length?"":void 0,"aria-labelledby":$.value,"aria-label":$.value?void 0:C[p.side],tabindex:F.value},e.$attrs,{onKeydown:q}),[A(e.$slots,"default",{},()=>[(h(!0),m(c,null,k(N.value,e=>(h(),f(u,{key:e.value,value:e.value,disabled:e.disabled,"text-value":e.label},{default:E(()=>[b(w(e.label),1)]),_:2},1032,["value","disabled","text-value"]))),128))])],16,L))}});export{O as default};

package/dist/transfer/TransferListHeader.vue.cjs

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

package/dist/transfer/TransferListHeader.vue.d.cts

@@ -0,0 +1,37 @@
+import { type TransferSide } from './context.cjs';
+/**
+ * The visible heading naming one of the two lists, and the element that list
+ * points `aria-labelledby` at. Give both sides one: "Available" and "Selected"
+ * next to two otherwise identical listboxes is the whole difference between a
+ * usable widget and two anonymous lists.
+ *
+ * It sits *beside* its `SkdxTransferList`, not inside it — a `role="listbox"`
+ * may only contain options and groups, so a heading inside one is invalid ARIA.
+ * That is also why it takes its own `side`: it has no list around it to inherit
+ * one from.
+ *
+ * Rendering one is what switches its list from a generic fallback name
+ * ("Available items") to this heading's text.
+ *
+ * @example
+ * ```vue
+ * <SkdxTransferListHeader side="source">Available</SkdxTransferListHeader>
+ * <SkdxTransferList side="source" />
+ * ```
+ */
+type __VLS_Props = {
+    /** Which side this header names. Must match the `side` of the list it sits beside. */
+    side: TransferSide;
+};
+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/transfer/TransferListHeader.vue.d.ts

@@ -0,0 +1,37 @@
+import { type TransferSide } from './context.js';
+/**
+ * The visible heading naming one of the two lists, and the element that list
+ * points `aria-labelledby` at. Give both sides one: "Available" and "Selected"
+ * next to two otherwise identical listboxes is the whole difference between a
+ * usable widget and two anonymous lists.
+ *
+ * It sits *beside* its `SkdxTransferList`, not inside it — a `role="listbox"`
+ * may only contain options and groups, so a heading inside one is invalid ARIA.
+ * That is also why it takes its own `side`: it has no list around it to inherit
+ * one from.
+ *
+ * Rendering one is what switches its list from a generic fallback name
+ * ("Available items") to this heading's text.
+ *
+ * @example
+ * ```vue
+ * <SkdxTransferListHeader side="source">Available</SkdxTransferListHeader>
+ * <SkdxTransferList side="source" />
+ * ```
+ */
+type __VLS_Props = {
+    /** Which side this header names. Must match the `side` of the list it sits beside. */
+    side: TransferSide;
+};
+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/transfer/TransferListHeader.vue.js

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

package/dist/transfer/TransferListHeader.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const n=require("./context.cjs");let e=require("vue");var o=["id","data-side"],u=(0,e.defineComponent)({__name:"TransferListHeader",props:{side:{}},setup(t){const s=t,d=(0,e.inject)(n.TRANSFER_CONTEXT);if(!d)throw new Error("SkdxTransferListHeader must be used within SkdxTransfer.");const r=d;return r.registerHeader(s.side,!0),(0,e.watch)(()=>s.side,(a,i)=>{r.registerHeader(i,!1),r.registerHeader(a,!0)}),(0,e.onScopeDispose)(()=>r.registerHeader(s.side,!1)),(a,i)=>((0,e.openBlock)(),(0,e.createElementBlock)("div",{class:"skdx-transfer__list-header","data-part":"list-header",id:`${(0,e.unref)(r).baseId}-${t.side}-header`,"data-side":t.side},[(0,e.renderSlot)(a.$slots,"default")],8,o))}});exports.default=u;

package/dist/transfer/TransferListHeader.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import{TRANSFER_CONTEXT as e}from"./context.js";import{createElementBlock as s,defineComponent as r,inject as a,onScopeDispose as t,openBlock as d,renderSlot as i,unref as o,watch as n}from"vue";var f=["id","data-side"],p=/* @__PURE__ */r({__name:"TransferListHeader",props:{side:{}},setup(r){const p=r,c=a(e);if(!c)throw new Error("SkdxTransferListHeader must be used within SkdxTransfer.");const l=c;return l.registerHeader(p.side,!0),n(()=>p.side,(e,s)=>{l.registerHeader(s,!1),l.registerHeader(e,!0)}),t(()=>l.registerHeader(p.side,!1)),(e,a)=>(d(),s("div",{class:"skdx-transfer__list-header","data-part":"list-header",id:`${o(l).baseId}-${r.side}-header`,"data-side":r.side},[i(e.$slots,"default")],8,f))}});export{p as default};

package/dist/transfer/TransferListSearch.vue.cjs

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

package/dist/transfer/TransferListSearch.vue.d.cts

@@ -0,0 +1,28 @@
+import { type TransferSide } from './context.cjs';
+/**
+ * The filter input for one list: an `<input type="search">` bound to that
+ * side's query. Like `SkdxTransferListHeader` it is a sibling of its list rather
+ * than a child, since a `role="listbox"` may only contain options — so it takes
+ * its own `side`.
+ *
+ * Renders **nothing** while the root is not `searchable`. A filter box that
+ * stays on screen but no longer filters is worse than no box at all, so the one
+ * prop turns the input and the filtering on together.
+ *
+ * Filtering narrows what its list renders and therefore what "move all" moves:
+ * "move all" moves what you can see, not what you cannot.
+ *
+ * @example
+ * ```vue
+ * <SkdxTransfer :items="items" searchable>
+ *   <SkdxTransferListSearch side="source" placeholder="Filter" />
+ *   <SkdxTransferList side="source" />
+ * </SkdxTransfer>
+ * ```
+ */
+type __VLS_Props = {
+    /** Which of the two sides this input filters the items of. */
+    side: TransferSide;
+};
+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/transfer/TransferListSearch.vue.d.ts

@@ -0,0 +1,28 @@
+import { type TransferSide } from './context.js';
+/**
+ * The filter input for one list: an `<input type="search">` bound to that
+ * side's query. Like `SkdxTransferListHeader` it is a sibling of its list rather
+ * than a child, since a `role="listbox"` may only contain options — so it takes
+ * its own `side`.
+ *
+ * Renders **nothing** while the root is not `searchable`. A filter box that
+ * stays on screen but no longer filters is worse than no box at all, so the one
+ * prop turns the input and the filtering on together.
+ *
+ * Filtering narrows what its list renders and therefore what "move all" moves:
+ * "move all" moves what you can see, not what you cannot.
+ *
+ * @example
+ * ```vue
+ * <SkdxTransfer :items="items" searchable>
+ *   <SkdxTransferListSearch side="source" placeholder="Filter" />
+ *   <SkdxTransferList side="source" />
+ * </SkdxTransfer>
+ * ```
+ */
+type __VLS_Props = {
+    /** Which of the two sides this input filters the items of. */
+    side: TransferSide;
+};
+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/transfer/TransferListSearch.vue.js

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

package/dist/transfer/TransferListSearch.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const u=require("./context.cjs");let e=require("vue");var c=["value","disabled","data-side","aria-label","aria-controls"],d=(0,e.defineComponent)({inheritAttrs:!1,__name:"TransferListSearch",props:{side:{}},setup(t){const i=t,s=(0,e.inject)(u.TRANSFER_CONTEXT);if(!s)throw new Error("SkdxTransferListSearch must be used within SkdxTransfer.");const r=s,n={source:"Filter available items",target:"Filter selected items"};function l(a){r.setQuery(i.side,a.currentTarget.value)}return(a,o)=>(0,e.unref)(r).searchable.value?((0,e.openBlock)(),(0,e.createElementBlock)("input",(0,e.mergeProps)({key:0,class:"skdx-transfer__list-search","data-part":"list-search",type:"search",value:(0,e.unref)(r).query.value[t.side],disabled:(0,e.unref)(r).disabled.value,"data-side":t.side,"aria-label":n[t.side],"aria-controls":`${(0,e.unref)(r).baseId}-${t.side}-list`},a.$attrs,{onInput:l}),null,16,c)):(0,e.createCommentVNode)("",!0)}});exports.default=d;

package/dist/transfer/TransferListSearch.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import{TRANSFER_CONTEXT as e}from"./context.js";import{createCommentVNode as a,createElementBlock as s,defineComponent as r,inject as t,mergeProps as i,openBlock as l,unref as n}from"vue";var d=["value","disabled","data-side","aria-label","aria-controls"],o=/* @__PURE__ */r({inheritAttrs:!1,__name:"TransferListSearch",props:{side:{}},setup(r){const o=r,c=t(e);if(!c)throw new Error("SkdxTransferListSearch must be used within SkdxTransfer.");const u=c,m={source:"Filter available items",target:"Filter selected items"};function p(e){u.setQuery(o.side,e.currentTarget.value)}return(e,t)=>n(u).searchable.value?(l(),s("input",i({key:0,class:"skdx-transfer__list-search","data-part":"list-search",type:"search",value:n(u).query.value[r.side],disabled:n(u).disabled.value,"data-side":r.side,"aria-label":m[r.side],"aria-controls":`${n(u).baseId}-${r.side}-list`},e.$attrs,{onInput:p}),null,16,d)):a("",!0)}});export{o as default};

package/dist/transfer/TransferMoveAllTrigger.vue.cjs

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

package/dist/transfer/TransferMoveAllTrigger.vue.d.cts

@@ -0,0 +1,33 @@
+import { type TransferDirection } from './context.cjs';
+/**
+ * The button that moves every item currently visible on one side, marked or
+ * not. Same rules as `SkdxTransferMoveTrigger` — real button, name carries
+ * direction and count, `aria-disabled` rather than `disabled` when there is
+ * nothing to move.
+ *
+ * "Visible" is the operative word while the root is `searchable`: it moves what
+ * the filter is showing, never items hidden behind a query the user has
+ * forgotten is applied. Disabled items are excluded on both counts — the name
+ * and the move.
+ *
+ * @example
+ * ```vue
+ * <SkdxTransferMoveAllTrigger direction="toTarget">⇒</SkdxTransferMoveAllTrigger>
+ * ```
+ */
+type __VLS_Props = {
+    /** Which way this trigger moves: `'toTarget'` adds to the value, `'toSource'` removes from it. */
+    direction: TransferDirection;
+};
+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/transfer/TransferMoveAllTrigger.vue.d.ts

@@ -0,0 +1,33 @@
+import { type TransferDirection } from './context.js';
+/**
+ * The button that moves every item currently visible on one side, marked or
+ * not. Same rules as `SkdxTransferMoveTrigger` — real button, name carries
+ * direction and count, `aria-disabled` rather than `disabled` when there is
+ * nothing to move.
+ *
+ * "Visible" is the operative word while the root is `searchable`: it moves what
+ * the filter is showing, never items hidden behind a query the user has
+ * forgotten is applied. Disabled items are excluded on both counts — the name
+ * and the move.
+ *
+ * @example
+ * ```vue
+ * <SkdxTransferMoveAllTrigger direction="toTarget">⇒</SkdxTransferMoveAllTrigger>
+ * ```
+ */
+type __VLS_Props = {
+    /** Which way this trigger moves: `'toTarget'` adds to the value, `'toSource'` removes from it. */
+    direction: TransferDirection;
+};
+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/transfer/TransferMoveAllTrigger.vue.js

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

package/dist/transfer/TransferMoveAllTrigger.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const d=require("./context.cjs");let e=require("vue");var c=["aria-disabled","aria-label","data-direction","data-count","data-disabled"],v=(0,e.defineComponent)({inheritAttrs:!1,__name:"TransferMoveAllTrigger",props:{direction:{}},setup(i){const n=i,o=(0,e.inject)(d.TRANSFER_CONTEXT);if(!o)throw new Error("SkdxTransferMoveAllTrigger must be used within SkdxTransfer.");const a=o,u=(0,e.computed)(()=>d.ORIGIN_OF[n.direction]),r=(0,e.computed)(()=>a.visibleItems.value[u.value].filter(t=>!t.disabled).map(t=>t.value)),l=(0,e.computed)(()=>a.disabled.value||r.value.length===0);function s(){l.value||a.move(n.direction,r.value)}return(t,f)=>((0,e.openBlock)(),(0,e.createElementBlock)("button",(0,e.mergeProps)({class:"skdx-transfer__move-all-trigger","data-part":"move-all-trigger",type:"button","aria-disabled":l.value||void 0,"aria-label":(0,e.unref)(a).moveLabel(r.value.length,i.direction,!0),"data-direction":i.direction,"data-count":r.value.length,"data-disabled":l.value?"":void 0},t.$attrs,{onClick:s}),[(0,e.renderSlot)(t.$slots,"default")],16,c))}});exports.default=v;

package/dist/transfer/TransferMoveAllTrigger.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import{ORIGIN_OF as e,TRANSFER_CONTEXT as a}from"./context.js";import{computed as t,createElementBlock as r,defineComponent as i,inject as l,mergeProps as o,openBlock as s,renderSlot as d,unref as n}from"vue";var u=["aria-disabled","aria-label","data-direction","data-count","data-disabled"],v=/* @__PURE__ */i({inheritAttrs:!1,__name:"TransferMoveAllTrigger",props:{direction:{}},setup(i){const v=i,c=l(a);if(!c)throw new Error("SkdxTransferMoveAllTrigger must be used within SkdxTransfer.");const m=c,b=t(()=>e[v.direction]),f=t(()=>m.visibleItems.value[b.value].filter(e=>!e.disabled).map(e=>e.value)),p=t(()=>m.disabled.value||0===f.value.length);function g(){p.value||m.move(v.direction,f.value)}return(e,a)=>(s(),r("button",o({class:"skdx-transfer__move-all-trigger","data-part":"move-all-trigger",type:"button","aria-disabled":p.value||void 0,"aria-label":n(m).moveLabel(f.value.length,i.direction,!0),"data-direction":i.direction,"data-count":f.value.length,"data-disabled":p.value?"":void 0},e.$attrs,{onClick:g}),[d(e.$slots,"default")],16,u))}});export{v as default};

package/dist/transfer/TransferMoveTrigger.vue.cjs

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

package/dist/transfer/TransferMoveTrigger.vue.d.cts

@@ -0,0 +1,40 @@
+import { type TransferDirection } from './context.cjs';
+/**
+ * The button that moves the marked items one way. A real `<button>` in the tab
+ * order, named for what it does and how much of it — "Move 3 items to
+ * selected", not an unnamed arrow glyph.
+ *
+ * With nothing marked it is **`aria-disabled`, not `disabled`**. A truly
+ * disabled button is skipped by Tab, so a keyboard user exploring the widget
+ * never meets the control that explains the whole interaction, and would be
+ * left guessing why selecting things in a list appears to do nothing. Kept
+ * focusable, it announces "Move items to selected, nothing selected" — the
+ * instruction and the reason in one. Pressing it is a no-op.
+ *
+ * Publishes `data-direction` (the logical `'toTarget'`/`'toSource'`),
+ * `data-count`, and `data-disabled`. Direction is deliberately never published
+ * as left/right: under `dir="rtl"` the target list is on the left, so style the
+ * glyph from `[dir='rtl'] [data-direction='toTarget']` rather than expecting a
+ * physical attribute here.
+ *
+ * @example
+ * ```vue
+ * <SkdxTransferMoveTrigger direction="toTarget">→</SkdxTransferMoveTrigger>
+ * ```
+ */
+type __VLS_Props = {
+    /** Which way this trigger moves: `'toTarget'` adds to the value, `'toSource'` removes from it. */
+    direction: TransferDirection;
+};
+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/transfer/TransferMoveTrigger.vue.d.ts

@@ -0,0 +1,40 @@
+import { type TransferDirection } from './context.js';
+/**
+ * The button that moves the marked items one way. A real `<button>` in the tab
+ * order, named for what it does and how much of it — "Move 3 items to
+ * selected", not an unnamed arrow glyph.
+ *
+ * With nothing marked it is **`aria-disabled`, not `disabled`**. A truly
+ * disabled button is skipped by Tab, so a keyboard user exploring the widget
+ * never meets the control that explains the whole interaction, and would be
+ * left guessing why selecting things in a list appears to do nothing. Kept
+ * focusable, it announces "Move items to selected, nothing selected" — the
+ * instruction and the reason in one. Pressing it is a no-op.
+ *
+ * Publishes `data-direction` (the logical `'toTarget'`/`'toSource'`),
+ * `data-count`, and `data-disabled`. Direction is deliberately never published
+ * as left/right: under `dir="rtl"` the target list is on the left, so style the
+ * glyph from `[dir='rtl'] [data-direction='toTarget']` rather than expecting a
+ * physical attribute here.
+ *
+ * @example
+ * ```vue
+ * <SkdxTransferMoveTrigger direction="toTarget">→</SkdxTransferMoveTrigger>
+ * ```
+ */
+type __VLS_Props = {
+    /** Which way this trigger moves: `'toTarget'` adds to the value, `'toSource'` removes from it. */
+    direction: TransferDirection;
+};
+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/transfer/TransferMoveTrigger.vue.js

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

package/dist/transfer/TransferMoveTrigger.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const s=require("./context.cjs");let e=require("vue");var v=["aria-disabled","aria-label","data-direction","data-count","data-disabled"],f=(0,e.defineComponent)({inheritAttrs:!1,__name:"TransferMoveTrigger",props:{direction:{}},setup(i){const o=i,d=(0,e.inject)(s.TRANSFER_CONTEXT);if(!d)throw new Error("SkdxTransferMoveTrigger must be used within SkdxTransfer.");const t=d,l=(0,e.computed)(()=>s.ORIGIN_OF[o.direction]),a=(0,e.computed)(()=>t.marked.value[l.value].filter(r=>!t.sideItems.value[l.value].find(u=>u.value===r)?.disabled)),n=(0,e.computed)(()=>t.disabled.value||a.value.length===0);function c(){n.value||t.move(o.direction,a.value)}return(r,u)=>((0,e.openBlock)(),(0,e.createElementBlock)("button",(0,e.mergeProps)({class:"skdx-transfer__move-trigger","data-part":"move-trigger",type:"button","aria-disabled":n.value||void 0,"aria-label":(0,e.unref)(t).moveLabel(a.value.length,i.direction,!1),"data-direction":i.direction,"data-count":a.value.length,"data-disabled":n.value?"":void 0},r.$attrs,{onClick:c}),[(0,e.renderSlot)(r.$slots,"default")],16,v))}});exports.default=f;

package/dist/transfer/TransferMoveTrigger.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1 @@
+import{ORIGIN_OF as e,TRANSFER_CONTEXT as a}from"./context.js";import{computed as t,createElementBlock as r,defineComponent as i,inject as o,mergeProps as d,openBlock as n,renderSlot as s,unref as l}from"vue";var u=["aria-disabled","aria-label","data-direction","data-count","data-disabled"],v=/* @__PURE__ */i({inheritAttrs:!1,__name:"TransferMoveTrigger",props:{direction:{}},setup(i){const v=i,c=o(a);if(!c)throw new Error("SkdxTransferMoveTrigger must be used within SkdxTransfer.");const m=c,f=t(()=>e[v.direction]),b=t(()=>m.marked.value[f.value].filter(e=>!m.sideItems.value[f.value].find(a=>a.value===e)?.disabled)),g=t(()=>m.disabled.value||0===b.value.length);function p(){g.value||m.move(v.direction,b.value)}return(e,a)=>(n(),r("button",d({class:"skdx-transfer__move-trigger","data-part":"move-trigger",type:"button","aria-disabled":g.value||void 0,"aria-label":l(m).moveLabel(b.value.length,i.direction,!1),"data-direction":i.direction,"data-count":b.value.length,"data-disabled":g.value?"":void 0},e.$attrs,{onClick:p}),[s(e.$slots,"default")],16,u))}});export{v as default};

package/dist/transfer/context.cjs

@@ -0,0 +1 @@
+var i='[role="option"]:not([data-disabled])',s={toTarget:"source",toSource:"target"},T={toTarget:"target",toSource:"source"},n={source:"available",target:"selected"};function N(e,t,r){const o=n[T[t]],a=r?"Move all":"Move";return e===0?`${a} items to ${o}, ${r?"nothing to move":"nothing selected"}`:`${a} ${e} ${e===1?"item":"items"} to ${o}`}function O({moved:e,remaining:t,from:r,to:o}){return`${e} ${e===1?"item":"items"} moved to ${n[o]}. ${t} remaining in ${n[r]}.`}function l(e,t){return e.label.toLowerCase().includes(t.trim().toLowerCase())}var m=Symbol("skdx-transfer-context"),E=Symbol("skdx-transfer-list-context");exports.DESTINATION_OF=T;exports.OPTION_SELECTOR=i;exports.ORIGIN_OF=s;exports.SIDE_NOUN=n;exports.TRANSFER_CONTEXT=m;exports.TRANSFER_LIST_CONTEXT=E;exports.defaultTransferFilter=l;exports.moveAnnouncement=O;exports.moveTriggerLabel=N;