@webiny/admin-ui 6.3.0 → 6.4.0-beta.1

package/Tooltip/components/TooltipContent.js

@@ -1,33 +1,38 @@
-import * as React from "react";
-import { Tooltip as TooltipPrimitive } from "radix-ui";
+import { Tooltip } from "radix-ui";
 import { cn, cva } from "../../utils.js";
-const tooltipContentVariants = cva(["z-[var(--z-index-tooltip)] px-sm-extra py-sm max-w-64 rounded-md text-sm font-normal animate-in fade-in-0 zoom-in-95", "data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95", "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2"], {
-  variants: {
-    variant: {
-      accent: "bg-neutral-dark text-neutral-light",
-      subtle: "bg-neutral-base text-neutral-primary shadow-md"
+import * as __rspack_external_react from "react";
+const tooltipContentVariants = cva([
+    "z-[var(--z-index-tooltip)] px-sm-extra py-sm max-w-64 rounded-md text-sm font-normal animate-in fade-in-0 zoom-in-95",
+    "data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
+    "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2"
+], {
+    variants: {
+        variant: {
+            accent: "bg-neutral-dark text-neutral-light",
+            subtle: "bg-neutral-base text-neutral-primary shadow-md"
+        },
+        hiddenArrow: {
+            true: [
+                "data-[side=top]:mb-xs-plus",
+                "data-[side=bottom]:mt-xs-plus",
+                "data-[side=left]:mr-xs-plus",
+                "data-[side=right]:ml-xs-plus"
+            ]
+        }
     },
-    hiddenArrow: {
-      true: ["data-[side=top]:mb-xs-plus", "data-[side=bottom]:mt-xs-plus", "data-[side=left]:mr-xs-plus", "data-[side=right]:ml-xs-plus"]
+    defaultVariants: {
+        variant: "accent"
     }
-  },
-  defaultVariants: {
-    variant: "accent"
-  }
 });
-const TooltipContent = ({
-  className,
-  variant,
-  hiddenArrow,
-  ...props
-}) => /*#__PURE__*/React.createElement(TooltipPrimitive.Portal, null, /*#__PURE__*/React.createElement(TooltipPrimitive.Content, Object.assign({
-  collisionPadding: 8,
-  sideOffset: 4,
-  className: cn(tooltipContentVariants({
-    variant,
-    hiddenArrow
-  }), className)
-}, props)));
+const TooltipContent = ({ className, variant, hiddenArrow, ...props })=>/*#__PURE__*/ __rspack_external_react.createElement(Tooltip.Portal, null, /*#__PURE__*/ __rspack_external_react.createElement(Tooltip.Content, {
+        collisionPadding: 8,
+        sideOffset: 4,
+        className: cn(tooltipContentVariants({
+            variant,
+            hiddenArrow
+        }), className),
+        ...props
+    }));
 export { TooltipContent };
 
 //# sourceMappingURL=TooltipContent.js.map

package/Tooltip/components/TooltipContent.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Tooltip","TooltipPrimitive","cn","cva","tooltipContentVariants","variants","variant","accent","subtle","hiddenArrow","true","defaultVariants","TooltipContent","className","props","createElement","Portal","Content","Object","assign","collisionPadding","sideOffset"],"sources":["TooltipContent.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Tooltip as TooltipPrimitive } from \"radix-ui\";\nimport { cn, cva, type VariantProps } from \"~/utils.js\";\n\nconst tooltipContentVariants = cva(\n    [\n        \"z-[var(--z-index-tooltip)] px-sm-extra py-sm max-w-64 rounded-md text-sm font-normal animate-in fade-in-0 zoom-in-95\",\n        \"data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95\",\n        \"data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2\"\n    ],\n    {\n        variants: {\n            variant: {\n                accent: \"bg-neutral-dark text-neutral-light\",\n                subtle: \"bg-neutral-base text-neutral-primary shadow-md\"\n            },\n            hiddenArrow: {\n                true: [\n                    \"data-[side=top]:mb-xs-plus\",\n                    \"data-[side=bottom]:mt-xs-plus\",\n                    \"data-[side=left]:mr-xs-plus\",\n                    \"data-[side=right]:ml-xs-plus\"\n                ]\n            }\n        },\n        defaultVariants: {\n            variant: \"accent\"\n        }\n    }\n);\n\ntype TooltipContentProps = TooltipPrimitive.TooltipContentProps &\n    VariantProps<typeof tooltipContentVariants>;\n\nconst TooltipContent = ({ className, variant, hiddenArrow, ...props }: TooltipContentProps) => (\n    <TooltipPrimitive.Portal>\n        <TooltipPrimitive.Content\n            collisionPadding={8}\n            sideOffset={4}\n            className={cn(tooltipContentVariants({ variant, hiddenArrow }), className)}\n            {...props}\n        />\n    </TooltipPrimitive.Portal>\n);\n\nexport { TooltipContent, type TooltipContentProps };\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,OAAO,IAAIC,gBAAgB,QAAQ,UAAU;AACtD,SAASC,EAAE,EAAEC,GAAG;AAEhB,MAAMC,sBAAsB,GAAGD,GAAG,CAC9B,CACI,sHAAsH,EACtH,gGAAgG,EAChG,6JAA6J,CAChK,EACD;EACIE,QAAQ,EAAE;IACNC,OAAO,EAAE;MACLC,MAAM,EAAE,oCAAoC;MAC5CC,MAAM,EAAE;IACZ,CAAC;IACDC,WAAW,EAAE;MACTC,IAAI,EAAE,CACF,4BAA4B,EAC5B,+BAA+B,EAC/B,6BAA6B,EAC7B,8BAA8B;IAEtC;EACJ,CAAC;EACDC,eAAe,EAAE;IACbL,OAAO,EAAE;EACb;AACJ,CACJ,CAAC;AAKD,MAAMM,cAAc,GAAGA,CAAC;EAAEC,SAAS;EAAEP,OAAO;EAAEG,WAAW;EAAE,GAAGK;AAA2B,CAAC,kBACtFf,KAAA,CAAAgB,aAAA,CAACd,gBAAgB,CAACe,MAAM,qBACpBjB,KAAA,CAAAgB,aAAA,CAACd,gBAAgB,CAACgB,OAAO,EAAAC,MAAA,CAAAC,MAAA;EACrBC,gBAAgB,EAAE,CAAE;EACpBC,UAAU,EAAE,CAAE;EACdR,SAAS,EAAEX,EAAE,CAACE,sBAAsB,CAAC;IAAEE,OAAO;IAAEG;EAAY,CAAC,CAAC,EAAEI,SAAS;AAAE,GACvEC,KAAK,CACZ,CACoB,CAC5B;AAED,SAASF,cAAc","ignoreList":[]}
+{"version":3,"file":"Tooltip/components/TooltipContent.js","sources":["../../../src/Tooltip/components/TooltipContent.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Tooltip as TooltipPrimitive } from \"radix-ui\";\nimport { cn, cva, type VariantProps } from \"~/utils.js\";\n\nconst tooltipContentVariants = cva(\n    [\n        \"z-[var(--z-index-tooltip)] px-sm-extra py-sm max-w-64 rounded-md text-sm font-normal animate-in fade-in-0 zoom-in-95\",\n        \"data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95\",\n        \"data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2\"\n    ],\n    {\n        variants: {\n            variant: {\n                accent: \"bg-neutral-dark text-neutral-light\",\n                subtle: \"bg-neutral-base text-neutral-primary shadow-md\"\n            },\n            hiddenArrow: {\n                true: [\n                    \"data-[side=top]:mb-xs-plus\",\n                    \"data-[side=bottom]:mt-xs-plus\",\n                    \"data-[side=left]:mr-xs-plus\",\n                    \"data-[side=right]:ml-xs-plus\"\n                ]\n            }\n        },\n        defaultVariants: {\n            variant: \"accent\"\n        }\n    }\n);\n\ntype TooltipContentProps = TooltipPrimitive.TooltipContentProps &\n    VariantProps<typeof tooltipContentVariants>;\n\nconst TooltipContent = ({ className, variant, hiddenArrow, ...props }: TooltipContentProps) => (\n    <TooltipPrimitive.Portal>\n        <TooltipPrimitive.Content\n            collisionPadding={8}\n            sideOffset={4}\n            className={cn(tooltipContentVariants({ variant, hiddenArrow }), className)}\n            {...props}\n        />\n    </TooltipPrimitive.Portal>\n);\n\nexport { TooltipContent, type TooltipContentProps };\n"],"names":["tooltipContentVariants","cva","TooltipContent","className","variant","hiddenArrow","props","TooltipPrimitive","cn"],"mappings":";;;AAIA,MAAMA,yBAAyBC,IAC3B;IACI;IACA;IACA;CACH,EACD;IACI,UAAU;QACN,SAAS;YACL,QAAQ;YACR,QAAQ;QACZ;QACA,aAAa;YACT,MAAM;gBACF;gBACA;gBACA;gBACA;aACH;QACL;IACJ;IACA,iBAAiB;QACb,SAAS;IACb;AACJ;AAMJ,MAAMC,iBAAiB,CAAC,EAAEC,SAAS,EAAEC,OAAO,EAAEC,WAAW,EAAE,GAAGC,OAA4B,iBACtF,sCAACC,QAAAA,MAAuB,sBACpB,sCAACA,QAAAA,OAAwB;QACrB,kBAAkB;QAClB,YAAY;QACZ,WAAWC,GAAGR,uBAAuB;YAAEI;YAASC;QAAY,IAAIF;QAC/D,GAAGG,KAAK"}

package/Tooltip/components/index.js

@@ -1,4 +1,2 @@
 export * from "./TooltipArrow.js";
 export * from "./TooltipContent.js";
-
-//# sourceMappingURL=index.js.map

package/Tooltip/index.js

@@ -1,3 +1 @@
 export * from "./Tooltip.js";
-
-//# sourceMappingURL=index.js.map

package/Tree/Tree.js

@@ -1,113 +1,94 @@
-import React from "react";
-import { getBackendOptions, MultiBackend, Tree as DndTree, useDragOver } from "@minoru/react-dnd-treeview";
+import react from "react";
+import { MultiBackend, Tree, getBackendOptions, useDragOver } from "@minoru/react-dnd-treeview";
 import { DndProvider } from "react-dnd";
 import { makeDecoratable, withStaticProps } from "../utils.js";
 import { Item } from "./components/index.js";
 import { useTree } from "./useTree.js";
-const ListComponent = /*#__PURE__*/React.forwardRef(({
-  children,
-  className = "",
-  ...props
-}, ref) => {
-  const classNames = [...className.split(" "), "pt-1"].join(" ");
-  return /*#__PURE__*/React.createElement("ul", Object.assign({
-    ref: ref
-  }, props, {
-    className: classNames
-  }), children);
+const ListComponent = /*#__PURE__*/ react.forwardRef(({ children, className = "", ...props }, ref)=>{
+    const classNames = [
+        ...className.split(" "),
+        "pt-1"
+    ].join(" ");
+    return /*#__PURE__*/ react.createElement("ul", {
+        ref: ref,
+        ...props,
+        className: classNames
+    }, children);
 });
 ListComponent.displayName = "ListComponent";
-function renderTreeNode({
-  node,
-  params,
-  renderer
-}) {
-  const rendered = renderer?.(node, params);
-  if (rendered && /*#__PURE__*/React.isValidElement(rendered)) {
-    return rendered;
-  }
-  return node.label;
+function renderTreeNode({ node, params, renderer }) {
+    const rendered = renderer?.(node, params);
+    if (rendered && /*#__PURE__*/ react.isValidElement(rendered)) return rendered;
+    return node.label;
 }
-const BaseTree = props => {
-  const {
-    vm,
-    handleDrop,
-    changeOpen,
-    canDrag,
-    canDrop,
-    sort
-  } = useTree(props);
-  return /*#__PURE__*/React.createElement(DndProvider, {
-    backend: MultiBackend,
-    options: getBackendOptions()
-  }, /*#__PURE__*/React.createElement(DndTree, {
-    tree: vm.nodes,
-    rootId: vm.rootId,
-    initialOpen: vm.openNodeIds,
-    listComponent: ListComponent,
-    insertDroppableFirst: props.insertDroppableFirst,
-    render: (node, params) => {
-      const nodeData = node.data;
-
-      // Indentation logic: increase padding by 20 px per level with a base of 10 px
-      const indent = 10 + params.depth * 20;
-
-      // Use the drag over hook to handle drag and drop interactions
-      const dragOverProps = useDragOver(node.id, params.isOpen, params.onToggle);
-      const itemProps = props.autoExpandOnDragOver === false ? {} : dragOverProps;
-      const onToggle = e => {
-        e.stopPropagation();
-        params.onToggle && params.onToggle();
-      };
-      const isLocked = vm.lockedOpenNodeIds.includes(nodeData.id);
-      const isCollapsable = !isLocked && node.droppable;
-      return /*#__PURE__*/React.createElement(Item, Object.assign({
-        active: nodeData.active,
-        loading: nodeData.loading,
-        style: {
-          paddingInlineStart: indent
-        }
-      }, itemProps), isCollapsable && /*#__PURE__*/React.createElement(Tree.Item.CollapseTrigger, {
-        open: params.isOpen,
-        loading: nodeData.loading,
-        onClick: onToggle
-      }), /*#__PURE__*/React.createElement(Item.Content, {
-        onClick: () => {
-          if (props.onNodeClick) {
-            props.onNodeClick(nodeData);
-          }
-        }
-      }, renderTreeNode({
-        node: nodeData,
-        params,
-        renderer: props.renderer
-      })), params.draggable && /*#__PURE__*/React.createElement(Tree.Item.DragHandle, {
-        handleRef: params.handleRef
-      }));
-    },
-    dragPreviewRender: monitorProps => /*#__PURE__*/React.createElement(Item, null, /*#__PURE__*/React.createElement(Item.Content, null, renderTreeNode({
-      node: monitorProps.item.data,
-      renderer: props.renderer
-    }))),
-    dropTargetOffset: props.dropTargetOffset,
-    onDragStart: props.onDragStart,
-    onDrop: handleDrop,
-    onChangeOpen: changeOpen,
-    canDrag: canDrag,
-    canDrop: canDrop,
-    placeholderRender: props.placeholderRender,
-    classes: {
-      dropTarget: "bg-neutral-dark/5",
-      draggingSource: "opacity-50 bg-neutral-dimmed",
-      placeholder: "relative"
-    },
-    sort: typeof props.sort === "function" ? sort : props.sort
-  }));
+const BaseTree = (props)=>{
+    const { vm, handleDrop, changeOpen, canDrag, canDrop, sort } = useTree(props);
+    return /*#__PURE__*/ react.createElement(DndProvider, {
+        backend: MultiBackend,
+        options: getBackendOptions()
+    }, /*#__PURE__*/ react.createElement(Tree, {
+        tree: vm.nodes,
+        rootId: vm.rootId,
+        initialOpen: vm.openNodeIds,
+        listComponent: ListComponent,
+        insertDroppableFirst: props.insertDroppableFirst,
+        render: (node, params)=>{
+            const nodeData = node.data;
+            const indent = 10 + 20 * params.depth;
+            const dragOverProps = useDragOver(node.id, params.isOpen, params.onToggle);
+            const itemProps = false === props.autoExpandOnDragOver ? {} : dragOverProps;
+            const onToggle = (e)=>{
+                e.stopPropagation();
+                params.onToggle && params.onToggle();
+            };
+            const isLocked = vm.lockedOpenNodeIds.includes(nodeData.id);
+            const isCollapsable = !isLocked && node.droppable;
+            return /*#__PURE__*/ react.createElement(Item, {
+                active: nodeData.active,
+                loading: nodeData.loading,
+                style: {
+                    paddingInlineStart: indent
+                },
+                ...itemProps
+            }, isCollapsable && /*#__PURE__*/ react.createElement(Tree_Tree.Item.CollapseTrigger, {
+                open: params.isOpen,
+                loading: nodeData.loading,
+                onClick: onToggle
+            }), /*#__PURE__*/ react.createElement(Item.Content, {
+                onClick: ()=>{
+                    if (props.onNodeClick) props.onNodeClick(nodeData);
+                }
+            }, renderTreeNode({
+                node: nodeData,
+                params,
+                renderer: props.renderer
+            })), params.draggable && /*#__PURE__*/ react.createElement(Tree_Tree.Item.DragHandle, {
+                handleRef: params.handleRef
+            }));
+        },
+        dragPreviewRender: (monitorProps)=>/*#__PURE__*/ react.createElement(Item, null, /*#__PURE__*/ react.createElement(Item.Content, null, renderTreeNode({
+                node: monitorProps.item.data,
+                renderer: props.renderer
+            }))),
+        dropTargetOffset: props.dropTargetOffset,
+        onDragStart: props.onDragStart,
+        onDrop: handleDrop,
+        onChangeOpen: changeOpen,
+        canDrag: canDrag,
+        canDrop: canDrop,
+        placeholderRender: props.placeholderRender,
+        classes: {
+            dropTarget: "bg-neutral-dark/5",
+            draggingSource: "opacity-50 bg-neutral-dimmed",
+            placeholder: "relative"
+        },
+        sort: "function" == typeof props.sort ? sort : props.sort
+    }));
 };
 const DecoratableTree = makeDecoratable("Tree", BaseTree);
-const Tree = withStaticProps(DecoratableTree, {
-  Item
+const Tree_Tree = withStaticProps(DecoratableTree, {
+    Item: Item
 });
-export { Tree };
+export { Tree_Tree as Tree };
 
 //# sourceMappingURL=Tree.js.map

package/Tree/Tree.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","getBackendOptions","MultiBackend","Tree","DndTree","useDragOver","DndProvider","makeDecoratable","withStaticProps","Item","useTree","ListComponent","forwardRef","children","className","props","ref","classNames","split","join","createElement","Object","assign","displayName","renderTreeNode","node","params","renderer","rendered","isValidElement","label","BaseTree","vm","handleDrop","changeOpen","canDrag","canDrop","sort","backend","options","tree","nodes","rootId","initialOpen","openNodeIds","listComponent","insertDroppableFirst","render","nodeData","data","indent","depth","dragOverProps","id","isOpen","onToggle","itemProps","autoExpandOnDragOver","e","stopPropagation","isLocked","lockedOpenNodeIds","includes","isCollapsable","droppable","active","loading","style","paddingInlineStart","CollapseTrigger","open","onClick","Content","onNodeClick","draggable","DragHandle","handleRef","dragPreviewRender","monitorProps","item","dropTargetOffset","onDragStart","onDrop","onChangeOpen","placeholderRender","classes","dropTarget","draggingSource","placeholder","DecoratableTree"],"sources":["Tree.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n    getBackendOptions,\n    MultiBackend,\n    Tree as DndTree,\n    useDragOver,\n    type PlaceholderRender,\n    type NodeModel,\n    type RenderParams\n} from \"@minoru/react-dnd-treeview\";\n\nimport { DndProvider, type DragSourceMonitor } from \"react-dnd\";\nimport { makeDecoratable, withStaticProps } from \"~/utils.js\";\nimport { Item } from \"./components/index.js\";\nimport type { NodeDto, WithDefaultNodeData } from \"./domains/index.js\";\nimport { useTree } from \"./useTree.js\";\n\nexport interface DropOptions<TData = Record<string, any>> {\n    dragSourceId?: NodeDto<TData>[\"id\"];\n    dropTargetId: NodeDto<TData>[\"id\"];\n    dragSource?: NodeDto<TData>;\n    dropTarget?: NodeDto<TData>;\n}\n\nexport interface TreeProps<TData = Record<string, any>> {\n    autoExpandOnDragOver?: boolean;\n    canDrag?: (node: NodeDto<TData>) => boolean;\n    canDrop?: (tree: NodeDto<TData>[], options: DropOptions<TData>) => boolean;\n    defaultLockedOpenNodeIds?: string[];\n    defaultOpenNodeIds?: string[];\n    dropTargetOffset?: number;\n    insertDroppableFirst?: boolean;\n    loadingNodeIds?: string[];\n    nodes: NodeDto<TData>[];\n    onChangeOpen?: (newOpenNodes: NodeDto<TData>[]) => void;\n    onDragStart?: (node: NodeModel<NodeDto<TData>>, monitor: DragSourceMonitor) => void;\n    onDrop?: (newTree: NodeDto<TData>[], options: DropOptions<TData>) => Promise<void> | void;\n    onNodeClick?: (node: WithDefaultNodeData<TData>) => void;\n    placeholderRender?: PlaceholderRender<NodeDto<TData>>;\n    renderer?: (node: WithDefaultNodeData<TData>, params?: RenderParams) => React.ReactNode;\n    rootId?: string;\n    sort?: boolean | ((a: NodeDto<TData>, b: NodeDto<TData>) => number);\n}\n\ninterface RenderTreeNodeParams<TData> {\n    node: WithDefaultNodeData<TData>;\n    params?: RenderParams;\n    renderer?: TreeProps<TData>[\"renderer\"];\n}\n\nconst ListComponent = React.forwardRef(({ children, className = \"\", ...props }: any, ref) => {\n    const classNames = [...className.split(\" \"), \"pt-1\"].join(\" \");\n\n    return (\n        <ul ref={ref} {...props} className={classNames}>\n            {children}\n        </ul>\n    );\n});\n\nListComponent.displayName = \"ListComponent\";\n\nfunction renderTreeNode<TData>({ node, params, renderer }: RenderTreeNodeParams<TData>) {\n    const rendered = renderer?.(node, params);\n\n    if (rendered && React.isValidElement(rendered)) {\n        return rendered;\n    }\n\n    return node.label;\n}\n\nconst BaseTree = <TData,>(props: TreeProps<TData>) => {\n    const { vm, handleDrop, changeOpen, canDrag, canDrop, sort } = useTree<TData>(props);\n\n    return (\n        <DndProvider backend={MultiBackend} options={getBackendOptions()}>\n            <DndTree\n                tree={vm.nodes}\n                rootId={vm.rootId}\n                initialOpen={vm.openNodeIds}\n                listComponent={ListComponent}\n                insertDroppableFirst={props.insertDroppableFirst}\n                render={(node, params) => {\n                    const nodeData = node.data as WithDefaultNodeData<TData>;\n\n                    // Indentation logic: increase padding by 20 px per level with a base of 10 px\n                    const indent = 10 + params.depth * 20;\n\n                    // Use the drag over hook to handle drag and drop interactions\n                    const dragOverProps = useDragOver(node.id, params.isOpen, params.onToggle);\n\n                    const itemProps = props.autoExpandOnDragOver === false ? {} : dragOverProps;\n\n                    const onToggle = (e: React.MouseEvent) => {\n                        e.stopPropagation();\n                        params.onToggle && params.onToggle();\n                    };\n\n                    const isLocked = vm.lockedOpenNodeIds.includes(nodeData.id);\n                    const isCollapsable = !isLocked && node.droppable;\n\n                    return (\n                        <Item\n                            active={nodeData.active}\n                            loading={nodeData.loading}\n                            style={{ paddingInlineStart: indent }}\n                            {...itemProps}\n                        >\n                            {isCollapsable && (\n                                <Tree.Item.CollapseTrigger\n                                    open={params.isOpen}\n                                    loading={nodeData.loading}\n                                    onClick={onToggle}\n                                />\n                            )}\n\n                            <Item.Content\n                                onClick={() => {\n                                    if (props.onNodeClick) {\n                                        props.onNodeClick(nodeData);\n                                    }\n                                }}\n                            >\n                                {renderTreeNode({\n                                    node: nodeData,\n                                    params,\n                                    renderer: props.renderer\n                                })}\n                            </Item.Content>\n\n                            {params.draggable && (\n                                <Tree.Item.DragHandle handleRef={params.handleRef} />\n                            )}\n                        </Item>\n                    );\n                }}\n                dragPreviewRender={monitorProps => (\n                    <Item>\n                        <Item.Content>\n                            {renderTreeNode({\n                                node: monitorProps.item.data as WithDefaultNodeData<TData>,\n                                renderer: props.renderer\n                            })}\n                        </Item.Content>\n                    </Item>\n                )}\n                dropTargetOffset={props.dropTargetOffset}\n                onDragStart={props.onDragStart}\n                onDrop={handleDrop}\n                onChangeOpen={changeOpen}\n                canDrag={canDrag}\n                canDrop={canDrop}\n                placeholderRender={props.placeholderRender}\n                classes={{\n                    dropTarget: \"bg-neutral-dark/5\",\n                    draggingSource: \"opacity-50 bg-neutral-dimmed\",\n                    placeholder: \"relative\"\n                }}\n                sort={typeof props.sort === \"function\" ? sort : props.sort}\n            />\n        </DndProvider>\n    );\n};\n\nconst DecoratableTree = makeDecoratable(\"Tree\", BaseTree);\n\nconst Tree = withStaticProps(DecoratableTree, {\n    Item\n});\n\nexport { Tree, type NodeModel };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SACIC,iBAAiB,EACjBC,YAAY,EACZC,IAAI,IAAIC,OAAO,EACfC,WAAW,QAIR,4BAA4B;AAEnC,SAASC,WAAW,QAAgC,WAAW;AAC/D,SAASC,eAAe,EAAEC,eAAe;AACzC,SAASC,IAAI;AAEb,SAASC,OAAO;AAmChB,MAAMC,aAAa,gBAAGX,KAAK,CAACY,UAAU,CAAC,CAAC;EAAEC,QAAQ;EAAEC,SAAS,GAAG,EAAE;EAAE,GAAGC;AAAW,CAAC,EAAEC,GAAG,KAAK;EACzF,MAAMC,UAAU,GAAG,CAAC,GAAGH,SAAS,CAACI,KAAK,CAAC,GAAG,CAAC,EAAE,MAAM,CAAC,CAACC,IAAI,CAAC,GAAG,CAAC;EAE9D,oBACInB,KAAA,CAAAoB,aAAA,OAAAC,MAAA,CAAAC,MAAA;IAAIN,GAAG,EAAEA;EAAI,GAAKD,KAAK;IAAED,SAAS,EAAEG;EAAW,IAC1CJ,QACD,CAAC;AAEb,CAAC,CAAC;AAEFF,aAAa,CAACY,WAAW,GAAG,eAAe;AAE3C,SAASC,cAAcA,CAAQ;EAAEC,IAAI;EAAEC,MAAM;EAAEC;AAAsC,CAAC,EAAE;EACpF,MAAMC,QAAQ,GAAGD,QAAQ,GAAGF,IAAI,EAAEC,MAAM,CAAC;EAEzC,IAAIE,QAAQ,iBAAI5B,KAAK,CAAC6B,cAAc,CAACD,QAAQ,CAAC,EAAE;IAC5C,OAAOA,QAAQ;EACnB;EAEA,OAAOH,IAAI,CAACK,KAAK;AACrB;AAEA,MAAMC,QAAQ,GAAYhB,KAAuB,IAAK;EAClD,MAAM;IAAEiB,EAAE;IAAEC,UAAU;IAAEC,UAAU;IAAEC,OAAO;IAAEC,OAAO;IAAEC;EAAK,CAAC,GAAG3B,OAAO,CAAQK,KAAK,CAAC;EAEpF,oBACIf,KAAA,CAAAoB,aAAA,CAACd,WAAW;IAACgC,OAAO,EAAEpC,YAAa;IAACqC,OAAO,EAAEtC,iBAAiB,CAAC;EAAE,gBAC7DD,KAAA,CAAAoB,aAAA,CAAChB,OAAO;IACJoC,IAAI,EAAER,EAAE,CAACS,KAAM;IACfC,MAAM,EAAEV,EAAE,CAACU,MAAO;IAClBC,WAAW,EAAEX,EAAE,CAACY,WAAY;IAC5BC,aAAa,EAAElC,aAAc;IAC7BmC,oBAAoB,EAAE/B,KAAK,CAAC+B,oBAAqB;IACjDC,MAAM,EAAEA,CAACtB,IAAI,EAAEC,MAAM,KAAK;MACtB,MAAMsB,QAAQ,GAAGvB,IAAI,CAACwB,IAAkC;;MAExD;MACA,MAAMC,MAAM,GAAG,EAAE,GAAGxB,MAAM,CAACyB,KAAK,GAAG,EAAE;;MAErC;MACA,MAAMC,aAAa,GAAG/C,WAAW,CAACoB,IAAI,CAAC4B,EAAE,EAAE3B,MAAM,CAAC4B,MAAM,EAAE5B,MAAM,CAAC6B,QAAQ,CAAC;MAE1E,MAAMC,SAAS,GAAGzC,KAAK,CAAC0C,oBAAoB,KAAK,KAAK,GAAG,CAAC,CAAC,GAAGL,aAAa;MAE3E,MAAMG,QAAQ,GAAIG,CAAmB,IAAK;QACtCA,CAAC,CAACC,eAAe,CAAC,CAAC;QACnBjC,MAAM,CAAC6B,QAAQ,IAAI7B,MAAM,CAAC6B,QAAQ,CAAC,CAAC;MACxC,CAAC;MAED,MAAMK,QAAQ,GAAG5B,EAAE,CAAC6B,iBAAiB,CAACC,QAAQ,CAACd,QAAQ,CAACK,EAAE,CAAC;MAC3D,MAAMU,aAAa,GAAG,CAACH,QAAQ,IAAInC,IAAI,CAACuC,SAAS;MAEjD,oBACIhE,KAAA,CAAAoB,aAAA,CAACX,IAAI,EAAAY,MAAA,CAAAC,MAAA;QACD2C,MAAM,EAAEjB,QAAQ,CAACiB,MAAO;QACxBC,OAAO,EAAElB,QAAQ,CAACkB,OAAQ;QAC1BC,KAAK,EAAE;UAAEC,kBAAkB,EAAElB;QAAO;MAAE,GAClCM,SAAS,GAEZO,aAAa,iBACV/D,KAAA,CAAAoB,aAAA,CAACjB,IAAI,CAACM,IAAI,CAAC4D,eAAe;QACtBC,IAAI,EAAE5C,MAAM,CAAC4B,MAAO;QACpBY,OAAO,EAAElB,QAAQ,CAACkB,OAAQ;QAC1BK,OAAO,EAAEhB;MAAS,CACrB,CACJ,eAEDvD,KAAA,CAAAoB,aAAA,CAACX,IAAI,CAAC+D,OAAO;QACTD,OAAO,EAAEA,CAAA,KAAM;UACX,IAAIxD,KAAK,CAAC0D,WAAW,EAAE;YACnB1D,KAAK,CAAC0D,WAAW,CAACzB,QAAQ,CAAC;UAC/B;QACJ;MAAE,GAEDxB,cAAc,CAAC;QACZC,IAAI,EAAEuB,QAAQ;QACdtB,MAAM;QACNC,QAAQ,EAAEZ,KAAK,CAACY;MACpB,CAAC,CACS,CAAC,EAEdD,MAAM,CAACgD,SAAS,iBACb1E,KAAA,CAAAoB,aAAA,CAACjB,IAAI,CAACM,IAAI,CAACkE,UAAU;QAACC,SAAS,EAAElD,MAAM,CAACkD;MAAU,CAAE,CAEtD,CAAC;IAEf,CAAE;IACFC,iBAAiB,EAAEC,YAAY,iBAC3B9E,KAAA,CAAAoB,aAAA,CAACX,IAAI,qBACDT,KAAA,CAAAoB,aAAA,CAACX,IAAI,CAAC+D,OAAO,QACRhD,cAAc,CAAC;MACZC,IAAI,EAAEqD,YAAY,CAACC,IAAI,CAAC9B,IAAkC;MAC1DtB,QAAQ,EAAEZ,KAAK,CAACY;IACpB,CAAC,CACS,CACZ,CACR;IACFqD,gBAAgB,EAAEjE,KAAK,CAACiE,gBAAiB;IACzCC,WAAW,EAAElE,KAAK,CAACkE,WAAY;IAC/BC,MAAM,EAAEjD,UAAW;IACnBkD,YAAY,EAAEjD,UAAW;IACzBC,OAAO,EAAEA,OAAQ;IACjBC,OAAO,EAAEA,OAAQ;IACjBgD,iBAAiB,EAAErE,KAAK,CAACqE,iBAAkB;IAC3CC,OAAO,EAAE;MACLC,UAAU,EAAE,mBAAmB;MAC/BC,cAAc,EAAE,8BAA8B;MAC9CC,WAAW,EAAE;IACjB,CAAE;IACFnD,IAAI,EAAE,OAAOtB,KAAK,CAACsB,IAAI,KAAK,UAAU,GAAGA,IAAI,GAAGtB,KAAK,CAACsB;EAAK,CAC9D,CACQ,CAAC;AAEtB,CAAC;AAED,MAAMoD,eAAe,GAAGlF,eAAe,CAAC,MAAM,EAAEwB,QAAQ,CAAC;AAEzD,MAAM5B,IAAI,GAAGK,eAAe,CAACiF,eAAe,EAAE;EAC1ChF;AACJ,CAAC,CAAC;AAEF,SAASN,IAAI","ignoreList":[]}
+{"version":3,"file":"Tree/Tree.js","sources":["../../src/Tree/Tree.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n    getBackendOptions,\n    MultiBackend,\n    Tree as DndTree,\n    useDragOver,\n    type PlaceholderRender,\n    type NodeModel,\n    type RenderParams\n} from \"@minoru/react-dnd-treeview\";\n\nimport { DndProvider, type DragSourceMonitor } from \"react-dnd\";\nimport { makeDecoratable, withStaticProps } from \"~/utils.js\";\nimport { Item } from \"./components/index.js\";\nimport type { NodeDto, WithDefaultNodeData } from \"./domains/index.js\";\nimport { useTree } from \"./useTree.js\";\n\nexport interface DropOptions<TData = Record<string, any>> {\n    dragSourceId?: NodeDto<TData>[\"id\"];\n    dropTargetId: NodeDto<TData>[\"id\"];\n    dragSource?: NodeDto<TData>;\n    dropTarget?: NodeDto<TData>;\n}\n\nexport interface TreeProps<TData = Record<string, any>> {\n    autoExpandOnDragOver?: boolean;\n    canDrag?: (node: NodeDto<TData>) => boolean;\n    canDrop?: (tree: NodeDto<TData>[], options: DropOptions<TData>) => boolean;\n    defaultLockedOpenNodeIds?: string[];\n    defaultOpenNodeIds?: string[];\n    dropTargetOffset?: number;\n    insertDroppableFirst?: boolean;\n    loadingNodeIds?: string[];\n    nodes: NodeDto<TData>[];\n    onChangeOpen?: (newOpenNodes: NodeDto<TData>[]) => void;\n    onDragStart?: (node: NodeModel<NodeDto<TData>>, monitor: DragSourceMonitor) => void;\n    onDrop?: (newTree: NodeDto<TData>[], options: DropOptions<TData>) => Promise<void> | void;\n    onNodeClick?: (node: WithDefaultNodeData<TData>) => void;\n    placeholderRender?: PlaceholderRender<NodeDto<TData>>;\n    renderer?: (node: WithDefaultNodeData<TData>, params?: RenderParams) => React.ReactNode;\n    rootId?: string;\n    sort?: boolean | ((a: NodeDto<TData>, b: NodeDto<TData>) => number);\n}\n\ninterface RenderTreeNodeParams<TData> {\n    node: WithDefaultNodeData<TData>;\n    params?: RenderParams;\n    renderer?: TreeProps<TData>[\"renderer\"];\n}\n\nconst ListComponent = React.forwardRef(({ children, className = \"\", ...props }: any, ref) => {\n    const classNames = [...className.split(\" \"), \"pt-1\"].join(\" \");\n\n    return (\n        <ul ref={ref} {...props} className={classNames}>\n            {children}\n        </ul>\n    );\n});\n\nListComponent.displayName = \"ListComponent\";\n\nfunction renderTreeNode<TData>({ node, params, renderer }: RenderTreeNodeParams<TData>) {\n    const rendered = renderer?.(node, params);\n\n    if (rendered && React.isValidElement(rendered)) {\n        return rendered;\n    }\n\n    return node.label;\n}\n\nconst BaseTree = <TData,>(props: TreeProps<TData>) => {\n    const { vm, handleDrop, changeOpen, canDrag, canDrop, sort } = useTree<TData>(props);\n\n    return (\n        <DndProvider backend={MultiBackend} options={getBackendOptions()}>\n            <DndTree\n                tree={vm.nodes}\n                rootId={vm.rootId}\n                initialOpen={vm.openNodeIds}\n                listComponent={ListComponent}\n                insertDroppableFirst={props.insertDroppableFirst}\n                render={(node, params) => {\n                    const nodeData = node.data as WithDefaultNodeData<TData>;\n\n                    // Indentation logic: increase padding by 20 px per level with a base of 10 px\n                    const indent = 10 + params.depth * 20;\n\n                    // Use the drag over hook to handle drag and drop interactions\n                    const dragOverProps = useDragOver(node.id, params.isOpen, params.onToggle);\n\n                    const itemProps = props.autoExpandOnDragOver === false ? {} : dragOverProps;\n\n                    const onToggle = (e: React.MouseEvent) => {\n                        e.stopPropagation();\n                        params.onToggle && params.onToggle();\n                    };\n\n                    const isLocked = vm.lockedOpenNodeIds.includes(nodeData.id);\n                    const isCollapsable = !isLocked && node.droppable;\n\n                    return (\n                        <Item\n                            active={nodeData.active}\n                            loading={nodeData.loading}\n                            style={{ paddingInlineStart: indent }}\n                            {...itemProps}\n                        >\n                            {isCollapsable && (\n                                <Tree.Item.CollapseTrigger\n                                    open={params.isOpen}\n                                    loading={nodeData.loading}\n                                    onClick={onToggle}\n                                />\n                            )}\n\n                            <Item.Content\n                                onClick={() => {\n                                    if (props.onNodeClick) {\n                                        props.onNodeClick(nodeData);\n                                    }\n                                }}\n                            >\n                                {renderTreeNode({\n                                    node: nodeData,\n                                    params,\n                                    renderer: props.renderer\n                                })}\n                            </Item.Content>\n\n                            {params.draggable && (\n                                <Tree.Item.DragHandle handleRef={params.handleRef} />\n                            )}\n                        </Item>\n                    );\n                }}\n                dragPreviewRender={monitorProps => (\n                    <Item>\n                        <Item.Content>\n                            {renderTreeNode({\n                                node: monitorProps.item.data as WithDefaultNodeData<TData>,\n                                renderer: props.renderer\n                            })}\n                        </Item.Content>\n                    </Item>\n                )}\n                dropTargetOffset={props.dropTargetOffset}\n                onDragStart={props.onDragStart}\n                onDrop={handleDrop}\n                onChangeOpen={changeOpen}\n                canDrag={canDrag}\n                canDrop={canDrop}\n                placeholderRender={props.placeholderRender}\n                classes={{\n                    dropTarget: \"bg-neutral-dark/5\",\n                    draggingSource: \"opacity-50 bg-neutral-dimmed\",\n                    placeholder: \"relative\"\n                }}\n                sort={typeof props.sort === \"function\" ? sort : props.sort}\n            />\n        </DndProvider>\n    );\n};\n\nconst DecoratableTree = makeDecoratable(\"Tree\", BaseTree);\n\nconst Tree = withStaticProps(DecoratableTree, {\n    Item\n});\n\nexport { Tree, type NodeModel };\n"],"names":["ListComponent","React","children","className","props","ref","classNames","renderTreeNode","node","params","renderer","rendered","BaseTree","vm","handleDrop","changeOpen","canDrag","canDrop","sort","useTree","DndProvider","MultiBackend","getBackendOptions","DndTree","nodeData","indent","dragOverProps","useDragOver","itemProps","onToggle","e","isLocked","isCollapsable","Item","Tree","monitorProps","DecoratableTree","makeDecoratable","withStaticProps"],"mappings":"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"}