@progress/kendo-react-dropdowns 11.4.0-develop.6 → 11.4.0-develop.7
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/ComboBox/ComboBox.js +1 -1
- package/ComboBox/ComboBox.mjs +52 -52
- package/DropDownList/DropDownList.js +1 -1
- package/DropDownList/DropDownList.mjs +109 -109
- package/DropDownTree/DropDownTree.js +1 -1
- package/DropDownTree/DropDownTree.mjs +175 -175
- package/MultiSelect/MultiSelect.js +1 -1
- package/MultiSelect/MultiSelect.mjs +224 -224
- package/MultiSelectTree/MultiSelectTree.js +1 -1
- package/MultiSelectTree/MultiSelectTree.mjs +95 -95
- package/dist/cdn/js/kendo-react-dropdowns.js +1 -1
- package/index.d.mts +2 -1
- package/index.d.ts +2 -1
- package/package-metadata.js +1 -1
- package/package-metadata.mjs +2 -2
- package/package.json +11 -11
package/ComboBox/ComboBox.js
CHANGED
|
@@ -5,4 +5,4 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const G=require("react"),f=require("prop-types"),E=require("../common/DropDownBase.js"),h=require("@progress/kendo-react-common"),$=require("@progress/kendo-react-labels"),p=require("../common/utils.js"),Y=require("../common/SearchBar.js"),J=require("../common/ListContainer.js"),Q=require("../common/List.js"),X=require("../common/ListFilter.js"),_=require("../common/GroupStickyHeader.js"),Z=require("../package-metadata.js"),ee=require("../common/ClearButton.js"),te=require("@progress/kendo-react-buttons"),se=require("@progress/kendo-svg-icons"),k=require("../messages/index.js"),N=require("@progress/kendo-react-intl"),ie=require("@progress/kendo-react-layout"),K=require("../common/withCustomComponent.js"),oe=require("../common/AdaptiveMode.js");function ae(w){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(w){for(const e in w)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(w,e);Object.defineProperty(s,e,t.get?t:{enumerable:!0,get:()=>w[e]})}}return s.default=w,Object.freeze(s)}const m=ae(G),ne="Please enter a valid value!",S=class S extends m.Component{constructor(s){super(s),this.state={},this.base=new E(this),this._element=null,this._suggested="",this._skipBlur=!1,this._input=null,this._adaptiveFilterInput=null,this._skipFocus=!1,this.itemHeight=0,this.duplicates=[],this.hasDuplicates=!1,this.showLicenseWatermark=!1,this.focus=()=>{this._input&&this._input.focus()},this.checkForDuplicatePlainTextRecords=()=>{const e=this.props.textField!==void 0,t=this.props.dataItemKey!==void 0;if(this.props.data&&this.props.data.length>0&&!e&&!t){const i=this.props.data;this.duplicates=p.getPlainDataDuplicates(i),this.hasDuplicates=this.duplicates.length>0}},this.handleItemSelect=(e,t)=>{const{virtual:i,dataItemKey:r}=this.props,l=p.getFilteredData(this.props),a=i?i.skip:0,d=l[e-a],n=this.hasDuplicates||!p.areSame(d,this.value,r);this.triggerOnChange(d,t),this.state.text!==void 0&&(t.data.text=void 0),n&&this.base.triggerPageChangeCornerItems(d,t)},this.onPopupOpened=()=>{setTimeout(()=>{this.mobileMode&&this._adaptiveFilterInput&&(this._skipBlur=!0,this._adaptiveFilterInput.focus(),this._skipBlur=!1)},300)},this.componentRef=e=>{this._element=e,this.base.wrapper=e},this.toggleBtnClick=e=>{this._skipFocus=!0;const{skipDisabledItems:t,textField:i}=this.props,r=p.getFilteredData(this.props),l=this.getFocusedIndex(),a=this.getCurrentValueDisabledStatus(i,r,l),d=this.props.opened!==void 0?this.props.opened:this.state.opened,n=this.base.initState();if(n.syntheticEvent=e,!t&&i&&a&&this.clearValueOnToggleBtnClick(e),this.base.togglePopup(n),!d&&this.mobileMode){const o=this.props.adaptiveFilter!==void 0?this.props.adaptiveFilter:this.state.text||null;this.base.filterChanged(o,n)}this.applyState(n),setTimeout(()=>{this._skipFocus=!1},300)},this.closeOpenedApplyStateNonMobileMode=(e,t)=>{t&&!this.mobileMode&&this.base.togglePopup(e)},this.renderMobileListFilter=()=>{const e=this.props.adaptiveFilter!==void 0?this.props.adaptiveFilter:this.state.text,t=p.getItemValue(this.value,this.props.textField),i=p.isPresent(e)?e:t;return m.createElement(X,{value:i,ref:r=>{this._adaptiveFilterInput=r&&r.element},onChange:this.handleMobileFilterChange,onKeyDown:this.onInputKeyDown,size:"large",rounded:this.props.rounded,fillMode:this.props.fillMode,placeholder:this.props.placeholder})},this.listContainerContent=()=>{const{header:e,footer:t,size:i,groupStickyHeaderItemRender:r,groupField:l,list:a,groupMode:d,unstyled:n,virtual:o}=this.props,g=p.getFilteredData(this.props),u=n&&n.uComboBox;let{group:b}=this.state;return b===void 0&&l!==void 0&&(b=p.getItemValue(g[0],l)),m.createElement("div",{className:h.classNames(h.uComboBox.list({c:u,list:a,size:"large",tableSize:i,virtual:o}))},e&&m.createElement("div",{className:h.classNames(h.uComboBox.listHeader({c:u}))},e),!a&&b&&g.length!==0&&m.createElement(_,{group:b,groupMode:d,render:r}),this.renderList(),t&&m.createElement("div",{className:h.classNames(h.uComboBox.listFooter({c:u}),this.props.footerClassName)},t))},this.handleMobileFilterChange=e=>{const t=this.base.initState();t.syntheticEvent=e.syntheticEvent,t.data.text=e.target.value,this.base.filterChanged(e.target.value,t),this.applyState(t)},this.onScroll=e=>{const{vs:t,list:i}=this.base;t.scrollHandler(e);const{groupField:r}=this.props;let l=p.getFilteredData(this.props);if(!r||!l.length)return;const a=this.itemHeight=this.itemHeight||(t.enabled?t.itemHeight:i?i.children[0].offsetHeight:0),n=e.target.scrollTop-t.skip*a;this.props.groupMode==="modern"&&(l=this.base.getGroupedDataModernMode(l,r));let o=l[0][r];for(let g=1;g<l.length&&!(a*g>n);g++)l[g]&&l[g][r]&&(o=l[g][r]);o!==this.state.group&&(this.setState({group:o}),this.props.onGroupScroll&&this.props.onGroupScroll.call(void 0,{group:o}))},this.handleItemClick=(e,t)=>{this.navigationIndex=e,this.base.handleItemClick(e,t),this._valueDuringOnChange=void 0},this.handleBlur=e=>{if(this.state.focused&&!this._skipBlur){const t=this.base.initState(),{textField:i}=this.props,r=p.getFilteredData(this.props),l=this.getFocusedIndex(),d=!(l===-1)&&this.getCurrentValueDisabledStatus(i,r,l);t.data.focused=!1,t.events.push({type:"onBlur"}),t.syntheticEvent=e,i&&d&&this.clearValueOnBlur(e),this.applyValueOnRejectSuggestions(e.currentTarget.value,t)}},this.onInputClick=e=>{const t=this.props.opened!==void 0?this.props.opened:this.state.opened,i=this.props.adaptiveFilter!==void 0?this.props.adaptiveFilter:this.state.text||null;if(!t&&this.mobileMode){const r=this.base.initState();r.syntheticEvent=e,this.base.togglePopup(r),this.base.filterChanged(i,r),this.applyState(r)}},this.onInputKeyDown=e=>{const{skipDisabledItems:t,textField:i,dataItemKey:r,groupField:l}=this.props,a=p.getFilteredData(this.props),d=this.value,n=Math.max(0,a.findIndex(c=>p.areSame(c,d,r))),o=e.keyCode,g=this.props.opened!==void 0?this.props.opened:this.state.opened,u=this.base.initState();if(u.syntheticEvent=e,!e.altKey&&(o===h.Keys.up||o===h.Keys.down)){if(e.preventDefault(),l!==""&&i)if(!this.props.skipDisabledItems&&g)this.onNavigate(u,o);else{let c=0;if(o===h.Keys.down||o===h.Keys.right){const v=a.slice(n+1<a.length?n+1:n).find(x=>!x.disabled&&x[i]);c=v&&a.findIndex(x=>x[i]===v[i])}else if(o===h.Keys.up||o===h.Keys.left){let v;if(n===0)v=a,c=a.findIndex(x=>!x.disabled&&x[i]);else{v=a.slice(0,n);let x=v.pop();for(;x&&x.disabled;)x=v.pop();c=x&&a.findIndex(D=>D[i]===x[i])}}if(c!==void 0){const v=c-n;this.onNavigate(u,o,v)}else c===void 0&&a.findIndex(v=>v[i]===d[i])===a.length-1&&this.onNavigate(u,o)}else if(!this.props.skipDisabledItems&&g)this.onNavigate(u,o);else{let c=null;if(o===h.Keys.down||o===h.Keys.right)c=a.slice(n+1).find(v=>!v.disabled);else if(o===h.Keys.up||o===h.Keys.left){const v=a.slice(0,n);for(c=v.pop();c&&c.disabled;)c=v.pop()}if(c){const v=c.id-n-1;this.onNavigate(u,o,v)}else this.onNavigate(u,o)}this.applyState(u)}const b=()=>{e.preventDefault(),this.base.togglePopup(u),this.applyState(u)},y=this.getFocusedIndex(),I=y===-1,C=!I&&this.getCurrentValueDisabledStatus(i,a,y);g?o===h.Keys.pageUp?(e.preventDefault(),this.base.scrollPopupByPageSize(-1)):o===h.Keys.pageDown?(e.preventDefault(),this.base.scrollPopupByPageSize(1)):e.altKey&&o===h.Keys.up?b():o===h.Keys.enter?(e.preventDefault(),(i&&!I&&e.currentTarget.value?a[y][i]:void 0)?!t&&i&&C?this.clearValueOnEnterOrEsc(e):C||this.applyValueOnEnter(e.currentTarget.value,u):this.applyValueOnEnter(e.currentTarget.value,u)):o===h.Keys.esc&&(!t&&i&&C&&this.clearValueOnEnterOrEsc(e),this.applyValueOnRejectSuggestions(e.currentTarget.value,u)):!g&&o===h.Keys.esc?this.clearValueOnEnterOrEsc(e):e.altKey&&o===h.Keys.down&&b()},this.inputOnChange=e=>{const t=this.base.initState();t.syntheticEvent=e;const i=this.props.opened!==void 0?this.props.opened:this.state.opened,r=e.currentTarget,l=r.value;if(this.props.suggest){const a=r.selectionEnd===l.length;let d=this.props.filter!==void 0?this.props.filter:this.state.text;p.isPresent(d)||(d=p.getItemValue(this.value,this.props.textField)||"");const n=d&&d===l,o=d&&d.length>l.length;n||o||!a?this._suggested="":this.suggestValue(l)}this.props.filter===void 0&&(t.data.text=l),this.state.focusedItem!==void 0&&(t.data.focusedItem=void 0),i||this.base.togglePopup(t),this.base.filterChanged(l,t),this.applyState(t),this.setState({group:void 0})},this.clearButtonClick=e=>{const t=this.base.initState();t.syntheticEvent=e,e.stopPropagation(),this.clearValue()},this.clearValueOnEnterOrEsc=e=>{const t=this.base.initState();t.syntheticEvent=e,e.stopPropagation(),this.clearValue()},this.clearValueOnBlur=e=>{const t=this.base.initState();t.syntheticEvent=e,e.stopPropagation(),this.clearValue()},this.clearValueOnToggleBtnClick=e=>{const t=this.base.initState();t.syntheticEvent=e,e.stopPropagation(),this.clearValue()},this.setValidity=()=>{this._input&&this._input.setCustomValidity&&this._input.setCustomValidity(this.validity.valid?"":this.props.validationMessage||ne)},this.handleFocus=e=>{if(this._skipFocus)return;const t=this.base.initState();t.syntheticEvent=e,this.mobileMode&&!this._skipFocus&&(this._skipFocus=!0,this.base.togglePopup(t),this.applyState(t),setTimeout(()=>{this._skipFocus=!1},300)),this.base.handleFocus(e)},this.showLicenseWatermark=!h.validatePackage(Z.packageMetadata,{component:"ComboBox"})}get _inputId(){return this.props.id}get document(){if(h.canUseDOM)return this.element&&this.element.ownerDocument||document}get element(){return this._element}get mobileMode(){var e;return!!(this.state.windowWidth&&this.props._adaptiveMode&&this.state.windowWidth<=((e=this.props._adaptiveMode)==null?void 0:e.medium)&&this.props.adaptive)}get value(){if(this._valueDuringOnChange!==void 0)return this._valueDuringOnChange;if(this.props.value!==void 0)return this.props.value;if(this.state.value!==void 0)return this.state.value;if(this.props.defaultValue!==void 0)return this.props.defaultValue}get index(){const{dataItemKey:s}=this.props,e=p.getFilteredData(this.props),t=this.value;return e.findIndex(i=>p.areSame(i,t,s))}get name(){return this.props.name}get validity(){const s=this.props.validationMessage!==void 0,e=!this.required||this.value!==null&&this.value!==""&&this.value!==void 0,t=this.props.valid!==void 0?this.props.valid:e;return{customError:s,valid:t,valueMissing:this.value===null}}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:S.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:S.defaultProps.required}componentDidUpdate(s,e){var b;const{dataItemKey:t,virtual:i,groupField:r="",textField:l}=this.props,a=p.getFilteredData(this.props),d=s.virtual?s.virtual.total:0,n=this.props.opened!==void 0?this.props.opened:this.state.opened,o=s.opened!==void 0?s.opened:e.opened;s.data!==a&&this.checkForDuplicatePlainTextRecords();const g=!o&&n,u=this.value;if(this._valueOnDidUpdate=u,this.base.didUpdate(),i&&i.total!==d)this.base.vs.calcScrollElementHeight(),this.base.vs.reset();else{const y=s.value!==void 0?s.value:e.value;let I=this.hasDuplicates?this.navigationIndex||0:a.findIndex(c=>p.areSame(c,u,t));this.props.groupMode==="modern"&&l&&u&&(I=(b=this.base.getGroupedDataModernMode(a,r))==null?void 0:b.map(c=>c[l]).indexOf(u[l]));const C=!p.areSame(y,u,t);g&&i?this.base.scrollToVirtualItem(i,I):g&&!i?(this.onPopupOpened(),a&&a.length!==0&&this.base.resetGroupStickyHeader(a[0][r],this),this.base.scrollToItem(I)):(this.hasDuplicates||n&&o&&u&&C)&&this.base.scrollToItem(I)}g&&this._input&&this._input.focus(),this.setValidity()}componentDidMount(){var s;this.observerResize=h.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.base.didMount(),this.setValidity(),(s=this.document)!=null&&s.body&&this.observerResize&&this.observerResize.observe(this.document.body),this.checkForDuplicatePlainTextRecords()}componentWillUnmount(){var s;(s=this.document)!=null&&s.body&&this.observerResize&&this.observerResize.disconnect()}render(){const s=N.provideLocalizationService(this).toLanguageString(k.comboArrowBtnAriaLabelExpand,k.messages[k.comboArrowBtnAriaLabelExpand]),e=N.provideLocalizationService(this).toLanguageString(k.comboArrowBtnAriaLabelCollapse,k.messages[k.comboArrowBtnAriaLabelCollapse]),{dir:t,disabled:i,clearButton:r=S.defaultProps.clearButton,label:l,textField:a,className:d,style:n,loading:o,iconClassName:g,virtual:u,size:b,rounded:y,fillMode:I,opened:C=this.state.opened,placeholder:c,svgIcon:v,unstyled:x}=this.props,D=!this.validityStyles||this.validity.valid,F=this.props.filter!==void 0?this.props.filter:this.state.text,q=p.getItemValue(this.value,a),O=p.isPresent(F)?F:q,A=r&&(!!O||p.isPresent(this.value)),B=this.base.vs,P=this.props.id||this._inputId,V=x&&x.uComboBox;B.enabled=u!==void 0,u!==void 0&&(B.skip=u.skip,B.total=u.total,B.pageSize=u.pageSize);const[z,H]=K(this.props.prefix||m.Fragment),[W,j]=K(this.props.suffix||m.Fragment),T=m.createElement(m.Fragment,null,m.createElement("span",{className:h.classNames(h.uComboBox.wrapper({c:V,size:b,rounded:y,fillMode:I,disabled:i,invalid:!D,loading:o,required:this.required}),d),ref:this.componentRef,style:l?{...n,width:void 0}:n,dir:t,onFocus:this.handleFocus},this.props.prefix&&m.createElement(z,{...H}),this.renderSearchBar(O||"",P,c),A&&!o&&m.createElement(ee,{onClick:this.clearButtonClick,key:"clearbutton"}),o&&m.createElement(h.IconWrap,{className:h.classNames(h.uComboBox.loadingIcon({c:V})),name:"loading",key:"loading"}),this.props.suffix&&m.createElement(W,{...j}),m.createElement(te.Button,{tabIndex:-1,type:"button","aria-label":C?e:s,icon:g?void 0:"caret-alt-down",svgIcon:v||se.caretAltDownIcon,iconClass:g,size:b,fillMode:I,rounded:null,themeColor:"base",className:h.classNames(h.uComboBox.inputButton({c:V})),onClick:this.toggleBtnClick,onMouseDown:U=>U.preventDefault()}),!this.mobileMode&&this.renderListContainer()),this.mobileMode&&this.renderAdaptiveListContainer());return l?m.createElement($.FloatingLabel,{label:l,editorId:P,editorValue:O,editorValid:D,editorDisabled:i,style:{width:n?n.width:void 0},children:T,unstyled:x}):T}onNavigate(s,e,t){const{virtual:i={skip:0}}=this.props,r=p.getFilteredData(this.props),l=this.props.filter?this.props.filter:this.state.text;let a=-1,d;const n=this.base.vs,o=this.value;this._suggested="";const g=this.hasDuplicates&&this.duplicates.indexOf(o)!==-1;if(a=this.getFocusedIndex(g),a!==-1&&!p.isPresent(o))this.handleItemSelect(a,s);else if(l==="")this.handleItemSelect(0,s);else{const u=i.skip+a;d=this.base.navigation.navigate({keyCode:e,current:u,max:(n.enabled?n.total:r.length)-1,min:0,skipItems:t||void 0}),d!==void 0&&this.handleItemSelect(d,s)}this.navigationIndex=d}getCurrentValueDisabledStatus(s,e,t){return s&&e&&e[t]&&e[t].disabled}applyValueOnEnter(s,e){const{textField:t,allowCustom:i}=this.props,r=p.getFilteredData(this.props),l=this.props.opened!==void 0?this.props.opened:this.state.opened,d=p.getItemValue(this.value,t)===s?this.index:p.getItemIndexByText(r,s,t),n=d!==-1;let o;if(this._suggested="",n)o=r[d];else if(i)o=t!==void 0?{[t]:s}:s;else return this.selectFocusedItem(s,e);this.triggerOnChange(o,e),l&&this.base.togglePopup(e),this.props.filter===void 0&&this.state.text!==void 0&&(e.data.text=void 0),this.applyState(e)}applyValueOnRejectSuggestions(s,e){const{textField:t,allowCustom:i}=this.props,r=p.getFilteredData(this.props),l=this.props.opened!==void 0?this.props.opened:this.state.opened,a=p.getItemValue(this.value,t);if(this._suggested="",s===a||s===""&&!p.isPresent(a))return this.closeOpenedApplyStateNonMobileMode(e,l),this.applyState(e);const d=p.getItemIndexByText(r,s,t,!0),n=d!==-1;let o=null;n?o=r[d]:i&&(o=s?t?{[t]:s}:s:null),this.triggerOnChange(o,e),this.state.text!==void 0&&(e.data.text=void 0,this.base.filterChanged("",e)),this.closeOpenedApplyStateNonMobileMode(e,l),this.applyState(e)}selectFocusedItem(s,e){const t=this.props.opened!==void 0?this.props.opened:this.state.opened,{textField:i,virtual:r={skip:0},focusedItemIndex:l=p.itemIndexStartsWith}=this.props,a=p.getFilteredData(this.props),d=r.skip,n=s===""&&d===0?0:l(a,s,i);return n!==-1?this.handleItemSelect(n+d,e):(this.triggerOnChange(null,e),this.state.text!==void 0&&(e.data.text=void 0)),t&&this.base.togglePopup(e),this.applyState(e)}renderAdaptiveListContainer(){const{windowWidth:s=0}=this.state,{groupField:e,adaptiveTitle:t=this.props.label,adaptiveSubtitle:i}=this.props,r=p.getFilteredData(this.props),l=this.props.opened!==void 0?this.props.opened:this.state.opened;let{group:a}=this.state;a===void 0&&e!==void 0&&(a=p.getItemValue(r[0],e));const d={title:t||this.props.label,subTitle:i,expand:l,onClose:n=>this.toggleBtnClick(n),windowWidth:s,mobileFilter:this.renderMobileListFilter()};return m.createElement(oe.AdaptiveMode,{...d},m.createElement(ie.ActionSheetContent,null,m.createElement("div",{className:"k-list-container"},this.listContainerContent())))}renderListContainer(){const s=this.base,{dir:e,header:t,footer:i,groupField:r,groupMode:l,size:a,list:d,virtual:n,groupStickyHeaderItemRender:o,unstyled:g}=this.props,u=p.getFilteredData(this.props),b=this.props.opened!==void 0?this.props.opened:this.state.opened,y=s.getPopupSettings(),I=y.width!==void 0?y.width:s.popupWidth,C=g&&g.uComboBox;let{group:c}=this.state;return c===void 0&&r!==void 0&&(c=p.getItemValue(u[0],r)),m.createElement(J,{width:I,popupSettings:{...y,anchor:y.anchor||this.element,show:b,popupClass:h.classNames(y.popupClass,h.uComboBox.listContainer({c:C,popup:!0}))},dir:e!==void 0?e:this.base.dirCalculated,itemsCount:[u.length]},m.createElement("div",{className:h.classNames(h.uComboBox.list({c:C,list:d,size:a,tableSize:a,virtual:n}))},t&&m.createElement("div",{className:h.classNames(h.uComboBox.listHeader({c:C}))},t),!d&&c&&u.length!==0&&m.createElement(_,{group:c,groupMode:l,render:o}),this.renderList(),i&&m.createElement("div",{className:h.classNames(h.uComboBox.listFooter({c:C}),this.props.footerClassName)},i)),this.showLicenseWatermark&&m.createElement(h.WatermarkOverlay,null))}renderList(){const s=this.base,{textField:e,dataItemKey:t,listNoDataRender:i,itemRender:r,groupHeaderItemRender:l,virtual:a={skip:0,total:void 0},unstyled:d}=this.props,n=p.getFilteredData(this.props),o=s.getPopupSettings(),g=s.vs,u=a.skip,b=this.props.opened!==void 0?this.props.opened:this.state.opened,y=`translateY(${g.translate}px)`,I=b?this.getFocusedIndex(this.hasDuplicates):void 0,C=this.props.filter!==void 0?this.props.filter:this.state.text,c=p.getItemValue(this.value,e),v=p.isPresent(C)&&C!==c?null:this.value,x=this.props.list||Q,D=d&&d.uComboBox;return m.createElement(x,{id:s.listBoxId,virtual:!!a,show:b,data:n,focusedIndex:I,value:v,textField:e,valueField:t,groupField:this.props.groupField,groupMode:this.props.groupMode,isMultiColumn:this.props.isMultiColumn,optionsGuid:s.guid,hasDuplicates:this.hasDuplicates,listRef:F=>{g.list=this.base.list=F,this.itemHeight=0},wrapperStyle:this.state.windowWidth&&this.props._adaptiveMode&&this.state.windowWidth>this.props._adaptiveMode.medium?{maxHeight:o.height}:{},wrapperCssClass:h.classNames(h.uComboBox.listContent({c:D,virtual:a})),listStyle:g.enabled?{transform:y}:void 0,key:"listkey",skip:u,onClick:this.handleItemClick,itemRender:r,groupHeaderItemRender:l,noDataRender:i,onMouseDown:F=>F.preventDefault(),onScroll:this.onScroll,wrapperRef:g.scrollerRef,scroller:this.base.renderScrollElement(),ariaSetSize:a.total})}renderSearchBar(s,e,t){const{tabIndex:i,disabled:r,title:l,ariaLabelledBy:a,ariaDescribedBy:d,dataItemKey:n,virtual:o={skip:0},unstyled:g,inputAttributes:u}=this.props,b=p.getFilteredData(this.props),y=this.props.opened!==void 0?this.props.opened:this.state.opened,I=this.value,C=Math.max(0,b.findIndex(c=>p.areSame(c,I,n)));return this._suggested&&!p.areSame(this._valueOnDidUpdate,I,n)&&(this._suggested=""),m.createElement(Y,{id:e,readOnly:y&&this.mobileMode,placeholder:t,tabIndex:i,title:l,value:s+this._suggested,suggestedText:this._suggested,ref:c=>{this._input=c&&c.input},onClick:this.onInputClick,onKeyDown:this.onInputKeyDown,onChange:this.inputOnChange,onFocus:this.base.handleFocus,onBlur:this.handleBlur,disabled:r,expanded:y,owns:this.base.listBoxId,activedescendant:`option-${this.base.guid}-${C+o.skip}`,role:"combobox",ariaLabelledBy:a,ariaLabel:this.props.ariaLabel,ariaDescribedBy:d,ariaRequired:this.required,render:this.props.valueRender,ariaControls:this.base.listBoxId,unstyled:g,inputAttributes:u})}clearValue(){const s=this.base.initState();this._suggested="",this.navigationIndex=void 0,this.base.filterChanged("",s),this.props.filter===void 0&&this.state.text!==void 0&&(s.data.text=void 0),this.triggerOnChange(null,s);const e=this.props.opened!==void 0?this.props.opened:this.state.opened,t=this.mobileMode;e&&!t&&this.base.togglePopup(s),this.applyState(s)}triggerOnChange(s,e){const t=this.value;!this.hasDuplicates&&(!p.isPresent(t)&&!p.isPresent(s)||p.areSame(t,s,this.props.dataItemKey))||(this.props.value===void 0&&(e.data.value=s),this._valueDuringOnChange=s,e.events.push({type:"onChange"}))}getFocusedIndex(s){const e=this.value,{textField:t,dataItemKey:i,virtual:r={skip:0},focusedItemIndex:l=p.itemIndexStartsWith,skipDisabledItems:a}=this.props,d=p.getFilteredData(this.props),n=this.props.filter?this.props.filter:this.state.text;return s&&this.navigationIndex!==void 0?this.navigationIndex:p.isPresent(e)&&n===void 0?d.findIndex(o=>p.areSame(o,e,i)):n?l(d,n,t):a&&t&&!n&&r.skip===0?d.findIndex(o=>!o.disabled&&o[t]):r.skip===0?0:-1}suggestValue(s){const{data:e,textField:t}=this.props;this._suggested=p.suggestValue(s,e,t)}applyState(s){this.base.applyState(s),this._valueDuringOnChange=void 0}calculateMedia(s){for(const e of s)this.setState({windowWidth:e.target.clientWidth})}};S.displayName="ComboBox",S.propTypes={...E.propTypes,size:f.oneOf([null,"small","medium","large"]),rounded:f.oneOf([null,"small","medium","large","full"]),fillMode:f.oneOf([null,"solid","flat","outline"]),dataItemKey:f.string,groupField:f.string,groupMode:f.oneOf([void 0,"classic","modern"]),isMultiColumn:f.bool,suggest:f.bool,placeholder:f.string,title:f.string,allowCustom:f.bool,clearButton:f.bool,iconClassName:f.string,svgIcon:h.svgIconPropType,validationMessage:f.string,required:f.bool,id:f.string,ariaLabelledBy:f.string,ariaLabel:f.string,ariaDescribedBy:f.string,list:f.any,valueRender:f.func,skipDisabledItems:f.bool,inputAttributes:f.object},S.defaultProps={...E.defaultProps,size:"medium",rounded:"medium",fillMode:"solid",allowCustom:!1,clearButton:!0,required:!1,groupMode:"modern",isMultiColumn:!1,skipDisabledItems:!0,prefix:void 0,suffix:void 0};let M=S;const L=h.createPropsContext(),R=h.withIdHOC(h.withPropsContext(L,h.withUnstyledHOC(h.withAdaptiveModeContext(M))));R.displayName="KendoReactComboBox";exports.ComboBox=R;exports.ComboBoxPropsContext=L;exports.ComboBoxWithoutContext=M;
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const $=require("react"),f=require("prop-types"),E=require("../common/DropDownBase.js"),h=require("@progress/kendo-react-common"),Y=require("@progress/kendo-react-labels"),p=require("../common/utils.js"),J=require("../common/SearchBar.js"),Q=require("../common/ListContainer.js"),X=require("../common/List.js"),Z=require("../common/ListFilter.js"),_=require("../common/GroupStickyHeader.js"),N=require("../package-metadata.js"),ee=require("../common/ClearButton.js"),te=require("@progress/kendo-react-buttons"),se=require("@progress/kendo-svg-icons"),k=require("../messages/index.js"),K=require("@progress/kendo-react-intl"),ie=require("@progress/kendo-react-layout"),L=require("../common/withCustomComponent.js"),oe=require("../common/AdaptiveMode.js");function ae(w){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(w){for(const e in w)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(w,e);Object.defineProperty(s,e,t.get?t:{enumerable:!0,get:()=>w[e]})}}return s.default=w,Object.freeze(s)}const m=ae($),ne="Please enter a valid value!",S=class S extends m.Component{constructor(s){super(s),this.state={},this.base=new E(this),this._element=null,this._suggested="",this._skipBlur=!1,this._input=null,this._adaptiveFilterInput=null,this._skipFocus=!1,this.itemHeight=0,this.duplicates=[],this.hasDuplicates=!1,this.showLicenseWatermark=!1,this.focus=()=>{this._input&&this._input.focus()},this.checkForDuplicatePlainTextRecords=()=>{const e=this.props.textField!==void 0,t=this.props.dataItemKey!==void 0;if(this.props.data&&this.props.data.length>0&&!e&&!t){const i=this.props.data;this.duplicates=p.getPlainDataDuplicates(i),this.hasDuplicates=this.duplicates.length>0}},this.handleItemSelect=(e,t)=>{const{virtual:i,dataItemKey:r}=this.props,l=p.getFilteredData(this.props),a=i?i.skip:0,d=l[e-a],n=this.hasDuplicates||!p.areSame(d,this.value,r);this.triggerOnChange(d,t),this.state.text!==void 0&&(t.data.text=void 0),n&&this.base.triggerPageChangeCornerItems(d,t)},this.onPopupOpened=()=>{setTimeout(()=>{this.mobileMode&&this._adaptiveFilterInput&&(this._skipBlur=!0,this._adaptiveFilterInput.focus(),this._skipBlur=!1)},300)},this.componentRef=e=>{this._element=e,this.base.wrapper=e},this.toggleBtnClick=e=>{this._skipFocus=!0;const{skipDisabledItems:t,textField:i}=this.props,r=p.getFilteredData(this.props),l=this.getFocusedIndex(),a=this.getCurrentValueDisabledStatus(i,r,l),d=this.props.opened!==void 0?this.props.opened:this.state.opened,n=this.base.initState();if(n.syntheticEvent=e,!t&&i&&a&&this.clearValueOnToggleBtnClick(e),this.base.togglePopup(n),!d&&this.mobileMode){const o=this.props.adaptiveFilter!==void 0?this.props.adaptiveFilter:this.state.text||null;this.base.filterChanged(o,n)}this.applyState(n),setTimeout(()=>{this._skipFocus=!1},300)},this.closeOpenedApplyStateNonMobileMode=(e,t)=>{t&&!this.mobileMode&&this.base.togglePopup(e)},this.renderMobileListFilter=()=>{const e=this.props.adaptiveFilter!==void 0?this.props.adaptiveFilter:this.state.text,t=p.getItemValue(this.value,this.props.textField),i=p.isPresent(e)?e:t;return m.createElement(Z,{value:i,ref:r=>{this._adaptiveFilterInput=r&&r.element},onChange:this.handleMobileFilterChange,onKeyDown:this.onInputKeyDown,size:"large",rounded:this.props.rounded,fillMode:this.props.fillMode,placeholder:this.props.placeholder})},this.listContainerContent=()=>{const{header:e,footer:t,size:i,groupStickyHeaderItemRender:r,groupField:l,list:a,groupMode:d,unstyled:n,virtual:o}=this.props,g=p.getFilteredData(this.props),u=n&&n.uComboBox;let{group:b}=this.state;return b===void 0&&l!==void 0&&(b=p.getItemValue(g[0],l)),m.createElement("div",{className:h.classNames(h.uComboBox.list({c:u,list:a,size:"large",tableSize:i,virtual:o}))},e&&m.createElement("div",{className:h.classNames(h.uComboBox.listHeader({c:u}))},e),!a&&b&&g.length!==0&&m.createElement(_,{group:b,groupMode:d,render:r}),this.renderList(),t&&m.createElement("div",{className:h.classNames(h.uComboBox.listFooter({c:u}),this.props.footerClassName)},t))},this.handleMobileFilterChange=e=>{const t=this.base.initState();t.syntheticEvent=e.syntheticEvent,t.data.text=e.target.value,this.base.filterChanged(e.target.value,t),this.applyState(t)},this.onScroll=e=>{const{vs:t,list:i}=this.base;t.scrollHandler(e);const{groupField:r}=this.props;let l=p.getFilteredData(this.props);if(!r||!l.length)return;const a=this.itemHeight=this.itemHeight||(t.enabled?t.itemHeight:i?i.children[0].offsetHeight:0),n=e.target.scrollTop-t.skip*a;this.props.groupMode==="modern"&&(l=this.base.getGroupedDataModernMode(l,r));let o=l[0][r];for(let g=1;g<l.length&&!(a*g>n);g++)l[g]&&l[g][r]&&(o=l[g][r]);o!==this.state.group&&(this.setState({group:o}),this.props.onGroupScroll&&this.props.onGroupScroll.call(void 0,{group:o}))},this.handleItemClick=(e,t)=>{this.navigationIndex=e,this.base.handleItemClick(e,t),this._valueDuringOnChange=void 0},this.handleBlur=e=>{if(this.state.focused&&!this._skipBlur){const t=this.base.initState(),{textField:i}=this.props,r=p.getFilteredData(this.props),l=this.getFocusedIndex(),d=!(l===-1)&&this.getCurrentValueDisabledStatus(i,r,l);t.data.focused=!1,t.events.push({type:"onBlur"}),t.syntheticEvent=e,i&&d&&this.clearValueOnBlur(e),this.applyValueOnRejectSuggestions(e.currentTarget.value,t)}},this.onInputClick=e=>{const t=this.props.opened!==void 0?this.props.opened:this.state.opened,i=this.props.adaptiveFilter!==void 0?this.props.adaptiveFilter:this.state.text||null;if(!t&&this.mobileMode){const r=this.base.initState();r.syntheticEvent=e,this.base.togglePopup(r),this.base.filterChanged(i,r),this.applyState(r)}},this.onInputKeyDown=e=>{const{skipDisabledItems:t,textField:i,dataItemKey:r,groupField:l}=this.props,a=p.getFilteredData(this.props),d=this.value,n=Math.max(0,a.findIndex(c=>p.areSame(c,d,r))),o=e.keyCode,g=this.props.opened!==void 0?this.props.opened:this.state.opened,u=this.base.initState();if(u.syntheticEvent=e,!e.altKey&&(o===h.Keys.up||o===h.Keys.down)){if(e.preventDefault(),l!==""&&i)if(!this.props.skipDisabledItems&&g)this.onNavigate(u,o);else{let c=0;if(o===h.Keys.down||o===h.Keys.right){const v=a.slice(n+1<a.length?n+1:n).find(x=>!x.disabled&&x[i]);c=v&&a.findIndex(x=>x[i]===v[i])}else if(o===h.Keys.up||o===h.Keys.left){let v;if(n===0)v=a,c=a.findIndex(x=>!x.disabled&&x[i]);else{v=a.slice(0,n);let x=v.pop();for(;x&&x.disabled;)x=v.pop();c=x&&a.findIndex(D=>D[i]===x[i])}}if(c!==void 0){const v=c-n;this.onNavigate(u,o,v)}else c===void 0&&a.findIndex(v=>v[i]===d[i])===a.length-1&&this.onNavigate(u,o)}else if(!this.props.skipDisabledItems&&g)this.onNavigate(u,o);else{let c=null;if(o===h.Keys.down||o===h.Keys.right)c=a.slice(n+1).find(v=>!v.disabled);else if(o===h.Keys.up||o===h.Keys.left){const v=a.slice(0,n);for(c=v.pop();c&&c.disabled;)c=v.pop()}if(c){const v=c.id-n-1;this.onNavigate(u,o,v)}else this.onNavigate(u,o)}this.applyState(u)}const b=()=>{e.preventDefault(),this.base.togglePopup(u),this.applyState(u)},y=this.getFocusedIndex(),I=y===-1,C=!I&&this.getCurrentValueDisabledStatus(i,a,y);g?o===h.Keys.pageUp?(e.preventDefault(),this.base.scrollPopupByPageSize(-1)):o===h.Keys.pageDown?(e.preventDefault(),this.base.scrollPopupByPageSize(1)):e.altKey&&o===h.Keys.up?b():o===h.Keys.enter?(e.preventDefault(),(i&&!I&&e.currentTarget.value?a[y][i]:void 0)?!t&&i&&C?this.clearValueOnEnterOrEsc(e):C||this.applyValueOnEnter(e.currentTarget.value,u):this.applyValueOnEnter(e.currentTarget.value,u)):o===h.Keys.esc&&(!t&&i&&C&&this.clearValueOnEnterOrEsc(e),this.applyValueOnRejectSuggestions(e.currentTarget.value,u)):!g&&o===h.Keys.esc?this.clearValueOnEnterOrEsc(e):e.altKey&&o===h.Keys.down&&b()},this.inputOnChange=e=>{const t=this.base.initState();t.syntheticEvent=e;const i=this.props.opened!==void 0?this.props.opened:this.state.opened,r=e.currentTarget,l=r.value;if(this.props.suggest){const a=r.selectionEnd===l.length;let d=this.props.filter!==void 0?this.props.filter:this.state.text;p.isPresent(d)||(d=p.getItemValue(this.value,this.props.textField)||"");const n=d&&d===l,o=d&&d.length>l.length;n||o||!a?this._suggested="":this.suggestValue(l)}this.props.filter===void 0&&(t.data.text=l),this.state.focusedItem!==void 0&&(t.data.focusedItem=void 0),i||this.base.togglePopup(t),this.base.filterChanged(l,t),this.applyState(t),this.setState({group:void 0})},this.clearButtonClick=e=>{const t=this.base.initState();t.syntheticEvent=e,e.stopPropagation(),this.clearValue()},this.clearValueOnEnterOrEsc=e=>{const t=this.base.initState();t.syntheticEvent=e,e.stopPropagation(),this.clearValue()},this.clearValueOnBlur=e=>{const t=this.base.initState();t.syntheticEvent=e,e.stopPropagation(),this.clearValue()},this.clearValueOnToggleBtnClick=e=>{const t=this.base.initState();t.syntheticEvent=e,e.stopPropagation(),this.clearValue()},this.setValidity=()=>{this._input&&this._input.setCustomValidity&&this._input.setCustomValidity(this.validity.valid?"":this.props.validationMessage||ne)},this.handleFocus=e=>{if(this._skipFocus)return;const t=this.base.initState();t.syntheticEvent=e,this.mobileMode&&!this._skipFocus&&(this._skipFocus=!0,this.base.togglePopup(t),this.applyState(t),setTimeout(()=>{this._skipFocus=!1},300)),this.base.handleFocus(e)},this.showLicenseWatermark=!h.validatePackage(N.packageMetadata,{component:"ComboBox"}),this.licenseMessage=h.getLicenseMessage(N.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 mobileMode(){var e;return!!(this.state.windowWidth&&this.props._adaptiveMode&&this.state.windowWidth<=((e=this.props._adaptiveMode)==null?void 0:e.medium)&&this.props.adaptive)}get value(){if(this._valueDuringOnChange!==void 0)return this._valueDuringOnChange;if(this.props.value!==void 0)return this.props.value;if(this.state.value!==void 0)return this.state.value;if(this.props.defaultValue!==void 0)return this.props.defaultValue}get index(){const{dataItemKey:s}=this.props,e=p.getFilteredData(this.props),t=this.value;return e.findIndex(i=>p.areSame(i,t,s))}get name(){return this.props.name}get validity(){const s=this.props.validationMessage!==void 0,e=!this.required||this.value!==null&&this.value!==""&&this.value!==void 0,t=this.props.valid!==void 0?this.props.valid:e;return{customError:s,valid:t,valueMissing:this.value===null}}get validityStyles(){return this.props.validityStyles!==void 0?this.props.validityStyles:S.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:S.defaultProps.required}componentDidUpdate(s,e){var b;const{dataItemKey:t,virtual:i,groupField:r="",textField:l}=this.props,a=p.getFilteredData(this.props),d=s.virtual?s.virtual.total:0,n=this.props.opened!==void 0?this.props.opened:this.state.opened,o=s.opened!==void 0?s.opened:e.opened;s.data!==a&&this.checkForDuplicatePlainTextRecords();const g=!o&&n,u=this.value;if(this._valueOnDidUpdate=u,this.base.didUpdate(),i&&i.total!==d)this.base.vs.calcScrollElementHeight(),this.base.vs.reset();else{const y=s.value!==void 0?s.value:e.value;let I=this.hasDuplicates?this.navigationIndex||0:a.findIndex(c=>p.areSame(c,u,t));this.props.groupMode==="modern"&&l&&u&&(I=(b=this.base.getGroupedDataModernMode(a,r))==null?void 0:b.map(c=>c[l]).indexOf(u[l]));const C=!p.areSame(y,u,t);g&&i?this.base.scrollToVirtualItem(i,I):g&&!i?(this.onPopupOpened(),a&&a.length!==0&&this.base.resetGroupStickyHeader(a[0][r],this),this.base.scrollToItem(I)):(this.hasDuplicates||n&&o&&u&&C)&&this.base.scrollToItem(I)}g&&this._input&&this._input.focus(),this.setValidity()}componentDidMount(){var s;this.observerResize=h.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.base.didMount(),this.setValidity(),(s=this.document)!=null&&s.body&&this.observerResize&&this.observerResize.observe(this.document.body),this.checkForDuplicatePlainTextRecords()}componentWillUnmount(){var s;(s=this.document)!=null&&s.body&&this.observerResize&&this.observerResize.disconnect()}render(){const s=K.provideLocalizationService(this).toLanguageString(k.comboArrowBtnAriaLabelExpand,k.messages[k.comboArrowBtnAriaLabelExpand]),e=K.provideLocalizationService(this).toLanguageString(k.comboArrowBtnAriaLabelCollapse,k.messages[k.comboArrowBtnAriaLabelCollapse]),{dir:t,disabled:i,clearButton:r=S.defaultProps.clearButton,label:l,textField:a,className:d,style:n,loading:o,iconClassName:g,virtual:u,size:b,rounded:y,fillMode:I,opened:C=this.state.opened,placeholder:c,svgIcon:v,unstyled:x}=this.props,D=!this.validityStyles||this.validity.valid,F=this.props.filter!==void 0?this.props.filter:this.state.text,A=p.getItemValue(this.value,a),O=p.isPresent(F)?F:A,z=r&&(!!O||p.isPresent(this.value)),M=this.base.vs,P=this.props.id||this._inputId,V=x&&x.uComboBox;M.enabled=u!==void 0,u!==void 0&&(M.skip=u.skip,M.total=u.total,M.pageSize=u.pageSize);const[H,W]=L(this.props.prefix||m.Fragment),[j,U]=L(this.props.suffix||m.Fragment),T=m.createElement(m.Fragment,null,m.createElement("span",{className:h.classNames(h.uComboBox.wrapper({c:V,size:b,rounded:y,fillMode:I,disabled:i,invalid:!D,loading:o,required:this.required}),d),ref:this.componentRef,style:l?{...n,width:void 0}:n,dir:t,onFocus:this.handleFocus},this.props.prefix&&m.createElement(H,{...W}),this.renderSearchBar(O||"",P,c),z&&!o&&m.createElement(ee,{onClick:this.clearButtonClick,key:"clearbutton"}),o&&m.createElement(h.IconWrap,{className:h.classNames(h.uComboBox.loadingIcon({c:V})),name:"loading",key:"loading"}),this.props.suffix&&m.createElement(j,{...U}),m.createElement(te.Button,{tabIndex:-1,type:"button","aria-label":C?e:s,icon:g?void 0:"caret-alt-down",svgIcon:v||se.caretAltDownIcon,iconClass:g,size:b,fillMode:I,rounded:null,themeColor:"base",className:h.classNames(h.uComboBox.inputButton({c:V})),onClick:this.toggleBtnClick,onMouseDown:G=>G.preventDefault()}),!this.mobileMode&&this.renderListContainer()),this.mobileMode&&this.renderAdaptiveListContainer());return l?m.createElement(Y.FloatingLabel,{label:l,editorId:P,editorValue:O,editorValid:D,editorDisabled:i,style:{width:n?n.width:void 0},children:T,unstyled:x}):T}onNavigate(s,e,t){const{virtual:i={skip:0}}=this.props,r=p.getFilteredData(this.props),l=this.props.filter?this.props.filter:this.state.text;let a=-1,d;const n=this.base.vs,o=this.value;this._suggested="";const g=this.hasDuplicates&&this.duplicates.indexOf(o)!==-1;if(a=this.getFocusedIndex(g),a!==-1&&!p.isPresent(o))this.handleItemSelect(a,s);else if(l==="")this.handleItemSelect(0,s);else{const u=i.skip+a;d=this.base.navigation.navigate({keyCode:e,current:u,max:(n.enabled?n.total:r.length)-1,min:0,skipItems:t||void 0}),d!==void 0&&this.handleItemSelect(d,s)}this.navigationIndex=d}getCurrentValueDisabledStatus(s,e,t){return s&&e&&e[t]&&e[t].disabled}applyValueOnEnter(s,e){const{textField:t,allowCustom:i}=this.props,r=p.getFilteredData(this.props),l=this.props.opened!==void 0?this.props.opened:this.state.opened,d=p.getItemValue(this.value,t)===s?this.index:p.getItemIndexByText(r,s,t),n=d!==-1;let o;if(this._suggested="",n)o=r[d];else if(i)o=t!==void 0?{[t]:s}:s;else return this.selectFocusedItem(s,e);this.triggerOnChange(o,e),l&&this.base.togglePopup(e),this.props.filter===void 0&&this.state.text!==void 0&&(e.data.text=void 0),this.applyState(e)}applyValueOnRejectSuggestions(s,e){const{textField:t,allowCustom:i}=this.props,r=p.getFilteredData(this.props),l=this.props.opened!==void 0?this.props.opened:this.state.opened,a=p.getItemValue(this.value,t);if(this._suggested="",s===a||s===""&&!p.isPresent(a))return this.closeOpenedApplyStateNonMobileMode(e,l),this.applyState(e);const d=p.getItemIndexByText(r,s,t,!0),n=d!==-1;let o=null;n?o=r[d]:i&&(o=s?t?{[t]:s}:s:null),this.triggerOnChange(o,e),this.state.text!==void 0&&(e.data.text=void 0,this.base.filterChanged("",e)),this.closeOpenedApplyStateNonMobileMode(e,l),this.applyState(e)}selectFocusedItem(s,e){const t=this.props.opened!==void 0?this.props.opened:this.state.opened,{textField:i,virtual:r={skip:0},focusedItemIndex:l=p.itemIndexStartsWith}=this.props,a=p.getFilteredData(this.props),d=r.skip,n=s===""&&d===0?0:l(a,s,i);return n!==-1?this.handleItemSelect(n+d,e):(this.triggerOnChange(null,e),this.state.text!==void 0&&(e.data.text=void 0)),t&&this.base.togglePopup(e),this.applyState(e)}renderAdaptiveListContainer(){const{windowWidth:s=0}=this.state,{groupField:e,adaptiveTitle:t=this.props.label,adaptiveSubtitle:i}=this.props,r=p.getFilteredData(this.props),l=this.props.opened!==void 0?this.props.opened:this.state.opened;let{group:a}=this.state;a===void 0&&e!==void 0&&(a=p.getItemValue(r[0],e));const d={title:t||this.props.label,subTitle:i,expand:l,onClose:n=>this.toggleBtnClick(n),windowWidth:s,mobileFilter:this.renderMobileListFilter()};return m.createElement(oe.AdaptiveMode,{...d},m.createElement(ie.ActionSheetContent,null,m.createElement("div",{className:"k-list-container"},this.listContainerContent())))}renderListContainer(){const s=this.base,{dir:e,header:t,footer:i,groupField:r,groupMode:l,size:a,list:d,virtual:n,groupStickyHeaderItemRender:o,unstyled:g}=this.props,u=p.getFilteredData(this.props),b=this.props.opened!==void 0?this.props.opened:this.state.opened,y=s.getPopupSettings(),I=y.width!==void 0?y.width:s.popupWidth,C=g&&g.uComboBox;let{group:c}=this.state;return c===void 0&&r!==void 0&&(c=p.getItemValue(u[0],r)),m.createElement(Q,{width:I,popupSettings:{...y,anchor:y.anchor||this.element,show:b,popupClass:h.classNames(y.popupClass,h.uComboBox.listContainer({c:C,popup:!0}))},dir:e!==void 0?e:this.base.dirCalculated,itemsCount:[u.length]},m.createElement("div",{className:h.classNames(h.uComboBox.list({c:C,list:d,size:a,tableSize:a,virtual:n}))},t&&m.createElement("div",{className:h.classNames(h.uComboBox.listHeader({c:C}))},t),!d&&c&&u.length!==0&&m.createElement(_,{group:c,groupMode:l,render:o}),this.renderList(),i&&m.createElement("div",{className:h.classNames(h.uComboBox.listFooter({c:C}),this.props.footerClassName)},i)),this.showLicenseWatermark&&m.createElement(h.WatermarkOverlay,{message:this.licenseMessage}))}renderList(){const s=this.base,{textField:e,dataItemKey:t,listNoDataRender:i,itemRender:r,groupHeaderItemRender:l,virtual:a={skip:0,total:void 0},unstyled:d}=this.props,n=p.getFilteredData(this.props),o=s.getPopupSettings(),g=s.vs,u=a.skip,b=this.props.opened!==void 0?this.props.opened:this.state.opened,y=`translateY(${g.translate}px)`,I=b?this.getFocusedIndex(this.hasDuplicates):void 0,C=this.props.filter!==void 0?this.props.filter:this.state.text,c=p.getItemValue(this.value,e),v=p.isPresent(C)&&C!==c?null:this.value,x=this.props.list||X,D=d&&d.uComboBox;return m.createElement(x,{id:s.listBoxId,virtual:!!a,show:b,data:n,focusedIndex:I,value:v,textField:e,valueField:t,groupField:this.props.groupField,groupMode:this.props.groupMode,isMultiColumn:this.props.isMultiColumn,optionsGuid:s.guid,hasDuplicates:this.hasDuplicates,listRef:F=>{g.list=this.base.list=F,this.itemHeight=0},wrapperStyle:this.state.windowWidth&&this.props._adaptiveMode&&this.state.windowWidth>this.props._adaptiveMode.medium?{maxHeight:o.height}:{},wrapperCssClass:h.classNames(h.uComboBox.listContent({c:D,virtual:a})),listStyle:g.enabled?{transform:y}:void 0,key:"listkey",skip:u,onClick:this.handleItemClick,itemRender:r,groupHeaderItemRender:l,noDataRender:i,onMouseDown:F=>F.preventDefault(),onScroll:this.onScroll,wrapperRef:g.scrollerRef,scroller:this.base.renderScrollElement(),ariaSetSize:a.total})}renderSearchBar(s,e,t){const{tabIndex:i,disabled:r,title:l,ariaLabelledBy:a,ariaDescribedBy:d,dataItemKey:n,virtual:o={skip:0},unstyled:g,inputAttributes:u}=this.props,b=p.getFilteredData(this.props),y=this.props.opened!==void 0?this.props.opened:this.state.opened,I=this.value,C=Math.max(0,b.findIndex(c=>p.areSame(c,I,n)));return this._suggested&&!p.areSame(this._valueOnDidUpdate,I,n)&&(this._suggested=""),m.createElement(J,{id:e,readOnly:y&&this.mobileMode,placeholder:t,tabIndex:i,title:l,value:s+this._suggested,suggestedText:this._suggested,ref:c=>{this._input=c&&c.input},onClick:this.onInputClick,onKeyDown:this.onInputKeyDown,onChange:this.inputOnChange,onFocus:this.base.handleFocus,onBlur:this.handleBlur,disabled:r,expanded:y,owns:this.base.listBoxId,activedescendant:`option-${this.base.guid}-${C+o.skip}`,role:"combobox",ariaLabelledBy:a,ariaLabel:this.props.ariaLabel,ariaDescribedBy:d,ariaRequired:this.required,render:this.props.valueRender,ariaControls:this.base.listBoxId,unstyled:g,inputAttributes:u})}clearValue(){const s=this.base.initState();this._suggested="",this.navigationIndex=void 0,this.base.filterChanged("",s),this.props.filter===void 0&&this.state.text!==void 0&&(s.data.text=void 0),this.triggerOnChange(null,s);const e=this.props.opened!==void 0?this.props.opened:this.state.opened,t=this.mobileMode;e&&!t&&this.base.togglePopup(s),this.applyState(s)}triggerOnChange(s,e){const t=this.value;!this.hasDuplicates&&(!p.isPresent(t)&&!p.isPresent(s)||p.areSame(t,s,this.props.dataItemKey))||(this.props.value===void 0&&(e.data.value=s),this._valueDuringOnChange=s,e.events.push({type:"onChange"}))}getFocusedIndex(s){const e=this.value,{textField:t,dataItemKey:i,virtual:r={skip:0},focusedItemIndex:l=p.itemIndexStartsWith,skipDisabledItems:a}=this.props,d=p.getFilteredData(this.props),n=this.props.filter?this.props.filter:this.state.text;return s&&this.navigationIndex!==void 0?this.navigationIndex:p.isPresent(e)&&n===void 0?d.findIndex(o=>p.areSame(o,e,i)):n?l(d,n,t):a&&t&&!n&&r.skip===0?d.findIndex(o=>!o.disabled&&o[t]):r.skip===0?0:-1}suggestValue(s){const{data:e,textField:t}=this.props;this._suggested=p.suggestValue(s,e,t)}applyState(s){this.base.applyState(s),this._valueDuringOnChange=void 0}calculateMedia(s){for(const e of s)this.setState({windowWidth:e.target.clientWidth})}};S.displayName="ComboBox",S.propTypes={...E.propTypes,size:f.oneOf([null,"small","medium","large"]),rounded:f.oneOf([null,"small","medium","large","full"]),fillMode:f.oneOf([null,"solid","flat","outline"]),dataItemKey:f.string,groupField:f.string,groupMode:f.oneOf([void 0,"classic","modern"]),isMultiColumn:f.bool,suggest:f.bool,placeholder:f.string,title:f.string,allowCustom:f.bool,clearButton:f.bool,iconClassName:f.string,svgIcon:h.svgIconPropType,validationMessage:f.string,required:f.bool,id:f.string,ariaLabelledBy:f.string,ariaLabel:f.string,ariaDescribedBy:f.string,list:f.any,valueRender:f.func,skipDisabledItems:f.bool,inputAttributes:f.object},S.defaultProps={...E.defaultProps,size:"medium",rounded:"medium",fillMode:"solid",allowCustom:!1,clearButton:!0,required:!1,groupMode:"modern",isMultiColumn:!1,skipDisabledItems:!0,prefix:void 0,suffix:void 0};let B=S;const R=h.createPropsContext(),q=h.withIdHOC(h.withPropsContext(R,h.withUnstyledHOC(h.withAdaptiveModeContext(B))));q.displayName="KendoReactComboBox";exports.ComboBox=q;exports.ComboBoxPropsContext=R;exports.ComboBoxWithoutContext=B;
|
package/ComboBox/ComboBox.mjs
CHANGED
|
@@ -8,24 +8,24 @@
|
|
|
8
8
|
import * as c from "react";
|
|
9
9
|
import m from "prop-types";
|
|
10
10
|
import _ from "../common/DropDownBase.mjs";
|
|
11
|
-
import { classNames as S, uComboBox as k, Keys as y, validatePackage as
|
|
12
|
-
import { FloatingLabel as
|
|
13
|
-
import { getPlainDataDuplicates as
|
|
14
|
-
import
|
|
15
|
-
import
|
|
16
|
-
import
|
|
17
|
-
import
|
|
11
|
+
import { classNames as S, uComboBox as k, Keys as y, validatePackage as et, getLicenseMessage as st, svgIconPropType as it, canUseDOM as R, IconWrap as ot, WatermarkOverlay as at, createPropsContext as nt, withIdHOC as lt, withPropsContext as rt, withUnstyledHOC as pt, withAdaptiveModeContext as dt } from "@progress/kendo-react-common";
|
|
12
|
+
import { FloatingLabel as ht } from "@progress/kendo-react-labels";
|
|
13
|
+
import { getPlainDataDuplicates as ut, getFilteredData as C, areSame as F, getItemValue as D, isPresent as w, getItemIndexByText as A, suggestValue as ct, itemIndexStartsWith as z } from "../common/utils.mjs";
|
|
14
|
+
import gt from "../common/SearchBar.mjs";
|
|
15
|
+
import mt from "../common/ListContainer.mjs";
|
|
16
|
+
import vt from "../common/List.mjs";
|
|
17
|
+
import ft from "../common/ListFilter.mjs";
|
|
18
18
|
import K from "../common/GroupStickyHeader.mjs";
|
|
19
|
-
import { packageMetadata as
|
|
20
|
-
import
|
|
21
|
-
import { Button as
|
|
22
|
-
import { caretAltDownIcon as
|
|
23
|
-
import { comboArrowBtnAriaLabelExpand as
|
|
24
|
-
import { provideLocalizationService as
|
|
25
|
-
import { ActionSheetContent as
|
|
26
|
-
import
|
|
27
|
-
import { AdaptiveMode as
|
|
28
|
-
const
|
|
19
|
+
import { packageMetadata as H } from "../package-metadata.mjs";
|
|
20
|
+
import bt from "../common/ClearButton.mjs";
|
|
21
|
+
import { Button as xt } from "@progress/kendo-react-buttons";
|
|
22
|
+
import { caretAltDownIcon as It } from "@progress/kendo-svg-icons";
|
|
23
|
+
import { comboArrowBtnAriaLabelExpand as W, messages as q, comboArrowBtnAriaLabelCollapse as G } from "../messages/index.mjs";
|
|
24
|
+
import { provideLocalizationService as U } from "@progress/kendo-react-intl";
|
|
25
|
+
import { ActionSheetContent as yt } from "@progress/kendo-react-layout";
|
|
26
|
+
import j from "../common/withCustomComponent.mjs";
|
|
27
|
+
import { AdaptiveMode as Ct } from "../common/AdaptiveMode.mjs";
|
|
28
|
+
const St = "Please enter a valid value!", M = class M extends c.Component {
|
|
29
29
|
constructor(s) {
|
|
30
30
|
super(s), this.state = {}, this.base = new _(this), this._element = null, this._suggested = "", this._skipBlur = !1, this._input = null, this._adaptiveFilterInput = null, this._skipFocus = !1, this.itemHeight = 0, this.duplicates = [], this.hasDuplicates = !1, this.showLicenseWatermark = !1, this.focus = () => {
|
|
31
31
|
this._input && this._input.focus();
|
|
@@ -33,7 +33,7 @@ const Ct = "Please enter a valid value!", M = class M extends c.Component {
|
|
|
33
33
|
const t = this.props.textField !== void 0, e = this.props.dataItemKey !== void 0;
|
|
34
34
|
if (this.props.data && this.props.data.length > 0 && !t && !e) {
|
|
35
35
|
const i = this.props.data;
|
|
36
|
-
this.duplicates =
|
|
36
|
+
this.duplicates = ut(i), this.hasDuplicates = this.duplicates.length > 0;
|
|
37
37
|
}
|
|
38
38
|
}, this.handleItemSelect = (t, e) => {
|
|
39
39
|
const { virtual: i, dataItemKey: r } = this.props, l = C(this.props), a = i ? i.skip : 0, p = l[t - a], n = this.hasDuplicates || !F(p, this.value, r);
|
|
@@ -59,7 +59,7 @@ const Ct = "Please enter a valid value!", M = class M extends c.Component {
|
|
|
59
59
|
}, this.renderMobileListFilter = () => {
|
|
60
60
|
const t = this.props.adaptiveFilter !== void 0 ? this.props.adaptiveFilter : this.state.text, e = D(this.value, this.props.textField), i = w(t) ? t : e;
|
|
61
61
|
return /* @__PURE__ */ c.createElement(
|
|
62
|
-
|
|
62
|
+
ft,
|
|
63
63
|
{
|
|
64
64
|
value: i,
|
|
65
65
|
ref: (r) => {
|
|
@@ -211,7 +211,7 @@ const Ct = "Please enter a valid value!", M = class M extends c.Component {
|
|
|
211
211
|
e.syntheticEvent = t, t.stopPropagation(), this.clearValue();
|
|
212
212
|
}, this.setValidity = () => {
|
|
213
213
|
this._input && this._input.setCustomValidity && this._input.setCustomValidity(
|
|
214
|
-
this.validity.valid ? "" : this.props.validationMessage ||
|
|
214
|
+
this.validity.valid ? "" : this.props.validationMessage || St
|
|
215
215
|
);
|
|
216
216
|
}, this.handleFocus = (t) => {
|
|
217
217
|
if (this._skipFocus)
|
|
@@ -220,7 +220,7 @@ const Ct = "Please enter a valid value!", M = class M extends c.Component {
|
|
|
220
220
|
e.syntheticEvent = t, this.mobileMode && !this._skipFocus && (this._skipFocus = !0, this.base.togglePopup(e), this.applyState(e), setTimeout(() => {
|
|
221
221
|
this._skipFocus = !1;
|
|
222
222
|
}, 300)), this.base.handleFocus(t);
|
|
223
|
-
}, this.showLicenseWatermark = !
|
|
223
|
+
}, this.showLicenseWatermark = !et(H, { component: "ComboBox" }), this.licenseMessage = st(H);
|
|
224
224
|
}
|
|
225
225
|
get _inputId() {
|
|
226
226
|
return this.props.id;
|
|
@@ -313,12 +313,12 @@ const Ct = "Please enter a valid value!", M = class M extends c.Component {
|
|
|
313
313
|
}
|
|
314
314
|
/** @hidden */
|
|
315
315
|
render() {
|
|
316
|
-
const s =
|
|
317
|
-
|
|
318
|
-
W
|
|
319
|
-
), t =
|
|
320
|
-
|
|
321
|
-
|
|
316
|
+
const s = U(this).toLanguageString(
|
|
317
|
+
W,
|
|
318
|
+
q[W]
|
|
319
|
+
), t = U(this).toLanguageString(
|
|
320
|
+
G,
|
|
321
|
+
q[G]
|
|
322
322
|
), {
|
|
323
323
|
dir: e,
|
|
324
324
|
disabled: i,
|
|
@@ -337,9 +337,9 @@ const Ct = "Please enter a valid value!", M = class M extends c.Component {
|
|
|
337
337
|
placeholder: h,
|
|
338
338
|
svgIcon: g,
|
|
339
339
|
unstyled: f
|
|
340
|
-
} = this.props, E = !this.validityStyles || this.validity.valid, O = this.props.filter !== void 0 ? this.props.filter : this.state.text,
|
|
340
|
+
} = this.props, E = !this.validityStyles || this.validity.valid, O = this.props.filter !== void 0 ? this.props.filter : this.state.text, $ = D(this.value, a), V = w(O) ? O : $, Y = r && (!!V || w(this.value)), B = this.base.vs, L = this.props.id || this._inputId, T = f && f.uComboBox;
|
|
341
341
|
B.enabled = d !== void 0, d !== void 0 && (B.skip = d.skip, B.total = d.total, B.pageSize = d.pageSize);
|
|
342
|
-
const [
|
|
342
|
+
const [J, Q] = j(this.props.prefix || c.Fragment), [X, Z] = j(this.props.suffix || c.Fragment), N = /* @__PURE__ */ c.createElement(c.Fragment, null, /* @__PURE__ */ c.createElement(
|
|
343
343
|
"span",
|
|
344
344
|
{
|
|
345
345
|
className: S(
|
|
@@ -360,26 +360,26 @@ const Ct = "Please enter a valid value!", M = class M extends c.Component {
|
|
|
360
360
|
dir: e,
|
|
361
361
|
onFocus: this.handleFocus
|
|
362
362
|
},
|
|
363
|
-
this.props.prefix && /* @__PURE__ */ c.createElement(
|
|
363
|
+
this.props.prefix && /* @__PURE__ */ c.createElement(J, { ...Q }),
|
|
364
364
|
this.renderSearchBar(V || "", L, h),
|
|
365
|
-
|
|
365
|
+
Y && !o && /* @__PURE__ */ c.createElement(bt, { onClick: this.clearButtonClick, key: "clearbutton" }),
|
|
366
366
|
o && /* @__PURE__ */ c.createElement(
|
|
367
|
-
|
|
367
|
+
ot,
|
|
368
368
|
{
|
|
369
369
|
className: S(k.loadingIcon({ c: T })),
|
|
370
370
|
name: "loading",
|
|
371
371
|
key: "loading"
|
|
372
372
|
}
|
|
373
373
|
),
|
|
374
|
-
this.props.suffix && /* @__PURE__ */ c.createElement(
|
|
374
|
+
this.props.suffix && /* @__PURE__ */ c.createElement(X, { ...Z }),
|
|
375
375
|
/* @__PURE__ */ c.createElement(
|
|
376
|
-
|
|
376
|
+
xt,
|
|
377
377
|
{
|
|
378
378
|
tabIndex: -1,
|
|
379
379
|
type: "button",
|
|
380
380
|
"aria-label": I ? t : s,
|
|
381
381
|
icon: u ? void 0 : "caret-alt-down",
|
|
382
|
-
svgIcon: g ||
|
|
382
|
+
svgIcon: g || It,
|
|
383
383
|
iconClass: u,
|
|
384
384
|
size: v,
|
|
385
385
|
fillMode: x,
|
|
@@ -387,13 +387,13 @@ const Ct = "Please enter a valid value!", M = class M extends c.Component {
|
|
|
387
387
|
themeColor: "base",
|
|
388
388
|
className: S(k.inputButton({ c: T })),
|
|
389
389
|
onClick: this.toggleBtnClick,
|
|
390
|
-
onMouseDown: (
|
|
390
|
+
onMouseDown: (tt) => tt.preventDefault()
|
|
391
391
|
}
|
|
392
392
|
),
|
|
393
393
|
!this.mobileMode && this.renderListContainer()
|
|
394
394
|
), this.mobileMode && this.renderAdaptiveListContainer());
|
|
395
395
|
return l ? /* @__PURE__ */ c.createElement(
|
|
396
|
-
|
|
396
|
+
ht,
|
|
397
397
|
{
|
|
398
398
|
label: l,
|
|
399
399
|
editorId: L,
|
|
@@ -467,7 +467,7 @@ const Ct = "Please enter a valid value!", M = class M extends c.Component {
|
|
|
467
467
|
windowWidth: s,
|
|
468
468
|
mobileFilter: this.renderMobileListFilter()
|
|
469
469
|
};
|
|
470
|
-
return /* @__PURE__ */ c.createElement(
|
|
470
|
+
return /* @__PURE__ */ c.createElement(Ct, { ...p }, /* @__PURE__ */ c.createElement(yt, null, /* @__PURE__ */ c.createElement("div", { className: "k-list-container" }, this.listContainerContent())));
|
|
471
471
|
}
|
|
472
472
|
renderListContainer() {
|
|
473
473
|
const s = this.base, {
|
|
@@ -484,7 +484,7 @@ const Ct = "Please enter a valid value!", M = class M extends c.Component {
|
|
|
484
484
|
} = this.props, d = C(this.props), v = this.props.opened !== void 0 ? this.props.opened : this.state.opened, b = s.getPopupSettings(), x = b.width !== void 0 ? b.width : s.popupWidth, I = u && u.uComboBox;
|
|
485
485
|
let { group: h } = this.state;
|
|
486
486
|
return h === void 0 && r !== void 0 && (h = D(d[0], r)), /* @__PURE__ */ c.createElement(
|
|
487
|
-
|
|
487
|
+
mt,
|
|
488
488
|
{
|
|
489
489
|
width: x,
|
|
490
490
|
popupSettings: {
|
|
@@ -529,7 +529,7 @@ const Ct = "Please enter a valid value!", M = class M extends c.Component {
|
|
|
529
529
|
i
|
|
530
530
|
)
|
|
531
531
|
),
|
|
532
|
-
this.showLicenseWatermark && /* @__PURE__ */ c.createElement(
|
|
532
|
+
this.showLicenseWatermark && /* @__PURE__ */ c.createElement(at, { message: this.licenseMessage })
|
|
533
533
|
);
|
|
534
534
|
}
|
|
535
535
|
renderList() {
|
|
@@ -541,7 +541,7 @@ const Ct = "Please enter a valid value!", M = class M extends c.Component {
|
|
|
541
541
|
groupHeaderItemRender: l,
|
|
542
542
|
virtual: a = { skip: 0, total: void 0 },
|
|
543
543
|
unstyled: p
|
|
544
|
-
} = this.props, n = C(this.props), o = s.getPopupSettings(), u = s.vs, d = a.skip, v = this.props.opened !== void 0 ? this.props.opened : this.state.opened, b = `translateY(${u.translate}px)`, x = v ? this.getFocusedIndex(this.hasDuplicates) : void 0, I = this.props.filter !== void 0 ? this.props.filter : this.state.text, h = D(this.value, t), g = w(I) && I !== h ? null : this.value, f = this.props.list ||
|
|
544
|
+
} = this.props, n = C(this.props), o = s.getPopupSettings(), u = s.vs, d = a.skip, v = this.props.opened !== void 0 ? this.props.opened : this.state.opened, b = `translateY(${u.translate}px)`, x = v ? this.getFocusedIndex(this.hasDuplicates) : void 0, I = this.props.filter !== void 0 ? this.props.filter : this.state.text, h = D(this.value, t), g = w(I) && I !== h ? null : this.value, f = this.props.list || vt, E = p && p.uComboBox;
|
|
545
545
|
return /* @__PURE__ */ c.createElement(
|
|
546
546
|
f,
|
|
547
547
|
{
|
|
@@ -599,7 +599,7 @@ const Ct = "Please enter a valid value!", M = class M extends c.Component {
|
|
|
599
599
|
v.findIndex((h) => F(h, x, n))
|
|
600
600
|
);
|
|
601
601
|
return this._suggested && !F(this._valueOnDidUpdate, x, n) && (this._suggested = ""), /* @__PURE__ */ c.createElement(
|
|
602
|
-
|
|
602
|
+
gt,
|
|
603
603
|
{
|
|
604
604
|
id: t,
|
|
605
605
|
readOnly: b && this.mobileMode,
|
|
@@ -654,7 +654,7 @@ const Ct = "Please enter a valid value!", M = class M extends c.Component {
|
|
|
654
654
|
}
|
|
655
655
|
suggestValue(s) {
|
|
656
656
|
const { data: t, textField: e } = this.props;
|
|
657
|
-
this._suggested =
|
|
657
|
+
this._suggested = ct(s, t, e);
|
|
658
658
|
}
|
|
659
659
|
applyState(s) {
|
|
660
660
|
this.base.applyState(s), this._valueDuringOnChange = void 0;
|
|
@@ -679,7 +679,7 @@ M.displayName = "ComboBox", M.propTypes = {
|
|
|
679
679
|
allowCustom: m.bool,
|
|
680
680
|
clearButton: m.bool,
|
|
681
681
|
iconClassName: m.string,
|
|
682
|
-
svgIcon:
|
|
682
|
+
svgIcon: it,
|
|
683
683
|
validationMessage: m.string,
|
|
684
684
|
required: m.bool,
|
|
685
685
|
id: m.string,
|
|
@@ -705,17 +705,17 @@ M.displayName = "ComboBox", M.propTypes = {
|
|
|
705
705
|
suffix: void 0
|
|
706
706
|
};
|
|
707
707
|
let P = M;
|
|
708
|
-
const
|
|
709
|
-
|
|
710
|
-
|
|
711
|
-
|
|
712
|
-
|
|
708
|
+
const kt = nt(), wt = lt(
|
|
709
|
+
rt(
|
|
710
|
+
kt,
|
|
711
|
+
pt(
|
|
712
|
+
dt(P)
|
|
713
713
|
)
|
|
714
714
|
)
|
|
715
715
|
);
|
|
716
|
-
|
|
716
|
+
wt.displayName = "KendoReactComboBox";
|
|
717
717
|
export {
|
|
718
|
-
|
|
719
|
-
|
|
718
|
+
wt as ComboBox,
|
|
719
|
+
kt as ComboBoxPropsContext,
|
|
720
720
|
P as ComboBoxWithoutContext
|
|
721
721
|
};
|
|
@@ -5,4 +5,4 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const At=require("react"),L=require("prop-types"),o=require("@progress/kendo-react-common"),Ht=require("@progress/kendo-react-labels"),Bt=require("@progress/kendo-svg-icons"),Wt=require("../common/ListContainer.js"),_t=require("../common/ListFilter.js"),et=require("../common/GroupStickyHeader.js"),Ut=require("../common/ListDefaultItem.js"),Gt=require("../common/List.js"),tt=require("../common/DropDownBase.js"),d=require("../common/utils.js"),jt=require("../package-metadata.js"),$t=require("@progress/kendo-react-buttons"),Yt=require("@progress/kendo-react-intl"),$=require("../messages/index.js"),Jt=require("@progress/kendo-react-layout"),Qt=require("../common/AdaptiveMode.js");function Rt(N){const Y=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(N){for(const T in N)if(T!=="default"){const n=Object.getOwnPropertyDescriptor(N,T);Object.defineProperty(Y,T,n.get?n:{enumerable:!0,get:()=>N[T]})}}return Y.default=N,Object.freeze(Y)}const i=Rt(At),Xt="Please select a value from the list!",pe=i.forwardRef((N,Y)=>{let T=!1;const n=o.usePropsContext(nt,N),{delay:rt=P.delay,tabIndex:ot=P.tabIndex,ignoreCase:me=P.ignoreCase,size:O=P.size,rounded:Me=P.rounded,fillMode:ge=P.fillMode,groupMode:Zt=P.groupMode}=n;if(n.filterable||n.virtual){const e=[];n.filterable&&e.push("filterable"),n.virtual&&e.push("virtualization"),T=!o.validatePackage(jt.packageMetadata,{component:"DropDownList",features:e})}const b=o.useUnstyled(),fe=o.useId(n.id),ve=()=>{var e;if(o.canUseDOM)return((e=Q.current)==null?void 0:e.ownerDocument)||window.document},st=()=>{var e,r;(e=t==null?void 0:t.current)!=null&&e.wrapper&&((r=t==null?void 0:t.current)==null||r.wrapper.focus({preventScroll:!0}))},k=()=>{let e;return z.current!==void 0&&z.current!==null?e=z.current:n.value!==void 0?e=n.value:g.value!==void 0&&g.value!==null?e=g.value:n.defaultValue!==void 0&&n.defaultValue!==null&&(e=n.defaultValue),!d.isPresent(e)&&n.defaultItem!==void 0&&n.defaultItem!==null&&(e=n.defaultItem),e},at=()=>{const{dataItemKey:e}=n,r=d.getFilteredData(n),s=k();return r.findIndex(c=>d.areSame(c,s,e))},ye=()=>n.required!==void 0?n.required:P.required,De=()=>{const e=n.validationMessage!==void 0,r=k(),s=!ye()||r!==null&&r!==""&&r!==void 0,c=n.valid!==void 0?n.valid:s;return{customError:e,valid:c,valueMissing:r===null}},it=()=>n.validityStyles!==void 0?n.validityStyles:P.validityStyles,ne=e=>{re.current=!0,e.focus(),window.setTimeout(()=>re.current=!1,30)},Ie=()=>{R.current&&ne(R.current),n.adaptive&&setTimeout(()=>{R.current&&ne(R.current)},300)},lt=i.useCallback(e=>{for(const r of e)bt(r.target.clientWidth)},[]),Ne=()=>{var e;(e=xe.current)!=null&&e.setCustomValidity&&xe.current.setCustomValidity(De().valid?"":n.validationMessage||Xt)},W=(e,r)=>{const s=k();d.areSame(s,e,n.dataItemKey)||(n.value===void 0&&(r.data.value=e),t.current.updateComponentArgs({value:e}),z.current=e,r.events.push({type:"onChange"}))},E=e=>{var r;(r=t==null?void 0:t.current)==null||r.applyState(e),z.current=void 0},J=(e,r)=>{var p;const{virtual:s,dataItemKey:c,defaultItem:u}=n,m=d.getFilteredData(n),y=s?s.skip:0,f=k(),a=e===-1&&u!==void 0?u:m[e-y],v=!d.areSame(a,f,c);W(a,r),v&&((p=t==null?void 0:t.current)==null||p.triggerPageChangeCornerItems(a,r))},q=(e,r,s)=>{var x,I;const{defaultItem:c,dataItemKey:u,virtual:m={skip:0,total:0,pageSize:0}}=n,y=k(),f=d.getFilteredData(n),a=(x=t==null?void 0:t.current)==null?void 0:x.vs,v=f.findIndex(h=>d.areSame(h,y,u)),p=(I=t==null?void 0:t.current)==null?void 0:I.navigation.navigate({current:m.skip+v,max:(a!=null&&a.enabled?m.total:f.length)-1,min:c!==void 0?-1:0,keyCode:r,skipItems:s||void 0});p!==void 0&&J(p,e),E(e)},dt=e=>{Q.current=e,t.current.wrapper=e},ct=e=>i.createElement("select",{name:n.name,ref:r=>{xe.current=r},tabIndex:-1,"aria-hidden":!0,title:n.label,style:{opacity:0,width:1,border:0,zIndex:-1,position:"absolute",left:"50%"}},i.createElement("option",{value:n.valueMap?n.valueMap.call(void 0,e):e})),we=()=>{const{textField:e,dataItemKey:r,virtual:s={skip:0},focusedItemIndex:c=d.itemIndexStartsWith,filterable:u,skipDisabledItems:m=!0}=n,y=k(),f=d.getFilteredData(n),a=n.filter?n.filter:g.text;return m&&e&&!a&&!y?f.findIndex(v=>!v.disabled&&v[e]):d.isPresent(y)&&a===void 0||u&&a===""?f.findIndex(v=>d.areSame(v,y,r)):a?Ce.current?c(f,a,e):f.findIndex(v=>d.areSame(v,y,r)):s.skip===0?0:-1},Te=(e,r)=>r!==void 0&&r!==-1&&e&&e.length>0&&e[r].disabled,he=()=>{const e=d.getFilteredData(n),r=t.current.initState(),s=we();Te(e,s)&&(W(null,r),E(r))},Se=e=>{if(e.isPropagationStopped())return;const r=t.current.initState();r.syntheticEvent=e,g.focused||(r.data.focused=!0),he(),t.current.togglePopup(r),E(r)},Oe=e=>{var M,ce,B,ue,j,Xe,Ze;e&&e.target instanceof Element&&e.target.nodeName==="INPUT"&&e.stopPropagation&&e.stopPropagation();const{filterable:r,disabled:s,defaultItem:c,leftRightKeysNavigation:u=!0,virtual:m={skip:0,total:0,pageSize:0},dataItemKey:y,groupField:f="",textField:a,skipDisabledItems:v=!0}=n,p=d.getFilteredData(n),x=k(),I=p.findIndex(C=>d.areSame(C,x,y)),h=n.opened!==void 0?n.opened:g.opened,l=e.keyCode,F=l===o.Keys.home||l===o.Keys.end,K=l===o.Keys.up||l===o.Keys.down,G=!h&&(e.altKey&&l===o.Keys.down||l===o.Keys.enter||l===o.Keys.space),te=h&&(e.altKey&&l===o.Keys.up||l===o.Keys.esc),le=u&&(l===o.Keys.left||l===o.Keys.right),de=K||le&&!r||F,S=t.current.initState();if(S.syntheticEvent=e,!s){if(F&&((M=t==null?void 0:t.current)!=null&&M.vs.enabled))l===o.Keys.home?m.skip!==0?((ce=t==null?void 0:t.current)==null||ce.triggerOnPageChange(S,0,m.pageSize),V.current=!0):W(p[0],S):m.skip<m.total-m.pageSize?((B=t==null?void 0:t.current)==null||B.triggerOnPageChange(S,m.total-m.pageSize,m.pageSize),V.current=!0):W(p[p.length-1],S);else if(h&&l===o.Keys.pageUp)e.preventDefault(),(ue=t==null?void 0:t.current)==null||ue.scrollPopupByPageSize(-1);else if(h&&l===o.Keys.pageDown)e.preventDefault(),(j=t==null?void 0:t.current)==null||j.scrollPopupByPageSize(1);else if(h&&l===o.Keys.enter){const C=we();Te(p,C)?(W(null,S),E(S)):J(C,S),(Xe=t==null?void 0:t.current)==null||Xe.togglePopup(S),e.preventDefault()}else if(G||te)te&&he(),(Ze=t==null?void 0:t.current)==null||Ze.togglePopup(S),e.preventDefault();else if(de){if(Ce.current=!1,f!==""&&a)if(!v&&h)q(S,l);else{let C;if(l===o.Keys.down||l===o.Keys.right){const w=p.slice(I+1).find(D=>!D.disabled&&D[a]);C=w&&p.findIndex(D=>D[a]===w[a])}else if(l===o.Keys.up||l===o.Keys.left){let w;if(I===0&&c)C=-1;else if(I===-1)w=p,C=p.findIndex(D=>!D.disabled&&D[a]);else{w=p.slice(0,I);let D=w.pop();for(;D&&D.disabled;)D=w.pop();C=D&&p.findIndex(Pe=>Pe[a]===D[a])}}if(C!==void 0){const w=C-I;q(S,l,w)}else C===void 0&&p.findIndex(w=>w[a]===x[a])===p.length-1&&q(S,l)}else if(!v&&h||F)q(S,l);else if(a){let C;if(l===o.Keys.down||l===o.Keys.right){const w=p.slice(I+1).find(D=>!D.disabled&&D[a]);C=w&&p.findIndex(D=>D[a]===w[a])}else if(l===o.Keys.up||l===o.Keys.left){let w;if(I===0&&c)C=-1;else if(I===-1)w=p,C=p.find(D=>!D.disabled&&D[a]);else{w=p.slice(0,I);let D=w.pop();for(;D&&D.disabled;)D=w.pop();C=D&&p.findIndex(Pe=>Pe[a]===D[a])}}if(C!==void 0){const w=C-I;q(S,l,w)}else C===void 0&&p.findIndex(w=>w[a]===x[a])===p.length-1&&q(S,l)}else q(S,l);e.preventDefault()}E(S)}},ut=e=>{const r=t.current.initState();r.syntheticEvent=e.syntheticEvent,n.filter===void 0&&(r.data.text=e.target.value),t.current.filterChanged(e.target.value,r),Ce.current=!0,E(r),Z({group:void 0,text:String(e.target.value)})},qe=e=>{const r=n.filter!==void 0?n.filter:g.text;return n.filterable&&i.createElement(_t,{value:r,ref:s=>{R.current=s&&s.element},onChange:ut,onKeyDown:Oe,size:e?"large":O,rounded:Me,fillMode:ge,renderListFilterWrapper:!0,placeholder:We.toLanguageString($.dropDownListAdaptiveFilterPlaceholder,$.messages[$.dropDownListAdaptiveFilterPlaceholder])})},pt=e=>{var s;const r=t.current.initState();r.syntheticEvent=e,(s=t==null?void 0:t.current)==null||s.togglePopup(r),W(n.defaultItem,r),E(r)},mt=()=>{const{textField:e,defaultItem:r,dataItemKey:s}=n,c=k();return r!==void 0&&i.createElement(Ut,{defaultItem:r,textField:e,selected:d.areSame(c,r,s),key:"defaultitemkey",onClick:pt})},gt=(e,r)=>{var s;(s=t==null?void 0:t.current)==null||s.handleItemClick(e,r),z.current=void 0},ft=e=>{const{vs:r,list:s}=t.current;r.scrollHandler(e);const{groupField:c}=n;let u=d.getFilteredData(n);if(!(!c||!u.length)&&c){const m=He.current=He.current||(r.enabled?r.itemHeight:s?s.children[0].offsetHeight:0),f=e.target.scrollTop-r.skip*m;u=t.current.getGroupedDataModernMode(u,c);let a=u[0][c];for(let v=1;v<u.length&&!(m*v>f);v++)u[v]&&u[v][c]&&(a=u[v][c]);a!==g.group&&Z({group:a})}},ze=()=>{var l;const{textField:e,dataItemKey:r,virtual:s={skip:0,total:void 0},groupHeaderItemRender:c,listNoDataRender:u,itemRender:m}=n,y=d.getFilteredData(n),f=b&&b.uDropDownList,a=t.current.vs,v=s.skip,p=n.opened!==void 0?n.opened:g.opened,x=t.current.getPopupSettings(),I=`translateY(${a.translate}px)`,h=k();return i.createElement(Gt,{id:Ke,show:p,data:y.slice(),focusedIndex:we(),value:h,textField:e,valueField:r,optionsGuid:Ue,groupField:n.groupField,groupMode:"modern",listRef:F=>{a.list=t.current.list=F},wrapperStyle:{maxHeight:U?void 0:x.height},wrapperCssClass:o.classNames(o.uDropDownList.listContent({c:f})),listStyle:a.enabled?{transform:I}:void 0,key:"listkey",skip:v,onClick:gt,itemRender:m,groupHeaderItemRender:c,noDataRender:u,onScroll:ft,wrapperRef:a.scrollerRef,scroller:(l=t==null?void 0:t.current)==null?void 0:l.renderScrollElement(),ariaSetSize:s.total})},vt=()=>{const{groupField:e}=n,r=d.getFilteredData(n),s=n.opened!==void 0?n.opened:g.opened,c=b&&b.uDropDownList,u={title:n.adaptiveTitle||n.label,subTitle:n.adaptiveSubtitle,expand:s,onClose:y=>Se(y),windowWidth:ke,mobileFilter:qe(!0)};let{group:m}=g;return m===void 0&&e!==void 0&&(m=d.getItemValue(r[0],e)),i.createElement(Qt.AdaptiveMode,{...u},i.createElement(Jt.ActionSheetContent,null,i.createElement("div",{className:o.classNames(o.uDropDownList.listContainer({c,popup:!1}))},wt())))},yt=()=>{g.focused&&window.setTimeout(()=>{g.focused&&t.current.wrapper&&ne(t.current.wrapper)})},Dt=e=>{"onMouseDownOutside"in(n.popupSettings||{})&&n.popupSettings.onMouseDownOutside.call(void 0,e)},It=()=>{const{header:e,footer:r,dir:s,groupField:c,groupStickyHeaderItemRender:u,list:m}=n,y=d.getFilteredData(n),f=t.current,a=f.getPopupSettings(),v=n.opened!==void 0?n.opened:g.opened,p=a.width!==void 0?a.width:f.popupWidth,x=b&&b.uDropDownList,I={dir:s!==void 0?s:f.dirCalculated,width:p,popupSettings:{...a,popupClass:o.classNames(a.popupClass,o.uDropDownList.listContainer({c:x,popup:!0})),anchor:a.anchor||Q.current,show:v,onOpen:Ie,onClose:yt,onMouseDownOutside:Dt},itemsCount:[y.length]};let{group:h}=g;return h===void 0&&c!==void 0&&(h=d.getItemValue(y[0],c)),i.createElement(Wt,{...I},qe(!1),e&&i.createElement("div",{className:o.classNames(o.uDropDownList.listHeader({c:x}))},e),i.createElement("div",{className:o.classNames(o.uDropDownList.list({c:x,size:O,virtual:t.current.vs.enabled}))},mt(),!m&&h&&y.length!==0&&i.createElement(et,{group:h,groupMode:"modern",render:u}),ze()),r&&i.createElement("div",{className:o.classNames(o.uDropDownList.listFooter({c:x}))},r),T&&i.createElement(o.WatermarkOverlay,null))},wt=()=>{const{header:e,footer:r,groupStickyHeaderItemRender:s,groupField:c,list:u}=n,m=d.getFilteredData(n),y=b&&b.uDropDownList;let{group:f}=g;return f===void 0&&c!==void 0&&(f=d.getItemValue(m[0],c)),i.createElement(i.Fragment,null,e&&i.createElement("div",{className:o.classNames(o.uDropDownList.listHeader({c:y}))},e),i.createElement("div",{className:o.classNames("k-list",{[`k-list-${U?"lg":o.sizeMap[O]||O}`]:O})},!u&&f&&m.length!==0&&i.createElement(et,{group:f,groupMode:"modern",render:s}),ze()),r&&i.createElement("div",{className:"k-list-footer"},r))},ht=e=>{const{dataItemKey:r}=n,s=d.getFilteredData(n),c=k();let u=s.map((K,G)=>({item:K,itemIndex:G}));const m=_.current.word,y=_.current.last,f=d.sameCharsOnly(m,y);let a=u.length,v=Math.max(0,s.findIndex(K=>d.areSame(K,c,r))),p;n.defaultItem&&(p={item:n.defaultItem,itemIndex:-1},a+=1,v+=1),v+=f?1:0,u=d.shuffleData(u,v,p);let x,I,h,l=0;const{textField:F}=n;for(;l<a;){if(x=d.getItemValue(u[l].item,F),I=f&&d.matchText(x,y,me),h=d.matchText(x,m,me),I||h){l=u[l].itemIndex;break}l++}if(l!==a){const K=t.current.initState();K.syntheticEvent=e,J(l,K),E(K),z.current=void 0}},St=e=>{clearTimeout(Ae.current),n.filterable||(Ae.current=window.setTimeout(()=>_.current.word="",rt),ht(e))},xt=e=>{re.current||t.current.handleFocus(e)},Ct=e=>{if(re.current||!g.focused)return;const r=n.opened!==void 0?n.opened:g.opened,s=t.current.initState();s.syntheticEvent=e,s.data.focused=!1,s.events.push({type:"onBlur"}),r&&he(),r&&!U&&t.current.togglePopup(s),E(s)},Lt=e=>{if(n.filterable||e.which===0||e.keyCode===o.Keys.enter)return;let r=String.fromCharCode(e.charCode||e.keyCode);me&&(r=r.toLowerCase()),r===" "&&e.preventDefault(),_.current={word:_.current.word+r,last:_.current.last+r},St(e)},kt=()=>{const e=t.current.initState();e.data.opened=g.opened,t.current.togglePopup(e),E(e)},Ve=i.useRef(null),Q=i.useRef(null),xe=i.useRef(null),R=i.useRef(null);i.useImperativeHandle(Ve,()=>({get element(){return Q.current},get index(){return at()},get name(){return n.name},get validity(){return De()},get value(){return k()},get focused(){return g.focused},get opened(){return g.opened},focus:st,props:n,togglePopup:kt})),i.useImperativeHandle(Y,()=>Ve.current);const Ae=i.useRef(null),_=i.useRef({word:"",last:""}),re=i.useRef(!1),z=i.useRef(null),V=i.useRef(!1),Ce=i.useRef(!1),A=i.useRef({}),Le=i.useRef({}),t=i.useRef(new tt({props:n,setState:()=>{},state:{},forceUpdate:()=>{},element:null,value:null,handleItemSelect:()=>{}})),He=i.useRef(0),X=i.useRef(null),[g,Kt]=i.useState({}),[ke,bt]=i.useState(),[,Be]=i.useReducer(e=>e,!0),We=Yt.useLocalization(),Z=e=>{Kt({...g,...e})};i.useEffect(()=>{t.current.updateComponentArgs({props:n,setState:Z,state:g,forceUpdate:Be,element:Q.current,handleItemSelect:J,value:k()})},[Z,g,Be,J,k]),i.useEffect(()=>{var v,p,x,I,h,l,F,K,G,te,le,de,S;const{dataItemKey:e,virtual:r,groupField:s="",textField:c}=n,u=d.getFilteredData(n),m=A.current.virtual?A.current.virtual.total:0,y=n.opened!==void 0?n.opened:g.opened,f=A.current.opened!==void 0?A.current.opened:Le.current.opened,a=!f&&y;if((v=t==null?void 0:t.current)==null||v.didUpdate(),(p=t==null?void 0:t.current)!=null&&p.getPopupSettings().animate||a&&Ie(),r&&r.total!==m)(x=t==null?void 0:t.current)==null||x.vs.calcScrollElementHeight(),(I=t==null?void 0:t.current)==null||I.vs.reset();else{const M=k(),ce=A.current.value!==void 0?A.current.value:Le.current.value;let B=u.findIndex(j=>d.areSame(j,M,e));s!==""&&M&&c&&(B=(l=(h=t==null?void 0:t.current)==null?void 0:h.getGroupedDataModernMode(u,s))==null?void 0:l.map(j=>j[c]).indexOf(M[c]));const ue=!d.areSame(ce,M,e);a&&r?(F=t==null?void 0:t.current)==null||F.scrollToVirtualItem(r,B):a&&!r?(Ie(),u&&u.length!==0&&((K=t==null?void 0:t.current)==null||K.resetGroupStickyHeader(u[0][s],{setState:Z,group:g.group,state:g})),(G=t==null?void 0:t.current)==null||G.scrollToItem(B)):y&&f&&M&&ue&&!V.current?(le=t==null?void 0:t.current)==null||le.scrollToItem(B,(te=t==null?void 0:t.current)==null?void 0:te.vs.enabled):y&&f&&V.current&&(V.current&&r&&r.skip===0?(de=t==null?void 0:t.current)==null||de.vs.reset():V.current&&r&&r.skip===r.total-r.pageSize&&((S=t==null?void 0:t.current)==null||S.vs.scrollToEnd()))}V.current=!1,Le.current=g,A.current=n,Ne()}),i.useEffect(()=>{var e,r;return X.current=o.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(lt.bind(void 0)),(e=t==null?void 0:t.current)==null||e.didMount(),Ne(),(r=ve())!=null&&r.body&&X.current&&X.current.observe(ve().body),()=>{var s;(s=ve())!=null&&s.body&&X.current&&X.current.disconnect()}},[]);const _e=fe+"-accessibility-id",Ke=fe+"-listbox-id",Ue=fe+"-guid",Et=We.toLanguageString($.dropDownListArrowBtnAriaLabel,$.messages[$.dropDownListArrowBtnAriaLabel]),{style:oe,className:Ft,label:be,dir:Pt,virtual:H,adaptive:en,dataItemKey:Mt,disabled:se,loading:Ge,iconClassName:je,svgIcon:Nt,valueRender:$e}=n,Ee=n.opened!==void 0?n.opened:g.opened,ae=k(),Fe=d.getItemValue(ae,n.textField),Ye=!it()||De().valid,ie=t.current,Tt=ie.vs,ee=b&&b.uDropDownList;Tt.enabled=H!==void 0;const Je=o.useAdaptiveModeContext(),U=!!(ke&&Je&&ke<=Je.medium&&n.adaptive);H!==void 0&&(ie.vs.skip=H.skip,ie.vs.total=H.total,ie.vs.pageSize=H.pageSize);const Ot=d.getFilteredData(n),{focused:qt}=g,zt=Ot.findIndex(e=>d.areSame(e,ae,Mt)),Qe=i.createElement("span",{id:_e,className:o.classNames(o.uDropDownList.inputInner({c:ee}))},Fe&&i.createElement("span",{className:o.classNames(o.uDropDownList.inputText({c:ee}))},Fe)),Vt=$e!==void 0?$e.call(void 0,Qe,ae):Qe,Re=i.createElement(i.Fragment,null,i.createElement("span",{ref:dt,className:o.classNames(o.uDropDownList.wrapper({c:ee,size:O,rounded:Me,fillMode:ge,focused:qt,disabled:se,invalid:!Ye,loading:Ge,required:ye()}),Ft),style:be?{...oe,width:void 0}:oe,dir:Pt,onMouseDown:Ee?e=>{e.target.nodeName!=="INPUT"&&(ne(t.current.wrapper),e.preventDefault())}:void 0,onFocus:U?e=>Se(e):xt,onBlur:Ct,tabIndex:o.getTabIndex(ot,se),accessKey:n.accessKey,onKeyDown:Oe,onKeyPress:Lt,onClick:se?void 0:Se,role:"combobox","aria-required":ye(),"aria-disabled":se||void 0,"aria-haspopup":"listbox","aria-expanded":Ee||!1,"aria-owns":Ke,"aria-activedescendant":Ee?"option-"+Ue+"-"+(zt+(H?H.skip:0)):void 0,"aria-label":n.ariaLabel||n.label,"aria-labelledby":n.ariaLabelledBy,"aria-describedby":n.ariaDescribedBy||_e,"aria-controls":Ke,id:n.id,title:n.title},Vt,Ge&&i.createElement(o.IconWrap,{className:o.classNames(o.uDropDownList.loadingIcon({c:ee})),name:"loading"}),i.createElement($t.Button,{tabIndex:-1,type:"button","aria-label":Et,size:O,fillMode:ge,className:o.classNames(o.uDropDownList.inputButton({c:ee})),rounded:null,themeColor:"base",iconClass:je,svgIcon:je?void 0:Nt||Bt.caretAltDownIcon,onMouseDown:e=>g.focused&&e.preventDefault()}),ct(ae),!U&&It()),U&&vt());return be?i.createElement(Ht.FloatingLabel,{label:be,editorValue:Fe,editorValid:Ye,editorDisabled:n.disabled,style:{width:oe?oe.width:void 0},children:Re}):Re});pe.propTypes={delay:L.number,ignoreCase:L.bool,iconClassName:L.string,svgIcon:o.svgIconPropType,defaultItem:L.any,valueRender:L.func,valueMap:L.func,validationMessage:L.string,required:L.bool,id:L.string,ariaLabelledBy:L.string,ariaDescribedBy:L.string,ariaLabel:L.string,leftRightKeysNavigation:L.bool,title:L.string,groupField:L.string,list:L.any,skipDisabledItems:L.bool};const P={delay:500,tabIndex:0,ignoreCase:!0,...tt.defaultProps,required:!1,size:"medium",rounded:"medium",fillMode:"solid",groupMode:"modern"};pe.displayName="KendoReactDropDownList";const nt=o.createPropsContext();pe.displayName="KendoReactDropDownList";exports.DropDownList=pe;exports.DropDownListPropsContext=nt;exports.dropDownListDefaultProps=P;
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Bt=require("react"),L=require("prop-types"),o=require("@progress/kendo-react-common"),Wt=require("@progress/kendo-react-labels"),_t=require("@progress/kendo-svg-icons"),Ut=require("../common/ListContainer.js"),Gt=require("../common/ListFilter.js"),tt=require("../common/GroupStickyHeader.js"),jt=require("../common/ListDefaultItem.js"),$t=require("../common/List.js"),rt=require("../common/DropDownBase.js"),d=require("../common/utils.js"),nt=require("../package-metadata.js"),Yt=require("@progress/kendo-react-buttons"),Jt=require("@progress/kendo-react-intl"),$=require("../messages/index.js"),Qt=require("@progress/kendo-react-layout"),Rt=require("../common/AdaptiveMode.js");function Xt(N){const Y=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(N){for(const T in N)if(T!=="default"){const ne=Object.getOwnPropertyDescriptor(N,T);Object.defineProperty(Y,T,ne.get?ne:{enumerable:!0,get:()=>N[T]})}}return Y.default=N,Object.freeze(Y)}const i=Xt(Bt),Zt="Please select a value from the list!",me=i.forwardRef((N,Y)=>{let T=!1;const ne=o.getLicenseMessage(nt.packageMetadata),n=o.usePropsContext(ot,N),{delay:st=P.delay,tabIndex:at=P.tabIndex,ignoreCase:ge=P.ignoreCase,size:O=P.size,rounded:Ne=P.rounded,fillMode:fe=P.fillMode,groupMode:en=P.groupMode}=n;if(n.filterable||n.virtual){const e=[];n.filterable&&e.push("filterable"),n.virtual&&e.push("virtualization"),T=!o.validatePackage(nt.packageMetadata,{component:"DropDownList",features:e})}const b=o.useUnstyled(),ve=o.useId(n.id),ye=()=>{var e;if(o.canUseDOM)return((e=Q.current)==null?void 0:e.ownerDocument)||window.document},it=()=>{var e,r;(e=t==null?void 0:t.current)!=null&&e.wrapper&&((r=t==null?void 0:t.current)==null||r.wrapper.focus({preventScroll:!0}))},k=()=>{let e;return z.current!==void 0&&z.current!==null?e=z.current:n.value!==void 0?e=n.value:g.value!==void 0&&g.value!==null?e=g.value:n.defaultValue!==void 0&&n.defaultValue!==null&&(e=n.defaultValue),!d.isPresent(e)&&n.defaultItem!==void 0&&n.defaultItem!==null&&(e=n.defaultItem),e},lt=()=>{const{dataItemKey:e}=n,r=d.getFilteredData(n),s=k();return r.findIndex(c=>d.areSame(c,s,e))},De=()=>n.required!==void 0?n.required:P.required,Ie=()=>{const e=n.validationMessage!==void 0,r=k(),s=!De()||r!==null&&r!==""&&r!==void 0,c=n.valid!==void 0?n.valid:s;return{customError:e,valid:c,valueMissing:r===null}},dt=()=>n.validityStyles!==void 0?n.validityStyles:P.validityStyles,re=e=>{oe.current=!0,e.focus(),window.setTimeout(()=>oe.current=!1,30)},we=()=>{R.current&&re(R.current),n.adaptive&&setTimeout(()=>{R.current&&re(R.current)},300)},ct=i.useCallback(e=>{for(const r of e)Ft(r.target.clientWidth)},[]),Te=()=>{var e;(e=Ce.current)!=null&&e.setCustomValidity&&Ce.current.setCustomValidity(Ie().valid?"":n.validationMessage||Zt)},W=(e,r)=>{const s=k();d.areSame(s,e,n.dataItemKey)||(n.value===void 0&&(r.data.value=e),t.current.updateComponentArgs({value:e}),z.current=e,r.events.push({type:"onChange"}))},E=e=>{var r;(r=t==null?void 0:t.current)==null||r.applyState(e),z.current=void 0},J=(e,r)=>{var p;const{virtual:s,dataItemKey:c,defaultItem:u}=n,m=d.getFilteredData(n),y=s?s.skip:0,f=k(),a=e===-1&&u!==void 0?u:m[e-y],v=!d.areSame(a,f,c);W(a,r),v&&((p=t==null?void 0:t.current)==null||p.triggerPageChangeCornerItems(a,r))},q=(e,r,s)=>{var x,I;const{defaultItem:c,dataItemKey:u,virtual:m={skip:0,total:0,pageSize:0}}=n,y=k(),f=d.getFilteredData(n),a=(x=t==null?void 0:t.current)==null?void 0:x.vs,v=f.findIndex(h=>d.areSame(h,y,u)),p=(I=t==null?void 0:t.current)==null?void 0:I.navigation.navigate({current:m.skip+v,max:(a!=null&&a.enabled?m.total:f.length)-1,min:c!==void 0?-1:0,keyCode:r,skipItems:s||void 0});p!==void 0&&J(p,e),E(e)},ut=e=>{Q.current=e,t.current.wrapper=e},pt=e=>i.createElement("select",{name:n.name,ref:r=>{Ce.current=r},tabIndex:-1,"aria-hidden":!0,title:n.label,style:{opacity:0,width:1,border:0,zIndex:-1,position:"absolute",left:"50%"}},i.createElement("option",{value:n.valueMap?n.valueMap.call(void 0,e):e})),he=()=>{const{textField:e,dataItemKey:r,virtual:s={skip:0},focusedItemIndex:c=d.itemIndexStartsWith,filterable:u,skipDisabledItems:m=!0}=n,y=k(),f=d.getFilteredData(n),a=n.filter?n.filter:g.text;return m&&e&&!a&&!y?f.findIndex(v=>!v.disabled&&v[e]):d.isPresent(y)&&a===void 0||u&&a===""?f.findIndex(v=>d.areSame(v,y,r)):a?Le.current?c(f,a,e):f.findIndex(v=>d.areSame(v,y,r)):s.skip===0?0:-1},Oe=(e,r)=>r!==void 0&&r!==-1&&e&&e.length>0&&e[r].disabled,Se=()=>{const e=d.getFilteredData(n),r=t.current.initState(),s=he();Oe(e,s)&&(W(null,r),E(r))},xe=e=>{if(e.isPropagationStopped())return;const r=t.current.initState();r.syntheticEvent=e,g.focused||(r.data.focused=!0),Se(),t.current.togglePopup(r),E(r)},qe=e=>{var M,ue,B,pe,j,Ze,et;e&&e.target instanceof Element&&e.target.nodeName==="INPUT"&&e.stopPropagation&&e.stopPropagation();const{filterable:r,disabled:s,defaultItem:c,leftRightKeysNavigation:u=!0,virtual:m={skip:0,total:0,pageSize:0},dataItemKey:y,groupField:f="",textField:a,skipDisabledItems:v=!0}=n,p=d.getFilteredData(n),x=k(),I=p.findIndex(C=>d.areSame(C,x,y)),h=n.opened!==void 0?n.opened:g.opened,l=e.keyCode,F=l===o.Keys.home||l===o.Keys.end,K=l===o.Keys.up||l===o.Keys.down,G=!h&&(e.altKey&&l===o.Keys.down||l===o.Keys.enter||l===o.Keys.space),te=h&&(e.altKey&&l===o.Keys.up||l===o.Keys.esc),de=u&&(l===o.Keys.left||l===o.Keys.right),ce=K||de&&!r||F,S=t.current.initState();if(S.syntheticEvent=e,!s){if(F&&((M=t==null?void 0:t.current)!=null&&M.vs.enabled))l===o.Keys.home?m.skip!==0?((ue=t==null?void 0:t.current)==null||ue.triggerOnPageChange(S,0,m.pageSize),V.current=!0):W(p[0],S):m.skip<m.total-m.pageSize?((B=t==null?void 0:t.current)==null||B.triggerOnPageChange(S,m.total-m.pageSize,m.pageSize),V.current=!0):W(p[p.length-1],S);else if(h&&l===o.Keys.pageUp)e.preventDefault(),(pe=t==null?void 0:t.current)==null||pe.scrollPopupByPageSize(-1);else if(h&&l===o.Keys.pageDown)e.preventDefault(),(j=t==null?void 0:t.current)==null||j.scrollPopupByPageSize(1);else if(h&&l===o.Keys.enter){const C=he();Oe(p,C)?(W(null,S),E(S)):J(C,S),(Ze=t==null?void 0:t.current)==null||Ze.togglePopup(S),e.preventDefault()}else if(G||te)te&&Se(),(et=t==null?void 0:t.current)==null||et.togglePopup(S),e.preventDefault();else if(ce){if(Le.current=!1,f!==""&&a)if(!v&&h)q(S,l);else{let C;if(l===o.Keys.down||l===o.Keys.right){const w=p.slice(I+1).find(D=>!D.disabled&&D[a]);C=w&&p.findIndex(D=>D[a]===w[a])}else if(l===o.Keys.up||l===o.Keys.left){let w;if(I===0&&c)C=-1;else if(I===-1)w=p,C=p.findIndex(D=>!D.disabled&&D[a]);else{w=p.slice(0,I);let D=w.pop();for(;D&&D.disabled;)D=w.pop();C=D&&p.findIndex(Me=>Me[a]===D[a])}}if(C!==void 0){const w=C-I;q(S,l,w)}else C===void 0&&p.findIndex(w=>w[a]===x[a])===p.length-1&&q(S,l)}else if(!v&&h||F)q(S,l);else if(a){let C;if(l===o.Keys.down||l===o.Keys.right){const w=p.slice(I+1).find(D=>!D.disabled&&D[a]);C=w&&p.findIndex(D=>D[a]===w[a])}else if(l===o.Keys.up||l===o.Keys.left){let w;if(I===0&&c)C=-1;else if(I===-1)w=p,C=p.find(D=>!D.disabled&&D[a]);else{w=p.slice(0,I);let D=w.pop();for(;D&&D.disabled;)D=w.pop();C=D&&p.findIndex(Me=>Me[a]===D[a])}}if(C!==void 0){const w=C-I;q(S,l,w)}else C===void 0&&p.findIndex(w=>w[a]===x[a])===p.length-1&&q(S,l)}else q(S,l);e.preventDefault()}E(S)}},mt=e=>{const r=t.current.initState();r.syntheticEvent=e.syntheticEvent,n.filter===void 0&&(r.data.text=e.target.value),t.current.filterChanged(e.target.value,r),Le.current=!0,E(r),Z({group:void 0,text:String(e.target.value)})},ze=e=>{const r=n.filter!==void 0?n.filter:g.text;return n.filterable&&i.createElement(Gt,{value:r,ref:s=>{R.current=s&&s.element},onChange:mt,onKeyDown:qe,size:e?"large":O,rounded:Ne,fillMode:fe,renderListFilterWrapper:!0,placeholder:_e.toLanguageString($.dropDownListAdaptiveFilterPlaceholder,$.messages[$.dropDownListAdaptiveFilterPlaceholder])})},gt=e=>{var s;const r=t.current.initState();r.syntheticEvent=e,(s=t==null?void 0:t.current)==null||s.togglePopup(r),W(n.defaultItem,r),E(r)},ft=()=>{const{textField:e,defaultItem:r,dataItemKey:s}=n,c=k();return r!==void 0&&i.createElement(jt,{defaultItem:r,textField:e,selected:d.areSame(c,r,s),key:"defaultitemkey",onClick:gt})},vt=(e,r)=>{var s;(s=t==null?void 0:t.current)==null||s.handleItemClick(e,r),z.current=void 0},yt=e=>{const{vs:r,list:s}=t.current;r.scrollHandler(e);const{groupField:c}=n;let u=d.getFilteredData(n);if(!(!c||!u.length)&&c){const m=Be.current=Be.current||(r.enabled?r.itemHeight:s?s.children[0].offsetHeight:0),f=e.target.scrollTop-r.skip*m;u=t.current.getGroupedDataModernMode(u,c);let a=u[0][c];for(let v=1;v<u.length&&!(m*v>f);v++)u[v]&&u[v][c]&&(a=u[v][c]);a!==g.group&&Z({group:a})}},Ve=()=>{var l;const{textField:e,dataItemKey:r,virtual:s={skip:0,total:void 0},groupHeaderItemRender:c,listNoDataRender:u,itemRender:m}=n,y=d.getFilteredData(n),f=b&&b.uDropDownList,a=t.current.vs,v=s.skip,p=n.opened!==void 0?n.opened:g.opened,x=t.current.getPopupSettings(),I=`translateY(${a.translate}px)`,h=k();return i.createElement($t,{id:be,show:p,data:y.slice(),focusedIndex:he(),value:h,textField:e,valueField:r,optionsGuid:Ge,groupField:n.groupField,groupMode:"modern",listRef:F=>{a.list=t.current.list=F},wrapperStyle:{maxHeight:U?void 0:x.height},wrapperCssClass:o.classNames(o.uDropDownList.listContent({c:f})),listStyle:a.enabled?{transform:I}:void 0,key:"listkey",skip:v,onClick:vt,itemRender:m,groupHeaderItemRender:c,noDataRender:u,onScroll:yt,wrapperRef:a.scrollerRef,scroller:(l=t==null?void 0:t.current)==null?void 0:l.renderScrollElement(),ariaSetSize:s.total})},Dt=()=>{const{groupField:e}=n,r=d.getFilteredData(n),s=n.opened!==void 0?n.opened:g.opened,c=b&&b.uDropDownList,u={title:n.adaptiveTitle||n.label,subTitle:n.adaptiveSubtitle,expand:s,onClose:y=>xe(y),windowWidth:Ke,mobileFilter:ze(!0)};let{group:m}=g;return m===void 0&&e!==void 0&&(m=d.getItemValue(r[0],e)),i.createElement(Rt.AdaptiveMode,{...u},i.createElement(Qt.ActionSheetContent,null,i.createElement("div",{className:o.classNames(o.uDropDownList.listContainer({c,popup:!1}))},St())))},It=()=>{g.focused&&window.setTimeout(()=>{g.focused&&t.current.wrapper&&re(t.current.wrapper)})},wt=e=>{"onMouseDownOutside"in(n.popupSettings||{})&&n.popupSettings.onMouseDownOutside.call(void 0,e)},ht=()=>{const{header:e,footer:r,dir:s,groupField:c,groupStickyHeaderItemRender:u,list:m}=n,y=d.getFilteredData(n),f=t.current,a=f.getPopupSettings(),v=n.opened!==void 0?n.opened:g.opened,p=a.width!==void 0?a.width:f.popupWidth,x=b&&b.uDropDownList,I={dir:s!==void 0?s:f.dirCalculated,width:p,popupSettings:{...a,popupClass:o.classNames(a.popupClass,o.uDropDownList.listContainer({c:x,popup:!0})),anchor:a.anchor||Q.current,show:v,onOpen:we,onClose:It,onMouseDownOutside:wt},itemsCount:[y.length]};let{group:h}=g;return h===void 0&&c!==void 0&&(h=d.getItemValue(y[0],c)),i.createElement(Ut,{...I},ze(!1),e&&i.createElement("div",{className:o.classNames(o.uDropDownList.listHeader({c:x}))},e),i.createElement("div",{className:o.classNames(o.uDropDownList.list({c:x,size:O,virtual:t.current.vs.enabled}))},ft(),!m&&h&&y.length!==0&&i.createElement(tt,{group:h,groupMode:"modern",render:u}),Ve()),r&&i.createElement("div",{className:o.classNames(o.uDropDownList.listFooter({c:x}))},r),T&&i.createElement(o.WatermarkOverlay,{message:ne}))},St=()=>{const{header:e,footer:r,groupStickyHeaderItemRender:s,groupField:c,list:u}=n,m=d.getFilteredData(n),y=b&&b.uDropDownList;let{group:f}=g;return f===void 0&&c!==void 0&&(f=d.getItemValue(m[0],c)),i.createElement(i.Fragment,null,e&&i.createElement("div",{className:o.classNames(o.uDropDownList.listHeader({c:y}))},e),i.createElement("div",{className:o.classNames("k-list",{[`k-list-${U?"lg":o.sizeMap[O]||O}`]:O})},!u&&f&&m.length!==0&&i.createElement(tt,{group:f,groupMode:"modern",render:s}),Ve()),r&&i.createElement("div",{className:"k-list-footer"},r))},xt=e=>{const{dataItemKey:r}=n,s=d.getFilteredData(n),c=k();let u=s.map((K,G)=>({item:K,itemIndex:G}));const m=_.current.word,y=_.current.last,f=d.sameCharsOnly(m,y);let a=u.length,v=Math.max(0,s.findIndex(K=>d.areSame(K,c,r))),p;n.defaultItem&&(p={item:n.defaultItem,itemIndex:-1},a+=1,v+=1),v+=f?1:0,u=d.shuffleData(u,v,p);let x,I,h,l=0;const{textField:F}=n;for(;l<a;){if(x=d.getItemValue(u[l].item,F),I=f&&d.matchText(x,y,ge),h=d.matchText(x,m,ge),I||h){l=u[l].itemIndex;break}l++}if(l!==a){const K=t.current.initState();K.syntheticEvent=e,J(l,K),E(K),z.current=void 0}},Ct=e=>{clearTimeout(He.current),n.filterable||(He.current=window.setTimeout(()=>_.current.word="",st),xt(e))},Lt=e=>{oe.current||t.current.handleFocus(e)},kt=e=>{if(oe.current||!g.focused)return;const r=n.opened!==void 0?n.opened:g.opened,s=t.current.initState();s.syntheticEvent=e,s.data.focused=!1,s.events.push({type:"onBlur"}),r&&Se(),r&&!U&&t.current.togglePopup(s),E(s)},Kt=e=>{if(n.filterable||e.which===0||e.keyCode===o.Keys.enter)return;let r=String.fromCharCode(e.charCode||e.keyCode);ge&&(r=r.toLowerCase()),r===" "&&e.preventDefault(),_.current={word:_.current.word+r,last:_.current.last+r},Ct(e)},bt=()=>{const e=t.current.initState();e.data.opened=g.opened,t.current.togglePopup(e),E(e)},Ae=i.useRef(null),Q=i.useRef(null),Ce=i.useRef(null),R=i.useRef(null);i.useImperativeHandle(Ae,()=>({get element(){return Q.current},get index(){return lt()},get name(){return n.name},get validity(){return Ie()},get value(){return k()},get focused(){return g.focused},get opened(){return g.opened},focus:it,props:n,togglePopup:bt})),i.useImperativeHandle(Y,()=>Ae.current);const He=i.useRef(null),_=i.useRef({word:"",last:""}),oe=i.useRef(!1),z=i.useRef(null),V=i.useRef(!1),Le=i.useRef(!1),A=i.useRef({}),ke=i.useRef({}),t=i.useRef(new rt({props:n,setState:()=>{},state:{},forceUpdate:()=>{},element:null,value:null,handleItemSelect:()=>{}})),Be=i.useRef(0),X=i.useRef(null),[g,Et]=i.useState({}),[Ke,Ft]=i.useState(),[,We]=i.useReducer(e=>e,!0),_e=Jt.useLocalization(),Z=e=>{Et({...g,...e})};i.useEffect(()=>{t.current.updateComponentArgs({props:n,setState:Z,state:g,forceUpdate:We,element:Q.current,handleItemSelect:J,value:k()})},[Z,g,We,J,k]),i.useEffect(()=>{var v,p,x,I,h,l,F,K,G,te,de,ce,S;const{dataItemKey:e,virtual:r,groupField:s="",textField:c}=n,u=d.getFilteredData(n),m=A.current.virtual?A.current.virtual.total:0,y=n.opened!==void 0?n.opened:g.opened,f=A.current.opened!==void 0?A.current.opened:ke.current.opened,a=!f&&y;if((v=t==null?void 0:t.current)==null||v.didUpdate(),(p=t==null?void 0:t.current)!=null&&p.getPopupSettings().animate||a&&we(),r&&r.total!==m)(x=t==null?void 0:t.current)==null||x.vs.calcScrollElementHeight(),(I=t==null?void 0:t.current)==null||I.vs.reset();else{const M=k(),ue=A.current.value!==void 0?A.current.value:ke.current.value;let B=u.findIndex(j=>d.areSame(j,M,e));s!==""&&M&&c&&(B=(l=(h=t==null?void 0:t.current)==null?void 0:h.getGroupedDataModernMode(u,s))==null?void 0:l.map(j=>j[c]).indexOf(M[c]));const pe=!d.areSame(ue,M,e);a&&r?(F=t==null?void 0:t.current)==null||F.scrollToVirtualItem(r,B):a&&!r?(we(),u&&u.length!==0&&((K=t==null?void 0:t.current)==null||K.resetGroupStickyHeader(u[0][s],{setState:Z,group:g.group,state:g})),(G=t==null?void 0:t.current)==null||G.scrollToItem(B)):y&&f&&M&&pe&&!V.current?(de=t==null?void 0:t.current)==null||de.scrollToItem(B,(te=t==null?void 0:t.current)==null?void 0:te.vs.enabled):y&&f&&V.current&&(V.current&&r&&r.skip===0?(ce=t==null?void 0:t.current)==null||ce.vs.reset():V.current&&r&&r.skip===r.total-r.pageSize&&((S=t==null?void 0:t.current)==null||S.vs.scrollToEnd()))}V.current=!1,ke.current=g,A.current=n,Te()}),i.useEffect(()=>{var e,r;return X.current=o.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(ct.bind(void 0)),(e=t==null?void 0:t.current)==null||e.didMount(),Te(),(r=ye())!=null&&r.body&&X.current&&X.current.observe(ye().body),()=>{var s;(s=ye())!=null&&s.body&&X.current&&X.current.disconnect()}},[]);const Ue=ve+"-accessibility-id",be=ve+"-listbox-id",Ge=ve+"-guid",Pt=_e.toLanguageString($.dropDownListArrowBtnAriaLabel,$.messages[$.dropDownListArrowBtnAriaLabel]),{style:se,className:Mt,label:Ee,dir:Nt,virtual:H,adaptive:tn,dataItemKey:Tt,disabled:ae,loading:je,iconClassName:$e,svgIcon:Ot,valueRender:Ye}=n,Fe=n.opened!==void 0?n.opened:g.opened,ie=k(),Pe=d.getItemValue(ie,n.textField),Je=!dt()||Ie().valid,le=t.current,qt=le.vs,ee=b&&b.uDropDownList;qt.enabled=H!==void 0;const Qe=o.useAdaptiveModeContext(),U=!!(Ke&&Qe&&Ke<=Qe.medium&&n.adaptive);H!==void 0&&(le.vs.skip=H.skip,le.vs.total=H.total,le.vs.pageSize=H.pageSize);const zt=d.getFilteredData(n),{focused:Vt}=g,At=zt.findIndex(e=>d.areSame(e,ie,Tt)),Re=i.createElement("span",{id:Ue,className:o.classNames(o.uDropDownList.inputInner({c:ee}))},Pe&&i.createElement("span",{className:o.classNames(o.uDropDownList.inputText({c:ee}))},Pe)),Ht=Ye!==void 0?Ye.call(void 0,Re,ie):Re,Xe=i.createElement(i.Fragment,null,i.createElement("span",{ref:ut,className:o.classNames(o.uDropDownList.wrapper({c:ee,size:O,rounded:Ne,fillMode:fe,focused:Vt,disabled:ae,invalid:!Je,loading:je,required:De()}),Mt),style:Ee?{...se,width:void 0}:se,dir:Nt,onMouseDown:Fe?e=>{e.target.nodeName!=="INPUT"&&(re(t.current.wrapper),e.preventDefault())}:void 0,onFocus:U?e=>xe(e):Lt,onBlur:kt,tabIndex:o.getTabIndex(at,ae),accessKey:n.accessKey,onKeyDown:qe,onKeyPress:Kt,onClick:ae?void 0:xe,role:"combobox","aria-required":De(),"aria-disabled":ae||void 0,"aria-haspopup":"listbox","aria-expanded":Fe||!1,"aria-owns":be,"aria-activedescendant":Fe?"option-"+Ge+"-"+(At+(H?H.skip:0)):void 0,"aria-label":n.ariaLabel||n.label,"aria-labelledby":n.ariaLabelledBy,"aria-describedby":n.ariaDescribedBy||Ue,"aria-controls":be,id:n.id,title:n.title},Ht,je&&i.createElement(o.IconWrap,{className:o.classNames(o.uDropDownList.loadingIcon({c:ee})),name:"loading"}),i.createElement(Yt.Button,{tabIndex:-1,type:"button","aria-label":Pt,size:O,fillMode:fe,className:o.classNames(o.uDropDownList.inputButton({c:ee})),rounded:null,themeColor:"base",iconClass:$e,svgIcon:$e?void 0:Ot||_t.caretAltDownIcon,onMouseDown:e=>g.focused&&e.preventDefault()}),pt(ie),!U&&ht()),U&&Dt());return Ee?i.createElement(Wt.FloatingLabel,{label:Ee,editorValue:Pe,editorValid:Je,editorDisabled:n.disabled,style:{width:se?se.width:void 0},children:Xe}):Xe});me.propTypes={delay:L.number,ignoreCase:L.bool,iconClassName:L.string,svgIcon:o.svgIconPropType,defaultItem:L.any,valueRender:L.func,valueMap:L.func,validationMessage:L.string,required:L.bool,id:L.string,ariaLabelledBy:L.string,ariaDescribedBy:L.string,ariaLabel:L.string,leftRightKeysNavigation:L.bool,title:L.string,groupField:L.string,list:L.any,skipDisabledItems:L.bool};const P={delay:500,tabIndex:0,ignoreCase:!0,...rt.defaultProps,required:!1,size:"medium",rounded:"medium",fillMode:"solid",groupMode:"modern"};me.displayName="KendoReactDropDownList";const ot=o.createPropsContext();me.displayName="KendoReactDropDownList";exports.DropDownList=me;exports.DropDownListPropsContext=ot;exports.dropDownListDefaultProps=P;
|