@progress/kendo-react-dropdowns 8.2.1-develop.5 → 8.3.0-develop.10

package/MultiSelectTree/MultiSelectTree.mjs

@@ -72,27 +72,27 @@ const It = "Please select a value from the list!", { sizeMap: Ne, roundedMap: St
     validityStyles: Be = y.validityStyles,
     onOpen: ae = Z,
     onClose: z = Z
-  } = a, _ = lt(a.tabIndex, E), l = t.useRef(null), C = t.useRef(null), w = t.useRef(null), ie = t.useRef(null), $ = t.useRef(null), k = t.useRef(null), H = t.useRef(!1), G = t.useRef([]), U = t.useRef(null), [N, Ve] = t.useState(), [Ke, he] = t.useState(!1), [d, re] = t.useState(!1), [oe, qe] = t.useState(), [Ae, We] = t.useState([]), [be, ze] = t.useState(""), P = !!(oe && oe <= xt && a.adaptive), s = S !== void 0 ? S : Ke, le = !!(Array.isArray(m) && m.length), se = Tt({ validationMessage: A, valid: Le, required: ve }, le), T = st(C, a.dir), _e = {
+  } = a, _ = lt(a.tabIndex, E), l = t.useRef(null), C = t.useRef(null), w = t.useRef(null), ie = t.useRef(null), H = t.useRef(null), k = t.useRef(null), $ = t.useRef(!1), G = t.useRef([]), U = t.useRef(null), [N, Ve] = t.useState(), [Ke, he] = t.useState(!1), [d, re] = t.useState(!1), [oe, qe] = t.useState(), [Ae, We] = t.useState([]), [be, ze] = t.useState(""), P = !!(oe && oe <= xt && a.adaptive), s = S !== void 0 ? S : Ke, le = !!(Array.isArray(m) && m.length), se = Tt({ validationMessage: A, valid: Le, required: ve }, le), T = st(C, a.dir), _e = {
     width: ht(C, y, R, L),
     ...T !== void 0 ? { direction: T } : {}
-  }, $e = t.useCallback(() => C.current && C.current.focus(), []);
+  }, He = t.useCallback(() => C.current && C.current.focus(), []);
   G.current = pe === void 0 ? (m || []).map((e) => ({ text: gt(e, a.textField), data: [e] })) : [...pe], t.useImperativeHandle(
     l,
     () => ({
       props: a,
       element: C.current,
-      focus: $e
+      focus: He
     })
   ), t.useImperativeHandle(M, () => l.current);
