npm - @frontify/fondue - Versions diffs - 12.0.0-beta.197 → 12.0.0-beta.199 - Mend

@frontify/fondue 12.0.0-beta.197 → 12.0.0-beta.199

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (20) hide show

package/dist/components/Tree/Tree.es.js CHANGED Viewed

@@ -1,12 +1,12 @@
-import f, { memo as ue, useMemo as _, useReducer as me, useState as N, useEffect as x, useCallback as I, useRef as Ie, useLayoutEffect as Se, cloneElement as ge } from "react";
+import f, { memo as ue, useMemo as N, useReducer as me, useState as x, useEffect as b, useCallback as I, useRef as Ie, useLayoutEffect as Se, cloneElement as ge } from "react";
 import { SortableContext as Te, verticalListSortingStrategy as De } from "@dnd-kit/sortable";
 import { restrictToWindowEdges as fe } from "@dnd-kit/modifiers";
 import { enableMapSet as we, produce as Ce } from "immer";
 import { createPortal as Oe } from "react-dom";
-import { MeasuringStrategy as Re, KeyboardCode as w, useSensors as _e, useSensor as B, PointerSensor as Ne, KeyboardSensor as xe, DndContext as be, closestCenter as he, DragOverlay as ke } from "@dnd-kit/core";
-import { TreeContext as Le } from "./TreeContext.es.js";
-import { getReactNodeIdsInFlatArray as Me, removeReactNodesFromFlatArray as ve } from "./helpers/nodes.es.js";
-import Ae from "../../node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/isEqual.es.js";
+import Re from "../../node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/isEqual.es.js";
+import { MeasuringStrategy as _e, KeyboardCode as w, useSensors as Ne, useSensor as B, PointerSensor as xe, KeyboardSensor as be, DndContext as ke, closestCenter as he, DragOverlay as Le } from "@dnd-kit/core";
+import { TreeContext as Me } from "./TreeContext.es.js";
+import { getReactNodeIdsInFlatArray as ve, removeReactNodesFromFlatArray as Ae } from "./helpers/nodes.es.js";
 import { sortableTreeKeyboardCoordinates as Pe } from "./utils/keyboardCoordinates.es.js";
 import { getMovementAnnouncement as j } from "./helpers/getMovementAnnouncements.es.js";
 import { TreeItemOverlay as je } from "./TreeItem/TreeItemOverlay.es.js";
@@ -14,7 +14,7 @@ import { removeFragmentsAndEnrichChildren as Q } from "./utils/removeFragmentsAn
 import { getProjection as Ge } from "./helpers/projection.es.js";
 const G = "__ROOT__", nt = 32, He = {
   droppable: {
-    strategy: Re.Always
+    strategy: _e.Always
   }
 };
 we();
