@edifice.io/react 2.0.0-develop-rc.14 → 2.0.0-develop-rc.16

package/dist/components/Tree/types/index.d.ts

@@ -0,0 +1,170 @@
+import { UniqueIdentifier } from '@dnd-kit/core';
+import { ComponentPropsWithRef } from 'react';
+export type TreeItem = {
+    id: string;
+    name: string;
+    position?: number;
+    section?: boolean;
+    children?: TreeItem[];
+    isVisible?: boolean;
+    [index: string]: any;
+};
+export type Projected = {
+    depth: number;
+    parentId: string | null;
+    activeId: UniqueIdentifier;
+} | null;
+export interface TreeProps extends SharedTreeProps {
+    /**
+     * Tree data
+     */
+    nodes: TreeItem | TreeItem[];
+    /**
+     * Expand all nodes
+     */
+    shouldExpandAllNodes?: boolean;
+    /**
+     * Pass draggeNode when you drag an element from another context (resource / folder)
+     */
+    draggedNode?: {
+        isOver: boolean;
+        overId: string | undefined;
+        isTreeview: boolean;
+    };
+    /**
+     * Callback function to provide folded item to parent component
+     */
+    onTreeItemFold?: (nodeId: string) => void;
+    /**
+     * Callback function to provide unfolded item to parent component
+     */
+    onTreeItemUnfold?: (nodeId: string) => void;
+    /**
+     * Callback function to secondary action
+     */
+    onTreeItemAction?: (nodeId: string) => void;
+}
+export interface DndTreeProps extends TreeProps {
+    /**
+     * Pass draggeNode when you drag an element from another context (resource / folder)
+     */
+    draggedNode?: {
+        isOver: boolean;
+        overId: string | undefined;
+        isTreeview: boolean;
+    };
+}
+export interface SortableTreeProps extends TreeProps {
+    /**
+     *
+     * @param id
+     * @returns disable a specific node or the whole tree
+     * disable a specific node: (nodeId) => disabledIds.includes(nodeId)
+     * disable sorting: () => true
+     */
+    isDisabled?: (id: UniqueIdentifier) => boolean;
+    /**
+     *
+     * @param nodeId dropped node
+     * @param parentId current parentId or new parentId if move inside a new item
+     * @returns gets nodeId and parentId to update via a service
+     */
+    onSortable: (updateArray: UpdateTreeData[]) => void;
+}
+export interface SharedTreeProps {
+    /**
+     * Customize the JSX we render inside a node
+     */
+    renderNode?: (payload: {
+        node: TreeItem;
+        hasChildren?: boolean;
+        isChild?: boolean;
+    }) => React.ReactNode;
+    /**
+     * Show Section Icon
+     */
+    showIcon?: boolean;
+    /**
+     * Node ID used for synchronization
+     */
+    selectedNodeId?: string | null;
+    /**
+     * Callback function to provide selected item to parent component
+     */
+    onTreeItemClick: (nodeId: string) => void;
+}
+export interface TreeNodeProps extends ComponentPropsWithRef<"li">, SharedTreeProps {
+    /**
+     * Node data
+     */
+    node: TreeItem;
+    /**
+     * Is dragging element
+     */
+    focused?: boolean;
+    /**
+     * Use to disable sorting, check SortableTreeProps
+     */
+    disabled?: boolean;
+    /**
+     * Id of draggable node
+     */
+    draggedNodeId?: string | undefined;
+    /**
+     * Nodes expanded (opened)
+     */
+    expandedNodes: Set<string>;
+    /**
+     * Siblings nodes
+     */
+    siblingsNodes?: React.MutableRefObject<Set<string>>;
+    /**
+     * Node is a child
+     */
+    isChild?: boolean;
+    /**
+     * Function to fold / unfold node
+     */
+    onToggleNode?: (nodeId: string) => void;
+}
+export interface DndTreeNodeProps extends TreeNodeProps {
+    /**
+     * Id of draggable node
+     */
+    draggedNodeId?: string | undefined;
+}
+export interface SortableTreeNodeProps extends TreeNodeProps {
+    /**
+     * Use to disable sorting, check SortableTreeProps
+     */
+    disabled?: boolean;
+    /**
+     * Node spacing value
+     */
+    indentationWidth: number;
+    /**
+     * Depth.
+     */
+    depth: number;
+    /**
+     * Node identifier as parent or child
+     */
+    isChild?: boolean;
+    /**
+     *  Projected node before dragging it
+     */
+    projected?: Projected;
+}
+export interface FlattenedItem extends TreeItem {
+    parentId: string | null;
+    depth: number;
+}
+export interface TreeViewHandlers {
+    unselect: () => void;
+    select: (nodeId: string) => void;
+}
+export interface UpdateTreeData {
+    _id: string;
+    parentId: string;
+    position: number | null;
+}

