@progress/kendo-react-buttons 14.5.0-develop.8 → 15.0.0-develop.1

package/FloatingActionButton/FloatingActionButton.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const ye=require("react"),n=require("prop-types"),o=require("@progress/kendo-react-common"),he=require("./FloatingActionButtonItem.js"),O=require("./utils.js"),ve=require("@progress/kendo-react-popup");function Ce(d){const g=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(d){for(const r in d)if(r!=="default"){const k=Object.getOwnPropertyDescriptor(d,r);Object.defineProperty(g,r,k.get?k:{enumerable:!0,get:()=>d[r]})}}return g.default=d,Object.freeze(g)}const t=Ce(ye),Ie=2,Ee=100,M=t.forwardRef((d,g)=>{const{align:r=v.align,alignOffset:k,className:q,disabled:f,icon:R,svgIcon:w,iconClass:$,id:j,items:a,item:ee,text:C,positionMode:A=v.positionMode,size:I=v.size,style:te,rounded:E=v.rounded,themeColor:F=v.themeColor,overlayStyle:oe,tabIndex:ne,accessKey:se,popupSettings:D={},modal:ae,onClick:P,onItemClick:_,onFocus:S,onBlur:W,onKeyDown:Z,onOpen:H,onClose:L,...le}=d,X=o.useZIndexContext(),U=X?X+Ie:Ee,G=t.useRef(null),i=t.useRef(null),ie=t.useRef(null),re=t.useRef(null),J=t.useCallback(()=>{i.current&&i.current.focus()},[]),p=t.useCallback(()=>({element:i.current,focus:J}),[J]);t.useImperativeHandle(G,p),t.useImperativeHandle(g,()=>G.current);const[c,u]=t.useState(!1),[x,m]=t.useState(!1),[y,l]=t.useState(-1),ce=o.useId()+"-button-id",T=o.useDir(i,d.dir),h=T==="rtl",N=o.useId()+"-list-id";t.useEffect(()=>{O.position(i,r,k,h)},[i,r,k,h]),t.useEffect(()=>{x&&i&&i.current&&i.current.focus()},[x,i]);const b=t.useCallback((e,s)=>{a&&o.dispatchEvent(s?H:L,e,p(),void 0)},[H,L,a]),Q=t.useCallback(e=>{!e.target||f||(!a&&P?o.dispatchEvent(P,e,p(),void 0):(u(!c),m(!0),l(c?-1:0),b(e,!c)))},[u,m,l,P,b,c,a,f]),ue=t.useCallback(e=>{m(!0),l(c?0:-1),S&&o.dispatchEvent(S,e,p(),void 0)},[S,m,l]),de=t.useCallback(e=>{m(!1),u(!1),l(-1),o.dispatchEvent(W,e,p(),void 0),c&&b(e,!1)},[W,m,u,l,b]),fe=t.useCallback(e=>{e.preventDefault()},[]),z=t.useCallback((e,s)=>{a&&(a[s].disabled||o.dispatchEvent(_,e,p(),{itemProps:a[s],itemIndex:s}))},[_]),pe=t.useCallback((e,s)=>{!e.target||!a||(l(s),u(!1),z(e,s),b(e,!1))},[l,u,z,b]),me=t.useCallback(e=>{o.getActiveElement(document)===i.current&&e.preventDefault()},[i]),be=t.useCallback(e=>{const s=y,B=a?a.length:-1;if(e.altKey){!c&&e.keyCode===o.Keys.down&&(e.preventDefault(),u(!0),l(0)),c&&e.keyCode===o.Keys.up&&(e.preventDefault(),u(!1),l(-1));return}switch(e.keyCode){case o.Keys.enter:case o.Keys.space:s>=0&&z(e,s),a||Q(e),e.preventDefault(),u(!c),l(c?-1:0);break;case o.Keys.esc:e.preventDefault(),u(!1),l(-1);break;case o.Keys.home:e.preventDefault(),l(0);break;case o.Keys.end:e.preventDefault(),l(B-1);break;case o.Keys.down:case o.Keys.right:e.preventDefault(),l(s+1>=B?0:s+1);break;case o.Keys.up:case o.Keys.left:e.preventDefault(),l(s-1<0?B-1:s-1);break}o.dispatchEvent(Z,e,p(),void 0)},[Z,y,l,h,u]),ge=t.useMemo(()=>o.classNames("k-fab",{"k-fab-sm":I==="small","k-fab-md":I==="medium","k-fab-lg":I==="large","k-disabled":f,"k-pos-absolute":A==="absolute","k-pos-fixed":A==="fixed","k-focus":x,[`k-rounded-${o.kendoThemeMaps.roundedMap[E]||E}`]:E,[`k-fab-${F}`]:F},`k-${r.vertical}-${r.horizontal}`,q),[F,I,E,f,A,r,x,q]),ke=a&&a.map((e,s)=>t.createElement(he.FloatingActionButtonItem,{...e,key:s,index:s,id:`${N}-${s}`,disabled:f||e.disabled,focused:y===s,dataItem:e,item:ee,className:o.classNames(e.className,O.getTextDirectionClass(T||"ltr",r.horizontal)),onClick:pe,onDown:me})),V=!!((R||w)&&!C),Y=(i.current?i.current.offsetWidth:0)/2-32/2;let K;return R||w?K=t.createElement(o.IconWrap,{className:"k-fab-icon",name:R,icon:w}):$?K=t.createElement("span",{role:"presentation",className:$}):K=null,t.createElement(o.ZIndexContext.Provider,{value:U},t.createElement(t.Fragment,null,t.createElement("button",{ref:i,id:j||ce,role:"button",type:"button","aria-disabled":f,"aria-expanded":a?c:void 0,"aria-haspopup":!!a,"aria-label":`${C||""} floatingactionbutton`,"aria-owns":a?N:void 0,"aria-activedescendant":y>=0&&a?`${N}-${y}`:void 0,tabIndex:o.getTabIndex(ne,f),accessKey:se,dir:T,disabled:f,className:ge,style:te,onClick:Q,onMouseDown:fe,onFocus:ue,onBlur:de,onKeyDown:be,...le},K,C&&t.createElement("span",{className:"k-fab-text"},C)),ae&&c&&t.createElement("div",{className:"k-overlay",style:{zIndex:U,...oe}}),t.createElement(ve.Popup,{ref:re,anchor:i.current,show:c,animate:D.animate,popupClass:o.classNames("k-popup-transparent k-fab-popup",D.popupClass),anchorAlign:D.anchorAlign||O.getAnchorAlign(r,h),popupAlign:D.popupAlign||O.getPopupAlign(r,h),style:{boxShadow:"none"}},t.createElement("ul",{ref:ie,role:"menu","aria-labelledby":j,id:N,className:o.classNames("k-fab-items",{"k-fab-items-bottom":r.vertical!=="bottom","k-fab-items-top":r.vertical==="bottom"}),style:{paddingLeft:V?Y:void 0,paddingRight:V?Y:void 0}},ke))))});M.propTypes={className:n.string,style:n.object,id:n.string,dir:n.string,tabIndex:n.number,accessKey:n.string,disabled:n.bool,icon:n.string,svgIcon:o.svgIconPropType,iconClass:n.string,text:n.string,alignOffset:n.shape({x:n.oneOfType([n.number,n.string]).isRequired,y:n.oneOfType([n.number,n.string]).isRequired}),align:n.shape({vertical:n.oneOf(["top","middle","bottom"]).isRequired,horizontal:n.oneOf(["start","center","end"]).isRequired}),positionMode:n.oneOf(["absolute","fixed"]),size:n.oneOf(["small","medium","large"]),rounded:n.oneOf(["small","medium","large","full","none"]),themeColor:n.oneOf(["primary","secondary","tertiary","info","success","warning","error","dark","light","inverse"]),modal:n.bool,overlayStyle:n.object};const v={align:{vertical:"bottom",horizontal:"end"},size:void 0,rounded:void 0,themeColor:void 0,positionMode:"fixed"};M.displayName="KendoFloatingActionButton";exports.FloatingActionButton=M;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const ye=require("react"),s=require("prop-types"),o=require("@progress/kendo-react-common"),he=require("./FloatingActionButtonItem.js"),w=require("./utils.js"),ve=require("@progress/kendo-react-popup");function Ce(d){const g=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(d){for(const r in d)if(r!=="default"){const k=Object.getOwnPropertyDescriptor(d,r);Object.defineProperty(g,r,k.get?k:{enumerable:!0,get:()=>d[r]})}}return g.default=d,Object.freeze(g)}const t=Ce(ye),Ie=2,Ee=100,q=t.forwardRef((d,g)=>{const{align:r=C.align,alignOffset:k,className:$,disabled:f,icon:I,svgIcon:E,iconClass:F,id:j,items:n,item:ee,text:x,positionMode:D=C.positionMode,size:y=C.size,style:te,rounded:N=C.rounded,themeColor:P=C.themeColor,overlayStyle:oe,tabIndex:se,accessKey:ae,popupSettings:K={},modal:ne,onClick:S,onItemClick:_,onFocus:T,onBlur:W,onKeyDown:Z,onOpen:H,onClose:L,...le}=d,X=o.useZIndexContext(),U=X?X+Ie:Ee,G=t.useRef(null),i=t.useRef(null),ie=t.useRef(null),re=t.useRef(null),J=t.useCallback(()=>{i.current&&i.current.focus()},[]),p=t.useCallback(()=>({element:i.current,focus:J}),[J]);t.useImperativeHandle(G,p),t.useImperativeHandle(g,()=>G.current);const[c,u]=t.useState(!1),[O,m]=t.useState(!1),[h,l]=t.useState(-1),ce=o.useId()+"-button-id",z=o.useDir(i,d.dir),v=z==="rtl",R=o.useId()+"-list-id";t.useEffect(()=>{w.position(i,r,k,v)},[i,r,k,v]),t.useEffect(()=>{O&&i&&i.current&&i.current.focus()},[O,i]);const b=t.useCallback((e,a)=>{n&&o.dispatchEvent(a?H:L,e,p(),void 0)},[H,L,n]),Q=t.useCallback(e=>{!e.target||f||(!n&&S?o.dispatchEvent(S,e,p(),void 0):(u(!c),m(!0),l(c?-1:0),b(e,!c)))},[u,m,l,S,b,c,n,f]),ue=t.useCallback(e=>{m(!0),l(c?0:-1),T&&o.dispatchEvent(T,e,p(),void 0)},[T,m,l]),de=t.useCallback(e=>{m(!1),u(!1),l(-1),o.dispatchEvent(W,e,p(),void 0),c&&b(e,!1)},[W,m,u,l,b]),fe=t.useCallback(e=>{e.preventDefault()},[]),B=t.useCallback((e,a)=>{n&&(n[a].disabled||o.dispatchEvent(_,e,p(),{itemProps:n[a],itemIndex:a}))},[_]),pe=t.useCallback((e,a)=>{!e.target||!n||(l(a),u(!1),B(e,a),b(e,!1))},[l,u,B,b]),me=t.useCallback(e=>{o.getActiveElement(document)===i.current&&e.preventDefault()},[i]),be=t.useCallback(e=>{const a=h,M=n?n.length:-1;if(e.altKey){!c&&e.keyCode===o.Keys.down&&(e.preventDefault(),u(!0),l(0)),c&&e.keyCode===o.Keys.up&&(e.preventDefault(),u(!1),l(-1));return}switch(e.keyCode){case o.Keys.enter:case o.Keys.space:a>=0&&B(e,a),n||Q(e),e.preventDefault(),u(!c),l(c?-1:0);break;case o.Keys.esc:e.preventDefault(),u(!1),l(-1);break;case o.Keys.home:e.preventDefault(),l(0);break;case o.Keys.end:e.preventDefault(),l(M-1);break;case o.Keys.down:case o.Keys.right:e.preventDefault(),l(a+1>=M?0:a+1);break;case o.Keys.up:case o.Keys.left:e.preventDefault(),l(a-1<0?M-1:a-1);break}o.dispatchEvent(Z,e,p(),void 0)},[Z,h,l,v,u]),ge=t.useMemo(()=>o.classNames("k-fab",{"k-fab-xs":y==="xsmall","k-fab-sm":y==="small","k-fab-md":y==="medium","k-fab-lg":y==="large","k-disabled":f,"k-pos-absolute":D==="absolute","k-pos-fixed":D==="fixed","k-focus":O,[`k-rounded-${o.kendoThemeMaps.roundedMap[N]||N}`]:N,[`k-fab-${P}`]:P},D&&`k-${r.vertical}-${r.horizontal}`,$),[P,y,N,f,D,r,O,$]),ke=n&&n.map((e,a)=>t.createElement(he.FloatingActionButtonItem,{...e,key:a,index:a,id:`${R}-${a}`,disabled:f||e.disabled,focused:h===a,dataItem:e,item:ee,className:o.classNames(e.className,w.getTextDirectionClass(z||"ltr",r.horizontal)),onClick:pe,onDown:me})),V=!!((I||E)&&!x),Y=(i.current?i.current.offsetWidth:0)/2-32/2;let A;return I||E?A=t.createElement(o.IconWrap,{className:"k-fab-icon",name:I,icon:E}):F?A=t.createElement("span",{role:"presentation",className:F}):A=null,t.createElement(o.ZIndexContext.Provider,{value:U},t.createElement(t.Fragment,null,t.createElement("button",{ref:i,id:j||ce,type:"button","aria-disabled":f,"aria-expanded":n?c:void 0,"aria-haspopup":n?!0:void 0,"aria-label":!x&&(I||E||F)?"Action":void 0,"aria-owns":n?R:void 0,"aria-activedescendant":h>=0&&n?`${R}-${h}`:void 0,tabIndex:o.getTabIndex(se,f),accessKey:ae,dir:z,disabled:f,className:ge,style:te,onClick:Q,onMouseDown:fe,onFocus:ue,onBlur:de,onKeyDown:be,...le},A,x&&t.createElement("span",{className:"k-fab-text"},x)),ne&&c&&t.createElement("div",{className:"k-overlay",style:{zIndex:U,...oe}}),t.createElement(ve.Popup,{ref:re,anchor:i.current,show:c,animate:K.animate,popupClass:o.classNames("k-popup-transparent k-fab-popup",K.popupClass),anchorAlign:K.anchorAlign||w.getAnchorAlign(r,v),popupAlign:K.popupAlign||w.getPopupAlign(r,v),style:{boxShadow:"none"}},t.createElement("ul",{ref:ie,role:"menu","aria-labelledby":j,id:R,className:o.classNames("k-fab-items",{"k-fab-items-bottom":r.vertical!=="bottom","k-fab-items-top":r.vertical==="bottom"}),style:{paddingLeft:V?Y:void 0,paddingRight:V?Y:void 0}},ke))))});q.propTypes={className:s.string,style:s.object,id:s.string,dir:s.string,tabIndex:s.number,accessKey:s.string,disabled:s.bool,icon:s.string,svgIcon:o.svgIconPropType,iconClass:s.string,text:s.string,alignOffset:s.shape({x:s.oneOfType([s.number,s.string]).isRequired,y:s.oneOfType([s.number,s.string]).isRequired}),align:s.shape({vertical:s.oneOf(["top","middle","bottom"]).isRequired,horizontal:s.oneOf(["start","center","end"]).isRequired}),positionMode:s.oneOf(["absolute","fixed"]),size:s.oneOf(["xsmall","small","medium","large"]),rounded:s.oneOf(["small","medium","large","full","none"]),themeColor:s.oneOf(["base","primary","secondary","tertiary"]),modal:s.bool,overlayStyle:s.object};const C={align:{vertical:"bottom",horizontal:"end"},size:void 0,rounded:void 0,themeColor:void 0,positionMode:"fixed"};q.displayName="KendoFloatingActionButton";exports.FloatingActionButton=q;

