@progress/kendo-react-dropdowns 7.5.0-develop.2 → 7.5.0-develop.20

package/ComboBox/ComboBox.mjs

@@ -9,7 +9,7 @@
 import * as h from "react";
 import f from "prop-types";
 import V from "../common/DropDownBase.mjs";
-import { Keys as x, validatePackage as se, svgIconPropType as ie, canUseDOM as L, classNames as E, IconWrap as oe, createPropsContext as ae, withIdHOC as ne, withPropsContext as le, kendoThemeMaps as re } from "@progress/kendo-react-common";
+import { Keys as I, validatePackage as se, svgIconPropType as ie, canUseDOM as L, classNames as E, IconWrap as oe, createPropsContext as ae, withIdHOC as ne, withPropsContext as le, kendoThemeMaps as re } from "@progress/kendo-react-common";
 import { FloatingLabel as de } from "@progress/kendo-react-labels";
 import { getPlainDataDuplicates as pe, areSame as S, getItemValue as C, isPresent as k, getItemIndexByText as R, suggestValue as he, itemIndexStartsWith as A } from "../common/utils.mjs";
 import ce from "../common/SearchBar.mjs";
@@ -24,7 +24,7 @@ import { caretAltDownIcon as be, xIcon as xe } from "@progress/kendo-svg-icons";
 import { comboArrowBtnAriaLabelExpand as H, messages as q, comboArrowBtnAriaLabelCollapse as $ } from "../messages/index.mjs";
 import { provideLocalizationService as G } from "@progress/kendo-react-intl";
 import { ActionSheet as Ie, ActionSheetHeader as ye, ActionSheetContent as ke } from "@progress/kendo-react-layout";
