@progress/kendo-react-layout 14.0.0-develop.1 → 14.0.0-develop.2

package/panelbar/PanelBarItem.mjs

@@ -5,128 +5,134 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-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";
-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;
+import * as e from "react";
+import n from "prop-types";
+import { classNames as u, IconWrap as v, svgIconPropType as _ } from "@progress/kendo-react-common";
+import { chevronUpIcon as $, chevronDownIcon as j } from "@progress/kendo-svg-icons";
+import { Reveal as z } from "@progress/kendo-react-animation";
+function J({ imageUrl: o, icon: i, svgIcon: s, iconClass: a }) {
+  return o ? /* @__PURE__ */ e.createElement("img", { role: "presentation", className: "k-panelbar-item-icon k-image", src: o }) : i || s ? /* @__PURE__ */ e.createElement(v, { className: "k-panelbar-item-icon", name: i, icon: s }) : a ? /* @__PURE__ */ e.createElement("span", { role: "presentation", className: "k-panelbar-item-icon " + a }) : null;
 }
-const l = class l extends n.PureComponent {
-  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 = (e) => this.props.keepItemsMounted ? n.cloneElement(e, {
-      ...e.props,
-      in: this.props.expanded
-    }) : e, this.state = {
-      show: r.expanded || !1
-    };
-  }
-  /**
-   * @hidden
-   */
-  render() {
-    const {
-      id: r,
-      children: e,
-      title: o,
+const f = e.forwardRef((o, i) => {
+  const {
+    id: s,
+    children: a,
+    title: E = Q.title,
+    uniquePrivateKey: c,
+    disabled: t,
+    selected: k,
+    focused: N,
+    expanded: r,
+    className: C,
+    level: b,
+    headerClassName: x,
+    animation: y,
+    keepItemsMounted: l,
+    onSelect: m,
+    imageUrl: B,
+    icon: R,
+    svgIcon: w,
+    iconClass: P
+  } = o, d = e.useRef({ props: o }), S = e.useRef(null);
+  e.useImperativeHandle(d, () => ({ props: o })), e.useImperativeHandle(
+    i,
+    () => d.current
+  );
+  const [A, g] = e.useState(r || !1), D = e.useCallback(() => {
+    m && !t && m({
       uniquePrivateKey: c,
-      disabled: a,
-      selected: m,
-      focused: E,
-      expanded: s,
-      className: g,
-      level: u,
-      headerClassName: v,
-      animation: h,
-      keepItemsMounted: i
-    } = this.props, x = {
-      role: "treeitem",
-      "aria-disabled": a,
-      "aria-hidden": !a && !s,
-      "aria-selected": !a && m,
-      "aria-expanded": !a && s && !!e
-    }, N = p(
-      "k-panelbar-item",
-      {
-        "k-panelbar-header": u === 0,
-        "k-expanded": s && !!e,
-        "k-disabled": a
-      },
-      `k-level-${u}`,
-      g
-    ), C = p(
-      "k-link",
-      {
-        "k-selected": !a && m,
-        "k-focus": E
-      },
-      v
-    ), I = { display: "block" }, w = K(this.props), A = !a && e ? /* @__PURE__ */ n.createElement(
-      y,
-      {
-        name: s ? "chevron-up" : "chevron-down",
-        icon: s ? q : D,
-        className: p("k-panelbar-toggle", s ? "k-panelbar-collapse" : "k-panelbar-expand")
-      }
-    ) : null;
-    let k = !1;
-    e && e[0] && 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",
-        style: { display: i ? this.state.show ? "block" : "none" : "block" }
-      },
-      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: b,
-        childFactory: i && this.childFactory,
-        unmountOnExit: !i,
-        onBeforeEnter: () => i && this.setState({ show: !0 }),
-        onAfterExited: () => i && this.setState({ show: !1 })
-      }
-    ) : b;
-    return /* @__PURE__ */ n.createElement("li", { id: r, className: N, ...x }, /* @__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: 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: t.oneOfType([t.string, t.number]),
-  focused: t.bool,
-  keepItemsMounted: t.bool
-}, l.defaultProps = {
+      id: s,
+      target: d.current
+    });
+  }, [m, t, c, s]), T = e.useCallback(
+    (p) => l ? e.cloneElement(p, {
+      ...p.props,
+      in: r
+    }) : p,
+    [l, r]
+  ), U = e.useCallback(() => {
+    l && g(!0);
+  }, [l]), H = e.useCallback(() => {
+    l && g(!1);
+  }, [l]), L = {
+    role: "treeitem",
+    "aria-disabled": t,
+    "aria-hidden": !t && !r ? "true" : "false",
+    "aria-selected": !t && k,
+    "aria-expanded": !t && r && !!a
+  }, O = u(
+    "k-panelbar-item",
+    {
+      "k-panelbar-header": b === 0,
+      "k-expanded": r && !!a,
+      "k-disabled": t
+    },
+    `k-level-${b}`,
+    C
+  ), F = u(
+    "k-link",
+    {
+      "k-selected": !t && k,
+      "k-focus": N
+    },
+    x
+  ), K = { display: "block" }, M = J({ imageUrl: B, icon: R, svgIcon: w, iconClass: P }), q = !t && a ? /* @__PURE__ */ e.createElement(
+    v,
+    {
+      name: r ? "chevron-up" : "chevron-down",
+      icon: r ? $ : j,
+      className: u("k-panelbar-toggle", r ? "k-panelbar-collapse" : "k-panelbar-expand")
+    }
+  ) : null;
+  let I = !1;
+  a && a[0] && Array.isArray(a) && (I = a[0].type === f);
+  const G = l && !A ? "none" : "block", h = !t && r || l ? I ? /* @__PURE__ */ e.createElement(
+    "ul",
+    {
+      role: "group",
+      "aria-hidden": r ? "false" : "true",
+      className: "k-panelbar-group",
+      style: { display: G }
+    },
+    a
+  ) : a : null, W = (y === void 0 || y) && !t && a ? /* @__PURE__ */ e.createElement(
+    z,
+    {
+      transitionEnterDuration: 200,
+      transitionExitDuration: 200,
+      key: c + "_animation",
+      style: K,
+      children: h,
+      childFactory: l ? T : void 0,
+      unmountOnExit: !l,
+      onBeforeEnter: U,
+      onAfterExited: H
+    }
+  ) : h;
+  return /* @__PURE__ */ e.createElement("li", { ref: S, id: s, className: O, ...L }, /* @__PURE__ */ e.createElement("span", { className: F, onClick: D }, M, /* @__PURE__ */ e.createElement("span", { className: "k-panelbar-item-text" }, E), q), W);
+}), Q = {
   title: "Untitled"
 };
-let f = l;
+f.propTypes = {
+  animation: n.bool,
+  children: n.any,
+  className: n.string,
+  icon: n.string,
+  iconClass: n.string,
+  imageUrl: n.string,
+  svgIcon: _,
+  expanded: n.bool,
+  disabled: n.bool,
+  onSelect: n.func,
+  selected: n.bool,
+  level: n.number,
+  title: n.oneOfType([n.string, n.element]),
+  id: n.oneOfType([n.string, n.number]),
+  focused: n.bool,
+  keepItemsMounted: n.bool
+};
+f.displayName = "KendoReactPanelBarItem";
 export {
-  f as PanelBarItem
+  f as PanelBarItem,
+  Q as panelBarItemDefaultProps
 };

package/panelbar/interfaces/PanelBarItemClickEventArguments.d.ts

@@ -5,11 +5,11 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-import { PanelBarItem } from '../PanelBarItem.js';
+import * as React from 'react';
 /**
  * @hidden
  */
 export interface PanelBarItemClickEventArguments {
     uniquePrivateKey: number;
-    target: PanelBarItem;
+    target: React.ReactElement;
 }

package/panelbar/interfaces/PanelBarItemHandle.d.ts

@@ -0,0 +1,17 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2026 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { PanelBarItemProps } from './PanelBarItemProps.js';
+/**
+ * Represents the handle of the PanelBarItem component.
+ */
+export interface PanelBarItemHandle {
+    /**
+     * The props of the PanelBarItem component.
+     */
+    props: PanelBarItemProps;
+}