-  const He = t.useCallback(
+  const $e = t.useCallback(
     () => {
-      $.current && $.current.setCustomValidity && $.current.setCustomValidity(
+      H.current && H.current.setCustomValidity && H.current.setCustomValidity(
         se.valid ? "" : A === void 0 ? It : A
       );
     },
     [A, se]
   );
-  t.useEffect(He), t.useEffect(() => {
+  t.useEffect($e), t.useEffect(() => {
     const e = ct && window.ResizeObserver && new window.ResizeObserver(tt.bind(void 0));
     return document != null && document.body && e && e.observe(document.body), () => {
       e && e.disconnect();
@@ -154,7 +154,7 @@ const It = "Please select a value from the list!", { sizeMap: Ne, roundedMap: St
     [s, S, z]
   ), h = t.useCallback(
     (e) => {
-      H.current = !0, e(), window.setTimeout(() => H.current = !1, 0);
+      $.current = !0, e(), window.setTimeout(() => $.current = !1, 0);
     },
     []
   ), u = t.useCallback(
@@ -175,7 +175,7 @@ const It = "Please select a value from the list!", { sizeMap: Ne, roundedMap: St
     [d, u]
   ), je = t.useCallback(
     (e) => {
-      if (!d && !H.current && (re(!0), a.onFocus && l.current)) {
+      if (!d && !$.current && (re(!0), a.onFocus && l.current)) {
         const i = {
           syntheticEvent: e,
           nativeEvent: e.nativeEvent,
@@ -187,7 +187,7 @@ const It = "Please select a value from the list!", { sizeMap: Ne, roundedMap: St
     [d, a.onFocus]
   ), Je = t.useCallback(
     (e) => {
-      if (d && !H.current && l.current) {
+      if (d && !$.current && l.current) {
         re(!1);
         const i = {
           syntheticEvent: e,
@@ -357,7 +357,7 @@ const It = "Please select a value from the list!", { sizeMap: Ne, roundedMap: St
         onApply: (r) => g(r)
       }
     };
-    return /* @__PURE__ */ t.createElement(kt, { ...i }, /* @__PURE__ */ t.createElement(Ft, { className: "!k-overflow-hidden" }, /* @__PURE__ */ t.createElement("div", { className: "k-list-container" }, /* @__PURE__ */ t.createElement("div", { className: "k-list k-list-lg" }, q.length > 0 ? /* @__PURE__ */ t.createElement(
+    return /* @__PURE__ */ t.createElement(kt, { ...i }, /* @__PURE__ */ t.createElement(Ft, { overflowHidden: !0 }, /* @__PURE__ */ t.createElement("div", { className: "k-list-container" }, /* @__PURE__ */ t.createElement("div", { className: "k-list k-list-lg" }, q.length > 0 ? /* @__PURE__ */ t.createElement(
       we,
       {
         ref: k,
@@ -445,7 +445,7 @@ const It = "Please select a value from the list!", { sizeMap: Ne, roundedMap: St
       "select",
       {
         name: Oe,
-        ref: $,
+        ref: H,
         tabIndex: -1,
         "aria-hidden": !0,
         title: B,

package/common/ClearButton.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";const i=require("react"),a=require("@progress/kendo-react-intl"),o=require("../messages/index.js"),u=require("@progress/kendo-react-common"),l=require("@progress/kendo-svg-icons");function p(t){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const n in t)if(n!=="default"){const c=Object.getOwnPropertyDescriptor(t,n);Object.defineProperty(e,n,c.get?c:{enumerable:!0,get:()=>t[n]})}}return e.default=t,Object.freeze(e)}const r=p(i);class s extends r.Component{constructor(){super(...arguments),this.onMouseDown=e=>e.preventDefault()}render(){const e=a.provideLocalizationService(this).toLanguageString(o.clear,o.messages[o.clear]);return r.createElement("span",{className:"k-clear-value",role:"button",onClick:this.props.onClick,onMouseDown:this.onMouseDown,tabIndex:-1,title:e,key:"clearbutton"},r.createElement(u.IconWrap,{name:"x",icon:l.xIcon}))}}a.registerForLocalization(s);module.exports=s;
+"use client";"use strict";const i=require("react"),d=require("@progress/kendo-react-intl"),s=require("../messages/index.js"),c=require("@progress/kendo-react-common"),m=require("@progress/kendo-svg-icons");function p(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const o=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,o.get?o:{enumerable:!0,get:()=>e[t]})}}return n.default=e,Object.freeze(n)}const a=p(i),f=e=>{const n=d.useLocalization(),t=c.useUnstyled(),o=t&&t.uDropDownsBase,r=n.toLanguageString(s.clear,s.messages[s.clear]),l=u=>u.preventDefault();return a.createElement("span",{className:c.classNames(c.uDropDownsBase.clearButton({c:o})),role:"button",onClick:e.onClick,onMouseDown:l,tabIndex:-1,title:r,key:"clearbutton"},a.createElement(c.IconWrap,{name:"x",icon:m.xIcon}))};module.exports=f;

package/common/ClearButton.mjs

@@ -7,32 +7,26 @@
  */
 "use client";
 import * as o from "react";
-import { provideLocalizationService as r, registerForLocalization as n } from "@progress/kendo-react-intl";
-import { clear as t, messages as a } from "../messages/index.mjs";
-import { IconWrap as s } from "@progress/kendo-react-common";
-import { xIcon as i } from "@progress/kendo-svg-icons";
-class c extends o.Component {
-  constructor() {
-    super(...arguments), this.onMouseDown = (e) => e.preventDefault();
-  }
-  render() {
-    const e = r(this).toLanguageString(t, a[t]);
-    return /* @__PURE__ */ o.createElement(
-      "span",
-      {
-        className: "k-clear-value",
-        role: "button",
-        onClick: this.props.onClick,
-        onMouseDown: this.onMouseDown,
-        tabIndex: -1,
-        title: e,
-        key: "clearbutton"
-      },
-      /* @__PURE__ */ o.createElement(s, { name: "x", icon: i })
-    );
-  }
-}
-n(c);
+import { useLocalization as m } from "@progress/kendo-react-intl";
+import { clear as t, messages as i } from "../messages/index.mjs";
+import { useUnstyled as u, classNames as p, uDropDownsBase as f, IconWrap as d } from "@progress/kendo-react-common";
+import { xIcon as D } from "@progress/kendo-svg-icons";
+const b = (n) => {
+  const s = m(), e = u(), a = e && e.uDropDownsBase, r = s.toLanguageString(t, i[t]), c = (l) => l.preventDefault();
+  return /* @__PURE__ */ o.createElement(
+    "span",
+    {
+      className: p(f.clearButton({ c: a })),
+      role: "button",
+      onClick: n.onClick,
+      onMouseDown: c,
+      tabIndex: -1,
+      title: r,
+      key: "clearbutton"
+    },
+    /* @__PURE__ */ o.createElement(d, { name: "x", icon: D })
+  );
+};
 export {
-  c as default
+  b as default
 };

package/common/GroupStickyHeader.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";const o=require("react");function a(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const c=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,c.get?c:{enumerable:!0,get:()=>e[r]})}}return t.default=e,Object.freeze(t)}const s=a(o);class i extends s.Component{render(){const{group:t,groupMode:r,render:c}=this.props,n=s.createElement("div",{className:"k-list-group-sticky-header"},r==="classic"?t:s.createElement("div",{className:"k-list-header-text"},t));return c!==void 0?c.call(void 0,n,this.props):n}}module.exports=i;
+"use client";"use strict";const c=require("@progress/kendo-react-common"),u=require("react");function i(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const s in e)if(s!=="default"){const r=Object.getOwnPropertyDescriptor(e,s);Object.defineProperty(t,s,r.get?r:{enumerable:!0,get:()=>e[s]})}}return t.default=e,Object.freeze(t)}const l=i(u),d=e=>{const{group:t,groupMode:s,render:r}=e,n=c.useUnstyled(),o=n&&n.uDropDownsBase,a=l.createElement("div",{className:c.classNames(c.uDropDownsBase.groupStickyHeader({c:o}))},s==="classic"?t:l.createElement("div",{className:c.classNames(c.uDropDownsBase.listHeaderText({c:o}))},t));return r!==void 0?r.call(void 0,a,e):a};module.exports=d;

package/common/GroupStickyHeader.mjs

@@ -6,17 +6,16 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-import * as e from "react";
-class c extends e.Component {
-  render() {
-    const {
-      group: r,
-      groupMode: a,
-      render: t
-    } = this.props, s = /* @__PURE__ */ e.createElement("div", { className: "k-list-group-sticky-header" }, a === "classic" ? r : /* @__PURE__ */ e.createElement("div", { className: "k-list-header-text" }, r));
-    return t !== void 0 ? t.call(void 0, s, this.props) : s;
-  }
-}
+import { useUnstyled as i, classNames as c, uDropDownsBase as d } from "@progress/kendo-react-common";
+import * as l from "react";
+const m = (e) => {
+  const {
+    group: s,
+    groupMode: n,
+    render: t
+  } = e, r = i(), a = r && r.uDropDownsBase, o = /* @__PURE__ */ l.createElement("div", { className: c(d.groupStickyHeader({ c: a })) }, n === "classic" ? s : /* @__PURE__ */ l.createElement("div", { className: c(d.listHeaderText({ c: a })) }, s));
+  return t !== void 0 ? t.call(void 0, o, e) : o;
+};
 export {
-  c as default
+  m as default
 };

package/common/List.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";const x=require("react"),M=require("./ListItem.js"),O=require("./ListGroupItem.js"),f=require("./utils.js"),D=require("@progress/kendo-react-intl"),k=require("../messages/index.js");function j(s){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(s){for(const e in s)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(s,e);Object.defineProperty(r,e,t.get?t:{enumerable:!0,get:()=>s[e]})}}return r.default=s,Object.freeze(r)}const o=j(x);class N extends o.Component{renderItems(){const{textField:r,valueField:e,groupField:t,groupMode:n,isMultiColumn:v,optionsGuid:c,skip:d=0,virtual:u,focusedIndex:p,hasDuplicates:S,highlightSelected:m=!0,value:g,data:E,itemRender:w,groupHeaderItemRender:q}=this.props,R=Array.isArray(g);let C=0;return E.map((a,i)=>{const I=d+i,y=d+i+C,z=S?g?p===i:!1:a.disabled?!1:m&&(!R&&f.areSame(a,g,e)||R&&g.findIndex(L=>f.areSame(L,a,e))!==-1);let l,h,b;return i>0&&t!==void 0&&(h=f.getItemValue(a,t),b=f.getItemValue(E[i-1],t),h&&b&&h!==b&&(l=h)),l!==void 0&&n==="modern"&&(C+=1),[l!==void 0&&n==="modern"&&o.createElement(O,{id:`option-${c}-${y}`,virtual:u,key:I+"-group-item",group:l,isMultiColumn:v,render:q}),o.createElement(M,{id:`option-${c}-${l!==void 0&&n==="modern"?y+1:y}`,virtual:u,dataItem:a,groupMode:n,selected:z,focused:p===i,index:I,key:I,onClick:this.props.onClick,textField:r,group:l,render:w,disabled:a.disabled})]})}renderNoValueElement(r){const e=this.props.noDataRender,t=o.createElement("div",{className:"k-nodata"},o.createElement("div",null,r.toLanguageString(k.nodata,k.messages[k.nodata])));return e?e.call(void 0,t):t}render(){const r=D.provideLocalizationService(this),{id:e,show:t,wrapperCssClass:n,wrapperStyle:v,listStyle:c,listRef:d,wrapperRef:u,listClassName:p="k-list-ul",ariaSetSize:S}=this.props,m=this.renderItems();return m.length?o.createElement("div",{className:n,style:v,ref:u,onMouseDown:this.props.onMouseDown,onBlur:this.props.onBlur,onScroll:this.props.onScroll,unselectable:"on"},o.createElement("ul",{id:e,role:"listbox","aria-hidden":t?void 0:!0,"aria-setsize":S,className:p,ref:d,style:c},m),this.props.scroller&&o.createElement("div",{className:"k-height-container"},this.props.scroller)):this.renderNoValueElement(r)}}D.registerForLocalization(N);module.exports=N;
+"use client";"use strict";const T=require("react"),U=require("./ListItem.js"),J=require("./ListGroupItem.js"),f=require("./utils.js"),K=require("@progress/kendo-react-intl"),I=require("../messages/index.js"),n=require("@progress/kendo-react-common");function Q(e){const c=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const s=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(c,t,s.get?s:{enumerable:!0,get:()=>e[t]})}}return c.default=e,Object.freeze(c)}const r=Q(T),W=e=>{const c=K.useLocalization(),t=n.useUnstyled(),s=t&&t.uDropDownsBase,{id:k,show:q,wrapperCssClass:B,wrapperStyle:L,listStyle:z,listRef:M,wrapperRef:O,listClassName:$,ariaSetSize:j}=e,S=(()=>{const{textField:u,valueField:i,groupField:v,groupMode:d,isMultiColumn:A,optionsGuid:b,skip:w=0,virtual:C,focusedIndex:N,hasDuplicates:F,highlightSelected:V=!0,value:m,data:R,itemRender:_,groupHeaderItemRender:G}=e,h=Array.isArray(m);let E=0;return R.map((a,o)=>{const D=w+o,p=w+o+E,P=F?m?N===o:!1:a.disabled?!1:V&&(!h&&f.areSame(a,m,i)||h&&m.findIndex(H=>f.areSame(H,a,i))!==-1);let l,g,y;return o>0&&v!==void 0&&(g=f.getItemValue(a,v),y=f.getItemValue(R[o-1],v),g&&y&&g!==y&&(l=g)),l!==void 0&&d==="modern"&&(E+=1),[l!==void 0&&d==="modern"&&r.createElement(J,{id:`option-${b}-${p}`,virtual:C,key:D+"-group-item",group:l,isMultiColumn:A,render:G}),r.createElement(U,{id:`option-${b}-${l!==void 0&&d==="modern"?p+1:p}`,virtual:C,dataItem:a,groupMode:d,selected:P,focused:N===o,index:D,key:D,onClick:e.onClick,textField:u,group:l,render:_,disabled:a.disabled})]})})(),x=()=>{const u=e.noDataRender,i=r.createElement("div",{className:n.classNames(n.uDropDownsBase.noData({c:s}))},r.createElement("div",null,c.toLanguageString(I.nodata,I.messages[I.nodata])));return u?u.call(void 0,i):i};return S.length?r.createElement("div",{className:B,style:L,ref:O,onMouseDown:e.onMouseDown,onBlur:e.onBlur,onScroll:e.onScroll,unselectable:"on"},r.createElement("ul",{id:k,role:"listbox","aria-hidden":q?void 0:!0,"aria-setsize":j,className:$||n.classNames(n.uDropDownsBase.ul({c:s})),ref:M,style:z},S),e.scroller&&r.createElement("div",{className:n.classNames(n.uDropDownsBase.heightContainer({c:s}))},e.scroller)):x()},X=W;module.exports=X;

package/common/List.mjs

@@ -7,112 +7,108 @@
  */
 "use client";
 import * as t from "react";
-import z from "./ListItem.mjs";
-import x from "./ListGroupItem.mjs";
-import { areSame as C, getItemValue as N } from "./utils.mjs";
-import { provideLocalizationService as F, registerForLocalization as M } from "@progress/kendo-react-intl";
-import { nodata as R, messages as $ } from "../messages/index.mjs";
-class A extends t.Component {
-  renderItems() {
+import Q from "./ListItem.mjs";
+import T from "./ListGroupItem.mjs";
+import { areSame as R, getItemValue as L } from "./utils.mjs";
+import { useLocalization as W } from "@progress/kendo-react-intl";
+import { nodata as b, messages as X } from "../messages/index.mjs";
+import { useUnstyled as Y, classNames as g, uDropDownsBase as p } from "@progress/kendo-react-common";
+const Z = (e) => {
+  const k = W(), y = Y(), c = y && y.uDropDownsBase, {
+    id: B,
+    show: $,
+    wrapperCssClass: z,
+    wrapperStyle: M,
+    listStyle: x,
+    listRef: A,
+    wrapperRef: F,
+    listClassName: G,
+    ariaSetSize: V
+  } = e, D = (() => {
     const {
-      textField: l,
-      valueField: r,
-      groupField: e,
-      groupMode: o,
-      isMultiColumn: f,
-      optionsGuid: n,
-      skip: d = 0,
-      virtual: p,
-      focusedIndex: c,
-      hasDuplicates: v,
-      highlightSelected: m = !0,
-      value: u,
+      textField: n,
+      valueField: s,
+      groupField: u,
+      groupMode: l,
+      isMultiColumn: U,
+      optionsGuid: I,
+      skip: S = 0,
+      virtual: h,
+      focusedIndex: C,
+      hasDuplicates: j,
+      highlightSelected: q = !0,
+      value: i,
       data: E,
-      itemRender: w,
-      groupHeaderItemRender: D
-    } = this.props, y = Array.isArray(u);
-    let k = 0;
-    return E.map((s, i) => {
-      const g = d + i, I = d + i + k, L = v ? u ? c === i : !1 : s.disabled ? !1 : m && (!y && C(s, u, r) || y && u.findIndex((b) => C(b, s, r)) !== -1);
-      let a, h, S;
-      return i > 0 && e !== void 0 && (h = N(s, e), S = N(E[i - 1], e), h && S && h !== S && (a = h)), a !== void 0 && o === "modern" && (k += 1), [
-        a !== void 0 && o === "modern" && /* @__PURE__ */ t.createElement(
-          x,
+      itemRender: J,
+      groupHeaderItemRender: K
+    } = e, w = Array.isArray(i);
+    let N = 0;
+    return E.map((o, r) => {
+      const m = S + r, f = S + r + N, O = j ? i ? C === r : !1 : o.disabled ? !1 : q && (!w && R(o, i, s) || w && i.findIndex((P) => R(P, o, s)) !== -1);
+      let a, d, v;
+      return r > 0 && u !== void 0 && (d = L(o, u), v = L(E[r - 1], u), d && v && d !== v && (a = d)), a !== void 0 && l === "modern" && (N += 1), [
+        a !== void 0 && l === "modern" && /* @__PURE__ */ t.createElement(
+          T,
           {
-            id: `option-${n}-${I}`,
-            virtual: p,
-            key: g + "-group-item",
+            id: `option-${I}-${f}`,
+            virtual: h,
+            key: m + "-group-item",
             group: a,
-            isMultiColumn: f,
-            render: D
+            isMultiColumn: U,
+            render: K
           }
         ),
         /* @__PURE__ */ t.createElement(
-          z,
+          Q,
           {
-            id: `option-${n}-${a !== void 0 && o === "modern" ? I + 1 : I}`,
-            virtual: p,
-            dataItem: s,
-            groupMode: o,
-            selected: L,
-            focused: c === i,
-            index: g,
-            key: g,
-            onClick: this.props.onClick,
-            textField: l,
+            id: `option-${I}-${a !== void 0 && l === "modern" ? f + 1 : f}`,
+            virtual: h,
+            dataItem: o,
+            groupMode: l,
+            selected: O,
+            focused: C === r,
+            index: m,
+            key: m,
+            onClick: e.onClick,
+            textField: n,
             group: a,
-            render: w,
-            disabled: s.disabled
+            render: J,
+            disabled: o.disabled
           }
         )
       ];
     });
-  }
-  renderNoValueElement(l) {
-    const r = this.props.noDataRender, e = /* @__PURE__ */ t.createElement("div", { className: "k-nodata" }, /* @__PURE__ */ t.createElement("div", null, l.toLanguageString(R, $[R])));
-    return r ? r.call(void 0, e) : e;
-  }
-  render() {
-    const l = F(this), {
-      id: r,
-      show: e,
-      wrapperCssClass: o,
-      wrapperStyle: f,
-      listStyle: n,
-      listRef: d,
-      wrapperRef: p,
-      listClassName: c = "k-list-ul",
-      ariaSetSize: v
-    } = this.props, m = this.renderItems();
-    return m.length ? /* @__PURE__ */ t.createElement(
-      "div",
+  })(), H = () => {
+    const n = e.noDataRender, s = /* @__PURE__ */ t.createElement("div", { className: g(p.noData({ c })) }, /* @__PURE__ */ t.createElement("div", null, k.toLanguageString(b, X[b])));
+    return n ? n.call(void 0, s) : s;
+  };
+  return D.length ? /* @__PURE__ */ t.createElement(
+    "div",
+    {
+      className: z,
+      style: M,
+      ref: F,
+      onMouseDown: e.onMouseDown,
+      onBlur: e.onBlur,
+      onScroll: e.onScroll,
+      unselectable: "on"
+    },
+    /* @__PURE__ */ t.createElement(
+      "ul",
       {
-        className: o,
-        style: f,
-        ref: p,
-        onMouseDown: this.props.onMouseDown,
-        onBlur: this.props.onBlur,
-        onScroll: this.props.onScroll,
-        unselectable: "on"
+        id: B,
+        role: "listbox",
+        "aria-hidden": $ ? void 0 : !0,
+        "aria-setsize": V,
+        className: G || g(p.ul({ c })),
+        ref: A,
+        style: x
       },
-      /* @__PURE__ */ t.createElement(
-        "ul",
-        {
-          id: r,
-          role: "listbox",
-          "aria-hidden": e ? void 0 : !0,
-          "aria-setsize": v,
-          className: c,
-          ref: d,
-          style: n
-        },
-        m
-      ),
-      this.props.scroller && /* @__PURE__ */ t.createElement("div", { className: "k-height-container" }, this.props.scroller)
-    ) : this.renderNoValueElement(l);
-  }
-}
-M(A);
+      D
+    ),
+    e.scroller && /* @__PURE__ */ t.createElement("div", { className: g(p.heightContainer({ c })) }, e.scroller)
+  ) : H();
+}, ne = Z;
 export {
-  A as default
+  ne as default
 };

package/common/ListContainer.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";const s=require("react"),u=require("@progress/kendo-react-popup");function a(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return n.default=e,Object.freeze(n)}const c=a(s);class p extends c.Component{render(){const{children:n,width:t,dir:r,itemsCount:o,popupSettings:i}=this.props;return c.createElement(u.Popup,{style:{width:t,direction:r},contentKey:o&&o.join(),...i},n)}}module.exports=p;
+"use client";"use strict";const i=require("react"),s=require("@progress/kendo-react-popup");function u(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const o=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,o.get?o:{enumerable:!0,get:()=>e[t]})}}return n.default=e,Object.freeze(n)}const a=u(i),p=e=>{const{children:n,width:t,dir:o,itemsCount:r,popupSettings:c}=e;return a.createElement(s.Popup,{style:{width:t,direction:o},contentKey:r&&r.join(),...c},n)},l=p;module.exports=l;

package/common/ListContainer.mjs

@@ -6,28 +6,26 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-import * as e from "react";
-import { Popup as s } from "@progress/kendo-react-popup";
-class a extends e.Component {
-  render() {
-    const {
-      children: n,
-      width: o,
-      dir: r,
-      itemsCount: t,
-      popupSettings: i
-    } = this.props;
-    return /* @__PURE__ */ e.createElement(
-      s,
-      {
-        style: { width: o, direction: r },
-        contentKey: t && t.join(),
-        ...i
-      },
-      n
-    );
-  }
-}
+import * as s from "react";
+import { Popup as c } from "@progress/kendo-react-popup";
+const p = (e) => {
+  const {
+    children: n,
+    width: o,
+    dir: i,
+    itemsCount: t,
+    popupSettings: r
+  } = e;
+  return /* @__PURE__ */ s.createElement(
+    c,
+    {
+      style: { width: o, direction: i },
+      contentKey: t && t.join(),
+      ...r
+    },
+    n
+  );
+}, m = p;
 export {
-  a as default
+  m as default
 };

package/common/ListDefaultItem.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";const r=require("react"),c=require("@progress/kendo-react-common"),l=require("./utils.js");function a(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const s=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,s.get?s:{enumerable:!0,get:()=>e[t]})}}return n.default=e,Object.freeze(n)}const o=a(r),i=e=>e.preventDefault();class u extends o.Component{render(){const{selected:n,defaultItem:t,textField:s}=this.props;return o.createElement("div",{onClick:this.props.onClick,onMouseDown:i,style:{position:"unset"},className:c.classNames("k-list-optionlabel",{"k-selected":n})},l.getItemValue(t,s)||"")}}module.exports=u;
+"use client";"use strict";const a=require("react"),o=require("@progress/kendo-react-common"),r=require("./utils.js");function u(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const s=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,s.get?s:{enumerable:!0,get:()=>e[t]})}}return n.default=e,Object.freeze(n)}const i=u(a),d=e=>e.preventDefault(),f=e=>{const{selected:n,defaultItem:t,textField:s}=e,c=o.useUnstyled(),l=c&&c.uDropDownsBase;return i.createElement("div",{onClick:e.onClick,onMouseDown:d,style:{position:"unset"},className:o.classNames(o.uDropDownsBase.optionlabel({c:l,selected:n}))},r.getItemValue(t,s)||"")};module.exports=f;

package/common/ListDefaultItem.mjs

@@ -6,31 +6,26 @@
  *-------------------------------------------------------------------------------------------
  */
 "use client";
-import * as t from "react";
-import { classNames as n } from "@progress/kendo-react-common";
-import { getItemValue as a } from "./utils.mjs";
-const r = (e) => e.preventDefault();
-class p extends t.Component {
-  render() {
-    const {
-      selected: s,
-      defaultItem: o,
-      textField: l
-    } = this.props;
-    return /* @__PURE__ */ t.createElement(
-      "div",
-      {
-        onClick: this.props.onClick,
-        onMouseDown: r,
-        style: { position: "unset" },
-        className: n("k-list-optionlabel", {
-          "k-selected": s
-        })
-      },
-      a(o, l) || ""
-    );
-  }
-}
+import * as a from "react";
+import { useUnstyled as c, classNames as u, uDropDownsBase as r } from "@progress/kendo-react-common";
+import { getItemValue as i } from "./utils.mjs";
+const m = (e) => e.preventDefault(), p = (e) => {
+  const {
+    selected: s,
+    defaultItem: o,
+    textField: l
+  } = e, t = c(), n = t && t.uDropDownsBase;
+  return /* @__PURE__ */ a.createElement(
+    "div",
+    {
+      onClick: e.onClick,
+      onMouseDown: m,
+      style: { position: "unset" },
+      className: u(r.optionlabel({ c: n, selected: s }))
+    },
+    i(o, l) || ""
+  );
+};
 export {
   p as default
 };

package/common/ListFilter.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";const m=require("react"),n=require("prop-types"),l=require("@progress/kendo-react-inputs"),p=require("@progress/kendo-svg-icons"),b=require("@progress/kendo-react-common");function g(e){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const r in e)if(r!=="default"){const a=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(o,r,a.get?a:{enumerable:!0,get:()=>e[r]})}}return o.default=e,Object.freeze(o)}const t=g(m),c=t.forwardRef((e,o)=>{const r=t.useRef(null),{renderListFilterWrapper:a=!1,renderPrefixSeparator:s=!1,...u}=e;t.useImperativeHandle(o,()=>r.current);const d=()=>t.createElement(t.Fragment,null,t.createElement(l.InputPrefix,null,t.createElement(b.IconWrap,{name:"search",icon:p.searchIcon,className:"k-input-icon"})),s&&t.createElement(l.InputSeparator,null)),i=t.createElement(l.TextBox,{...u,ref:r,className:"k-searchbox",value:e.value||"",onChange:e.onChange,onKeyDown:e.onKeyDown,tabIndex:e.tabIndex,onClick:f=>f.stopPropagation(),size:e.size,fillMode:e.fillMode,rounded:e.rounded,prefix:d});return a?t.createElement("div",{className:"k-list-filter"}," ",i," "):i});c.propTypes={value:n.oneOfType([n.string,n.number,n.array]),tabIndex:n.number,onChange:n.func,onKeyDown:n.func,size:n.oneOf([null,"small","medium","large"]),rounded:n.oneOf([null,"small","medium","large","full"]),fillMode:n.oneOf([null,"solid","flat","outline"]),renderListFilterWrapper:n.bool,renderPrefixSeparator:n.bool};c.displayName="KendoReactListFilter";const x=c;module.exports=x;
+"use client";"use strict";const g=require("react"),n=require("prop-types"),c=require("@progress/kendo-react-inputs"),x=require("@progress/kendo-svg-icons"),r=require("@progress/kendo-react-common");function y(e){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const a in e)if(a!=="default"){const l=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(o,a,l.get?l:{enumerable:!0,get:()=>e[a]})}}return o.default=e,Object.freeze(o)}const t=y(g),u=t.forwardRef((e,o)=>{const a=t.useRef(null),{renderListFilterWrapper:l=!1,renderPrefixSeparator:f=!1,...m}=e,i=r.useUnstyled(),s=i&&i.uDropDownsBase;t.useImperativeHandle(o,()=>a.current);const p=()=>t.createElement(t.Fragment,null,t.createElement(c.InputPrefix,null,t.createElement(r.IconWrap,{name:"search",icon:x.searchIcon,className:r.classNames(r.uDropDownsBase.inputIcon({c:s}))})),f&&t.createElement(c.InputSeparator,null)),d=t.createElement(c.TextBox,{...m,ref:a,className:r.classNames(r.uDropDownsBase.searchbox({c:s})),value:e.value||"",onChange:e.onChange,onKeyDown:e.onKeyDown,tabIndex:e.tabIndex,onClick:b=>b.stopPropagation(),size:e.size,fillMode:e.fillMode,rounded:e.rounded,prefix:p});return l?t.createElement("div",{className:r.classNames(r.uDropDownsBase.listFilter({c:s}))}," ",d," "):d});u.propTypes={value:n.oneOfType([n.string,n.number,n.array]),tabIndex:n.number,onChange:n.func,onKeyDown:n.func,size:n.oneOf([null,"small","medium","large"]),rounded:n.oneOf([null,"small","medium","large","full"]),fillMode:n.oneOf([null,"solid","flat","outline"]),renderListFilterWrapper:n.bool,renderPrefixSeparator:n.bool};u.displayName="KendoReactListFilter";const D=u;module.exports=D;

package/common/ListFilter.mjs

@@ -8,35 +8,35 @@
 "use client";
 import * as n from "react";
 import e from "prop-types";
-import { TextBox as f, InputPrefix as d, InputSeparator as p } from "@progress/kendo-react-inputs";
-import { searchIcon as x } from "@progress/kendo-svg-icons";
-import { IconWrap as b } from "@progress/kendo-react-common";
-const t = n.forwardRef((r, o) => {
-  const l = n.useRef(null), { renderListFilterWrapper: i = !1, renderPrefixSeparator: s = !1, ...m } = r;
+import { TextBox as y, InputPrefix as b, InputSeparator as I } from "@progress/kendo-react-inputs";
+import { searchIcon as g } from "@progress/kendo-svg-icons";
+import { useUnstyled as h, classNames as l, uDropDownsBase as a, IconWrap as D } from "@progress/kendo-react-common";
+const o = n.forwardRef((r, u) => {
+  const s = n.useRef(null), { renderListFilterWrapper: m = !1, renderPrefixSeparator: d = !1, ...f } = r, i = h(), t = i && i.uDropDownsBase;
   n.useImperativeHandle(
-    o,
-    () => l.current
+    u,
+    () => s.current
   );
-  const u = () => /* @__PURE__ */ n.createElement(n.Fragment, null, /* @__PURE__ */ n.createElement(d, null, /* @__PURE__ */ n.createElement(b, { name: "search", icon: x, className: "k-input-icon" })), s && /* @__PURE__ */ n.createElement(p, null)), a = /* @__PURE__ */ n.createElement(
-    f,
+  const p = () => /* @__PURE__ */ n.createElement(n.Fragment, null, /* @__PURE__ */ n.createElement(b, null, /* @__PURE__ */ n.createElement(D, { name: "search", icon: g, className: l(a.inputIcon({ c: t })) })), d && /* @__PURE__ */ n.createElement(I, null)), c = /* @__PURE__ */ n.createElement(
+    y,
     {
-      ...m,
-      ref: l,
-      className: "k-searchbox",
+      ...f,
+      ref: s,
+      className: l(a.searchbox({ c: t })),
       value: r.value || "",
       onChange: r.onChange,
       onKeyDown: r.onKeyDown,
       tabIndex: r.tabIndex,
-      onClick: (c) => c.stopPropagation(),
+      onClick: (x) => x.stopPropagation(),
       size: r.size,
       fillMode: r.fillMode,
       rounded: r.rounded,
-      prefix: u
+      prefix: p
     }
   );
-  return i ? /* @__PURE__ */ n.createElement("div", { className: "k-list-filter" }, " ", a, " ") : a;
+  return m ? /* @__PURE__ */ n.createElement("div", { className: l(a.listFilter({ c: t })) }, " ", c, " ") : c;
 });
-t.propTypes = {
+o.propTypes = {
   value: e.oneOfType([e.string, e.number, e.array]),
   tabIndex: e.number,
   onChange: e.func,
@@ -47,8 +47,8 @@ t.propTypes = {
   renderListFilterWrapper: e.bool,
   renderPrefixSeparator: e.bool
 };
-t.displayName = "KendoReactListFilter";
-const E = t;
+o.displayName = "KendoReactListFilter";
+const C = o;
 export {
-  E as default
+  C as default
 };