@webiny/app-aco 5.43.2-beta.0 → 6.0.0-alpha.0

package/components/FolderTree/List/index.js

@@ -1,196 +1,3 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.List = void 0;
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _react = _interopRequireWildcard(require("react"));
-var _reactDndTreeview = require("@minoru/react-dnd-treeview");
-var _appAdmin = require("@webiny/app-admin");
-var _reactDnd = require("react-dnd");
-var _Node = require("../Node");
-var _NodePreview = require("../NodePreview");
-var _Placeholder = require("../Placeholder");
-var _utils = require("./utils");
-var _features = require("../../../features");
-var _constants = require("../../../constants");
-var _folder = require("../../../contexts/folder");
-var _config = require("../../../config");
-var _dialogs = require("../../../dialogs");
-var List = exports.List = function List(_ref) {
-  var folders = _ref.folders,
-    onFolderClick = _ref.onFolderClick,
-    focusedFolderId = _ref.focusedFolderId,
-    hiddenFolderIds = _ref.hiddenFolderIds,
-    enableActions = _ref.enableActions;
-  var _useUpdateFolder = (0, _features.useUpdateFolder)(),
-    updateFolder = _useUpdateFolder.updateFolder;
-  var _useGetFolderLevelPer = (0, _features.useGetFolderLevelPermission)("canManageStructure"),
-    canManageStructure = _useGetFolderLevelPer.getFolderLevelPermission;
-  var _useListFoldersByPare = (0, _features.useListFoldersByParentIds)(),
-    listFoldersByParentIds = _useListFoldersByPare.listFoldersByParentIds,
-    getIsFolderLoading = _useListFoldersByPare.getIsFolderLoading;
-  var _useSnackbar = (0, _appAdmin.useSnackbar)(),
-    showSnackbar = _useSnackbar.showSnackbar;
-  var _useState = (0, _react.useState)([]),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    treeData = _useState2[0],
-    setTreeData = _useState2[1];
-  var _useState3 = (0, _react.useState)(),
-    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-    initialOpenList = _useState4[0],
-    setInitialOpenList = _useState4[1];
-  var _useState5 = (0, _react.useState)([_constants.ROOT_FOLDER]),
-    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
-    openFolderIds = _useState6[0],
-    setOpenFolderIds = _useState6[1];
-  var _useConfirmMoveFolder = (0, _dialogs.useConfirmMoveFolderDialog)(),
-    showConfirmMoveFolderDialog = _useConfirmMoveFolder.showDialog;
-  var _useAcoConfig = (0, _config.useAcoConfig)(),
-    folderConfigs = _useAcoConfig.folder;
-  (0, _react.useEffect)(function () {
-    if (folders) {
-      setTreeData((0, _utils.createTreeData)(folders, focusedFolderId, hiddenFolderIds));
-    }
-  }, [folders, focusedFolderId, hiddenFolderIds]);
-  var memoCreateInitialOpenList = (0, _react.useCallback)(function (focusedFolderId) {
-    return (0, _utils.createInitialOpenList)(folders, openFolderIds, focusedFolderId);
-  }, [folders, openFolderIds]);
-  (0, _react.useEffect)(function () {
-    setInitialOpenList(memoCreateInitialOpenList(focusedFolderId));
-  }, [focusedFolderId]);
-  var onDrop = (0, _react.useCallback)(async function (newTree, options) {
-    // Function to execute the drop logic
-    var runDrop = function runDrop() {
-      return handleDrop(newTree, options);
-    };
-
-    // If drop confirmation is enabled, show dialog before proceeding
-    if (folderConfigs.dropConfirmation) {
-      var dragSourceId = options.dragSourceId,
-        dropTargetId = options.dropTargetId;
-      var folder = folders.find(function (f) {
-        return f.id === dragSourceId;
-      });
-      var targetFolder = folders.find(function (f) {
-        return f.id === dropTargetId;
-      });
-
-      // Abort if either folder is not found
-      if (!folder || !targetFolder) {
-        return;
-      }
-      showConfirmMoveFolderDialog({
-        folder: folder,
-        targetFolder: targetFolder,
-        onAccept: runDrop
-      });
-    } else {
-      // Otherwise, perform the drop immediately
-      await runDrop();
-    }
-  }, [folders, folderConfigs.dropConfirmation, showConfirmMoveFolderDialog]);
-  var handleDrop = async function handleDrop(newTree, _ref2) {
-    var dragSourceId = _ref2.dragSourceId,
-      dropTargetId = _ref2.dropTargetId;
-    // Store the current state of the tree before the drop action
-    var oldTree = (0, _toConsumableArray2.default)(treeData);
-    try {
-      var item = folders.find(function (folder) {
-        return folder.id === dragSourceId;
-      });
-      if (!item) {
-        throw new Error("Folder not found!");
-      }
-      setTreeData(newTree);
-      await updateFolder((0, _objectSpread2.default)((0, _objectSpread2.default)({}, item), {}, {
-        parentId: dropTargetId !== _constants.ROOT_FOLDER ? dropTargetId : null
-      }));
-    } catch (error) {
-      // If an error occurred, revert the tree back to its previous state
-      setTreeData(oldTree);
-      return showSnackbar(error.message);
-    }
-  };
-  var sort = (0, _react.useMemo)(function () {
-    return function (a, b) {
-      if (a.id === _constants.ROOT_FOLDER || b.id === _constants.ROOT_FOLDER) {
-        return 1;
-      }
-      return a.text.localeCompare(b.text, undefined, {
-        numeric: true
-      });
-    };
-  }, []);
-  var handleChangeOpen = async function handleChangeOpen(folderIds) {
-    setOpenFolderIds((0, _toConsumableArray2.default)(new Set([_constants.ROOT_FOLDER].concat((0, _toConsumableArray2.default)(folderIds)))));
-    var filteredFolderIds = folderIds.filter(function (item) {
-      return item !== _constants.ROOT_FOLDER && item !== "0";
-    });
-    await listFoldersByParentIds(filteredFolderIds);
-  };
-  var _canDrag = (0, _react.useCallback)(function (folderId) {
-    var isRootFolder = folderId === _constants.ROOT_FOLDER;
-    return !isRootFolder && canManageStructure(folderId);
-  }, [canManageStructure]);
-  var renderNode = (0, _react.useCallback)(function (node, _ref3) {
-    var depth = _ref3.depth,
-      isOpen = _ref3.isOpen,
-      onToggle = _ref3.onToggle;
-    var folder = folders.find(function (folder) {
-      return folder.id === node.id;
-    });
-    return /*#__PURE__*/_react.default.createElement(_folder.FolderProvider, {
-      folder: folder
-    }, /*#__PURE__*/_react.default.createElement(_Node.Node, {
-      node: node,
-      depth: depth,
-      isOpen: isOpen,
-      onToggle: onToggle,
-      isLoading: getIsFolderLoading(folder?.id),
-      enableActions: enableActions,
-      onClick: onFolderClick
-    }));
-  }, [folders, getIsFolderLoading, enableActions, onFolderClick]);
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_reactDnd.DndProvider, {
-    backend: _reactDndTreeview.MultiBackend,
-    options: (0, _reactDndTreeview.getBackendOptions)(),
-    context: window
-  }, /*#__PURE__*/_react.default.createElement(_reactDndTreeview.Tree, {
-    tree: treeData,
-    rootId: "0",
-    onDrop: onDrop,
-    onChangeOpen: function onChangeOpen(ids) {
-      return handleChangeOpen(ids);
-    },
-    sort: sort,
-    canDrag: function canDrag(item) {
-      return _canDrag(item.id);
-    },
-    render: renderNode,
-    dragPreviewRender: function dragPreviewRender(monitorProps) {
-      return /*#__PURE__*/_react.default.createElement(_NodePreview.NodePreview, {
-        monitorProps: monitorProps
-      });
-    },
-    classes: {
-      dropTarget: "dropTarget",
-      draggingSource: "draggingSource",
-      placeholder: "placeholderContainer"
-    },
-    initialOpen: initialOpenList,
-    placeholderRender: function placeholderRender(_, _ref4) {
-      var depth = _ref4.depth;
-      return /*#__PURE__*/_react.default.createElement(_Placeholder.Placeholder, {
-        depth: depth
-      });
-    }
-  })));
-};
+export * from "./List";
 
 //# sourceMappingURL=index.js.map