package/dist/components/Tree/utilities/tree-sortable.d.ts

@@ -0,0 +1,29 @@
+import { Active, Over, UniqueIdentifier } from '@dnd-kit/core';
+import { FlattenedItem, Projected, TreeItem } from '../types';
+export declare function getDragDepth(offset: number, indentationWidth: number): number;
+export declare function determineNewParentId(active: Active, over: Over | null, activeNode: FlattenedItem, overNode: FlattenedItem | null, projected: Projected): string | null | undefined;
+export declare function getActiveAndOverNodes(tree: FlattenedItem[], activeId: UniqueIdentifier, overId?: UniqueIdentifier | undefined): {
+    activeNode: FlattenedItem;
+    activeNodeIndex: number;
+    overNode: FlattenedItem | null;
+    overNodeIndex: number;
+};
+export declare function getIndicesToUpdate(activeNode: FlattenedItem, activeNodeIndex: number, flattenedTree: FlattenedItem[], projected: Projected): number[];
+export declare function flattenTree(tree: TreeItem[], parentId: string | null, depth?: number): FlattenedItem[];
+export declare function updateParentIds(flattenedTree: any[], indices: number[], newParentId: string | null | undefined): void;
+export declare function findItemIndexInTree(tree: any[], itemId: string): number | null;
+export declare function generateUpdateData(updatedFlattenedTree: FlattenedItem[], tree: TreeItem[]): {
+    updateArray: {
+        _id: string;
+        position: number;
+        parentId?: string;
+    }[];
+    updatedTreeData: FlattenedItem[];
+};
+export declare const buildTree: (flatNodes: FlattenedItem[]) => TreeItem[];
+export declare function getProjection(items: FlattenedItem[], activeId: UniqueIdentifier, overId: UniqueIdentifier, dragOffset: number, indentationWidth: number): {
+    depth: number;
+    parentId: string | null;
+    activeId: UniqueIdentifier;
+    previousItem: FlattenedItem;
+};

package/dist/components/Tree/utilities/tree-sortable.js

