@progress/kendo-react-dropdowns 14.4.0-develop.5 → 14.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 +1 -1
- package/DropDownList/DropDownList.js +1 -1
- package/DropDownList/DropDownList.mjs +65 -65
- package/dist/cdn/js/kendo-react-dropdowns.js +1 -1
- package/package-metadata.js +1 -1
- package/package-metadata.mjs +2 -2
- package/package.json +10 -10
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 $=require("react"),f=require("prop-types"),O=require("../common/DropDownBase.js"),h=require("@progress/kendo-react-common"),Y=require("@progress/kendo-react-labels"),d=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"),K=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"),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!",F=class F extends m.Component{constructor(s){super(s),this.state={},this.base=new O(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.scrollToFocused=!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=d.getPlainDataDuplicates(i),this.hasDuplicates=this.duplicates.length>0}},this.handleKendoPasteValue=e=>{const{data:t,textField:i,allowCustom:r}=this.props;if(!t)return;const n=e!=null?String(e):"",a=d.getItemIndexByText(t,n,i,!1,!0),p=a!==-1;let l=null;if(p?l=t[a]:r&&(l=i?{[i]:n}:n),l===null)return;const o=this.base.initState();o.syntheticEvent={target:this._element,currentTarget:this._element,nativeEvent:new Event("change",{bubbles:!0})},this.state.text!==void 0&&(o.data.text=void 0),this.triggerOnChange(l,o),this.applyState(o)},this.handleItemSelect=(e,t)=>{const{virtual:i,dataItemKey:r}=this.props,n=d.getFilteredData(this.props),a=i?i.skip:0,p=n[e-a],l=this.hasDuplicates||!d.areSame(p,this.value,r);this.triggerOnChange(p,t),this.state.text!==void 0&&(t.data.text=void 0),l&&this.base.triggerPageChangeCornerItems(p,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=d.getFilteredData(this.props),n=this.getFocusedIndex(),a=this.getCurrentValueDisabledStatus(i,r,n),p=this.props.opened!==void 0?this.props.opened:this.state.opened,l=this.base.initState();if(l.syntheticEvent=e,!t&&i&&a&&this.clearValueOnToggleBtnClick(e),this.base.togglePopup(l),!p&&this.mobileMode){const o=this.props.adaptiveFilter!==void 0?this.props.adaptiveFilter:this.state.text||null;this.base.filterChanged(o,l)}this.applyState(l),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=d.getItemValue(this.value,this.props.textField),i=d.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:n,list:a,unstyled:p,virtual:l}=this.props,o=d.getFilteredData(this.props),c=p&&p.uComboBox;let{group:u}=this.state;return u===void 0&&n!==void 0&&(u=d.getItemValue(o[0],n)),m.createElement("div",{className:h.classNames(h.uComboBox.list({c,list:a,size:"large",tableSize:i,virtual:l}))},e&&m.createElement("div",{className:h.classNames(h.uComboBox.listHeader({c}))},e),!a&&u&&o.length!==0&&m.createElement(_,{group:u,render:r}),this.renderList(),t&&m.createElement("div",{className:h.classNames(h.uComboBox.listFooter({c}),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;this.props.onListScroll&&this.props.onListScroll(e);let n=d.getFilteredData(this.props);if(!r||!n.length)return;const a=this.itemHeight=this.itemHeight||(t.enabled?t.itemHeight:i?i.children[0].offsetHeight:0),l=e.target.scrollTop-t.skip*a;n=this.base.getGroupedDataModernMode(n,r);let o=n[0][r];for(let c=1;c<n.length&&!(a*c>l);c++)n[c]&&n[c][r]&&(o=n[c][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=d.getFilteredData(this.props),n=this.getFocusedIndex(),p=!(n===-1)&&this.getCurrentValueDisabledStatus(i,r,n);t.data.focused=!1,t.events.push({type:"onBlur"}),t.syntheticEvent=e,i&&p&&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:n}=this.props,a=d.getFilteredData(this.props),p=this.value,l=Math.max(0,a.findIndex(v=>d.areSame(v,p,r))),o=e.keyCode,c=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(),n!==""&&i)if(!this.props.skipDisabledItems&&c)this.onNavigate(u,o);else{let v=0;if(o===h.Keys.down||o===h.Keys.right){const g=a.slice(l+1<a.length?l+1:l).find(x=>!x.disabled&&x[i]);v=g&&a.findIndex(x=>x[i]===g[i])}else if(o===h.Keys.up||o===h.Keys.left){let g;if(l===0)g=a,v=a.findIndex(x=>!x.disabled&&x[i]);else{g=a.slice(0,l);let x=g.pop();for(;x&&x.disabled;)x=g.pop();v=x&&a.findIndex(S=>S[i]===x[i])}}if(v!==void 0){const g=v-l;this.onNavigate(u,o,g)}else v===void 0&&a.findIndex(g=>g[i]===p[i])===a.length-1&&this.onNavigate(u,o)}else if(!this.props.skipDisabledItems&&c)this.onNavigate(u,o);else{let v=null;if(o===h.Keys.down||o===h.Keys.right)v=a.slice(l+1).find(g=>!g.disabled);else if(o===h.Keys.up||o===h.Keys.left){const g=a.slice(0,l);for(v=g.pop();v&&v.disabled;)v=g.pop()}if(v){const g=v.id-l-1;this.onNavigate(u,o,g)}else this.onNavigate(u,o)}this.applyState(u)}const y=()=>{e.preventDefault(),this.base.togglePopup(u),this.applyState(u)},C=this.getFocusedIndex(),I=C===-1,b=!I&&this.getCurrentValueDisabledStatus(i,a,C);c?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?y():o===h.Keys.enter?(e.preventDefault(),(i&&!I&&e.currentTarget.value?a[C][i]:void 0)?!t&&i&&b?this.clearValueOnEnterOrEsc(e):b||this.applyValueOnEnter(e.currentTarget.value,u):this.applyValueOnEnter(e.currentTarget.value,u)):o===h.Keys.esc&&(!t&&i&&b&&this.clearValueOnEnterOrEsc(e),this.applyValueOnRejectSuggestions(e.currentTarget.value,u)):!c&&o===h.Keys.esc?this.clearValueOnEnterOrEsc(e):e.altKey&&o===h.Keys.down&&y()},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,n=r.value;if(this.props.suggest){const a=r.selectionEnd===n.length;let p=this.props.filter!==void 0?this.props.filter:this.state.text;d.isPresent(p)||(p=d.getItemValue(this.value,this.props.textField)||"");const l=p&&p===n,o=p&&p.length>n.length;l||o||!a?this._suggested="":this.suggestValue(n)}this.props.filter===void 0&&(t.data.text=n),this.state.focusedItem!==void 0&&(t.data.focusedItem=void 0),i?this.scrollToFocused=!0:this.base.togglePopup(t),this.base.filterChanged(n,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(K.packageMetadata,{component:"ComboBox"}),this.licenseMessage=h.getLicenseMessage(K.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=d.getFilteredData(this.props),t=this.value;return e.findIndex(i=>d.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:F.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:F.defaultProps.required}componentDidUpdate(s,e){var y,C;const{dataItemKey:t,virtual:i,groupField:r="",textField:n}=this.props,a=d.getFilteredData(this.props),p=s.virtual?s.virtual.total:0,l=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 c=!o&&l,u=this.value;if(this._valueOnDidUpdate=u,this.base.didUpdate(),i&&i.total!==p)this.base.vs.calcScrollElementHeight(),this.base.vs.reset();else{const I=s.value!==void 0?s.value:e.value;let b=this.hasDuplicates?this.navigationIndex||0:a.findIndex(g=>d.areSame(g,u,t));n&&u&&(b=(y=this.base.getGroupedDataModernMode(a,r))==null?void 0:y.map(g=>g[n]).indexOf(u[n]));const v=!d.areSame(I,u,t);if(c&&i?this.base.scrollToVirtualItem(i,b):c&&!i?(this.onPopupOpened(),a&&a.length!==0&&this.base.resetGroupStickyHeader(a[0][r],this),this.base.scrollToItem(b)):(this.hasDuplicates||l&&o&&u&&v)&&this.base.scrollToItem(b),l&&o&&this.scrollToFocused){const g=(C=this.props.filter?this.props.filter:this.state.text)!=null?C:"";if(g){const{focusedItemIndex:x=d.itemIndexStartsWith}=this.props,S=x(a,g,n);this.base.scrollToItem(S)}else this.base.scrollToItem(0)}}this.scrollToFocused=!1,c&&this._input&&this._input.focus(),this.setValidity()}componentDidMount(){var e;this.observerResize=h.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.base.didMount(),this.setValidity(),(e=this.document)!=null&&e.body&&this.observerResize&&this.observerResize.observe(this.document.body),this.checkForDuplicatePlainTextRecords();const s=this.props.name||this.props.id;this.KendoPasteSubscription=h.subscribeToKendoPaste(this._element,{fieldName:s,onValueChange:t=>{this.handleKendoPasteValue(t)}})}componentWillUnmount(){var s,e;(s=this.document)!=null&&s.body&&this.observerResize&&this.observerResize.disconnect(),(e=this.KendoPasteSubscription)==null||e.unsubscribe()}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=F.defaultProps.clearButton,label:n,textField:a,className:p,style:l,loading:o,iconClassName:c,virtual:u,size:y,rounded:C,fillMode:I,opened:b=this.state.opened,placeholder:v,svgIcon:g,unstyled:x}=this.props,S=!this.validityStyles||this.validity.valid,D=this.props.filter!==void 0?this.props.filter:this.state.text,A=d.getItemValue(this.value,a),V=d.isPresent(D)?D:A,z=r&&(!!V||d.isPresent(this.value)),B=this.base.vs,T=this.props.id||this._inputId,E=x&&x.uComboBox;B.enabled=u!==void 0,u!==void 0&&(B.skip=u.skip,B.total=u.total,B.pageSize=u.pageSize);const[H,W]=L(this.props.prefix||m.Fragment),[j,U]=L(this.props.suffix||m.Fragment),P=m.createElement(m.Fragment,null,m.createElement("span",{className:h.classNames(h.uComboBox.wrapper({c:E,size:y,rounded:C,fillMode:I,disabled:i,invalid:!S,loading:o,required:this.required}),p),ref:this.componentRef,style:n?{...l,width:void 0}:l,dir:t,onFocus:this.handleFocus},this.props.prefix&&m.createElement(H,{...W}),this.renderSearchBar(V||"",T,v),z&&!o&&m.createElement(ee,{onClick:this.clearButtonClick,key:"clearbutton"}),o&&m.createElement(h.IconWrap,{className:h.classNames(h.uComboBox.loadingIcon({c:E})),name:"loading",key:"loading"}),this.props.suffix&&m.createElement(j,{...U}),m.createElement(te.Button,{tabIndex:-1,type:"button","aria-label":b?e:s,icon:c?void 0:"caret-alt-down",svgIcon:g||se.caretAltDownIcon,iconClass:c,size:y,fillMode:I,className:h.classNames(h.uComboBox.inputButton({c:E})),onClick:this.toggleBtnClick,onMouseDown:G=>G.preventDefault()}),!this.mobileMode&&this.renderListContainer()),this.mobileMode&&this.renderAdaptiveListContainer());return n?m.createElement(Y.FloatingLabel,{label:n,editorId:T,editorValue:V,editorValid:S,editorDisabled:i,style:{width:l?l.width:void 0},children:P,unstyled:x}):P}onNavigate(s,e,t){const{virtual:i={skip:0}}=this.props,r=d.getFilteredData(this.props),n=this.props.filter?this.props.filter:this.state.text;let a=-1,p;const l=this.base.vs,o=this.value;this._suggested="";const c=this.hasDuplicates&&this.duplicates.indexOf(o)!==-1;if(a=this.getFocusedIndex(c),a!==-1&&!d.isPresent(o))this.handleItemSelect(a,s);else if(n==="")this.handleItemSelect(0,s);else{const u=i.skip+a;p=this.base.navigation.navigate({keyCode:e,current:u,max:(l.enabled?l.total:r.length)-1,min:0,skipItems:t||void 0}),p!==void 0&&this.handleItemSelect(p,s)}this.navigationIndex=p}getCurrentValueDisabledStatus(s,e,t){return s&&e&&e[t]&&e[t].disabled}applyValueOnEnter(s,e){const{textField:t,allowCustom:i,ignoreCase:r}=this.props,n=d.getFilteredData(this.props),a=this.props.opened!==void 0?this.props.opened:this.state.opened,l=d.getItemValue(this.value,t)===s?this.index:d.getItemIndexByText(n,s,t,!1,r),o=l!==-1;let c;if(this._suggested="",o)c=n[l];else if(i)c=t!==void 0?{[t]:s}:s;else return this.selectFocusedItem(s,e);this.triggerOnChange(c,e),a&&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,ignoreCase:r}=this.props,n=d.getFilteredData(this.props),a=this.props.opened!==void 0?this.props.opened:this.state.opened,p=d.getItemValue(this.value,t);if(this._suggested="",s===p||s===""&&!d.isPresent(p))return this.closeOpenedApplyStateNonMobileMode(e,a),this.applyState(e);const l=d.getItemIndexByText(n,s,t,!0,r),o=l!==-1;let c=null;o?c=n[l]:i&&(c=s?t?{[t]:s}:s:null),this.triggerOnChange(c,e),this.state.text!==void 0&&(e.data.text=void 0,this.base.filterChanged("",e)),this.closeOpenedApplyStateNonMobileMode(e,a),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:n=d.itemIndexStartsWith}=this.props,a=d.getFilteredData(this.props),p=r.skip,l=s===""&&p===0?0:n(a,s,i);return l!==-1?this.handleItemSelect(l+p,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=d.getFilteredData(this.props),n=this.props.opened!==void 0?this.props.opened:this.state.opened;let{group:a}=this.state;a===void 0&&e!==void 0&&(a=d.getItemValue(r[0],e));const p={title:t||this.props.label,subTitle:i,expand:n,onClose:l=>this.toggleBtnClick(l),windowWidth:s,mobileFilter:this.renderMobileListFilter()};return m.createElement(oe.AdaptiveMode,{...p},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,size:n,list:a,virtual:p,groupStickyHeaderItemRender:l,unstyled:o}=this.props,c=d.getFilteredData(this.props),u=this.props.opened!==void 0?this.props.opened:this.state.opened,y=s.getPopupSettings(),C=y.width!==void 0?y.width:s.popupWidth,I=o&&o.uComboBox;let{group:b}=this.state;return b===void 0&&r!==void 0&&(b=d.getItemValue(c[0],r)),m.createElement(Q,{width:C,popupSettings:{...y,anchor:y.anchor||this.element,show:u,popupClass:h.classNames(y.popupClass,h.uComboBox.listContainer({c:I,popup:!0}))},dir:e!==void 0?e:this.base.dirCalculated,itemsCount:[c.length]},m.createElement("div",{className:h.classNames(h.uComboBox.list({c:I,list:a,size:n,tableSize:n,virtual:p}))},t&&m.createElement("div",{className:h.classNames(h.uComboBox.listHeader({c:I}))},t),!a&&b&&c.length!==0&&m.createElement(_,{group:b,render:l}),this.renderList(),i&&m.createElement("div",{className:h.classNames(h.uComboBox.listFooter({c:I}),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:n,virtual:a={skip:0,total:void 0},unstyled:p}=this.props,l=d.getFilteredData(this.props),o=s.getPopupSettings(),c=s.vs,u=a.skip,y=this.props.opened!==void 0?this.props.opened:this.state.opened,C=`translateY(${c.translate}px)`,I=y?this.getFocusedIndex(this.hasDuplicates):void 0,b=this.props.filter!==void 0?this.props.filter:this.state.text,v=d.getItemValue(this.value,e),g=d.isPresent(b)&&b!==v?null:this.value,x=this.props.list||X,S=p&&p.uComboBox;return m.createElement(x,{id:s.listBoxId,virtual:!!a,show:y,data:l,focusedIndex:I,value:g,textField:e,valueField:t,groupField:this.props.groupField,isMultiColumn:this.props.isMultiColumn,optionsGuid:s.guid,hasDuplicates:this.hasDuplicates,listRef:D=>{c.list=this.base.list=D,this.itemHeight=0},wrapperStyle:this.mobileMode?{}:{maxHeight:o.height},wrapperCssClass:h.classNames(h.uComboBox.listContent({c:S,virtual:a})),listStyle:c.enabled?{transform:C}:void 0,key:"listkey",skip:u,onClick:this.handleItemClick,itemRender:r,groupHeaderItemRender:n,noDataRender:i,onMouseDown:D=>D.preventDefault(),onScroll:this.onScroll,wrapperRef:c.scrollerRef,scroller:this.base.renderScrollElement(),ariaSetSize:a.total})}renderSearchBar(s,e,t){const{tabIndex:i,accessKey:r,disabled:n,title:a,ariaLabelledBy:p,ariaDescribedBy:l,dataItemKey:o,virtual:c={skip:0},unstyled:u,inputAttributes:y}=this.props,C=d.getFilteredData(this.props),I=this.props.opened!==void 0?this.props.opened:this.state.opened,b=this.value,v=Math.max(0,C.findIndex(g=>d.areSame(g,b,o)));return this._suggested&&!d.areSame(this._valueOnDidUpdate,b,o)&&(this._suggested=""),m.createElement(J,{id:e,readOnly:I&&this.mobileMode,placeholder:t,tabIndex:i,accessKey:r,title:a,value:s+this._suggested,suggestedText:this._suggested,ref:g=>{this._input=g&&g.input},onClick:this.onInputClick,onKeyDown:this.onInputKeyDown,onChange:this.inputOnChange,onFocus:this.base.handleFocus,onBlur:this.handleBlur,disabled:n,expanded:I,owns:this.base.listBoxId,activedescendant:`option-${this.base.guid}-${v+c.skip}`,role:"combobox",ariaLabelledBy:p,ariaLabel:this.props.ariaLabel,ariaDescribedBy:l,ariaRequired:this.required,render:this.props.valueRender,ariaControls:this.base.listBoxId,unstyled:u,inputAttributes:y})}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&&(!d.isPresent(t)&&!d.isPresent(s)||d.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:n=d.itemIndexStartsWith,skipDisabledItems:a}=this.props,p=d.getFilteredData(this.props),l=this.props.filter?this.props.filter:this.state.text;return s&&this.navigationIndex!==void 0?this.navigationIndex:d.isPresent(e)&&l===void 0?p.findIndex(o=>d.areSame(o,e,i)):l?n(p,l,t):a&&t&&!l&&r.skip===0?p.findIndex(o=>!o.disabled&&o[t]):r.skip===0?0:-1}suggestValue(s){const{data:e,textField:t}=this.props;this._suggested=d.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})}};F.displayName="ComboBox",F.propTypes={...O.propTypes,size:f.oneOf(["small","medium","large"]),rounded:f.oneOf(["small","medium","large","full","none"]),fillMode:f.oneOf(["solid","flat","outline"]),dataItemKey:f.string,groupField:f.string,isMultiColumn:f.bool,suggest:f.bool,placeholder:f.string,title:f.string,allowCustom:f.bool,ignoreCase: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},F.defaultProps={...O.defaultProps,size:void 0,rounded:void 0,fillMode:void 0,allowCustom:!1,ignoreCase:!1,clearButton:!0,required:!1,isMultiColumn:!1,skipDisabledItems:!0,prefix:void 0,suffix:void 0};let M=F;const R=h.createPropsContext(),q=h.withIdHOC(h.withPropsContext(R,h.withUnstyledHOC(h.withAdaptiveModeContext(M))));q.displayName="KendoReactComboBox";exports.ComboBox=q;exports.ComboBoxPropsContext=R;exports.ComboBoxWithoutContext=M;
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const $=require("react"),f=require("prop-types"),O=require("../common/DropDownBase.js"),h=require("@progress/kendo-react-common"),Y=require("@progress/kendo-react-labels"),d=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"),K=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"),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!",F=class F extends m.Component{constructor(s){super(s),this.state={},this.base=new O(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.scrollToFocused=!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=d.getPlainDataDuplicates(i),this.hasDuplicates=this.duplicates.length>0}},this.handleKendoPasteValue=e=>{const{data:t,textField:i,allowCustom:r}=this.props;if(!t)return;const n=e!=null?String(e):"",a=d.getItemIndexByText(t,n,i,!1,!0),p=a!==-1;let l=null;if(p?l=t[a]:r&&(l=i?{[i]:n}:n),l===null)return;const o=this.base.initState();o.syntheticEvent={target:this._element,currentTarget:this._element,nativeEvent:new Event("change",{bubbles:!0})},this.state.text!==void 0&&(o.data.text=void 0),this.triggerOnChange(l,o),this.applyState(o)},this.handleItemSelect=(e,t)=>{const{virtual:i,dataItemKey:r}=this.props,n=d.getFilteredData(this.props),a=i?i.skip:0,p=n[e-a],l=this.hasDuplicates||!d.areSame(p,this.value,r);this.triggerOnChange(p,t),this.state.text!==void 0&&(t.data.text=void 0),l&&this.base.triggerPageChangeCornerItems(p,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=d.getFilteredData(this.props),n=this.getFocusedIndex(),a=this.getCurrentValueDisabledStatus(i,r,n),p=this.props.opened!==void 0?this.props.opened:this.state.opened,l=this.base.initState();if(l.syntheticEvent=e,!t&&i&&a&&this.clearValueOnToggleBtnClick(e),this.base.togglePopup(l),!p&&this.mobileMode){const o=this.props.adaptiveFilter!==void 0?this.props.adaptiveFilter:this.state.text||null;this.base.filterChanged(o,l)}this.applyState(l),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=d.getItemValue(this.value,this.props.textField),i=d.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:n,list:a,unstyled:p,virtual:l}=this.props,o=d.getFilteredData(this.props),c=p&&p.uComboBox;let{group:u}=this.state;return u===void 0&&n!==void 0&&(u=d.getItemValue(o[0],n)),m.createElement("div",{className:h.classNames(h.uComboBox.list({c,list:a,size:"large",tableSize:i,virtual:l}))},e&&m.createElement("div",{className:h.classNames(h.uComboBox.listHeader({c}))},e),!a&&u&&o.length!==0&&m.createElement(_,{group:u,render:r}),this.renderList(),t&&m.createElement("div",{className:h.classNames(h.uComboBox.listFooter({c}),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;this.props.onListScroll&&this.props.onListScroll(e);let n=d.getFilteredData(this.props);if(!r||!n.length)return;const a=this.itemHeight=this.itemHeight||(t.enabled?t.itemHeight:i?i.children[0].offsetHeight:0),l=e.target.scrollTop-t.skip*a;n=this.base.getGroupedDataModernMode(n,r);let o=n[0][r];for(let c=1;c<n.length&&!(a*c>l);c++)n[c]&&n[c][r]&&(o=n[c][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=d.getFilteredData(this.props),n=this.getFocusedIndex(),p=!(n===-1)&&this.getCurrentValueDisabledStatus(i,r,n);t.data.focused=!1,t.events.push({type:"onBlur"}),t.syntheticEvent=e,i&&p&&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:n}=this.props,a=d.getFilteredData(this.props),p=this.value,l=Math.max(0,a.findIndex(v=>d.areSame(v,p,r))),o=e.keyCode,c=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(),n!==""&&i)if(!this.props.skipDisabledItems&&c)this.onNavigate(u,o);else{let v=0;if(o===h.Keys.down||o===h.Keys.right){const g=a.slice(l+1<a.length?l+1:l).find(x=>!x.disabled&&x[i]);v=g&&a.findIndex(x=>x[i]===g[i])}else if(o===h.Keys.up||o===h.Keys.left){let g;if(l===0)g=a,v=a.findIndex(x=>!x.disabled&&x[i]);else{g=a.slice(0,l);let x=g.pop();for(;x&&x.disabled;)x=g.pop();v=x&&a.findIndex(S=>S[i]===x[i])}}if(v!==void 0){const g=v-l;this.onNavigate(u,o,g)}else v===void 0&&a.findIndex(g=>g[i]===p[i])===a.length-1&&this.onNavigate(u,o)}else if(!this.props.skipDisabledItems&&c)this.onNavigate(u,o);else{let v=null;if(o===h.Keys.down||o===h.Keys.right)v=a.slice(l+1).find(g=>!g.disabled);else if(o===h.Keys.up||o===h.Keys.left){const g=a.slice(0,l);for(v=g.pop();v&&v.disabled;)v=g.pop()}if(v){const g=v.id-l-1;this.onNavigate(u,o,g)}else this.onNavigate(u,o)}this.applyState(u)}const y=()=>{e.preventDefault(),this.base.togglePopup(u),this.applyState(u)},C=this.getFocusedIndex(),I=C===-1,b=!I&&this.getCurrentValueDisabledStatus(i,a,C);c?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?y():o===h.Keys.enter?(e.preventDefault(),(i&&!I&&e.currentTarget.value?a[C][i]:void 0)?!t&&i&&b?this.clearValueOnEnterOrEsc(e):b||this.applyValueOnEnter(e.currentTarget.value,u):this.applyValueOnEnter(e.currentTarget.value,u)):o===h.Keys.esc&&(!t&&i&&b&&this.clearValueOnEnterOrEsc(e),this.applyValueOnRejectSuggestions(e.currentTarget.value,u)):!c&&o===h.Keys.esc?this.clearValueOnEnterOrEsc(e):e.altKey&&o===h.Keys.down&&y()},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,n=r.value;if(this.props.suggest){const a=r.selectionEnd===n.length;let p=this.props.filter!==void 0?this.props.filter:this.state.text;d.isPresent(p)||(p=d.getItemValue(this.value,this.props.textField)||"");const l=p&&p===n,o=p&&p.length>n.length;l||o||!a?this._suggested="":this.suggestValue(n)}this.props.filter===void 0&&(t.data.text=n),this.state.focusedItem!==void 0&&(t.data.focusedItem=void 0),i?this.scrollToFocused=!0:this.base.togglePopup(t),this.base.filterChanged(n,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(K.packageMetadata,{component:"ComboBox"}),this.licenseMessage=h.getLicenseMessage(K.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=d.getFilteredData(this.props),t=this.value;return e.findIndex(i=>d.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:F.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:F.defaultProps.required}componentDidUpdate(s,e){var y,C;const{dataItemKey:t,virtual:i,groupField:r="",textField:n}=this.props,a=d.getFilteredData(this.props),p=s.virtual?s.virtual.total:0,l=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 c=!o&&l,u=this.value;if(this._valueOnDidUpdate=u,this.base.didUpdate(),i&&i.total!==p)this.base.vs.calcScrollElementHeight(),this.base.vs.reset();else{const I=s.value!==void 0?s.value:e.value;let b=this.hasDuplicates?this.navigationIndex||0:a.findIndex(g=>d.areSame(g,u,t));n&&u&&(b=(y=this.base.getGroupedDataModernMode(a,r))==null?void 0:y.map(g=>g[n]).indexOf(u[n]));const v=!d.areSame(I,u,t);if(c&&i?this.base.scrollToVirtualItem(i,b):c&&!i?(this.onPopupOpened(),a&&a.length!==0&&this.base.resetGroupStickyHeader(a[0][r],this),this.base.scrollToItem(b)):(this.hasDuplicates||l&&o&&u&&v)&&this.base.scrollToItem(b),l&&o&&this.scrollToFocused){const g=(C=this.props.filter?this.props.filter:this.state.text)!=null?C:"";if(g){const{focusedItemIndex:x=d.itemIndexStartsWith}=this.props,S=x(a,g,n);this.base.scrollToItem(S)}else this.base.scrollToItem(0)}}this.scrollToFocused=!1,c&&this._input&&this._input.focus(),this.setValidity()}componentDidMount(){var e;this.observerResize=h.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.base.didMount(),this.setValidity(),(e=this.document)!=null&&e.body&&this.observerResize&&this.observerResize.observe(this.document.body),this.checkForDuplicatePlainTextRecords();const s=this.props.name||this.props.id;this.KendoPasteSubscription=h.subscribeToKendoPaste(this._element,{fieldName:s,onValueChange:t=>{this.handleKendoPasteValue(t)}})}componentWillUnmount(){var s,e;(s=this.document)!=null&&s.body&&this.observerResize&&this.observerResize.disconnect(),(e=this.KendoPasteSubscription)==null||e.unsubscribe()}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=F.defaultProps.clearButton,label:n,textField:a,className:p,style:l,loading:o,iconClassName:c,virtual:u,size:y,rounded:C,fillMode:I,opened:b=this.state.opened,placeholder:v,svgIcon:g,unstyled:x}=this.props,S=!this.validityStyles||this.validity.valid,D=this.props.filter!==void 0?this.props.filter:this.state.text,A=d.getItemValue(this.value,a),V=d.isPresent(D)?D:A,z=r&&(!!V||d.isPresent(this.value)),B=this.base.vs,T=this.props.id||this._inputId,E=x&&x.uComboBox;B.enabled=u!==void 0,u!==void 0&&(B.skip=u.skip,B.total=u.total,B.pageSize=u.pageSize);const[H,W]=L(this.props.prefix||m.Fragment),[j,U]=L(this.props.suffix||m.Fragment),P=m.createElement(m.Fragment,null,m.createElement("span",{className:h.classNames(h.uComboBox.wrapper({c:E,size:y,rounded:C,fillMode:I,disabled:i,invalid:!S,loading:o,required:this.required}),p),ref:this.componentRef,style:n?{...l,width:void 0}:l,dir:t,onFocus:this.handleFocus},this.props.prefix&&m.createElement(H,{...W}),this.renderSearchBar(V||"",T,v),z&&!o&&m.createElement(ee,{onClick:this.clearButtonClick,key:"clearbutton"}),o&&m.createElement(h.IconWrap,{className:h.classNames(h.uComboBox.loadingIcon({c:E})),name:"loading",key:"loading"}),this.props.suffix&&m.createElement(j,{...U}),m.createElement(te.Button,{tabIndex:-1,type:"button","aria-label":b?e:s,icon:c?void 0:"caret-alt-down",svgIcon:g||se.caretAltDownIcon,iconClass:c,size:y,fillMode:I,className:h.classNames(h.uComboBox.inputButton({c:E})),onClick:this.toggleBtnClick,onMouseDown:G=>G.preventDefault()}),!this.mobileMode&&this.renderListContainer()),this.mobileMode&&this.renderAdaptiveListContainer());return n?m.createElement(Y.FloatingLabel,{label:n,editorId:T,editorValue:V,editorValid:S,editorDisabled:i,style:{width:l?l.width:void 0},children:P,unstyled:x}):P}onNavigate(s,e,t){const{virtual:i={skip:0}}=this.props,r=d.getFilteredData(this.props),n=this.props.filter?this.props.filter:this.state.text;let a=-1,p;const l=this.base.vs,o=this.value;this._suggested="";const c=this.hasDuplicates&&this.duplicates.indexOf(o)!==-1;if(a=this.getFocusedIndex(c),a!==-1&&!d.isPresent(o))this.handleItemSelect(a,s);else if(n==="")this.handleItemSelect(0,s);else{const u=i.skip+a;p=this.base.navigation.navigate({keyCode:e,current:u,max:(l.enabled?l.total:r.length)-1,min:0,skipItems:t||void 0}),p!==void 0&&this.handleItemSelect(p,s)}this.navigationIndex=p}getCurrentValueDisabledStatus(s,e,t){return s&&e&&e[t]&&e[t].disabled}applyValueOnEnter(s,e){const{textField:t,allowCustom:i,ignoreCase:r}=this.props,n=d.getFilteredData(this.props),a=this.props.opened!==void 0?this.props.opened:this.state.opened,l=d.getItemValue(this.value,t)===s?this.index:d.getItemIndexByText(n,s,t,!1,r),o=l!==-1;let c;if(this._suggested="",o)c=n[l];else if(i)c=t!==void 0?{[t]:s}:s;else return this.selectFocusedItem(s,e);this.triggerOnChange(c,e),a&&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,ignoreCase:r}=this.props,n=d.getFilteredData(this.props),a=this.props.opened!==void 0?this.props.opened:this.state.opened,p=d.getItemValue(this.value,t);if(this._suggested="",s===p||s===""&&!d.isPresent(p))return this.closeOpenedApplyStateNonMobileMode(e,a),this.applyState(e);const l=d.getItemIndexByText(n,s,t,!0,r),o=l!==-1;let c=null;o?c=n[l]:i&&(c=s?t?{[t]:s}:s:null),this.triggerOnChange(c,e),this.state.text!==void 0&&(e.data.text=void 0,this.base.filterChanged("",e)),this.closeOpenedApplyStateNonMobileMode(e,a),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:n=d.itemIndexStartsWith}=this.props,a=d.getFilteredData(this.props),p=r.skip,l=s===""&&p===0?0:n(a,s,i);return l!==-1?this.handleItemSelect(l+p,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=d.getFilteredData(this.props),n=this.props.opened!==void 0?this.props.opened:this.state.opened;let{group:a}=this.state;a===void 0&&e!==void 0&&(a=d.getItemValue(r[0],e));const p={title:t||this.props.label,subTitle:i,expand:n,onClose:l=>this.toggleBtnClick(l),windowWidth:s,mobileFilter:this.renderMobileListFilter()};return m.createElement(oe.AdaptiveMode,{...p},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,size:n,list:a,virtual:p,groupStickyHeaderItemRender:l,unstyled:o}=this.props,c=d.getFilteredData(this.props),u=this.props.opened!==void 0?this.props.opened:this.state.opened,y=s.getPopupSettings(),C=y.width!==void 0?y.width:s.popupWidth,I=o&&o.uComboBox;let{group:b}=this.state;return b===void 0&&r!==void 0&&(b=d.getItemValue(c[0],r)),m.createElement(Q,{width:C,popupSettings:{...y,anchor:y.anchor||this.element,show:u,popupClass:h.classNames(y.popupClass,h.uComboBox.listContainer({c:I,popup:!0}))},dir:e!==void 0?e:this.base.dirCalculated,itemsCount:[c.length]},m.createElement("div",{className:h.classNames(h.uComboBox.list({c:I,list:a,size:n,tableSize:n,virtual:p}))},t&&m.createElement("div",{className:h.classNames(h.uComboBox.listHeader({c:I}))},t),!a&&b&&c.length!==0&&m.createElement(_,{group:b,render:l}),this.renderList(),i&&m.createElement("div",{className:h.classNames(h.uComboBox.listFooter({c:I}),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:n,virtual:a={skip:0,total:void 0},unstyled:p}=this.props,l=d.getFilteredData(this.props),o=s.getPopupSettings(),c=s.vs,u=a.skip,y=this.props.opened!==void 0?this.props.opened:this.state.opened,C=`translateY(${c.translate}px)`,I=y?this.getFocusedIndex(this.hasDuplicates):void 0,b=this.props.filter!==void 0?this.props.filter:this.state.text,v=d.getItemValue(this.value,e),g=d.isPresent(b)&&b!==v?null:this.value,x=this.props.list||X,S=p&&p.uComboBox;return m.createElement(x,{id:s.listBoxId,virtual:!!a,show:y,data:l,focusedIndex:I,value:g,textField:e,valueField:t,groupField:this.props.groupField,isMultiColumn:this.props.isMultiColumn,optionsGuid:s.guid,hasDuplicates:this.hasDuplicates,listRef:D=>{c.list=this.base.list=D,this.itemHeight=0},wrapperStyle:this.mobileMode?{}:{maxHeight:o.height},wrapperCssClass:h.classNames(h.uComboBox.listContent({c:S,virtual:a})),listStyle:c.enabled?{transform:C}:void 0,key:"listkey",skip:u,onClick:this.handleItemClick,itemRender:r,groupHeaderItemRender:n,noDataRender:i,onMouseDown:D=>D.preventDefault(),onScroll:this.onScroll,wrapperRef:c.scrollerRef,scroller:this.base.renderScrollElement(),ariaSetSize:a.total})}renderSearchBar(s,e,t){const{tabIndex:i,accessKey:r,disabled:n,title:a,ariaLabelledBy:p,ariaDescribedBy:l,dataItemKey:o,virtual:c={skip:0},unstyled:u,inputAttributes:y}=this.props,C=d.getFilteredData(this.props),I=this.props.opened!==void 0?this.props.opened:this.state.opened,b=this.value,v=Math.max(0,C.findIndex(g=>d.areSame(g,b,o)));return this._suggested&&!d.areSame(this._valueOnDidUpdate,b,o)&&(this._suggested=""),m.createElement(J,{id:e,readOnly:I&&this.mobileMode,placeholder:t,tabIndex:i,accessKey:r,title:a,value:s+this._suggested,suggestedText:this._suggested,ref:g=>{this._input=g&&g.input},onClick:this.onInputClick,onKeyDown:this.onInputKeyDown,onChange:this.inputOnChange,onFocus:this.base.handleFocus,onBlur:this.handleBlur,disabled:n,expanded:I,owns:this.base.listBoxId,activedescendant:`option-${this.base.guid}-${v+c.skip}`,role:"combobox",ariaLabelledBy:p,ariaLabel:this.props.ariaLabel,ariaDescribedBy:l,ariaRequired:this.required,render:this.props.valueRender,ariaControls:I?this.base.listBoxId:void 0,unstyled:u,inputAttributes:y})}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&&(!d.isPresent(t)&&!d.isPresent(s)||d.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:n=d.itemIndexStartsWith,skipDisabledItems:a}=this.props,p=d.getFilteredData(this.props),l=this.props.filter?this.props.filter:this.state.text;return s&&this.navigationIndex!==void 0?this.navigationIndex:d.isPresent(e)&&l===void 0?p.findIndex(o=>d.areSame(o,e,i)):l?n(p,l,t):a&&t&&!l&&r.skip===0?p.findIndex(o=>!o.disabled&&o[t]):r.skip===0?0:-1}suggestValue(s){const{data:e,textField:t}=this.props;this._suggested=d.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})}};F.displayName="ComboBox",F.propTypes={...O.propTypes,size:f.oneOf(["small","medium","large"]),rounded:f.oneOf(["small","medium","large","full","none"]),fillMode:f.oneOf(["solid","flat","outline"]),dataItemKey:f.string,groupField:f.string,isMultiColumn:f.bool,suggest:f.bool,placeholder:f.string,title:f.string,allowCustom:f.bool,ignoreCase: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},F.defaultProps={...O.defaultProps,size:void 0,rounded:void 0,fillMode:void 0,allowCustom:!1,ignoreCase:!1,clearButton:!0,required:!1,isMultiColumn:!1,skipDisabledItems:!0,prefix:void 0,suffix:void 0};let M=F;const R=h.createPropsContext(),q=h.withIdHOC(h.withPropsContext(R,h.withUnstyledHOC(h.withAdaptiveModeContext(M))));q.displayName="KendoReactComboBox";exports.ComboBox=q;exports.ComboBoxPropsContext=R;exports.ComboBoxWithoutContext=M;
|
package/ComboBox/ComboBox.mjs
CHANGED
|
@@ -643,7 +643,7 @@ const Ft = "Please enter a valid value!", M = class M extends u.Component {
|
|
|
643
643
|
ariaDescribedBy: l,
|
|
644
644
|
ariaRequired: this.required,
|
|
645
645
|
render: this.props.valueRender,
|
|
646
|
-
ariaControls: this.base.listBoxId,
|
|
646
|
+
ariaControls: x ? this.base.listBoxId : void 0,
|
|
647
647
|
unstyled: h,
|
|
648
648
|
inputAttributes: b
|
|
649
649
|
}
|
|
@@ -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 _t=require("react"),L=require("prop-types"),o=require("@progress/kendo-react-common"),Ut=require("@progress/kendo-react-labels"),Gt=require("@progress/kendo-svg-icons"),jt=require("../common/ListContainer.js"),$t=require("../common/ListFilter.js"),nt=require("../common/GroupStickyHeader.js"),Yt=require("../common/ListDefaultItem.js"),Jt=require("../common/List.js"),ot=require("../common/DropDownBase.js"),c=require("../common/utils.js"),rt=require("../package-metadata.js"),Qt=require("@progress/kendo-react-buttons"),Rt=require("@progress/kendo-react-intl"),Y=require("../messages/index.js"),Xt=require("@progress/kendo-react-layout"),Zt=require("../common/AdaptiveMode.js");function en(M){const J=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(M){for(const T in M)if(T!=="default"){const re=Object.getOwnPropertyDescriptor(M,T);Object.defineProperty(J,T,re.get?re:{enumerable:!0,get:()=>M[T]})}}return J.default=M,Object.freeze(J)}const i=en(_t),tn="Please select a value from the list!",ge=i.forwardRef((M,J)=>{let T=!1;const re=o.getLicenseMessage(rt.packageMetadata),n=o.usePropsContext(at,M),{delay:st=P.delay,tabIndex:it=P.tabIndex,ignoreCase:Q=P.ignoreCase,size:O=P.size,rounded:Me=P.rounded,fillMode:fe=P.fillMode}=n;if(n.filterable||n.virtual){const e=[];n.filterable&&e.push("filterable"),n.virtual&&e.push("virtualization"),T=!o.validatePackage(rt.packageMetadata,{component:"DropDownList",features:e})}const E=o.useUnstyled(),ve=o.useId(n.id),ye=()=>{var e;if(o.canUseDOM)return((e=V.current)==null?void 0:e.ownerDocument)||window.document},lt=()=>{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 A.current!==void 0&&A.current!==null?e=A.current:n.value!==void 0?e=n.value:f.value!==void 0&&f.value!==null?e=f.value:n.defaultValue!==void 0&&n.defaultValue!==null&&(e=n.defaultValue),!c.isPresent(e)&&n.defaultItem!==void 0&&n.defaultItem!==null&&(e=n.defaultItem),e},dt=()=>{const{dataItemKey:e}=n,r=c.getFilteredData(n),a=k();return r.findIndex(u=>c.areSame(u,a,e))},De=()=>n.required!==void 0?n.required:P.required,Ie=()=>{const e=n.validationMessage!==void 0,r=k(),a=!De()||r!==null&&r!==""&&r!==void 0,u=n.valid!==void 0?n.valid:a;return{customError:e,valid:u,valueMissing:r===null}},ct=()=>n.validityStyles!==void 0?n.validityStyles:P.validityStyles,oe=e=>{ae.current=!0,e.focus(),window.setTimeout(()=>ae.current=!1,30)},he=()=>{X.current&&oe(X.current),n.adaptive&&setTimeout(()=>{X.current&&oe(X.current)},300)},ut=i.useCallback(e=>{for(const r of e)Pt(r.target.clientWidth)},[]),Te=()=>{var e;(e=Ce.current)!=null&&e.setCustomValidity&&Ce.current.setCustomValidity(Ie().valid?"":n.validationMessage||tn)},q=(e,r)=>{const a=k();c.areSame(a,e,n.dataItemKey)||(n.value===void 0&&(r.data.value=e),t.current.updateComponentArgs({value:e}),A.current=e,r.events.push({type:"onChange"}))},b=e=>{var r;(r=t==null?void 0:t.current)==null||r.applyState(e),A.current=void 0},R=(e,r)=>{var p;const{virtual:a,dataItemKey:u,defaultItem:d}=n,m=c.getFilteredData(n),g=a?a.skip:0,v=k(),s=e===-1&&d!==void 0?d:m[e-g],y=!c.areSame(s,v,u);q(s,r),y&&((p=t==null?void 0:t.current)==null||p.triggerPageChangeCornerItems(s,r))},z=(e,r,a)=>{var x,I;const{defaultItem:u,dataItemKey:d,virtual:m={skip:0,total:0,pageSize:0}}=n,g=k(),v=c.getFilteredData(n),s=(x=t==null?void 0:t.current)==null?void 0:x.vs,y=v.findIndex(w=>c.areSame(w,g,d)),p=(I=t==null?void 0:t.current)==null?void 0:I.navigation.navigate({current:m.skip+y,max:(s!=null&&s.enabled?m.total:v.length)-1,min:u!==void 0?-1:0,keyCode:r,skipItems:a||void 0});p!==void 0&&R(p,e),b(e)},pt=e=>{V.current=e,t.current.wrapper=e},mt=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})),we=()=>{const{textField:e,dataItemKey:r,virtual:a={skip:0},focusedItemIndex:u=c.itemIndexStartsWith,filterable:d,skipDisabledItems:m=!0}=n,g=k(),v=c.getFilteredData(n),s=n.filter?n.filter:f.text;return m&&e&&!s&&!g?v.findIndex(y=>!y.disabled&&y[e]):c.isPresent(g)&&s===void 0||d&&s===""?v.findIndex(y=>c.areSame(y,g,r)):s?Le.current?u(v,s,e):v.findIndex(y=>c.areSame(y,g,r)):a.skip===0?0:-1},Oe=(e,r)=>r!==void 0&&r!==-1&&e&&e.length>0&&e[r].disabled,Se=()=>{const e=c.getFilteredData(n),r=t.current.initState(),a=we();Oe(e,a)&&(q(null,r),b(r))},xe=e=>{if(e.isPropagationStopped())return;const r=t.current.initState();r.syntheticEvent=e,f.focused||(r.data.focused=!0),Se(),t.current.togglePopup(r),b(r)},qe=e=>{var N,pe,U,me,$,et,tt;e&&e.target instanceof Element&&e.target.nodeName==="INPUT"&&e.stopPropagation&&e.stopPropagation();const{filterable:r,disabled:a,defaultItem:u,leftRightKeysNavigation:d=!0,virtual:m={skip:0,total:0,pageSize:0},dataItemKey:g,groupField:v="",textField:s,skipDisabledItems:y=!0}=n,p=c.getFilteredData(n),x=k(),I=p.findIndex(C=>c.areSame(C,x,g)),w=n.opened!==void 0?n.opened:f.opened,l=e.keyCode,F=l===o.Keys.home||l===o.Keys.end,K=l===o.Keys.up||l===o.Keys.down,j=!w&&(e.altKey&&l===o.Keys.down||l===o.Keys.enter||l===o.Keys.space),ne=w&&(e.altKey&&l===o.Keys.up||l===o.Keys.esc),ce=d&&(l===o.Keys.left||l===o.Keys.right),ue=K||ce&&!r||F,S=t.current.initState();if(S.syntheticEvent=e,!a){if(F&&((N=t==null?void 0:t.current)!=null&&N.vs.enabled))l===o.Keys.home?m.skip!==0?((pe=t==null?void 0:t.current)==null||pe.triggerOnPageChange(S,0,m.pageSize),B.current=!0):q(p[0],S):m.skip<m.total-m.pageSize?((U=t==null?void 0:t.current)==null||U.triggerOnPageChange(S,m.total-m.pageSize,m.pageSize),B.current=!0):q(p[p.length-1],S);else if(w&&l===o.Keys.pageUp)e.preventDefault(),(me=t==null?void 0:t.current)==null||me.scrollPopupByPageSize(-1);else if(w&&l===o.Keys.pageDown)e.preventDefault(),($=t==null?void 0:t.current)==null||$.scrollPopupByPageSize(1);else if(w&&l===o.Keys.enter){const C=we();Oe(p,C)?(q(null,S),b(S)):R(C,S),(et=t==null?void 0:t.current)==null||et.togglePopup(S),e.preventDefault()}else if(j||ne)ne&&Se(),(tt=t==null?void 0:t.current)==null||tt.togglePopup(S),e.preventDefault();else if(ue){if(Le.current=!1,v!==""&&s)if(!y&&w)z(S,l);else{let C;if(l===o.Keys.down||l===o.Keys.right){const h=p.slice(I+1).find(D=>!D.disabled&&D[s]);C=h&&p.findIndex(D=>D[s]===h[s])}else if(l===o.Keys.up||l===o.Keys.left){let h;if(I===0&&u)C=-1;else if(I===-1)h=p,C=p.findIndex(D=>!D.disabled&&D[s]);else{h=p.slice(0,I);let D=h.pop();for(;D&&D.disabled;)D=h.pop();C=D&&p.findIndex(Ne=>Ne[s]===D[s])}}if(C!==void 0){const h=C-I;z(S,l,h)}else C===void 0&&p.findIndex(h=>h[s]===x[s])===p.length-1&&z(S,l)}else if(!y&&w||F)z(S,l);else if(s){let C;if(l===o.Keys.down||l===o.Keys.right){const h=p.slice(I+1).find(D=>!D.disabled&&D[s]);C=h&&p.findIndex(D=>D[s]===h[s])}else if(l===o.Keys.up||l===o.Keys.left){let h;if(I===0&&u)C=-1;else if(I===-1)h=p,C=p.find(D=>!D.disabled&&D[s]);else{h=p.slice(0,I);let D=h.pop();for(;D&&D.disabled;)D=h.pop();C=D&&p.findIndex(Ne=>Ne[s]===D[s])}}if(C!==void 0){const h=C-I;z(S,l,h)}else C===void 0&&p.findIndex(h=>h[s]===x[s])===p.length-1&&z(S,l)}else z(S,l);e.preventDefault()}b(S)}},gt=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,b(r),ee({group:void 0,text:String(e.target.value)})},ze=e=>{const r=n.filter!==void 0?n.filter:f.text;return n.filterable&&i.createElement($t,{value:r,ref:a=>{X.current=a&&a.element},onChange:gt,onKeyDown:qe,size:e?"large":O,rounded:Me,fillMode:fe,renderListFilterWrapper:!0,placeholder:_e.toLanguageString(Y.dropDownListAdaptiveFilterPlaceholder,Y.messages[Y.dropDownListAdaptiveFilterPlaceholder])})},ft=e=>{var a;const r=t.current.initState();r.syntheticEvent=e,(a=t==null?void 0:t.current)==null||a.togglePopup(r),q(n.defaultItem,r),b(r)},vt=()=>{const{textField:e,defaultItem:r,dataItemKey:a}=n,u=k();return r!==void 0&&i.createElement(Yt,{defaultItem:r,textField:e,selected:c.areSame(u,r,a),key:"defaultitemkey",onClick:ft})},yt=(e,r)=>{var a;(a=t==null?void 0:t.current)==null||a.handleItemClick(e,r),A.current=void 0},Dt=e=>{const{vs:r,list:a}=t.current;r.scrollHandler(e);const{groupField:u}=n;let d=c.getFilteredData(n);if(!(!u||!d.length)&&u){const m=He.current=He.current||(r.enabled?r.itemHeight:a?a.children[0].offsetHeight:0),v=e.target.scrollTop-r.skip*m;d=t.current.getGroupedDataModernMode(d,u);let s=d[0][u];for(let y=1;y<d.length&&!(m*y>v);y++)d[y]&&d[y][u]&&(s=d[y][u]);s!==f.group&&ee({group:s})}},Ve=()=>{var l;const{textField:e,dataItemKey:r,virtual:a={skip:0,total:void 0},groupHeaderItemRender:u,listNoDataRender:d,itemRender:m}=n,g=c.getFilteredData(n),v=E&&E.uDropDownList,s=t.current.vs,y=a.skip,p=n.opened!==void 0?n.opened:f.opened,x=t.current.getPopupSettings(),I=`translateY(${s.translate}px)`,w=k();return i.createElement(Jt,{id:be,show:p,data:g.slice(),focusedIndex:we(),value:w,textField:e,valueField:r,optionsGuid:je,groupField:n.groupField,listRef:F=>{s.list=t.current.list=F},wrapperStyle:{maxHeight:_?void 0:x.height},wrapperCssClass:o.classNames(o.uDropDownList.listContent({c:v})),listStyle:s.enabled?{transform:I}:void 0,key:"listkey",skip:y,onClick:yt,itemRender:m,groupHeaderItemRender:u,noDataRender:d,onScroll:Dt,wrapperRef:s.scrollerRef,scroller:(l=t==null?void 0:t.current)==null?void 0:l.renderScrollElement(),ariaSetSize:a.total})},It=()=>{const{groupField:e}=n,r=c.getFilteredData(n),a=n.opened!==void 0?n.opened:f.opened,u=E&&E.uDropDownList,d={title:n.adaptiveTitle||n.label,subTitle:n.adaptiveSubtitle,expand:a,onClose:g=>xe(g),windowWidth:Ke,mobileFilter:ze(!0)};let{group:m}=f;return m===void 0&&e!==void 0&&(m=c.getItemValue(r[0],e)),i.createElement(Zt.AdaptiveMode,{...d},i.createElement(Xt.ActionSheetContent,null,i.createElement("div",{className:o.classNames(o.uDropDownList.listContainer({c:u,popup:!1}))},xt())))},ht=()=>{f.focused&&window.setTimeout(()=>{f.focused&&t.current.wrapper&&oe(t.current.wrapper)})},wt=e=>{"onMouseDownOutside"in(n.popupSettings||{})&&n.popupSettings.onMouseDownOutside.call(void 0,e)},St=()=>{const{header:e,footer:r,dir:a,groupField:u,groupStickyHeaderItemRender:d,list:m}=n,g=c.getFilteredData(n),v=t.current,s=v.getPopupSettings(),y=n.opened!==void 0?n.opened:f.opened,p=s.width!==void 0?s.width:v.popupWidth,x=E&&E.uDropDownList,I={dir:a!==void 0?a:v.dirCalculated,width:p,popupSettings:{...s,popupClass:o.classNames(s.popupClass,o.uDropDownList.listContainer({c:x,popup:!0})),anchor:s.anchor||V.current,show:y,onOpen:he,onClose:ht,onMouseDownOutside:wt},itemsCount:[g.length]};let{group:w}=f;return w===void 0&&u!==void 0&&(w=c.getItemValue(g[0],u)),i.createElement(jt,{...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}))},vt(),!m&&w&&g.length!==0&&i.createElement(nt,{group:w,render:d}),Ve()),r&&i.createElement("div",{className:o.classNames(o.uDropDownList.listFooter({c:x}))},r),T&&i.createElement(o.WatermarkOverlay,{message:re}))},xt=()=>{const{header:e,footer:r,groupStickyHeaderItemRender:a,groupField:u,list:d}=n,m=c.getFilteredData(n),g=E&&E.uDropDownList;let{group:v}=f;return v===void 0&&u!==void 0&&(v=c.getItemValue(m[0],u)),i.createElement(i.Fragment,null,e&&i.createElement("div",{className:o.classNames(o.uDropDownList.listHeader({c:g}))},e),i.createElement("div",{className:o.classNames("k-list",{[`k-list-${_?"lg":o.sizeMap[O]||O}`]:_||O})},!d&&v&&m.length!==0&&i.createElement(nt,{group:v,render:a}),Ve()),r&&i.createElement("div",{className:"k-list-footer"},r))},Ct=e=>{const{dataItemKey:r}=n,a=c.getFilteredData(n),u=k();let d=a.map((K,j)=>({item:K,itemIndex:j}));const m=G.current.word,g=G.current.last,v=c.sameCharsOnly(m,g);let s=d.length,y=Math.max(0,a.findIndex(K=>c.areSame(K,u,r))),p;n.defaultItem&&(p={item:n.defaultItem,itemIndex:-1},s+=1,y+=1),y+=v?1:0,d=c.shuffleData(d,y,p);let x,I,w,l=0;const{textField:F}=n;for(;l<s;){if(x=c.getItemValue(d[l].item,F),I=v&&c.matchText(x,g,Q),w=c.matchText(x,m,Q),I||w){l=d[l].itemIndex;break}l++}if(l!==s){const K=t.current.initState();K.syntheticEvent=e,R(l,K),b(K),A.current=void 0}},Lt=e=>{clearTimeout(Be.current),n.filterable||(Be.current=window.setTimeout(()=>G.current.word="",st),Ct(e))},kt=e=>{ae.current||t.current.handleFocus(e)},Kt=e=>{if(ae.current||!f.focused)return;const r=n.opened!==void 0?n.opened:f.opened,a=t.current.initState();a.syntheticEvent=e,a.data.focused=!1,a.events.push({type:"onBlur"}),r&&Se(),r&&!_&&t.current.togglePopup(a),b(a)},bt=e=>{if(n.filterable||e.which===0||e.keyCode===o.Keys.enter)return;let r=String.fromCharCode(e.charCode||e.keyCode);Q&&(r=r.toLowerCase()),r===" "&&e.preventDefault(),G.current={word:G.current.word+r,last:G.current.last+r},Lt(e)},Et=()=>{const e=t.current.initState();e.data.opened=f.opened,t.current.togglePopup(e),b(e)},Ae=i.useRef(null),V=i.useRef(null),Ce=i.useRef(null),X=i.useRef(null);i.useImperativeHandle(Ae,()=>({get element(){return V.current},get index(){return dt()},get name(){return n.name},get validity(){return Ie()},get value(){return k()},get focused(){return f.focused},get opened(){return f.opened},focus:lt,props:n,togglePopup:Et})),i.useImperativeHandle(J,()=>Ae.current);const Be=i.useRef(null),G=i.useRef({word:"",last:""}),ae=i.useRef(!1),A=i.useRef(null),B=i.useRef(!1),Le=i.useRef(!1),H=i.useRef({}),ke=i.useRef({}),t=i.useRef(new ot({props:n,setState:()=>{},state:{},forceUpdate:()=>{},element:null,value:null,handleItemSelect:()=>{}})),He=i.useRef(0),Z=i.useRef(null),[f,Ft]=i.useState({}),[Ke,Pt]=i.useState(),[,We]=i.useReducer(e=>e,!0),_e=Rt.useLocalization(),Ue=n.name||n.id,Nt=i.useCallback(e=>{if(e==null||!t.current)return;const r=c.getFilteredData(n),{textField:a}=n,u=String(e),d=c.getItemIndexByText(r,u,a,!1,Q),m=d!==-1?r[d]:void 0;if(m!==void 0){const g=t.current.initState();g.syntheticEvent={target:V.current},q(m,g),b(g)}},[n,Q]);o.useKendoPaste(V,{fieldName:Ue,onValueChange:Nt,enabled:!!Ue});const ee=e=>{Ft({...f,...e})};i.useEffect(()=>{t.current.updateComponentArgs({props:n,setState:ee,state:f,forceUpdate:We,element:V.current,handleItemSelect:R,value:k()})},[ee,f,We,R,k]),i.useEffect(()=>{var y,p,x,I,w,l,F,K,j,ne,ce,ue,S;const{dataItemKey:e,virtual:r,groupField:a="",textField:u}=n,d=c.getFilteredData(n),m=H.current.virtual?H.current.virtual.total:0,g=n.opened!==void 0?n.opened:f.opened,v=H.current.opened!==void 0?H.current.opened:ke.current.opened,s=!v&&g;if((y=t==null?void 0:t.current)==null||y.didUpdate(),(p=t==null?void 0:t.current)!=null&&p.getPopupSettings().animate||s&&he(),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 N=k(),pe=H.current.value!==void 0?H.current.value:ke.current.value;let U=d.findIndex($=>c.areSame($,N,e));a!==""&&N&&u&&(U=(l=(w=t==null?void 0:t.current)==null?void 0:w.getGroupedDataModernMode(d,a))==null?void 0:l.map($=>$[u]).indexOf(N[u]));const me=!c.areSame(pe,N,e);s&&r?(F=t==null?void 0:t.current)==null||F.scrollToVirtualItem(r,U):s&&!r?(he(),d&&d.length!==0&&((K=t==null?void 0:t.current)==null||K.resetGroupStickyHeader(d[0][a],{setState:ee,group:f.group,state:f})),(j=t==null?void 0:t.current)==null||j.scrollToItem(U)):g&&v&&N&&me&&!B.current?(ce=t==null?void 0:t.current)==null||ce.scrollToItem(U,(ne=t==null?void 0:t.current)==null?void 0:ne.vs.enabled):g&&v&&B.current&&(B.current&&r&&r.skip===0?(ue=t==null?void 0:t.current)==null||ue.vs.reset():B.current&&r&&r.skip===r.total-r.pageSize&&((S=t==null?void 0:t.current)==null||S.vs.scrollToEnd()))}B.current=!1,ke.current=f,H.current=n,Te()}),i.useEffect(()=>{var e,r;return Z.current=o.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(ut.bind(void 0)),(e=t==null?void 0:t.current)==null||e.didMount(),Te(),(r=ye())!=null&&r.body&&Z.current&&Z.current.observe(ye().body),()=>{var a;(a=ye())!=null&&a.body&&Z.current&&Z.current.disconnect()}},[]);const Ge=ve+"-accessibility-id",be=ve+"-listbox-id",je=ve+"-guid",Mt=_e.toLanguageString(Y.dropDownListArrowBtnAriaLabel,Y.messages[Y.dropDownListArrowBtnAriaLabel]),{style:se,className:Tt,label:Ee,dir:Ot,virtual:W,adaptive:nn,dataItemKey:qt,disabled:ie,loading:$e,iconClassName:Ye,svgIcon:zt,valueRender:Je}=n,Fe=n.opened!==void 0?n.opened:f.opened,le=k(),Pe=c.getItemValue(le,n.textField),Qe=!ct()||Ie().valid,de=t.current,Vt=de.vs,te=E&&E.uDropDownList;Vt.enabled=W!==void 0;const Re=o.useAdaptiveModeContext(),_=!!(Ke&&Re&&Ke<=Re.medium&&n.adaptive);W!==void 0&&(de.vs.skip=W.skip,de.vs.total=W.total,de.vs.pageSize=W.pageSize);const At=c.getFilteredData(n),{focused:Bt}=f,Ht=At.findIndex(e=>c.areSame(e,le,qt)),Xe=i.createElement("span",{id:Ge,className:o.classNames(o.uDropDownList.inputInner({c:te}))},Pe&&i.createElement("span",{className:o.classNames(o.uDropDownList.inputText({c:te}))},Pe)),Wt=Je!==void 0?Je.call(void 0,Xe,le):Xe,Ze=i.createElement(i.Fragment,null,i.createElement("span",{ref:pt,className:o.classNames(o.uDropDownList.wrapper({c:te,size:O,rounded:Me,fillMode:fe,focused:Bt,disabled:ie,invalid:!Qe,loading:$e,required:De()}),Tt),style:Ee?{...se,width:void 0}:se,dir:Ot,onMouseDown:Fe?e=>{e.target.nodeName!=="INPUT"&&(oe(t.current.wrapper),e.preventDefault())}:void 0,onFocus:_?e=>xe(e):kt,onBlur:Kt,tabIndex:o.getTabIndex(it,ie),accessKey:n.accessKey,onKeyDown:qe,onKeyPress:bt,onClick:ie?void 0:xe,role:"combobox","aria-required":De(),"aria-disabled":ie||void 0,"aria-haspopup":"listbox","aria-expanded":Fe||!1,"aria-owns":be,"aria-activedescendant":Fe?"option-"+je+"-"+(Ht+(W?W.skip:0)):void 0,"aria-label":n.ariaLabel||n.label,"aria-labelledby":n.ariaLabelledBy,"aria-describedby":n.ariaDescribedBy||Ge,"aria-controls":be,id:n.id,title:n.title},Wt,$e&&i.createElement(o.IconWrap,{className:o.classNames(o.uDropDownList.loadingIcon({c:te})),name:"loading"}),i.createElement(Qt.Button,{tabIndex:-1,type:"button","aria-label":Mt,size:O,fillMode:fe,className:o.classNames(o.uDropDownList.inputButton({c:te})),iconClass:Ye,svgIcon:Ye?void 0:zt||Gt.caretAltDownIcon,onMouseDown:e=>f.focused&&e.preventDefault()}),mt(le),!_&&St()),_&&It());return Ee?i.createElement(Ut.FloatingLabel,{label:Ee,editorValue:Pe,editorValid:Qe,editorDisabled:n.disabled,style:{width:se?se.width:void 0},children:Ze}):Ze});ge.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,...ot.defaultProps,required:!1,size:void 0,rounded:void 0,fillMode:void 0};ge.displayName="KendoReactDropDownList";const at=o.createPropsContext();ge.displayName="KendoReactDropDownList";exports.DropDownList=ge;exports.DropDownListPropsContext=at;exports.dropDownListDefaultProps=P;
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const _t=require("react"),L=require("prop-types"),o=require("@progress/kendo-react-common"),Ut=require("@progress/kendo-react-labels"),Gt=require("@progress/kendo-svg-icons"),jt=require("../common/ListContainer.js"),$t=require("../common/ListFilter.js"),nt=require("../common/GroupStickyHeader.js"),Yt=require("../common/ListDefaultItem.js"),Jt=require("../common/List.js"),ot=require("../common/DropDownBase.js"),c=require("../common/utils.js"),rt=require("../package-metadata.js"),Qt=require("@progress/kendo-react-buttons"),Rt=require("@progress/kendo-react-intl"),Y=require("../messages/index.js"),Xt=require("@progress/kendo-react-layout"),Zt=require("../common/AdaptiveMode.js");function en(M){const J=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(M){for(const T in M)if(T!=="default"){const re=Object.getOwnPropertyDescriptor(M,T);Object.defineProperty(J,T,re.get?re:{enumerable:!0,get:()=>M[T]})}}return J.default=M,Object.freeze(J)}const i=en(_t),tn="Please select a value from the list!",fe=i.forwardRef((M,J)=>{let T=!1;const re=o.getLicenseMessage(rt.packageMetadata),n=o.usePropsContext(at,M),{delay:st=P.delay,tabIndex:it=P.tabIndex,ignoreCase:Q=P.ignoreCase,size:O=P.size,rounded:Me=P.rounded,fillMode:ve=P.fillMode}=n;if(n.filterable||n.virtual){const e=[];n.filterable&&e.push("filterable"),n.virtual&&e.push("virtualization"),T=!o.validatePackage(rt.packageMetadata,{component:"DropDownList",features:e})}const E=o.useUnstyled(),ye=o.useId(n.id),De=()=>{var e;if(o.canUseDOM)return((e=V.current)==null?void 0:e.ownerDocument)||window.document},lt=()=>{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 A.current!==void 0&&A.current!==null?e=A.current:n.value!==void 0?e=n.value:f.value!==void 0&&f.value!==null?e=f.value:n.defaultValue!==void 0&&n.defaultValue!==null&&(e=n.defaultValue),!c.isPresent(e)&&n.defaultItem!==void 0&&n.defaultItem!==null&&(e=n.defaultItem),e},dt=()=>{const{dataItemKey:e}=n,r=c.getFilteredData(n),a=k();return r.findIndex(u=>c.areSame(u,a,e))},Ie=()=>n.required!==void 0?n.required:P.required,he=()=>{const e=n.validationMessage!==void 0,r=k(),a=!Ie()||r!==null&&r!==""&&r!==void 0,u=n.valid!==void 0?n.valid:a;return{customError:e,valid:u,valueMissing:r===null}},ct=()=>n.validityStyles!==void 0?n.validityStyles:P.validityStyles,oe=e=>{ae.current=!0,e.focus(),window.setTimeout(()=>ae.current=!1,30)},we=()=>{X.current&&oe(X.current),n.adaptive&&setTimeout(()=>{X.current&&oe(X.current)},300)},ut=i.useCallback(e=>{for(const r of e)Pt(r.target.clientWidth)},[]),Te=()=>{var e;(e=Le.current)!=null&&e.setCustomValidity&&Le.current.setCustomValidity(he().valid?"":n.validationMessage||tn)},q=(e,r)=>{const a=k();c.areSame(a,e,n.dataItemKey)||(n.value===void 0&&(r.data.value=e),t.current.updateComponentArgs({value:e}),A.current=e,r.events.push({type:"onChange"}))},b=e=>{var r;(r=t==null?void 0:t.current)==null||r.applyState(e),A.current=void 0},R=(e,r)=>{var p;const{virtual:a,dataItemKey:u,defaultItem:d}=n,m=c.getFilteredData(n),g=a?a.skip:0,v=k(),s=e===-1&&d!==void 0?d:m[e-g],y=!c.areSame(s,v,u);q(s,r),y&&((p=t==null?void 0:t.current)==null||p.triggerPageChangeCornerItems(s,r))},z=(e,r,a)=>{var x,I;const{defaultItem:u,dataItemKey:d,virtual:m={skip:0,total:0,pageSize:0}}=n,g=k(),v=c.getFilteredData(n),s=(x=t==null?void 0:t.current)==null?void 0:x.vs,y=v.findIndex(w=>c.areSame(w,g,d)),p=(I=t==null?void 0:t.current)==null?void 0:I.navigation.navigate({current:m.skip+y,max:(s!=null&&s.enabled?m.total:v.length)-1,min:u!==void 0?-1:0,keyCode:r,skipItems:a||void 0});p!==void 0&&R(p,e),b(e)},pt=e=>{V.current=e,t.current.wrapper=e},mt=e=>i.createElement("select",{name:n.name,ref:r=>{Le.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})),Se=()=>{const{textField:e,dataItemKey:r,virtual:a={skip:0},focusedItemIndex:u=c.itemIndexStartsWith,filterable:d,skipDisabledItems:m=!0}=n,g=k(),v=c.getFilteredData(n),s=n.filter?n.filter:f.text;return m&&e&&!s&&!g?v.findIndex(y=>!y.disabled&&y[e]):c.isPresent(g)&&s===void 0||d&&s===""?v.findIndex(y=>c.areSame(y,g,r)):s?ke.current?u(v,s,e):v.findIndex(y=>c.areSame(y,g,r)):a.skip===0?0:-1},Oe=(e,r)=>r!==void 0&&r!==-1&&e&&e.length>0&&e[r].disabled,xe=()=>{const e=c.getFilteredData(n),r=t.current.initState(),a=Se();Oe(e,a)&&(q(null,r),b(r))},Ce=e=>{if(e.isPropagationStopped())return;const r=t.current.initState();r.syntheticEvent=e,f.focused||(r.data.focused=!0),xe(),t.current.togglePopup(r),b(r)},qe=e=>{var N,me,U,ge,$,et,tt;e&&e.target instanceof Element&&e.target.nodeName==="INPUT"&&e.stopPropagation&&e.stopPropagation();const{filterable:r,disabled:a,defaultItem:u,leftRightKeysNavigation:d=!0,virtual:m={skip:0,total:0,pageSize:0},dataItemKey:g,groupField:v="",textField:s,skipDisabledItems:y=!0}=n,p=c.getFilteredData(n),x=k(),I=p.findIndex(C=>c.areSame(C,x,g)),w=n.opened!==void 0?n.opened:f.opened,l=e.keyCode,F=l===o.Keys.home||l===o.Keys.end,K=l===o.Keys.up||l===o.Keys.down,j=!w&&(e.altKey&&l===o.Keys.down||l===o.Keys.enter||l===o.Keys.space),ne=w&&(e.altKey&&l===o.Keys.up||l===o.Keys.esc),ue=d&&(l===o.Keys.left||l===o.Keys.right),pe=K||ue&&!r||F,S=t.current.initState();if(S.syntheticEvent=e,!a){if(F&&((N=t==null?void 0:t.current)!=null&&N.vs.enabled))l===o.Keys.home?m.skip!==0?((me=t==null?void 0:t.current)==null||me.triggerOnPageChange(S,0,m.pageSize),B.current=!0):q(p[0],S):m.skip<m.total-m.pageSize?((U=t==null?void 0:t.current)==null||U.triggerOnPageChange(S,m.total-m.pageSize,m.pageSize),B.current=!0):q(p[p.length-1],S);else if(w&&l===o.Keys.pageUp)e.preventDefault(),(ge=t==null?void 0:t.current)==null||ge.scrollPopupByPageSize(-1);else if(w&&l===o.Keys.pageDown)e.preventDefault(),($=t==null?void 0:t.current)==null||$.scrollPopupByPageSize(1);else if(w&&l===o.Keys.enter){const C=Se();Oe(p,C)?(q(null,S),b(S)):R(C,S),(et=t==null?void 0:t.current)==null||et.togglePopup(S),e.preventDefault()}else if(j||ne)ne&&xe(),(tt=t==null?void 0:t.current)==null||tt.togglePopup(S),e.preventDefault();else if(pe){if(ke.current=!1,v!==""&&s)if(!y&&w)z(S,l);else{let C;if(l===o.Keys.down||l===o.Keys.right){const h=p.slice(I+1).find(D=>!D.disabled&&D[s]);C=h&&p.findIndex(D=>D[s]===h[s])}else if(l===o.Keys.up||l===o.Keys.left){let h;if(I===0&&u)C=-1;else if(I===-1)h=p,C=p.findIndex(D=>!D.disabled&&D[s]);else{h=p.slice(0,I);let D=h.pop();for(;D&&D.disabled;)D=h.pop();C=D&&p.findIndex(Ne=>Ne[s]===D[s])}}if(C!==void 0){const h=C-I;z(S,l,h)}else C===void 0&&p.findIndex(h=>h[s]===x[s])===p.length-1&&z(S,l)}else if(!y&&w||F)z(S,l);else if(s){let C;if(l===o.Keys.down||l===o.Keys.right){const h=p.slice(I+1).find(D=>!D.disabled&&D[s]);C=h&&p.findIndex(D=>D[s]===h[s])}else if(l===o.Keys.up||l===o.Keys.left){let h;if(I===0&&u)C=-1;else if(I===-1)h=p,C=p.find(D=>!D.disabled&&D[s]);else{h=p.slice(0,I);let D=h.pop();for(;D&&D.disabled;)D=h.pop();C=D&&p.findIndex(Ne=>Ne[s]===D[s])}}if(C!==void 0){const h=C-I;z(S,l,h)}else C===void 0&&p.findIndex(h=>h[s]===x[s])===p.length-1&&z(S,l)}else z(S,l);e.preventDefault()}b(S)}},gt=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),ke.current=!0,b(r),ee({group:void 0,text:String(e.target.value)})},ze=e=>{const r=n.filter!==void 0?n.filter:f.text;return n.filterable&&i.createElement($t,{value:r,ref:a=>{X.current=a&&a.element},onChange:gt,onKeyDown:qe,size:e?"large":O,rounded:Me,fillMode:ve,renderListFilterWrapper:!0,placeholder:_e.toLanguageString(Y.dropDownListAdaptiveFilterPlaceholder,Y.messages[Y.dropDownListAdaptiveFilterPlaceholder])})},ft=e=>{var a;const r=t.current.initState();r.syntheticEvent=e,(a=t==null?void 0:t.current)==null||a.togglePopup(r),q(n.defaultItem,r),b(r)},vt=()=>{const{textField:e,defaultItem:r,dataItemKey:a}=n,u=k();return r!==void 0&&i.createElement(Yt,{defaultItem:r,textField:e,selected:c.areSame(u,r,a),key:"defaultitemkey",onClick:ft})},yt=(e,r)=>{var a;(a=t==null?void 0:t.current)==null||a.handleItemClick(e,r),A.current=void 0},Dt=e=>{const{vs:r,list:a}=t.current;r.scrollHandler(e);const{groupField:u}=n;let d=c.getFilteredData(n);if(!(!u||!d.length)&&u){const m=He.current=He.current||(r.enabled?r.itemHeight:a?a.children[0].offsetHeight:0),v=e.target.scrollTop-r.skip*m;d=t.current.getGroupedDataModernMode(d,u);let s=d[0][u];for(let y=1;y<d.length&&!(m*y>v);y++)d[y]&&d[y][u]&&(s=d[y][u]);s!==f.group&&ee({group:s})}},Ve=()=>{var l;const{textField:e,dataItemKey:r,virtual:a={skip:0,total:void 0},groupHeaderItemRender:u,listNoDataRender:d,itemRender:m}=n,g=c.getFilteredData(n),v=E&&E.uDropDownList,s=t.current.vs,y=a.skip,p=n.opened!==void 0?n.opened:f.opened,x=t.current.getPopupSettings(),I=`translateY(${s.translate}px)`,w=k();return i.createElement(Jt,{id:Ee,show:p,data:g.slice(),focusedIndex:Se(),value:w,textField:e,valueField:r,optionsGuid:je,groupField:n.groupField,listRef:F=>{s.list=t.current.list=F},wrapperStyle:{maxHeight:_?void 0:x.height},wrapperCssClass:o.classNames(o.uDropDownList.listContent({c:v})),listStyle:s.enabled?{transform:I}:void 0,key:"listkey",skip:y,onClick:yt,itemRender:m,groupHeaderItemRender:u,noDataRender:d,onScroll:Dt,wrapperRef:s.scrollerRef,scroller:(l=t==null?void 0:t.current)==null?void 0:l.renderScrollElement(),ariaSetSize:a.total})},It=()=>{const{groupField:e}=n,r=c.getFilteredData(n),a=n.opened!==void 0?n.opened:f.opened,u=E&&E.uDropDownList,d={title:n.adaptiveTitle||n.label,subTitle:n.adaptiveSubtitle,expand:a,onClose:g=>Ce(g),windowWidth:be,mobileFilter:ze(!0)};let{group:m}=f;return m===void 0&&e!==void 0&&(m=c.getItemValue(r[0],e)),i.createElement(Zt.AdaptiveMode,{...d},i.createElement(Xt.ActionSheetContent,null,i.createElement("div",{className:o.classNames(o.uDropDownList.listContainer({c:u,popup:!1}))},xt())))},ht=()=>{f.focused&&window.setTimeout(()=>{f.focused&&t.current.wrapper&&oe(t.current.wrapper)})},wt=e=>{"onMouseDownOutside"in(n.popupSettings||{})&&n.popupSettings.onMouseDownOutside.call(void 0,e)},St=()=>{const{header:e,footer:r,dir:a,groupField:u,groupStickyHeaderItemRender:d,list:m}=n,g=c.getFilteredData(n),v=t.current,s=v.getPopupSettings(),y=n.opened!==void 0?n.opened:f.opened,p=s.width!==void 0?s.width:v.popupWidth,x=E&&E.uDropDownList,I={dir:a!==void 0?a:v.dirCalculated,width:p,popupSettings:{...s,popupClass:o.classNames(s.popupClass,o.uDropDownList.listContainer({c:x,popup:!0})),anchor:s.anchor||V.current,show:y,onOpen:we,onClose:ht,onMouseDownOutside:wt},itemsCount:[g.length]};let{group:w}=f;return w===void 0&&u!==void 0&&(w=c.getItemValue(g[0],u)),i.createElement(jt,{...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}))},vt(),!m&&w&&g.length!==0&&i.createElement(nt,{group:w,render:d}),Ve()),r&&i.createElement("div",{className:o.classNames(o.uDropDownList.listFooter({c:x}))},r),T&&i.createElement(o.WatermarkOverlay,{message:re}))},xt=()=>{const{header:e,footer:r,groupStickyHeaderItemRender:a,groupField:u,list:d}=n,m=c.getFilteredData(n),g=E&&E.uDropDownList;let{group:v}=f;return v===void 0&&u!==void 0&&(v=c.getItemValue(m[0],u)),i.createElement(i.Fragment,null,e&&i.createElement("div",{className:o.classNames(o.uDropDownList.listHeader({c:g}))},e),i.createElement("div",{className:o.classNames("k-list",{[`k-list-${_?"lg":o.sizeMap[O]||O}`]:_||O})},!d&&v&&m.length!==0&&i.createElement(nt,{group:v,render:a}),Ve()),r&&i.createElement("div",{className:"k-list-footer"},r))},Ct=e=>{const{dataItemKey:r}=n,a=c.getFilteredData(n),u=k();let d=a.map((K,j)=>({item:K,itemIndex:j}));const m=G.current.word,g=G.current.last,v=c.sameCharsOnly(m,g);let s=d.length,y=Math.max(0,a.findIndex(K=>c.areSame(K,u,r))),p;n.defaultItem&&(p={item:n.defaultItem,itemIndex:-1},s+=1,y+=1),y+=v?1:0,d=c.shuffleData(d,y,p);let x,I,w,l=0;const{textField:F}=n;for(;l<s;){if(x=c.getItemValue(d[l].item,F),I=v&&c.matchText(x,g,Q),w=c.matchText(x,m,Q),I||w){l=d[l].itemIndex;break}l++}if(l!==s){const K=t.current.initState();K.syntheticEvent=e,R(l,K),b(K),A.current=void 0}},Lt=e=>{clearTimeout(Be.current),n.filterable||(Be.current=window.setTimeout(()=>G.current.word="",st),Ct(e))},kt=e=>{ae.current||t.current.handleFocus(e)},Kt=e=>{if(ae.current||!f.focused)return;const r=n.opened!==void 0?n.opened:f.opened,a=t.current.initState();a.syntheticEvent=e,a.data.focused=!1,a.events.push({type:"onBlur"}),r&&xe(),r&&!_&&t.current.togglePopup(a),b(a)},bt=e=>{if(n.filterable||e.which===0||e.keyCode===o.Keys.enter)return;let r=String.fromCharCode(e.charCode||e.keyCode);Q&&(r=r.toLowerCase()),r===" "&&e.preventDefault(),G.current={word:G.current.word+r,last:G.current.last+r},Lt(e)},Et=()=>{const e=t.current.initState();e.data.opened=f.opened,t.current.togglePopup(e),b(e)},Ae=i.useRef(null),V=i.useRef(null),Le=i.useRef(null),X=i.useRef(null);i.useImperativeHandle(Ae,()=>({get element(){return V.current},get index(){return dt()},get name(){return n.name},get validity(){return he()},get value(){return k()},get focused(){return f.focused},get opened(){return f.opened},focus:lt,props:n,togglePopup:Et})),i.useImperativeHandle(J,()=>Ae.current);const Be=i.useRef(null),G=i.useRef({word:"",last:""}),ae=i.useRef(!1),A=i.useRef(null),B=i.useRef(!1),ke=i.useRef(!1),H=i.useRef({}),Ke=i.useRef({}),t=i.useRef(new ot({props:n,setState:()=>{},state:{},forceUpdate:()=>{},element:null,value:null,handleItemSelect:()=>{}})),He=i.useRef(0),Z=i.useRef(null),[f,Ft]=i.useState({}),[be,Pt]=i.useState(),[,We]=i.useReducer(e=>e,!0),_e=Rt.useLocalization(),Ue=n.name||n.id,Nt=i.useCallback(e=>{if(e==null||!t.current)return;const r=c.getFilteredData(n),{textField:a}=n,u=String(e),d=c.getItemIndexByText(r,u,a,!1,Q),m=d!==-1?r[d]:void 0;if(m!==void 0){const g=t.current.initState();g.syntheticEvent={target:V.current},q(m,g),b(g)}},[n,Q]);o.useKendoPaste(V,{fieldName:Ue,onValueChange:Nt,enabled:!!Ue});const ee=e=>{Ft({...f,...e})};i.useEffect(()=>{t.current.updateComponentArgs({props:n,setState:ee,state:f,forceUpdate:We,element:V.current,handleItemSelect:R,value:k()})},[ee,f,We,R,k]),i.useEffect(()=>{var y,p,x,I,w,l,F,K,j,ne,ue,pe,S;const{dataItemKey:e,virtual:r,groupField:a="",textField:u}=n,d=c.getFilteredData(n),m=H.current.virtual?H.current.virtual.total:0,g=n.opened!==void 0?n.opened:f.opened,v=H.current.opened!==void 0?H.current.opened:Ke.current.opened,s=!v&&g;if((y=t==null?void 0:t.current)==null||y.didUpdate(),(p=t==null?void 0:t.current)!=null&&p.getPopupSettings().animate||s&&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 N=k(),me=H.current.value!==void 0?H.current.value:Ke.current.value;let U=d.findIndex($=>c.areSame($,N,e));a!==""&&N&&u&&(U=(l=(w=t==null?void 0:t.current)==null?void 0:w.getGroupedDataModernMode(d,a))==null?void 0:l.map($=>$[u]).indexOf(N[u]));const ge=!c.areSame(me,N,e);s&&r?(F=t==null?void 0:t.current)==null||F.scrollToVirtualItem(r,U):s&&!r?(we(),d&&d.length!==0&&((K=t==null?void 0:t.current)==null||K.resetGroupStickyHeader(d[0][a],{setState:ee,group:f.group,state:f})),(j=t==null?void 0:t.current)==null||j.scrollToItem(U)):g&&v&&N&&ge&&!B.current?(ue=t==null?void 0:t.current)==null||ue.scrollToItem(U,(ne=t==null?void 0:t.current)==null?void 0:ne.vs.enabled):g&&v&&B.current&&(B.current&&r&&r.skip===0?(pe=t==null?void 0:t.current)==null||pe.vs.reset():B.current&&r&&r.skip===r.total-r.pageSize&&((S=t==null?void 0:t.current)==null||S.vs.scrollToEnd()))}B.current=!1,Ke.current=f,H.current=n,Te()}),i.useEffect(()=>{var e,r;return Z.current=o.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(ut.bind(void 0)),(e=t==null?void 0:t.current)==null||e.didMount(),Te(),(r=De())!=null&&r.body&&Z.current&&Z.current.observe(De().body),()=>{var a;(a=De())!=null&&a.body&&Z.current&&Z.current.disconnect()}},[]);const Ge=ye+"-accessibility-id",Ee=ye+"-listbox-id",je=ye+"-guid",Mt=_e.toLanguageString(Y.dropDownListArrowBtnAriaLabel,Y.messages[Y.dropDownListArrowBtnAriaLabel]),{style:se,className:Tt,label:Fe,dir:Ot,virtual:W,adaptive:nn,dataItemKey:qt,disabled:ie,loading:$e,iconClassName:Ye,svgIcon:zt,valueRender:Je}=n,le=n.opened!==void 0?n.opened:f.opened,de=k(),Pe=c.getItemValue(de,n.textField),Qe=!ct()||he().valid,ce=t.current,Vt=ce.vs,te=E&&E.uDropDownList;Vt.enabled=W!==void 0;const Re=o.useAdaptiveModeContext(),_=!!(be&&Re&&be<=Re.medium&&n.adaptive);W!==void 0&&(ce.vs.skip=W.skip,ce.vs.total=W.total,ce.vs.pageSize=W.pageSize);const At=c.getFilteredData(n),{focused:Bt}=f,Ht=At.findIndex(e=>c.areSame(e,de,qt)),Xe=i.createElement("span",{id:Ge,className:o.classNames(o.uDropDownList.inputInner({c:te}))},Pe&&i.createElement("span",{className:o.classNames(o.uDropDownList.inputText({c:te}))},Pe)),Wt=Je!==void 0?Je.call(void 0,Xe,de):Xe,Ze=i.createElement(i.Fragment,null,i.createElement("span",{ref:pt,className:o.classNames(o.uDropDownList.wrapper({c:te,size:O,rounded:Me,fillMode:ve,focused:Bt,disabled:ie,invalid:!Qe,loading:$e,required:Ie()}),Tt),style:Fe?{...se,width:void 0}:se,dir:Ot,onMouseDown:le?e=>{e.target.nodeName!=="INPUT"&&(oe(t.current.wrapper),e.preventDefault())}:void 0,onFocus:_?e=>Ce(e):kt,onBlur:Kt,tabIndex:o.getTabIndex(it,ie),accessKey:n.accessKey,onKeyDown:qe,onKeyPress:bt,onClick:ie?void 0:Ce,role:"combobox","aria-required":Ie(),"aria-disabled":ie||void 0,"aria-haspopup":"listbox","aria-expanded":le||!1,"aria-owns":Ee,"aria-activedescendant":le?"option-"+je+"-"+(Ht+(W?W.skip:0)):void 0,"aria-label":n.ariaLabel||n.label,"aria-labelledby":n.ariaLabelledBy,"aria-describedby":n.ariaDescribedBy||Ge,"aria-controls":le?Ee:void 0,id:n.id,title:n.title},Wt,$e&&i.createElement(o.IconWrap,{className:o.classNames(o.uDropDownList.loadingIcon({c:te})),name:"loading"}),i.createElement(Qt.Button,{tabIndex:-1,type:"button","aria-label":Mt,size:O,fillMode:ve,className:o.classNames(o.uDropDownList.inputButton({c:te})),iconClass:Ye,svgIcon:Ye?void 0:zt||Gt.caretAltDownIcon,onMouseDown:e=>f.focused&&e.preventDefault()}),mt(de),!_&&St()),_&&It());return Fe?i.createElement(Ut.FloatingLabel,{label:Fe,editorValue:Pe,editorValid:Qe,editorDisabled:n.disabled,style:{width:se?se.width:void 0},children:Ze}):Ze});fe.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,...ot.defaultProps,required:!1,size:void 0,rounded:void 0,fillMode:void 0};fe.displayName="KendoReactDropDownList";const at=o.createPropsContext();fe.displayName="KendoReactDropDownList";exports.DropDownList=fe;exports.DropDownListPropsContext=at;exports.dropDownListDefaultProps=P;
|
|
@@ -31,7 +31,7 @@ const kn = "Please select a value from the list!", Me = s.forwardRef((ut, pt) =>
|
|
|
31
31
|
ignoreCase: J = z.ignoreCase,
|
|
32
32
|
size: O = z.size,
|
|
33
33
|
rounded: Ne = z.rounded,
|
|
34
|
-
fillMode:
|
|
34
|
+
fillMode: fe = z.fillMode
|
|
35
35
|
} = n;
|
|
36
36
|
if (n.filterable || n.virtual) {
|
|
37
37
|
const e = [];
|
|
@@ -40,7 +40,7 @@ const kn = "Please select a value from the list!", Me = s.forwardRef((ut, pt) =>
|
|
|
40
40
|
features: e
|
|
41
41
|
});
|
|
42
42
|
}
|
|
43
|
-
const K = en(),
|
|
43
|
+
const K = en(), ge = tn(n.id), ve = () => {
|
|
44
44
|
var e;
|
|
45
45
|
if (nt)
|
|
46
46
|
return ((e = A.current) == null ? void 0 : e.ownerDocument) || window.document;
|
|
@@ -53,8 +53,8 @@ const kn = "Please select a value from the list!", Me = s.forwardRef((ut, pt) =>
|
|
|
53
53
|
}, It = () => {
|
|
54
54
|
const { dataItemKey: e } = n, r = E(n), o = k();
|
|
55
55
|
return r.findIndex((d) => F(d, o, e));
|
|
56
|
-
},
|
|
57
|
-
const e = n.validationMessage !== void 0, r = k(), o = !
|
|
56
|
+
}, Ie = () => n.required !== void 0 ? n.required : z.required, he = () => {
|
|
57
|
+
const e = n.validationMessage !== void 0, r = k(), o = !Ie() || r !== null && r !== "" && r !== void 0, d = n.valid !== void 0 ? n.valid : o;
|
|
58
58
|
return {
|
|
59
59
|
customError: e,
|
|
60
60
|
valid: d,
|
|
@@ -62,7 +62,7 @@ const kn = "Please select a value from the list!", Me = s.forwardRef((ut, pt) =>
|
|
|
62
62
|
};
|
|
63
63
|
}, ht = () => n.validityStyles !== void 0 ? n.validityStyles : z.validityStyles, re = (e) => {
|
|
64
64
|
oe.current = !0, e.focus(), window.setTimeout(() => oe.current = !1, 30);
|
|
65
|
-
},
|
|
65
|
+
}, ye = () => {
|
|
66
66
|
X.current && re(X.current), n.adaptive && setTimeout(() => {
|
|
67
67
|
X.current && re(X.current);
|
|
68
68
|
}, 300);
|
|
@@ -71,8 +71,8 @@ const kn = "Please select a value from the list!", Me = s.forwardRef((ut, pt) =>
|
|
|
71
71
|
At(r.target.clientWidth);
|
|
72
72
|
}, []), Te = () => {
|
|
73
73
|
var e;
|
|
74
|
-
(e =
|
|
75
|
-
|
|
74
|
+
(e = Se.current) != null && e.setCustomValidity && Se.current.setCustomValidity(
|
|
75
|
+
he().valid ? "" : n.validationMessage || kn
|
|
76
76
|
);
|
|
77
77
|
}, V = (e, r) => {
|
|
78
78
|
const o = k();
|
|
@@ -101,7 +101,7 @@ const kn = "Please select a value from the list!", Me = s.forwardRef((ut, pt) =>
|
|
|
101
101
|
{
|
|
102
102
|
name: n.name,
|
|
103
103
|
ref: (r) => {
|
|
104
|
-
|
|
104
|
+
Se.current = r;
|
|
105
105
|
},
|
|
106
106
|
tabIndex: -1,
|
|
107
107
|
"aria-hidden": !0,
|
|
@@ -109,7 +109,7 @@ const kn = "Please select a value from the list!", Me = s.forwardRef((ut, pt) =>
|
|
|
109
109
|
style: { opacity: 0, width: 1, border: 0, zIndex: -1, position: "absolute", left: "50%" }
|
|
110
110
|
},
|
|
111
111
|
/* @__PURE__ */ s.createElement("option", { value: n.valueMap ? n.valueMap.call(void 0, e) : e })
|
|
112
|
-
),
|
|
112
|
+
), we = () => {
|
|
113
113
|
const {
|
|
114
114
|
textField: e,
|
|
115
115
|
dataItemKey: r,
|
|
@@ -118,17 +118,17 @@ const kn = "Please select a value from the list!", Me = s.forwardRef((ut, pt) =>
|
|
|
118
118
|
filterable: l,
|
|
119
119
|
skipDisabledItems: u = !0
|
|
120
120
|
} = n, p = k(), f = E(n), i = n.filter ? n.filter : m.text;
|
|
121
|
-
return u && e && !i && !p ? f.findIndex((g) => !g.disabled && g[e]) : ot(p) && i === void 0 || l && i === "" ? f.findIndex((g) => F(g, p, r)) : i ?
|
|
122
|
-
}, ze = (e, r) => r !== void 0 && r !== -1 && e && e.length > 0 && e[r].disabled,
|
|
123
|
-
const e = E(n), r = t.current.initState(), o =
|
|
121
|
+
return u && e && !i && !p ? f.findIndex((g) => !g.disabled && g[e]) : ot(p) && i === void 0 || l && i === "" ? f.findIndex((g) => F(g, p, r)) : i ? Ce.current ? d(f, i, e) : f.findIndex((g) => F(g, p, r)) : o.skip === 0 ? 0 : -1;
|
|
122
|
+
}, ze = (e, r) => r !== void 0 && r !== -1 && e && e.length > 0 && e[r].disabled, xe = () => {
|
|
123
|
+
const e = E(n), r = t.current.initState(), o = we();
|
|
124
124
|
ze(e, o) && (V(null, r), M(r));
|
|
125
|
-
},
|
|
125
|
+
}, De = (e) => {
|
|
126
126
|
if (e.isPropagationStopped())
|
|
127
127
|
return;
|
|
128
128
|
const r = t.current.initState();
|
|
129
|
-
r.syntheticEvent = e, m.focused || (r.data.focused = !0),
|
|
129
|
+
r.syntheticEvent = e, m.focused || (r.data.focused = !0), xe(), t.current.togglePopup(r), M(r);
|
|
130
130
|
}, Oe = (e) => {
|
|
131
|
-
var T,
|
|
131
|
+
var T, pe, G, me, j, et, tt;
|
|
132
132
|
e && e.target instanceof Element && e.target.nodeName === "INPUT" && e.stopPropagation && e.stopPropagation();
|
|
133
133
|
const {
|
|
134
134
|
filterable: r,
|
|
@@ -140,25 +140,25 @@ const kn = "Please select a value from the list!", Me = s.forwardRef((ut, pt) =>
|
|
|
140
140
|
groupField: f = "",
|
|
141
141
|
textField: i,
|
|
142
142
|
skipDisabledItems: g = !0
|
|
143
|
-
} = n, c = E(n), D = k(), h = c.findIndex((S) => F(S, D, p)), w = n.opened !== void 0 ? n.opened : m.opened, a = e.keyCode, N = a === I.home || a === I.end, b = a === I.up || a === I.down, Y = !w && (e.altKey && a === I.down || a === I.enter || a === I.space), te = w && (e.altKey && a === I.up || a === I.esc),
|
|
143
|
+
} = n, c = E(n), D = k(), h = c.findIndex((S) => F(S, D, p)), w = n.opened !== void 0 ? n.opened : m.opened, a = e.keyCode, N = a === I.home || a === I.end, b = a === I.up || a === I.down, Y = !w && (e.altKey && a === I.down || a === I.enter || a === I.space), te = w && (e.altKey && a === I.up || a === I.esc), ce = l && (a === I.left || a === I.right), ue = b || ce && !r || N, x = t.current.initState();
|
|
144
144
|
if (x.syntheticEvent = e, !o) {
|
|
145
145
|
if (N && ((T = t == null ? void 0 : t.current) != null && T.vs.enabled))
|
|
146
|
-
a === I.home ? u.skip !== 0 ? ((
|
|
146
|
+
a === I.home ? u.skip !== 0 ? ((pe = t == null ? void 0 : t.current) == null || pe.triggerOnPageChange(x, 0, u.pageSize), W.current = !0) : V(c[0], x) : u.skip < u.total - u.pageSize ? ((G = t == null ? void 0 : t.current) == null || G.triggerOnPageChange(
|
|
147
147
|
x,
|
|
148
148
|
u.total - u.pageSize,
|
|
149
149
|
u.pageSize
|
|
150
150
|
), W.current = !0) : V(c[c.length - 1], x);
|
|
151
151
|
else if (w && a === I.pageUp)
|
|
152
|
-
e.preventDefault(), (
|
|
152
|
+
e.preventDefault(), (me = t == null ? void 0 : t.current) == null || me.scrollPopupByPageSize(-1);
|
|
153
153
|
else if (w && a === I.pageDown)
|
|
154
154
|
e.preventDefault(), (j = t == null ? void 0 : t.current) == null || j.scrollPopupByPageSize(1);
|
|
155
155
|
else if (w && a === I.enter) {
|
|
156
|
-
const S =
|
|
156
|
+
const S = we();
|
|
157
157
|
ze(c, S) ? (V(null, x), M(x)) : Q(S, x), (et = t == null ? void 0 : t.current) == null || et.togglePopup(x), e.preventDefault();
|
|
158
158
|
} else if (Y || te)
|
|
159
|
-
te &&
|
|
160
|
-
else if (
|
|
161
|
-
if (
|
|
159
|
+
te && xe(), (tt = t == null ? void 0 : t.current) == null || tt.togglePopup(x), e.preventDefault();
|
|
160
|
+
else if (ue) {
|
|
161
|
+
if (Ce.current = !1, f !== "" && i)
|
|
162
162
|
if (!g && w)
|
|
163
163
|
H(x, a);
|
|
164
164
|
else {
|
|
@@ -218,7 +218,7 @@ const kn = "Please select a value from the list!", Me = s.forwardRef((ut, pt) =>
|
|
|
218
218
|
}
|
|
219
219
|
}, Dt = (e) => {
|
|
220
220
|
const r = t.current.initState();
|
|
221
|
-
r.syntheticEvent = e.syntheticEvent, n.filter === void 0 && (r.data.text = e.target.value), t.current.filterChanged(e.target.value, r),
|
|
221
|
+
r.syntheticEvent = e.syntheticEvent, n.filter === void 0 && (r.data.text = e.target.value), t.current.filterChanged(e.target.value, r), Ce.current = !0, M(r), R({ group: void 0, text: String(e.target.value) });
|
|
222
222
|
}, Ve = (e) => {
|
|
223
223
|
const r = n.filter !== void 0 ? n.filter : m.text;
|
|
224
224
|
return n.filterable && /* @__PURE__ */ s.createElement(
|
|
@@ -232,7 +232,7 @@ const kn = "Please select a value from the list!", Me = s.forwardRef((ut, pt) =>
|
|
|
232
232
|
onKeyDown: Oe,
|
|
233
233
|
size: e ? "large" : O,
|
|
234
234
|
rounded: Ne,
|
|
235
|
-
fillMode:
|
|
235
|
+
fillMode: fe,
|
|
236
236
|
renderListFilterWrapper: !0,
|
|
237
237
|
placeholder: Ue.toLanguageString(
|
|
238
238
|
dt,
|
|
@@ -285,10 +285,10 @@ const kn = "Please select a value from the list!", Me = s.forwardRef((ut, pt) =>
|
|
|
285
285
|
return /* @__PURE__ */ s.createElement(
|
|
286
286
|
vn,
|
|
287
287
|
{
|
|
288
|
-
id:
|
|
288
|
+
id: Le,
|
|
289
289
|
show: c,
|
|
290
290
|
data: p.slice(),
|
|
291
|
-
focusedIndex:
|
|
291
|
+
focusedIndex: we(),
|
|
292
292
|
value: w,
|
|
293
293
|
textField: e,
|
|
294
294
|
valueField: r,
|
|
@@ -317,8 +317,8 @@ const kn = "Please select a value from the list!", Me = s.forwardRef((ut, pt) =>
|
|
|
317
317
|
title: n.adaptiveTitle || n.label,
|
|
318
318
|
subTitle: n.adaptiveSubtitle,
|
|
319
319
|
expand: o,
|
|
320
|
-
onClose: (p) =>
|
|
321
|
-
windowWidth:
|
|
320
|
+
onClose: (p) => De(p),
|
|
321
|
+
windowWidth: Ee,
|
|
322
322
|
mobileFilter: Ve(!0)
|
|
323
323
|
};
|
|
324
324
|
let { group: u } = m;
|
|
@@ -344,7 +344,7 @@ const kn = "Please select a value from the list!", Me = s.forwardRef((ut, pt) =>
|
|
|
344
344
|
),
|
|
345
345
|
anchor: i.anchor || A.current,
|
|
346
346
|
show: g,
|
|
347
|
-
onOpen:
|
|
347
|
+
onOpen: ye,
|
|
348
348
|
onClose: bt,
|
|
349
349
|
onMouseDownOutside: Pt
|
|
350
350
|
},
|
|
@@ -409,7 +409,7 @@ const kn = "Please select a value from the list!", Me = s.forwardRef((ut, pt) =>
|
|
|
409
409
|
if (oe.current || !m.focused)
|
|
410
410
|
return;
|
|
411
411
|
const r = n.opened !== void 0 ? n.opened : m.opened, o = t.current.initState();
|
|
412
|
-
o.syntheticEvent = e, o.data.focused = !1, o.events.push({ type: "onBlur" }), r &&
|
|
412
|
+
o.syntheticEvent = e, o.data.focused = !1, o.events.push({ type: "onBlur" }), r && xe(), r && !_ && t.current.togglePopup(o), M(o);
|
|
413
413
|
}, Ot = (e) => {
|
|
414
414
|
if (n.filterable || e.which === 0 || e.keyCode === I.enter)
|
|
415
415
|
return;
|
|
@@ -421,7 +421,7 @@ const kn = "Please select a value from the list!", Me = s.forwardRef((ut, pt) =>
|
|
|
421
421
|
}, Vt = () => {
|
|
422
422
|
const e = t.current.initState();
|
|
423
423
|
e.data.opened = m.opened, t.current.togglePopup(e), M(e);
|
|
424
|
-
}, Ae = s.useRef(null), A = s.useRef(null),
|
|
424
|
+
}, Ae = s.useRef(null), A = s.useRef(null), Se = s.useRef(null), X = s.useRef(null);
|
|
425
425
|
s.useImperativeHandle(
|
|
426
426
|
Ae,
|
|
427
427
|
() => ({
|
|
@@ -435,7 +435,7 @@ const kn = "Please select a value from the list!", Me = s.forwardRef((ut, pt) =>
|
|
|
435
435
|
return n.name;
|
|
436
436
|
},
|
|
437
437
|
get validity() {
|
|
438
|
-
return
|
|
438
|
+
return he();
|
|
439
439
|
},
|
|
440
440
|
get value() {
|
|
441
441
|
return k();
|
|
@@ -454,7 +454,7 @@ const kn = "Please select a value from the list!", Me = s.forwardRef((ut, pt) =>
|
|
|
454
454
|
pt,
|
|
455
455
|
() => Ae.current
|
|
456
456
|
);
|
|
457
|
-
const Be = s.useRef(null), $ = s.useRef({ word: "", last: "" }), oe = s.useRef(!1), B = s.useRef(null), W = s.useRef(!1),
|
|
457
|
+
const Be = s.useRef(null), $ = s.useRef({ word: "", last: "" }), oe = s.useRef(!1), B = s.useRef(null), W = s.useRef(!1), Ce = s.useRef(!1), q = s.useRef({}), ke = s.useRef({}), t = s.useRef(
|
|
458
458
|
new ct({
|
|
459
459
|
props: n,
|
|
460
460
|
setState: () => {
|
|
@@ -467,7 +467,7 @@ const kn = "Please select a value from the list!", Me = s.forwardRef((ut, pt) =>
|
|
|
467
467
|
handleItemSelect: () => {
|
|
468
468
|
}
|
|
469
469
|
})
|
|
470
|
-
), We = s.useRef(0), Z = s.useRef(null), [m, Ht] = s.useState({}), [
|
|
470
|
+
), We = s.useRef(0), Z = s.useRef(null), [m, Ht] = s.useState({}), [Ee, At] = s.useState(), [, qe] = s.useReducer((e) => e, !0), Ue = Dn(), _e = n.name || n.id, Bt = s.useCallback(
|
|
471
471
|
(e) => {
|
|
472
472
|
if (e == null || !t.current)
|
|
473
473
|
return;
|
|
@@ -500,36 +500,36 @@ const kn = "Please select a value from the list!", Me = s.forwardRef((ut, pt) =>
|
|
|
500
500
|
value: k()
|
|
501
501
|
});
|
|
502
502
|
}, [R, m, qe, Q, k]), s.useEffect(() => {
|
|
503
|
-
var g, c, D, h, w, a, N, b, Y, te,
|
|
504
|
-
const { dataItemKey: e, virtual: r, groupField: o = "", textField: d } = n, l = E(n), u = q.current.virtual ? q.current.virtual.total : 0, p = n.opened !== void 0 ? n.opened : m.opened, f = q.current.opened !== void 0 ? q.current.opened :
|
|
505
|
-
if ((g = t == null ? void 0 : t.current) == null || g.didUpdate(), (c = t == null ? void 0 : t.current) != null && c.getPopupSettings().animate || i &&
|
|
503
|
+
var g, c, D, h, w, a, N, b, Y, te, ce, ue, x;
|
|
504
|
+
const { dataItemKey: e, virtual: r, groupField: o = "", textField: d } = n, l = E(n), u = q.current.virtual ? q.current.virtual.total : 0, p = n.opened !== void 0 ? n.opened : m.opened, f = q.current.opened !== void 0 ? q.current.opened : ke.current.opened, i = !f && p;
|
|
505
|
+
if ((g = t == null ? void 0 : t.current) == null || g.didUpdate(), (c = t == null ? void 0 : t.current) != null && c.getPopupSettings().animate || i && ye(), r && r.total !== u)
|
|
506
506
|
(D = t == null ? void 0 : t.current) == null || D.vs.calcScrollElementHeight(), (h = t == null ? void 0 : t.current) == null || h.vs.reset();
|
|
507
507
|
else {
|
|
508
|
-
const T = k(),
|
|
508
|
+
const T = k(), pe = q.current.value !== void 0 ? q.current.value : ke.current.value;
|
|
509
509
|
let G = l.findIndex((j) => F(j, T, e));
|
|
510
510
|
o !== "" && T && d && (G = (a = (w = t == null ? void 0 : t.current) == null ? void 0 : w.getGroupedDataModernMode(l, o)) == null ? void 0 : a.map((j) => j[d]).indexOf(T[d]));
|
|
511
|
-
const
|
|
512
|
-
i && r ? (N = t == null ? void 0 : t.current) == null || N.scrollToVirtualItem(r, G) : i && !r ? (
|
|
511
|
+
const me = !F(pe, T, e);
|
|
512
|
+
i && r ? (N = t == null ? void 0 : t.current) == null || N.scrollToVirtualItem(r, G) : i && !r ? (ye(), l && l.length !== 0 && ((b = t == null ? void 0 : t.current) == null || b.resetGroupStickyHeader(l[0][o], {
|
|
513
513
|
setState: R,
|
|
514
514
|
group: m.group,
|
|
515
515
|
state: m
|
|
516
|
-
})), (Y = t == null ? void 0 : t.current) == null || Y.scrollToItem(G)) : p && f && T &&
|
|
516
|
+
})), (Y = t == null ? void 0 : t.current) == null || Y.scrollToItem(G)) : p && f && T && me && !W.current ? (ce = t == null ? void 0 : t.current) == null || ce.scrollToItem(G, (te = t == null ? void 0 : t.current) == null ? void 0 : te.vs.enabled) : p && f && W.current && (W.current && r && r.skip === 0 ? (ue = t == null ? void 0 : t.current) == null || ue.vs.reset() : W.current && r && r.skip === r.total - r.pageSize && ((x = t == null ? void 0 : t.current) == null || x.vs.scrollToEnd()));
|
|
517
517
|
}
|
|
518
|
-
W.current = !1,
|
|
518
|
+
W.current = !1, ke.current = m, q.current = n, Te();
|
|
519
519
|
}), s.useEffect(() => {
|
|
520
520
|
var e, r;
|
|
521
|
-
return Z.current = nt && window.ResizeObserver && new window.ResizeObserver(yt.bind(void 0)), (e = t == null ? void 0 : t.current) == null || e.didMount(), Te(), (r =
|
|
521
|
+
return Z.current = nt && window.ResizeObserver && new window.ResizeObserver(yt.bind(void 0)), (e = t == null ? void 0 : t.current) == null || e.didMount(), Te(), (r = ve()) != null && r.body && Z.current && Z.current.observe(ve().body), () => {
|
|
522
522
|
var o;
|
|
523
|
-
(o =
|
|
523
|
+
(o = ve()) != null && o.body && Z.current && Z.current.disconnect();
|
|
524
524
|
};
|
|
525
525
|
}, []);
|
|
526
|
-
const Ge =
|
|
526
|
+
const Ge = ge + "-accessibility-id", Le = ge + "-listbox-id", $e = ge + "-guid", Wt = Ue.toLanguageString(
|
|
527
527
|
at,
|
|
528
528
|
lt[at]
|
|
529
529
|
), {
|
|
530
530
|
style: ie,
|
|
531
531
|
className: qt,
|
|
532
|
-
label:
|
|
532
|
+
label: be,
|
|
533
533
|
dir: Ut,
|
|
534
534
|
virtual: U,
|
|
535
535
|
adaptive: Ln,
|
|
@@ -539,11 +539,11 @@ const kn = "Please select a value from the list!", Me = s.forwardRef((ut, pt) =>
|
|
|
539
539
|
iconClassName: je,
|
|
540
540
|
svgIcon: Gt,
|
|
541
541
|
valueRender: Je
|
|
542
|
-
} = n,
|
|
542
|
+
} = n, ae = n.opened !== void 0 ? n.opened : m.opened, le = k(), Pe = ne(le, n.textField), Qe = !ht() || he().valid, de = t.current, $t = de.vs, ee = K && K.uDropDownList;
|
|
543
543
|
$t.enabled = U !== void 0;
|
|
544
|
-
const Xe = rn(), _ = !!(
|
|
545
|
-
U !== void 0 && (
|
|
546
|
-
const Yt = E(n), { focused: jt } = m, Jt = Yt.findIndex((e) => F(e,
|
|
544
|
+
const Xe = rn(), _ = !!(Ee && Xe && Ee <= Xe.medium && n.adaptive);
|
|
545
|
+
U !== void 0 && (de.vs.skip = U.skip, de.vs.total = U.total, de.vs.pageSize = U.pageSize);
|
|
546
|
+
const Yt = E(n), { focused: jt } = m, Jt = Yt.findIndex((e) => F(e, le, _t)), Ze = /* @__PURE__ */ s.createElement("span", { id: Ge, className: L(P.inputInner({ c: ee })) }, Pe && /* @__PURE__ */ s.createElement("span", { className: L(P.inputText({ c: ee })) }, Pe)), Qt = Je !== void 0 ? Je.call(void 0, Ze, le) : Ze, Re = /* @__PURE__ */ s.createElement(s.Fragment, null, /* @__PURE__ */ s.createElement(
|
|
547
547
|
"span",
|
|
548
548
|
{
|
|
549
549
|
ref: wt,
|
|
@@ -552,38 +552,38 @@ const kn = "Please select a value from the list!", Me = s.forwardRef((ut, pt) =>
|
|
|
552
552
|
c: ee,
|
|
553
553
|
size: O,
|
|
554
554
|
rounded: Ne,
|
|
555
|
-
fillMode:
|
|
555
|
+
fillMode: fe,
|
|
556
556
|
focused: jt,
|
|
557
557
|
disabled: se,
|
|
558
558
|
invalid: !Qe,
|
|
559
559
|
loading: Ye,
|
|
560
|
-
required:
|
|
560
|
+
required: Ie()
|
|
561
561
|
}),
|
|
562
562
|
qt
|
|
563
563
|
),
|
|
564
|
-
style:
|
|
564
|
+
style: be ? { ...ie, width: void 0 } : ie,
|
|
565
565
|
dir: Ut,
|
|
566
|
-
onMouseDown:
|
|
566
|
+
onMouseDown: ae ? (e) => {
|
|
567
567
|
e.target.nodeName !== "INPUT" && (re(t.current.wrapper), e.preventDefault());
|
|
568
568
|
} : void 0,
|
|
569
|
-
onFocus: _ ? (e) =>
|
|
569
|
+
onFocus: _ ? (e) => De(e) : Tt,
|
|
570
570
|
onBlur: zt,
|
|
571
571
|
tabIndex: on(gt, se),
|
|
572
572
|
accessKey: n.accessKey,
|
|
573
573
|
onKeyDown: Oe,
|
|
574
574
|
onKeyPress: Ot,
|
|
575
|
-
onClick: se ? void 0 :
|
|
575
|
+
onClick: se ? void 0 : De,
|
|
576
576
|
role: "combobox",
|
|
577
|
-
"aria-required":
|
|
577
|
+
"aria-required": Ie(),
|
|
578
578
|
"aria-disabled": se || void 0,
|
|
579
579
|
"aria-haspopup": "listbox",
|
|
580
|
-
"aria-expanded":
|
|
581
|
-
"aria-owns":
|
|
582
|
-
"aria-activedescendant":
|
|
580
|
+
"aria-expanded": ae || !1,
|
|
581
|
+
"aria-owns": Le,
|
|
582
|
+
"aria-activedescendant": ae ? "option-" + $e + "-" + (Jt + (U ? U.skip : 0)) : void 0,
|
|
583
583
|
"aria-label": n.ariaLabel || n.label,
|
|
584
584
|
"aria-labelledby": n.ariaLabelledBy,
|
|
585
585
|
"aria-describedby": n.ariaDescribedBy || Ge,
|
|
586
|
-
"aria-controls":
|
|
586
|
+
"aria-controls": ae ? Le : void 0,
|
|
587
587
|
id: n.id,
|
|
588
588
|
title: n.title
|
|
589
589
|
},
|
|
@@ -596,20 +596,20 @@ const kn = "Please select a value from the list!", Me = s.forwardRef((ut, pt) =>
|
|
|
596
596
|
type: "button",
|
|
597
597
|
"aria-label": Wt,
|
|
598
598
|
size: O,
|
|
599
|
-
fillMode:
|
|
599
|
+
fillMode: fe,
|
|
600
600
|
className: L(P.inputButton({ c: ee })),
|
|
601
601
|
iconClass: je,
|
|
602
602
|
svgIcon: je ? void 0 : Gt || pn,
|
|
603
603
|
onMouseDown: (e) => m.focused && e.preventDefault()
|
|
604
604
|
}
|
|
605
605
|
),
|
|
606
|
-
xt(
|
|
606
|
+
xt(le),
|
|
607
607
|
!_ && Ft()
|
|
608
608
|
), _ && Lt());
|
|
609
|
-
return
|
|
609
|
+
return be ? /* @__PURE__ */ s.createElement(
|
|
610
610
|
un,
|
|
611
611
|
{
|
|
612
|
-
label:
|
|
612
|
+
label: be,
|
|
613
613
|
editorValue: Pe,
|
|
614
614
|
editorValid: Qe,
|
|
615
615
|
editorDisabled: n.disabled,
|