package/FloatingActionButton/FloatingActionButton.mjs

@@ -7,43 +7,43 @@
  */
 import * as t from "react";
 import o from "prop-types";
-import { useZIndexContext as ye, useId as Y, useDir as ve, dispatchEvent as b, getActiveElement as Ie, Keys as c, classNames as N, kendoThemeMaps as Ee, ZIndexContext as xe, getTabIndex as De, IconWrap as Ne, svgIconPropType as we } from "@progress/kendo-react-common";
+import { useZIndexContext as ve, useId as Y, useDir as ye, dispatchEvent as b, getActiveElement as Ie, Keys as c, classNames as w, kendoThemeMaps as xe, ZIndexContext as Ee, getTabIndex as De, IconWrap as Ne, svgIconPropType as Ae } from "@progress/kendo-react-common";
 import { FloatingActionButtonItem as Re } from "./FloatingActionButtonItem.mjs";
-import { position as Ae, getTextDirectionClass as Fe, getPopupAlign as Oe, getAnchorAlign as ze } from "./utils.mjs";
+import { position as we, getTextDirectionClass as Fe, getPopupAlign as Oe, getAnchorAlign as ze } from "./utils.mjs";
 import { Popup as Te } from "@progress/kendo-react-popup";
 const Be = 2, Me = 100, ee = t.forwardRef(
-  (P, te) => {
+  (K, te) => {
     const {
-      align: u = h.align,
-      alignOffset: $,
-      className: K,
-      disabled: d,
-      icon: w,
-      svgIcon: R,
-      iconClass: S,
+      align: d = C.align,
+      alignOffset: S,
+      className: $,
+      disabled: u,
+      icon: v,
+      svgIcon: y,
+      iconClass: F,
       id: W,
-      items: n,
+      items: s,
       item: oe,
-      text: C,
-      positionMode: A = h.positionMode,
-      size: y = h.size,
+      text: I,
+      positionMode: x = C.positionMode,
+      size: g = C.size,
       style: ae,
-      rounded: v = h.rounded,
-      themeColor: F = h.themeColor,
-      overlayStyle: ne,
-      tabIndex: se,
+      rounded: E = C.rounded,
+      themeColor: O = C.themeColor,
+      overlayStyle: se,
+      tabIndex: ne,
       accessKey: le,
-      popupSettings: I = {},
+      popupSettings: D = {},
       modal: ie,
-      onClick: O,
+      onClick: z,
       onItemClick: Z,
-      onFocus: z,
+      onFocus: T,
       onBlur: q,
       onKeyDown: _,
       onOpen: H,
       onClose: j,
       ...re
-    } = P, L = ye(), X = L ? L + Be : Me, U = t.useRef(null), l = t.useRef(null), ce = t.useRef(null), ue = t.useRef(null), G = t.useCallback(() => {
+    } = K, L = ve(), X = L ? L + Be : Me, U = t.useRef(null), l = t.useRef(null), ce = t.useRef(null), de = t.useRef(null), G = t.useCallback(() => {
       l.current && l.current.focus();
     }, []), f = t.useCallback(
       () => ({
@@ -56,62 +56,62 @@ const Be = 2, Me = 100, ee = t.forwardRef(
       te,
       () => U.current
     );
-    const [i, r] = t.useState(!1), [E, p] = t.useState(!1), [g, s] = t.useState(-1), de = Y() + "-button-id", T = ve(l, P.dir), k = T === "rtl", x = Y() + "-list-id";
+    const [i, r] = t.useState(!1), [N, p] = t.useState(!1), [k, n] = t.useState(-1), ue = Y() + "-button-id", B = ye(l, K.dir), h = B === "rtl", A = Y() + "-list-id";
     t.useEffect(() => {
-      Ae(l, u, $, k);
-    }, [l, u, $, k]), t.useEffect(() => {
-      E && l && l.current && l.current.focus();
-    }, [E, l]);
+      we(l, d, S, h);
+    }, [l, d, S, h]), t.useEffect(() => {
+      N && l && l.current && l.current.focus();
+    }, [N, l]);
     const m = t.useCallback(
       (e, a) => {
-        n && b(a ? H : j, e, f(), void 0);
+        s && b(a ? H : j, e, f(), void 0);
       },
-      [H, j, n]
+      [H, j, s]
     ), J = t.useCallback(
       (e) => {
-        !e.target || d || (!n && O ? b(
-          O,
+        !e.target || u || (!s && z ? b(
+          z,
           e,
           f(),
           void 0
-        ) : (r(!i), p(!0), s(i ? -1 : 0), m(e, !i)));
+        ) : (r(!i), p(!0), n(i ? -1 : 0), m(e, !i)));
       },
-      [r, p, s, O, m, i, n, d]
+      [r, p, n, z, m, i, s, u]
     ), fe = t.useCallback(
       (e) => {
-        p(!0), s(i ? 0 : -1), z && b(
-          z,
+        p(!0), n(i ? 0 : -1), T && b(
+          T,
           e,
           f(),
           void 0
         );
       },
-      [z, p, s]
+      [T, p, n]
     ), pe = t.useCallback(
       (e) => {
-        p(!1), r(!1), s(-1), b(
+        p(!1), r(!1), n(-1), b(
           q,
           e,
           f(),
           void 0
         ), i && m(e, !1);
       },
-      [q, p, r, s, m]
+      [q, p, r, n, m]
     ), me = t.useCallback((e) => {
       e.preventDefault();
-    }, []), B = t.useCallback(
+    }, []), M = t.useCallback(
       (e, a) => {
-        n && (n[a].disabled || b(Z, e, f(), {
-          itemProps: n[a],
+        s && (s[a].disabled || b(Z, e, f(), {
+          itemProps: s[a],
           itemIndex: a
         }));
       },
       [Z]
     ), be = t.useCallback(
       (e, a) => {
-        !e.target || !n || (s(a), r(!1), B(e, a), m(e, !1));
+        !e.target || !s || (n(a), r(!1), M(e, a), m(e, !1));
       },
-      [s, r, B, m]
+      [n, r, M, m]
     ), ge = t.useCallback(
       (e) => {
         Ie(document) === l.current && e.preventDefault();
@@ -119,32 +119,32 @@ const Be = 2, Me = 100, ee = t.forwardRef(
       [l]
     ), ke = t.useCallback(
       (e) => {
-        const a = g, M = n ? n.length : -1;
+        const a = k, P = s ? s.length : -1;
         if (e.altKey) {
-          !i && e.keyCode === c.down && (e.preventDefault(), r(!0), s(0)), i && e.keyCode === c.up && (e.preventDefault(), r(!1), s(-1));
+          !i && e.keyCode === c.down && (e.preventDefault(), r(!0), n(0)), i && e.keyCode === c.up && (e.preventDefault(), r(!1), n(-1));
           return;
         }
         switch (e.keyCode) {
           case c.enter:
           case c.space:
-            a >= 0 && B(e, a), n || J(e), e.preventDefault(), r(!i), s(i ? -1 : 0);
+            a >= 0 && M(e, a), s || J(e), e.preventDefault(), r(!i), n(i ? -1 : 0);
             break;
           case c.esc:
-            e.preventDefault(), r(!1), s(-1);
+            e.preventDefault(), r(!1), n(-1);
             break;
           case c.home:
-            e.preventDefault(), s(0);
+            e.preventDefault(), n(0);
             break;
           case c.end:
-            e.preventDefault(), s(M - 1);
+            e.preventDefault(), n(P - 1);
             break;
           case c.down:
           case c.right:
-            e.preventDefault(), s(a + 1 >= M ? 0 : a + 1);
+            e.preventDefault(), n(a + 1 >= P ? 0 : a + 1);
             break;
           case c.up:
           case c.left:
-            e.preventDefault(), s(a - 1 < 0 ? M - 1 : a - 1);
+            e.preventDefault(), n(a - 1 < 0 ? P - 1 : a - 1);
             break;
         }
         b(
@@ -154,59 +154,59 @@ const Be = 2, Me = 100, ee = t.forwardRef(
           void 0
         );
       },
-      [_, g, s, k, r]
+      [_, k, n, h, r]
     ), he = t.useMemo(
-      () => N(
+      () => w(
         "k-fab",
         {
-          "k-fab-sm": y === "small",
-          "k-fab-md": y === "medium",
-          "k-fab-lg": y === "large",
-          "k-disabled": d,
-          "k-pos-absolute": A === "absolute",
-          "k-pos-fixed": A === "fixed",
-          "k-focus": E,
-          [`k-rounded-${Ee.roundedMap[v] || v}`]: v,
-          [`k-fab-${F}`]: F
+          "k-fab-xs": g === "xsmall",
+          "k-fab-sm": g === "small",
+          "k-fab-md": g === "medium",
+          "k-fab-lg": g === "large",
+          "k-disabled": u,
+          "k-pos-absolute": x === "absolute",
+          "k-pos-fixed": x === "fixed",
+          "k-focus": N,
+          [`k-rounded-${xe.roundedMap[E] || E}`]: E,
+          [`k-fab-${O}`]: O
         },
-        `k-${u.vertical}-${u.horizontal}`,
-        K
+        x && `k-${d.vertical}-${d.horizontal}`,
+        $
       ),
-      [F, y, v, d, A, u, E, K]
-    ), Ce = n && n.map((e, a) => /* @__PURE__ */ t.createElement(
+      [O, g, E, u, x, d, N, $]
+    ), Ce = s && s.map((e, a) => /* @__PURE__ */ t.createElement(
       Re,
       {
         ...e,
         key: a,
         index: a,
-        id: `${x}-${a}`,
-        disabled: d || e.disabled,
-        focused: g === a,
+        id: `${A}-${a}`,
+        disabled: u || e.disabled,
+        focused: k === a,
         dataItem: e,
         item: oe,
-        className: N(e.className, Fe(T || "ltr", u.horizontal)),
+        className: w(e.className, Fe(B || "ltr", d.horizontal)),
         onClick: be,
         onDown: ge
       }
-    )), Q = !!((w || R) && !C), V = (l.current ? l.current.offsetWidth : 0) / 2 - 32 / 2;
-    let D;
-    return w || R ? D = /* @__PURE__ */ t.createElement(Ne, { className: "k-fab-icon", name: w, icon: R }) : S ? D = /* @__PURE__ */ t.createElement("span", { role: "presentation", className: S }) : D = null, /* @__PURE__ */ t.createElement(xe.Provider, { value: X }, /* @__PURE__ */ t.createElement(t.Fragment, null, /* @__PURE__ */ t.createElement(
+    )), Q = !!((v || y) && !I), V = (l.current ? l.current.offsetWidth : 0) / 2 - 32 / 2;
+    let R;
+    return v || y ? R = /* @__PURE__ */ t.createElement(Ne, { className: "k-fab-icon", name: v, icon: y }) : F ? R = /* @__PURE__ */ t.createElement("span", { role: "presentation", className: F }) : R = null, /* @__PURE__ */ t.createElement(Ee.Provider, { value: X }, /* @__PURE__ */ t.createElement(t.Fragment, null, /* @__PURE__ */ t.createElement(
       "button",
       {
         ref: l,
-        id: W || de,
-        role: "button",
+        id: W || ue,
         type: "button",
-        "aria-disabled": d,
-        "aria-expanded": n ? i : void 0,
-        "aria-haspopup": !!n,
-        "aria-label": `${C || ""} floatingactionbutton`,
-        "aria-owns": n ? x : void 0,
-        "aria-activedescendant": g >= 0 && n ? `${x}-${g}` : void 0,
-        tabIndex: De(se, d),
+        "aria-disabled": u,
+        "aria-expanded": s ? i : void 0,
+        "aria-haspopup": s ? !0 : void 0,
+        "aria-label": !I && (v || y || F) ? "Action" : void 0,
+        "aria-owns": s ? A : void 0,
+        "aria-activedescendant": k >= 0 && s ? `${A}-${k}` : void 0,
+        tabIndex: De(ne, u),
         accessKey: le,
-        dir: T,
-        disabled: d,
+        dir: B,
+        disabled: u,
         className: he,
         style: ae,
         onClick: J,
@@ -216,27 +216,27 @@ const Be = 2, Me = 100, ee = t.forwardRef(
         onKeyDown: ke,
         ...re
       },
-      D,
-      C && /* @__PURE__ */ t.createElement("span", { className: "k-fab-text" }, C)
+      R,
+      I && /* @__PURE__ */ t.createElement("span", { className: "k-fab-text" }, I)
     ), ie && i && /* @__PURE__ */ t.createElement(
       "div",
       {
         className: "k-overlay",
         style: {
           zIndex: X,
-          ...ne
+          ...se
         }
       }
     ), /* @__PURE__ */ t.createElement(
       Te,
       {
-        ref: ue,
+        ref: de,
         anchor: l.current,
         show: i,
-        animate: I.animate,
-        popupClass: N("k-popup-transparent k-fab-popup", I.popupClass),
-        anchorAlign: I.anchorAlign || ze(u, k),
-        popupAlign: I.popupAlign || Oe(u, k),
+        animate: D.animate,
+        popupClass: w("k-popup-transparent k-fab-popup", D.popupClass),
+        anchorAlign: D.anchorAlign || ze(d, h),
+        popupAlign: D.popupAlign || Oe(d, h),
         style: { boxShadow: "none" }
       },
       /* @__PURE__ */ t.createElement(
@@ -245,10 +245,10 @@ const Be = 2, Me = 100, ee = t.forwardRef(
           ref: ce,
           role: "menu",
           "aria-labelledby": W,
-          id: x,
-          className: N("k-fab-items", {
-            "k-fab-items-bottom": u.vertical !== "bottom",
-            "k-fab-items-top": u.vertical === "bottom"
+          id: A,
+          className: w("k-fab-items", {
+            "k-fab-items-bottom": d.vertical !== "bottom",
+            "k-fab-items-top": d.vertical === "bottom"
           }),
           style: {
             paddingLeft: Q ? V : void 0,
@@ -269,7 +269,7 @@ ee.propTypes = {
   accessKey: o.string,
   disabled: o.bool,
   icon: o.string,
-  svgIcon: we,
+  svgIcon: Ae,
   iconClass: o.string,
   text: o.string,
   alignOffset: o.shape({
@@ -281,24 +281,13 @@ ee.propTypes = {
     horizontal: o.oneOf(["start", "center", "end"]).isRequired
   }),
   positionMode: o.oneOf(["absolute", "fixed"]),
-  size: o.oneOf(["small", "medium", "large"]),
+  size: o.oneOf(["xsmall", "small", "medium", "large"]),
   rounded: o.oneOf(["small", "medium", "large", "full", "none"]),
-  themeColor: o.oneOf([
-    "primary",
-    "secondary",
-    "tertiary",
-    "info",
-    "success",
-    "warning",
-    "error",
-    "dark",
-    "light",
-    "inverse"
-  ]),
+  themeColor: o.oneOf(["base", "primary", "secondary", "tertiary"]),
   modal: o.bool,
   overlayStyle: o.object
 };
-const h = {
+const C = {
   align: { vertical: "bottom", horizontal: "end" },
   size: void 0,
   rounded: void 0,

package/FloatingActionButton/interfaces/FloatingActionButtonProps.d.ts

@@ -206,16 +206,10 @@ export interface FloatingActionButtonProps extends Omit<React.ButtonHTMLAttribut
      * [see example](https://www.telerik.com/kendo-react-ui/components/buttons/floatingactionbutton/appearance).
      *
      * The possible values are:
+     * * `base`&mdash;Applies coloring based on the base theme color.
      * * `primary`&mdash;Applies coloring based on the primary theme color.
      * * `secondary`&mdash;Applies coloring based on the secondary theme color.
      * * `tertiary`&mdash; Applies coloring based on the tertiary theme color.
-     * * `info`&mdash;Applies coloring based on the info theme color.
-     * * `success`&mdash; Applies coloring based on the success theme color.
-     * * `warning`&mdash; Applies coloring based on the warning theme color.
-     * * `error`&mdash; Applies coloring based on the error theme color.
-     * * `dark`&mdash; Applies coloring based on the dark theme color.
-     * * `light`&mdash; Applies coloring based on the light theme color.
-     * * `inverse`&mdash; Applies coloring based on the inverse theme color.
      *
      * @default undefined (theme-controlled)
      * @example

package/FloatingActionButton/models/size.d.ts

@@ -9,9 +9,10 @@
  * Specifies the size of the FloatingActionButton.
  *
  * The possible values are:
+ * * `xsmall`—Applies the smallest available spacing and icon scale.
  * * `small`—Applies half of the default padding, e.g. `8px`.
  * * `medium` (Default)—Applies the default padding, e.g. `16px`.
  * * `large`—Applies one and one half of the default padding, e.g. `24px`.
  *
  */
-export type FloatingActionButtonSize = 'small' | 'medium' | 'large';
+export type FloatingActionButtonSize = 'xsmall' | 'small' | 'medium' | 'large';

package/FloatingActionButton/models/theme-color.d.ts

@@ -12,13 +12,7 @@
  * * `primary` (Default)—Applies coloring based on the primary theme color.
  * * `secondary`—Applies coloring based on the secondary theme color.
  * * `tertiary`— Applies coloring based on the tertiary theme color.
- * * `info`—Applies coloring based on the info theme color.
- * * `success`— Applies coloring based on the success theme color.
- * * `warning`— Applies coloring based on the warning theme color.
- * * `error`— Applies coloring based on the error theme color.
- * * `dark`— Applies coloring based on the dark theme color.
- * * `light`— Applies coloring based on the light theme color.
- * * `inverse`— Applies coloring based on the inverse theme color.
+ * * `base`— Applies coloring based on the base theme color.
  *
  */
-export type FloatingActionButtonThemeColor = 'primary' | 'secondary' | 'tertiary' | 'info' | 'success' | 'warning' | 'error' | 'dark' | 'light' | 'inverse';
+export type FloatingActionButtonThemeColor = 'base' | 'primary' | 'secondary' | 'tertiary';

package/ListButton/DropDownButton.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const N=require("react"),o=require("prop-types"),M=require("../Button.js"),e=require("@progress/kendo-react-common"),R=require("./utils/navigation.js"),A=require("./DropDownButtonItem.js"),T=require("./ButtonItem.js"),q=require("@progress/kendo-react-popup"),m=require("./utils/popup.js"),f=require("../package-metadata.js");function z(c){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(c){for(const t in c)if(t!=="default"){const s=Object.getOwnPropertyDescriptor(c,t);Object.defineProperty(i,t,s.get?s:{enumerable:!0,get:()=>c[t]})}}return i.default=c,Object.freeze(i)}const u=z(N),L=12e3,j=2e3,h=class h extends u.Component{constructor(i){super(i),this.state={opened:!1,focused:!1,focusedIndex:-1},this.mainButton=null,this.list=null,this.skipFocus=!1,this.showLicenseWatermark=!1,this.buttonsData=[],this.onKeyDown=t=>{const{focusedIndex:s}=this.state;if(t.altKey){!this.opened&&t.keyCode===e.Keys.down?(t.preventDefault(),this.setOpen(!0,t),this.setState({focusedIndex:0})):this.opened&&t.keyCode===e.Keys.up&&(t.preventDefault(),this.setState({focusedIndex:-1}),this.setOpen(!1,t));return}const n={...this.state};if(t.keyCode===e.Keys.enter||t.keyCode===e.Keys.space){t.preventDefault(),s>=0&&this.dispatchClickEvent(t,s);const a=!this.opened;this.setState({focused:!0,focusedIndex:a?0:-1}),this.setOpen(a,t);return}if(this.opened&&t.keyCode===e.Keys.esc){this.setState({focusedIndex:-1}),this.setOpen(!1,t);return}if(this.opened){const a=R.navigate(s,t.keyCode,t.altKey,this.buttonsData.length);n.focusedIndex=a;const l=t.keyCode===e.Keys.up||t.keyCode===e.Keys.down||t.keyCode===e.Keys.left||t.keyCode===e.Keys.right;!t.altKey&&(l||t.keyCode===e.Keys.home||t.keyCode===e.Keys.end)&&t.preventDefault()}this.setState(n)},this.switchFocus=t=>{this.skipFocus=!0,t(),window.setTimeout(()=>this.skipFocus=!1,0)},this.handleFocus=t=>{this.skipFocus||(this.setState({focused:!0,focusedIndex:this.opened?0:-1}),e.dispatchEvent(this.props.onFocus,t,this,void 0))},this.handleButtonBlur=t=>{this.opened||(this.setState({focused:!1}),e.dispatchEvent(this.props.onBlur,t,this,void 0))},this.handleMenuBlur=t=>{this.skipFocus||(this.setState({focused:!1,focusedIndex:-1}),e.dispatchEvent(this.props.onBlur,t,this,void 0),setTimeout(()=>{this.setOpen(!1,t)},0))},this.setOpen=(t,s)=>{this.opened!==t&&(this.openedDuringOnChange=t,this.setState({opened:t}),s?this.dispatchPopupEvent(s,t):this.openedDuringOnChange=void 0)},this.onItemClick=(t,s)=>{this.setState({focusedIndex:-1}),this.dispatchClickEvent(t,s),this.setOpen(!1,t)},this.onItemDown=t=>{e.getActiveElement(document)===this.list&&t.preventDefault()},this.mouseDown=t=>{t.preventDefault();const s=e.getActiveElement(document);this.element&&s!==this.element&&s!==this.list&&this.element.focus()},this.onPopupClose=t=>{var n;const s=e.getActiveElement(document);this.element&&this.element.removeAttribute("tabindex"),(s===this.list||(n=this.list)!=null&&n.contains(s))&&this.switchFocus(()=>{this.element&&this.element.focus({preventScroll:!0})}),this.props.popupSettings&&this.props.popupSettings.onClose&&this.props.popupSettings.onClose.call(void 0,t)},this.listRef=t=>{this.list=t,t&&this.state.focused&&this.switchFocus(()=>{t.focus({preventScroll:!0}),this.element&&(this.element.tabIndex=-1)})},this.onClickMainButton=t=>{if(e.dispatchEvent(this.props.onClick,t,this,void 0),!this.buttonsData.length)return;const s=!this.opened;this.setState({focused:!0,focusedIndex:s?0:-1}),this.setOpen(s,t)},this.dispatchPopupEvent=(t,s)=>{e.dispatchEvent(s?this.props.onOpen:this.props.onClose,t,this,void 0),this.openedDuringOnChange=void 0},this.showLicenseWatermark=!e.validatePackage(f.packageMetadata,{component:"DropDownButton"}),this.licenseMessage=e.getLicenseMessage(f.packageMetadata)}get guid(){return this.props.id+"-accessibility-id"}get opened(){return this.openedDuringOnChange!==void 0?this.openedDuringOnChange:this.props.opened===void 0?this.state.opened:this.props.opened}render(){const i=this.isRtl(),t=this.props.unstyled&&this.props.unstyled.uDropDownButton,s=i?"rtl":void 0,{id:n,style:a,tabIndex:l,disabled:r,size:y,rounded:C,fillMode:k,themeColor:w,ariaLabel:I,title:b,accessKey:B,icon:O,svgIcon:v,iconClass:E,buttonClass:S,className:x,imageUrl:P,startIcon:K,endIcon:F}=this.props;return this.buttonsData=this.props.items||u.Children.toArray(this.props.children).filter(p=>p&&p.type===A.DropDownButtonItem).map(p=>p.props),u.createElement(u.Fragment,null,u.createElement(M.Button,{id:n,size:y,style:a,rounded:C,fillMode:k,themeColor:w,onClick:this.onClickMainButton,onMouseDown:this.mouseDown,onKeyDown:this.onKeyDown,onFocus:this.handleFocus,onBlur:this.handleButtonBlur,"aria-disabled":r?"true":void 0,tabIndex:l,accessKey:B,icon:O,svgIcon:v,iconClass:E,className:e.classNames(S,x,e.uDropDownButton.wrapper({c:t,focused:this.state.focused,disabled:r})),imageUrl:P,dir:s,ref:p=>{this.mainButton=(p==null?void 0:p.element)||null},type:"button","aria-expanded":this.opened?"true":"false","aria-label":I,"aria-controls":this.opened?this.guid:void 0,title:b,startIcon:K,endIcon:F},this.props.text),this.showLicenseWatermark&&u.createElement(e.WatermarkOverlay,{message:this.licenseMessage}),this.renderPopup(i))}componentDidMount(){(this.props.dir===void 0&&this.isRtl()||this.opened)&&this.forceUpdate()}get element(){return this.mainButton}dispatchClickEvent(i,t){this.isItemDisabled(t)||e.dispatchEvent(this.props.onItemClick,i,this,{item:this.buttonsData[t],itemIndex:t})}renderPopup(i){const{popupSettings:t={},_zIndex:s,unstyled:n}=this.props,a=s?s+j:L,l=n&&n.uDropDownButton,{focusedIndex:r}=this.state;return u.createElement(e.ZIndexContext.Provider,{value:a},u.createElement(q.Popup,{anchor:this.mainButton,show:this.opened,animate:t.animate,popupClass:e.classNames(e.uDropDownButton.popup({c:l}),t.popupClass),anchorAlign:t.anchorAlign||m.getAnchorAlign(i),popupAlign:t.popupAlign||m.getPopupAlign(i),style:i?{direction:"rtl"}:void 0,onClose:this.onPopupClose},u.createElement("ul",{role:"list",id:this.guid,tabIndex:-1,"aria-activedescendant":r>=0?`${this.guid}-${r}`:void 0,ref:this.listRef,onKeyDown:this.onKeyDown,onBlur:this.handleMenuBlur,className:e.classNames(e.uDropDownButton.ul({c:l,size:this.props.size}))},this.renderChildItems())))}renderChildItems(){const{item:i,itemRender:t,textField:s,unstyled:n}=this.props,a=n&&n.uDropDownButton;return this.buttonsData.length>0?this.buttonsData.map((l,r)=>u.createElement(T.ButtonItem,{className:e.classNames(e.uDropDownButton.item({c:a}),l.className,{"k-first":r===0},{"k-last":r===this.buttonsData.length-1}),dataItem:l,textField:s,focused:this.state.focusedIndex===r,onClick:this.onItemClick,onDown:this.onItemDown,render:t,item:i,index:r,key:r,id:`${this.guid}-${r}`})):null}isItemDisabled(i){return this.buttonsData[i]?this.buttonsData[i].disabled:this.props.disabled}isRtl(){return this.props.dir!==void 0?this.props.dir==="rtl":!!this.mainButton&&getComputedStyle(this.mainButton).direction==="rtl"}};h.propTypes={accessKey:o.string,ariaLabel:o.string,title:o.string,onFocus:o.func,onBlur:o.func,onClick:o.func,onItemClick:o.func,onOpen:o.func,onClose:o.func,items:o.arrayOf(o.any),textField:o.string,tabIndex:o.number,disabled:o.bool,icon:o.string,svgIcon:e.svgIconPropType,iconClass:o.string,imageUrl:o.string,popupSettings:o.object,itemRender:o.func,item:o.func,className:o.string,buttonClass:o.string,dir:o.string,size:o.oneOf(["small","medium","large"]),rounded:o.oneOf(["small","medium","large","full","none"]),fillMode:o.oneOf(["flat","link","outline","solid","clear"]),themeColor:o.oneOf(["base","primary","secondary","tertiary","info","success","warning","error","dark","light","inverse"])},h.defaultProps={size:void 0,rounded:void 0,fillMode:void 0,themeColor:void 0};let d=h;const g=e.createPropsContext(),D=e.withIdHOC(e.withPropsContext(g,e.withUnstyledHOC(e.withZIndexContext(d))));D.displayName="KendoReactDropDownButton";exports.DropDownButton=D;exports.DropDownButtonPropsContext=g;exports.DropDownButtonWithoutContext=d;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const M=require("react"),o=require("prop-types"),N=require("../Button.js"),e=require("@progress/kendo-react-common"),R=require("./utils/navigation.js"),A=require("./DropDownButtonItem.js"),T=require("./ButtonItem.js"),q=require("@progress/kendo-react-popup"),D=require("./utils/popup.js"),y=require("../package-metadata.js");function z(c){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(c){for(const t in c)if(t!=="default"){const s=Object.getOwnPropertyDescriptor(c,t);Object.defineProperty(i,t,s.get?s:{enumerable:!0,get:()=>c[t]})}}return i.default=c,Object.freeze(i)}const u=z(M),L=12e3,j=2e3,h=class h extends u.Component{constructor(i){super(i),this.state={opened:!1,focused:!1,focusedIndex:-1},this.mainButton=null,this.list=null,this.skipFocus=!1,this.showLicenseWatermark=!1,this.buttonsData=[],this.onKeyDown=t=>{const{focusedIndex:s}=this.state;if(t.altKey){!this.opened&&t.keyCode===e.Keys.down?(t.preventDefault(),this.setOpen(!0,t),this.setState({focusedIndex:0})):this.opened&&t.keyCode===e.Keys.up&&(t.preventDefault(),this.setState({focusedIndex:-1}),this.setOpen(!1,t));return}const n={...this.state};if(t.keyCode===e.Keys.enter||t.keyCode===e.Keys.space){t.preventDefault(),s>=0&&this.dispatchClickEvent(t,s);const a=!this.opened;this.setState({focused:!0,focusedIndex:a?0:-1}),this.setOpen(a,t);return}if(this.opened&&t.keyCode===e.Keys.esc){this.setState({focusedIndex:-1}),this.setOpen(!1,t);return}if(this.opened){const a=R.navigate(s,t.keyCode,t.altKey,this.buttonsData.length);n.focusedIndex=a;const p=t.keyCode===e.Keys.up||t.keyCode===e.Keys.down||t.keyCode===e.Keys.left||t.keyCode===e.Keys.right;!t.altKey&&(p||t.keyCode===e.Keys.home||t.keyCode===e.Keys.end)&&t.preventDefault()}this.setState(n)},this.switchFocus=t=>{this.skipFocus=!0,t(),window.setTimeout(()=>this.skipFocus=!1,0)},this.handleFocus=t=>{this.skipFocus||(this.setState({focused:!0,focusedIndex:this.opened?0:-1}),e.dispatchEvent(this.props.onFocus,t,this,void 0))},this.handleButtonBlur=t=>{this.opened||(this.setState({focused:!1}),e.dispatchEvent(this.props.onBlur,t,this,void 0))},this.handleMenuBlur=t=>{this.skipFocus||(this.setState({focused:!1,focusedIndex:-1}),e.dispatchEvent(this.props.onBlur,t,this,void 0),setTimeout(()=>{this.setOpen(!1,t)},0))},this.setOpen=(t,s)=>{this.opened!==t&&(this.openedDuringOnChange=t,this.setState({opened:t}),s?this.dispatchPopupEvent(s,t):this.openedDuringOnChange=void 0)},this.onItemClick=(t,s)=>{this.setState({focusedIndex:-1}),this.dispatchClickEvent(t,s),this.setOpen(!1,t)},this.onItemDown=t=>{e.getActiveElement(document)===this.list&&t.preventDefault()},this.mouseDown=t=>{t.preventDefault();const s=e.getActiveElement(document);this.element&&s!==this.element&&s!==this.list&&this.element.focus()},this.onPopupClose=t=>{var n;const s=e.getActiveElement(document);this.element&&this.element.removeAttribute("tabindex"),(s===this.list||(n=this.list)!=null&&n.contains(s))&&this.switchFocus(()=>{this.element&&this.element.focus({preventScroll:!0})}),this.props.popupSettings&&this.props.popupSettings.onClose&&this.props.popupSettings.onClose.call(void 0,t)},this.listRef=t=>{this.list=t,t&&this.state.focused&&this.switchFocus(()=>{t.focus({preventScroll:!0}),this.element&&(this.element.tabIndex=-1)})},this.onClickMainButton=t=>{if(e.dispatchEvent(this.props.onClick,t,this,void 0),!this.buttonsData.length)return;const s=!this.opened;this.setState({focused:!0,focusedIndex:s?0:-1}),this.setOpen(s,t)},this.dispatchPopupEvent=(t,s)=>{e.dispatchEvent(s?this.props.onOpen:this.props.onClose,t,this,void 0),this.openedDuringOnChange=void 0},this.showLicenseWatermark=!e.validatePackage(y.packageMetadata,{component:"DropDownButton"}),this.licenseMessage=e.getLicenseMessage(y.packageMetadata)}get guid(){return this.props.id+"-accessibility-id"}get opened(){return this.openedDuringOnChange!==void 0?this.openedDuringOnChange:this.props.opened===void 0?this.state.opened:this.props.opened}render(){const i=this.isRtl(),t=this.props.unstyled&&this.props.unstyled.uDropDownButton,s=i?"rtl":void 0,{id:n,style:a,tabIndex:p,disabled:r,size:w,rounded:I,fillMode:b,themeColor:B,ariaLabel:O,title:v,accessKey:E,icon:m,svgIcon:f,iconClass:g,buttonClass:S,className:x,imageUrl:P,startIcon:K,endIcon:F}=this.props;return this.buttonsData=this.props.items||u.Children.toArray(this.props.children).filter(l=>l&&l.type===A.DropDownButtonItem).map(l=>l.props),u.createElement(u.Fragment,null,u.createElement(N.Button,{id:n,size:w,style:a,rounded:I,fillMode:b,themeColor:B,onClick:this.onClickMainButton,onMouseDown:this.mouseDown,onKeyDown:this.onKeyDown,onFocus:this.handleFocus,onBlur:this.handleButtonBlur,"aria-disabled":r?"true":void 0,tabIndex:p,accessKey:E,icon:m,svgIcon:f,iconClass:g,className:e.classNames(S,x,e.uDropDownButton.wrapper({c:t,focused:this.state.focused,disabled:r})),imageUrl:P,dir:s,ref:l=>{this.mainButton=(l==null?void 0:l.element)||null},type:"button","aria-expanded":this.opened?"true":"false","aria-label":O||(f||m||g?"Menu":void 0),"aria-controls":this.opened?this.guid:void 0,title:v,startIcon:K,endIcon:F},this.props.text),this.showLicenseWatermark&&u.createElement(e.WatermarkOverlay,{message:this.licenseMessage}),this.renderPopup(i))}componentDidMount(){(this.props.dir===void 0&&this.isRtl()||this.opened)&&this.forceUpdate()}get element(){return this.mainButton}dispatchClickEvent(i,t){this.isItemDisabled(t)||e.dispatchEvent(this.props.onItemClick,i,this,{item:this.buttonsData[t],itemIndex:t})}renderPopup(i){const{popupSettings:t={},_zIndex:s,unstyled:n}=this.props,a=s?s+j:L,p=n&&n.uDropDownButton,{focusedIndex:r}=this.state;return u.createElement(e.ZIndexContext.Provider,{value:a},u.createElement(q.Popup,{anchor:this.mainButton,show:this.opened,animate:t.animate,popupClass:e.classNames(e.uDropDownButton.popup({c:p}),t.popupClass),anchorAlign:t.anchorAlign||D.getAnchorAlign(i),popupAlign:t.popupAlign||D.getPopupAlign(i),style:i?{direction:"rtl"}:void 0,onClose:this.onPopupClose},u.createElement("ul",{role:"menu",id:this.guid,tabIndex:-1,"aria-activedescendant":r>=0?`${this.guid}-${r}`:void 0,ref:this.listRef,onKeyDown:this.onKeyDown,onBlur:this.handleMenuBlur,className:e.classNames(e.uDropDownButton.ul({c:p,size:this.props.size}))},this.renderChildItems())))}renderChildItems(){const{item:i,itemRender:t,textField:s,unstyled:n}=this.props,a=n&&n.uDropDownButton;return this.buttonsData.length>0?this.buttonsData.map((p,r)=>u.createElement(T.ButtonItem,{className:e.classNames(e.uDropDownButton.item({c:a}),p.className,{"k-first":r===0},{"k-last":r===this.buttonsData.length-1}),dataItem:p,textField:s,focused:this.state.focusedIndex===r,onClick:this.onItemClick,onDown:this.onItemDown,render:t,item:i,index:r,key:r,id:`${this.guid}-${r}`})):null}isItemDisabled(i){return this.buttonsData[i]?this.buttonsData[i].disabled:this.props.disabled}isRtl(){return this.props.dir!==void 0?this.props.dir==="rtl":!!this.mainButton&&getComputedStyle(this.mainButton).direction==="rtl"}};h.propTypes={accessKey:o.string,ariaLabel:o.string,title:o.string,onFocus:o.func,onBlur:o.func,onClick:o.func,onItemClick:o.func,onOpen:o.func,onClose:o.func,items:o.arrayOf(o.any),textField:o.string,tabIndex:o.number,disabled:o.bool,icon:o.string,svgIcon:e.svgIconPropType,iconClass:o.string,imageUrl:o.string,popupSettings:o.object,itemRender:o.func,item:o.func,className:o.string,buttonClass:o.string,dir:o.string,size:o.oneOf(["small","medium","large"]),rounded:o.oneOf(["small","medium","large","full","none"]),fillMode:o.oneOf(["flat","link","outline","solid","clear"]),themeColor:o.oneOf(["base","primary","secondary","tertiary","info","success","warning","error","inverse"])},h.defaultProps={size:void 0,rounded:void 0,fillMode:void 0,themeColor:void 0};let d=h;const C=e.createPropsContext(),k=e.withIdHOC(e.withPropsContext(C,e.withUnstyledHOC(e.withZIndexContext(d))));k.displayName="KendoReactDropDownButton";exports.DropDownButton=k;exports.DropDownButtonPropsContext=C;exports.DropDownButtonWithoutContext=d;