@skdx/vue 0.26.0 → 0.28.0

package/dist/transfer/TransferEmpty.vue_vue_type_script_setup_true_lang.js

@@ -1 +1 @@
-import{TRANSFER_CONTEXT as e}from"./context.js";import{createCommentVNode as t,createElementBlock as s,defineComponent as a,inject as r,mergeProps as n,openBlock as o,renderSlot as d,unref as i}from"vue";var m=["data-side"],p=/* @__PURE__ */a({inheritAttrs:!1,__name:"TransferEmpty",props:{side:{}},setup(a){const p=r(e);if(!p)throw new Error("SkdxTransferEmpty must be used within SkdxTransfer.");const f=p;return(e,r)=>0===i(f).visibleItems.value[a.side].length?(o(),s("div",n({key:0,class:"skdx-transfer__empty","data-part":"empty","data-side":a.side,"data-empty":""},e.$attrs),[d(e.$slots,"default")],16,m)):t("",!0)}});export{p as default};
+import{TRANSFER_CONTEXT as e}from"./context.js";import{computed as a,createCommentVNode as t,createElementBlock as s,defineComponent as r,inject as n,mergeProps as d,openBlock as o,renderSlot as u,unref as l}from"vue";var i=["data-side","data-reason","data-query"],m=/* @__PURE__ */r({inheritAttrs:!1,__name:"TransferEmpty",props:{side:{}},setup(r){const m=r,p=n(e);if(!p)throw new Error("SkdxTransferEmpty must be used within SkdxTransfer.");const v=p,f=a(()=>0===v.sideItems.value[m.side].length?"empty":"no-results"),y=a(()=>"no-results"===f.value?v.query.value[m.side]:"");return(e,a)=>0===l(v).visibleItems.value[r.side].length?(o(),s("div",d({key:0,class:"skdx-transfer__empty","data-part":"empty","data-side":r.side,"data-empty":"","data-reason":f.value,"data-query":y.value},e.$attrs),[u(e.$slots,"default",{reason:f.value,query:y.value})],16,i)):t("",!0)}});export{m as default};

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

@@ -1,19 +1,8 @@
 /**
- * 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.
+ * Option inside `SkdxTransferList`, `role="option"`. Marking (click/Enter/
+ * Space) is transient selection; moving requires `SkdxTransferMoveTrigger` or
+ * arrow key. Shift+Click marks range from anchor. Publishes `aria-selected`,
+ * `data-side`, `data-value`, `data-state`, `data-disabled`, roving `tabindex`.
  */
 type __VLS_Props = {
     /** The id of the `TransferItemData` entry this option renders. */

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

@@ -1,19 +1,8 @@
 /**
- * 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.
+ * Option inside `SkdxTransferList`, `role="option"`. Marking (click/Enter/
+ * Space) is transient selection; moving requires `SkdxTransferMoveTrigger` or
+ * arrow key. Shift+Click marks range from anchor. Publishes `aria-selected`,
+ * `data-side`, `data-value`, `data-state`, `data-disabled`, roving `tabindex`.
  */
 type __VLS_Props = {
     /** The id of the `TransferItemData` entry this option renders. */

package/dist/transfer/TransferItem.vue_vue_type_script_setup_true_lang.cjs

@@ -1 +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;
+const y=require("../utils/useSelection.cjs"),v=require("./context.cjs");let t=require("vue");var E=["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,y.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"||(e.shiftKey||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,E))}});exports.default=w;

package/dist/transfer/TransferItem.vue_vue_type_script_setup_true_lang.js

@@ -1 +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};
+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 y(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 _(){T.value||m.setActive(p.value,c.value)}function w(e){" "!==e.key&&"Enter"!==e.key||(e.shiftKey||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:y,onFocus:_,onKeydown:w}),[o(e.$slots,"default")],16,v))}});export{c as default};

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