package/components/FolderTree/List/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_reactDndTreeview","_appAdmin","_reactDnd","_Node","_NodePreview","_Placeholder","_utils","_features","_constants","_folder","_config","_dialogs","List","exports","_ref","folders","onFolderClick","focusedFolderId","hiddenFolderIds","enableActions","_useUpdateFolder","useUpdateFolder","updateFolder","_useGetFolderLevelPer","useGetFolderLevelPermission","canManageStructure","getFolderLevelPermission","_useListFoldersByPare","useListFoldersByParentIds","listFoldersByParentIds","getIsFolderLoading","_useSnackbar","useSnackbar","showSnackbar","_useState","useState","_useState2","_slicedToArray2","default","treeData","setTreeData","_useState3","_useState4","initialOpenList","setInitialOpenList","_useState5","ROOT_FOLDER","_useState6","openFolderIds","setOpenFolderIds","_useConfirmMoveFolder","useConfirmMoveFolderDialog","showConfirmMoveFolderDialog","showDialog","_useAcoConfig","useAcoConfig","folderConfigs","folder","useEffect","createTreeData","memoCreateInitialOpenList","useCallback","createInitialOpenList","onDrop","newTree","options","runDrop","handleDrop","dropConfirmation","dragSourceId","dropTargetId","find","f","id","targetFolder","onAccept","_ref2","oldTree","_toConsumableArray2","item","Error","_objectSpread2","parentId","error","message","sort","useMemo","a","b","text","localeCompare","undefined","numeric","handleChangeOpen","folderIds","Set","concat","filteredFolderIds","filter","canDrag","folderId","isRootFolder","renderNode","node","_ref3","depth","isOpen","onToggle","createElement","FolderProvider","Node","isLoading","onClick","Fragment","DndProvider","backend","MultiBackend","getBackendOptions","context","window","Tree","tree","rootId","onChangeOpen","ids","render","dragPreviewRender","monitorProps","NodePreview","classes","dropTarget","draggingSource","placeholder","initialOpen","placeholderRender","_","_ref4","Placeholder"],"sources":["index.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport {\n    DropOptions,\n    getBackendOptions,\n    InitialOpen,\n    MultiBackend,\n    NodeModel,\n    Tree\n} from \"@minoru/react-dnd-treeview\";\nimport { useSnackbar } from \"@webiny/app-admin\";\nimport { DndProvider } from \"react-dnd\";\nimport { Node } from \"../Node\";\nimport { NodePreview } from \"../NodePreview\";\nimport { Placeholder } from \"../Placeholder\";\nimport { createInitialOpenList, createTreeData } from \"./utils\";\nimport {\n    useGetFolderLevelPermission,\n    useListFoldersByParentIds,\n    useUpdateFolder\n} from \"~/features\";\nimport { ROOT_FOLDER } from \"~/constants\";\nimport { DndFolderItemData, FolderItem } from \"~/types\";\nimport { FolderProvider } from \"~/contexts/folder\";\nimport { useAcoConfig } from \"~/config\";\nimport { useConfirmMoveFolderDialog } from \"~/dialogs\";\n\ninterface ListProps {\n    folders: FolderItem[];\n    focusedFolderId?: string;\n    hiddenFolderIds?: string[];\n    enableActions?: boolean;\n    onFolderClick: (data: FolderItem) => void;\n}\n\nexport const List = ({\n    folders,\n    onFolderClick,\n    focusedFolderId,\n    hiddenFolderIds,\n    enableActions\n}: ListProps) => {\n    const { updateFolder } = useUpdateFolder();\n    const { getFolderLevelPermission: canManageStructure } =\n        useGetFolderLevelPermission(\"canManageStructure\");\n    const { listFoldersByParentIds, getIsFolderLoading } = useListFoldersByParentIds();\n    const { showSnackbar } = useSnackbar();\n    const [treeData, setTreeData] = useState<NodeModel<DndFolderItemData>[]>([]);\n    const [initialOpenList, setInitialOpenList] = useState<undefined | InitialOpen>();\n    const [openFolderIds, setOpenFolderIds] = useState<string[]>([ROOT_FOLDER]);\n    const { showDialog: showConfirmMoveFolderDialog } = useConfirmMoveFolderDialog();\n    const { folder: folderConfigs } = useAcoConfig();\n\n    useEffect(() => {\n        if (folders) {\n            setTreeData(createTreeData(folders, focusedFolderId, hiddenFolderIds));\n        }\n    }, [folders, focusedFolderId, hiddenFolderIds]);\n\n    const memoCreateInitialOpenList = useCallback(\n        (focusedFolderId?: string) => {\n            return createInitialOpenList(folders, openFolderIds, focusedFolderId);\n        },\n        [folders, openFolderIds]\n    );\n\n    useEffect(() => {\n        setInitialOpenList(memoCreateInitialOpenList(focusedFolderId));\n    }, [focusedFolderId]);\n\n    const onDrop = useCallback(\n        async (newTree: NodeModel<DndFolderItemData>[], options: DropOptions) => {\n            // Function to execute the drop logic\n            const runDrop = () => handleDrop(newTree, options);\n\n            // If drop confirmation is enabled, show dialog before proceeding\n            if (folderConfigs.dropConfirmation) {\n                const { dragSourceId, dropTargetId } = options;\n                const folder = folders.find(f => f.id === dragSourceId);\n                const targetFolder = folders.find(f => f.id === dropTargetId);\n\n                // Abort if either folder is not found\n                if (!folder || !targetFolder) {\n                    return;\n                }\n\n                showConfirmMoveFolderDialog({\n                    folder,\n                    targetFolder,\n                    onAccept: runDrop\n                });\n            } else {\n                // Otherwise, perform the drop immediately\n                await runDrop();\n            }\n        },\n        [folders, folderConfigs.dropConfirmation, showConfirmMoveFolderDialog]\n    );\n\n    const handleDrop = async (\n        newTree: NodeModel<DndFolderItemData>[],\n        { dragSourceId, dropTargetId }: DropOptions\n    ) => {\n        // Store the current state of the tree before the drop action\n        const oldTree = [...treeData];\n        try {\n            const item = folders.find(folder => folder.id === dragSourceId);\n\n            if (!item) {\n                throw new Error(\"Folder not found!\");\n            }\n\n            setTreeData(newTree);\n\n            await updateFolder({\n                ...item,\n                parentId: dropTargetId !== ROOT_FOLDER ? (dropTargetId as string) : null\n            });\n        } catch (error) {\n            // If an error occurred, revert the tree back to its previous state\n            setTreeData(oldTree);\n            return showSnackbar(error.message);\n        }\n    };\n\n    const sort = useMemo(\n        () => (a: NodeModel<DndFolderItemData>, b: NodeModel<DndFolderItemData>) => {\n            if (a.id === ROOT_FOLDER || b.id === ROOT_FOLDER) {\n                return 1;\n            }\n            return a.text.localeCompare(b.text, undefined, { numeric: true });\n        },\n        []\n    );\n\n    const handleChangeOpen = async (folderIds: string[]) => {\n        setOpenFolderIds([...new Set([ROOT_FOLDER, ...folderIds])]);\n        const filteredFolderIds = folderIds.filter(item => item !== ROOT_FOLDER && item !== \"0\");\n        await listFoldersByParentIds(filteredFolderIds);\n    };\n\n    const canDrag = useCallback(\n        (folderId: string) => {\n            const isRootFolder = folderId === ROOT_FOLDER;\n            return !isRootFolder && canManageStructure(folderId);\n        },\n        [canManageStructure]\n    );\n\n    const renderNode = useCallback(\n        (node: NodeModel<DndFolderItemData>, { depth, isOpen, onToggle }: any) => {\n            const folder = folders.find(folder => folder.id === node.id);\n            return (\n                <FolderProvider folder={folder}>\n                    <Node\n                        node={node}\n                        depth={depth}\n                        isOpen={isOpen}\n                        onToggle={onToggle}\n                        isLoading={getIsFolderLoading(folder?.id)}\n                        enableActions={enableActions}\n                        onClick={onFolderClick}\n                    />\n                </FolderProvider>\n            );\n        },\n        [folders, getIsFolderLoading, enableActions, onFolderClick]\n    );\n\n    return (\n        <>\n            <DndProvider backend={MultiBackend} options={getBackendOptions()} context={window}>\n                <Tree\n                    tree={treeData}\n                    rootId={\"0\"}\n                    onDrop={onDrop}\n                    onChangeOpen={ids => handleChangeOpen(ids as string[])}\n                    sort={sort}\n                    canDrag={item => canDrag(item!.id as string)}\n                    render={renderNode}\n                    dragPreviewRender={monitorProps => <NodePreview monitorProps={monitorProps} />}\n                    classes={{\n                        dropTarget: \"dropTarget\",\n                        draggingSource: \"draggingSource\",\n                        placeholder: \"placeholderContainer\"\n                    }}\n                    initialOpen={initialOpenList}\n                    placeholderRender={(_, { depth }) => <Placeholder depth={depth} />}\n                />\n            </DndProvider>\n        </>\n    );\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":[],"sources":["index.tsx"],"sourcesContent":["export * from \"./List\";\n"],"mappings":"AAAA","ignoreList":[]}