-import { MOBILE_MEDIUM_DEVISE as W, MOBILE_SMALL_DEVISE as U } from "../common/constants.mjs";
+import { MOBILE_MEDIUM_DEVISE as U, MOBILE_SMALL_DEVISE as W } from "../common/constants.mjs";
 import j from "../common/withCustomComponent.mjs";
 const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D = class D extends h.Component {
   constructor(s) {
@@ -63,7 +63,7 @@ const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D
           ref: (o) => this._adaptiveFilterInput = o && o.element,
           onChange: this.handleMobileFilterChange,
           onKeyDown: this.onInputKeyDown,
-          size: this.props.size,
+          size: "large",
           rounded: this.props.rounded,
           fillMode: this.props.fillMode
         }
@@ -101,56 +101,56 @@ const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D
       }
     }, this.onInputKeyDown = (e) => {
       const { data: t = [], skipDisabledItems: a, textField: o, dataItemKey: n, groupField: d } = this.props, l = this.value, r = Math.max(0, t.findIndex((u) => S(u, l, n))), i = e.keyCode, c = this.props.opened !== void 0 ? this.props.opened : this.state.opened, p = this.base.initState();
-      if (p.syntheticEvent = e, !e.altKey && (i === x.up || i === x.down)) {
+      if (p.syntheticEvent = e, !e.altKey && (i === I.up || i === I.down)) {
         if (e.preventDefault(), d !== "" && o)
           if (!this.props.skipDisabledItems && c)
             this.onNavigate(p, i);
           else {
             let u = 0;
-            if (i === x.down || i === x.right) {
-              const m = t.slice(r + 1 < t.length ? r + 1 : r).find((b) => !b.disabled && b[o]);
-              u = m && t.findIndex((b) => b[o] === m[o]);
-            } else if (i === x.up || i === x.left) {
-              let m;
+            if (i === I.down || i === I.right) {
+              const g = t.slice(r + 1 < t.length ? r + 1 : r).find((b) => !b.disabled && b[o]);
+              u = g && t.findIndex((b) => b[o] === g[o]);
+            } else if (i === I.up || i === I.left) {
+              let g;
               if (r === 0)
-                m = t, u = t.findIndex((b) => !b.disabled && b[o]);
+                g = t, u = t.findIndex((b) => !b.disabled && b[o]);
               else {
-                m = t.slice(0, r);
-                let b = m.pop();
+                g = t.slice(0, r);
+                let b = g.pop();
                 for (; b && b.disabled; )
-                  b = m.pop();
+                  b = g.pop();
                 u = b && t.findIndex((w) => w[o] === b[o]);
               }
             }
             if (u !== void 0) {
-              const m = u - r;
-              this.onNavigate(p, i, m);
+              const g = u - r;
+              this.onNavigate(p, i, g);
             } else
-              u === void 0 && t.findIndex((m) => m[o] === l[o]) === t.length - 1 && this.onNavigate(p, i);
+              u === void 0 && t.findIndex((g) => g[o] === l[o]) === t.length - 1 && this.onNavigate(p, i);
           }
         else if (!this.props.skipDisabledItems && c)
           this.onNavigate(p, i);
         else {
           let u = null;
-          if (i === x.down || i === x.right)
-            u = t.slice(r + 1).find((m) => !m.disabled);
-          else if (i === x.up || i === x.left) {
-            const m = t.slice(0, r);
-            for (u = m.pop(); u && u.disabled; )
-              u = m.pop();
+          if (i === I.down || i === I.right)
+            u = t.slice(r + 1).find((g) => !g.disabled);
+          else if (i === I.up || i === I.left) {
+            const g = t.slice(0, r);
+            for (u = g.pop(); u && u.disabled; )
+              u = g.pop();
           }
           if (u) {
-            const m = u.id - r - 1;
-            this.onNavigate(p, i, m);
+            const g = u.id - r - 1;
+            this.onNavigate(p, i, g);
           } else
             this.onNavigate(p, i);
         }
         this.applyState(p);
       }
-      const g = () => {
+      const m = () => {
         e.preventDefault(), this.base.togglePopup(p), this.applyState(p);
-      }, I = this.getFocusedIndex(), v = I === -1, y = !v && this.getCurrentValueDisabledStatus(o, t, I);
-      c ? i === x.pageUp ? this.base.scrollPopupByPageSize(-1) : i === x.pageDown ? this.base.scrollPopupByPageSize(1) : e.altKey && i === x.up ? g() : i === x.enter ? (e.preventDefault(), (o && !v && e.currentTarget.value ? t[I][o] : void 0) ? !a && o && y ? this.clearValueOnEnterOrEsc(e) : y || this.applyValueOnEnter(e.currentTarget.value, p) : this.applyValueOnEnter(e.currentTarget.value, p)) : i === x.esc && (!a && o && y && this.clearValueOnEnterOrEsc(e), this.applyValueOnRejectSuggestions(e.currentTarget.value, p)) : !c && i === x.esc ? this.clearValueOnEnterOrEsc(e) : e.altKey && i === x.down && g();
+      }, x = this.getFocusedIndex(), v = x === -1, y = !v && this.getCurrentValueDisabledStatus(o, t, x);
+      c ? i === I.pageUp ? this.base.scrollPopupByPageSize(-1) : i === I.pageDown ? this.base.scrollPopupByPageSize(1) : e.altKey && i === I.up ? m() : i === I.enter ? (e.preventDefault(), (o && !v && e.currentTarget.value ? t[x][o] : void 0) ? !a && o && y ? this.clearValueOnEnterOrEsc(e) : y || this.applyValueOnEnter(e.currentTarget.value, p) : this.applyValueOnEnter(e.currentTarget.value, p)) : i === I.esc && (!a && o && y && this.clearValueOnEnterOrEsc(e), this.applyValueOnRejectSuggestions(e.currentTarget.value, p)) : !c && i === I.esc ? this.clearValueOnEnterOrEsc(e) : e.altKey && i === I.down && m();
     }, this.inputOnChange = (e) => {
       const t = this.base.initState();
       t.syntheticEvent = e;
@@ -196,7 +196,7 @@ const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D
    * The mobile mode of the ComboBox.
    */
   get mobileMode() {
-    return !!(this.state.windowWidth && this.state.windowWidth <= W && this.props.adaptive);
+    return !!(this.state.windowWidth && this.state.windowWidth <= U && this.props.adaptive);
   }
   /**
    * The value of the ComboBox.
@@ -244,17 +244,17 @@ const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D
   }
   /** @hidden */
   componentDidUpdate(s, e) {
-    var g;
+    var m;
     const { dataItemKey: t, virtual: a, groupField: o = "", data: n = [], textField: d } = this.props, l = s.virtual ? s.virtual.total : 0, r = this.props.opened !== void 0 ? this.props.opened : this.state.opened, i = s.opened !== void 0 ? s.opened : e.opened;
     s.data !== n && this.checkForDuplicatePlainTextRecords();
     const c = !i && r, p = this.value;
-    if (this._valueOnDidUpdate = p, a && a.total !== l)
+    if (this._valueOnDidUpdate = p, this.base.didUpdate(), a && a.total !== l)
       this.base.vs.calcScrollElementHeight(), this.base.vs.reset();
     else {
-      const I = s.value !== void 0 ? s.value : e.value;
+      const x = s.value !== void 0 ? s.value : e.value;
       let v = this.hasDuplicates ? this.navigationIndex || 0 : n.findIndex((u) => S(u, p, t));
-      this.props.groupMode === "modern" && d && p && (v = (g = this.base.getGroupedDataModernMode(n, o)) == null ? void 0 : g.map((u) => u[d]).indexOf(p[d]));
-      const y = !S(I, p, t);
+      this.props.groupMode === "modern" && d && p && (v = (m = this.base.getGroupedDataModernMode(n, o)) == null ? void 0 : m.map((u) => u[d]).indexOf(p[d]));
+      const y = !S(x, p, t);
       c && a ? this.base.scrollToVirtualItem(a, v) : c && !a ? (this.onPopupOpened(), n && n.length !== 0 && this.base.resetGroupStickyHeader(n[0][o], this), this.base.scrollToItem(v)) : (this.hasDuplicates || r && i && p && y) && this.base.scrollToItem(v);
     }
     c && this._input && this._input.focus(), this.setValidity();
@@ -285,22 +285,22 @@ const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D
       style: i,
       loading: c,
       iconClassName: p,
-      virtual: g,
-      size: I,
+      virtual: m,
+      size: x,
       rounded: v,
       fillMode: y,
       opened: u = this.state.opened,
-      placeholder: m,
+      placeholder: g,
       svgIcon: b
     } = this.props, w = !this.validityStyles || this.validity.valid, T = this.props.filter !== void 0 ? this.props.filter : this.state.text, Y = C(this.value, d), O = k(T) ? T : Y, J = o && (!!O || k(this.value)), M = this.base.vs, _ = this.props.id || this._inputId, N = this.mobileMode;
-    M.enabled = g !== void 0, g !== void 0 && (M.skip = g.skip, M.total = g.total, M.pageSize = g.pageSize);
+    M.enabled = m !== void 0, m !== void 0 && (M.skip = m.skip, M.total = m.total, M.pageSize = m.pageSize);
     const [Q, X] = j(this.props.prefix || h.Fragment), [Z, ee] = j(this.props.suffix || h.Fragment), P = /* @__PURE__ */ h.createElement(h.Fragment, null, /* @__PURE__ */ h.createElement(
       "span",
       {
         className: E(
           "k-combobox k-input",
           {
-            [`k-input-${F[I] || I}`]: I,
+            [`k-input-${F[x] || x}`]: x,
             [`k-rounded-${Ce[v] || v}`]: v,
             [`k-input-${y}`]: y,
             "k-invalid": !w,
@@ -315,7 +315,7 @@ const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D
         dir: t
       },
       this.props.prefix && /* @__PURE__ */ h.createElement(Q, { ...X }),
-      this.renderSearchBar(O || "", _, m),
+      this.renderSearchBar(O || "", _, g),
       J && !c && /* @__PURE__ */ h.createElement(fe, { onClick: this.clearButtonClick, key: "clearbutton" }),
       c && /* @__PURE__ */ h.createElement(oe, { className: "k-input-loading-icon", name: "loading", key: "loading" }),
       this.props.suffix && /* @__PURE__ */ h.createElement(Z, { ...ee }),
@@ -328,7 +328,7 @@ const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D
           icon: p ? void 0 : "caret-alt-down",
           svgIcon: b || be,
           iconClass: p,
-          size: I,
+          size: x,
           fillMode: y,
           rounded: null,
           themeColor: "base",
@@ -402,19 +402,19 @@ const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D
     return r !== -1 ? this.handleItemSelect(r + l, 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, { header: e, footer: t, size: a, data: o = [], groupField: n, groupMode: d, list: l, virtual: r, adaptiveTitle: i, groupStickyHeaderItemRender: c } = this.props, p = this.props.opened !== void 0 ? this.props.opened : this.state.opened;
-    let { group: g } = this.state;
-    g === void 0 && n !== void 0 && (g = C(o[0], n));
-    const I = {
+    const { windowWidth: s = 0 } = this.state, { header: e, footer: t, size: a, data: o = [], groupField: n, groupMode: d, list: l, virtual: r, adaptiveTitle: i, groupStickyHeaderItemRender: c } = this.props, p = this.props.opened !== void 0 ? this.props.opened : this.state.opened, m = this.base.getAdaptiveAnimation();
+    let { group: x } = this.state;
+    x === void 0 && n !== void 0 && (x = C(o[0], n));
+    const v = {
       navigatable: !1,
       navigatableElements: [],
       expand: p,
-      animation: !0,
-      onClose: (v) => this.toggleBtnClick(v),
-      animationStyles: s <= U ? { top: 0, width: "100%", height: "100%" } : void 0,
-      className: s <= U ? "k-adaptive-actionsheet k-actionsheet-fullscreen" : "k-adaptive-actionsheet k-actionsheet-bottom"
+      animation: m,
+      onClose: (y) => this.toggleBtnClick(y),
+      animationStyles: s <= W ? { top: 0, width: "100%", height: "100%" } : void 0,
+      className: s <= W ? "k-adaptive-actionsheet k-actionsheet-fullscreen" : "k-adaptive-actionsheet k-actionsheet-bottom k-actionsheet"
     };
-    return /* @__PURE__ */ h.createElement(Ie, { ...I }, /* @__PURE__ */ h.createElement(ye, { className: "k-text-center" }, /* @__PURE__ */ h.createElement("div", { className: "k-actionsheet-titlebar-group k-hbox" }, /* @__PURE__ */ h.createElement("div", { className: "k-actionsheet-title" }, /* @__PURE__ */ h.createElement("div", null, i)), /* @__PURE__ */ h.createElement("div", { className: "k-actionsheet-actions" }, /* @__PURE__ */ h.createElement(
+    return /* @__PURE__ */ h.createElement(Ie, { ...v }, /* @__PURE__ */ h.createElement(ye, null, /* @__PURE__ */ h.createElement("div", { className: "k-actionsheet-titlebar-group k-hbox" }, /* @__PURE__ */ h.createElement("div", { className: "k-actionsheet-title" }, /* @__PURE__ */ h.createElement("div", { className: "k-text-center" }, i), /* @__PURE__ */ h.createElement("div", { className: "k-actionsheet-subtitle k-text-center" })), /* @__PURE__ */ h.createElement("div", { className: "k-actionsheet-actions" }, /* @__PURE__ */ h.createElement(
       z,
       {
         tabIndex: 0,
@@ -422,6 +422,8 @@ const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D
         "aria-disabled": "false",
         type: "button",
         fillMode: "flat",
+        themeColor: "base",
+        size: "large",
         onClick: this.toggleBtnClick,
         icon: "x",
         svgIcon: xe
@@ -434,21 +436,21 @@ const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D
         "k-data-table": l,
         [`k-table-${F[a] || a}`]: l && a
       }
-    ) }, e && /* @__PURE__ */ h.createElement("div", { className: "k-table-header" }, e), !l && g && o.length !== 0 && /* @__PURE__ */ h.createElement(K, { group: g, groupMode: d, render: c }), this.renderList(), t && /* @__PURE__ */ h.createElement("div", { className: "k-list-footer" }, t)))));
+    ) }, e && /* @__PURE__ */ h.createElement("div", { className: "k-table-header" }, e), !l && x && o.length !== 0 && /* @__PURE__ */ h.createElement(K, { group: x, groupMode: d, render: c }), this.renderList(), t && /* @__PURE__ */ h.createElement("div", { className: "k-list-footer" }, t)))));
   }
   renderListContainer() {
-    const s = this.base, { dir: e, header: t, footer: a, data: o = [], groupField: n, groupMode: d, size: l, list: r, virtual: i, groupStickyHeaderItemRender: c } = this.props, p = this.props.opened !== void 0 ? this.props.opened : this.state.opened, g = s.getPopupSettings(), I = g.width !== void 0 ? g.width : s.popupWidth;
+    const s = this.base, { dir: e, header: t, footer: a, data: o = [], groupField: n, groupMode: d, size: l, list: r, virtual: i, groupStickyHeaderItemRender: c } = this.props, p = this.props.opened !== void 0 ? this.props.opened : this.state.opened, m = s.getPopupSettings(), x = m.width !== void 0 ? m.width : s.popupWidth;
     let { group: v } = this.state;
     return v === void 0 && n !== void 0 && (v = C(o[0], n)), /* @__PURE__ */ h.createElement(
       ue,
       {
-        width: I,
+        width: x,
         popupSettings: {
-          ...g,
-          anchor: g.anchor || this.element,
+          ...m,
+          anchor: m.anchor || this.element,
           show: p,
           popupClass: E(
-            g.popupClass,
+            m.popupClass,
             "k-list-container",
             "k-combobox-popup"
           )
@@ -481,15 +483,15 @@ const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D
       groupHeaderItemRender: n,
       data: d = [],
       virtual: l = { skip: 0, total: void 0 }
-    } = this.props, r = s.getPopupSettings(), i = s.vs, c = l.skip, p = this.props.opened !== void 0 ? this.props.opened : this.state.opened, g = `translateY(${i.translate}px)`, I = p ? this.getFocusedIndex(this.hasDuplicates) : void 0, v = this.props.filter !== void 0 ? this.props.filter : this.state.text, y = C(this.value, e), u = k(v) && v !== y ? null : this.value, m = this.props.list || ge;
+    } = this.props, r = s.getPopupSettings(), i = s.vs, c = l.skip, p = this.props.opened !== void 0 ? this.props.opened : this.state.opened, m = `translateY(${i.translate}px)`, x = p ? this.getFocusedIndex(this.hasDuplicates) : void 0, v = this.props.filter !== void 0 ? this.props.filter : this.state.text, y = C(this.value, e), u = k(v) && v !== y ? null : this.value, g = this.props.list || ge;
     return /* @__PURE__ */ h.createElement(
-      m,
+      g,
       {
         id: s.listBoxId,
         virtual: !!l,
         show: p,
         data: d,
-        focusedIndex: I,
+        focusedIndex: x,
         value: u,
         textField: e,
         valueField: t,
@@ -501,14 +503,14 @@ const Se = "Please enter a valid value!", { sizeMap: F, roundedMap: Ce } = re, D
         listRef: (b) => {
           i.list = this.base.list = b, this.itemHeight = 0;
         },
-        wrapperStyle: this.state.windowWidth && this.state.windowWidth > W ? { maxHeight: r.height } : {},
+        wrapperStyle: this.state.windowWidth && this.state.windowWidth > U ? { maxHeight: r.height } : {},
         wrapperCssClass: E(
           "k-list-content",
           {
             "k-list-scroller": !l
           }
         ),
-        listStyle: i.enabled ? { transform: g } : void 0,
+        listStyle: i.enabled ? { transform: m } : void 0,
         key: "listkey",
         skip: c,
         onClick: this.handleItemClick,

package/DropDownList/DropDownList.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Y=require("react"),w=require("prop-types"),d=require("@progress/kendo-react-common"),J=require("@progress/kendo-react-labels"),B=require("@progress/kendo-svg-icons"),Q=require("../common/ListContainer.js"),X=require("../common/ListFilter.js"),H=require("../common/GroupStickyHeader.js"),Z=require("../common/ListDefaultItem.js"),ee=require("../common/List.js"),R=require("../common/DropDownBase.js"),I=require("../common/utils.js"),te=require("../package-metadata.js"),W=require("@progress/kendo-react-buttons"),se=require("@progress/kendo-react-intl"),T=require("../messages/index.js"),F=require("../common/constants.js"),q=require("@progress/kendo-react-layout");function ie(_){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(_){for(const e in _)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(_,e);Object.defineProperty(s,e,t.get?t:{enumerable:!0,get:()=>_[e]})}}return s.default=_,Object.freeze(s)}const c=ie(Y),ae="Please select a value from the list!",{sizeMap:z,roundedMap:ne}=d.kendoThemeMaps,E=class E extends c.Component{constructor(s){super(s),this.state={},this._element=null,this.base=new R(this),this.searchState={word:"",last:""},this._select=null,this._skipFocusEvent=!1,this._filterInput=null,this._navigated=!1,this._lastKeypressIsFilter=!1,this.itemHeight=0,this.focus=()=>{this.base.wrapper&&this.base.wrapper.focus()},this.handleItemSelect=(e,t)=>{const{data:a=[],virtual:l,dataItemKey:n,defaultItem:o}=this.props,u=l?l.skip:0,p=e===-1&&o!==void 0?o:a[e-u],h=!I.areSame(p,this.value,n);this.triggerOnChange(p,t),h&&this.base.triggerPageChangeCornerItems(p,t)},this.componentRef=e=>{this._element=e,this.base.wrapper=e},this.dummySelect=e=>c.createElement("select",{name:this.props.name,ref:t=>{this._select=t},tabIndex:-1,"aria-hidden":!0,title:this.props.label,style:{opacity:0,width:1,border:0,zIndex:-1,position:"absolute",left:"50%"}},c.createElement("option",{value:this.props.valueMap?this.props.valueMap.call(void 0,e):e})),this.renderListContainer=()=>{const{header:e,footer:t,dir:a,data:l=[],size:n,groupField:o,groupStickyHeaderItemRender:u,list:p}=this.props,h=this.base,i=h.getPopupSettings(),v=this.props.opened!==void 0?this.props.opened:this.state.opened,b=i.width!==void 0?i.width:h.popupWidth,k={dir:a!==void 0?a:h.dirCalculated,width:b,popupSettings:{...i,popupClass:d.classNames(i.popupClass,"k-list-container","k-dropdownlist-popup"),anchor:i.anchor||this.element,show:v,onOpen:this.onPopupOpened,onClose:this.onPopupClosed},itemsCount:[l.length]};let{group:g}=this.state;return g===void 0&&o!==void 0&&(g=I.getItemValue(l[0],o)),c.createElement(Q,{...k},this.renderListFilter(),e&&c.createElement("div",{className:"k-list-header"},e),c.createElement("div",{className:d.classNames("k-list",{[`k-list-${z[n]||n}`]:n,"k-virtual-list":this.base.vs.enabled})},this.renderDefaultItem(),!p&&g&&l.length!==0&&c.createElement(H,{group:g,groupMode:"modern",render:u}),this.renderList()),t&&c.createElement("div",{className:"k-list-footer"},t))},this.renderList=()=>{const{data:e=[],textField:t,dataItemKey:a,virtual:l={skip:0,total:void 0},groupHeaderItemRender:n,listNoDataRender:o,itemRender:u}=this.props,p=this.base.vs,h=l.skip,i=this.props.opened!==void 0?this.props.opened:this.state.opened,v=this.base.getPopupSettings(),b=`translateY(${p.translate}px)`;return c.createElement(ee,{id:this._listboxId,show:i,data:e.slice(),focusedIndex:this.getFocusedIndex(),value:this.value,textField:t,valueField:a,optionsGuid:this._guid,groupField:this.props.groupField,groupMode:"modern",listRef:k=>p.list=this.base.list=k,wrapperStyle:{maxHeight:v.height},wrapperCssClass:"k-list-content",listStyle:p.enabled?{transform:b}:void 0,key:"listkey",skip:h,onClick:this.handleItemClick,itemRender:u,groupHeaderItemRender:n,noDataRender:o,onScroll:this.onScroll,wrapperRef:p.scrollerRef,scroller:this.base.renderScrollElement(),ariaSetSize:l.total})},this.onScroll=e=>{const{vs:t,list:a}=this.base;t.scrollHandler(e);const{groupField:l}=this.props;let{data:n=[]}=this.props;if(!(!l||!n.length)&&l){const o=this.itemHeight=this.itemHeight||(t.enabled?t.itemHeight:a?a.children[0].offsetHeight:0),p=e.target.scrollTop-t.skip*o;n=this.base.getGroupedDataModernMode(n,l);let h=n[0][l];for(let i=1;i<n.length&&!(o*i>p);i++)n[i]&&n[i][l]&&(h=n[i][l]);h!==this.state.group&&this.setState({group:h})}},this.renderListFilter=()=>{const e=this.props.filter!==void 0?this.props.filter:this.state.text;return this.props.filterable&&c.createElement(X,{value:e,ref:t=>this._filterInput=t&&t.element,onChange:this.handleListFilterChange,onKeyDown:this.handleKeyDown,size:this.props.size,rounded:this.props.rounded,fillMode:this.props.fillMode})},this.renderDefaultItem=()=>{const{textField:e,defaultItem:t,dataItemKey:a}=this.props;return t!==void 0&&c.createElement(Z,{defaultItem:t,textField:e,selected:I.areSame(this.value,t,a),key:"defaultitemkey",onClick:this.handleDefaultItemClick})},this.search=e=>{clearTimeout(this._typingTimeout),this.props.filterable||(this._typingTimeout=window.setTimeout(()=>this.searchState.word="",this.props.delay),this.selectNext(e))},this.selectNext=e=>{const{data:t=[],dataItemKey:a}=this.props;let l=t.map((C,N)=>({item:C,itemIndex:N}));const n=this.searchState.word,o=this.searchState.last,u=I.sameCharsOnly(n,o);let p=l.length,h=Math.max(0,t.findIndex(C=>I.areSame(C,this.value,a))),i;this.props.defaultItem&&(i={item:this.props.defaultItem,itemIndex:-1},p+=1,h+=1),h+=u?1:0,l=I.shuffleData(l,h,i);let v,b,k,g=0;const{textField:r,ignoreCase:x}=this.props;for(;g<p;g++)if(v=I.getItemValue(l[g].item,r),b=u&&I.matchText(v,o,x),k=I.matchText(v,n,x),b||k){g=l[g].itemIndex;break}if(g!==p){const C=this.base.initState();C.syntheticEvent=e,this.handleItemSelect(g,C),this.applyState(C),this._valueDuringOnChange=void 0}},this.handleKeyDown=e=>{e&&e.target instanceof Element&&e.target.nodeName==="INPUT"&&e.stopPropagation&&e.stopPropagation();const{data:t=[],filterable:a,disabled:l,defaultItem:n,leftRightKeysNavigation:o=!0,virtual:u={skip:0,total:0,pageSize:0},dataItemKey:p,groupField:h="",textField:i,skipDisabledItems:v=!0}=this.props,b=this.value,k=t.findIndex(y=>I.areSame(y,b,p)),g=this.props.opened!==void 0?this.props.opened:this.state.opened,r=e.keyCode,x=r===d.Keys.home||r===d.Keys.end,C=r===d.Keys.up||r===d.Keys.down,N=!g&&(e.altKey&&r===d.Keys.down||r===d.Keys.enter||r===d.Keys.space),L=g&&(e.altKey&&r===d.Keys.up||r===d.Keys.esc),D=o&&(r===d.Keys.left||r===d.Keys.right),P=C||D&&!a||x,S=this.base.initState();if(S.syntheticEvent=e,!l){if(x&&this.base.vs.enabled)r===d.Keys.home?u.skip!==0?(this.base.triggerOnPageChange(S,0,u.pageSize),this._navigated=!0):this.triggerOnChange(t[0],S):u.skip<u.total-u.pageSize?(this.base.triggerOnPageChange(S,u.total-u.pageSize,u.pageSize),this._navigated=!0):this.triggerOnChange(t[t.length-1],S);else if(g&&r===d.Keys.pageUp)this.base.scrollPopupByPageSize(-1);else if(g&&r===d.Keys.pageDown)this.base.scrollPopupByPageSize(1);else if(g&&r===d.Keys.enter){const y=this.getFocusedIndex();this.haveFocusedItemAndDataNotEmpty(t,y)?(this.triggerOnChange(null,S),this.applyState(S)):this.handleItemSelect(y,S),this.base.togglePopup(S),e.preventDefault()}else if(N||L)L&&this.resetValueIfDisabledItem(),this.base.togglePopup(S),e.preventDefault();else if(P){if(this._lastKeypressIsFilter=!1,h!==""&&i)if(!v&&g)this.onNavigate(S,r);else{let y;if(r===d.Keys.down||r===d.Keys.right){const f=t.slice(k+1).find(m=>!m.disabled&&m[i]);y=f&&t.findIndex(m=>m[i]===f[i])}else if(r===d.Keys.up||r===d.Keys.left){let f;if(k===0&&n)y=-1;else if(k===-1)f=t,y=t.findIndex(m=>!m.disabled&&m[i]);else{f=t.slice(0,k);let m=f.pop();for(;m&&m.disabled;)m=f.pop();y=m&&t.findIndex(M=>M[i]===m[i])}}if(y!==void 0){const f=y-k;this.onNavigate(S,r,f)}else y===void 0&&t.findIndex(f=>f[i]===b[i])===t.length-1&&this.onNavigate(S,r)}else if(!v&&g||x)this.onNavigate(S,r);else if(i){let y;if(r===d.Keys.down||r===d.Keys.right){const f=t.slice(k+1).find(m=>!m.disabled&&m[i]);y=f&&t.findIndex(m=>m[i]===f[i])}else if(r===d.Keys.up||r===d.Keys.left){let f;if(k===0&&n)y=-1;else if(k===-1)f=t,y=t.find(m=>!m.disabled&&m[i]);else{f=t.slice(0,k);let m=f.pop();for(;m&&m.disabled;)m=f.pop();y=m&&t.findIndex(M=>M[i]===m[i])}}if(y!==void 0){const f=y-k;this.onNavigate(S,r,f)}else y===void 0&&t.findIndex(f=>f[i]===b[i])===t.length-1&&this.onNavigate(S,r)}else this.onNavigate(S,r);e.preventDefault()}this.applyState(S)}},this.handleItemClick=(e,t)=>{this.base.handleItemClick(e,t),this._valueDuringOnChange=void 0},this.handleFocus=e=>{this._skipFocusEvent||this.base.handleFocus(e)},this.handleBlur=e=>{if(this._skipFocusEvent||!this.state.focused)return;const t=this.props.opened!==void 0?this.props.opened:this.state.opened,{adaptive:a}=this.props,{windowWidth:l=0}=this.state,n=l<=F.MOBILE_MEDIUM_DEVISE&&a,o=this.base.initState();o.syntheticEvent=e,o.data.focused=!1,o.events.push({type:"onBlur"}),t&&this.resetValueIfDisabledItem(),t&&!n&&this.base.togglePopup(o),this.applyState(o)},this.handleDefaultItemClick=e=>{const t=this.base.initState();t.syntheticEvent=e,this.base.togglePopup(t),this.triggerOnChange(this.props.defaultItem,t),this.applyState(t)},this.handleWrapperClick=e=>{if(e.isPropagationStopped())return;const t=this.base.initState();t.syntheticEvent=e,this.state.focused||(t.data.focused=!0),this.resetValueIfDisabledItem(),this.base.togglePopup(t),this.applyState(t)},this.handleKeyPress=e=>{if(this.props.filterable||e.which===0||e.keyCode===d.Keys.enter)return;let t=String.fromCharCode(e.charCode||e.keyCode);this.props.ignoreCase&&(t=t.toLowerCase()),t===" "&&e.preventDefault(),this.searchState={word:this.searchState.word+t,last:this.searchState.last+t},this.search(e)},this.handleListFilterChange=e=>{const t=this.base.initState();t.syntheticEvent=e.syntheticEvent,this.props.filter===void 0&&(t.data.text=e.target.value),this.base.filterChanged(e.target.value,t),this._lastKeypressIsFilter=!0,this.applyState(t),this.setState({group:void 0})},this.onPopupOpened=()=>{this._filterInput&&this.focusElement(this._filterInput),this.props.adaptive&&setTimeout(()=>{this._filterInput&&this.focusElement(this._filterInput)},300)},this.onPopupClosed=()=>{this.state.focused&&window.setTimeout(()=>{this.state.focused&&this.base.wrapper&&this.focusElement(this.base.wrapper)})},this.setValidity=()=>{this._select&&this._select.setCustomValidity&&this._select.setCustomValidity(this.validity.valid?"":this.props.validationMessage||ae)},d.validatePackage(te.packageMetadata)}get _inputId(){return this.props.id+"-accessibility-id"}get _listboxId(){return this.props.id+"-listbox-id"}get _guid(){return this.props.id+"-guid"}get document(){if(d.canUseDOM)return this.element&&this.element.ownerDocument||document}get element(){return this._element}get value(){let s;return this._valueDuringOnChange!==void 0?s=this._valueDuringOnChange:this.props.value!==void 0?s=this.props.value:this.state.value!==void 0?s=this.state.value:this.props.defaultValue!==void 0&&(s=this.props.defaultValue),!I.isPresent(s)&&this.props.defaultItem!==void 0&&(s=this.props.defaultItem),s}get index(){const{data:s=[],dataItemKey:e}=this.props,t=this.value;return s.findIndex(a=>I.areSame(a,t,e))}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:E.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:E.defaultProps.required}componentDidUpdate(s,e){var v;const{dataItemKey:t,virtual:a,groupField:l="",textField:n}=this.props,{data:o=[]}=this.props,u=s.virtual?s.virtual.total:0,p=this.props.opened!==void 0?this.props.opened:this.state.opened,h=s.opened!==void 0?s.opened:e.opened,i=!h&&p;if(this.base.getPopupSettings().animate||i&&this.onPopupOpened(),a&&a.total!==u)this.base.vs.calcScrollElementHeight(),this.base.vs.reset();else{const b=this.value,k=s.value!==void 0?s.value:e.value;let g=o.findIndex(x=>I.areSame(x,b,t));l!==""&&b&&n&&(g=(v=this.base.getGroupedDataModernMode(o,l))==null?void 0:v.map(x=>x[n]).indexOf(b[n]));const r=!I.areSame(k,b,t);i&&a?this.base.scrollToVirtualItem(a,g):i&&!a?(this.onPopupOpened(),o&&o.length!==0&&this.base.resetGroupStickyHeader(o[0][l],this),this.base.scrollToItem(g)):p&&h&&b&&r&&!this._navigated?this.base.scrollToItem(g):p&&h&&this._navigated&&(this._navigated&&a&&a.skip===0?this.base.vs.reset():this._navigated&&a&&a.skip===a.total-a.pageSize&&this.base.vs.scrollToEnd())}this._navigated=!1,this.setValidity()}componentDidMount(){var s;this.observerResize=d.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.base.didMount(),this.setValidity(),(s=this.document)!=null&&s.body&&this.observerResize&&this.observerResize.observe(this.document.body)}componentWillUnmount(){var s;(s=this.document)!=null&&s.body&&this.observerResize&&this.observerResize.disconnect()}render(){const s=se.provideLocalizationService(this).toLanguageString(T.dropDownListArrowBtnAriaLabel,T.messages[T.dropDownListArrowBtnAriaLabel]),{style:e,className:t,label:a,dir:l,virtual:n,size:o,rounded:u,fillMode:p,adaptive:h}=this.props,{windowWidth:i=0}=this.state,v=this.props.opened!==void 0?this.props.opened:this.state.opened,b=this.value,k=I.getItemValue(b,this.props.textField),g=!this.validityStyles||this.validity.valid,r=this.base,x=r.vs,C=i<=F.MOBILE_MEDIUM_DEVISE&&h;x.enabled=n!==void 0,n!==void 0&&(r.vs.skip=n.skip,r.vs.total=n.total,r.vs.pageSize=n.pageSize);const{dataItemKey:N,data:L=[],disabled:D,tabIndex:P,loading:S,iconClassName:y,svgIcon:f,valueRender:m}=this.props,{focused:M}=this.state,$=L.findIndex(K=>I.areSame(K,b,N)),V=c.createElement("span",{id:this._inputId,className:"k-input-inner"},c.createElement("span",{className:"k-input-value-text"},k)),j=m!==void 0?m.call(void 0,V,b):V,A=c.createElement(c.Fragment,null,c.createElement("span",{ref:this.componentRef,className:d.classNames("k-dropdownlist k-picker",t,{[`k-picker-${z[o]||o}`]:o,[`k-rounded-${ne[u]||u}`]:u,[`k-picker-${p}`]:p,"k-focus":M,"k-disabled":D,"k-invalid":!g,"k-loading":S,"k-required":this.required}),style:a?{...e,width:void 0}:e,dir:l,onMouseDown:v?K=>{K.target.nodeName!=="INPUT"&&(this.focusElement(this.base.wrapper),K.preventDefault())}:void 0,onFocus:this.handleFocus,onBlur:this.handleBlur,tabIndex:d.getTabIndex(P,D),accessKey:this.props.accessKey,onKeyDown:this.handleKeyDown,onKeyPress:this.handleKeyPress,onClick:D?void 0:this.handleWrapperClick,role:"combobox","aria-required":this.required,"aria-disabled":D||void 0,"aria-haspopup":"listbox","aria-expanded":v||!1,"aria-owns":this._listboxId,"aria-activedescendant":v?"option-"+this._guid+"-"+($+(n?n.skip:0)):void 0,"aria-label":this.props.ariaLabel||this.props.label,"aria-labelledby":this.props.ariaLabelledBy,"aria-describedby":this.props.ariaDescribedBy||this._inputId,id:this.props.id,title:this.props.title},j,S&&c.createElement(d.IconWrap,{className:"k-input-loading-icon",name:"loading"}),c.createElement(W.Button,{tabIndex:-1,type:"button","aria-label":s,"aria-hidden":!0,size:o,fillMode:p,iconClass:y,className:"k-input-button",rounded:null,themeColor:"base",icon:y?void 0:"caret-alt-down",svgIcon:f||B.caretAltDownIcon,onMouseDown:K=>this.state.focused&&K.preventDefault()}),this.dummySelect(b),!C&&this.renderListContainer()),C&&this.renderAdaptiveListContainer());return a?c.createElement(J.FloatingLabel,{label:a,editorValue:k,editorValid:g,editorDisabled:this.props.disabled,style:{width:e?e.width:void 0},children:A}):A}onNavigate(s,e,t){const{data:a=[],defaultItem:l,dataItemKey:n,virtual:o={skip:0,total:0,pageSize:0}}=this.props,u=this.base.vs,p=this.value,h=a.findIndex(v=>I.areSame(v,p,n)),i=this.base.navigation.navigate({current:o.skip+h,max:(u.enabled?o.total:a.length)-1,min:l!==void 0?-1:0,keyCode:e,skipItems:t||void 0});i!==void 0&&this.handleItemSelect(i,s),this.applyState(s)}renderAdaptiveListContainer(){const{windowWidth:s=0}=this.state,{header:e,footer:t,size:a,adaptiveTitle:l,groupField:n,groupStickyHeaderItemRender:o,list:u,data:p=[]}=this.props,h=this.props.opened!==void 0?this.props.opened:this.state.opened,i={navigatable:!1,navigatableElements:[],expand:h,animation:!0,onClose:b=>this.handleWrapperClick(b),animationStyles:s<=F.MOBILE_SMALL_DEVISE?{top:0,width:"100%",height:"100%"}:void 0,className:s<=F.MOBILE_SMALL_DEVISE?"k-adaptive-actionsheet k-actionsheet-fullscreen":"k-adaptive-actionsheet k-actionsheet-bottom"};let{group:v}=this.state;return v===void 0&&n!==void 0&&(v=I.getItemValue(p[0],n)),c.createElement(q.ActionSheet,{...i},c.createElement(q.ActionSheetHeader,{className:"k-text-center"},c.createElement("div",{className:"k-actionsheet-titlebar-group k-hbox"},c.createElement("div",{className:"k-actionsheet-title"},c.createElement("div",null,l)),c.createElement("div",{className:"k-actionsheet-actions"},c.createElement(W.Button,{tabIndex:0,"aria-label":"Cancel","aria-disabled":"false",type:"button",fillMode:"flat",onClick:this.handleWrapperClick,icon:"x",svgIcon:B.xIcon}))),c.createElement("div",{className:"k-actionsheet-titlebar-group k-actionsheet-filter"},this.renderListFilter())),c.createElement(q.ActionSheetContent,{className:"!k-overflow-hidden"},e&&c.createElement("div",{className:"k-list-header"},e),c.createElement("div",{className:d.classNames("k-list",{[`k-list-${z[a]||a}`]:a,"k-virtual-list":this.base.vs.enabled})},this.renderDefaultItem(),!u&&v&&p.length!==0&&c.createElement(H,{group:v,groupMode:"modern",render:o}),this.renderList()),t&&c.createElement("div",{className:"k-list-footer"},t)))}getFocusedIndex(){const s=this.value,{data:e=[],textField:t,dataItemKey:a,virtual:l={skip:0},focusedItemIndex:n=I.itemIndexStartsWith,filterable:o,skipDisabledItems:u=!0}=this.props,p=this.props.filter?this.props.filter:this.state.text;return u&&t&&!p&&!s?e.findIndex(h=>!h.disabled&&h[t]):I.isPresent(s)&&p===void 0||o&&p===""?e.findIndex(h=>I.areSame(h,s,a)):p?this._lastKeypressIsFilter?n(e,p,t):e.findIndex(h=>I.areSame(h,s,a)):l.skip===0?0:-1}focusElement(s){this._skipFocusEvent=!0,s.focus(),window.setTimeout(()=>this._skipFocusEvent=!1,30)}triggerOnChange(s,e){I.areSame(this.value,s,this.props.dataItemKey)||(this.props.value===void 0&&(e.data.value=s),this._valueDuringOnChange=s,e.events.push({type:"onChange"}))}applyState(s){this.base.applyState(s),this._valueDuringOnChange=void 0}calculateMedia(s){for(const e of s)this.setState({windowWidth:e.target.clientWidth})}resetValueIfDisabledItem(){const{data:s=[]}=this.props,e=this.base.initState(),t=this.getFocusedIndex();this.haveFocusedItemAndDataNotEmpty(s,t)&&(this.triggerOnChange(null,e),this.applyState(e))}haveFocusedItemAndDataNotEmpty(s,e){return e!==void 0&&e!==-1&&s&&s.length>0&&s[e].disabled}};E.displayName="DropDownList",E.propTypes={delay:w.number,ignoreCase:w.bool,iconClassName:w.string,svgIcon:d.svgIconPropType,defaultItem:w.any,valueRender:w.func,valueMap:w.func,validationMessage:w.string,required:w.bool,id:w.string,ariaLabelledBy:w.string,ariaDescribedBy:w.string,ariaLabel:w.string,leftRightKeysNavigation:w.bool,title:w.string,groupField:w.string,list:w.any,skipDisabledItems:w.bool,...R.propTypes},E.defaultProps={delay:500,tabIndex:0,ignoreCase:!0,...R.defaultProps,required:!1,size:"medium",rounded:"medium",fillMode:"solid",groupMode:"modern"};let O=E;const U=d.createPropsContext(),G=d.withIdHOC(d.withPropsContext(U,O));G.displayName="KendoReactDropDownList";exports.DropDownList=G;exports.DropDownListPropsContext=U;exports.DropDownListWithoutContext=O;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Y=require("react"),w=require("prop-types"),d=require("@progress/kendo-react-common"),J=require("@progress/kendo-react-labels"),B=require("@progress/kendo-svg-icons"),Q=require("../common/ListContainer.js"),X=require("../common/ListFilter.js"),H=require("../common/GroupStickyHeader.js"),Z=require("../common/ListDefaultItem.js"),ee=require("../common/List.js"),R=require("../common/DropDownBase.js"),k=require("../common/utils.js"),te=require("../package-metadata.js"),W=require("@progress/kendo-react-buttons"),se=require("@progress/kendo-react-intl"),T=require("../messages/index.js"),F=require("../common/constants.js"),q=require("@progress/kendo-react-layout");function ie(_){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(_){for(const e in _)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(_,e);Object.defineProperty(s,e,t.get?t:{enumerable:!0,get:()=>_[e]})}}return s.default=_,Object.freeze(s)}const c=ie(Y),ae="Please select a value from the list!",{sizeMap:z,roundedMap:ne}=d.kendoThemeMaps,E=class E extends c.Component{constructor(s){super(s),this.state={},this._element=null,this.base=new R(this),this.searchState={word:"",last:""},this._select=null,this._skipFocusEvent=!1,this._filterInput=null,this._navigated=!1,this._lastKeypressIsFilter=!1,this.itemHeight=0,this.focus=()=>{this.base.wrapper&&this.base.wrapper.focus()},this.handleItemSelect=(e,t)=>{const{data:a=[],virtual:l,dataItemKey:n,defaultItem:o}=this.props,u=l?l.skip:0,p=e===-1&&o!==void 0?o:a[e-u],h=!k.areSame(p,this.value,n);this.triggerOnChange(p,t),h&&this.base.triggerPageChangeCornerItems(p,t)},this.componentRef=e=>{this._element=e,this.base.wrapper=e},this.dummySelect=e=>c.createElement("select",{name:this.props.name,ref:t=>{this._select=t},tabIndex:-1,"aria-hidden":!0,title:this.props.label,style:{opacity:0,width:1,border:0,zIndex:-1,position:"absolute",left:"50%"}},c.createElement("option",{value:this.props.valueMap?this.props.valueMap.call(void 0,e):e})),this.renderListContainer=()=>{const{header:e,footer:t,dir:a,data:l=[],size:n,groupField:o,groupStickyHeaderItemRender:u,list:p}=this.props,h=this.base,i=h.getPopupSettings(),v=this.props.opened!==void 0?this.props.opened:this.state.opened,b=i.width!==void 0?i.width:h.popupWidth,y={dir:a!==void 0?a:h.dirCalculated,width:b,popupSettings:{...i,popupClass:d.classNames(i.popupClass,"k-list-container","k-dropdownlist-popup"),anchor:i.anchor||this.element,show:v,onOpen:this.onPopupOpened,onClose:this.onPopupClosed},itemsCount:[l.length]};let{group:g}=this.state;return g===void 0&&o!==void 0&&(g=k.getItemValue(l[0],o)),c.createElement(Q,{...y},this.renderListFilter(),e&&c.createElement("div",{className:"k-list-header"},e),c.createElement("div",{className:d.classNames("k-list",{[`k-list-${z[n]||n}`]:n,"k-virtual-list":this.base.vs.enabled})},this.renderDefaultItem(),!p&&g&&l.length!==0&&c.createElement(H,{group:g,groupMode:"modern",render:u}),this.renderList()),t&&c.createElement("div",{className:"k-list-footer"},t))},this.renderList=()=>{const{data:e=[],textField:t,dataItemKey:a,virtual:l={skip:0,total:void 0},groupHeaderItemRender:n,listNoDataRender:o,itemRender:u}=this.props,p=this.base.vs,h=l.skip,i=this.props.opened!==void 0?this.props.opened:this.state.opened,v=this.base.getPopupSettings(),b=`translateY(${p.translate}px)`;return c.createElement(ee,{id:this._listboxId,show:i,data:e.slice(),focusedIndex:this.getFocusedIndex(),value:this.value,textField:t,valueField:a,optionsGuid:this._guid,groupField:this.props.groupField,groupMode:"modern",listRef:y=>p.list=this.base.list=y,wrapperStyle:{maxHeight:v.height},wrapperCssClass:"k-list-content",listStyle:p.enabled?{transform:b}:void 0,key:"listkey",skip:h,onClick:this.handleItemClick,itemRender:u,groupHeaderItemRender:n,noDataRender:o,onScroll:this.onScroll,wrapperRef:p.scrollerRef,scroller:this.base.renderScrollElement(),ariaSetSize:l.total})},this.onScroll=e=>{const{vs:t,list:a}=this.base;t.scrollHandler(e);const{groupField:l}=this.props;let{data:n=[]}=this.props;if(!(!l||!n.length)&&l){const o=this.itemHeight=this.itemHeight||(t.enabled?t.itemHeight:a?a.children[0].offsetHeight:0),p=e.target.scrollTop-t.skip*o;n=this.base.getGroupedDataModernMode(n,l);let h=n[0][l];for(let i=1;i<n.length&&!(o*i>p);i++)n[i]&&n[i][l]&&(h=n[i][l]);h!==this.state.group&&this.setState({group:h})}},this.renderListFilter=()=>{const e=this.props.filter!==void 0?this.props.filter:this.state.text;return this.props.filterable&&c.createElement(X,{value:e,ref:t=>this._filterInput=t&&t.element,onChange:this.handleListFilterChange,onKeyDown:this.handleKeyDown,size:this.props.size,rounded:this.props.rounded,fillMode:this.props.fillMode,renderListFilterWrapper:!0})},this.renderDefaultItem=()=>{const{textField:e,defaultItem:t,dataItemKey:a}=this.props;return t!==void 0&&c.createElement(Z,{defaultItem:t,textField:e,selected:k.areSame(this.value,t,a),key:"defaultitemkey",onClick:this.handleDefaultItemClick})},this.search=e=>{clearTimeout(this._typingTimeout),this.props.filterable||(this._typingTimeout=window.setTimeout(()=>this.searchState.word="",this.props.delay),this.selectNext(e))},this.selectNext=e=>{const{data:t=[],dataItemKey:a}=this.props;let l=t.map((C,N)=>({item:C,itemIndex:N}));const n=this.searchState.word,o=this.searchState.last,u=k.sameCharsOnly(n,o);let p=l.length,h=Math.max(0,t.findIndex(C=>k.areSame(C,this.value,a))),i;this.props.defaultItem&&(i={item:this.props.defaultItem,itemIndex:-1},p+=1,h+=1),h+=u?1:0,l=k.shuffleData(l,h,i);let v,b,y,g=0;const{textField:r,ignoreCase:x}=this.props;for(;g<p;g++)if(v=k.getItemValue(l[g].item,r),b=u&&k.matchText(v,o,x),y=k.matchText(v,n,x),b||y){g=l[g].itemIndex;break}if(g!==p){const C=this.base.initState();C.syntheticEvent=e,this.handleItemSelect(g,C),this.applyState(C),this._valueDuringOnChange=void 0}},this.handleKeyDown=e=>{e&&e.target instanceof Element&&e.target.nodeName==="INPUT"&&e.stopPropagation&&e.stopPropagation();const{data:t=[],filterable:a,disabled:l,defaultItem:n,leftRightKeysNavigation:o=!0,virtual:u={skip:0,total:0,pageSize:0},dataItemKey:p,groupField:h="",textField:i,skipDisabledItems:v=!0}=this.props,b=this.value,y=t.findIndex(I=>k.areSame(I,b,p)),g=this.props.opened!==void 0?this.props.opened:this.state.opened,r=e.keyCode,x=r===d.Keys.home||r===d.Keys.end,C=r===d.Keys.up||r===d.Keys.down,N=!g&&(e.altKey&&r===d.Keys.down||r===d.Keys.enter||r===d.Keys.space),L=g&&(e.altKey&&r===d.Keys.up||r===d.Keys.esc),D=o&&(r===d.Keys.left||r===d.Keys.right),P=C||D&&!a||x,S=this.base.initState();if(S.syntheticEvent=e,!l){if(x&&this.base.vs.enabled)r===d.Keys.home?u.skip!==0?(this.base.triggerOnPageChange(S,0,u.pageSize),this._navigated=!0):this.triggerOnChange(t[0],S):u.skip<u.total-u.pageSize?(this.base.triggerOnPageChange(S,u.total-u.pageSize,u.pageSize),this._navigated=!0):this.triggerOnChange(t[t.length-1],S);else if(g&&r===d.Keys.pageUp)this.base.scrollPopupByPageSize(-1);else if(g&&r===d.Keys.pageDown)this.base.scrollPopupByPageSize(1);else if(g&&r===d.Keys.enter){const I=this.getFocusedIndex();this.haveFocusedItemAndDataNotEmpty(t,I)?(this.triggerOnChange(null,S),this.applyState(S)):this.handleItemSelect(I,S),this.base.togglePopup(S),e.preventDefault()}else if(N||L)L&&this.resetValueIfDisabledItem(),this.base.togglePopup(S),e.preventDefault();else if(P){if(this._lastKeypressIsFilter=!1,h!==""&&i)if(!v&&g)this.onNavigate(S,r);else{let I;if(r===d.Keys.down||r===d.Keys.right){const f=t.slice(y+1).find(m=>!m.disabled&&m[i]);I=f&&t.findIndex(m=>m[i]===f[i])}else if(r===d.Keys.up||r===d.Keys.left){let f;if(y===0&&n)I=-1;else if(y===-1)f=t,I=t.findIndex(m=>!m.disabled&&m[i]);else{f=t.slice(0,y);let m=f.pop();for(;m&&m.disabled;)m=f.pop();I=m&&t.findIndex(M=>M[i]===m[i])}}if(I!==void 0){const f=I-y;this.onNavigate(S,r,f)}else I===void 0&&t.findIndex(f=>f[i]===b[i])===t.length-1&&this.onNavigate(S,r)}else if(!v&&g||x)this.onNavigate(S,r);else if(i){let I;if(r===d.Keys.down||r===d.Keys.right){const f=t.slice(y+1).find(m=>!m.disabled&&m[i]);I=f&&t.findIndex(m=>m[i]===f[i])}else if(r===d.Keys.up||r===d.Keys.left){let f;if(y===0&&n)I=-1;else if(y===-1)f=t,I=t.find(m=>!m.disabled&&m[i]);else{f=t.slice(0,y);let m=f.pop();for(;m&&m.disabled;)m=f.pop();I=m&&t.findIndex(M=>M[i]===m[i])}}if(I!==void 0){const f=I-y;this.onNavigate(S,r,f)}else I===void 0&&t.findIndex(f=>f[i]===b[i])===t.length-1&&this.onNavigate(S,r)}else this.onNavigate(S,r);e.preventDefault()}this.applyState(S)}},this.handleItemClick=(e,t)=>{this.base.handleItemClick(e,t),this._valueDuringOnChange=void 0},this.handleFocus=e=>{this._skipFocusEvent||this.base.handleFocus(e)},this.handleBlur=e=>{if(this._skipFocusEvent||!this.state.focused)return;const t=this.props.opened!==void 0?this.props.opened:this.state.opened,{adaptive:a}=this.props,{windowWidth:l=0}=this.state,n=l<=F.MOBILE_MEDIUM_DEVISE&&a,o=this.base.initState();o.syntheticEvent=e,o.data.focused=!1,o.events.push({type:"onBlur"}),t&&this.resetValueIfDisabledItem(),t&&!n&&this.base.togglePopup(o),this.applyState(o)},this.handleDefaultItemClick=e=>{const t=this.base.initState();t.syntheticEvent=e,this.base.togglePopup(t),this.triggerOnChange(this.props.defaultItem,t),this.applyState(t)},this.handleWrapperClick=e=>{if(e.isPropagationStopped())return;const t=this.base.initState();t.syntheticEvent=e,this.state.focused||(t.data.focused=!0),this.resetValueIfDisabledItem(),this.base.togglePopup(t),this.applyState(t)},this.handleKeyPress=e=>{if(this.props.filterable||e.which===0||e.keyCode===d.Keys.enter)return;let t=String.fromCharCode(e.charCode||e.keyCode);this.props.ignoreCase&&(t=t.toLowerCase()),t===" "&&e.preventDefault(),this.searchState={word:this.searchState.word+t,last:this.searchState.last+t},this.search(e)},this.handleListFilterChange=e=>{const t=this.base.initState();t.syntheticEvent=e.syntheticEvent,this.props.filter===void 0&&(t.data.text=e.target.value),this.base.filterChanged(e.target.value,t),this._lastKeypressIsFilter=!0,this.applyState(t),this.setState({group:void 0})},this.onPopupOpened=()=>{this._filterInput&&this.focusElement(this._filterInput),this.props.adaptive&&setTimeout(()=>{this._filterInput&&this.focusElement(this._filterInput)},300)},this.onPopupClosed=()=>{this.state.focused&&window.setTimeout(()=>{this.state.focused&&this.base.wrapper&&this.focusElement(this.base.wrapper)})},this.setValidity=()=>{this._select&&this._select.setCustomValidity&&this._select.setCustomValidity(this.validity.valid?"":this.props.validationMessage||ae)},d.validatePackage(te.packageMetadata)}get _inputId(){return this.props.id+"-accessibility-id"}get _listboxId(){return this.props.id+"-listbox-id"}get _guid(){return this.props.id+"-guid"}get document(){if(d.canUseDOM)return this.element&&this.element.ownerDocument||document}get element(){return this._element}get value(){let s;return this._valueDuringOnChange!==void 0?s=this._valueDuringOnChange:this.props.value!==void 0?s=this.props.value:this.state.value!==void 0?s=this.state.value:this.props.defaultValue!==void 0&&(s=this.props.defaultValue),!k.isPresent(s)&&this.props.defaultItem!==void 0&&(s=this.props.defaultItem),s}get index(){const{data:s=[],dataItemKey:e}=this.props,t=this.value;return s.findIndex(a=>k.areSame(a,t,e))}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:E.defaultProps.validityStyles}get required(){return this.props.required!==void 0?this.props.required:E.defaultProps.required}componentDidUpdate(s,e){var v;const{dataItemKey:t,virtual:a,groupField:l="",textField:n}=this.props,{data:o=[]}=this.props,u=s.virtual?s.virtual.total:0,p=this.props.opened!==void 0?this.props.opened:this.state.opened,h=s.opened!==void 0?s.opened:e.opened,i=!h&&p;if(this.base.didUpdate(),this.base.getPopupSettings().animate||i&&this.onPopupOpened(),a&&a.total!==u)this.base.vs.calcScrollElementHeight(),this.base.vs.reset();else{const b=this.value,y=s.value!==void 0?s.value:e.value;let g=o.findIndex(x=>k.areSame(x,b,t));l!==""&&b&&n&&(g=(v=this.base.getGroupedDataModernMode(o,l))==null?void 0:v.map(x=>x[n]).indexOf(b[n]));const r=!k.areSame(y,b,t);i&&a?this.base.scrollToVirtualItem(a,g):i&&!a?(this.onPopupOpened(),o&&o.length!==0&&this.base.resetGroupStickyHeader(o[0][l],this),this.base.scrollToItem(g)):p&&h&&b&&r&&!this._navigated?this.base.scrollToItem(g,this.base.vs.enabled):p&&h&&this._navigated&&(this._navigated&&a&&a.skip===0?this.base.vs.reset():this._navigated&&a&&a.skip===a.total-a.pageSize&&this.base.vs.scrollToEnd())}this._navigated=!1,this.setValidity()}componentDidMount(){var s;this.observerResize=d.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(this.calculateMedia.bind(this)),this.base.didMount(),this.setValidity(),(s=this.document)!=null&&s.body&&this.observerResize&&this.observerResize.observe(this.document.body)}componentWillUnmount(){var s;(s=this.document)!=null&&s.body&&this.observerResize&&this.observerResize.disconnect()}render(){const s=se.provideLocalizationService(this).toLanguageString(T.dropDownListArrowBtnAriaLabel,T.messages[T.dropDownListArrowBtnAriaLabel]),{style:e,className:t,label:a,dir:l,virtual:n,size:o,rounded:u,fillMode:p,adaptive:h}=this.props,{windowWidth:i=0}=this.state,v=this.props.opened!==void 0?this.props.opened:this.state.opened,b=this.value,y=k.getItemValue(b,this.props.textField),g=!this.validityStyles||this.validity.valid,r=this.base,x=r.vs,C=i<=F.MOBILE_MEDIUM_DEVISE&&h;x.enabled=n!==void 0,n!==void 0&&(r.vs.skip=n.skip,r.vs.total=n.total,r.vs.pageSize=n.pageSize);const{dataItemKey:N,data:L=[],disabled:D,tabIndex:P,loading:S,iconClassName:I,svgIcon:f,valueRender:m}=this.props,{focused:M}=this.state,$=L.findIndex(K=>k.areSame(K,b,N)),V=c.createElement("span",{id:this._inputId,className:"k-input-inner"},y&&c.createElement("span",{className:"k-input-value-text"},y)),j=m!==void 0?m.call(void 0,V,b):V,A=c.createElement(c.Fragment,null,c.createElement("span",{ref:this.componentRef,className:d.classNames("k-dropdownlist k-picker",t,{[`k-picker-${z[o]||o}`]:o,[`k-rounded-${ne[u]||u}`]:u,[`k-picker-${p}`]:p,"k-focus":M,"k-disabled":D,"k-invalid":!g,"k-loading":S,"k-required":this.required}),style:a?{...e,width:void 0}:e,dir:l,onMouseDown:v?K=>{K.target.nodeName!=="INPUT"&&(this.focusElement(this.base.wrapper),K.preventDefault())}:void 0,onFocus:this.handleFocus,onBlur:this.handleBlur,tabIndex:d.getTabIndex(P,D),accessKey:this.props.accessKey,onKeyDown:this.handleKeyDown,onKeyPress:this.handleKeyPress,onClick:D?void 0:this.handleWrapperClick,role:"combobox","aria-required":this.required,"aria-disabled":D||void 0,"aria-haspopup":"listbox","aria-expanded":v||!1,"aria-owns":this._listboxId,"aria-activedescendant":v?"option-"+this._guid+"-"+($+(n?n.skip:0)):void 0,"aria-label":this.props.ariaLabel||this.props.label,"aria-labelledby":this.props.ariaLabelledBy,"aria-describedby":this.props.ariaDescribedBy||this._inputId,id:this.props.id,title:this.props.title},j,S&&c.createElement(d.IconWrap,{className:"k-input-loading-icon",name:"loading"}),c.createElement(W.Button,{tabIndex:-1,type:"button","aria-label":s,"aria-hidden":!0,size:o,fillMode:p,iconClass:I,className:"k-input-button",rounded:null,themeColor:"base",icon:I?void 0:"caret-alt-down",svgIcon:f||B.caretAltDownIcon,onMouseDown:K=>this.state.focused&&K.preventDefault()}),this.dummySelect(b),!C&&this.renderListContainer()),C&&this.renderAdaptiveListContainer());return a?c.createElement(J.FloatingLabel,{label:a,editorValue:y,editorValid:g,editorDisabled:this.props.disabled,style:{width:e?e.width:void 0},children:A}):A}onNavigate(s,e,t){const{data:a=[],defaultItem:l,dataItemKey:n,virtual:o={skip:0,total:0,pageSize:0}}=this.props,u=this.base.vs,p=this.value,h=a.findIndex(v=>k.areSame(v,p,n)),i=this.base.navigation.navigate({current:o.skip+h,max:(u.enabled?o.total:a.length)-1,min:l!==void 0?-1:0,keyCode:e,skipItems:t||void 0});i!==void 0&&this.handleItemSelect(i,s),this.applyState(s)}renderAdaptiveListContainer(){const{windowWidth:s=0}=this.state,{header:e,footer:t,size:a,adaptiveTitle:l,groupField:n,groupStickyHeaderItemRender:o,list:u,data:p=[]}=this.props,h=this.props.opened!==void 0?this.props.opened:this.state.opened,i={navigatable:!1,navigatableElements:[],expand:h,animation:!0,onClose:b=>this.handleWrapperClick(b),animationStyles:s<=F.MOBILE_SMALL_DEVISE?{top:0,width:"100%",height:"100%"}:void 0,className:s<=F.MOBILE_SMALL_DEVISE?"k-adaptive-actionsheet k-actionsheet-fullscreen":"k-adaptive-actionsheet k-actionsheet-bottom"};let{group:v}=this.state;return v===void 0&&n!==void 0&&(v=k.getItemValue(p[0],n)),c.createElement(q.ActionSheet,{...i},c.createElement(q.ActionSheetHeader,{className:"k-text-center"},c.createElement("div",{className:"k-actionsheet-titlebar-group k-hbox"},c.createElement("div",{className:"k-actionsheet-title"},c.createElement("div",null,l)),c.createElement("div",{className:"k-actionsheet-actions"},c.createElement(W.Button,{tabIndex:0,"aria-label":"Cancel","aria-disabled":"false",type:"button",fillMode:"flat",onClick:this.handleWrapperClick,icon:"x",svgIcon:B.xIcon}))),c.createElement("div",{className:"k-actionsheet-titlebar-group k-actionsheet-filter"},this.renderListFilter())),c.createElement(q.ActionSheetContent,{className:"!k-overflow-hidden"},e&&c.createElement("div",{className:"k-list-header"},e),c.createElement("div",{className:d.classNames("k-list",{[`k-list-${z[a]||a}`]:a,"k-virtual-list":this.base.vs.enabled})},this.renderDefaultItem(),!u&&v&&p.length!==0&&c.createElement(H,{group:v,groupMode:"modern",render:o}),this.renderList()),t&&c.createElement("div",{className:"k-list-footer"},t)))}getFocusedIndex(){const s=this.value,{data:e=[],textField:t,dataItemKey:a,virtual:l={skip:0},focusedItemIndex:n=k.itemIndexStartsWith,filterable:o,skipDisabledItems:u=!0}=this.props,p=this.props.filter?this.props.filter:this.state.text;return u&&t&&!p&&!s?e.findIndex(h=>!h.disabled&&h[t]):k.isPresent(s)&&p===void 0||o&&p===""?e.findIndex(h=>k.areSame(h,s,a)):p?this._lastKeypressIsFilter?n(e,p,t):e.findIndex(h=>k.areSame(h,s,a)):l.skip===0?0:-1}focusElement(s){this._skipFocusEvent=!0,s.focus(),window.setTimeout(()=>this._skipFocusEvent=!1,30)}triggerOnChange(s,e){k.areSame(this.value,s,this.props.dataItemKey)||(this.props.value===void 0&&(e.data.value=s),this._valueDuringOnChange=s,e.events.push({type:"onChange"}))}applyState(s){this.base.applyState(s),this._valueDuringOnChange=void 0}calculateMedia(s){for(const e of s)this.setState({windowWidth:e.target.clientWidth})}resetValueIfDisabledItem(){const{data:s=[]}=this.props,e=this.base.initState(),t=this.getFocusedIndex();this.haveFocusedItemAndDataNotEmpty(s,t)&&(this.triggerOnChange(null,e),this.applyState(e))}haveFocusedItemAndDataNotEmpty(s,e){return e!==void 0&&e!==-1&&s&&s.length>0&&s[e].disabled}};E.displayName="DropDownList",E.propTypes={delay:w.number,ignoreCase:w.bool,iconClassName:w.string,svgIcon:d.svgIconPropType,defaultItem:w.any,valueRender:w.func,valueMap:w.func,validationMessage:w.string,required:w.bool,id:w.string,ariaLabelledBy:w.string,ariaDescribedBy:w.string,ariaLabel:w.string,leftRightKeysNavigation:w.bool,title:w.string,groupField:w.string,list:w.any,skipDisabledItems:w.bool,renderListFilterWrapper:w.bool,...R.propTypes},E.defaultProps={delay:500,tabIndex:0,ignoreCase:!0,...R.defaultProps,required:!1,size:"medium",rounded:"medium",fillMode:"solid",groupMode:"modern"};let O=E;const U=d.createPropsContext(),G=d.withIdHOC(d.withPropsContext(U,O));G.displayName="KendoReactDropDownList";exports.DropDownList=G;exports.DropDownListPropsContext=U;exports.DropDownListWithoutContext=O;