@cgi-learning-hub/ui 1.4.0 → 1.5.0

package/dist/CustomTreeItem-BpAK85gf.js

@@ -0,0 +1,1336 @@
+import { jsx as x, jsxs as ie } from "react/jsx-runtime";
+import { c as ae } from "./createSvgIcon-BFqOnlgU.js";
+import { B as Be } from "./Box-C-j-U8SH.js";
+import { _ as f } from "./ButtonBase-CZFKUUHD.js";
+import * as R from "react";
+import { u as ce } from "./useForkRef-C_4o__cU.js";
+import { e as B, r as be } from "./resolveComponentProps-Ctw0-dUN.js";
+import { treeContentStyle as Ke, arrowContainerStyle as Fe, expandedGroupStyle as je } from "./components/TreeView/style.es.js";
+import { getIconComponent as qe } from "./components/TreeView/utils.es.js";
+import { G as Ce, H as we, x as _e, I as Te, P as i, n as oe } from "./generateUtilityClasses-CqzQXpT_.js";
+import { a as ve } from "./TransitionGroupContext-DbLioz_6.js";
+import { u as Ue } from "./useThemeProps-Drd5oJEF.js";
+import { u as We, s as A, c as Pe, f as le } from "./DefaultPropsProvider-CXfMJdg8.js";
+import { u as Ge } from "./useTheme-DepbBZga.js";
+import { m as Xe } from "./memoTheme-B0xVysYu.js";
+import { T as Ye, g as Ie } from "./utils-BVg32WSe.js";
+import { u as Je } from "./useTimeout-CrCYVizI.js";
+import { e as Qe } from "./elementTypeAcceptingRef-1usJq_B8.js";
+import { C as Ze } from "./Checkbox-1Zr36vDa.js";
+import { u as He } from "./unsupportedProp-BuVD30Gh.js";
+import { u as K } from "./useSlotProps-Ceyorp-u.js";
+function et(e) {
+  return we("MuiCollapse", e);
+}
+const Xt = Ce("MuiCollapse", ["root", "horizontal", "vertical", "entered", "hidden", "wrapper", "wrapperInner"]), tt = (e) => {
+  const {
+    orientation: t,
+    classes: o
+  } = e, s = {
+    root: ["root", `${t}`],
+    entered: ["entered"],
+    hidden: ["hidden"],
+    wrapper: ["wrapper", `${t}`],
+    wrapperInner: ["wrapperInner", `${t}`]
+  };
+  return Pe(s, et, o);
+}, ot = A("div", {
+  name: "MuiCollapse",
+  slot: "Root",
+  overridesResolver: (e, t) => {
+    const {
+      ownerState: o
+    } = e;
+    return [t.root, t[o.orientation], o.state === "entered" && t.entered, o.state === "exited" && !o.in && o.collapsedSize === "0px" && t.hidden];
+  }
+})(Xe(({
+  theme: e
+}) => ({
+  height: 0,
+  overflow: "hidden",
+  transition: e.transitions.create("height"),
+  variants: [{
+    props: {
+      orientation: "horizontal"
+    },
+    style: {
+      height: "auto",
+      width: 0,
+      transition: e.transitions.create("width")
+    }
+  }, {
+    props: {
+      state: "entered"
+    },
+    style: {
+      height: "auto",
+      overflow: "visible"
+    }
+  }, {
+    props: {
+      state: "entered",
+      orientation: "horizontal"
+    },
+    style: {
+      width: "auto"
+    }
+  }, {
+    props: ({
+      ownerState: t
+    }) => t.state === "exited" && !t.in && t.collapsedSize === "0px",
+    style: {
+      visibility: "hidden"
+    }
+  }]
+}))), nt = A("div", {
+  name: "MuiCollapse",
+  slot: "Wrapper",
+  overridesResolver: (e, t) => t.wrapper
+})({
+  // Hack to get children with a negative margin to not falsify the height computation.
+  display: "flex",
+  width: "100%",
+  variants: [{
+    props: {
+      orientation: "horizontal"
+    },
+    style: {
+      width: "auto",
+      height: "100%"
+    }
+  }]
+}), rt = A("div", {
+  name: "MuiCollapse",
+  slot: "WrapperInner",
+  overridesResolver: (e, t) => t.wrapperInner
+})({
+  width: "100%",
+  variants: [{
+    props: {
+      orientation: "horizontal"
+    },
+    style: {
+      width: "auto",
+      height: "100%"
+    }
+  }]
+}), se = /* @__PURE__ */ R.forwardRef(function(t, o) {
+  const s = We({
+    props: t,
+    name: "MuiCollapse"
+  }), {
+    addEndListener: p,
+    children: d,
+    className: g,
+    collapsedSize: l = "0px",
+    component: m,
+    easing: c,
+    in: h,
+    onEnter: b,
+    onEntered: C,
+    onEntering: r,
+    onExit: y,
+    onExited: S,
+    onExiting: F,
+    orientation: X = "vertical",
+    style: _,
+    timeout: T = _e.standard,
+    // eslint-disable-next-line react/prop-types
+    TransitionComponent: E = Ye,
+    ...P
+  } = s, w = {
+    ...s,
+    orientation: X,
+    collapsedSize: l
+  }, O = tt(w), U = Ge(), Y = Je(), D = R.useRef(null), j = R.useRef(), q = typeof l == "number" ? `${l}px` : l, M = X === "horizontal", z = M ? "width" : "height", $ = R.useRef(null), H = ce(o, $), N = (I) => (k) => {
+    if (I) {
+      const L = $.current;
+      k === void 0 ? I(L) : I(L, k);
+    }
+  }, W = () => D.current ? D.current[M ? "clientWidth" : "clientHeight"] : 0, J = N((I, k) => {
+    D.current && M && (D.current.style.position = "absolute"), I.style[z] = q, b && b(I, k);
+  }), ee = N((I, k) => {
+    const L = W();
+    D.current && M && (D.current.style.position = "");
+    const {
+      duration: Z,
+      easing: a
+    } = Ie({
+      style: _,
+      timeout: T,
+      easing: c
+    }, {
+      mode: "enter"
+    });
+    if (T === "auto") {
+      const n = U.transitions.getAutoHeightDuration(L);
+      I.style.transitionDuration = `${n}ms`, j.current = n;
+    } else
+      I.style.transitionDuration = typeof Z == "string" ? Z : `${Z}ms`;
+    I.style[z] = `${L}px`, I.style.transitionTimingFunction = a, r && r(I, k);
+  }), Q = N((I, k) => {
+    I.style[z] = "auto", C && C(I, k);
+  }), re = N((I) => {
+    I.style[z] = `${W()}px`, y && y(I);
+  }), ue = N(S), ge = N((I) => {
+    const k = W(), {
+      duration: L,
+      easing: Z
+    } = Ie({
+      style: _,
+      timeout: T,
+      easing: c
+    }, {
+      mode: "exit"
+    });
+    if (T === "auto") {
+      const a = U.transitions.getAutoHeightDuration(k);
+      I.style.transitionDuration = `${a}ms`, j.current = a;
+    } else
+      I.style.transitionDuration = typeof L == "string" ? L : `${L}ms`;
+    I.style[z] = q, I.style.transitionTimingFunction = Z, F && F(I);
+  });
+  return /* @__PURE__ */ x(E, {
+    in: h,
+    onEnter: J,
+    onEntered: Q,
+    onEntering: ee,
+    onExit: re,
+    onExited: ue,
+    onExiting: ge,
+    addEndListener: (I) => {
+      T === "auto" && Y.start(j.current || 0, I), p && p($.current, I);
+    },
+    nodeRef: $,
+    timeout: T === "auto" ? null : T,
+    ...P,
+    children: (I, {
+      ownerState: k,
+      ...L
+    }) => /* @__PURE__ */ x(ot, {
+      as: m,
+      className: Te(O.root, g, {
+        entered: O.entered,
+        exited: !h && q === "0px" && O.hidden
+      }[I]),
+      style: {
+        [M ? "minWidth" : "minHeight"]: q,
+        ..._
+      },
+      ref: H,
+      ownerState: {
+        ...w,
+        state: I
+      },
+      ...L,
+      children: /* @__PURE__ */ x(nt, {
+        ownerState: {
+          ...w,
+          state: I
+        },
+        className: O.wrapper,
+        ref: D,
+        children: /* @__PURE__ */ x(rt, {
+          ownerState: {
+            ...w,
+            state: I
+          },
+          className: O.wrapperInner,
+          children: d
+        })
+      })
+    })
+  });
+});
+process.env.NODE_ENV !== "production" && (se.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * Add a custom transition end trigger. Called with the transitioning DOM
+   * node and a done callback. Allows for more fine grained transition end
+   * logic. Note: Timeouts are still used as a fallback if provided.
+   */
+  addEndListener: i.func,
+  /**
+   * The content node to be collapsed.
+   */
+  children: i.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: i.object,
+  /**
+   * @ignore
+   */
+  className: i.string,
+  /**
+   * The width (horizontal) or height (vertical) of the container when collapsed.
+   * @default '0px'
+   */
+  collapsedSize: i.oneOfType([i.number, i.string]),
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: Qe,
+  /**
+   * The transition timing function.
+   * You may specify a single easing or a object containing enter and exit values.
+   */
+  easing: i.oneOfType([i.shape({
+    enter: i.string,
+    exit: i.string
+  }), i.string]),
+  /**
+   * If `true`, the component will transition in.
+   */
+  in: i.bool,
+  /**
+   * @ignore
+   */
+  onEnter: i.func,
+  /**
+   * @ignore
+   */
+  onEntered: i.func,
+  /**
+   * @ignore
+   */
+  onEntering: i.func,
+  /**
+   * @ignore
+   */
+  onExit: i.func,
+  /**
+   * @ignore
+   */
+  onExited: i.func,
+  /**
+   * @ignore
+   */
+  onExiting: i.func,
+  /**
+   * The transition orientation.
+   * @default 'vertical'
+   */
+  orientation: i.oneOf(["horizontal", "vertical"]),
+  /**
+   * @ignore
+   */
+  style: i.object,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: i.oneOfType([i.arrayOf(i.oneOfType([i.func, i.object, i.bool])), i.func, i.object]),
+  /**
+   * The duration for the transition, in milliseconds.
+   * You may specify a single timeout for all transitions, or individually with an object.
+   *
+   * Set to 'auto' to automatically calculate transition time based on height.
+   * @default duration.standard
+   */
+  timeout: i.oneOfType([i.oneOf(["auto"]), i.number, i.shape({
+    appear: i.number,
+    enter: i.number,
+    exit: i.number
+  })])
+});
+se && (se.muiSupportAuto = !0);
+const it = ae(/* @__PURE__ */ x("path", {
+  d: "M7.41 8.59 12 13.17l4.59-4.58L18 10l-6 6-6-6z"
+}), "KeyboardArrowDown"), st = ae(/* @__PURE__ */ x("path", {
+  d: "M8.59 16.59 13.17 12 8.59 7.41 10 6l6 6-6 6z"
+}), "KeyboardArrowRight"), he = /* @__PURE__ */ new Set();
+function at(e, t = "warning") {
+  if (process.env.NODE_ENV === "production")
+    return;
+  const o = Array.isArray(e) ? e.join(`
+`) : e;
+  he.has(o) || (he.add(o), t === "error" ? console.error(o) : console.warn(o));
+}
+function lt(e) {
+  return Ue;
+}
+let ye = 0;
+const Yt = () => (ye += 1, `mui-tree-view-${ye}`), dt = ({
+  id: e,
+  treeId: t = "",
+  itemId: o
+}) => e ?? `${t}-${o}`, Ee = /* @__PURE__ */ R.createContext(null);
+process.env.NODE_ENV !== "production" && (Ee.displayName = "TreeViewContext");
+const ne = () => {
+  const e = R.useContext(Ee);
+  if (e == null)
+    throw new Error(["MUI X: Could not find the Tree View context.", "It looks like you rendered your component outside of a SimpleTreeView or RichTreeView parent component.", "This can also happen if you are bundling multiple versions of the Tree View."].join(`
+`));
+  return e;
+}, Re = /* @__PURE__ */ R.createContext(() => -1);
+process.env.NODE_ENV !== "production" && (Re.displayName = "TreeViewItemDepthContext");
+const Se = (e, t) => {
+  let o = t.length - 1;
+  for (; o >= 0 && !e.isItemNavigable(t[o]); )
+    o -= 1;
+  if (o !== -1)
+    return t[o];
+}, ct = (e, t) => {
+  const o = e.getItemMeta(t), s = e.getItemOrderedChildrenIds(o.parentId), p = e.getItemIndex(t);
+  if (p === 0)
+    return o.parentId;
+  let d = p - 1;
+  for (; !e.isItemNavigable(s[d]) && d >= 0; )
+    d -= 1;
+  if (d === -1)
+    return o.parentId == null ? null : ct(e, o.parentId);
+  let g = s[d], l = Se(e, e.getItemOrderedChildrenIds(g));
+  for (; e.isItemExpanded(g) && l != null; )
+    g = l, l = e.getItemOrderedChildrenIds(g).find(e.isItemNavigable);
+  return g;
+}, pt = (e, t) => {
+  if (e.isItemExpanded(t)) {
+    const s = e.getItemOrderedChildrenIds(t).find(e.isItemNavigable);
+    if (s != null)
+      return s;
+  }
+  let o = e.getItemMeta(t);
+  for (; o != null; ) {
+    const s = e.getItemOrderedChildrenIds(o.parentId), p = e.getItemIndex(o.id);
+    if (p < s.length - 1) {
+      let d = p + 1;
+      for (; !e.isItemNavigable(s[d]) && d < s.length - 1; )
+        d += 1;
+      if (e.isItemNavigable(s[d]))
+        return s[d];
+    }
+    o = e.getItemMeta(o.parentId);
+  }
+  return null;
+}, Jt = (e) => {
+  let t = null;
+  for (; t == null || e.isItemExpanded(t); ) {
+    const o = e.getItemOrderedChildrenIds(t), s = Se(e, o);
+    if (s == null)
+      return t;
+    t = s;
+  }
+  return t;
+}, ut = (e) => e.getItemOrderedChildrenIds(null).find(e.isItemNavigable), gt = (e, t, o) => {
+  if (t === o)
+    return [t, o];
+  const s = e.getItemMeta(t), p = e.getItemMeta(o);
+  if (s.parentId === p.id || p.parentId === s.id)
+    return p.parentId === s.id ? [s.id, p.id] : [p.id, s.id];
+  const d = [s.id], g = [p.id];
+  let l = s.parentId, m = p.parentId, c = g.indexOf(l) !== -1, h = d.indexOf(m) !== -1, b = !0, C = !0;
+  for (; !h && !c; )
+    b && (d.push(l), c = g.indexOf(l) !== -1, b = l !== null, !c && b && (l = e.getItemMeta(l).parentId)), C && !c && (g.push(m), h = d.indexOf(m) !== -1, C = m !== null, !h && C && (m = e.getItemMeta(m).parentId));
+  const r = c ? l : m, y = e.getItemOrderedChildrenIds(r), S = d[d.indexOf(r) - 1], F = g[g.indexOf(r) - 1];
+  return y.indexOf(S) < y.indexOf(F) ? [t, o] : [o, t];
+}, Qt = (e, t, o) => {
+  const s = (m) => {
+    if (e.isItemExpandable(m) && e.isItemExpanded(m))
+      return e.getItemOrderedChildrenIds(m)[0];
+    let c = e.getItemMeta(m);
+    for (; c != null; ) {
+      const h = e.getItemOrderedChildrenIds(c.parentId), b = e.getItemIndex(c.id);
+      if (b < h.length - 1)
+        return h[b + 1];
+      c = e.getItemMeta(c.parentId);
+    }
+    throw new Error("Invalid range");
+  }, [p, d] = gt(e, t, o), g = [p];
+  let l = p;
+  for (; l !== d; )
+    l = s(l), e.isItemDisabled(l) || g.push(l);
+  return g;
+}, Zt = (e) => {
+  let t = ut(e);
+  const o = [];
+  for (; t != null; )
+    o.push(t), t = pt(e, t);
+  return o;
+}, xe = (e, t) => t !== e.closest('*[role="treeitem"]'), de = (e, t) => e.getAvailablePlugins().has(t), ft = ({
+  props: e
+}) => {
+  const {
+    instance: t
+  } = ne(), {
+    label: o,
+    itemId: s
+  } = e, [p, d] = R.useState(o), g = t.isItemBeingEdited(s);
+  return R.useEffect(() => {
+    g || d(o);
+  }, [g, o]), {
+    propsEnhancers: {
+      labelInput: ({
+        externalEventHandlers: l,
+        interactions: m
+      }) => t.isItemEditable(s) ? {
+        value: p ?? "",
+        "data-element": "labelInput",
+        onChange: (r) => {
+          var y;
+          (y = l.onChange) == null || y.call(l, r), d(r.target.value);
+        },
+        onKeyDown: (r) => {
+          var S;
+          if ((S = l.onKeyDown) == null || S.call(l, r), r.defaultMuiPrevented)
+            return;
+          const y = r.target;
+          r.key === "Enter" && y.value ? m.handleSaveItemLabel(r, y.value) : r.key === "Escape" && m.handleCancelItemLabelEditing(r);
+        },
+        onBlur: (r) => {
+          var y;
+          (y = l.onBlur) == null || y.call(l, r), !r.defaultMuiPrevented && r.target.value && m.handleSaveItemLabel(r, r.target.value);
+        },
+        autoFocus: !0,
+        type: "text"
+      } : {}
+    }
+  };
+}, G = ({
+  instance: e,
+  state: t,
+  setState: o,
+  params: s
+}) => {
+  const p = R.useRef(t.editedItemId), d = (b) => p.current === b, g = (b) => {
+    o((C) => f({}, C, {
+      editedItemId: b
+    })), p.current = b;
+  }, l = (b) => b === t.editedItemId, m = !!s.isItemEditable, c = (b) => {
+    if (b == null || !m)
+      return !1;
+    const C = e.getItem(b);
+    return C ? typeof s.isItemEditable == "function" ? s.isItemEditable(C) : !!s.isItemEditable : !1;
+  }, h = (b, C) => {
+    if (!C)
+      throw new Error(["MUI X: The Tree View component requires all items to have a `label` property.", "The label of an item cannot be empty.", b].join(`
+`));
+    o((r) => {
+      const y = r.items.itemMetaMap[b];
+      return y.label !== C ? f({}, r, {
+        items: f({}, r.items, {
+          itemMetaMap: f({}, r.items.itemMetaMap, {
+            [b]: f({}, y, {
+              label: C
+            })
+          })
+        })
+      }) : r;
+    }), s.onItemLabelChange && s.onItemLabelChange(b, C);
+  };
+  return {
+    instance: {
+      setEditedItemId: g,
+      isItemBeingEdited: l,
+      updateItemLabel: h,
+      isItemEditable: c,
+      isTreeViewEditable: m,
+      isItemBeingEditedRef: d
+    },
+    publicAPI: {
+      updateItemLabel: h
+    }
+  };
+};
+G.itemPlugin = ft;
+G.getDefaultizedParams = ({
+  params: e,
+  experimentalFeatures: t
+}) => {
+  const o = t == null ? void 0 : t.labelEditing;
+  return process.env.NODE_ENV !== "production" && e.isItemEditable && !o && at(["MUI X: The label editing feature requires the `labelEditing` experimental feature to be enabled.", "You can do it by passing `experimentalFeatures={{ labelEditing: true}}` to the Rich Tree View Pro component.", "Check the documentation for more details: https://mui.com/x/react-tree-view/rich-tree-view/editing/"]), f({}, e, {
+    isItemEditable: o ? e.isItemEditable ?? !1 : !1
+  });
+};
+G.getInitialState = () => ({
+  editedItemId: null
+});
+G.params = {
+  onItemLabelChange: !0,
+  isItemEditable: !0
+};
+const mt = A("div", {
+  name: "MuiTreeItem2DragAndDropOverlay",
+  slot: "Root",
+  overridesResolver: (e, t) => t.root,
+  shouldForwardProp: (e) => le(e) && e !== "action"
+})(({
+  theme: e
+}) => ({
+  position: "absolute",
+  left: 0,
+  display: "flex",
+  top: 0,
+  bottom: 0,
+  right: 0,
+  pointerEvents: "none",
+  variants: [{
+    props: {
+      action: "make-child"
+    },
+    style: {
+      marginLeft: "calc(var(--TreeView-indentMultiplier) * var(--TreeView-itemDepth))",
+      borderRadius: e.shape.borderRadius,
+      backgroundColor: e.vars ? `rgba(${e.vars.palette.primary.darkChannel} / ${e.vars.palette.action.focusOpacity})` : oe(e.palette.primary.dark, e.palette.action.focusOpacity)
+    }
+  }, {
+    props: {
+      action: "reorder-above"
+    },
+    style: {
+      marginLeft: "calc(var(--TreeView-indentMultiplier) * var(--TreeView-itemDepth))",
+      borderTop: `1px solid ${(e.vars || e).palette.action.active}`
+    }
+  }, {
+    props: {
+      action: "reorder-below"
+    },
+    style: {
+      marginLeft: "calc(var(--TreeView-indentMultiplier) * var(--TreeView-itemDepth))",
+      borderBottom: `1px solid ${(e.vars || e).palette.action.active}`
+    }
+  }, {
+    props: {
+      action: "move-to-parent"
+    },
+    style: {
+      marginLeft: "calc(var(--TreeView-indentMultiplier) * calc(var(--TreeView-itemDepth) - 1))",
+      borderBottom: `1px solid ${(e.vars || e).palette.action.active}`
+    }
+  }]
+}));
+function Oe(e) {
+  return e.action == null ? null : /* @__PURE__ */ x(mt, f({}, e));
+}
+process.env.NODE_ENV !== "production" && (Oe.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
+  // ----------------------------------------------------------------------
+  action: i.oneOf(["make-child", "move-to-parent", "reorder-above", "reorder-below"]),
+  style: i.object
+});
+const bt = A("input", {
+  name: "MuiTreeItem2",
+  slot: "LabelInput",
+  overridesResolver: (e, t) => t.labelInput
+})(({
+  theme: e
+}) => f({}, e.typography.body1, {
+  width: "100%",
+  backgroundColor: e.palette.background.paper,
+  borderRadius: e.shape.borderRadius,
+  border: "none",
+  padding: "0 2px",
+  boxSizing: "border-box",
+  "&:focus": {
+    outline: `1px solid ${e.palette.primary.main}`
+  }
+}));
+function It(e) {
+  return we("MuiTreeItem", e);
+}
+const Ht = Ce("MuiTreeItem", ["root", "groupTransition", "content", "expanded", "selected", "focused", "disabled", "iconContainer", "label", "checkbox", "labelInput", "editable", "editing", "dragAndDropOverlay"]), ht = ae(/* @__PURE__ */ x("path", {
+  d: "M10 6 8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"
+}), "TreeViewExpandIcon"), yt = ae(/* @__PURE__ */ x("path", {
+  d: "M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z"
+}), "TreeViewCollapseIcon");
+function pe(e) {
+  const {
+    children: t,
+    itemId: o
+  } = e, {
+    wrapItem: s,
+    instance: p
+  } = ne();
+  return s({
+    children: t,
+    itemId: o,
+    instance: p
+  });
+}
+pe.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
+  // ----------------------------------------------------------------------
+  children: i.node,
+  itemId: i.string.isRequired
+};
+const De = (e) => Array.isArray(e) ? e.length > 0 && e.some(De) : !!e, xt = ({
+  itemId: e,
+  children: t
+}) => {
+  const {
+    instance: o,
+    selection: {
+      multiSelect: s
+    },
+    publicAPI: p
+  } = ne(), d = {
+    expandable: De(t),
+    expanded: o.isItemExpanded(e),
+    focused: o.isItemFocused(e),
+    selected: o.isItemSelected(e),
+    disabled: o.isItemDisabled(e),
+    editing: o != null && o.isItemBeingEdited ? o == null ? void 0 : o.isItemBeingEdited(e) : !1,
+    editable: o.isItemEditable ? o.isItemEditable(e) : !1
+  }, g = (r) => {
+    if (d.disabled)
+      return;
+    d.focused || o.focusItem(r, e);
+    const y = s && (r.shiftKey || r.ctrlKey || r.metaKey);
+    d.expandable && !(y && o.isItemExpanded(e)) && o.toggleItemExpansion(r, e);
+  }, l = (r) => {
+    if (d.disabled)
+      return;
+    d.focused || o.focusItem(r, e), s && (r.shiftKey || r.ctrlKey || r.metaKey) ? r.shiftKey ? o.expandSelectionRange(r, e) : o.selectItem({
+      event: r,
+      itemId: e,
+      keepExistingSelection: !0
+    }) : o.selectItem({
+      event: r,
+      itemId: e,
+      shouldBeSelected: !0
+    });
+  }, m = (r) => {
+    const y = r.nativeEvent.shiftKey;
+    s && y ? o.expandSelectionRange(r, e) : o.selectItem({
+      event: r,
+      itemId: e,
+      keepExistingSelection: s,
+      shouldBeSelected: r.target.checked
+    });
+  }, c = () => {
+    de(o, G) && o.isItemEditable(e) && (o.isItemBeingEdited(e) ? o.setEditedItemId(null) : o.setEditedItemId(e));
+  };
+  return {
+    interactions: {
+      handleExpansion: g,
+      handleSelection: l,
+      handleCheckboxSelection: m,
+      toggleItemEditing: c,
+      handleSaveItemLabel: (r, y) => {
+        de(o, G) && o.isItemBeingEditedRef(e) && (o.updateItemLabel(e, y), c(), o.focusItem(r, e));
+      },
+      handleCancelItemLabelEditing: (r) => {
+        de(o, G) && o.isItemBeingEditedRef(e) && (c(), o.focusItem(r, e));
+      }
+    },
+    status: d,
+    publicAPI: p
+  };
+}, Ct = (e) => {
+  const {
+    runItemPlugins: t,
+    items: {
+      onItemClick: o,
+      disabledItemsFocusable: s,
+      indentationAtItemLevel: p
+    },
+    selection: {
+      disableSelection: d,
+      checkboxSelection: g
+    },
+    expansion: {
+      expansionTrigger: l
+    },
+    treeId: m,
+    instance: c,
+    publicAPI: h
+  } = ne(), b = R.useContext(Re), {
+    id: C,
+    itemId: r,
+    label: y,
+    children: S,
+    rootRef: F
+  } = e, {
+    rootRef: X,
+    contentRef: _,
+    propsEnhancers: T
+  } = t(e), {
+    interactions: E,
+    status: P
+  } = xt({
+    itemId: r,
+    children: S
+  }), w = R.useRef(null), O = R.useRef(null), U = ce(F, X, w), Y = ce(_, O), D = R.useRef(null), j = dt({
+    itemId: r,
+    treeId: m,
+    id: C
+  }), q = c.canItemBeTabbed(r) ? 0 : -1, M = {
+    rootRefObject: w,
+    contentRefObject: O,
+    interactions: E
+  }, z = (a) => (n) => {
+    var v;
+    if ((v = a.onFocus) == null || v.call(a, n), n.defaultMuiPrevented)
+      return;
+    const u = !P.disabled || s;
+    !P.focused && u && n.currentTarget === n.target && c.focusItem(n, r);
+  }, $ = (a) => (n) => {
+    var v, V, te, fe, me;
+    if ((v = a.onBlur) == null || v.call(a, n), n.defaultMuiPrevented)
+      return;
+    const u = c.getItemDOMElement(r);
+    P.editing || // we can exit the editing state by clicking outside the input (within the Tree Item) or by pressing Enter or Escape -> we don't want to remove the focused item from the state in these cases
+    // we can also exit the editing state by clicking on the root itself -> want to remove the focused item from the state in this case
+    n.relatedTarget && xe(n.relatedTarget, u) && (n.target && ((te = (V = n.target) == null ? void 0 : V.dataset) == null ? void 0 : te.element) === "labelInput" && xe(n.target, u) || ((me = (fe = n.relatedTarget) == null ? void 0 : fe.dataset) == null ? void 0 : me.element) === "labelInput") || c.removeFocusedItem();
+  }, H = (a) => (n) => {
+    var u, v, V;
+    (u = a.onKeyDown) == null || u.call(a, n), !(n.defaultMuiPrevented || ((V = (v = n.target) == null ? void 0 : v.dataset) == null ? void 0 : V.element) === "labelInput") && c.handleItemKeyDown(n, r);
+  }, N = (a) => (n) => {
+    var u;
+    (u = a.onDoubleClick) == null || u.call(a, n), !n.defaultMuiPrevented && E.toggleItemEditing();
+  }, W = (a) => (n) => {
+    var u, v;
+    (u = a.onClick) == null || u.call(a, n), o == null || o(n, r), !(n.defaultMuiPrevented || (v = D.current) != null && v.contains(n.target)) && (l === "content" && E.handleExpansion(n), g || E.handleSelection(n));
+  }, J = (a) => (n) => {
+    var u;
+    (u = a.onMouseDown) == null || u.call(a, n), !n.defaultMuiPrevented && (n.shiftKey || n.ctrlKey || n.metaKey || P.disabled) && n.preventDefault();
+  }, ee = (a) => (n) => {
+    var u;
+    (u = a.onChange) == null || u.call(a, n), !n.defaultMuiPrevented && (d || P.disabled || E.handleCheckboxSelection(n));
+  }, Q = (a) => (n) => {
+    var u;
+    (u = a.onClick) == null || u.call(a, n), !n.defaultMuiPrevented && l === "iconContainer" && E.handleExpansion(n);
+  };
+  return {
+    getRootProps: (a = {}) => {
+      var te;
+      const n = f({}, B(e), B(a));
+      let u;
+      P.selected ? u = !0 : d || P.disabled ? u = void 0 : u = !1;
+      const v = f({}, n, {
+        ref: U,
+        role: "treeitem",
+        tabIndex: q,
+        id: j,
+        "aria-expanded": P.expandable ? P.expanded : void 0,
+        "aria-selected": u,
+        "aria-disabled": P.disabled || void 0
+      }, a, {
+        onFocus: z(n),
+        onBlur: $(n),
+        onKeyDown: H(n)
+      });
+      p && (v.style = {
+        "--TreeView-itemDepth": typeof b == "function" ? b(r) : b
+      });
+      const V = ((te = T.root) == null ? void 0 : te.call(T, f({}, M, {
+        externalEventHandlers: n
+      }))) ?? {};
+      return f({}, v, V);
+    },
+    getContentProps: (a = {}) => {
+      var V;
+      const n = B(a), u = f({}, n, a, {
+        ref: Y,
+        onClick: W(n),
+        onMouseDown: J(n),
+        status: P
+      });
+      p && (u.indentationAtItemLevel = !0);
+      const v = ((V = T.content) == null ? void 0 : V.call(T, f({}, M, {
+        externalEventHandlers: n
+      }))) ?? {};
+      return f({}, u, v);
+    },
+    getGroupTransitionProps: (a = {}) => {
+      const n = B(a), u = f({}, n, {
+        unmountOnExit: !0,
+        component: "ul",
+        role: "group",
+        in: P.expanded,
+        children: S
+      }, a);
+      return p && (u.indentationAtItemLevel = !0), u;
+    },
+    getIconContainerProps: (a = {}) => {
+      const n = B(a);
+      return f({}, n, a, {
+        onClick: Q(n)
+      });
+    },
+    getCheckboxProps: (a = {}) => {
+      const n = B(a);
+      return f({}, n, {
+        visible: g,
+        ref: D,
+        checked: P.selected,
+        disabled: d || P.disabled,
+        tabIndex: -1
+      }, a, {
+        onChange: ee(n)
+      });
+    },
+    getLabelProps: (a = {}) => {
+      const n = f({}, B(a)), u = f({}, n, {
+        children: y
+      }, a, {
+        onDoubleClick: N(n)
+      });
+      return c.isTreeViewEditable && (u.editable = P.editable), u;
+    },
+    getLabelInputProps: (a = {}) => {
+      var v;
+      const n = B(a), u = ((v = T.labelInput) == null ? void 0 : v.call(T, {
+        rootRefObject: w,
+        contentRefObject: O,
+        externalEventHandlers: n,
+        interactions: E
+      })) ?? {};
+      return f({}, a, u);
+    },
+    getDragAndDropOverlayProps: (a = {}) => {
+      var v;
+      const n = B(a), u = ((v = T.dragAndDropOverlay) == null ? void 0 : v.call(T, f({}, M, {
+        externalEventHandlers: n
+      }))) ?? {};
+      return f({}, a, u);
+    },
+    rootRef: U,
+    status: P,
+    publicAPI: h
+  };
+}, Me = Ct;
+function ke(e) {
+  const {
+    slots: t,
+    slotProps: o,
+    status: s
+  } = e, p = ne(), d = f({}, p.icons.slots, {
+    expandIcon: p.icons.slots.expandIcon ?? ht,
+    collapseIcon: p.icons.slots.collapseIcon ?? yt
+  }), g = p.icons.slotProps;
+  let l;
+  t != null && t.icon ? l = "icon" : s.expandable ? s.expanded ? l = "collapseIcon" : l = "expandIcon" : l = "endIcon";
+  const m = (t == null ? void 0 : t[l]) ?? d[l], c = K({
+    elementType: m,
+    externalSlotProps: (h) => f({}, be(g[l], h), be(o == null ? void 0 : o[l], h)),
+    // TODO: Add proper ownerState
+    ownerState: {}
+  });
+  return m ? /* @__PURE__ */ x(m, f({}, c)) : null;
+}
+process.env.NODE_ENV !== "production" && (ke.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
+  // ----------------------------------------------------------------------
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps: i.object,
+  /**
+   * Overridable component slots.
+   * @default {}
+   */
+  slots: i.object,
+  status: i.shape({
+    disabled: i.bool.isRequired,
+    editable: i.bool.isRequired,
+    editing: i.bool.isRequired,
+    expandable: i.bool.isRequired,
+    expanded: i.bool.isRequired,
+    focused: i.bool.isRequired,
+    selected: i.bool.isRequired
+  }).isRequired
+});
+const wt = ["visible"], Tt = ["id", "itemId", "label", "disabled", "children", "slots", "slotProps"], vt = lt(), Le = A("li", {
+  name: "MuiTreeItem2",
+  slot: "Root",
+  overridesResolver: (e, t) => t.root
+})({
+  listStyle: "none",
+  margin: 0,
+  padding: 0,
+  outline: 0
+}), Ne = A("div", {
+  name: "MuiTreeItem2",
+  slot: "Content",
+  overridesResolver: (e, t) => t.content,
+  shouldForwardProp: (e) => le(e) && e !== "status" && e !== "indentationAtItemLevel"
+})(({
+  theme: e
+}) => ({
+  padding: e.spacing(0.5, 1),
+  borderRadius: e.shape.borderRadius,
+  width: "100%",
+  boxSizing: "border-box",
+  // prevent width + padding to overflow
+  position: "relative",
+  display: "flex",
+  alignItems: "center",
+  gap: e.spacing(1),
+  cursor: "pointer",
+  WebkitTapHighlightColor: "transparent",
+  "&:hover": {
+    backgroundColor: (e.vars || e).palette.action.hover,
+    // Reset on touch devices, it doesn't add specificity
+    "@media (hover: none)": {
+      backgroundColor: "transparent"
+    }
+  },
+  variants: [{
+    props: {
+      indentationAtItemLevel: !0
+    },
+    style: {
+      paddingLeft: `calc(${e.spacing(1)} + var(--TreeView-itemChildrenIndentation) * var(--TreeView-itemDepth))`
+    }
+  }, {
+    props: ({
+      status: t
+    }) => t.disabled,
+    style: {
+      opacity: (e.vars || e).palette.action.disabledOpacity,
+      backgroundColor: "transparent"
+    }
+  }, {
+    props: ({
+      status: t
+    }) => t.focused,
+    style: {
+      backgroundColor: (e.vars || e).palette.action.focus
+    }
+  }, {
+    props: ({
+      status: t
+    }) => t.selected,
+    style: {
+      backgroundColor: e.vars ? `rgba(${e.vars.palette.primary.mainChannel} / ${e.vars.palette.action.selectedOpacity})` : oe(e.palette.primary.main, e.palette.action.selectedOpacity),
+      "&:hover": {
+        backgroundColor: e.vars ? `rgba(${e.vars.palette.primary.mainChannel} / calc(${e.vars.palette.action.selectedOpacity} + ${e.vars.palette.action.hoverOpacity}))` : oe(e.palette.primary.main, e.palette.action.selectedOpacity + e.palette.action.hoverOpacity),
+        // Reset on touch devices, it doesn't add specificity
+        "@media (hover: none)": {
+          backgroundColor: e.vars ? `rgba(${e.vars.palette.primary.mainChannel} / ${e.vars.palette.action.selectedOpacity})` : oe(e.palette.primary.main, e.palette.action.selectedOpacity)
+        }
+      }
+    }
+  }, {
+    props: ({
+      status: t
+    }) => t.selected && t.focused,
+    style: {
+      backgroundColor: e.vars ? `rgba(${e.vars.palette.primary.mainChannel} / calc(${e.vars.palette.action.selectedOpacity} + ${e.vars.palette.action.focusOpacity}))` : oe(e.palette.primary.main, e.palette.action.selectedOpacity + e.palette.action.focusOpacity)
+    }
+  }]
+})), Ae = A("div", {
+  name: "MuiTreeItem2",
+  slot: "Label",
+  overridesResolver: (e, t) => t.label,
+  shouldForwardProp: (e) => le(e) && e !== "editable"
+})(({
+  theme: e
+}) => f({
+  width: "100%",
+  boxSizing: "border-box",
+  // prevent width + padding to overflow
+  // fixes overflow - see https://github.com/mui/material-ui/issues/27372
+  minWidth: 0,
+  position: "relative",
+  overflow: "hidden"
+}, e.typography.body1, {
+  variants: [{
+    props: ({
+      editable: t
+    }) => t,
+    style: {
+      paddingLeft: "2px"
+    }
+  }]
+})), Ve = A("div", {
+  name: "MuiTreeItem2",
+  slot: "IconContainer",
+  overridesResolver: (e, t) => t.iconContainer
+})({
+  width: 16,
+  display: "flex",
+  flexShrink: 0,
+  justifyContent: "center",
+  "& svg": {
+    fontSize: 18
+  }
+}), ze = A(se, {
+  name: "MuiTreeItem2",
+  slot: "GroupTransition",
+  overridesResolver: (e, t) => t.groupTransition,
+  shouldForwardProp: (e) => le(e) && e !== "indentationAtItemLevel"
+})({
+  margin: 0,
+  padding: 0,
+  paddingLeft: "var(--TreeView-itemChildrenIndentation)",
+  variants: [{
+    props: {
+      indentationAtItemLevel: !0
+    },
+    style: {
+      paddingLeft: 0
+    }
+  }]
+}), Pt = A(/* @__PURE__ */ R.forwardRef((e, t) => {
+  const {
+    visible: o
+  } = e, s = ve(e, wt);
+  return o ? /* @__PURE__ */ x(Ze, f({}, s, {
+    ref: t
+  })) : null;
+}), {
+  name: "MuiTreeItem2",
+  slot: "Checkbox",
+  overridesResolver: (e, t) => t.checkbox
+})({
+  padding: 0
+}), Et = (e) => {
+  const {
+    classes: t
+  } = e;
+  return Pe({
+    root: ["root"],
+    content: ["content"],
+    expanded: ["expanded"],
+    editing: ["editing"],
+    editable: ["editable"],
+    selected: ["selected"],
+    focused: ["focused"],
+    disabled: ["disabled"],
+    iconContainer: ["iconContainer"],
+    checkbox: ["checkbox"],
+    label: ["label"],
+    groupTransition: ["groupTransition"],
+    labelInput: ["labelInput"],
+    dragAndDropOverlay: ["dragAndDropOverlay"]
+  }, It, t);
+}, Rt = /* @__PURE__ */ R.forwardRef(function(t, o) {
+  const s = vt({
+    props: t,
+    name: "MuiTreeItem2"
+  }), {
+    id: p,
+    itemId: d,
+    label: g,
+    disabled: l,
+    children: m,
+    slots: c = {},
+    slotProps: h = {}
+  } = s, b = ve(s, Tt), {
+    getRootProps: C,
+    getContentProps: r,
+    getIconContainerProps: y,
+    getCheckboxProps: S,
+    getLabelProps: F,
+    getGroupTransitionProps: X,
+    getLabelInputProps: _,
+    getDragAndDropOverlayProps: T,
+    status: E
+  } = Me({
+    id: p,
+    itemId: d,
+    children: m,
+    label: g,
+    disabled: l
+  }), P = f({}, s, E), w = Et(P), O = c.root ?? Le, U = K({
+    elementType: O,
+    getSlotProps: C,
+    externalForwardedProps: b,
+    externalSlotProps: h.root,
+    additionalProps: {
+      ref: o
+    },
+    ownerState: {},
+    className: w.root
+  }), Y = c.content ?? Ne, D = K({
+    elementType: Y,
+    getSlotProps: r,
+    externalSlotProps: h.content,
+    ownerState: {},
+    className: Te(w.content, E.expanded && w.expanded, E.selected && w.selected, E.focused && w.focused, E.disabled && w.disabled, E.editing && w.editing, E.editable && w.editable)
+  }), j = c.iconContainer ?? Ve, q = K({
+    elementType: j,
+    getSlotProps: y,
+    externalSlotProps: h.iconContainer,
+    ownerState: {},
+    className: w.iconContainer
+  }), M = c.label ?? Ae, z = K({
+    elementType: M,
+    getSlotProps: F,
+    externalSlotProps: h.label,
+    ownerState: {},
+    className: w.label
+  }), $ = c.checkbox ?? Pt, H = K({
+    elementType: $,
+    getSlotProps: S,
+    externalSlotProps: h.checkbox,
+    ownerState: {},
+    className: w.checkbox
+  }), N = c.groupTransition ?? void 0, W = K({
+    elementType: N,
+    getSlotProps: X,
+    externalSlotProps: h.groupTransition,
+    ownerState: {},
+    className: w.groupTransition
+  }), J = c.labelInput ?? bt, ee = K({
+    elementType: J,
+    getSlotProps: _,
+    externalSlotProps: h.labelInput,
+    ownerState: {},
+    className: w.labelInput
+  }), Q = c.dragAndDropOverlay ?? Oe, re = K({
+    elementType: Q,
+    getSlotProps: T,
+    externalSlotProps: h.dragAndDropOverlay,
+    ownerState: {},
+    className: w.dragAndDropOverlay
+  });
+  return /* @__PURE__ */ x(pe, {
+    itemId: d,
+    children: /* @__PURE__ */ ie(O, f({}, U, {
+      children: [/* @__PURE__ */ ie(Y, f({}, D, {
+        children: [/* @__PURE__ */ x(j, f({}, q, {
+          children: /* @__PURE__ */ x(ke, {
+            status: E,
+            slots: c,
+            slotProps: h
+          })
+        })), /* @__PURE__ */ x($, f({}, H)), E.editing ? /* @__PURE__ */ x(J, f({}, ee)) : /* @__PURE__ */ x(M, f({}, z)), /* @__PURE__ */ x(Q, f({}, re))]
+      })), m && /* @__PURE__ */ x(ze, f({
+        as: N
+      }, W))]
+    }))
+  });
+});
+process.env.NODE_ENV !== "production" && (Rt.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
+  // ----------------------------------------------------------------------
+  /**
+   * The content of the component.
+   */
+  children: i.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: i.object,
+  className: i.string,
+  /**
+   * If `true`, the item is disabled.
+   * @default false
+   */
+  disabled: i.bool,
+  /**
+   * The id attribute of the item. If not provided, it will be generated.
+   */
+  id: i.string,
+  /**
+   * The id of the item.
+   * Must be unique.
+   */
+  itemId: i.string.isRequired,
+  /**
+   * The label of the item.
+   */
+  label: i.node,
+  /**
+   * Callback fired when the item root is blurred.
+   */
+  onBlur: i.func,
+  /**
+   * This prop isn't supported.
+   * Use the `onItemFocus` callback on the tree if you need to monitor an item's focus.
+   */
+  onFocus: He,
+  /**
+   * Callback fired when a key is pressed on the keyboard and the tree is in focus.
+   */
+  onKeyDown: i.func,
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps: i.object,
+  /**
+   * Overridable component slots.
+   * @default {}
+   */
+  slots: i.object
+});
+function eo(e) {
+  const {
+    id: t,
+    itemId: o,
+    label: s,
+    disabled: p,
+    children: d,
+    itemData: g,
+    iconColor: l = "primary",
+    ref: m
+  } = e, c = qe(
+    g == null ? void 0 : g.iconType,
+    g == null ? void 0 : g.customIcon
+  ), {
+    getRootProps: h,
+    getContentProps: b,
+    getLabelProps: C,
+    getGroupTransitionProps: r,
+    getIconContainerProps: y,
+    status: S
+  } = Me({ id: t, itemId: o, label: s, disabled: p, children: d, rootRef: m });
+  return /* @__PURE__ */ x(pe, { itemId: o, children: /* @__PURE__ */ ie(
+    Le,
+    {
+      ...h(),
+      "data-treeview-item": o || "",
+      "data-treeview-item-label": s || "",
+      children: [
+        /* @__PURE__ */ ie(Ne, { ...b(), style: Ke, children: [
+          /* @__PURE__ */ x(Ve, { ...y(), children: /* @__PURE__ */ x(c, { fontSize: "small", color: l }) }),
+          /* @__PURE__ */ x(Ae, { ...C() }),
+          /* @__PURE__ */ x(Be, { sx: Fe, children: S.expandable && (S.expanded ? /* @__PURE__ */ x(it, { fontSize: "small" }) : /* @__PURE__ */ x(st, { fontSize: "small" })) })
+        ] }),
+        d && /* @__PURE__ */ x(
+          ze,
+          {
+            ...r(),
+            style: S.expanded ? je : void 0
+          }
+        )
+      ]
+    }
+  ) });
+}
+export {
+  se as C,
+  Ee as T,
+  Yt as a,
+  dt as b,
+  Xt as c,
+  Re as d,
+  Jt as e,
+  ut as f,
+  et as g,
+  gt as h,
+  Zt as i,
+  Qt as j,
+  xe as k,
+  pt as l,
+  ct as m,
+  de as n,
+  ne as o,
+  bt as p,
+  Oe as q,
+  lt as r,
+  yt as s,
+  ht as t,
+  G as u,
+  pe as v,
+  at as w,
+  It as x,
+  Ht as y,
+  eo as z
+};