@@ -0,0 +1,130 @@
+import { arrayMove } from "@dnd-kit/sortable";
+function getDragDepth(offset, indentationWidth) {
+  return Math.round(offset / indentationWidth);
+}
+function getSubtreeIndices(flattenedTree, activeIndex) {
+  const indices = [activeIndex], nodeIds = [flattenedTree[activeIndex].id];
+  for (let i = activeIndex + 1; i < flattenedTree.length; i++) {
+    const item = flattenedTree[i];
+    item.parentId && nodeIds.includes(item.parentId) && (indices.push(i), nodeIds.push(item.id));
+  }
+  return indices;
+}
+function determineNewParentId(active, over, activeNode, overNode, projected) {
+  if (projected && (projected.depth === 0 || projected.depth === 1))
+    return projected.parentId;
+  if (active.id !== (over == null ? void 0 : over.id) && overNode)
+    return overNode.parentId === activeNode.parentId ? activeNode.parentId : overNode.parentId;
+}
+function getActiveAndOverNodes(tree, activeId, overId) {
+  const activeNodeIndex = tree.findIndex(({
+    id
+  }) => id === activeId), overNodeIndex = overId ? tree.findIndex(({
+    id
+  }) => id === overId) : -1, activeNode = tree[activeNodeIndex], overNode = overNodeIndex !== -1 ? tree[overNodeIndex] : null;
+  return {
+    activeNode,
+    activeNodeIndex,
+    overNode,
+    overNodeIndex
+  };
+}
+function getIndicesToUpdate(activeNode, activeNodeIndex, flattenedTree, projected) {
+  return activeNode.children && activeNode.children.length > 0 && (projected == null ? void 0 : projected.depth) === 1 ? getSubtreeIndices(flattenedTree, activeNodeIndex) : [activeNodeIndex];
+}
+function flattenTree(tree, parentId, depth = 0) {
+  return tree.reduce((acc, node) => (acc.push({
+    id: node.id,
+    name: node.name,
+    parentId: parentId ?? null,
+    position: node.position ?? void 0,
+    depth: depth ?? 0,
+    children: node.children,
+    isVisible: node.isVisible
+  }), node.children && node.children.length > 0 && (acc = acc.concat(flattenTree(node.children, node.id, depth + 1))), acc), []);
+}
+function updateParentIds(flattenedTree, indices, newParentId) {
+  indices.forEach((index) => {
+    flattenedTree[index] = {
+      ...flattenedTree[index],
+      parentId: newParentId
+    };
+  });
+}
+function generateUpdateData(updatedFlattenedTree, tree) {
+  const updateArray = [];
+  let positionCounter = 0;
+  const itemMap = /* @__PURE__ */ new Map();
+  updatedFlattenedTree.forEach((item) => {
+    itemMap.set(item.id, item);
+  });
+  function traverse(items, parentId) {
+    for (const item of items) {
+      const updateItem = {
+        _id: item.id,
+        position: positionCounter,
+        parentId: parentId ?? void 0,
+        isVisible: item.isVisible
+      };
+      updateArray.push(updateItem);
+      const flattenedItem = itemMap.get(item.id);
+      flattenedItem && (flattenedItem.position = positionCounter), positionCounter++, item.children && item.children.length > 0 && traverse(item.children, item.id);
+    }
+  }
+  return traverse(tree, null), {
+    updateArray,
+    updatedTreeData: updatedFlattenedTree
+  };
+}
+const buildTree = (flatNodes) => {
+  const nodeMap = /* @__PURE__ */ new Map();
+  flatNodes.forEach((node) => {
+    nodeMap.set(node.id, {
+      id: node.id,
+      name: node.name,
+      children: [],
+      position: node.position,
+      isVisible: node.isVisible
+    });
+  });
+  const tree = [];
+  return flatNodes.forEach((node) => {
+    var _a;
+    const treeNode = nodeMap.get(node.id);
+    if (node.parentId === null || node.parentId === void 0)
+      tree.push(treeNode);
+    else {
+      const parentNode = nodeMap.get(node.parentId);
+      parentNode && (parentNode.children = parentNode.children ?? void 0, (_a = parentNode.children) == null || _a.push(treeNode));
+    }
+  }), tree;
+};
+function getProjection(items, activeId, overId, dragOffset, indentationWidth) {
+  const overItemIndex = items.findIndex(({
+    id
+  }) => id === overId), activeItemIndex = items.findIndex(({
+    id
+  }) => id === activeId), activeItem = items[activeItemIndex], newItems = arrayMove(items, activeItemIndex, overItemIndex), previousItem = newItems[overItemIndex - 1], dragDepth = getDragDepth(dragOffset, indentationWidth), projectedDepth = activeItem.depth + dragDepth;
+  let depth = projectedDepth + activeItem.depth;
+  return previousItem ? depth = Math.max(0, Math.min(1, projectedDepth)) : depth = 0, {
+    depth,
+    parentId: getParentId(),
+    activeId,
+    previousItem
+  };
+  function getParentId() {
+    var _a;
+    return depth === 0 || !previousItem ? null : depth === previousItem.depth ? previousItem.parentId : depth > previousItem.depth ? previousItem.id : ((_a = newItems.slice(0, overItemIndex).reverse().find((item) => item.depth === depth)) == null ? void 0 : _a.parentId) ?? null;
+  }
+}
+export {
+  buildTree,
+  determineNewParentId,
+  flattenTree,
+  generateUpdateData,
+  getActiveAndOverNodes,
+  getDragDepth,
+  getIndicesToUpdate,
+  getProjection,
+  updateParentIds
+};