@@ -1,38 +1,27 @@
-import { type TransferSide } from './context.cjs';
+import { type TransferItemData, 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.
+ * One side of a Transfer: multi-select listbox with roving focus, typeahead,
+ * and marked-for-move selection. Tab moves between lists; arrows move within.
+ * Shift+Arrow extends marked range; Shift+Space marks without moving focus;
+ * Ctrl/Cmd+A toggles all visible. Horizontal arrow moves marked items to other
+ * list (or focused item if nothing marked). Emits list-scroll on scroll.
  */
 type __VLS_Props = {
-    /** Which of the two sides this list renders the items for. */
+    /** Which side (source or target) this list renders. */
     side: TransferSide;
+    /**
+     * Custom renderer for each item (replaces bare label).
+     * @default undefined — renders item.label.
+     */
+    renderItem?: (item: TransferItemData) => unknown;
 };
 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 __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    renderItem: (item: TransferItemData) => unknown;
+}, {}, {}, {}, 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 & {

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

@@ -1,38 +1,27 @@
-import { type TransferSide } from './context.js';
+import { type TransferItemData, 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.
+ * One side of a Transfer: multi-select listbox with roving focus, typeahead,
+ * and marked-for-move selection. Tab moves between lists; arrows move within.
+ * Shift+Arrow extends marked range; Shift+Space marks without moving focus;
+ * Ctrl/Cmd+A toggles all visible. Horizontal arrow moves marked items to other
+ * list (or focused item if nothing marked). Emits list-scroll on scroll.
  */
 type __VLS_Props = {
-    /** Which of the two sides this list renders the items for. */
+    /** Which side (source or target) this list renders. */
     side: TransferSide;
+    /**
+     * Custom renderer for each item (replaces bare label).
+     * @default undefined — renders item.label.
+     */
+    renderItem?: (item: TransferItemData) => unknown;
 };
 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 __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    renderItem: (item: TransferItemData) => unknown;
+}, {}, {}, {}, 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 & {

package/dist/transfer/TransferList.vue_vue_type_script_setup_true_lang.cjs

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

package/dist/transfer/TransferList.vue_vue_type_script_setup_true_lang.js

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

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

@@ -1,17 +1,9 @@
 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.
+ * The visible heading naming one of the two lists, pointed to by `aria-labelledby`.
+ * Sits *beside* (not inside) its `SkdxTransferList`, since `role="listbox"` may
+ * only contain options. Takes its own `side` prop. Rendering it switches the list
+ * from a fallback name to this heading's text.
  *
  * @example
  * ```vue

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

@@ -1,17 +1,9 @@
 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.
+ * The visible heading naming one of the two lists, pointed to by `aria-labelledby`.
+ * Sits *beside* (not inside) its `SkdxTransferList`, since `role="listbox"` may
+ * only contain options. Takes its own `side` prop. Rendering it switches the list
+ * from a fallback name to this heading's text.
  *
  * @example
  * ```vue

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

@@ -1,16 +1,8 @@
 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.
+ * Filter input for one list (`<input type="search"`). Sibling of list (listbox
+ * can't contain it). Renders nothing while root is not searchable. Filtering
+ * narrows what list renders and what "move all" moves.
  *
  * @example
  * ```vue

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

@@ -1,16 +1,8 @@
 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.
+ * Filter input for one list (`<input type="search"`). Sibling of list (listbox
+ * can't contain it). Renders nothing while root is not searchable. Filtering
+ * narrows what list renders and what "move all" moves.
  *
  * @example
  * ```vue

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

@@ -1,14 +1,7 @@
 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.
+ * A button that moves every visible item on one side. Moves only what the
+ * filter is showing, excluding disabled items.
  *
  * @example
  * ```vue

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

@@ -1,14 +1,7 @@
 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.
+ * A button that moves every visible item on one side. Moves only what the
+ * filter is showing, excluding disabled items.
  *
  * @example
  * ```vue

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

@@ -1,21 +1,7 @@
 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.
+ * Button to move marked items. Uses `aria-disabled` (not `disabled`) to stay
+ * focusable when empty. Publishes data-direction (logical), data-count.
  *
  * @example
  * ```vue
@@ -23,7 +9,7 @@ import { type TransferDirection } from './context.cjs';
  * ```
  */
 type __VLS_Props = {
-    /** Which way this trigger moves: `'toTarget'` adds to the value, `'toSource'` removes from it. */
+    /** Direction: `'toTarget'` adds to value, `'toSource'` removes. */
     direction: TransferDirection;
 };
 declare var __VLS_1: {};

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

@@ -1,21 +1,7 @@
 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.
+ * Button to move marked items. Uses `aria-disabled` (not `disabled`) to stay
+ * focusable when empty. Publishes data-direction (logical), data-count.
  *
  * @example
  * ```vue
@@ -23,7 +9,7 @@ import { type TransferDirection } from './context.js';
  * ```
  */
 type __VLS_Props = {
-    /** Which way this trigger moves: `'toTarget'` adds to the value, `'toSource'` removes from it. */
+    /** Direction: `'toTarget'` adds to value, `'toSource'` removes. */
     direction: TransferDirection;
 };
 declare var __VLS_1: {};

package/dist/transfer/context.cjs

@@ -1 +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;
+var a='[role="option"]:not([data-disabled])',c={toTarget:"source",toSource:"target"},i={toTarget:"target",toSource:"source"},s={source:"available",target:"selected"};function T(e,r,t){const n=s[i[r]],o=t?"Move all":"Move";return e===0?`${o} items to ${n}, ${t?"nothing to move":"nothing selected"}`:`${o} ${e} ${e===1?"item":"items"} to ${n}`}function u({moved:e,remaining:r,from:t,to:n}){return`${e} ${e===1?"item":"items"} moved to ${s[n]}. ${r} remaining in ${s[t]}.`}function m({shown:e,total:r,side:t}){return`${e} of ${r} ${r===1?"item":"items"} shown in ${s[t]}.`}function N(e,r,t="contains"){const n=r.trim().toLowerCase();if(n==="")return!0;const o=e.label.toLowerCase();return t==="startsWith"?o.startsWith(n):t==="endsWith"?o.endsWith(n):o.includes(n)}var O=Symbol("skdx-transfer-context"),l=Symbol("skdx-transfer-list-context");exports.DESTINATION_OF=i;exports.OPTION_SELECTOR=a;exports.ORIGIN_OF=c;exports.SIDE_NOUN=s;exports.TRANSFER_CONTEXT=O;exports.TRANSFER_LIST_CONTEXT=l;exports.matchesFilterMode=N;exports.moveAnnouncement=u;exports.moveTriggerLabel=T;exports.searchResultsAnnouncement=m;

package/dist/transfer/context.d.cts

@@ -1,17 +1,7 @@
 import type { ComputedRef, InjectionKey } from 'vue';
-/**
- * Which of the two lists a part belongs to. `'source'` is the pool an item
- * starts in; `'target'` is the result — the array `SkdxTransfer`'s `value` holds.
- *
- * Named by role rather than by position: under `dir="rtl"` the target list is
- * on the left, so a `'left'`/`'right'` API would be wrong for half the world.
- */
+/** List side by role: source (start pool) or target (result). Named for RTL safety. */
 export type TransferSide = 'source' | 'target';
-/**
- * A move, named by where it lands rather than by which arrow it looks like.
- * `'toTarget'` adds to the value, `'toSource'` removes from it — true in both
- * writing directions, which `'right'`/`'left'` would not be.
- */
+/** Move direction by destination: toTarget (adds) or toSource (removes). Named for RTL safety. */
 export type TransferDirection = 'toTarget' | 'toSource';
 /** One entry in an `SkdxTransfer`'s collection. */
 export interface TransferItemData {
@@ -32,21 +22,9 @@ export declare const OPTION_SELECTOR = "[role=\"option\"]:not([data-disabled])";
 export declare const ORIGIN_OF: Record<TransferDirection, TransferSide>;
 /** @internal Where a direction takes items *to*. */
 export declare const DESTINATION_OF: Record<TransferDirection, TransferSide>;
-/**
- * @internal The word each side is called in default accessible names and in
- * the move announcement. Deliberately the *same* word in both, so "Move 3
- * items to selected" and "3 items moved to selected" name the same list.
- */
+/** @internal Side noun for accessible names and announcements. */
 export declare const SIDE_NOUN: Record<TransferSide, string>;
-/**
- * The accessible name of a move trigger: direction *and* count, because "→" is
- * unambiguous next to two labelled lists and meaningless read out on its own.
- *
- * With nothing to move the name says so rather than going silent — the trigger
- * stays focusable (`aria-disabled`, not `disabled`), so it is still the thing
- * that teaches a keyboard user the interaction, and it has to explain why
- * pressing it does nothing.
- *
+/** Accessible name of move trigger: direction and count. Explains when nothing to move.
  * @internal
  */
 export declare function moveTriggerLabel(count: number, direction: TransferDirection, all: boolean): string;
@@ -63,14 +41,61 @@ export interface TransferMoveDetail {
     /** The side they landed on. */
     to: TransferSide;
 }
+/** Default post-move announcement wording. Falls back for `getMoveAnnouncement`. */
+export declare function moveAnnouncement({ moved, remaining, from, to }: TransferMoveDetail): string;
+/** What a settled search query left visible, handed to `SkdxTransfer`'s `getSearchResultsAnnouncement`. */
+export interface TransferSearchResultsDetail {
+    /** How many items on this side survive the query. */
+    shown: number;
+    /** How many items are on this side in total, before the query. */
+    total: number;
+    /** Which side was filtered. */
+    side: TransferSide;
+    /** The query that produced this count. Empty once the user clears the box. */
+    query: string;
+}
+/** Default search-results announcement wording. Falls back for `getSearchResultsAnnouncement`. */
+export declare function searchResultsAnnouncement({ shown, total, side, }: TransferSearchResultsDetail): string;
+/** One list's scroll geometry, carried by `SkdxTransfer`'s `list-scroll` event. */
+export interface TransferListScrollDetail {
+    /** Which of the two lists scrolled. */
+    side: TransferSide;
+    /** How far the list is scrolled from its top, in pixels. */
+    scrollTop: number;
+    /** The full scrollable height of the list, in pixels. */
+    scrollHeight: number;
+    /** The visible height of the list, in pixels. */
+    clientHeight: number;
+}
 /**
- * The default wording of the post-move announcement. Split out so
- * `SkdxTransfer`'s `getMoveAnnouncement` has something to fall back to and so a
- * consumer can call it for the sides they do not want to re-word.
+ * How the built-in matcher compares a query against an item's label.
+ * `'contains'` is the default and the behaviour that shipped before this
+ * existed. A declarative stand-in for `filter`, which is a function and so
+ * cannot cross an HTML attribute boundary.
  */
-export declare function moveAnnouncement({ moved, remaining, from, to }: TransferMoveDetail): string;
+export type TransferFilterMatchMode = 'startsWith' | 'contains' | 'endsWith';
+/**
+ * Where an item lands on the target side when it is moved there. `'items'`
+ * keeps the collection's own order; `'append'` and `'prepend'` make the
+ * target list follow the order ids were moved in.
+ */
+export type TransferTargetOrder = 'items' | 'append' | 'prepend';
 /** @internal The default `filter`: a case-insensitive substring match against the item's label. */
 export declare function defaultTransferFilter(item: TransferItemData, query: string): boolean;
+/**
+ * The built-in matcher, parameterised by `filterMatchMode`.
+ *
+ * A declarative counterpart to `filter`: a function cannot cross the HTML
+ * attribute boundary, so `<skdx-transfer>` could only ever have the default
+ * substring match. This enum covers the case almost every consumer actually
+ * wants — "match from the start" for an id list, "contains" for labels — from
+ * an attribute, and leaves `filter` as the property-only escape hatch for
+ * anything else. PrimeVue's `filterMatchMode` is the precedent.
+ *
+ * Case-insensitive and trimmed in every mode, as the substring default always
+ * was: a user typing a leading space has not changed what they meant.
+ */
+export declare function matchesFilterMode(item: TransferItemData, query: string, mode?: TransferFilterMatchMode): boolean;
 /**
  * @internal Shared state distributed from `SkdxTransfer` to its parts. Every
  * field a part renders from is a `ComputedRef`, never a snapshot, so a prop
@@ -108,6 +133,16 @@ export interface TransferContext {
     registerHeader: (side: TransferSide, present: boolean) => void;
     /** Lets the root find a list element again, to place focus after a move. */
     registerList: (side: TransferSide, node: HTMLElement | null) => void;
+    /**
+     * Set just before the root places focus itself (after a move) so the next
+     * `focusin` a list sees is not mistaken for an external Tab and re-targeted
+     * by the default focus-in rule — the root's own placement is more specific
+     * than "first marked, else first". A plain mutable object, like `anchor`:
+     * nothing renders from it.
+     */
+    suppressFocusIn: {
+        current: boolean;
+    };
     /** Moves `values` (silently dropping any disabled ones), announces the outcome, and re-places focus. */
     move: (direction: TransferDirection, values: string[]) => void;
     /**
@@ -118,6 +153,8 @@ export interface TransferContext {
      * reaches the triggers.
      */
     moveLabel: (count: number, direction: TransferDirection, all: boolean) => string;
+    /** Publishes one list's scroll geometry to the root's `list-scroll` event. */
+    emitListScroll: (side: TransferSide, list: HTMLElement) => void;
 }
 /** @internal Injection key an `SkdxTransfer` provides so its parts share membership, marks, queries, and the move. */
 export declare const TRANSFER_CONTEXT: InjectionKey<TransferContext>;