@@ -22,8 +22,8 @@ const Ke = Ce((o, d) => {
   switch (d.type) {
     case "SET_SELECT":
       {
-        const a = new Set(o.selectedIds), i = !o.selectedIds.has(d.payload);
-        i && o.selectionMode === "single" && a.clear(), i ? a.add(d.payload) : a.delete(d.payload), o.selectedIds = a;
+        const a = new Set(o.selectedIds), c = !o.selectedIds.has(d.payload);
+        c && o.selectionMode === "single" && a.clear(), c ? a.add(d.payload) : a.delete(d.payload), o.selectedIds = a;
       }
       break;
     case "SET_EXPAND":
@@ -43,26 +43,28 @@ const Ke = Ce((o, d) => {
       break;
     case "REGISTER_NODE_CHILDREN":
       {
-        const { id: a, children: i } = d.payload, u = o.nodes.findIndex((p) => p.props.id === a);
+        const { id: a, children: c } = d.payload, u = o.nodes.findIndex((i) => i.props.id === a);
         if (u === -1) {
           console.error(`Element with ID "${a}" not found.`);
           return;
         }
-        const y = u + 1, S = o.nodes.slice(y, i.length - 1).map((p) => p.props.id), b = i.map((p) => p.props.id);
-        if (Ae(S, b))
+        const y = u + 1, S = o.nodes.slice(y, c.length - 1).map((i) => i.props.id), C = c.map((i) => i.props.id);
+        if (Re(S, C))
           return;
         const g = [
           ...o.nodes.slice(0, y),
-          ...i,
+          ...c,
           ...o.nodes.slice(y)
-        ].filter((p, k, t) => k === t.findIndex((l) => l.key === p.key));
+        ].filter(
+          (i, h, t) => h === t.findIndex((l) => l.key === i.key) && (i.props.parentId === a && C.includes(i.key) || i.props.parentId !== a)
+        );
         o.nodes = g;
       }
       break;
     case "UNREGISTER_NODE_CHILDREN":
       {
-        const a = Me(o.nodes, d.payload);
-        o.nodes = ve(o.nodes, a);
+        const a = ve(o.nodes, d.payload);
+        o.nodes = Ae(o.nodes, a);
       }
       break;
     case "REGISTER_ROOT_NODES":
@@ -85,16 +87,16 @@ const Ke = Ce((o, d) => {
     id: o,
     onDrop: d,
     onSelect: a,
-    onExpand: i,
+    onExpand: c,
     children: u,
     selectedIds: y,
     expandedIds: S,
-    draggable: b = !1,
+    draggable: C = !1,
     multiselect: g = !1,
-    "data-test-id": p = "fondue-tree"
+    "data-test-id": i = "fondue-tree"
   }) => {
     var J, W;
-    const k = _(
+    const h = N(
       () => ({
         selectionMode: "single",
         selectedIds: new Set(y ?? []),
@@ -103,8 +105,8 @@ const Ke = Ce((o, d) => {
         projection: null
       }),
       [u, S, y]
-    ), [t, l] = me(Ke, k), [C, H] = N(0), [L, M] = N(null), [O, K] = N(null), [h, R] = N(null), Z = _(() => t.nodes.map((e) => e.props.id), [t.nodes]);
-    x(() => {
+    ), [t, l] = me(Ke, h), [O, H] = x(0), [L, M] = x(null), [R, K] = x(null), [k, _] = x(null), Z = N(() => t.nodes.map((e) => e.props.id), [t.nodes]);
+    b(() => {
       const e = (n) => {
         g && (n.key === "Meta" || n.ctrlKey) && l({
           type: "SET_SELECTION_MODE",
@@ -138,14 +140,14 @@ const Ke = Ce((o, d) => {
       [a]
     ), D = I(
       (e) => {
-        if (i)
-          return i(e);
+        if (c)
+          return c(e);
         l({
           type: "SET_EXPAND",
           payload: e
         });
       },
-      [i]
+      [c]
     ), ee = I(
       (e) => {
         var s;
@@ -161,7 +163,7 @@ const Ke = Ce((o, d) => {
     ), te = ({ active: { id: e } }) => {
       K(e), M(e);
       const r = t.nodes.find((n) => n.props.id === e);
-      r && R({
+      r && _({
         parentId: r.props.parentId,
         overId: e
       }), document.body.style.setProperty("cursor", "grabbing");
@@ -172,7 +174,7 @@ const Ke = Ce((o, d) => {
     }, se = () => {
       $();
     }, $ = () => {
-      M(null), K(null), H(0), R(null), document.body.style.setProperty("cursor", "");
+      M(null), K(null), H(0), _(null), document.body.style.setProperty("cursor", "");
     }, de = I(
       (e) => {
         const r = document.activeElement;
@@ -180,7 +182,7 @@ const Ke = Ce((o, d) => {
           return;
         const n = Array.from(r.parentElement.children).filter(
           (m) => m.nodeName === "LI"
-        ), s = n.indexOf(r), c = t.nodes[s], E = c.props.id, Y = t.expandedIds.has(E), v = c.props.parentId, A = r.getAttribute("data-has-children") === "true", { code: pe } = e, q = () => {
+        ), s = n.indexOf(r), p = t.nodes[s], E = p.props.id, Y = t.expandedIds.has(E), v = p.props.parentId, A = r.getAttribute("data-has-children") === "true", { code: pe } = e, q = () => {
           e.preventDefault(), T(E);
         }, P = () => {
           e.preventDefault(), D(E);
@@ -222,14 +224,14 @@ const Ke = Ce((o, d) => {
       [D, T, t.expandedIds, t.nodes]
     ), V = Ie({
       nodes: t.nodes,
-      offset: C
-    }), [re] = N(() => Pe(V)), ae = _e(B(Ne), B(xe, { coordinateGetter: re })), le = _(() => {
+      offset: O
+    }), [re] = x(() => Pe(V)), ae = Ne(B(xe), B(be, { coordinateGetter: re })), le = N(() => {
       const e = (n) => {
-        var s, c;
-        return (c = (s = t.nodes.find((E) => E.key === n.id)) == null ? void 0 : s.props.contentComponent) == null ? void 0 : c.props.title;
+        var s, p;
+        return (p = (s = t.nodes.find((E) => E.key === n.id)) == null ? void 0 : s.props.contentComponent) == null ? void 0 : p.props.title;
       }, r = (n) => {
-        var s, c;
-        return (c = (s = t.nodes.find((E) => E.key === (n == null ? void 0 : n.id))) == null ? void 0 : s.props.contentComponent) == null ? void 0 : c.props.title;
+        var s, p;
+        return (p = (s = t.nodes.find((E) => E.key === (n == null ? void 0 : n.id))) == null ? void 0 : s.props.contentComponent) == null ? void 0 : p.props.title;
       };
       return {
         onDragStart({ active: n }) {
@@ -243,8 +245,8 @@ const Ke = Ce((o, d) => {
             overId: s == null ? void 0 : s.id,
             overTitle: r(s),
             treeState: t,
-            setCurrentPosition: R,
-            currentPosition: h
+            setCurrentPosition: _,
+            currentPosition: k
           });
         },
         onDragOver({ active: n, over: s }) {
@@ -255,8 +257,8 @@ const Ke = Ce((o, d) => {
             overId: s == null ? void 0 : s.id,
             overTitle: r(s),
             treeState: t,
-            setCurrentPosition: R,
-            currentPosition: h
+            setCurrentPosition: _,
+            currentPosition: k
           });
         },
         onDragEnd({ active: n, over: s }) {
@@ -267,53 +269,53 @@ const Ke = Ce((o, d) => {
             overId: s == null ? void 0 : s.id,
             overTitle: r(s),
             treeState: t,
-            setCurrentPosition: R,
-            currentPosition: h
+            setCurrentPosition: _,
+            currentPosition: k
           });
         },
         onDragCancel({ active: n }) {
-          var c;
-          return `Moving was cancelled. ${((c = t.nodes.find((E) => E.key === n.id)) == null ? void 0 : c.props.contentComponent.props.title) || n.id} was dropped in its original position.`;
+          var p;
+          return `Moving was cancelled. ${((p = t.nodes.find((E) => E.key === n.id)) == null ? void 0 : p.props.contentComponent.props.title) || n.id} was dropped in its original position.`;
         }
       };
-    }, [h, t]);
+    }, [k, t]);
     Se(() => {
       l({
         type: "REGISTER_ROOT_NODES",
         payload: Q(u, { parentId: G, level: 0 })
       });
-    }, [u]), x(() => {
+    }, [u]), b(() => {
       l({
         type: "REPLACE_EXPANDED",
         payload: S ?? []
       });
-    }, [S]), x(() => {
+    }, [S]), b(() => {
       l({
         type: "REPLACE_SELECTED",
         payload: y ?? []
       });
-    }, [y]), x(() => {
+    }, [y]), b(() => {
       V.current = {
         nodes: t.nodes,
-        offset: C
+        offset: O
       };
-    }, [C, t.nodes]), x(() => {
-      const e = O && L ? Ge({
+    }, [O, t.nodes]), b(() => {
+      const e = R && L ? Ge({
         nodes: t.nodes,
-        activeId: O,
+        activeId: R,
         overId: L,
-        dragOffset: C
+        dragOffset: O
       }) : null;
       l({
         type: "SET_PROJECTION",
         payload: e
       });
-    }, [O, C, L, t.nodes]);
-    const ie = _(
+    }, [R, O, L, t.nodes]);
+    const ie = N(
       () => t.nodes.map((e) => ge(e, {
         ...e.props,
-        projection: e.props.id === O ? t.projection : null,
-        treeDraggable: b,
+        projection: e.props.id === R ? t.projection : null,
+        treeDraggable: C,
         isSelected: t.selectedIds.has(e.props.id),
         isExpanded: t.expandedIds.has(e.props.id),
         registerOverlay: F,
@@ -323,10 +325,10 @@ const Ke = Ce((o, d) => {
         onSelect: T
       })),
       [
-        b,
+        C,
         D,
         T,
-        O,
+        R,
         U,
         F,
         t.expandedIds,
@@ -335,7 +337,7 @@ const Ke = Ce((o, d) => {
         t.selectedIds,
         X
       ]
-    ), ce = _(
+    ), ce = N(
       () => ({
         treeState: t,
         onSelect: T,
@@ -343,18 +345,18 @@ const Ke = Ce((o, d) => {
       }),
       [t, T, D]
     );
-    return /* @__PURE__ */ f.createElement(Le.Provider, { value: ce }, /* @__PURE__ */ f.createElement(
+    return /* @__PURE__ */ f.createElement(Me.Provider, { value: ce }, /* @__PURE__ */ f.createElement(
       "ul",
       {
         id: o,
         role: "tree",
-        "data-test-id": p,
+        "data-test-id": i,
         onKeyDown: de,
         "aria-multiselectable": t.selectionMode === "multiselect",
         className: "tw-p-0 tw-m-0 tw-font-sans tw-font-normal tw-list-none tw-text-left tw-text-sm tw-select-none"
       },
       /* @__PURE__ */ f.createElement(
-        be,
+        ke,
         {
           sensors: ae,
           measuring: He,
@@ -368,7 +370,7 @@ const Ke = Ce((o, d) => {
         },
         /* @__PURE__ */ f.createElement(Te, { items: Z, strategy: De }, ie),
         Oe(
-          /* @__PURE__ */ f.createElement(ke, { wrapperElement: "ul", dropAnimation: null, modifiers: [fe] }, t.overlay && /* @__PURE__ */ f.createElement(
+          /* @__PURE__ */ f.createElement(Le, { wrapperElement: "ul", dropAnimation: null, modifiers: [fe] }, t.overlay && /* @__PURE__ */ f.createElement(
             je,
             {
               ...t.overlay,

package/dist/components/Tree/Tree.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tree.es.js","sources":["../../../src/components/Tree/Tree.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport React, {\n cloneElement,\n memo,\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useReducer,\n useRef,\n useState,\n} from 'react';\nimport { SortableContext, verticalListSortingStrategy } from '@dnd-kit/sortable';\nimport { restrictToWindowEdges } from '@dnd-kit/modifiers';\nimport { enableMapSet, produce } from 'immer';\nimport { createPortal } from 'react-dom';\nimport { isEqual } from 'lodash-es';\nimport {\n DndContext,\n DragEndEvent,\n DragMoveEvent,\n DragOverlay,\n KeyboardCode,\n KeyboardSensor,\n MeasuringConfiguration,\n MeasuringStrategy,\n PointerSensor,\n closestCenter,\n useSensor,\n useSensors,\n} from '@dnd-kit/core';\n\nimport type {\n RegisterNodeChildrenPayload,\n SensorContext,\n TreeActive,\n TreeAnnouncements,\n TreeDragOverEvent,\n TreeDragStartEvent,\n TreeOver,\n TreeProps,\n TreeState,\n TreeStateAction,\n} from '@components/Tree/types';\n\nimport { type Overlay, TreeItemOverlay } from './TreeItem';\nimport {\n getMovementAnnouncement,\n getProjection,\n getReactNodeIdsInFlatArray,\n removeReactNodesFromFlatArray,\n} from './helpers';\nimport { removeFragmentsAndEnrichChildren, sortableTreeKeyboardCoordinates } from './utils';\nimport { TreeContext, TreeContextProps } from './TreeContext';\n\nexport const ROOT_ID = '__ROOT__';\nexport const INDENTATION_WIDTH = 32;\n\nconst measuring: MeasuringConfiguration = {\n droppable: {\n strategy: MeasuringStrategy.Always,\n },\n};\n\nenableMapSet();\n\nconst reducer = produce((draft: TreeState, action: TreeStateAction) => {\n switch (action.type) {\n case 'SET_SELECT':\n {\n const newSelected = new Set(draft.selectedIds);\n\n const isSelected = !draft.selectedIds.has(action.payload);\n\n if (isSelected && draft.selectionMode === 'single') {\n newSelected.clear();\n }\n\n isSelected ? newSelected.add(action.payload) : newSelected.delete(action.payload);\n\n draft.selectedIds = newSelected;\n }\n break;\n\n case 'SET_EXPAND':\n {\n const newExpanded = new Set(draft.expandedIds);\n\n const isExpanded = !draft.expandedIds.has(action.payload);\n\n isExpanded ? newExpanded.add(action.payload) : newExpanded.delete(action.payload);\n\n draft.expandedIds = newExpanded;\n }\n break;\n\n case 'SET_SELECTION_MODE':\n {\n draft.selectionMode = action.payload.selectionMode;\n }\n break;\n\n case 'SET_PROJECTION':\n {\n draft.projection = action.payload;\n }\n break;\n\n case 'REGISTER_OVERLAY_ITEM':\n {\n draft.overlay = action.payload;\n }\n break;\n\n case 'REGISTER_NODE_CHILDREN':\n {\n const { id, children } = action.payload;\n\n const index = draft.nodes.findIndex((node) => node.props.id === id);\n\n if (index === -1) {\n console.error(`Element with ID \"${id}\" not found.`);\n return;\n }\n\n const sliceIndex = index + 1;\n\n const currentNodeChildrenIds = draft.nodes\n .slice(sliceIndex, children.length - 1)\n .map((node) => node.props.id);\n\n const newNodeChildrenIds = children.map((node) => node.props.id);\n\n if (isEqual(currentNodeChildrenIds, newNodeChildrenIds)) {\n return;\n }\n\n const nodes = [\n ...draft.nodes.slice(0, sliceIndex),\n ...children,\n ...draft.nodes.slice(sliceIndex),\n ].filter((node, index, self) => index === self.findIndex((item) => item.key === node.key));\n\n draft.nodes = nodes;\n }\n break;\n\n case 'UNREGISTER_NODE_CHILDREN':\n {\n const nodeIds = getReactNodeIdsInFlatArray(draft.nodes, action.payload);\n\n draft.nodes = removeReactNodesFromFlatArray(draft.nodes, nodeIds);\n }\n break;\n\n case 'REGISTER_ROOT_NODES':\n {\n draft.nodes = action.payload;\n }\n break;\n\n case 'REPLACE_EXPANDED':\n {\n draft.expandedIds = new Set(action.payload);\n }\n break;\n\n case 'REPLACE_SELECTED':\n {\n draft.selectedIds = new Set(action.payload);\n }\n break;\n\n case 'REPLACE_STATE':\n draft.nodes = action.payload.nodes;\n draft.overlay = action.payload.overlay;\n draft.projection = action.payload.projection;\n draft.selectedIds = action.payload.selectedIds;\n draft.expandedIds = action.payload.expandedIds;\n draft.selectionMode = action.payload.selectionMode;\n break;\n default:\n console.warn(`Updated tree with action \"${action.type}\" but it has not effect.`);\n }\n});\n\nexport const Tree = memo(\n ({\n id,\n onDrop,\n onSelect,\n onExpand,\n children,\n selectedIds,\n expandedIds,\n draggable = false,\n multiselect = false,\n 'data-test-id': dataTestId = 'fondue-tree',\n }: TreeProps) => {\n const initialState: TreeState = useMemo(\n () => ({\n selectionMode: 'single',\n selectedIds: new Set(selectedIds ?? []),\n expandedIds: new Set(expandedIds ?? []),\n nodes: removeFragmentsAndEnrichChildren(children, { parentId: ROOT_ID, level: 0 }),\n projection: null,\n }),\n [children, expandedIds, selectedIds],\n );\n\n const [treeState, updateTreeState] = useReducer(reducer, initialState);\n const [offset, setOffset] = useState(0);\n const [overId, setOverId] = useState<Nullable<string>>(null);\n const [activeId, setActiveId] = useState<Nullable<string>>(null);\n const [currentPosition, setCurrentPosition] =\n useState<Nullable<{ overId: string; parentId: Nullable<string> }>>(null);\n\n const items = useMemo(() => treeState.nodes.map((node) => node.props.id), [treeState.nodes]);\n\n useEffect(() => {\n const keyDownHandler = (event: globalThis.KeyboardEvent) => {\n if (multiselect && (event.key === 'Meta' \|\| event.ctrlKey)) {\n updateTreeState({\n type: 'SET_SELECTION_MODE',\n payload: { selectionMode: 'multiselect' },\n });\n }\n };\n\n const keyUpHandler = (event: globalThis.KeyboardEvent) => {\n if (multiselect && (event.key === 'Meta' \|\| event.ctrlKey)) {\n updateTreeState({\n type: 'SET_SELECTION_MODE',\n payload: { selectionMode: 'single' },\n });\n }\n };\n\n if (multiselect) {\n window.addEventListener('keydown', keyDownHandler);\n window.addEventListener('keyup', keyUpHandler);\n }\n\n return () => {\n window.removeEventListener('keydown', keyDownHandler);\n window.removeEventListener('keyup', keyUpHandler);\n };\n }, [multiselect]);\n\n const registerOverlay = useCallback((overlay: Overlay) => {\n updateTreeState({ type: 'REGISTER_OVERLAY_ITEM', payload: overlay });\n }, []);\n\n const registerNodeChildren = useCallback((payload: RegisterNodeChildrenPayload) => {\n updateTreeState({ type: 'REGISTER_NODE_CHILDREN', payload });\n }, []);\n\n const unregisterNodeChildren = useCallback((payload: string) => {\n updateTreeState({ type: 'UNREGISTER_NODE_CHILDREN', payload });\n }, []);\n\n const handleSelect = useCallback(\n (id: string) => {\n if (onSelect) {\n return onSelect(id);\n }\n\n updateTreeState({\n type: 'SET_SELECT',\n payload: id,\n });\n },\n [onSelect],\n );\n\n const handleExpand = useCallback(\n (id: string) => {\n if (onExpand) {\n return onExpand(id);\n }\n\n updateTreeState({\n type: 'SET_EXPAND',\n payload: id,\n });\n },\n [onExpand],\n );\n\n const handleDragEnd = useCallback(\n (event: DragEndEvent) => {\n resetState();\n\n const { over, active } = event;\n\n if (!over?.id \|\| !active?.id \|\| !treeState.projection?.parentId) {\n return;\n }\n\n onDrop?.({\n id: active.id.toString(),\n parentId: treeState.projection.parentId,\n sort: treeState.projection.position,\n });\n },\n [onDrop, treeState.projection?.parentId, treeState.projection?.position],\n );\n\n const handleDragStart = ({ active: { id: activeId } }: TreeDragStartEvent) => {\n setActiveId(activeId);\n setOverId(activeId);\n\n const activeNode = treeState.nodes.find((node) => node.props.id === activeId);\n\n if (activeNode) {\n setCurrentPosition({\n parentId: activeNode.props.parentId,\n overId: activeId,\n });\n }\n\n document.body.style.setProperty('cursor', 'grabbing');\n };\n\n const handleDragOver = ({ over }: TreeDragOverEvent) => {\n setOverId(over?.id ?? null);\n };\n\n const handleDragMove = ({ delta }: DragMoveEvent) => {\n setOffset(delta.x);\n };\n\n const handleDragCancel = () => {\n resetState();\n };\n\n const resetState = () => {\n setOverId(null);\n setActiveId(null);\n setOffset(0);\n setCurrentPosition(null);\n\n document.body.style.setProperty('cursor', '');\n };\n\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLUListElement>) => {\n const activeElement = document.activeElement;\n\n if (!activeElement \|\| !activeElement.parentElement \|\| !(activeElement instanceof HTMLLIElement)) {\n return;\n }\n\n const items = Array.from(activeElement.parentElement.children).filter(\n (child) => child.nodeName === 'LI',\n ) as HTMLLIElement[];\n\n const currentIndex = items.indexOf(activeElement);\n\n const node = treeState.nodes[currentIndex];\n\n const id: string = node.props.id;\n const isExpanded = treeState.expandedIds.has(id);\n const parentId: string = node.props.parentId;\n const hasChildren = activeElement.getAttribute('data-has-children') === 'true';\n\n const { code } = event;\n\n const toggleSelect = () => {\n event.preventDefault();\n\n handleSelect(id);\n };\n\n const toggleExpand = () => {\n event.preventDefault();\n\n handleExpand(id);\n };\n\n const focusPrevious = () => {\n const previousIndex = (currentIndex + items.length - 1) % items.length;\n items[previousIndex].focus();\n };\n\n const focusNext = () => {\n const nextIndex = (currentIndex + 1) % items.length;\n items[nextIndex].focus();\n };\n\n switch (code) {\n case KeyboardCode.Enter:\n toggleSelect();\n\n break;\n\n case KeyboardCode.Space:\n hasChildren ? toggleExpand() : toggleSelect();\n\n break;\n\n case KeyboardCode.Right:\n if (!hasChildren) {\n break;\n }\n\n isExpanded ? focusNext() : toggleExpand();\n\n break;\n\n case KeyboardCode.Left:\n if (hasChildren && isExpanded) {\n toggleExpand();\n } else if (parentId && parentId !== ROOT_ID) {\n const parentIndex = treeState.nodes.findIndex((node) => node.props.id === parentId);\n\n items[parentIndex].focus();\n }\n break;\n\n case KeyboardCode.Up:\n event.preventDefault();\n focusPrevious();\n\n break;\n\n case KeyboardCode.Down:\n event.preventDefault();\n focusNext();\n\n break;\n\n default:\n break;\n }\n },\n [handleExpand, handleSelect, treeState.expandedIds, treeState.nodes],\n );\n\n const sensorContext: SensorContext = useRef({\n nodes: treeState.nodes,\n offset,\n });\n\n const [coordinateGetter] = useState(() => sortableTreeKeyboardCoordinates(sensorContext));\n\n const sensors = useSensors(useSensor(PointerSensor), useSensor(KeyboardSensor, { coordinateGetter }));\n\n const announcements: TreeAnnouncements = useMemo(() => {\n const getActiveTitle = (active: TreeActive) =>\n treeState.nodes.find((node) => node.key === active.id)?.props.contentComponent?.props.title;\n const getOverTitle = (over: TreeOver \| null) =>\n treeState.nodes.find((node) => node.key === over?.id)?.props.contentComponent?.props.title;\n\n return {\n onDragStart({ active }) {\n return `Picked up ${getActiveTitle(active) \|\| active.id}.`;\n },\n onDragMove({ active, over }) {\n return getMovementAnnouncement({\n eventName: 'onDragMove',\n activeId: active.id,\n activeTitle: getActiveTitle(active),\n overId: over?.id,\n overTitle: getOverTitle(over),\n treeState,\n setCurrentPosition,\n currentPosition,\n });\n },\n onDragOver({ active, over }) {\n return getMovementAnnouncement({\n eventName: 'onDragOver',\n activeId: active.id,\n activeTitle: getActiveTitle(active),\n overId: over?.id,\n overTitle: getOverTitle(over),\n treeState,\n setCurrentPosition,\n currentPosition,\n });\n },\n onDragEnd({ active, over }) {\n return getMovementAnnouncement({\n eventName: 'onDragEnd',\n activeId: active.id,\n activeTitle: getActiveTitle(active),\n overId: over?.id,\n overTitle: getOverTitle(over),\n treeState,\n setCurrentPosition,\n currentPosition,\n });\n },\n onDragCancel({ active }) {\n const nodeTitle = treeState.nodes.find((node) => node.key === active.id)?.props.contentComponent\n .props.title;\n\n return `Moving was cancelled. ${nodeTitle \|\| active.id} was dropped in its original position.`;\n },\n };\n }, [currentPosition, treeState]);\n\n useLayoutEffect(() => {\n updateTreeState({\n type: 'REGISTER_ROOT_NODES',\n payload: removeFragmentsAndEnrichChildren(children, { parentId: ROOT_ID, level: 0 }),\n });\n }, [children]);\n\n useEffect(() => {\n updateTreeState({\n type: 'REPLACE_EXPANDED',\n payload: expandedIds ?? [],\n });\n }, [expandedIds]);\n\n useEffect(() => {\n updateTreeState({\n type: 'REPLACE_SELECTED',\n payload: selectedIds ?? [],\n });\n }, [selectedIds]);\n\n useEffect(() => {\n sensorContext.current = {\n nodes: treeState.nodes,\n offset,\n };\n }, [offset, treeState.nodes]);\n\n useEffect(() => {\n const projection =\n activeId && overId\n ? getProjection({\n nodes: treeState.nodes,\n activeId,\n overId,\n dragOffset: offset,\n })\n : null;\n\n updateTreeState({\n type: 'SET_PROJECTION',\n payload: projection,\n });\n }, [activeId, offset, overId, treeState.nodes]);\n\n const nodes = useMemo(\n () =>\n treeState.nodes.map((node) => {\n return cloneElement(node, {\n ...node.props,\n projection: node.props.id === activeId ? treeState.projection : null,\n treeDraggable: draggable,\n isSelected: treeState.selectedIds.has(node.props.id),\n isExpanded: treeState.expandedIds.has(node.props.id),\n registerOverlay,\n registerNodeChildren,\n unregisterNodeChildren,\n onExpand: handleExpand,\n onSelect: handleSelect,\n });\n }),\n [\n draggable,\n handleExpand,\n handleSelect,\n activeId,\n registerNodeChildren,\n registerOverlay,\n treeState.expandedIds,\n treeState.nodes,\n treeState.projection,\n treeState.selectedIds,\n unregisterNodeChildren,\n ],\n );\n\n const contextValue: TreeContextProps = useMemo(\n () => ({\n treeState,\n onSelect: handleSelect,\n onExpand: handleExpand,\n }),\n [treeState, handleSelect, handleExpand],\n );\n\n return (\n <TreeContext.Provider value={contextValue}>\n <ul\n id={id}\n role=\"tree\"\n data-test-id={dataTestId}\n onKeyDown={handleKeyDown}\n aria-multiselectable={treeState.selectionMode === 'multiselect'}\n className=\"tw-p-0 tw-m-0 tw-font-sans tw-font-normal tw-list-none tw-text-left tw-text-sm tw-select-none\"\n >\n <DndContext\n sensors={sensors}\n measuring={measuring}\n onDragEnd={handleDragEnd}\n onDragOver={handleDragOver}\n onDragMove={handleDragMove}\n onDragStart={handleDragStart}\n onDragCancel={handleDragCancel}\n accessibility={{ announcements }}\n collisionDetection={closestCenter}\n >\n <SortableContext items={items} strategy={verticalListSortingStrategy}>\n {nodes}\n </SortableContext>\n\n {createPortal(\n <DragOverlay wrapperElement=\"ul\" dropAnimation={null} modifiers={[restrictToWindowEdges]}>\n {treeState.overlay && (\n <TreeItemOverlay\n {...treeState.overlay}\n isSelected={treeState.selectedIds.has(treeState.overlay.id)}\n />\n )}\n </DragOverlay>,\n document.body,\n )}\n </DndContext>\n </ul>\n </TreeContext.Provider>\n );\n },\n);\n\nTree.displayName = 'FondueTree';\n"],"names":["ROOT_ID","INDENTATION_WIDTH","measuring","MeasuringStrategy","enableMapSet","reducer","produce","draft","action","newSelected","isSelected","newExpanded","id","children","index","node","sliceIndex","currentNodeChildrenIds","newNodeChildrenIds","isEqual","nodes","self","item","nodeIds","getReactNodeIdsInFlatArray","removeReactNodesFromFlatArray","Tree","memo","onDrop","onSelect","onExpand","selectedIds","expandedIds","draggable","multiselect","dataTestId","initialState","useMemo","removeFragmentsAndEnrichChildren","treeState","updateTreeState","useReducer","offset","setOffset","useState","overId","setOverId","activeId","setActiveId","currentPosition","setCurrentPosition","items","useEffect","keyDownHandler","event","keyUpHandler","registerOverlay","useCallback","overlay","registerNodeChildren","payload","unregisterNodeChildren","handleSelect","handleExpand","handleDragEnd","resetState","over","active","_a","_b","handleDragStart","activeNode","handleDragOver","handleDragMove","delta","handleDragCancel","handleKeyDown","activeElement","child","currentIndex","isExpanded","parentId","hasChildren","code","toggleSelect","toggleExpand","focusPrevious","previousIndex","focusNext","nextIndex","KeyboardCode","parentIndex","sensorContext","useRef","coordinateGetter","sortableTreeKeyboardCoordinates","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","announcements","getActiveTitle","getOverTitle","getMovementAnnouncement","useLayoutEffect","projection","getProjection","cloneElement","contextValue","React","TreeContext","DndContext","closestCenter","SortableContext","verticalListSortingStrategy","createPortal","DragOverlay","restrictToWindowEdges","TreeItemOverlay"],"mappings":";;;;;;;;;;;;;;AAwDO,MAAMA,IAAU,YACVC,KAAoB,IAE3BC,KAAoC;AAAA,EACtC,WAAW;AAAA,IACP,UAAUC,GAAkB;AAAA,EAChC;AACJ;AAEAC;AAEA,MAAMC,KAAUC,GAAQ,CAACC,GAAkBC,MAA4B;AACnE,UAAQA,EAAO,MAAM;AAAA,IACjB,KAAK;AACD;AACI,cAAMC,IAAc,IAAI,IAAIF,EAAM,WAAW,GAEvCG,IAAa,CAACH,EAAM,YAAY,IAAIC,EAAO,OAAO;AAEpD,QAAAE,KAAcH,EAAM,kBAAkB,YACtCE,EAAY,MAAM,GAGTC,IAAAD,EAAY,IAAID,EAAO,OAAO,IAAIC,EAAY,OAAOD,EAAO,OAAO,GAEhFD,EAAM,cAAcE;AAAA,MACxB;AACA;AAAA,IAEJ,KAAK;AACD;AACI,cAAME,IAAc,IAAI,IAAIJ,EAAM,WAAW;AAIhC,QAFM,CAACA,EAAM,YAAY,IAAIC,EAAO,OAAO,IAE3CG,EAAY,IAAIH,EAAO,OAAO,IAAIG,EAAY,OAAOH,EAAO,OAAO,GAEhFD,EAAM,cAAcI;AAAA,MACxB;AACA;AAAA,IAEJ,KAAK;AAES,MAAAJ,EAAA,gBAAgBC,EAAO,QAAQ;AAEzC;AAAA,IAEJ,KAAK;AAEG,MAAAD,EAAM,aAAaC,EAAO;AAE9B;AAAA,IAEJ,KAAK;AAEG,MAAAD,EAAM,UAAUC,EAAO;AAE3B;AAAA,IAEJ,KAAK;AACD;AACI,cAAM,EAAE,IAAAI,GAAI,UAAAC,MAAaL,EAAO,SAE1BM,IAAQP,EAAM,MAAM,UAAU,CAACQ,MAASA,EAAK,MAAM,OAAOH,CAAE;AAElE,YAAIE,MAAU,IAAI;AACN,kBAAA,MAAM,oBAAoBF,eAAgB;AAClD;AAAA,QACJ;AAEA,cAAMI,IAAaF,IAAQ,GAErBG,IAAyBV,EAAM,MAChC,MAAMS,GAAYH,EAAS,SAAS,CAAC,EACrC,IAAI,CAACE,MAASA,EAAK,MAAM,EAAE,GAE1BG,IAAqBL,EAAS,IAAI,CAACE,MAASA,EAAK,MAAM,EAAE;AAE3D,YAAAI,GAAQF,GAAwBC,CAAkB;AAClD;AAGJ,cAAME,IAAQ;AAAA,UACV,GAAGb,EAAM,MAAM,MAAM,GAAGS,CAAU;AAAA,UAClC,GAAGH;AAAA,UACH,GAAGN,EAAM,MAAM,MAAMS,CAAU;AAAA,QAAA,EACjC,OAAO,CAACD,GAAMD,GAAOO,MAASP,MAAUO,EAAK,UAAU,CAACC,MAASA,EAAK,QAAQP,EAAK,GAAG,CAAC;AAEzF,QAAAR,EAAM,QAAQa;AAAA,MAClB;AACA;AAAA,IAEJ,KAAK;AACD;AACI,cAAMG,IAAUC,GAA2BjB,EAAM,OAAOC,EAAO,OAAO;AAEtE,QAAAD,EAAM,QAAQkB,GAA8BlB,EAAM,OAAOgB,CAAO;AAAA,MACpE;AACA;AAAA,IAEJ,KAAK;AAEG,MAAAhB,EAAM,QAAQC,EAAO;AAEzB;AAAA,IAEJ,KAAK;AAEG,MAAAD,EAAM,cAAc,IAAI,IAAIC,EAAO,OAAO;AAE9C;AAAA,IAEJ,KAAK;AAEG,MAAAD,EAAM,cAAc,IAAI,IAAIC,EAAO,OAAO;AAE9C;AAAA,IAEJ,KAAK;AACK,MAAAD,EAAA,QAAQC,EAAO,QAAQ,OACvBD,EAAA,UAAUC,EAAO,QAAQ,SACzBD,EAAA,aAAaC,EAAO,QAAQ,YAC5BD,EAAA,cAAcC,EAAO,QAAQ,aAC7BD,EAAA,cAAcC,EAAO,QAAQ,aAC7BD,EAAA,gBAAgBC,EAAO,QAAQ;AACrC;AAAA,IACJ;AACY,cAAA,KAAK,6BAA6BA,EAAO,8BAA8B;AAAA,EACvF;AACJ,CAAC,GAEYkB,KAAOC;AAAA,EAChB,CAAC;AAAA,IACG,IAAAf;AAAA,IACA,QAAAgB;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAjB;AAAA,IACA,aAAAkB;AAAA,IACA,aAAAC;AAAA,IACA,WAAAC,IAAY;AAAA,IACZ,aAAAC,IAAc;AAAA,IACd,gBAAgBC,IAAa;AAAA,EAAA,MAChB;;AACb,UAAMC,IAA0BC;AAAA,MAC5B,OAAO;AAAA,QACH,eAAe;AAAA,QACf,aAAa,IAAI,IAAIN,KAAe,EAAE;AAAA,QACtC,aAAa,IAAI,IAAIC,KAAe,EAAE;AAAA,QACtC,OAAOM,EAAiCzB,GAAU,EAAE,UAAUb,GAAS,OAAO,GAAG;AAAA,QACjF,YAAY;AAAA,MAAA;AAAA,MAEhB,CAACa,GAAUmB,GAAaD,CAAW;AAAA,IAAA,GAGjC,CAACQ,GAAWC,CAAe,IAAIC,GAAWpC,IAAS+B,CAAY,GAC/D,CAACM,GAAQC,CAAS,IAAIC,EAAS,CAAC,GAChC,CAACC,GAAQC,CAAS,IAAIF,EAA2B,IAAI,GACrD,CAACG,GAAUC,CAAW,IAAIJ,EAA2B,IAAI,GACzD,CAACK,GAAiBC,CAAkB,IACtCN,EAAmE,IAAI,GAErEO,IAAQd,EAAQ,MAAME,EAAU,MAAM,IAAI,CAACxB,MAASA,EAAK,MAAM,EAAE,GAAG,CAACwB,EAAU,KAAK,CAAC;AAE3F,IAAAa,EAAU,MAAM;AACN,YAAAC,IAAiB,CAACC,MAAoC;AACxD,QAAIpB,MAAgBoB,EAAM,QAAQ,UAAUA,EAAM,YAC9Bd,EAAA;AAAA,UACZ,MAAM;AAAA,UACN,SAAS,EAAE,eAAe,cAAc;AAAA,QAAA,CAC3C;AAAA,MACL,GAGEe,IAAe,CAACD,MAAoC;AACtD,QAAIpB,MAAgBoB,EAAM,QAAQ,UAAUA,EAAM,YAC9Bd,EAAA;AAAA,UACZ,MAAM;AAAA,UACN,SAAS,EAAE,eAAe,SAAS;AAAA,QAAA,CACtC;AAAA,MACL;AAGJ,aAAIN,MACO,OAAA,iBAAiB,WAAWmB,CAAc,GAC1C,OAAA,iBAAiB,SAASE,CAAY,IAG1C,MAAM;AACF,eAAA,oBAAoB,WAAWF,CAAc,GAC7C,OAAA,oBAAoB,SAASE,CAAY;AAAA,MAAA;AAAA,IACpD,GACD,CAACrB,CAAW,CAAC;AAEV,UAAAsB,IAAkBC,EAAY,CAACC,MAAqB;AACtD,MAAAlB,EAAgB,EAAE,MAAM,yBAAyB,SAASkB,EAAS,CAAA;AAAA,IACvE,GAAG,CAAE,CAAA,GAECC,IAAuBF,EAAY,CAACG,MAAyC;AAC/E,MAAApB,EAAgB,EAAE,MAAM,0BAA0B,SAAAoB,EAAS,CAAA;AAAA,IAC/D,GAAG,CAAE,CAAA,GAECC,IAAyBJ,EAAY,CAACG,MAAoB;AAC5D,MAAApB,EAAgB,EAAE,MAAM,4BAA4B,SAAAoB,EAAS,CAAA;AAAA,IACjE,GAAG,CAAE,CAAA,GAECE,IAAeL;AAAA,MACjB,CAAC7C,MAAe;AACZ,YAAIiB;AACA,iBAAOA,EAASjB,CAAE;AAGN,QAAA4B,EAAA;AAAA,UACZ,MAAM;AAAA,UACN,SAAS5B;AAAAA,QAAA,CACZ;AAAA,MACL;AAAA,MACA,CAACiB,CAAQ;AAAA,IAAA,GAGPkC,IAAeN;AAAA,MACjB,CAAC7C,MAAe;AACZ,YAAIkB;AACA,iBAAOA,EAASlB,CAAE;AAGN,QAAA4B,EAAA;AAAA,UACZ,MAAM;AAAA,UACN,SAAS5B;AAAAA,QAAA,CACZ;AAAA,MACL;AAAA,MACA,CAACkB,CAAQ;AAAA,IAAA,GAGPkC,KAAgBP;AAAA,MAClB,CAACH,MAAwB;;AACV,QAAAW;AAEL,cAAA,EAAE,MAAAC,GAAM,QAAAC,EAAW,IAAAb;AAErB,QAAA,EAACY,KAAA,QAAAA,EAAM,OAAM,EAACC,KAAA,QAAAA,EAAQ,OAAM,GAACC,IAAA7B,EAAU,eAAV,QAAA6B,EAAsB,aAI9CxC,KAAA,QAAAA,EAAA;AAAA,UACL,IAAIuC,EAAO,GAAG,SAAS;AAAA,UACvB,UAAU5B,EAAU,WAAW;AAAA,UAC/B,MAAMA,EAAU,WAAW;AAAA,QAAA;AAAA,MAEnC;AAAA,MACA,CAACX,IAAQwC,IAAA7B,EAAU,eAAV,gBAAA6B,EAAsB,WAAUC,IAAA9B,EAAU,eAAV,gBAAA8B,EAAsB,QAAQ;AAAA,IAAA,GAGrEC,KAAkB,CAAC,EAAE,QAAQ,EAAE,IAAIvB,EAAAA,QAAqC;AAC1E,MAAAC,EAAYD,CAAQ,GACpBD,EAAUC,CAAQ;AAEZ,YAAAwB,IAAahC,EAAU,MAAM,KAAK,CAACxB,MAASA,EAAK,MAAM,OAAOgC,CAAQ;AAE5E,MAAIwB,KACmBrB,EAAA;AAAA,QACf,UAAUqB,EAAW,MAAM;AAAA,QAC3B,QAAQxB;AAAAA,MAAA,CACX,GAGL,SAAS,KAAK,MAAM,YAAY,UAAU,UAAU;AAAA,IAAA,GAGlDyB,KAAiB,CAAC,EAAE,MAAAN,QAA8B;AAC1C,MAAApB,GAAAoB,KAAA,gBAAAA,EAAM,OAAM,IAAI;AAAA,IAAA,GAGxBO,KAAiB,CAAC,EAAE,OAAAC,QAA2B;AACjD,MAAA/B,EAAU+B,EAAM,CAAC;AAAA,IAAA,GAGfC,KAAmB,MAAM;AAChB,MAAAV;IAAA,GAGTA,IAAa,MAAM;AACrB,MAAAnB,EAAU,IAAI,GACdE,EAAY,IAAI,GAChBL,EAAU,CAAC,GACXO,EAAmB,IAAI,GAEvB,SAAS,KAAK,MAAM,YAAY,UAAU,EAAE;AAAA,IAAA,GAG1C0B,KAAgBnB;AAAA,MAClB,CAACH,MAAiD;AAC9C,cAAMuB,IAAgB,SAAS;AAE/B,YAAI,CAACA,KAAiB,CAACA,EAAc,iBAAiB,EAAEA,aAAyB;AAC7E;AAGJ,cAAM1B,IAAQ,MAAM,KAAK0B,EAAc,cAAc,QAAQ,EAAE;AAAA,UAC3D,CAACC,MAAUA,EAAM,aAAa;AAAA,QAAA,GAG5BC,IAAe5B,EAAM,QAAQ0B,CAAa,GAE1C9D,IAAOwB,EAAU,MAAMwC,CAAY,GAEnCnE,IAAaG,EAAK,MAAM,IACxBiE,IAAazC,EAAU,YAAY,IAAI3B,CAAE,GACzCqE,IAAmBlE,EAAK,MAAM,UAC9BmE,IAAcL,EAAc,aAAa,mBAAmB,MAAM,QAElE,EAAE,MAAAM,GAAS,IAAA7B,GAEX8B,IAAe,MAAM;AACvB,UAAA9B,EAAM,eAAe,GAErBQ,EAAalD,CAAE;AAAA,QAAA,GAGbyE,IAAe,MAAM;AACvB,UAAA/B,EAAM,eAAe,GAErBS,EAAanD,CAAE;AAAA,QAAA,GAGb0E,KAAgB,MAAM;AACxB,gBAAMC,KAAiBR,IAAe5B,EAAM,SAAS,KAAKA,EAAM;AAChEA,UAAAA,EAAMoC,CAAa,EAAE;QAAM,GAGzBC,IAAY,MAAM;AACd,gBAAAC,KAAaV,IAAe,KAAK5B,EAAM;AAC7CA,UAAAA,EAAMsC,CAAS,EAAE;QAAM;AAG3B,gBAAQN,IAAM;AAAA,UACV,KAAKO,EAAa;AACD,YAAAN;AAEb;AAAA,UAEJ,KAAKM,EAAa;AACA,YAAAR,IAAAG,MAAiBD;AAE/B;AAAA,UAEJ,KAAKM,EAAa;AACd,gBAAI,CAACR;AACD;AAGS,YAAAF,IAAAQ,MAAcH;AAE3B;AAAA,UAEJ,KAAKK,EAAa;AACd,gBAAIR,KAAeF;AACF,cAAAK;qBACNJ,KAAYA,MAAajF,GAAS;AACnC,oBAAA2F,IAAcpD,EAAU,MAAM,UAAU,CAACxB,OAASA,GAAK,MAAM,OAAOkE,CAAQ;AAElF9B,cAAAA,EAAMwC,CAAW,EAAE;YACvB;AACA;AAAA,UAEJ,KAAKD,EAAa;AACd,YAAApC,EAAM,eAAe,GACPgC;AAEd;AAAA,UAEJ,KAAKI,EAAa;AACd,YAAApC,EAAM,eAAe,GACXkC;AAEV;AAAA,QAIR;AAAA,MACJ;AAAA,MACA,CAACzB,GAAcD,GAAcvB,EAAU,aAAaA,EAAU,KAAK;AAAA,IAAA,GAGjEqD,IAA+BC,GAAO;AAAA,MACxC,OAAOtD,EAAU;AAAA,MACjB,QAAAG;AAAA,IAAA,CACH,GAEK,CAACoD,EAAgB,IAAIlD,EAAS,MAAMmD,GAAgCH,CAAa,CAAC,GAElFI,KAAUC,GAAWC,EAAUC,EAAa,GAAGD,EAAUE,IAAgB,EAAE,kBAAAN,GAAkB,CAAA,CAAC,GAE9FO,KAAmChE,EAAQ,MAAM;AACnD,YAAMiE,IAAiB,CAACnC,MACpB;;AAAA,gBAAAE,KAAAD,IAAA7B,EAAU,MAAM,KAAK,CAACxB,MAASA,EAAK,QAAQoD,EAAO,EAAE,MAArD,gBAAAC,EAAwD,MAAM,qBAA9D,gBAAAC,EAAgF,MAAM;AAAA,SACpFkC,IAAe,CAACrC,MAClB;;AAAA,gBAAAG,KAAAD,IAAA7B,EAAU,MAAM,KAAK,CAACxB,MAASA,EAAK,SAAQmD,KAAA,gBAAAA,EAAM,GAAE,MAApD,gBAAAE,EAAuD,MAAM,qBAA7D,gBAAAC,EAA+E,MAAM;AAAA;AAElF,aAAA;AAAA,QACH,YAAY,EAAE,QAAAF,KAAU;AACpB,iBAAO,aAAamC,EAAenC,CAAM,KAAKA,EAAO;AAAA,QACzD;AAAA,QACA,WAAW,EAAE,QAAAA,GAAQ,MAAAD,KAAQ;AACzB,iBAAOsC,EAAwB;AAAA,YAC3B,WAAW;AAAA,YACX,UAAUrC,EAAO;AAAA,YACjB,aAAamC,EAAenC,CAAM;AAAA,YAClC,QAAQD,KAAA,gBAAAA,EAAM;AAAA,YACd,WAAWqC,EAAarC,CAAI;AAAA,YAC5B,WAAA3B;AAAA,YACA,oBAAAW;AAAA,YACA,iBAAAD;AAAA,UAAA,CACH;AAAA,QACL;AAAA,QACA,WAAW,EAAE,QAAAkB,GAAQ,MAAAD,KAAQ;AACzB,iBAAOsC,EAAwB;AAAA,YAC3B,WAAW;AAAA,YACX,UAAUrC,EAAO;AAAA,YACjB,aAAamC,EAAenC,CAAM;AAAA,YAClC,QAAQD,KAAA,gBAAAA,EAAM;AAAA,YACd,WAAWqC,EAAarC,CAAI;AAAA,YAC5B,WAAA3B;AAAA,YACA,oBAAAW;AAAA,YACA,iBAAAD;AAAA,UAAA,CACH;AAAA,QACL;AAAA,QACA,UAAU,EAAE,QAAAkB,GAAQ,MAAAD,KAAQ;AACxB,iBAAOsC,EAAwB;AAAA,YAC3B,WAAW;AAAA,YACX,UAAUrC,EAAO;AAAA,YACjB,aAAamC,EAAenC,CAAM;AAAA,YAClC,QAAQD,KAAA,gBAAAA,EAAM;AAAA,YACd,WAAWqC,EAAarC,CAAI;AAAA,YAC5B,WAAA3B;AAAA,YACA,oBAAAW;AAAA,YACA,iBAAAD;AAAA,UAAA,CACH;AAAA,QACL;AAAA,QACA,aAAa,EAAE,QAAAkB,KAAU;;AAId,iBAAA,2BAHWC,IAAA7B,EAAU,MAAM,KAAK,CAACxB,MAASA,EAAK,QAAQoD,EAAO,EAAE,MAArD,gBAAAC,EAAwD,MAAM,iBAC3E,MAAM,UAEkCD,EAAO;AAAA,QACxD;AAAA,MAAA;AAAA,IACJ,GACD,CAAClB,GAAiBV,CAAS,CAAC;AAE/B,IAAAkE,GAAgB,MAAM;AACF,MAAAjE,EAAA;AAAA,QACZ,MAAM;AAAA,QACN,SAASF,EAAiCzB,GAAU,EAAE,UAAUb,GAAS,OAAO,GAAG;AAAA,MAAA,CACtF;AAAA,IAAA,GACF,CAACa,CAAQ,CAAC,GAEbuC,EAAU,MAAM;AACI,MAAAZ,EAAA;AAAA,QACZ,MAAM;AAAA,QACN,SAASR,KAAe,CAAC;AAAA,MAAA,CAC5B;AAAA,IAAA,GACF,CAACA,CAAW,CAAC,GAEhBoB,EAAU,MAAM;AACI,MAAAZ,EAAA;AAAA,QACZ,MAAM;AAAA,QACN,SAAST,KAAe,CAAC;AAAA,MAAA,CAC5B;AAAA,IAAA,GACF,CAACA,CAAW,CAAC,GAEhBqB,EAAU,MAAM;AACZ,MAAAwC,EAAc,UAAU;AAAA,QACpB,OAAOrD,EAAU;AAAA,QACjB,QAAAG;AAAA,MAAA;AAAA,IAEL,GAAA,CAACA,GAAQH,EAAU,KAAK,CAAC,GAE5Ba,EAAU,MAAM;AACN,YAAAsD,IACF3D,KAAYF,IACN8D,GAAc;AAAA,QACV,OAAOpE,EAAU;AAAA,QACjB,UAAAQ;AAAA,QACA,QAAAF;AAAA,QACA,YAAYH;AAAA,MACf,CAAA,IACD;AAEM,MAAAF,EAAA;AAAA,QACZ,MAAM;AAAA,QACN,SAASkE;AAAA,MAAA,CACZ;AAAA,IAAA,GACF,CAAC3D,GAAUL,GAAQG,GAAQN,EAAU,KAAK,CAAC;AAE9C,UAAMnB,KAAQiB;AAAA,MACV,MACIE,EAAU,MAAM,IAAI,CAACxB,MACV6F,GAAa7F,GAAM;AAAA,QACtB,GAAGA,EAAK;AAAA,QACR,YAAYA,EAAK,MAAM,OAAOgC,IAAWR,EAAU,aAAa;AAAA,QAChE,eAAeN;AAAA,QACf,YAAYM,EAAU,YAAY,IAAIxB,EAAK,MAAM,EAAE;AAAA,QACnD,YAAYwB,EAAU,YAAY,IAAIxB,EAAK,MAAM,EAAE;AAAA,QACnD,iBAAAyC;AAAA,QACA,sBAAAG;AAAA,QACA,wBAAAE;AAAA,QACA,UAAUE;AAAA,QACV,UAAUD;AAAA,MAAA,CACb,CACJ;AAAA,MACL;AAAA,QACI7B;AAAA,QACA8B;AAAA,QACAD;AAAA,QACAf;AAAA,QACAY;AAAA,QACAH;AAAA,QACAjB,EAAU;AAAA,QACVA,EAAU;AAAA,QACVA,EAAU;AAAA,QACVA,EAAU;AAAA,QACVsB;AAAA,MACJ;AAAA,IAAA,GAGEgD,KAAiCxE;AAAA,MACnC,OAAO;AAAA,QACH,WAAAE;AAAA,QACA,UAAUuB;AAAA,QACV,UAAUC;AAAA,MAAA;AAAA,MAEd,CAACxB,GAAWuB,GAAcC,CAAY;AAAA,IAAA;AAG1C,WACK,gBAAA+C,EAAA,cAAAC,GAAY,UAAZ,EAAqB,OAAOF,MACzB,gBAAAC,EAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,IAAAlG;AAAA,QACA,MAAK;AAAA,QACL,gBAAcuB;AAAA,QACd,WAAWyC;AAAA,QACX,wBAAsBrC,EAAU,kBAAkB;AAAA,QAClD,WAAU;AAAA,MAAA;AAAA,MAEV,gBAAAuE,EAAA;AAAA,QAACE;AAAA,QAAA;AAAA,UACG,SAAAhB;AAAA,UACA,WAAA9F;AAAA,UACA,WAAW8D;AAAA,UACX,YAAYQ;AAAA,UACZ,YAAYC;AAAA,UACZ,aAAaH;AAAA,UACb,cAAcK;AAAA,UACd,eAAe,EAAE,eAAA0B,GAAc;AAAA,UAC/B,oBAAoBY;AAAA,QAAA;AAAA,QAEnB,gBAAAH,EAAA,cAAAI,IAAA,EAAgB,OAAA/D,GAAc,UAAUgE,MACpC/F,EACL;AAAA,QAECgG;AAAA,UACG,gBAAAN,EAAA,cAACO,IAAY,EAAA,gBAAe,MAAK,eAAe,MAAM,WAAW,CAACC,EAAqB,EAClF,GAAA/E,EAAU,WACP,gBAAAuE,EAAA;AAAA,YAACS;AAAA,YAAA;AAAA,cACI,GAAGhF,EAAU;AAAA,cACd,YAAYA,EAAU,YAAY,IAAIA,EAAU,QAAQ,EAAE;AAAA,YAAA;AAAA,UAAA,CAGtE;AAAA,UACA,SAAS;AAAA,QACb;AAAA,MACJ;AAAA,IAAA,CAER;AAAA,EAER;AACJ;AAEAb,GAAK,cAAc;"}
1	+ {"version":3,"file":"Tree.es.js","sources":["../../../src/components/Tree/Tree.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport React, {\n cloneElement,\n memo,\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useReducer,\n useRef,\n useState,\n} from 'react';\nimport { SortableContext, verticalListSortingStrategy } from '@dnd-kit/sortable';\nimport { restrictToWindowEdges } from '@dnd-kit/modifiers';\nimport { enableMapSet, produce } from 'immer';\nimport { createPortal } from 'react-dom';\nimport isEqual from 'lodash-es/isEqual';\nimport {\n DndContext,\n DragEndEvent,\n DragMoveEvent,\n DragOverlay,\n KeyboardCode,\n KeyboardSensor,\n MeasuringConfiguration,\n MeasuringStrategy,\n PointerSensor,\n closestCenter,\n useSensor,\n useSensors,\n} from '@dnd-kit/core';\n\nimport type {\n RegisterNodeChildrenPayload,\n SensorContext,\n TreeActive,\n TreeAnnouncements,\n TreeDragOverEvent,\n TreeDragStartEvent,\n TreeOver,\n TreeProps,\n TreeState,\n TreeStateAction,\n} from '@components/Tree/types';\n\nimport { type Overlay, TreeItemOverlay } from './TreeItem';\nimport {\n getMovementAnnouncement,\n getProjection,\n getReactNodeIdsInFlatArray,\n removeReactNodesFromFlatArray,\n} from './helpers';\nimport { removeFragmentsAndEnrichChildren, sortableTreeKeyboardCoordinates } from './utils';\nimport { TreeContext, TreeContextProps } from './TreeContext';\n\nexport const ROOT_ID = '__ROOT__';\nexport const INDENTATION_WIDTH = 32;\n\nconst measuring: MeasuringConfiguration = {\n droppable: {\n strategy: MeasuringStrategy.Always,\n },\n};\n\nenableMapSet();\n\nconst reducer = produce((draft: TreeState, action: TreeStateAction) => {\n switch (action.type) {\n case 'SET_SELECT':\n {\n const newSelected = new Set(draft.selectedIds);\n\n const isSelected = !draft.selectedIds.has(action.payload);\n\n if (isSelected && draft.selectionMode === 'single') {\n newSelected.clear();\n }\n\n isSelected ? newSelected.add(action.payload) : newSelected.delete(action.payload);\n\n draft.selectedIds = newSelected;\n }\n break;\n\n case 'SET_EXPAND':\n {\n const newExpanded = new Set(draft.expandedIds);\n\n const isExpanded = !draft.expandedIds.has(action.payload);\n\n isExpanded ? newExpanded.add(action.payload) : newExpanded.delete(action.payload);\n\n draft.expandedIds = newExpanded;\n }\n break;\n\n case 'SET_SELECTION_MODE':\n {\n draft.selectionMode = action.payload.selectionMode;\n }\n break;\n\n case 'SET_PROJECTION':\n {\n draft.projection = action.payload;\n }\n break;\n\n case 'REGISTER_OVERLAY_ITEM':\n {\n draft.overlay = action.payload;\n }\n break;\n\n case 'REGISTER_NODE_CHILDREN':\n {\n const { id, children } = action.payload;\n\n const index = draft.nodes.findIndex((node) => node.props.id === id);\n\n if (index === -1) {\n console.error(`Element with ID \"${id}\" not found.`);\n return;\n }\n\n const sliceIndex = index + 1;\n\n const currentNodeChildrenIds = draft.nodes\n .slice(sliceIndex, children.length - 1)\n .map((node) => node.props.id);\n\n const newNodeChildrenIds = children.map((node) => node.props.id);\n\n if (isEqual(currentNodeChildrenIds, newNodeChildrenIds)) {\n return;\n }\n\n const nodes = [\n ...draft.nodes.slice(0, sliceIndex),\n ...children,\n ...draft.nodes.slice(sliceIndex),\n ].filter(\n (node, index, self) =>\n index === self.findIndex((item) => item.key === node.key) &&\n ((node.props.parentId === id && newNodeChildrenIds.includes(node.key)) \|\|\n node.props.parentId !== id),\n );\n\n draft.nodes = nodes;\n }\n break;\n\n case 'UNREGISTER_NODE_CHILDREN':\n {\n const nodeIds = getReactNodeIdsInFlatArray(draft.nodes, action.payload);\n\n draft.nodes = removeReactNodesFromFlatArray(draft.nodes, nodeIds);\n }\n break;\n\n case 'REGISTER_ROOT_NODES':\n {\n draft.nodes = action.payload;\n }\n break;\n\n case 'REPLACE_EXPANDED':\n {\n draft.expandedIds = new Set(action.payload);\n }\n break;\n\n case 'REPLACE_SELECTED':\n {\n draft.selectedIds = new Set(action.payload);\n }\n break;\n\n case 'REPLACE_STATE':\n draft.nodes = action.payload.nodes;\n draft.overlay = action.payload.overlay;\n draft.projection = action.payload.projection;\n draft.selectedIds = action.payload.selectedIds;\n draft.expandedIds = action.payload.expandedIds;\n draft.selectionMode = action.payload.selectionMode;\n break;\n default:\n console.warn(`Updated tree with action \"${action.type}\" but it has not effect.`);\n }\n});\n\nexport const Tree = memo(\n ({\n id,\n onDrop,\n onSelect,\n onExpand,\n children,\n selectedIds,\n expandedIds,\n draggable = false,\n multiselect = false,\n 'data-test-id': dataTestId = 'fondue-tree',\n }: TreeProps) => {\n const initialState: TreeState = useMemo(\n () => ({\n selectionMode: 'single',\n selectedIds: new Set(selectedIds ?? []),\n expandedIds: new Set(expandedIds ?? []),\n nodes: removeFragmentsAndEnrichChildren(children, { parentId: ROOT_ID, level: 0 }),\n projection: null,\n }),\n [children, expandedIds, selectedIds],\n );\n\n const [treeState, updateTreeState] = useReducer(reducer, initialState);\n const [offset, setOffset] = useState(0);\n const [overId, setOverId] = useState<Nullable<string>>(null);\n const [activeId, setActiveId] = useState<Nullable<string>>(null);\n const [currentPosition, setCurrentPosition] =\n useState<Nullable<{ overId: string; parentId: Nullable<string> }>>(null);\n\n const items = useMemo(() => treeState.nodes.map((node) => node.props.id), [treeState.nodes]);\n\n useEffect(() => {\n const keyDownHandler = (event: globalThis.KeyboardEvent) => {\n if (multiselect && (event.key === 'Meta' \|\| event.ctrlKey)) {\n updateTreeState({\n type: 'SET_SELECTION_MODE',\n payload: { selectionMode: 'multiselect' },\n });\n }\n };\n\n const keyUpHandler = (event: globalThis.KeyboardEvent) => {\n if (multiselect && (event.key === 'Meta' \|\| event.ctrlKey)) {\n updateTreeState({\n type: 'SET_SELECTION_MODE',\n payload: { selectionMode: 'single' },\n });\n }\n };\n\n if (multiselect) {\n window.addEventListener('keydown', keyDownHandler);\n window.addEventListener('keyup', keyUpHandler);\n }\n\n return () => {\n window.removeEventListener('keydown', keyDownHandler);\n window.removeEventListener('keyup', keyUpHandler);\n };\n }, [multiselect]);\n\n const registerOverlay = useCallback((overlay: Overlay) => {\n updateTreeState({ type: 'REGISTER_OVERLAY_ITEM', payload: overlay });\n }, []);\n\n const registerNodeChildren = useCallback((payload: RegisterNodeChildrenPayload) => {\n updateTreeState({ type: 'REGISTER_NODE_CHILDREN', payload });\n }, []);\n\n const unregisterNodeChildren = useCallback((payload: string) => {\n updateTreeState({ type: 'UNREGISTER_NODE_CHILDREN', payload });\n }, []);\n\n const handleSelect = useCallback(\n (id: string) => {\n if (onSelect) {\n return onSelect(id);\n }\n\n updateTreeState({\n type: 'SET_SELECT',\n payload: id,\n });\n },\n [onSelect],\n );\n\n const handleExpand = useCallback(\n (id: string) => {\n if (onExpand) {\n return onExpand(id);\n }\n\n updateTreeState({\n type: 'SET_EXPAND',\n payload: id,\n });\n },\n [onExpand],\n );\n\n const handleDragEnd = useCallback(\n (event: DragEndEvent) => {\n resetState();\n\n const { over, active } = event;\n\n if (!over?.id \|\| !active?.id \|\| !treeState.projection?.parentId) {\n return;\n }\n\n onDrop?.({\n id: active.id.toString(),\n parentId: treeState.projection.parentId,\n sort: treeState.projection.position,\n });\n },\n [onDrop, treeState.projection?.parentId, treeState.projection?.position],\n );\n\n const handleDragStart = ({ active: { id: activeId } }: TreeDragStartEvent) => {\n setActiveId(activeId);\n setOverId(activeId);\n\n const activeNode = treeState.nodes.find((node) => node.props.id === activeId);\n\n if (activeNode) {\n setCurrentPosition({\n parentId: activeNode.props.parentId,\n overId: activeId,\n });\n }\n\n document.body.style.setProperty('cursor', 'grabbing');\n };\n\n const handleDragOver = ({ over }: TreeDragOverEvent) => {\n setOverId(over?.id ?? null);\n };\n\n const handleDragMove = ({ delta }: DragMoveEvent) => {\n setOffset(delta.x);\n };\n\n const handleDragCancel = () => {\n resetState();\n };\n\n const resetState = () => {\n setOverId(null);\n setActiveId(null);\n setOffset(0);\n setCurrentPosition(null);\n\n document.body.style.setProperty('cursor', '');\n };\n\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLUListElement>) => {\n const activeElement = document.activeElement;\n\n if (!activeElement \|\| !activeElement.parentElement \|\| !(activeElement instanceof HTMLLIElement)) {\n return;\n }\n\n const items = Array.from(activeElement.parentElement.children).filter(\n (child) => child.nodeName === 'LI',\n ) as HTMLLIElement[];\n\n const currentIndex = items.indexOf(activeElement);\n\n const node = treeState.nodes[currentIndex];\n\n const id: string = node.props.id;\n const isExpanded = treeState.expandedIds.has(id);\n const parentId: string = node.props.parentId;\n const hasChildren = activeElement.getAttribute('data-has-children') === 'true';\n\n const { code } = event;\n\n const toggleSelect = () => {\n event.preventDefault();\n\n handleSelect(id);\n };\n\n const toggleExpand = () => {\n event.preventDefault();\n\n handleExpand(id);\n };\n\n const focusPrevious = () => {\n const previousIndex = (currentIndex + items.length - 1) % items.length;\n items[previousIndex].focus();\n };\n\n const focusNext = () => {\n const nextIndex = (currentIndex + 1) % items.length;\n items[nextIndex].focus();\n };\n\n switch (code) {\n case KeyboardCode.Enter:\n toggleSelect();\n\n break;\n\n case KeyboardCode.Space:\n hasChildren ? toggleExpand() : toggleSelect();\n\n break;\n\n case KeyboardCode.Right:\n if (!hasChildren) {\n break;\n }\n\n isExpanded ? focusNext() : toggleExpand();\n\n break;\n\n case KeyboardCode.Left:\n if (hasChildren && isExpanded) {\n toggleExpand();\n } else if (parentId && parentId !== ROOT_ID) {\n const parentIndex = treeState.nodes.findIndex((node) => node.props.id === parentId);\n\n items[parentIndex].focus();\n }\n break;\n\n case KeyboardCode.Up:\n event.preventDefault();\n focusPrevious();\n\n break;\n\n case KeyboardCode.Down:\n event.preventDefault();\n focusNext();\n\n break;\n\n default:\n break;\n }\n },\n [handleExpand, handleSelect, treeState.expandedIds, treeState.nodes],\n );\n\n const sensorContext: SensorContext = useRef({\n nodes: treeState.nodes,\n offset,\n });\n\n const [coordinateGetter] = useState(() => sortableTreeKeyboardCoordinates(sensorContext));\n\n const sensors = useSensors(useSensor(PointerSensor), useSensor(KeyboardSensor, { coordinateGetter }));\n\n const announcements: TreeAnnouncements = useMemo(() => {\n const getActiveTitle = (active: TreeActive) =>\n treeState.nodes.find((node) => node.key === active.id)?.props.contentComponent?.props.title;\n const getOverTitle = (over: TreeOver \| null) =>\n treeState.nodes.find((node) => node.key === over?.id)?.props.contentComponent?.props.title;\n\n return {\n onDragStart({ active }) {\n return `Picked up ${getActiveTitle(active) \|\| active.id}.`;\n },\n onDragMove({ active, over }) {\n return getMovementAnnouncement({\n eventName: 'onDragMove',\n activeId: active.id,\n activeTitle: getActiveTitle(active),\n overId: over?.id,\n overTitle: getOverTitle(over),\n treeState,\n setCurrentPosition,\n currentPosition,\n });\n },\n onDragOver({ active, over }) {\n return getMovementAnnouncement({\n eventName: 'onDragOver',\n activeId: active.id,\n activeTitle: getActiveTitle(active),\n overId: over?.id,\n overTitle: getOverTitle(over),\n treeState,\n setCurrentPosition,\n currentPosition,\n });\n },\n onDragEnd({ active, over }) {\n return getMovementAnnouncement({\n eventName: 'onDragEnd',\n activeId: active.id,\n activeTitle: getActiveTitle(active),\n overId: over?.id,\n overTitle: getOverTitle(over),\n treeState,\n setCurrentPosition,\n currentPosition,\n });\n },\n onDragCancel({ active }) {\n const nodeTitle = treeState.nodes.find((node) => node.key === active.id)?.props.contentComponent\n .props.title;\n\n return `Moving was cancelled. ${nodeTitle \|\| active.id} was dropped in its original position.`;\n },\n };\n }, [currentPosition, treeState]);\n\n useLayoutEffect(() => {\n updateTreeState({\n type: 'REGISTER_ROOT_NODES',\n payload: removeFragmentsAndEnrichChildren(children, { parentId: ROOT_ID, level: 0 }),\n });\n }, [children]);\n\n useEffect(() => {\n updateTreeState({\n type: 'REPLACE_EXPANDED',\n payload: expandedIds ?? [],\n });\n }, [expandedIds]);\n\n useEffect(() => {\n updateTreeState({\n type: 'REPLACE_SELECTED',\n payload: selectedIds ?? [],\n });\n }, [selectedIds]);\n\n useEffect(() => {\n sensorContext.current = {\n nodes: treeState.nodes,\n offset,\n };\n }, [offset, treeState.nodes]);\n\n useEffect(() => {\n const projection =\n activeId && overId\n ? getProjection({\n nodes: treeState.nodes,\n activeId,\n overId,\n dragOffset: offset,\n })\n : null;\n\n updateTreeState({\n type: 'SET_PROJECTION',\n payload: projection,\n });\n }, [activeId, offset, overId, treeState.nodes]);\n\n const nodes = useMemo(\n () =>\n treeState.nodes.map((node) => {\n return cloneElement(node, {\n ...node.props,\n projection: node.props.id === activeId ? treeState.projection : null,\n treeDraggable: draggable,\n isSelected: treeState.selectedIds.has(node.props.id),\n isExpanded: treeState.expandedIds.has(node.props.id),\n registerOverlay,\n registerNodeChildren,\n unregisterNodeChildren,\n onExpand: handleExpand,\n onSelect: handleSelect,\n });\n }),\n [\n draggable,\n handleExpand,\n handleSelect,\n activeId,\n registerNodeChildren,\n registerOverlay,\n treeState.expandedIds,\n treeState.nodes,\n treeState.projection,\n treeState.selectedIds,\n unregisterNodeChildren,\n ],\n );\n\n const contextValue: TreeContextProps = useMemo(\n () => ({\n treeState,\n onSelect: handleSelect,\n onExpand: handleExpand,\n }),\n [treeState, handleSelect, handleExpand],\n );\n\n return (\n <TreeContext.Provider value={contextValue}>\n <ul\n id={id}\n role=\"tree\"\n data-test-id={dataTestId}\n onKeyDown={handleKeyDown}\n aria-multiselectable={treeState.selectionMode === 'multiselect'}\n className=\"tw-p-0 tw-m-0 tw-font-sans tw-font-normal tw-list-none tw-text-left tw-text-sm tw-select-none\"\n >\n <DndContext\n sensors={sensors}\n measuring={measuring}\n onDragEnd={handleDragEnd}\n onDragOver={handleDragOver}\n onDragMove={handleDragMove}\n onDragStart={handleDragStart}\n onDragCancel={handleDragCancel}\n accessibility={{ announcements }}\n collisionDetection={closestCenter}\n >\n <SortableContext items={items} strategy={verticalListSortingStrategy}>\n {nodes}\n </SortableContext>\n\n {createPortal(\n <DragOverlay wrapperElement=\"ul\" dropAnimation={null} modifiers={[restrictToWindowEdges]}>\n {treeState.overlay && (\n <TreeItemOverlay\n {...treeState.overlay}\n isSelected={treeState.selectedIds.has(treeState.overlay.id)}\n />\n )}\n </DragOverlay>,\n document.body,\n )}\n </DndContext>\n </ul>\n </TreeContext.Provider>\n );\n },\n);\n\nTree.displayName = 'FondueTree';\n"],"names":["ROOT_ID","INDENTATION_WIDTH","measuring","MeasuringStrategy","enableMapSet","reducer","produce","draft","action","newSelected","isSelected","newExpanded","id","children","index","node","sliceIndex","currentNodeChildrenIds","newNodeChildrenIds","isEqual","nodes","self","item","nodeIds","getReactNodeIdsInFlatArray","removeReactNodesFromFlatArray","Tree","memo","onDrop","onSelect","onExpand","selectedIds","expandedIds","draggable","multiselect","dataTestId","initialState","useMemo","removeFragmentsAndEnrichChildren","treeState","updateTreeState","useReducer","offset","setOffset","useState","overId","setOverId","activeId","setActiveId","currentPosition","setCurrentPosition","items","useEffect","keyDownHandler","event","keyUpHandler","registerOverlay","useCallback","overlay","registerNodeChildren","payload","unregisterNodeChildren","handleSelect","handleExpand","handleDragEnd","resetState","over","active","_a","_b","handleDragStart","activeNode","handleDragOver","handleDragMove","delta","handleDragCancel","handleKeyDown","activeElement","child","currentIndex","isExpanded","parentId","hasChildren","code","toggleSelect","toggleExpand","focusPrevious","previousIndex","focusNext","nextIndex","KeyboardCode","parentIndex","sensorContext","useRef","coordinateGetter","sortableTreeKeyboardCoordinates","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","announcements","getActiveTitle","getOverTitle","getMovementAnnouncement","useLayoutEffect","projection","getProjection","cloneElement","contextValue","React","TreeContext","DndContext","closestCenter","SortableContext","verticalListSortingStrategy","createPortal","DragOverlay","restrictToWindowEdges","TreeItemOverlay"],"mappings":"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"}

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

@@ -2,13 +2,13 @@ import d, { memo as ut, useMemo as x, useCallback as k, Children as V, useLayout
 import { useSortable as ht } from "@dnd-kit/sortable";
 import { useDndContext as gt, useDndMonitor as pt } from "@dnd-kit/core";
 import { CSS as vt } from "@dnd-kit/utilities";
+import xt from "../../../node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/noop.es.js";
 import { merge as Y } from "../../../utilities/merge.es.js";
-import { FOCUS_VISIBLE_STYLE as xt } from "../../../utilities/focusStyle.es.js";
+import { FOCUS_VISIBLE_STYLE as It } from "../../../utilities/focusStyle.es.js";
 import { INDENTATION_WIDTH as q } from "../Tree.es.js";
-import { DragHandle as It } from "./DragHandle.es.js";
-import { ExpandButton as Dt } from "./ExpandButton.es.js";
-import { removeFragmentsAndEnrichChildren as Et } from "../utils/removeFragmentsAndEnrichChildren.es.js";
-import Tt from "../../../node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/noop.es.js";
+import { DragHandle as Dt } from "./DragHandle.es.js";
+import { ExpandButton as Et } from "./ExpandButton.es.js";
+import { removeFragmentsAndEnrichChildren as Tt } from "../utils/removeFragmentsAndEnrichChildren.es.js";
 const yt = ({ isSorting: t, wasDragging: I }) => !(t || I), Lt = ut(
   ({
     id: t,
@@ -57,7 +57,7 @@ const yt = ({ isSorting: t, wasDragging: I }) => !(t || I), Lt = ut(
     ), $ = (e) => {
       e.stopPropagation(), E == null || E(t);
     }, B = D && (o == null ? void 0 : o.id) === D, F = V.count(l) > 0, c = x(
-      () => Et(l, { parentId: t, level: r + 1 }),
+      () => Tt(l, { parentId: t, level: r + 1 }),
       [l, t, r]
     ), N = x(() => c.map((e) => e.props.id), [c]), {
       attributes: O,
@@ -85,7 +85,7 @@ const yt = ({ isSorting: t, wasDragging: I }) => !(t || I), Lt = ut(
     }, [s, b, B, c, p, m, t]);
     const ot = x(
       () => Y([
-        xt,
+        It,
         !s && !w && "focus-within:tw-bg-box-neutral",
         "tw-outline-none tw-ring-inset tw-group tw-px-2.5 tw-no-underline tw-leading-5 tw-h-10",
         w ? "tw-font-medium tw-bg-box-neutral-strong tw-text-box-neutral-strong-inverse hover:tw-bg-box-neutral-strong-hover" : "hover:tw-bg-box-neutral tw-text-text"
@@ -109,7 +109,7 @@ const yt = ({ isSorting: t, wasDragging: I }) => !(t || I), Lt = ut(
         tabIndex: 0,
         role: "treeitem",
         style: ft,
-        onKeyDown: Tt,
+        onKeyDown: xt,
         "aria-label": f,
         "aria-level": r + 1,
         onClick: Z,
@@ -122,7 +122,7 @@ const yt = ({ isSorting: t, wasDragging: I }) => !(t || I), Lt = ut(
         "aria-owns": N.join(" ")
       },
       /* @__PURE__ */ d.createElement("div", { ref: st, className: rt, style: it }, /* @__PURE__ */ d.createElement(
-        It,
+        Dt,
         {
           ...j,
           ...O,
@@ -133,7 +133,7 @@ const yt = ({ isSorting: t, wasDragging: I }) => !(t || I), Lt = ut(
           className: A ? "tw-visible" : "tw-invisible tw-pointer-events-none"
         }
       ), /* @__PURE__ */ d.createElement(
-        Dt,
+        Et,
         {
           active: w,
           onClick: $,

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

	@@ -1 +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 React, { Children, MouseEvent, memo, useCallback, useLayoutEffect, useMemo } from 'react';\nimport { AnimateLayoutChanges, useSortable } from '@dnd-kit/sortable';\nimport { useDndContext, useDndMonitor } from '@dnd-kit/core';\nimport { CSS } from '@dnd-kit/utilities';\nimport { noop } from 'lodash-es';\n\nimport { merge } from '@utilities/merge';\nimport { FOCUS_VISIBLE_STYLE } from '@utilities/focusStyle';\n\nimport type {\n RegisterNodeChildrenPayload,\n TreeDragEndEvent,\n TreeDragStartEvent,\n TreeItemProps,\n} from '@components/Tree/types';\n\nimport { Projection } from '../helpers';\nimport { INDENTATION_WIDTH } from '../Tree';\nimport { removeFragmentsAndEnrichChildren } from '../utils';\n\nimport { DragHandle } from './DragHandle';\nimport { Overlay } from './TreeItemOverlay';\nimport { ExpandButton } from './ExpandButton';\n\nconst animateLayoutChanges: AnimateLayoutChanges = ({ isSorting, wasDragging }) =>\n isSorting \|\| wasDragging ? false : true;\n\n/* @private /\ntype TreeItemPrivateProps = {\n level?: number;\n parentId?: string;\n isSelected?: boolean;\n isExpanded?: boolean;\n treeDraggable?: boolean;\n onSelect?: (id: string) => void;\n onExpand?: (id: string) => void;\n projection?: Nullable<Projection>;\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 ({\n id,\n type,\n label,\n onDrop,\n accepts,\n children,\n parentId,\n level = 0,\n contentComponent,\n isSelected = false,\n isExpanded = false,\n treeDraggable = false,\n projection,\n onSelect,\n onExpand,\n registerOverlay,\n registerNodeChildren,\n unregisterNodeChildren,\n draggable: itemDraggable = true,\n 'data-test-id': dataTestId = 'fondue-tree-item',\n }: InternalTreeItemProps) => {\n const { active, over } = useDndContext();\n\n const draggable = treeDraggable && itemDraggable;\n\n const isActive = active?.id === id;\n\n const isWithin =\n over !== null &&\n projection !== null &&\n projection !== undefined &&\n projection.depth > over.data.current?.level;\n\n const canDrop =\n isActive &&\n !isWithin &&\n active.data.current &&\n (over?.data?.current?.accepts === undefined \|\|\n (typeof over?.data?.current?.accepts === 'string' &&\n over.data.current.accepts?.split(', ').includes(active.data.current.type)));\n\n const computedContentComponent = useMemo(() => {\n if (typeof contentComponent === 'function') {\n return contentComponent({});\n }\n return contentComponent;\n }, [contentComponent]);\n\n const handleItemDragEnd = useCallback(\n (event: TreeDragEndEvent) => {\n const { over, active } = event;\n\n if (\n !isActive \|\|\n !projection \|\|\n (active.id === over?.id && projection?.depth === projection?.minDepth)\n ) {\n return;\n }\n\n if (isActive && over && canDrop) {\n onDrop?.({ id: active.id, parentId: projection.parentId, sort: projection.position });\n }\n },\n [canDrop, isActive, onDrop, projection],\n );\n\n const handleItemDragStart = useCallback(\n (event: TreeDragStartEvent) => {\n if (event.active.id !== id) {\n return;\n }\n\n registerOverlay?.({ contentComponent: computedContentComponent, children, id, label, level });\n },\n [children, computedContentComponent, id, label, level, registerOverlay],\n );\n\n useDndMonitor({\n onDragEnd: handleItemDragEnd,\n onDragStart: handleItemDragStart,\n });\n\n const handleSelect = useCallback(\n (event: MouseEvent<HTMLElement, globalThis.MouseEvent>) => {\n event.stopPropagation();\n\n onSelect?.(id);\n },\n [id, onSelect],\n );\n\n const handleExpand = (event: MouseEvent<HTMLButtonElement, globalThis.MouseEvent>) => {\n event.stopPropagation();\n\n onExpand?.(id);\n };\n\n const isParentActive = parentId && active?.id === parentId;\n\n const hasChildren = Children.count(children) > 0;\n\n const enrichedChildren = useMemo(\n () => removeFragmentsAndEnrichChildren(children, { parentId: id, level: level + 1 }),\n [children, id, level],\n );\n\n const childrenIds = useMemo(() => enrichedChildren.map((child) => child.props.id), [enrichedChildren]);\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 useLayoutEffect(() => {\n if (Children.count(enrichedChildren) === 0) {\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, registerNodeChildren, unregisterNodeChildren, id]);\n\n const liClassName = useMemo(\n () =>\n merge([\n FOCUS_VISIBLE_STYLE,\n !isActive && !isSelected && 'focus-within:tw-bg-box-neutral',\n 'tw-outline-none tw-ring-inset tw-group tw-px-2.5 tw-no-underline tw-leading-5 tw-h-10',\n isSelected\n ? 'tw-font-medium tw-bg-box-neutral-strong tw-text-box-neutral-strong-inverse hover:tw-bg-box-neutral-strong-hover'\n : 'hover:tw-bg-box-neutral tw-text-text',\n ]),\n [isActive, isSelected],\n );\n\n const containerClassName = merge([\n 'tw-flex tw-items-center tw-h-10 tw-leading-5 tw-width-full',\n isActive && 'tw-border-box-selected-strong tw-border-dashed tw-border-2 tw-bg-box-selected-hover',\n isActive &&\n (isWithin \|\| (!isWithin && !canDrop)) &&\n 'tw-bg-box-negative-hover tw-border-box-negative-strong-hover tw-border-dashed tw-border-2',\n ]);\n\n const depthPadding = projection?.depth ? projection.depth INDENTATION_WIDTH : undefined;\n const levelPadding = isActive ? 0 : level * INDENTATION_WIDTH;\n\n const liStyle = {\n paddingLeft: depthPadding ?? levelPadding,\n };\n\n const showContent = !isActive;\n const showChildren = isExpanded && !isActive;\n const showDragHandle = draggable && !isActive;\n const showLabel = label !== undefined && !isActive;\n const showExpandButton = hasChildren && !isActive;\n\n const style = {\n transform: CSS.Transform.toString(transform),\n transition,\n };\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 onClick={handleSelect}\n className={liClassName}\n ref={setDroppableNodeRef}\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 <DragHandle\n {...listeners}\n {...attributes}\n active={isSelected}\n ref={setActivatorNodeRef}\n disabled={!showDragHandle}\n aria-hidden={!showDragHandle}\n className={showDragHandle ? 'tw-visible' : 'tw-invisible tw-pointer-events-none'}\n />\n\n <ExpandButton\n active={isSelected}\n onClick={handleExpand}\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\n {showContent && computedContentComponent}\n </div>\n </li>\n );\n },\n);\n\nTreeItem.displayName = 'FondueTreeItem';\n"],"names":["animateLayoutChanges","isSorting","wasDragging","TreeItem","memo","id","type","label","onDrop","accepts","children","parentId","level","contentComponent","isSelected","isExpanded","treeDraggable","projection","onSelect","onExpand","registerOverlay","registerNodeChildren","unregisterNodeChildren","itemDraggable","dataTestId","active","over","useDndContext","draggable","isActive","isWithin","_a","canDrop","_c","_b","_e","_d","_f","computedContentComponent","useMemo","handleItemDragEnd","useCallback","event","handleItemDragStart","useDndMonitor","handleSelect","handleExpand","isParentActive","hasChildren","Children","enrichedChildren","removeFragmentsAndEnrichChildren","childrenIds","child","attributes","listeners","transform","transition","setDraggableNodeRef","setDroppableNodeRef","setActivatorNodeRef","useSortable","useLayoutEffect","liClassName","merge","FOCUS_VISIBLE_STYLE","containerClassName","depthPadding","INDENTATION_WIDTH","levelPadding","liStyle","showContent","showChildren","showDragHandle","showLabel","showExpandButton","style","CSS","React","noop","DragHandle","ExpandButton"],"mappings":"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"}
1	+ {"version":3,"file":"TreeItem.es.js","sources":["../../../../src/components/Tree/TreeItem/TreeItem.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. /\n\nimport React, { Children, MouseEvent, memo, useCallback, useLayoutEffect, useMemo } from 'react';\nimport { AnimateLayoutChanges, useSortable } from '@dnd-kit/sortable';\nimport { useDndContext, useDndMonitor } from '@dnd-kit/core';\nimport { CSS } from '@dnd-kit/utilities';\nimport noop from 'lodash-es/noop';\n\nimport { merge } from '@utilities/merge';\nimport { FOCUS_VISIBLE_STYLE } from '@utilities/focusStyle';\n\nimport type {\n RegisterNodeChildrenPayload,\n TreeDragEndEvent,\n TreeDragStartEvent,\n TreeItemProps,\n} from '@components/Tree/types';\n\nimport { Projection } from '../helpers';\nimport { INDENTATION_WIDTH } from '../Tree';\nimport { removeFragmentsAndEnrichChildren } from '../utils';\n\nimport { DragHandle } from './DragHandle';\nimport { Overlay } from './TreeItemOverlay';\nimport { ExpandButton } from './ExpandButton';\n\nconst animateLayoutChanges: AnimateLayoutChanges = ({ isSorting, wasDragging }) =>\n isSorting \|\| wasDragging ? false : true;\n\n/* @private /\ntype TreeItemPrivateProps = {\n level?: number;\n parentId?: string;\n isSelected?: boolean;\n isExpanded?: boolean;\n treeDraggable?: boolean;\n onSelect?: (id: string) => void;\n onExpand?: (id: string) => void;\n projection?: Nullable<Projection>;\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 ({\n id,\n type,\n label,\n onDrop,\n accepts,\n children,\n parentId,\n level = 0,\n contentComponent,\n isSelected = false,\n isExpanded = false,\n treeDraggable = false,\n projection,\n onSelect,\n onExpand,\n registerOverlay,\n registerNodeChildren,\n unregisterNodeChildren,\n draggable: itemDraggable = true,\n 'data-test-id': dataTestId = 'fondue-tree-item',\n }: InternalTreeItemProps) => {\n const { active, over } = useDndContext();\n\n const draggable = treeDraggable && itemDraggable;\n\n const isActive = active?.id === id;\n\n const isWithin =\n over !== null &&\n projection !== null &&\n projection !== undefined &&\n projection.depth > over.data.current?.level;\n\n const canDrop =\n isActive &&\n !isWithin &&\n active.data.current &&\n (over?.data?.current?.accepts === undefined \|\|\n (typeof over?.data?.current?.accepts === 'string' &&\n over.data.current.accepts?.split(', ').includes(active.data.current.type)));\n\n const computedContentComponent = useMemo(() => {\n if (typeof contentComponent === 'function') {\n return contentComponent({});\n }\n return contentComponent;\n }, [contentComponent]);\n\n const handleItemDragEnd = useCallback(\n (event: TreeDragEndEvent) => {\n const { over, active } = event;\n\n if (\n !isActive \|\|\n !projection \|\|\n (active.id === over?.id && projection?.depth === projection?.minDepth)\n ) {\n return;\n }\n\n if (isActive && over && canDrop) {\n onDrop?.({ id: active.id, parentId: projection.parentId, sort: projection.position });\n }\n },\n [canDrop, isActive, onDrop, projection],\n );\n\n const handleItemDragStart = useCallback(\n (event: TreeDragStartEvent) => {\n if (event.active.id !== id) {\n return;\n }\n\n registerOverlay?.({ contentComponent: computedContentComponent, children, id, label, level });\n },\n [children, computedContentComponent, id, label, level, registerOverlay],\n );\n\n useDndMonitor({\n onDragEnd: handleItemDragEnd,\n onDragStart: handleItemDragStart,\n });\n\n const handleSelect = useCallback(\n (event: MouseEvent<HTMLElement, globalThis.MouseEvent>) => {\n event.stopPropagation();\n\n onSelect?.(id);\n },\n [id, onSelect],\n );\n\n const handleExpand = (event: MouseEvent<HTMLButtonElement, globalThis.MouseEvent>) => {\n event.stopPropagation();\n\n onExpand?.(id);\n };\n\n const isParentActive = parentId && active?.id === parentId;\n\n const hasChildren = Children.count(children) > 0;\n\n const enrichedChildren = useMemo(\n () => removeFragmentsAndEnrichChildren(children, { parentId: id, level: level + 1 }),\n [children, id, level],\n );\n\n const childrenIds = useMemo(() => enrichedChildren.map((child) => child.props.id), [enrichedChildren]);\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 useLayoutEffect(() => {\n if (Children.count(enrichedChildren) === 0) {\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, registerNodeChildren, unregisterNodeChildren, id]);\n\n const liClassName = useMemo(\n () =>\n merge([\n FOCUS_VISIBLE_STYLE,\n !isActive && !isSelected && 'focus-within:tw-bg-box-neutral',\n 'tw-outline-none tw-ring-inset tw-group tw-px-2.5 tw-no-underline tw-leading-5 tw-h-10',\n isSelected\n ? 'tw-font-medium tw-bg-box-neutral-strong tw-text-box-neutral-strong-inverse hover:tw-bg-box-neutral-strong-hover'\n : 'hover:tw-bg-box-neutral tw-text-text',\n ]),\n [isActive, isSelected],\n );\n\n const containerClassName = merge([\n 'tw-flex tw-items-center tw-h-10 tw-leading-5 tw-width-full',\n isActive && 'tw-border-box-selected-strong tw-border-dashed tw-border-2 tw-bg-box-selected-hover',\n isActive &&\n (isWithin \|\| (!isWithin && !canDrop)) &&\n 'tw-bg-box-negative-hover tw-border-box-negative-strong-hover tw-border-dashed tw-border-2',\n ]);\n\n const depthPadding = projection?.depth ? projection.depth INDENTATION_WIDTH : undefined;\n const levelPadding = isActive ? 0 : level * INDENTATION_WIDTH;\n\n const liStyle = {\n paddingLeft: depthPadding ?? levelPadding,\n };\n\n const showContent = !isActive;\n const showChildren = isExpanded && !isActive;\n const showDragHandle = draggable && !isActive;\n const showLabel = label !== undefined && !isActive;\n const showExpandButton = hasChildren && !isActive;\n\n const style = {\n transform: CSS.Transform.toString(transform),\n transition,\n };\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 onClick={handleSelect}\n className={liClassName}\n ref={setDroppableNodeRef}\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 <DragHandle\n {...listeners}\n {...attributes}\n active={isSelected}\n ref={setActivatorNodeRef}\n disabled={!showDragHandle}\n aria-hidden={!showDragHandle}\n className={showDragHandle ? 'tw-visible' : 'tw-invisible tw-pointer-events-none'}\n />\n\n <ExpandButton\n active={isSelected}\n onClick={handleExpand}\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\n {showContent && computedContentComponent}\n </div>\n </li>\n );\n },\n);\n\nTreeItem.displayName = 'FondueTreeItem';\n"],"names":["animateLayoutChanges","isSorting","wasDragging","TreeItem","memo","id","type","label","onDrop","accepts","children","parentId","level","contentComponent","isSelected","isExpanded","treeDraggable","projection","onSelect","onExpand","registerOverlay","registerNodeChildren","unregisterNodeChildren","itemDraggable","dataTestId","active","over","useDndContext","draggable","isActive","isWithin","_a","canDrop","_c","_b","_e","_d","_f","computedContentComponent","useMemo","handleItemDragEnd","useCallback","event","handleItemDragStart","useDndMonitor","handleSelect","handleExpand","isParentActive","hasChildren","Children","enrichedChildren","removeFragmentsAndEnrichChildren","childrenIds","child","attributes","listeners","transform","transition","setDraggableNodeRef","setDroppableNodeRef","setActivatorNodeRef","useSortable","useLayoutEffect","liClassName","merge","FOCUS_VISIBLE_STYLE","containerClassName","depthPadding","INDENTATION_WIDTH","levelPadding","liStyle","showContent","showChildren","showDragHandle","showLabel","showExpandButton","style","CSS","React","noop","DragHandle","ExpandButton"],"mappings":"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"}