package/dist/components/Tree/utilities/tree.d.ts

@@ -0,0 +1,34 @@
+import { IFolder } from '@edifice.io/ts-client';
+import { TreeItem } from '../types';
+export declare function findNodeById(data: TreeItem | TreeItem[], id: string): TreeItem | undefined;
+export declare function addNode(node: TreeItem, { parentId, newFolder }: {
+    parentId: string;
+    newFolder: IFolder;
+}): TreeItem;
+export declare function arrayUnique<T>(array: T[]): T[];
+export declare function deleteNode(node: TreeItem, { folders }: {
+    folders: string[];
+}): TreeItem;
+export declare const findParentNode: (parentNode: TreeItem, childId: string) => TreeItem | undefined;
+export declare function getAncestors(data: TreeItem, folderId: string): string[];
+export declare function hasChildren(folderId: string, data: TreeItem): boolean;
+export declare function modifyNode(data: TreeItem, callback: (node: TreeItem, parent?: TreeItem) => TreeItem | undefined): TreeItem;
+export declare function moveNode(node: TreeItem, { destinationId, folders }: {
+    destinationId: string;
+    folders: string[];
+}): TreeItem;
+export declare const wrapTreeNode: (node: TreeItem, folders: IFolder[] | undefined, parentId: string) => TreeItem;
+export declare function updateNode(node: TreeItem, { folderId, newFolder }: {
+    folderId: string;
+    newFolder: IFolder;
+}): TreeItem;
+export declare function findPathById(tree: TreeItem | TreeItem[], nodeId: string): string[];
+export declare class TreeNodeFolderWrapper implements TreeItem {
+    readonly folder: IFolder;
+    constructor(folder: IFolder);
+    readonly id: string;
+    readonly name: string;
+    readonly childNumber: number;
+    section: boolean;
+    readonly children: TreeItem[];
+}

package/dist/components/Tree/utilities/tree.js

@@ -0,0 +1,44 @@
+import "@edifice.io/ts-client";
+function findNodeById(data, id) {
+  if (Array.isArray(data))
+    for (const node of data) {
+      const result = findNodeById(node, id);
+      if (result)
+        return result;
+    }
+  else {
+    if (data.id === id) return data;
+    if (data.children)
+      for (const child of data.children) {
+        const result = findNodeById(child, id);
+        if (result)
+          return result;
+      }
+  }
+}
+function findPathById(tree, nodeId) {
+  let path = [];
+  function traverse(node, currentPath) {
+    if (node.id === nodeId)
+      return path = currentPath.concat(node.id), !0;
+    if (node.children) {
+      for (const child of node.children)
+        if (traverse(child, currentPath.concat(node.id)))
+          return !0;
+    }
+    return !1;
+  }
+  function startTraverse(nodes) {
+    if (Array.isArray(nodes)) {
+      for (const node of nodes)
+        if (traverse(node, []))
+          break;
+    } else
+      traverse(nodes, []);
+  }
+  return startTraverse(tree), path;
+}
+export {
+  findNodeById,
+  findPathById
+};

package/dist/components/TreeView/TreeNode.d.ts

