@progress/kendo-react-dropdowns 6.1.1 → 7.0.0-develop.10

package/index.mjs

@@ -0,0 +1,4397 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the package root for more information
+*-------------------------------------------------------------------------------------------*/
+import * as o from "react";
+import * as l from "prop-types";
+import { IconWrap as ke, classNames as B, Keys as f, guid as Fe, svgIconPropType as gs, createPropsContext as Ke, withPropsContext as wt, validatePackage as qe, canUseDOM as Me, getTabIndex as $t, kendoThemeMaps as $e, getActiveElement as Ss, usePropsContext as Gt, getScrollbarWidth as ws, getter as kt, setScrollbarWidth as Es, useRtl as fs, noop as De, mapTree as Ds, extendDataItem as Ts } from "@progress/kendo-react-common";
+import { FloatingLabel as Ge } from "@progress/kendo-react-labels";
+import { searchIcon as Fs, caretAltDownIcon as Ut, xIcon as at, plusIcon as Ms } from "@progress/kendo-svg-icons";
+import { Popup as jt, PopupPropsContext as Ns } from "@progress/kendo-react-popup";
+import { TextBox as Os, InputPrefix as Ps } from "@progress/kendo-react-inputs";
+import { provideLocalizationService as Ae, registerForLocalization as ms, useLocalization as vs } from "@progress/kendo-react-intl";
+import { Button as Te, Chip as _s } from "@progress/kendo-react-buttons";
+import { ActionSheet as Yt, ActionSheetHeader as Jt, ActionSheetContent as lt, ActionSheetFooter as Rs } from "@progress/kendo-react-layout";
+import { TreeView as Ct } from "@progress/kendo-react-treeview";
+class Et extends o.Component {
+  render() {
+    const {
+      children: t,
+      width: e,
+      dir: s,
+      itemsCount: n,
+      popupSettings: a
+    } = this.props;
+    return /* @__PURE__ */ o.createElement(
+      jt,
+      {
+        style: { width: e, direction: s },
+        contentKey: n && n.join(),
+        ...a
+      },
+      t
+    );
+  }
+}
+const Qt = o.forwardRef((i, t) => {
+  const e = o.useRef(null);
+  return o.useImperativeHandle(
+    t,
+    () => e.current
+  ), /* @__PURE__ */ o.createElement("div", { className: "k-list-filter" }, /* @__PURE__ */ o.createElement(
+    Os,
+    {
+      ...i,
+      ref: e,
+      value: i.value || "",
+      onChange: i.onChange,
+      onKeyDown: i.onKeyDown,
+      tabIndex: i.tabIndex,
+      onClick: (s) => s.stopPropagation(),
+      size: i.size,
+      fillMode: i.fillMode,
+      rounded: i.rounded,
+      prefix: () => /* @__PURE__ */ o.createElement(Ps, null, /* @__PURE__ */ o.createElement(ke, { name: "search", icon: Fs }))
+    }
+  ));
+});
+Qt.propTypes = {
+  value: l.oneOfType([l.string, l.number, l.array]),
+  tabIndex: l.number,
+  onChange: l.func,
+  onKeyDown: l.func,
+  size: l.oneOf([null, "small", "medium", "large"]),
+  rounded: l.oneOf([null, "small", "medium", "large", "full"]),
+  fillMode: l.oneOf([null, "solid", "flat", "outline"])
+};
+Qt.displayName = "KendoReactListFilter";
+const Be = Qt;
+class We extends o.Component {
+  render() {
+    const {
+      group: t,
+      groupMode: e,
+      render: s
+    } = this.props, n = /* @__PURE__ */ o.createElement("div", { className: "k-list-group-sticky-header" }, e === "classic" ? t : /* @__PURE__ */ o.createElement("div", { className: "k-list-header-text" }, t));
+    return s !== void 0 ? s.call(void 0, n, this.props) : n;
+  }
+}
+const G = (i) => i != null, Bs = (i, t) => {
+  for (let e = 0; e < i.length; e++)
+    if (i.charAt(e) !== t)
+      return !1;
+  return !0;
+}, Vs = (i, t, e) => {
+  let s = i;
+  return e && (s = [e].concat(s)), s.slice(t).concat(s.slice(0, t));
+}, os = (i, t, e) => {
+  if (!G(i))
+    return !1;
+  let s = String(i);
+  return e && (s = s.toLowerCase()), s.indexOf(t) === 0;
+}, Ks = (i, t, e, s, n) => {
+  const a = i.offsetHeight, p = t.children.item(e), c = p.offsetTop + (n ? s - i.scrollTop : 0), d = p.offsetHeight;
+  if (n) {
+    let r = 0;
+    c + d > a ? r = c + d - a : c < 0 && (r = c), r !== 0 ? i.scrollTop += r : i.scrollTop === 0 && s !== 0 && (i.scrollTop = s);
+  } else
+    c + d > a + i.scrollTop ? i.scrollTop = c + d - a : c < i.scrollTop && (i.scrollTop -= i.scrollTop - c);
+}, Ve = (i, t, e) => {
+  let s = -1;
+  if (t) {
+    t = t.toLowerCase();
+    for (let n = 0; n < i.length; n++) {
+      const a = (V(i[n], e) || "") + "";
+      if (a && a.toLowerCase().startsWith(t)) {
+        s = n;
+        break;
+      }
+    }
+  }
+  return s;
+}, Kt = (i, t, e, s = !1) => {
+  const n = (a) => s ? a : a.toLowerCase();
+  return i.findIndex((a) => e ? n(V(a, e)) === n(t) : n(t) === n(a.toString()));
+}, V = (i, t) => {
+  if (t && G(i)) {
+    const e = t.split(".");
+    let s = i;
+    return e.forEach((n) => {
+      s = s ? s[n] : void 0;
+    }), s;
+  }
+  return i;
+}, Ls = (i = [], t = [], e) => {
+  if (i === t)
+    return !0;
+  if (i.length !== t.length)
+    return !1;
+  for (let s = 0; s < i.length; s++)
+    if (!R(i[s], t[s], e))
+      return !1;
+  return !0;
+}, vt = (i, t, e) => {
+  t.forEach((s) => {
+    const n = i.findIndex((a) => R(a, s, e));
+    n !== -1 && i.splice(n, 1);
+  });
+}, R = (i, t, e) => i === t || G(i) === G(t) && V(i, e) === V(t, e), as = (i, t, e) => {
+  if (t) {
+    const s = Kt(i, t, e, !0);
+    return s !== -1 ? i[s] : i[Ve(i, t, e)];
+  }
+  return i[0];
+}, zs = (i, t = [], e) => {
+  let s = "";
+  if (i) {
+    const n = t[Ve(t, i, e)];
+    if (n) {
+      const a = V(n, e);
+      i.toLowerCase() !== a.toLowerCase() && (s = a.substring(i.length));
+    }
+  }
+  return s;
+}, Hs = (i) => {
+  i.target.nodeName !== "INPUT" && i.preventDefault();
+}, xt = (i, t, e) => !!i != !!t || i.text !== t.text ? !1 : i === t || Ls(i.data, t.data, e), As = (i) => i.preventDefault();
+class Ws extends o.Component {
+  render() {
+    const {
+      selected: t,
+      defaultItem: e,
+      textField: s
+    } = this.props;
+    return /* @__PURE__ */ o.createElement(
+      "div",
+      {
+        onClick: this.props.onClick,
+        onMouseDown: As,
+        style: { position: "unset" },
+        className: B("k-list-optionlabel", {
+          "k-selected": t
+        })
+      },
+      V(e, s) || ""
+    );
+  }
+}
+class qs extends o.Component {
+  constructor() {
+    super(...arguments), this.handleClick = (t) => this.props.onClick(this.props.index, t);
+  }
+  render() {
+    const {
+      selected: t,
+      group: e,
+      dataItem: s,
+      virtual: n,
+      groupMode: a,
+      disabled: p,
+      render: c
+    } = this.props, d = /* @__PURE__ */ o.createElement(
+      "li",
+      {
+        id: this.props.id,
+        role: "option",
+        "aria-selected": t,
+        "aria-disabled": p ? !0 : void 0,
+        className: B("k-list-item", {
+          "k-selected": t,
+          "k-focus": this.props.focused,
+          "k-first": !!e && a === "classic",
+          "k-disabled": p
+        }),
+        onClick: this.handleClick,
+        style: { position: n ? "relative" : "unset" }
+      },
+      /* @__PURE__ */ o.createElement("span", { className: "k-list-item-text" }, V(s, this.props.textField).toString()),
+      e !== void 0 && a === "classic" ? /* @__PURE__ */ o.createElement("div", { className: "k-list-item-group-label" }, e) : null
+    );
+    return c !== void 0 ? c.call(void 0, d, this.props) : d;
+  }
+}
+class $s extends o.Component {
+  render() {
+    const {
+      group: t,
+      virtual: e,
+      render: s,
+      isMultiColumn: n = !1
+    } = this.props, a = /* @__PURE__ */ o.createElement(
+      "li",
+      {
+        id: this.props.id,
+        role: "group",
+        className: n ? "k-table-group-row" : "k-list-group-item",
+        style: n ? { boxSizing: "inherit" } : { position: e ? "relative" : "unset" }
+      },
+      /* @__PURE__ */ o.createElement("span", { className: s ? void 0 : n ? "k-table-th" : "k-list-item-text" }, t)
+    );
+    return s !== void 0 ? s.call(void 0, a, this.props) : a;
+  }
+}
+const fe = "dropdowns.nodata", it = "dropdowns.clear", Lt = "dropdowns.comboArrowBtnAriaLabelExpand", zt = "dropdowns.comboArrowBtnAriaLabelCollapse", Ht = "dropdowns.dropDownListArrowBtnAriaLabel", nt = "dropdowns.apply", ot = "dropdowns.cancel", le = {
+  [it]: "clear",
+  [fe]: "NO DATA FOUND.",
+  [Lt]: "expand combobox",
+  [zt]: "collapse combobox",
+  [Ht]: "select",
+  [nt]: "Apply",
+  [ot]: "Cancel"
+};
+class Ue extends o.Component {
+  renderItems() {
+    const {
+      textField: t,
+      valueField: e,
+      groupField: s,
+      groupMode: n,
+      isMultiColumn: a,
+      optionsGuid: p,
+      skip: c = 0,
+      virtual: d,
+      focusedIndex: r,
+      highlightSelected: h = !0,
+      value: u,
+      data: g,
+      itemRender: m,
+      groupHeaderItemRender: v
+    } = this.props, b = Array.isArray(u);
+    let w = 0;
+    return g.map((S, D) => {
+      const N = c + D, O = c + D + w, _ = S.disabled ? !1 : h && (!b && R(S, u, e) || b && u.findIndex((E) => R(E, S, e)) !== -1);
+      let C, F, x;
+      return D > 0 && s !== void 0 && (F = V(S, s), x = V(g[D - 1], s), F && x && F !== x && (C = F)), C !== void 0 && n === "modern" && (w += 1), [
+        C !== void 0 && n === "modern" && /* @__PURE__ */ o.createElement(
+          $s,
+          {
+            id: `option-${p}-${O}`,
+            virtual: d,
+            key: N + "-group-item",
+            group: C,
+            isMultiColumn: a,
+            render: v
+          }
+        ),
+        /* @__PURE__ */ o.createElement(
+          qs,
+          {
+            id: `option-${p}-${C !== void 0 && n === "modern" ? O + 1 : O}`,
+            virtual: d,
+            dataItem: S,
+            groupMode: n,
+            selected: _,
+            focused: r === D,
+            index: N,
+            key: N,
+            onClick: this.props.onClick,
+            textField: t,
+            group: C,
+            render: m,
+            disabled: S.disabled
+          }
+        )
+      ];
+    });
+  }
+  renderNoValueElement(t) {
+    const e = this.props.noDataRender, s = /* @__PURE__ */ o.createElement("div", { className: "k-nodata" }, /* @__PURE__ */ o.createElement("div", null, t.toLanguageString(fe, le[fe])));
+    return e ? e.call(void 0, s) : s;
+  }
+  render() {
+    const t = Ae(this), {
+      id: e,
+      show: s,
+      wrapperCssClass: n,
+      wrapperStyle: a,
+      listStyle: p,
+      listRef: c,
+      wrapperRef: d,
+      listClassName: r = "k-list-ul",
+      ariaSetSize: h
+    } = this.props, u = this.renderItems();
+    return u.length ? /* @__PURE__ */ o.createElement(
+      "div",
+      {
+        className: n,
+        style: a,
+        ref: d,
+        onMouseDown: this.props.onMouseDown,
+        onBlur: this.props.onBlur,
+        onScroll: this.props.onScroll,
+        unselectable: "on"
+      },
+      /* @__PURE__ */ o.createElement(
+        "ul",
+        {
+          id: e,
+          role: "listbox",
+          "aria-hidden": s ? void 0 : !0,
+          "aria-setsize": h,
+          className: r,
+          ref: c,
+          style: p
+        },
+        u
+      ),
+      this.props.scroller && /* @__PURE__ */ o.createElement("div", { className: "k-height-container" }, this.props.scroller)
+    ) : this.renderNoValueElement(t);
+  }
+}
+ms(Ue);
+const Gs = 1533915;
+class Us {
+  constructor() {
+    this.container = null, this.scrollElement = null, this.list = null, this.containerHeight = 0, this.skip = 0, this.total = 0, this.enabled = !1, this.pageSize = 0, this.itemHeight = 0, this.PageChange = null, this.prevScrollPos = 0, this.listTranslate = 0, this.scrollSyncing = !1, this.scrollerRef = (t) => {
+      const e = this;
+      e.container = t, t && (t.setAttribute("unselectable", "on"), window.setTimeout(e.calcScrollElementHeight.bind(e), 0));
+    }, this.calcScrollElementHeight = () => {
+      this.scrollSyncing = !0;
+      let t = !1;
+      this.itemHeight = this.list ? this.list.children[0].offsetHeight : this.itemHeight, this.containerHeight = Math.min(Gs, this.itemHeight * this.total);
+      const e = this.containerHeight;
+      return this.scrollElement && (t = this.scrollElement.style.height !== e + "px", t && (this.scrollElement.style.height = e + "px")), this.scrollSyncing = !1, t;
+    }, this.scrollHandler = this.scrollHandler.bind(this);
+  }
+  get translate() {
+    return this.listTranslate;
+  }
+  changePage(t, e) {
+    const s = Math.min(Math.max(0, t), this.total - this.pageSize);
+    s !== this.skip && this.PageChange && this.PageChange({ skip: s, take: this.pageSize }, e);
+  }
+  translateTo(t) {
+    this.listTranslate = t, this.list && (this.list.style.transform = "translateY(" + t + "px)");
+  }
+  reset() {
+    this.container && (this.calcScrollElementHeight(), this.container.scrollTop = 0, this.translateTo(0));
+  }
+  scrollToEnd() {
+    this.container && this.list && (this.calcScrollElementHeight(), this.container.scrollTop = this.container.scrollHeight - this.container.offsetHeight, this.translateTo(this.container.scrollHeight));
+  }
+  localScrollUp(t) {
+    const e = this.itemHeight, s = this.container.scrollTop;
+    let n = this.listTranslate, a, p = s - n;
+    if (!(p > e)) {
+      for (a = 0; a < this.skip && !(n + e + p <= s); a++)
+        n -= e;
+      if (n = this.validateTranslate(n), this.skip - a <= 0 && n >= s) {
+        this.translateTo(0), this.changePage(0, t), this.container.scrollTop = 0;
+        return;
+      }
+      n !== this.listTranslate && (this.translateTo(n), this.changePage(this.skip - a, t));
+    }
+  }
+  localScrollDown(t) {
+    const e = this.itemHeight;
+    let s = this.container.scrollTop, n = this.listTranslate;
+    const a = this.list.children.length;
+    let p;
+    for (p = 0; p < a && !(n + e >= s); p++)
+      n += e;
+    n = this.validateTranslate(n), p >= a && this.skip + p >= this.total ? (this.translateTo(n), this.changePage(this.total - 1, t)) : n !== this.listTranslate && (this.translateTo(n), this.changePage(this.skip + p, t));
+  }
+  scrollNonStrict(t) {
+    const e = this.total * this.prevScrollPos / this.containerHeight, s = Math.min(Math.floor(e), this.total - 1);
+    let n = this.containerHeight * e / this.total;
+    n = this.validateTranslate(n), this.translateTo(n), this.changePage(s, t);
+  }
+  scrollHandler(t) {
+    const e = this.container ? this.container.scrollTop : 0, s = this.prevScrollPos;
+    this.prevScrollPos = e, !(!this.enabled || !this.list || !this.container || this.scrollSyncing) && (e - s <= 0 && e > this.listTranslate - this.list.scrollHeight / 10 ? this.localScrollUp(t) : e - s > 0 && e < this.listTranslate + this.list.scrollHeight * 2 / 3 ? this.localScrollDown(t) : this.scrollNonStrict(t));
+  }
+  validateTranslate(t) {
+    return t = Math.max(0, t), t = Math.min(this.containerHeight, t), t;
+  }
+}
+class js {
+  navigate(t) {
+    const e = t.keyCode;
+    if (e === f.up || e === f.left)
+      return this.next({ current: t.current, min: t.min, max: t.max, step: t.skipItems ? t.skipItems : -1 });
+    if (e === f.down || e === f.right)
+      return this.next({ current: t.current, min: t.min, max: t.max, step: t.skipItems ? t.skipItems : 1 });
+    if (e === f.home)
+      return 0;
+    if (e === f.end)
+      return t.max;
+  }
+  next(t) {
+    return G(t.current) ? Math.min(t.max, Math.max(t.current + t.step, t.min)) : t.min;
+  }
+}
+const Xt = class {
+  constructor(i) {
+    this.wrapper = null, this.list = null, this.vs = new Us(), this.navigation = new js(), this.handleItemClick = (t, e) => {
+      const s = this.initState();
+      s.syntheticEvent = e, e.stopPropagation(), this.component.handleItemSelect(t, s), this.togglePopup(s), this.applyState(s);
+    }, this.handleFocus = (t) => {
+      if (!this.component.state.focused) {
+        const e = this.initState();
+        e.data.focused = !0, e.events.push({ type: "onFocus" }), e.syntheticEvent = t, this.applyState(e);
+      }
+    }, this.filterChanged = (t, e) => {
+      const { textField: s, filterable: n } = this.component.props;
+      n && e.events.push({
+        type: "onFilterChange",
+        filter: {
+          field: s,
+          operator: "contains",
+          ignoreCase: !0,
+          value: t
+        }
+      });
+    }, this.togglePopup = (t) => {
+      const e = this.component.props, s = e.opened !== void 0 ? e.opened : this.component.state.opened;
+      e.opened === void 0 && (t.data.opened = !s), s ? t.events.push({ type: "onClose" }) : (t.events.push({ type: "onOpen" }), this.calculatePopupWidth());
+    }, this.pageChange = (t, e) => {
+      const s = this.initState();
+      s.syntheticEvent = e, this.triggerOnPageChange(s, t.skip, t.take), this.applyState(s);
+    }, this.scrollToVirtualItem = (t, e) => {
+      const s = this.vs;
+      if (s.enabled = !1, t.skip === 0)
+        s.reset();
+      else if (t.skip + t.pageSize === t.total)
+        s.scrollToEnd();
+      else {
+        let n = s.translate;
+        n === 0 && (s.calcScrollElementHeight(), n = s.itemHeight * t.skip, s.translateTo(n - s.itemHeight)), s.container && (s.container.scrollTop = n), this.scrollToItem(e, !0);
+      }
+      window.setTimeout(() => s.enabled = !0, 10);
+    }, this.scrollPopupByPageSize = (t) => {
+      var p, c, d, r, h, u;
+      const e = this.vs, s = (c = (p = this.list) == null ? void 0 : p.parentElement) == null ? void 0 : c.scrollTop, n = e.enabled && e.itemHeight ? e.itemHeight : this.list ? this.list.children[0].offsetHeight : 0, a = (r = (d = this.list) == null ? void 0 : d.parentElement) == null ? void 0 : r.offsetHeight;
+      s !== void 0 && a !== void 0 && ((u = (h = this.list) == null ? void 0 : h.parentElement) == null || u.scroll({ top: s + t * Math.floor(a / n) * n }));
+    }, this.renderScrollElement = () => {
+      const t = this.vs;
+      return t.enabled && /* @__PURE__ */ o.createElement(
+        "div",
+        {
+          ref: (e) => t.scrollElement = e,
+          key: "scrollElementKey"
+        }
+      );
+    }, this.resetGroupStickyHeader = (t, e) => {
+      t !== e.state.group && e.setState({ ...e.state, group: t });
+    }, this.listBoxId = Fe(), this.guid = Fe(), this.component = i, this.vs.PageChange = this.pageChange;
+  }
+  didMount() {
+    const i = this.component.props, t = i.popupSettings || {}, e = i.style || {}, s = t.width;
+    let n = i.opened === !0;
+    s === void 0 && this.calculatePopupWidth(), i.dir === void 0 && e.direction === void 0 && (this.calculateDir(), n = !0), n && this.component.forceUpdate();
+  }
+  calculateDir() {
+    const i = this.component.element;
+    i && i.ownerDocument && i.ownerDocument.defaultView && (this.dirCalculated = i.ownerDocument.defaultView.getComputedStyle(i).direction || void 0);
+  }
+  calculatePopupWidth() {
+    this.wrapper && (this.popupWidth = this.wrapper.offsetWidth + "px");
+  }
+  scrollToItem(i, t, e) {
+    const s = this.list || this.vs.list;
+    if (!s && !e && setTimeout(() => {
+      this.scrollToItem(i, t, !0);
+    }, 10), s && i >= 0) {
+      const n = this.vs, a = n.container || s.parentNode, p = t !== void 0 ? t : n.enabled;
+      Ks(a, s, i, n.translate, p);
+    }
+  }
+  initState() {
+    return {
+      data: {},
+      events: [],
+      syntheticEvent: void 0
+    };
+  }
+  applyState(i) {
+    Object.keys(i.data).length > 0 && this.component.setState(i.data);
+    const t = {
+      syntheticEvent: i.syntheticEvent,
+      nativeEvent: i.syntheticEvent ? i.syntheticEvent.nativeEvent : void 0,
+      target: this.component,
+      value: this.component.value
+    };
+    i.events.forEach((e) => {
+      const s = e.type;
+      delete e.type;
+      const n = s && this.component.props[s];
+      n && n.call(void 0, {
+        ...t,
+        ...e
+      });
+    });
+  }
+  triggerOnPageChange(i, t, e) {
+    const s = this.component.props.virtual;
+    if (s) {
+      const n = Math.min(Math.max(0, t), Math.max(0, s.total - e));
+      n !== s.skip && i.events.push({
+        type: "onPageChange",
+        page: { skip: n, take: e }
+      });
+    }
+  }
+  triggerPageChangeCornerItems(i, t) {
+    const e = this.component.props, { data: s = [], dataItemKey: n, virtual: a } = e, p = e.opened !== void 0 ? e.opened : this.component.state.opened;
+    i && a && this.vs.enabled && (a.skip > 0 && R(i, s[0], n) ? this.triggerOnPageChange(t, a.skip - 1, a.pageSize) : !p && a.skip + a.pageSize < a.total && R(i, s[s.length - 1], n) && this.triggerOnPageChange(t, a.skip + 1, a.pageSize));
+  }
+  getPopupSettings() {
+    return Object.assign({}, Xt.defaultProps.popupSettings, this.component.props.popupSettings);
+  }
+  getGroupedDataModernMode(i, t) {
+    let e = [];
+    return i.forEach((s, n) => {
+      i[n - 1] && s[t] !== i[n - 1][t] && e.push({ [t]: s[t] }), e.push(i[n]);
+    }), e;
+  }
+};
+let ie = Xt;
+ie.basicPropTypes = {
+  opened: l.bool,
+  disabled: l.bool,
+  dir: l.string,
+  tabIndex: l.number,
+  accessKey: l.string,
+  data: l.array,
+  textField: l.string,
+  className: l.string,
+  label: l.string,
+  loading: l.bool,
+  popupSettings: l.shape({
+    animate: l.oneOfType([l.bool, l.shape({
+      openDuration: l.number,
+      closeDuration: l.number
+    })]),
+    popupClass: l.string,
+    className: l.string,
+    appendTo: l.any,
+    width: l.oneOfType([l.string, l.number]),
+    height: l.oneOfType([l.string, l.number])
+  }),
+  onOpen: l.func,
+  onClose: l.func,
+  onFocus: l.func,
+  onBlur: l.func,
+  onChange: l.func,
+  itemRender: l.func,
+  listNoDataRender: l.func,
+  focusedItemIndex: l.func,
+  header: l.node,
+  footer: l.node
+};
+ie.propTypes = {
+  ...Xt.basicPropTypes,
+  value: l.any,
+  defaultValue: l.any,
+  filterable: l.bool,
+  filter: l.string,
+  virtual: l.shape({
+    pageSize: l.number.isRequired,
+    skip: l.number.isRequired,
+    total: l.number.isRequired
+  }),
+  onFilterChange: l.func,
+  onPageChange: l.func
+};
+ie.defaultProps = {
+  popupSettings: {
+    height: "200px"
+  },
+  required: !1,
+  validityStyles: !0
+};
+const je = {
+  name: "@progress/kendo-react-dropdowns",
+  productName: "KendoReact",
+  productCodes: ["KENDOUIREACT", "KENDOUICOMPLETE"],
+  publishDate: 1701439314,
+  version: "",
+  licensingDocsUrl: "https://www.telerik.com/kendo-react-ui/components/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning"
+}, St = 500, Se = 768, Ys = "Please select a value from the list!", { sizeMap: Vt, roundedMap: Js } = $e, At = class extends o.Component {
+  constructor(i) {
+    super(i), this.state = {}, this._element = null, this.base = new ie(this), this.searchState = { word: "", last: "" }, this._select = null, this._skipFocusEvent = !1, this._filterInput = null, this._navigated = !1, this._lastKeypressIsFilter = !1, this._inputId = Fe(), this.itemHeight = 0, this.focus = () => {
+      this.base.wrapper && this.base.wrapper.focus();
+    }, this.handleItemSelect = (t, e) => {
+      const { data: s = [], virtual: n, dataItemKey: a, defaultItem: p } = this.props, c = n ? n.skip : 0, d = t === -1 && p !== void 0 ? p : s[t - c], r = !R(d, this.value, a);
+      this.triggerOnChange(d, e), r && this.base.triggerPageChangeCornerItems(d, e);
+    }, this.componentRef = (t) => {
+      this._element = t, this.base.wrapper = t;
+    }, this.dummySelect = (t) => /* @__PURE__ */ o.createElement(
+      "select",
+      {
+        name: this.props.name,
+        ref: (e) => {
+          this._select = e;
+        },
+        tabIndex: -1,
+        "aria-hidden": !0,
+        title: this.props.label,
+        style: { opacity: 0, width: 1, border: 0, zIndex: -1, position: "absolute", left: "50%" }
+      },
+      /* @__PURE__ */ o.createElement(
+        "option",
+        {
+          value: this.props.valueMap ? this.props.valueMap.call(void 0, t) : t
+        }
+      )
+    ), this.renderListContainer = () => {
+      const { header: t, footer: e, dir: s, data: n = [], size: a, groupField: p, groupStickyHeaderItemRender: c, list: d } = this.props, r = this.base, h = r.getPopupSettings(), u = this.props.opened !== void 0 ? this.props.opened : this.state.opened, g = h.width !== void 0 ? h.width : r.popupWidth, m = {
+        dir: s !== void 0 ? s : r.dirCalculated,
+        width: g,
+        popupSettings: {
+          popupClass: B(
+            h.popupClass,
+            "k-list-container",
+            "k-dropdownlist-popup"
+          ),
+          className: h.className,
+          animate: h.animate,
+          anchor: this.element,
+          show: u,
+          onOpen: this.onPopupOpened,
+          onClose: this.onPopupClosed,
+          appendTo: h.appendTo
+        },
+        itemsCount: [n.length]
+      };
+      let { group: v } = this.state;
+      return v === void 0 && p !== void 0 && (v = V(n[0], p)), /* @__PURE__ */ o.createElement(Et, { ...m }, this.renderListFilter(), t && /* @__PURE__ */ o.createElement("div", { className: "k-list-header" }, t), /* @__PURE__ */ o.createElement(
+        "div",
+        {
+          className: B(
+            "k-list",
+            {
+              [`k-list-${Vt[a] || a}`]: a,
+              "k-virtual-list": this.base.vs.enabled
+            }
+          )
+        },
+        this.renderDefaultItem(),
+        !d && v && n.length !== 0 && /* @__PURE__ */ o.createElement(We, { group: v, groupMode: "modern", render: c }),
+        this.renderList()
+      ), e && /* @__PURE__ */ o.createElement("div", { className: "k-list-footer" }, e));
+    }, this.renderList = () => {
+      const {
+        data: t = [],
+        textField: e,
+        dataItemKey: s,
+        virtual: n = { skip: 0, total: void 0 },
+        groupHeaderItemRender: a,
+        listNoDataRender: p,
+        itemRender: c
+      } = this.props, d = this.base.vs, r = n.skip, h = this.props.opened !== void 0 ? this.props.opened : this.state.opened, u = this.base.getPopupSettings(), g = `translateY(${d.translate}px)`;
+      return /* @__PURE__ */ o.createElement(
+        Ue,
+        {
+          id: this.base.listBoxId,
+          show: h,
+          data: t.slice(),
+          focusedIndex: this.getFocusedIndex(),
+          value: this.value,
+          textField: e,
+          valueField: s,
+          optionsGuid: this.base.guid,
+          groupField: this.props.groupField,
+          groupMode: "modern",
+          listRef: (m) => d.list = this.base.list = m,
+          wrapperStyle: { maxHeight: u.height },
+          wrapperCssClass: "k-list-content",
+          listStyle: d.enabled ? { transform: g } : void 0,
+          key: "listkey",
+          skip: r,
+          onClick: this.handleItemClick,
+          itemRender: c,
+          groupHeaderItemRender: a,
+          noDataRender: p,
+          onScroll: this.onScroll,
+          wrapperRef: d.scrollerRef,
+          scroller: this.base.renderScrollElement(),
+          ariaSetSize: n.total
+        }
+      );
+    }, this.onScroll = (t) => {
+      const { vs: e, list: s } = this.base;
+      e.scrollHandler(t);
+      const { groupField: n } = this.props;
+      let { data: a = [] } = this.props;
+      if (!(!n || !a.length) && n) {
+        const p = this.itemHeight = this.itemHeight || (e.enabled ? e.itemHeight : s ? s.children[0].offsetHeight : 0), d = t.target.scrollTop - e.skip * p;
+        a = this.base.getGroupedDataModernMode(a, n);
+        let r = a[0][n];
+        for (let h = 1; h < a.length && !(p * h > d); h++)
+          a[h] && a[h][n] && (r = a[h][n]);
+        r !== this.state.group && this.setState({
+          group: r
+        });
+      }
+    }, this.renderListFilter = () => {
+      const t = this.props.filter !== void 0 ? this.props.filter : this.state.text;
+      return this.props.filterable && /* @__PURE__ */ o.createElement(
+        Be,
+        {
+          value: t,
+          ref: (e) => this._filterInput = e && e.element,
+          onChange: this.handleListFilterChange,
+          onKeyDown: this.handleKeyDown,
+          size: this.props.size,
+          rounded: this.props.rounded,
+          fillMode: this.props.fillMode
+        }
+      );
+    }, this.renderDefaultItem = () => {
+      const { textField: t, defaultItem: e, dataItemKey: s } = this.props;
+      return e !== void 0 && /* @__PURE__ */ o.createElement(
+        Ws,
+        {
+          defaultItem: e,
+          textField: t,
+          selected: R(this.value, e, s),
+          key: "defaultitemkey",
+          onClick: this.handleDefaultItemClick
+        }
+      );
+    }, this.search = (t) => {
+      clearTimeout(this._typingTimeout), this.props.filterable || (this._typingTimeout = window.setTimeout(() => this.searchState.word = "", this.props.delay), this.selectNext(t));
+    }, this.selectNext = (t) => {
+      const { data: e = [], dataItemKey: s } = this.props;
+      let n = e.map((S, D) => ({ item: S, itemIndex: D }));
+      const a = this.searchState.word, p = this.searchState.last, c = Bs(a, p);
+      let d = n.length, r = Math.max(0, e.findIndex((S) => R(S, this.value, s))), h;
+      this.props.defaultItem && (h = { item: this.props.defaultItem, itemIndex: -1 }, d += 1, r += 1), r += c ? 1 : 0, n = Vs(n, r, h);
+      let u, g, m, v = 0;
+      const { textField: b, ignoreCase: w } = this.props;
+      for (; v < d; v++)
+        if (u = V(n[v].item, b), g = c && os(u, p, w), m = os(u, a, w), g || m) {
+          v = n[v].itemIndex;
+          break;
+        }
+      if (v !== d) {
+        const S = this.base.initState();
+        S.syntheticEvent = t, this.handleItemSelect(v, S), this.applyState(S), this._valueDuringOnChange = void 0;
+      }
+    }, this.handleKeyDown = (t) => {
+      t && t.target instanceof Element && t.target.nodeName === "INPUT" && t.stopPropagation && t.stopPropagation();
+      const {
+        data: e = [],
+        filterable: s,
+        disabled: n,
+        defaultItem: a,
+        leftRightKeysNavigation: p = !0,
+        virtual: c = { skip: 0, total: 0, pageSize: 0 },
+        dataItemKey: d,
+        groupField: r = "",
+        textField: h,
+        skipDisabledItems: u = !0
+      } = this.props, g = this.value, m = e.findIndex((F) => R(F, g, d)), v = this.props.opened !== void 0 ? this.props.opened : this.state.opened, b = t.keyCode, w = b === f.home || b === f.end, S = b === f.up || b === f.down, D = !v && (t.altKey && b === f.down || b === f.enter || b === f.space), N = v && (t.altKey && b === f.up || b === f.esc), O = p && (b === f.left || b === f.right), _ = S || O && !s || w, C = this.base.initState();
+      if (C.syntheticEvent = t, !n) {
+        if (w && this.base.vs.enabled)
+          b === f.home ? c.skip !== 0 ? (this.base.triggerOnPageChange(C, 0, c.pageSize), this._navigated = !0) : this.triggerOnChange(e[0], C) : c.skip < c.total - c.pageSize ? (this.base.triggerOnPageChange(C, c.total - c.pageSize, c.pageSize), this._navigated = !0) : this.triggerOnChange(e[e.length - 1], C);
+        else if (v && b === f.pageUp)
+          this.base.scrollPopupByPageSize(-1);
+        else if (v && b === f.pageDown)
+          this.base.scrollPopupByPageSize(1);
+        else if (v && b === f.enter) {
+          const F = this.getFocusedIndex();
+          this.haveFocusedItemAndDataNotEmpty(e, F) ? (this.triggerOnChange(null, C), this.applyState(C)) : this.handleItemSelect(F, C), this.base.togglePopup(C), t.preventDefault();
+        } else if (D || N)
+          N && this.resetValueIfDisabledItem(), this.base.togglePopup(C), t.preventDefault();
+        else if (_) {
+          if (this._lastKeypressIsFilter = !1, r !== "" && h)
+            if (!u && v)
+              this.onNavigate(C, b);
+            else {
+              let F;
+              if (b === f.down || b === f.right) {
+                const x = e.slice(m + 1).find((E) => !E.disabled && E[h]);
+                F = x && e.findIndex((E) => E[h] === x[h]);
+              } else if (b === f.up || b === f.left) {
+                let x;
+                if (m === 0 && a)
+                  F = -1;
+                else if (m === -1)
+                  x = e, F = e.findIndex((E) => !E.disabled && E[h]);
+                else {
+                  x = e.slice(0, m);
+                  let E = x.pop();
+                  for (; E && E.disabled; )
+                    E = x.pop();
+                  F = E && e.findIndex((M) => M[h] === E[h]);
+                }
+              }
+              if (F !== void 0) {
+                const x = F - m;
+                this.onNavigate(C, b, x);
+              } else
+                F === void 0 && e.findIndex((x) => x[h] === g[h]) === e.length - 1 && this.onNavigate(C, b);
+            }
+          else if (!u && v || w)
+            this.onNavigate(C, b);
+          else if (h) {
+            let F;
+            if (b === f.down || b === f.right) {
+              const x = e.slice(m + 1).find((E) => !E.disabled && E[h]);
+              F = x && e.findIndex((E) => E[h] === x[h]);
+            } else if (b === f.up || b === f.left) {
+              let x;
+              if (m === 0 && a)
+                F = -1;
+              else if (m === -1)
+                x = e, F = e.find((E) => !E.disabled && E[h]);
+              else {
+                x = e.slice(0, m);
+                let E = x.pop();
+                for (; E && E.disabled; )
+                  E = x.pop();
+                F = E && e.findIndex((M) => M[h] === E[h]);
+              }
+            }
+            if (F !== void 0) {
+              const x = F - m;
+              this.onNavigate(C, b, x);
+            } else
+              F === void 0 && e.findIndex((x) => x[h] === g[h]) === e.length - 1 && this.onNavigate(C, b);
+          } else
+            this.onNavigate(C, b);
+          t.preventDefault();
+        }
+        this.applyState(C);
+      }
+    }, this.handleItemClick = (t, e) => {
+      this.base.handleItemClick(t, e), this._valueDuringOnChange = void 0;
+    }, this.handleFocus = (t) => {
+      this._skipFocusEvent || this.base.handleFocus(t);
+    }, this.handleBlur = (t) => {
+      if (this._skipFocusEvent || !this.state.focused)
+        return;
+      const e = this.props.opened !== void 0 ? this.props.opened : this.state.opened, { adaptive: s } = this.props, { windowWidth: n = 0 } = this.state, a = n <= Se && s, p = this.base.initState();
+      p.syntheticEvent = t, p.data.focused = !1, p.events.push({ type: "onBlur" }), e && this.resetValueIfDisabledItem(), e && !a && this.base.togglePopup(p), this.applyState(p);
+    }, this.handleDefaultItemClick = (t) => {
+      const e = this.base.initState();
+      e.syntheticEvent = t, this.base.togglePopup(e), this.triggerOnChange(this.props.defaultItem, e), this.applyState(e);
+    }, this.handleWrapperClick = (t) => {
+      if (t.isPropagationStopped())
+        return;
+      const e = this.base.initState();
+      e.syntheticEvent = t, this.state.focused || (e.data.focused = !0), this.resetValueIfDisabledItem(), this.base.togglePopup(e), this.applyState(e);
+    }, this.handleKeyPress = (t) => {
+      if (this.props.filterable || t.which === 0 || t.keyCode === f.enter)
+        return;
+      let e = String.fromCharCode(t.charCode || t.keyCode);
+      this.props.ignoreCase && (e = e.toLowerCase()), e === " " && t.preventDefault(), this.searchState = {
+        word: this.searchState.word + e,
+        last: this.searchState.last + e
+      }, this.search(t);
+    }, this.handleListFilterChange = (t) => {
+      const e = this.base.initState();
+      e.syntheticEvent = t.syntheticEvent, this.props.filter === void 0 && (e.data.text = t.target.value), this.base.filterChanged(t.target.value, e), this._lastKeypressIsFilter = !0, this.applyState(e), 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 || Ys
+      );
+    }, qe(je);
+  }
+  get document() {
+    if (Me)
+      return this.element && this.element.ownerDocument || document;
+  }
+  /**
+   * @hidden
+   */
+  get element() {
+    return this._element;
+  }
+  /**
+   * The value of the DropDownList.
+   */
+  get value() {
+    let i;
+    return this._valueDuringOnChange !== void 0 ? i = this._valueDuringOnChange : this.props.value !== void 0 ? i = this.props.value : this.state.value !== void 0 ? i = this.state.value : this.props.defaultValue !== void 0 && (i = this.props.defaultValue), !G(i) && this.props.defaultItem !== void 0 && (i = this.props.defaultItem), i;
+  }
+  /**
+   * The index of the selected item.
+   */
+  get index() {
+    const { data: i = [], dataItemKey: t } = this.props, e = this.value;
+    return i.findIndex((s) => R(s, e, t));
+  }
+  /**
+   * Gets the `name` property of the DropDownList.
+   */
+  get name() {
+    return this.props.name;
+  }
+  /**
+   * Represents the validity state into which the DropDownList is set.
+   */
+  get validity() {
+    const i = this.props.validationMessage !== void 0, t = !this.required || this.value !== null && this.value !== "" && this.value !== void 0, e = this.props.valid !== void 0 ? this.props.valid : t;
+    return {
+      customError: i,
+      valid: e,
+      valueMissing: this.value === null
+    };
+  }
+  get validityStyles() {
+    return this.props.validityStyles !== void 0 ? this.props.validityStyles : At.defaultProps.validityStyles;
+  }
+  /**
+   * @hidden
+   */
+  get required() {
+    return this.props.required !== void 0 ? this.props.required : At.defaultProps.required;
+  }
+  /**
+   * @hidden
+   */
+  componentDidUpdate(i, t) {
+    var u;
+    const { dataItemKey: e, virtual: s, groupField: n = "", textField: a } = this.props;
+    let { data: p = [] } = this.props;
+    const c = i.virtual ? i.virtual.total : 0, d = this.props.opened !== void 0 ? this.props.opened : this.state.opened, r = i.opened !== void 0 ? i.opened : t.opened, h = !r && d;
+    if (this.base.getPopupSettings().animate || h && this.onPopupOpened(), s && s.total !== c)
+      this.base.vs.calcScrollElementHeight(), this.base.vs.reset();
+    else {
+      const g = this.value, m = i.value !== void 0 ? i.value : t.value;
+      let v = p.findIndex((w) => R(w, g, e));
+      n !== "" && g && a && (v = (u = this.base.getGroupedDataModernMode(p, n)) == null ? void 0 : u.map((w) => w[a]).indexOf(g[a]));
+      const b = !R(m, g, e);
+      h && s ? this.base.scrollToVirtualItem(s, v) : h && !s ? (this.onPopupOpened(), p && p.length !== 0 && this.base.resetGroupStickyHeader(p[0][n], this), this.base.scrollToItem(v)) : d && r && g && b && !this._navigated ? this.base.scrollToItem(v) : d && r && this._navigated && (this._navigated && s && s.skip === 0 ? this.base.vs.reset() : this._navigated && s && s.skip === s.total - s.pageSize && this.base.vs.scrollToEnd());
+    }
+    this._navigated = !1, this.setValidity();
+  }
+  /**
+   * @hidden
+   */
+  componentDidMount() {
+    var i;
+    this.observerResize = Me && window.ResizeObserver && new window.ResizeObserver(this.calculateMedia.bind(this)), this.base.didMount(), this.setValidity(), (i = this.document) != null && i.body && this.observerResize && this.observerResize.observe(this.document.body);
+  }
+  /** @hidden */
+  componentWillUnmount() {
+    var i;
+    (i = this.document) != null && i.body && this.observerResize && this.observerResize.disconnect();
+  }
+  /**
+   * @hidden
+   */
+  render() {
+    const i = Ae(this).toLanguageString(Ht, le[Ht]), { style: t, className: e, label: s, dir: n, virtual: a, size: p, rounded: c, fillMode: d, adaptive: r } = this.props, { windowWidth: h = 0 } = this.state, u = this.props.opened !== void 0 ? this.props.opened : this.state.opened, g = this.value, m = V(g, this.props.textField), v = !this.validityStyles || this.validity.valid, b = this.base, w = b.vs, S = h <= Se && r;
+    w.enabled = a !== void 0, a !== void 0 && (b.vs.skip = a.skip, b.vs.total = a.total, b.vs.pageSize = a.pageSize);
+    const {
+      dataItemKey: D,
+      data: N = [],
+      disabled: O,
+      tabIndex: _,
+      loading: C,
+      iconClassName: F,
+      valueRender: x
+    } = this.props, { focused: E } = this.state, M = N.findIndex((Y) => R(Y, g, D)), K = /* @__PURE__ */ o.createElement("span", { id: this._inputId, className: "k-input-inner" }, /* @__PURE__ */ o.createElement("span", { className: "k-input-value-text" }, m)), U = x !== void 0 ? x.call(void 0, K, g) : K, j = /* @__PURE__ */ o.createElement(o.Fragment, null, /* @__PURE__ */ o.createElement(
+      "span",
+      {
+        ref: this.componentRef,
+        className: B(
+          "k-dropdownlist k-picker",
+          e,
+          {
+            [`k-picker-${Vt[p] || p}`]: p,
+            [`k-rounded-${Js[c] || c}`]: c,
+            [`k-picker-${d}`]: d,
+            "k-focus": E,
+            "k-disabled": O,
+            "k-invalid": !v,
+            "k-loading": C,
+            "k-required": this.required
+          }
+        ),
+        style: s ? { ...t, width: void 0 } : t,
+        dir: n,
+        onMouseDown: u ? (Y) => {
+          Y.target.nodeName !== "INPUT" && (this.focusElement(this.base.wrapper), Y.preventDefault());
+        } : void 0,
+        onFocus: this.handleFocus,
+        onBlur: this.handleBlur,
+        tabIndex: $t(_, O),
+        accessKey: this.props.accessKey,
+        onKeyDown: this.handleKeyDown,
+        onKeyPress: this.handleKeyPress,
+        onClick: O ? void 0 : this.handleWrapperClick,
+        role: "combobox",
+        "aria-required": this.required,
+        "aria-disabled": O || void 0,
+        "aria-haspopup": "listbox",
+        "aria-expanded": u || !1,
+        "aria-owns": this.base.listBoxId,
+        "aria-activedescendant": u ? "option-" + this.base.guid + "-" + (M + (a ? a.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
+      },
+      U,
+      C && /* @__PURE__ */ o.createElement(ke, { className: "k-input-loading-icon", name: "loading" }),
+      /* @__PURE__ */ o.createElement(
+        Te,
+        {
+          tabIndex: -1,
+          type: "button",
+          "aria-label": i,
+          "aria-hidden": !0,
+          size: p,
+          fillMode: d,
+          iconClass: F,
+          className: "k-input-button",
+          rounded: null,
+          themeColor: "base",
+          icon: F ? void 0 : "caret-alt-down",
+          svgIcon: F ? this.props.svgIcon : Ut,
+          onMouseDown: (Y) => this.state.focused && Y.preventDefault()
+        }
+      ),
+      this.dummySelect(g),
+      !S && this.renderListContainer()
+    ), S && this.renderAdaptiveListContainer());
+    return s ? /* @__PURE__ */ o.createElement(
+      Ge,
+      {
+        label: s,
+        editorValue: m,
+        editorValid: v,
+        editorDisabled: this.props.disabled,
+        style: { width: t ? t.width : void 0 },
+        children: j
+      }
+    ) : j;
+  }
+  /**
+   * @hidden
+   */
+  onNavigate(i, t, e) {
+    const {
+      data: s = [],
+      defaultItem: n,
+      dataItemKey: a,
+      virtual: p = { skip: 0, total: 0, pageSize: 0 }
+    } = this.props, c = this.base.vs, d = this.value, r = s.findIndex((u) => R(u, d, a)), h = this.base.navigation.navigate({
+      current: p.skip + r,
+      max: (c.enabled ? p.total : s.length) - 1,
+      min: n !== void 0 ? -1 : 0,
+      keyCode: t,
+      skipItems: e || void 0
+    });
+    h !== void 0 && this.handleItemSelect(h, i), this.applyState(i);
+  }
+  renderAdaptiveListContainer() {
+    const { windowWidth: i = 0 } = this.state, { header: t, footer: e, size: s, adaptiveTitle: n, groupField: a, groupStickyHeaderItemRender: p, list: c, data: d = [] } = this.props, r = this.props.opened !== void 0 ? this.props.opened : this.state.opened, h = {
+      navigatable: !1,
+      navigatableElements: [],
+      expand: r,
+      animation: !0,
+      onClose: (g) => this.handleWrapperClick(g),
+      animationStyles: i <= St ? { top: 0, width: "100%", height: "100%" } : void 0,
+      className: i <= St ? "k-adaptive-actionsheet k-actionsheet-fullscreen" : "k-adaptive-actionsheet k-actionsheet-bottom"
+    };
+    let { group: u } = this.state;
+    return u === void 0 && a !== void 0 && (u = V(d[0], a)), /* @__PURE__ */ o.createElement(o.Fragment, null, /* @__PURE__ */ o.createElement(Yt, { ...h }, /* @__PURE__ */ o.createElement(Jt, { className: "k-text-center" }, /* @__PURE__ */ o.createElement("div", { className: "k-actionsheet-titlebar-group k-hbox" }, /* @__PURE__ */ o.createElement("div", { className: "k-actionsheet-title" }, /* @__PURE__ */ o.createElement("div", null, n)), /* @__PURE__ */ o.createElement("div", { className: "k-actionsheet-actions" }, /* @__PURE__ */ o.createElement(
+      Te,
+      {
+        tabIndex: 0,
+        "aria-label": "Cancel",
+        "aria-disabled": "false",
+        type: "button",
+        fillMode: "flat",
+        onClick: this.handleWrapperClick,
+        icon: "x",
+        svgIcon: at
+      }
+    ))), /* @__PURE__ */ o.createElement("div", { className: "k-actionsheet-titlebar-group k-actionsheet-filter" }, this.renderListFilter())), /* @__PURE__ */ o.createElement(lt, { className: "!k-overflow-hidden" }, t && /* @__PURE__ */ o.createElement("div", { className: "k-list-header" }, t), /* @__PURE__ */ o.createElement(
+      "div",
+      {
+        className: B(
+          "k-list",
+          {
+            [`k-list-${Vt[s] || s}`]: s,
+            "k-virtual-list": this.base.vs.enabled
+          }
+        )
+      },
+      this.renderDefaultItem(),
+      !c && u && d.length !== 0 && /* @__PURE__ */ o.createElement(We, { group: u, groupMode: "modern", render: p }),
+      this.renderList()
+    ), e && /* @__PURE__ */ o.createElement("div", { className: "k-list-footer" }, e))));
+  }
+  getFocusedIndex() {
+    const i = this.value, {
+      data: t = [],
+      textField: e,
+      dataItemKey: s,
+      virtual: n = { skip: 0 },
+      focusedItemIndex: a = Ve,
+      filterable: p,
+      skipDisabledItems: c = !0
+    } = this.props, d = this.props.filter ? this.props.filter : this.state.text;
+    return c && e && !d && !i ? t.findIndex((r) => !r.disabled && r[e]) : G(i) && d === void 0 || p && d === "" ? t.findIndex((r) => R(r, i, s)) : d ? this._lastKeypressIsFilter ? a(t, d, e) : t.findIndex((r) => R(r, i, s)) : n.skip === 0 ? 0 : -1;
+  }
+  focusElement(i) {
+    this._skipFocusEvent = !0, i.focus(), window.setTimeout(() => this._skipFocusEvent = !1, 30);
+  }
+  triggerOnChange(i, t) {
+    R(this.value, i, this.props.dataItemKey) || (this.props.value === void 0 && (t.data.value = i), this._valueDuringOnChange = i, t.events.push({ type: "onChange" }));
+  }
+  applyState(i) {
+    this.base.applyState(i), this._valueDuringOnChange = void 0;
+  }
+  calculateMedia(i) {
+    for (let t of i)
+      this.setState({ windowWidth: t.target.clientWidth });
+  }
+  resetValueIfDisabledItem() {
+    const { data: i = [] } = this.props, t = this.base.initState(), e = this.getFocusedIndex();
+    this.haveFocusedItemAndDataNotEmpty(i, e) && (this.triggerOnChange(null, t), this.applyState(t));
+  }
+  haveFocusedItemAndDataNotEmpty(i, t) {
+    return t !== void 0 && t !== -1 && i && i.length > 0 && i[t].disabled;
+  }
+};
+let Dt = At;
+Dt.displayName = "DropDownList";
+Dt.propTypes = {
+  delay: l.number,
+  ignoreCase: l.bool,
+  iconClassName: l.string,
+  svgIcon: gs,
+  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,
+  ...ie.propTypes
+};
+Dt.defaultProps = {
+  delay: 500,
+  tabIndex: 0,
+  ignoreCase: !0,
+  ...ie.defaultProps,
+  required: !1,
+  size: "medium",
+  rounded: "medium",
+  fillMode: "solid",
+  groupMode: "modern"
+};
+const Qs = Ke(), Xs = wt(
+  Qs,
+  Dt
+);
+Xs.displayName = "KendoReactDropDownList";
+class Zt extends o.Component {
+  constructor() {
+    super(...arguments), this._input = null;
+  }
+  /**
+   * @hidden
+   */
+  get input() {
+    return this._input;
+  }
+  componentDidUpdate(t) {
+    const e = t.value, s = t.suggestedText, { value: n, suggestedText: a, focused: p } = this.props, c = this.input, d = e !== n || a !== s, r = d && e.startsWith(n) && !(s && a && s.endsWith(a)), h = Ss(document);
+    p && c && h !== c && c.focus(), a && d && !r && c && c.setSelectionRange(n.length - a.length, n.length);
+  }
+  render() {
+    const { expanded: t = !1, disabled: e, role: s = "listbox", render: n } = this.props, a = /* @__PURE__ */ o.createElement(
+      "input",
+      {
+        autoComplete: "off",
+        id: this.props.id,
+        type: "text",
+        key: "searchbar",
+        size: this.props.size,
+        placeholder: this.props.placeholder,
+        className: "k-input-inner",
+        tabIndex: this.props.tabIndex,
+        accessKey: this.props.accessKey,
+        role: s,
+        name: this.props.name,
+        value: this.props.value,
+        onChange: this.props.onChange,
+        ref: (p) => this._input = p,
+        onKeyDown: this.props.onKeyDown,
+        onFocus: this.props.onFocus,
+        onBlur: this.props.onBlur,
+        onClick: this.props.onClick,
+        "aria-disabled": e || void 0,
+        disabled: e || void 0,
+        readOnly: this.props.readOnly || void 0,
+        title: this.props.title,
+        "aria-haspopup": "listbox",
+        "aria-expanded": t,
+        "aria-owns": this.props.owns,
+        "aria-activedescendant": t ? this.props.activedescendant : void 0,
+        "aria-describedby": this.props.ariaDescribedBy,
+        "aria-labelledby": this.props.ariaLabelledBy,
+        "aria-required": this.props.ariaRequired
+      }
+    );
+    return n ? n.call(void 0, a) : a;
+  }
+}
+class rt extends o.Component {
+  constructor() {
+    super(...arguments), this.onMouseDown = (t) => t.preventDefault();
+  }
+  render() {
+    const t = Ae(this).toLanguageString(it, le[it]);
+    return /* @__PURE__ */ o.createElement(
+      "span",
+      {
+        className: "k-clear-value",
+        role: "button",
+        onClick: this.props.onClick,
+        onMouseDown: this.onMouseDown,
+        tabIndex: -1,
+        title: t,
+        key: "clearbutton"
+      },
+      /* @__PURE__ */ o.createElement(ke, { name: "x", icon: at })
+    );
+  }
+}
+ms(rt);
+const Zs = "Please enter a valid value!", { sizeMap: bt, roundedMap: ei } = $e, It = class extends o.Component {
+  constructor(i) {
+    super(i), this.state = {}, this.base = new ie(this), this._element = null, this._inputId = Fe(), this._suggested = "", this._skipBlur = !1, this._input = null, this._adaptiveFilterInput = null, this.itemHeight = 0, this.focus = () => {
+      this._input && this._input.focus();
+    }, this.handleItemSelect = (t, e) => {
+      const { data: s = [], virtual: n, dataItemKey: a } = this.props, p = n ? n.skip : 0, c = s[t - p], d = !R(c, this.value, a);
+      this.triggerOnChange(c, e), this.state.text !== void 0 && (e.data.text = void 0), d && this.base.triggerPageChangeCornerItems(c, e);
+    }, this.onPopupOpened = () => {
+      setTimeout(() => {
+        this.mobileMode && this._adaptiveFilterInput && (this._skipBlur = !0, this._adaptiveFilterInput.focus(), this._skipBlur = !1);
+      }, 300);
+    }, this.componentRef = (t) => {
+      this._element = t, this.base.wrapper = t;
+    }, this.toggleBtnClick = (t) => {
+      const { data: e = [], skipDisabledItems: s, textField: n } = this.props, a = this.getFocusedIndex(), p = this.getCurrentValueDisabledStatus(n, e, a), c = this.props.opened !== void 0 ? this.props.opened : this.state.opened, d = this.base.initState();
+      if (d.syntheticEvent = t, !s && n && p && this.clearValueOnToggleBtnClick(t), this.base.togglePopup(d), !c && this.mobileMode) {
+        const r = this.props.adaptiveFilter !== void 0 ? this.props.adaptiveFilter : this.state.text || null;
+        this.base.filterChanged(r, d);
+      }
+      this.applyState(d);
+    }, this.renderMobileListFilter = () => {
+      const t = this.props.adaptiveFilter !== void 0 ? this.props.adaptiveFilter : this.state.text, e = V(this.value, this.props.textField), s = G(t) ? t : e;
+      return /* @__PURE__ */ o.createElement(
+        Be,
+        {
+          value: s,
+          ref: (n) => this._adaptiveFilterInput = n && n.element,
+          onChange: this.handleMobileFilterChange,
+          onKeyDown: this.onInputKeyDown,
+          size: this.props.size,
+          rounded: this.props.rounded,
+          fillMode: this.props.fillMode
+        }
+      );
+    }, this.handleMobileFilterChange = (t) => {
+      const e = this.base.initState();
+      e.syntheticEvent = t.syntheticEvent, e.data.text = t.target.value, this.base.filterChanged(t.target.value, e), this.applyState(e);
+    }, this.onScroll = (t) => {
+      const { vs: e, list: s } = this.base;
+      e.scrollHandler(t);
+      const { groupField: n } = this.props;
+      let { data: a = [] } = this.props;
+      if (!n || !a.length)
+        return;
+      const p = this.itemHeight = this.itemHeight || (e.enabled ? e.itemHeight : s ? s.children[0].offsetHeight : 0), d = t.target.scrollTop - e.skip * p;
+      this.props.groupMode === "modern" && (a = this.base.getGroupedDataModernMode(a, n));
+      let r = a[0][n];
+      for (let h = 1; h < a.length && !(p * h > d); h++)
+        a[h] && a[h][n] && (r = a[h][n]);
+      r !== this.state.group && (this.setState({
+        group: r
+      }), this.props.onGroupScroll && this.props.onGroupScroll.call(void 0, { group: r }));
+    }, this.handleItemClick = (t, e) => {
+      this.base.handleItemClick(t, e), this._valueDuringOnChange = void 0;
+    }, this.handleBlur = (t) => {
+      if (this.state.focused && !this._skipBlur) {
+        const e = this.base.initState(), { textField: s, data: n = [] } = this.props, a = this.getFocusedIndex(), c = !(a === -1) && this.getCurrentValueDisabledStatus(s, n, a);
+        e.data.focused = !1, e.events.push({ type: "onBlur" }), e.syntheticEvent = t, s && c && this.clearValueOnBlur(t), this.applyValueOnRejectSuggestions(t.currentTarget.value, e);
+      }
+    }, this.onInputClick = (t) => {
+      const e = this.props.opened !== void 0 ? this.props.opened : this.state.opened, s = this.props.adaptiveFilter !== void 0 ? this.props.adaptiveFilter : this.state.text || null;
+      if (!e && this.mobileMode) {
+        const n = this.base.initState();
+        n.syntheticEvent = t, this.base.togglePopup(n), this.base.filterChanged(s, n), this.applyState(n);
+      }
+    }, this.onInputKeyDown = (t) => {
+      const { data: e = [], skipDisabledItems: s, textField: n, dataItemKey: a, groupField: p } = this.props, c = this.value, d = Math.max(0, e.findIndex((w) => R(w, c, a))), r = t.keyCode, h = this.props.opened !== void 0 ? this.props.opened : this.state.opened, u = this.base.initState();
+      if (u.syntheticEvent = t, !t.altKey && (r === f.up || r === f.down)) {
+        if (t.preventDefault(), p !== "" && n)
+          if (!this.props.skipDisabledItems && h)
+            this.onNavigate(u, r);
+          else {
+            let w = 0;
+            if (r === f.down || r === f.right) {
+              const S = e.slice(d + 1).find((D) => !D.disabled && D[n]);
+              w = S && e.findIndex((D) => D[n] === S[n]);
+            } else if (r === f.up || r === f.left) {
+              let S;
+              if (d === 0)
+                S = e, w = e.findIndex((D) => !D.disabled && D[n]);
+              else {
+                S = e.slice(0, d);
+                let D = S.pop();
+                for (; D && D.disabled; )
+                  D = S.pop();
+                w = D && e.findIndex((N) => N[n] === D[n]);
+              }
+            }
+            if (w !== void 0) {
+              const S = w - d;
+              this.onNavigate(u, r, S);
+            } else
+              w === void 0 && e.findIndex((S) => S[n] === c[n]) === e.length - 1 && this.onNavigate(u, r);
+          }
+        else if (!this.props.skipDisabledItems && h)
+          this.onNavigate(u, r);
+        else {
+          let w = null;
+          if (r === f.down || r === f.right)
+            w = e.slice(d + 1).find((S) => !S.disabled);
+          else if (r === f.up || r === f.left) {
+            const S = e.slice(0, d);
+            for (w = S.pop(); w && w.disabled; )
+              w = S.pop();
+          }
+          if (w) {
+            const S = w.id - d - 1;
+            this.onNavigate(u, r, S);
+          } else
+            this.onNavigate(u, r);
+        }
+        this.applyState(u);
+      }
+      const g = () => {
+        t.preventDefault(), this.base.togglePopup(u), this.applyState(u);
+      }, m = this.getFocusedIndex(), v = m === -1, b = !v && this.getCurrentValueDisabledStatus(n, e, m);
+      h ? r === f.pageUp ? this.base.scrollPopupByPageSize(-1) : r === f.pageDown ? this.base.scrollPopupByPageSize(1) : t.altKey && r === f.up ? g() : r === f.enter ? (t.preventDefault(), (n && !v && t.currentTarget.value ? e[m][n] : void 0) ? !s && n && b ? this.clearValueOnEnterOrEsc(t) : b || this.applyValueOnEnter(t.currentTarget.value, u) : this.applyValueOnEnter(t.currentTarget.value, u)) : r === f.esc && (!s && n && b && this.clearValueOnEnterOrEsc(t), this.applyValueOnRejectSuggestions(t.currentTarget.value, u)) : !h && r === f.esc ? this.clearValueOnEnterOrEsc(t) : t.altKey && r === f.down && g();
+    }, this.inputOnChange = (t) => {
+      const e = this.base.initState();
+      e.syntheticEvent = t;
+      const s = this.props.opened !== void 0 ? this.props.opened : this.state.opened, n = t.currentTarget, a = n.value;
+      if (this.props.suggest) {
+        const p = n.selectionEnd === a.length;
+        let c = this.props.filter !== void 0 ? this.props.filter : this.state.text;
+        G(c) || (c = V(this.value, this.props.textField) || "");
+        const d = c && c === a, r = c && c.length > a.length;
+        d || r || !p ? this._suggested = "" : this.suggestValue(a);
+      }
+      this.props.filter === void 0 && (e.data.text = a), this.state.focusedItem !== void 0 && (e.data.focusedItem = void 0), s || this.base.togglePopup(e), this.base.filterChanged(a, e), this.applyState(e), this.setState({ group: void 0 });
+    }, this.clearButtonClick = (t) => {
+      const e = this.base.initState();
+      e.syntheticEvent = t, t.stopPropagation(), this.clearValue();
+    }, this.clearValueOnEnterOrEsc = (t) => {
+      const e = this.base.initState();
+      e.syntheticEvent = t, t.stopPropagation(), this.clearValue();
+    }, this.clearValueOnBlur = (t) => {
+      const e = this.base.initState();
+      e.syntheticEvent = t, t.stopPropagation(), this.clearValue();
+    }, this.clearValueOnToggleBtnClick = (t) => {
+      const e = this.base.initState();
+      e.syntheticEvent = t, t.stopPropagation(), this.clearValue();
+    }, this.setValidity = () => {
+      this._input && this._input.setCustomValidity && this._input.setCustomValidity(
+        this.validity.valid ? "" : this.props.validationMessage || Zs
+      );
+    }, qe(je);
+  }
+  get document() {
+    if (Me)
+      return this.element && this.element.ownerDocument || document;
+  }
+  /** @hidden */
+  get element() {
+    return this._element;
+  }
+  /**
+   * The mobile mode of the ComboBox.
+   */
+  get mobileMode() {
+    return !!(this.state.windowWidth && this.state.windowWidth <= Se && this.props.adaptive);
+  }
+  /**
+   * The value of the ComboBox.
+   */
+  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;
+  }
+  /**
+   * The index of the selected item.
+   */
+  get index() {
+    const { data: i = [], dataItemKey: t } = this.props, e = this.value;
+    return i.findIndex((s) => R(s, e, t));
+  }
+  /**
+   * Gets the `name` property of the ComboBox.
+   */
+  get name() {
+    return this.props.name;
+  }
+  /**
+   * Represents the validity state into which the component is set.
+   */
+  get validity() {
+    const i = this.props.validationMessage !== void 0, t = !this.required || this.value !== null && this.value !== "" && this.value !== void 0, e = this.props.valid !== void 0 ? this.props.valid : t;
+    return {
+      customError: i,
+      valid: e,
+      valueMissing: this.value === null
+    };
+  }
+  get validityStyles() {
+    return this.props.validityStyles !== void 0 ? this.props.validityStyles : It.defaultProps.validityStyles;
+  }
+  /** @hidden */
+  get required() {
+    return this.props.required !== void 0 ? this.props.required : It.defaultProps.required;
+  }
+  /** @hidden */
+  componentDidUpdate(i, t) {
+    var g;
+    const { dataItemKey: e, virtual: s, groupField: n = "", data: a = [], textField: p } = this.props, c = i.virtual ? i.virtual.total : 0, d = this.props.opened !== void 0 ? this.props.opened : this.state.opened, r = i.opened !== void 0 ? i.opened : t.opened, h = !r && d, u = this.value;
+    if (this._valueOnDidUpdate = u, s && s.total !== c)
+      this.base.vs.calcScrollElementHeight(), this.base.vs.reset();
+    else {
+      const m = i.value !== void 0 ? i.value : t.value;
+      let v = a.findIndex((w) => R(w, u, e));
+      this.props.groupMode === "modern" && p && u && (v = (g = this.base.getGroupedDataModernMode(a, n)) == null ? void 0 : g.map((w) => w[p]).indexOf(u[p]));
+      const b = !R(m, u, e);
+      h && s ? this.base.scrollToVirtualItem(s, v) : h && !s ? (this.onPopupOpened(), a && a.length !== 0 && this.base.resetGroupStickyHeader(a[0][n], this), this.base.scrollToItem(v)) : d && r && u && b && this.base.scrollToItem(v);
+    }
+    h && this._input && this._input.focus(), this.setValidity();
+  }
+  /** @hidden */
+  componentDidMount() {
+    var i;
+    this.observerResize = Me && window.ResizeObserver && new window.ResizeObserver(this.calculateMedia.bind(this)), this.base.didMount(), this.setValidity(), (i = this.document) != null && i.body && this.observerResize && this.observerResize.observe(this.document.body);
+  }
+  /** @hidden */
+  componentWillUnmount() {
+    var i;
+    (i = this.document) != null && i.body && this.observerResize && this.observerResize.disconnect();
+  }
+  /** @hidden */
+  render() {
+    const i = Ae(this).toLanguageString(Lt, le[Lt]), t = Ae(this).toLanguageString(
+      zt,
+      le[zt]
+    ), {
+      dir: e,
+      disabled: s,
+      clearButton: n = It.defaultProps.clearButton,
+      label: a,
+      textField: p,
+      adaptive: c,
+      className: d,
+      style: r,
+      loading: h,
+      iconClassName: u,
+      virtual: g,
+      size: m,
+      rounded: v,
+      fillMode: b,
+      opened: w = this.state.opened,
+      placeholder: S
+    } = this.props, { windowWidth: D = 0 } = this.state, N = !this.validityStyles || this.validity.valid, O = this.props.filter !== void 0 ? this.props.filter : this.state.text, _ = V(this.value, p), C = G(O) ? O : _, F = n && (!!C || G(this.value)), E = this.base.vs, M = this.props.id || this._inputId, K = D <= Se && c;
+    E.enabled = g !== void 0, g !== void 0 && (E.skip = g.skip, E.total = g.total, E.pageSize = g.pageSize);
+    const U = /* @__PURE__ */ o.createElement(o.Fragment, null, /* @__PURE__ */ o.createElement(
+      "span",
+      {
+        className: B(
+          "k-combobox k-input",
+          {
+            [`k-input-${bt[m] || m}`]: m,
+            [`k-rounded-${ei[v] || v}`]: v,
+            [`k-input-${b}`]: b,
+            "k-invalid": !N,
+            "k-loading": h,
+            "k-required": this.required,
+            "k-disabled": s
+          },
+          d
+        ),
+        ref: this.componentRef,
+        style: a ? { ...r, width: void 0 } : r,
+        dir: e
+      },
+      this.renderSearchBar(C || "", M, S),
+      F && !h && /* @__PURE__ */ o.createElement(rt, { onClick: this.clearButtonClick, key: "clearbutton" }),
+      h && /* @__PURE__ */ o.createElement(ke, { className: "k-input-loading-icon", name: "loading", key: "loading" }),
+      /* @__PURE__ */ o.createElement(
+        Te,
+        {
+          tabIndex: -1,
+          type: "button",
+          "aria-label": w ? t : i,
+          icon: u ? void 0 : "caret-alt-down",
+          svgIcon: u ? this.props.svgIcon : Ut,
+          iconClass: u,
+          size: m,
+          fillMode: b,
+          rounded: null,
+          themeColor: "base",
+          className: "k-input-button",
+          onClick: this.toggleBtnClick,
+          onMouseDown: (j) => j.preventDefault()
+        }
+      ),
+      !K && this.renderListContainer()
+    ), K && this.renderAdaptiveListContainer());
+    return a ? /* @__PURE__ */ o.createElement(
+      Ge,
+      {
+        label: a,
+        editorId: M,
+        editorValue: C,
+        editorValid: N,
+        editorDisabled: s,
+        style: { width: r ? r.width : void 0 },
+        children: U
+      }
+    ) : U;
+  }
+  /** @hidden */
+  onNavigate(i, t, e) {
+    const { data: s = [], virtual: n = { skip: 0 } } = this.props, a = this.props.filter ? this.props.filter : this.state.text, p = this.getFocusedIndex(), c = this.base.vs, d = this.value;
+    if (this._suggested = "", p !== -1 && !G(d))
+      this.handleItemSelect(p, i);
+    else if (a === "")
+      this.handleItemSelect(0, i);
+    else {
+      let r = n.skip + p;
+      const h = this.base.navigation.navigate({
+        keyCode: t,
+        current: r,
+        max: (c.enabled ? c.total : s.length) - 1,
+        min: 0,
+        skipItems: e || void 0
+      });
+      h !== void 0 && this.handleItemSelect(h, i);
+    }
+  }
+  getCurrentValueDisabledStatus(i, t, e) {
+    return i && t && t[e] && t[e].disabled;
+  }
+  applyValueOnEnter(i, t) {
+    const { data: e = [], textField: s, allowCustom: n } = this.props, a = this.props.opened !== void 0 ? this.props.opened : this.state.opened, c = V(this.value, s) === i ? this.index : Kt(e, i, s), d = c !== -1;
+    let r;
+    if (this._suggested = "", d)
+      r = e[c];
+    else if (n)
+      r = s !== void 0 ? { [s]: i } : i;
+    else
+      return this.selectFocusedItem(i, t);
+    this.triggerOnChange(r, t), a && this.base.togglePopup(t), this.props.filter === void 0 && this.state.text !== void 0 && (t.data.text = void 0), this.applyState(t);
+  }
+  applyValueOnRejectSuggestions(i, t) {
+    const { data: e = [], textField: s, allowCustom: n } = this.props, a = this.props.opened !== void 0 ? this.props.opened : this.state.opened, p = V(this.value, s), c = this.state.windowWidth && this.state.windowWidth <= Se;
+    if (this._suggested = "", i === p || i === "" && !G(p))
+      return a && !c && this.base.togglePopup(t), this.applyState(t);
+    const d = Kt(e, i, s, !0), r = d !== -1;
+    let h = null;
+    r ? h = e[d] : n && (h = i ? s ? { [s]: i } : i : null), this.triggerOnChange(h, t), this.state.text !== void 0 && (t.data.text = void 0, this.base.filterChanged("", t)), a && !c && this.base.togglePopup(t), this.applyState(t);
+  }
+  selectFocusedItem(i, t) {
+    const e = this.props.opened !== void 0 ? this.props.opened : this.state.opened, { data: s = [], textField: n, virtual: a = { skip: 0 }, focusedItemIndex: p = Ve } = this.props, c = a.skip, d = i === "" && c === 0 ? 0 : p(s, i, n);
+    return d !== -1 ? this.handleItemSelect(d + c, t) : (this.triggerOnChange(null, t), this.state.text !== void 0 && (t.data.text = void 0)), e && this.base.togglePopup(t), this.applyState(t);
+  }
+  renderAdaptiveListContainer() {
+    const { windowWidth: i = 0 } = this.state, { header: t, footer: e, size: s, data: n = [], groupField: a, groupMode: p, list: c, virtual: d, adaptiveTitle: r, groupStickyHeaderItemRender: h } = this.props, u = this.props.opened !== void 0 ? this.props.opened : this.state.opened;
+    let { group: g } = this.state;
+    g === void 0 && a !== void 0 && (g = V(n[0], a));
+    const m = {
+      navigatable: !1,
+      navigatableElements: [],
+      expand: u,
+      animation: !0,
+      onClose: (v) => this.toggleBtnClick(v),
+      animationStyles: i <= St ? { top: 0, width: "100%", height: "100%" } : void 0,
+      className: i <= St ? "k-adaptive-actionsheet k-actionsheet-fullscreen" : "k-adaptive-actionsheet k-actionsheet-bottom"
+    };
+    return /* @__PURE__ */ o.createElement(o.Fragment, null, /* @__PURE__ */ o.createElement(Yt, { ...m }, /* @__PURE__ */ o.createElement(Jt, { className: "k-text-center" }, /* @__PURE__ */ o.createElement("div", { className: "k-actionsheet-titlebar-group k-hbox" }, /* @__PURE__ */ o.createElement("div", { className: "k-actionsheet-title" }, /* @__PURE__ */ o.createElement("div", null, r)), /* @__PURE__ */ o.createElement("div", { className: "k-actionsheet-actions" }, /* @__PURE__ */ o.createElement(
+      Te,
+      {
+        tabIndex: 0,
+        "aria-label": "Cancel",
+        "aria-disabled": "false",
+        type: "button",
+        fillMode: "flat",
+        onClick: this.toggleBtnClick,
+        icon: "x",
+        svgIcon: at
+      }
+    ))), /* @__PURE__ */ o.createElement("div", { className: "k-actionsheet-titlebar-group k-actionsheet-filter" }, this.renderMobileListFilter())), /* @__PURE__ */ o.createElement(lt, { className: "!k-overflow-hidden" }, /* @__PURE__ */ o.createElement("div", { className: "k-list-container" }, /* @__PURE__ */ o.createElement("div", { className: B(
+      {
+        ["k-list"]: !c,
+        ["k-list-lg"]: !0,
+        ["k-virtual-list"]: d,
+        ["k-data-table"]: c,
+        [`k-table-${bt[s] || s}`]: c && s
+      }
+    ) }, t && /* @__PURE__ */ o.createElement("div", { className: "k-table-header" }, t), !c && g && n.length !== 0 && /* @__PURE__ */ o.createElement(We, { group: g, groupMode: p, render: h }), this.renderList(), e && /* @__PURE__ */ o.createElement("div", { className: "k-list-footer" }, e))))));
+  }
+  renderListContainer() {
+    const i = this.base, { dir: t, header: e, footer: s, data: n = [], groupField: a, groupMode: p, size: c, list: d, virtual: r, groupStickyHeaderItemRender: h } = this.props, u = this.props.opened !== void 0 ? this.props.opened : this.state.opened, g = i.getPopupSettings(), m = g.width !== void 0 ? g.width : i.popupWidth;
+    let { group: v } = this.state;
+    return v === void 0 && a !== void 0 && (v = V(n[0], a)), /* @__PURE__ */ o.createElement(
+      Et,
+      {
+        width: m,
+        popupSettings: {
+          animate: g.animate,
+          anchor: this.element,
+          show: u,
+          popupClass: B(
+            g.popupClass,
+            "k-list-container",
+            "k-combobox-popup"
+          ),
+          className: g.className,
+          appendTo: g.appendTo
+        },
+        dir: t !== void 0 ? t : this.base.dirCalculated,
+        itemsCount: [n.length]
+      },
+      /* @__PURE__ */ o.createElement("div", { className: B(
+        {
+          ["k-list"]: !d,
+          [`k-list-${bt[c] || c}`]: !d && c,
+          ["k-virtual-list"]: r,
+          ["k-data-table"]: d,
+          [`k-table-${bt[c] || c}`]: d && c
+        }
+      ) }, e && /* @__PURE__ */ o.createElement("div", { className: "k-table-header" }, e), !d && v && n.length !== 0 && /* @__PURE__ */ o.createElement(We, { group: v, groupMode: p, render: h }), this.renderList(), s && /* @__PURE__ */ o.createElement("div", { className: B(
+        {
+          ["k-list-footer"]: !this.props.footerClassName
+        },
+        this.props.footerClassName
+      ) }, s))
+    );
+  }
+  renderList() {
+    const i = this.base, {
+      textField: t,
+      dataItemKey: e,
+      listNoDataRender: s,
+      itemRender: n,
+      groupHeaderItemRender: a,
+      data: p = [],
+      virtual: c = { skip: 0, total: void 0 }
+    } = this.props, d = i.getPopupSettings(), r = i.vs, h = c.skip, u = this.props.opened !== void 0 ? this.props.opened : this.state.opened, g = `translateY(${r.translate}px)`, m = u ? this.getFocusedIndex() : void 0, v = this.props.filter !== void 0 ? this.props.filter : this.state.text, b = V(this.value, t), w = G(v) && v !== b ? null : this.value, S = this.props.list || Ue;
+    return /* @__PURE__ */ o.createElement(
+      S,
+      {
+        id: i.listBoxId,
+        virtual: !!c,
+        show: u,
+        data: p,
+        focusedIndex: m,
+        value: w,
+        textField: t,
+        valueField: e,
+        groupField: this.props.groupField,
+        groupMode: this.props.groupMode,
+        isMultiColumn: this.props.isMultiColumn,
+        optionsGuid: i.guid,
+        listRef: (D) => {
+          r.list = this.base.list = D, this.itemHeight = 0;
+        },
+        wrapperStyle: this.state.windowWidth && this.state.windowWidth > Se ? { maxHeight: d.height } : {},
+        wrapperCssClass: B(
+          "k-list-content",
+          {
+            ["k-list-scroller"]: !c
+          }
+        ),
+        listStyle: r.enabled ? { transform: g } : void 0,
+        key: "listkey",
+        skip: h,
+        onClick: this.handleItemClick,
+        itemRender: n,
+        groupHeaderItemRender: a,
+        noDataRender: s,
+        onMouseDown: (D) => D.preventDefault(),
+        onScroll: this.onScroll,
+        wrapperRef: r.scrollerRef,
+        scroller: this.base.renderScrollElement(),
+        ariaSetSize: c.total
+      }
+    );
+  }
+  renderSearchBar(i, t, e) {
+    const {
+      tabIndex: s,
+      disabled: n,
+      data: a = [],
+      dataItemKey: p,
+      virtual: c = { skip: 0 }
+    } = this.props, d = this.props.opened !== void 0 ? this.props.opened : this.state.opened, r = this.value, h = Math.max(0, a.findIndex((u) => R(u, r, p)));
+    return this._suggested && !R(this._valueOnDidUpdate, r, p) && (this._suggested = ""), /* @__PURE__ */ o.createElement(
+      Zt,
+      {
+        id: t,
+        readOnly: d && this.mobileMode,
+        placeholder: e,
+        tabIndex: s,
+        title: this.props.title,
+        accessKey: this.props.accessKey,
+        value: i + this._suggested,
+        suggestedText: this._suggested,
+        ref: (u) => this._input = u && u.input,
+        onClick: this.onInputClick,
+        onKeyDown: this.onInputKeyDown,
+        onChange: this.inputOnChange,
+        onFocus: this.base.handleFocus,
+        onBlur: this.handleBlur,
+        disabled: n,
+        expanded: d,
+        owns: this.base.listBoxId,
+        activedescendant: `option-${this.base.guid}-${h + c.skip}`,
+        role: "combobox",
+        ariaLabelledBy: this.props.ariaLabelledBy,
+        ariaDescribedBy: this.props.ariaDescribedBy,
+        ariaRequired: this.required,
+        render: this.props.valueRender
+      }
+    );
+  }
+  clearValue() {
+    const i = this.base.initState();
+    this._suggested = "", this.base.filterChanged("", i), this.props.filter === void 0 && this.state.text !== void 0 && (i.data.text = void 0), this.triggerOnChange(null, i);
+    const t = this.props.opened !== void 0 ? this.props.opened : this.state.opened, e = this.mobileMode;
+    t && !e && this.base.togglePopup(i), this.applyState(i);
+  }
+  triggerOnChange(i, t) {
+    const e = this.value;
+    !G(e) && !G(i) || R(e, i, this.props.dataItemKey) || (this.props.value === void 0 && (t.data.value = i), this._valueDuringOnChange = i, t.events.push({ type: "onChange" }));
+  }
+  getFocusedIndex() {
+    const i = this.value, { data: t = [], textField: e, dataItemKey: s, virtual: n = { skip: 0 }, focusedItemIndex: a = Ve, skipDisabledItems: p } = this.props, c = this.props.filter ? this.props.filter : this.state.text;
+    return G(i) && c === void 0 ? t.findIndex((d) => R(d, i, s)) : c ? a(t, c, e) : p && e && !c && n.skip === 0 ? t.findIndex((d) => !d.disabled && d[e]) : n.skip === 0 ? 0 : -1;
+  }
+  suggestValue(i) {
+    const { data: t, textField: e } = this.props;
+    this._suggested = zs(i, t, e);
+  }
+  applyState(i) {
+    this.base.applyState(i), this._valueDuringOnChange = void 0;
+  }
+  calculateMedia(i) {
+    for (let t of i)
+      this.setState({ windowWidth: t.target.clientWidth });
+  }
+};
+let dt = It;
+dt.displayName = "ComboBox";
+dt.propTypes = {
+  ...ie.propTypes,
+  size: l.oneOf([null, "small", "medium", "large"]),
+  rounded: l.oneOf([null, "small", "medium", "large", "full"]),
+  fillMode: l.oneOf([null, "solid", "flat", "outline"]),
+  dataItemKey: l.string,
+  groupField: l.string,
+  groupMode: l.oneOf([void 0, "classic", "modern"]),
+  isMultiColumn: l.bool,
+  suggest: l.bool,
+  placeholder: l.string,
+  title: l.string,
+  allowCustom: l.bool,
+  clearButton: l.bool,
+  iconClassName: l.string,
+  svgIcon: gs,
+  validationMessage: l.string,
+  required: l.bool,
+  id: l.string,
+  ariaLabelledBy: l.string,
+  ariaDescribedBy: l.string,
+  list: l.any,
+  valueRender: l.func,
+  skipDisabledItems: l.bool
+};
+dt.defaultProps = {
+  ...ie.defaultProps,
+  size: "medium",
+  rounded: "medium",
+  fillMode: "solid",
+  allowCustom: !1,
+  clearButton: !0,
+  required: !1,
+  groupMode: "modern",
+  isMultiColumn: !1,
+  skipDisabledItems: !0
+};
+const ti = Ke(), bs = wt(ti, dt);
+bs.displayName = "KendoReactComboBox";
+const si = "Please enter a valid value!", { sizeMap: ls, roundedMap: ii } = $e, Wt = class extends o.Component {
+  constructor(i) {
+    super(i), this.state = {}, this.base = new ie(this), this._element = null, this._inputId = Fe(), this._suggested = "", this._input = null, this._isScrolling = !1, this.itemHeight = 0, this.focus = () => {
+      this._input && this._input.focus();
+    }, this.handleItemSelect = (t, e) => {
+      const { data: s = [] } = this.props, n = V(s[t], this.props.textField);
+      this.triggerOnChange(n, e);
+    }, this.itemFocus = (t, e) => {
+      const { data: s = [], textField: n } = this.props, a = s[t];
+      R(this.state.focusedItem, a, n) || (e.data.focusedItem = a);
+    }, this.togglePopup = (t) => {
+      this.base.togglePopup(t);
+    }, this.setValidity = () => {
+      this._input && this._input.setCustomValidity && this._input.setCustomValidity(
+        this.validity.valid ? "" : this.props.validationMessage || si
+      );
+    }, this.onScroll = (t) => {
+      this._isScrolling = !0;
+      const { list: e } = this.base, { groupField: s } = this.props;
+      let { data: n = [] } = this.props;
+      if (!s || !n.length)
+        return;
+      const a = this.itemHeight || (e ? e.children[0].offsetHeight : 0), c = t.target.scrollTop;
+      s && (n = this.base.getGroupedDataModernMode(n, s));
+      let d = n[0][s];
+      for (let r = 1; r < n.length && !(a * r > c); r++)
+        n[r] && n[r][s] && (d = n[r][s]);
+      d !== this.state.group && this.setState({
+        group: d
+      });
+    }, this.handleItemClick = (t, e) => {
+      this.base.handleItemClick(t, e), this._valueDuringOnChange = void 0;
+    }, this.onChangeHandler = (t) => {
+      const s = this.base.initState(), n = t.currentTarget, a = n.value, p = n.selectionEnd === a.length;
+      s.syntheticEvent = t;
+      const c = this._suggested, d = this.value, r = d && d.substring(0, d.length - c.length), h = r && r === a, u = r && r.length > a.length, { suggest: g } = this.props, m = this.props.opened !== void 0 ? this.props.opened : this.state.opened;
+      if (g !== void 0 && g !== !1) {
+        h || u || !p ? this._suggested = "" : this.suggestValue(a);
+        const v = a + this._suggested, b = { userInput: a, value: this._suggested };
+        this.triggerOnChange(v, s, { suggestion: b });
+      } else
+        this._suggested = "", this.triggerOnChange(a, s);
+      (!m && a || m && !a) && this.togglePopup(s), s.data.focusedItem = void 0, this.applyState(s), this.setState({ group: void 0 });
+    }, this.clearButtonClick = (t) => {
+      const s = this.base.initState(), n = this.props.opened !== void 0 ? this.props.opened : this.state.opened;
+      s.syntheticEvent = t;
+      const a = "";
+      this._suggested = "", this.triggerOnChange(a, s), this.state.focusedItem !== void 0 && (s.data.focusedItem = void 0), n && this.togglePopup(s), this.applyState(s);
+    }, this.onInputKeyDown = (t) => {
+      const { data: e = [], skipDisabledItems: s, groupField: n, textField: a } = this.props;
+      this._isScrolling && (this._isScrolling = !1);
+      const p = this.focusedIndex(), c = e[p], d = t.keyCode, r = t.altKey, h = this.props.opened !== void 0 ? this.props.opened : this.state.opened, u = this.base.initState();
+      u.syntheticEvent = t;
+      const g = () => {
+        h && t.preventDefault();
+      };
+      if (r && d === f.down)
+        this.setState({
+          opened: !0
+        });
+      else if (r && d === f.up)
+        this.setState({
+          opened: !1
+        });
+      else if (h && d === f.pageUp)
+        this.base.scrollPopupByPageSize(-1);
+      else if (h && d === f.pageDown)
+        this.base.scrollPopupByPageSize(1);
+      else if (h && (d === f.enter || d === f.esc))
+        g(), s === !1 && c && c.disabled ? (h && this.togglePopup(u), this.applyState(u)) : this.applyInputValue(t.currentTarget.value, u, t.keyCode);
+      else if (!h && d === f.esc) {
+        const m = "";
+        this._suggested = "", this.triggerOnChange(m, u), this.state.focusedItem !== void 0 && (u.data.focusedItem = void 0), this.applyState(u);
+      } else if (d === f.up || d === f.down) {
+        if (n !== "" && a)
+          if (!this.props.skipDisabledItems && h)
+            this.onNavigate(u, d);
+          else {
+            let m = 0;
+            if (d === f.down || d === f.right) {
+              const v = e.slice(p + 1).find((b) => !b.disabled && b[a]);
+              m = v && e.findIndex((b) => b[a] === v[a]);
+            } else if (d === f.up || d === f.left) {
+              let v;
+              if (p === -1)
+                v = e, m = e.findIndex((b) => !b.disabled && b[a]);
+              else {
+                v = e.slice(0, p);
+                let b = v.pop();
+                for (; b && b.disabled; )
+                  b = v.pop();
+                m = b && e.findIndex((w) => w[a] === b[a]);
+              }
+            }
+            if (m !== void 0) {
+              const v = m - p;
+              this.onNavigate(u, d, v);
+            } else
+              m === void 0 && e.findIndex((v) => v[a]) === e.length - 1 && this.onNavigate(u, d);
+          }
+        else if (!this.props.skipDisabledItems && h)
+          this.onNavigate(u, d);
+        else {
+          let m = null;
+          if (d === f.down || d === f.right)
+            m = e.slice(p + 1).find((v) => !v.disabled);
+          else if (d === f.up || d === f.left) {
+            const v = e.slice(0, p);
+            for (m = v.pop(); m && m.disabled; )
+              m = v.pop();
+          }
+          if (m) {
+            const v = m.id - p - 1;
+            this.onNavigate(u, d, v);
+          } else
+            this.onNavigate(u, d);
+        }
+        this.applyState(u), g();
+      }
+    }, this.handleBlur = (t) => {
+      if (this.state.focused) {
+        const e = this.base.initState();
+        e.data.focused = !1, e.events.push({ type: "onBlur" }), e.syntheticEvent = t, this.applyInputValue(t.currentTarget.value, e);
+      }
+    }, qe(je);
+  }
+  /**
+   * @hidden
+   */
+  get element() {
+    return this._element;
+  }
+  /**
+   * The value of the AutoComplete.
+   */
+  get value() {
+    return this._valueDuringOnChange !== void 0 ? this._valueDuringOnChange : this.props.value !== void 0 ? this.props.value : this.state.value !== void 0 ? this.state.value : this.props.defaultValue !== void 0 ? this.props.defaultValue : "";
+  }
+  /**
+   * Gets the `name` property of the AutoComplete.
+   */
+  get name() {
+    return this.props.name;
+  }
+  /**
+   * Represents the validity state into which the AutoComplete is set.
+   */
+  get validity() {
+    const i = this.props.validationMessage !== void 0, t = !this.required || this.value !== "", e = this.props.valid !== void 0 ? this.props.valid : t;
+    return {
+      customError: i,
+      valid: e,
+      valueMissing: this.value === null
+    };
+  }
+  /**
+   * @hidden
+   */
+  get validityStyles() {
+    return this.props.validityStyles !== void 0 ? this.props.validityStyles : Wt.defaultProps.validityStyles;
+  }
+  /**
+   * @hidden
+   */
+  get required() {
+    return this.props.required !== void 0 ? this.props.required : Wt.defaultProps.required;
+  }
+  /**
+   * @hidden
+   */
+  componentDidUpdate(i, t) {
+    var g;
+    const { groupField: e = "", data: s = [] } = this.props, { data: n = [] } = i, a = this.focusedIndex(), p = s[a], c = n !== s, d = p !== void 0 && t.focusedItem !== p, r = this.props.opened !== void 0 ? this.props.opened : this.state.opened, h = i.opened !== void 0 ? i.opened : t.opened, u = !h && r;
+    if (e === "")
+      (r && (d || c) || u) && this.base.scrollToItem(a);
+    else if (!this._isScrolling) {
+      let m = (g = this.base.getGroupedDataModernMode(s, e)) == null ? void 0 : g.indexOf(p);
+      u && (s && s.length !== 0 && this.base.resetGroupStickyHeader(s[0][e], this), this.base.scrollToItem(m)), r && h && d && this.base.scrollToItem(m);
+    }
+    this.setValidity();
+  }
+  /**
+   * @hidden
+   */
+  componentDidMount() {
+    this.base.didMount(), this.setValidity();
+  }
+  /**
+   * @hidden
+   */
+  render() {
+    const { dir: i, disabled: t, label: e, className: s, style: n, loading: a, suggest: p, size: c, rounded: d, fillMode: r } = this.props, h = !this.validityStyles || this.validity.valid, u = this.base, g = this.value, m = this.props.clearButton !== !1 && !a && !!g, v = this.props.id || this._inputId;
+    typeof p == "string" && (this._suggested = p);
+    const b = /* @__PURE__ */ o.createElement(
+      "span",
+      {
+        className: B(
+          "k-autocomplete k-input",
+          s,
+          {
+            [`k-input-${ls[c] || c}`]: c,
+            [`k-rounded-${ii[d] || d}`]: d,
+            [`k-input-${r}`]: r,
+            "k-invalid": !h,
+            "k-loading": a,
+            "k-required": this.required,
+            "k-disabled": t
+          }
+        ),
+        ref: (w) => {
+          this._element = w, u.wrapper = w;
+        },
+        style: e ? { ...n, width: void 0 } : n,
+        dir: i
+      },
+      this.renderSearchBar(g || "", v),
+      a && /* @__PURE__ */ o.createElement(ke, { className: "k-input-loading-icon", name: "loading" }),
+      m && !a && /* @__PURE__ */ o.createElement(rt, { onClick: this.clearButtonClick, key: "clearbutton" }),
+      this.renderListContainer()
+    );
+    return e ? /* @__PURE__ */ o.createElement(
+      Ge,
+      {
+        label: e,
+        editorId: v,
+        editorValue: g,
+        editorValid: h,
+        editorDisabled: t,
+        style: { width: n ? n.width : void 0 },
+        children: b
+      }
+    ) : b;
+  }
+  /**
+   * @hidden
+   */
+  onNavigate(i, t, e) {
+    const s = this.value, { data: n = [], textField: a, focusedItemIndex: p } = this.props, c = this.state.focusedItem !== void 0 ? n.findIndex((r) => R(r, this.state.focusedItem, a)) : p ? p(n, s, a) : n.indexOf(as(n, s, a)), d = this.base.navigation.navigate({
+      keyCode: t,
+      current: c,
+      max: n.length - 1,
+      min: 0,
+      skipItems: e || void 0
+    });
+    d !== void 0 && this.itemFocus(d, i), this.applyState(i);
+  }
+  /**
+   * @hidden
+   */
+  applyInputValue(i, t, e) {
+    const s = this.props.opened !== void 0 ? this.props.opened : this.state.opened, { data: n = [], textField: a } = this.props, p = this.focusedIndex(), c = n[p];
+    if (this._suggested = "", s && e === f.enter && c && !c.disabled) {
+      const d = V(n[this.focusedIndex(i)], a);
+      this.triggerOnChange(d, t);
+    }
+    s && this.togglePopup(t), this.applyState(t);
+  }
+  renderSearchBar(i, t) {
+    const e = this.base, { placeholder: s, tabIndex: n, disabled: a, readonly: p } = this.props, { focused: c } = this.state, d = this.props.opened !== void 0 ? this.props.opened : this.state.opened;
+    return /* @__PURE__ */ o.createElement(
+      Zt,
+      {
+        id: t,
+        placeholder: s,
+        tabIndex: n,
+        accessKey: this.props.accessKey,
+        value: i,
+        suggestedText: this._suggested,
+        focused: c,
+        name: this.props.name,
+        ref: (r) => this._input = r && r.input,
+        onKeyDown: this.onInputKeyDown,
+        onChange: this.onChangeHandler,
+        onFocus: e.handleFocus,
+        onBlur: this.handleBlur,
+        disabled: a,
+        readOnly: p,
+        expanded: d,
+        owns: e.listBoxId,
+        activedescendant: "option-" + e.guid + "-" + this.focusedIndex(),
+        role: "combobox",
+        ariaLabelledBy: this.props.ariaLabelledBy,
+        ariaDescribedBy: this.props.ariaDescribedBy,
+        ariaRequired: this.required,
+        render: this.props.valueRender
+      }
+    );
+  }
+  renderListContainer() {
+    const i = this.base, {
+      dir: t,
+      header: e,
+      footer: s,
+      data: n = [],
+      size: a,
+      groupField: p,
+      list: c,
+      groupStickyHeaderItemRender: d
+    } = this.props, r = i.getPopupSettings(), h = this.props.opened !== void 0 ? this.props.opened : this.state.opened, u = r.width !== void 0 ? r.width : i.popupWidth;
+    let { group: g } = this.state;
+    return g === void 0 && p !== void 0 && (g = V(n[0], p)), /* @__PURE__ */ o.createElement(
+      Et,
+      {
+        width: u,
+        popupSettings: {
+          animate: r.animate,
+          anchor: this.element,
+          show: h,
+          popupClass: B(
+            r.popupClass,
+            "k-list-container",
+            "k-autocomplete-popup"
+          ),
+          className: r.className,
+          appendTo: r.appendTo
+        },
+        dir: t !== void 0 ? t : this.base.dirCalculated,
+        itemsCount: [n.length]
+      },
+      e && /* @__PURE__ */ o.createElement("div", { className: "k-list-header" }, e),
+      /* @__PURE__ */ o.createElement(
+        "div",
+        {
+          className: B(
+            "k-list",
+            {
+              [`k-list-${ls[a] || a}`]: a
+            }
+          )
+        },
+        !c && g && n.length !== 0 && /* @__PURE__ */ o.createElement(We, { group: g, groupMode: "modern", render: d }),
+        this.renderList()
+      ),
+      s && /* @__PURE__ */ o.createElement("div", { className: "k-list-footer" }, s)
+    );
+  }
+  renderList() {
+    const i = this.base, t = i.getPopupSettings(), {
+      textField: e,
+      data: s = [],
+      listNoDataRender: n,
+      itemRender: a,
+      groupHeaderItemRender: p
+    } = this.props, c = this.value, d = this.props.opened !== void 0 ? this.props.opened : this.state.opened;
+    return /* @__PURE__ */ o.createElement(
+      Ue,
+      {
+        id: i.listBoxId,
+        show: d,
+        data: s.slice(),
+        focusedIndex: this.focusedIndex(),
+        value: c,
+        textField: e,
+        valueField: e,
+        highlightSelected: !1,
+        optionsGuid: i.guid,
+        groupField: this.props.groupField,
+        groupMode: "modern",
+        listRef: (r) => i.list = r,
+        wrapperStyle: { maxHeight: t.height },
+        wrapperCssClass: "k-list-content",
+        onClick: this.handleItemClick,
+        itemRender: a,
+        groupHeaderItemRender: p,
+        noDataRender: n,
+        onMouseDown: (r) => r.preventDefault(),
+        onScroll: this.onScroll
+      }
+    );
+  }
+  triggerOnChange(i, t, e) {
+    this.value === i && !e || (t.data.value = i, this._valueDuringOnChange = i, t.events.push({ type: "onChange", ...e || {} }));
+  }
+  applyState(i) {
+    this.base.applyState(i), this._valueDuringOnChange = void 0;
+  }
+  suggestValue(i) {
+    if (this._suggested = "", i) {
+      const { data: t = [], textField: e } = this.props, s = t[Ve(t, i, e)];
+      if (s) {
+        const n = V(s, e);
+        i.toLowerCase() !== n.toLowerCase() && (this._suggested = n.substring(i.length));
+      }
+    }
+  }
+  focusedIndex(i) {
+    const { data: t = [], textField: e, focusedItemIndex: s, skipDisabledItems: n } = this.props, a = i !== void 0 ? i : this.value;
+    if (this.state.focusedItem !== void 0)
+      return t.findIndex((p) => R(p, this.state.focusedItem, e));
+    if (s)
+      return s(t, a, e);
+    {
+      const p = t.indexOf(as(t, a, e));
+      return n && e && p === -1 ? t.findIndex((c) => !c.disabled && c[e]) : Math.max(0, p);
+    }
+  }
+};
+let Tt = Wt;
+Tt.displayName = "AutoComplete";
+Tt.propTypes = {
+  ...ie.basicPropTypes,
+  size: l.oneOf([null, "small", "medium", "large"]),
+  rounded: l.oneOf([null, "small", "medium", "large", "full"]),
+  fillMode: l.oneOf([null, "solid", "flat", "outline"]),
+  groupField: l.string,
+  suggest: l.oneOfType([l.bool, l.string]),
+  placeholder: l.string,
+  value: l.string,
+  defaultValue: l.string,
+  validationMessage: l.string,
+  required: l.bool,
+  readonly: l.bool,
+  clearButton: l.bool,
+  valueRender: l.func,
+  id: l.string,
+  ariaLabelledBy: l.string,
+  ariaDescribedBy: l.string,
+  list: l.any,
+  skipDisabledItems: l.bool
+};
+Tt.defaultProps = {
+  ...ie.defaultProps,
+  size: "medium",
+  rounded: "medium",
+  fillMode: "solid",
+  skipDisabledItems: !0
+};
+const ni = Ke(), oi = wt(ni, Tt);
+oi.displayName = "KendoReactAutoComplete";
+const ai = (i) => i.syntheticEvent.preventDefault(), li = (i) => i.syntheticEvent.stopPropagation();
+class ys extends o.Component {
+  render() {
+    const { data: t, guid: e, focused: s, tagRender: n, tag: a, onTagDelete: p, size: c } = this.props;
+    return /* @__PURE__ */ o.createElement(o.Fragment, null, t.map((d, r) => {
+      const h = a ? /* @__PURE__ */ o.createElement(
+        a,
+        {
+          key: d.text + r,
+          tagData: d,
+          guid: e,
+          focusedTag: s,
+          onTagDelete: p
+        }
+      ) : /* @__PURE__ */ o.createElement(
+        _s,
+        {
+          id: `tag-${e}-${d.text.replace(/\s+/g, "-")}`,
+          "aria-selected": !0,
+          role: "option",
+          "aria-setsize": t.length,
+          key: d.text + r,
+          text: d.text,
+          removable: !0,
+          onRemove: (u) => p.call(void 0, d.data, u.syntheticEvent),
+          onMouseDown: ai,
+          onClick: li,
+          className: d === s ? "k-focus" : void 0,
+          size: c
+        }
+      );
+      return n ? n(d, h) : h;
+    }), this.props.children);
+  }
+}
+var st = /* @__PURE__ */ ((i) => (i[i.PopupList = 0] = "PopupList", i[i.TagsList = 1] = "TagsList", i))(st || {});
+const rs = 500, es = (i) => {
+  const {
+    footer: t,
+    children: e,
+    windowWidth: s = 0,
+    navigatable: n,
+    navigatableElements: a,
+    expand: p,
+    animation: c,
+    onClose: d,
+    adaptiveTitle: r,
+    mobileFilter: h
+  } = i, u = {
+    navigatable: n || !1,
+    navigatableElements: a || [],
+    expand: p,
+    animation: c !== !1,
+    onClose: d,
+    animationStyles: s <= rs ? { top: 0, width: "100%", height: "100%" } : void 0,
+    className: s <= rs ? "k-adaptive-actionsheet k-actionsheet-fullscreen" : "k-adaptive-actionsheet k-actionsheet-bottom"
+  };
+  return /* @__PURE__ */ o.createElement(Yt, { ...u }, /* @__PURE__ */ o.createElement(Jt, { className: "k-text-center" }, /* @__PURE__ */ o.createElement("div", { className: "k-actionsheet-titlebar-group k-hbox" }, /* @__PURE__ */ o.createElement("div", { className: "k-actionsheet-title" }, /* @__PURE__ */ o.createElement("div", null, r)), /* @__PURE__ */ o.createElement("div", { className: "k-actionsheet-actions" }, /* @__PURE__ */ o.createElement(
+    Te,
+    {
+      tabIndex: 0,
+      "aria-label": "Cancel",
+      "aria-disabled": "false",
+      type: "button",
+      fillMode: "flat",
+      icon: "x",
+      svgIcon: at,
+      onClick: d
+    }
+  ))), h && /* @__PURE__ */ o.createElement("div", { className: "k-actionsheet-titlebar-group k-actionsheet-filter" }, h)), e, t && /* @__PURE__ */ o.createElement(Rs, { className: "k-actions k-actions-stretched" }, /* @__PURE__ */ o.createElement(
+    Te,
+    {
+      size: "large",
+      tabIndex: 0,
+      "aria-label": t.cancelText,
+      "aria-disabled": "false",
+      type: "button",
+      onClick: t.onCancel
+    },
+    t.cancelText
+  ), /* @__PURE__ */ o.createElement(
+    Te,
+    {
+      tabIndex: 0,
+      themeColor: "primary",
+      size: "large",
+      "aria-label": t.applyText,
+      "aria-disabled": "false",
+      type: "button",
+      onClick: t.onApply
+    },
+    t.applyText
+  )));
+}, { sizeMap: yt, roundedMap: ri } = $e, di = "Please enter a valid value!", ds = (i) => i.preventDefault(), cs = (i) => i === 2, qt = class extends o.Component {
+  constructor(i) {
+    super(i), this.state = {
+      activedescendant: st.PopupList,
+      currentValue: []
+    }, this._element = null, this._valueItemsDuringOnChange = null, this._inputId = Fe(), this.base = new ie(this), this._tags = [], this._input = null, this._adaptiveInput = null, this._skipFocusEvent = !1, this._lastSelectedOrDeslectedItemIndex = null, this.itemHeight = 0, this.scrollToFocused = !1, this.localization = null, this.focus = () => {
+      this._input && this._input.focus();
+    }, this.handleItemSelect = (t, e) => {
+      const { data: s = [], dataItemKey: n, virtual: a } = this.props, p = a ? a.skip : 0, c = s[t - p], d = this.value.findIndex((u) => R(u, c, n));
+      this._lastSelectedOrDeslectedItemIndex = s.findIndex((u) => R(u, c, n));
+      let r = [];
+      d !== -1 ? (r = this.value, r.splice(d, 1)) : r = [...this.value, c], (this.props.filter !== void 0 ? this.props.filter : this.state.text) && !this.mobileMode && (this.state.text && (e.data.text = ""), this.base.filterChanged("", e)), this._adaptiveInput && this._adaptiveInput.blur(), this.state.focusedIndex !== void 0 && (e.data.focusedIndex = void 0), this.triggerOnChange(r, e), this.base.triggerPageChangeCornerItems(c, e);
+    }, this.onTagDelete = (t, e) => {
+      const s = this.base.initState();
+      s.syntheticEvent = e, this.opened && this.base.togglePopup(s), !this.state.focused && !this.mobileMode && (s.data.focused = !0, this.focus());
+      const n = this.value;
+      vt(n, t, this.props.dataItemKey), this.triggerOnChange(n, s), this.applyState(s);
+    }, this.itemFocus = (t, e) => {
+      const { data: s = [], allowCustom: n, virtual: a } = this.props, p = a ? a.skip : 0, c = this.props.filter !== void 0 ? this.props.filter : this.state.text, { focusedIndex: d } = this.getFocusedState(), r = n && c, h = s[t - p];
+      h && d !== t ? this.state.focusedIndex !== t && (e.data.focusedIndex = t, e.data.activedescendant = st.PopupList) : r && t === -1 && this.state.focusedIndex !== void 0 && (e.data.focusedIndex = void 0), this.base.triggerPageChangeCornerItems(h, e);
+    }, this.componentRef = (t) => {
+      this._element = t, this.base.wrapper = t;
+    }, this.searchbarRef = (t) => {
+      const e = this._input = t && t.input;
+      e && this.state.focused && window.setTimeout(() => e.focus(), 0);
+    }, this.onChangeHandler = (t) => {
+      const e = this.base.initState(), s = t.target.value;
+      e.syntheticEvent = t, this.props.filter === void 0 && (e.data.text = s), e.data.focusedIndex = void 0, this.opened || (this.base.togglePopup(e), this.setState({ currentValue: this.value })), this.base.filterChanged(s, e), this.applyState(e), this.setState({ group: void 0 });
+    }, this.clearButtonClick = (t) => {
+      const e = this.base.initState();
+      e.syntheticEvent = t, t.stopPropagation(), this.value.length > 0 && this.triggerOnChange([], e), this.state.focusedIndex !== void 0 && (e.data.focusedIndex = void 0), this.opened && this.base.togglePopup(e);
+      const s = this.props.filter !== void 0 ? this.props.filter : this.state.text;
+      G(s) && s !== "" && this.base.filterChanged("", e), this.state.text && (e.data.text = ""), this._lastSelectedOrDeslectedItemIndex = null, this.applyState(e);
+    }, this.onInputKeyDown = (t) => {
+      const { data: e = [], textField: s, groupField: n } = this.props, a = t.keyCode, p = this.props.filter !== void 0 ? this.props.filter : this.state.text, c = this.props.opened !== void 0 ? this.props.opened : this.state.opened, { focusedItem: d, focusedIndex: r } = this.getFocusedState(), h = this.base.initState();
+      if (h.syntheticEvent = t, !p && this.value.length > 0 && (a === f.left || a === f.right || a === f.home || a === f.end || a === f.delete || a === f.backspace) && !t.shiftKey)
+        return this.onTagsNavigate(t, h);
+      const u = () => {
+        t.preventDefault(), this.base.togglePopup(h), this.applyState(h);
+      };
+      if (this.opened)
+        if (a === f.pageUp)
+          this.base.scrollPopupByPageSize(-1);
+        else if (a === f.pageDown)
+          this.base.scrollPopupByPageSize(1);
+        else if ((t.ctrlKey || t.metaKey) && t.code === "KeyA") {
+          const m = (this.state.value && this.state.value.length) === e.length ? [] : e;
+          this.updateStateOnKeyboardNavigation(m, h);
+        } else if ((t.ctrlKey || t.metaKey) && t.shiftKey && t.keyCode === f.end) {
+          const g = e.slice(this.getFocusedState().focusedIndex);
+          this.itemFocus(e.length - 1, h), this.updateStateOnKeyboardNavigation(g, h);
+        } else if ((t.ctrlKey || t.metaKey) && t.shiftKey && t.keyCode === f.home) {
+          const g = e.slice(0, this.getFocusedState().focusedIndex + 1);
+          this.itemFocus(0, h), this.updateStateOnKeyboardNavigation(g, h);
+        } else if (t.shiftKey && t.keyCode === f.up) {
+          let g;
+          const m = this.getLastSelectedOrDeselectedIndex(1, r);
+          m === null ? g = r !== 0 ? e.slice(r - 1, r) : [e[r]] : m === r ? g = [e[m - 1]] : r >= 0 && (g = m > r ? e.slice(r - 1, m) : e.slice(m - 1, r)), g && g.length > 0 && (r >= 1 && this.itemFocus(r - 1, h), this.updateStateOnKeyboardNavigation(g, h));
+        } else if (t.shiftKey && t.keyCode === f.down) {
+          let g;
+          const m = this.getLastSelectedOrDeselectedIndex(0, r);
+          m === null ? g = r !== e.length - 1 ? e.slice(r, r + 1) : [e[r]] : m === r ? g = e.slice(r, r + 2) : r >= 0 && (g = m > r ? e.slice(r + 1, m + 1) : e.slice(m, r + 2)), g && g.length >= 1 && (this.itemFocus(r + 1, h), this.updateStateOnKeyboardNavigation(g, h));
+        } else if (t.altKey && a === f.up)
+          u();
+        else if (a === f.up || a === f.down) {
+          if (n !== "" && s)
+            if (!this.props.skipDisabledItems && c)
+              this.onNavigate(h, a);
+            else {
+              let g = 0;
+              if (a === f.down || a === f.right) {
+                const m = e.slice(r + 1).find((v) => !v.disabled && v[s]);
+                g = m && e.findIndex((v) => v[s] === m[s]);
+              } else if (a === f.up || a === f.left) {
+                let m;
+                if (r === -1)
+                  m = e, g = e.findIndex((v) => !v.disabled && v[s]);
+                else {
+                  m = e.slice(0, r);
+                  let v = m.pop();
+                  for (; v && v.disabled; )
+                    v = m.pop();
+                  g = v && e.findIndex((b) => b[s] === v[s]);
+                }
+              }
+              if (g) {
+                const m = g - r;
+                this.onNavigate(h, a, m);
+              } else
+                g !== void 0 && this.onNavigate(h, a);
+            }
+          else if (!this.props.skipDisabledItems && c)
+            this.onNavigate(h, a);
+          else {
+            let g = null;
+            if (a === f.down || a === f.right)
+              g = e.slice(r + 1).find((m) => !m.disabled);
+            else if (a === f.up || a === f.left) {
+              const m = e.slice(0, r);
+              for (g = m.pop(); g && g.disabled; )
+                g = m.pop();
+            }
+            if (g) {
+              const m = g.id - r - 1;
+              this.onNavigate(h, a, m);
+            } else
+              this.onNavigate(h, a);
+          }
+          this.applyState(h), t.preventDefault();
+        } else
+          a === f.enter ? (t.preventDefault(), this.props.allowCustom && p && d === null ? this.customItemSelect(t) : d && d.disabled ? u() : this.selectFocusedItem(t)) : a === f.esc && u();
+      else
+        t.altKey && a === f.down && u();
+    }, this.listContainerContent = () => {
+      const { header: t, footer: e, allowCustom: s, size: n, data: a = [], groupStickyHeaderItemRender: p, groupField: c, list: d } = this.props, r = this.props.filter !== void 0 ? this.props.filter : this.state.text, { focusedType: h } = this.getFocusedState(), u = s && r && /* @__PURE__ */ o.createElement(
+        "div",
+        {
+          className: B("k-list", {
+            [`k-list-${yt[n] || n}`]: n
+          }),
+          key: "customitem",
+          onClick: this.customItemSelect,
+          onMouseDown: ds
+        },
+        /* @__PURE__ */ o.createElement(
+          "div",
+          {
+            className: B("k-list-item k-custom-item", { "k-focus": cs(h) }),
+            style: { fontStyle: "italic" }
+          },
+          r,
+          /* @__PURE__ */ o.createElement(ke, { name: "plus", icon: Ms, style: { position: "absolute", right: "0.5em" } })
+        )
+      );
+      let { group: g } = this.state;
+      return g === void 0 && c !== void 0 && (g = V(a[0], c)), /* @__PURE__ */ o.createElement(o.Fragment, null, t && /* @__PURE__ */ o.createElement("div", { className: "k-list-header" }, t), u, /* @__PURE__ */ o.createElement(
+        "div",
+        {
+          className: B(
+            "k-list",
+            {
+              [`k-list-${this.mobileMode ? "lg" : yt[n] || n}`]: n,
+              "k-virtual-list": this.base.vs.enabled
+            }
+          )
+        },
+        !d && g && a.length !== 0 && /* @__PURE__ */ o.createElement(We, { group: g, groupMode: "modern", render: p }),
+        this.renderList()
+      ), e && /* @__PURE__ */ o.createElement("div", { className: "k-list-footer" }, e));
+    }, this.renderListContainer = () => {
+      const t = this.base, { dir: e, data: s = [] } = this.props, n = this.base.getPopupSettings(), a = n.width !== void 0 ? n.width : t.popupWidth, p = {
+        dir: e !== void 0 ? e : t.dirCalculated,
+        width: a,
+        popupSettings: {
+          popupClass: B(
+            n.popupClass,
+            "k-list-container",
+            "k-multiselect-popup"
+          ),
+          className: n.className,
+          animate: n.animate,
+          anchor: this.element,
+          show: this.opened,
+          onOpen: this.onPopupOpened,
+          onClose: this.onPopupClosed,
+          appendTo: n.appendTo
+        },
+        itemsCount: [s.length, this.value.length]
+      };
+      return /* @__PURE__ */ o.createElement(Et, { ...p }, this.listContainerContent());
+    }, this.renderAdaptiveListContainer = () => {
+      const { adaptiveTitle: t, filterable: e, filter: s } = this.props, { windowWidth: n = 0 } = this.state, a = s !== void 0 ? s : this.state.text;
+      this.localization = Ae(this);
+      const p = e ? /* @__PURE__ */ o.createElement(
+        Be,
+        {
+          value: a,
+          ref: (d) => this._adaptiveInput = d && d.element,
+          onChange: this.onChangeHandler,
+          onKeyDown: this.onInputKeyDown,
+          size: this.props.size,
+          rounded: this.props.rounded,
+          fillMode: this.props.fillMode
+        }
+      ) : null, c = {
+        adaptiveTitle: t,
+        expand: this.opened,
+        onClose: (d) => this.onCancel(d),
+        windowWidth: n,
+        mobileFilter: p,
+        footer: {
+          cancelText: this.localization.toLanguageString(ot, le[ot]),
+          onCancel: this.onCancel,
+          applyText: this.localization.toLanguageString(nt, le[nt]),
+          onApply: this.closePopup
+        }
+      };
+      return /* @__PURE__ */ o.createElement(es, { ...c }, /* @__PURE__ */ o.createElement(lt, { className: "!k-overflow-hidden" }, /* @__PURE__ */ o.createElement("div", { className: "k-list-container" }, this.listContainerContent())));
+    }, this.closePopup = (t) => {
+      const e = this.base.initState();
+      e.syntheticEvent = t, t.stopPropagation(), this.state.focusedIndex !== void 0 && (e.data.focusedIndex = void 0), this.opened && this.base.togglePopup(e), e.events.push({ type: "onClose" });
+      const s = this.props.filter !== void 0 ? this.props.filter : this.state.text;
+      G(s) && s !== "" && this.base.filterChanged("", e), this.state.text && (e.data.text = ""), this.applyState(e);
+    }, this.onCancel = (t) => {
+      const e = this.base.initState();
+      e.syntheticEvent = t, t.stopPropagation(), this.state.focusedIndex !== void 0 && (e.data.focusedIndex = void 0), this.opened && this.base.togglePopup(e), e.events.push({ type: "onCancel" });
+      const s = this.props.filter !== void 0 ? this.props.filter : this.state.text;
+      G(s) && s !== "" && this.base.filterChanged("", e), this.state.text && (e.data.text = ""), this.applyState(e);
+    }, this.renderList = () => {
+      const {
+        data: t = [],
+        textField: e,
+        listNoDataRender: s,
+        itemRender: n,
+        groupHeaderItemRender: a,
+        dataItemKey: p,
+        virtual: c = { skip: 0, total: void 0 }
+      } = this.props, d = this.base.vs, { focusedIndex: r } = this.getFocusedState(), h = this.base.getPopupSettings(), u = `translateY(${d.translate}px)`;
+      return /* @__PURE__ */ o.createElement(
+        Ue,
+        {
+          id: this.base.listBoxId,
+          show: this.opened,
+          data: t.slice(),
+          focusedIndex: r - c.skip,
+          value: this.value,
+          textField: e,
+          valueField: p,
+          optionsGuid: this.base.guid,
+          groupField: this.props.groupField,
+          groupMode: "modern",
+          listRef: (g) => {
+            d.list = this.base.list = g;
+          },
+          wrapperStyle: this.mobileMode ? {} : { maxHeight: h.height },
+          wrapperCssClass: "k-list-content",
+          listStyle: d.enabled ? { transform: u } : void 0,
+          key: "listKey",
+          skip: c.skip,
+          onClick: this.handleItemClick,
+          itemRender: n,
+          groupHeaderItemRender: a,
+          noDataRender: s,
+          onMouseDown: ds,
+          onBlur: this.handleBlur,
+          onScroll: this.onScroll,
+          wrapperRef: d.scrollerRef,
+          scroller: this.base.renderScrollElement(),
+          ariaSetSize: c.total
+        }
+      );
+    }, this.onScroll = (t) => {
+      const { vs: e, list: s } = this.base;
+      e.scrollHandler(t);
+      const { groupField: n } = this.props;
+      let { data: a = [] } = this.props;
+      if (!(!n || !a.length) && n) {
+        const p = this.itemHeight = this.itemHeight || (e.enabled ? e.itemHeight : s ? s.children[0].offsetHeight : 0), d = t.target.scrollTop - e.skip * p;
+        a = this.base.getGroupedDataModernMode(a, n);
+        let r = a[0][n];
+        for (let h = 1; h < a.length && !(p * h > d); h++)
+          a[h] && a[h][n] && (r = a[h][n]);
+        r !== this.state.group && this.setState({
+          group: r
+        });
+      }
+    }, this.customItemSelect = (t) => {
+      const e = this.props.filter !== void 0 ? this.props.filter : this.state.text, { textField: s } = this.props;
+      if (!e)
+        return;
+      const n = this.base.initState();
+      n.syntheticEvent = t;
+      const a = s ? { [s]: e } : e;
+      this.state.text !== void 0 && (n.data.text = ""), n.data.focusedIndex = void 0, this.base.filterChanged("", n);
+      const p = [...this.value, a];
+      this.triggerOnChange(p, n), this.base.togglePopup(n), this.applyState(n);
+    }, this.handleWrapperClick = (t) => {
+      const e = this._input;
+      !this.opened && e && this.focusElement(e);
+      const s = this.base.initState();
+      s.syntheticEvent = t, !this.state.focused && !this.mobileMode && (s.events.push({ type: "onFocus" }), s.data.focused = !0), this.mobileMode && (this.setState({ currentValue: this.tagsToRender }), this.mobileMode && window.setTimeout(() => this._adaptiveInput && this._adaptiveInput.focus(), 300)), this.base.togglePopup(s), this.applyState(s);
+    }, this.handleItemClick = (t, e) => {
+      const s = this.base.initState();
+      s.syntheticEvent = e, this.handleItemSelect(t, s), this.props.autoClose && !this.mobileMode && this.base.togglePopup(s), e.stopPropagation(), this.applyState(s);
+    }, this.handleBlur = (t) => {
+      if (!this.state.focused || this._skipFocusEvent)
+        return;
+      const e = this.base.initState(), { allowCustom: s, filterable: n } = this.props;
+      e.syntheticEvent = t, e.data.focused = !1, e.events.push({ type: "onBlur" }), this.opened && !this.mobileMode && (this.state.opened && (e.data.opened = !1), e.events.push({ type: "onClose" })), !s && !n && this.state.text && (e.data.text = ""), this.applyState(e);
+    }, this.handleFocus = (t) => {
+      this._skipFocusEvent || this.base.handleFocus(t);
+    }, this.onPopupOpened = () => {
+      this._input && this.state.focused && !this.mobileMode && this.focusElement(this._input);
+    }, this.onPopupClosed = () => {
+      this.state.focused && window.setTimeout(() => {
+        this.state.focused && this.focusElement(this._input);
+      }, 0);
+    }, this.setValidity = () => {
+      this._input && this._input.setCustomValidity && this._input.setCustomValidity(
+        this.validity.valid ? "" : this.props.validationMessage || di
+      );
+    }, qe(je);
+  }
+  get document() {
+    if (Me)
+      return this.element && this.element.ownerDocument || document;
+  }
+  /** @hidden */
+  get element() {
+    return this._element;
+  }
+  /** @hidden */
+  get opened() {
+    return !!(this.props.opened !== void 0 ? this.props.opened : this.state.opened);
+  }
+  /** @hidden */
+  get tagsToRender() {
+    const { tags: i, textField: t } = this.props;
+    let e = [];
+    return i === void 0 ? this.value.forEach((s) => {
+      e.push({ text: V(s, t), data: [s] });
+    }) : e.push(...i), e;
+  }
+  /**
+   * The mobile mode of the ComboBox.
+   */
+  get mobileMode() {
+    return !!(this.state.windowWidth && this.state.windowWidth <= Se && this.props.adaptive);
+  }
+  /**
+   * Represents the value of the MultiSelect.
+   */
+  get value() {
+    const i = [];
+    return this._valueItemsDuringOnChange ? i.push(...this._valueItemsDuringOnChange) : this.props.value ? i.push(...this.props.value) : this.state.value ? i.push(...this.state.value) : this.props.defaultValue && i.push(...this.props.defaultValue), i;
+  }
+  /**
+   * Gets the `name` property of the MultiSelect.
+   */
+  get name() {
+    return this.props.name;
+  }
+  /**
+   * Represents the validity state into which the MultiSelect is set.
+   */
+  get validity() {
+    const i = this.props.validationMessage !== void 0, t = !this.required || this.value !== null && this.value.length > 0 && this.value !== void 0, e = this.props.valid !== void 0 ? this.props.valid : t;
+    return {
+      customError: i,
+      valid: e,
+      valueMissing: this.value === null
+    };
+  }
+  /** @hidden */
+  get required() {
+    return this.props.required !== void 0 ? this.props.required : qt.defaultProps.required;
+  }
+  get validityStyles() {
+    return this.props.validityStyles !== void 0 ? this.props.validityStyles : qt.defaultProps.validityStyles;
+  }
+  /** @hidden */
+  componentDidUpdate(i, t) {
+    var u;
+    const { virtual: e, groupField: s = "", data: n = [] } = this.props, a = e ? e.skip : 0, p = i.virtual ? i.virtual.total : 0, c = i.opened !== void 0 ? i.opened : t.opened, d = !c && this.opened, r = c && !this.opened;
+    if (!this.base.getPopupSettings().animate && r && this.onPopupClosed(), e && e.total !== p)
+      this.base.vs.calcScrollElementHeight(), this.base.vs.reset();
+    else {
+      let { focusedItem: g, focusedIndex: m } = this.getFocusedState();
+      s !== "" && (m = (u = this.base.getGroupedDataModernMode(n, s)) == null ? void 0 : u.indexOf(g)), d && e ? this.base.scrollToVirtualItem(e, m - a) : d && !e ? (n && n.length !== 0 && this.base.resetGroupStickyHeader(n[0][s], this), this.base.scrollToItem(m)) : this.opened && c && g && this.scrollToFocused && this.base.scrollToItem(m - a);
+    }
+    this.scrollToFocused = !1, this.setValidity();
+  }
+  /** @hidden */
+  componentDidMount() {
+    var i;
+    this.observerResize = Me && window.ResizeObserver && new window.ResizeObserver(this.calculateMedia.bind(this)), this.base.didMount(), this.setValidity(), (i = this.document) != null && i.body && this.observerResize && this.observerResize.observe(this.document.body);
+  }
+  /** @hidden */
+  componentWillUnmount() {
+    var i;
+    (i = this.document) != null && i.body && this.observerResize && this.observerResize.disconnect();
+  }
+  /** @hidden */
+  onNavigate(i, t, e) {
+    const { allowCustom: s, data: n = [] } = this.props, a = this.props.filter !== void 0 ? this.props.filter : this.state.text, { focusedType: p, focusedIndex: c } = this.getFocusedState(), d = s && a, r = cs(p), h = this.base, u = h.vs;
+    if (this.opened && t === f.up && r)
+      this.state.focusedIndex !== void 0 && (i.data.focusedIndex = void 0);
+    else {
+      const g = h.navigation.navigate({
+        keyCode: t,
+        current: c,
+        max: (u.enabled ? u.total : n.length) - 1,
+        min: d ? -1 : 0,
+        skipItems: e || void 0
+      });
+      g !== void 0 && (this.itemFocus(g, i), this.scrollToFocused = !0);
+    }
+    this.applyState(i);
+  }
+  /** @hidden */
+  render() {
+    const {
+      style: i,
+      className: t,
+      label: e,
+      dir: s,
+      disabled: n,
+      textField: a,
+      dataItemKey: p,
+      virtual: c,
+      size: d,
+      rounded: r,
+      fillMode: h,
+      loading: u,
+      filter: g
+    } = this.props, { text: m, focused: v, focusedTag: b, currentValue: w } = this.state, S = this.base.vs, D = this.props.id || this._inputId;
+    S.enabled = c !== void 0, c !== void 0 && (S.skip = c.skip, S.total = c.total, S.pageSize = c.pageSize);
+    const N = this.mobileMode && this.opened ? w : this.tagsToRender;
+    this.setItems(this.tagsToRender, this._tags);
+    const O = !this.validityStyles || this.validity.valid, _ = !!(g !== void 0 ? g : m) || N && N.length > 0, C = /* @__PURE__ */ o.createElement(o.Fragment, null, /* @__PURE__ */ o.createElement(
+      "div",
+      {
+        ref: this.componentRef,
+        className: B("k-multiselect k-input", t, {
+          [`k-input-${yt[d] || d}`]: d,
+          [`k-rounded-${ri[r] || r}`]: r,
+          [`k-input-${h}`]: h,
+          "k-focus": v && !n,
+          "k-invalid": !O,
+          "k-disabled": n,
+          "k-loading": u,
+          "k-required": this.required
+        }),
+        style: e ? { ...i, width: void 0 } : i,
+        dir: s,
+        onFocus: this.handleFocus,
+        onBlur: this.handleBlur,
+        onClick: this.handleWrapperClick,
+        onMouseDown: Hs
+      },
+      /* @__PURE__ */ o.createElement("div", { className: B("k-input-values") }, /* @__PURE__ */ o.createElement(
+        "div",
+        {
+          className: B(
+            "k-chip-list",
+            { [`k-chip-list-${yt[d] || d}`]: d }
+          ),
+          role: "listbox",
+          id: "tagslist-" + this.base.guid
+        },
+        N && N.length > 0 && /* @__PURE__ */ o.createElement(
+          ys,
+          {
+            tagRender: this.props.tagRender,
+            onTagDelete: this.onTagDelete,
+            data: N,
+            guid: this.base.guid,
+            focused: b ? N.find((F) => xt(F, b, p)) : void 0,
+            size: d
+          }
+        )
+      ), this.renderSearchBar(D)),
+      u && /* @__PURE__ */ o.createElement(ke, { className: "k-input-loading-icon", name: "loading" }),
+      _ && /* @__PURE__ */ o.createElement(rt, { onClick: this.clearButtonClick }),
+      !this.mobileMode && this.renderListContainer()
+    ), this.mobileMode && this.renderAdaptiveListContainer());
+    return e ? /* @__PURE__ */ o.createElement(
+      Ge,
+      {
+        label: e,
+        editorId: D,
+        editorValue: m || V(this.value[0], a),
+        editorValid: O,
+        editorDisabled: n,
+        style: { width: i ? i.width : void 0 },
+        children: C
+      }
+    ) : C;
+  }
+  renderSearchBar(i) {
+    const { activedescendant: t, focusedTag: e, currentValue: s } = this.state, { disabled: n, placeholder: a, ariaDescribedBy: p } = this.props, c = !this.mobileMode && (this.props.filter !== void 0 ? this.props.filter : this.state.text) || "", { focusedIndex: d } = this.getFocusedState(), r = this.value.length === 0 && !c ? a : void 0, h = s && s.length > 0 ? void 0 : a, u = t === st.TagsList && e !== void 0 ? `tag-${this.base.guid}-${e.text.replace(/\s+/g, "-")}` : `option-${this.base.guid}-${d}`;
+    return /* @__PURE__ */ o.createElement(
+      Zt,
+      {
+        id: i,
+        size: Math.max((r || "").length, c.length, 1),
+        tabIndex: this.props.tabIndex,
+        accessKey: this.props.accessKey,
+        placeholder: this.mobileMode && this.opened ? h : r,
+        value: c,
+        onChange: this.onChangeHandler,
+        onKeyDown: this.onInputKeyDown,
+        ref: this.searchbarRef,
+        disabled: n,
+        expanded: this.opened,
+        owns: this.base.listBoxId,
+        role: "combobox",
+        activedescendant: u,
+        ariaDescribedBy: `tagslist-${this.base.guid}${p ? " " + p : ""}`,
+        ariaLabelledBy: this.props.ariaLabelledBy,
+        ariaRequired: this.required
+      }
+    );
+  }
+  onTagsNavigate(i, t) {
+    const e = i.keyCode, { focusedTag: s } = this.state, n = this._tags, a = this.props.dataItemKey;
+    let p = s ? n.findIndex((r) => xt(r, s, a)) : -1, c;
+    const d = p !== -1;
+    if (e === f.left)
+      d ? p = Math.max(0, p - 1) : p = n.length - 1, c = n[p];
+    else if (e === f.right)
+      p === n.length - 1 ? c = void 0 : d && (p = Math.min(n.length - 1, p + 1), c = n[p]);
+    else if (e === f.home && !i.shiftKey)
+      c = n[0];
+    else if (e === f.end && !i.shiftKey)
+      c = n[n.length - 1];
+    else if (e === f.delete) {
+      if (d) {
+        const r = this.value;
+        vt(r, n[p].data, a), this.triggerOnChange(r, t);
+      }
+    } else if (e === f.backspace) {
+      const r = this.value;
+      if (d)
+        vt(r, n[p].data, a), this.triggerOnChange(r, t);
+      else if (!d && n.length) {
+        const h = n.pop();
+        vt(r, h.data, a), this.triggerOnChange(r, t);
+      }
+    }
+    c !== s && (t.data.focusedTag = c, t.data.activedescendant = st.TagsList), this.applyState(t);
+  }
+  triggerOnChange(i, t) {
+    this.props.value === void 0 && (t.data.value = [...i]), this._valueItemsDuringOnChange = [], this.setItems(i, this._valueItemsDuringOnChange), t.events.push({ type: "onChange" });
+  }
+  selectFocusedItem(i, t) {
+    const { data: e = [], virtual: s } = this.props, { focusedIndex: n } = t || this.getFocusedState(), a = s ? s.skip : 0;
+    e[n - a] !== void 0 && this.handleItemClick(n, i);
+  }
+  setItems(i, t) {
+    t.length = 0, t.push(...i);
+  }
+  getFocusedState() {
+    const { focusedIndex: i } = this.state, t = this.props.filter !== void 0 ? this.props.filter : this.state.text, { allowCustom: e, data: s = [], dataItemKey: n, virtual: a, textField: p, focusedItemIndex: c = Ve, skipDisabledItems: d } = this.props, r = a && a.skip || 0;
+    let h;
+    if (i !== void 0)
+      return {
+        focusedIndex: i,
+        focusedItem: s[i - r],
+        focusedType: 1
+        /* ListItem */
+      };
+    const u = this.value;
+    if (e && t)
+      return {
+        focusedItem: null,
+        focusedIndex: -1,
+        focusedType: 2
+        /* CustomItem */
+      };
+    if (t)
+      return h = c(s, t, p), {
+        focusedItem: s[h],
+        focusedIndex: h + r,
+        focusedType: 1
+        /* ListItem */
+      };
+    if (u.length) {
+      const g = u[u.length - 1];
+      return h = s.findIndex((m) => R(m, g, n)), s[h] !== void 0 ? {
+        focusedIndex: h + r,
+        focusedItem: s[h],
+        focusedType: 1
+        /* ListItem */
+      } : { focusedType: 0, focusedIndex: -1 };
+    } else if (d && p && !t && r === 0) {
+      const g = s.findIndex((m) => !m.disabled && m[p]);
+      return {
+        focusedIndex: g,
+        focusedItem: s[g - r],
+        focusedType: 1
+        /* ListItem */
+      };
+    }
+    return r === 0 ? {
+      focusedItem: s[0],
+      focusedIndex: 0,
+      focusedType: 1
+      /* ListItem */
+    } : { focusedType: 0, focusedIndex: -1 };
+  }
+  focusElement(i) {
+    this._skipFocusEvent = !0, i.focus(), window.setTimeout(() => this._skipFocusEvent = !1, 0);
+  }
+  applyState(i) {
+    this.base.applyState(i), this._valueItemsDuringOnChange = null;
+  }
+  calculateMedia(i) {
+    for (let t of i)
+      this.setState({ windowWidth: t.target.clientWidth });
+  }
+  /**
+   * Updates the state of the MultiSelect when the complex keyboard navigation that
+   * includes key combinations with the Ctrl/Command, Shift, Home and End keys
+   *
+   * @param {Array<string | Object>} dataToSet Defines the array of new values that will be applied to the MultiSelect
+   * @param {MultiSelectInternalState} state The current state of the MultiSelect
+   */
+  updateStateOnKeyboardNavigation(i, t) {
+    this.setState({ value: i }), this.triggerOnChange(i, t), this.applyState(t);
+  }
+  /**
+   * Returns the last element that was selected or deselected. Needed for the keyboard navigation specifications
+   *
+   * @param {number} correction A correction is needed depending on if UP or DOWN key is pressed
+   */
+  getLastSelectedOrDeselectedIndex(i, t) {
+    return this._lastSelectedOrDeslectedItemIndex === null && (this._lastSelectedOrDeslectedItemIndex = t), this._lastSelectedOrDeslectedItemIndex !== null ? this._lastSelectedOrDeslectedItemIndex + i : null;
+  }
+};
+let Ft = qt;
+Ft.displayName = "MultiSelect";
+Ft.propTypes = {
+  ...ie.propTypes,
+  autoClose: l.bool,
+  value: l.arrayOf(l.any),
+  defaultValue: l.arrayOf(l.any),
+  dataItemKey: l.string,
+  placeholder: l.string,
+  tags: l.arrayOf(l.shape({
+    text: l.string,
+    data: l.arrayOf(l.any)
+  })),
+  tagRender: l.func,
+  id: l.string,
+  ariaLabelledBy: l.string,
+  ariaDescribedBy: l.string,
+  groupField: l.string,
+  list: l.any,
+  adaptive: l.bool,
+  adaptiveTitle: l.string,
+  onCancel: l.func,
+  skipDisabledItems: l.bool
+};
+Ft.defaultProps = {
+  ...ie.defaultProps,
+  autoClose: !0,
+  required: !1,
+  size: "medium",
+  rounded: "medium",
+  fillMode: "solid",
+  groupMode: "modern",
+  skipDisabledItems: !0
+};
+const ci = Ke(), pi = wt(ci, Ft);
+pi.displayName = "KendoReactMultiSelect";
+const hi = (i) => /* @__PURE__ */ o.createElement(
+  Ue,
+  {
+    ...i,
+    wrapperCssClass: "k-table-body k-table-scroller",
+    listClassName: B(
+      "k-table k-table-list",
+      {
+        "k-virtual-table": i.virtual !== void 0
+      }
+    ),
+    listStyle: { ...i.listStyle }
+  }
+), ui = (i, t) => i ? typeof i == "number" ? i + "px" : i : t, gi = Ke(), ts = o.forwardRef((i, t) => {
+  const e = Gt(gi, i), s = o.useRef(null), n = o.useRef(null), a = ws(), {
+    columns: p = He.columns,
+    popupSettings: c = He.popupSettings,
+    className: d,
+    size: r,
+    onOpen: h,
+    onClose: u,
+    onFocus: g,
+    onBlur: m,
+    onChange: v,
+    onFilterChange: b,
+    onPageChange: w,
+    ...S
+  } = e;
+  o.useImperativeHandle(s, () => ({
+    element: n.current && n.current.element,
+    focus() {
+      n.current && n.current.focus();
+    },
+    get value() {
+      return n.current && n.current.value;
+    },
+    get name() {
+      return n.current && n.current.name;
+    },
+    props: e
+  })), o.useImperativeHandle(t, () => s.current);
+  const D = o.useMemo(
+    () => {
+      if (e.groupField !== void 0 && e.data)
+        return V(e.data[0], e.groupField);
+    },
+    [e.data, e.groupField]
+  ), [N, O] = o.useState(D), [_, C] = o.useState(!0), F = o.useMemo(
+    () => {
+      const P = /* @__PURE__ */ o.createElement("th", { className: "k-table-th", colSpan: p.length }, N);
+      return /* @__PURE__ */ o.createElement(o.Fragment, null, e.header, /* @__PURE__ */ o.createElement("div", { className: "k-table-header-wrap" }, /* @__PURE__ */ o.createElement("table", { className: "k-table", role: "presentation" }, /* @__PURE__ */ o.createElement("colgroup", null, p.map(
+        (H, L) => /* @__PURE__ */ o.createElement(
+          "col",
+          {
+            key: H.uniqueKey ? H.uniqueKey : L,
+            style: { width: H.width ? H.width : He.width }
+          }
+        )
+      )), /* @__PURE__ */ o.createElement("thead", { className: "k-table-thead" }, /* @__PURE__ */ o.createElement("tr", { className: "k-table-row" }, p.map((H, L) => /* @__PURE__ */ o.createElement("th", { className: "k-table-th", key: H.uniqueKey ? H.uniqueKey : L }, H.header || " "))), N && _ && /* @__PURE__ */ o.createElement("tr", { className: "k-table-group-row" }, e.groupStickyHeaderItemRender ? e.groupStickyHeaderItemRender.call(void 0, P, {}) : P)))));
+    },
+    [e.header, p, N, _]
+  ), x = o.useMemo(
+    () => (
+      // These additional 4px are coming from the child elements side borders (fixes horizontal scrollbar)
+      `calc(${p.map((P) => ui(P.width, He.width)).filter(Boolean).join(" + ")} + ${a}px + 4px)`
+    ),
+    [p, a]
+  ), E = e.virtual ? e.virtual.skip : 0, M = o.useCallback(
+    (P, H) => {
+      const L = p.map((J, W) => /* @__PURE__ */ o.createElement(
+        "span",
+        {
+          className: e.itemRender ? void 0 : "k-table-td",
+          style: e.itemRender ? void 0 : { width: J.width ? J.width : He.width },
+          key: J.uniqueKey ? J.uniqueKey : W
+        },
+        J.field ? String(kt(J.field)(H.dataItem)) : ""
+      ));
+      let me, Ce, Ne, Oe, Pe = e.data || [];
+      const A = H.index - E;
+      e.groupField !== void 0 && (Oe = kt(e.groupField), Ce = Oe(Pe[A]), Ne = Oe(Pe[A - 1]), Ce && Ne && Ce !== Ne && (me = Ce)), me && e.groupMode === "classic" && L.push(/* @__PURE__ */ o.createElement("div", { key: "group", className: "k-table-td k-table-group-td" }, /* @__PURE__ */ o.createElement("span", null, me)));
+      const X = o.cloneElement(P, {
+        ...P.props,
+        className: B("k-table-row", {
+          "k-table-alt-row": H.index % 2 !== 0,
+          "k-focus": H.focused,
+          "k-selected": H.selected,
+          "k-first": !!me,
+          "k-disabled": H.dataItem.disabled
+        })
+      }, L);
+      return e.itemRender ? e.itemRender.call(void 0, X, H) : X;
+    },
+    [p, e.groupField, e.itemRender, e.data, E]
+  ), K = o.useCallback(
+    (P, H) => {
+      P && P.call(void 0, {
+        ...H,
+        target: s.current
+      });
+    },
+    []
+  ), U = o.useCallback((P) => (e.virtual || O(D), K(h, P)), [K, h, e.virtual, D]), j = o.useCallback((P) => K(u, P), [u]), Y = o.useCallback((P) => K(g, P), [g]), re = o.useCallback((P) => K(m, P), [m]), we = o.useCallback((P) => K(v, P), [v]), ne = o.useCallback((P) => K(w, P), [w]), Q = o.useCallback((P) => (O(D), K(b, {
+    ...P,
+    mobileMode: P.target.mobileMode
+  })), [b]), oe = o.useCallback(
+    (P) => {
+      O(P.group);
+    },
+    []
+  );
+  o.useEffect(() => {
+    Es();
+  }), o.useEffect(() => {
+    const P = e.data;
+    O(D), P && P.length !== 0 ? C(!0) : C(!1);
+  }, [e.data]);
+  const Le = o.useCallback((P) => /* @__PURE__ */ o.createElement(hi, { ...P }), []);
+  return /* @__PURE__ */ o.createElement(
+    Ns.Provider,
+    {
+      value: (P) => ({ ...P, popupClass: `k-dropdowngrid-popup ${c.popupClass}` })
+    },
+    /* @__PURE__ */ o.createElement(
+      bs,
+      {
+        ...S,
+        list: Le,
+        popupSettings: {
+          width: x,
+          ...c,
+          className: c.className
+        },
+        ref: n,
+        header: F,
+        itemRender: M,
+        groupHeaderItemRender: e.groupHeaderItemRender,
+        size: e.size,
+        rounded: e.rounded,
+        fillMode: e.fillMode,
+        groupMode: e.groupMode,
+        groupField: e.groupField,
+        isMultiColumn: !0,
+        onOpen: U,
+        onClose: j,
+        onFocus: Y,
+        onBlur: re,
+        onChange: we,
+        onFilterChange: Q,
+        onPageChange: ne,
+        onGroupScroll: oe,
+        className: B("k-dropdowngrid", d),
+        required: e.required,
+        adaptive: e.adaptive,
+        adaptiveFilter: e.adaptiveFilter,
+        adaptiveTitle: e.adaptiveTitle,
+        footer: e.footer,
+        footerClassName: "k-table-footer"
+      }
+    )
+  );
+}), fi = {
+  ...dt.propTypes,
+  columns: l.any.isRequired
+}, He = {
+  columns: [],
+  popupSettings: {},
+  width: "200px",
+  size: "medium",
+  rounded: "medium",
+  fillMode: "solid"
+};
+ts.displayName = "KendoMultiColumnComboBox";
+ts.propTypes = fi;
+ts.defaultProps = He;
+function Is(i, t, e) {
+  const [s, n] = o.useState(t);
+  return o.useEffect(
+    () => {
+      s !== void 0 && i.current && n(i.current.offsetWidth);
+    },
+    e
+  ), s;
+}
+const ks = (i) => /* @__PURE__ */ o.createElement("div", { className: "k-nodata" }, /* @__PURE__ */ o.createElement("div", null, i.children)), { sizeMap: mi, roundedMap: vi } = $e, bi = "Please select a value from the list!", yi = (i) => /* @__PURE__ */ o.createElement("span", { className: "k-input-value-text" }, i.children), ps = (i) => i.split("_").map((t) => parseInt(t, 10)), Ii = (i, t) => {
+  const { validationMessage: e, valid: s, required: n } = i;
+  return {
+    customError: e !== void 0,
+    valid: !!(s !== void 0 ? s : !n || t),
+    valueMissing: !t
+  };
+}, hs = {
+  selectField: "selected",
+  subItemsField: "items",
+  popupSettings: {
+    animate: !0,
+    width: "200px",
+    height: "200px"
+  },
+  data: [],
+  required: !1,
+  style: {},
+  validityStyles: !0,
+  size: "medium",
+  rounded: "medium",
+  fillMode: "solid"
+}, ki = Ke(), Cs = o.forwardRef((i, t) => {
+  qe(je);
+  const e = Gt(ki, i), s = {
+    ...hs,
+    ...e
+  }, n = o.useMemo(() => Fe(), []), a = s.id || n, {
+    data: p,
+    dataItemKey: c,
+    popupSettings: d,
+    style: r,
+    opened: h,
+    disabled: u,
+    onOpen: g = De,
+    onClose: m = De,
+    placeholder: v,
+    label: b,
+    name: w,
+    selectField: S,
+    subItemsField: D,
+    validationMessage: N,
+    valid: O,
+    required: _,
+    validityStyles: C
+  } = s, F = $t(s.tabIndex, u), x = o.useRef(null), E = o.useRef(null), M = o.useRef(null), K = o.useRef(null), U = o.useRef(null), j = o.useRef(null), Y = o.useRef(!1), [re, we] = o.useState(void 0), ne = s.value !== void 0, Q = ne ? s.value : re !== void 0 ? re : s.defaultValue, oe = G(Q), Le = oe ? V(Q, s.textField) : "", P = Ii({ validationMessage: N, valid: O, required: _ }, oe), H = o.useCallback(() => E.current && E.current.focus(), []);
+  o.useImperativeHandle(
+    x,
+    () => ({
+      props: s,
+      element: E.current,
+      focus: H
+    })
+  ), o.useImperativeHandle(t, () => x.current);
+  const L = fs(E, s.dir), me = d.width !== void 0 ? d.width : r.width !== void 0 ? r.width : hs.popupSettings.width, Ne = {
+    width: Is(E, me),
+    ...L !== void 0 ? { direction: L } : {}
+  }, [Oe, Pe] = o.useState(!1), A = h !== void 0 ? h : Oe, [X, J] = o.useState(!1), [W, Ye] = o.useState(), ue = !!(W && W <= Se && s.adaptive), [ve, Mt] = o.useState(""), is = o.useCallback(
+    () => {
+      U.current && U.current.setCustomValidity && U.current.setCustomValidity(
+        P.valid ? "" : N === void 0 ? bi : N
+      );
+    },
+    [N, P]
+  );
+  o.useEffect(is), o.useEffect(() => {
+    const I = Me && window.ResizeObserver && new window.ResizeObserver(Rt.bind(void 0));
+    return document != null && document.body && I && I.observe(document.body), () => {
+      document != null && document.body && I && I.disconnect();
+    };
+  }, []);
+  const ct = o.useCallback(
+    (I) => {
+      if (!A) {
+        if (g) {
+          const T = { ...I };
+          g.call(void 0, T);
+        }
+        h === void 0 && Pe(!0);
+      }
+    },
+    [A, h, g]
+  ), xe = o.useCallback(
+    (I) => {
+      if (A) {
+        if (m) {
+          const T = { ...I };
+          m.call(void 0, T);
+        }
+        h === void 0 && (Pe(!1), ue && setTimeout(() => {
+          var T;
+          q((T = K.current) == null ? void 0 : T.element);
+        }, 300));
+      }
+    },
+    [A, h, m, ue]
+  ), Nt = o.useCallback(
+    (I) => {
+      if (!I.isDefaultPrevented() && x.current) {
+        J(!0);
+        const T = {
+          syntheticEvent: I,
+          nativeEvent: I.nativeEvent,
+          target: x.current
+        };
+        (A ? xe : ct)(T);
+      }
+    },
+    [A, h, g, m]
+  ), se = o.useCallback(
+    (I) => {
+      Y.current = !0, I(), window.setTimeout(() => Y.current = !1, 0);
+    },
+    []
+  ), ze = o.useCallback(
+    (I) => {
+      var k, z;
+      const { keyCode: T, altKey: $ } = I, de = j.current && j.current.element;
+      if (!x.current || I.isDefaultPrevented() && ((k = M.current) == null ? void 0 : k.element) === I.target)
+        return;
+      const y = {
+        syntheticEvent: I,
+        nativeEvent: I.nativeEvent,
+        target: x.current
+      };
+      if (A)
+        if (T === f.esc || $ && T === f.up)
+          I.preventDefault(), xe(y);
+        else if (de && de.querySelector(".k-focus") && (T === f.up || T === f.down || T === f.left || T === f.right || T === f.home || T === f.end)) {
+          if (T === f.up && ((z = M.current) != null && z.element)) {
+            const ee = Array.from(de.querySelectorAll(".k-treeview-item")), ye = [...ee].reverse().find((Ie) => !!(Ie && Ie.querySelector(".k-focus")));
+            if (ye && ee.indexOf(ye) === 0)
+              return se(() => {
+                var Ie;
+                q((Ie = M.current) == null ? void 0 : Ie.element);
+              });
+          }
+          se(De);
+        } else
+          T === f.down && se(() => {
+            var ee;
+            q(((ee = M.current) == null ? void 0 : ee.element) || de);
+          });
+      else
+        $ && T === f.down ? (I.preventDefault(), ct(y)) : A || T === f.esc && ut(I);
+    },
+    [A, h, g, m]
+  ), _e = o.useCallback(
+    (I) => {
+      const { keyCode: T, altKey: $ } = I;
+      $ || T !== f.up && T !== f.down || (I.preventDefault(), se(
+        T === f.up ? () => {
+          q(E.current);
+        } : () => {
+          q(j.current && j.current.element);
+        }
+      ));
+    },
+    []
+  ), q = o.useCallback(
+    (I) => {
+      I && se(() => I.focus());
+    },
+    []
+  ), he = o.useCallback(
+    () => {
+      var I;
+      !X && A && !h ? xe({ target: x.current }) : e.filterable ? q((I = M.current) == null ? void 0 : I.element) : q(j.current && j.current.element);
+    },
+    [m, e.filterable, X, h, A]
+  ), Z = o.useCallback(
+    () => {
+      X && q(E.current);
+    },
+    [X]
+  ), Ot = o.useCallback(
+    (I) => {
+      if (!X && !Y.current && (J(!0), e.onFocus && x.current)) {
+        const T = {
+          syntheticEvent: I,
+          nativeEvent: I.nativeEvent,
+          target: x.current
+        };
+        e.onFocus.call(void 0, T);
+      }
+    },
+    [X, e.onFocus]
+  ), Pt = o.useCallback(
+    (I) => {
+      if (X && !Y.current && x.current) {
+        J(!1);
+        const T = {
+          syntheticEvent: I,
+          nativeEvent: I.nativeEvent,
+          target: x.current
+        };
+        if (e.onBlur) {
+          const $ = { ...T };
+          e.onBlur.call(void 0, $);
+        }
+        ue || xe(T);
+      }
+    },
+    [X, e.onBlur, A, h, m]
+  ), _t = o.useCallback(
+    () => {
+      X && se(De), ue && setTimeout(() => {
+        var I;
+        q((I = K.current) == null ? void 0 : I.element);
+      }, 300);
+    },
+    [X, ue]
+  ), pt = o.useCallback(
+    (I, T, $) => {
+      if (e.onChange) {
+        const de = {
+          value: T,
+          level: $ ? ps($) : [],
+          ...I
+        };
+        e.onChange.call(void 0, de);
+      }
+      ne || we(T);
+    },
+    [e.onChange, ne]
+  ), ht = o.useCallback(
+    (I) => {
+      if (R(I.item, Q, c) || !x.current)
+        return;
+      const { item: T, itemHierarchicalIndex: $, nativeEvent: de, syntheticEvent: y } = I, k = {
+        syntheticEvent: y,
+        nativeEvent: de,
+        target: x.current
+      };
+      pt(k, T, $), xe(k);
+    },
+    [ne, Q, e.onChange, c, A, h, m]
+  ), ut = o.useCallback(
+    (I) => {
+      if (!x.current)
+        return;
+      const T = {
+        syntheticEvent: I,
+        nativeEvent: I.nativeEvent,
+        target: x.current
+      };
+      pt(T, null), xe(T), I.preventDefault();
+    },
+    [ne, e.onChange, A, h, m]
+  ), gt = o.useCallback(
+    (I) => {
+      if (I.syntheticEvent.stopPropagation(), e.onExpandChange && x.current) {
+        const { item: T, itemHierarchicalIndex: $, nativeEvent: de, syntheticEvent: y } = I, k = {
+          level: ps($),
+          item: T,
+          nativeEvent: de,
+          syntheticEvent: y,
+          target: x.current
+        };
+        e.onExpandChange.call(void 0, k);
+      }
+    },
+    [e.onExpandChange]
+  ), Je = o.useCallback(
+    (I) => {
+      if (e.onFilterChange && x.current) {
+        const $ = {
+          filter: { field: e.textField, operator: "contains", value: I.target.value },
+          syntheticEvent: I.syntheticEvent,
+          nativeEvent: I.nativeEvent,
+          target: x.current
+        };
+        e.onFilterChange.call(void 0, $), e.filter === void 0 && Mt(I.target.value);
+      }
+    },
+    [e.onFilterChange, e.filter, e.textField]
+  ), Qe = () => {
+    const I = s.filterable ? /* @__PURE__ */ o.createElement(
+      Be,
+      {
+        value: s.filter === void 0 ? ve : s.filter,
+        ref: K,
+        onChange: Je,
+        onKeyDown: _e,
+        size: ge,
+        rounded: be,
+        fillMode: Ee
+      }
+    ) : null, T = {
+      adaptiveTitle: s.adaptiveTitle,
+      expand: A,
+      onClose: ($) => xe($),
+      windowWidth: W,
+      mobileFilter: I
+    };
+    return /* @__PURE__ */ o.createElement(es, { ...T }, /* @__PURE__ */ o.createElement(lt, { className: "!k-overflow-hidden" }, /* @__PURE__ */ o.createElement("div", { className: "k-list-container" }, /* @__PURE__ */ o.createElement("div", { className: "k-list k-list-lg" }, p.length > 0 ? /* @__PURE__ */ o.createElement(
+      Ct,
+      {
+        ref: j,
+        tabIndex: F,
+        data: Xe,
+        focusIdField: c,
+        textField: s.textField,
+        selectField: S,
+        expandField: s.expandField,
+        childrenField: D,
+        expandIcons: !0,
+        onItemClick: ht,
+        onExpandChange: gt,
+        size: ge,
+        item: s.item,
+        dir: L
+      }
+    ) : /* @__PURE__ */ o.createElement(Ze, null, et.toLanguageString(fe, le[fe]))))));
+  }, Rt = o.useCallback(
+    (I) => {
+      for (let T of I)
+        Ye(T.target.clientWidth);
+    },
+    []
+  ), Xe = o.useMemo(
+    () => ne || !oe ? p : Ds(
+      p,
+      D,
+      (I) => Ts(
+        I,
+        D,
+        { [S]: R(I, Q, c) }
+      )
+    ),
+    [p, Q, ne, oe, S, D]
+  ), Ze = s.listNoData || ks, ft = s.valueHolder || yi, et = vs(), mt = !C || P.valid, { size: ge, rounded: be, fillMode: Ee } = s, ae = /* @__PURE__ */ o.createElement(o.Fragment, null, /* @__PURE__ */ o.createElement(
+    "span",
+    {
+      className: B("k-dropdowntree k-picker", s.className, {
+        [`k-picker-${mi[ge] || ge}`]: ge,
+        [`k-rounded-${vi[be] || be}`]: be,
+        [`k-picker-${Ee}`]: Ee,
+        "k-focus": X,
+        "k-invalid": !mt,
+        "k-loading": s.loading,
+        "k-required": _,
+        "k-disabled": s.disabled
+      }),
+      tabIndex: F,
+      accessKey: s.accessKey,
+      id: a,
+      style: b ? { ...r, width: void 0 } : r,
+      dir: L,
+      ref: E,
+      onKeyDown: u ? void 0 : ze,
+      onMouseDown: _t,
+      onClick: u ? void 0 : Nt,
+      onFocus: Ot,
+      onBlur: Pt,
+      role: "combobox",
+      "aria-haspopup": "tree",
+      "aria-expanded": A,
+      "aria-disabled": u,
+      "aria-label": b,
+      "aria-labelledby": s.ariaLabelledBy,
+      "aria-describedby": s.ariaDescribedBy,
+      "aria-required": _
+    },
+    /* @__PURE__ */ o.createElement("span", { className: "k-input-inner" }, /* @__PURE__ */ o.createElement(ft, { item: Q }, Le || v)),
+    s.loading && /* @__PURE__ */ o.createElement(ke, { className: "k-input-loading-icon", name: "loading" }),
+    oe && !u && /* @__PURE__ */ o.createElement(
+      "span",
+      {
+        onClick: ut,
+        className: "k-clear-value",
+        title: et.toLanguageString(it, le[it]),
+        role: "button",
+        tabIndex: -1,
+        onMouseDown: (I) => I.preventDefault()
+      },
+      /* @__PURE__ */ o.createElement(ke, { name: "x", icon: at })
+    ),
+    /* @__PURE__ */ o.createElement(
+      Te,
+      {
+        tabIndex: -1,
+        type: "button",
+        "aria-label": "select",
+        className: "k-input-button",
+        size: ge,
+        fillMode: Ee,
+        themeColor: "base",
+        rounded: null,
+        icon: "caret-alt-down",
+        svgIcon: Ut
+      }
+    ),
+    /* @__PURE__ */ o.createElement(
+      "select",
+      {
+        name: w,
+        ref: U,
+        tabIndex: -1,
+        "aria-hidden": !0,
+        title: b,
+        style: { opacity: 0, width: 1, border: 0, zIndex: -1, position: "absolute", left: "50%" }
+      },
+      /* @__PURE__ */ o.createElement("option", { value: s.valueMap ? s.valueMap.call(void 0, Q) : Q })
+    ),
+    !ue && /* @__PURE__ */ o.createElement(
+      jt,
+      {
+        className: B(d.className, { "k-rtl": L === "rtl" }),
+        popupClass: B(
+          d.popupClass,
+          "k-dropdowntree-popup"
+        ),
+        style: Ne,
+        animate: d.animate,
+        anchor: E.current,
+        show: A,
+        onOpen: he,
+        onClose: Z,
+        appendTo: d.appendTo
+      },
+      s.filterable && /* @__PURE__ */ o.createElement(
+        Be,
+        {
+          value: s.filter === void 0 ? ve : s.filter,
+          ref: M,
+          onChange: Je,
+          onKeyDown: _e,
+          size: ge,
+          rounded: be,
+          fillMode: Ee
+        }
+      ),
+      p.length > 0 ? /* @__PURE__ */ o.createElement(
+        Ct,
+        {
+          ref: j,
+          tabIndex: F,
+          data: Xe,
+          focusIdField: c,
+          textField: s.textField,
+          selectField: S,
+          expandField: s.expandField,
+          childrenField: D,
+          expandIcons: !0,
+          onItemClick: ht,
+          onExpandChange: gt,
+          size: ge,
+          item: s.item,
+          dir: L
+        }
+      ) : /* @__PURE__ */ o.createElement(Ze, null, et.toLanguageString(fe, le[fe]))
+    )
+  ), ue && Qe());
+  return b ? /* @__PURE__ */ o.createElement(
+    Ge,
+    {
+      label: b,
+      editorValue: Le,
+      editorPlaceholder: v,
+      editorValid: mt,
+      editorDisabled: u,
+      editorId: a,
+      style: { width: r ? r.width : void 0 },
+      children: ae,
+      dir: L
+    }
+  ) : ae;
+}), Ci = {
+  opened: l.bool,
+  disabled: l.bool,
+  dir: l.string,
+  tabIndex: l.number,
+  accessKey: l.string,
+  data: l.array,
+  value: l.any,
+  valueMap: l.func,
+  placeholder: l.string,
+  dataItemKey: l.string.isRequired,
+  textField: l.string.isRequired,
+  selectField: l.string,
+  expandField: l.string,
+  subItemsField: l.string,
+  className: l.string,
+  style: l.object,
+  label: l.string,
+  validationMessage: l.string,
+  validityStyles: l.bool,
+  valid: l.bool,
+  required: l.bool,
+  name: l.string,
+  id: l.string,
+  ariaLabelledBy: l.string,
+  ariaDescribedBy: l.string,
+  filterable: l.bool,
+  filter: l.string,
+  loading: l.bool,
+  popupSettings: l.shape({
+    animate: l.oneOfType([l.bool, l.shape({
+      openDuration: l.number,
+      closeDuration: l.number
+    })]),
+    popupClass: l.string,
+    className: l.string,
+    appendTo: l.any,
+    width: l.oneOfType([l.string, l.number]),
+    height: l.oneOfType([l.string, l.number])
+  }),
+  onOpen: l.func,
+  onClose: l.func,
+  onFocus: l.func,
+  onBlur: l.func,
+  onChange: l.func,
+  onFilterChange: l.func,
+  onExpandChange: l.func,
+  item: l.func,
+  valueHolder: l.func,
+  listNoData: l.func,
+  adaptiveTitle: l.string,
+  adaptive: l.bool
+};
+Cs.displayName = "KendoReactDropDownTree";
+Cs.propTypes = Ci;
+const xi = "Please select a value from the list!", { sizeMap: us, roundedMap: Si } = $e, wi = (i) => i.split("_").map((t) => parseInt(t, 10)), Ei = (i, t) => {
+  const { validationMessage: e, valid: s, required: n } = i;
+  return {
+    customError: e !== void 0,
+    valid: !!(s !== void 0 ? s : !n || t),
+    valueMissing: !t
+  };
+}, Re = {
+  checkField: "checkField",
+  checkIndeterminateField: "checkIndeterminateField",
+  subItemsField: "items",
+  popupSettings: {
+    animate: !0,
+    width: "200px",
+    height: "200px"
+  },
+  size: "medium",
+  rounded: "medium",
+  fillMode: "solid",
+  required: !1,
+  validityStyles: !0
+}, Di = Ke(), ss = o.forwardRef((i, t) => {
+  const e = Gt(Di, i);
+  qe(je);
+  const s = o.useMemo(() => Fe(), []), n = e.id || s, {
+    data: a = [],
+    dataItemKey: p,
+    popupSettings: c = {},
+    style: d = {},
+    opened: r,
+    disabled: h,
+    onOpen: u = De,
+    onClose: g = De,
+    placeholder: m,
+    label: v,
+    name: b,
+    checkField: w = Re.checkField,
+    checkIndeterminateField: S = Re.checkIndeterminateField,
+    subItemsField: D = Re.subItemsField,
+    validationMessage: N,
+    valid: O,
+    tags: _,
+    value: C,
+    required: F = Re.required,
+    validityStyles: x = Re.validityStyles
+  } = e, E = $t(e.tabIndex, h), M = o.useRef(null), K = o.useRef(null), U = o.useRef(null), j = o.useRef(null), Y = o.useRef(null), re = o.useRef(null), we = o.useRef(!1), ne = o.useRef([]), Q = o.useRef(null), [oe, Le] = o.useState(), [P, H] = o.useState(!1), [L, me] = o.useState(!1), [Ce, Ne] = o.useState(), [Oe, Pe] = o.useState([]), [A, X] = o.useState(""), J = !!(Ce && Ce <= Se && e.adaptive), W = r !== void 0 ? r : P, Ye = !!(Array.isArray(C) && C.length), ue = Ei({ validationMessage: N, valid: O, required: F }, Ye), ve = fs(K, e.dir), Mt = c.width !== void 0 ? c.width : d.width !== void 0 ? d.width : Re.popupSettings.width, ct = {
+    width: Is(K, Mt),
+    ...ve !== void 0 ? { direction: ve } : {}
+  }, xe = o.useCallback(() => K.current && K.current.focus(), []);
+  ne.current = _ === void 0 ? (C || []).map((y) => ({ text: V(y, e.textField), data: [y] })) : [..._], o.useImperativeHandle(
+    M,
+    () => ({
+      props: e,
+      element: K.current,
+      focus: xe
+    })
+  ), o.useImperativeHandle(t, () => M.current);
+  const Nt = o.useCallback(
+    () => {
+      Y.current && Y.current.setCustomValidity && Y.current.setCustomValidity(
+        ue.valid ? "" : N === void 0 ? xi : N
+      );
+    },
+    [N, ue]
+  );
+  o.useEffect(Nt), o.useEffect(() => {
+    const y = Me && window.ResizeObserver && new window.ResizeObserver(mt.bind(void 0));
+    return document != null && document.body && y && y.observe(document.body), () => {
+      y && y.disconnect();
+    };
+  }, []), o.useEffect(
+    () => {
+      Q.current && W && Q.current.setPosition(Q.current._popup);
+    },
+    [C, W]
+  );
+  const se = o.useCallback(
+    (y, k, z) => {
+      if (e.onChange) {
+        const ee = {
+          items: k,
+          operation: z,
+          ...y
+        };
+        e.onChange.call(void 0, ee);
+      }
+    },
+    [e.onChange]
+  ), ze = o.useCallback(
+    (y) => {
+      if (R(y.item, C, p) || !M.current)
+        return;
+      const { item: k, nativeEvent: z, syntheticEvent: ee } = y, ye = {
+        syntheticEvent: ee,
+        nativeEvent: z,
+        target: M.current
+      };
+      se(ye, [k], "toggle");
+    },
+    [C, p, se]
+  ), _e = o.useCallback(
+    (y) => {
+      if (!W) {
+        if (u) {
+          const k = { ...y };
+          u.call(void 0, k);
+        }
+        r === void 0 && (H(!0), Pe(C || []), J && setTimeout(() => {
+          var k;
+          Z((k = j.current) == null ? void 0 : k.element);
+        }, 300));
+      }
+    },
+    [W, r, u, J, j]
+  ), q = o.useCallback(
+    (y) => {
+      if (W) {
+        if (g) {
+          const k = { ...y };
+          g.call(void 0, k);
+        }
+        r === void 0 && H(!1);
+      }
+    },
+    [W, r, g]
+  ), he = o.useCallback(
+    (y) => {
+      we.current = !0, y(), window.setTimeout(() => we.current = !1, 0);
+    },
+    []
+  ), Z = o.useCallback(
+    (y) => {
+      y && he(() => y.focus());
+    },
+    [he]
+  ), Ot = o.useCallback(
+    () => {
+      var y;
+      !L && W ? q({ target: M.current }) : e.filterable ? Z((y = U.current) == null ? void 0 : y.element) : Z(re.current && re.current.element);
+    },
+    [L, W, Z, q, e.filterable]
+  ), Pt = o.useCallback(
+    () => {
+      L && Z(K.current);
+    },
+    [L, Z]
+  ), _t = o.useCallback(
+    (y) => {
+      if (!L && !we.current && (me(!0), e.onFocus && M.current)) {
+        const k = {
+          syntheticEvent: y,
+          nativeEvent: y.nativeEvent,
+          target: M.current
+        };
+        e.onFocus.call(void 0, k);
+      }
+    },
+    [L, e.onFocus]
+  ), pt = o.useCallback(
+    (y) => {
+      if (L && !we.current && M.current) {
+        me(!1);
+        const k = {
+          syntheticEvent: y,
+          nativeEvent: y.nativeEvent,
+          target: M.current
+        };
+        if (e.onBlur) {
+          const z = { ...k };
+          e.onBlur.call(void 0, z);
+        }
+        J || q(k);
+      }
+    },
+    [L, e.onBlur, W, r, g]
+  ), ht = o.useCallback(
+    () => {
+      L && he(De);
+    },
+    [L, he]
+  ), ut = o.useCallback(
+    (y) => {
+      if (!y.isDefaultPrevented() && M.current) {
+        me(!0);
+        const k = {
+          syntheticEvent: y,
+          nativeEvent: y.nativeEvent,
+          target: M.current
+        };
+        W || _e(k);
+      }
+    },
+    [W, _e]
+  ), gt = o.useCallback(
+    (y) => {
+      var Ie, ns;
+      const { keyCode: k, altKey: z } = y, ee = re.current && re.current.element;
+      if (!M.current || y.isDefaultPrevented() && ((Ie = U.current) == null ? void 0 : Ie.element) === y.target)
+        return;
+      const ye = {
+        syntheticEvent: y,
+        nativeEvent: y.nativeEvent,
+        target: M.current
+      };
+      if (C && C.length > 0 && (k === f.left || k === f.right || k === f.home || k === f.end || k === f.delete)) {
+        const te = ne.current;
+        let ce = oe ? te.findIndex((xs) => xt(xs, oe, p)) : -1, pe;
+        const Bt = ce !== -1;
+        k === f.left ? (Bt ? ce = Math.max(0, ce - 1) : ce = te.length - 1, pe = te[ce]) : k === f.right ? ce === te.length - 1 ? pe = void 0 : Bt && (ce = Math.min(te.length - 1, ce + 1), pe = te[ce]) : k === f.home ? pe = te[0] : k === f.end ? pe = te[te.length - 1] : k === f.delete && Bt && se(ye, te[ce].data, "delete"), pe !== oe && Le(pe);
+      }
+      if (W)
+        if (k === f.esc || z && k === f.up)
+          y.preventDefault(), q(ye);
+        else if (ee && ee.querySelector(".k-focus") && (k === f.up || k === f.down || k === f.left || k === f.right || k === f.home || k === f.end)) {
+          if (k === f.up && ((ns = U.current) != null && ns.element)) {
+            const te = Array.from(ee.querySelectorAll(".k-treeview-item")), ce = [...te].reverse().find((pe) => !!(pe && pe.querySelector(".k-focus")));
+            if (ce && te.indexOf(ce) === 0)
+              return he(() => {
+                var pe;
+                Z((pe = U.current) == null ? void 0 : pe.element);
+              });
+          }
+          he(De);
+        } else
+          k === f.down && he(() => {
+            var te;
+            Z(((te = U.current) == null ? void 0 : te.element) || ee);
+          });
+      else
+        z && k === f.down && (y.preventDefault(), _e(ye));
+    },
+    [W, q, Z, he, _e, oe, p, C, se]
+  ), Je = o.useCallback(
+    (y) => {
+      const { keyCode: k, altKey: z } = y;
+      z || k !== f.up && k !== f.down || (y.preventDefault(), he(
+        k === f.up ? () => {
+          Z(K.current);
+        } : () => {
+          Z(re.current && re.current.element);
+        }
+      ));
+    },
+    [Z, he]
+  ), Qe = o.useCallback(
+    (y) => {
+      if (!M.current)
+        return;
+      const k = {
+        syntheticEvent: y,
+        nativeEvent: y.nativeEvent,
+        target: M.current
+      };
+      se(k, [], "clear"), q(k), y.preventDefault();
+    },
+    [se, q]
+  ), Rt = o.useCallback(
+    (y, k) => {
+      var z;
+      q({ target: M.current }), L || Z((z = U.current) == null ? void 0 : z.element), se({
+        syntheticEvent: k,
+        nativeEvent: k.nativeEvent,
+        target: M.current
+      }, y, "delete");
+    },
+    [se, q, Z, L]
+  ), Xe = o.useCallback(
+    (y) => {
+      if (e.onExpandChange && M.current) {
+        const { item: k, itemHierarchicalIndex: z, nativeEvent: ee, syntheticEvent: ye } = y, Ie = {
+          level: wi(z),
+          item: k,
+          nativeEvent: ee,
+          syntheticEvent: ye,
+          target: M.current
+        };
+        e.onExpandChange.call(void 0, Ie);
+      }
+    },
+    [e.onExpandChange]
+  ), Ze = o.useCallback(
+    (y) => {
+      if (e.onFilterChange && M.current) {
+        const z = {
+          filter: { field: e.textField, operator: "contains", value: y.target.value },
+          syntheticEvent: y.syntheticEvent,
+          nativeEvent: y.nativeEvent,
+          target: M.current
+        };
+        e.onFilterChange.call(void 0, z), e.filter === void 0 && X(y.target.value);
+      }
+    },
+    [e.onFilterChange, e.filter, e.textField]
+  ), ft = o.useCallback(
+    (y) => {
+      if (!M.current)
+        return;
+      const k = {
+        syntheticEvent: y,
+        nativeEvent: y.nativeEvent,
+        target: M.current
+      };
+      e.onCancel && e.onCancel.call(void 0, k), q(k), y.preventDefault();
+    },
+    [e.onCancel, q]
+  ), et = () => {
+    const y = e.filterable ? /* @__PURE__ */ o.createElement(
+      Be,
+      {
+        value: e.filter === void 0 ? A : e.filter,
+        ref: j,
+        onChange: Ze,
+        onKeyDown: Je,
+        size: ae,
+        rounded: I,
+        fillMode: T
+      }
+    ) : null, k = {
+      adaptiveTitle: e.adaptiveTitle,
+      expand: W,
+      onClose: (z) => e.onCancel ? ft(z) : Qe(z),
+      windowWidth: Ce,
+      mobileFilter: y,
+      footer: {
+        cancelText: be.toLanguageString(ot, le[ot]),
+        onCancel: (z) => e.onCancel ? ft(z) : Qe(z),
+        applyText: be.toLanguageString(nt, le[nt]),
+        onApply: (z) => q(z)
+      }
+    };
+    return /* @__PURE__ */ o.createElement(es, { ...k }, /* @__PURE__ */ o.createElement(lt, { className: "!k-overflow-hidden" }, /* @__PURE__ */ o.createElement("div", { className: "k-list-container" }, /* @__PURE__ */ o.createElement("div", { className: "k-list k-list-lg" }, a.length > 0 ? /* @__PURE__ */ o.createElement(
+      Ct,
+      {
+        ref: re,
+        tabIndex: E,
+        data: a,
+        focusIdField: p,
+        textField: e.textField,
+        checkField: w,
+        checkIndeterminateField: S,
+        expandField: e.expandField,
+        childrenField: D,
+        expandIcons: !0,
+        onItemClick: ze,
+        onCheckChange: ze,
+        onExpandChange: Xe,
+        checkboxes: !0,
+        size: ae,
+        item: e.item,
+        dir: ve
+      }
+    ) : /* @__PURE__ */ o.createElement(ge, null, be.toLanguageString(fe, le[fe]))))));
+  }, mt = o.useCallback(
+    (y) => {
+      for (let k of y)
+        Ne(k.target.clientWidth);
+    },
+    []
+  ), ge = e.listNoData || ks, be = vs(), Ee = !x || ue.valid, { size: ae, rounded: I, fillMode: T } = e, $ = J && W ? Oe : ne.current, de = /* @__PURE__ */ o.createElement(o.Fragment, null, /* @__PURE__ */ o.createElement(
+    "span",
+    {
+      className: B("k-multiselecttree k-input", e.className, {
+        [`k-input-${us[ae] || ae}`]: ae,
+        [`k-rounded-${Si[I] || I}`]: I,
+        [`k-input-${T}`]: T,
+        "k-focus": L && !h,
+        "k-invalid": !Ee,
+        "k-disabled": h,
+        "k-loading": e.loading,
+        "k-required": F
+      }),
+      tabIndex: E,
+      accessKey: e.accessKey,
+      id: n,
+      style: v ? { ...d, width: void 0 } : d,
+      dir: ve,
+      ref: K,
+      onKeyDown: h ? void 0 : gt,
+      onMouseDown: ht,
+      onFocus: _t,
+      onBlur: pt,
+      role: "combobox",
+      "aria-haspopup": "tree",
+      "aria-expanded": W,
+      "aria-disabled": h,
+      "aria-label": v,
+      "aria-labelledby": e.ariaLabelledBy,
+      "aria-describedby": e.ariaDescribedBy ? e.ariaDescribedBy : "tagslist-" + n,
+      "aria-required": e.required,
+      onClick: h ? void 0 : ut
+    },
+    /* @__PURE__ */ o.createElement(
+      "div",
+      {
+        id: "tagslist-" + n,
+        className: B("k-input-values k-chip-list k-selection-multiple", {
+          [`k-chip-list-${us[ae] || ae}`]: ae
+        })
+      },
+      $.length > 0 ? /* @__PURE__ */ o.createElement(
+        ys,
+        {
+          tag: e.tag,
+          onTagDelete: Rt,
+          data: $,
+          guid: n,
+          focused: oe ? ne.current.find((y) => xt(y, oe, p)) : void 0,
+          size: ae
+        }
+      ) : m
+    ),
+    /* @__PURE__ */ o.createElement("span", { className: "k-input-inner" }, /* @__PURE__ */ o.createElement("span", { className: "k-input-value-text" }, " ")),
+    e.loading && /* @__PURE__ */ o.createElement(ke, { className: "k-input-loading-icon", name: "loading" }),
+    Ye && !h && $.length > 0 && /* @__PURE__ */ o.createElement(rt, { onClick: Qe }),
+    /* @__PURE__ */ o.createElement(
+      "select",
+      {
+        name: b,
+        ref: Y,
+        tabIndex: -1,
+        "aria-hidden": !0,
+        title: v,
+        style: { opacity: 0, width: 1, border: 0, zIndex: -1, position: "absolute", left: "50%" }
+      },
+      /* @__PURE__ */ o.createElement(
+        "option",
+        {
+          value: e.valueMap ? e.valueMap.call(void 0, C) : C
+        }
+      )
+    ),
+    !J && /* @__PURE__ */ o.createElement(
+      jt,
+      {
+        popupClass: B(
+          c.popupClass,
+          "k-multiselecttree-popup"
+        ),
+        className: B(c.className, { "k-rtl": ve === "rtl" }),
+        style: ct,
+        animate: c.animate,
+        anchor: K.current,
+        show: W,
+        onOpen: Ot,
+        onClose: Pt,
+        appendTo: c.appendTo,
+        ref: Q
+      },
+      e.filterable && /* @__PURE__ */ o.createElement(
+        Be,
+        {
+          value: e.filter === void 0 ? A : e.filter,
+          ref: U,
+          onChange: Ze,
+          onKeyDown: Je,
+          tabIndex: E,
+          size: ae,
+          rounded: I,
+          fillMode: T
+        }
+      ),
+      a.length > 0 ? /* @__PURE__ */ o.createElement(
+        Ct,
+        {
+          ref: re,
+          tabIndex: E,
+          data: a,
+          focusIdField: p,
+          textField: e.textField,
+          checkField: w,
+          checkIndeterminateField: S,
+          expandField: e.expandField,
+          childrenField: D,
+          expandIcons: !0,
+          onItemClick: ze,
+          onCheckChange: ze,
+          onExpandChange: Xe,
+          checkboxes: !0,
+          size: ae,
+          item: e.item,
+          dir: ve
+        }
+      ) : /* @__PURE__ */ o.createElement(ge, null, be.toLanguageString(fe, le[fe]))
+    )
+  ), J && et());
+  return v ? /* @__PURE__ */ o.createElement(
+    Ge,
+    {
+      label: v,
+      editorValue: Ye,
+      editorPlaceholder: m,
+      editorValid: Ee,
+      editorDisabled: h,
+      editorId: n,
+      style: { width: d ? d.width : void 0 },
+      children: de,
+      dir: ve
+    }
+  ) : de;
+}), Ti = {
+  opened: l.bool,
+  disabled: l.bool,
+  dir: l.string,
+  tabIndex: l.number,
+  accessKey: l.string,
+  data: l.array,
+  value: l.any,
+  valueMap: l.func,
+  placeholder: l.string,
+  dataItemKey: l.string.isRequired,
+  textField: l.string.isRequired,
+  checkField: l.string,
+  checkIndeterminateField: l.string,
+  expandField: l.string,
+  subItemsField: l.string,
+  className: l.string,
+  style: l.object,
+  label: l.string,
+  validationMessage: l.string,
+  validityStyles: l.bool,
+  valid: l.bool,
+  required: l.bool,
+  name: l.string,
+  id: l.string,
+  ariaLabelledBy: l.string,
+  ariaDescribedBy: l.string,
+  filterable: l.bool,
+  filter: l.string,
+  loading: l.bool,
+  tags: l.arrayOf(l.shape({
+    text: l.string,
+    data: l.arrayOf(l.any)
+  })),
+  popupSettings: l.shape({
+    animate: l.oneOfType([l.bool, l.shape({
+      openDuration: l.number,
+      closeDuration: l.number
+    })]),
+    popupClass: l.string,
+    className: l.string,
+    appendTo: l.any,
+    width: l.oneOfType([l.string, l.number]),
+    height: l.oneOfType([l.string, l.number])
+  }),
+  onOpen: l.func,
+  onClose: l.func,
+  onFocus: l.func,
+  onBlur: l.func,
+  onChange: l.func,
+  onFilterChange: l.func,
+  onExpandChange: l.func,
+  onCancel: l.func,
+  item: l.func,
+  listNoData: l.func,
+  adaptiveTitle: l.string,
+  adaptive: l.bool
+};
+ss.displayName = "KendoReactMultiSelectTree";
+ss.defaultProps = Re;
+ss.propTypes = Ti;
+const tt = (i, t) => {
+  const e = {};
+  return i && i.length && i.forEach((s) => {
+    e[t(s)] = !0;
+  }), e;
+}, Ki = (i, t) => {
+  const {
+    items: e,
+    dataItemKey: s,
+    value: n,
+    subItemsField: a = "items",
+    operation: p
+  } = t, c = kt(s), d = tt(n, c);
+  if (p === "clear")
+    return [];
+  if (p === "delete") {
+    const O = tt(e, c);
+    return n.filter((_) => !O[c(_)]);
+  }
+  const r = e[0], h = c(r), u = kt(a), g = [...i], m = [];
+  let v = [], b;
+  for (; g.length; ) {
+    const O = g.pop();
+    if (h === c(O)) {
+      v = m.map((_) => _.item), b = O;
+      break;
+    } else {
+      m && m.length && m[m.length - 1].parentPosition === g.length && m.pop();
+      const _ = u(O);
+      _ && _.length && (m.push({ item: O, parentPosition: g.length }), g.push(..._));
+    }
+  }
+  const w = [...u(b) || []];
+  let S = [];
+  for (; w.length; ) {
+    const O = w.pop();
+    S.push(O);
+    const _ = u(O);
+    _ && _.length && w.push(..._);
+  }
+  const D = !d[h], N = [];
+  if (D) {
+    N.push(...n), N.push(b), N.push(...S.filter((C) => !d[c(C)]));
+    const O = v.filter((C) => !d[c(C)]), _ = tt(N, c);
+    for (let C = O.length - 1; C > -1; C--) {
+      const F = O[C], x = u(F);
+      if (x.filter((M) => _[c(M)]).length < x.length)
+        break;
+      N.push(F), _[c(F)] = !0;
+    }
+  } else {
+    const O = c(b), _ = tt(S, c), C = tt(v, c);
+    N.push(
+      ...n.filter((F) => {
+        const x = c(F);
+        return !_[x] && O !== x && !C[x];
+      })
+    );
+  }
+  return N;
+};
+export {
+  oi as AutoComplete,
+  ni as AutoCompletePropsContext,
+  Tt as AutoCompleteWithoutContext,
+  bs as ComboBox,
+  ti as ComboBoxPropsContext,
+  dt as ComboBoxWithoutContext,
+  Xs as DropDownList,
+  Qs as DropDownListPropsContext,
+  Dt as DropDownListWithoutContext,
+  Cs as DropDownTree,
+  ki as DropDownTreePropsContext,
+  Ue as List,
+  Et as ListContainer,
+  Be as ListFilter,
+  qs as ListItem,
+  ts as MultiColumnComboBox,
+  gi as MultiColumnComboBoxPropsContext,
+  pi as MultiSelect,
+  ci as MultiSelectPropsContext,
+  ss as MultiSelectTree,
+  Di as MultiSelectTreePropsContext,
+  Ft as MultiSelectWithoutContext,
+  Zt as SearchBar,
+  ys as TagList,
+  le as dropdownsMessages,
+  Ki as getMultiSelectTreeValue,
+  tt as getValueMap,
+  fe as nodata,
+  Ks as scrollToItem
+};