@progress/kendo-react-dropdowns 9.0.0-develop.8 → 9.0.0

package/MultiSelectTree/MultiSelectTree.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Ze=require("react"),a=require("prop-types"),i=require("@progress/kendo-react-common"),et=require("@progress/kendo-react-popup"),tt=require("@progress/kendo-react-intl"),we=require("@progress/kendo-react-treeview"),nt=require("../package-metadata.js"),ee=require("../common/utils.js"),at=require("../DropDownTree/useDropdownWidth.js"),rt=require("../DropDownTree/ListNoData.js"),m=require("../messages/index.js"),it=require("@progress/kendo-react-labels"),st=require("../MultiSelect/TagList.js"),ot=require("../common/ClearButton.js"),Ie=require("../common/ListFilter.js"),lt=require("../common/AdaptiveMode.js"),ct=require("@progress/kendo-react-layout"),ut=require("../common/constants.js");function dt(h){const b=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(h){for(const n in h)if(n!=="default"){const I=Object.getOwnPropertyDescriptor(h,n);Object.defineProperty(b,n,I.get?I:{enumerable:!0,get:()=>h[n]})}}return b.default=h,Object.freeze(b)}const t=dt(Ze),pt="Please select a value from the list!",{sizeMap:Te,roundedMap:ft}=i.kendoThemeMaps,gt=h=>h.split("_").map(b=>parseInt(b,10)),vt=(h,b)=>{const{validationMessage:n,valid:I,required:T}=h;return{customError:n!==void 0,valid:!!(I!==void 0?I:!T||b),valueMissing:!b}},E={checkField:"checkField",checkIndeterminateField:"checkIndeterminateField",subItemsField:"items",popupSettings:{animate:!0,width:"200px",height:"200px"},size:"medium",rounded:"medium",fillMode:"solid",required:!1,validityStyles:!0},Me=i.createPropsContext(),ce=t.forwardRef((h,b)=>{const n=i.usePropsContext(Me,h);i.validatePackage(nt.packageMetadata);const I=i.useId(),T=n.id||I,{data:B=[],dataItemKey:M,style:L={},placeholder:ue,label:V,name:Ke,validationMessage:W,valid:Re,tags:de,value:g,opened:K,disabled:x,popupSettings:N=E.popupSettings,checkField:pe=E.checkField,checkIndeterminateField:fe=E.checkIndeterminateField,subItemsField:ge=E.subItemsField,size:y=E.size,rounded:A=E.rounded,fillMode:z=E.fillMode,required:ve=E.required,validityStyles:De=E.validityStyles,onOpen:te=i.noop,onClose:_=i.noop}=n,j=i.getTabIndex(n.tabIndex,x),o=t.useRef(null),F=t.useRef(null),R=t.useRef(null),ne=t.useRef(null),H=t.useRef(null),S=t.useRef(null),$=t.useRef(!1),G=t.useRef([]),U=t.useRef(null),[O,qe]=t.useState(),[Ne,me]=t.useState(!1),[d,ae]=t.useState(!1),[re,Oe]=t.useState(),[Pe,Le]=t.useState([]),[he,Ve]=t.useState(""),P=!!(re&&re<=ut.MOBILE_MEDIUM_DEVISE&&n.adaptive),l=K!==void 0?K:Ne,ie=!!(Array.isArray(g)&&g.length),se=vt({validationMessage:W,valid:Re,required:ve},ie),D=i.useRtl(F,n.dir),Ae={width:at.useDropdownWidth(F,E,N,L),...D!==void 0?{direction:D}:{}},Be=t.useCallback(()=>F.current&&F.current.focus(),[]);G.current=de===void 0?(g||[]).map(e=>({text:ee.getItemValue(e,n.textField),data:[e]})):[...de],t.useImperativeHandle(o,()=>({props:n,element:F.current,focus:Be})),t.useImperativeHandle(b,()=>o.current);const We=t.useCallback(()=>{H.current&&H.current.setCustomValidity&&H.current.setCustomValidity(se.valid?"":W===void 0?pt:W)},[W,se]);t.useEffect(We),t.useEffect(()=>{const e=i.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(Xe.bind(void 0));return document!=null&&document.body&&e&&e.observe(document.body),()=>{e&&e.disconnect()}},[]),t.useEffect(()=>{U.current&&l&&U.current.setPosition(U.current._popup)},[g,l]);const w=t.useCallback((e,r,s)=>{if(n.onChange){const k={items:r,operation:s,...e};n.onChange.call(void 0,k)}},[n.onChange]),J=t.useCallback(e=>{if(ee.areSame(e.item,g,M)||!o.current)return;const{item:r,nativeEvent:s,syntheticEvent:k}=e,q={syntheticEvent:k,nativeEvent:s,target:o.current};w(q,[r],"toggle")},[g,M,w]),Q=t.useCallback(e=>{if(!l){if(te){const r={...e};te.call(void 0,r)}K===void 0&&(me(!0),Le(g||[]),P&&setTimeout(()=>{var r;u((r=ne.current)==null?void 0:r.element)},300))}},[l,K,te,P,ne]),v=t.useCallback(e=>{if(l){if(_){const r={...e};_.call(void 0,r)}K===void 0&&me(!1)}},[l,K,_]),C=t.useCallback(e=>{$.current=!0,e(),window.setTimeout(()=>$.current=!1,0)},[]),u=t.useCallback(e=>{e&&C(()=>e.focus())},[C]),ze=t.useCallback(()=>{var e;!d&&l?v({target:o.current}):n.filterable?u((e=R.current)==null?void 0:e.element):u(S.current&&S.current.element)},[d,l,u,v,n.filterable]),_e=t.useCallback(()=>{d&&u(F.current)},[d,u]),je=t.useCallback(e=>{if(!d&&!$.current&&(ae(!0),n.onFocus&&o.current)){const r={syntheticEvent:e,nativeEvent:e.nativeEvent,target:o.current};n.onFocus.call(void 0,r)}},[d,n.onFocus]),He=t.useCallback(e=>{if(d&&!$.current&&o.current){ae(!1);const r={syntheticEvent:e,nativeEvent:e.nativeEvent,target:o.current};if(n.onBlur){const s={...r};n.onBlur.call(void 0,s)}P||v(r)}},[d,n.onBlur,l,K,_]),$e=t.useCallback(()=>{d&&C(i.noop)},[d,C]),Ge=t.useCallback(e=>{if(!e.isDefaultPrevented()&&o.current){ae(!0);const r={syntheticEvent:e,nativeEvent:e.nativeEvent,target:o.current};l||Q(r)}},[l,Q]),Ue=t.useCallback(e=>{var Z,Se;const{keyCode:r,altKey:s}=e,k=S.current&&S.current.element;if(!o.current||e.isDefaultPrevented()&&((Z=R.current)==null?void 0:Z.element)===e.target)return;const q={syntheticEvent:e,nativeEvent:e.nativeEvent,target:o.current};if(g&&g.length>0&&(r===i.Keys.left||r===i.Keys.right||r===i.Keys.home||r===i.Keys.end||r===i.Keys.delete)){const c=G.current;let p=O?c.findIndex(Ye=>ee.matchTags(Ye,O,M)):-1,f;const le=p!==-1;r===i.Keys.left?(le?p=Math.max(0,p-1):p=c.length-1,f=c[p]):r===i.Keys.right?p===c.length-1?f=void 0:le&&(p=Math.min(c.length-1,p+1),f=c[p]):r===i.Keys.home?f=c[0]:r===i.Keys.end?f=c[c.length-1]:r===i.Keys.delete&&le&&w(q,c[p].data,"delete"),f!==O&&qe(f)}if(l)if(r===i.Keys.esc||s&&r===i.Keys.up)e.preventDefault(),v(q);else if(k&&k.querySelector(".k-focus")&&(r===i.Keys.up||r===i.Keys.down||r===i.Keys.left||r===i.Keys.right||r===i.Keys.home||r===i.Keys.end)){if(r===i.Keys.up&&((Se=R.current)!=null&&Se.element)){const c=Array.from(k.querySelectorAll(".k-treeview-item")),p=[...c].reverse().find(f=>!!(f&&f.querySelector(".k-focus")));if(p&&c.indexOf(p)===0)return C(()=>{var f;u((f=R.current)==null?void 0:f.element)})}C(i.noop)}else r===i.Keys.down&&C(()=>{var c;u(((c=R.current)==null?void 0:c.element)||k)});else s&&r===i.Keys.down&&(e.preventDefault(),Q(q))},[l,v,u,C,Q,O,M,g,w]),ye=t.useCallback(e=>{const{keyCode:r,altKey:s}=e;s||r!==i.Keys.up&&r!==i.Keys.down||(e.preventDefault(),C(r===i.Keys.up?()=>{u(F.current)}:()=>{u(S.current&&S.current.element)}))},[u,C]),oe=t.useCallback(e=>{if(!o.current)return;const r={syntheticEvent:e,nativeEvent:e.nativeEvent,target:o.current};w(r,[],"clear"),v(r),e.preventDefault()},[w,v]),Je=t.useCallback((e,r)=>{var s;v({target:o.current}),d||u((s=R.current)==null?void 0:s.element),w({syntheticEvent:r,nativeEvent:r.nativeEvent,target:o.current},e,"delete")},[w,v,u,d]),be=t.useCallback(e=>{if(n.onExpandChange&&o.current){const{item:r,itemHierarchicalIndex:s,nativeEvent:k,syntheticEvent:q}=e,Z={level:gt(s),item:r,nativeEvent:k,syntheticEvent:q,target:o.current};n.onExpandChange.call(void 0,Z)}},[n.onExpandChange]),Ce=t.useCallback(e=>{if(n.onFilterChange&&o.current){const s={filter:{field:n.textField,operator:"contains",value:e.target.value},syntheticEvent:e.syntheticEvent,nativeEvent:e.nativeEvent,target:o.current};n.onFilterChange.call(void 0,s),n.filter===void 0&&Ve(e.target.value)}},[n.onFilterChange,n.filter,n.textField]),ke=t.useCallback(e=>{if(!o.current)return;const r={syntheticEvent:e,nativeEvent:e.nativeEvent,target:o.current};n.onCancel&&n.onCancel.call(void 0,r),v(r),e.preventDefault()},[n.onCancel,v]),Qe=()=>{const e=n.filterable?t.createElement(Ie,{value:n.filter===void 0?he:n.filter,ref:ne,onChange:Ce,onKeyDown:ye,size:y,rounded:A,fillMode:z}):null,r={adaptiveTitle:n.adaptiveTitle,expand:l,onClose:s=>n.onCancel?ke(s):oe(s),windowWidth:re,mobileFilter:e,footer:{cancelText:X.toLanguageString(m.adaptiveModeFooterCancel,m.messages[m.adaptiveModeFooterCancel]),onCancel:s=>n.onCancel?ke(s):oe(s),applyText:X.toLanguageString(m.adaptiveModeFooterApply,m.messages[m.adaptiveModeFooterApply]),onApply:s=>v(s)}};return t.createElement(lt.AdaptiveMode,{...r},t.createElement(ct.ActionSheetContent,{overflowHidden:!0},t.createElement("div",{className:"k-list-container"},t.createElement("div",{className:"k-list k-list-lg"},B.length>0?t.createElement(we.TreeView,{ref:S,tabIndex:j,data:B,focusIdField:M,textField:n.textField,checkField:pe,checkIndeterminateField:fe,expandField:n.expandField,childrenField:ge,expandIcons:!0,onItemClick:J,onCheckChange:J,onExpandChange:be,checkboxes:!0,size:y,item:n.item,dir:D}):t.createElement(Ee,null,X.toLanguageString(m.nodata,m.messages[m.nodata]))))))},Xe=t.useCallback(e=>{for(const r of e)Oe(r.target.clientWidth)},[]),Ee=n.listNoData||rt.ListNoData,X=tt.useLocalization(),Fe=!De||se.valid,Y=P&&l?Pe:G.current,xe=t.createElement(t.Fragment,null,t.createElement("span",{className:i.classNames("k-multiselecttree k-input",n.className,{[`k-input-${Te[y]||y}`]:y,[`k-rounded-${ft[A]||A}`]:A,[`k-input-${z}`]:z,"k-focus":d&&!x,"k-invalid":!Fe,"k-disabled":x,"k-loading":n.loading,"k-required":ve}),tabIndex:j,accessKey:n.accessKey,id:T,style:V?{...L,width:void 0}:L,dir:D,ref:F,onKeyDown:x?void 0:Ue,onMouseDown:$e,onFocus:je,onBlur:He,role:"combobox","aria-haspopup":"tree","aria-expanded":l,"aria-disabled":x,"aria-label":V,"aria-labelledby":n.ariaLabelledBy,"aria-describedby":n.ariaDescribedBy?n.ariaDescribedBy:"tagslist-"+T,"aria-required":n.required,onClick:x?void 0:Ge},t.createElement("div",{id:"tagslist-"+T,className:i.classNames("k-input-values k-chip-list",{[`k-chip-list-${Te[y]||y}`]:y})},Y.length>0&&t.createElement(st,{tag:n.tag,onTagDelete:Je,data:Y,guid:T,focused:O?G.current.find(e=>ee.matchTags(e,O,M)):void 0,size:y})),t.createElement("span",{className:"k-input-inner"},Y.length===0&&t.createElement("span",{className:"k-input-value-text"},ue)),n.loading&&t.createElement(i.IconWrap,{className:"k-input-loading-icon",name:"loading"}),ie&&!x&&Y.length>0&&t.createElement(ot,{onClick:oe}),t.createElement("select",{name:Ke,ref:H,tabIndex:-1,"aria-hidden":!0,title:V,style:{opacity:0,width:1,border:0,zIndex:-1,position:"absolute",left:"50%"}},t.createElement("option",{value:n.valueMap?n.valueMap.call(void 0,g):g})),!P&&t.createElement(et.Popup,{...N,popupClass:i.classNames(N.popupClass,"k-multiselecttree-popup"),className:i.classNames(N.className,{"k-rtl":D==="rtl"}),style:Ae,anchor:N.anchor||F.current,show:l,onOpen:ze,onClose:_e,ref:U},n.filterable&&t.createElement(Ie,{value:n.filter===void 0?he:n.filter,ref:R,onChange:Ce,onKeyDown:ye,tabIndex:j,size:y,rounded:A,fillMode:z,renderListFilterWrapper:!0,renderPrefixSeparator:!0}),B.length>0?t.createElement(we.TreeView,{style:{height:N.height},ref:S,tabIndex:j,data:B,focusIdField:M,textField:n.textField,checkField:pe,checkIndeterminateField:fe,expandField:n.expandField,childrenField:ge,expandIcons:!0,onItemClick:J,onCheckChange:J,onExpandChange:be,checkboxes:!0,size:y,item:n.item,dir:D}):t.createElement(Ee,null,X.toLanguageString(m.nodata,m.messages[m.nodata])))),P&&Qe());return V?t.createElement(it.FloatingLabel,{label:V,editorValue:ie,editorPlaceholder:ue,editorValid:Fe,editorDisabled:x,editorId:T,style:{width:L?L.width:void 0},children:xe,dir:D}):xe}),mt={opened:a.bool,disabled:a.bool,dir:a.string,tabIndex:a.number,accessKey:a.string,data:a.array,value:a.any,valueMap:a.func,placeholder:a.string,dataItemKey:a.string.isRequired,textField:a.string.isRequired,checkField:a.string,checkIndeterminateField:a.string,expandField:a.string,subItemsField:a.string,className:a.string,style:a.object,label:a.string,validationMessage:a.string,validityStyles:a.bool,valid:a.bool,required:a.bool,name:a.string,id:a.string,ariaLabelledBy:a.string,ariaDescribedBy:a.string,filterable:a.bool,filter:a.string,loading:a.bool,tags:a.arrayOf(a.shape({text:a.string,data:a.arrayOf(a.any)})),popupSettings:a.shape({animate:a.oneOfType([a.bool,a.shape({openDuration:a.number,closeDuration:a.number})]),popupClass:a.string,className:a.string,appendTo:a.any,width:a.oneOfType([a.string,a.number]),height:a.oneOfType([a.string,a.number])}),onOpen:a.func,onClose:a.func,onFocus:a.func,onBlur:a.func,onChange:a.func,onFilterChange:a.func,onExpandChange:a.func,onCancel:a.func,item:a.func,listNoData:a.func,adaptiveTitle:a.string,adaptive:a.bool};ce.displayName="KendoReactMultiSelectTree";ce.propTypes=mt;exports.MultiSelectTree=ce;exports.MultiSelectTreePropsContext=Me;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Ze=require("react"),a=require("prop-types"),i=require("@progress/kendo-react-common"),et=require("@progress/kendo-react-popup"),tt=require("@progress/kendo-react-intl"),we=require("@progress/kendo-react-treeview"),nt=require("../package-metadata.js"),ee=require("../common/utils.js"),at=require("../DropDownTree/useDropdownWidth.js"),rt=require("../DropDownTree/ListNoData.js"),m=require("../messages/index.js"),it=require("@progress/kendo-react-labels"),st=require("../MultiSelect/TagList.js"),ot=require("../common/ClearButton.js"),Ie=require("../common/ListFilter.js"),lt=require("../common/AdaptiveMode.js"),ct=require("@progress/kendo-react-layout"),ut=require("../common/constants.js");function dt(h){const b=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(h){for(const n in h)if(n!=="default"){const I=Object.getOwnPropertyDescriptor(h,n);Object.defineProperty(b,n,I.get?I:{enumerable:!0,get:()=>h[n]})}}return b.default=h,Object.freeze(b)}const t=dt(Ze),pt="Please select a value from the list!",{sizeMap:Te,roundedMap:ft}=i.kendoThemeMaps,gt=h=>h.split("_").map(b=>parseInt(b,10)),vt=(h,b)=>{const{validationMessage:n,valid:I,required:T}=h;return{customError:n!==void 0,valid:!!(I!==void 0?I:!T||b),valueMissing:!b}},E={checkField:"checkField",checkIndeterminateField:"checkIndeterminateField",subItemsField:"items",popupSettings:{animate:!0,width:"200px",height:"200px"},size:"medium",rounded:"medium",fillMode:"solid",required:!1,validityStyles:!0},Me=i.createPropsContext(),ce=t.forwardRef((h,b)=>{const n=i.usePropsContext(Me,h);i.validatePackage(nt.packageMetadata);const I=i.useId(),T=n.id||I,{data:B=[],dataItemKey:M,style:L={},placeholder:ue,label:V,name:Ke,validationMessage:W,valid:Re,tags:de,value:g,opened:K,disabled:x,popupSettings:N=E.popupSettings,checkField:pe=E.checkField,checkIndeterminateField:fe=E.checkIndeterminateField,subItemsField:ge=E.subItemsField,size:y=E.size,rounded:A=E.rounded,fillMode:z=E.fillMode,required:ve=E.required,validityStyles:De=E.validityStyles,onOpen:te=i.noop,onClose:_=i.noop}=n,j=i.getTabIndex(n.tabIndex,x),o=t.useRef(null),F=t.useRef(null),R=t.useRef(null),ne=t.useRef(null),H=t.useRef(null),S=t.useRef(null),$=t.useRef(!1),G=t.useRef([]),U=t.useRef(null),[O,qe]=t.useState(),[Ne,me]=t.useState(!1),[d,ae]=t.useState(!1),[re,Oe]=t.useState(),[Pe,Le]=t.useState([]),[he,Ve]=t.useState(""),P=!!(re&&re<=ut.MOBILE_MEDIUM_DEVISE&&n.adaptive),l=K!==void 0?K:Ne,ie=!!(Array.isArray(g)&&g.length),se=vt({validationMessage:W,valid:Re,required:ve},ie),D=i.useRtl(F,n.dir),Ae={width:at.useDropdownWidth(F,E,N,L),...D!==void 0?{direction:D}:{}},Be=t.useCallback(()=>F.current&&F.current.focus(),[]);G.current=de===void 0?(g||[]).map(e=>({text:ee.getItemValue(e,n.textField),data:[e]})):[...de],t.useImperativeHandle(o,()=>({props:n,element:F.current,focus:Be})),t.useImperativeHandle(b,()=>o.current);const We=t.useCallback(()=>{H.current&&H.current.setCustomValidity&&H.current.setCustomValidity(se.valid?"":W===void 0?pt:W)},[W,se]);t.useEffect(We),t.useEffect(()=>{const e=i.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(Xe.bind(void 0));return document!=null&&document.body&&e&&e.observe(document.body),()=>{e&&e.disconnect()}},[]),t.useEffect(()=>{U.current&&l&&U.current.setPosition(U.current.element)},[g,l]);const w=t.useCallback((e,r,s)=>{if(n.onChange){const k={items:r,operation:s,...e};n.onChange.call(void 0,k)}},[n.onChange]),J=t.useCallback(e=>{if(ee.areSame(e.item,g,M)||!o.current)return;const{item:r,nativeEvent:s,syntheticEvent:k}=e,q={syntheticEvent:k,nativeEvent:s,target:o.current};w(q,[r],"toggle")},[g,M,w]),Q=t.useCallback(e=>{if(!l){if(te){const r={...e};te.call(void 0,r)}K===void 0&&(me(!0),Le(g||[]),P&&setTimeout(()=>{var r;u((r=ne.current)==null?void 0:r.element)},300))}},[l,K,te,P,ne]),v=t.useCallback(e=>{if(l){if(_){const r={...e};_.call(void 0,r)}K===void 0&&me(!1)}},[l,K,_]),C=t.useCallback(e=>{$.current=!0,e(),window.setTimeout(()=>$.current=!1,0)},[]),u=t.useCallback(e=>{e&&C(()=>e.focus())},[C]),ze=t.useCallback(()=>{var e;!d&&l?v({target:o.current}):n.filterable?u((e=R.current)==null?void 0:e.element):u(S.current&&S.current.element)},[d,l,u,v,n.filterable]),_e=t.useCallback(()=>{d&&u(F.current)},[d,u]),je=t.useCallback(e=>{if(!d&&!$.current&&(ae(!0),n.onFocus&&o.current)){const r={syntheticEvent:e,nativeEvent:e.nativeEvent,target:o.current};n.onFocus.call(void 0,r)}},[d,n.onFocus]),He=t.useCallback(e=>{if(d&&!$.current&&o.current){ae(!1);const r={syntheticEvent:e,nativeEvent:e.nativeEvent,target:o.current};if(n.onBlur){const s={...r};n.onBlur.call(void 0,s)}P||v(r)}},[d,n.onBlur,l,K,_]),$e=t.useCallback(()=>{d&&C(i.noop)},[d,C]),Ge=t.useCallback(e=>{if(!e.isDefaultPrevented()&&o.current){ae(!0);const r={syntheticEvent:e,nativeEvent:e.nativeEvent,target:o.current};l||Q(r)}},[l,Q]),Ue=t.useCallback(e=>{var Z,Se;const{keyCode:r,altKey:s}=e,k=S.current&&S.current.element;if(!o.current||e.isDefaultPrevented()&&((Z=R.current)==null?void 0:Z.element)===e.target)return;const q={syntheticEvent:e,nativeEvent:e.nativeEvent,target:o.current};if(g&&g.length>0&&(r===i.Keys.left||r===i.Keys.right||r===i.Keys.home||r===i.Keys.end||r===i.Keys.delete)){const c=G.current;let p=O?c.findIndex(Ye=>ee.matchTags(Ye,O,M)):-1,f;const le=p!==-1;r===i.Keys.left?(le?p=Math.max(0,p-1):p=c.length-1,f=c[p]):r===i.Keys.right?p===c.length-1?f=void 0:le&&(p=Math.min(c.length-1,p+1),f=c[p]):r===i.Keys.home?f=c[0]:r===i.Keys.end?f=c[c.length-1]:r===i.Keys.delete&&le&&w(q,c[p].data,"delete"),f!==O&&qe(f)}if(l)if(r===i.Keys.esc||s&&r===i.Keys.up)e.preventDefault(),v(q);else if(k&&k.querySelector(".k-focus")&&(r===i.Keys.up||r===i.Keys.down||r===i.Keys.left||r===i.Keys.right||r===i.Keys.home||r===i.Keys.end)){if(r===i.Keys.up&&((Se=R.current)!=null&&Se.element)){const c=Array.from(k.querySelectorAll(".k-treeview-item")),p=[...c].reverse().find(f=>!!(f&&f.querySelector(".k-focus")));if(p&&c.indexOf(p)===0)return C(()=>{var f;u((f=R.current)==null?void 0:f.element)})}C(i.noop)}else r===i.Keys.down&&C(()=>{var c;u(((c=R.current)==null?void 0:c.element)||k)});else s&&r===i.Keys.down&&(e.preventDefault(),Q(q))},[l,v,u,C,Q,O,M,g,w]),ye=t.useCallback(e=>{const{keyCode:r,altKey:s}=e;s||r!==i.Keys.up&&r!==i.Keys.down||(e.preventDefault(),C(r===i.Keys.up?()=>{u(F.current)}:()=>{u(S.current&&S.current.element)}))},[u,C]),oe=t.useCallback(e=>{if(!o.current)return;const r={syntheticEvent:e,nativeEvent:e.nativeEvent,target:o.current};w(r,[],"clear"),v(r),e.preventDefault()},[w,v]),Je=t.useCallback((e,r)=>{var s;v({target:o.current}),d||u((s=R.current)==null?void 0:s.element),w({syntheticEvent:r,nativeEvent:r.nativeEvent,target:o.current},e,"delete")},[w,v,u,d]),be=t.useCallback(e=>{if(n.onExpandChange&&o.current){const{item:r,itemHierarchicalIndex:s,nativeEvent:k,syntheticEvent:q}=e,Z={level:gt(s),item:r,nativeEvent:k,syntheticEvent:q,target:o.current};n.onExpandChange.call(void 0,Z)}},[n.onExpandChange]),Ce=t.useCallback(e=>{if(n.onFilterChange&&o.current){const s={filter:{field:n.textField,operator:"contains",value:e.target.value},syntheticEvent:e.syntheticEvent,nativeEvent:e.nativeEvent,target:o.current};n.onFilterChange.call(void 0,s),n.filter===void 0&&Ve(e.target.value)}},[n.onFilterChange,n.filter,n.textField]),ke=t.useCallback(e=>{if(!o.current)return;const r={syntheticEvent:e,nativeEvent:e.nativeEvent,target:o.current};n.onCancel&&n.onCancel.call(void 0,r),v(r),e.preventDefault()},[n.onCancel,v]),Qe=()=>{const e=n.filterable?t.createElement(Ie,{value:n.filter===void 0?he:n.filter,ref:ne,onChange:Ce,onKeyDown:ye,size:y,rounded:A,fillMode:z}):null,r={adaptiveTitle:n.adaptiveTitle,expand:l,onClose:s=>n.onCancel?ke(s):oe(s),windowWidth:re,mobileFilter:e,footer:{cancelText:X.toLanguageString(m.adaptiveModeFooterCancel,m.messages[m.adaptiveModeFooterCancel]),onCancel:s=>n.onCancel?ke(s):oe(s),applyText:X.toLanguageString(m.adaptiveModeFooterApply,m.messages[m.adaptiveModeFooterApply]),onApply:s=>v(s)}};return t.createElement(lt.AdaptiveMode,{...r},t.createElement(ct.ActionSheetContent,{overflowHidden:!0},t.createElement("div",{className:"k-list-container"},t.createElement("div",{className:"k-list k-list-lg"},B.length>0?t.createElement(we.TreeView,{ref:S,tabIndex:j,data:B,focusIdField:M,textField:n.textField,checkField:pe,checkIndeterminateField:fe,expandField:n.expandField,childrenField:ge,expandIcons:!0,onItemClick:J,onCheckChange:J,onExpandChange:be,checkboxes:!0,size:y,item:n.item,dir:D}):t.createElement(Ee,null,X.toLanguageString(m.nodata,m.messages[m.nodata]))))))},Xe=t.useCallback(e=>{for(const r of e)Oe(r.target.clientWidth)},[]),Ee=n.listNoData||rt.ListNoData,X=tt.useLocalization(),Fe=!De||se.valid,Y=P&&l?Pe:G.current,xe=t.createElement(t.Fragment,null,t.createElement("span",{className:i.classNames("k-multiselecttree k-input",n.className,{[`k-input-${Te[y]||y}`]:y,[`k-rounded-${ft[A]||A}`]:A,[`k-input-${z}`]:z,"k-focus":d&&!x,"k-invalid":!Fe,"k-disabled":x,"k-loading":n.loading,"k-required":ve}),tabIndex:j,accessKey:n.accessKey,id:T,style:V?{...L,width:void 0}:L,dir:D,ref:F,onKeyDown:x?void 0:Ue,onMouseDown:$e,onFocus:je,onBlur:He,role:"combobox","aria-haspopup":"tree","aria-expanded":l,"aria-disabled":x,"aria-label":V,"aria-labelledby":n.ariaLabelledBy,"aria-describedby":n.ariaDescribedBy?n.ariaDescribedBy:"tagslist-"+T,"aria-required":n.required,onClick:x?void 0:Ge},t.createElement("div",{id:"tagslist-"+T,className:i.classNames("k-input-values k-chip-list",{[`k-chip-list-${Te[y]||y}`]:y})},Y.length>0&&t.createElement(st,{tag:n.tag,onTagDelete:Je,data:Y,guid:T,focused:O?G.current.find(e=>ee.matchTags(e,O,M)):void 0,size:y})),t.createElement("span",{className:"k-input-inner"},Y.length===0&&t.createElement("span",{className:"k-input-value-text"},ue)),n.loading&&t.createElement(i.IconWrap,{className:"k-input-loading-icon",name:"loading"}),ie&&!x&&Y.length>0&&t.createElement(ot,{onClick:oe}),t.createElement("select",{name:Ke,ref:H,tabIndex:-1,"aria-hidden":!0,title:V,style:{opacity:0,width:1,border:0,zIndex:-1,position:"absolute",left:"50%"}},t.createElement("option",{value:n.valueMap?n.valueMap.call(void 0,g):g})),!P&&t.createElement(et.Popup,{...N,popupClass:i.classNames(N.popupClass,"k-multiselecttree-popup"),className:i.classNames(N.className,{"k-rtl":D==="rtl"}),style:Ae,anchor:N.anchor||F.current,show:l,onOpen:ze,onClose:_e,ref:U},n.filterable&&t.createElement(Ie,{value:n.filter===void 0?he:n.filter,ref:R,onChange:Ce,onKeyDown:ye,tabIndex:j,size:y,rounded:A,fillMode:z,renderListFilterWrapper:!0,renderPrefixSeparator:!0}),B.length>0?t.createElement(we.TreeView,{style:{height:N.height},ref:S,tabIndex:j,data:B,focusIdField:M,textField:n.textField,checkField:pe,checkIndeterminateField:fe,expandField:n.expandField,childrenField:ge,expandIcons:!0,onItemClick:J,onCheckChange:J,onExpandChange:be,checkboxes:!0,size:y,item:n.item,dir:D}):t.createElement(Ee,null,X.toLanguageString(m.nodata,m.messages[m.nodata])))),P&&Qe());return V?t.createElement(it.FloatingLabel,{label:V,editorValue:ie,editorPlaceholder:ue,editorValid:Fe,editorDisabled:x,editorId:T,style:{width:L?L.width:void 0},children:xe,dir:D}):xe}),mt={opened:a.bool,disabled:a.bool,dir:a.string,tabIndex:a.number,accessKey:a.string,data:a.array,value:a.any,valueMap:a.func,placeholder:a.string,dataItemKey:a.string.isRequired,textField:a.string.isRequired,checkField:a.string,checkIndeterminateField:a.string,expandField:a.string,subItemsField:a.string,className:a.string,style:a.object,label:a.string,validationMessage:a.string,validityStyles:a.bool,valid:a.bool,required:a.bool,name:a.string,id:a.string,ariaLabelledBy:a.string,ariaDescribedBy:a.string,filterable:a.bool,filter:a.string,loading:a.bool,tags:a.arrayOf(a.shape({text:a.string,data:a.arrayOf(a.any)})),popupSettings:a.shape({animate:a.oneOfType([a.bool,a.shape({openDuration:a.number,closeDuration:a.number})]),popupClass:a.string,className:a.string,appendTo:a.any,width:a.oneOfType([a.string,a.number]),height:a.oneOfType([a.string,a.number])}),onOpen:a.func,onClose:a.func,onFocus:a.func,onBlur:a.func,onChange:a.func,onFilterChange:a.func,onExpandChange:a.func,onCancel:a.func,item:a.func,listNoData:a.func,adaptiveTitle:a.string,adaptive:a.bool};ce.displayName="KendoReactMultiSelectTree";ce.propTypes=mt;exports.MultiSelectTree=ce;exports.MultiSelectTreePropsContext=Me;