package/components/FolderTree/List/utils.d.ts

@@ -1,5 +1,5 @@
-import { InitialOpen, NodeModel } from "@minoru/react-dnd-treeview";
-import { DndFolderItemData, FolderItem } from "../../../types";
+import { FolderItem } from "../../../types";
+import type { NodeDto } from "@webiny/admin-ui";
 /**
  * Transform an array of folders returned by folders cache into an array of elements for the tree component.
  *
@@ -8,7 +8,7 @@ import { DndFolderItemData, FolderItem } from "../../../types";
  * @param hiddenFolderIds list ids of the folder you don't want to show within the list.
  * @return array of elements to render the tree component.
  */
-export declare const createTreeData: (folders?: FolderItem[], focusedNodeId?: string, hiddenFolderIds?: string[]) => NodeModel<DndFolderItemData>[];
+export declare const createTreeData: (folders?: FolderItem[], focusedNodeId?: string, hiddenFolderIds?: string[]) => NodeDto<FolderItem>[];
 /**
  * Return an array of ids of open folders, based on the current focused folder id, its parent folders and the folders
  * opened by user interaction.
@@ -18,4 +18,4 @@ export declare const createTreeData: (folders?: FolderItem[], focusedNodeId?: st
  * @param focusedId id of the current folder selected/focused.
  * @return array of ids of open folders.
  */
