@progress/kendo-react-layout 9.4.0-develop.19 → 9.4.0-develop.2

package/menu/components/MenuItemInternal.mjs

@@ -5,6 +5,7 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
+"use client";
 import * as s from "react";
 import { getActiveElement as a, IconWrap as l, classNames as p } from "@progress/kendo-react-common";
 import { Popup as u } from "@progress/kendo-react-popup";
@@ -12,7 +13,7 @@ import { shouldOpenItem as h, isFirstItemFromSiblings as c } from "../utils/item
 import { getDOMElementId as r, convertBoolDirectionToString as m, getPopupSettings as I } from "../utils/misc.mjs";
 import { MenuItemLink as M } from "./MenuItemLink.mjs";
 import { MenuItemArrow as g } from "./MenuItemArrow.mjs";
-class f extends s.Component {
+class v extends s.Component {
   constructor() {
     super(...arguments), this.onMouseOver = (e) => {
       this.props.onMouseOver(this.props.parentItemId), e.stopPropagation();
@@ -37,7 +38,7 @@ class f extends s.Component {
   }
   renderChildItems() {
     return this.props.items.length > 0 ? this.props.items.map((e, t) => /* @__PURE__ */ s.createElement(
-      v,
+      f,
       {
         item: e,
         isMenuVertical: this.props.isMenuVertical,
@@ -60,7 +61,7 @@ class f extends s.Component {
     )) : null;
   }
 }
-class v extends s.Component {
+class f extends s.Component {
   constructor(e) {
     super(e), this.isFirstRender = !0, this.onMouseOver = (t) => {
       this.props.onMouseOver(this.props.item.id), t.stopPropagation();
@@ -84,15 +85,7 @@ class v extends s.Component {
   }
   render() {
     const e = this.props.item, t = e.id, o = r(this.props.menuGuid, t), n = e.separator;
-    return /* @__PURE__ */ s.createElement(s.Fragment, null, n ? /* @__PURE__ */ s.createElement(
-      "li",
-      {
-        className: "k-separator k-item",
-        "aria-hidden": !0,
-        key: o,
-        ref: (i) => this.itemElement = i
-      }
-    ) : /* @__PURE__ */ s.createElement(
+    return /* @__PURE__ */ s.createElement(s.Fragment, null, n ? /* @__PURE__ */ s.createElement("li", { className: "k-separator k-item", "aria-hidden": !0, key: o, ref: (i) => this.itemElement = i }) : /* @__PURE__ */ s.createElement(
       "li",
       {
         id: r(this.props.menuGuid, t),
@@ -115,7 +108,7 @@ class v extends s.Component {
         key: o
       },
       this.contentRender ? this.renderContent() : this.renderMenuItemLink()
-    ), this.renderPopupIfOpened());
+    ), this.renderPopupIfOpened(this.itemElement));
   }
   renderContent() {
     const e = this.props.item.contentParentItemId;
@@ -136,10 +129,10 @@ class v extends s.Component {
     const t = this.itemRender ? /* @__PURE__ */ s.createElement(this.itemRender, { item: this.props.onOriginalItemNeeded(e.id), itemId: e.id, key: "1" }) : /* @__PURE__ */ s.createElement("span", { className: "k-menu-link-text" }, e.text);
     return /* @__PURE__ */ s.createElement(M, { url: e.url, opened: this.Opened }, this.renderMenuIconIfApplicable(), t, this.renderArrowIfApplicable());
   }
-  renderPopupIfOpened() {
+  renderPopupIfOpened(e) {
     if (this.Opened) {
-      const e = this.props.item.id, { anchorAlign: t, popupAlign: o, collision: n } = I(
-        e,
+      const t = this.props.item.id, { anchorAlign: o, popupAlign: n, collision: i } = I(
+        t,
         this.props.isMenuVertical,
         this.props.isDirectionRightToLeft
       );
@@ -147,18 +140,19 @@ class v extends s.Component {
         u,
         {
           anchor: this.itemElement,
+          appendTo: e,
           show: !0,
           popupClass: this.getPopupClassName(),
-          anchorAlign: t,
-          popupAlign: o,
-          collision: n,
+          anchorAlign: o,
+          popupAlign: n,
+          collision: i,
           animate: !1,
           key: "1"
         },
         /* @__PURE__ */ s.createElement(
-          f,
+          v,
           {
-            parentItemId: e,
+            parentItemId: t,
             items: this.props.item.items,
             menuGuid: this.props.menuGuid,
             focusedItemId: this.props.focusedItemId,
@@ -213,7 +207,7 @@ class v extends s.Component {
     !this.isFirstRender;
   }
   getPopupClassName() {
-    return p("k-menu-popup", { "k-rtl": this.props.isDirectionRightToLeft });
+    return p("k-menu-popup k-overflow-visible", { "k-rtl": this.props.isDirectionRightToLeft });
   }
   getMenuItemClassName(e) {
     return p(
@@ -229,6 +223,6 @@ class v extends s.Component {
   }
 }
 export {
-  v as MenuItemInternal,
-  f as MenuItemInternalsList
+  f as MenuItemInternal,
+  v as MenuItemInternalsList
 };

package/menu/components/MenuItemLink.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 p=require("react"),i=require("prop-types"),l=require("@progress/kendo-react-common");function c(e){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const a=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(s,t,a.get?a:{enumerable:!0,get:()=>e[t]})}}return s.default=e,Object.freeze(s)}const r=c(p),o=class o extends r.Component{render(){return this.props.url?r.createElement("a",{className:this.getMenuItemClassName(),role:"presentation",href:this.props.url,tabIndex:-1},this.props.children):r.createElement("span",{id:this.props.id,className:l.classNames(this.getMenuItemClassName(),this.props.className),style:this.props.style,role:"presentation"},this.props.children)}getMenuItemClassName(){return l.classNames("k-link","k-menu-link",{"k-active":this.props.opened})}};o.propTypes={opened:i.bool,url:i.string};let n=o;exports.MenuItemLink=n;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react"),i=require("prop-types"),l=require("@progress/kendo-react-common");function p(e){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const a=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(s,t,a.get?a:{enumerable:!0,get:()=>e[t]})}}return s.default=e,Object.freeze(s)}const r=p(c),o=class o extends r.Component{render(){return this.props.url?r.createElement("a",{className:this.getMenuItemClassName(),role:"presentation",href:this.props.url,tabIndex:-1},this.props.children):r.createElement("span",{id:this.props.id,className:l.classNames(this.getMenuItemClassName(),this.props.className),style:this.props.style,role:"presentation"},this.props.children)}getMenuItemClassName(){return l.classNames("k-link","k-menu-link",{"k-active":this.props.opened})}};o.propTypes={opened:i.bool,url:i.string};let n=o;exports.MenuItemLink=n;

package/menu/components/MenuItemLink.mjs

@@ -5,6 +5,7 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
+"use client";
 import * as e from "react";
 import t from "prop-types";
 import { classNames as r } from "@progress/kendo-react-common";

package/menu/consts.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 o={vertical:"top",horizontal:"left"},t={vertical:"top",horizontal:"right"},i={vertical:"flip",horizontal:"fit"},l={vertical:"fit",horizontal:"flip"},n={downward:{anchorAlign:{vertical:"bottom",horizontal:"right"},popupAlign:t,collision:i},leftward:{anchorAlign:{vertical:"top",horizontal:"left"},popupAlign:t,collision:l}},r={downward:{anchorAlign:{vertical:"bottom",horizontal:"left"},popupAlign:o,collision:i},rightward:{anchorAlign:{vertical:"top",horizontal:"right"},popupAlign:o,collision:l}};exports.POPUP_SETTINGS=r;exports.POPUP_SETTINGS_RTL=n;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o={vertical:"top",horizontal:"left"},t={vertical:"top",horizontal:"right"},i={vertical:"flip",horizontal:"fit"},l={vertical:"fit",horizontal:"flip"},n={downward:{anchorAlign:{vertical:"bottom",horizontal:"right"},popupAlign:t,collision:i},leftward:{anchorAlign:{vertical:"top",horizontal:"left"},popupAlign:t,collision:l}},r={downward:{anchorAlign:{vertical:"bottom",horizontal:"left"},popupAlign:o,collision:i},rightward:{anchorAlign:{vertical:"top",horizontal:"right"},popupAlign:o,collision:l}};exports.POPUP_SETTINGS=r;exports.POPUP_SETTINGS_RTL=n;

package/menu/consts.mjs

@@ -5,6 +5,7 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
+"use client";
 const o = {
   vertical: "top",
   horizontal: "left"

package/menu/utils/DirectionHolder.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"});class e{constructor(){this.phase="Initialized"}getIsDirectionRightToLeft(){return this.isDirectionRightToLeft}setIsDirectionRightToLeft(i){this.phase=this.phase==="NotInitialized"?"Initialized":"NewValueReceived",this.previousIsDirectionRightToLeft=this.isDirectionRightToLeft,this.isDirectionRightToLeft=i}hasDirectionChanged(){return this.phase==="NewValueReceived"?this.previousIsDirectionRightToLeft!==this.isDirectionRightToLeft:!1}}exports.DirectionHolder=e;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});class e{constructor(){this.phase="Initialized"}getIsDirectionRightToLeft(){return this.isDirectionRightToLeft}setIsDirectionRightToLeft(i){this.phase=this.phase==="NotInitialized"?"Initialized":"NewValueReceived",this.previousIsDirectionRightToLeft=this.isDirectionRightToLeft,this.isDirectionRightToLeft=i}hasDirectionChanged(){return this.phase==="NewValueReceived"?this.previousIsDirectionRightToLeft!==this.isDirectionRightToLeft:!1}}exports.DirectionHolder=e;

package/menu/utils/DirectionHolder.mjs

@@ -5,6 +5,7 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
+"use client";
 class e {
   constructor() {
     this.phase = "Initialized";

package/menu/utils/MouseOverHandler.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"});class i{constructor(e,s,t){this.openOnClick=e,this.resetMenu=s,this.openItem=t,this.mouseDown=!1,this.openOnClick=e,this.isMouseOverEnabled=!e}set OpenOnClick(e){!!e!=!!this.openOnClick&&(this.mouseDown=!1,this.isMouseOverEnabled=!e),this.openOnClick=e}handleItemSelectedViaKeyboard(){this.openOnClick&&(this.isMouseOverEnabled=!1,this.resetMenu())}get IsMouseOverEnabled(){return this.isMouseOverEnabled}handleItemMouseDown(){this.mouseDown=!0}handleItemFocus(){this.openOnClick&&!this.mouseDown&&(this.isMouseOverEnabled=!0),this.mouseDown=!1}handleItemClick(e,s){this.openOnClick&&(this.isMouseOverEnabled?s&&(this.isMouseOverEnabled=!1,this.resetMenu()):(this.isMouseOverEnabled=!0,this.openItem(e)))}}exports.MouseOverHandler=i;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});class i{constructor(e,s,t){this.openOnClick=e,this.resetMenu=s,this.openItem=t,this.mouseDown=!1,this.openOnClick=e,this.isMouseOverEnabled=!e}set OpenOnClick(e){!!e!=!!this.openOnClick&&(this.mouseDown=!1,this.isMouseOverEnabled=!e),this.openOnClick=e}handleItemSelectedViaKeyboard(){this.openOnClick&&(this.isMouseOverEnabled=!1,this.resetMenu())}get IsMouseOverEnabled(){return this.isMouseOverEnabled}handleItemMouseDown(){this.mouseDown=!0}handleItemFocus(){this.openOnClick&&!this.mouseDown&&(this.isMouseOverEnabled=!0),this.mouseDown=!1}handleItemClick(e,s){this.openOnClick&&(this.isMouseOverEnabled?s&&(this.isMouseOverEnabled=!1,this.resetMenu()):(this.isMouseOverEnabled=!0,this.openItem(e)))}}exports.MouseOverHandler=i;

package/menu/utils/MouseOverHandler.mjs

@@ -5,6 +5,7 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
+"use client";
 class n {
   constructor(e, s, i) {
     this.openOnClick = e, this.resetMenu = s, this.openItem = i, this.mouseDown = !1, this.openOnClick = e, this.isMouseOverEnabled = !e;

package/menu/utils/getNewItemIdUponKeyboardNavigation.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 i=require("@progress/kendo-react-common"),n=require("./itemsIdsUtils.js"),A=/\S/;function M(u,e,P,y,l,d){const Z=g();switch(P){case i.Keys.left:return E();case i.Keys.right:return w();case i.Keys.up:return O();case i.Keys.down:return N();case i.Keys.enter:case i.Keys.space:return R();case i.Keys.home:return D();case i.Keys.end:return G();case i.Keys.esc:return H();default:return q()?B():e}function E(){return l?d?v():S():d?p():b()}function w(){return l?d?S():v():d?b():p()}function N(){return l?a():n.isIdZeroLevel(e)?s():a()}function O(){return l?c():n.isIdZeroLevel(e)?L():c()}function R(){return Z.disabled?e:f()?n.getFirstChildId(e):n.getRootParentId(e)}function D(){return K()[0].id}function G(){const t=K();return t[t.length-1].id}function H(){return n.isIdZeroLevel(e)?e:n.getDirectParentId(e)}function B(){const t=y.toLowerCase(),r=K(),o=Number(n.getShortId(e)),h=r.slice(o+1).concat(r.slice(0,o+1)).find(z=>(z.text||"").toLowerCase().startsWith(t));return h?h.id:e}function b(){return n.isIdZeroLevel(e)?c():n.isIdFirstLevel(e)?s(c(n.getRootParentId(e))):n.getDirectParentId(e)}function S(){return n.isIdZeroLevel(e)?L():n.getDirectParentId(e)}function p(){return n.isIdZeroLevel(e)?a():s(f()?e:a(n.getRootParentId(e)))}function v(){return s(n.isIdZeroLevel(e)||f()?e:a(n.getRootParentId(e)))}function s(t){return U(!0,t)}function L(t){return U(!1,t)}function q(){return y.length===1&&A.test(y)}function g(t,r){return t===void 0&&(t=e),r===void 0&&(r=u),n.getItemById(t,r)}function f(t){return g(t).items.length>0}function c(t){return C(!1,t)}function a(t){return C(!0,t)}function x(t){const r=g(t).items;return r[r.length-1].id}function K(){return n.isIdZeroLevel(e)?u:g(n.getDirectParentId(e),u).items}function U(t,r){r===void 0&&(r=e);const o=g(r);return f(r)&&!o.disabled?t?n.getFirstChildId(r):x(r):r}function C(t,r){if(r===void 0&&(r=e),n.isIdZeroLevel(r))return n.getDirectSiblingIdForLevelZero(t,r,u.length);const o=n.getDirectParentId(r),F=n.getShortId(r),h=g(o).items.length;return n.createId(n.getDirectSiblingIdForLevelZero(t,F,h),o)}}exports.getNewItemIdUponKeyboardNavigation=M;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("@progress/kendo-react-common"),n=require("./itemsIdsUtils.js"),A=/\S/;function M(u,e,P,y,l,d){const Z=g();switch(P){case i.Keys.left:return E();case i.Keys.right:return w();case i.Keys.up:return O();case i.Keys.down:return N();case i.Keys.enter:case i.Keys.space:return R();case i.Keys.home:return D();case i.Keys.end:return G();case i.Keys.esc:return H();default:return q()?B():e}function E(){return l?d?v():S():d?p():b()}function w(){return l?d?S():v():d?b():p()}function N(){return l?a():n.isIdZeroLevel(e)?s():a()}function O(){return l?c():n.isIdZeroLevel(e)?L():c()}function R(){return Z.disabled?e:f()?n.getFirstChildId(e):n.getRootParentId(e)}function D(){return K()[0].id}function G(){const t=K();return t[t.length-1].id}function H(){return n.isIdZeroLevel(e)?e:n.getDirectParentId(e)}function B(){const t=y.toLowerCase(),r=K(),o=Number(n.getShortId(e)),h=r.slice(o+1).concat(r.slice(0,o+1)).find(z=>(z.text||"").toLowerCase().startsWith(t));return h?h.id:e}function b(){return n.isIdZeroLevel(e)?c():n.isIdFirstLevel(e)?s(c(n.getRootParentId(e))):n.getDirectParentId(e)}function S(){return n.isIdZeroLevel(e)?L():n.getDirectParentId(e)}function p(){return n.isIdZeroLevel(e)?a():s(f()?e:a(n.getRootParentId(e)))}function v(){return s(n.isIdZeroLevel(e)||f()?e:a(n.getRootParentId(e)))}function s(t){return U(!0,t)}function L(t){return U(!1,t)}function q(){return y.length===1&&A.test(y)}function g(t,r){return t===void 0&&(t=e),r===void 0&&(r=u),n.getItemById(t,r)}function f(t){return g(t).items.length>0}function c(t){return C(!1,t)}function a(t){return C(!0,t)}function x(t){const r=g(t).items;return r[r.length-1].id}function K(){return n.isIdZeroLevel(e)?u:g(n.getDirectParentId(e),u).items}function U(t,r){r===void 0&&(r=e);const o=g(r);return f(r)&&!o.disabled?t?n.getFirstChildId(r):x(r):r}function C(t,r){if(r===void 0&&(r=e),n.isIdZeroLevel(r))return n.getDirectSiblingIdForLevelZero(t,r,u.length);const o=n.getDirectParentId(r),F=n.getShortId(r),h=g(o).items.length;return n.createId(n.getDirectSiblingIdForLevelZero(t,F,h),o)}}exports.getNewItemIdUponKeyboardNavigation=M;

package/menu/utils/getNewItemIdUponKeyboardNavigation.mjs

@@ -5,6 +5,7 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
+"use client";
 import { Keys as e } from "@progress/kendo-react-common";
 import { isIdZeroLevel as i, getFirstChildId as N, getRootParentId as b, getDirectParentId as a, getShortId as O, isIdFirstLevel as q, getItemById as D, getDirectSiblingIdForLevelZero as P, createId as J } from "./itemsIdsUtils.mjs";
 const Q = /\S/;

package/menu/utils/hoverDelay.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"});function o(e){return e.hoverOpenDelay!==void 0?e.hoverOpenDelay:e.openOnClick?0:100}function l(e){return e.hoverCloseDelay!==void 0?e.hoverCloseDelay:100}exports.getHoverCloseDelay=l;exports.getHoverOpenDelay=o;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function o(e){return e.hoverOpenDelay!==void 0?e.hoverOpenDelay:e.openOnClick?0:100}function l(e){return e.hoverCloseDelay!==void 0?e.hoverCloseDelay:100}exports.getHoverCloseDelay=l;exports.getHoverOpenDelay=o;

package/menu/utils/hoverDelay.mjs

@@ -5,6 +5,7 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
+"use client";
 function n(e) {
   return e.hoverOpenDelay !== void 0 ? e.hoverOpenDelay : e.openOnClick ? 0 : 100;
 }

package/menu/utils/itemsIdsUtils.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 o="",s="0",e="_";function c(t,r){if(u(t))return r[Number(t)];const n=r[Number(g(t))];return n.items?c(f(t),n.items):void 0}function g(t){return i(t)?t:t.split(e)[0]}function f(t){if(i(t))return t;const r=t.indexOf(e);return t.substring(r+1)}function S(t){return l("0",t)}function E(t,r){return r.indexOf(t)===0?r.length===t.length||r.charAt(t.length)===e:!1}function l(t,r){return r?r+e+t:t}function O(t){const r=t.lastIndexOf(e);return r<0?o:t.substring(0,r)}function i(t){return t===o||t.indexOf(e)<0}function u(t){return t!==o&&t.indexOf(e)<0}function b(t){return P(t)===1}function d(t){return a(t)===s}function a(t){const r=t.lastIndexOf(e);return r<0?t:t.substring(r+1)}function L(t,r,n){return u(r)?t?Number(r)<n-1?(Number(r)+1).toString():"0":Number(r)>0?(Number(r)-1).toString():(n-1).toString():r}function P(t){return t.split(e).length-1}exports.EMPTY_ID=o;exports.SEPARATOR=e;exports.ZERO_LEVEL_ZERO_ITEM_ID=s;exports.createId=l;exports.getDirectParentId=O;exports.getDirectSiblingIdForLevelZero=L;exports.getFirstChildId=S;exports.getIdWithoutRootParentId=f;exports.getItemById=c;exports.getRootParentId=g;exports.getShortId=a;exports.isFirstItemFromSiblings=d;exports.isIdEmptyOrZeroLevel=i;exports.isIdFirstLevel=b;exports.isIdZeroLevel=u;exports.shouldOpenItem=E;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o="",s="0",e="_";function c(t,r){if(u(t))return r[Number(t)];const n=r[Number(g(t))];return n.items?c(f(t),n.items):void 0}function g(t){return i(t)?t:t.split(e)[0]}function f(t){if(i(t))return t;const r=t.indexOf(e);return t.substring(r+1)}function S(t){return l("0",t)}function E(t,r){return r.indexOf(t)===0?r.length===t.length||r.charAt(t.length)===e:!1}function l(t,r){return r?r+e+t:t}function O(t){const r=t.lastIndexOf(e);return r<0?o:t.substring(0,r)}function i(t){return t===o||t.indexOf(e)<0}function u(t){return t!==o&&t.indexOf(e)<0}function b(t){return P(t)===1}function d(t){return a(t)===s}function a(t){const r=t.lastIndexOf(e);return r<0?t:t.substring(r+1)}function L(t,r,n){return u(r)?t?Number(r)<n-1?(Number(r)+1).toString():"0":Number(r)>0?(Number(r)-1).toString():(n-1).toString():r}function P(t){return t.split(e).length-1}exports.EMPTY_ID=o;exports.SEPARATOR=e;exports.ZERO_LEVEL_ZERO_ITEM_ID=s;exports.createId=l;exports.getDirectParentId=O;exports.getDirectSiblingIdForLevelZero=L;exports.getFirstChildId=S;exports.getIdWithoutRootParentId=f;exports.getItemById=c;exports.getRootParentId=g;exports.getShortId=a;exports.isFirstItemFromSiblings=d;exports.isIdEmptyOrZeroLevel=i;exports.isIdFirstLevel=b;exports.isIdZeroLevel=u;exports.shouldOpenItem=E;

package/menu/utils/itemsIdsUtils.mjs

@@ -5,6 +5,7 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
+"use client";
 const u = "", c = "0", t = "_";
 function f(n, r) {
   if (i(n))

package/menu/utils/misc.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("../consts.js"),d=require("./itemsIdsUtils.js");function u(r,t,e){const o=i(r,t,e);return e?o==="downward"?n.POPUP_SETTINGS_RTL.downward:n.POPUP_SETTINGS_RTL.leftward:o==="downward"?n.POPUP_SETTINGS.downward:n.POPUP_SETTINGS.rightward}function i(r,t,e){return d.isIdZeroLevel(r)?t?e?"leftward":"rightward":"downward":e?"leftward":"rightward"}function P(r){return r?"rtl":"ltr"}function l(r,t){return`${r}_${t}`}exports.convertBoolDirectionToString=P;exports.getChildrenPosition=i;exports.getDOMElementId=l;exports.getPopupSettings=u;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("../consts.js"),d=require("./itemsIdsUtils.js");function u(t,r,e){const o=i(t,r,e);return e?o==="downward"?n.POPUP_SETTINGS_RTL.downward:n.POPUP_SETTINGS_RTL.leftward:o==="downward"?n.POPUP_SETTINGS.downward:n.POPUP_SETTINGS.rightward}function i(t,r,e){return d.isIdZeroLevel(t)?r?e?"leftward":"rightward":"downward":e?"leftward":"rightward"}function l(t){return t?"rtl":"ltr"}function P(t,r){return`${t}_${r}`}exports.convertBoolDirectionToString=l;exports.getChildrenPosition=i;exports.getDOMElementId=P;exports.getPopupSettings=u;

package/menu/utils/misc.mjs

@@ -5,24 +5,25 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import { POPUP_SETTINGS_RTL as d, POPUP_SETTINGS as e } from "../consts.mjs";
-import { isIdZeroLevel as w } from "./itemsIdsUtils.mjs";
-function f(r, n, t) {
-  const o = i(r, n, t);
-  return t ? o === "downward" ? d.downward : d.leftward : o === "downward" ? e.downward : e.rightward;
+"use client";
+import { POPUP_SETTINGS_RTL as o, POPUP_SETTINGS as d } from "../consts.mjs";
+import { isIdZeroLevel as i } from "./itemsIdsUtils.mjs";
+function l(r, n, t) {
+  const e = w(r, n, t);
+  return t ? e === "downward" ? o.downward : o.leftward : e === "downward" ? d.downward : d.rightward;
 }
-function i(r, n, t) {
-  return w(r) ? n ? t ? "leftward" : "rightward" : "downward" : t ? "leftward" : "rightward";
+function w(r, n, t) {
+  return i(r) ? n ? t ? "leftward" : "rightward" : "downward" : t ? "leftward" : "rightward";
 }
-function l(r) {
+function f(r) {
   return r ? "rtl" : "ltr";
 }
 function P(r, n) {
   return `${r}_${n}`;
 }
 export {
-  l as convertBoolDirectionToString,
-  i as getChildrenPosition,
+  f as convertBoolDirectionToString,
+  w as getChildrenPosition,
   P as getDOMElementId,
-  f as getPopupSettings
+  l as getPopupSettings
 };

package/menu/utils/prepareInputItemsForInternalWork.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 y=require("react"),s=require("./itemsIdsUtils.js"),R=require("../components/MenuItem.js");function O(t){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const e in t)if(e!=="default"){const r=Object.getOwnPropertyDescriptor(t,e);Object.defineProperty(n,e,r.get?r:{enumerable:!0,get:()=>t[e]})}}return n.default=t,Object.freeze(n)}const S=O(y);function C(t,n){if(t&&t.length>0)return{items:u(t),inputItems:t};if(c(n).length>0){const e=h(c(n));return{items:u(e),inputItems:e}}return{items:[],inputItems:[]}}function b(t,n){const e={},{text:r,url:o,icon:i,svgIcon:a,disabled:d,cssClass:l,cssStyle:f,render:p,linkRender:I,contentRender:m,data:g,separator:v}=t||n.props;return r!==void 0&&(e.text=r),o!==void 0&&(e.url=o),i!==void 0&&(e.icon=i),a!==void 0&&(e.svgIcon=a),d!==void 0&&(e.disabled=d),l!==void 0&&(e.cssClass=l),f!==void 0&&(e.cssStyle=f),p!==void 0&&(e.render=p),I!==void 0&&(e.linkRender=I),m!==void 0&&(e.contentRender=m),g!==void 0&&(e.data=g),v!==void 0&&(e.separator=v),e}function c(t){return S.Children.toArray(t).filter(n=>n&&n.type===R.MenuItem)}function h(t){const n=[];for(let e=0;e<t.length;e++){const r=t[e],o=b(void 0,r),i=h(c(r.props.children));i.length>0&&(o.items=i),n.push(o)}return n}function u(t,n){const e=[];for(let r=0;r<t.length;r++){const o=t[r],i=b(o);i.id=s.createId(r.toString(),n),i.isLastFromSiblings=r===t.length-1,i.separator=o.separator===!0,i.items=_(o,i),e.push(i)}return e}function _(t,n){return t.contentRender?[{contentParentItemId:n.id,id:s.createId(s.ZERO_LEVEL_ZERO_ITEM_ID,n.id),isLastFromSiblings:!0,separator:!1,contentRender:t.contentRender,items:[]}]:t.items?u(t.items,n.id):[]}exports.prepareInputItemsForInternalWork=C;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const y=require("react"),s=require("./itemsIdsUtils.js"),R=require("../components/MenuItem.js");function O(t){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const e in t)if(e!=="default"){const r=Object.getOwnPropertyDescriptor(t,e);Object.defineProperty(n,e,r.get?r:{enumerable:!0,get:()=>t[e]})}}return n.default=t,Object.freeze(n)}const S=O(y);function C(t,n){if(t&&t.length>0)return{items:u(t),inputItems:t};if(c(n).length>0){const e=h(c(n));return{items:u(e),inputItems:e}}return{items:[],inputItems:[]}}function b(t,n){const e={},{text:r,url:o,icon:i,svgIcon:a,disabled:d,cssClass:l,cssStyle:f,render:p,linkRender:I,contentRender:m,data:g,separator:v}=t||n.props;return r!==void 0&&(e.text=r),o!==void 0&&(e.url=o),i!==void 0&&(e.icon=i),a!==void 0&&(e.svgIcon=a),d!==void 0&&(e.disabled=d),l!==void 0&&(e.cssClass=l),f!==void 0&&(e.cssStyle=f),p!==void 0&&(e.render=p),I!==void 0&&(e.linkRender=I),m!==void 0&&(e.contentRender=m),g!==void 0&&(e.data=g),v!==void 0&&(e.separator=v),e}function c(t){return S.Children.toArray(t).filter(n=>n&&n.type===R.MenuItem)}function h(t){const n=[];for(let e=0;e<t.length;e++){const r=t[e],o=b(void 0,r),i=h(c(r.props.children));i.length>0&&(o.items=i),n.push(o)}return n}function u(t,n){const e=[];for(let r=0;r<t.length;r++){const o=t[r],i=b(o);i.id=s.createId(r.toString(),n),i.isLastFromSiblings=r===t.length-1,i.separator=o.separator===!0,i.items=_(o,i),e.push(i)}return e}function _(t,n){return t.contentRender?[{contentParentItemId:n.id,id:s.createId(s.ZERO_LEVEL_ZERO_ITEM_ID,n.id),isLastFromSiblings:!0,separator:!1,contentRender:t.contentRender,items:[]}]:t.items?u(t.items,n.id):[]}exports.prepareInputItemsForInternalWork=C;

package/menu/utils/prepareInputItemsForInternalWork.mjs

@@ -5,6 +5,7 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
+"use client";
 import * as C from "react";
 import { createId as g, ZERO_LEVEL_ZERO_ITEM_ID as y } from "./itemsIdsUtils.mjs";
 import { MenuItem as x } from "../components/MenuItem.mjs";
@@ -28,14 +29,14 @@ function h(e, n) {
     svgIcon: d,
     disabled: u,
     cssClass: f,
-    cssStyle: a,
-    render: l,
+    cssStyle: l,
+    render: a,
     linkRender: p,
     contentRender: m,
     data: I,
     separator: v
   } = e || n.props;
-  return i !== void 0 && (t.text = i), o !== void 0 && (t.url = o), r !== void 0 && (t.icon = r), d !== void 0 && (t.svgIcon = d), u !== void 0 && (t.disabled = u), f !== void 0 && (t.cssClass = f), a !== void 0 && (t.cssStyle = a), l !== void 0 && (t.render = l), p !== void 0 && (t.linkRender = p), m !== void 0 && (t.contentRender = m), I !== void 0 && (t.data = I), v !== void 0 && (t.separator = v), t;
+  return i !== void 0 && (t.text = i), o !== void 0 && (t.url = o), r !== void 0 && (t.icon = r), d !== void 0 && (t.svgIcon = d), u !== void 0 && (t.disabled = u), f !== void 0 && (t.cssClass = f), l !== void 0 && (t.cssStyle = l), a !== void 0 && (t.render = a), p !== void 0 && (t.linkRender = p), m !== void 0 && (t.contentRender = m), I !== void 0 && (t.data = I), v !== void 0 && (t.separator = v), t;
 }
 function s(e) {
   return C.Children.toArray(e).filter((n) => n && n.type === x);

package/package-metadata.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 e={name:"@progress/kendo-react-layout",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate: 1738841832,version:"9.4.0-develop.19",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"};exports.packageMetadata=e;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={name:"@progress/kendo-react-layout",productName:"KendoReact",productCode:"KENDOUIREACT",productCodes:["KENDOUIREACT"],publishDate: 1737713745,version:"9.4.0-develop.2",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"};exports.packageMetadata=e;

package/package-metadata.mjs

@@ -5,13 +5,14 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
+"use client";
 const e = {
   name: "@progress/kendo-react-layout",
   productName: "KendoReact",
   productCode: "KENDOUIREACT",
   productCodes: ["KENDOUIREACT"],
-  publishDate: 1738841832,
-  version: "9.4.0-develop.19",
+  publishDate: 1737713745,
+  version: "9.4.0-develop.2",
   licensingDocsUrl: "https://www.telerik.com/kendo-react-ui/components/my-license/"
 };
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-react-layout",
-  "version": "9.4.0-develop.19",
+  "version": "9.4.0-develop.2",
   "description": "React Layout components enable you to create a perceptive and intuitive layout of web projects. KendoReact Layout package",
   "author": "Progress",
   "license": "SEE LICENSE IN LICENSE.md",
@@ -26,11 +26,11 @@
   "sideEffects": false,
   "peerDependencies": {
     "@progress/kendo-licensing": "^1.3.4",
-    "@progress/kendo-react-animation": "9.4.0-develop.19",
-    "@progress/kendo-react-common": "9.4.0-develop.19",
-    "@progress/kendo-react-intl": "9.4.0-develop.19",
-    "@progress/kendo-react-popup": "9.4.0-develop.19",
-    "@progress/kendo-react-progressbars": "9.4.0-develop.19",
+    "@progress/kendo-react-animation": "9.4.0-develop.2",
+    "@progress/kendo-react-common": "9.4.0-develop.2",
+    "@progress/kendo-react-intl": "9.4.0-develop.2",
+    "@progress/kendo-react-popup": "9.4.0-develop.2",
+    "@progress/kendo-react-progressbars": "9.4.0-develop.2",
     "@progress/kendo-svg-icons": "^4.0.0",
     "react": "^16.8.2 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc",
     "react-dom": "^16.8.2 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc"
@@ -60,7 +60,7 @@
     "package": {
       "productName": "KendoReact",
       "productCode": "KENDOUIREACT",
-      "publishDate": 1738841832,
+      "publishDate": 1737713745,
       "licensingDocsUrl": "https://www.telerik.com/kendo-react-ui/components/my-license/"
     }
   },

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 b=require("react"),l=require("prop-types"),v=require("./PanelBarItem.js"),p=require("./util.js"),o=require("@progress/kendo-react-common"),k=require("../package-metadata.js"),a=require("./interfaces/NavigationAction.js");function P(d){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(d){for(const r in d)if(r!=="default"){const e=Object.getOwnPropertyDescriptor(d,r);Object.defineProperty(n,r,e.get?e:{enumerable:!0,get:()=>d[r]})}}return n.default=d,Object.freeze(n)}const u=P(b),g=class g extends u.Component{constructor(n){super(n),this._element=null,this.showLicenseWatermark=!1,this.handleSelect=e=>{this.onSelect(e),this.onFocus(e)},this.onSelect=e=>{const c=p.flatChildren(u.Children.toArray(this.children));let i,s;switch(c.forEach(t=>{t.props.uniquePrivateKey===(e.uniquePrivateKey||this.state.focused)&&(i=t)}),this.expandMode){case"single":s=[...i.props.parentUniquePrivateKey,i.props.uniquePrivateKey],p.isArrayEqual(this.expandedItems,s)&&(i.props.parentUniquePrivateKey?s=[...i.props.parentUniquePrivateKey]:s=[]);break;case"multiple":{s=this.expandedItems.slice();const t=s.indexOf(i.props.uniquePrivateKey);t===-1?s.push(i.props.uniquePrivateKey):s.splice(t,1);break}default:s=this.expandedItems.slice();break}this.setState({selected:i.props.uniquePrivateKey,expanded:s}),this.props.onSelect&&this.props.onSelect.call(void 0,{target:i,expandedItems:s})},this.onFocus=(e,c=0,i)=>{const s=p.flatVisibleChildren(u.Children.toArray(this.children)),t=p.getFocusedChild(s,c,e,this.state.focused,i);if(t){const h=this.expandedItems.slice();if(i===a.NavigationAction.Right&&t&&t.props&&t.props.children&&t.props.children.length>0){if(h.push(t.props.uniquePrivateKey),this.setState({expanded:[...new Set(h)]}),t.props.expanded){const f=t.props.children[0].props.uniquePrivateKey;this.setState({focused:f})}}else if(i===a.NavigationAction.Left&&(t&&t.props&&t.props.parentUniquePrivateKey&&t.props.parentUniquePrivateKey.length>0||t&&t.props&&!t.props.disabled&&t.props.children&&t.props.children.length>0)){const f=t.props.parentUniquePrivateKey;if(t.props.expanded){const m=t.props.uniquePrivateKey,x=h.indexOf(m);h.splice(x,1),this.setState({expanded:h})}else if(t.props.level>0){const m=t.props.parentUniquePrivateKey[f.length-1];this.setState({focused:m})}}else this.activeDescendant=t.props.id,this.setState({focused:t.props.uniquePrivateKey})}},this.onNavigate=(e,c)=>{let i;switch(c){case a.NavigationAction.First:this.onFocus(e,i,a.NavigationAction.First);break;case a.NavigationAction.Last:this.onFocus(e,i,a.NavigationAction.Last);break;case a.NavigationAction.Left:this.onFocus(e,i,a.NavigationAction.Left);break;case a.NavigationAction.Right:this.onFocus(e,i,a.NavigationAction.Right);break;case a.NavigationAction.Previous:i=-1,this.onFocus(e,i);break;case a.NavigationAction.Next:i=1,this.onFocus(e,i);break;case a.NavigationAction.Toggle:this.onSelect(e);break}},this.handleWrapperFocus=()=>{clearTimeout(this.nextTickId),this.state.wrapperFocused||this.setState({wrapperFocused:!0})},this.handleWrapperBlur=()=>{this.nextTick(()=>{this.setState({wrapperFocused:!1})})},this.handleKeyDown=e=>{const c=this._element&&getComputedStyle(this._element).direction==="rtl"||!1;if(e.target===e.currentTarget){const i=e.keyCode;let s;switch(i){case o.Keys.left:s=c?a.NavigationAction.Right:a.NavigationAction.Left;break;case o.Keys.up:s=a.NavigationAction.Previous;break;case o.Keys.right:s=c?a.NavigationAction.Left:a.NavigationAction.Right;break;case o.Keys.down:s=a.NavigationAction.Next;break;case o.Keys.home:s=a.NavigationAction.First;break;case o.Keys.end:s=a.NavigationAction.Last;break;case o.Keys.space:case o.Keys.enter:s=a.NavigationAction.Toggle;break;default:s=null;break}s!==null&&(e.preventDefault(),this.onNavigate(e,s))}},o.validatePackage(k.packageMetadata),this.showLicenseWatermark=o.shouldShowValidationUI(k.packageMetadata);const r=p.getInitialState(n,this.expandMode);r.focused||(r.focused=p.getFirstId(n)),this.state=r}get expandMode(){return this.props.expandMode||"multiple"}get selectedItem(){const{selected:n=this.state.selected}=this.props;return n}get expandedItems(){return this.props.isControlled?this.props.expanded||[]:this.state.expanded}get children(){const n={...this.state,selected:this.selectedItem},r={animation:this.props.animation,keepItemsMounted:this.props.keepItemsMounted,state:n,expanded:this.expandedItems,handleSelect:this.handleSelect,children:this.props.children};return p.renderChildren(r)}render(){const n={"aria-activedescendant":this.activeDescendant},r=o.classNames("k-panelbar",this.props.className);return u.createElement("ul",{ref:e=>{this._element=e},dir:this.props.dir,role:"tree",tabIndex:0,onKeyDown:this.handleKeyDown,onFocus:this.handleWrapperFocus,onBlur:this.handleWrapperBlur,className:r,style:this.props.style,...n},this.children,this.showLicenseWatermark&&u.createElement(o.WatermarkOverlay,null))}nextTick(n){this.nextTickId=window.setTimeout(()=>n())}};g.propTypes={animation:l.bool,children:function(n,r){const e=n[r];if(e){if(Array.isArray(e)){for(const c of e)if(!c.type||c.type!==v.PanelBarItem)return new Error("PanelBar children should be either PanelBarItem or Array of PanelBarItem.")}else if(e.type!==v.PanelBarItem)return new Error("PanelBar child should be either PanelBarItem or Array of PanelBarItem.");return null}return null},dir:l.string,selected:l.string,expanded:l.arrayOf(l.string),focused:l.string,expandMode:l.oneOf(["single","multiple"]),className:l.string,keepItemsMounted:l.bool,onSelect:l.func,style:l.object},g.defaultProps={expandMode:"multiple",animation:!0,keepItemsMounted:!1};let y=g;exports.PanelBar=y;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("react"),l=require("prop-types"),v=require("./PanelBarItem.js"),p=require("./util.js"),o=require("@progress/kendo-react-common"),k=require("../package-metadata.js"),a=require("./interfaces/NavigationAction.js");function P(d){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(d){for(const r in d)if(r!=="default"){const e=Object.getOwnPropertyDescriptor(d,r);Object.defineProperty(n,r,e.get?e:{enumerable:!0,get:()=>d[r]})}}return n.default=d,Object.freeze(n)}const u=P(b),g=class g extends u.Component{constructor(n){super(n),this._element=null,this.showLicenseWatermark=!1,this.handleSelect=e=>{this.onSelect(e),this.onFocus(e)},this.onSelect=e=>{const c=p.flatChildren(u.Children.toArray(this.children));let i,s;switch(c.forEach(t=>{t.props.uniquePrivateKey===(e.uniquePrivateKey||this.state.focused)&&(i=t)}),this.expandMode){case"single":s=[...i.props.parentUniquePrivateKey,i.props.uniquePrivateKey],p.isArrayEqual(this.expandedItems,s)&&(i.props.parentUniquePrivateKey?s=[...i.props.parentUniquePrivateKey]:s=[]);break;case"multiple":{s=this.expandedItems.slice();const t=s.indexOf(i.props.uniquePrivateKey);t===-1?s.push(i.props.uniquePrivateKey):s.splice(t,1);break}default:s=this.expandedItems.slice();break}this.setState({selected:i.props.uniquePrivateKey,expanded:s}),this.props.onSelect&&this.props.onSelect.call(void 0,{target:i,expandedItems:s})},this.onFocus=(e,c=0,i)=>{const s=p.flatVisibleChildren(u.Children.toArray(this.children)),t=p.getFocusedChild(s,c,e,this.state.focused,i);if(t){const h=this.expandedItems.slice();if(i===a.NavigationAction.Right&&t&&t.props&&t.props.children&&t.props.children.length>0){if(h.push(t.props.uniquePrivateKey),this.setState({expanded:[...new Set(h)]}),t.props.expanded){const f=t.props.children[0].props.uniquePrivateKey;this.setState({focused:f})}}else if(i===a.NavigationAction.Left&&(t&&t.props&&t.props.parentUniquePrivateKey&&t.props.parentUniquePrivateKey.length>0||t&&t.props&&!t.props.disabled&&t.props.children&&t.props.children.length>0)){const f=t.props.parentUniquePrivateKey;if(t.props.expanded){const m=t.props.uniquePrivateKey,x=h.indexOf(m);h.splice(x,1),this.setState({expanded:h})}else if(t.props.level>0){const m=t.props.parentUniquePrivateKey[f.length-1];this.setState({focused:m})}}else this.activeDescendant=t.props.id,this.setState({focused:t.props.uniquePrivateKey})}},this.onNavigate=(e,c)=>{let i;switch(c){case a.NavigationAction.First:this.onFocus(e,i,a.NavigationAction.First);break;case a.NavigationAction.Last:this.onFocus(e,i,a.NavigationAction.Last);break;case a.NavigationAction.Left:this.onFocus(e,i,a.NavigationAction.Left);break;case a.NavigationAction.Right:this.onFocus(e,i,a.NavigationAction.Right);break;case a.NavigationAction.Previous:i=-1,this.onFocus(e,i);break;case a.NavigationAction.Next:i=1,this.onFocus(e,i);break;case a.NavigationAction.Toggle:this.onSelect(e);break}},this.handleWrapperFocus=()=>{clearTimeout(this.nextTickId),this.state.wrapperFocused||this.setState({wrapperFocused:!0})},this.handleWrapperBlur=()=>{this.nextTick(()=>{this.setState({wrapperFocused:!1})})},this.handleKeyDown=e=>{const c=this._element&&getComputedStyle(this._element).direction==="rtl"||!1;if(e.target===e.currentTarget){const i=e.keyCode;let s;switch(i){case o.Keys.left:s=c?a.NavigationAction.Right:a.NavigationAction.Left;break;case o.Keys.up:s=a.NavigationAction.Previous;break;case o.Keys.right:s=c?a.NavigationAction.Left:a.NavigationAction.Right;break;case o.Keys.down:s=a.NavigationAction.Next;break;case o.Keys.home:s=a.NavigationAction.First;break;case o.Keys.end:s=a.NavigationAction.Last;break;case o.Keys.space:case o.Keys.enter:s=a.NavigationAction.Toggle;break;default:s=null;break}s!==null&&(e.preventDefault(),this.onNavigate(e,s))}},o.validatePackage(k.packageMetadata),this.showLicenseWatermark=o.shouldShowValidationUI(k.packageMetadata);const r=p.getInitialState(n,this.expandMode);r.focused||(r.focused=p.getFirstId(n)),this.state=r}get expandMode(){return this.props.expandMode||"multiple"}get selectedItem(){const{selected:n=this.state.selected}=this.props;return n}get expandedItems(){return this.props.isControlled?this.props.expanded||[]:this.state.expanded}get children(){const n={...this.state,selected:this.selectedItem},r={animation:this.props.animation,keepItemsMounted:this.props.keepItemsMounted,state:n,expanded:this.expandedItems,handleSelect:this.handleSelect,children:this.props.children};return p.renderChildren(r)}render(){const n={"aria-activedescendant":this.activeDescendant},r=o.classNames("k-panelbar",this.props.className);return u.createElement("ul",{ref:e=>{this._element=e},dir:this.props.dir,role:"tree",tabIndex:0,onKeyDown:this.handleKeyDown,onFocus:this.handleWrapperFocus,onBlur:this.handleWrapperBlur,className:r,style:this.props.style,...n},this.children,this.showLicenseWatermark&&u.createElement(o.WatermarkOverlay,null))}nextTick(n){this.nextTickId=window.setTimeout(()=>n())}};g.propTypes={animation:l.bool,children:function(n,r){const e=n[r];if(e){if(Array.isArray(e)){for(const c of e)if(!c.type||c.type!==v.PanelBarItem)return new Error("PanelBar children should be either PanelBarItem or Array of PanelBarItem.")}else if(e.type!==v.PanelBarItem)return new Error("PanelBar child should be either PanelBarItem or Array of PanelBarItem.");return null}return null},dir:l.string,selected:l.string,expanded:l.arrayOf(l.string),focused:l.string,expandMode:l.oneOf(["single","multiple"]),className:l.string,keepItemsMounted:l.bool,onSelect:l.func,style:l.object},g.defaultProps={expandMode:"multiple",animation:!0,keepItemsMounted:!1};let y=g;exports.PanelBar=y;

package/panelbar/PanelBar.mjs

@@ -5,50 +5,51 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
+"use client";
 import * as c from "react";
 import o from "prop-types";
 import { PanelBarItem as m } from "./PanelBarItem.mjs";
 import { flatChildren as k, isArrayEqual as P, flatVisibleChildren as b, getFocusedChild as I, getInitialState as S, getFirstId as K, renderChildren as v } from "./util.mjs";
 import { Keys as l, validatePackage as w, shouldShowValidationUI as F, classNames as q, WatermarkOverlay as C } from "@progress/kendo-react-common";
 import { packageMetadata as y } from "../package-metadata.mjs";
-import { NavigationAction as i } from "./interfaces/NavigationAction.mjs";
+import { NavigationAction as r } from "./interfaces/NavigationAction.mjs";
 const h = class h extends c.Component {
   constructor(a) {
     super(a), this._element = null, this.showLicenseWatermark = !1, this.handleSelect = (t) => {
       this.onSelect(t), this.onFocus(t);
     }, this.onSelect = (t) => {
       const n = k(c.Children.toArray(this.children));
-      let s, r;
+      let s, i;
       switch (n.forEach((e) => {
         e.props.uniquePrivateKey === (t.uniquePrivateKey || this.state.focused) && (s = e);
       }), this.expandMode) {
         case "single":
-          r = [...s.props.parentUniquePrivateKey, s.props.uniquePrivateKey], P(this.expandedItems, r) && (s.props.parentUniquePrivateKey ? r = [...s.props.parentUniquePrivateKey] : r = []);
+          i = [...s.props.parentUniquePrivateKey, s.props.uniquePrivateKey], P(this.expandedItems, i) && (s.props.parentUniquePrivateKey ? i = [...s.props.parentUniquePrivateKey] : i = []);
           break;
         case "multiple": {
-          r = this.expandedItems.slice();
-          const e = r.indexOf(s.props.uniquePrivateKey);
-          e === -1 ? r.push(s.props.uniquePrivateKey) : r.splice(e, 1);
+          i = this.expandedItems.slice();
+          const e = i.indexOf(s.props.uniquePrivateKey);
+          e === -1 ? i.push(s.props.uniquePrivateKey) : i.splice(e, 1);
           break;
         }
         default:
-          r = this.expandedItems.slice();
+          i = this.expandedItems.slice();
           break;
       }
-      this.setState({ selected: s.props.uniquePrivateKey, expanded: r }), this.props.onSelect && this.props.onSelect.call(void 0, {
+      this.setState({ selected: s.props.uniquePrivateKey, expanded: i }), this.props.onSelect && this.props.onSelect.call(void 0, {
         target: s,
-        expandedItems: r
+        expandedItems: i
       });
     }, this.onFocus = (t, n = 0, s) => {
-      const r = b(c.Children.toArray(this.children)), e = I(r, n, t, this.state.focused, s);
+      const i = b(c.Children.toArray(this.children)), e = I(i, n, t, this.state.focused, s);
       if (e) {
         const d = this.expandedItems.slice();
-        if (s === i.Right && e && e.props && e.props.children && e.props.children.length > 0) {
+        if (s === r.Right && e && e.props && e.props.children && e.props.children.length > 0) {
           if (d.push(e.props.uniquePrivateKey), this.setState({ expanded: [...new Set(d)] }), e.props.expanded) {
             const u = e.props.children[0].props.uniquePrivateKey;
             this.setState({ focused: u });
           }
-        } else if (s === i.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)) {
+        } else if (s === r.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 u = e.props.parentUniquePrivateKey;
           if (e.props.expanded) {
             const f = e.props.uniquePrivateKey, g = d.indexOf(f);
@@ -63,25 +64,25 @@ const h = class h extends c.Component {
     }, this.onNavigate = (t, n) => {
       let s;
       switch (n) {
-        case i.First:
-          this.onFocus(t, s, i.First);
+        case r.First:
+          this.onFocus(t, s, r.First);
           break;
-        case i.Last:
-          this.onFocus(t, s, i.Last);
+        case r.Last:
+          this.onFocus(t, s, r.Last);
           break;
-        case i.Left:
-          this.onFocus(t, s, i.Left);
+        case r.Left:
+          this.onFocus(t, s, r.Left);
           break;
-        case i.Right:
-          this.onFocus(t, s, i.Right);
+        case r.Right:
+          this.onFocus(t, s, r.Right);
           break;
-        case i.Previous:
+        case r.Previous:
           s = -1, this.onFocus(t, s);
           break;
-        case i.Next:
+        case r.Next:
           s = 1, this.onFocus(t, s);
           break;
-        case i.Toggle:
+        case r.Toggle:
           this.onSelect(t);
           break;
       }
@@ -95,35 +96,35 @@ const h = class h extends c.Component {
       const n = this._element && getComputedStyle(this._element).direction === "rtl" || !1;
       if (t.target === t.currentTarget) {
         const s = t.keyCode;
-        let r;
+        let i;
         switch (s) {
           case l.left:
-            r = n ? i.Right : i.Left;
+            i = n ? r.Right : r.Left;
             break;
           case l.up:
-            r = i.Previous;
+            i = r.Previous;
             break;
           case l.right:
-            r = n ? i.Left : i.Right;
+            i = n ? r.Left : r.Right;
             break;
           case l.down:
-            r = i.Next;
+            i = r.Next;
             break;
           case l.home:
-            r = i.First;
+            i = r.First;
             break;
           case l.end:
-            r = i.Last;
+            i = r.Last;
             break;
           case l.space:
           case l.enter:
-            r = i.Toggle;
+            i = r.Toggle;
             break;
           default:
-            r = null;
+            i = null;
             break;
         }
-        r !== null && (t.preventDefault(), this.onNavigate(t, r));
+        i !== null && (t.preventDefault(), this.onNavigate(t, i));
       }
     }, w(y), this.showLicenseWatermark = F(y);
     const p = S(a, this.expandMode);

package/panelbar/PanelBarItem.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 P=require("react"),t=require("prop-types"),c=require("@progress/kendo-react-common"),y=require("@progress/kendo-svg-icons"),T=require("@progress/kendo-react-animation");function A(i){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(i){for(const e in i)if(e!=="default"){const s=Object.getOwnPropertyDescriptor(i,e);Object.defineProperty(n,e,s.get?s:{enumerable:!0,get:()=>i[e]})}}return n.default=i,Object.freeze(n)}const a=A(P);function j({imageUrl:i,icon:n,svgIcon:e,iconClass:s}){return i?a.createElement("img",{role:"presentation",className:"k-panelbar-item-icon k-image",src:i}):n||e?a.createElement(c.IconWrap,{className:"k-panelbar-item-icon",name:n,icon:e}):s?a.createElement("span",{role:"presentation",className:"k-panelbar-item-icon "+s}):null}const d=class d extends a.PureComponent{constructor(n){super(n),this.handleItemClick=()=>{const{onSelect:e,disabled:s,id:p}=this.props;e&&!s&&e.call(void 0,{uniquePrivateKey:this.props.uniquePrivateKey,id:p,target:this})},this.childFactory=e=>this.props.keepItemsMounted?a.cloneElement(e,{...e.props,in:this.props.expanded}):e,this.state={show:n.expanded||!1}}render(){const{id:n,children:e,title:s,uniquePrivateKey:p,disabled:r,selected:m,focused:g,expanded:o,className:v,level:h,headerClassName:N,animation:b,keepItemsMounted:l}=this.props,E={role:"treeitem","aria-disabled":r,"aria-hidden":!r&&!o,"aria-selected":!r&&m,"aria-expanded":!r&&o&&!!e},x=c.classNames("k-panelbar-item",{"k-panelbar-header":h===0,"k-expanded":o&&!!e,"k-disabled":r},`k-level-${h}`,v),I=c.classNames("k-link",{"k-selected":!r&&m,"k-focus":g},N),S={display:"block"},C=j(this.props),O=!r&&e?a.createElement(c.IconWrap,{name:o?"chevron-up":"chevron-down",icon:o?y.chevronUpIcon:y.chevronDownIcon,className:c.classNames("k-panelbar-toggle",o?"k-panelbar-collapse":"k-panelbar-expand")}):null;let k=!1;e&&e[0]&&Array.isArray(e)&&(k=e[0].type===d);const q=k?a.createElement("ul",{role:"group","aria-expanded":o,"aria-hidden":!o,className:"k-panelbar-group",style:{display:l?this.state.show?"block":"none":"block"}},e):e,f=!r&&o||l?q:null,w=(b===void 0||b)&&!r&&e?a.createElement(T.Reveal,{transitionEnterDuration:200,transitionExitDuration:200,key:p+"_animation",style:S,children:f,childFactory:l&&this.childFactory,unmountOnExit:!l,onBeforeEnter:()=>l&&this.setState({show:!0}),onAfterExited:()=>l&&this.setState({show:!1})}):f;return a.createElement("li",{id:n,className:x,...E},a.createElement("span",{className:I,onClick:this.handleItemClick},C,a.createElement("span",{className:"k-panelbar-item-text"},s),O),w)}};d.propTypes={animation:t.bool,children:t.any,className:t.string,icon:t.string,iconClass:t.string,imageUrl:t.string,svgIcon:c.svgIconPropType,expanded:t.bool,disabled:t.bool,onSelect:t.func,selected:t.bool,level:t.number,title:t.oneOfType([t.string,t.element]),id:t.oneOfType([t.string,t.number]),focused:t.bool,keepItemsMounted:t.bool},d.defaultProps={title:"Untitled"};let u=d;exports.PanelBarItem=u;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const P=require("react"),t=require("prop-types"),c=require("@progress/kendo-react-common"),y=require("@progress/kendo-svg-icons"),T=require("@progress/kendo-react-animation");function A(i){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(i){for(const e in i)if(e!=="default"){const s=Object.getOwnPropertyDescriptor(i,e);Object.defineProperty(n,e,s.get?s:{enumerable:!0,get:()=>i[e]})}}return n.default=i,Object.freeze(n)}const a=A(P);function j({imageUrl:i,icon:n,svgIcon:e,iconClass:s}){return i?a.createElement("img",{role:"presentation",className:"k-panelbar-item-icon k-image",src:i}):n||e?a.createElement(c.IconWrap,{className:"k-panelbar-item-icon",name:n,icon:e}):s?a.createElement("span",{role:"presentation",className:"k-panelbar-item-icon "+s}):null}const d=class d extends a.PureComponent{constructor(n){super(n),this.handleItemClick=()=>{const{onSelect:e,disabled:s,id:p}=this.props;e&&!s&&e.call(void 0,{uniquePrivateKey:this.props.uniquePrivateKey,id:p,target:this})},this.childFactory=e=>this.props.keepItemsMounted?a.cloneElement(e,{...e.props,in:this.props.expanded}):e,this.state={show:n.expanded||!1}}render(){const{id:n,children:e,title:s,uniquePrivateKey:p,disabled:r,selected:m,focused:g,expanded:o,className:v,level:h,headerClassName:N,animation:b,keepItemsMounted:l}=this.props,E={role:"treeitem","aria-disabled":r,"aria-hidden":!r&&!o,"aria-selected":!r&&m,"aria-expanded":!r&&o&&!!e},x=c.classNames("k-panelbar-item",{"k-panelbar-header":h===0,"k-expanded":o&&!!e,"k-disabled":r},`k-level-${h}`,v),I=c.classNames("k-link",{"k-selected":!r&&m,"k-focus":g},N),S={display:"block"},C=j(this.props),O=!r&&e?a.createElement(c.IconWrap,{name:o?"chevron-up":"chevron-down",icon:o?y.chevronUpIcon:y.chevronDownIcon,className:c.classNames("k-panelbar-toggle",o?"k-panelbar-collapse":"k-panelbar-expand")}):null;let k=!1;e&&e[0]&&Array.isArray(e)&&(k=e[0].type===d);const q=k?a.createElement("ul",{role:"group","aria-expanded":o,"aria-hidden":!o,className:"k-panelbar-group",style:{display:l?this.state.show?"block":"none":"block"}},e):e,f=!r&&o||l?q:null,w=(b===void 0||b)&&!r&&e?a.createElement(T.Reveal,{transitionEnterDuration:200,transitionExitDuration:200,key:p+"_animation",style:S,children:f,childFactory:l&&this.childFactory,unmountOnExit:!l,onBeforeEnter:()=>l&&this.setState({show:!0}),onAfterExited:()=>l&&this.setState({show:!1})}):f;return a.createElement("li",{id:n,className:x,...E},a.createElement("span",{className:I,onClick:this.handleItemClick},C,a.createElement("span",{className:"k-panelbar-item-text"},s),O),w)}};d.propTypes={animation:t.bool,children:t.any,className:t.string,icon:t.string,iconClass:t.string,imageUrl:t.string,svgIcon:c.svgIconPropType,expanded:t.bool,disabled:t.bool,onSelect:t.func,selected:t.bool,level:t.number,title:t.oneOfType([t.string,t.element]),id:t.oneOfType([t.string,t.number]),focused:t.bool,keepItemsMounted:t.bool},d.defaultProps={title:"Untitled"};let u=d;exports.PanelBarItem=u;

package/panelbar/PanelBarItem.mjs

@@ -5,6 +5,7 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
+"use client";
 import * as n from "react";
 import t from "prop-types";
 import { svgIconPropType as P, classNames as p, IconWrap as y } from "@progress/kendo-react-common";