package/MultiSelectTree/MultiSelectTree.mjs

@@ -73,20 +73,20 @@ const It = "Please select a value from the list!", { sizeMap: Ne, roundedMap: St
       validityStyles: Be = y.validityStyles,
       onOpen: ae = Z,
       onClose: z = Z
-    } = a, _ = lt(a.tabIndex, E), l = t.useRef(null), C = t.useRef(null), w = t.useRef(null), ie = t.useRef(null), H = t.useRef(null), k = t.useRef(null), $ = t.useRef(!1), G = t.useRef([]), U = t.useRef(null), [N, Ve] = t.useState(), [Ke, he] = t.useState(!1), [d, re] = t.useState(!1), [oe, qe] = t.useState(), [Ae, We] = t.useState([]), [be, ze] = t.useState(""), P = !!(oe && oe <= xt && a.adaptive), s = S !== void 0 ? S : Ke, le = !!(Array.isArray(m) && m.length), se = Tt({ validationMessage: A, valid: Le, required: ve }, le), T = st(C, a.dir), _e = {
+    } = a, H = lt(a.tabIndex, E), l = t.useRef(null), C = t.useRef(null), w = t.useRef(null), ie = t.useRef(null), _ = t.useRef(null), k = t.useRef(null), $ = t.useRef(!1), G = t.useRef([]), U = t.useRef(null), [N, Ve] = t.useState(), [Ke, he] = t.useState(!1), [d, re] = t.useState(!1), [oe, qe] = t.useState(), [Ae, We] = t.useState([]), [be, ze] = t.useState(""), P = !!(oe && oe <= xt && a.adaptive), s = S !== void 0 ? S : Ke, le = !!(Array.isArray(m) && m.length), se = Tt({ validationMessage: A, valid: Le, required: ve }, le), T = st(C, a.dir), He = {
       width: ht(C, y, R, L),
       ...T !== void 0 ? { direction: T } : {}
-    }, He = t.useCallback(() => C.current && C.current.focus(), []);
+    }, _e = t.useCallback(() => C.current && C.current.focus(), []);
     G.current = pe === void 0 ? (m || []).map((e) => ({ text: gt(e, a.textField), data: [e] })) : [...pe], t.useImperativeHandle(l, () => ({
       props: a,
       element: C.current,
-      focus: He
+      focus: _e
     })), t.useImperativeHandle(
       M,
       () => l.current
     );
     const $e = t.useCallback(() => {
-      H.current && H.current.setCustomValidity && H.current.setCustomValidity(
+      _.current && _.current.setCustomValidity && _.current.setCustomValidity(
         se.valid ? "" : A === void 0 ? It : A
       );
     }, [A, se]);
@@ -96,7 +96,7 @@ const It = "Please select a value from the list!", { sizeMap: Ne, roundedMap: St
         e && e.disconnect();
       };
     }, []), t.useEffect(() => {
-      U.current && s && U.current.setPosition(U.current._popup);
+      U.current && s && U.current.setPosition(U.current.element);
     }, [m, s]);
     const F = t.useCallback(
       (e, i, r) => {
@@ -358,7 +358,7 @@ const It = "Please select a value from the list!", { sizeMap: Ne, roundedMap: St
         we,
         {
           ref: k,
-          tabIndex: _,
+          tabIndex: H,
           data: q,
           focusIdField: I,
           textField: a.textField,
@@ -392,7 +392,7 @@ const It = "Please select a value from the list!", { sizeMap: Ne, roundedMap: St
           "k-loading": a.loading,
           "k-required": ve
         }),
-        tabIndex: _,
+        tabIndex: H,
         accessKey: a.accessKey,
         id: x,
         style: B ? { ...L, width: void 0 } : L,
@@ -441,7 +441,7 @@ const It = "Please select a value from the list!", { sizeMap: Ne, roundedMap: St
         "select",
         {
           name: Oe,
-          ref: H,
+          ref: _,
           tabIndex: -1,
           "aria-hidden": !0,
           title: B,
@@ -455,7 +455,7 @@ const It = "Please select a value from the list!", { sizeMap: Ne, roundedMap: St
           ...R,
           popupClass: ee(R.popupClass, "k-multiselecttree-popup"),
           className: ee(R.className, { "k-rtl": T === "rtl" }),
-          style: _e,
+          style: He,
           anchor: R.anchor || C.current,
           show: s,
           onOpen: Ge,
@@ -469,7 +469,7 @@ const It = "Please select a value from the list!", { sizeMap: Ne, roundedMap: St
             ref: w,
             onChange: Ee,
             onKeyDown: ye,
-            tabIndex: _,
+            tabIndex: H,
             size: v,
             rounded: V,
             fillMode: W,
@@ -482,7 +482,7 @@ const It = "Please select a value from the list!", { sizeMap: Ne, roundedMap: St
           {
             style: { height: R.height },
             ref: k,
-            tabIndex: _,
+            tabIndex: H,
             data: q,
             focusIdField: I,
             textField: a.textField,

package/common/DropDownBase.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";const v=require("react"),n=require("prop-types"),y=require("./VirtualScrollStatic.js"),S=require("./Navigation.js"),c=require("./utils.js");function b(l){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(l){for(const e in l)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(l,e);Object.defineProperty(s,e,t.get?t:{enumerable:!0,get:()=>l[e]})}}return s.default=l,Object.freeze(s)}const P=b(v),a=class a{constructor(s){this.wrapper=null,this.list=null,this.vs=new y.VirtualScroll,this.navigation=new S.Navigation,this.handleItemClick=(e,t)=>{const i=this.initState();i.syntheticEvent=t,t.stopPropagation(),this.component.handleItemSelect(e,i),this.togglePopup(i),this.applyState(i)},this.handleFocus=e=>{if(!this.component.state.focused){const t=this.initState();t.data.focused=!0,t.events.push({type:"onFocus"}),t.syntheticEvent=e,this.applyState(t)}},this.filterChanged=(e,t)=>{const{textField:i,filterable:o}=this.component.props;o&&t.events.push({type:"onFilterChange",filter:{field:i,operator:"contains",ignoreCase:!0,value:e}})},this.togglePopup=e=>{const t=this.component.props,i=t.opened!==void 0?t.opened:this.component.state.opened;t.opened===void 0&&(e.data.opened=!i),i?e.events.push({type:"onClose"}):(e.events.push({type:"onOpen"}),this.calculatePopupWidth())},this.pageChange=(e,t)=>{const i=this.initState();i.syntheticEvent=t,this.triggerOnPageChange(i,e.skip,e.take),this.applyState(i)},this.scrollToVirtualItem=(e,t)=>{const i=this.vs;if(e.skip===0)i.reset();else{let o=i.translate;o===0&&(i.calcScrollElementHeight(),o=i.itemHeight*e.skip,i.translateTo(o,!0)),t<0&&o>0&&(o+=i.itemHeight*(e.pageSize/4)),i.container&&(i.container.scrollTop=o),this.scrollToItem(t,!0)}},this.scrollPopupByPageSize=e=>{var p,u,d,g,f,m;const t=this.vs,i=(u=(p=this.list)==null?void 0:p.parentElement)==null?void 0:u.scrollTop,o=t.enabled&&t.itemHeight?t.itemHeight:this.list?this.list.children[0].offsetHeight:0,r=(g=(d=this.list)==null?void 0:d.parentElement)==null?void 0:g.offsetHeight;i!==void 0&&r!==void 0&&((m=(f=this.list)==null?void 0:f.parentElement)==null||m.scroll({top:i+e*Math.floor(r/o)*o}))},this.renderScrollElement=()=>{const e=this.vs;return e.enabled&&P.createElement("div",{ref:t=>e.scrollElement=t,key:"scrollElementKey"})},this.resetGroupStickyHeader=(e,t)=>{e!==t.state.group&&t.setState({...t.state,group:e})},this.listBoxId=s.props.id+"list",this.guid=s.props.id,this.component=s,this.vs.PageChange=this.pageChange}didUpdate(){this.vs.listTransform&&this.vs.list&&(this.vs.list.style.transform=this.vs.listTransform,this.vs.listTransform="")}didMount(){const s=this.component.props,e=s.popupSettings||{},t=s.style||{},i=e.width;let o=s.opened===!0;i===void 0&&this.calculatePopupWidth(),s.dir===void 0&&t.direction===void 0&&(this.calculateDir(),o=!0),o&&this.component.forceUpdate()}calculateDir(){const s=this.component.element;s&&s.ownerDocument&&s.ownerDocument.defaultView&&(this.dirCalculated=s.ownerDocument.defaultView.getComputedStyle(s).direction||void 0)}calculatePopupWidth(){this.wrapper&&(this.popupWidth=this.wrapper.offsetWidth+"px")}scrollToItem(s,e,t){const i=this.list||this.vs.list;if(!i&&!t&&setTimeout(()=>{this.scrollToItem(s,e,!0)},10),s===0&&e&&this.vs.skip===0){this.vs.reset();return}if(i&&s>=0){const o=this.vs,r=o.container||i.parentNode,p=e!==void 0?e:o.enabled;c.scrollToItem(r,i,s,o.translate,p)}}initState(){return{data:{},events:[],syntheticEvent:void 0}}applyState(s){Object.keys(s.data).length>0&&this.component.setState(s.data);const e={syntheticEvent:s.syntheticEvent,nativeEvent:s.syntheticEvent?s.syntheticEvent.nativeEvent:void 0,target:this.component,value:this.component.value};s.events.forEach(t=>{const i=t.type;delete t.type;const o=i&&this.component.props[i];o&&o.call(void 0,{...e,...t})})}triggerOnPageChange(s,e,t){const i=this.component.props.virtual;if(i){const o=Math.min(Math.max(0,e),Math.max(0,i.total-t));o!==i.skip&&s.events.push({type:"onPageChange",page:{skip:o,take:t}})}}triggerPageChangeCornerItems(s,e){const t=this.component.props,{data:i=[],dataItemKey:o,virtual:r}=t,p=t.opened!==void 0?t.opened:this.component.state.opened;s&&r&&this.vs.enabled&&(r.skip>0&&c.areSame(s,i[0],o)?this.triggerOnPageChange(e,r.skip-1,r.pageSize):!p&&r.skip+r.pageSize<r.total&&c.areSame(s,i[i.length-1],o)&&this.triggerOnPageChange(e,r.skip+1,r.pageSize))}getPopupSettings(){return Object.assign({},a.defaultProps.popupSettings,this.component.props.popupSettings)}getAdaptiveAnimation(){const s=this.getPopupSettings();return s.animate!==void 0?s.animate:!0}getGroupedDataModernMode(s,e){const t=[];return s.forEach((i,o)=>{s[o-1]&&i[e]!==s[o-1][e]&&t.push({[e]:i[e]}),t.push(s[o])}),t}};a.basicPropTypes={opened:n.bool,disabled:n.bool,dir:n.string,tabIndex:n.number,accessKey:n.string,data:n.array,textField:n.string,className:n.string,label:n.string,loading:n.bool,popupSettings:n.shape({animate:n.oneOfType([n.bool,n.shape({openDuration:n.number,closeDuration:n.number})]),popupClass:n.string,className:n.string,appendTo:n.any,width:n.oneOfType([n.string,n.number]),height:n.oneOfType([n.string,n.number])}),onOpen:n.func,onClose:n.func,onFocus:n.func,onBlur:n.func,onChange:n.func,itemRender:n.func,listNoDataRender:n.func,focusedItemIndex:n.func,header:n.node,footer:n.node},a.propTypes={...a.basicPropTypes,value:n.any,defaultValue:n.any,filterable:n.bool,filter:n.string,virtual:n.shape({pageSize:n.number.isRequired,skip:n.number.isRequired,total:n.number.isRequired}),onFilterChange:n.func,onPageChange:n.func},a.defaultProps={popupSettings:{height:"200px"},required:!1,validityStyles:!0};let h=a;module.exports=h;
+"use client";"use strict";const v=require("react"),n=require("prop-types"),y=require("./VirtualScrollStatic.js"),S=require("./Navigation.js"),c=require("./utils.js");function b(l){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(l){for(const t in l)if(t!=="default"){const s=Object.getOwnPropertyDescriptor(l,t);Object.defineProperty(e,t,s.get?s:{enumerable:!0,get:()=>l[t]})}}return e.default=l,Object.freeze(e)}const P=b(v),a=class a{constructor(e){this.wrapper=null,this.list=null,this.vs=new y.VirtualScroll,this.navigation=new S.Navigation,this.handleItemClick=(t,s)=>{const i=this.initState();i.syntheticEvent=s,s.stopPropagation(),this.component.handleItemSelect(t,i),this.togglePopup(i),this.applyState(i)},this.handleFocus=t=>{if(!this.component.state.focused){const s=this.initState();s.data.focused=!0,s.events.push({type:"onFocus"}),s.syntheticEvent=t,this.applyState(s)}},this.filterChanged=(t,s)=>{const{textField:i,filterable:o}=this.component.props;o&&s.events.push({type:"onFilterChange",filter:{field:i,operator:"contains",ignoreCase:!0,value:t}})},this.togglePopup=t=>{const s=this.component.props,i=s.opened!==void 0?s.opened:this.component.state.opened;s.opened===void 0&&(t.data.opened=!i),i?t.events.push({type:"onClose"}):(t.events.push({type:"onOpen"}),this.calculatePopupWidth())},this.pageChange=(t,s)=>{const i=this.initState();i.syntheticEvent=s,this.triggerOnPageChange(i,t.skip,t.take),this.applyState(i)},this.scrollToVirtualItem=(t,s)=>{const i=this.vs;if(t.skip===0)i.reset();else{let o=i.translate;o===0&&(i.calcScrollElementHeight(),o=i.itemHeight*t.skip,i.translateTo(o,!0)),s<0&&o>0&&(o+=i.itemHeight*(t.pageSize/4)),i.container&&(i.container.scrollTop=o),this.scrollToItem(s,!0)}},this.scrollPopupByPageSize=t=>{var p,u,d,g,f,m;const s=this.vs,i=(u=(p=this.list)==null?void 0:p.parentElement)==null?void 0:u.scrollTop,o=s.enabled&&s.itemHeight?s.itemHeight:this.list?this.list.children[0].offsetHeight:0,r=(g=(d=this.list)==null?void 0:d.parentElement)==null?void 0:g.offsetHeight;i!==void 0&&r!==void 0&&((m=(f=this.list)==null?void 0:f.parentElement)==null||m.scroll({top:i+t*Math.floor(r/o)*o}))},this.renderScrollElement=()=>{const t=this.vs;return t.enabled&&P.createElement("div",{ref:s=>t.scrollElement=s,key:"scrollElementKey"})},this.resetGroupStickyHeader=(t,s)=>{t!==s.state.group&&s.setState({group:t})},this.listBoxId=e.props.id+"list",this.guid=e.props.id,this.component=e,this.vs.PageChange=this.pageChange}didUpdate(){this.vs.listTransform&&this.vs.list&&(this.vs.list.style.transform=this.vs.listTransform,this.vs.listTransform="")}didMount(){const e=this.component.props,t=e.popupSettings||{},s=e.style||{},i=t.width;let o=e.opened===!0;i===void 0&&this.calculatePopupWidth(),e.dir===void 0&&s.direction===void 0&&(this.calculateDir(),o=!0),o&&this.component.forceUpdate()}calculateDir(){const e=this.component.element;e&&e.ownerDocument&&e.ownerDocument.defaultView&&(this.dirCalculated=e.ownerDocument.defaultView.getComputedStyle(e).direction||void 0)}calculatePopupWidth(){this.wrapper&&(this.popupWidth=this.wrapper.offsetWidth+"px")}scrollToItem(e,t,s){const i=this.list||this.vs.list;if(!i&&!s&&setTimeout(()=>{this.scrollToItem(e,t,!0)},10),e===0&&t&&this.vs.skip===0){this.vs.reset();return}if(i&&e>=0){const o=this.vs,r=o.container||i.parentNode,p=t!==void 0?t:o.enabled;c.scrollToItem(r,i,e,o.translate,p)}}updateComponentArgs(e){for(let t in e)Object.hasOwnProperty.call(e,t)&&(this.component[t]=e[t])}initState(){return{data:{},events:[],syntheticEvent:void 0}}applyState(e){Object.keys(e.data).length>0&&this.component.setState(e.data);const t={syntheticEvent:e.syntheticEvent,nativeEvent:e.syntheticEvent?e.syntheticEvent.nativeEvent:void 0,target:this.component,value:this.component.value};e.events.forEach(s=>{const i=s.type;delete s.type;const o=i&&this.component.props[i];o&&o.call(void 0,{...t,...s})})}triggerOnPageChange(e,t,s){const i=this.component.props.virtual;if(i){const o=Math.min(Math.max(0,t),Math.max(0,i.total-s));o!==i.skip&&e.events.push({type:"onPageChange",page:{skip:o,take:s}})}}triggerPageChangeCornerItems(e,t){const s=this.component.props,{data:i=[],dataItemKey:o,virtual:r}=s,p=s.opened!==void 0?s.opened:this.component.state.opened;e&&r&&this.vs.enabled&&(r.skip>0&&c.areSame(e,i[0],o)?this.triggerOnPageChange(t,r.skip-1,r.pageSize):!p&&r.skip+r.pageSize<r.total&&c.areSame(e,i[i.length-1],o)&&this.triggerOnPageChange(t,r.skip+1,r.pageSize))}getPopupSettings(){return Object.assign({},a.defaultProps.popupSettings,this.component.props.popupSettings)}getAdaptiveAnimation(){const e=this.getPopupSettings();return e.animate!==void 0?e.animate:!0}getGroupedDataModernMode(e,t){const s=[];return e.forEach((i,o)=>{e[o-1]&&i[t]!==e[o-1][t]&&s.push({[t]:i[t]}),s.push(e[o])}),s}};a.basicPropTypes={opened:n.bool,disabled:n.bool,dir:n.string,tabIndex:n.number,accessKey:n.string,data:n.array,textField:n.string,className:n.string,label:n.string,loading:n.bool,popupSettings:n.shape({animate:n.oneOfType([n.bool,n.shape({openDuration:n.number,closeDuration:n.number})]),popupClass:n.string,className:n.string,appendTo:n.any,width:n.oneOfType([n.string,n.number]),height:n.oneOfType([n.string,n.number])}),onOpen:n.func,onClose:n.func,onFocus:n.func,onBlur:n.func,onChange:n.func,itemRender:n.func,listNoDataRender:n.func,focusedItemIndex:n.func,header:n.node,footer:n.node},a.propTypes={...a.basicPropTypes,value:n.any,defaultValue:n.any,filterable:n.bool,filter:n.string,virtual:n.shape({pageSize:n.number.isRequired,skip:n.number.isRequired,total:n.number.isRequired}),onFilterChange:n.func,onPageChange:n.func},a.defaultProps={popupSettings:{height:"200px"},required:!1,validityStyles:!0};let h=a;module.exports=h;

package/common/DropDownBase.mjs

@@ -7,86 +7,90 @@
  */
 "use client";
 import * as m from "react";
-import s from "prop-types";
+import n from "prop-types";
 import { VirtualScroll as v } from "./VirtualScrollStatic.mjs";
 import { Navigation as y } from "./Navigation.mjs";
 import { scrollToItem as S, areSame as g } from "./utils.mjs";
 const a = class a {
-  constructor(n) {
-    this.wrapper = null, this.list = null, this.vs = new v(), this.navigation = new y(), this.handleItemClick = (i, t) => {
-      const e = this.initState();
-      e.syntheticEvent = t, t.stopPropagation(), this.component.handleItemSelect(i, e), this.togglePopup(e), this.applyState(e);
-    }, this.handleFocus = (i) => {
+  constructor(s) {
+    this.wrapper = null, this.list = null, this.vs = new v(), this.navigation = new y(), this.handleItemClick = (t, e) => {
+      const i = this.initState();
+      i.syntheticEvent = e, e.stopPropagation(), this.component.handleItemSelect(t, i), this.togglePopup(i), this.applyState(i);
+    }, this.handleFocus = (t) => {
       if (!this.component.state.focused) {
-        const t = this.initState();
-        t.data.focused = !0, t.events.push({ type: "onFocus" }), t.syntheticEvent = i, this.applyState(t);
+        const e = this.initState();
+        e.data.focused = !0, e.events.push({ type: "onFocus" }), e.syntheticEvent = t, this.applyState(e);
       }
-    }, this.filterChanged = (i, t) => {
-      const { textField: e, filterable: o } = this.component.props;
-      o && t.events.push({
+    }, this.filterChanged = (t, e) => {
+      const { textField: i, filterable: o } = this.component.props;
+      o && e.events.push({
         type: "onFilterChange",
         filter: {
-          field: e,
+          field: i,
           operator: "contains",
           ignoreCase: !0,
-          value: i
+          value: t
         }
       });
-    }, this.togglePopup = (i) => {
-      const t = this.component.props, e = t.opened !== void 0 ? t.opened : this.component.state.opened;
-      t.opened === void 0 && (i.data.opened = !e), e ? i.events.push({ type: "onClose" }) : (i.events.push({ type: "onOpen" }), this.calculatePopupWidth());
-    }, this.pageChange = (i, t) => {
-      const e = this.initState();
-      e.syntheticEvent = t, this.triggerOnPageChange(e, i.skip, i.take), this.applyState(e);
-    }, this.scrollToVirtualItem = (i, t) => {
-      const e = this.vs;
-      if (i.skip === 0)
-        e.reset();
+    }, this.togglePopup = (t) => {
+      const e = this.component.props, i = e.opened !== void 0 ? e.opened : this.component.state.opened;
+      e.opened === void 0 && (t.data.opened = !i), i ? t.events.push({ type: "onClose" }) : (t.events.push({ type: "onOpen" }), this.calculatePopupWidth());
+    }, this.pageChange = (t, e) => {
+      const i = this.initState();
+      i.syntheticEvent = e, this.triggerOnPageChange(i, t.skip, t.take), this.applyState(i);
+    }, this.scrollToVirtualItem = (t, e) => {
+      const i = this.vs;
+      if (t.skip === 0)
+        i.reset();
       else {
-        let o = e.translate;
-        o === 0 && (e.calcScrollElementHeight(), o = e.itemHeight * i.skip, e.translateTo(o, !0)), t < 0 && o > 0 && (o += e.itemHeight * (i.pageSize / 4)), e.container && (e.container.scrollTop = o), this.scrollToItem(t, !0);
+        let o = i.translate;
+        o === 0 && (i.calcScrollElementHeight(), o = i.itemHeight * t.skip, i.translateTo(o, !0)), e < 0 && o > 0 && (o += i.itemHeight * (t.pageSize / 4)), i.container && (i.container.scrollTop = o), this.scrollToItem(e, !0);
       }
-    }, this.scrollPopupByPageSize = (i) => {
+    }, this.scrollPopupByPageSize = (t) => {
       var r, l, h, c, u, d;
-      const t = this.vs, e = (l = (r = this.list) == null ? void 0 : r.parentElement) == null ? void 0 : l.scrollTop, o = t.enabled && t.itemHeight ? t.itemHeight : this.list ? this.list.children[0].offsetHeight : 0, p = (c = (h = this.list) == null ? void 0 : h.parentElement) == null ? void 0 : c.offsetHeight;
-      e !== void 0 && p !== void 0 && ((d = (u = this.list) == null ? void 0 : u.parentElement) == null || d.scroll({
-        top: e + i * Math.floor(p / o) * o
+      const e = this.vs, i = (l = (r = this.list) == null ? void 0 : r.parentElement) == null ? void 0 : l.scrollTop, o = e.enabled && e.itemHeight ? e.itemHeight : this.list ? this.list.children[0].offsetHeight : 0, p = (c = (h = this.list) == null ? void 0 : h.parentElement) == null ? void 0 : c.offsetHeight;
+      i !== void 0 && p !== void 0 && ((d = (u = this.list) == null ? void 0 : u.parentElement) == null || d.scroll({
+        top: i + t * Math.floor(p / o) * o
       }));
     }, this.renderScrollElement = () => {
-      const i = this.vs;
-      return i.enabled && /* @__PURE__ */ m.createElement("div", { ref: (t) => i.scrollElement = t, key: "scrollElementKey" });
-    }, this.resetGroupStickyHeader = (i, t) => {
-      i !== t.state.group && t.setState({ ...t.state, group: i });
-    }, this.listBoxId = n.props.id + "list", this.guid = n.props.id, this.component = n, this.vs.PageChange = this.pageChange;
+      const t = this.vs;
+      return t.enabled && /* @__PURE__ */ m.createElement("div", { ref: (e) => t.scrollElement = e, key: "scrollElementKey" });
+    }, this.resetGroupStickyHeader = (t, e) => {
+      t !== e.state.group && e.setState({ group: t });
+    }, this.listBoxId = s.props.id + "list", this.guid = s.props.id, this.component = s, this.vs.PageChange = this.pageChange;
   }
   didUpdate() {
     this.vs.listTransform && this.vs.list && (this.vs.list.style.transform = this.vs.listTransform, this.vs.listTransform = "");
   }
   didMount() {
-    const n = this.component.props, i = n.popupSettings || {}, t = n.style || {}, e = i.width;
-    let o = n.opened === !0;
-    e === void 0 && this.calculatePopupWidth(), n.dir === void 0 && t.direction === void 0 && (this.calculateDir(), o = !0), o && this.component.forceUpdate();
+    const s = this.component.props, t = s.popupSettings || {}, e = s.style || {}, i = t.width;
+    let o = s.opened === !0;
+    i === void 0 && this.calculatePopupWidth(), s.dir === void 0 && e.direction === void 0 && (this.calculateDir(), o = !0), o && this.component.forceUpdate();
   }
   calculateDir() {
-    const n = this.component.element;
-    n && n.ownerDocument && n.ownerDocument.defaultView && (this.dirCalculated = n.ownerDocument.defaultView.getComputedStyle(n).direction || void 0);
+    const s = this.component.element;
+    s && s.ownerDocument && s.ownerDocument.defaultView && (this.dirCalculated = s.ownerDocument.defaultView.getComputedStyle(s).direction || void 0);
   }
   calculatePopupWidth() {
     this.wrapper && (this.popupWidth = this.wrapper.offsetWidth + "px");
   }
-  scrollToItem(n, i, t) {
-    const e = this.list || this.vs.list;
-    if (!e && !t && setTimeout(() => {
-      this.scrollToItem(n, i, !0);
-    }, 10), n === 0 && i && this.vs.skip === 0) {
+  scrollToItem(s, t, e) {
+    const i = this.list || this.vs.list;
+    if (!i && !e && setTimeout(() => {
+      this.scrollToItem(s, t, !0);
+    }, 10), s === 0 && t && this.vs.skip === 0) {
       this.vs.reset();
       return;
     }
-    if (e && n >= 0) {
-      const o = this.vs, p = o.container || e.parentNode, r = i !== void 0 ? i : o.enabled;
-      S(p, e, n, o.translate, r);
+    if (i && s >= 0) {
+      const o = this.vs, p = o.container || i.parentNode, r = t !== void 0 ? t : o.enabled;
+      S(p, i, s, o.translate, r);
     }
   }
+  updateComponentArgs(s) {
+    for (let t in s)
+      Object.hasOwnProperty.call(s, t) && (this.component[t] = s[t]);
+  }
   initState() {
     return {
       data: {},
@@ -94,100 +98,100 @@ const a = class a {
       syntheticEvent: void 0
     };
   }
-  applyState(n) {
-    Object.keys(n.data).length > 0 && this.component.setState(n.data);
-    const i = {
-      syntheticEvent: n.syntheticEvent,
-      nativeEvent: n.syntheticEvent ? n.syntheticEvent.nativeEvent : void 0,
+  applyState(s) {
+    Object.keys(s.data).length > 0 && this.component.setState(s.data);
+    const t = {
+      syntheticEvent: s.syntheticEvent,
+      nativeEvent: s.syntheticEvent ? s.syntheticEvent.nativeEvent : void 0,
       target: this.component,
       value: this.component.value
     };
-    n.events.forEach((t) => {
-      const e = t.type;
-      delete t.type;
-      const o = e && this.component.props[e];
+    s.events.forEach((e) => {
+      const i = e.type;
+      delete e.type;
+      const o = i && this.component.props[i];
       o && o.call(void 0, {
-        ...i,
-        ...t
+        ...t,
+        ...e
       });
     });
   }
-  triggerOnPageChange(n, i, t) {
-    const e = this.component.props.virtual;
-    if (e) {
-      const o = Math.min(Math.max(0, i), Math.max(0, e.total - t));
-      o !== e.skip && n.events.push({
+  triggerOnPageChange(s, t, e) {
+    const i = this.component.props.virtual;
+    if (i) {
+      const o = Math.min(Math.max(0, t), Math.max(0, i.total - e));
+      o !== i.skip && s.events.push({
         type: "onPageChange",
-        page: { skip: o, take: t }
+        page: { skip: o, take: e }
       });
     }
   }
-  triggerPageChangeCornerItems(n, i) {
-    const t = this.component.props, { data: e = [], dataItemKey: o, virtual: p } = t, r = t.opened !== void 0 ? t.opened : this.component.state.opened;
-    n && p && this.vs.enabled && (p.skip > 0 && g(n, e[0], o) ? this.triggerOnPageChange(i, p.skip - 1, p.pageSize) : !r && p.skip + p.pageSize < p.total && g(n, e[e.length - 1], o) && this.triggerOnPageChange(i, p.skip + 1, p.pageSize));
+  triggerPageChangeCornerItems(s, t) {
+    const e = this.component.props, { data: i = [], dataItemKey: o, virtual: p } = e, r = e.opened !== void 0 ? e.opened : this.component.state.opened;
+    s && p && this.vs.enabled && (p.skip > 0 && g(s, i[0], o) ? this.triggerOnPageChange(t, p.skip - 1, p.pageSize) : !r && p.skip + p.pageSize < p.total && g(s, i[i.length - 1], o) && this.triggerOnPageChange(t, p.skip + 1, p.pageSize));
   }
   getPopupSettings() {
     return Object.assign({}, a.defaultProps.popupSettings, this.component.props.popupSettings);
   }
   getAdaptiveAnimation() {
-    const n = this.getPopupSettings();
-    return n.animate !== void 0 ? n.animate : !0;
+    const s = this.getPopupSettings();
+    return s.animate !== void 0 ? s.animate : !0;
   }
-  getGroupedDataModernMode(n, i) {
-    const t = [];
-    return n.forEach((e, o) => {
-      n[o - 1] && e[i] !== n[o - 1][i] && t.push({ [i]: e[i] }), t.push(n[o]);
-    }), t;
+  getGroupedDataModernMode(s, t) {
+    const e = [];
+    return s.forEach((i, o) => {
+      s[o - 1] && i[t] !== s[o - 1][t] && e.push({ [t]: i[t] }), e.push(s[o]);
+    }), e;
   }
 };
 a.basicPropTypes = {
-  opened: s.bool,
-  disabled: s.bool,
-  dir: s.string,
-  tabIndex: s.number,
-  accessKey: s.string,
-  data: s.array,
-  textField: s.string,
-  className: s.string,
-  label: s.string,
-  loading: s.bool,
-  popupSettings: s.shape({
-    animate: s.oneOfType([
-      s.bool,
-      s.shape({
-        openDuration: s.number,
-        closeDuration: s.number
+  opened: n.bool,
+  disabled: n.bool,
+  dir: n.string,
+  tabIndex: n.number,
+  accessKey: n.string,
+  data: n.array,
+  textField: n.string,
+  className: n.string,
+  label: n.string,
+  loading: n.bool,
+  popupSettings: n.shape({
+    animate: n.oneOfType([
+      n.bool,
+      n.shape({
+        openDuration: n.number,
+        closeDuration: n.number
       })
     ]),
-    popupClass: s.string,
-    className: s.string,
-    appendTo: s.any,
-    width: s.oneOfType([s.string, s.number]),
-    height: s.oneOfType([s.string, s.number])
+    popupClass: n.string,
+    className: n.string,
+    appendTo: n.any,
+    width: n.oneOfType([n.string, n.number]),
+    height: n.oneOfType([n.string, n.number])
   }),
-  onOpen: s.func,
-  onClose: s.func,
-  onFocus: s.func,
-  onBlur: s.func,
-  onChange: s.func,
-  itemRender: s.func,
-  listNoDataRender: s.func,
-  focusedItemIndex: s.func,
-  header: s.node,
-  footer: s.node
+  onOpen: n.func,
+  onClose: n.func,
+  onFocus: n.func,
+  onBlur: n.func,
+  onChange: n.func,
+  itemRender: n.func,
+  listNoDataRender: n.func,
+  focusedItemIndex: n.func,
+  header: n.node,
+  footer: n.node
 }, a.propTypes = {
   ...a.basicPropTypes,
-  value: s.any,
-  defaultValue: s.any,
-  filterable: s.bool,
-  filter: s.string,
-  virtual: s.shape({
-    pageSize: s.number.isRequired,
-    skip: s.number.isRequired,
-    total: s.number.isRequired
+  value: n.any,
+  defaultValue: n.any,
+  filterable: n.bool,
+  filter: n.string,
+  virtual: n.shape({
+    pageSize: n.number.isRequired,
+    skip: n.number.isRequired,
+    total: n.number.isRequired
   }),
-  onFilterChange: s.func,
-  onPageChange: s.func
+  onFilterChange: n.func,
+  onPageChange: n.func
 }, a.defaultProps = {
   popupSettings: {
     height: "200px"

package/common/ListGroupItem.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";const o=require("@progress/kendo-react-common"),d=require("react");function m(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const s=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,s.get?s:{enumerable:!0,get:()=>e[t]})}}return n.default=e,Object.freeze(n)}const l=m(d),p=e=>{const{group:n,virtual:t,render:s,isMultiColumn:r=!1,id:u}=e,a=o.useUnstyled(),c=a&&a.uDropDownsBase,i=l.createElement("li",{id:u,role:"group",className:o.classNames(o.uDropDownsBase.groupLi({c,isMultiColumn:r})),style:r?{boxSizing:"inherit"}:{position:t?"relative":"unset"}},l.createElement("span",{className:s?void 0:o.classNames(o.uDropDownsBase.groupItemText({c,isMultiColumn:r}))},n));return s!==void 0?s.call(void 0,i,e):i};module.exports=p;
+"use client";"use strict";const o=require("@progress/kendo-react-common"),d=require("react");function m(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const s=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,s.get?s:{enumerable:!0,get:()=>e[t]})}}return n.default=e,Object.freeze(n)}const l=m(d),p=e=>{const{group:n,virtual:t,render:s,isMultiColumn:r=!1,id:u}=e,a=o.useUnstyled(),c=a&&a.uDropDownsBase,i=l.createElement("li",{id:u,role:"group",className:o.classNames(o.uDropDownsBase.groupLi({c,isMultiColumn:r})),style:r?{boxSizing:"inherit",position:t?"relative":"unset"}:{position:t?"relative":"unset"}},l.createElement("span",{className:s?void 0:o.classNames(o.uDropDownsBase.groupItemText({c,isMultiColumn:r}))},n));return s!==void 0?s.call(void 0,i,e):i};module.exports=p;

package/common/ListGroupItem.mjs

@@ -6,27 +6,27 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-import { useUnstyled as d, classNames as i, uDropDownsBase as l } from "@progress/kendo-react-common";
-import * as n from "react";
-const g = (t) => {
-  const { group: u, virtual: c, render: e, isMultiColumn: s = !1, id: m } = t, o = d(), r = o && o.uDropDownsBase, a = /* @__PURE__ */ n.createElement(
+import { useUnstyled as d, classNames as a, uDropDownsBase as l } from "@progress/kendo-react-common";
+import * as u from "react";
+const v = (t) => {
+  const { group: c, virtual: o, render: e, isMultiColumn: s = !1, id: m } = t, r = d(), i = r && r.uDropDownsBase, n = /* @__PURE__ */ u.createElement(
     "li",
     {
       id: m,
       role: "group",
-      className: i(l.groupLi({ c: r, isMultiColumn: s })),
-      style: s ? { boxSizing: "inherit" } : { position: c ? "relative" : "unset" }
+      className: a(l.groupLi({ c: i, isMultiColumn: s })),
+      style: s ? { boxSizing: "inherit", position: o ? "relative" : "unset" } : { position: o ? "relative" : "unset" }
     },
-    /* @__PURE__ */ n.createElement(
+    /* @__PURE__ */ u.createElement(
       "span",
       {
-        className: e ? void 0 : i(l.groupItemText({ c: r, isMultiColumn: s }))
+        className: e ? void 0 : a(l.groupItemText({ c: i, isMultiColumn: s }))
       },
-      u
+      c
     )
   );
-  return e !== void 0 ? e.call(void 0, a, t) : a;
+  return e !== void 0 ? e.call(void 0, n, t) : n;
 };
 export {
-  g as default
+  v as default
 };