@progress/kendo-react-dropdowns 9.2.0-develop.2 → 9.2.0-develop.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/AutoComplete/AutoComplete.js +2 -2
- package/AutoComplete/AutoComplete.mjs +282 -219
- package/ComboBox/ComboBox.js +2 -2
- package/ComboBox/ComboBox.mjs +38 -39
- package/DropDownList/DropDownList.js +2 -2
- package/DropDownList/DropDownList.mjs +116 -117
- package/DropDownTree/DropDownTree.js +2 -2
- package/DropDownTree/DropDownTree.mjs +67 -68
- package/DropDownTree/ListNoData.js +1 -1
- package/DropDownTree/ListNoData.mjs +1 -1
- package/DropDownTree/useDropdownWidth.js +1 -1
- package/DropDownTree/useDropdownWidth.mjs +1 -1
- package/LICENSE.md +1 -1
- package/MultiColumnComboBox/MultiColumnComboBox.js +1 -1
- package/MultiColumnComboBox/MultiColumnComboBox.mjs +1 -1
- package/MultiSelect/MultiSelect.js +2 -2
- package/MultiSelect/MultiSelect.mjs +42 -43
- package/MultiSelect/TagList.js +1 -1
- package/MultiSelect/TagList.mjs +1 -1
- package/MultiSelectTree/MultiSelectTree.js +2 -2
- package/MultiSelectTree/MultiSelectTree.mjs +65 -66
- package/MultiSelectTree/utils.js +1 -1
- package/MultiSelectTree/utils.mjs +1 -1
- package/README.md +1 -1
- package/common/AdaptiveMode.js +2 -2
- package/common/AdaptiveMode.mjs +44 -42
- package/common/ClearButton.js +1 -1
- package/common/ClearButton.mjs +1 -1
- package/common/DropDownBase.js +1 -1
- package/common/DropDownBase.mjs +1 -1
- package/common/GroupStickyHeader.js +1 -1
- package/common/GroupStickyHeader.mjs +1 -1
- package/common/List.js +1 -1
- package/common/List.mjs +1 -1
- package/common/ListContainer.js +1 -1
- package/common/ListContainer.mjs +1 -1
- package/common/ListDefaultItem.js +1 -1
- package/common/ListDefaultItem.mjs +1 -1
- package/common/ListFilter.js +1 -1
- package/common/ListFilter.mjs +1 -1
- package/common/ListGroupItem.js +1 -1
- package/common/ListGroupItem.mjs +1 -1
- package/common/ListItem.js +1 -1
- package/common/ListItem.mjs +1 -1
- package/common/MultiColumnList.js +1 -1
- package/common/MultiColumnList.mjs +1 -1
- package/common/Navigation.js +1 -1
- package/common/Navigation.mjs +1 -1
- package/common/SearchBar.js +1 -1
- package/common/SearchBar.mjs +1 -1
- package/common/VirtualScrollStatic.js +1 -1
- package/common/VirtualScrollStatic.mjs +1 -1
- package/common/settings.js +1 -1
- package/common/settings.mjs +1 -1
- package/common/utils.js +1 -1
- package/common/utils.mjs +1 -1
- package/common/withCustomComponent.js +1 -1
- package/common/withCustomComponent.mjs +1 -1
- package/dist/cdn/js/kendo-react-dropdowns.js +2 -2
- package/index.d.mts +31 -2
- package/index.d.ts +31 -2
- package/index.js +1 -1
- package/index.mjs +1 -1
- package/messages/index.js +1 -1
- package/messages/index.mjs +1 -1
- package/package-metadata.js +1 -1
- package/package-metadata.mjs +2 -2
- package/package.json +9 -9
- package/common/constants.js +0 -8
- package/common/constants.mjs +0 -13
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @license
|
|
3
3
|
*-------------------------------------------------------------------------------------------
|
|
4
|
-
* Copyright ©
|
|
4
|
+
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Ge=require("react"),n=require("prop-types"),r=require("@progress/kendo-react-common"),Je=require("@progress/kendo-react-popup"),Qe=require("@progress/kendo-react-intl"),we=require("@progress/kendo-react-treeview"),Xe=require("../package-metadata.js"),U=require("../common/utils.js"),Ye=require("./useDropdownWidth.js"),Ze=require("./ListNoData.js"),h=require("../messages/index.js"),et=require("@progress/kendo-react-labels"),xe=require("../common/ListFilter.js"),tt=require("@progress/kendo-react-buttons"),De=require("@progress/kendo-svg-icons"),nt=require("../common/AdaptiveMode.js"),at=require("@progress/kendo-react-layout"),ot=require("../common/constants.js");function rt(u){const f=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(u){for(const s in u)if(s!=="default"){const o=Object.getOwnPropertyDescriptor(u,s);Object.defineProperty(f,s,o.get?o:{enumerable:!0,get:()=>u[s]})}}return f.default=u,Object.freeze(f)}const t=rt(Ge),{sizeMap:st,roundedMap:it}=r.kendoThemeMaps,lt="Please select a value from the list!",ct=u=>t.createElement("span",{className:"k-input-value-text"},u.children),Ie=u=>u.split("_").map(f=>parseInt(f,10)),ut=(u,f)=>{const{validationMessage:s,valid:o,required:G}=u;return{customError:s!==void 0,valid:!!(o!==void 0?o:!G||f),valueMissing:!f}},oe={selectField:"selected",subItemsField:"items",popupSettings:{animate:!0,width:"200px",height:"200px"},data:[],required:!1,style:{},validityStyles:!0,size:"medium",rounded:"medium",fillMode:"solid"},Fe=r.createPropsContext(),re=t.forwardRef((u,f)=>{r.validatePackage(Xe.packageMetadata);const s=r.usePropsContext(Fe,u),o={...oe,...s},G=r.useId(),se=o.id||G,{data:M,dataItemKey:T,popupSettings:E={},style:P,opened:d,disabled:S,onOpen:N=r.noop,onClose:v=r.noop,placeholder:J,label:O,name:Se,selectField:H,subItemsField:V,validationMessage:_,valid:Re,required:Q,validityStyles:qe}=o,X=r.getTabIndex(o.tabIndex,S),i=t.useRef(null),g=t.useRef(null),R=t.useRef(null),Y=t.useRef(null),j=t.useRef(null),k=t.useRef(null),$=t.useRef(!1),[ie,Ke]=t.useState(void 0),w=o.value!==void 0,b=w?o.value:ie!==void 0?ie:o.defaultValue,L=U.isPresent(b),Z=L?U.getItemValue(b,o.textField):"",ee=ut({validationMessage:_,valid:Re,required:Q},L),Me=t.useCallback(()=>g.current&&g.current.focus(),[]);t.useImperativeHandle(i,()=>({props:o,element:g.current,focus:Me})),t.useImperativeHandle(f,()=>i.current);const x=r.useRtl(g,o.dir),Te={width:Ye.useDropdownWidth(g,oe,{...oe.popupSettings,...E},P),...x!==void 0?{direction:x}:{}},[Pe,le]=t.useState(!1),l=d!==void 0?d:Pe,[p,te]=t.useState(!1),[ne,Ne]=t.useState(),D=!!(ne&&ne<=ot.MOBILE_MEDIUM_DEVISE&&o.adaptive),[ce,Oe]=t.useState(""),Ve=t.useCallback(()=>{j.current&&j.current.setCustomValidity&&j.current.setCustomValidity(ee.valid?"":_===void 0?lt:_)},[_,ee]);t.useEffect(Ve),t.useEffect(()=>{const e=r.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver($e.bind(void 0));return document!=null&&document.body&&e&&e.observe(document.body),()=>{document!=null&&document.body&&e&&e.disconnect()}},[]);const ue=t.useCallback(e=>{if(!l){if(N){const a={...e};N.call(void 0,a)}d===void 0&&le(!0)}},[l,d,N]),I=t.useCallback(e=>{if(l){if(v){const a={...e};v.call(void 0,a)}d===void 0&&(le(!1),D&&setTimeout(()=>{var a;y((a=Y.current)==null?void 0:a.element)},300))}},[l,d,v,D]),Le=t.useCallback(e=>{if(!e.isDefaultPrevented()&&i.current){te(!0);const a={syntheticEvent:e,nativeEvent:e.nativeEvent,target:i.current};(l?I:ue)(a)}},[l,d,N,v]),q=t.useCallback(e=>{$.current=!0,e(),window.setTimeout(()=>$.current=!1,0)},[]),Be=t.useCallback(e=>{var F,ke;const{keyCode:a,altKey:c}=e,m=k.current&&k.current.element;if(!i.current||e.isDefaultPrevented()&&((F=R.current)==null?void 0:F.element)===e.target)return;const K={syntheticEvent:e,nativeEvent:e.nativeEvent,target:i.current};if(l)if(a===r.Keys.esc||c&&a===r.Keys.up)e.preventDefault(),I(K);else if(m&&m.querySelector(".k-focus")&&(a===r.Keys.up||a===r.Keys.down||a===r.Keys.left||a===r.Keys.right||a===r.Keys.home||a===r.Keys.end)){if(a===r.Keys.up&&((ke=R.current)!=null&&ke.element)){const A=Array.from(m.querySelectorAll(".k-treeview-item")),Ce=[...A].reverse().find(z=>!!(z&&z.querySelector(".k-focus")));if(Ce&&A.indexOf(Ce)===0)return q(()=>{var z;y((z=R.current)==null?void 0:z.element)})}q(r.noop)}else a===r.Keys.down&&q(()=>{var A;y(((A=R.current)==null?void 0:A.element)||m)});else c&&a===r.Keys.down?(e.preventDefault(),ue(K)):l||a===r.Keys.esc&&me(e)},[l,d,N,v]),de=t.useCallback(e=>{const{keyCode:a,altKey:c}=e;c||a!==r.Keys.up&&a!==r.Keys.down||(e.preventDefault(),q(a===r.Keys.up?()=>{y(g.current)}:()=>{y(k.current&&k.current.element)}))},[]),y=t.useCallback(e=>{e&&q(()=>e.focus())},[]),We=t.useCallback(()=>{var e;!p&&l&&!d?I({target:i.current}):s.filterable?y((e=R.current)==null?void 0:e.element):y(k.current&&k.current.element)},[v,s.filterable,p,d,l]),Ae=t.useCallback(()=>{p&&y(g.current)},[p]),ze=t.useCallback(e=>{if(!p&&!$.current&&(te(!0),s.onFocus&&i.current)){const a={syntheticEvent:e,nativeEvent:e.nativeEvent,target:i.current};s.onFocus.call(void 0,a)}},[p,s.onFocus]),He=t.useCallback(e=>{if(p&&!$.current&&i.current){te(!1);const a={syntheticEvent:e,nativeEvent:e.nativeEvent,target:i.current};if(s.onBlur){const c={...a};s.onBlur.call(void 0,c)}D||I(a)}},[p,s.onBlur,l,d,v]),_e=t.useCallback(()=>{p&&q(r.noop),D&&setTimeout(()=>{var e;y((e=Y.current)==null?void 0:e.element)},300)},[p,D]),pe=t.useCallback((e,a,c)=>{if(s.onChange){const m={value:a,level:c?Ie(c):[],...e};s.onChange.call(void 0,m)}w||Ke(a)},[s.onChange,w]),fe=t.useCallback(e=>{if(U.areSame(e.item,b,T)||!i.current)return;const{item:a,itemHierarchicalIndex:c,nativeEvent:m,syntheticEvent:K}=e,F={syntheticEvent:K,nativeEvent:m,target:i.current};pe(F,a,c),I(F)},[w,b,s.onChange,T,l,d,v]),me=t.useCallback(e=>{if(!i.current)return;const a={syntheticEvent:e,nativeEvent:e.nativeEvent,target:i.current};pe(a,null),I(a),e.preventDefault()},[w,s.onChange,l,d,v]),ve=t.useCallback(e=>{if(e.syntheticEvent.stopPropagation(),s.onExpandChange&&i.current){const{item:a,itemHierarchicalIndex:c,nativeEvent:m,syntheticEvent:K}=e,F={level:Ie(c),item:a,nativeEvent:m,syntheticEvent:K,target:i.current};s.onExpandChange.call(void 0,F)}},[s.onExpandChange]),ge=t.useCallback(e=>{if(s.onFilterChange&&i.current){const c={filter:{field:s.textField,operator:"contains",value:e.target.value},syntheticEvent:e.syntheticEvent,nativeEvent:e.nativeEvent,target:i.current};s.onFilterChange.call(void 0,c),s.filter===void 0&&Oe(e.target.value)}},[s.onFilterChange,s.filter,s.textField]),je=()=>{const e=o.filterable?t.createElement(xe,{value:o.filter===void 0?ce:o.filter,ref:Y,onChange:ge,onKeyDown:de,size:C,rounded:B,fillMode:W}):null,a={adaptiveTitle:o.adaptiveTitle,expand:l,onClose:c=>I(c),windowWidth:ne,mobileFilter:e};return t.createElement(nt.AdaptiveMode,{...a},t.createElement(at.ActionSheetContent,{overflowHidden:!0},t.createElement("div",{className:"k-list-container"},t.createElement("div",{className:"k-list k-list-lg"},M.length>0?t.createElement(we.TreeView,{ref:k,tabIndex:X,data:be,focusIdField:T,textField:o.textField,selectField:H,expandField:o.expandField,childrenField:V,expandIcons:!0,onItemClick:fe,onExpandChange:ve,size:C,item:o.item,dir:x,animate:E.animate}):t.createElement(ye,null,ae.toLanguageString(h.nodata,h.messages[h.nodata]))))))},$e=t.useCallback(e=>{for(const a of e)Ne(a.target.clientWidth)},[]),be=t.useMemo(()=>w||!L?M:r.mapTree(M,V,e=>r.extendDataItem(e,V,{[H]:U.areSame(e,b,T)})),[M,b,w,L,H,V]),ye=o.listNoData||Ze.ListNoData,Ue=o.valueHolder||ct,ae=Qe.useLocalization(),he=!qe||ee.valid,{size:C,rounded:B,fillMode:W}=o,Ee=t.createElement(t.Fragment,null,t.createElement("span",{className:r.classNames("k-dropdowntree k-picker",o.className,{[`k-picker-${st[C]||C}`]:C,[`k-rounded-${it[B]||B}`]:B,[`k-picker-${W}`]:W,"k-focus":p,"k-invalid":!he,"k-loading":o.loading,"k-required":Q,"k-disabled":o.disabled}),tabIndex:X,accessKey:o.accessKey,id:se,style:O?{...P,width:void 0}:P,dir:x,ref:g,onKeyDown:S?void 0:Be,onMouseDown:_e,onClick:S?void 0:Le,onFocus:ze,onBlur:He,role:"combobox","aria-haspopup":"tree","aria-expanded":l,"aria-disabled":S,"aria-label":O,"aria-labelledby":o.ariaLabelledBy,"aria-describedby":o.ariaDescribedBy,"aria-required":Q},t.createElement("span",{className:"k-input-inner"},(Z||J)&&t.createElement(Ue,{item:b},Z||J)),o.loading&&t.createElement(r.IconWrap,{className:"k-input-loading-icon",name:"loading"}),L&&!S&&t.createElement("span",{onClick:me,className:"k-clear-value",title:ae.toLanguageString(h.clear,h.messages[h.clear]),role:"button",tabIndex:-1,onMouseDown:e=>e.preventDefault()},t.createElement(r.IconWrap,{name:"x",icon:De.xIcon})),t.createElement(tt.Button,{tabIndex:-1,type:"button","aria-label":"select",className:"k-input-button",size:C,fillMode:W,themeColor:"base",rounded:null,icon:"caret-alt-down",svgIcon:De.caretAltDownIcon}),t.createElement("select",{name:Se,ref:j,tabIndex:-1,"aria-hidden":!0,title:O,style:{opacity:0,width:1,border:0,zIndex:-1,position:"absolute",left:"50%"}},t.createElement("option",{value:o.valueMap?o.valueMap.call(void 0,b):b})),!D&&t.createElement(Je.Popup,{...E,className:r.classNames(E.className,{"k-rtl":x==="rtl"}),popupClass:r.classNames(E.popupClass,"k-dropdowntree-popup k-list-container"),style:Te,anchor:E.anchor||g.current,show:l,onOpen:We,onClose:Ae},o.filterable&&t.createElement(xe,{value:o.filter===void 0?ce:o.filter,ref:R,onChange:ge,onKeyDown:de,size:C,rounded:B,fillMode:W,renderListFilterWrapper:!0,renderPrefixSeparator:!0}),M.length>0?t.createElement(we.TreeView,{style:{height:E.height},ref:k,tabIndex:X,data:be,focusIdField:T,textField:o.textField,selectField:H,expandField:o.expandField,childrenField:V,expandIcons:!0,onItemClick:fe,onExpandChange:ve,size:C,item:o.item,dir:x,animate:E.animate}):t.createElement(ye,null,ae.toLanguageString(h.nodata,h.messages[h.nodata])))),D&&je());return O?t.createElement(et.FloatingLabel,{label:O,editorValue:Z,editorPlaceholder:J,editorValid:he,editorDisabled:S,editorId:se,style:{width:P?P.width:void 0},children:Ee,dir:x}):Ee}),dt={opened:n.bool,disabled:n.bool,dir:n.string,tabIndex:n.number,accessKey:n.string,data:n.array,value:n.any,valueMap:n.func,placeholder:n.string,dataItemKey:n.string.isRequired,textField:n.string.isRequired,selectField:n.string,expandField:n.string,subItemsField:n.string,className:n.string,style:n.object,label:n.string,validationMessage:n.string,validityStyles:n.bool,valid:n.bool,required:n.bool,name:n.string,id:n.string,ariaLabelledBy:n.string,ariaDescribedBy:n.string,filterable:n.bool,filter: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,onFilterChange:n.func,onExpandChange:n.func,item:n.func,valueHolder:n.func,listNoData:n.func,adaptiveTitle:n.string,adaptive:n.bool};re.displayName="KendoReactDropDownTree";re.propTypes=dt;exports.DropDownTree=re;exports.DropDownTreePropsContext=Fe;
|
|
8
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Ge=require("react"),n=require("prop-types"),r=require("@progress/kendo-react-common"),Je=require("@progress/kendo-react-popup"),Qe=require("@progress/kendo-react-intl"),we=require("@progress/kendo-react-treeview"),Xe=require("../package-metadata.js"),U=require("../common/utils.js"),Ye=require("./useDropdownWidth.js"),Ze=require("./ListNoData.js"),h=require("../messages/index.js"),et=require("@progress/kendo-react-labels"),xe=require("../common/ListFilter.js"),tt=require("@progress/kendo-react-buttons"),De=require("@progress/kendo-svg-icons"),nt=require("../common/AdaptiveMode.js"),at=require("@progress/kendo-react-layout");function ot(u){const f=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(u){for(const s in u)if(s!=="default"){const o=Object.getOwnPropertyDescriptor(u,s);Object.defineProperty(f,s,o.get?o:{enumerable:!0,get:()=>u[s]})}}return f.default=u,Object.freeze(f)}const t=ot(Ge),{sizeMap:rt,roundedMap:st}=r.kendoThemeMaps,it="Please select a value from the list!",lt=u=>t.createElement("span",{className:"k-input-value-text"},u.children),Ie=u=>u.split("_").map(f=>parseInt(f,10)),ct=(u,f)=>{const{validationMessage:s,valid:o,required:G}=u;return{customError:s!==void 0,valid:!!(o!==void 0?o:!G||f),valueMissing:!f}},oe={selectField:"selected",subItemsField:"items",popupSettings:{animate:!0,width:"200px",height:"200px"},data:[],required:!1,style:{},validityStyles:!0,size:"medium",rounded:"medium",fillMode:"solid"},Fe=r.createPropsContext(),re=t.forwardRef((u,f)=>{r.validatePackage(Xe.packageMetadata);const s=r.usePropsContext(Fe,u),o={...oe,...s},G=r.useId(),se=o.id||G,{data:q,dataItemKey:M,popupSettings:E={},style:P,opened:d,disabled:S,onOpen:N=r.noop,onClose:v=r.noop,placeholder:J,label:O,name:Se,selectField:H,subItemsField:V,validationMessage:_,valid:Re,required:Q,validityStyles:Ke}=o,X=r.getTabIndex(o.tabIndex,S),i=t.useRef(null),g=t.useRef(null),R=t.useRef(null),Y=t.useRef(null),j=t.useRef(null),k=t.useRef(null),$=t.useRef(!1),[ie,Te]=t.useState(void 0),w=o.value!==void 0,b=w?o.value:ie!==void 0?ie:o.defaultValue,L=U.isPresent(b),Z=L?U.getItemValue(b,o.textField):"",ee=ct({validationMessage:_,valid:Re,required:Q},L),qe=t.useCallback(()=>g.current&&g.current.focus(),[]);t.useImperativeHandle(i,()=>({props:o,element:g.current,focus:qe})),t.useImperativeHandle(f,()=>i.current);const x=r.useRtl(g,o.dir),Me={width:Ye.useDropdownWidth(g,oe,{...oe.popupSettings,...E},P),...x!==void 0?{direction:x}:{}},[Pe,le]=t.useState(!1),l=d!==void 0?d:Pe,[p,te]=t.useState(!1),[ne,Ne]=t.useState(),D=!!(ne&&ne<=r.ADAPTIVE_MEDIUM_BREAKPOINT&&o.adaptive),[ce,Oe]=t.useState(""),Ve=t.useCallback(()=>{j.current&&j.current.setCustomValidity&&j.current.setCustomValidity(ee.valid?"":_===void 0?it:_)},[_,ee]);t.useEffect(Ve),t.useEffect(()=>{const e=r.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver($e.bind(void 0));return document!=null&&document.body&&e&&e.observe(document.body),()=>{document!=null&&document.body&&e&&e.disconnect()}},[]);const ue=t.useCallback(e=>{if(!l){if(N){const a={...e};N.call(void 0,a)}d===void 0&&le(!0)}},[l,d,N]),I=t.useCallback(e=>{if(l){if(v){const a={...e};v.call(void 0,a)}d===void 0&&(le(!1),D&&setTimeout(()=>{var a;y((a=Y.current)==null?void 0:a.element)},300))}},[l,d,v,D]),Le=t.useCallback(e=>{if(!e.isDefaultPrevented()&&i.current){te(!0);const a={syntheticEvent:e,nativeEvent:e.nativeEvent,target:i.current};(l?I:ue)(a)}},[l,d,N,v]),K=t.useCallback(e=>{$.current=!0,e(),window.setTimeout(()=>$.current=!1,0)},[]),Ae=t.useCallback(e=>{var F,ke;const{keyCode:a,altKey:c}=e,m=k.current&&k.current.element;if(!i.current||e.isDefaultPrevented()&&((F=R.current)==null?void 0:F.element)===e.target)return;const T={syntheticEvent:e,nativeEvent:e.nativeEvent,target:i.current};if(l)if(a===r.Keys.esc||c&&a===r.Keys.up)e.preventDefault(),I(T);else if(m&&m.querySelector(".k-focus")&&(a===r.Keys.up||a===r.Keys.down||a===r.Keys.left||a===r.Keys.right||a===r.Keys.home||a===r.Keys.end)){if(a===r.Keys.up&&((ke=R.current)!=null&&ke.element)){const W=Array.from(m.querySelectorAll(".k-treeview-item")),Ce=[...W].reverse().find(z=>!!(z&&z.querySelector(".k-focus")));if(Ce&&W.indexOf(Ce)===0)return K(()=>{var z;y((z=R.current)==null?void 0:z.element)})}K(r.noop)}else a===r.Keys.down&&K(()=>{var W;y(((W=R.current)==null?void 0:W.element)||m)});else c&&a===r.Keys.down?(e.preventDefault(),ue(T)):l||a===r.Keys.esc&&me(e)},[l,d,N,v]),de=t.useCallback(e=>{const{keyCode:a,altKey:c}=e;c||a!==r.Keys.up&&a!==r.Keys.down||(e.preventDefault(),K(a===r.Keys.up?()=>{y(g.current)}:()=>{y(k.current&&k.current.element)}))},[]),y=t.useCallback(e=>{e&&K(()=>e.focus())},[]),Be=t.useCallback(()=>{var e;!p&&l&&!d?I({target:i.current}):s.filterable?y((e=R.current)==null?void 0:e.element):y(k.current&&k.current.element)},[v,s.filterable,p,d,l]),We=t.useCallback(()=>{p&&y(g.current)},[p]),ze=t.useCallback(e=>{if(!p&&!$.current&&(te(!0),s.onFocus&&i.current)){const a={syntheticEvent:e,nativeEvent:e.nativeEvent,target:i.current};s.onFocus.call(void 0,a)}},[p,s.onFocus]),He=t.useCallback(e=>{if(p&&!$.current&&i.current){te(!1);const a={syntheticEvent:e,nativeEvent:e.nativeEvent,target:i.current};if(s.onBlur){const c={...a};s.onBlur.call(void 0,c)}D||I(a)}},[p,s.onBlur,l,d,v]),_e=t.useCallback(()=>{p&&K(r.noop),D&&setTimeout(()=>{var e;y((e=Y.current)==null?void 0:e.element)},300)},[p,D]),pe=t.useCallback((e,a,c)=>{if(s.onChange){const m={value:a,level:c?Ie(c):[],...e};s.onChange.call(void 0,m)}w||Te(a)},[s.onChange,w]),fe=t.useCallback(e=>{if(U.areSame(e.item,b,M)||!i.current)return;const{item:a,itemHierarchicalIndex:c,nativeEvent:m,syntheticEvent:T}=e,F={syntheticEvent:T,nativeEvent:m,target:i.current};pe(F,a,c),I(F)},[w,b,s.onChange,M,l,d,v]),me=t.useCallback(e=>{if(!i.current)return;const a={syntheticEvent:e,nativeEvent:e.nativeEvent,target:i.current};pe(a,null),I(a),e.preventDefault()},[w,s.onChange,l,d,v]),ve=t.useCallback(e=>{if(e.syntheticEvent.stopPropagation(),s.onExpandChange&&i.current){const{item:a,itemHierarchicalIndex:c,nativeEvent:m,syntheticEvent:T}=e,F={level:Ie(c),item:a,nativeEvent:m,syntheticEvent:T,target:i.current};s.onExpandChange.call(void 0,F)}},[s.onExpandChange]),ge=t.useCallback(e=>{if(s.onFilterChange&&i.current){const c={filter:{field:s.textField,operator:"contains",value:e.target.value},syntheticEvent:e.syntheticEvent,nativeEvent:e.nativeEvent,target:i.current};s.onFilterChange.call(void 0,c),s.filter===void 0&&Oe(e.target.value)}},[s.onFilterChange,s.filter,s.textField]),je=()=>{const e=o.filterable?t.createElement(xe,{value:o.filter===void 0?ce:o.filter,ref:Y,onChange:ge,onKeyDown:de,size:C,rounded:A,fillMode:B}):null,a={title:o.adaptiveTitle,expand:l,onClose:c=>I(c),windowWidth:ne,mobileFilter:e};return t.createElement(nt.AdaptiveMode,{...a},t.createElement(at.ActionSheetContent,{overflowHidden:!0},t.createElement("div",{className:"k-list-container"},t.createElement("div",{className:"k-list k-list-lg"},q.length>0?t.createElement(we.TreeView,{ref:k,tabIndex:X,data:be,focusIdField:M,textField:o.textField,selectField:H,expandField:o.expandField,childrenField:V,expandIcons:!0,onItemClick:fe,onExpandChange:ve,size:C,item:o.item,dir:x,animate:E.animate}):t.createElement(ye,null,ae.toLanguageString(h.nodata,h.messages[h.nodata]))))))},$e=t.useCallback(e=>{for(const a of e)Ne(a.target.clientWidth)},[]),be=t.useMemo(()=>w||!L?q:r.mapTree(q,V,e=>r.extendDataItem(e,V,{[H]:U.areSame(e,b,M)})),[q,b,w,L,H,V]),ye=o.listNoData||Ze.ListNoData,Ue=o.valueHolder||lt,ae=Qe.useLocalization(),he=!Ke||ee.valid,{size:C,rounded:A,fillMode:B}=o,Ee=t.createElement(t.Fragment,null,t.createElement("span",{className:r.classNames("k-dropdowntree k-picker",o.className,{[`k-picker-${rt[C]||C}`]:C,[`k-rounded-${st[A]||A}`]:A,[`k-picker-${B}`]:B,"k-focus":p,"k-invalid":!he,"k-loading":o.loading,"k-required":Q,"k-disabled":o.disabled}),tabIndex:X,accessKey:o.accessKey,id:se,style:O?{...P,width:void 0}:P,dir:x,ref:g,onKeyDown:S?void 0:Ae,onMouseDown:_e,onClick:S?void 0:Le,onFocus:ze,onBlur:He,role:"combobox","aria-haspopup":"tree","aria-expanded":l,"aria-disabled":S,"aria-label":O,"aria-labelledby":o.ariaLabelledBy,"aria-describedby":o.ariaDescribedBy,"aria-required":Q},t.createElement("span",{className:"k-input-inner"},(Z||J)&&t.createElement(Ue,{item:b},Z||J)),o.loading&&t.createElement(r.IconWrap,{className:"k-input-loading-icon",name:"loading"}),L&&!S&&t.createElement("span",{onClick:me,className:"k-clear-value",title:ae.toLanguageString(h.clear,h.messages[h.clear]),role:"button",tabIndex:-1,onMouseDown:e=>e.preventDefault()},t.createElement(r.IconWrap,{name:"x",icon:De.xIcon})),t.createElement(tt.Button,{tabIndex:-1,type:"button","aria-label":"select",className:"k-input-button",size:C,fillMode:B,themeColor:"base",rounded:null,icon:"caret-alt-down",svgIcon:De.caretAltDownIcon}),t.createElement("select",{name:Se,ref:j,tabIndex:-1,"aria-hidden":!0,title:O,style:{opacity:0,width:1,border:0,zIndex:-1,position:"absolute",left:"50%"}},t.createElement("option",{value:o.valueMap?o.valueMap.call(void 0,b):b})),!D&&t.createElement(Je.Popup,{...E,className:r.classNames(E.className,{"k-rtl":x==="rtl"}),popupClass:r.classNames(E.popupClass,"k-dropdowntree-popup k-list-container"),style:Me,anchor:E.anchor||g.current,show:l,onOpen:Be,onClose:We},o.filterable&&t.createElement(xe,{value:o.filter===void 0?ce:o.filter,ref:R,onChange:ge,onKeyDown:de,size:C,rounded:A,fillMode:B,renderListFilterWrapper:!0,renderPrefixSeparator:!0}),q.length>0?t.createElement(we.TreeView,{style:{height:E.height},ref:k,tabIndex:X,data:be,focusIdField:M,textField:o.textField,selectField:H,expandField:o.expandField,childrenField:V,expandIcons:!0,onItemClick:fe,onExpandChange:ve,size:C,item:o.item,dir:x,animate:E.animate}):t.createElement(ye,null,ae.toLanguageString(h.nodata,h.messages[h.nodata])))),D&&je());return O?t.createElement(et.FloatingLabel,{label:O,editorValue:Z,editorPlaceholder:J,editorValid:he,editorDisabled:S,editorId:se,style:{width:P?P.width:void 0},children:Ee,dir:x}):Ee}),ut={opened:n.bool,disabled:n.bool,dir:n.string,tabIndex:n.number,accessKey:n.string,data:n.array,value:n.any,valueMap:n.func,placeholder:n.string,dataItemKey:n.string.isRequired,textField:n.string.isRequired,selectField:n.string,expandField:n.string,subItemsField:n.string,className:n.string,style:n.object,label:n.string,validationMessage:n.string,validityStyles:n.bool,valid:n.bool,required:n.bool,name:n.string,id:n.string,ariaLabelledBy:n.string,ariaDescribedBy:n.string,filterable:n.bool,filter: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,onFilterChange:n.func,onExpandChange:n.func,item:n.func,valueHolder:n.func,listNoData:n.func,adaptiveTitle:n.string,adaptive:n.bool};re.displayName="KendoReactDropDownTree";re.propTypes=ut;exports.DropDownTree=re;exports.DropDownTreePropsContext=Fe;
|
|
@@ -1,30 +1,29 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @license
|
|
3
3
|
*-------------------------------------------------------------------------------------------
|
|
4
|
-
* Copyright ©
|
|
4
|
+
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
8
|
"use client";
|
|
9
9
|
import * as t from "react";
|
|
10
10
|
import n from "prop-types";
|
|
11
|
-
import { createPropsContext as Xe, validatePackage as Ye, usePropsContext as Ze, useId as et, getTabIndex as tt, useRtl as nt,
|
|
12
|
-
import { Popup as
|
|
13
|
-
import { useLocalization as
|
|
11
|
+
import { createPropsContext as Xe, validatePackage as Ye, usePropsContext as Ze, useId as et, getTabIndex as tt, useRtl as nt, ADAPTIVE_MEDIUM_BREAKPOINT as at, canUseDOM as ot, Keys as c, noop as U, mapTree as rt, extendDataItem as it, classNames as oe, IconWrap as we, kendoThemeMaps as lt } from "@progress/kendo-react-common";
|
|
12
|
+
import { Popup as st } from "@progress/kendo-react-popup";
|
|
13
|
+
import { useLocalization as ct } from "@progress/kendo-react-intl";
|
|
14
14
|
import { TreeView as Fe } from "@progress/kendo-react-treeview";
|
|
15
|
-
import { packageMetadata as
|
|
16
|
-
import { getItemValue as
|
|
17
|
-
import { useDropdownWidth as
|
|
18
|
-
import { ListNoData as
|
|
15
|
+
import { packageMetadata as ut } from "../package-metadata.mjs";
|
|
16
|
+
import { getItemValue as dt, areSame as De, isPresent as pt } from "../common/utils.mjs";
|
|
17
|
+
import { useDropdownWidth as ft } from "./useDropdownWidth.mjs";
|
|
18
|
+
import { ListNoData as mt } from "./ListNoData.mjs";
|
|
19
19
|
import { clear as Ie, messages as re, nodata as j } from "../messages/index.mjs";
|
|
20
|
-
import { FloatingLabel as
|
|
20
|
+
import { FloatingLabel as vt } from "@progress/kendo-react-labels";
|
|
21
21
|
import Se from "../common/ListFilter.mjs";
|
|
22
|
-
import { Button as
|
|
23
|
-
import { xIcon as
|
|
24
|
-
import { AdaptiveMode as
|
|
25
|
-
import { ActionSheetContent as
|
|
26
|
-
|
|
27
|
-
const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the list!", wt = (E) => /* @__PURE__ */ t.createElement("span", { className: "k-input-value-text" }, E.children), Me = (E) => E.split("_").map((D) => parseInt(D, 10)), Ft = (E, D) => {
|
|
22
|
+
import { Button as gt } from "@progress/kendo-react-buttons";
|
|
23
|
+
import { xIcon as bt, caretAltDownIcon as ht } from "@progress/kendo-svg-icons";
|
|
24
|
+
import { AdaptiveMode as yt } from "../common/AdaptiveMode.mjs";
|
|
25
|
+
import { ActionSheetContent as Et } from "@progress/kendo-react-layout";
|
|
26
|
+
const { sizeMap: Ct, roundedMap: kt } = lt, xt = "Please select a value from the list!", wt = (E) => /* @__PURE__ */ t.createElement("span", { className: "k-input-value-text" }, E.children), Me = (E) => E.split("_").map((D) => parseInt(D, 10)), Ft = (E, D) => {
|
|
28
27
|
const { validationMessage: r, valid: o, required: G } = E;
|
|
29
28
|
return {
|
|
30
29
|
customError: r !== void 0,
|
|
@@ -47,49 +46,49 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
|
|
|
47
46
|
rounded: "medium",
|
|
48
47
|
fillMode: "solid"
|
|
49
48
|
}, Dt = Xe(), Re = t.forwardRef((E, D) => {
|
|
50
|
-
Ye(
|
|
49
|
+
Ye(ut);
|
|
51
50
|
const r = Ze(Dt, E), o = {
|
|
52
51
|
...ie,
|
|
53
52
|
...r
|
|
54
53
|
}, G = et(), le = o.id || G, {
|
|
55
54
|
data: T,
|
|
56
|
-
dataItemKey:
|
|
55
|
+
dataItemKey: P,
|
|
57
56
|
popupSettings: b = {},
|
|
58
|
-
style:
|
|
57
|
+
style: N,
|
|
59
58
|
opened: u,
|
|
60
59
|
disabled: I,
|
|
61
60
|
onOpen: V = U,
|
|
62
61
|
onClose: f = U,
|
|
63
62
|
placeholder: J,
|
|
64
|
-
label:
|
|
63
|
+
label: K,
|
|
65
64
|
name: Te,
|
|
66
65
|
selectField: z,
|
|
67
|
-
subItemsField:
|
|
66
|
+
subItemsField: O,
|
|
68
67
|
validationMessage: H,
|
|
69
|
-
valid:
|
|
68
|
+
valid: Pe,
|
|
70
69
|
required: Q,
|
|
71
|
-
validityStyles:
|
|
72
|
-
} = o, X = tt(o.tabIndex, I), i = t.useRef(null), m = t.useRef(null), S = t.useRef(null), Y = t.useRef(null), _ = t.useRef(null), h = t.useRef(null), $ = t.useRef(!1), [se, Ve] = t.useState(void 0), C = o.value !== void 0, v = C ? o.value : se !== void 0 ? se : o.defaultValue,
|
|
70
|
+
validityStyles: Ne
|
|
71
|
+
} = o, X = tt(o.tabIndex, I), i = t.useRef(null), m = t.useRef(null), S = t.useRef(null), Y = t.useRef(null), _ = t.useRef(null), h = t.useRef(null), $ = t.useRef(!1), [se, Ve] = t.useState(void 0), C = o.value !== void 0, v = C ? o.value : se !== void 0 ? se : o.defaultValue, A = pt(v), Z = A ? dt(v, o.textField) : "", ee = Ft({ validationMessage: H, valid: Pe, required: Q }, A), Ke = t.useCallback(() => m.current && m.current.focus(), []);
|
|
73
72
|
t.useImperativeHandle(i, () => ({
|
|
74
73
|
props: o,
|
|
75
74
|
element: m.current,
|
|
76
|
-
focus:
|
|
75
|
+
focus: Ke
|
|
77
76
|
})), t.useImperativeHandle(D, () => i.current);
|
|
78
|
-
const k = nt(m, o.dir),
|
|
79
|
-
width:
|
|
77
|
+
const k = nt(m, o.dir), Oe = {
|
|
78
|
+
width: ft(
|
|
80
79
|
m,
|
|
81
80
|
ie,
|
|
82
81
|
{ ...ie.popupSettings, ...b },
|
|
83
|
-
|
|
82
|
+
N
|
|
84
83
|
),
|
|
85
84
|
...k !== void 0 ? { direction: k } : {}
|
|
86
|
-
}, [
|
|
85
|
+
}, [Ae, ce] = t.useState(!1), l = u !== void 0 ? u : Ae, [d, te] = t.useState(!1), [ne, Be] = t.useState(), x = !!(ne && ne <= at && o.adaptive), [ue, Le] = t.useState(""), We = t.useCallback(() => {
|
|
87
86
|
_.current && _.current.setCustomValidity && _.current.setCustomValidity(
|
|
88
87
|
ee.valid ? "" : H === void 0 ? xt : H
|
|
89
88
|
);
|
|
90
89
|
}, [H, ee]);
|
|
91
|
-
t.useEffect(
|
|
92
|
-
const e =
|
|
90
|
+
t.useEffect(We), t.useEffect(() => {
|
|
91
|
+
const e = ot && window.ResizeObserver && new window.ResizeObserver(Je.bind(void 0));
|
|
93
92
|
return document != null && document.body && e && e.observe(document.body), () => {
|
|
94
93
|
document != null && document.body && e && e.disconnect();
|
|
95
94
|
};
|
|
@@ -119,7 +118,7 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
|
|
|
119
118
|
}
|
|
120
119
|
},
|
|
121
120
|
[l, u, f, x]
|
|
122
|
-
),
|
|
121
|
+
), qe = t.useCallback(
|
|
123
122
|
(e) => {
|
|
124
123
|
if (!e.isDefaultPrevented() && i.current) {
|
|
125
124
|
te(!0);
|
|
@@ -150,18 +149,18 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
|
|
|
150
149
|
e.preventDefault(), w(R);
|
|
151
150
|
else if (p && p.querySelector(".k-focus") && (a === c.up || a === c.down || a === c.left || a === c.right || a === c.home || a === c.end)) {
|
|
152
151
|
if (a === c.up && ((ke = S.current) != null && ke.element)) {
|
|
153
|
-
const
|
|
154
|
-
if (xe &&
|
|
152
|
+
const W = Array.from(p.querySelectorAll(".k-treeview-item")), xe = [...W].reverse().find((q) => !!(q && q.querySelector(".k-focus")));
|
|
153
|
+
if (xe && W.indexOf(xe) === 0)
|
|
155
154
|
return M(() => {
|
|
156
|
-
var
|
|
157
|
-
g((
|
|
155
|
+
var q;
|
|
156
|
+
g((q = S.current) == null ? void 0 : q.element);
|
|
158
157
|
});
|
|
159
158
|
}
|
|
160
159
|
M(U);
|
|
161
160
|
} else
|
|
162
161
|
a === c.down && M(() => {
|
|
163
|
-
var
|
|
164
|
-
g(((
|
|
162
|
+
var W;
|
|
163
|
+
g(((W = S.current) == null ? void 0 : W.element) || p);
|
|
165
164
|
});
|
|
166
165
|
else
|
|
167
166
|
s && a === c.down ? (e.preventDefault(), de(R)) : l || a === c.esc && ve(e);
|
|
@@ -232,7 +231,7 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
|
|
|
232
231
|
[r.onChange, C]
|
|
233
232
|
), me = t.useCallback(
|
|
234
233
|
(e) => {
|
|
235
|
-
if (De(e.item, v,
|
|
234
|
+
if (De(e.item, v, P) || !i.current)
|
|
236
235
|
return;
|
|
237
236
|
const { item: a, itemHierarchicalIndex: s, nativeEvent: p, syntheticEvent: R } = e, F = {
|
|
238
237
|
syntheticEvent: R,
|
|
@@ -241,7 +240,7 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
|
|
|
241
240
|
};
|
|
242
241
|
fe(F, a, s), w(F);
|
|
243
242
|
},
|
|
244
|
-
[C, v, r.onChange,
|
|
243
|
+
[C, v, r.onChange, P, l, u, f]
|
|
245
244
|
), ve = t.useCallback(
|
|
246
245
|
(e) => {
|
|
247
246
|
if (!i.current)
|
|
@@ -281,7 +280,7 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
|
|
|
281
280
|
nativeEvent: e.nativeEvent,
|
|
282
281
|
target: i.current
|
|
283
282
|
};
|
|
284
|
-
r.onFilterChange.call(void 0, s), r.filter === void 0 &&
|
|
283
|
+
r.onFilterChange.call(void 0, s), r.filter === void 0 && Le(e.target.value);
|
|
285
284
|
}
|
|
286
285
|
},
|
|
287
286
|
[r.onFilterChange, r.filter, r.textField]
|
|
@@ -295,26 +294,26 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
|
|
|
295
294
|
onKeyDown: pe,
|
|
296
295
|
size: y,
|
|
297
296
|
rounded: B,
|
|
298
|
-
fillMode:
|
|
297
|
+
fillMode: L
|
|
299
298
|
}
|
|
300
299
|
) : null, a = {
|
|
301
|
-
|
|
300
|
+
title: o.adaptiveTitle,
|
|
302
301
|
expand: l,
|
|
303
302
|
onClose: (s) => w(s),
|
|
304
303
|
windowWidth: ne,
|
|
305
304
|
mobileFilter: e
|
|
306
305
|
};
|
|
307
|
-
return /* @__PURE__ */ t.createElement(
|
|
306
|
+
return /* @__PURE__ */ t.createElement(yt, { ...a }, /* @__PURE__ */ t.createElement(Et, { overflowHidden: !0 }, /* @__PURE__ */ t.createElement("div", { className: "k-list-container" }, /* @__PURE__ */ t.createElement("div", { className: "k-list k-list-lg" }, T.length > 0 ? /* @__PURE__ */ t.createElement(
|
|
308
307
|
Fe,
|
|
309
308
|
{
|
|
310
309
|
ref: h,
|
|
311
310
|
tabIndex: X,
|
|
312
311
|
data: he,
|
|
313
|
-
focusIdField:
|
|
312
|
+
focusIdField: P,
|
|
314
313
|
textField: o.textField,
|
|
315
314
|
selectField: z,
|
|
316
315
|
expandField: o.expandField,
|
|
317
|
-
childrenField:
|
|
316
|
+
childrenField: O,
|
|
318
317
|
expandIcons: !0,
|
|
319
318
|
onItemClick: me,
|
|
320
319
|
onExpandChange: ge,
|
|
@@ -327,17 +326,17 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
|
|
|
327
326
|
}, Je = t.useCallback((e) => {
|
|
328
327
|
for (const a of e)
|
|
329
328
|
Be(a.target.clientWidth);
|
|
330
|
-
}, []), he = t.useMemo(() => C || !
|
|
329
|
+
}, []), he = t.useMemo(() => C || !A ? T : rt(
|
|
331
330
|
T,
|
|
332
|
-
|
|
333
|
-
(e) =>
|
|
334
|
-
), [T, v, C,
|
|
331
|
+
O,
|
|
332
|
+
(e) => it(e, O, { [z]: De(e, v, P) })
|
|
333
|
+
), [T, v, C, A, z, O]), ye = o.listNoData || mt, Qe = o.valueHolder || wt, ae = ct(), Ee = !Ne || ee.valid, { size: y, rounded: B, fillMode: L } = o, Ce = /* @__PURE__ */ t.createElement(t.Fragment, null, /* @__PURE__ */ t.createElement(
|
|
335
334
|
"span",
|
|
336
335
|
{
|
|
337
336
|
className: oe("k-dropdowntree k-picker", o.className, {
|
|
338
337
|
[`k-picker-${Ct[y] || y}`]: y,
|
|
339
338
|
[`k-rounded-${kt[B] || B}`]: B,
|
|
340
|
-
[`k-picker-${
|
|
339
|
+
[`k-picker-${L}`]: L,
|
|
341
340
|
"k-focus": d,
|
|
342
341
|
"k-invalid": !Ee,
|
|
343
342
|
"k-loading": o.loading,
|
|
@@ -347,26 +346,26 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
|
|
|
347
346
|
tabIndex: X,
|
|
348
347
|
accessKey: o.accessKey,
|
|
349
348
|
id: le,
|
|
350
|
-
style:
|
|
349
|
+
style: K ? { ...N, width: void 0 } : N,
|
|
351
350
|
dir: k,
|
|
352
351
|
ref: m,
|
|
353
352
|
onKeyDown: I ? void 0 : ze,
|
|
354
353
|
onMouseDown: je,
|
|
355
|
-
onClick: I ? void 0 :
|
|
354
|
+
onClick: I ? void 0 : qe,
|
|
356
355
|
onFocus: $e,
|
|
357
356
|
onBlur: Ue,
|
|
358
357
|
role: "combobox",
|
|
359
358
|
"aria-haspopup": "tree",
|
|
360
359
|
"aria-expanded": l,
|
|
361
360
|
"aria-disabled": I,
|
|
362
|
-
"aria-label":
|
|
361
|
+
"aria-label": K,
|
|
363
362
|
"aria-labelledby": o.ariaLabelledBy,
|
|
364
363
|
"aria-describedby": o.ariaDescribedBy,
|
|
365
364
|
"aria-required": Q
|
|
366
365
|
},
|
|
367
366
|
/* @__PURE__ */ t.createElement("span", { className: "k-input-inner" }, (Z || J) && /* @__PURE__ */ t.createElement(Qe, { item: v }, Z || J)),
|
|
368
367
|
o.loading && /* @__PURE__ */ t.createElement(we, { className: "k-input-loading-icon", name: "loading" }),
|
|
369
|
-
|
|
368
|
+
A && !I && /* @__PURE__ */ t.createElement(
|
|
370
369
|
"span",
|
|
371
370
|
{
|
|
372
371
|
onClick: ve,
|
|
@@ -376,21 +375,21 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
|
|
|
376
375
|
tabIndex: -1,
|
|
377
376
|
onMouseDown: (e) => e.preventDefault()
|
|
378
377
|
},
|
|
379
|
-
/* @__PURE__ */ t.createElement(we, { name: "x", icon:
|
|
378
|
+
/* @__PURE__ */ t.createElement(we, { name: "x", icon: bt })
|
|
380
379
|
),
|
|
381
380
|
/* @__PURE__ */ t.createElement(
|
|
382
|
-
|
|
381
|
+
gt,
|
|
383
382
|
{
|
|
384
383
|
tabIndex: -1,
|
|
385
384
|
type: "button",
|
|
386
385
|
"aria-label": "select",
|
|
387
386
|
className: "k-input-button",
|
|
388
387
|
size: y,
|
|
389
|
-
fillMode:
|
|
388
|
+
fillMode: L,
|
|
390
389
|
themeColor: "base",
|
|
391
390
|
rounded: null,
|
|
392
391
|
icon: "caret-alt-down",
|
|
393
|
-
svgIcon:
|
|
392
|
+
svgIcon: ht
|
|
394
393
|
}
|
|
395
394
|
),
|
|
396
395
|
/* @__PURE__ */ t.createElement(
|
|
@@ -400,18 +399,18 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
|
|
|
400
399
|
ref: _,
|
|
401
400
|
tabIndex: -1,
|
|
402
401
|
"aria-hidden": !0,
|
|
403
|
-
title:
|
|
402
|
+
title: K,
|
|
404
403
|
style: { opacity: 0, width: 1, border: 0, zIndex: -1, position: "absolute", left: "50%" }
|
|
405
404
|
},
|
|
406
405
|
/* @__PURE__ */ t.createElement("option", { value: o.valueMap ? o.valueMap.call(void 0, v) : v })
|
|
407
406
|
),
|
|
408
407
|
!x && /* @__PURE__ */ t.createElement(
|
|
409
|
-
|
|
408
|
+
st,
|
|
410
409
|
{
|
|
411
410
|
...b,
|
|
412
411
|
className: oe(b.className, { "k-rtl": k === "rtl" }),
|
|
413
412
|
popupClass: oe(b.popupClass, "k-dropdowntree-popup k-list-container"),
|
|
414
|
-
style:
|
|
413
|
+
style: Oe,
|
|
415
414
|
anchor: b.anchor || m.current,
|
|
416
415
|
show: l,
|
|
417
416
|
onOpen: He,
|
|
@@ -426,7 +425,7 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
|
|
|
426
425
|
onKeyDown: pe,
|
|
427
426
|
size: y,
|
|
428
427
|
rounded: B,
|
|
429
|
-
fillMode:
|
|
428
|
+
fillMode: L,
|
|
430
429
|
renderListFilterWrapper: !0,
|
|
431
430
|
renderPrefixSeparator: !0
|
|
432
431
|
}
|
|
@@ -438,11 +437,11 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
|
|
|
438
437
|
ref: h,
|
|
439
438
|
tabIndex: X,
|
|
440
439
|
data: he,
|
|
441
|
-
focusIdField:
|
|
440
|
+
focusIdField: P,
|
|
442
441
|
textField: o.textField,
|
|
443
442
|
selectField: z,
|
|
444
443
|
expandField: o.expandField,
|
|
445
|
-
childrenField:
|
|
444
|
+
childrenField: O,
|
|
446
445
|
expandIcons: !0,
|
|
447
446
|
onItemClick: me,
|
|
448
447
|
onExpandChange: ge,
|
|
@@ -454,16 +453,16 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
|
|
|
454
453
|
) : /* @__PURE__ */ t.createElement(ye, null, ae.toLanguageString(j, re[j]))
|
|
455
454
|
)
|
|
456
455
|
), x && Ge());
|
|
457
|
-
return
|
|
458
|
-
|
|
456
|
+
return K ? /* @__PURE__ */ t.createElement(
|
|
457
|
+
vt,
|
|
459
458
|
{
|
|
460
|
-
label:
|
|
459
|
+
label: K,
|
|
461
460
|
editorValue: Z,
|
|
462
461
|
editorPlaceholder: J,
|
|
463
462
|
editorValid: Ee,
|
|
464
463
|
editorDisabled: I,
|
|
465
464
|
editorId: le,
|
|
466
|
-
style: { width:
|
|
465
|
+
style: { width: N ? N.width : void 0 },
|
|
467
466
|
children: Ce,
|
|
468
467
|
dir: k
|
|
469
468
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @license
|
|
3
3
|
*-------------------------------------------------------------------------------------------
|
|
4
|
-
* Copyright ©
|
|
4
|
+
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @license
|
|
3
3
|
*-------------------------------------------------------------------------------------------
|
|
4
|
-
* Copyright ©
|
|
4
|
+
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @license
|
|
3
3
|
*-------------------------------------------------------------------------------------------
|
|
4
|
-
* Copyright ©
|
|
4
|
+
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @license
|
|
3
3
|
*-------------------------------------------------------------------------------------------
|
|
4
|
-
* Copyright ©
|
|
4
|
+
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
package/LICENSE.md
CHANGED
|
@@ -8,4 +8,4 @@ This is commercial software. To use it, you need to agree to the [**End User Lic
|
|
|
8
8
|
|
|
9
9
|
All available KendoReact commercial licenses may be obtained at the [KendoReact website](https://www.telerik.com/kendo-react-ui/pricing).
|
|
10
10
|
|
|
11
|
-
*Copyright ©
|
|
11
|
+
*Copyright © 2025 Progress Software Corporation and/or its subsidiaries or affiliates. All Rights Reserved.*
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @license
|
|
3
3
|
*-------------------------------------------------------------------------------------------
|
|
4
|
-
* Copyright ©
|
|
4
|
+
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @license
|
|
3
3
|
*-------------------------------------------------------------------------------------------
|
|
4
|
-
* Copyright ©
|
|
4
|
+
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @license
|
|
3
3
|
*-------------------------------------------------------------------------------------------
|
|
4
|
-
* Copyright ©
|
|
4
|
+
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const $=require("react"),v=require("prop-types"),h=require("@progress/kendo-react-common"),W=require("@progress/kendo-svg-icons"),U=require("@progress/kendo-react-labels"),j=require("../common/ListContainer.js"),G=require("../common/List.js"),Y=require("../common/GroupStickyHeader.js"),J=require("./TagList.js"),Q=require("../common/SearchBar.js"),K=require("../common/DropDownBase.js"),D=require("../common/settings.js"),g=require("../common/utils.js"),X=require("../package-metadata.js"),Z=require("../common/ClearButton.js"),ee=require("../common/AdaptiveMode.js"),te=require("@progress/kendo-react-layout"),se=require("../common/constants.js"),ie=require("@progress/kendo-react-intl"),C=require("../messages/index.js"),oe=require("../common/ListFilter.js"),E=require("../common/withCustomComponent.js");function ae(I){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(I){for(const t in I)if(t!=="default"){const e=Object.getOwnPropertyDescriptor(I,t);Object.defineProperty(n,t,e.get?e:{enumerable:!0,get:()=>I[t]})}}return n.default=I,Object.freeze(n)}const f=ae($),{sizeMap:w,roundedMap:ne}=h.kendoThemeMaps,le="Please enter a valid value!",P=I=>I.preventDefault(),_=I=>I===2,b=class b extends f.Component{constructor(n){super(n),this.state={activedescendant:D.ActiveDescendant.PopupList,currentValue:[]},this._element=null,this._valueItemsDuringOnChange=null,this.base=new K(this),this._tags=[],this._input=null,this._adaptiveInput=null,this._skipFocusEvent=!1,this._lastSelectedOrDeslectedItemIndex=null,this.itemHeight=0,this.scrollToFocused=!1,this.localization=null,this.focus=()=>{this._input&&this._input.focus()},this.handleItemSelect=(t,e)=>{const{dataItemKey:o,virtual:s}=this.props,a=g.getFilteredData(this.props),p=s?s.skip:0,u=a[t-p],r=this.value.findIndex(m=>g.areSame(m,u,o));this._lastSelectedOrDeslectedItemIndex=a.findIndex(m=>g.areSame(m,u,o));let i=[];r!==-1?(i=this.value,i.splice(r,1)):i=[...this.value,u],(this.props.filter!==void 0?this.props.filter:this.state.text)&&!this.mobileMode&&(this.state.text&&(e.data.text=""),this.base.filterChanged("",e)),this._adaptiveInput&&this._adaptiveInput.blur(),this.state.focusedIndex!==void 0&&(e.data.focusedIndex=void 0),this.triggerOnChange(i,e),this.base.triggerPageChangeCornerItems(u,e)},this.onTagDelete=(t,e)=>{const o=this.base.initState();o.syntheticEvent=e,this.opened&&this.base.togglePopup(o),!this.state.focused&&!this.mobileMode&&(o.data.focused=!0,this.focus());const s=this.value;g.removeDataItems(s,t,this.props.dataItemKey),this.triggerOnChange(s,o),this.applyState(o)},this.itemFocus=(t,e)=>{const{allowCustom:o,virtual:s}=this.props,a=g.getFilteredData(this.props),p=s?s.skip:0,u=this.props.filter!==void 0?this.props.filter:this.state.text,{focusedIndex:r}=this.getFocusedState(),i=o&&u,l=a[t-p];l&&r!==t?this.state.focusedIndex!==t&&(e.data.focusedIndex=t,e.data.activedescendant=D.ActiveDescendant.PopupList):i&&t===-1&&this.state.focusedIndex!==void 0&&(e.data.focusedIndex=void 0),this.base.triggerPageChangeCornerItems(l,e)},this.componentRef=t=>{this._element=t,this.base.wrapper=t},this.searchbarRef=t=>{const e=this._input=t&&t.input;e&&this.state.focused&&window.setTimeout(()=>e.focus(),0)},this.onChangeHandler=t=>{const e=this.base.initState(),o=t.target.value;e.syntheticEvent=t,this.props.filter===void 0&&(e.data.text=o),e.data.focusedIndex=void 0,this.opened||(this.base.togglePopup(e),this.setState({currentValue:this.value})),this.base.filterChanged(o,e),this.applyState(e),this.setState({group:void 0})},this.clearButtonClick=t=>{const e=this.base.initState();e.syntheticEvent=t,t.stopPropagation(),this.value.length>0&&this.triggerOnChange([],e),this.state.focusedIndex!==void 0&&(e.data.focusedIndex=void 0),this.opened&&this.base.togglePopup(e);const o=this.props.filter!==void 0?this.props.filter:this.state.text;g.isPresent(o)&&o!==""&&this.base.filterChanged("",e),this.state.text&&(e.data.text=""),this._lastSelectedOrDeslectedItemIndex=null,this.applyState(e)},this.onInputKeyDown=t=>{const{textField:e,groupField:o}=this.props,s=g.getFilteredData(this.props),a=t.keyCode,p=this.props.filter!==void 0?this.props.filter:this.state.text,u=this.props.opened!==void 0?this.props.opened:this.state.opened,{focusedItem:r,focusedIndex:i}=this.getFocusedState(),l=this.base.initState();if(l.syntheticEvent=t,!p&&this.value.length>0&&(a===h.Keys.left||a===h.Keys.right||a===h.Keys.home||a===h.Keys.end||a===h.Keys.delete||a===h.Keys.backspace)&&!t.shiftKey)return this.onTagsNavigate(t,l);const m=()=>{t.preventDefault(),this.base.togglePopup(l),this.applyState(l)};if(this.opened)if(a===h.Keys.pageUp)t.preventDefault(),this.base.scrollPopupByPageSize(-1);else if(a===h.Keys.pageDown)t.preventDefault(),this.base.scrollPopupByPageSize(1);else if((t.ctrlKey||t.metaKey)&&t.code==="KeyA"){const c=(this.state.value&&this.state.value.length)===s.length?[]:s;this.updateStateOnKeyboardNavigation(c,l)}else if((t.ctrlKey||t.metaKey)&&t.shiftKey&&t.keyCode===h.Keys.end){const d=s.slice(this.getFocusedState().focusedIndex);this.itemFocus(s.length-1,l),this.updateStateOnKeyboardNavigation(d,l)}else if((t.ctrlKey||t.metaKey)&&t.shiftKey&&t.keyCode===h.Keys.home){const d=s.slice(0,this.getFocusedState().focusedIndex+1);this.itemFocus(0,l),this.updateStateOnKeyboardNavigation(d,l)}else if(t.shiftKey&&t.keyCode===h.Keys.up){let d;const c=this.getLastSelectedOrDeselectedIndex(1,i);c===null?d=i!==0?s.slice(i-1,i):[s[i]]:c===i?d=[s[c-1]]:i>=0&&(d=c>i?s.slice(i-1,c):s.slice(c-1,i)),d&&d.length>0&&(i>=1&&this.itemFocus(i-1,l),this.updateStateOnKeyboardNavigation(d,l))}else if(t.shiftKey&&t.keyCode===h.Keys.down){let d;const c=this.getLastSelectedOrDeselectedIndex(0,i);c===null?d=i!==s.length-1?s.slice(i,i+1):[s[i]]:c===i?d=s.slice(i,i+2):i>=0&&(d=c>i?s.slice(i+1,c+1):s.slice(c,i+2)),d&&d.length>=1&&(this.itemFocus(i+1,l),this.updateStateOnKeyboardNavigation(d,l))}else if(t.altKey&&a===h.Keys.up)m();else if(a===h.Keys.up||a===h.Keys.down){if(o!==""&&e)if(!this.props.skipDisabledItems&&u)this.onNavigate(l,a);else{let d=0;if(a===h.Keys.down||a===h.Keys.right){const c=s.slice(i+1).find(y=>!y.disabled&&y[e]);d=c&&s.findIndex(y=>y[e]===c[e])}else if(a===h.Keys.up||a===h.Keys.left){let c;if(i===-1)c=s,d=s.findIndex(y=>!y.disabled&&y[e]);else{c=s.slice(0,i);let y=c.pop();for(;y&&y.disabled;)y=c.pop();d=y&&s.findIndex(x=>x[e]===y[e])}}if(d){const c=d-i;this.onNavigate(l,a,c)}else d!==void 0&&this.onNavigate(l,a)}else if(!this.props.skipDisabledItems&&u)this.onNavigate(l,a);else{let d=null;if(a===h.Keys.down||a===h.Keys.right)d=s.slice(i+1).find(c=>!c.disabled);else if(a===h.Keys.up||a===h.Keys.left){const c=s.slice(0,i);for(d=c.pop();d&&d.disabled;)d=c.pop()}if(d){const c=d.id-i-1;this.onNavigate(l,a,c)}else this.onNavigate(l,a)}this.applyState(l),t.preventDefault()}else a===h.Keys.enter?(t.preventDefault(),this.props.allowCustom&&p&&r===null?this.customItemSelect(t):r&&r.disabled?m():this.selectFocusedItem(t)):a===h.Keys.esc&&m();else t.altKey&&a===h.Keys.down?m():a===h.Keys.esc&&this.clearButtonClick(t)},this.listContainerContent=()=>{const{header:t,footer:e,allowCustom:o,size:s,groupStickyHeaderItemRender:a,groupField:p,list:u}=this.props,r=g.getFilteredData(this.props),i=this.props.filter!==void 0?this.props.filter:this.state.text,{focusedType:l}=this.getFocusedState(),m=o&&i&&f.createElement("div",{className:h.classNames("k-list",{[`k-list-${w[s]||s}`]:s}),key:"customitem",onClick:this.customItemSelect,onMouseDown:P},f.createElement("div",{className:h.classNames("k-list-item k-custom-item",{"k-focus":_(l)}),style:{fontStyle:"italic"}},i,f.createElement(h.IconWrap,{name:"plus",icon:W.plusIcon,style:{position:"absolute",right:"0.5em"}})));let{group:d}=this.state;return d===void 0&&p!==void 0&&(d=g.getItemValue(r[0],p)),f.createElement(f.Fragment,null,t&&f.createElement("div",{className:"k-list-header"},t),m,f.createElement("div",{className:h.classNames("k-list",{[`k-list-${this.mobileMode?"lg":w[s]||s}`]:s,"k-virtual-list":this.base.vs.enabled})},!u&&d&&r.length!==0&&f.createElement(Y,{group:d,groupMode:"modern",render:a}),this.renderList()),e&&f.createElement("div",{className:"k-list-footer"},e))},this.renderListContainer=()=>{const t=this.base,{dir:e}=this.props,o=g.getFilteredData(this.props),s=this.base.getPopupSettings(),a=s.width!==void 0?s.width:t.popupWidth,p={dir:e!==void 0?e:t.dirCalculated,width:a,popupSettings:{...s,popupClass:h.classNames(s.popupClass,"k-list-container","k-multiselect-popup"),anchor:s.anchor||this.element,show:this.opened,onOpen:this.onPopupOpened,onClose:this.onPopupClosed},itemsCount:[o.length,this.value.length]};return f.createElement(j,{...p},this.listContainerContent())},this.renderAdaptiveListContainer=()=>{const{adaptiveTitle:t,filterable:e,filter:o}=this.props,{windowWidth:s=0}=this.state,a=o!==void 0?o:this.state.text;this.localization=ie.provideLocalizationService(this);const p=e?f.createElement(oe,{value:a,ref:r=>this._adaptiveInput=r&&r.element,onChange:this.onChangeHandler,onKeyDown:this.onInputKeyDown,size:this.props.size,rounded:this.props.rounded,fillMode:this.props.fillMode}):null,u={adaptiveTitle:t,expand:this.opened,onClose:r=>this.onCancel(r),windowWidth:s,mobileFilter:p,footer:{cancelText:this.localization.toLanguageString(C.adaptiveModeFooterCancel,C.messages[C.adaptiveModeFooterCancel]),onCancel:this.onCancel,applyText:this.localization.toLanguageString(C.adaptiveModeFooterApply,C.messages[C.adaptiveModeFooterApply]),onApply:this.closePopup}};return f.createElement(ee.AdaptiveMode,{...u},f.createElement(te.ActionSheetContent,{overflowHidden:!0},f.createElement("div",{className:"k-list-container"},this.listContainerContent())))},this.closePopup=t=>{const e=this.base.initState();e.syntheticEvent=t,t.stopPropagation(),this.state.focusedIndex!==void 0&&(e.data.focusedIndex=void 0),this.opened&&this.base.togglePopup(e),e.events.push({type:"onClose"});const o=this.props.filter!==void 0?this.props.filter:this.state.text;g.isPresent(o)&&o!==""&&this.base.filterChanged("",e),this.state.text&&(e.data.text=""),this.applyState(e)},this.onCancel=t=>{const e=this.base.initState();e.syntheticEvent=t,t.stopPropagation(),this.state.focusedIndex!==void 0&&(e.data.focusedIndex=void 0),this.opened&&this.base.togglePopup(e),e.events.push({type:"onCancel"});const o=this.props.filter!==void 0?this.props.filter:this.state.text;g.isPresent(o)&&o!==""&&this.base.filterChanged("",e),this.state.text&&(e.data.text=""),this.applyState(e)},this.renderList=()=>{const{textField:t,listNoDataRender:e,itemRender:o,groupHeaderItemRender:s,dataItemKey:a,virtual:p={skip:0,total:void 0}}=this.props,u=g.getFilteredData(this.props),r=this.base.vs,{focusedIndex:i}=this.getFocusedState(),l=this.base.getPopupSettings(),m=`translateY(${r.translate}px)`;return f.createElement(G,{id:this.base.listBoxId,show:this.opened,data:u.slice(),focusedIndex:i-p.skip,value:this.value,textField:t,valueField:a,optionsGuid:this.base.guid,groupField:this.props.groupField,groupMode:"modern",listRef:d=>{r.list=this.base.list=d},wrapperStyle:this.mobileMode?{}:{maxHeight:l.height},wrapperCssClass:"k-list-content",listStyle:r.enabled?{transform:m}:void 0,key:"listKey",skip:p.skip,onClick:this.handleItemClick,itemRender:o,groupHeaderItemRender:s,noDataRender:e,onMouseDown:P,onBlur:this.handleBlur,onScroll:this.onScroll,wrapperRef:r.scrollerRef,scroller:this.base.renderScrollElement(),ariaSetSize:p.total})},this.onScroll=t=>{const{vs:e,list:o}=this.base;e.scrollHandler(t);const{groupField:s}=this.props;let a=g.getFilteredData(this.props);if(!(!s||!a.length)&&s){const p=this.itemHeight=this.itemHeight||(e.enabled?e.itemHeight:o?o.children[0].offsetHeight:0),r=t.target.scrollTop-e.skip*p;a=this.base.getGroupedDataModernMode(a,s);let i=a[0][s];for(let l=1;l<a.length&&!(p*l>r);l++)a[l]&&a[l][s]&&(i=a[l][s]);i!==this.state.group&&this.setState({group:i})}},this.customItemSelect=t=>{const e=this.props.filter!==void 0?this.props.filter:this.state.text,{textField:o}=this.props;if(!e)return;const s=this.base.initState();s.syntheticEvent=t;const a=o?{[o]:e}:e;this.state.text!==void 0&&(s.data.text=""),s.data.focusedIndex=void 0,this.base.filterChanged("",s);const p=[...this.value,a];this.triggerOnChange(p,s),this.base.togglePopup(s),this.applyState(s)},this.handleWrapperClick=t=>{const e=this._input;!this.opened&&e&&this.focusElement(e);const o=this.base.initState();o.syntheticEvent=t,!this.state.focused&&!this.mobileMode&&(o.events.push({type:"onFocus"}),o.data.focused=!0),this.mobileMode&&(this.setState({currentValue:this.tagsToRender}),this.mobileMode&&window.setTimeout(()=>this._adaptiveInput&&this._adaptiveInput.focus(),300)),this.base.togglePopup(o),this.applyState(o)},this.handleItemClick=(t,e)=>{const o=this.base.initState();o.syntheticEvent=e,this.handleItemSelect(t,o),this.props.autoClose&&!this.mobileMode&&this.base.togglePopup(o),e.stopPropagation(),this.applyState(o)},this.handleBlur=t=>{if(!this.state.focused||this._skipFocusEvent)return;const e=this.base.initState(),{allowCustom:o,filterable:s}=this.props;e.syntheticEvent=t,e.data.focused=!1,e.events.push({type:"onBlur"}),this.opened&&!this.mobileMode&&(this.state.opened&&(e.data.opened=!1),e.events.push({type:"onClose"})),!o&&!s&&this.state.text&&(e.data.text=""),this.applyState(e)},this.handleFocus=t=>{this._skipFocusEvent||this.base.handleFocus(t)},this.onPopupOpened=()=>{this._input&&this.state.focused&&!this.mobileMode&&this.focusElement(this._input)},this.onPopupClosed=()=>{this.state.focused&&window.setTimeout(()=>{this.state.focused&&this.focusElement(this._input)},0)},this.setValidity=()=>{this._input&&this._input.setCustomValidity&&this._input.setCustomValidity(this.validity.valid?"":this.props.validationMessage||le)},h.validatePackage(X.packageMetadata)}get _inputId(){return this.props.id}get document(){if(h.canUseDOM)return this.element&&this.element.ownerDocument||document}get element(){return this._element}get opened(){return!!(this.props.opened!==void 0?this.props.opened:this.state.opened)}get tagsToRender(){const{tags:n,textField:t}=this.props,e=[];return n===void 0?this.value.forEach(o=>{e.push({text:g.getItemValue(o,t),data:[o]})}):e.push(...n),e}get mobileMode(){return!!(this.state.windowWidth&&this.state.windowWidth<=se.MOBILE_MEDIUM_DEVISE&&this.props.adaptive)}get value(){const n=[];return this._valueItemsDuringOnChange?n.push(...this._valueItemsDuringOnChange):this.props.value?n.push(...this.props.value):this.state.value?n.push(...this.state.value):this.props.defaultValue&&n.push(...this.props.defaultValue),n}get name(){return this.props.name}get validity(){const n=this.props.validationMessage!==void 0,t=!this.required||this.value!==null&&this.value.length>0&&this.value!==void 0,e=this.props.valid!==void 0?this.props.valid:t;return{customError:n,valid:e,valueMissing:this.value===null}}get required(){return this.props.required!==void 0?this.props.required:b.defaultProps.required}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:b.defaultProps.validityStyles}componentDidUpdate(n,t){var m;const{virtual:e,groupField:o=""}=this.props,s=g.getFilteredData(this.props),a=e?e.skip:0,p=n.virtual?n.virtual.total:0,u=n.opened!==void 0?n.opened:t.opened,r=!u&&this.opened,i=u&&!this.opened,l=this.base.getPopupSettings();if(this.base.didUpdate(),!l.animate&&i&&this.onPopupClosed(),e&&e.total!==p)this.base.vs.calcScrollElementHeight(),this.base.vs.reset();else{let{focusedItem:d,focusedIndex:c}=this.getFocusedState();o!==""&&(c=(m=this.base.getGroupedDataModernMode(s,o))==null?void 0:m.indexOf(d)),r&&e?this.base.scrollToVirtualItem(e,c-a):r&&!e?(s&&s.length!==0&&this.base.resetGroupStickyHeader(s[0][o],this),this.base.scrollToItem(c)):this.opened&&u&&d&&this.scrollToFocused&&this.base.scrollToItem(c-a)}this.scrollToFocused=!1,this.setValidity()}componentDidMount(){var n;this.observerResize=h.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.base.didMount(),this.setValidity(),(n=this.document)!=null&&n.body&&this.observerResize&&this.observerResize.observe(this.document.body)}componentWillUnmount(){var n;(n=this.document)!=null&&n.body&&this.observerResize&&this.observerResize.disconnect()}onNavigate(n,t,e){const{allowCustom:o}=this.props,s=g.getFilteredData(this.props),a=this.props.filter!==void 0?this.props.filter:this.state.text,{focusedType:p,focusedIndex:u}=this.getFocusedState(),r=o&&a,i=_(p),l=this.base,m=l.vs;if(this.opened&&t===h.Keys.up&&i)this.state.focusedIndex!==void 0&&(n.data.focusedIndex=void 0);else{const d=l.navigation.navigate({keyCode:t,current:u,max:(m.enabled?m.total:s.length)-1,min:r?-1:0,skipItems:e||void 0});d!==void 0&&(this.itemFocus(d,n),this.scrollToFocused=!0)}this.applyState(n)}render(){const{style:n,className:t,label:e,dir:o,disabled:s,textField:a,dataItemKey:p,virtual:u,size:r,rounded:i,fillMode:l,loading:m,filter:d}=this.props,{text:c,focused:y,focusedTag:x,currentValue:q}=this.state,k=this.base.vs,T=this.props.id||this._inputId;k.enabled=u!==void 0,u!==void 0&&(k.skip=u.skip,k.total=u.total,k.pageSize=u.pageSize);const S=this.mobileMode&&this.opened?q:this.tagsToRender;this.setItems(this.tagsToRender,this._tags);const M=!this.validityStyles||this.validity.valid,L=!!(d!==void 0?d:c)||S&&S.length>0,[B,V]=E(this.props.prefix||f.Fragment),[z,A]=E(this.props.suffix||f.Fragment),O=f.createElement(f.Fragment,null,f.createElement("div",{ref:this.componentRef,className:h.classNames("k-multiselect k-input",t,{[`k-input-${w[r]||r}`]:r,[`k-rounded-${ne[i]||i}`]:i,[`k-input-${l}`]:l,"k-focus":y&&!s,"k-invalid":!M,"k-disabled":s,"k-loading":m,"k-required":this.required}),style:e?{...n,width:void 0}:n,dir:o,onFocus:this.handleFocus,onBlur:this.handleBlur,onClick:this.handleWrapperClick,onMouseDown:g.preventDefaultNonInputs},this.props.prefix&&f.createElement(B,{...V}),f.createElement("div",{className:h.classNames("k-input-values")},f.createElement("div",{className:h.classNames("k-chip-list",{[`k-chip-list-${w[r]||r}`]:r}),role:"listbox",id:"tagslist-"+this.base.guid},S&&S.length>0&&f.createElement(J,{tagRender:this.props.tagRender,onTagDelete:this.onTagDelete,data:S,guid:this.base.guid,focused:x?S.find(H=>g.matchTags(H,x,p)):void 0,size:r})),this.renderSearchBar(T)),m&&f.createElement(h.IconWrap,{className:"k-input-loading-icon",name:"loading"}),this.props.suffix&&f.createElement(z,{...A}),L&&f.createElement(Z,{onClick:this.clearButtonClick}),!this.mobileMode&&this.renderListContainer()),this.mobileMode&&this.renderAdaptiveListContainer());return e?f.createElement(U.FloatingLabel,{label:e,editorId:T,editorValue:c||g.getItemValue(this.value[0],a),editorValid:M,editorDisabled:s,style:{width:n?n.width:void 0},children:O}):O}renderSearchBar(n){const{activedescendant:t,focusedTag:e,currentValue:o}=this.state,{disabled:s,placeholder:a,ariaDescribedBy:p,ariaLabelledBy:u,ariaLabel:r,inputAttributes:i}=this.props,l=!this.mobileMode&&(this.props.filter!==void 0?this.props.filter:this.state.text)||"",{focusedIndex:m}=this.getFocusedState(),d=this.value.length===0&&!l?a:void 0,c=o&&o.length>0?void 0:a,y=t===D.ActiveDescendant.TagsList&&e!==void 0?`tag-${this.base.guid}-${e.text.replace(/\s+/g,"-")}`:`option-${this.base.guid}-${m}`,x={accessKey:this.props.accessKey,tabIndex:this.props.tabIndex};return f.createElement(Q,{id:n,size:Math.max((d||"").length,l.length,1),placeholder:this.mobileMode&&this.opened?c:d,value:l,onChange:this.onChangeHandler,onKeyDown:this.onInputKeyDown,ref:this.searchbarRef,disabled:s,expanded:this.opened,owns:this.base.listBoxId,role:"combobox",activedescendant:y,ariaDescribedBy:`tagslist-${this.base.guid}${p?" "+p:""}`,ariaLabelledBy:u,ariaRequired:this.required,ariaLabel:r,inputAttributes:i,...x})}onTagsNavigate(n,t){const e=n.keyCode,{focusedTag:o}=this.state,s=this._tags,a=this.props.dataItemKey;let p=o?s.findIndex(i=>g.matchTags(i,o,a)):-1,u;const r=p!==-1;if(e===h.Keys.left)r?p=Math.max(0,p-1):p=s.length-1,u=s[p];else if(e===h.Keys.right)p===s.length-1?u=void 0:r&&(p=Math.min(s.length-1,p+1),u=s[p]);else if(e===h.Keys.home&&!n.shiftKey)u=s[0];else if(e===h.Keys.end&&!n.shiftKey)u=s[s.length-1];else if(e===h.Keys.delete){if(r){const i=this.value;g.removeDataItems(i,s[p].data,a),this.triggerOnChange(i,t)}}else if(e===h.Keys.backspace){const i=this.value;if(r)g.removeDataItems(i,s[p].data,a),this.triggerOnChange(i,t);else if(!r&&s.length){const l=s.pop();g.removeDataItems(i,l.data,a),this.triggerOnChange(i,t)}}u!==o&&(t.data.focusedTag=u,t.data.activedescendant=D.ActiveDescendant.TagsList),this.applyState(t)}triggerOnChange(n,t){this.props.value===void 0&&(t.data.value=[...n]),this._valueItemsDuringOnChange=[],this.setItems(n,this._valueItemsDuringOnChange),t.events.push({type:"onChange"})}selectFocusedItem(n,t){const{virtual:e}=this.props,o=g.getFilteredData(this.props),{focusedIndex:s}=t||this.getFocusedState(),a=e?e.skip:0;o[s-a]!==void 0&&this.handleItemClick(s,n)}setItems(n,t){t.length=0,t.push(...n)}getFocusedState(){const{focusedIndex:n}=this.state,t=this.props.filter!==void 0?this.props.filter:this.state.text,{allowCustom:e,dataItemKey:o,virtual:s,textField:a,focusedItemIndex:p=g.itemIndexStartsWith,skipDisabledItems:u}=this.props,r=g.getFilteredData(this.props),i=s&&s.skip||0;let l;if(n!==void 0)return{focusedIndex:n,focusedItem:r[n-i],focusedType:1};const m=this.value;if(e&&t)return{focusedItem:null,focusedIndex:-1,focusedType:2};if(t)return l=p(r,t,a),{focusedItem:r[l],focusedIndex:l+i,focusedType:1};if(m.length){const d=m[m.length-1];return l=r.findIndex(c=>g.areSame(c,d,o)),r[l]!==void 0?{focusedIndex:l+i,focusedItem:r[l],focusedType:1}:{focusedType:0,focusedIndex:-1}}else if(u&&a&&!t&&i===0){const d=r.findIndex(c=>!c.disabled&&c[a]);return{focusedIndex:d,focusedItem:r[d-i],focusedType:1}}return i===0?{focusedItem:r[0],focusedIndex:0,focusedType:1}:{focusedType:0,focusedIndex:-1}}focusElement(n){this._skipFocusEvent=!0,n.focus(),window.setTimeout(()=>this._skipFocusEvent=!1,0)}applyState(n){this.base.applyState(n),this._valueItemsDuringOnChange=null}calculateMedia(n){for(const t of n)this.setState({windowWidth:t.target.clientWidth})}updateStateOnKeyboardNavigation(n,t){this.setState({value:n}),this.triggerOnChange(n,t),this.applyState(t)}getLastSelectedOrDeselectedIndex(n,t){return this._lastSelectedOrDeslectedItemIndex===null&&(this._lastSelectedOrDeslectedItemIndex=t),this._lastSelectedOrDeslectedItemIndex!==null?this._lastSelectedOrDeslectedItemIndex+n:null}};b.displayName="MultiSelect",b.propTypes={...K.propTypes,autoClose:v.bool,value:v.arrayOf(v.any),defaultValue:v.arrayOf(v.any),dataItemKey:v.string,placeholder:v.string,tags:v.arrayOf(v.shape({text:v.string,data:v.arrayOf(v.any)})),tagRender:v.func,id:v.string,ariaLabelledBy:v.string,ariaDescribedBy:v.string,groupField:v.string,list:v.any,adaptive:v.bool,adaptiveTitle:v.string,onCancel:v.func,skipDisabledItems:v.bool,inputAttributes:v.object},b.defaultProps={...K.defaultProps,autoClose:!0,required:!1,size:"medium",rounded:"medium",fillMode:"solid",groupMode:"modern",skipDisabledItems:!0,prefix:void 0,suffix:void 0};let F=b;const N=h.createPropsContext(),R=h.withIdHOC(h.withPropsContext(N,F));R.displayName="KendoReactMultiSelect";exports.MultiSelect=R;exports.MultiSelectPropsContext=N;exports.MultiSelectWithoutContext=F;
|
|
8
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const $=require("react"),v=require("prop-types"),h=require("@progress/kendo-react-common"),W=require("@progress/kendo-svg-icons"),U=require("@progress/kendo-react-labels"),j=require("../common/ListContainer.js"),G=require("../common/List.js"),Y=require("../common/GroupStickyHeader.js"),J=require("./TagList.js"),Q=require("../common/SearchBar.js"),F=require("../common/DropDownBase.js"),D=require("../common/settings.js"),g=require("../common/utils.js"),X=require("../package-metadata.js"),Z=require("../common/ClearButton.js"),ee=require("../common/AdaptiveMode.js"),te=require("@progress/kendo-react-layout"),se=require("@progress/kendo-react-intl"),C=require("../messages/index.js"),ie=require("../common/ListFilter.js"),P=require("../common/withCustomComponent.js");function oe(I){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(I){for(const t in I)if(t!=="default"){const e=Object.getOwnPropertyDescriptor(I,t);Object.defineProperty(n,t,e.get?e:{enumerable:!0,get:()=>I[t]})}}return n.default=I,Object.freeze(n)}const f=oe($),{sizeMap:w,roundedMap:ae}=h.kendoThemeMaps,ne="Please enter a valid value!",E=I=>I.preventDefault(),_=I=>I===2,b=class b extends f.Component{constructor(n){super(n),this.state={activedescendant:D.ActiveDescendant.PopupList,currentValue:[]},this._element=null,this._valueItemsDuringOnChange=null,this.base=new F(this),this._tags=[],this._input=null,this._adaptiveInput=null,this._skipFocusEvent=!1,this._lastSelectedOrDeslectedItemIndex=null,this.itemHeight=0,this.scrollToFocused=!1,this.localization=null,this.focus=()=>{this._input&&this._input.focus()},this.handleItemSelect=(t,e)=>{const{dataItemKey:o,virtual:s}=this.props,a=g.getFilteredData(this.props),p=s?s.skip:0,u=a[t-p],r=this.value.findIndex(m=>g.areSame(m,u,o));this._lastSelectedOrDeslectedItemIndex=a.findIndex(m=>g.areSame(m,u,o));let i=[];r!==-1?(i=this.value,i.splice(r,1)):i=[...this.value,u],(this.props.filter!==void 0?this.props.filter:this.state.text)&&!this.mobileMode&&(this.state.text&&(e.data.text=""),this.base.filterChanged("",e)),this._adaptiveInput&&this._adaptiveInput.blur(),this.state.focusedIndex!==void 0&&(e.data.focusedIndex=void 0),this.triggerOnChange(i,e),this.base.triggerPageChangeCornerItems(u,e)},this.onTagDelete=(t,e)=>{const o=this.base.initState();o.syntheticEvent=e,this.opened&&this.base.togglePopup(o),!this.state.focused&&!this.mobileMode&&(o.data.focused=!0,this.focus());const s=this.value;g.removeDataItems(s,t,this.props.dataItemKey),this.triggerOnChange(s,o),this.applyState(o)},this.itemFocus=(t,e)=>{const{allowCustom:o,virtual:s}=this.props,a=g.getFilteredData(this.props),p=s?s.skip:0,u=this.props.filter!==void 0?this.props.filter:this.state.text,{focusedIndex:r}=this.getFocusedState(),i=o&&u,l=a[t-p];l&&r!==t?this.state.focusedIndex!==t&&(e.data.focusedIndex=t,e.data.activedescendant=D.ActiveDescendant.PopupList):i&&t===-1&&this.state.focusedIndex!==void 0&&(e.data.focusedIndex=void 0),this.base.triggerPageChangeCornerItems(l,e)},this.componentRef=t=>{this._element=t,this.base.wrapper=t},this.searchbarRef=t=>{const e=this._input=t&&t.input;e&&this.state.focused&&window.setTimeout(()=>e.focus(),0)},this.onChangeHandler=t=>{const e=this.base.initState(),o=t.target.value;e.syntheticEvent=t,this.props.filter===void 0&&(e.data.text=o),e.data.focusedIndex=void 0,this.opened||(this.base.togglePopup(e),this.setState({currentValue:this.value})),this.base.filterChanged(o,e),this.applyState(e),this.setState({group:void 0})},this.clearButtonClick=t=>{const e=this.base.initState();e.syntheticEvent=t,t.stopPropagation(),this.value.length>0&&this.triggerOnChange([],e),this.state.focusedIndex!==void 0&&(e.data.focusedIndex=void 0),this.opened&&this.base.togglePopup(e);const o=this.props.filter!==void 0?this.props.filter:this.state.text;g.isPresent(o)&&o!==""&&this.base.filterChanged("",e),this.state.text&&(e.data.text=""),this._lastSelectedOrDeslectedItemIndex=null,this.applyState(e)},this.onInputKeyDown=t=>{const{textField:e,groupField:o}=this.props,s=g.getFilteredData(this.props),a=t.keyCode,p=this.props.filter!==void 0?this.props.filter:this.state.text,u=this.props.opened!==void 0?this.props.opened:this.state.opened,{focusedItem:r,focusedIndex:i}=this.getFocusedState(),l=this.base.initState();if(l.syntheticEvent=t,!p&&this.value.length>0&&(a===h.Keys.left||a===h.Keys.right||a===h.Keys.home||a===h.Keys.end||a===h.Keys.delete||a===h.Keys.backspace)&&!t.shiftKey)return this.onTagsNavigate(t,l);const m=()=>{t.preventDefault(),this.base.togglePopup(l),this.applyState(l)};if(this.opened)if(a===h.Keys.pageUp)t.preventDefault(),this.base.scrollPopupByPageSize(-1);else if(a===h.Keys.pageDown)t.preventDefault(),this.base.scrollPopupByPageSize(1);else if((t.ctrlKey||t.metaKey)&&t.code==="KeyA"){const c=(this.state.value&&this.state.value.length)===s.length?[]:s;this.updateStateOnKeyboardNavigation(c,l)}else if((t.ctrlKey||t.metaKey)&&t.shiftKey&&t.keyCode===h.Keys.end){const d=s.slice(this.getFocusedState().focusedIndex);this.itemFocus(s.length-1,l),this.updateStateOnKeyboardNavigation(d,l)}else if((t.ctrlKey||t.metaKey)&&t.shiftKey&&t.keyCode===h.Keys.home){const d=s.slice(0,this.getFocusedState().focusedIndex+1);this.itemFocus(0,l),this.updateStateOnKeyboardNavigation(d,l)}else if(t.shiftKey&&t.keyCode===h.Keys.up){let d;const c=this.getLastSelectedOrDeselectedIndex(1,i);c===null?d=i!==0?s.slice(i-1,i):[s[i]]:c===i?d=[s[c-1]]:i>=0&&(d=c>i?s.slice(i-1,c):s.slice(c-1,i)),d&&d.length>0&&(i>=1&&this.itemFocus(i-1,l),this.updateStateOnKeyboardNavigation(d,l))}else if(t.shiftKey&&t.keyCode===h.Keys.down){let d;const c=this.getLastSelectedOrDeselectedIndex(0,i);c===null?d=i!==s.length-1?s.slice(i,i+1):[s[i]]:c===i?d=s.slice(i,i+2):i>=0&&(d=c>i?s.slice(i+1,c+1):s.slice(c,i+2)),d&&d.length>=1&&(this.itemFocus(i+1,l),this.updateStateOnKeyboardNavigation(d,l))}else if(t.altKey&&a===h.Keys.up)m();else if(a===h.Keys.up||a===h.Keys.down){if(o!==""&&e)if(!this.props.skipDisabledItems&&u)this.onNavigate(l,a);else{let d=0;if(a===h.Keys.down||a===h.Keys.right){const c=s.slice(i+1).find(y=>!y.disabled&&y[e]);d=c&&s.findIndex(y=>y[e]===c[e])}else if(a===h.Keys.up||a===h.Keys.left){let c;if(i===-1)c=s,d=s.findIndex(y=>!y.disabled&&y[e]);else{c=s.slice(0,i);let y=c.pop();for(;y&&y.disabled;)y=c.pop();d=y&&s.findIndex(x=>x[e]===y[e])}}if(d){const c=d-i;this.onNavigate(l,a,c)}else d!==void 0&&this.onNavigate(l,a)}else if(!this.props.skipDisabledItems&&u)this.onNavigate(l,a);else{let d=null;if(a===h.Keys.down||a===h.Keys.right)d=s.slice(i+1).find(c=>!c.disabled);else if(a===h.Keys.up||a===h.Keys.left){const c=s.slice(0,i);for(d=c.pop();d&&d.disabled;)d=c.pop()}if(d){const c=d.id-i-1;this.onNavigate(l,a,c)}else this.onNavigate(l,a)}this.applyState(l),t.preventDefault()}else a===h.Keys.enter?(t.preventDefault(),this.props.allowCustom&&p&&r===null?this.customItemSelect(t):r&&r.disabled?m():this.selectFocusedItem(t)):a===h.Keys.esc&&m();else t.altKey&&a===h.Keys.down?m():a===h.Keys.esc&&this.clearButtonClick(t)},this.listContainerContent=()=>{const{header:t,footer:e,allowCustom:o,size:s,groupStickyHeaderItemRender:a,groupField:p,list:u}=this.props,r=g.getFilteredData(this.props),i=this.props.filter!==void 0?this.props.filter:this.state.text,{focusedType:l}=this.getFocusedState(),m=o&&i&&f.createElement("div",{className:h.classNames("k-list",{[`k-list-${w[s]||s}`]:s}),key:"customitem",onClick:this.customItemSelect,onMouseDown:E},f.createElement("div",{className:h.classNames("k-list-item k-custom-item",{"k-focus":_(l)}),style:{fontStyle:"italic"}},i,f.createElement(h.IconWrap,{name:"plus",icon:W.plusIcon,style:{position:"absolute",right:"0.5em"}})));let{group:d}=this.state;return d===void 0&&p!==void 0&&(d=g.getItemValue(r[0],p)),f.createElement(f.Fragment,null,t&&f.createElement("div",{className:"k-list-header"},t),m,f.createElement("div",{className:h.classNames("k-list",{[`k-list-${this.mobileMode?"lg":w[s]||s}`]:s,"k-virtual-list":this.base.vs.enabled})},!u&&d&&r.length!==0&&f.createElement(Y,{group:d,groupMode:"modern",render:a}),this.renderList()),e&&f.createElement("div",{className:"k-list-footer"},e))},this.renderListContainer=()=>{const t=this.base,{dir:e}=this.props,o=g.getFilteredData(this.props),s=this.base.getPopupSettings(),a=s.width!==void 0?s.width:t.popupWidth,p={dir:e!==void 0?e:t.dirCalculated,width:a,popupSettings:{...s,popupClass:h.classNames(s.popupClass,"k-list-container","k-multiselect-popup"),anchor:s.anchor||this.element,show:this.opened,onOpen:this.onPopupOpened,onClose:this.onPopupClosed},itemsCount:[o.length,this.value.length]};return f.createElement(j,{...p},this.listContainerContent())},this.renderAdaptiveListContainer=()=>{const{adaptiveTitle:t,filterable:e,filter:o}=this.props,{windowWidth:s=0}=this.state,a=o!==void 0?o:this.state.text;this.localization=se.provideLocalizationService(this);const p=e?f.createElement(ie,{value:a,ref:r=>this._adaptiveInput=r&&r.element,onChange:this.onChangeHandler,onKeyDown:this.onInputKeyDown,size:this.props.size,rounded:this.props.rounded,fillMode:this.props.fillMode}):null,u={title:t,expand:this.opened,onClose:r=>this.onCancel(r),windowWidth:s,mobileFilter:p,footer:{cancelText:this.localization.toLanguageString(C.adaptiveModeFooterCancel,C.messages[C.adaptiveModeFooterCancel]),onCancel:this.onCancel,applyText:this.localization.toLanguageString(C.adaptiveModeFooterApply,C.messages[C.adaptiveModeFooterApply]),onApply:this.closePopup}};return f.createElement(ee.AdaptiveMode,{...u},f.createElement(te.ActionSheetContent,{overflowHidden:!0},f.createElement("div",{className:"k-list-container"},this.listContainerContent())))},this.closePopup=t=>{const e=this.base.initState();e.syntheticEvent=t,t.stopPropagation(),this.state.focusedIndex!==void 0&&(e.data.focusedIndex=void 0),this.opened&&this.base.togglePopup(e),e.events.push({type:"onClose"});const o=this.props.filter!==void 0?this.props.filter:this.state.text;g.isPresent(o)&&o!==""&&this.base.filterChanged("",e),this.state.text&&(e.data.text=""),this.applyState(e)},this.onCancel=t=>{const e=this.base.initState();e.syntheticEvent=t,t.stopPropagation(),this.state.focusedIndex!==void 0&&(e.data.focusedIndex=void 0),this.opened&&this.base.togglePopup(e),e.events.push({type:"onCancel"});const o=this.props.filter!==void 0?this.props.filter:this.state.text;g.isPresent(o)&&o!==""&&this.base.filterChanged("",e),this.state.text&&(e.data.text=""),this.applyState(e)},this.renderList=()=>{const{textField:t,listNoDataRender:e,itemRender:o,groupHeaderItemRender:s,dataItemKey:a,virtual:p={skip:0,total:void 0}}=this.props,u=g.getFilteredData(this.props),r=this.base.vs,{focusedIndex:i}=this.getFocusedState(),l=this.base.getPopupSettings(),m=`translateY(${r.translate}px)`;return f.createElement(G,{id:this.base.listBoxId,show:this.opened,data:u.slice(),focusedIndex:i-p.skip,value:this.value,textField:t,valueField:a,optionsGuid:this.base.guid,groupField:this.props.groupField,groupMode:"modern",listRef:d=>{r.list=this.base.list=d},wrapperStyle:this.mobileMode?{}:{maxHeight:l.height},wrapperCssClass:"k-list-content",listStyle:r.enabled?{transform:m}:void 0,key:"listKey",skip:p.skip,onClick:this.handleItemClick,itemRender:o,groupHeaderItemRender:s,noDataRender:e,onMouseDown:E,onBlur:this.handleBlur,onScroll:this.onScroll,wrapperRef:r.scrollerRef,scroller:this.base.renderScrollElement(),ariaSetSize:p.total})},this.onScroll=t=>{const{vs:e,list:o}=this.base;e.scrollHandler(t);const{groupField:s}=this.props;let a=g.getFilteredData(this.props);if(!(!s||!a.length)&&s){const p=this.itemHeight=this.itemHeight||(e.enabled?e.itemHeight:o?o.children[0].offsetHeight:0),r=t.target.scrollTop-e.skip*p;a=this.base.getGroupedDataModernMode(a,s);let i=a[0][s];for(let l=1;l<a.length&&!(p*l>r);l++)a[l]&&a[l][s]&&(i=a[l][s]);i!==this.state.group&&this.setState({group:i})}},this.customItemSelect=t=>{const e=this.props.filter!==void 0?this.props.filter:this.state.text,{textField:o}=this.props;if(!e)return;const s=this.base.initState();s.syntheticEvent=t;const a=o?{[o]:e}:e;this.state.text!==void 0&&(s.data.text=""),s.data.focusedIndex=void 0,this.base.filterChanged("",s);const p=[...this.value,a];this.triggerOnChange(p,s),this.base.togglePopup(s),this.applyState(s)},this.handleWrapperClick=t=>{const e=this._input;!this.opened&&e&&this.focusElement(e);const o=this.base.initState();o.syntheticEvent=t,!this.state.focused&&!this.mobileMode&&(o.events.push({type:"onFocus"}),o.data.focused=!0),this.mobileMode&&(this.setState({currentValue:this.tagsToRender}),this.mobileMode&&window.setTimeout(()=>this._adaptiveInput&&this._adaptiveInput.focus(),300)),this.base.togglePopup(o),this.applyState(o)},this.handleItemClick=(t,e)=>{const o=this.base.initState();o.syntheticEvent=e,this.handleItemSelect(t,o),this.props.autoClose&&!this.mobileMode&&this.base.togglePopup(o),e.stopPropagation(),this.applyState(o)},this.handleBlur=t=>{if(!this.state.focused||this._skipFocusEvent)return;const e=this.base.initState(),{allowCustom:o,filterable:s}=this.props;e.syntheticEvent=t,e.data.focused=!1,e.events.push({type:"onBlur"}),this.opened&&!this.mobileMode&&(this.state.opened&&(e.data.opened=!1),e.events.push({type:"onClose"})),!o&&!s&&this.state.text&&(e.data.text=""),this.applyState(e)},this.handleFocus=t=>{this._skipFocusEvent||this.base.handleFocus(t)},this.onPopupOpened=()=>{this._input&&this.state.focused&&!this.mobileMode&&this.focusElement(this._input)},this.onPopupClosed=()=>{this.state.focused&&window.setTimeout(()=>{this.state.focused&&this.focusElement(this._input)},0)},this.setValidity=()=>{this._input&&this._input.setCustomValidity&&this._input.setCustomValidity(this.validity.valid?"":this.props.validationMessage||ne)},h.validatePackage(X.packageMetadata)}get _inputId(){return this.props.id}get document(){if(h.canUseDOM)return this.element&&this.element.ownerDocument||document}get element(){return this._element}get opened(){return!!(this.props.opened!==void 0?this.props.opened:this.state.opened)}get tagsToRender(){const{tags:n,textField:t}=this.props,e=[];return n===void 0?this.value.forEach(o=>{e.push({text:g.getItemValue(o,t),data:[o]})}):e.push(...n),e}get mobileMode(){return!!(this.state.windowWidth&&this.state.windowWidth<=h.ADAPTIVE_MEDIUM_BREAKPOINT&&this.props.adaptive)}get value(){const n=[];return this._valueItemsDuringOnChange?n.push(...this._valueItemsDuringOnChange):this.props.value?n.push(...this.props.value):this.state.value?n.push(...this.state.value):this.props.defaultValue&&n.push(...this.props.defaultValue),n}get name(){return this.props.name}get validity(){const n=this.props.validationMessage!==void 0,t=!this.required||this.value!==null&&this.value.length>0&&this.value!==void 0,e=this.props.valid!==void 0?this.props.valid:t;return{customError:n,valid:e,valueMissing:this.value===null}}get required(){return this.props.required!==void 0?this.props.required:b.defaultProps.required}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:b.defaultProps.validityStyles}componentDidUpdate(n,t){var m;const{virtual:e,groupField:o=""}=this.props,s=g.getFilteredData(this.props),a=e?e.skip:0,p=n.virtual?n.virtual.total:0,u=n.opened!==void 0?n.opened:t.opened,r=!u&&this.opened,i=u&&!this.opened,l=this.base.getPopupSettings();if(this.base.didUpdate(),!l.animate&&i&&this.onPopupClosed(),e&&e.total!==p)this.base.vs.calcScrollElementHeight(),this.base.vs.reset();else{let{focusedItem:d,focusedIndex:c}=this.getFocusedState();o!==""&&(c=(m=this.base.getGroupedDataModernMode(s,o))==null?void 0:m.indexOf(d)),r&&e?this.base.scrollToVirtualItem(e,c-a):r&&!e?(s&&s.length!==0&&this.base.resetGroupStickyHeader(s[0][o],this),this.base.scrollToItem(c)):this.opened&&u&&d&&this.scrollToFocused&&this.base.scrollToItem(c-a)}this.scrollToFocused=!1,this.setValidity()}componentDidMount(){var n;this.observerResize=h.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.base.didMount(),this.setValidity(),(n=this.document)!=null&&n.body&&this.observerResize&&this.observerResize.observe(this.document.body)}componentWillUnmount(){var n;(n=this.document)!=null&&n.body&&this.observerResize&&this.observerResize.disconnect()}onNavigate(n,t,e){const{allowCustom:o}=this.props,s=g.getFilteredData(this.props),a=this.props.filter!==void 0?this.props.filter:this.state.text,{focusedType:p,focusedIndex:u}=this.getFocusedState(),r=o&&a,i=_(p),l=this.base,m=l.vs;if(this.opened&&t===h.Keys.up&&i)this.state.focusedIndex!==void 0&&(n.data.focusedIndex=void 0);else{const d=l.navigation.navigate({keyCode:t,current:u,max:(m.enabled?m.total:s.length)-1,min:r?-1:0,skipItems:e||void 0});d!==void 0&&(this.itemFocus(d,n),this.scrollToFocused=!0)}this.applyState(n)}render(){const{style:n,className:t,label:e,dir:o,disabled:s,textField:a,dataItemKey:p,virtual:u,size:r,rounded:i,fillMode:l,loading:m,filter:d}=this.props,{text:c,focused:y,focusedTag:x,currentValue:q}=this.state,k=this.base.vs,T=this.props.id||this._inputId;k.enabled=u!==void 0,u!==void 0&&(k.skip=u.skip,k.total=u.total,k.pageSize=u.pageSize);const S=this.mobileMode&&this.opened?q:this.tagsToRender;this.setItems(this.tagsToRender,this._tags);const M=!this.validityStyles||this.validity.valid,L=!!(d!==void 0?d:c)||S&&S.length>0,[A,B]=P(this.props.prefix||f.Fragment),[V,z]=P(this.props.suffix||f.Fragment),O=f.createElement(f.Fragment,null,f.createElement("div",{ref:this.componentRef,className:h.classNames("k-multiselect k-input",t,{[`k-input-${w[r]||r}`]:r,[`k-rounded-${ae[i]||i}`]:i,[`k-input-${l}`]:l,"k-focus":y&&!s,"k-invalid":!M,"k-disabled":s,"k-loading":m,"k-required":this.required}),style:e?{...n,width:void 0}:n,dir:o,onFocus:this.handleFocus,onBlur:this.handleBlur,onClick:this.handleWrapperClick,onMouseDown:g.preventDefaultNonInputs},this.props.prefix&&f.createElement(A,{...B}),f.createElement("div",{className:h.classNames("k-input-values")},f.createElement("div",{className:h.classNames("k-chip-list",{[`k-chip-list-${w[r]||r}`]:r}),role:"listbox",id:"tagslist-"+this.base.guid},S&&S.length>0&&f.createElement(J,{tagRender:this.props.tagRender,onTagDelete:this.onTagDelete,data:S,guid:this.base.guid,focused:x?S.find(H=>g.matchTags(H,x,p)):void 0,size:r})),this.renderSearchBar(T)),m&&f.createElement(h.IconWrap,{className:"k-input-loading-icon",name:"loading"}),this.props.suffix&&f.createElement(V,{...z}),L&&f.createElement(Z,{onClick:this.clearButtonClick}),!this.mobileMode&&this.renderListContainer()),this.mobileMode&&this.renderAdaptiveListContainer());return e?f.createElement(U.FloatingLabel,{label:e,editorId:T,editorValue:c||g.getItemValue(this.value[0],a),editorValid:M,editorDisabled:s,style:{width:n?n.width:void 0},children:O}):O}renderSearchBar(n){const{activedescendant:t,focusedTag:e,currentValue:o}=this.state,{disabled:s,placeholder:a,ariaDescribedBy:p,ariaLabelledBy:u,ariaLabel:r,inputAttributes:i}=this.props,l=!this.mobileMode&&(this.props.filter!==void 0?this.props.filter:this.state.text)||"",{focusedIndex:m}=this.getFocusedState(),d=this.value.length===0&&!l?a:void 0,c=o&&o.length>0?void 0:a,y=t===D.ActiveDescendant.TagsList&&e!==void 0?`tag-${this.base.guid}-${e.text.replace(/\s+/g,"-")}`:`option-${this.base.guid}-${m}`,x={accessKey:this.props.accessKey,tabIndex:this.props.tabIndex};return f.createElement(Q,{id:n,size:Math.max((d||"").length,l.length,1),placeholder:this.mobileMode&&this.opened?c:d,value:l,onChange:this.onChangeHandler,onKeyDown:this.onInputKeyDown,ref:this.searchbarRef,disabled:s,expanded:this.opened,owns:this.base.listBoxId,role:"combobox",activedescendant:y,ariaDescribedBy:`tagslist-${this.base.guid}${p?" "+p:""}`,ariaLabelledBy:u,ariaRequired:this.required,ariaLabel:r,inputAttributes:i,...x})}onTagsNavigate(n,t){const e=n.keyCode,{focusedTag:o}=this.state,s=this._tags,a=this.props.dataItemKey;let p=o?s.findIndex(i=>g.matchTags(i,o,a)):-1,u;const r=p!==-1;if(e===h.Keys.left)r?p=Math.max(0,p-1):p=s.length-1,u=s[p];else if(e===h.Keys.right)p===s.length-1?u=void 0:r&&(p=Math.min(s.length-1,p+1),u=s[p]);else if(e===h.Keys.home&&!n.shiftKey)u=s[0];else if(e===h.Keys.end&&!n.shiftKey)u=s[s.length-1];else if(e===h.Keys.delete){if(r){const i=this.value;g.removeDataItems(i,s[p].data,a),this.triggerOnChange(i,t)}}else if(e===h.Keys.backspace){const i=this.value;if(r)g.removeDataItems(i,s[p].data,a),this.triggerOnChange(i,t);else if(!r&&s.length){const l=s.pop();g.removeDataItems(i,l.data,a),this.triggerOnChange(i,t)}}u!==o&&(t.data.focusedTag=u,t.data.activedescendant=D.ActiveDescendant.TagsList),this.applyState(t)}triggerOnChange(n,t){this.props.value===void 0&&(t.data.value=[...n]),this._valueItemsDuringOnChange=[],this.setItems(n,this._valueItemsDuringOnChange),t.events.push({type:"onChange"})}selectFocusedItem(n,t){const{virtual:e}=this.props,o=g.getFilteredData(this.props),{focusedIndex:s}=t||this.getFocusedState(),a=e?e.skip:0;o[s-a]!==void 0&&this.handleItemClick(s,n)}setItems(n,t){t.length=0,t.push(...n)}getFocusedState(){const{focusedIndex:n}=this.state,t=this.props.filter!==void 0?this.props.filter:this.state.text,{allowCustom:e,dataItemKey:o,virtual:s,textField:a,focusedItemIndex:p=g.itemIndexStartsWith,skipDisabledItems:u}=this.props,r=g.getFilteredData(this.props),i=s&&s.skip||0;let l;if(n!==void 0)return{focusedIndex:n,focusedItem:r[n-i],focusedType:1};const m=this.value;if(e&&t)return{focusedItem:null,focusedIndex:-1,focusedType:2};if(t)return l=p(r,t,a),{focusedItem:r[l],focusedIndex:l+i,focusedType:1};if(m.length){const d=m[m.length-1];return l=r.findIndex(c=>g.areSame(c,d,o)),r[l]!==void 0?{focusedIndex:l+i,focusedItem:r[l],focusedType:1}:{focusedType:0,focusedIndex:-1}}else if(u&&a&&!t&&i===0){const d=r.findIndex(c=>!c.disabled&&c[a]);return{focusedIndex:d,focusedItem:r[d-i],focusedType:1}}return i===0?{focusedItem:r[0],focusedIndex:0,focusedType:1}:{focusedType:0,focusedIndex:-1}}focusElement(n){this._skipFocusEvent=!0,n.focus(),window.setTimeout(()=>this._skipFocusEvent=!1,0)}applyState(n){this.base.applyState(n),this._valueItemsDuringOnChange=null}calculateMedia(n){for(const t of n)this.setState({windowWidth:t.target.clientWidth})}updateStateOnKeyboardNavigation(n,t){this.setState({value:n}),this.triggerOnChange(n,t),this.applyState(t)}getLastSelectedOrDeselectedIndex(n,t){return this._lastSelectedOrDeslectedItemIndex===null&&(this._lastSelectedOrDeslectedItemIndex=t),this._lastSelectedOrDeslectedItemIndex!==null?this._lastSelectedOrDeslectedItemIndex+n:null}};b.displayName="MultiSelect",b.propTypes={...F.propTypes,autoClose:v.bool,value:v.arrayOf(v.any),defaultValue:v.arrayOf(v.any),dataItemKey:v.string,placeholder:v.string,tags:v.arrayOf(v.shape({text:v.string,data:v.arrayOf(v.any)})),tagRender:v.func,id:v.string,ariaLabelledBy:v.string,ariaDescribedBy:v.string,groupField:v.string,list:v.any,adaptive:v.bool,adaptiveTitle:v.string,onCancel:v.func,skipDisabledItems:v.bool,inputAttributes:v.object},b.defaultProps={...F.defaultProps,autoClose:!0,required:!1,size:"medium",rounded:"medium",fillMode:"solid",groupMode:"modern",skipDisabledItems:!0,prefix:void 0,suffix:void 0};let K=b;const N=h.createPropsContext(),R=h.withIdHOC(h.withPropsContext(N,K));R.displayName="KendoReactMultiSelect";exports.MultiSelect=R;exports.MultiSelectPropsContext=N;exports.MultiSelectWithoutContext=K;
|