@frontify/fondue 13.4.3 → 13.4.5

package/dist/components/Tree/TreeItem/TreeItem.es.js

@@ -1,36 +1,36 @@
-import { jsx as N, jsxs as as } from "react/jsx-runtime";
-import { memo as rs, forwardRef as os, useRef as ns, useEffect as ds, useCallback as v, Children as gt, useMemo as z, createElement as ls } from "react";
-import { useDndContext as ps, useDndMonitor as us } from "@dnd-kit/core";
-import { useSortable as is } from "@dnd-kit/sortable";
-import { CSS as cs } from "@dnd-kit/utilities";
-import { noop as ms } from "lodash-es";
-import { TreeItemColorsClassMap as fs, TreeItemBorderRadiusClassMap as L, TreeItemSpacingClassMap as ws, TreeItemBorderClassMap as Tt, TreeItemBorderStyleClassMap as hs, TreeItemShadowClassMap as bs } from "../types.es.js";
+import { jsx as b, jsxs as as } from "react/jsx-runtime";
+import { useDndContext as rs, useDndMonitor as os } from "@dnd-kit/core";
+import { useSortable as ns } from "@dnd-kit/sortable";
+import { CSS as ds } from "@dnd-kit/utilities";
+import { noop as ls } from "lodash-es";
+import { memo as ps, forwardRef as us, useRef as is, useEffect as cs, useCallback as v, Children as gt, useMemo as z } from "react";
+import { TreeItemColorsClassMap as ms, TreeItemBorderRadiusClassMap as L, TreeItemSpacingClassMap as fs, TreeItemBorderClassMap as Tt, TreeItemBorderStyleClassMap as ws, TreeItemShadowClassMap as hs } from "../types.es.js";
 import { useDebounce as St } from "../../../hooks/useDebounce.es.js";
