@progress/kendo-react-layout 14.5.0-develop.12 → 14.5.0-develop.14

package/panelbar/PanelBar.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 J=require("react"),v=require("prop-types"),L=require("./PanelBarItem.js"),m=require("./util.js"),f=require("@progress/kendo-react-common"),a=require("./interfaces/NavigationAction.js");function Q(s){const c=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(s){for(const r in s)if(r!=="default"){const k=Object.getOwnPropertyDescriptor(s,r);Object.defineProperty(c,r,k.get?k:{enumerable:!0,get:()=>s[r]})}}return c.default=s,Object.freeze(c)}const i=Q(J),w=s=>{const{animation:c=!0,children:r,dir:k,selected:I,expanded:U,expandMode:S="multiple",className:D,keepItemsMounted:T=!1,onSelect:x,style:j,isControlled:_}=s,K=i.useRef(null),B=i.useRef(void 0),N=i.useRef(null),[p,g]=i.useState(()=>{const t=S||"multiple",u=m.getInitialState(s,t);return u.focused||(u.focused=m.getFirstId(s)),u}),R=S||"multiple",F=I!==void 0?I:p.selected,h=_?U||[]:p.expanded,E=i.useCallback(t=>{N.current=window.setTimeout(()=>t())},[]),C=i.useCallback(t=>{const u=A,o=m.flatChildren(i.Children.toArray(u));let n,l;switch(o.forEach(e=>{e.props.uniquePrivateKey===(t.uniquePrivateKey||p.focused)&&(n=e)}),R){case"single":l=[...n.props.parentUniquePrivateKey,n.props.uniquePrivateKey],m.isArrayEqual(h,l)&&(n.props.parentUniquePrivateKey?l=[...n.props.parentUniquePrivateKey]:l=[]);break;case"multiple":{l=h.slice();const e=l.indexOf(n.props.uniquePrivateKey);e===-1?l.push(n.props.uniquePrivateKey):l.splice(e,1);break}default:l=h.slice();break}g(e=>({...e,selected:n.props.uniquePrivateKey,expanded:l})),x&&x({target:n,expandedItems:l})},[r,p.focused,R,h,x]),d=i.useCallback((t,u=0,o)=>{const n=A,l=m.flatVisibleChildren(i.Children.toArray(n)),e=m.getFocusedChild(l,u,t,p.focused,o);if(e){const b=h.slice();if(o===a.NavigationAction.Right&&e&&e.props&&e.props.children&&e.props.children.length>0){if(b.push(e.props.uniquePrivateKey),g(y=>({...y,expanded:[...new Set(b)]})),e.props.expanded){const y=e.props.children[0].props.uniquePrivateKey;g(P=>({...P,focused:y}))}}else if(o===a.NavigationAction.Left&&(e&&e.props&&e.props.parentUniquePrivateKey&&e.props.parentUniquePrivateKey.length>0||e&&e.props&&!e.props.disabled&&e.props.children&&e.props.children.length>0)){const y=e.props.parentUniquePrivateKey;if(e.props.expanded){const P=e.props.uniquePrivateKey,q=b.indexOf(P);b.splice(q,1),g(H=>({...H,expanded:b}))}else if(e.props.level>0){const P=e.props.parentUniquePrivateKey[y.length-1];g(q=>({...q,focused:P}))}}else B.current=e.props.id,g(y=>({...y,focused:e.props.uniquePrivateKey}))}},[r,p.focused,h]),M=i.useCallback(t=>{C(t),d(t)},[C,d]),A=i.useMemo(()=>m.renderChildren({animation:c,keepItemsMounted:T,state:{...p,selected:F},expanded:h,handleSelect:M,children:r}),[c,T,p,F,h,r,M]),O=i.useCallback((t,u)=>{let o;switch(u){case a.NavigationAction.First:d(t,o,a.NavigationAction.First);break;case a.NavigationAction.Last:d(t,o,a.NavigationAction.Last);break;case a.NavigationAction.Left:d(t,o,a.NavigationAction.Left);break;case a.NavigationAction.Right:d(t,o,a.NavigationAction.Right);break;case a.NavigationAction.Previous:o=-1,d(t,o);break;case a.NavigationAction.Next:o=1,d(t,o);break;case a.NavigationAction.Toggle:C(t);break}},[d,C]),W=i.useCallback(()=>{clearTimeout(N.current),p.wrapperFocused||g(t=>({...t,wrapperFocused:!0}))},[p.wrapperFocused]),$=i.useCallback(()=>{E(()=>{g(t=>({...t,wrapperFocused:!1}))})},[E]),z=i.useCallback(t=>{const u=K.current&&getComputedStyle(K.current).direction==="rtl"||!1;if(t.target===t.currentTarget){const o=t.keyCode;let n;switch(o){case f.Keys.left:n=u?a.NavigationAction.Right:a.NavigationAction.Left;break;case f.Keys.up:n=a.NavigationAction.Previous;break;case f.Keys.right:n=u?a.NavigationAction.Left:a.NavigationAction.Right;break;case f.Keys.down:n=a.NavigationAction.Next;break;case f.Keys.home:n=a.NavigationAction.First;break;case f.Keys.end:n=a.NavigationAction.Last;break;case f.Keys.space:case f.Keys.enter:n=a.NavigationAction.Toggle;break;default:n=null;break}n!==null&&(t.preventDefault(),O(t,n))}},[O]);i.useEffect(()=>()=>{N.current&&clearTimeout(N.current)},[]);const V={"aria-activedescendant":B.current},G=f.classNames("k-panelbar",D);return i.createElement("ul",{ref:K,dir:k,role:"tree",tabIndex:0,onKeyDown:z,onFocus:W,onBlur:$,className:G,style:j,...V},A)};w.propTypes={children:v.oneOfType([v.arrayOf(function(s,c){return s[c].type!==L.PanelBarItem?new Error("PanelBar children should be either PanelBarItem or an array of PanelBarItem."):null}),function(s,c){const r=s[c];return r&&r.type!==L.PanelBarItem?new Error("PanelBar children should be either PanelBarItem or an array of PanelBarItem."):null}]),selected:v.string,expandMode(s,c){const r=s[c];return r!=="single"&&r!=="multiple"&&r!=="default"?new Error(`Invalid value '${r}' given to '${c}'. It must be either 'single', 'multiple' or 'default'.`):null},animation:v.bool,keepItemsMounted:v.bool,onSelect:v.func};w.defaultProps={expandMode:"multiple",animation:!0,keepItemsMounted:!1};exports.PanelBar=w;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Q=require("react"),m=require("prop-types"),L=require("./PanelBarItem.js"),b=require("./util.js"),d=require("@progress/kendo-react-common"),a=require("./interfaces/NavigationAction.js");function X(o){const c=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(o){for(const r in o)if(r!=="default"){const k=Object.getOwnPropertyDescriptor(o,r);Object.defineProperty(c,r,k.get?k:{enumerable:!0,get:()=>o[r]})}}return c.default=o,Object.freeze(c)}const i=X(Q),w=o=>{const{animation:c=!0,children:r,dir:k,selected:I,expanded:U,expandMode:R="multiple",className:D,keepItemsMounted:S=!1,onSelect:x,style:j,isControlled:W}=o,K=i.useRef(null),_=i.useRef(null),T=i.useRef(void 0),N=i.useRef(null);d.useWebMcpRegister("panelbar",_,o,o.webMcp);const[p,g]=i.useState(()=>{const t=R||"multiple",u=b.getInitialState(o,t);return u.focused||(u.focused=b.getFirstId(o)),u}),B=R||"multiple",M=I!==void 0?I:p.selected,h=W?U||[]:p.expanded,F=i.useCallback(t=>{N.current=window.setTimeout(()=>t())},[]),C=i.useCallback(t=>{const u=A,s=b.flatChildren(i.Children.toArray(u));let n,l;switch(s.forEach(e=>{e.props.uniquePrivateKey===(t.uniquePrivateKey||p.focused)&&(n=e)}),B){case"single":l=[...n.props.parentUniquePrivateKey,n.props.uniquePrivateKey],b.isArrayEqual(h,l)&&(n.props.parentUniquePrivateKey?l=[...n.props.parentUniquePrivateKey]:l=[]);break;case"multiple":{l=h.slice();const e=l.indexOf(n.props.uniquePrivateKey);e===-1?l.push(n.props.uniquePrivateKey):l.splice(e,1);break}default:l=h.slice();break}g(e=>({...e,selected:n.props.uniquePrivateKey,expanded:l})),x&&x({target:n,expandedItems:l})},[r,p.focused,B,h,x]),f=i.useCallback((t,u=0,s)=>{const n=A,l=b.flatVisibleChildren(i.Children.toArray(n)),e=b.getFocusedChild(l,u,t,p.focused,s);if(e){const v=h.slice();if(s===a.NavigationAction.Right&&e&&e.props&&e.props.children&&e.props.children.length>0){if(v.push(e.props.uniquePrivateKey),g(y=>({...y,expanded:[...new Set(v)]})),e.props.expanded){const y=e.props.children[0].props.uniquePrivateKey;g(P=>({...P,focused:y}))}}else if(s===a.NavigationAction.Left&&(e&&e.props&&e.props.parentUniquePrivateKey&&e.props.parentUniquePrivateKey.length>0||e&&e.props&&!e.props.disabled&&e.props.children&&e.props.children.length>0)){const y=e.props.parentUniquePrivateKey;if(e.props.expanded){const P=e.props.uniquePrivateKey,q=v.indexOf(P);v.splice(q,1),g(J=>({...J,expanded:v}))}else if(e.props.level>0){const P=e.props.parentUniquePrivateKey[y.length-1];g(q=>({...q,focused:P}))}}else T.current=e.props.id,g(y=>({...y,focused:e.props.uniquePrivateKey}))}},[r,p.focused,h]),E=i.useCallback(t=>{C(t),f(t)},[C,f]),A=i.useMemo(()=>b.renderChildren({animation:c,keepItemsMounted:S,state:{...p,selected:M},expanded:h,handleSelect:E,children:r}),[c,S,p,M,h,r,E]),O=i.useCallback((t,u)=>{let s;switch(u){case a.NavigationAction.First:f(t,s,a.NavigationAction.First);break;case a.NavigationAction.Last:f(t,s,a.NavigationAction.Last);break;case a.NavigationAction.Left:f(t,s,a.NavigationAction.Left);break;case a.NavigationAction.Right:f(t,s,a.NavigationAction.Right);break;case a.NavigationAction.Previous:s=-1,f(t,s);break;case a.NavigationAction.Next:s=1,f(t,s);break;case a.NavigationAction.Toggle:C(t);break}},[f,C]),$=i.useCallback(()=>{clearTimeout(N.current),p.wrapperFocused||g(t=>({...t,wrapperFocused:!0}))},[p.wrapperFocused]),z=i.useCallback(()=>{F(()=>{g(t=>({...t,wrapperFocused:!1}))})},[F]),H=i.useCallback(t=>{const u=K.current&&getComputedStyle(K.current).direction==="rtl"||!1;if(t.target===t.currentTarget){const s=t.keyCode;let n;switch(s){case d.Keys.left:n=u?a.NavigationAction.Right:a.NavigationAction.Left;break;case d.Keys.up:n=a.NavigationAction.Previous;break;case d.Keys.right:n=u?a.NavigationAction.Left:a.NavigationAction.Right;break;case d.Keys.down:n=a.NavigationAction.Next;break;case d.Keys.home:n=a.NavigationAction.First;break;case d.Keys.end:n=a.NavigationAction.Last;break;case d.Keys.space:case d.Keys.enter:n=a.NavigationAction.Toggle;break;default:n=null;break}n!==null&&(t.preventDefault(),O(t,n))}},[O]);i.useEffect(()=>()=>{N.current&&clearTimeout(N.current)},[]);const V={"aria-activedescendant":T.current},G=d.classNames("k-panelbar",D);return i.createElement("ul",{ref:K,dir:k,role:"tree",tabIndex:0,onKeyDown:H,onFocus:$,onBlur:z,className:G,style:j,...V},A)};w.propTypes={children:m.oneOfType([m.arrayOf(function(o,c){return o[c].type!==L.PanelBarItem?new Error("PanelBar children should be either PanelBarItem or an array of PanelBarItem."):null}),function(o,c){const r=o[c];return r&&r.type!==L.PanelBarItem?new Error("PanelBar children should be either PanelBarItem or an array of PanelBarItem."):null}]),selected:m.string,expandMode(o,c){const r=o[c];return r!=="single"&&r!=="multiple"&&r!=="default"?new Error(`Invalid value '${r}' given to '${c}'. It must be either 'single', 'multiple' or 'default'.`):null},animation:m.bool,keepItemsMounted:m.bool,onSelect:m.func};w.defaultProps={expandMode:"multiple",animation:!0,keepItemsMounted:!1};exports.PanelBar=w;

