@progress/kendo-react-listbox 13.3.0 → 13.4.0-develop.2

package/ListBox.d.ts

@@ -0,0 +1,28 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { ListBoxProps } from './interfaces/ListBoxProps.js';
+import * as React from 'react';
+/**
+ * The ListBox ref.
+ */
+export interface ListBoxHandle {
+    /**
+     * The current element or `null` if there is no one.
+     */
+    element: HTMLDivElement | null;
+    /**
+     * The props value of the ListBox.
+     */
+    props: ListBoxProps;
+}
+/**
+ * The ListBox component.
+ */
+export declare const ListBox: React.ForwardRefExoticComponent<ListBoxProps & React.RefAttributes<ListBoxHandle | null>>;
+/** @hidden */
+export type ListBox = ListBoxHandle;

package/ListBox.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const G=require("react"),u=require("prop-types"),a=require("@progress/kendo-react-common"),R=require("./interfaces/Enums.js");function U(n){const f=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const m in n)if(m!=="default"){const y=Object.getOwnPropertyDescriptor(n,m);Object.defineProperty(f,m,y.get?y:{enumerable:!0,get:()=>n[m]})}}return f.default=n,Object.freeze(f)}const s=U(G),k=s.forwardRef((n,f)=>{const{id:m,style:y,data:c,textField:h,className:T,valueField:S,selectedField:D,onDrop:L,onKeyDown:N,onDragStart:C,onDragLeave:v,onDragOver:F,onItemClick:z,onItemSelect:g,onKeyboardNavigate:d,size:b=E.size,draggable:_=E.draggable,toolbarPosition:K=E.toolbarPosition}=n,x=s.useRef(null),O=s.useRef(null),w=s.useRef(null),o=s.useCallback(()=>({element:w.current,props:n}),[]);s.useImperativeHandle(O,o),s.useImperativeHandle(f,()=>O.current);const P=m+"-accessibility-id",I=a.kendoThemeMaps.sizeMap[b]||b,q=t=>{if(D)return!!t[D]},A=t=>h?t[h]:t.toString(),j=t=>{N&&a.dispatchEvent(N,t,o(),void 0)},B=t=>{t.target.classList.contains("k-list-content")&&(n.data.length>0?a.dispatchEvent(n.onDrop,t,o(),{dataItem:n.data[n.data.length-1]}):a.dispatchEvent(n.onDrop,t,o(),{dataItem:null}))},M=()=>K===R.toolbarPosition.NONE||n.toolbar===void 0?`k-listbox-actions-${E.toolbarPosition}`:`k-listbox-actions-${K}`,H=t=>{v&&t.target.classList.contains("k-list-content")&&a.dispatchEvent(v,t,o(),void 0)},p=s.useMemo(()=>new a.Navigation({root:x,selectors:[".k-list-item"],tabIndex:0,keyboardEvents:{keydown:{Space:(t,i,e)=>{const r=i.elements.indexOf(t);e.metaKey&&a.dispatchEvent(g,e,o(),{dataItem:c[r]}),a.dispatchEvent(g,e,o(),{dataItem:c[r]})},ArrowDown:(t,i,e)=>{if(e.metaKey&&e.shiftKey)a.dispatchEvent(d,e,o(),{actionName:"moveDown"});else if(e.metaKey&&!e.shiftKey)e.preventDefault(),i.focusNext(t);else if(!(e.shiftKey&&!e.metaKey)){e.preventDefault();const r=i.elements.indexOf(t),l=c[r+1];l&&(a.dispatchEvent(g,e,o(),{dataItem:l}),i.focusNext(t))}},ArrowUp:(t,i,e)=>{if(e.metaKey&&e.shiftKey)a.dispatchEvent(d,e,o(),{actionName:"moveUp"});else if(e.metaKey&&!e.shiftKey)e.preventDefault(),i.focusPrevious(t);else if(!(e.shiftKey&&!e.metaKey)){e.preventDefault();const r=i.elements.indexOf(t),l=c[r-1];l&&(a.dispatchEvent(g,e,o(),{dataItem:l}),i.focusPrevious(t))}},ArrowLeft:(t,i,e)=>{e.metaKey&&e.shiftKey?a.dispatchEvent(d,e,o(),{actionName:"transferAllFrom"}):e.metaKey&&a.dispatchEvent(d,e,o(),{actionName:"transferFrom"})},ArrowRight:(t,i,e)=>{e.metaKey&&e.shiftKey?a.dispatchEvent(d,e,o(),{actionName:"transferAllTo"}):e.metaKey&&a.dispatchEvent(d,e,o(),{actionName:"transferTo"})},Backspace:(t,i,e)=>{a.dispatchEvent(d,e,o(),{actionName:"remove"})}}}}),[c]),$=s.useCallback(p.triggerKeyboardEvent.bind(p),[c]);return s.useEffect(()=>(p.initializeRovingTab(),()=>p.removeFocusListener()),[c]),s.createElement("div",{id:m,ref:w,style:y,unselectable:"on",className:a.classNames(T,"k-listbox",{[`k-listbox-${I}`]:b},M())},n.toolbar&&s.createElement(n.toolbar,null),s.createElement("div",{className:"k-list-scroller k-selectable","data-role":"selectable",ref:x,onDragOver:t=>t.preventDefault(),onDrop:B,onDragLeave:H,onKeyDown:$},s.createElement("div",{className:a.classNames("k-list",{[`k-list-${I}`]:b})},s.createElement("div",{className:"k-list-content"},s.createElement("ul",{className:"k-list-ul",role:"listbox","aria-label":"listbox-container",onKeyDown:j},c.map((t,i)=>{const e=q(t),r={className:a.classNames("k-list-item",{"k-selected":e}),role:"option",key:i,id:P+i,"aria-selected":e,"data-uid":P+i,draggable:_,onDragStart:l=>{a.dispatchEvent(C,l,o(),{dataItem:t})},onDragOver:l=>{l.preventDefault(),a.dispatchEvent(F,l,o(),{dataItem:t})},onDrop:l=>{a.dispatchEvent(L,l,o(),{dataItem:t})},onClick:l=>{a.dispatchEvent(z,l,o(),{dataItem:t})}};return n.item?s.createElement(n.item,{selected:e,dataItem:t,...r,key:r.key},s.createElement("span",{className:"k-list-item-text"},t.name)):s.createElement("li",{...r,key:r.key},s.createElement("span",{className:"k-list-item-text"},A(t)))}))))),s.createElement("select",{style:{display:"none"},multiple:!0,"data-role":"listbox"},c.map((t,i)=>{const e=t[S||h];return s.createElement("option",{key:i,value:e},e)})))}),E={toolbarPosition:R.toolbarPosition.RIGHT,draggable:!0,size:"medium"};k.propTypes={size:u.oneOf([null,"small","medium","large"]),toolbarPosition:u.oneOf(["none","top","bottom","left","right"]),textField:u.string.isRequired,valueField:u.string,selectedField:u.string,data:u.array.isRequired};k.displayName="ListBoxInner";exports.ListBox=k;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const G=require("react"),u=require("prop-types"),a=require("@progress/kendo-react-common"),R=require("./interfaces/Enums.js");function U(n){const f=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const d in n)if(d!=="default"){const y=Object.getOwnPropertyDescriptor(n,d);Object.defineProperty(f,d,y.get?y:{enumerable:!0,get:()=>n[d]})}}return f.default=n,Object.freeze(f)}const s=U(G),k=s.forwardRef((n,f)=>{const{id:d,style:y,data:c,textField:h,className:T,valueField:S,selectedField:D,onDrop:L,onKeyDown:v,onDragStart:C,onDragLeave:N,onDragOver:F,onItemClick:z,onItemSelect:g,onKeyboardNavigate:m,size:b=E.size,draggable:_=E.draggable,toolbarPosition:K=E.toolbarPosition}=n,x=s.useRef(null),O=s.useRef(null),w=s.useRef(null),o=s.useCallback(()=>({element:w.current,props:n}),[]);s.useImperativeHandle(O,o),s.useImperativeHandle(f,()=>O.current);const P=d+"-accessibility-id",I=a.kendoThemeMaps.sizeMap[b]||b,q=t=>{if(D)return!!t[D]},A=t=>h?t[h]:t.toString(),j=t=>{v&&a.dispatchEvent(v,t,o(),void 0)},B=t=>{t.target.classList.contains("k-list-content")&&(n.data.length>0?a.dispatchEvent(n.onDrop,t,o(),{dataItem:n.data[n.data.length-1]}):a.dispatchEvent(n.onDrop,t,o(),{dataItem:null}))},M=()=>K===R.toolbarPosition.NONE||n.toolbar===void 0?`k-listbox-actions-${E.toolbarPosition}`:`k-listbox-actions-${K}`,H=t=>{N&&t.target.classList.contains("k-list-content")&&a.dispatchEvent(N,t,o(),void 0)},p=s.useMemo(()=>new a.Navigation({root:x,selectors:[".k-list-item"],tabIndex:0,keyboardEvents:{keydown:{Space:(t,i,e)=>{const r=i.elements.indexOf(t);e.metaKey&&a.dispatchEvent(g,e,o(),{dataItem:c[r]}),a.dispatchEvent(g,e,o(),{dataItem:c[r]})},ArrowDown:(t,i,e)=>{if(e.metaKey&&e.shiftKey)a.dispatchEvent(m,e,o(),{actionName:"moveDown"});else if(e.metaKey&&!e.shiftKey)e.preventDefault(),i.focusNext(t);else if(!(e.shiftKey&&!e.metaKey)){e.preventDefault();const r=i.elements.indexOf(t),l=c[r+1];l&&(a.dispatchEvent(g,e,o(),{dataItem:l}),i.focusNext(t))}},ArrowUp:(t,i,e)=>{if(e.metaKey&&e.shiftKey)a.dispatchEvent(m,e,o(),{actionName:"moveUp"});else if(e.metaKey&&!e.shiftKey)e.preventDefault(),i.focusPrevious(t);else if(!(e.shiftKey&&!e.metaKey)){e.preventDefault();const r=i.elements.indexOf(t),l=c[r-1];l&&(a.dispatchEvent(g,e,o(),{dataItem:l}),i.focusPrevious(t))}},ArrowLeft:(t,i,e)=>{e.metaKey&&e.shiftKey?a.dispatchEvent(m,e,o(),{actionName:"transferAllFrom"}):e.metaKey&&a.dispatchEvent(m,e,o(),{actionName:"transferFrom"})},ArrowRight:(t,i,e)=>{e.metaKey&&e.shiftKey?a.dispatchEvent(m,e,o(),{actionName:"transferAllTo"}):e.metaKey&&a.dispatchEvent(m,e,o(),{actionName:"transferTo"})},Backspace:(t,i,e)=>{a.dispatchEvent(m,e,o(),{actionName:"remove"})}}}}),[c]),$=s.useCallback(p.triggerKeyboardEvent.bind(p),[c]);return s.useEffect(()=>(p.initializeRovingTab(),()=>p.removeFocusListener()),[c]),s.createElement("div",{id:d,ref:w,style:y,unselectable:"on",className:a.classNames(T,"k-listbox",{[`k-listbox-${I}`]:b},M())},n.toolbar&&s.createElement(n.toolbar,null),s.createElement("div",{className:"k-list-scroller k-selectable","data-role":"selectable",ref:x,onDragOver:t=>t.preventDefault(),onDrop:B,onDragLeave:H,onKeyDown:$},s.createElement("div",{className:a.classNames("k-list",{[`k-list-${I}`]:b})},s.createElement("div",{className:"k-list-content"},s.createElement("ul",{className:"k-list-ul",role:"listbox","aria-label":"listbox-container",onKeyDown:j},c.map((t,i)=>{const e=q(t),r={className:a.classNames("k-list-item",{"k-selected":e}),role:"option",key:i,id:P+i,"aria-selected":e,"data-uid":P+i,draggable:_,onDragStart:l=>{a.dispatchEvent(C,l,o(),{dataItem:t})},onDragOver:l=>{l.preventDefault(),a.dispatchEvent(F,l,o(),{dataItem:t})},onDrop:l=>{a.dispatchEvent(L,l,o(),{dataItem:t})},onClick:l=>{a.dispatchEvent(z,l,o(),{dataItem:t})}};return n.item?s.createElement(n.item,{selected:e,dataItem:t,...r,key:r.key},s.createElement("span",{className:"k-list-item-text"},t.name)):s.createElement("li",{...r,key:r.key},s.createElement("span",{className:"k-list-item-text"},A(t)))}))))),s.createElement("select",{style:{display:"none"},multiple:!0,"data-role":"listbox"},c.map((t,i)=>{const e=t[S||h];return s.createElement("option",{key:i,value:e},e)})))}),E={toolbarPosition:R.toolbarPosition.RIGHT,draggable:!0,size:void 0};k.propTypes={size:u.oneOf(["small","medium","large"]),toolbarPosition:u.oneOf(["none","top","bottom","left","right"]),textField:u.string.isRequired,valueField:u.string,selectedField:u.string,data:u.array.isRequired};k.displayName="ListBoxInner";exports.ListBox=k;