-import { PARENT_FOCUS_VISIBLE_STYLE as ys, FOCUS_VISIBLE_STYLE as Is } from "../../../utilities/focusStyle.es.js";
-import { merge as b } from "../../../utilities/merge.es.js";
-import { DragHandle as gs } from "./DragHandle.es.js";
-import { ExpandButton as Ts } from "./ExpandButton.es.js";
-import { useTreeItem as Ss } from "./useTreeItem.es.js";
-import { removeFragmentsAndEnrichChildren as Ds } from "../utils/removeFragmentsAndEnrichChildren.es.js";
-import { useDeepCompareEffect as Ns } from "../utils/useDeepCompareEffect.es.js";
-import { INDENTATION_WIDTH as Dt, EXPAND_ONHOVER_DELAY as xs } from "../helpers/constants.es.js";
-const As = ({ isSorting: a, wasDragging: M }) => !(a || M), Es = rs(
-  os(
+import { PARENT_FOCUS_VISIBLE_STYLE as bs, FOCUS_VISIBLE_STYLE as ys } from "../../../utilities/focusStyle.es.js";
+import { merge as y } from "../../../utilities/merge.es.js";
+import { DragHandle as Is } from "./DragHandle.es.js";
+import { ExpandButton as gs } from "./ExpandButton.es.js";
+import { useTreeItem as Ts } from "./useTreeItem.es.js";
+import { removeFragmentsAndEnrichChildren as Ss } from "../utils/removeFragmentsAndEnrichChildren.es.js";
+import { useDeepCompareEffect as Ds } from "../utils/useDeepCompareEffect.es.js";
+import { INDENTATION_WIDTH as Dt, EXPAND_ONHOVER_DELAY as Ns } from "../helpers/constants.es.js";
+const xs = ({ isSorting: a, wasDragging: M }) => !(a || M), As = ps(
+  us(
     ({
       id: a,
       type: M,
-      label: y,
+      label: I,
       onDrop: W,
       accepts: Nt,
       showCaret: U,
-      children: I,
+      children: g,
       parentId: _,
       level: u = 0,
-      contentComponent: g,
+      contentComponent: T,
       onClick: H,
-      onSelect: k,
+      onSelect: R,
       onExpand: m,
-      onShrink: R,
+      onShrink: k,
       registerOverlay: x,
       registerNodeChildren: F,
       unregisterNodeChildren: d,
@@ -42,15 +42,15 @@ const As = ({ isSorting: a, wasDragging: M }) => !(a || M), Es = rs(
       itemStyle: X,
       ignoreItemDoubleClick: q = !1,
       expandOnSelect: At = !1,
-      "data-test-id": Et = "fondue-tree-item"
+      "data-test-id": Bt = "fondue-tree-item"
     }, f) => {
       var rt, ot, nt, dt, lt, pt, ut, it, ct, mt, ft, wt, ht, bt, yt;
-      const { active: o, over: E } = ps(), { isSelected: p, isExpanded: c, projection: s } = Ss(a), G = ns(), e = (o == null ? void 0 : o.id) === a, t = e && s !== null && s !== void 0 ? s : null, Bt = typeof ((ot = (rt = E == null ? void 0 : E.data) == null ? void 0 : rt.current) == null ? void 0 : ot.accepts) == "string" ? (nt = E.data.current.accepts) == null ? void 0 : nt.split(", ") : [], Ct = typeof (t == null ? void 0 : t.accepts) == "string" ? (dt = t.accepts) == null ? void 0 : dt.split(", ") : [], T = ((lt = o == null ? void 0 : o.data.current) == null ? void 0 : lt.type) || "", S = ((pt = s == null ? void 0 : s.previousNode) == null ? void 0 : pt.depth) !== void 0 && (s == null ? void 0 : s.depth) > ((ut = s == null ? void 0 : s.previousNode) == null ? void 0 : ut.depth), vt = S && s && s.depth - 1 === ((it = s == null ? void 0 : s.previousNode) == null ? void 0 : it.depth), Y = S && ((ct = s == null ? void 0 : s.previousNode) == null ? void 0 : ct.accepts) !== void 0 && (((mt = s == null ? void 0 : s.previousNode) == null ? void 0 : mt.accepts.includes(`${T}-deeper`)) || ((ft = s == null ? void 0 : s.previousNode) == null ? void 0 : ft.accepts.includes(`${T}-within`))), Lt = e && vt && ((wt = t == null ? void 0 : t.previousNode) == null ? void 0 : wt.accepts) !== void 0 && ((ht = t == null ? void 0 : t.previousNode) == null ? void 0 : ht.accepts.includes(`${T}-within`)) || (t == null ? void 0 : t.isWithinParent) && Ct.includes(`${T}-within`), D = e && (o == null ? void 0 : o.data.current) && (Bt.includes(T) && !S || Lt), J = St((r) => {
+      const { active: o, over: B } = rs(), { isSelected: p, isExpanded: c, projection: s } = Ts(a), G = is(), e = (o == null ? void 0 : o.id) === a, t = e && s !== null && s !== void 0 ? s : null, Ct = typeof ((ot = (rt = B == null ? void 0 : B.data) == null ? void 0 : rt.current) == null ? void 0 : ot.accepts) == "string" ? (nt = B.data.current.accepts) == null ? void 0 : nt.split(", ") : [], Et = typeof (t == null ? void 0 : t.accepts) == "string" ? (dt = t.accepts) == null ? void 0 : dt.split(", ") : [], S = ((lt = o == null ? void 0 : o.data.current) == null ? void 0 : lt.type) || "", D = ((pt = s == null ? void 0 : s.previousNode) == null ? void 0 : pt.depth) !== void 0 && (s == null ? void 0 : s.depth) > ((ut = s == null ? void 0 : s.previousNode) == null ? void 0 : ut.depth), vt = D && s && s.depth - 1 === ((it = s == null ? void 0 : s.previousNode) == null ? void 0 : it.depth), Y = D && ((ct = s == null ? void 0 : s.previousNode) == null ? void 0 : ct.accepts) !== void 0 && (((mt = s == null ? void 0 : s.previousNode) == null ? void 0 : mt.accepts.includes(`${S}-deeper`)) || ((ft = s == null ? void 0 : s.previousNode) == null ? void 0 : ft.accepts.includes(`${S}-within`))), Lt = e && vt && ((wt = t == null ? void 0 : t.previousNode) == null ? void 0 : wt.accepts) !== void 0 && ((ht = t == null ? void 0 : t.previousNode) == null ? void 0 : ht.accepts.includes(`${S}-within`)) || (t == null ? void 0 : t.isWithinParent) && Et.includes(`${S}-within`), N = e && (o == null ? void 0 : o.data.current) && (Ct.includes(S) && !D || Lt), J = St((r) => {
         G.current === r && (m == null || m(r));
-      }, xs);
-      ds(() => {
+      }, Ns);
+      cs(() => {
         var r, l, h;
-        e && (G.current = S ? (r = t == null ? void 0 : t.previousNode) == null ? void 0 : r.id : null), e && Y && (t != null && t.parentId) && t.previousNode && t.parentId === t.previousNode.id && t.parentId !== ((h = (l = o == null ? void 0 : o.data) == null ? void 0 : l.current) == null ? void 0 : h.parentId) && J(t == null ? void 0 : t.parentId);
+        e && (G.current = D ? (r = t == null ? void 0 : t.previousNode) == null ? void 0 : r.id : null), e && Y && (t != null && t.parentId) && t.previousNode && t.parentId === t.previousNode.id && t.parentId !== ((h = (l = o == null ? void 0 : o.data) == null ? void 0 : l.current) == null ? void 0 : h.parentId) && J(t == null ? void 0 : t.parentId);
       }, [
         o == null ? void 0 : o.data,
         t == null ? void 0 : t.parentId,
@@ -58,86 +58,86 @@ const As = ({ isSorting: a, wasDragging: M }) => !(a || M), Es = rs(
         J,
         e,
         Y,
-        S
+        D
       ]);
       const Mt = v(
         (r) => {
           var It;
           const { over: l, active: h } = r;
-          !e || !t || h.id === (l == null ? void 0 : l.id) && (t == null ? void 0 : t.depth) === ((It = h.data.current) == null ? void 0 : It.level) || e && l && D && W && W({
+          !e || !t || h.id === (l == null ? void 0 : l.id) && (t == null ? void 0 : t.depth) === ((It = h.data.current) == null ? void 0 : It.level) || e && l && N && W && W({
             id: h.id,
             parentId: t.parentId,
             sort: t.position,
-            contentComponent: g,
+            contentComponent: T,
             parentType: t.type
           });
         },
-        [e, t, D, W, g]
+        [e, t, N, W, T]
       ), Wt = v(
         (r) => {
           r.active.id === a && (x == null || x({
-            contentComponent: g,
-            children: I,
+            contentComponent: T,
+            children: g,
             id: a,
-            label: y,
+            label: I,
             level: u,
             dragHandlerPosition: i,
             showContentWhileDragging: A
           }));
         },
         [
-          I,
           g,
+          T,
           i,
           a,
-          y,
+          I,
           u,
           x,
           A
         ]
       ), _t = v(
         (r) => {
-          r.active.id === a && document.body.style.setProperty("cursor", D ? "grabbing" : "no-drop");
+          r.active.id === a && document.body.style.setProperty("cursor", N ? "grabbing" : "no-drop");
         },
-        [D, a]
+        [N, a]
       );
-      us({
+      os({
         onDragEnd: Mt,
         onDragStart: Wt,
         onDragMove: _t
       });
       const Q = v(
         (r) => {
-          r == null || r.stopPropagation(), c ? R && R(a) : m && m(a);
+          r == null || r.stopPropagation(), c ? k && k(a) : m && m(a);
         },
-        [a, c, m, R]
+        [a, c, m, k]
       ), Ht = St(
         (r) => {
-          r.stopPropagation(), !(q && r.detail >= 2) && (At && Q(), k == null || k(a), H == null || H(a));
+          r.stopPropagation(), !(q && r.detail >= 2) && (At && Q(), R == null || R(a), H == null || H(a));
         },
         q ? 300 : 0
-      ), Z = _ ? (o == null ? void 0 : o.id) === _ : !1, P = gt.count(I) > 0, { enrichedChildren: $, childrenIds: kt } = z(() => {
-        const r = Ds(I, { parentId: a, level: u + 1 });
+      ), Z = _ ? (o == null ? void 0 : o.id) === _ : !1, P = gt.count(g) > 0, { enrichedChildren: $, childrenIds: Rt } = z(() => {
+        const r = Ss(g, { parentId: a, level: u + 1 });
         return {
           enrichedChildren: r,
           childrenIds: r.map((l) => l.props.id)
         };
-      }, [I, a, u]), {
-        attributes: Rt,
+      }, [g, a, u]), {
+        attributes: kt,
         listeners: Ft,
-        transform: B,
+        transform: C,
         transition: Yt,
         setDraggableNodeRef: $t,
         setDroppableNodeRef: Vt,
         setActivatorNodeRef: zt
-      } = is({
+      } = ns({
         id: a,
         disabled: !K,
         data: { type: M, accepts: Nt, parentId: _, level: u },
-        animateLayoutChanges: As,
+        animateLayoutChanges: xs,
         transition: null
       });
-      Ns(() => {
+      Ds(() => {
         if (gt.count($) === 0) {
           d == null || d(a);
           return;
@@ -157,47 +157,47 @@ const As = ({ isSorting: a, wasDragging: M }) => !(a || M), Es = rs(
         borderStyle: "none",
         activeColorStyle: "neutral",
         ...X
-      }), [X]), w = fs[n.activeColorStyle ?? "neutral"], { liClassName: Ut, backgroundClassName: Kt } = z(() => ({
-        liClassName: b([
-          Is,
+      }), [X]), w = ms[n.activeColorStyle ?? "neutral"], { liClassName: Ut, backgroundClassName: Kt } = z(() => ({
+        liClassName: y([
+          ys,
           "tw-box-content tw-relative tw-cursor-default tw-transition-colors tw-outline-none tw-ring-inset tw-group tw-no-underline tw-leading-5",
           !e && p ? w.selectedTextColor : w.textColor,
-          ws[n.spacingY ?? "none"]
+          fs[n.spacingY ?? "none"]
         ]),
-        backgroundClassName: b([
+        backgroundClassName: y([
           "tw-block tw-absolute tw-inset-0 tw-transition-colors -tw-z-10",
           n.borderWidth !== "none" ? L[n.borderRadius ?? "small"] : "",
           !e && (!p || n.activeColorStyle !== "neutral") && w.pressedBackgroundColor,
           !e && p ? w.selectedBackgroundColor : w.backgroundColor,
-          p && ys
+          p && bs
         ])
-      }), [e, p, n, w]), Ot = A ? !0 : !e, Xt = b([
+      }), [e, p, n, w]), Ot = A ? !0 : !e, Xt = y([
         "tw-max-w-full tw-grow tw-overflow-hidden",
         e && A ? "tw-opacity-75 tw-blur-sm tw-grayscale" : ""
-      ]), qt = c && !e, j = K && !e, Gt = y !== void 0 && !e, C = !e && O && (U === void 0 ? P : U);
+      ]), qt = c && !e, j = K && !e, Gt = I !== void 0 && !e, E = !e && O && (U === void 0 ? P : U);
       let V = "";
-      !e && !c && C && Y && ((bt = s == null ? void 0 : s.previousNode) == null ? void 0 : bt.id) === a && (s == null ? void 0 : s.depth) > ((yt = s == null ? void 0 : s.previousNode) == null ? void 0 : yt.depth) && (V = b([
+      !e && !c && E && Y && ((bt = s == null ? void 0 : s.previousNode) == null ? void 0 : bt.id) === a && (s == null ? void 0 : s.depth) > ((yt = s == null ? void 0 : s.previousNode) == null ? void 0 : yt.depth) && (V = y([
         "tw-border-solid tw-border-box-selected-strong",
         L[n.borderRadius ?? "small"],
         Tt.small
       ]));
-      const Jt = n.borderWidth !== "none" && V === "" ? b([
+      const Jt = n.borderWidth !== "none" && V === "" ? y([
         Tt[n.borderWidth ?? "none"],
         L[n.borderRadius ?? "small"],
-        hs[n.borderStyle ?? "none"]
-      ]) : "", Qt = n.contentHight === "single-line" ? "tw-h-10" : "tw-h-fit", Zt = n.contentHight === "single-line" ? "tw-h-12" : "tw-h-fit", Pt = b([
+        ws[n.borderStyle ?? "none"]
+      ]) : "", Qt = n.contentHight === "single-line" ? "tw-h-10" : "tw-h-fit", Zt = n.contentHight === "single-line" ? "tw-h-12" : "tw-h-fit", Pt = y([
         "tw-relative tw-z-0 tw-transition-colors tw-flex tw-items-center tw-leading-5 tw-width-fit tw-justify-between tw-group",
-        bs[n.shadow ?? "none"],
+        hs[n.shadow ?? "none"],
         e ? "tw-border-dashed tw-border-2 tw-pr-0" : Jt,
         e && L[n.borderRadius ?? "small"],
         e ? Zt : Qt,
-        e && (D ? "tw-border-box-selected-strong tw-bg-box-selected-hover" : "tw-bg-box-negative-hover tw-border-box-negative-strong-hover"),
+        e && (N ? "tw-border-box-selected-strong tw-bg-box-selected-hover" : "tw-bg-box-negative-hover tw-border-box-negative-strong-hover"),
         V
       ]), tt = t != null && t.depth ? t.depth * Dt : void 0, st = e ? 0 : u * Dt, jt = { paddingLeft: tt ?? st }, ts = n.borderWidth !== "none" ? {} : { marginLeft: -1 * (tt ?? st) }, ss = {
-        transform: cs.Transform.toString(B),
+        transform: ds.Transform.toString(C),
         transition: Yt
-      }, et = { ...Ft, ...Rt }, at = i !== "none" ? /* @__PURE__ */ N(
-        gs,
+      }, et = { ...Ft, ...kt }, at = i !== "none" ? /* @__PURE__ */ b(
+        Is,
         {
           ...i !== "none" ? et : {},
           active: p,
@@ -208,53 +208,53 @@ const As = ({ isSorting: a, wasDragging: M }) => !(a || M), Es = rs(
           activeColorStyle: n.activeColorStyle ?? "neutral"
         }
       ) : null, es = i === "none" ? { ...et } : {};
-      return /* @__PURE__ */ ls(
+      return /* @__PURE__ */ b(
         "li",
         {
           ...es,
           id: a,
-          key: a,
           tabIndex: 0,
           role: "treeitem",
           style: jt,
-          onKeyDown: ms,
-          "aria-label": y,
+          onKeyDown: ls,
+          "aria-label": I,
           "aria-level": u + 1,
           onClick: Ht,
           className: Ut,
           ref: (r) => {
             Vt(r), typeof f == "function" ? f(r) : f != null && f.current && (f.current = r);
           },
-          "data-test-id": Et,
+          "data-test-id": Bt,
           "aria-selected": p,
           "aria-expanded": c,
           "data-has-children": P,
-          "aria-owns": kt.join(" ")
+          "aria-owns": Rt.join(" "),
+          children: /* @__PURE__ */ as("div", { ref: $t, className: Pt, style: ss, children: [
+            /* @__PURE__ */ b("span", { className: Kt, style: ts, "aria-hidden": !0 }),
+            i === "left" && at,
+            O && /* @__PURE__ */ b(
+              gs,
+              {
+                active: C != null && C.y ? !1 : p,
+                onClick: Q,
+                expanded: qt,
+                disabled: !E,
+                "aria-hidden": !E,
+                className: E ? "tw-visible" : "tw-invisible tw-pointer-events-none"
+              }
+            ),
+            Gt && /* @__PURE__ */ b("span", { className: "first:tw-ml-3.5 tw-w-full tw-h-full tw-flex tw-items-center", children: I }),
+            Ot && /* @__PURE__ */ b("div", { className: Xt, children: T }),
+            i === "right" && at
+          ] })
         },
-        /* @__PURE__ */ as("div", { ref: $t, className: Pt, style: ss, children: [
-          /* @__PURE__ */ N("span", { className: Kt, style: ts, "aria-hidden": !0 }),
-          i === "left" && at,
-          O && /* @__PURE__ */ N(
-            Ts,
-            {
-              active: B != null && B.y ? !1 : p,
-              onClick: Q,
-              expanded: qt,
-              disabled: !C,
-              "aria-hidden": !C,
-              className: C ? "tw-visible" : "tw-invisible tw-pointer-events-none"
-            }
-          ),
-          Gt && /* @__PURE__ */ N("span", { className: "first:tw-ml-3.5 tw-w-full tw-h-full tw-flex tw-items-center", children: y }),
-          Ot && /* @__PURE__ */ N("div", { className: Xt, children: g }),
-          i === "right" && at
-        ] })
+        a
       );
     }
   )
 );
-Es.displayName = "FondueTreeItem";
+As.displayName = "FondueTreeItem";
 export {
-  Es as TreeItem
+  As as TreeItem
 };
 //# sourceMappingURL=TreeItem.es.js.map

package/dist/components/Tree/TreeItem/TreeItem.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"TreeItem.es.js","sources":["../../../../src/components/Tree/TreeItem/TreeItem.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { useDndContext, useDndMonitor } from '@dnd-kit/core';\nimport { type AnimateLayoutChanges, useSortable } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport { noop } from 'lodash-es';\nimport { Children, type MouseEvent, memo, useCallback, useEffect, useMemo, useRef, forwardRef } from 'react';\n\nimport {\n    type RegisterNodeChildrenPayload,\n    type TreeDragEndEvent,\n    type TreeDragMoveEvent,\n    type TreeDragStartEvent,\n    TreeItemBorderClassMap,\n    TreeItemBorderRadiusClassMap,\n    TreeItemBorderStyleClassMap,\n    TreeItemColorsClassMap,\n    type TreeItemProps,\n    TreeItemShadowClassMap,\n    TreeItemSpacingClassMap,\n    type TreeItemStyling,\n} from '@components/Tree/types';\nimport { useDebounce } from '@hooks/useDebounce';\nimport { FOCUS_VISIBLE_STYLE, PARENT_FOCUS_VISIBLE_STYLE } from '@utilities/focusStyle';\nimport { merge } from '@utilities/merge';\n\nimport { EXPAND_ONHOVER_DELAY, INDENTATION_WIDTH } from '../helpers';\nimport { removeFragmentsAndEnrichChildren, useDeepCompareEffect } from '../utils';\n\nimport { DragHandle } from './DragHandle';\nimport { ExpandButton } from './ExpandButton';\nimport { type Overlay } from './TreeItemOverlay';\nimport { useTreeItem } from './useTreeItem';\n\nconst animateLayoutChanges: AnimateLayoutChanges = ({ isSorting, wasDragging }) =>\n    isSorting || wasDragging ? false : true;\n\n/** @private */\ntype TreeItemPrivateProps = {\n    level?: number;\n    levelConstraint?: Nullable<number>;\n    parentId?: string;\n    /** onSelect is passed by the Tree component when cloning the TreeItem */\n    onSelect?: (id: string) => void;\n    /** onClick is the user defined callback to run after the onSelect */\n    onClick?: (id: string) => void;\n    onExpand?: (id: string) => void;\n    onShrink?: (id: string) => void;\n    registerOverlay?: (overlay: Overlay) => void;\n    unregisterNodeChildren?: (payload: string) => void;\n    registerNodeChildren?: (payload: RegisterNodeChildrenPayload) => void;\n};\n\n/** @private */\nexport type InternalTreeItemProps = TreeItemProps & TreeItemPrivateProps;\n\nexport const TreeItem = memo(\n    forwardRef(\n        (\n            {\n                id,\n                type,\n                label,\n                onDrop,\n                accepts,\n                showCaret,\n                children,\n                parentId,\n                level = 0,\n                contentComponent,\n                onClick,\n                onSelect,\n                onExpand,\n                onShrink,\n                registerOverlay,\n                registerNodeChildren,\n                unregisterNodeChildren,\n                draggable = true,\n                expandable = true,\n                showDragHandlerOnHoverOnly = true,\n                dragHandlerPosition = 'left',\n                showContentWhileDragging = true,\n                itemStyle,\n                ignoreItemDoubleClick = false,\n                expandOnSelect = false,\n                'data-test-id': dataTestId = 'fondue-tree-item',\n            }: InternalTreeItemProps,\n            treeItemRef,\n        ) => {\n            const { active, over } = useDndContext();\n            const { isSelected, isExpanded, projection } = useTreeItem(id);\n            const expandDebounced = useRef<Nullable<string> | undefined>();\n\n            const isActive = active?.id === id;\n            const activeProjection = isActive && projection !== null && projection !== undefined ? projection : null;\n\n            const overAccepts =\n                typeof over?.data?.current?.accepts === 'string' ? over.data.current.accepts?.split(', ') : [];\n\n            const parentAccepts =\n                typeof activeProjection?.accepts === 'string' ? activeProjection.accepts?.split(', ') : [];\n\n            const currentType = active?.data.current?.type || '';\n\n            const isWithin =\n                projection?.previousNode?.depth !== undefined && projection?.depth > projection?.previousNode?.depth;\n            const isWithinOneLevel = isWithin && projection && projection.depth - 1 === projection?.previousNode?.depth;\n\n            const canDropWithinAndDeeper =\n                isWithin &&\n                projection?.previousNode?.accepts !== undefined &&\n                (projection?.previousNode?.accepts.includes(`${currentType}-deeper`) ||\n                    projection?.previousNode?.accepts.includes(`${currentType}-within`));\n\n            const canDropWithin =\n                (isActive &&\n                    isWithinOneLevel &&\n                    activeProjection?.previousNode?.accepts !== undefined &&\n                    activeProjection?.previousNode?.accepts.includes(`${currentType}-within`)) ||\n                (activeProjection?.isWithinParent && parentAccepts.includes(`${currentType}-within`));\n\n            const canDrop =\n                isActive && active?.data.current && ((overAccepts.includes(currentType) && !isWithin) || canDropWithin);\n\n            const expandProjectionParent = useDebounce((toExpandId: string) => {\n                if (expandDebounced.current === toExpandId) {\n                    onExpand?.(toExpandId);\n                }\n            }, EXPAND_ONHOVER_DELAY);\n\n            useEffect(() => {\n                if (isActive) {\n                    expandDebounced.current = isWithin ? activeProjection?.previousNode?.id : null;\n                }\n\n                if (\n                    isActive &&\n                    canDropWithinAndDeeper &&\n                    activeProjection?.parentId &&\n                    activeProjection.previousNode &&\n                    activeProjection.parentId === activeProjection.previousNode.id &&\n                    activeProjection.parentId !== active?.data?.current?.parentId\n                ) {\n                    expandProjectionParent(activeProjection?.parentId);\n                }\n            }, [\n                active?.data,\n                activeProjection?.parentId,\n                activeProjection?.previousNode,\n                expandProjectionParent,\n                isActive,\n                canDropWithinAndDeeper,\n                isWithin,\n            ]);\n\n            const handleItemDragEnd = useCallback(\n                (event: TreeDragEndEvent) => {\n                    const { over, active } = event;\n\n                    if (\n                        !isActive ||\n                        !activeProjection ||\n                        (active.id === over?.id && activeProjection?.depth === active.data.current?.level)\n                    ) {\n                        return;\n                    }\n\n                    if (isActive && over && canDrop && onDrop) {\n                        onDrop({\n                            id: active.id,\n                            parentId: activeProjection.parentId,\n                            sort: activeProjection.position,\n                            contentComponent,\n                            parentType: activeProjection.type,\n                        });\n                    }\n                },\n                [isActive, activeProjection, canDrop, onDrop, contentComponent],\n            );\n\n            const handleItemDragStart = useCallback(\n                (event: TreeDragStartEvent) => {\n                    if (event.active.id !== id) {\n                        return;\n                    }\n\n                    registerOverlay?.({\n                        contentComponent,\n                        children,\n                        id,\n                        label,\n                        level,\n                        dragHandlerPosition,\n                        showContentWhileDragging,\n                    });\n                },\n                [\n                    children,\n                    contentComponent,\n                    dragHandlerPosition,\n                    id,\n                    label,\n                    level,\n                    registerOverlay,\n                    showContentWhileDragging,\n                ],\n            );\n\n            const handleItemDragMove = useCallback(\n                (event: TreeDragMoveEvent) => {\n                    if (event.active.id === id) {\n                        document.body.style.setProperty('cursor', canDrop ? 'grabbing' : 'no-drop');\n                    }\n                },\n                [canDrop, id],\n            );\n\n            useDndMonitor({\n                onDragEnd: handleItemDragEnd,\n                onDragStart: handleItemDragStart,\n                onDragMove: handleItemDragMove,\n            });\n\n            const toggleExpand = useCallback(\n                (event?: MouseEvent<HTMLButtonElement>) => {\n                    event?.stopPropagation();\n                    if (isExpanded) {\n                        if (onShrink) {\n                            onShrink(id);\n                        }\n                    } else {\n                        if (onExpand) {\n                            onExpand(id);\n                        }\n                    }\n                },\n                [id, isExpanded, onExpand, onShrink],\n            );\n\n            const handleItemClick = useDebounce(\n                (event: MouseEvent<HTMLElement>) => {\n                    event.stopPropagation();\n                    if (ignoreItemDoubleClick && event.detail >= 2) {\n                        return;\n                    }\n\n                    if (expandOnSelect) {\n                        toggleExpand();\n                    }\n\n                    onSelect?.(id);\n                    onClick?.(id);\n                },\n                ignoreItemDoubleClick ? 300 : 0,\n            );\n\n            const isParentActive = parentId ? active?.id === parentId : false;\n\n            const hasChildren = Children.count(children) > 0;\n\n            const { enrichedChildren, childrenIds } = useMemo(() => {\n                const enrichedChildren = removeFragmentsAndEnrichChildren(children, { parentId: id, level: level + 1 });\n                return {\n                    enrichedChildren,\n                    childrenIds: enrichedChildren.map((child) => child.props.id),\n                };\n            }, [children, id, level]);\n\n            const {\n                attributes,\n                listeners,\n                transform,\n                transition,\n                setDraggableNodeRef,\n                setDroppableNodeRef,\n                setActivatorNodeRef,\n            } = useSortable({\n                id,\n                disabled: !draggable,\n                data: { type, accepts, parentId, level },\n                animateLayoutChanges,\n                transition: null,\n            });\n\n            useDeepCompareEffect(() => {\n                if (Children.count(enrichedChildren) === 0) {\n                    unregisterNodeChildren?.(id);\n                    return;\n                }\n\n                if (isActive || isParentActive) {\n                    unregisterNodeChildren?.(id);\n                    return;\n                }\n\n                if (isExpanded) {\n                    registerNodeChildren?.({ id, children: enrichedChildren });\n                } else {\n                    unregisterNodeChildren?.(id);\n                }\n            }, [isActive, isExpanded, isParentActive, enrichedChildren, id]);\n\n            const itemStyleProps = useMemo(() => {\n                return {\n                    spacingY: 'none',\n                    contentHight: 'single-line',\n                    shadow: 'none',\n                    borderRadius: 'small',\n                    borderWidth: 'none',\n                    borderStyle: 'none',\n                    activeColorStyle: 'neutral',\n                    ...itemStyle,\n                } as TreeItemStyling;\n            }, [itemStyle]);\n\n            const styling = TreeItemColorsClassMap[itemStyleProps.activeColorStyle ?? 'neutral'];\n\n            const { liClassName, backgroundClassName } = useMemo(() => {\n                return {\n                    liClassName: merge([\n                        FOCUS_VISIBLE_STYLE,\n                        'tw-box-content tw-relative tw-cursor-default tw-transition-colors tw-outline-none tw-ring-inset tw-group tw-no-underline tw-leading-5',\n                        !isActive && isSelected ? styling.selectedTextColor : styling.textColor,\n                        TreeItemSpacingClassMap[itemStyleProps.spacingY ?? 'none'],\n                    ]),\n                    backgroundClassName: merge([\n                        'tw-block tw-absolute tw-inset-0 tw-transition-colors -tw-z-10',\n                        itemStyleProps.borderWidth !== 'none'\n                            ? TreeItemBorderRadiusClassMap[itemStyleProps.borderRadius ?? 'small']\n                            : '',\n                        !isActive &&\n                            (!isSelected || itemStyleProps.activeColorStyle !== 'neutral') &&\n                            styling.pressedBackgroundColor,\n                        !isActive && isSelected ? styling.selectedBackgroundColor : styling.backgroundColor,\n                        isSelected && PARENT_FOCUS_VISIBLE_STYLE,\n                    ]),\n                };\n            }, [isActive, isSelected, itemStyleProps, styling]);\n\n            const showContent = showContentWhileDragging ? true : !isActive;\n            const wrapperContentClassName = merge([\n                'tw-max-w-full tw-grow tw-overflow-hidden',\n                isActive && showContentWhileDragging ? 'tw-opacity-75 tw-blur-sm tw-grayscale' : '',\n            ]);\n            const showChildren = isExpanded && !isActive;\n            const showDragHandle = draggable && !isActive;\n            const showLabel = label !== undefined && !isActive;\n            const showExpandButton = !isActive && expandable && (showCaret === undefined ? hasChildren : showCaret);\n\n            let previousItemToBeExpandedFeedback = '';\n            if (\n                !isActive &&\n                !isExpanded &&\n                showExpandButton &&\n                canDropWithinAndDeeper &&\n                projection?.previousNode?.id === id &&\n                projection?.depth > projection?.previousNode?.depth\n            ) {\n                previousItemToBeExpandedFeedback = merge([\n                    'tw-border-solid tw-border-box-selected-strong',\n                    TreeItemBorderRadiusClassMap[itemStyleProps.borderRadius ?? 'small'],\n                    TreeItemBorderClassMap.small,\n                ]);\n            }\n\n            const containerBorder =\n                itemStyleProps.borderWidth !== 'none' && previousItemToBeExpandedFeedback === ''\n                    ? merge([\n                          TreeItemBorderClassMap[itemStyleProps.borderWidth ?? 'none'],\n                          TreeItemBorderRadiusClassMap[itemStyleProps.borderRadius ?? 'small'],\n                          TreeItemBorderStyleClassMap[itemStyleProps.borderStyle ?? 'none'],\n                      ])\n                    : '';\n            const containerHeight = itemStyleProps.contentHight === 'single-line' ? 'tw-h-10' : 'tw-h-fit';\n            const containerActiveHeight = itemStyleProps.contentHight === 'single-line' ? 'tw-h-12' : 'tw-h-fit';\n\n            const containerClassName = merge([\n                'tw-relative tw-z-0 tw-transition-colors tw-flex tw-items-center tw-leading-5 tw-width-fit tw-justify-between tw-group',\n                TreeItemShadowClassMap[itemStyleProps.shadow ?? 'none'],\n                isActive ? 'tw-border-dashed tw-border-2 tw-pr-0' : containerBorder,\n                isActive && TreeItemBorderRadiusClassMap[itemStyleProps.borderRadius ?? 'small'],\n                isActive ? containerActiveHeight : containerHeight,\n                isActive &&\n                    (canDrop\n                        ? 'tw-border-box-selected-strong tw-bg-box-selected-hover'\n                        : 'tw-bg-box-negative-hover tw-border-box-negative-strong-hover'),\n                previousItemToBeExpandedFeedback,\n            ]);\n\n            const depthPadding = activeProjection?.depth ? activeProjection.depth * INDENTATION_WIDTH : undefined;\n            const levelPadding = isActive ? 0 : level * INDENTATION_WIDTH;\n\n            const liStyle = { paddingLeft: depthPadding ?? levelPadding };\n            const backgroundStyle =\n                itemStyleProps.borderWidth !== 'none' ? {} : { marginLeft: -1 * (depthPadding ?? levelPadding) };\n\n            const style = {\n                transform: CSS.Transform.toString(transform),\n                transition,\n            };\n\n            const handlerProps = { ...listeners, ...attributes };\n            const dragHandlerProps = dragHandlerPosition !== 'none' ? handlerProps : {};\n            const dragHandler =\n                dragHandlerPosition !== 'none' ? (\n                    <DragHandle\n                        {...dragHandlerProps}\n                        active={isSelected}\n                        ref={setActivatorNodeRef}\n                        disabled={!showDragHandle}\n                        aria-hidden={!showDragHandle}\n                        showDragHandlerOnHoverOnly={showDragHandlerOnHoverOnly}\n                        activeColorStyle={itemStyleProps.activeColorStyle ?? 'neutral'}\n                    />\n                ) : null;\n\n            const itemHandlerProps = dragHandlerPosition === 'none' ? { ...handlerProps } : {};\n\n            return (\n                <li\n                    {...itemHandlerProps}\n                    id={id}\n                    key={id}\n                    tabIndex={0}\n                    role=\"treeitem\"\n                    style={liStyle}\n                    onKeyDown={noop}\n                    aria-label={label}\n                    aria-level={level + 1}\n                    onClick={handleItemClick}\n                    className={liClassName}\n                    ref={(node) => {\n                        setDroppableNodeRef(node);\n                        if (typeof treeItemRef === 'function') {\n                            treeItemRef(node);\n                        } else if (treeItemRef?.current) {\n                            treeItemRef.current = node;\n                        }\n                    }}\n                    data-test-id={dataTestId}\n                    aria-selected={isSelected}\n                    aria-expanded={isExpanded}\n                    data-has-children={hasChildren}\n                    aria-owns={childrenIds.join(' ')}\n                >\n                    <div ref={setDraggableNodeRef} className={containerClassName} style={style}>\n                        <span className={backgroundClassName} style={backgroundStyle} aria-hidden />\n                        {dragHandlerPosition === 'left' && dragHandler}\n                        {expandable && (\n                            <ExpandButton\n                                active={transform?.y ? false : isSelected}\n                                onClick={toggleExpand}\n                                expanded={showChildren}\n                                disabled={!showExpandButton}\n                                aria-hidden={!showExpandButton}\n                                className={showExpandButton ? 'tw-visible' : 'tw-invisible tw-pointer-events-none'}\n                            />\n                        )}\n                        {showLabel && (\n                            <span className=\"first:tw-ml-3.5 tw-w-full tw-h-full tw-flex tw-items-center\">{label}</span>\n                        )}\n                        {showContent && <div className={wrapperContentClassName}>{contentComponent}</div>}\n                        {dragHandlerPosition === 'right' && dragHandler}\n                    </div>\n                </li>\n            );\n        },\n    ),\n);\n\nTreeItem.displayName = 'FondueTreeItem';\n"],"names":["animateLayoutChanges","isSorting","wasDragging","TreeItem","memo","forwardRef","id","type","label","onDrop","accepts","showCaret","children","parentId","level","contentComponent","onClick","onSelect","onExpand","onShrink","registerOverlay","registerNodeChildren","unregisterNodeChildren","draggable","expandable","showDragHandlerOnHoverOnly","dragHandlerPosition","showContentWhileDragging","itemStyle","ignoreItemDoubleClick","expandOnSelect","dataTestId","treeItemRef","active","over","useDndContext","isSelected","isExpanded","projection","useTreeItem","expandDebounced","useRef","isActive","activeProjection","overAccepts","_b","_a","_c","parentAccepts","_d","currentType","_e","isWithin","_f","_g","isWithinOneLevel","_h","canDropWithinAndDeeper","_i","_j","_k","canDropWithin","_l","_m","canDrop","expandProjectionParent","useDebounce","toExpandId","EXPAND_ONHOVER_DELAY","useEffect","handleItemDragEnd","useCallback","event","handleItemDragStart","handleItemDragMove","useDndMonitor","toggleExpand","handleItemClick","isParentActive","hasChildren","Children","enrichedChildren","childrenIds","useMemo","removeFragmentsAndEnrichChildren","child","attributes","listeners","transform","transition","setDraggableNodeRef","setDroppableNodeRef","setActivatorNodeRef","useSortable","useDeepCompareEffect","itemStyleProps","styling","TreeItemColorsClassMap","liClassName","backgroundClassName","merge","FOCUS_VISIBLE_STYLE","TreeItemSpacingClassMap","TreeItemBorderRadiusClassMap","PARENT_FOCUS_VISIBLE_STYLE","showContent","wrapperContentClassName","showChildren","showDragHandle","showLabel","showExpandButton","previousItemToBeExpandedFeedback","_n","_o","TreeItemBorderClassMap","containerBorder","TreeItemBorderStyleClassMap","containerHeight","containerActiveHeight","containerClassName","TreeItemShadowClassMap","depthPadding","INDENTATION_WIDTH","levelPadding","liStyle","backgroundStyle","style","CSS","handlerProps","dragHandler","jsx","DragHandle","itemHandlerProps","createElement","noop","node","ExpandButton"],"mappings":"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"}
+{"version":3,"file":"TreeItem.es.js","sources":["../../../../src/components/Tree/TreeItem/TreeItem.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { useDndContext, useDndMonitor } from '@dnd-kit/core';\nimport { type AnimateLayoutChanges, useSortable } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport { noop } from 'lodash-es';\nimport { Children, type MouseEvent, memo, useCallback, useEffect, useMemo, useRef, forwardRef } from 'react';\n\nimport {\n    type RegisterNodeChildrenPayload,\n    type TreeDragEndEvent,\n    type TreeDragMoveEvent,\n    type TreeDragStartEvent,\n    TreeItemBorderClassMap,\n    TreeItemBorderRadiusClassMap,\n    TreeItemBorderStyleClassMap,\n    TreeItemColorsClassMap,\n    type TreeItemProps,\n    TreeItemShadowClassMap,\n    TreeItemSpacingClassMap,\n    type TreeItemStyling,\n} from '@components/Tree/types';\nimport { useDebounce } from '@hooks/useDebounce';\nimport { FOCUS_VISIBLE_STYLE, PARENT_FOCUS_VISIBLE_STYLE } from '@utilities/focusStyle';\nimport { merge } from '@utilities/merge';\n\nimport { EXPAND_ONHOVER_DELAY, INDENTATION_WIDTH } from '../helpers';\nimport { removeFragmentsAndEnrichChildren, useDeepCompareEffect } from '../utils';\n\nimport { DragHandle } from './DragHandle';\nimport { ExpandButton } from './ExpandButton';\nimport { type Overlay } from './TreeItemOverlay';\nimport { useTreeItem } from './useTreeItem';\n\nconst animateLayoutChanges: AnimateLayoutChanges = ({ isSorting, wasDragging }) =>\n    isSorting || wasDragging ? false : true;\n\n/** @private */\ntype TreeItemPrivateProps = {\n    level?: number;\n    levelConstraint?: Nullable<number>;\n    parentId?: string;\n    /** onSelect is passed by the Tree component when cloning the TreeItem */\n    onSelect?: (id: string) => void;\n    /** onClick is the user defined callback to run after the onSelect */\n    onClick?: (id: string) => void;\n    onExpand?: (id: string) => void;\n    onShrink?: (id: string) => void;\n    registerOverlay?: (overlay: Overlay) => void;\n    unregisterNodeChildren?: (payload: string) => void;\n    registerNodeChildren?: (payload: RegisterNodeChildrenPayload) => void;\n};\n\n/** @private */\nexport type InternalTreeItemProps = TreeItemProps & TreeItemPrivateProps;\n\nexport const TreeItem = memo(\n    forwardRef(\n        (\n            {\n                id,\n                type,\n                label,\n                onDrop,\n                accepts,\n                showCaret,\n                children,\n                parentId,\n                level = 0,\n                contentComponent,\n                onClick,\n                onSelect,\n                onExpand,\n                onShrink,\n                registerOverlay,\n                registerNodeChildren,\n                unregisterNodeChildren,\n                draggable = true,\n                expandable = true,\n                showDragHandlerOnHoverOnly = true,\n                dragHandlerPosition = 'left',\n                showContentWhileDragging = true,\n                itemStyle,\n                ignoreItemDoubleClick = false,\n                expandOnSelect = false,\n                'data-test-id': dataTestId = 'fondue-tree-item',\n            }: InternalTreeItemProps,\n            treeItemRef,\n        ) => {\n            const { active, over } = useDndContext();\n            const { isSelected, isExpanded, projection } = useTreeItem(id);\n            const expandDebounced = useRef<Nullable<string> | undefined>();\n\n            const isActive = active?.id === id;\n            const activeProjection = isActive && projection !== null && projection !== undefined ? projection : null;\n\n            const overAccepts =\n                typeof over?.data?.current?.accepts === 'string' ? over.data.current.accepts?.split(', ') : [];\n\n            const parentAccepts =\n                typeof activeProjection?.accepts === 'string' ? activeProjection.accepts?.split(', ') : [];\n\n            const currentType = active?.data.current?.type || '';\n\n            const isWithin =\n                projection?.previousNode?.depth !== undefined && projection?.depth > projection?.previousNode?.depth;\n            const isWithinOneLevel = isWithin && projection && projection.depth - 1 === projection?.previousNode?.depth;\n\n            const canDropWithinAndDeeper =\n                isWithin &&\n                projection?.previousNode?.accepts !== undefined &&\n                (projection?.previousNode?.accepts.includes(`${currentType}-deeper`) ||\n                    projection?.previousNode?.accepts.includes(`${currentType}-within`));\n\n            const canDropWithin =\n                (isActive &&\n                    isWithinOneLevel &&\n                    activeProjection?.previousNode?.accepts !== undefined &&\n                    activeProjection?.previousNode?.accepts.includes(`${currentType}-within`)) ||\n                (activeProjection?.isWithinParent && parentAccepts.includes(`${currentType}-within`));\n\n            const canDrop =\n                isActive && active?.data.current && ((overAccepts.includes(currentType) && !isWithin) || canDropWithin);\n\n            const expandProjectionParent = useDebounce((toExpandId: string) => {\n                if (expandDebounced.current === toExpandId) {\n                    onExpand?.(toExpandId);\n                }\n            }, EXPAND_ONHOVER_DELAY);\n\n            useEffect(() => {\n                if (isActive) {\n                    expandDebounced.current = isWithin ? activeProjection?.previousNode?.id : null;\n                }\n\n                if (\n                    isActive &&\n                    canDropWithinAndDeeper &&\n                    activeProjection?.parentId &&\n                    activeProjection.previousNode &&\n                    activeProjection.parentId === activeProjection.previousNode.id &&\n                    activeProjection.parentId !== active?.data?.current?.parentId\n                ) {\n                    expandProjectionParent(activeProjection?.parentId);\n                }\n            }, [\n                active?.data,\n                activeProjection?.parentId,\n                activeProjection?.previousNode,\n                expandProjectionParent,\n                isActive,\n                canDropWithinAndDeeper,\n                isWithin,\n            ]);\n\n            const handleItemDragEnd = useCallback(\n                (event: TreeDragEndEvent) => {\n                    const { over, active } = event;\n\n                    if (\n                        !isActive ||\n                        !activeProjection ||\n                        (active.id === over?.id && activeProjection?.depth === active.data.current?.level)\n                    ) {\n                        return;\n                    }\n\n                    if (isActive && over && canDrop && onDrop) {\n                        onDrop({\n                            id: active.id,\n                            parentId: activeProjection.parentId,\n                            sort: activeProjection.position,\n                            contentComponent,\n                            parentType: activeProjection.type,\n                        });\n                    }\n                },\n                [isActive, activeProjection, canDrop, onDrop, contentComponent],\n            );\n\n            const handleItemDragStart = useCallback(\n                (event: TreeDragStartEvent) => {\n                    if (event.active.id !== id) {\n                        return;\n                    }\n\n                    registerOverlay?.({\n                        contentComponent,\n                        children,\n                        id,\n                        label,\n                        level,\n                        dragHandlerPosition,\n                        showContentWhileDragging,\n                    });\n                },\n                [\n                    children,\n                    contentComponent,\n                    dragHandlerPosition,\n                    id,\n                    label,\n                    level,\n                    registerOverlay,\n                    showContentWhileDragging,\n                ],\n            );\n\n            const handleItemDragMove = useCallback(\n                (event: TreeDragMoveEvent) => {\n                    if (event.active.id === id) {\n                        document.body.style.setProperty('cursor', canDrop ? 'grabbing' : 'no-drop');\n                    }\n                },\n                [canDrop, id],\n            );\n\n            useDndMonitor({\n                onDragEnd: handleItemDragEnd,\n                onDragStart: handleItemDragStart,\n                onDragMove: handleItemDragMove,\n            });\n\n            const toggleExpand = useCallback(\n                (event?: MouseEvent<HTMLButtonElement>) => {\n                    event?.stopPropagation();\n                    if (isExpanded) {\n                        if (onShrink) {\n                            onShrink(id);\n                        }\n                    } else {\n                        if (onExpand) {\n                            onExpand(id);\n                        }\n                    }\n                },\n                [id, isExpanded, onExpand, onShrink],\n            );\n\n            const handleItemClick = useDebounce(\n                (event: MouseEvent<HTMLElement>) => {\n                    event.stopPropagation();\n                    if (ignoreItemDoubleClick && event.detail >= 2) {\n                        return;\n                    }\n\n                    if (expandOnSelect) {\n                        toggleExpand();\n                    }\n\n                    onSelect?.(id);\n                    onClick?.(id);\n                },\n                ignoreItemDoubleClick ? 300 : 0,\n            );\n\n            const isParentActive = parentId ? active?.id === parentId : false;\n\n            const hasChildren = Children.count(children) > 0;\n\n            const { enrichedChildren, childrenIds } = useMemo(() => {\n                const enrichedChildren = removeFragmentsAndEnrichChildren(children, { parentId: id, level: level + 1 });\n                return {\n                    enrichedChildren,\n                    childrenIds: enrichedChildren.map((child) => child.props.id),\n                };\n            }, [children, id, level]);\n\n            const {\n                attributes,\n                listeners,\n                transform,\n                transition,\n                setDraggableNodeRef,\n                setDroppableNodeRef,\n                setActivatorNodeRef,\n            } = useSortable({\n                id,\n                disabled: !draggable,\n                data: { type, accepts, parentId, level },\n                animateLayoutChanges,\n                transition: null,\n            });\n\n            useDeepCompareEffect(() => {\n                if (Children.count(enrichedChildren) === 0) {\n                    unregisterNodeChildren?.(id);\n                    return;\n                }\n\n                if (isActive || isParentActive) {\n                    unregisterNodeChildren?.(id);\n                    return;\n                }\n\n                if (isExpanded) {\n                    registerNodeChildren?.({ id, children: enrichedChildren });\n                } else {\n                    unregisterNodeChildren?.(id);\n                }\n            }, [isActive, isExpanded, isParentActive, enrichedChildren, id]);\n\n            const itemStyleProps = useMemo<Required<TreeItemStyling>>(() => {\n                return {\n                    spacingY: 'none',\n                    contentHight: 'single-line',\n                    shadow: 'none',\n                    borderRadius: 'small',\n                    borderWidth: 'none',\n                    borderStyle: 'none',\n                    activeColorStyle: 'neutral',\n                    ...itemStyle,\n                };\n            }, [itemStyle]);\n\n            const styling = TreeItemColorsClassMap[itemStyleProps.activeColorStyle ?? 'neutral'];\n\n            const { liClassName, backgroundClassName } = useMemo(() => {\n                return {\n                    liClassName: merge([\n                        FOCUS_VISIBLE_STYLE,\n                        'tw-box-content tw-relative tw-cursor-default tw-transition-colors tw-outline-none tw-ring-inset tw-group tw-no-underline tw-leading-5',\n                        !isActive && isSelected ? styling.selectedTextColor : styling.textColor,\n                        TreeItemSpacingClassMap[itemStyleProps.spacingY ?? 'none'],\n                    ]),\n                    backgroundClassName: merge([\n                        'tw-block tw-absolute tw-inset-0 tw-transition-colors -tw-z-10',\n                        itemStyleProps.borderWidth !== 'none'\n                            ? TreeItemBorderRadiusClassMap[itemStyleProps.borderRadius ?? 'small']\n                            : '',\n                        !isActive &&\n                            (!isSelected || itemStyleProps.activeColorStyle !== 'neutral') &&\n                            styling.pressedBackgroundColor,\n                        !isActive && isSelected ? styling.selectedBackgroundColor : styling.backgroundColor,\n                        isSelected && PARENT_FOCUS_VISIBLE_STYLE,\n                    ]),\n                };\n            }, [isActive, isSelected, itemStyleProps, styling]);\n\n            const showContent = showContentWhileDragging ? true : !isActive;\n            const wrapperContentClassName = merge([\n                'tw-max-w-full tw-grow tw-overflow-hidden',\n                isActive && showContentWhileDragging ? 'tw-opacity-75 tw-blur-sm tw-grayscale' : '',\n            ]);\n            const showChildren = isExpanded && !isActive;\n            const showDragHandle = draggable && !isActive;\n            const showLabel = label !== undefined && !isActive;\n            const showExpandButton = !isActive && expandable && (showCaret === undefined ? hasChildren : showCaret);\n\n            let previousItemToBeExpandedFeedback = '';\n            if (\n                !isActive &&\n                !isExpanded &&\n                showExpandButton &&\n                canDropWithinAndDeeper &&\n                projection?.previousNode?.id === id &&\n                projection?.depth > projection?.previousNode?.depth\n            ) {\n                previousItemToBeExpandedFeedback = merge([\n                    'tw-border-solid tw-border-box-selected-strong',\n                    TreeItemBorderRadiusClassMap[itemStyleProps.borderRadius ?? 'small'],\n                    TreeItemBorderClassMap.small,\n                ]);\n            }\n\n            const containerBorder =\n                itemStyleProps.borderWidth !== 'none' && previousItemToBeExpandedFeedback === ''\n                    ? merge([\n                          TreeItemBorderClassMap[itemStyleProps.borderWidth ?? 'none'],\n                          TreeItemBorderRadiusClassMap[itemStyleProps.borderRadius ?? 'small'],\n                          TreeItemBorderStyleClassMap[itemStyleProps.borderStyle ?? 'none'],\n                      ])\n                    : '';\n            const containerHeight = itemStyleProps.contentHight === 'single-line' ? 'tw-h-10' : 'tw-h-fit';\n            const containerActiveHeight = itemStyleProps.contentHight === 'single-line' ? 'tw-h-12' : 'tw-h-fit';\n\n            const containerClassName = merge([\n                'tw-relative tw-z-0 tw-transition-colors tw-flex tw-items-center tw-leading-5 tw-width-fit tw-justify-between tw-group',\n                TreeItemShadowClassMap[itemStyleProps.shadow ?? 'none'],\n                isActive ? 'tw-border-dashed tw-border-2 tw-pr-0' : containerBorder,\n                isActive && TreeItemBorderRadiusClassMap[itemStyleProps.borderRadius ?? 'small'],\n                isActive ? containerActiveHeight : containerHeight,\n                isActive &&\n                    (canDrop\n                        ? 'tw-border-box-selected-strong tw-bg-box-selected-hover'\n                        : 'tw-bg-box-negative-hover tw-border-box-negative-strong-hover'),\n                previousItemToBeExpandedFeedback,\n            ]);\n\n            const depthPadding = activeProjection?.depth ? activeProjection.depth * INDENTATION_WIDTH : undefined;\n            const levelPadding = isActive ? 0 : level * INDENTATION_WIDTH;\n\n            const liStyle = { paddingLeft: depthPadding ?? levelPadding };\n            const backgroundStyle =\n                itemStyleProps.borderWidth !== 'none' ? {} : { marginLeft: -1 * (depthPadding ?? levelPadding) };\n\n            const style = {\n                transform: CSS.Transform.toString(transform),\n                transition,\n            };\n\n            const handlerProps = { ...listeners, ...attributes };\n            const dragHandlerProps = dragHandlerPosition !== 'none' ? handlerProps : {};\n            const dragHandler =\n                dragHandlerPosition !== 'none' ? (\n                    <DragHandle\n                        {...dragHandlerProps}\n                        active={isSelected}\n                        ref={setActivatorNodeRef}\n                        disabled={!showDragHandle}\n                        aria-hidden={!showDragHandle}\n                        showDragHandlerOnHoverOnly={showDragHandlerOnHoverOnly}\n                        activeColorStyle={itemStyleProps.activeColorStyle ?? 'neutral'}\n                    />\n                ) : null;\n\n            const itemHandlerProps = dragHandlerPosition === 'none' ? { ...handlerProps } : {};\n\n            return (\n                <li\n                    key={id}\n                    {...itemHandlerProps}\n                    id={id}\n                    tabIndex={0}\n                    role=\"treeitem\"\n                    style={liStyle}\n                    onKeyDown={noop}\n                    aria-label={label}\n                    aria-level={level + 1}\n                    onClick={handleItemClick}\n                    className={liClassName}\n                    ref={(node) => {\n                        setDroppableNodeRef(node);\n                        if (typeof treeItemRef === 'function') {\n                            treeItemRef(node);\n                        } else if (treeItemRef?.current) {\n                            treeItemRef.current = node;\n                        }\n                    }}\n                    data-test-id={dataTestId}\n                    aria-selected={isSelected}\n                    aria-expanded={isExpanded}\n                    data-has-children={hasChildren}\n                    aria-owns={childrenIds.join(' ')}\n                >\n                    <div ref={setDraggableNodeRef} className={containerClassName} style={style}>\n                        <span className={backgroundClassName} style={backgroundStyle} aria-hidden />\n                        {dragHandlerPosition === 'left' && dragHandler}\n                        {expandable && (\n                            <ExpandButton\n                                active={transform?.y ? false : isSelected}\n                                onClick={toggleExpand}\n                                expanded={showChildren}\n                                disabled={!showExpandButton}\n                                aria-hidden={!showExpandButton}\n                                className={showExpandButton ? 'tw-visible' : 'tw-invisible tw-pointer-events-none'}\n                            />\n                        )}\n                        {showLabel && (\n                            <span className=\"first:tw-ml-3.5 tw-w-full tw-h-full tw-flex tw-items-center\">{label}</span>\n                        )}\n                        {showContent && <div className={wrapperContentClassName}>{contentComponent}</div>}\n                        {dragHandlerPosition === 'right' && dragHandler}\n                    </div>\n                </li>\n            );\n        },\n    ),\n);\n\nTreeItem.displayName = 'FondueTreeItem';\n"],"names":["animateLayoutChanges","isSorting","wasDragging","TreeItem","memo","forwardRef","id","type","label","onDrop","accepts","showCaret","children","parentId","level","contentComponent","onClick","onSelect","onExpand","onShrink","registerOverlay","registerNodeChildren","unregisterNodeChildren","draggable","expandable","showDragHandlerOnHoverOnly","dragHandlerPosition","showContentWhileDragging","itemStyle","ignoreItemDoubleClick","expandOnSelect","dataTestId","treeItemRef","active","over","useDndContext","isSelected","isExpanded","projection","useTreeItem","expandDebounced","useRef","isActive","activeProjection","overAccepts","_b","_a","_c","parentAccepts","_d","currentType","_e","isWithin","_f","_g","isWithinOneLevel","_h","canDropWithinAndDeeper","_i","_j","_k","canDropWithin","_l","_m","canDrop","expandProjectionParent","useDebounce","toExpandId","EXPAND_ONHOVER_DELAY","useEffect","handleItemDragEnd","useCallback","event","handleItemDragStart","handleItemDragMove","useDndMonitor","toggleExpand","handleItemClick","isParentActive","hasChildren","Children","enrichedChildren","childrenIds","useMemo","removeFragmentsAndEnrichChildren","child","attributes","listeners","transform","transition","setDraggableNodeRef","setDroppableNodeRef","setActivatorNodeRef","useSortable","useDeepCompareEffect","itemStyleProps","styling","TreeItemColorsClassMap","liClassName","backgroundClassName","merge","FOCUS_VISIBLE_STYLE","TreeItemSpacingClassMap","TreeItemBorderRadiusClassMap","PARENT_FOCUS_VISIBLE_STYLE","showContent","wrapperContentClassName","showChildren","showDragHandle","showLabel","showExpandButton","previousItemToBeExpandedFeedback","_n","_o","TreeItemBorderClassMap","containerBorder","TreeItemBorderStyleClassMap","containerHeight","containerActiveHeight","containerClassName","TreeItemShadowClassMap","depthPadding","INDENTATION_WIDTH","levelPadding","liStyle","backgroundStyle","style","CSS","handlerProps","dragHandler","jsx","DragHandle","itemHandlerProps","noop","node","ExpandButton"],"mappings":"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"}

package/dist/components/Tree/TreeItem/TreeItemMultiselect.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"TreeItemMultiselect.es.js","sources":["../../../../src/components/Tree/TreeItem/TreeItemMultiselect.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { noop } from 'lodash-es';\nimport { Children, type MouseEvent, memo, useCallback, useEffect, useMemo, useRef } from 'react';\n\nimport { Checkbox, CheckboxEmphasis, CheckboxSize, CheckboxState } from '@components/Checkbox/Checkbox';\nimport { Container } from '@components/Container/Container';\nimport {\n    type RegisterNodeChildrenPayload,\n    type TreeItemMultiselectProps,\n    type TreeItemStyling,\n} from '@components/Tree/types';\n\nimport { INDENTATION_WIDTH, getMultiselectCheckBoxState } from '../helpers';\nimport {\n    getMultiselectBackgroundClassName,\n    getMultiselectContainerClassName,\n    getMultiselectLiClassName,\n} from '../helpers/multiselectTreeItemstyling';\nimport { removeFragmentsAndEnrichChildren, useDeepCompareEffect } from '../utils';\n\nimport { ExpandButton } from './ExpandButton';\nimport { useMultiselectTreeItem } from './useMultiselectTreeItem';\n\n/** @private */\ntype TreeItemPrivateProps = {\n    parentId?: string;\n    level?: number;\n    /** onSelect is passed by the Tree component when cloning the TreeItem */\n    onSelect?: (id: string, ignoreRemoveSelected: boolean) => void;\n    onExpand?: (id: string) => void;\n    onShrink?: (id: string) => void;\n    unregisterNodeChildren?: (payload: string) => void;\n    registerNodeChildren?: (payload: RegisterNodeChildrenPayload) => void;\n};\n\n/** @private */\nexport type InternalTreeItemMultiSelectProps = TreeItemMultiselectProps & TreeItemPrivateProps;\n\nexport const TreeItemMultiselect = memo(\n    ({\n        id,\n        label,\n        showCaret,\n        children,\n        level = 0,\n        contentComponent,\n        parentId: _parentId,\n        onSelect,\n        onExpand,\n        onShrink,\n        registerNodeChildren,\n        unregisterNodeChildren,\n        isDisabled = false,\n        expandable = true,\n        checkBoxPosition = 'left',\n        itemStyle,\n        'data-test-id': dataTestId = 'fondue-tree-item',\n    }: InternalTreeItemMultiSelectProps) => {\n        const setActiveNodeRef = useRef<HTMLInputElement | null>(null);\n        const { isSelected, isExpanded, isPartialSelected, isParentSelected } = useMultiselectTreeItem(id);\n\n        const toggleExpand = useCallback(\n            (event?: MouseEvent<HTMLButtonElement>) => {\n                event?.stopPropagation();\n                if (isExpanded) {\n                    if (onShrink) {\n                        onShrink(id);\n                    }\n                } else {\n                    if (onExpand) {\n                        onExpand(id);\n                    }\n                }\n            },\n            [id, isExpanded, onExpand, onShrink],\n        );\n\n        useEffect(() => {\n            if (isParentSelected && !isSelected && onSelect) {\n                onSelect(id, true);\n            }\n        }, [id, onSelect, isParentSelected, isSelected]);\n\n        const hasChildren = Children.count(children) > 0;\n\n        const { enrichedChildren, childrenIds } = useMemo(() => {\n            const enrichedChildren = removeFragmentsAndEnrichChildren(children, {\n                parentId: id,\n                level: level + 1,\n            });\n\n            return {\n                enrichedChildren,\n                childrenIds: enrichedChildren.map((child) => child.props.id),\n            };\n        }, [children, id, level]);\n\n        useDeepCompareEffect(() => {\n            if (Children.count(enrichedChildren) === 0 || !isExpanded) {\n                unregisterNodeChildren?.(id);\n                return;\n            }\n\n            registerNodeChildren?.({ id, children: enrichedChildren });\n        }, [isExpanded, enrichedChildren, id]);\n\n        const itemStyleProps = useMemo(() => {\n            return {\n                spacingY: 'none',\n                contentHight: 'single-line',\n                shadow: 'none',\n                borderRadius: 'small',\n                borderWidth: 'none',\n                borderStyle: 'none',\n                activeColorStyle: 'neutral',\n                ...itemStyle,\n            } as TreeItemStyling;\n        }, [itemStyle]);\n\n        const { liClassName, backgroundClassName } = useMemo(() => {\n            return {\n                liClassName: getMultiselectLiClassName(itemStyleProps, isDisabled),\n                backgroundClassName: getMultiselectBackgroundClassName(itemStyleProps, isSelected, isDisabled),\n            };\n        }, [itemStyleProps, isDisabled, isSelected]);\n\n        const wrapperContentClassName = 'tw-max-w-full\ttw-grow';\n        const showChildren = isExpanded;\n        const showLabel = label !== undefined;\n        const showExpandButton = expandable && (showCaret ?? hasChildren);\n\n        const containerClassName = getMultiselectContainerClassName(itemStyleProps);\n\n        const levelPadding = level * INDENTATION_WIDTH;\n        const liStyle = { paddingLeft: levelPadding };\n        const backgroundStyle = itemStyleProps.borderWidth !== 'none' ? {} : { marginLeft: -1 * levelPadding };\n\n        const checkBoxOnSelect = () => {\n            if (!isDisabled && onSelect) {\n                onSelect(id, false);\n            }\n        };\n        const checkBox =\n            checkBoxPosition !== 'none' ? (\n                <Container maxWidth=\"16px\" maxHeight=\"16px\">\n                    <Checkbox\n                        id={`checkbox-${id}`}\n                        ref={setActiveNodeRef}\n                        disabled={isDisabled}\n                        aria-label={label ?? ''}\n                        emphasis={CheckboxEmphasis.Weak}\n                        helperText=\"\"\n                        hideLabel\n                        label=\"\"\n                        onChange={checkBoxOnSelect}\n                        size={CheckboxSize.Default}\n                        state={\n                            isDisabled\n                                ? CheckboxState.Unchecked\n                                : getMultiselectCheckBoxState(isSelected, isPartialSelected)\n                        }\n                        tooltip={[]}\n                        value={id}\n                    />\n                </Container>\n            ) : null;\n\n        return (\n            <li\n                id={id}\n                key={id}\n                tabIndex={0}\n                role=\"treeitem\"\n                style={liStyle}\n                onKeyDown={noop}\n                aria-label={label}\n                aria-level={level + 1}\n                className={liClassName}\n                data-test-id={dataTestId}\n                aria-selected={isSelected}\n                aria-expanded={isExpanded}\n                data-has-children={hasChildren}\n                aria-owns={childrenIds.join(' ')}\n            >\n                <div className={containerClassName}>\n                    <span className={backgroundClassName} style={backgroundStyle} aria-hidden />\n                    {checkBoxPosition === 'left' && checkBox}\n\n                    {expandable && (\n                        <ExpandButton\n                            onClick={toggleExpand}\n                            expanded={showChildren}\n                            disabled={!showExpandButton}\n                            aria-hidden={!showExpandButton}\n                            className={showExpandButton ? 'tw-visible' : 'tw-invisible tw-pointer-events-none'}\n                        />\n                    )}\n\n                    {showLabel && <span className=\"first:tw-ml-3.5 tw-h-full tw-flex tw-items-center\">{label}</span>}\n\n                    <div className={wrapperContentClassName}>{contentComponent}</div>\n\n                    {checkBoxPosition === 'right' && checkBox}\n                </div>\n            </li>\n        );\n    },\n);\n\nTreeItemMultiselect.displayName = 'FondueTreeItemMultiselect';\n"],"names":["TreeItemMultiselect","memo","id","label","showCaret","children","level","contentComponent","_parentId","onSelect","onExpand","onShrink","registerNodeChildren","unregisterNodeChildren","isDisabled","expandable","checkBoxPosition","itemStyle","dataTestId","setActiveNodeRef","useRef","isSelected","isExpanded","isPartialSelected","isParentSelected","useMultiselectTreeItem","toggleExpand","useCallback","event","useEffect","hasChildren","Children","enrichedChildren","childrenIds","useMemo","removeFragmentsAndEnrichChildren","child","useDeepCompareEffect","itemStyleProps","liClassName","backgroundClassName","getMultiselectLiClassName","getMultiselectBackgroundClassName","wrapperContentClassName","showChildren","showLabel","showExpandButton","containerClassName","getMultiselectContainerClassName","levelPadding","INDENTATION_WIDTH","liStyle","backgroundStyle","checkBoxOnSelect","checkBox","jsx","Container","Checkbox","CheckboxEmphasis","CheckboxSize","CheckboxState","getMultiselectCheckBoxState","noop","jsxs","ExpandButton"],"mappings":"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"}
+{"version":3,"file":"TreeItemMultiselect.es.js","sources":["../../../../src/components/Tree/TreeItem/TreeItemMultiselect.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { noop } from 'lodash-es';\nimport { Children, type MouseEvent, memo, useCallback, useEffect, useMemo, useRef } from 'react';\n\nimport { Checkbox, CheckboxEmphasis, CheckboxSize, CheckboxState } from '@components/Checkbox/Checkbox';\nimport { Container } from '@components/Container/Container';\nimport {\n    type RegisterNodeChildrenPayload,\n    type TreeItemMultiselectProps,\n    type TreeItemStyling,\n} from '@components/Tree/types';\n\nimport { INDENTATION_WIDTH, getMultiselectCheckBoxState } from '../helpers';\nimport {\n    getMultiselectBackgroundClassName,\n    getMultiselectContainerClassName,\n    getMultiselectLiClassName,\n} from '../helpers/multiselectTreeItemstyling';\nimport { removeFragmentsAndEnrichChildren, useDeepCompareEffect } from '../utils';\n\nimport { ExpandButton } from './ExpandButton';\nimport { useMultiselectTreeItem } from './useMultiselectTreeItem';\n\n/** @private */\ntype TreeItemPrivateProps = {\n    parentId?: string;\n    level?: number;\n    /** onSelect is passed by the Tree component when cloning the TreeItem */\n    onSelect?: (id: string, ignoreRemoveSelected: boolean) => void;\n    onExpand?: (id: string) => void;\n    onShrink?: (id: string) => void;\n    unregisterNodeChildren?: (payload: string) => void;\n    registerNodeChildren?: (payload: RegisterNodeChildrenPayload) => void;\n};\n\n/** @private */\nexport type InternalTreeItemMultiSelectProps = TreeItemMultiselectProps & TreeItemPrivateProps;\n\nexport const TreeItemMultiselect = memo(\n    ({\n        id,\n        label,\n        showCaret,\n        children,\n        level = 0,\n        contentComponent,\n        parentId: _parentId,\n        onSelect,\n        onExpand,\n        onShrink,\n        registerNodeChildren,\n        unregisterNodeChildren,\n        isDisabled = false,\n        expandable = true,\n        checkBoxPosition = 'left',\n        itemStyle,\n        'data-test-id': dataTestId = 'fondue-tree-item',\n    }: InternalTreeItemMultiSelectProps) => {\n        const setActiveNodeRef = useRef<HTMLInputElement | null>(null);\n        const { isSelected, isExpanded, isPartialSelected, isParentSelected } = useMultiselectTreeItem(id);\n\n        const toggleExpand = useCallback(\n            (event?: MouseEvent<HTMLButtonElement>) => {\n                event?.stopPropagation();\n                if (isExpanded) {\n                    if (onShrink) {\n                        onShrink(id);\n                    }\n                } else {\n                    if (onExpand) {\n                        onExpand(id);\n                    }\n                }\n            },\n            [id, isExpanded, onExpand, onShrink],\n        );\n\n        useEffect(() => {\n            if (isParentSelected && !isSelected && onSelect) {\n                onSelect(id, true);\n            }\n        }, [id, onSelect, isParentSelected, isSelected]);\n\n        const hasChildren = Children.count(children) > 0;\n\n        const { enrichedChildren, childrenIds } = useMemo(() => {\n            const enrichedChildren = removeFragmentsAndEnrichChildren(children, {\n                parentId: id,\n                level: level + 1,\n            });\n\n            return {\n                enrichedChildren,\n                childrenIds: enrichedChildren.map((child) => child.props.id),\n            };\n        }, [children, id, level]);\n\n        useDeepCompareEffect(() => {\n            if (Children.count(enrichedChildren) === 0 || !isExpanded) {\n                unregisterNodeChildren?.(id);\n                return;\n            }\n\n            registerNodeChildren?.({ id, children: enrichedChildren });\n        }, [isExpanded, enrichedChildren, id]);\n\n        const itemStyleProps = useMemo<Required<TreeItemStyling>>(() => {\n            return {\n                spacingY: 'none',\n                contentHight: 'single-line',\n                shadow: 'none',\n                borderRadius: 'small',\n                borderWidth: 'none',\n                borderStyle: 'none',\n                activeColorStyle: 'neutral',\n                ...itemStyle,\n            };\n        }, [itemStyle]);\n\n        const { liClassName, backgroundClassName } = useMemo(() => {\n            return {\n                liClassName: getMultiselectLiClassName(itemStyleProps, isDisabled),\n                backgroundClassName: getMultiselectBackgroundClassName(itemStyleProps, isSelected, isDisabled),\n            };\n        }, [itemStyleProps, isDisabled, isSelected]);\n\n        const wrapperContentClassName = 'tw-max-w-full\ttw-grow';\n        const showChildren = isExpanded;\n        const showLabel = label !== undefined;\n        const showExpandButton = expandable && (showCaret ?? hasChildren);\n\n        const containerClassName = getMultiselectContainerClassName(itemStyleProps);\n\n        const levelPadding = level * INDENTATION_WIDTH;\n        const liStyle = { paddingLeft: levelPadding };\n        const backgroundStyle = itemStyleProps.borderWidth !== 'none' ? {} : { marginLeft: -1 * levelPadding };\n\n        const checkBoxOnSelect = () => {\n            if (!isDisabled && onSelect) {\n                onSelect(id, false);\n            }\n        };\n        const checkBox =\n            checkBoxPosition !== 'none' ? (\n                <Container maxWidth=\"16px\" maxHeight=\"16px\">\n                    <Checkbox\n                        id={`checkbox-${id}`}\n                        ref={setActiveNodeRef}\n                        disabled={isDisabled}\n                        aria-label={label ?? ''}\n                        emphasis={CheckboxEmphasis.Weak}\n                        helperText=\"\"\n                        hideLabel\n                        label=\"\"\n                        onChange={checkBoxOnSelect}\n                        size={CheckboxSize.Default}\n                        state={\n                            isDisabled\n                                ? CheckboxState.Unchecked\n                                : getMultiselectCheckBoxState(isSelected, isPartialSelected)\n                        }\n                        tooltip={[]}\n                        value={id}\n                    />\n                </Container>\n            ) : null;\n\n        return (\n            <li\n                id={id}\n                key={id}\n                tabIndex={0}\n                role=\"treeitem\"\n                style={liStyle}\n                onKeyDown={noop}\n                aria-label={label}\n                aria-level={level + 1}\n                className={liClassName}\n                data-test-id={dataTestId}\n                aria-selected={isSelected}\n                aria-expanded={isExpanded}\n                data-has-children={hasChildren}\n                aria-owns={childrenIds.join(' ')}\n            >\n                <div className={containerClassName}>\n                    <span className={backgroundClassName} style={backgroundStyle} aria-hidden />\n                    {checkBoxPosition === 'left' && checkBox}\n\n                    {expandable && (\n                        <ExpandButton\n                            onClick={toggleExpand}\n                            expanded={showChildren}\n                            disabled={!showExpandButton}\n                            aria-hidden={!showExpandButton}\n                            className={showExpandButton ? 'tw-visible' : 'tw-invisible tw-pointer-events-none'}\n                        />\n                    )}\n\n                    {showLabel && <span className=\"first:tw-ml-3.5 tw-h-full tw-flex tw-items-center\">{label}</span>}\n\n                    <div className={wrapperContentClassName}>{contentComponent}</div>\n\n                    {checkBoxPosition === 'right' && checkBox}\n                </div>\n            </li>\n        );\n    },\n);\n\nTreeItemMultiselect.displayName = 'FondueTreeItemMultiselect';\n"],"names":["TreeItemMultiselect","memo","id","label","showCaret","children","level","contentComponent","_parentId","onSelect","onExpand","onShrink","registerNodeChildren","unregisterNodeChildren","isDisabled","expandable","checkBoxPosition","itemStyle","dataTestId","setActiveNodeRef","useRef","isSelected","isExpanded","isPartialSelected","isParentSelected","useMultiselectTreeItem","toggleExpand","useCallback","event","useEffect","hasChildren","Children","enrichedChildren","childrenIds","useMemo","removeFragmentsAndEnrichChildren","child","useDeepCompareEffect","itemStyleProps","liClassName","backgroundClassName","getMultiselectLiClassName","getMultiselectBackgroundClassName","wrapperContentClassName","showChildren","showLabel","showExpandButton","containerClassName","getMultiselectContainerClassName","levelPadding","INDENTATION_WIDTH","liStyle","backgroundStyle","checkBoxOnSelect","checkBox","jsx","Container","Checkbox","CheckboxEmphasis","CheckboxSize","CheckboxState","getMultiselectCheckBoxState","noop","jsxs","ExpandButton"],"mappings":"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"}

package/dist/components/Tree/utils/useDeepCompareEffect.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDeepCompareEffect.es.js","sources":["../../../../src/components/Tree/utils/useDeepCompareEffect.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type DependencyList, type EffectCallback, useEffect, useRef } from 'react';\nimport isEqual from 'react-fast-compare';\n\nconst isPrimitive = (val: unknown): boolean => val !== Object(val);\n\nexport const useDeepCompareEffect = (effect: EffectCallback, deps: unknown[]): void => {\n    if (process.env.NODE_ENV !== 'production') {\n        if (!deps || deps.length === 0) {\n            console.warn('`useDeepCompareEffect` should not be used with no dependencies. Use `useEffect` instead.');\n        }\n\n        if (deps.every(isPrimitive)) {\n            console.warn(\n                '`useDeepCompareEffect` should not be used with dependencies that are all primitive values. Use `useEffect` instead.',\n            );\n        }\n    }\n\n    const ref = useRef<DependencyList | undefined>(undefined);\n\n    if (!isEqual(deps, ref.current)) {\n        ref.current = deps;\n    }\n\n    // Intended eslint disable, it doesn't pick ref.current as dependencies array\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    useEffect(effect, ref.current);\n};\n"],"names":["isPrimitive","val","useDeepCompareEffect","effect","deps","ref","useRef","isEqual","useEffect"],"mappings":";;AAKA,MAAMA,IAAc,CAACC,MAA0BA,MAAQ,OAAOA,CAAG,GAEpDC,IAAuB,CAACC,GAAwBC,MAA0B;AACnF,EAAI,QAAQ,IAAI,aAAa,kBACrB,CAACA,KAAQA,EAAK,WAAW,MACzB,QAAQ,KAAK,0FAA0F,GAGvGA,EAAK,MAAMJ,CAAW,KACtB,QAAQ;AAAA,IACJ;AAAA,EAAA;AAKZ,QAAMK,IAAMC,EAAmC,MAAS;AAExD,EAAKC,EAAQH,GAAMC,EAAI,OAAO,MAC1BA,EAAI,UAAUD,IAKlBI,EAAUL,GAAQE,EAAI,OAAO;AACjC;"}
+{"version":3,"file":"useDeepCompareEffect.es.js","sources":["../../../../src/components/Tree/utils/useDeepCompareEffect.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type DependencyList, type EffectCallback, useEffect, useRef } from 'react';\nimport isEqual from 'react-fast-compare';\n\nconst isPrimitive = (val: unknown): boolean => val !== Object(val);\n\nexport const useDeepCompareEffect = (effect: EffectCallback, deps: unknown[]): void => {\n    if (process.env.NODE_ENV !== 'production') {\n        if (!deps || deps.length === 0) {\n            console.warn('`useDeepCompareEffect` should not be used with no dependencies. Use `useEffect` instead.');\n        }\n\n        if (deps.every(isPrimitive)) {\n            console.warn(\n                '`useDeepCompareEffect` should not be used with dependencies that are all primitive values. Use `useEffect` instead.',\n            );\n        }\n    }\n\n    const ref = useRef<DependencyList | undefined>(undefined);\n\n    if (!isEqual(deps, ref.current)) {\n        ref.current = deps;\n    }\n\n    // Intended eslint disable, it doesn't pick ref.current as dependencies array\n    // eslint-disable-next-line @eslint-react/exhaustive-deps\n    useEffect(effect, ref.current);\n};\n"],"names":["isPrimitive","val","useDeepCompareEffect","effect","deps","ref","useRef","isEqual","useEffect"],"mappings":";;AAKA,MAAMA,IAAc,CAACC,MAA0BA,MAAQ,OAAOA,CAAG,GAEpDC,IAAuB,CAACC,GAAwBC,MAA0B;AACnF,EAAI,QAAQ,IAAI,aAAa,kBACrB,CAACA,KAAQA,EAAK,WAAW,MACzB,QAAQ,KAAK,0FAA0F,GAGvGA,EAAK,MAAMJ,CAAW,KACtB,QAAQ;AAAA,IACJ;AAAA,EAAA;AAKZ,QAAMK,IAAMC,EAAmC,MAAS;AAExD,EAAKC,EAAQH,GAAMC,EAAI,OAAO,MAC1BA,EAAI,UAAUD,IAKlBI,EAAUL,GAAQE,EAAI,OAAO;AACjC;"}

package/dist/hooks/useDropdownAutoHeight.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDropdownAutoHeight.es.js","sources":["../../src/hooks/useDropdownAutoHeight.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type MutableRefObject, useLayoutEffect, useState } from 'react';\n\n/**\n * @deprecated This component is deprecated and will be removed in the next major version.\n */\nexport const DEFAULT_DROPDOWN_MAX_HEIGHT = 'auto';\n\ntype DropdownAutoHeightProps = {\n    isOpen: boolean;\n    autoResize?: boolean;\n    isDialog?: boolean;\n};\n\nconst getInnerOverlayHeight = (triggerRef: MutableRefObject<HTMLElement | null>) => {\n    let maxHeight = 'auto';\n    if (triggerRef.current) {\n        const { innerHeight } = window;\n        const { bottom } = triggerRef.current.getBoundingClientRect();\n        const viewportPadding = 33;\n        const triggerMargin = 8;\n        maxHeight = `${Math.max(innerHeight - (bottom + viewportPadding + triggerMargin), 130)}px`;\n    }\n    return maxHeight;\n};\n\n/**\n * @deprecated This function is deprecated and will be removed in the next major version.\n */\nexport const useDropdownAutoHeight = (\n    triggerRef: MutableRefObject<HTMLElement | null>,\n    { isOpen, autoResize }: DropdownAutoHeightProps,\n) => {\n    const [maxHeight, setMaxHeight] = useState(DEFAULT_DROPDOWN_MAX_HEIGHT);\n    useLayoutEffect(() => {\n        const updateMaxHeight = () => setMaxHeight(getInnerOverlayHeight(triggerRef));\n        if (autoResize && isOpen) {\n            updateMaxHeight();\n            window.addEventListener('resize', updateMaxHeight);\n        } else if (autoResize && !isOpen) {\n            // eslint-disable-next-line react-hooks/set-state-in-effect\n            setMaxHeight(DEFAULT_DROPDOWN_MAX_HEIGHT);\n        }\n\n        return () => {\n            if (isOpen && autoResize) {\n                window.removeEventListener('resize', updateMaxHeight);\n            }\n        };\n    }, [isOpen, autoResize, triggerRef]);\n\n    return { maxHeight };\n};\n"],"names":["DEFAULT_DROPDOWN_MAX_HEIGHT","getInnerOverlayHeight","triggerRef","maxHeight","innerHeight","bottom","useDropdownAutoHeight","isOpen","autoResize","setMaxHeight","useState","useLayoutEffect","updateMaxHeight"],"mappings":";AAOO,MAAMA,IAA8B,QAQrCC,IAAwB,CAACC,MAAqD;AAChF,MAAIC,IAAY;AAChB,MAAID,EAAW,SAAS;AACpB,UAAM,EAAE,aAAAE,MAAgB,QAClB,EAAE,QAAAC,EAAA,IAAWH,EAAW,QAAQ,sBAAA;AAGtC,IAAAC,IAAY,GAAG,KAAK,IAAIC,KAAeC,IAFf,KACF,IAC4D,GAAG,CAAC;AAAA,EAC1F;AACA,SAAOF;AACX,GAKaG,IAAwB,CACjCJ,GACA,EAAE,QAAAK,GAAQ,YAAAC,QACT;AACD,QAAM,CAACL,GAAWM,CAAY,IAAIC,EAASV,CAA2B;AACtE,SAAAW,EAAgB,MAAM;AAClB,UAAMC,IAAkB,MAAMH,EAAaR,EAAsBC,CAAU,CAAC;AAC5E,WAAkBK,KACdK,EAAA,GACA,OAAO,iBAAiB,UAAUA,CAAe,KAC3BL,KAEtBE,EAAaT,CAA2B,GAGrC,MAAM;AACT,MAAIO,KAAUC,KACV,OAAO,oBAAoB,UAAUI,CAAe;AAAA,IAE5D;AAAA,EACJ,GAAG,CAACL,GAAQC,GAAYN,CAAU,CAAC,GAE5B,EAAE,WAAAC,EAAA;AACb;"}
+{"version":3,"file":"useDropdownAutoHeight.es.js","sources":["../../src/hooks/useDropdownAutoHeight.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type MutableRefObject, useLayoutEffect, useState } from 'react';\n\n/**\n * @deprecated This component is deprecated and will be removed in the next major version.\n */\nexport const DEFAULT_DROPDOWN_MAX_HEIGHT = 'auto';\n\ntype DropdownAutoHeightProps = {\n    isOpen: boolean;\n    autoResize?: boolean;\n    isDialog?: boolean;\n};\n\nconst getInnerOverlayHeight = (triggerRef: MutableRefObject<HTMLElement | null>) => {\n    let maxHeight = 'auto';\n    if (triggerRef.current) {\n        const { innerHeight } = window;\n        const { bottom } = triggerRef.current.getBoundingClientRect();\n        const viewportPadding = 33;\n        const triggerMargin = 8;\n        maxHeight = `${Math.max(innerHeight - (bottom + viewportPadding + triggerMargin), 130)}px`;\n    }\n    return maxHeight;\n};\n\n/**\n * @deprecated This function is deprecated and will be removed in the next major version.\n */\nexport const useDropdownAutoHeight = (\n    triggerRef: MutableRefObject<HTMLElement | null>,\n    { isOpen, autoResize }: DropdownAutoHeightProps,\n) => {\n    const [maxHeight, setMaxHeight] = useState(DEFAULT_DROPDOWN_MAX_HEIGHT);\n    useLayoutEffect(() => {\n        const updateMaxHeight = () => setMaxHeight(getInnerOverlayHeight(triggerRef));\n        if (autoResize && isOpen) {\n            updateMaxHeight();\n            window.addEventListener('resize', updateMaxHeight);\n        } else if (autoResize && !isOpen) {\n            // eslint-disable-next-line @eslint-react/set-state-in-effect\n            setMaxHeight(DEFAULT_DROPDOWN_MAX_HEIGHT);\n        }\n\n        return () => {\n            if (isOpen && autoResize) {\n                window.removeEventListener('resize', updateMaxHeight);\n            }\n        };\n    }, [isOpen, autoResize, triggerRef]);\n\n    return { maxHeight };\n};\n"],"names":["DEFAULT_DROPDOWN_MAX_HEIGHT","getInnerOverlayHeight","triggerRef","maxHeight","innerHeight","bottom","useDropdownAutoHeight","isOpen","autoResize","setMaxHeight","useState","useLayoutEffect","updateMaxHeight"],"mappings":";AAOO,MAAMA,IAA8B,QAQrCC,IAAwB,CAACC,MAAqD;AAChF,MAAIC,IAAY;AAChB,MAAID,EAAW,SAAS;AACpB,UAAM,EAAE,aAAAE,MAAgB,QAClB,EAAE,QAAAC,EAAA,IAAWH,EAAW,QAAQ,sBAAA;AAGtC,IAAAC,IAAY,GAAG,KAAK,IAAIC,KAAeC,IAFf,KACF,IAC4D,GAAG,CAAC;AAAA,EAC1F;AACA,SAAOF;AACX,GAKaG,IAAwB,CACjCJ,GACA,EAAE,QAAAK,GAAQ,YAAAC,QACT;AACD,QAAM,CAACL,GAAWM,CAAY,IAAIC,EAASV,CAA2B;AACtE,SAAAW,EAAgB,MAAM;AAClB,UAAMC,IAAkB,MAAMH,EAAaR,EAAsBC,CAAU,CAAC;AAC5E,WAAkBK,KACdK,EAAA,GACA,OAAO,iBAAiB,UAAUA,CAAe,KAC3BL,KAEtBE,EAAaT,CAA2B,GAGrC,MAAM;AACT,MAAIO,KAAUC,KACV,OAAO,oBAAoB,UAAUI,CAAe;AAAA,IAE5D;AAAA,EACJ,GAAG,CAACL,GAAQC,GAAYN,CAAU,CAAC,GAE5B,EAAE,WAAAC,EAAA;AACb;"}