@@ -1,22 +1,48 @@
-export interface TreeNode {
+import { TreeData } from '../../types';
+export interface TreeNodeProps_V1 {
     /**
-     * @param id : node's id
+     * Data
      */
-    id: string;
+    node: TreeData;
     /**
-     * @param name : name's id
+     * Show or hide section icon (folder icon)
      */
-    name: string;
+    showIcon?: boolean;
     /**
-     * @param section: indicate if node is a top section (useful for specific icon)
+     * Nodes expanded (opened)
      */
-    section?: boolean;
+    expandedNodes: Set<string>;
     /**
-     * Is this node contains children ?
+     * Siblings nodes
      */
-    children?: readonly TreeNode[];
+    siblingsNodes?: React.MutableRefObject<Set<string>>;
     /**
-     * All none declare types
+     * External node selected to sync Treeview
      */
-    [key: string]: any;
+    selectedNodeId?: string;
+    /**
+     * Is treeview is an array
+     */
+    isTreeviewArray?: boolean;
+    /**
+     * Is node over
+     */
+    focused?: boolean;
+    /**
+     * Id of draggable node
+     */
+    draggedNodeId?: string | undefined;
+    /**
+     * Function to select item
+     */
+    handleItemClick: (nodeId: string) => void;
+    /**
+     * Function to fold / unfold node
+     */
+    handleToggleNode?: (nodeId: string) => void;
+    /**
+     * Function to handle secondary action
+     */
+    handleItemAction?: (nodeId: string) => void;
 }
+export declare const TreeNode: ({ node, showIcon, selectedNodeId, expandedNodes, siblingsNodes, draggedNodeId, handleItemClick, handleToggleNode, handleItemAction, }: TreeNodeProps_V1) => import("react/jsx-runtime").JSX.Element;

package/dist/components/TreeView/TreeNode.js

@@ -0,0 +1,69 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useDroppable } from "@dnd-kit/core";
+import clsx from "clsx";
+import { useId } from "react";
+import { useTranslation } from "react-i18next";
+import SvgIconFolder from "../../modules/icons/components/IconFolder.js";
+import SvgIconPlus from "../../modules/icons/components/IconPlus.js";
+import SvgIconRafterDown from "../../modules/icons/components/IconRafterDown.js";
+import SvgIconRafterRight from "../../modules/icons/components/IconRafterRight.js";
+const TreeNode = ({
+  node,
+  showIcon,
+  selectedNodeId,
+  expandedNodes,
+  siblingsNodes,
+  draggedNodeId,
+  handleItemClick,
+  handleToggleNode,
+  handleItemAction
+}) => {
+  const expanded = expandedNodes.has(node.id), sibling = siblingsNodes == null ? void 0 : siblingsNodes.current.has(node.id), selected = selectedNodeId === node.id, focused = draggedNodeId === node.id, treeItemClasses = {
+    action: clsx("action-container d-flex align-items-center gap-8 px-2", {
+      "drag-focus": focused,
+      "py-4": !node.section
+    }),
+    arrow: clsx({
+      "py-4": !node.section,
+      "py-8": node.section,
+      invisible: !Array.isArray(node.children) || node.children.length === 0
+    }),
+    button: clsx("flex-fill d-flex align-items-center text-truncate gap-8", {
+      "py-8": node.section
+    })
+  }, iconSize = node.section ? 16 : 12, {
+    t
+  } = useTranslation(), {
+    setNodeRef
+  } = useDroppable({
+    id: useId(),
+    data: {
+      id: node.id,
+      name: node.name,
+      isTreeview: !0,
+      accepts: ["folder", "resource"]
+    }
+  }), handleOnItemClick = (nodeId) => handleItemClick == null ? void 0 : handleItemClick(nodeId), handleOnToggleNode = (nodeId) => handleToggleNode == null ? void 0 : handleToggleNode(nodeId), handleOnCreateChildrenPage = (nodeId) => handleItemAction == null ? void 0 : handleItemAction(nodeId), handleItemKeyDown = (event) => {
+    (event.code === "Enter" || event.code === "Space") && (event.preventDefault(), event.stopPropagation(), handleItemClick == null || handleItemClick(node.id));
+  }, handleItemToggleKeyDown = (event) => {
+    (event.code === "Enter" || event.code === "Space") && (event.preventDefault(), event.stopPropagation(), handleToggleNode == null || handleToggleNode(node.id));
+  }, renderRafterIcon = (expanded2) => /* @__PURE__ */ jsx(expanded2 ? SvgIconRafterDown : SvgIconRafterRight, { title: t("foldUnfold"), width: iconSize, height: iconSize }), shouldRenderRafterIcon = () => {
+    var _a;
+    const hasNoSiblings = !((_a = siblingsNodes == null ? void 0 : siblingsNodes.current) != null && _a.has(node.id)), hasChildren = Array.isArray(node.children) && node.children.length > 0;
+    return sibling || hasNoSiblings && hasChildren;
+  };
+  return /* @__PURE__ */ jsx("li", { ref: setNodeRef, id: `treeitem-${node.id}`, role: "treeitem", "aria-selected": selected && selected, "aria-expanded": expanded && expanded, children: /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsxs("div", { className: treeItemClasses.action, children: [
+      /* @__PURE__ */ jsx("div", { className: treeItemClasses.arrow, tabIndex: 0, role: "button", onClick: () => handleOnToggleNode(node.id), onKeyDown: handleItemToggleKeyDown, "aria-label": t("foldUnfold"), children: shouldRenderRafterIcon() && renderRafterIcon(expanded) }),
+      /* @__PURE__ */ jsxs("div", { tabIndex: 0, role: "button", className: treeItemClasses.button, onClick: () => handleOnItemClick(node.id), onKeyDown: handleItemKeyDown, children: [
+        node.section && showIcon && /* @__PURE__ */ jsx(SvgIconFolder, { title: t("folder"), width: 20, height: 20 }),
+        /* @__PURE__ */ jsx("span", { className: "text-truncate", children: node.name })
+      ] }),
+      node.section && handleItemAction && /* @__PURE__ */ jsx("button", { className: "tree-btn mx-8", onClick: () => handleOnCreateChildrenPage(node.id), children: /* @__PURE__ */ jsx(SvgIconPlus, { height: 16, width: 16 }) })
+    ] }),
+    Array.isArray(node.children) && !!node.children.length && expanded && /* @__PURE__ */ jsx("ul", { role: "group", children: node.children.map((child) => /* @__PURE__ */ jsx(TreeNode, { node: child, selectedNodeId, expandedNodes, siblingsNodes, draggedNodeId, handleItemClick, handleToggleNode }, child.id)) })
+  ] }) }, node.id);
+};
+export {
+  TreeNode
+};