package/ListBox.mjs

@@ -18,11 +18,11 @@ const R = a.forwardRef((n, T) => {
     className: L,
     valueField: C,
     selectedField: K,
-    onDrop: z,
+    onDrop: v,
     onKeyDown: x,
-    onDragStart: S,
+    onDragStart: z,
     onDragLeave: N,
-    onDragOver: v,
+    onDragOver: S,
     onItemClick: A,
     onItemSelect: d,
     onKeyboardNavigate: m,
@@ -156,17 +156,17 @@ const R = a.forwardRef((n, T) => {
             draggable: $,
             onDragStart: (l) => {
               s(
-                S,
+                z,
                 l,
                 o(),
                 { dataItem: t }
               );
             },
             onDragOver: (l) => {
-              l.preventDefault(), s(v, l, o(), { dataItem: t });
+              l.preventDefault(), s(S, l, o(), { dataItem: t });
             },
             onDrop: (l) => {
-              s(z, l, o(), { dataItem: t });
+              s(v, l, o(), { dataItem: t });
             },
             onClick: (l) => {
               s(A, l, o(), { dataItem: t });
@@ -193,10 +193,10 @@ const R = a.forwardRef((n, T) => {
 }), g = {
   toolbarPosition: O.RIGHT,
   draggable: !0,
-  size: "medium"
+  size: void 0
 };
 R.propTypes = {
-  size: f.oneOf([null, "small", "medium", "large"]),
+  size: f.oneOf(["small", "medium", "large"]),
   toolbarPosition: f.oneOf(["none", "top", "bottom", "left", "right"]),
   textField: f.string.isRequired,
   valueField: f.string,

package/ListBoxToolbar.d.ts

@@ -0,0 +1,24 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { ListBoxToolbarProps } from './interfaces/ListBoxToolBarProps.js';
+import { ListBoxToolbarEvent } from './interfaces/ListBoxEvents.js';
+import * as React from 'react';
+/**
+ * @hidden
+ */
+interface ListBoxToolbarHandle {
+    onToolClick?: (event: ListBoxToolbarEvent) => void;
+    props: ListBoxToolbarProps;
+    context: {};
+    state: {};
+    refs: {};
+}
+export declare const ListBoxToolbar: React.ForwardRefExoticComponent<ListBoxToolbarProps & React.RefAttributes<ListBoxToolbarHandle | null>>;
+/** @hidden */
+export type ListBoxToolbar = ListBoxToolbarHandle;
+export {};

package/ListBoxToolbar.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const P=require("react"),f=require("prop-types"),k=require("@progress/kendo-react-common"),B=require("@progress/kendo-react-buttons"),j=require("@progress/kendo-react-intl"),o=require("@progress/kendo-svg-icons"),U=require("./messages/index.js");function _(l){const g=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(l){for(const i in l)if(i!=="default"){const b=Object.getOwnPropertyDescriptor(l,i);Object.defineProperty(g,i,b.get?b:{enumerable:!0,get:()=>l[i]})}}return g.default=l,Object.freeze(g)}const r=_(P),D=[{name:"moveUp",iconName:"caret-alt-up",svgIcon:o.caretAltUpIcon},{name:"moveDown",iconName:"caret-alt-down",svgIcon:o.caretAltDownIcon},{name:"transferTo",iconName:"caret-alt-right",svgIcon:o.caretAltRightIcon},{name:"transferFrom",iconName:"caret-alt-left",svgIcon:o.caretAltLeftIcon},{name:"transferAllTo",iconName:"caret-double-alt-right",svgIcon:o.caretDoubleAltRightIcon},{name:"transferAllFrom",iconName:"caret-double-alt-left",svgIcon:o.caretDoubleAltLeftIcon},{name:"remove",iconName:"x",svgIcon:o.xIcon}],p=r.forwardRef((l,g)=>{const{tools:i,dir:b,onToolClick:w,size:L=h.size,data:d=h.data,dataConnected:n=h.dataConnected,selectedField:C=h.selectedField}=l,F=j.useLocalization(),A=r.useRef(null),T=r.useRef(null),x=r.useCallback(()=>({onToolClick:w,props:l,context:{},state:{},refs:{}}),[]);r.useImperativeHandle(T,x),r.useImperativeHandle(g,()=>T.current);const y=(t,e,c)=>{c.preventDefault(),e.focusNext(t)},N=(t,e,c)=>{c.preventDefault(),e.focusPrevious(t)},v=r.useMemo(()=>new k.Navigation({root:A,selectors:[".k-button:not([disabled])"],tabIndex:0,keyboardEvents:{keydown:{ArrowDown:y,ArrowRight:y,ArrowUp:N,ArrowLeft:N,Enter:(t,e,c)=>{t.click(),e.focusElement(e.current,t)}}}}),[]),S=r.useCallback(v.triggerKeyboardEvent.bind(v),[]);r.useEffect(()=>(v.initializeRovingTab(),()=>v.removeFocusListener()),[]);const q=t=>{switch(t.name){case"caret-alt-right":return o.caretAltLeftIcon;case"caret-alt-left":return o.caretAltRightIcon;case"caret-double-alt-right":return o.caretDoubleAltLeftIcon;case"caret-double-alt-left":return o.caretDoubleAltRightIcon}return t},E=t=>{switch(t){case"caret-alt-right":return"caret-alt-left";case"caret-alt-left":return"caret-alt-right";case"caret-double-alt-right":return"caret-double-alt-left";case"caret-double-alt-left":return"caret-double-alt-right"}return t},O=(t,e)=>{k.dispatchEvent(w,t,x(),{toolName:e})},z=t=>{let e=!0;const c=C||"selected",a=d.length,I=n.length,u=d.findIndex(s=>s[c]===!0)>=0,m=n.findIndex(s=>s[c]===!0)>=0;switch(t){case"moveUp":u?e=d.length>0?d[0].selected:!0:m?e=n.length>0?n[0].selected:!0:e=!0;break;case"moveDown":u?e=d[a-1]?d[a-1].selected:!0:m?e=n.length>0?n[I-1].selected:!0:e=!0;break;case"transferTo":e=!(n&&u);break;case"transferFrom":n?e=!(n&&m):e=!0;break;case"transferAllTo":e=!(n&&d.length>0);break;case"transferAllFrom":e=!(n&&n.length>0);break;case"remove":e=!(u||m);break}return e},R=b==="rtl";return r.createElement("div",{className:k.classNames("k-listbox-actions"),ref:A,onKeyDown:S},i&&i.map((t,e)=>{const c=D.findIndex(s=>s.name===t),a=D[c],I=z(a.name),u=`listbox.${a.name}`,m=F.toLanguageString(u,U.messages[u]);return r.createElement(B.Button,{size:L,key:e,disabled:I,"data-command":a.name,title:m,"aria-label":m,icon:R?E(a.iconName):a.iconName,svgIcon:R?q(a.svgIcon):a.svgIcon,onClick:s=>{s.preventDefault(),O(s,a.name)}})}))}),h={data:[],dataConnected:[],selectedField:"selected",size:"medium"};p.propTypes={data:f.array.isRequired,dataConnected:f.array.isRequired,tools:f.array,selectedField:f.string,dir:f.string,size:f.oneOf([null,"small","medium","large"])};p.displayName="ListBoxToolbarInner";exports.ListBoxToolbar=p;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const P=require("react"),f=require("prop-types"),k=require("@progress/kendo-react-common"),B=require("@progress/kendo-react-buttons"),j=require("@progress/kendo-react-intl"),o=require("@progress/kendo-svg-icons"),U=require("./messages/index.js");function _(l){const g=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(l){for(const i in l)if(i!=="default"){const b=Object.getOwnPropertyDescriptor(l,i);Object.defineProperty(g,i,b.get?b:{enumerable:!0,get:()=>l[i]})}}return g.default=l,Object.freeze(g)}const r=_(P),D=[{name:"moveUp",iconName:"caret-alt-up",svgIcon:o.caretAltUpIcon},{name:"moveDown",iconName:"caret-alt-down",svgIcon:o.caretAltDownIcon},{name:"transferTo",iconName:"caret-alt-right",svgIcon:o.caretAltRightIcon},{name:"transferFrom",iconName:"caret-alt-left",svgIcon:o.caretAltLeftIcon},{name:"transferAllTo",iconName:"caret-double-alt-right",svgIcon:o.caretDoubleAltRightIcon},{name:"transferAllFrom",iconName:"caret-double-alt-left",svgIcon:o.caretDoubleAltLeftIcon},{name:"remove",iconName:"x",svgIcon:o.xIcon}],p=r.forwardRef((l,g)=>{const{tools:i,dir:b,onToolClick:w,size:L=h.size,data:d=h.data,dataConnected:n=h.dataConnected,selectedField:C=h.selectedField}=l,F=j.useLocalization(),A=r.useRef(null),T=r.useRef(null),x=r.useCallback(()=>({onToolClick:w,props:l,context:{},state:{},refs:{}}),[]);r.useImperativeHandle(T,x),r.useImperativeHandle(g,()=>T.current);const y=(t,e,c)=>{c.preventDefault(),e.focusNext(t)},N=(t,e,c)=>{c.preventDefault(),e.focusPrevious(t)},v=r.useMemo(()=>new k.Navigation({root:A,selectors:[".k-button:not([disabled])"],tabIndex:0,keyboardEvents:{keydown:{ArrowDown:y,ArrowRight:y,ArrowUp:N,ArrowLeft:N,Enter:(t,e,c)=>{t.click(),e.focusElement(e.current,t)}}}}),[]),S=r.useCallback(v.triggerKeyboardEvent.bind(v),[]);r.useEffect(()=>(v.initializeRovingTab(),()=>v.removeFocusListener()),[]);const q=t=>{switch(t.name){case"caret-alt-right":return o.caretAltLeftIcon;case"caret-alt-left":return o.caretAltRightIcon;case"caret-double-alt-right":return o.caretDoubleAltLeftIcon;case"caret-double-alt-left":return o.caretDoubleAltRightIcon}return t},E=t=>{switch(t){case"caret-alt-right":return"caret-alt-left";case"caret-alt-left":return"caret-alt-right";case"caret-double-alt-right":return"caret-double-alt-left";case"caret-double-alt-left":return"caret-double-alt-right"}return t},O=(t,e)=>{k.dispatchEvent(w,t,x(),{toolName:e})},z=t=>{let e=!0;const c=C||"selected",a=d.length,I=n.length,u=d.findIndex(s=>s[c]===!0)>=0,m=n.findIndex(s=>s[c]===!0)>=0;switch(t){case"moveUp":u?e=d.length>0?d[0].selected:!0:m?e=n.length>0?n[0].selected:!0:e=!0;break;case"moveDown":u?e=d[a-1]?d[a-1].selected:!0:m?e=n.length>0?n[I-1].selected:!0:e=!0;break;case"transferTo":e=!(n&&u);break;case"transferFrom":n?e=!(n&&m):e=!0;break;case"transferAllTo":e=!(n&&d.length>0);break;case"transferAllFrom":e=!(n&&n.length>0);break;case"remove":e=!(u||m);break}return e},R=b==="rtl";return r.createElement("div",{className:k.classNames("k-listbox-actions"),ref:A,onKeyDown:S},i&&i.map((t,e)=>{const c=D.findIndex(s=>s.name===t),a=D[c],I=z(a.name),u=`listbox.${a.name}`,m=F.toLanguageString(u,U.messages[u]);return r.createElement(B.Button,{size:L,key:e,disabled:I,"data-command":a.name,title:m,"aria-label":m,icon:R?E(a.iconName):a.iconName,svgIcon:R?q(a.svgIcon):a.svgIcon,onClick:s=>{s.preventDefault(),O(s,a.name)}})}))}),h={data:[],dataConnected:[],selectedField:"selected",size:void 0};p.propTypes={data:f.array.isRequired,dataConnected:f.array.isRequired,tools:f.array,selectedField:f.string,dir:f.string,size:f.oneOf(["small","medium","large"])};p.displayName="ListBoxToolbarInner";exports.ListBoxToolbar=p;

package/ListBoxToolbar.mjs

@@ -26,7 +26,7 @@ const N = [
     dir: R,
     onToolClick: v,
     size: C = u.size,
-    data: l = u.data,
+    data: s = u.data,
     dataConnected: a = u.dataConnected,
     selectedField: E = u.selectedField
   } = g, z = _(), h = n.useRef(null), p = n.useRef(null), I = n.useCallback(
@@ -95,34 +95,34 @@ const N = [
     O(v, t, I(), { toolName: e });
   }, H = (t) => {
     let e = !0;
-    const o = E || "selected", r = l.length, f = a.length, s = l.findIndex((c) => c[o] === !0) >= 0, i = a.findIndex((c) => c[o] === !0) >= 0;
+    const o = E || "selected", r = s.length, f = a.length, l = s.findIndex((c) => c[o] === !0) >= 0, i = a.findIndex((c) => c[o] === !0) >= 0;
     switch (t) {
       case "moveUp":
-        s ? e = l.length > 0 ? l[0].selected : !0 : i ? e = a.length > 0 ? a[0].selected : !0 : e = !0;
+        l ? e = s.length > 0 ? s[0].selected : !0 : i ? e = a.length > 0 ? a[0].selected : !0 : e = !0;
         break;
       case "moveDown":
-        s ? e = l[r - 1] ? l[r - 1].selected : !0 : i ? e = a.length > 0 ? a[f - 1].selected : !0 : e = !0;
+        l ? e = s[r - 1] ? s[r - 1].selected : !0 : i ? e = a.length > 0 ? a[f - 1].selected : !0 : e = !0;
         break;
       case "transferTo":
-        e = !(a && s);
+        e = !(a && l);
         break;
       case "transferFrom":
         a ? e = !(a && i) : e = !0;
         break;
       case "transferAllTo":
-        e = !(a && l.length > 0);
+        e = !(a && s.length > 0);
         break;
       case "transferAllFrom":
         e = !(a && a.length > 0);
         break;
       case "remove":
-        e = !(s || i);
+        e = !(l || i);
         break;
     }
     return e;
   }, x = R === "rtl";
   return /* @__PURE__ */ n.createElement("div", { className: q("k-listbox-actions"), ref: h, onKeyDown: S }, b && b.map((t, e) => {
-    const o = N.findIndex((c) => c.name === t), r = N[o], f = H(r.name), s = `listbox.${r.name}`, i = z.toLanguageString(s, J[s]);
+    const o = N.findIndex((c) => c.name === t), r = N[o], f = H(r.name), l = `listbox.${r.name}`, i = z.toLanguageString(l, J[l]);
     return /* @__PURE__ */ n.createElement(
       M,
       {
@@ -144,7 +144,7 @@ const N = [
   data: [],
   dataConnected: [],
   selectedField: "selected",
-  size: "medium"
+  size: void 0
 };
 F.propTypes = {
   data: d.array.isRequired,
@@ -152,7 +152,7 @@ F.propTypes = {
   tools: d.array,
   selectedField: d.string,
   dir: d.string,
-  size: d.oneOf([null, "small", "medium", "large"])
+  size: d.oneOf(["small", "medium", "large"])
 };
 F.displayName = "ListBoxToolbarInner";
 export {

package/dist/cdn/js/kendo-react-listbox.js

@@ -12,4 +12,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("prop-types"),require("@progress/kendo-react-common"),require("@progress/kendo-react-buttons"),require("@progress/kendo-react-intl"),require("@progress/kendo-svg-icons")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","@progress/kendo-react-common","@progress/kendo-react-buttons","@progress/kendo-react-intl","@progress/kendo-svg-icons"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactListbox={},e.React,e.PropTypes,e.KendoReactCommon,e.KendoReactButtons,e.KendoReactIntl,e.KendoSvgIcons)}(this,(function(e,t,a,o,n,r,s){"use strict";function l(e){var t=Object.create(null);return e&&Object.keys(e).forEach((function(a){if("default"!==a){var o=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(t,a,o.get?o:{enumerable:!0,get:function(){return e[a]}})}})),t.default=e,Object.freeze(t)}var i=l(t),c=(e=>(e.TOP="top",e.BOTTOM="bottom",e.LEFT="left",e.RIGHT="right",e.NONE="none",e))(c||{});const d=i.forwardRef(((e,t)=>{const{id:a,style:n,data:r,textField:s,className:l,valueField:d,selectedField:u,onDrop:f,onKeyDown:p,onDragStart:v,onDragLeave:b,onDragOver:g,onItemClick:x,onItemSelect:h,onKeyboardNavigate:D,size:k=m.size,draggable:y=m.draggable,toolbarPosition:I=m.toolbarPosition}=e,E=i.useRef(null),w=i.useRef(null),T=i.useRef(null),N=i.useCallback((()=>({element:T.current,props:e})),[]);i.useImperativeHandle(w,N),i.useImperativeHandle(t,(()=>w.current));const B=a+"-accessibility-id",O=o.kendoThemeMaps.sizeMap[k]||k,K=i.useMemo((()=>new o.Navigation({root:E,selectors:[".k-list-item"],tabIndex:0,keyboardEvents:{keydown:{Space:(e,t,a)=>{const n=t.elements.indexOf(e);a.metaKey&&o.dispatchEvent(h,a,N(),{dataItem:r[n]}),o.dispatchEvent(h,a,N(),{dataItem:r[n]})},ArrowDown:(e,t,a)=>{if(a.metaKey&&a.shiftKey)o.dispatchEvent(D,a,N(),{actionName:"moveDown"});else if(a.metaKey&&!a.shiftKey)a.preventDefault(),t.focusNext(e);else if(!a.shiftKey||a.metaKey){a.preventDefault();const n=t.elements.indexOf(e),s=r[n+1];s&&(o.dispatchEvent(h,a,N(),{dataItem:s}),t.focusNext(e))}},ArrowUp:(e,t,a)=>{if(a.metaKey&&a.shiftKey)o.dispatchEvent(D,a,N(),{actionName:"moveUp"});else if(a.metaKey&&!a.shiftKey)a.preventDefault(),t.focusPrevious(e);else if(!a.shiftKey||a.metaKey){a.preventDefault();const n=t.elements.indexOf(e),s=r[n-1];s&&(o.dispatchEvent(h,a,N(),{dataItem:s}),t.focusPrevious(e))}},ArrowLeft:(e,t,a)=>{a.metaKey&&a.shiftKey?o.dispatchEvent(D,a,N(),{actionName:"transferAllFrom"}):a.metaKey&&o.dispatchEvent(D,a,N(),{actionName:"transferFrom"})},ArrowRight:(e,t,a)=>{a.metaKey&&a.shiftKey?o.dispatchEvent(D,a,N(),{actionName:"transferAllTo"}):a.metaKey&&o.dispatchEvent(D,a,N(),{actionName:"transferTo"})},Backspace:(e,t,a)=>{o.dispatchEvent(D,a,N(),{actionName:"remove"})}}}})),[r]),A=i.useCallback(K.triggerKeyboardEvent.bind(K),[r]);return i.useEffect((()=>(K.initializeRovingTab(),()=>K.removeFocusListener())),[r]),i.createElement("div",{id:a,ref:T,style:n,unselectable:"on",className:o.classNames(l,"k-listbox",{[`k-listbox-${O}`]:k},I===c.NONE||void 0===e.toolbar?`k-listbox-actions-${m.toolbarPosition}`:`k-listbox-actions-${I}`)},e.toolbar&&i.createElement(e.toolbar,null),i.createElement("div",{className:"k-list-scroller k-selectable","data-role":"selectable",ref:E,onDragOver:e=>e.preventDefault(),onDrop:t=>{t.target.classList.contains("k-list-content")&&(e.data.length>0?o.dispatchEvent(e.onDrop,t,N(),{dataItem:e.data[e.data.length-1]}):o.dispatchEvent(e.onDrop,t,N(),{dataItem:null}))},onDragLeave:e=>{b&&e.target.classList.contains("k-list-content")&&o.dispatchEvent(b,e,N(),void 0)},onKeyDown:A},i.createElement("div",{className:o.classNames("k-list",{[`k-list-${O}`]:k})},i.createElement("div",{className:"k-list-content"},i.createElement("ul",{className:"k-list-ul",role:"listbox","aria-label":"listbox-container",onKeyDown:e=>{p&&o.dispatchEvent(p,e,N(),void 0)}},r.map(((t,a)=>{const n=(e=>{if(u)return!!e[u]})(t),r={className:o.classNames("k-list-item",{"k-selected":n}),role:"option",key:a,id:B+a,"aria-selected":n,"data-uid":B+a,draggable:y,onDragStart:e=>{o.dispatchEvent(v,e,N(),{dataItem:t})},onDragOver:e=>{e.preventDefault(),o.dispatchEvent(g,e,N(),{dataItem:t})},onDrop:e=>{o.dispatchEvent(f,e,N(),{dataItem:t})},onClick:e=>{o.dispatchEvent(x,e,N(),{dataItem:t})}};return e.item?i.createElement(e.item,{selected:n,dataItem:t,...r,key:r.key},i.createElement("span",{className:"k-list-item-text"},t.name)):i.createElement("li",{...r,key:r.key},i.createElement("span",{className:"k-list-item-text"},(e=>s?e[s]:e.toString())(t)))})))))),i.createElement("select",{style:{display:"none"},multiple:!0,"data-role":"listbox"},r.map(((e,t)=>{const a=e[d||s];return i.createElement("option",{key:t,value:a},a)}))))})),m={toolbarPosition:c.RIGHT,draggable:!0,size:"medium"};d.propTypes={size:a.oneOf([null,"small","medium","large"]),toolbarPosition:a.oneOf(["none","top","bottom","left","right"]),textField:a.string.isRequired,valueField:a.string,selectedField:a.string,data:a.array.isRequired},d.displayName="ListBoxInner";const u={"listbox.moveUp":"Move Up","listbox.moveDown":"Move Down","listbox.transferTo":"Transfer To","listbox.transferFrom":"Transfer From","listbox.transferAllTo":"Transfer All To","listbox.transferAllFrom":"Transfer All From","listbox.remove":"Delete"},f=[{name:"moveUp",iconName:"caret-alt-up",svgIcon:s.caretAltUpIcon},{name:"moveDown",iconName:"caret-alt-down",svgIcon:s.caretAltDownIcon},{name:"transferTo",iconName:"caret-alt-right",svgIcon:s.caretAltRightIcon},{name:"transferFrom",iconName:"caret-alt-left",svgIcon:s.caretAltLeftIcon},{name:"transferAllTo",iconName:"caret-double-alt-right",svgIcon:s.caretDoubleAltRightIcon},{name:"transferAllFrom",iconName:"caret-double-alt-left",svgIcon:s.caretDoubleAltLeftIcon},{name:"remove",iconName:"x",svgIcon:s.xIcon}],p=i.forwardRef(((e,t)=>{const{tools:a,dir:l,onToolClick:c,size:d=v.size,data:m=v.data,dataConnected:p=v.dataConnected,selectedField:b=v.selectedField}=e,g=r.useLocalization(),x=i.useRef(null),h=i.useRef(null),D=i.useCallback((()=>({onToolClick:c,props:e,context:{},state:{},refs:{}})),[]);i.useImperativeHandle(h,D),i.useImperativeHandle(t,(()=>h.current));const k=(e,t,a)=>{a.preventDefault(),t.focusNext(e)},y=(e,t,a)=>{a.preventDefault(),t.focusPrevious(e)},I=i.useMemo((()=>new o.Navigation({root:x,selectors:[".k-button:not([disabled])"],tabIndex:0,keyboardEvents:{keydown:{ArrowDown:k,ArrowRight:k,ArrowUp:y,ArrowLeft:y,Enter:(e,t,a)=>{e.click(),t.focusElement(t.current,e)}}}})),[]),E=i.useCallback(I.triggerKeyboardEvent.bind(I),[]);i.useEffect((()=>(I.initializeRovingTab(),()=>I.removeFocusListener())),[]);const w=e=>{switch(e.name){case"caret-alt-right":return s.caretAltLeftIcon;case"caret-alt-left":return s.caretAltRightIcon;case"caret-double-alt-right":return s.caretDoubleAltLeftIcon;case"caret-double-alt-left":return s.caretDoubleAltRightIcon}return e},T=e=>{switch(e){case"caret-alt-right":return"caret-alt-left";case"caret-alt-left":return"caret-alt-right";case"caret-double-alt-right":return"caret-double-alt-left";case"caret-double-alt-left":return"caret-double-alt-right"}return e},N="rtl"===l;return i.createElement("div",{className:o.classNames("k-listbox-actions"),ref:x,onKeyDown:E},a&&a.map(((e,t)=>{const a=f.findIndex((t=>t.name===e)),r=f[a],s=(e=>{let t=!0;const a=b||"selected",o=m.length,n=p.length,r=m.findIndex((e=>!0===e[a]))>=0,s=p.findIndex((e=>!0===e[a]))>=0;switch(e){case"moveUp":t=r?!(m.length>0)||m[0].selected:!s||!(p.length>0)||p[0].selected;break;case"moveDown":t=r?!m[o-1]||m[o-1].selected:!s||!(p.length>0)||p[n-1].selected;break;case"transferTo":t=!(p&&r);break;case"transferFrom":t=!p||!(p&&s);break;case"transferAllTo":t=!(p&&m.length>0);break;case"transferAllFrom":t=!(p&&p.length>0);break;case"remove":t=!(r||s)}return t})(r.name),l=`listbox.${r.name}`,v=g.toLanguageString(l,u[l]);return i.createElement(n.Button,{size:d,key:t,disabled:s,"data-command":r.name,title:v,"aria-label":v,icon:N?T(r.iconName):r.iconName,svgIcon:N?w(r.svgIcon):r.svgIcon,onClick:e=>{e.preventDefault(),((e,t)=>{o.dispatchEvent(c,e,D(),{toolName:t})})(e,r.name)}})})))})),v={data:[],dataConnected:[],selectedField:"selected",size:"medium"};p.propTypes={data:a.array.isRequired,dataConnected:a.array.isRequired,tools:a.array,selectedField:a.string,dir:a.string,size:a.oneOf([null,"small","medium","large"])},p.displayName="ListBoxToolbarInner";const b=(e,t,a)=>{const o=a.splice(e,1)[0];return a.splice(t,0,o),a},g=o.withIdHOC(d);g.displayName="KendoReactListBox",e.ListBox=g,e.ListBoxToolbar=p,e.moveItem=b,e.processListBoxData=(e=[],t=[],a,o)=>{let n=[],r=[],s=[];const l={listBoxOneData:e,listBoxTwoData:t};switch(a){case"moveUp":n=[...e],n.forEach(((e,t)=>{e[o]&&(n=b(t,t-1,n))})),s=[...t],s.forEach(((e,t)=>{e[o]&&(s=b(t,t-1,s))})),l.listBoxOneData=n,l.listBoxTwoData=s;break;case"moveDown":n=e.reverse(),n.forEach(((e,t)=>{e[o]&&(n=b(t,t-1,n))})),s=t.reverse(),s.forEach(((e,t)=>{e[o]&&(s=b(t,t-1,s))})),l.listBoxOneData=[...n].reverse(),l.listBoxTwoData=[...s].reverse();break;case"transferTo":n=e.filter((e=>!e[o])),r=e.filter((e=>e[o])),s=t.concat(r),l.listBoxOneData=n,l.listBoxTwoData=s;break;case"transferFrom":s=t.filter((e=>!e[o])),r=t.filter((e=>e[o])),n=e.concat(r),l.listBoxOneData=n,l.listBoxTwoData=s;break;case"transferAllTo":l.listBoxOneData=[],l.listBoxTwoData=t.concat(e);break;case"transferAllFrom":l.listBoxOneData=t.concat(e),l.listBoxTwoData=[];break;case"remove":s=t.filter((e=>!e[o])),n=e.filter((e=>!e[o])),l.listBoxOneData=n,l.listBoxTwoData=s}return l},e.processListBoxDragAndDrop=(e=[],t=[],a,o,n)=>{const r=e.findIndex((e=>e[n]===a[n])),s=t.findIndex((e=>e[n]===a[n])),l=null!==o?e.findIndex((e=>e[n]===o[n])):-1,i=null!==o?t.findIndex((e=>e[n]===o[n])):-1,c=r>=0,d=s>=0,m=l>=0,u=i>=0,f=[...e],p=[...t];return c&&m?{listBoxOneData:b(r,l,e),listBoxTwoData:t}:d&&u?{listBoxOneData:e,listBoxTwoData:b(s,i,t)}:c&&(u||null===o)?(null===o?p.push(e[r]):p.splice(i+1,0,e[r]),f.splice(r,1),{listBoxOneData:f,listBoxTwoData:p}):d&&(m||null===o)?(null===o?f.push(t[s]):f.splice(l+1,0,t[s]),p.splice(s,1),{listBoxOneData:f,listBoxTwoData:p}):{listBoxOneData:e,listBoxTwoData:t}}}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("prop-types"),require("@progress/kendo-react-common"),require("@progress/kendo-react-buttons"),require("@progress/kendo-react-intl"),require("@progress/kendo-svg-icons")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","@progress/kendo-react-common","@progress/kendo-react-buttons","@progress/kendo-react-intl","@progress/kendo-svg-icons"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).KendoReactListbox={},e.React,e.PropTypes,e.KendoReactCommon,e.KendoReactButtons,e.KendoReactIntl,e.KendoSvgIcons)}(this,function(e,t,a,o,n,r,s){"use strict";function l(e){var t=Object.create(null);return e&&Object.keys(e).forEach(function(a){if("default"!==a){var o=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(t,a,o.get?o:{enumerable:!0,get:function(){return e[a]}})}}),t.default=e,Object.freeze(t)}var i=l(t),c=(e=>(e.TOP="top",e.BOTTOM="bottom",e.LEFT="left",e.RIGHT="right",e.NONE="none",e))(c||{});const d=i.forwardRef((e,t)=>{const{id:a,style:n,data:r,textField:s,className:l,valueField:d,selectedField:f,onDrop:u,onKeyDown:p,onDragStart:v,onDragLeave:b,onDragOver:g,onItemClick:x,onItemSelect:h,onKeyboardNavigate:D,size:k=m.size,draggable:y=m.draggable,toolbarPosition:I=m.toolbarPosition}=e,E=i.useRef(null),w=i.useRef(null),T=i.useRef(null),N=i.useCallback(()=>({element:T.current,props:e}),[]);i.useImperativeHandle(w,N),i.useImperativeHandle(t,()=>w.current);const B=a+"-accessibility-id",O=o.kendoThemeMaps.sizeMap[k]||k,K=i.useMemo(()=>new o.Navigation({root:E,selectors:[".k-list-item"],tabIndex:0,keyboardEvents:{keydown:{Space:(e,t,a)=>{const n=t.elements.indexOf(e);a.metaKey&&o.dispatchEvent(h,a,N(),{dataItem:r[n]}),o.dispatchEvent(h,a,N(),{dataItem:r[n]})},ArrowDown:(e,t,a)=>{if(a.metaKey&&a.shiftKey)o.dispatchEvent(D,a,N(),{actionName:"moveDown"});else if(a.metaKey&&!a.shiftKey)a.preventDefault(),t.focusNext(e);else if(!a.shiftKey||a.metaKey){a.preventDefault();const n=t.elements.indexOf(e),s=r[n+1];s&&(o.dispatchEvent(h,a,N(),{dataItem:s}),t.focusNext(e))}},ArrowUp:(e,t,a)=>{if(a.metaKey&&a.shiftKey)o.dispatchEvent(D,a,N(),{actionName:"moveUp"});else if(a.metaKey&&!a.shiftKey)a.preventDefault(),t.focusPrevious(e);else if(!a.shiftKey||a.metaKey){a.preventDefault();const n=t.elements.indexOf(e),s=r[n-1];s&&(o.dispatchEvent(h,a,N(),{dataItem:s}),t.focusPrevious(e))}},ArrowLeft:(e,t,a)=>{a.metaKey&&a.shiftKey?o.dispatchEvent(D,a,N(),{actionName:"transferAllFrom"}):a.metaKey&&o.dispatchEvent(D,a,N(),{actionName:"transferFrom"})},ArrowRight:(e,t,a)=>{a.metaKey&&a.shiftKey?o.dispatchEvent(D,a,N(),{actionName:"transferAllTo"}):a.metaKey&&o.dispatchEvent(D,a,N(),{actionName:"transferTo"})},Backspace:(e,t,a)=>{o.dispatchEvent(D,a,N(),{actionName:"remove"})}}}}),[r]),A=i.useCallback(K.triggerKeyboardEvent.bind(K),[r]);return i.useEffect(()=>(K.initializeRovingTab(),()=>K.removeFocusListener()),[r]),i.createElement("div",{id:a,ref:T,style:n,unselectable:"on",className:o.classNames(l,"k-listbox",{[`k-listbox-${O}`]:k},I===c.NONE||void 0===e.toolbar?`k-listbox-actions-${m.toolbarPosition}`:`k-listbox-actions-${I}`)},e.toolbar&&i.createElement(e.toolbar,null),i.createElement("div",{className:"k-list-scroller k-selectable","data-role":"selectable",ref:E,onDragOver:e=>e.preventDefault(),onDrop:t=>{t.target.classList.contains("k-list-content")&&(e.data.length>0?o.dispatchEvent(e.onDrop,t,N(),{dataItem:e.data[e.data.length-1]}):o.dispatchEvent(e.onDrop,t,N(),{dataItem:null}))},onDragLeave:e=>{b&&e.target.classList.contains("k-list-content")&&o.dispatchEvent(b,e,N(),void 0)},onKeyDown:A},i.createElement("div",{className:o.classNames("k-list",{[`k-list-${O}`]:k})},i.createElement("div",{className:"k-list-content"},i.createElement("ul",{className:"k-list-ul",role:"listbox","aria-label":"listbox-container",onKeyDown:e=>{p&&o.dispatchEvent(p,e,N(),void 0)}},r.map((t,a)=>{const n=(e=>{if(f)return!!e[f]})(t),r={className:o.classNames("k-list-item",{"k-selected":n}),role:"option",key:a,id:B+a,"aria-selected":n,"data-uid":B+a,draggable:y,onDragStart:e=>{o.dispatchEvent(v,e,N(),{dataItem:t})},onDragOver:e=>{e.preventDefault(),o.dispatchEvent(g,e,N(),{dataItem:t})},onDrop:e=>{o.dispatchEvent(u,e,N(),{dataItem:t})},onClick:e=>{o.dispatchEvent(x,e,N(),{dataItem:t})}};return e.item?i.createElement(e.item,{selected:n,dataItem:t,...r,key:r.key},i.createElement("span",{className:"k-list-item-text"},t.name)):i.createElement("li",{...r,key:r.key},i.createElement("span",{className:"k-list-item-text"},(e=>s?e[s]:e.toString())(t)))}))))),i.createElement("select",{style:{display:"none"},multiple:!0,"data-role":"listbox"},r.map((e,t)=>{const a=e[d||s];return i.createElement("option",{key:t,value:a},a)})))}),m={toolbarPosition:c.RIGHT,draggable:!0,size:void 0};d.propTypes={size:a.oneOf(["small","medium","large"]),toolbarPosition:a.oneOf(["none","top","bottom","left","right"]),textField:a.string.isRequired,valueField:a.string,selectedField:a.string,data:a.array.isRequired},d.displayName="ListBoxInner";const f="listbox.moveUp",u="listbox.moveDown",p="listbox.transferTo",v="listbox.transferFrom",b="listbox.transferAllTo",g="listbox.transferAllFrom",x="listbox.remove",h={[f]:"Move Up",[u]:"Move Down",[p]:"Transfer To",[v]:"Transfer From",[b]:"Transfer All To",[g]:"Transfer All From",[x]:"Delete"},D=[{name:"moveUp",iconName:"caret-alt-up",svgIcon:s.caretAltUpIcon},{name:"moveDown",iconName:"caret-alt-down",svgIcon:s.caretAltDownIcon},{name:"transferTo",iconName:"caret-alt-right",svgIcon:s.caretAltRightIcon},{name:"transferFrom",iconName:"caret-alt-left",svgIcon:s.caretAltLeftIcon},{name:"transferAllTo",iconName:"caret-double-alt-right",svgIcon:s.caretDoubleAltRightIcon},{name:"transferAllFrom",iconName:"caret-double-alt-left",svgIcon:s.caretDoubleAltLeftIcon},{name:"remove",iconName:"x",svgIcon:s.xIcon}],k=i.forwardRef((e,t)=>{const{tools:a,dir:l,onToolClick:c,size:d=y.size,data:m=y.data,dataConnected:f=y.dataConnected,selectedField:u=y.selectedField}=e,p=r.useLocalization(),v=i.useRef(null),b=i.useRef(null),g=i.useCallback(()=>({onToolClick:c,props:e,context:{},state:{},refs:{}}),[]);i.useImperativeHandle(b,g),i.useImperativeHandle(t,()=>b.current);const x=(e,t,a)=>{a.preventDefault(),t.focusNext(e)},k=(e,t,a)=>{a.preventDefault(),t.focusPrevious(e)},I=i.useMemo(()=>new o.Navigation({root:v,selectors:[".k-button:not([disabled])"],tabIndex:0,keyboardEvents:{keydown:{ArrowDown:x,ArrowRight:x,ArrowUp:k,ArrowLeft:k,Enter:(e,t,a)=>{e.click(),t.focusElement(t.current,e)}}}}),[]),E=i.useCallback(I.triggerKeyboardEvent.bind(I),[]);i.useEffect(()=>(I.initializeRovingTab(),()=>I.removeFocusListener()),[]);const w=e=>{switch(e.name){case"caret-alt-right":return s.caretAltLeftIcon;case"caret-alt-left":return s.caretAltRightIcon;case"caret-double-alt-right":return s.caretDoubleAltLeftIcon;case"caret-double-alt-left":return s.caretDoubleAltRightIcon}return e},T=e=>{switch(e){case"caret-alt-right":return"caret-alt-left";case"caret-alt-left":return"caret-alt-right";case"caret-double-alt-right":return"caret-double-alt-left";case"caret-double-alt-left":return"caret-double-alt-right"}return e},N="rtl"===l;return i.createElement("div",{className:o.classNames("k-listbox-actions"),ref:v,onKeyDown:E},a&&a.map((e,t)=>{const a=D.findIndex(t=>t.name===e),r=D[a],s=(e=>{let t=!0;const a=u||"selected",o=m.length,n=f.length,r=m.findIndex(e=>!0===e[a])>=0,s=f.findIndex(e=>!0===e[a])>=0;switch(e){case"moveUp":t=r?!(m.length>0)||m[0].selected:!s||!(f.length>0)||f[0].selected;break;case"moveDown":t=r?!m[o-1]||m[o-1].selected:!s||!(f.length>0)||f[n-1].selected;break;case"transferTo":t=!(f&&r);break;case"transferFrom":t=!f||!(f&&s);break;case"transferAllTo":t=!(f&&m.length>0);break;case"transferAllFrom":t=!(f&&f.length>0);break;case"remove":t=!(r||s)}return t})(r.name),l=`listbox.${r.name}`,v=p.toLanguageString(l,h[l]);return i.createElement(n.Button,{size:d,key:t,disabled:s,"data-command":r.name,title:v,"aria-label":v,icon:N?T(r.iconName):r.iconName,svgIcon:N?w(r.svgIcon):r.svgIcon,onClick:e=>{e.preventDefault(),((e,t)=>{o.dispatchEvent(c,e,g(),{toolName:t})})(e,r.name)}})}))}),y={data:[],dataConnected:[],selectedField:"selected",size:void 0};k.propTypes={data:a.array.isRequired,dataConnected:a.array.isRequired,tools:a.array,selectedField:a.string,dir:a.string,size:a.oneOf(["small","medium","large"])},k.displayName="ListBoxToolbarInner";const I=(e,t,a)=>{const o=a.splice(e,1)[0];return a.splice(t,0,o),a},E=o.withIdHOC(d);E.displayName="KendoReactListBox",e.ListBox=E,e.ListBoxToolbar=k,e.moveItem=I,e.processListBoxData=(e=[],t=[],a,o)=>{let n=[],r=[],s=[];const l={listBoxOneData:e,listBoxTwoData:t};switch(a){case"moveUp":n=[...e],n.forEach((e,t)=>{e[o]&&(n=I(t,t-1,n))}),s=[...t],s.forEach((e,t)=>{e[o]&&(s=I(t,t-1,s))}),l.listBoxOneData=n,l.listBoxTwoData=s;break;case"moveDown":n=e.reverse(),n.forEach((e,t)=>{e[o]&&(n=I(t,t-1,n))}),s=t.reverse(),s.forEach((e,t)=>{e[o]&&(s=I(t,t-1,s))}),l.listBoxOneData=[...n].reverse(),l.listBoxTwoData=[...s].reverse();break;case"transferTo":n=e.filter(e=>!e[o]),r=e.filter(e=>e[o]),s=t.concat(r),l.listBoxOneData=n,l.listBoxTwoData=s;break;case"transferFrom":s=t.filter(e=>!e[o]),r=t.filter(e=>e[o]),n=e.concat(r),l.listBoxOneData=n,l.listBoxTwoData=s;break;case"transferAllTo":l.listBoxOneData=[],l.listBoxTwoData=t.concat(e);break;case"transferAllFrom":l.listBoxOneData=t.concat(e),l.listBoxTwoData=[];break;case"remove":s=t.filter(e=>!e[o]),n=e.filter(e=>!e[o]),l.listBoxOneData=n,l.listBoxTwoData=s}return l},e.processListBoxDragAndDrop=(e=[],t=[],a,o,n)=>{const r=e.findIndex(e=>e[n]===a[n]),s=t.findIndex(e=>e[n]===a[n]),l=null!==o?e.findIndex(e=>e[n]===o[n]):-1,i=null!==o?t.findIndex(e=>e[n]===o[n]):-1,c=r>=0,d=s>=0,m=l>=0,f=i>=0,u=[...e],p=[...t];return c&&m?{listBoxOneData:I(r,l,e),listBoxTwoData:t}:d&&f?{listBoxOneData:e,listBoxTwoData:I(s,i,t)}:c&&(f||null===o)?(null===o?p.push(e[r]):p.splice(i+1,0,e[r]),u.splice(r,1),{listBoxOneData:u,listBoxTwoData:p}):d&&(m||null===o)?(null===o?u.push(t[s]):u.splice(l+1,0,t[s]),p.splice(s,1),{listBoxOneData:u,listBoxTwoData:p}):{listBoxOneData:e,listBoxTwoData:t}}});