@progress/kendo-react-layout 7.4.0-develop.9 → 7.5.0-develop.1

package/index.d.mts

@@ -517,12 +517,20 @@ export declare interface AppBarSpacerProps {
  * Specifies the theme color of the AppBar ([see example]({% slug appearance_appbar %})).
  *
  * * The possible values are:
- * * `inherit`
  * * `light` (Default)
- * * `dark`
+ * * 'primary'
+ * * 'secondary'
+ * * 'tertiary'
+ * * 'info'
+ * * 'success'
+ * * 'warning'
+ * * 'error'
+ * * 'dark'
+ * * 'inherit'
+ * * 'inverse'
  *
  */
-export declare type AppBarThemeColor = 'light' | 'dark' | 'inherit';
+export declare type AppBarThemeColor = 'base' | 'primary' | 'secondary' | 'tertiary' | 'info' | 'success' | 'warning' | 'error' | 'dark' | 'light' | 'inherit' | 'inverse';
 
 export declare const Avatar: React_2.FunctionComponent<AvatarProps>;
 
@@ -1104,7 +1112,7 @@ export declare interface BreadcrumbLinkHandle {
     /**
      * The current element or `null` if there is none.
      */
-    element: HTMLLIElement | null;
+    element: HTMLAnchorElement | null;
     /**
      * The props values of the BreadcrumbLink.
      */
@@ -2445,7 +2453,7 @@ export declare const isArrayEqual: (firstArray: any[], secondArray: any[]) => bo
 /**
  * @hidden
  */
-export declare const isPresent: Function;
+export declare const isPresent: (value: any) => boolean;
 
 /**
  * @hidden
@@ -3040,15 +3048,15 @@ export declare interface PanelBarProps {
      */
     dir?: string;
     /**
-     * If set, overrides the currently selected property in the PanelBar state.
+     * If set, overrides the currently selected property in the PanelBar state. Takes the `id` of the item.
      */
     selected?: string;
     /**
-     * Sets the initial expanded state of the PanelBar.
+     * Sets the initial expanded state of the PanelBar. Takes the `id` of the item.
      */
     expanded?: string[];
     /**
-     * Sets the initial focused state of the PanelBar.
+     * Sets the initial focused state of the PanelBar. Takes the `id` of the item.
      */
     focused?: string;
     /**
@@ -3105,7 +3113,7 @@ export declare namespace PanelBarUtils {
      * @param items - A collection of PanelBarItemProps.
      * @return {PanelBarItem[]} Returns an array of PanelBarItem components.
      */
-    export function mapItemsToComponents(items: Array<PanelBarItemProps>): PanelBarItem[];
+    export function mapItemsToComponents(items: Array<PanelBarItemProps>): React_2.ReactNode[];
 }
 
 /**

package/index.d.ts

@@ -517,12 +517,20 @@ export declare interface AppBarSpacerProps {
  * Specifies the theme color of the AppBar ([see example]({% slug appearance_appbar %})).
  *
  * * The possible values are:
- * * `inherit`
  * * `light` (Default)
- * * `dark`
+ * * 'primary'
+ * * 'secondary'
+ * * 'tertiary'
+ * * 'info'
+ * * 'success'
+ * * 'warning'
+ * * 'error'
+ * * 'dark'
+ * * 'inherit'
+ * * 'inverse'
  *
  */
-export declare type AppBarThemeColor = 'light' | 'dark' | 'inherit';
+export declare type AppBarThemeColor = 'base' | 'primary' | 'secondary' | 'tertiary' | 'info' | 'success' | 'warning' | 'error' | 'dark' | 'light' | 'inherit' | 'inverse';
 
 export declare const Avatar: React_2.FunctionComponent<AvatarProps>;
 
@@ -1104,7 +1112,7 @@ export declare interface BreadcrumbLinkHandle {
     /**
      * The current element or `null` if there is none.
      */
-    element: HTMLLIElement | null;
+    element: HTMLAnchorElement | null;
     /**
      * The props values of the BreadcrumbLink.
      */
@@ -2445,7 +2453,7 @@ export declare const isArrayEqual: (firstArray: any[], secondArray: any[]) => bo
 /**
  * @hidden
  */
-export declare const isPresent: Function;
+export declare const isPresent: (value: any) => boolean;
 
 /**
  * @hidden
@@ -3040,15 +3048,15 @@ export declare interface PanelBarProps {
      */
     dir?: string;
     /**
-     * If set, overrides the currently selected property in the PanelBar state.
+     * If set, overrides the currently selected property in the PanelBar state. Takes the `id` of the item.
      */
     selected?: string;
     /**
-     * Sets the initial expanded state of the PanelBar.
+     * Sets the initial expanded state of the PanelBar. Takes the `id` of the item.
      */
     expanded?: string[];
     /**
-     * Sets the initial focused state of the PanelBar.
+     * Sets the initial focused state of the PanelBar. Takes the `id` of the item.
      */
     focused?: string;
     /**
@@ -3105,7 +3113,7 @@ export declare namespace PanelBarUtils {
      * @param items - A collection of PanelBarItemProps.
      * @return {PanelBarItem[]} Returns an array of PanelBarItem components.
      */
-    export function mapItemsToComponents(items: Array<PanelBarItemProps>): PanelBarItem[];
+    export function mapItemsToComponents(items: Array<PanelBarItemProps>): React_2.ReactNode[];
 }
 
 /**

package/package-metadata.mjs

@@ -10,7 +10,7 @@ const e = {
   name: "@progress/kendo-react-layout",
   productName: "KendoReact",
   productCodes: ["KENDOUIREACT", "KENDOUICOMPLETE"],
-  publishDate: 1711533057,
+  publishDate: 1712850582,
   version: "",
   licensingDocsUrl: "https://www.telerik.com/kendo-react-ui/components/my-license/"
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-react-layout",
-  "version": "7.4.0-develop.9",
+  "version": "7.5.0-develop.1",
   "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",
@@ -23,11 +23,11 @@
   "sideEffects": false,
   "peerDependencies": {
     "@progress/kendo-licensing": "^1.3.4",
-    "@progress/kendo-react-animation": "7.4.0-develop.9",
-    "@progress/kendo-react-common": "7.4.0-develop.9",
-    "@progress/kendo-react-intl": "7.4.0-develop.9",
-    "@progress/kendo-react-popup": "7.4.0-develop.9",
-    "@progress/kendo-react-progressbars": "7.4.0-develop.9",
+    "@progress/kendo-react-animation": "7.5.0-develop.1",
+    "@progress/kendo-react-common": "7.5.0-develop.1",
+    "@progress/kendo-react-intl": "7.5.0-develop.1",
+    "@progress/kendo-react-popup": "7.5.0-develop.1",
+    "@progress/kendo-react-progressbars": "7.5.0-develop.1",
     "@progress/kendo-svg-icons": "^2.1.0",
     "react": "^16.8.2 || ^17.0.0 || ^18.0.0",
     "react-dom": "^16.8.2 || ^17.0.0 || ^18.0.0"

package/panelbar/PanelBar.js

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

package/panelbar/PanelBar.mjs

@@ -9,8 +9,8 @@
 import * as p from "react";
 import a from "prop-types";
 import { PanelBarItem as u } from "./PanelBarItem.mjs";
-import { flatChildren as x, isArrayEqual as k, flatVisibleChildren as g, getInitialState as P, getFirstId as I, renderChildren as v } from "./util.mjs";
-import { Keys as d, validatePackage as b, shouldShowValidationUI as w, classNames as S, WatermarkOverlay as K } from "@progress/kendo-react-common";
+import { flatChildren as x, isArrayEqual as g, flatVisibleChildren as k, getInitialState as P, getFirstId as I, renderChildren as b } from "./util.mjs";
+import { Keys as d, validatePackage as v, shouldShowValidationUI as w, classNames as S, WatermarkOverlay as K } from "@progress/kendo-react-common";
 import { packageMetadata as m } from "../package-metadata.mjs";
 import { NavigationAction as n } from "./interfaces/NavigationAction.mjs";
 const c = class c extends p.Component {
@@ -24,11 +24,11 @@ const c = class c extends p.Component {
         l.props.uniquePrivateKey === (t.uniquePrivateKey || this.state.focused) && (s = l);
       }), this.expandMode) {
         case "single":
-          e = [...s.props.parentUniquePrivateKey, s.props.uniquePrivateKey], k(this.expandedItems, e) && (s.props.parentUniquePrivateKey ? e = [...s.props.parentUniquePrivateKey] : e = []);
+          e = [...s.props.parentUniquePrivateKey, s.props.uniquePrivateKey], g(this.expandedItems, e) && (s.props.parentUniquePrivateKey ? e = [...s.props.parentUniquePrivateKey] : e = []);
           break;
         case "multiple": {
           e = this.expandedItems.slice();
-          let l = e.indexOf(s.props.uniquePrivateKey);
+          const l = e.indexOf(s.props.uniquePrivateKey);
           l === -1 ? e.push(s.props.uniquePrivateKey) : e.splice(l, 1);
           break;
         }
@@ -41,11 +41,11 @@ const c = class c extends p.Component {
         expandedItems: e
       });
     }, this.onFocus = (t, r = 0) => {
-      const s = g(p.Children.toArray(this.children));
+      const s = k(p.Children.toArray(this.children));
       let e;
       s.forEach((l, h) => {
         if (l.props.uniquePrivateKey === (t.uniquePrivateKey || this.state.focused)) {
-          let y = h + r < 0 ? 0 : h + r > s.length ? s.length - 1 : h + r;
+          const y = h + r < 0 ? 0 : h + r > s.length ? s.length - 1 : h + r;
           e = s[y];
         }
       }), e && (this.activeDescendant = e.props.id, this.setState({ focused: e.props.uniquePrivateKey }));
@@ -96,7 +96,7 @@ const c = class c extends p.Component {
         }
         e !== null && (t.preventDefault(), this.onNavigate(t, e));
       }
-    }, b(m), this.showLicenseWatermark = w(m);
+    }, v(m), this.showLicenseWatermark = w(m);
     const o = P(i, this.expandMode);
     o.focused || (o.focused = I(i)), this.state = o;
   }
@@ -119,7 +119,7 @@ const c = class c extends p.Component {
       handleSelect: this.handleSelect,
       children: this.props.children
     };
-    return v(o);
+    return b(o);
   }
   /**
    * @hidden
@@ -129,7 +129,6 @@ const c = class c extends p.Component {
       "aria-activedescendant": this.activeDescendant
     }, o = S(
       "k-panelbar",
-      "k-pos-relative",
       this.props.className
     );
     return /* @__PURE__ */ p.createElement(
@@ -162,7 +161,7 @@ c.propTypes = {
     const t = i[o];
     if (t) {
       if (Array.isArray(t)) {
-        for (let r of t)
+        for (const r of t)
           if (!r.type || r.type !== u)
             return new Error(
               "PanelBar children should be either PanelBarItem or Array of PanelBarItem."

package/panelbar/PanelBarItem.js

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

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

package/panelbar/util.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const x=require("react"),d=require("./PanelBarItem.js");function O(n){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const e in n)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(n,e);Object.defineProperty(r,e,t.get?t:{enumerable:!0,get:()=>n[e]})}}return r.default=n,Object.freeze(r)}const a=O(x),m=({animation:n=!0,keepItemsMounted:r=!1,state:e,expanded:t,handleSelect:i,children:p,parentExpanded:u=!0,level:o=0,parentPrivateKey:l=[]})=>a.Children.map(p,(s,E)=>{if(s&&s.type===d.PanelBarItem){let g,f=c(s,l,E);if(s.props.children){const P={animation:n,keepItemsMounted:r,state:e,expanded:t,handleSelect:i,children:s.props.children,parentExpanded:(t||[]).indexOf(f)>-1,level:o+1,parentPrivateKey:[...l,f]};g=m(P)}return a.cloneElement(s,{...s.props,animation:s.props.animation!==void 0?s.props.animation:n,keepItemsMounted:r,id:s.props.id||`k-panelbar-item-default-${f}`,uniquePrivateKey:f,parentUniquePrivateKey:l,parentExpanded:u,level:o,expanded:(t||[]).indexOf(f)>-1,focused:e.focused===f&&e.wrapperFocused,selected:e.selected===f,children:g,onSelect:i})}else return a.createElement("div",{className:"k-panelbar-content k-content"},s)}),B=n=>{const r=a.Children.toArray(n.children)[0];return r?c(r,[],0):""},b=(n,r,e={expanded:n.expanded||[],selected:n.selected||"",focused:n.focused||"",wrapperFocused:!1},t=!0,i=[])=>(a.Children.map(n.children,(p,u)=>{if(p&&p.type===d.PanelBarItem){let o=c(p,i,u);!p.props.disabled&&t&&(p.props.selected&&(e.selected=o),p.props.focused&&(e.focused=o),p.props.expanded&&(r==="multiple"?e.expanded.push(o):r==="single"&&(e.expanded=[o])),p.props.children&&(e=b(p.props,r,e,!!p.props.expanded,[...i,o])))}}),e),c=(n,r,e)=>n&&n.props&&n.props.id?n.props.id:r.length?r[r.length-1]+`.${e}`:`.${e}`;function I(n,r=[]){return(n||[]).forEach(e=>{e.disabled||(r.push(e),e.expanded&&e.children&&I(e.children,r))}),r}function y(n,r=[]){return a.Children.forEach(n,e=>{e&&e.props&&!e.props.disabled&&(r.push(e),e.props.children&&y(e.props.children,r))}),r}function C(n,r=[]){return a.Children.forEach(n,e=>{e&&e.props&&!e.props.disabled&&(e.props.expanded||e.props.parentExpanded)&&(r.push(e),e.props.children&&C(e.props.children,r))}),r}const S=n=>n!=null;exports.PanelBarUtils=void 0;(n=>{function r(e){return e.map((t,i)=>{let p;return t.content&&(p=t.content),t.children&&(p=r(t.children)),a.createElement(d.PanelBarItem,{...t,children:p,key:t.id||i})})}n.mapItemsToComponents=r})(exports.PanelBarUtils||(exports.PanelBarUtils={}));const q=(n,r)=>n.length!==r.length?!1:n.every((e,t)=>e===r[t]);exports.flatChildren=y;exports.flatVisibleChildren=C;exports.flatVisibleItems=I;exports.getFirstId=B;exports.getInitialState=b;exports.isArrayEqual=q;exports.isPresent=S;exports.renderChildren=m;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const O=require("react"),l=require("./PanelBarItem.js");function S(n){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const e in n)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(n,e);Object.defineProperty(r,e,t.get?t:{enumerable:!0,get:()=>n[e]})}}return r.default=n,Object.freeze(r)}const p=S(O),j=n=>typeof n!="object"||!("type"in n)||n.type!==l.PanelBarItem,m=({animation:n=!0,keepItemsMounted:r=!1,state:e,expanded:t,handleSelect:i,children:o,parentExpanded:u=!0,level:a=0,parentPrivateKey:d=[]})=>{const b=p.Children.toArray(o).filter(j),E=b.length?b:o;return p.Children.map(E,(s,x)=>{if(s&&s.type===l.PanelBarItem){let g;const f=c(s,d,x);if(s.props.children){const B={animation:n,keepItemsMounted:r,state:e,expanded:t,handleSelect:i,children:s.props.children,parentExpanded:(t||[]).indexOf(f)>-1,level:a+1,parentPrivateKey:[...d,f]};g=m(B)}return p.cloneElement(s,{...s.props,animation:s.props.animation!==void 0?s.props.animation:n,keepItemsMounted:r,id:s.props.id||`k-panelbar-item-default-${f}`,uniquePrivateKey:f,parentUniquePrivateKey:d,parentExpanded:u,level:a,expanded:(t||[]).indexOf(f)>-1,focused:e.focused===f&&e.wrapperFocused,selected:e.selected===f,children:g,onSelect:i})}else return p.createElement("div",{className:"k-panelbar-content"},s)})},q=n=>{const r=p.Children.toArray(n.children)[0];return r?c(r,[],0):""},y=(n,r,e={expanded:n.expanded||[],selected:n.selected||"",focused:n.focused||"",wrapperFocused:!1},t=!0,i=[])=>(p.Children.map(n.children,(o,u)=>{if(o&&o.type===l.PanelBarItem){const a=c(o,i,u);!o.props.disabled&&t&&(o.props.selected&&(e.selected=a),o.props.focused&&(e.focused=a),o.props.expanded&&(r==="multiple"?e.expanded.push(a):r==="single"&&(e.expanded=[a])),o.props.children&&(e=y(o.props,r,e,!!o.props.expanded,[...i,a])))}}),e),c=(n,r,e)=>n&&n.props&&n.props.id?n.props.id:r.length?r[r.length-1]+`.${e}`:`.${e}`;function I(n,r=[]){return(n||[]).forEach(e=>{e.disabled||(r.push(e),e.expanded&&e.children&&I(e.children,r))}),r}function C(n,r=[]){return p.Children.forEach(n,e=>{e&&e.props&&!e.props.disabled&&(r.push(e),e.props.children&&C(e.props.children,r))}),r}function P(n,r=[]){return p.Children.forEach(n,e=>{e&&e.props&&!e.props.disabled&&(e.props.expanded||e.props.parentExpanded)&&(r.push(e),e.props.children&&P(e.props.children,r))}),r}const v=n=>n!=null;exports.PanelBarUtils=void 0;(n=>{function r(e){return e.map((t,i)=>{let o;return t.content&&(o=t.content),t.children&&(o=r(t.children)),p.createElement(l.PanelBarItem,{...t,children:o,key:t.id||i})})}n.mapItemsToComponents=r})(exports.PanelBarUtils||(exports.PanelBarUtils={}));const F=(n,r)=>n.length!==r.length?!1:n.every((e,t)=>e===r[t]);exports.flatChildren=C;exports.flatVisibleChildren=P;exports.flatVisibleItems=I;exports.getFirstId=q;exports.getInitialState=y;exports.isArrayEqual=F;exports.isPresent=v;exports.renderChildren=m;