-export declare const createInitialOpenList: (folders?: FolderItem[], openIds?: string[], focusedId?: string) => InitialOpen | undefined;
+export declare const createInitialOpenList: (folders?: FolderItem[], openIds?: string[], focusedId?: string) => string[];

package/components/FolderTree/List/utils.js

@@ -1,12 +1,4 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.createTreeData = exports.createInitialOpenList = void 0;
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-var _constants = require("../../../constants");
+import { ROOT_FOLDER } from "../../../constants";
 /**
  * Transform an array of folders returned by folders cache into an array of elements for the tree component.
  *
@@ -15,27 +7,22 @@ var _constants = require("../../../constants");
  * @param hiddenFolderIds list ids of the folder you don't want to show within the list.
  * @return array of elements to render the tree component.
  */
-var createTreeData = exports.createTreeData = function createTreeData() {
-  var folders = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
-  var focusedNodeId = arguments.length > 1 ? arguments[1] : undefined;
-  var hiddenFolderIds = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
-  return folders.map(function (item) {
-    var id = item.id,
-      parentId = item.parentId,
-      title = item.title;
+export const createTreeData = (folders = [], focusedNodeId, hiddenFolderIds = []) => {
+  return folders.map(item => {
+    const {
+      id,
+      parentId,
+      title
+    } = item;
     return {
-      id: id,
+      id,
       // toLowerCase() fixes a bug introduced by 5.36.0: accidentally we stored "ROOT" as parentId, instead of null
-      parent: parentId?.toLowerCase() || _constants.ROOT_FOLDER,
-      text: title,
+      parentId: parentId?.toLowerCase() || ROOT_FOLDER,
+      label: title,
       droppable: true,
-      data: {
-        isFocused: focusedNodeId === id
-      }
+      active: focusedNodeId === id
     };
-  }).filter(function (item) {
-    return !hiddenFolderIds.includes(item.id);
-  });
+  }).filter(item => !hiddenFolderIds.includes(item.id));
 };
 
 /**
@@ -47,40 +34,36 @@ var createTreeData = exports.createTreeData = function createTreeData() {
  * @param focusedId id of the current folder selected/focused.
  * @return array of ids of open folders.
  */
-var createInitialOpenList = exports.createInitialOpenList = function createInitialOpenList() {
-  var folders = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
-  var openIds = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
-  var focusedId = arguments.length > 2 ? arguments[2] : undefined;
-  // In case of no focused folder, return the current open folders
+export const createInitialOpenList = (folders = [], openIds = [], focusedId) => {
+  //  There is always a root folder, opened by default
   if (!focusedId) {
     return openIds;
   }
 
-  // Create a Map with folders, using folderId as key
-  var folderMap = new Map();
-  folders.forEach(function (folder) {
-    return folderMap.set(folder.id, folder);
-  });
+  // Create a map for quick folder lookup by id
+  const folderMap = new Map(folders.map(folder => [folder.id, folder]));
+  // Store the chain of folder ids from the focused folder up to the root
+  const result = [];
+  let currentId = focusedId;
 
-  // Recursive function that drill up the folderMap and includes the folderId above a given folder (identified by folderId)
-  var _findParents = function findParents(acc, folderId) {
-    var folder = folderMap.get(folderId);
-    if (!folder || !folder.parentId || acc.includes(folder.parentId)) {
-      return acc;
+  // Traverse up the folder tree, collecting parent ids
+  while (currentId) {
+    // Add the current folder id if not already in the result
+    if (!result.includes(currentId)) {
+      result.push(currentId);
     }
-    acc.push(folder.parentId);
-    return _findParents(acc, folder.parentId);
-  };
-
-  // In case there is not focused folder or has no parent, return the current open folders
-  var focusedFolder = folderMap.get(focusedId);
-  if (!focusedFolder || !focusedFolder.parentId) {
-    return openIds;
+    // Get the folder object for the current id
+    const folder = folderMap.get(currentId);
+    // Get the parent id of the current folder
+    const parentId = folder?.parentId;
+    // Stop if there is no parent or we've already added this parent
+    if (!parentId || result.includes(parentId)) {
+      break;
+    }
+    // Move up to the parent folder
+    currentId = parentId;
   }
-
-  // Remove duplicates and return
-  var result = _findParents([focusedId], focusedId);
-  return (0, _toConsumableArray2.default)(new Set([].concat((0, _toConsumableArray2.default)(result), (0, _toConsumableArray2.default)(openIds))));
+  return [...new Set([...result, ...openIds])];
 };
 
 //# sourceMappingURL=utils.js.map

package/components/FolderTree/List/utils.js.map

@@ -1 +1 @@
-{"version":3,"names":["_constants","require","createTreeData","exports","folders","arguments","length","undefined","focusedNodeId","hiddenFolderIds","map","item","id","parentId","title","parent","toLowerCase","ROOT_FOLDER","text","droppable","data","isFocused","filter","includes","createInitialOpenList","openIds","focusedId","folderMap","Map","forEach","folder","set","findParents","acc","folderId","get","push","focusedFolder","result","_toConsumableArray2","default","Set","concat"],"sources":["utils.ts"],"sourcesContent":["import { InitialOpen, NodeModel } from \"@minoru/react-dnd-treeview\";\nimport { DndFolderItemData, FolderItem } from \"~/types\";\nimport { ROOT_FOLDER } from \"~/constants\";\n\n/**\n * Transform an array of folders returned by folders cache into an array of elements for the tree component.\n *\n * @param folders list of folders returned by folders cache.\n * @param focusedNodeId id of the current folder selected/focused.\n * @param hiddenFolderIds list ids of the folder you don't want to show within the list.\n * @return array of elements to render the tree component.\n */\nexport const createTreeData = (\n    folders: FolderItem[] = [],\n    focusedNodeId?: string,\n    hiddenFolderIds: string[] = []\n): NodeModel<DndFolderItemData>[] => {\n    return folders\n        .map(item => {\n            const { id, parentId, title } = item;\n\n            return {\n                id,\n                // toLowerCase() fixes a bug introduced by 5.36.0: accidentally we stored \"ROOT\" as parentId, instead of null\n                parent: parentId?.toLowerCase() || ROOT_FOLDER,\n                text: title,\n                droppable: true,\n                data: {\n                    isFocused: focusedNodeId === id\n                }\n            };\n        })\n        .filter(item => !hiddenFolderIds.includes(item.id));\n};\n\n/**\n * Return an array of ids of open folders, based on the current focused folder id, its parent folders and the folders\n * opened by user interaction.\n *\n * @param folders list of folders returned by folders cache.\n * @param openIds list of open folders ids.\n * @param focusedId id of the current folder selected/focused.\n * @return array of ids of open folders.\n */\nexport const createInitialOpenList = (\n    folders: FolderItem[] = [],\n    openIds: string[] = [],\n    focusedId?: string\n): InitialOpen | undefined => {\n    // In case of no focused folder, return the current open folders\n    if (!focusedId) {\n        return openIds;\n    }\n\n    // Create a Map with folders, using folderId as key\n    const folderMap = new Map<string, FolderItem>();\n    folders.forEach(folder => folderMap.set(folder.id, folder));\n\n    // Recursive function that drill up the folderMap and includes the folderId above a given folder (identified by folderId)\n    const findParents = (acc: string[], folderId: string): string[] => {\n        const folder = folderMap.get(folderId);\n        if (!folder || !folder.parentId || acc.includes(folder.parentId)) {\n            return acc;\n        }\n\n        acc.push(folder.parentId);\n        return findParents(acc, folder.parentId);\n    };\n\n    // In case there is not focused folder or has no parent, return the current open folders\n    const focusedFolder = folderMap.get(focusedId);\n    if (!focusedFolder || !focusedFolder.parentId) {\n        return openIds;\n    }\n\n    // Remove duplicates and return\n    const result = findParents([focusedId], focusedId);\n    return [...new Set([...result, ...openIds])];\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["ROOT_FOLDER","createTreeData","folders","focusedNodeId","hiddenFolderIds","map","item","id","parentId","title","toLowerCase","label","droppable","active","filter","includes","createInitialOpenList","openIds","focusedId","folderMap","Map","folder","result","currentId","push","get","Set"],"sources":["utils.ts"],"sourcesContent":["import { FolderItem } from \"~/types\";\nimport { ROOT_FOLDER } from \"~/constants\";\nimport type { NodeDto } from \"@webiny/admin-ui\";\n\n/**\n * Transform an array of folders returned by folders cache into an array of elements for the tree component.\n *\n * @param folders list of folders returned by folders cache.\n * @param focusedNodeId id of the current folder selected/focused.\n * @param hiddenFolderIds list ids of the folder you don't want to show within the list.\n * @return array of elements to render the tree component.\n */\nexport const createTreeData = (\n    folders: FolderItem[] = [],\n    focusedNodeId?: string,\n    hiddenFolderIds: string[] = []\n): NodeDto<FolderItem>[] => {\n    return folders\n        .map(item => {\n            const { id, parentId, title } = item;\n\n            return {\n                id,\n                // toLowerCase() fixes a bug introduced by 5.36.0: accidentally we stored \"ROOT\" as parentId, instead of null\n                parentId: parentId?.toLowerCase() || ROOT_FOLDER,\n                label: title,\n                droppable: true,\n                active: focusedNodeId === id\n            };\n        })\n        .filter(item => !hiddenFolderIds.includes(item.id));\n};\n\n/**\n * Return an array of ids of open folders, based on the current focused folder id, its parent folders and the folders\n * opened by user interaction.\n *\n * @param folders list of folders returned by folders cache.\n * @param openIds list of open folders ids.\n * @param focusedId id of the current folder selected/focused.\n * @return array of ids of open folders.\n */\nexport const createInitialOpenList = (\n    folders: FolderItem[] = [],\n    openIds: string[] = [],\n    focusedId?: string\n): string[] => {\n    //  There is always a root folder, opened by default\n    if (!focusedId) {\n        return openIds;\n    }\n\n    // Create a map for quick folder lookup by id\n    const folderMap = new Map(folders.map(folder => [folder.id, folder]));\n    // Store the chain of folder ids from the focused folder up to the root\n    const result: string[] = [];\n\n    let currentId: string | undefined = focusedId;\n\n    // Traverse up the folder tree, collecting parent ids\n    while (currentId) {\n        // Add the current folder id if not already in the result\n        if (!result.includes(currentId)) {\n            result.push(currentId);\n        }\n        // Get the folder object for the current id\n        const folder = folderMap.get(currentId) as FolderItem | undefined;\n        // Get the parent id of the current folder\n        const parentId = folder?.parentId;\n        // Stop if there is no parent or we've already added this parent\n        if (!parentId || result.includes(parentId)) {\n            break;\n        }\n        // Move up to the parent folder\n        currentId = parentId;\n    }\n\n    return [...new Set([...result, ...openIds])];\n};\n"],"mappings":"AACA,SAASA,WAAW;AAGpB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,cAAc,GAAGA,CAC1BC,OAAqB,GAAG,EAAE,EAC1BC,aAAsB,EACtBC,eAAyB,GAAG,EAAE,KACN;EACxB,OAAOF,OAAO,CACTG,GAAG,CAACC,IAAI,IAAI;IACT,MAAM;MAAEC,EAAE;MAAEC,QAAQ;MAAEC;IAAM,CAAC,GAAGH,IAAI;IAEpC,OAAO;MACHC,EAAE;MACF;MACAC,QAAQ,EAAEA,QAAQ,EAAEE,WAAW,CAAC,CAAC,IAAIV,WAAW;MAChDW,KAAK,EAAEF,KAAK;MACZG,SAAS,EAAE,IAAI;MACfC,MAAM,EAAEV,aAAa,KAAKI;IAC9B,CAAC;EACL,CAAC,CAAC,CACDO,MAAM,CAACR,IAAI,IAAI,CAACF,eAAe,CAACW,QAAQ,CAACT,IAAI,CAACC,EAAE,CAAC,CAAC;AAC3D,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMS,qBAAqB,GAAGA,CACjCd,OAAqB,GAAG,EAAE,EAC1Be,OAAiB,GAAG,EAAE,EACtBC,SAAkB,KACP;EACX;EACA,IAAI,CAACA,SAAS,EAAE;IACZ,OAAOD,OAAO;EAClB;;EAEA;EACA,MAAME,SAAS,GAAG,IAAIC,GAAG,CAAClB,OAAO,CAACG,GAAG,CAACgB,MAAM,IAAI,CAACA,MAAM,CAACd,EAAE,EAAEc,MAAM,CAAC,CAAC,CAAC;EACrE;EACA,MAAMC,MAAgB,GAAG,EAAE;EAE3B,IAAIC,SAA6B,GAAGL,SAAS;;EAE7C;EACA,OAAOK,SAAS,EAAE;IACd;IACA,IAAI,CAACD,MAAM,CAACP,QAAQ,CAACQ,SAAS,CAAC,EAAE;MAC7BD,MAAM,CAACE,IAAI,CAACD,SAAS,CAAC;IAC1B;IACA;IACA,MAAMF,MAAM,GAAGF,SAAS,CAACM,GAAG,CAACF,SAAS,CAA2B;IACjE;IACA,MAAMf,QAAQ,GAAGa,MAAM,EAAEb,QAAQ;IACjC;IACA,IAAI,CAACA,QAAQ,IAAIc,MAAM,CAACP,QAAQ,CAACP,QAAQ,CAAC,EAAE;MACxC;IACJ;IACA;IACAe,SAAS,GAAGf,QAAQ;EACxB;EAEA,OAAO,CAAC,GAAG,IAAIkB,GAAG,CAAC,CAAC,GAAGJ,MAAM,EAAE,GAAGL,OAAO,CAAC,CAAC,CAAC;AAChD,CAAC","ignoreList":[]}

package/components/FolderTree/Loader/Loader.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+interface LoaderProps {
+    count?: number;
+}
+export declare const Loader: ({ count }: LoaderProps) => React.JSX.Element;
+export {};

package/components/FolderTree/Loader/Loader.js

@@ -0,0 +1,22 @@
+import React from "react";
+import { Skeleton } from "@webiny/admin-ui";
+export const Loader = ({
+  count = 4
+}) => {
+  const lines = Array.from({
+    length: count
+  });
+  return /*#__PURE__*/React.createElement("div", {
+    className: "wby-my-md wby-p-xs"
+  }, lines.map((_, index) => {
+    return /*#__PURE__*/React.createElement("div", {
+      key: `folder-skeleton-${index}`,
+      className: "wby-mb-xs wby-px-sm wby-py-xs-plus"
+    }, /*#__PURE__*/React.createElement(Skeleton, {
+      type: "text",
+      size: "md"
+    }));
+  }));
+};
+
+//# sourceMappingURL=Loader.js.map

package/components/FolderTree/Loader/Loader.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Skeleton","Loader","count","lines","Array","from","length","createElement","className","map","_","index","key","type","size"],"sources":["Loader.tsx"],"sourcesContent":["import React from \"react\";\nimport { Skeleton } from \"@webiny/admin-ui\";\n\ninterface LoaderProps {\n    count?: number;\n}\n\nexport const Loader = ({ count = 4 }: LoaderProps) => {\n    const lines = Array.from({ length: count });\n\n    return (\n        <div className={\"wby-my-md wby-p-xs\"}>\n            {lines.map((_, index) => {\n                return (\n                    <div\n                        key={`folder-skeleton-${index}`}\n                        className={\"wby-mb-xs wby-px-sm wby-py-xs-plus\"}\n                    >\n                        <Skeleton type={\"text\"} size={\"md\"} />\n                    </div>\n                );\n            })}\n        </div>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,QAAQ,QAAQ,kBAAkB;AAM3C,OAAO,MAAMC,MAAM,GAAGA,CAAC;EAAEC,KAAK,GAAG;AAAe,CAAC,KAAK;EAClD,MAAMC,KAAK,GAAGC,KAAK,CAACC,IAAI,CAAC;IAAEC,MAAM,EAAEJ;EAAM,CAAC,CAAC;EAE3C,oBACIH,KAAA,CAAAQ,aAAA;IAAKC,SAAS,EAAE;EAAqB,GAChCL,KAAK,CAACM,GAAG,CAAC,CAACC,CAAC,EAAEC,KAAK,KAAK;IACrB,oBACIZ,KAAA,CAAAQ,aAAA;MACIK,GAAG,EAAE,mBAAmBD,KAAK,EAAG;MAChCH,SAAS,EAAE;IAAqC,gBAEhDT,KAAA,CAAAQ,aAAA,CAACP,QAAQ;MAACa,IAAI,EAAE,MAAO;MAACC,IAAI,EAAE;IAAK,CAAE,CACpC,CAAC;EAEd,CAAC,CACA,CAAC;AAEd,CAAC","ignoreList":[]}

package/components/FolderTree/Loader/index.d.ts

@@ -1,4 +1 @@
-import React from "react";
-export declare const Loader: ({ count }: {
-    count?: number | undefined;
-}) => React.JSX.Element;
+export * from "./Loader";

package/components/FolderTree/Loader/index.js

@@ -1,21 +1,3 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Loader = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _Skeleton = require("@webiny/ui/Skeleton");
-var _styled = require("./styled");
-var Loader = exports.Loader = function Loader(_ref) {
-  var count = _ref.count;
-  return /*#__PURE__*/_react.default.createElement(_styled.Container, null, /*#__PURE__*/_react.default.createElement(_Skeleton.Skeleton, {
-    count: count ?? 4,
-    inline: true,
-    height: "100%",
-    wrapper: _styled.SkeletonWrapper
-  }));
-};
+export * from "./Loader";
 
 //# sourceMappingURL=index.js.map

package/components/FolderTree/Loader/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_Skeleton","_styled","Loader","exports","_ref","count","default","createElement","Container","Skeleton","inline","height","wrapper","SkeletonWrapper"],"sources":["index.tsx"],"sourcesContent":["import React from \"react\";\nimport { Skeleton } from \"@webiny/ui/Skeleton\";\nimport { Container, SkeletonWrapper } from \"./styled\";\n\nexport const Loader = ({ count }: { count?: number }) => {\n    return (\n        <Container>\n            <Skeleton count={count ?? 4} inline={true} height={\"100%\"} wrapper={SkeletonWrapper} />\n        </Container>\n    );\n};\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,SAAA,GAAAD,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AAEO,IAAMG,MAAM,GAAAC,OAAA,CAAAD,MAAA,GAAG,SAATA,MAAMA,CAAAE,IAAA,EAAsC;EAAA,IAAhCC,KAAK,GAAAD,IAAA,CAALC,KAAK;EAC1B,oBACIR,MAAA,CAAAS,OAAA,CAAAC,aAAA,CAACN,OAAA,CAAAO,SAAS,qBACNX,MAAA,CAAAS,OAAA,CAAAC,aAAA,CAACP,SAAA,CAAAS,QAAQ;IAACJ,KAAK,EAAEA,KAAK,IAAI,CAAE;IAACK,MAAM,EAAE,IAAK;IAACC,MAAM,EAAE,MAAO;IAACC,OAAO,EAAEC;EAAgB,CAAE,CAC/E,CAAC;AAEpB,CAAC","ignoreList":[]}
+{"version":3,"names":[],"sources":["index.tsx"],"sourcesContent":["export * from \"./Loader\";\n"],"mappings":"AAAA","ignoreList":[]}

package/components/FolderTree/MenuActions/MenuActions.d.ts

@@ -0,0 +1,2 @@
+import React from "react";
+export declare const MenuActions: () => React.JSX.Element | null;

package/components/FolderTree/MenuActions/MenuActions.js

@@ -0,0 +1,32 @@
+import React from "react";
+import { OptionsMenu } from "@webiny/app-admin";
+import { cn, IconButton } from "@webiny/admin-ui";
+import { ReactComponent as MoreVerticalIcon } from "@webiny/icons/more_vert.svg";
+import { useAcoConfig } from "../../../config";
+import { useFolder } from "../../../hooks";
+export const MenuActions = () => {
+  const {
+    folder
+  } = useFolder();
+  const {
+    folder: folderConfig
+  } = useAcoConfig();
+
+  // If the user cannot manage folder structure, no need to show the menu.
+  if (!folder.canManageStructure) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement("div", {
+    className: cn("wby-invisible group-hover:wby-visible", "wby-size-md wby-cursor-pointer", "wby-absolute wby-top-1/2  wby-right-sm wby--translate-y-1/2")
+  }, /*#__PURE__*/React.createElement(OptionsMenu, {
+    trigger: /*#__PURE__*/React.createElement(IconButton, {
+      icon: /*#__PURE__*/React.createElement(MoreVerticalIcon, null),
+      size: "xs",
+      variant: "ghost"
+    }),
+    actions: folderConfig.actions,
+    "data-testid": "folder.tree.menu-action"
+  }));
+};
+
+//# sourceMappingURL=MenuActions.js.map

package/components/FolderTree/MenuActions/MenuActions.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","OptionsMenu","cn","IconButton","ReactComponent","MoreVerticalIcon","useAcoConfig","useFolder","MenuActions","folder","folderConfig","canManageStructure","createElement","className","trigger","icon","size","variant","actions"],"sources":["MenuActions.tsx"],"sourcesContent":["import React from \"react\";\nimport { OptionsMenu } from \"@webiny/app-admin\";\nimport { cn, IconButton } from \"@webiny/admin-ui\";\nimport { ReactComponent as MoreVerticalIcon } from \"@webiny/icons/more_vert.svg\";\nimport { useAcoConfig } from \"~/config\";\nimport { useFolder } from \"~/hooks\";\n\nexport const MenuActions = () => {\n    const { folder } = useFolder();\n    const { folder: folderConfig } = useAcoConfig();\n\n    // If the user cannot manage folder structure, no need to show the menu.\n    if (!folder.canManageStructure) {\n        return null;\n    }\n\n    return (\n        <div\n            className={cn(\n                \"wby-invisible group-hover:wby-visible\",\n                \"wby-size-md wby-cursor-pointer\",\n                \"wby-absolute wby-top-1/2  wby-right-sm wby--translate-y-1/2\"\n            )}\n        >\n            <OptionsMenu\n                trigger={<IconButton icon={<MoreVerticalIcon />} size={\"xs\"} variant={\"ghost\"} />}\n                actions={folderConfig.actions}\n                data-testid={\"folder.tree.menu-action\"}\n            />\n        </div>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,WAAW,QAAQ,mBAAmB;AAC/C,SAASC,EAAE,EAAEC,UAAU,QAAQ,kBAAkB;AACjD,SAASC,cAAc,IAAIC,gBAAgB,QAAQ,6BAA6B;AAChF,SAASC,YAAY;AACrB,SAASC,SAAS;AAElB,OAAO,MAAMC,WAAW,GAAGA,CAAA,KAAM;EAC7B,MAAM;IAAEC;EAAO,CAAC,GAAGF,SAAS,CAAC,CAAC;EAC9B,MAAM;IAAEE,MAAM,EAAEC;EAAa,CAAC,GAAGJ,YAAY,CAAC,CAAC;;EAE/C;EACA,IAAI,CAACG,MAAM,CAACE,kBAAkB,EAAE;IAC5B,OAAO,IAAI;EACf;EAEA,oBACIX,KAAA,CAAAY,aAAA;IACIC,SAAS,EAAEX,EAAE,CACT,uCAAuC,EACvC,gCAAgC,EAChC,6DACJ;EAAE,gBAEFF,KAAA,CAAAY,aAAA,CAACX,WAAW;IACRa,OAAO,eAAEd,KAAA,CAAAY,aAAA,CAACT,UAAU;MAACY,IAAI,eAAEf,KAAA,CAAAY,aAAA,CAACP,gBAAgB,MAAE,CAAE;MAACW,IAAI,EAAE,IAAK;MAACC,OAAO,EAAE;IAAQ,CAAE,CAAE;IAClFC,OAAO,EAAER,YAAY,CAACQ,OAAQ;IAC9B,eAAa;EAA0B,CAC1C,CACA,CAAC;AAEd,CAAC","ignoreList":[]}

package/components/FolderTree/MenuActions/index.d.ts

@@ -1,2 +1 @@
-import React from "react";
-export declare const MenuActions: () => React.JSX.Element | null;
+export * from "./MenuActions";

package/components/FolderTree/MenuActions/index.js

@@ -1,31 +1,3 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.MenuActions = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _appAdmin = require("@webiny/app-admin");
-var _config = require("../../../config");
-var _hooks = require("../../../hooks");
-var _styled = require("./styled");
-var MenuActions = exports.MenuActions = function MenuActions() {
-  var _useFolder = (0, _hooks.useFolder)(),
-    folder = _useFolder.folder;
-  var _useAcoConfig = (0, _config.useAcoConfig)(),
-    folderConfig = _useAcoConfig.folder;
-
-  // If the user cannot manage folder structure, no need to show the menu.
-  if (!folder.canManageStructure) {
-    return null;
-  }
-  return /*#__PURE__*/_react.default.createElement(_styled.Container, {
-    className: "folder-tree-menu-action"
-  }, /*#__PURE__*/_react.default.createElement(_appAdmin.OptionsMenu, {
-    actions: folderConfig.actions,
-    "data-testid": "folder.tree.menu-action"
-  }));
-};
+export * from "./MenuActions";
 
 //# sourceMappingURL=index.js.map

package/components/FolderTree/MenuActions/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_appAdmin","_config","_hooks","_styled","MenuActions","exports","_useFolder","useFolder","folder","_useAcoConfig","useAcoConfig","folderConfig","canManageStructure","default","createElement","Container","className","OptionsMenu","actions"],"sources":["index.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { OptionsMenu } from \"@webiny/app-admin\";\nimport { useAcoConfig } from \"~/config\";\nimport { useFolder } from \"~/hooks\";\n\nimport { Container } from \"./styled\";\n\nexport const MenuActions = () => {\n    const { folder } = useFolder();\n    const { folder: folderConfig } = useAcoConfig();\n\n    // If the user cannot manage folder structure, no need to show the menu.\n    if (!folder.canManageStructure) {\n        return null;\n    }\n\n    return (\n        <Container className={\"folder-tree-menu-action\"}>\n            <OptionsMenu actions={folderConfig.actions} data-testid={\"folder.tree.menu-action\"} />\n        </Container>\n    );\n};\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,SAAA,GAAAD,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AAEA,IAAAI,OAAA,GAAAJ,OAAA;AAEO,IAAMK,WAAW,GAAAC,OAAA,CAAAD,WAAA,GAAG,SAAdA,WAAWA,CAAA,EAAS;EAC7B,IAAAE,UAAA,GAAmB,IAAAC,gBAAS,EAAC,CAAC;IAAtBC,MAAM,GAAAF,UAAA,CAANE,MAAM;EACd,IAAAC,aAAA,GAAiC,IAAAC,oBAAY,EAAC,CAAC;IAA/BC,YAAY,GAAAF,aAAA,CAApBD,MAAM;;EAEd;EACA,IAAI,CAACA,MAAM,CAACI,kBAAkB,EAAE;IAC5B,OAAO,IAAI;EACf;EAEA,oBACIf,MAAA,CAAAgB,OAAA,CAAAC,aAAA,CAACX,OAAA,CAAAY,SAAS;IAACC,SAAS,EAAE;EAA0B,gBAC5CnB,MAAA,CAAAgB,OAAA,CAAAC,aAAA,CAACd,SAAA,CAAAiB,WAAW;IAACC,OAAO,EAAEP,YAAY,CAACO,OAAQ;IAAC,eAAa;EAA0B,CAAE,CAC9E,CAAC;AAEpB,CAAC","ignoreList":[]}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./MenuActions\";\n"],"mappings":"AAAA","ignoreList":[]}

package/components/FolderTree/Node/Node.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+interface FolderProps {
+    text: string;
+    isRoot: boolean;
+    hasNonInheritedPermissions?: boolean;
+    canManagePermissions?: boolean;
+}
+export declare const FolderNode: ({ isRoot, hasNonInheritedPermissions, canManagePermissions, text }: FolderProps) => React.JSX.Element;
+type NodeProps = {
+    enableActions?: boolean;
+};
+export declare const Node: ({ enableActions }: NodeProps) => React.JSX.Element;
+export {};