package/dist/components/TreeView/TreeView.d.ts

@@ -1,5 +1,5 @@
-import { TreeNode } from './TreeNode';
-export interface TreeViewHandlers {
+import { TreeData } from '../../types';
+export interface TreeViewHandlers_V1 {
     unselectAll: () => void;
     select: (nodeId: string) => void;
 }
@@ -7,15 +7,31 @@ export interface TreeViewProps {
     /**
      * TreeNode data
      */
-    data: TreeNode;
+    data: TreeData | TreeData[];
     /**
      * Node ID used for navigation folders
      */
-    selectedNodesIds?: string[];
+    selectedNodeId?: string;
+    /**
+     * Show Section Icon Folder
+     */
+    showIcon?: boolean;
+    /**
+     * Open all treeview nodes
+     */
+    allExpandedNodes?: boolean;
+    /**
+     * Pass draggeNode when you drag an element from another context (resource / folder)
+     */
+    draggedNode?: {
+        isOver: boolean;
+        overId: string | undefined;
+        isTreeview: boolean;
+    };
     /**
      * Callback function to provide selected item to parent component
      */
-    onTreeItemSelect?: (nodeId: string) => void;
+    onTreeItemClick?: (nodeId: string) => void;
     /**
      * Callback function to provide folded item to parent component
      */
@@ -25,16 +41,16 @@ export interface TreeViewProps {
      */
     onTreeItemUnfold?: (nodeId: string) => void;
     /**
-     * Callback function to provide focused item to parent component
-     */
-    onTreeItemFocus?: (nodeId: string) => void;
-    /**
-     * Callback function to provide blured item to parent component
+     * Callback function to secondary action
      */
-    onTreeItemBlur?: (nodeId: string) => void;
+    onTreeItemAction?: (nodeId: string) => void;
 }
+/**
+ * @deprecated This component is deprecated and will be removed in future versions.
+ * Please use the Tree component instead.
+ */
 /**
  * UI TreeView Component
  */
-declare const TreeView: import('react').ForwardRefExoticComponent<TreeViewProps & import('react').RefAttributes<TreeViewHandlers>>;
+declare const TreeView: import('react').ForwardRefExoticComponent<TreeViewProps & import('react').RefAttributes<TreeViewHandlers_V1>>;
 export default TreeView;

package/dist/components/TreeView/TreeView.js

@@ -0,0 +1,37 @@
+import { jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { TreeNode } from "./TreeNode.js";
+import { useTreeView } from "./hooks/useTreeView.js";
+const TreeView = /* @__PURE__ */ forwardRef((props, ref) => {
+  const {
+    data,
+    onTreeItemClick,
+    onTreeItemUnfold,
+    onTreeItemFold,
+    onTreeItemAction,
+    draggedNode,
+    showIcon = !0,
+    allExpandedNodes = !1,
+    selectedNodeId: externalSelectedNodeId
+  } = props, {
+    selectedNodeId,
+    expandedNodes,
+    siblingsNodes,
+    draggedNodeId,
+    handleItemClick,
+    handleFoldUnfold
+  } = useTreeView({
+    data,
+    ref,
+    externalSelectedNodeId,
+    draggedNode,
+    allExpandedNodes,
+    onTreeItemClick,
+    onTreeItemFold,
+    onTreeItemUnfold
+  });
+  return /* @__PURE__ */ jsx("div", { className: "treeview", children: /* @__PURE__ */ jsx("ul", { role: "tree", className: "m-0 p-0", children: Array.isArray(data) ? data.map((node) => /* @__PURE__ */ jsx(TreeNode, { node, showIcon, selectedNodeId, expandedNodes, siblingsNodes, draggedNodeId, handleItemClick, handleToggleNode: handleFoldUnfold, handleItemAction: onTreeItemAction }, node.id)) : /* @__PURE__ */ jsx(TreeNode, { node: data, selectedNodeId, expandedNodes, siblingsNodes, showIcon, draggedNodeId, handleItemClick, handleToggleNode: handleFoldUnfold }) }) });
+});
+export {
+  TreeView as default
+};

package/dist/components/TreeView/hooks/useTreeView.d.ts

@@ -0,0 +1,33 @@
+import { Ref } from 'react';
+import { TreeData } from '../../../types';
+import { TreeViewHandlers_V1 } from '../TreeView';
+export declare const useTreeView: ({ data, ref, externalSelectedNodeId, draggedNode, allExpandedNodes, onTreeItemUnfold, onTreeItemFold, onTreeItemClick, }: {
+    data: TreeData | TreeData[];
+    ref: Ref<TreeViewHandlers_V1>;
+    externalSelectedNodeId: string | undefined;
+    draggedNode?: {
+        isOver: boolean;
+        overId: string | undefined;
+        isTreeview: boolean;
+    };
+    allExpandedNodes?: boolean;
+    /**
+     * Callback function to provide unfolded item to parent component
+     */
+    onTreeItemUnfold?: (nodeId: string) => void;
+    /**
+     * Callback function to provide folded item to parent component
+     */
+    onTreeItemFold?: (nodeId: string) => void;
+    /**
+     * Callback function to provide selected item to parent component
+     */
+    onTreeItemClick?: (nodeId: string) => void;
+}) => {
+    selectedNodeId: string | undefined;
+    expandedNodes: Set<string>;
+    siblingsNodes: import('react').MutableRefObject<Set<string>>;
+    draggedNodeId: string | undefined;
+    handleItemClick: (nodeId: string) => void;
+    handleFoldUnfold: (nodeId: string) => void;
+};