package/panelbar/PanelBar.mjs

@@ -6,169 +6,171 @@
  *-------------------------------------------------------------------------------------------
  */
 import * as a from "react";
-import b from "prop-types";
+import y from "prop-types";
 import { PanelBarItem as L } from "./PanelBarItem.mjs";
-import { getInitialState as J, getFirstId as Q, flatChildren as X, isArrayEqual as Y, flatVisibleChildren as Z, getFocusedChild as _, renderChildren as ee } from "./util.mjs";
-import { Keys as m, classNames as re } from "@progress/kendo-react-common";
+import { getInitialState as Q, getFirstId as X, flatChildren as Y, isArrayEqual as Z, flatVisibleChildren as _, getFocusedChild as ee, renderChildren as te } from "./util.mjs";
+import { useWebMcpRegister as re, Keys as m, classNames as ne } from "@progress/kendo-react-common";
 import { NavigationAction as n } from "./interfaces/NavigationAction.mjs";
-const U = (p) => {
+const U = (c) => {
   const {
-    animation: d = !0,
+    animation: u = !0,
     children: o,
     dir: N,
     selected: w,
     expanded: O,
     expandMode: I = "multiple",
     className: A,
-    keepItemsMounted: T = !1,
+    keepItemsMounted: R = !1,
     onSelect: C,
     style: D,
     isControlled: W
-  } = p, v = a.useRef(null), E = a.useRef(void 0), x = a.useRef(null), [c, f] = a.useState(() => {
-    const l = J(p, I || "multiple");
-    return l.focused || (l.focused = Q(p)), l;
-  }), F = I || "multiple", R = w !== void 0 ? w : c.selected, h = W ? O || [] : c.expanded, S = a.useCallback((r) => {
-    x.current = window.setTimeout(() => r());
+  } = c, v = a.useRef(null), $ = a.useRef(null), T = a.useRef(void 0), x = a.useRef(null);
+  re("panelbar", $, c, c.webMcp);
+  const [p, f] = a.useState(() => {
+    const i = Q(c, I || "multiple");
+    return i.focused || (i.focused = X(c)), i;
+  }), E = I || "multiple", F = w !== void 0 ? w : p.selected, h = W ? O || [] : p.expanded, M = a.useCallback((t) => {
+    x.current = window.setTimeout(() => t());
   }, []), g = a.useCallback(
-    (r) => {
-      const l = K, s = X(a.Children.toArray(l));
-      let t, i;
+    (t) => {
+      const i = K, s = Y(a.Children.toArray(i));
+      let r, l;
       switch (s.forEach((e) => {
-        e.props.uniquePrivateKey === (r.uniquePrivateKey || c.focused) && (t = e);
-      }), F) {
+        e.props.uniquePrivateKey === (t.uniquePrivateKey || p.focused) && (r = e);
+      }), E) {
         case "single":
-          i = [...t.props.parentUniquePrivateKey, t.props.uniquePrivateKey], Y(h, i) && (t.props.parentUniquePrivateKey ? i = [...t.props.parentUniquePrivateKey] : i = []);
+          l = [...r.props.parentUniquePrivateKey, r.props.uniquePrivateKey], Z(h, l) && (r.props.parentUniquePrivateKey ? l = [...r.props.parentUniquePrivateKey] : l = []);
           break;
         case "multiple": {
-          i = h.slice();
-          const e = i.indexOf(t.props.uniquePrivateKey);
-          e === -1 ? i.push(t.props.uniquePrivateKey) : i.splice(e, 1);
+          l = h.slice();
+          const e = l.indexOf(r.props.uniquePrivateKey);
+          e === -1 ? l.push(r.props.uniquePrivateKey) : l.splice(e, 1);
           break;
         }
         default:
-          i = h.slice();
+          l = h.slice();
           break;
       }
-      f((e) => ({ ...e, selected: t.props.uniquePrivateKey, expanded: i })), C && C({
-        target: t,
-        expandedItems: i
+      f((e) => ({ ...e, selected: r.props.uniquePrivateKey, expanded: l })), C && C({
+        target: r,
+        expandedItems: l
       });
     },
-    [o, c.focused, F, h, C]
-  ), u = a.useCallback(
-    (r, l = 0, s) => {
-      const t = K, i = Z(a.Children.toArray(t)), e = _(i, l, r, c.focused, s);
+    [o, p.focused, E, h, C]
+  ), d = a.useCallback(
+    (t, i = 0, s) => {
+      const r = K, l = _(a.Children.toArray(r)), e = ee(l, i, t, p.focused, s);
       if (e) {
         const k = h.slice();
         if (s === n.Right && e && e.props && e.props.children && e.props.children.length > 0) {
-          if (k.push(e.props.uniquePrivateKey), f((y) => ({ ...y, expanded: [...new Set(k)] })), e.props.expanded) {
-            const y = e.props.children[0].props.uniquePrivateKey;
-            f((P) => ({ ...P, focused: y }));
+          if (k.push(e.props.uniquePrivateKey), f((b) => ({ ...b, expanded: [...new Set(k)] })), e.props.expanded) {
+            const b = e.props.children[0].props.uniquePrivateKey;
+            f((P) => ({ ...P, focused: b }));
           }
         } else if (s === n.Left && (e && e.props && e.props.parentUniquePrivateKey && e.props.parentUniquePrivateKey.length > 0 || e && e.props && !e.props.disabled && e.props.children && e.props.children.length > 0)) {
-          const y = e.props.parentUniquePrivateKey;
+          const b = e.props.parentUniquePrivateKey;
           if (e.props.expanded) {
             const P = e.props.uniquePrivateKey, q = k.indexOf(P);
-            k.splice(q, 1), f((H) => ({ ...H, expanded: k }));
+            k.splice(q, 1), f((J) => ({ ...J, expanded: k }));
           } else if (e.props.level > 0) {
-            const P = e.props.parentUniquePrivateKey[y.length - 1];
+            const P = e.props.parentUniquePrivateKey[b.length - 1];
             f((q) => ({ ...q, focused: P }));
           }
         } else
-          E.current = e.props.id, f((y) => ({ ...y, focused: e.props.uniquePrivateKey }));
+          T.current = e.props.id, f((b) => ({ ...b, focused: e.props.uniquePrivateKey }));
       }
     },
-    [o, c.focused, h]
+    [o, p.focused, h]
   ), B = a.useCallback(
-    (r) => {
-      g(r), u(r);
+    (t) => {
+      g(t), d(t);
     },
-    [g, u]
-  ), K = a.useMemo(() => ee({
-    animation: d,
-    keepItemsMounted: T,
-    state: { ...c, selected: R },
+    [g, d]
+  ), K = a.useMemo(() => te({
+    animation: u,
+    keepItemsMounted: R,
+    state: { ...p, selected: F },
     expanded: h,
     handleSelect: B,
     children: o
-  }), [d, T, c, R, h, o, B]), M = a.useCallback(
-    (r, l) => {
+  }), [u, R, p, F, h, o, B]), S = a.useCallback(
+    (t, i) => {
       let s;
-      switch (l) {
+      switch (i) {
         case n.First:
-          u(r, s, n.First);
+          d(t, s, n.First);
           break;
         case n.Last:
-          u(r, s, n.Last);
+          d(t, s, n.Last);
           break;
         case n.Left:
-          u(r, s, n.Left);
+          d(t, s, n.Left);
           break;
         case n.Right:
-          u(r, s, n.Right);
+          d(t, s, n.Right);
           break;
         case n.Previous:
-          s = -1, u(r, s);
+          s = -1, d(t, s);
           break;
         case n.Next:
-          s = 1, u(r, s);
+          s = 1, d(t, s);
           break;
         case n.Toggle:
-          g(r);
+          g(t);
           break;
       }
     },
-    [u, g]
-  ), $ = a.useCallback(() => {
-    clearTimeout(x.current), c.wrapperFocused || f((r) => ({ ...r, wrapperFocused: !0 }));
-  }, [c.wrapperFocused]), V = a.useCallback(() => {
-    S(() => {
-      f((r) => ({ ...r, wrapperFocused: !1 }));
+    [d, g]
+  ), H = a.useCallback(() => {
+    clearTimeout(x.current), p.wrapperFocused || f((t) => ({ ...t, wrapperFocused: !0 }));
+  }, [p.wrapperFocused]), V = a.useCallback(() => {
+    M(() => {
+      f((t) => ({ ...t, wrapperFocused: !1 }));
     });
-  }, [S]), j = a.useCallback(
-    (r) => {
-      const l = v.current && getComputedStyle(v.current).direction === "rtl" || !1;
-      if (r.target === r.currentTarget) {
-        const s = r.keyCode;
-        let t;
+  }, [M]), j = a.useCallback(
+    (t) => {
+      const i = v.current && getComputedStyle(v.current).direction === "rtl" || !1;
+      if (t.target === t.currentTarget) {
+        const s = t.keyCode;
+        let r;
         switch (s) {
           case m.left:
-            t = l ? n.Right : n.Left;
+            r = i ? n.Right : n.Left;
             break;
           case m.up:
-            t = n.Previous;
+            r = n.Previous;
             break;
           case m.right:
-            t = l ? n.Left : n.Right;
+            r = i ? n.Left : n.Right;
             break;
           case m.down:
-            t = n.Next;
+            r = n.Next;
             break;
           case m.home:
-            t = n.First;
+            r = n.First;
             break;
           case m.end:
-            t = n.Last;
+            r = n.Last;
             break;
           case m.space:
           case m.enter:
-            t = n.Toggle;
+            r = n.Toggle;
             break;
           default:
-            t = null;
+            r = null;
             break;
         }
-        t !== null && (r.preventDefault(), M(r, t));
+        r !== null && (t.preventDefault(), S(t, r));
       }
     },
-    [M]
+    [S]
   );
   a.useEffect(() => () => {
     x.current && clearTimeout(x.current);
   }, []);
   const z = {
-    "aria-activedescendant": E.current
-  }, G = re("k-panelbar", A);
+    "aria-activedescendant": T.current
+  }, G = ne("k-panelbar", A);
   return /* @__PURE__ */ a.createElement(
     "ul",
     {
@@ -177,7 +179,7 @@ const U = (p) => {
       role: "tree",
       tabIndex: 0,
       onKeyDown: j,
-      onFocus: $,
+      onFocus: H,
       onBlur: V,
       className: G,
       style: D,
@@ -190,12 +192,12 @@ U.propTypes = {
   /**
    * A collection of `PanelBarItem` components.
    */
-  children: b.oneOfType([
-    b.arrayOf(function(p, d) {
-      return p[d].type !== L ? new Error("PanelBar children should be either PanelBarItem or an array of PanelBarItem.") : null;
+  children: y.oneOfType([
+    y.arrayOf(function(c, u) {
+      return c[u].type !== L ? new Error("PanelBar children should be either PanelBarItem or an array of PanelBarItem.") : null;
     }),
-    function(p, d) {
-      const o = p[d];
+    function(c, u) {
+      const o = c[u];
       return o && o.type !== L ? new Error("PanelBar children should be either PanelBarItem or an array of PanelBarItem.") : null;
     }
   ]),
@@ -203,29 +205,29 @@ U.propTypes = {
    * Expands the item or items that match the `selected` property while respecting the `expandMode` property (see [example]({% slug expandModes_panelbar %}#toc-single-expandMode)).
    * To expand the item on the initial load of the PanelBar, define the `expanded` property of each PanelBarItem.
    */
-  selected: b.string,
+  selected: y.string,
   /**
    * Sets the expand mode of the PanelBar through the `single`, `multiple`, or `default` keywords (see [example]({% slug expandModes_panelbar %})).
    */
-  expandMode(p, d) {
-    const o = p[d];
+  expandMode(c, u) {
+    const o = c[u];
     return o !== "single" && o !== "multiple" && o !== "default" ? new Error(
-      `Invalid value '${o}' given to '${d}'. It must be either 'single', 'multiple' or 'default'.`
+      `Invalid value '${o}' given to '${u}'. It must be either 'single', 'multiple' or 'default'.`
     ) : null;
   },
   /**
    * Enables or disables the animation of the PanelBar items.
    */
-  animation: b.bool,
+  animation: y.bool,
   /**
    * When enabled, keeps PanelBarItem content mounted in the DOM even when collapsed.
    */
-  keepItemsMounted: b.bool,
+  keepItemsMounted: y.bool,
   /**
    * Fires when the expand mode of the PanelBar is set to `single` or `multiple`
    * and an item is toggled (see [example]({% slug overview_panelbar %}#toc-expanded-state-management)).
    */
-  onSelect: b.func
+  onSelect: y.func
 };
 U.defaultProps = {
   expandMode: "multiple",

package/panelbar/interfaces/PanelBarProps.d.ts

@@ -6,6 +6,7 @@
  *-------------------------------------------------------------------------------------------
  */
 import { PanelBarSelectEventArguments } from '../../index.js';
+import { WebMcpProps } from '@progress/kendo-react-common';
 /**
  * Represents the expand modes of the KendoReact PanelBar. Defaults to `multiple`.
  */
@@ -137,4 +138,11 @@ export interface PanelBarProps {
      * ```
      */
     style?: React.CSSProperties;
+    /**
+     * Enables Web MCP tool registration so AI agents can interact with this PanelBar.
+     * Set to `true` to use the provider-level `dataName`, or pass a config object to override.
+     *
+     * Requires a `WebMcpProvider` ancestor from `@progress/kendo-react-webmcp`.
+     */
+    webMcp?: boolean | WebMcpProps;
 }

package/stepper/Stepper.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 te=require("react"),o=require("prop-types"),ne=require("./context/StepperContext.js"),p=require("@progress/kendo-react-common"),se=require("./Step.js"),oe=require("@progress/kendo-react-progressbars"),z=require("./contants.js"),re=require("@progress/kendo-react-intl"),R=require("./messages/index.js");function ie(m){const k=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(m){for(const d in m)if(d!=="default"){const h=Object.getOwnPropertyDescriptor(m,d);Object.defineProperty(k,d,h.get?h:{enumerable:!0,get:()=>m[d]})}}return k.default=m,Object.freeze(k)}const e=ie(te),O=e.forwardRef((m,k)=>{const{animationDuration:d,children:h,className:T,disabled:g,errorIcon:V,errorSVGIcon:j,item:w,items:b,linear:y,mode:_,orientation:S,selectOnFocus:E,style:P,successIcon:K,successSVGIcon:G,value:a=0,onChange:C,onFocus:N}=m,B=re.useLocalization().toLanguageString(R.progBarAriaLabel,R.messages[R.progBarAriaLabel]),v=e.useRef(null),q=e.useCallback(()=>{v.current&&p.focusFirstFocusableChild(v.current)},[]),x=e.useCallback(()=>({element:v.current,focus:q}),[q]);e.useImperativeHandle(k,x);const[H,u]=e.useState(a),f=b?b.length:0,s=S==="vertical",D=p.useDir(v,m.dir),U=typeof d=="number"?d:d!==!1?z.DEFAULT_ANIMATION_DURATION:z.NO_ANIMATION;e.useEffect(()=>{u(a)},[a]);const F=e.useCallback((c,r)=>{const t=r===a-1,n=r===a,i=r===a+1;a!==r&&C&&!g&&(!y||t||n||i)&&(p.dispatchEvent(C,c,x(),{value:r}),u(r))},[a,y,C,g,u]),J=e.useCallback(c=>{const r=c.value,t=c.syntheticEvent;F(t,r)},[F]),Q=e.useCallback(c=>{N&&!g&&p.dispatchEvent(N,c.syntheticEvent,x(),void 0)},[N,g]),I=e.useMemo(()=>{const c=D==="rtl",r=b.length-1;return new p.Navigation({root:v,selectors:["ol.k-step-list li.k-step a.k-step-link"],tabIndex:0,keyboardEvents:{keydown:{Tab:(t,n,i)=>{const l=n.elements.indexOf(t),M=n.previous(t).children[0],A=n.next(t).children[0];i.shiftKey?!c&&l>0?(i.preventDefault(),n.focusPrevious(t),u(l-1),E&&M.click()):c&&l<r&&(i.preventDefault(),n.focusNext(t),u(l+1),E&&A.click()):!c&&l<r?(i.preventDefault(),n.focusNext(t),u(l+1),E&&A.click()):c&&l>0&&(i.preventDefault(),n.focusPrevious(t),u(l-1),E&&M.click())},Home:(t,n,i)=>{i.preventDefault(),n.focusElement(n.first,t),u(0)},End:(t,n,i)=>{i.preventDefault(),n.focusElement(n.last,t),u(r)},Space:(t,n,i)=>{i.preventDefault(),t.children[0].click()},Enter:(t,n,i)=>{i.preventDefault(),t.children[0].click()}}}})},[D,b.length,u,E]);e.useEffect(()=>(I.initializeRovingTab(a),()=>I.removeFocusListener()),[]);const W=e.useCallback(I.triggerKeyboardEvent.bind(I),[]),X=e.useMemo(()=>p.classNames("k-stepper",{"k-stepper-linear":y},T),[y,T]),Y=e.useMemo(()=>({display:"grid",gridTemplateColumns:s?void 0:"repeat("+f*2+", 1fr)",gridTemplateRows:s?"repeat("+f+", 1fr)":void 0,...P}),[s,f,P]),Z=e.useMemo(()=>p.classNames("k-step-list",{"k-step-list-horizontal":!s,"k-step-list-vertical":s}),[s]),$=e.useMemo(()=>({gridColumnStart:s?void 0:1,gridColumnEnd:s?void 0:-1,gridRowStart:s?1:void 0,gridRowEnd:s?-1:void 0}),[s]),ee=e.useMemo(()=>({gridColumnStart:s?void 0:2,gridColumnEnd:s?void 0:f*2,gridRowStart:s?1:void 0,gridRowEnd:s?f:void 0,top:s?17:void 0}),[s,f]),L=b&&b.map((c,r)=>{const t={index:r,disabled:g||c.disabled,focused:r===H,current:r===a,...c},n=w||se.Step;return e.createElement(n,{key:r,...t})});return e.createElement(ne.StepperContext.Provider,{value:{animationDuration:d,isVertical:s,item:w,linear:y,mode:_,numOfSteps:f,value:a,successIcon:K,successSVGIcon:G,errorIcon:V,errorSVGIcon:j,onChange:J,onFocus:Q}},e.createElement("nav",{className:X,style:Y,dir:D,role:"navigation",ref:v,onKeyDown:W},e.createElement("ol",{className:Z,style:$},L||h),e.createElement(oe.ProgressBar,{style:ee,labelPlacement:"start",animation:{duration:U},ariaLabel:B,"aria-hidden":!0,max:f-1,labelVisible:!1,orientation:S,reverse:S==="vertical",value:a,disabled:g,tabIndex:-1})))});O.propTypes={animationDuration:o.oneOfType([o.bool,o.number]),children:o.any,className:o.string,dir:o.string,disabled:o.bool,errorIcon:o.string,errorSVGIcon:p.svgIconPropType,item:o.any,items:o.any,linear:o.bool,mode:o.oneOf(["steps","labels"]),orientation:o.oneOf(["horizontal","vertical"]),style:o.object,successIcon:o.string,successSVGIcon:p.svgIconPropType,value:o.number.isRequired,onChange:o.func,onFocus:o.func};O.displayName="KendoStepper";exports.Stepper=O;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const ne=require("react"),o=require("prop-types"),se=require("./context/StepperContext.js"),p=require("@progress/kendo-react-common"),oe=require("./Step.js"),re=require("@progress/kendo-react-progressbars"),V=require("./contants.js"),ie=require("@progress/kendo-react-intl"),D=require("./messages/index.js");function ce(u){const k=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(u){for(const m in u)if(m!=="default"){const I=Object.getOwnPropertyDescriptor(u,m);Object.defineProperty(k,m,I.get?I:{enumerable:!0,get:()=>u[m]})}}return k.default=u,Object.freeze(k)}const e=ce(ne),O=e.forwardRef((u,k)=>{const{animationDuration:m,children:I,className:T,disabled:g,errorIcon:j,errorSVGIcon:_,item:w,items:b,linear:y,mode:H,orientation:C,selectOnFocus:E,style:P,successIcon:K,successSVGIcon:G,value:a=0,onChange:R,onFocus:N}=u,B=ie.useLocalization().toLanguageString(D.progBarAriaLabel,D.messages[D.progBarAriaLabel]),v=e.useRef(null),M=e.useRef(null);p.useWebMcpRegister("stepper",M,u,u.webMcp);const q=e.useCallback(()=>{v.current&&p.focusFirstFocusableChild(v.current)},[]),h=e.useCallback(()=>({element:v.current,focus:q}),[q]);e.useImperativeHandle(k,h),e.useImperativeHandle(M,h);const[U,d]=e.useState(a),f=b?b.length:0,s=C==="vertical",x=p.useDir(v,u.dir),W=typeof m=="number"?m:m!==!1?V.DEFAULT_ANIMATION_DURATION:V.NO_ANIMATION;e.useEffect(()=>{d(a)},[a]);const F=e.useCallback((c,r)=>{const t=r===a-1,n=r===a,i=r===a+1;a!==r&&R&&!g&&(!y||t||n||i)&&(p.dispatchEvent(R,c,h(),{value:r}),d(r))},[a,y,R,g,d]),J=e.useCallback(c=>{const r=c.value,t=c.syntheticEvent;F(t,r)},[F]),Q=e.useCallback(c=>{N&&!g&&p.dispatchEvent(N,c.syntheticEvent,h(),void 0)},[N,g]),S=e.useMemo(()=>{const c=x==="rtl",r=b.length-1;return new p.Navigation({root:v,selectors:["ol.k-step-list li.k-step a.k-step-link"],tabIndex:0,keyboardEvents:{keydown:{Tab:(t,n,i)=>{const l=n.elements.indexOf(t),A=n.previous(t).children[0],z=n.next(t).children[0];i.shiftKey?!c&&l>0?(i.preventDefault(),n.focusPrevious(t),d(l-1),E&&A.click()):c&&l<r&&(i.preventDefault(),n.focusNext(t),d(l+1),E&&z.click()):!c&&l<r?(i.preventDefault(),n.focusNext(t),d(l+1),E&&z.click()):c&&l>0&&(i.preventDefault(),n.focusPrevious(t),d(l-1),E&&A.click())},Home:(t,n,i)=>{i.preventDefault(),n.focusElement(n.first,t),d(0)},End:(t,n,i)=>{i.preventDefault(),n.focusElement(n.last,t),d(r)},Space:(t,n,i)=>{i.preventDefault(),t.children[0].click()},Enter:(t,n,i)=>{i.preventDefault(),t.children[0].click()}}}})},[x,b.length,d,E]);e.useEffect(()=>(S.initializeRovingTab(a),()=>S.removeFocusListener()),[]);const X=e.useCallback(S.triggerKeyboardEvent.bind(S),[]),Y=e.useMemo(()=>p.classNames("k-stepper",{"k-stepper-linear":y},T),[y,T]),Z=e.useMemo(()=>({display:"grid",gridTemplateColumns:s?void 0:"repeat("+f*2+", 1fr)",gridTemplateRows:s?"repeat("+f+", 1fr)":void 0,...P}),[s,f,P]),$=e.useMemo(()=>p.classNames("k-step-list",{"k-step-list-horizontal":!s,"k-step-list-vertical":s}),[s]),ee=e.useMemo(()=>({gridColumnStart:s?void 0:1,gridColumnEnd:s?void 0:-1,gridRowStart:s?1:void 0,gridRowEnd:s?-1:void 0}),[s]),te=e.useMemo(()=>({gridColumnStart:s?void 0:2,gridColumnEnd:s?void 0:f*2,gridRowStart:s?1:void 0,gridRowEnd:s?f:void 0,top:s?17:void 0}),[s,f]),L=b&&b.map((c,r)=>{const t={index:r,disabled:g||c.disabled,focused:r===U,current:r===a,...c},n=w||oe.Step;return e.createElement(n,{key:r,...t})});return e.createElement(se.StepperContext.Provider,{value:{animationDuration:m,isVertical:s,item:w,linear:y,mode:H,numOfSteps:f,value:a,successIcon:K,successSVGIcon:G,errorIcon:j,errorSVGIcon:_,onChange:J,onFocus:Q}},e.createElement("nav",{className:Y,style:Z,dir:x,role:"navigation",ref:v,onKeyDown:X},e.createElement("ol",{className:$,style:ee},L||I),e.createElement(re.ProgressBar,{style:te,labelPlacement:"start",animation:{duration:W},ariaLabel:B,"aria-hidden":!0,max:f-1,labelVisible:!1,orientation:C,reverse:C==="vertical",value:a,disabled:g,tabIndex:-1})))});O.propTypes={animationDuration:o.oneOfType([o.bool,o.number]),children:o.any,className:o.string,dir:o.string,disabled:o.bool,errorIcon:o.string,errorSVGIcon:p.svgIconPropType,item:o.any,items:o.any,linear:o.bool,mode:o.oneOf(["steps","labels"]),orientation:o.oneOf(["horizontal","vertical"]),style:o.object,successIcon:o.string,successSVGIcon:p.svgIconPropType,value:o.number.isRequired,onChange:o.func,onFocus:o.func};O.displayName="KendoStepper";exports.Stepper=O;