@webiny/app-aco 5.43.0-beta.0 → 5.43.0-beta.2

package/components/FolderTree/List/index.js

@@ -30,6 +30,9 @@ var List = exports.List = function List(_ref) {
     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)([]),
@@ -48,12 +51,12 @@ var List = exports.List = function List(_ref) {
     if (folders) {
       setTreeData((0, _utils.createTreeData)(folders, focusedFolderId, hiddenFolderIds));
     }
-  }, [folders, focusedFolderId]);
+  }, [folders, focusedFolderId, hiddenFolderIds]);
+  var memoCreateInitialOpenList = (0, _react.useCallback)(function (focusedFolderId) {
+    return (0, _utils.createInitialOpenList)(folders, openFolderIds, focusedFolderId);
+  }, [folders, openFolderIds]);
   (0, _react.useEffect)(function () {
-    if (!folders) {
-      return;
-    }
-    setInitialOpenList((0, _utils.createInitialOpenList)(folders, openFolderIds, focusedFolderId));
+    setInitialOpenList(memoCreateInitialOpenList(focusedFolderId));
   }, [focusedFolderId]);
   var handleDrop = async function handleDrop(newTree, _ref2) {
     var dragSourceId = _ref2.dragSourceId,
@@ -87,13 +90,36 @@ var List = exports.List = function List(_ref) {
       });
     };
   }, []);
-  var handleChangeOpen = function handleChangeOpen(folderIds) {
-    setOpenFolderIds([_constants.ROOT_FOLDER].concat((0, _toConsumableArray2.default)(folderIds)));
+  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)(),
@@ -109,26 +135,7 @@ var List = exports.List = function List(_ref) {
     canDrag: function canDrag(item) {
       return _canDrag(item.id);
     },
-    render: function render(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,
-        enableActions: enableActions,
-        onToggle: onToggle,
-        onClick: function onClick(data) {
-          return onFolderClick(data);
-        }
-      }));
-    },
+    render: renderNode,
     dragPreviewRender: function dragPreviewRender(monitorProps) {
       return /*#__PURE__*/_react.default.createElement(_NodePreview.NodePreview, {
         monitorProps: monitorProps

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","List","exports","_ref","folders","onFolderClick","focusedFolderId","hiddenFolderIds","enableActions","_useUpdateFolder","useUpdateFolder","updateFolder","_useGetFolderLevelPer","useGetFolderLevelPermission","canManageStructure","getFolderLevelPermission","_useSnackbar","useSnackbar","showSnackbar","_useState","useState","_useState2","_slicedToArray2","default","treeData","setTreeData","_useState3","_useState4","initialOpenList","setInitialOpenList","_useState5","ROOT_FOLDER","_useState6","openFolderIds","setOpenFolderIds","useEffect","createTreeData","createInitialOpenList","handleDrop","newTree","_ref2","dragSourceId","dropTargetId","oldTree","_toConsumableArray2","item","find","folder","id","Error","_objectSpread2","parentId","error","message","sort","useMemo","a","b","text","localeCompare","undefined","numeric","handleChangeOpen","folderIds","concat","canDrag","useCallback","folderId","isRootFolder","createElement","Fragment","DndProvider","backend","MultiBackend","options","getBackendOptions","context","window","Tree","tree","rootId","onDrop","onChangeOpen","ids","render","node","_ref3","depth","isOpen","onToggle","FolderProvider","Node","onClick","data","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 { useGetFolderLevelPermission, useUpdateFolder } from \"~/features\";\nimport { ROOT_FOLDER } from \"~/constants\";\nimport { DndFolderItemData, FolderItem } from \"~/types\";\nimport { FolderProvider } from \"~/contexts/folder\";\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 { 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\n    useEffect(() => {\n        if (folders) {\n            setTreeData(createTreeData(folders, focusedFolderId, hiddenFolderIds));\n        }\n    }, [folders, focusedFolderId]);\n\n    useEffect(() => {\n        if (!folders) {\n            return;\n        }\n        setInitialOpenList(createInitialOpenList(folders, openFolderIds, focusedFolderId));\n    }, [focusedFolderId]);\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 = (folderIds: string[]) => {\n        setOpenFolderIds([ROOT_FOLDER, ...folderIds]);\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    return (\n        <>\n            <DndProvider backend={MultiBackend} options={getBackendOptions()} context={window}>\n                <Tree\n                    tree={treeData}\n                    rootId={\"0\"}\n                    onDrop={handleDrop}\n                    onChangeOpen={ids => handleChangeOpen(ids as string[])}\n                    sort={sort}\n                    canDrag={item => canDrag(item!.id as string)}\n                    render={(node, { depth, isOpen, onToggle }) => {\n                        const folder = folders.find(folder => folder.id === node.id);\n\n                        return (\n                            <FolderProvider folder={folder}>\n                                <Node\n                                    node={node}\n                                    depth={depth}\n                                    isOpen={isOpen}\n                                    enableActions={enableActions}\n                                    onToggle={onToggle}\n                                    onClick={data => onFolderClick(data)}\n                                />\n                            </FolderProvider>\n                        );\n                    }}\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":["_react","_interopRequireWildcard","require","_reactDndTreeview","_appAdmin","_reactDnd","_Node","_NodePreview","_Placeholder","_utils","_features","_constants","_folder","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","useEffect","createTreeData","memoCreateInitialOpenList","useCallback","createInitialOpenList","handleDrop","newTree","_ref2","dragSourceId","dropTargetId","oldTree","_toConsumableArray2","item","find","folder","id","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","options","getBackendOptions","context","window","Tree","tree","rootId","onDrop","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\";\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\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 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={handleDrop}\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":[]}

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

@@ -5,6 +5,7 @@ type NodeProps = {
     node: NodeModel<DndFolderItemData>;
     depth: number;
     isOpen: boolean;
+    isLoading?: boolean;
     enableActions?: boolean;
     onToggle: (id: string | number) => void;
     onClick: (data: FolderItem) => void;
@@ -14,9 +15,10 @@ type FolderProps = {
     isRoot: boolean;
     isOpen: boolean;
     isFocused?: boolean;
+    isLoading?: boolean;
     hasNonInheritedPermissions?: boolean;
     canManagePermissions?: boolean;
 };
 export declare const FolderNode: ({ isRoot, isFocused, hasNonInheritedPermissions, canManagePermissions, text }: FolderProps) => React.JSX.Element;
-export declare const Node: ({ node, depth, isOpen, enableActions, onToggle, onClick }: NodeProps) => React.JSX.Element;
+export declare const Node: ({ node, depth, isOpen, enableActions, onToggle, onClick, isLoading }: NodeProps) => React.JSX.Element;
 export {};

package/components/FolderTree/Node/index.js

@@ -16,6 +16,7 @@ var _styled = require("./styled");
 var _utils = require("@webiny/utils");
 var _constants = require("../../../constants");
 var _hooks = require("../../../hooks");
+var _Progress = require("@webiny/ui/Progress");
 var FolderNode = exports.FolderNode = function FolderNode(_ref) {
   var isRoot = _ref.isRoot,
     isFocused = _ref.isFocused,
@@ -35,48 +36,76 @@ var FolderNode = exports.FolderNode = function FolderNode(_ref) {
     use: "body2"
   }, text));
 };
-var Node = exports.Node = function Node(_ref2) {
-  var node = _ref2.node,
-    depth = _ref2.depth,
+var FolderIndicator = function FolderIndicator(_ref2) {
+  var isLoading = _ref2.isLoading,
     isOpen = _ref2.isOpen,
-    enableActions = _ref2.enableActions,
-    onToggle = _ref2.onToggle,
-    onClick = _ref2.onClick;
+    onToggle = _ref2.onToggle;
   var _useFolder = (0, _hooks.useFolder)(),
     folder = _useFolder.folder;
   var isRoot = folder.id === _constants.ROOT_FOLDER;
-  // Move the placeholder line to the left based on the element depth within the tree.
-  // Let's add some pixels so that the element is detached from the container but takes up the whole length while it's highlighted during dnd.
-  var indent = depth === 1 ? 4 : (depth - 1) * 20 + 8;
-  var dragOverProps = (0, _reactDndTreeview.useDragOver)(folder.id, isOpen, onToggle);
   var handleToggle = function handleToggle(e) {
     e.stopPropagation();
     onToggle(folder.id);
   };
+  if (isRoot) {
+    return null;
+  }
+  if (isLoading) {
+    return /*#__PURE__*/_react.default.createElement(_styled.LoaderContainer, null, /*#__PURE__*/_react.default.createElement(_Progress.CircularProgress, {
+      size: 12,
+      spinnerWidth: 2,
+      spinnerColor: "#d9d9d9",
+      style: {
+        background: "transparent"
+      }
+    }));
+  }
+  return /*#__PURE__*/_react.default.createElement(_styled.ArrowIcon, {
+    isOpen: isOpen,
+    onClick: handleToggle
+  }, /*#__PURE__*/_react.default.createElement(_arrow_right.ReactComponent, null));
+};
+var Node = exports.Node = function Node(_ref3) {
+  var node = _ref3.node,
+    depth = _ref3.depth,
+    isOpen = _ref3.isOpen,
+    enableActions = _ref3.enableActions,
+    onToggle = _ref3.onToggle,
+    onClick = _ref3.onClick,
+    isLoading = _ref3.isLoading;
+  var _useFolder2 = (0, _hooks.useFolder)(),
+    folder = _useFolder2.folder;
+  var isRoot = folder.id === _constants.ROOT_FOLDER;
+  // Move the placeholder line to the left based on the element depth within the tree.
+  // Let's add some pixels so that the element is detached from the container but takes up the whole length while it's highlighted during dnd.
+  var indent = depth === 1 ? 4 : (depth - 1) * 20 + 8;
+  var dragOverProps = (0, _reactDndTreeview.useDragOver)(folder.id, isOpen, onToggle);
   var handleClick = function handleClick(e) {
     e.stopPropagation();
-    onClick(folder);
     if (folder.id !== _constants.ROOT_FOLDER) {
       onToggle(folder.id);
     }
+    onClick(folder);
   };
   var id = (0, _react.useMemo)(function () {
     var _parseIdentifier = (0, _utils.parseIdentifier)(String(folder.id)),
       id = _parseIdentifier.id;
     return id;
   }, [folder.id]);
-  var _ref3 = folder || {},
-    hasNonInheritedPermissions = _ref3.hasNonInheritedPermissions,
-    canManagePermissions = _ref3.canManagePermissions;
+  var _ref4 = folder || {},
+    hasNonInheritedPermissions = _ref4.hasNonInheritedPermissions,
+    canManagePermissions = _ref4.canManagePermissions;
   return /*#__PURE__*/_react.default.createElement(_styled.Container, Object.assign({
     isFocused: !!node.data?.isFocused,
+    isLoading: isLoading,
     style: {
       paddingInlineStart: indent
     }
-  }, dragOverProps), isRoot ? null : /*#__PURE__*/_react.default.createElement(_styled.ArrowIcon, {
+  }, dragOverProps), /*#__PURE__*/_react.default.createElement(FolderIndicator, {
+    isLoading: isLoading,
     isOpen: isOpen,
-    onClick: handleToggle
-  }, /*#__PURE__*/_react.default.createElement(_arrow_right.ReactComponent, null)), /*#__PURE__*/_react.default.createElement(_styled.Content, {
+    onToggle: onToggle
+  }), /*#__PURE__*/_react.default.createElement(_styled.Content, {
     onClick: handleClick,
     className: "aco-folder-".concat(id)
   }, /*#__PURE__*/_react.default.createElement(FolderNode, {

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

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_arrow_right","_folderFill","_folder_sharedFill","_home","_reactDndTreeview","_MenuActions","_styled","_utils","_constants","_hooks","FolderNode","exports","_ref","isRoot","isFocused","hasNonInheritedPermissions","canManagePermissions","text","icon","default","createElement","ReactComponent","Fragment","FolderIcon","Text","className","use","Node","_ref2","node","depth","isOpen","enableActions","onToggle","onClick","_useFolder","useFolder","folder","id","ROOT_FOLDER","indent","dragOverProps","useDragOver","handleToggle","e","stopPropagation","handleClick","useMemo","_parseIdentifier","parseIdentifier","String","_ref3","Container","Object","assign","data","style","paddingInlineStart","ArrowIcon","Content","concat","MenuActions"],"sources":["index.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { ReactComponent as ArrowRight } from \"@material-symbols/svg-400/rounded/arrow_right.svg\";\nimport { ReactComponent as Folder } from \"@material-symbols/svg-400/rounded/folder-fill.svg\";\nimport { ReactComponent as FolderShared } from \"@material-symbols/svg-400/rounded/folder_shared-fill.svg\";\nimport { ReactComponent as HomeIcon } from \"@material-design-icons/svg/filled/home.svg\";\nimport { NodeModel, useDragOver } from \"@minoru/react-dnd-treeview\";\nimport { MenuActions } from \"../MenuActions\";\nimport { Container, ArrowIcon, FolderIcon, Text, Content } from \"./styled\";\nimport { DndFolderItemData, FolderItem } from \"~/types\";\nimport { parseIdentifier } from \"@webiny/utils\";\nimport { ROOT_FOLDER } from \"~/constants\";\nimport { useFolder } from \"~/hooks\";\n\ntype NodeProps = {\n    node: NodeModel<DndFolderItemData>;\n    depth: number;\n    isOpen: boolean;\n    enableActions?: boolean;\n    onToggle: (id: string | number) => void;\n    onClick: (data: FolderItem) => void;\n};\n\ntype FolderProps = {\n    text: string;\n    isRoot: boolean;\n    isOpen: boolean;\n    isFocused?: boolean;\n    hasNonInheritedPermissions?: boolean;\n    canManagePermissions?: boolean;\n};\n\nexport const FolderNode = ({\n    isRoot,\n    isFocused,\n    hasNonInheritedPermissions,\n    canManagePermissions,\n    text\n}: FolderProps) => {\n    let icon = <HomeIcon />;\n\n    if (!isRoot) {\n        if (hasNonInheritedPermissions && canManagePermissions) {\n            icon = <FolderShared />;\n        } else {\n            icon = <Folder />;\n        }\n    }\n\n    return (\n        <>\n            <FolderIcon>{icon}</FolderIcon>\n            <Text className={isFocused ? \"focused\" : \"\"} use={\"body2\"}>\n                {text}\n            </Text>\n        </>\n    );\n};\n\nexport const Node = ({ node, depth, isOpen, enableActions, onToggle, onClick }: NodeProps) => {\n    const { folder } = useFolder();\n    const isRoot = folder.id === ROOT_FOLDER;\n    // Move the placeholder line to the left based on the element depth within the tree.\n    // Let's add some pixels so that the element is detached from the container but takes up the whole length while it's highlighted during dnd.\n    const indent = depth === 1 ? 4 : (depth - 1) * 20 + 8;\n\n    const dragOverProps = useDragOver(folder.id, isOpen, onToggle);\n\n    const handleToggle = (e: React.MouseEvent) => {\n        e.stopPropagation();\n        onToggle(folder.id);\n    };\n\n    const handleClick = (e: React.MouseEvent) => {\n        e.stopPropagation();\n        onClick(folder);\n        if (folder.id !== ROOT_FOLDER) {\n            onToggle(folder.id);\n        }\n    };\n\n    const id = useMemo(() => {\n        const { id } = parseIdentifier(String(folder.id));\n        return id;\n    }, [folder.id]);\n\n    const { hasNonInheritedPermissions, canManagePermissions } = folder || {};\n\n    return (\n        <Container\n            isFocused={!!node.data?.isFocused}\n            style={{ paddingInlineStart: indent }}\n            {...dragOverProps}\n        >\n            {isRoot ? null : (\n                <ArrowIcon isOpen={isOpen} onClick={handleToggle}>\n                    <ArrowRight />\n                </ArrowIcon>\n            )}\n            <Content onClick={handleClick} className={`aco-folder-${id}`}>\n                <FolderNode\n                    isRoot={isRoot}\n                    text={node.text}\n                    hasNonInheritedPermissions={hasNonInheritedPermissions}\n                    canManagePermissions={canManagePermissions}\n                    isOpen={isRoot ? true : isOpen}\n                    isFocused={!!node.data?.isFocused}\n                />\n            </Content>\n            {enableActions && !isRoot && <MenuActions />}\n        </Container>\n    );\n};\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,WAAA,GAAAF,OAAA;AACA,IAAAG,kBAAA,GAAAH,OAAA;AACA,IAAAI,KAAA,GAAAJ,OAAA;AACA,IAAAK,iBAAA,GAAAL,OAAA;AACA,IAAAM,YAAA,GAAAN,OAAA;AACA,IAAAO,OAAA,GAAAP,OAAA;AAEA,IAAAQ,MAAA,GAAAR,OAAA;AACA,IAAAS,UAAA,GAAAT,OAAA;AACA,IAAAU,MAAA,GAAAV,OAAA;AAoBO,IAAMW,UAAU,GAAAC,OAAA,CAAAD,UAAA,GAAG,SAAbA,UAAUA,CAAAE,IAAA,EAMJ;EAAA,IALfC,MAAM,GAAAD,IAAA,CAANC,MAAM;IACNC,SAAS,GAAAF,IAAA,CAATE,SAAS;IACTC,0BAA0B,GAAAH,IAAA,CAA1BG,0BAA0B;IAC1BC,oBAAoB,GAAAJ,IAAA,CAApBI,oBAAoB;IACpBC,IAAI,GAAAL,IAAA,CAAJK,IAAI;EAEJ,IAAIC,IAAI,gBAAGrB,MAAA,CAAAsB,OAAA,CAAAC,aAAA,CAACjB,KAAA,CAAAkB,cAAQ,MAAE,CAAC;EAEvB,IAAI,CAACR,MAAM,EAAE;IACT,IAAIE,0BAA0B,IAAIC,oBAAoB,EAAE;MACpDE,IAAI,gBAAGrB,MAAA,CAAAsB,OAAA,CAAAC,aAAA,CAAClB,kBAAA,CAAAmB,cAAY,MAAE,CAAC;IAC3B,CAAC,MAAM;MACHH,IAAI,gBAAGrB,MAAA,CAAAsB,OAAA,CAAAC,aAAA,CAACnB,WAAA,CAAAoB,cAAM,MAAE,CAAC;IACrB;EACJ;EAEA,oBACIxB,MAAA,CAAAsB,OAAA,CAAAC,aAAA,CAAAvB,MAAA,CAAAsB,OAAA,CAAAG,QAAA,qBACIzB,MAAA,CAAAsB,OAAA,CAAAC,aAAA,CAACd,OAAA,CAAAiB,UAAU,QAAEL,IAAiB,CAAC,eAC/BrB,MAAA,CAAAsB,OAAA,CAAAC,aAAA,CAACd,OAAA,CAAAkB,IAAI;IAACC,SAAS,EAAEX,SAAS,GAAG,SAAS,GAAG,EAAG;IAACY,GAAG,EAAE;EAAQ,GACrDT,IACC,CACR,CAAC;AAEX,CAAC;AAEM,IAAMU,IAAI,GAAAhB,OAAA,CAAAgB,IAAA,GAAG,SAAPA,IAAIA,CAAAC,KAAA,EAA6E;EAAA,IAAvEC,IAAI,GAAAD,KAAA,CAAJC,IAAI;IAAEC,KAAK,GAAAF,KAAA,CAALE,KAAK;IAAEC,MAAM,GAAAH,KAAA,CAANG,MAAM;IAAEC,aAAa,GAAAJ,KAAA,CAAbI,aAAa;IAAEC,QAAQ,GAAAL,KAAA,CAARK,QAAQ;IAAEC,OAAO,GAAAN,KAAA,CAAPM,OAAO;EACxE,IAAAC,UAAA,GAAmB,IAAAC,gBAAS,EAAC,CAAC;IAAtBC,MAAM,GAAAF,UAAA,CAANE,MAAM;EACd,IAAMxB,MAAM,GAAGwB,MAAM,CAACC,EAAE,KAAKC,sBAAW;EACxC;EACA;EACA,IAAMC,MAAM,GAAGV,KAAK,KAAK,CAAC,GAAG,CAAC,GAAG,CAACA,KAAK,GAAG,CAAC,IAAI,EAAE,GAAG,CAAC;EAErD,IAAMW,aAAa,GAAG,IAAAC,6BAAW,EAACL,MAAM,CAACC,EAAE,EAAEP,MAAM,EAAEE,QAAQ,CAAC;EAE9D,IAAMU,YAAY,GAAG,SAAfA,YAAYA,CAAIC,CAAmB,EAAK;IAC1CA,CAAC,CAACC,eAAe,CAAC,CAAC;IACnBZ,QAAQ,CAACI,MAAM,CAACC,EAAE,CAAC;EACvB,CAAC;EAED,IAAMQ,WAAW,GAAG,SAAdA,WAAWA,CAAIF,CAAmB,EAAK;IACzCA,CAAC,CAACC,eAAe,CAAC,CAAC;IACnBX,OAAO,CAACG,MAAM,CAAC;IACf,IAAIA,MAAM,CAACC,EAAE,KAAKC,sBAAW,EAAE;MAC3BN,QAAQ,CAACI,MAAM,CAACC,EAAE,CAAC;IACvB;EACJ,CAAC;EAED,IAAMA,EAAE,GAAG,IAAAS,cAAO,EAAC,YAAM;IACrB,IAAAC,gBAAA,GAAe,IAAAC,sBAAe,EAACC,MAAM,CAACb,MAAM,CAACC,EAAE,CAAC,CAAC;MAAzCA,EAAE,GAAAU,gBAAA,CAAFV,EAAE;IACV,OAAOA,EAAE;EACb,CAAC,EAAE,CAACD,MAAM,CAACC,EAAE,CAAC,CAAC;EAEf,IAAAa,KAAA,GAA6Dd,MAAM,IAAI,CAAC,CAAC;IAAjEtB,0BAA0B,GAAAoC,KAAA,CAA1BpC,0BAA0B;IAAEC,oBAAoB,GAAAmC,KAAA,CAApBnC,oBAAoB;EAExD,oBACInB,MAAA,CAAAsB,OAAA,CAAAC,aAAA,CAACd,OAAA,CAAA8C,SAAS,EAAAC,MAAA,CAAAC,MAAA;IACNxC,SAAS,EAAE,CAAC,CAACe,IAAI,CAAC0B,IAAI,EAAEzC,SAAU;IAClC0C,KAAK,EAAE;MAAEC,kBAAkB,EAAEjB;IAAO;EAAE,GAClCC,aAAa,GAEhB5B,MAAM,GAAG,IAAI,gBACVhB,MAAA,CAAAsB,OAAA,CAAAC,aAAA,CAACd,OAAA,CAAAoD,SAAS;IAAC3B,MAAM,EAAEA,MAAO;IAACG,OAAO,EAAES;EAAa,gBAC7C9C,MAAA,CAAAsB,OAAA,CAAAC,aAAA,CAACpB,YAAA,CAAAqB,cAAU,MAAE,CACN,CACd,eACDxB,MAAA,CAAAsB,OAAA,CAAAC,aAAA,CAACd,OAAA,CAAAqD,OAAO;IAACzB,OAAO,EAAEY,WAAY;IAACrB,SAAS,gBAAAmC,MAAA,CAAgBtB,EAAE;EAAG,gBACzDzC,MAAA,CAAAsB,OAAA,CAAAC,aAAA,CAACV,UAAU;IACPG,MAAM,EAAEA,MAAO;IACfI,IAAI,EAAEY,IAAI,CAACZ,IAAK;IAChBF,0BAA0B,EAAEA,0BAA2B;IACvDC,oBAAoB,EAAEA,oBAAqB;IAC3Ce,MAAM,EAAElB,MAAM,GAAG,IAAI,GAAGkB,MAAO;IAC/BjB,SAAS,EAAE,CAAC,CAACe,IAAI,CAAC0B,IAAI,EAAEzC;EAAU,CACrC,CACI,CAAC,EACTkB,aAAa,IAAI,CAACnB,MAAM,iBAAIhB,MAAA,CAAAsB,OAAA,CAAAC,aAAA,CAACf,YAAA,CAAAwD,WAAW,MAAE,CACpC,CAAC;AAEpB,CAAC","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_arrow_right","_folderFill","_folder_sharedFill","_home","_reactDndTreeview","_MenuActions","_styled","_utils","_constants","_hooks","_Progress","FolderNode","exports","_ref","isRoot","isFocused","hasNonInheritedPermissions","canManagePermissions","text","icon","default","createElement","ReactComponent","Fragment","FolderIcon","Text","className","use","FolderIndicator","_ref2","isLoading","isOpen","onToggle","_useFolder","useFolder","folder","id","ROOT_FOLDER","handleToggle","e","stopPropagation","LoaderContainer","CircularProgress","size","spinnerWidth","spinnerColor","style","background","ArrowIcon","onClick","Node","_ref3","node","depth","enableActions","_useFolder2","indent","dragOverProps","useDragOver","handleClick","useMemo","_parseIdentifier","parseIdentifier","String","_ref4","Container","Object","assign","data","paddingInlineStart","Content","concat","MenuActions"],"sources":["index.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { ReactComponent as ArrowRight } from \"@material-symbols/svg-400/rounded/arrow_right.svg\";\nimport { ReactComponent as Folder } from \"@material-symbols/svg-400/rounded/folder-fill.svg\";\nimport { ReactComponent as FolderShared } from \"@material-symbols/svg-400/rounded/folder_shared-fill.svg\";\nimport { ReactComponent as HomeIcon } from \"@material-design-icons/svg/filled/home.svg\";\nimport { NodeModel, useDragOver } from \"@minoru/react-dnd-treeview\";\nimport { MenuActions } from \"../MenuActions\";\nimport { Container, ArrowIcon, FolderIcon, Text, Content, LoaderContainer } from \"./styled\";\nimport { DndFolderItemData, FolderItem } from \"~/types\";\nimport { parseIdentifier } from \"@webiny/utils\";\nimport { ROOT_FOLDER } from \"~/constants\";\nimport { useFolder } from \"~/hooks\";\nimport { CircularProgress } from \"@webiny/ui/Progress\";\n\ntype NodeProps = {\n    node: NodeModel<DndFolderItemData>;\n    depth: number;\n    isOpen: boolean;\n    isLoading?: boolean;\n    enableActions?: boolean;\n    onToggle: (id: string | number) => void;\n    onClick: (data: FolderItem) => void;\n};\n\ntype FolderProps = {\n    text: string;\n    isRoot: boolean;\n    isOpen: boolean;\n    isFocused?: boolean;\n    isLoading?: boolean;\n    hasNonInheritedPermissions?: boolean;\n    canManagePermissions?: boolean;\n};\n\nexport const FolderNode = ({\n    isRoot,\n    isFocused,\n    hasNonInheritedPermissions,\n    canManagePermissions,\n    text\n}: FolderProps) => {\n    let icon = <HomeIcon />;\n\n    if (!isRoot) {\n        if (hasNonInheritedPermissions && canManagePermissions) {\n            icon = <FolderShared />;\n        } else {\n            icon = <Folder />;\n        }\n    }\n\n    return (\n        <>\n            <FolderIcon>{icon}</FolderIcon>\n            <Text className={isFocused ? \"focused\" : \"\"} use={\"body2\"}>\n                {text}\n            </Text>\n        </>\n    );\n};\n\ntype FolderIndicatorProps = Pick<NodeProps, \"isLoading\" | \"isOpen\" | \"onToggle\">;\n\nconst FolderIndicator = ({ isLoading, isOpen, onToggle }: FolderIndicatorProps) => {\n    const { folder } = useFolder();\n    const isRoot = folder.id === ROOT_FOLDER;\n\n    const handleToggle = (e: React.MouseEvent) => {\n        e.stopPropagation();\n        onToggle(folder.id);\n    };\n\n    if (isRoot) {\n        return null;\n    }\n\n    if (isLoading) {\n        return (\n            <LoaderContainer>\n                <CircularProgress\n                    size={12}\n                    spinnerWidth={2}\n                    spinnerColor={\"#d9d9d9\"}\n                    style={{ background: \"transparent\" }}\n                />\n            </LoaderContainer>\n        );\n    }\n\n    return (\n        <ArrowIcon isOpen={isOpen} onClick={handleToggle}>\n            <ArrowRight />\n        </ArrowIcon>\n    );\n};\n\nexport const Node = ({\n    node,\n    depth,\n    isOpen,\n    enableActions,\n    onToggle,\n    onClick,\n    isLoading\n}: NodeProps) => {\n    const { folder } = useFolder();\n    const isRoot = folder.id === ROOT_FOLDER;\n    // Move the placeholder line to the left based on the element depth within the tree.\n    // Let's add some pixels so that the element is detached from the container but takes up the whole length while it's highlighted during dnd.\n    const indent = depth === 1 ? 4 : (depth - 1) * 20 + 8;\n\n    const dragOverProps = useDragOver(folder.id, isOpen, onToggle);\n\n    const handleClick = (e: React.MouseEvent) => {\n        e.stopPropagation();\n        if (folder.id !== ROOT_FOLDER) {\n            onToggle(folder.id);\n        }\n        onClick(folder);\n    };\n\n    const id = useMemo(() => {\n        const { id } = parseIdentifier(String(folder.id));\n        return id;\n    }, [folder.id]);\n\n    const { hasNonInheritedPermissions, canManagePermissions } = folder || {};\n\n    return (\n        <Container\n            isFocused={!!node.data?.isFocused}\n            isLoading={isLoading}\n            style={{ paddingInlineStart: indent }}\n            {...dragOverProps}\n        >\n            <FolderIndicator isLoading={isLoading} isOpen={isOpen} onToggle={onToggle} />\n            <Content onClick={handleClick} className={`aco-folder-${id}`}>\n                <FolderNode\n                    isRoot={isRoot}\n                    text={node.text}\n                    hasNonInheritedPermissions={hasNonInheritedPermissions}\n                    canManagePermissions={canManagePermissions}\n                    isOpen={isRoot ? true : isOpen}\n                    isFocused={!!node.data?.isFocused}\n                />\n            </Content>\n            {enableActions && !isRoot && <MenuActions />}\n        </Container>\n    );\n};\n"],"mappings":"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","ignoreList":[]}

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

@@ -1,6 +1,7 @@
 /// <reference types="react" />
 type ContainerProps = {
     isFocused: boolean;
+    isLoading?: boolean;
 };
 type ArrowIconContainerProps = {
     isOpen: boolean;
@@ -32,4 +33,8 @@ export declare const Content: import("@emotion/styled").StyledComponent<{
 export declare const Text: import("@emotion/styled").StyledComponent<import("@webiny/ui/Typography/Typography").TypographyProps & {
     theme?: import("@emotion/react").Theme | undefined;
 }, {}, {}>;
+export declare const LoaderContainer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export {};

package/components/FolderTree/Node/styled.js

@@ -4,22 +4,26 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.Text = exports.Icon = exports.FolderIcon = exports.Content = exports.Container = exports.ArrowIcon = void 0;
+exports.Text = exports.LoaderContainer = exports.Icon = exports.FolderIcon = exports.Content = exports.Container = exports.ArrowIcon = void 0;
 var _base = _interopRequireDefault(require("@emotion/styled/base"));
 var _Typography = require("@webiny/ui/Typography");
 function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
 var Container = exports.Container = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
-  target: "e1py1adz5"
+  target: "e1py1adz6"
 } : {
-  target: "e1py1adz5",
+  target: "e1py1adz6",
   label: "Container"
 })("display:flex;align-items:center;padding:4px 0 4px 4px;background:", function (props) {
-  return props.isFocused && "var(--mdc-theme-on-background)";
-}, ";color:var(--webiny-theme-color-text-secondary);fill:currentColor;position:relative;&:hover .folder-tree-menu-action{visibility:visible;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlZC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBV3NEIiwiZmlsZSI6InN0eWxlZC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IFR5cG9ncmFwaHkgfSBmcm9tIFwiQHdlYmlueS91aS9UeXBvZ3JhcGh5XCI7XG5cbnR5cGUgQ29udGFpbmVyUHJvcHMgPSB7XG4gICAgaXNGb2N1c2VkOiBib29sZWFuO1xufTtcblxudHlwZSBBcnJvd0ljb25Db250YWluZXJQcm9wcyA9IHtcbiAgICBpc09wZW46IGJvb2xlYW47XG59O1xuXG5leHBvcnQgY29uc3QgQ29udGFpbmVyID0gc3R5bGVkKFwiZGl2XCIpPENvbnRhaW5lclByb3BzPmBcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgcGFkZGluZzogNHB4IDAgNHB4IDRweDtcbiAgICBiYWNrZ3JvdW5kOiAke3Byb3BzID0+IHByb3BzLmlzRm9jdXNlZCAmJiBcInZhcigtLW1kYy10aGVtZS1vbi1iYWNrZ3JvdW5kKVwifTtcbiAgICBjb2xvcjogdmFyKC0td2ViaW55LXRoZW1lLWNvbG9yLXRleHQtc2Vjb25kYXJ5KTtcbiAgICBmaWxsOiBjdXJyZW50Q29sb3I7XG4gICAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAgICY6aG92ZXIgLmZvbGRlci10cmVlLW1lbnUtYWN0aW9uIHtcbiAgICAgICAgdmlzaWJpbGl0eTogdmlzaWJsZTtcbiAgICB9XG5gO1xuXG5leHBvcnQgY29uc3QgSWNvbiA9IHN0eWxlZChcImRpdlwiKWBcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gICAgaGVpZ2h0OiAyNHB4O1xuICAgIHdpZHRoOiAyNHB4O1xuICAgIGN1cnNvcjogcG9pbnRlcjtcbiAgICBmaWxsOiB2YXIoLS1tZGMtdGhlbWUtdGV4dC1zZWNvbmRhcnktb24tYmFja2dyb3VuZCk7XG5gO1xuXG5leHBvcnQgY29uc3QgQXJyb3dJY29uID0gc3R5bGVkKEljb24pPEFycm93SWNvbkNvbnRhaW5lclByb3BzPmBcbiAgICB0cmFuc2l0aW9uOiB0cmFuc2Zvcm0gbGluZWFyIDAuMXM7XG4gICAgdHJhbnNmb3JtOiAke3Byb3BzID0+IChwcm9wcy5pc09wZW4gPyBcInJvdGF0ZSg5MGRlZylcIiA6IFwicm90YXRlKDBkZWcpXCIpfTtcbmA7XG5cbmV4cG9ydCBjb25zdCBGb2xkZXJJY29uID0gc3R5bGVkKEljb24pYFxuICAgIG1hcmdpbi1yaWdodDogNHB4O1xuYDtcblxuZXhwb3J0IGNvbnN0IENvbnRlbnQgPSBzdHlsZWQoXCJkaXZcIilgXG4gICAgZGlzcGxheTogZmxleDtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgIGN1cnNvcjogcG9pbnRlcjtcbiAgICB3aGl0ZS1zcGFjZTogbm93cmFwO1xuICAgIG92ZXJmbG93OiBoaWRkZW47XG4gICAgd2lkdGg6IDEwMCU7XG5gO1xuXG5leHBvcnQgY29uc3QgVGV4dCA9IHN0eWxlZChUeXBvZ3JhcGh5KWBcbiAgICB3aGl0ZS1zcGFjZTogbm93cmFwO1xuICAgIG92ZXJmbG93OiBoaWRkZW47XG4gICAgdGV4dC1vdmVyZmxvdzogZWxsaXBzaXM7XG4gICAgbGluZS1oZWlnaHQ6IDI0cHg7XG4gICAgJi5mb2N1c2VkIHtcbiAgICAgICAgZm9udC13ZWlnaHQ6IDYwMDtcbiAgICB9XG5gO1xuIl19 */"));
+  return props.isFocused && !props.isLoading && "var(--mdc-theme-on-background)";
+}, ";color:var(--webiny-theme-color-text-secondary);fill:currentColor;position:relative;opacity:", function (props) {
+  return props.isLoading ? 0.5 : 1;
+}, ";pointer-events:", function (props) {
+  return props.isLoading ? "none" : "auto";
+}, ";&:hover .folder-tree-menu-action{visibility:visible;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlZC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBWXNEIiwiZmlsZSI6InN0eWxlZC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IFR5cG9ncmFwaHkgfSBmcm9tIFwiQHdlYmlueS91aS9UeXBvZ3JhcGh5XCI7XG5cbnR5cGUgQ29udGFpbmVyUHJvcHMgPSB7XG4gICAgaXNGb2N1c2VkOiBib29sZWFuO1xuICAgIGlzTG9hZGluZz86IGJvb2xlYW47XG59O1xuXG50eXBlIEFycm93SWNvbkNvbnRhaW5lclByb3BzID0ge1xuICAgIGlzT3BlbjogYm9vbGVhbjtcbn07XG5cbmV4cG9ydCBjb25zdCBDb250YWluZXIgPSBzdHlsZWQoXCJkaXZcIik8Q29udGFpbmVyUHJvcHM+YFxuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICBwYWRkaW5nOiA0cHggMCA0cHggNHB4O1xuICAgIGJhY2tncm91bmQ6ICR7cHJvcHMgPT4gcHJvcHMuaXNGb2N1c2VkICYmICFwcm9wcy5pc0xvYWRpbmcgJiYgXCJ2YXIoLS1tZGMtdGhlbWUtb24tYmFja2dyb3VuZClcIn07XG4gICAgY29sb3I6IHZhcigtLXdlYmlueS10aGVtZS1jb2xvci10ZXh0LXNlY29uZGFyeSk7XG4gICAgZmlsbDogY3VycmVudENvbG9yO1xuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICBvcGFjaXR5OiAke3Byb3BzID0+IChwcm9wcy5pc0xvYWRpbmcgPyAwLjUgOiAxKX07XG4gICAgcG9pbnRlci1ldmVudHM6ICR7cHJvcHMgPT4gKHByb3BzLmlzTG9hZGluZyA/IFwibm9uZVwiIDogXCJhdXRvXCIpfTtcbiAgICAmOmhvdmVyIC5mb2xkZXItdHJlZS1tZW51LWFjdGlvbiB7XG4gICAgICAgIHZpc2liaWxpdHk6IHZpc2libGU7XG4gICAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IEljb24gPSBzdHlsZWQoXCJkaXZcIilgXG4gICAgZGlzcGxheTogZmxleDtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICAgIGhlaWdodDogMjRweDtcbiAgICB3aWR0aDogMjRweDtcbiAgICBjdXJzb3I6IHBvaW50ZXI7XG4gICAgZmlsbDogdmFyKC0tbWRjLXRoZW1lLXRleHQtc2Vjb25kYXJ5LW9uLWJhY2tncm91bmQpO1xuYDtcblxuZXhwb3J0IGNvbnN0IEFycm93SWNvbiA9IHN0eWxlZChJY29uKTxBcnJvd0ljb25Db250YWluZXJQcm9wcz5gXG4gICAgdHJhbnNpdGlvbjogdHJhbnNmb3JtIGxpbmVhciAwLjFzO1xuICAgIHRyYW5zZm9ybTogJHtwcm9wcyA9PiAocHJvcHMuaXNPcGVuID8gXCJyb3RhdGUoOTBkZWcpXCIgOiBcInJvdGF0ZSgwZGVnKVwiKX07XG5gO1xuXG5leHBvcnQgY29uc3QgRm9sZGVySWNvbiA9IHN0eWxlZChJY29uKWBcbiAgICBtYXJnaW4tcmlnaHQ6IDRweDtcbmA7XG5cbmV4cG9ydCBjb25zdCBDb250ZW50ID0gc3R5bGVkKFwiZGl2XCIpYFxuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICBjdXJzb3I6IHBvaW50ZXI7XG4gICAgd2hpdGUtc3BhY2U6IG5vd3JhcDtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIHdpZHRoOiAxMDAlO1xuYDtcblxuZXhwb3J0IGNvbnN0IFRleHQgPSBzdHlsZWQoVHlwb2dyYXBoeSlgXG4gICAgd2hpdGUtc3BhY2U6IG5vd3JhcDtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIHRleHQtb3ZlcmZsb3c6IGVsbGlwc2lzO1xuICAgIGxpbmUtaGVpZ2h0OiAyNHB4O1xuICAgICYuZm9jdXNlZCB7XG4gICAgICAgIGZvbnQtd2VpZ2h0OiA2MDA7XG4gICAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IExvYWRlckNvbnRhaW5lciA9IHN0eWxlZChcImRpdlwiKWBcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gICAgaGVpZ2h0OiAyNHB4O1xuICAgIHdpZHRoOiAyNnB4O1xuYDtcbiJdfQ== */"));
 var Icon = exports.Icon = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
-  target: "e1py1adz4"
+  target: "e1py1adz5"
 } : {
-  target: "e1py1adz4",
+  target: "e1py1adz5",
   label: "Icon"
 })(process.env.NODE_ENV === "production" ? {
   name: "jjpqt3",
@@ -27,21 +31,21 @@ var Icon = exports.Icon = /*#__PURE__*/(0, _base.default)("div", process.env.NOD
 } : {
   name: "jjpqt3",
   styles: "display:flex;align-items:center;justify-content:center;height:24px;width:24px;cursor:pointer;fill:var(--mdc-theme-text-secondary-on-background)",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlZC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBd0JpQyIsImZpbGUiOiJzdHlsZWQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBUeXBvZ3JhcGh5IH0gZnJvbSBcIkB3ZWJpbnkvdWkvVHlwb2dyYXBoeVwiO1xuXG50eXBlIENvbnRhaW5lclByb3BzID0ge1xuICAgIGlzRm9jdXNlZDogYm9vbGVhbjtcbn07XG5cbnR5cGUgQXJyb3dJY29uQ29udGFpbmVyUHJvcHMgPSB7XG4gICAgaXNPcGVuOiBib29sZWFuO1xufTtcblxuZXhwb3J0IGNvbnN0IENvbnRhaW5lciA9IHN0eWxlZChcImRpdlwiKTxDb250YWluZXJQcm9wcz5gXG4gICAgZGlzcGxheTogZmxleDtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgIHBhZGRpbmc6IDRweCAwIDRweCA0cHg7XG4gICAgYmFja2dyb3VuZDogJHtwcm9wcyA9PiBwcm9wcy5pc0ZvY3VzZWQgJiYgXCJ2YXIoLS1tZGMtdGhlbWUtb24tYmFja2dyb3VuZClcIn07XG4gICAgY29sb3I6IHZhcigtLXdlYmlueS10aGVtZS1jb2xvci10ZXh0LXNlY29uZGFyeSk7XG4gICAgZmlsbDogY3VycmVudENvbG9yO1xuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICAmOmhvdmVyIC5mb2xkZXItdHJlZS1tZW51LWFjdGlvbiB7XG4gICAgICAgIHZpc2liaWxpdHk6IHZpc2libGU7XG4gICAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IEljb24gPSBzdHlsZWQoXCJkaXZcIilgXG4gICAgZGlzcGxheTogZmxleDtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICAgIGhlaWdodDogMjRweDtcbiAgICB3aWR0aDogMjRweDtcbiAgICBjdXJzb3I6IHBvaW50ZXI7XG4gICAgZmlsbDogdmFyKC0tbWRjLXRoZW1lLXRleHQtc2Vjb25kYXJ5LW9uLWJhY2tncm91bmQpO1xuYDtcblxuZXhwb3J0IGNvbnN0IEFycm93SWNvbiA9IHN0eWxlZChJY29uKTxBcnJvd0ljb25Db250YWluZXJQcm9wcz5gXG4gICAgdHJhbnNpdGlvbjogdHJhbnNmb3JtIGxpbmVhciAwLjFzO1xuICAgIHRyYW5zZm9ybTogJHtwcm9wcyA9PiAocHJvcHMuaXNPcGVuID8gXCJyb3RhdGUoOTBkZWcpXCIgOiBcInJvdGF0ZSgwZGVnKVwiKX07XG5gO1xuXG5leHBvcnQgY29uc3QgRm9sZGVySWNvbiA9IHN0eWxlZChJY29uKWBcbiAgICBtYXJnaW4tcmlnaHQ6IDRweDtcbmA7XG5cbmV4cG9ydCBjb25zdCBDb250ZW50ID0gc3R5bGVkKFwiZGl2XCIpYFxuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICBjdXJzb3I6IHBvaW50ZXI7XG4gICAgd2hpdGUtc3BhY2U6IG5vd3JhcDtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIHdpZHRoOiAxMDAlO1xuYDtcblxuZXhwb3J0IGNvbnN0IFRleHQgPSBzdHlsZWQoVHlwb2dyYXBoeSlgXG4gICAgd2hpdGUtc3BhY2U6IG5vd3JhcDtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIHRleHQtb3ZlcmZsb3c6IGVsbGlwc2lzO1xuICAgIGxpbmUtaGVpZ2h0OiAyNHB4O1xuICAgICYuZm9jdXNlZCB7XG4gICAgICAgIGZvbnQtd2VpZ2h0OiA2MDA7XG4gICAgfVxuYDtcbiJdfQ== */",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlZC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBMkJpQyIsImZpbGUiOiJzdHlsZWQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBUeXBvZ3JhcGh5IH0gZnJvbSBcIkB3ZWJpbnkvdWkvVHlwb2dyYXBoeVwiO1xuXG50eXBlIENvbnRhaW5lclByb3BzID0ge1xuICAgIGlzRm9jdXNlZDogYm9vbGVhbjtcbiAgICBpc0xvYWRpbmc/OiBib29sZWFuO1xufTtcblxudHlwZSBBcnJvd0ljb25Db250YWluZXJQcm9wcyA9IHtcbiAgICBpc09wZW46IGJvb2xlYW47XG59O1xuXG5leHBvcnQgY29uc3QgQ29udGFpbmVyID0gc3R5bGVkKFwiZGl2XCIpPENvbnRhaW5lclByb3BzPmBcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgcGFkZGluZzogNHB4IDAgNHB4IDRweDtcbiAgICBiYWNrZ3JvdW5kOiAke3Byb3BzID0+IHByb3BzLmlzRm9jdXNlZCAmJiAhcHJvcHMuaXNMb2FkaW5nICYmIFwidmFyKC0tbWRjLXRoZW1lLW9uLWJhY2tncm91bmQpXCJ9O1xuICAgIGNvbG9yOiB2YXIoLS13ZWJpbnktdGhlbWUtY29sb3ItdGV4dC1zZWNvbmRhcnkpO1xuICAgIGZpbGw6IGN1cnJlbnRDb2xvcjtcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gICAgb3BhY2l0eTogJHtwcm9wcyA9PiAocHJvcHMuaXNMb2FkaW5nID8gMC41IDogMSl9O1xuICAgIHBvaW50ZXItZXZlbnRzOiAke3Byb3BzID0+IChwcm9wcy5pc0xvYWRpbmcgPyBcIm5vbmVcIiA6IFwiYXV0b1wiKX07XG4gICAgJjpob3ZlciAuZm9sZGVyLXRyZWUtbWVudS1hY3Rpb24ge1xuICAgICAgICB2aXNpYmlsaXR5OiB2aXNpYmxlO1xuICAgIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBJY29uID0gc3R5bGVkKFwiZGl2XCIpYFxuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgICBoZWlnaHQ6IDI0cHg7XG4gICAgd2lkdGg6IDI0cHg7XG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICAgIGZpbGw6IHZhcigtLW1kYy10aGVtZS10ZXh0LXNlY29uZGFyeS1vbi1iYWNrZ3JvdW5kKTtcbmA7XG5cbmV4cG9ydCBjb25zdCBBcnJvd0ljb24gPSBzdHlsZWQoSWNvbik8QXJyb3dJY29uQ29udGFpbmVyUHJvcHM+YFxuICAgIHRyYW5zaXRpb246IHRyYW5zZm9ybSBsaW5lYXIgMC4xcztcbiAgICB0cmFuc2Zvcm06ICR7cHJvcHMgPT4gKHByb3BzLmlzT3BlbiA/IFwicm90YXRlKDkwZGVnKVwiIDogXCJyb3RhdGUoMGRlZylcIil9O1xuYDtcblxuZXhwb3J0IGNvbnN0IEZvbGRlckljb24gPSBzdHlsZWQoSWNvbilgXG4gICAgbWFyZ2luLXJpZ2h0OiA0cHg7XG5gO1xuXG5leHBvcnQgY29uc3QgQ29udGVudCA9IHN0eWxlZChcImRpdlwiKWBcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICAgIHdoaXRlLXNwYWNlOiBub3dyYXA7XG4gICAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgICB3aWR0aDogMTAwJTtcbmA7XG5cbmV4cG9ydCBjb25zdCBUZXh0ID0gc3R5bGVkKFR5cG9ncmFwaHkpYFxuICAgIHdoaXRlLXNwYWNlOiBub3dyYXA7XG4gICAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgICB0ZXh0LW92ZXJmbG93OiBlbGxpcHNpcztcbiAgICBsaW5lLWhlaWdodDogMjRweDtcbiAgICAmLmZvY3VzZWQge1xuICAgICAgICBmb250LXdlaWdodDogNjAwO1xuICAgIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBMb2FkZXJDb250YWluZXIgPSBzdHlsZWQoXCJkaXZcIilgXG4gICAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAgIGhlaWdodDogMjRweDtcbiAgICB3aWR0aDogMjZweDtcbmA7XG4iXX0= */",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });
 var ArrowIcon = exports.ArrowIcon = /*#__PURE__*/(0, _base.default)(Icon, process.env.NODE_ENV === "production" ? {
-  target: "e1py1adz3"
+  target: "e1py1adz4"
 } : {
-  target: "e1py1adz3",
+  target: "e1py1adz4",
   label: "ArrowIcon"
 })("transition:transform linear 0.1s;transform:", function (props) {
   return props.isOpen ? "rotate(90deg)" : "rotate(0deg)";
-}, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlZC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBa0M4RCIsImZpbGUiOiJzdHlsZWQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBUeXBvZ3JhcGh5IH0gZnJvbSBcIkB3ZWJpbnkvdWkvVHlwb2dyYXBoeVwiO1xuXG50eXBlIENvbnRhaW5lclByb3BzID0ge1xuICAgIGlzRm9jdXNlZDogYm9vbGVhbjtcbn07XG5cbnR5cGUgQXJyb3dJY29uQ29udGFpbmVyUHJvcHMgPSB7XG4gICAgaXNPcGVuOiBib29sZWFuO1xufTtcblxuZXhwb3J0IGNvbnN0IENvbnRhaW5lciA9IHN0eWxlZChcImRpdlwiKTxDb250YWluZXJQcm9wcz5gXG4gICAgZGlzcGxheTogZmxleDtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgIHBhZGRpbmc6IDRweCAwIDRweCA0cHg7XG4gICAgYmFja2dyb3VuZDogJHtwcm9wcyA9PiBwcm9wcy5pc0ZvY3VzZWQgJiYgXCJ2YXIoLS1tZGMtdGhlbWUtb24tYmFja2dyb3VuZClcIn07XG4gICAgY29sb3I6IHZhcigtLXdlYmlueS10aGVtZS1jb2xvci10ZXh0LXNlY29uZGFyeSk7XG4gICAgZmlsbDogY3VycmVudENvbG9yO1xuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICAmOmhvdmVyIC5mb2xkZXItdHJlZS1tZW51LWFjdGlvbiB7XG4gICAgICAgIHZpc2liaWxpdHk6IHZpc2libGU7XG4gICAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IEljb24gPSBzdHlsZWQoXCJkaXZcIilgXG4gICAgZGlzcGxheTogZmxleDtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICAgIGhlaWdodDogMjRweDtcbiAgICB3aWR0aDogMjRweDtcbiAgICBjdXJzb3I6IHBvaW50ZXI7XG4gICAgZmlsbDogdmFyKC0tbWRjLXRoZW1lLXRleHQtc2Vjb25kYXJ5LW9uLWJhY2tncm91bmQpO1xuYDtcblxuZXhwb3J0IGNvbnN0IEFycm93SWNvbiA9IHN0eWxlZChJY29uKTxBcnJvd0ljb25Db250YWluZXJQcm9wcz5gXG4gICAgdHJhbnNpdGlvbjogdHJhbnNmb3JtIGxpbmVhciAwLjFzO1xuICAgIHRyYW5zZm9ybTogJHtwcm9wcyA9PiAocHJvcHMuaXNPcGVuID8gXCJyb3RhdGUoOTBkZWcpXCIgOiBcInJvdGF0ZSgwZGVnKVwiKX07XG5gO1xuXG5leHBvcnQgY29uc3QgRm9sZGVySWNvbiA9IHN0eWxlZChJY29uKWBcbiAgICBtYXJnaW4tcmlnaHQ6IDRweDtcbmA7XG5cbmV4cG9ydCBjb25zdCBDb250ZW50ID0gc3R5bGVkKFwiZGl2XCIpYFxuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICBjdXJzb3I6IHBvaW50ZXI7XG4gICAgd2hpdGUtc3BhY2U6IG5vd3JhcDtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIHdpZHRoOiAxMDAlO1xuYDtcblxuZXhwb3J0IGNvbnN0IFRleHQgPSBzdHlsZWQoVHlwb2dyYXBoeSlgXG4gICAgd2hpdGUtc3BhY2U6IG5vd3JhcDtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIHRleHQtb3ZlcmZsb3c6IGVsbGlwc2lzO1xuICAgIGxpbmUtaGVpZ2h0OiAyNHB4O1xuICAgICYuZm9jdXNlZCB7XG4gICAgICAgIGZvbnQtd2VpZ2h0OiA2MDA7XG4gICAgfVxuYDtcbiJdfQ== */"));
+}, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlZC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBcUM4RCIsImZpbGUiOiJzdHlsZWQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBUeXBvZ3JhcGh5IH0gZnJvbSBcIkB3ZWJpbnkvdWkvVHlwb2dyYXBoeVwiO1xuXG50eXBlIENvbnRhaW5lclByb3BzID0ge1xuICAgIGlzRm9jdXNlZDogYm9vbGVhbjtcbiAgICBpc0xvYWRpbmc/OiBib29sZWFuO1xufTtcblxudHlwZSBBcnJvd0ljb25Db250YWluZXJQcm9wcyA9IHtcbiAgICBpc09wZW46IGJvb2xlYW47XG59O1xuXG5leHBvcnQgY29uc3QgQ29udGFpbmVyID0gc3R5bGVkKFwiZGl2XCIpPENvbnRhaW5lclByb3BzPmBcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgcGFkZGluZzogNHB4IDAgNHB4IDRweDtcbiAgICBiYWNrZ3JvdW5kOiAke3Byb3BzID0+IHByb3BzLmlzRm9jdXNlZCAmJiAhcHJvcHMuaXNMb2FkaW5nICYmIFwidmFyKC0tbWRjLXRoZW1lLW9uLWJhY2tncm91bmQpXCJ9O1xuICAgIGNvbG9yOiB2YXIoLS13ZWJpbnktdGhlbWUtY29sb3ItdGV4dC1zZWNvbmRhcnkpO1xuICAgIGZpbGw6IGN1cnJlbnRDb2xvcjtcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gICAgb3BhY2l0eTogJHtwcm9wcyA9PiAocHJvcHMuaXNMb2FkaW5nID8gMC41IDogMSl9O1xuICAgIHBvaW50ZXItZXZlbnRzOiAke3Byb3BzID0+IChwcm9wcy5pc0xvYWRpbmcgPyBcIm5vbmVcIiA6IFwiYXV0b1wiKX07XG4gICAgJjpob3ZlciAuZm9sZGVyLXRyZWUtbWVudS1hY3Rpb24ge1xuICAgICAgICB2aXNpYmlsaXR5OiB2aXNpYmxlO1xuICAgIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBJY29uID0gc3R5bGVkKFwiZGl2XCIpYFxuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgICBoZWlnaHQ6IDI0cHg7XG4gICAgd2lkdGg6IDI0cHg7XG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICAgIGZpbGw6IHZhcigtLW1kYy10aGVtZS10ZXh0LXNlY29uZGFyeS1vbi1iYWNrZ3JvdW5kKTtcbmA7XG5cbmV4cG9ydCBjb25zdCBBcnJvd0ljb24gPSBzdHlsZWQoSWNvbik8QXJyb3dJY29uQ29udGFpbmVyUHJvcHM+YFxuICAgIHRyYW5zaXRpb246IHRyYW5zZm9ybSBsaW5lYXIgMC4xcztcbiAgICB0cmFuc2Zvcm06ICR7cHJvcHMgPT4gKHByb3BzLmlzT3BlbiA/IFwicm90YXRlKDkwZGVnKVwiIDogXCJyb3RhdGUoMGRlZylcIil9O1xuYDtcblxuZXhwb3J0IGNvbnN0IEZvbGRlckljb24gPSBzdHlsZWQoSWNvbilgXG4gICAgbWFyZ2luLXJpZ2h0OiA0cHg7XG5gO1xuXG5leHBvcnQgY29uc3QgQ29udGVudCA9IHN0eWxlZChcImRpdlwiKWBcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICAgIHdoaXRlLXNwYWNlOiBub3dyYXA7XG4gICAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgICB3aWR0aDogMTAwJTtcbmA7XG5cbmV4cG9ydCBjb25zdCBUZXh0ID0gc3R5bGVkKFR5cG9ncmFwaHkpYFxuICAgIHdoaXRlLXNwYWNlOiBub3dyYXA7XG4gICAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgICB0ZXh0LW92ZXJmbG93OiBlbGxpcHNpcztcbiAgICBsaW5lLWhlaWdodDogMjRweDtcbiAgICAmLmZvY3VzZWQge1xuICAgICAgICBmb250LXdlaWdodDogNjAwO1xuICAgIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBMb2FkZXJDb250YWluZXIgPSBzdHlsZWQoXCJkaXZcIilgXG4gICAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAgIGhlaWdodDogMjRweDtcbiAgICB3aWR0aDogMjZweDtcbmA7XG4iXX0= */"));
 var FolderIcon = exports.FolderIcon = /*#__PURE__*/(0, _base.default)(Icon, process.env.NODE_ENV === "production" ? {
-  target: "e1py1adz2"
+  target: "e1py1adz3"
 } : {
-  target: "e1py1adz2",
+  target: "e1py1adz3",
   label: "FolderIcon"
 })(process.env.NODE_ENV === "production" ? {
   name: "qamjgr",
@@ -49,13 +53,13 @@ var FolderIcon = exports.FolderIcon = /*#__PURE__*/(0, _base.default)(Icon, proc
 } : {
   name: "qamjgr",
   styles: "margin-right:4px",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlZC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBdUNzQyIsImZpbGUiOiJzdHlsZWQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBUeXBvZ3JhcGh5IH0gZnJvbSBcIkB3ZWJpbnkvdWkvVHlwb2dyYXBoeVwiO1xuXG50eXBlIENvbnRhaW5lclByb3BzID0ge1xuICAgIGlzRm9jdXNlZDogYm9vbGVhbjtcbn07XG5cbnR5cGUgQXJyb3dJY29uQ29udGFpbmVyUHJvcHMgPSB7XG4gICAgaXNPcGVuOiBib29sZWFuO1xufTtcblxuZXhwb3J0IGNvbnN0IENvbnRhaW5lciA9IHN0eWxlZChcImRpdlwiKTxDb250YWluZXJQcm9wcz5gXG4gICAgZGlzcGxheTogZmxleDtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgIHBhZGRpbmc6IDRweCAwIDRweCA0cHg7XG4gICAgYmFja2dyb3VuZDogJHtwcm9wcyA9PiBwcm9wcy5pc0ZvY3VzZWQgJiYgXCJ2YXIoLS1tZGMtdGhlbWUtb24tYmFja2dyb3VuZClcIn07XG4gICAgY29sb3I6IHZhcigtLXdlYmlueS10aGVtZS1jb2xvci10ZXh0LXNlY29uZGFyeSk7XG4gICAgZmlsbDogY3VycmVudENvbG9yO1xuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICAmOmhvdmVyIC5mb2xkZXItdHJlZS1tZW51LWFjdGlvbiB7XG4gICAgICAgIHZpc2liaWxpdHk6IHZpc2libGU7XG4gICAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IEljb24gPSBzdHlsZWQoXCJkaXZcIilgXG4gICAgZGlzcGxheTogZmxleDtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICAgIGhlaWdodDogMjRweDtcbiAgICB3aWR0aDogMjRweDtcbiAgICBjdXJzb3I6IHBvaW50ZXI7XG4gICAgZmlsbDogdmFyKC0tbWRjLXRoZW1lLXRleHQtc2Vjb25kYXJ5LW9uLWJhY2tncm91bmQpO1xuYDtcblxuZXhwb3J0IGNvbnN0IEFycm93SWNvbiA9IHN0eWxlZChJY29uKTxBcnJvd0ljb25Db250YWluZXJQcm9wcz5gXG4gICAgdHJhbnNpdGlvbjogdHJhbnNmb3JtIGxpbmVhciAwLjFzO1xuICAgIHRyYW5zZm9ybTogJHtwcm9wcyA9PiAocHJvcHMuaXNPcGVuID8gXCJyb3RhdGUoOTBkZWcpXCIgOiBcInJvdGF0ZSgwZGVnKVwiKX07XG5gO1xuXG5leHBvcnQgY29uc3QgRm9sZGVySWNvbiA9IHN0eWxlZChJY29uKWBcbiAgICBtYXJnaW4tcmlnaHQ6IDRweDtcbmA7XG5cbmV4cG9ydCBjb25zdCBDb250ZW50ID0gc3R5bGVkKFwiZGl2XCIpYFxuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICBjdXJzb3I6IHBvaW50ZXI7XG4gICAgd2hpdGUtc3BhY2U6IG5vd3JhcDtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIHdpZHRoOiAxMDAlO1xuYDtcblxuZXhwb3J0IGNvbnN0IFRleHQgPSBzdHlsZWQoVHlwb2dyYXBoeSlgXG4gICAgd2hpdGUtc3BhY2U6IG5vd3JhcDtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIHRleHQtb3ZlcmZsb3c6IGVsbGlwc2lzO1xuICAgIGxpbmUtaGVpZ2h0OiAyNHB4O1xuICAgICYuZm9jdXNlZCB7XG4gICAgICAgIGZvbnQtd2VpZ2h0OiA2MDA7XG4gICAgfVxuYDtcbiJdfQ== */",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlZC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBMENzQyIsImZpbGUiOiJzdHlsZWQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBUeXBvZ3JhcGh5IH0gZnJvbSBcIkB3ZWJpbnkvdWkvVHlwb2dyYXBoeVwiO1xuXG50eXBlIENvbnRhaW5lclByb3BzID0ge1xuICAgIGlzRm9jdXNlZDogYm9vbGVhbjtcbiAgICBpc0xvYWRpbmc/OiBib29sZWFuO1xufTtcblxudHlwZSBBcnJvd0ljb25Db250YWluZXJQcm9wcyA9IHtcbiAgICBpc09wZW46IGJvb2xlYW47XG59O1xuXG5leHBvcnQgY29uc3QgQ29udGFpbmVyID0gc3R5bGVkKFwiZGl2XCIpPENvbnRhaW5lclByb3BzPmBcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgcGFkZGluZzogNHB4IDAgNHB4IDRweDtcbiAgICBiYWNrZ3JvdW5kOiAke3Byb3BzID0+IHByb3BzLmlzRm9jdXNlZCAmJiAhcHJvcHMuaXNMb2FkaW5nICYmIFwidmFyKC0tbWRjLXRoZW1lLW9uLWJhY2tncm91bmQpXCJ9O1xuICAgIGNvbG9yOiB2YXIoLS13ZWJpbnktdGhlbWUtY29sb3ItdGV4dC1zZWNvbmRhcnkpO1xuICAgIGZpbGw6IGN1cnJlbnRDb2xvcjtcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gICAgb3BhY2l0eTogJHtwcm9wcyA9PiAocHJvcHMuaXNMb2FkaW5nID8gMC41IDogMSl9O1xuICAgIHBvaW50ZXItZXZlbnRzOiAke3Byb3BzID0+IChwcm9wcy5pc0xvYWRpbmcgPyBcIm5vbmVcIiA6IFwiYXV0b1wiKX07XG4gICAgJjpob3ZlciAuZm9sZGVyLXRyZWUtbWVudS1hY3Rpb24ge1xuICAgICAgICB2aXNpYmlsaXR5OiB2aXNpYmxlO1xuICAgIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBJY29uID0gc3R5bGVkKFwiZGl2XCIpYFxuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgICBoZWlnaHQ6IDI0cHg7XG4gICAgd2lkdGg6IDI0cHg7XG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICAgIGZpbGw6IHZhcigtLW1kYy10aGVtZS10ZXh0LXNlY29uZGFyeS1vbi1iYWNrZ3JvdW5kKTtcbmA7XG5cbmV4cG9ydCBjb25zdCBBcnJvd0ljb24gPSBzdHlsZWQoSWNvbik8QXJyb3dJY29uQ29udGFpbmVyUHJvcHM+YFxuICAgIHRyYW5zaXRpb246IHRyYW5zZm9ybSBsaW5lYXIgMC4xcztcbiAgICB0cmFuc2Zvcm06ICR7cHJvcHMgPT4gKHByb3BzLmlzT3BlbiA/IFwicm90YXRlKDkwZGVnKVwiIDogXCJyb3RhdGUoMGRlZylcIil9O1xuYDtcblxuZXhwb3J0IGNvbnN0IEZvbGRlckljb24gPSBzdHlsZWQoSWNvbilgXG4gICAgbWFyZ2luLXJpZ2h0OiA0cHg7XG5gO1xuXG5leHBvcnQgY29uc3QgQ29udGVudCA9IHN0eWxlZChcImRpdlwiKWBcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICAgIHdoaXRlLXNwYWNlOiBub3dyYXA7XG4gICAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgICB3aWR0aDogMTAwJTtcbmA7XG5cbmV4cG9ydCBjb25zdCBUZXh0ID0gc3R5bGVkKFR5cG9ncmFwaHkpYFxuICAgIHdoaXRlLXNwYWNlOiBub3dyYXA7XG4gICAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgICB0ZXh0LW92ZXJmbG93OiBlbGxpcHNpcztcbiAgICBsaW5lLWhlaWdodDogMjRweDtcbiAgICAmLmZvY3VzZWQge1xuICAgICAgICBmb250LXdlaWdodDogNjAwO1xuICAgIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBMb2FkZXJDb250YWluZXIgPSBzdHlsZWQoXCJkaXZcIilgXG4gICAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAgIGhlaWdodDogMjRweDtcbiAgICB3aWR0aDogMjZweDtcbmA7XG4iXX0= */",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });
 var Content = exports.Content = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
-  target: "e1py1adz1"
+  target: "e1py1adz2"
 } : {
-  target: "e1py1adz1",
+  target: "e1py1adz2",
   label: "Content"
 })(process.env.NODE_ENV === "production" ? {
   name: "hlt9k",
@@ -63,13 +67,13 @@ var Content = exports.Content = /*#__PURE__*/(0, _base.default)("div", process.e
 } : {
   name: "hlt9k",
   styles: "display:flex;align-items:center;cursor:pointer;white-space:nowrap;overflow:hidden;width:100%",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlZC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBMkNvQyIsImZpbGUiOiJzdHlsZWQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBUeXBvZ3JhcGh5IH0gZnJvbSBcIkB3ZWJpbnkvdWkvVHlwb2dyYXBoeVwiO1xuXG50eXBlIENvbnRhaW5lclByb3BzID0ge1xuICAgIGlzRm9jdXNlZDogYm9vbGVhbjtcbn07XG5cbnR5cGUgQXJyb3dJY29uQ29udGFpbmVyUHJvcHMgPSB7XG4gICAgaXNPcGVuOiBib29sZWFuO1xufTtcblxuZXhwb3J0IGNvbnN0IENvbnRhaW5lciA9IHN0eWxlZChcImRpdlwiKTxDb250YWluZXJQcm9wcz5gXG4gICAgZGlzcGxheTogZmxleDtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgIHBhZGRpbmc6IDRweCAwIDRweCA0cHg7XG4gICAgYmFja2dyb3VuZDogJHtwcm9wcyA9PiBwcm9wcy5pc0ZvY3VzZWQgJiYgXCJ2YXIoLS1tZGMtdGhlbWUtb24tYmFja2dyb3VuZClcIn07XG4gICAgY29sb3I6IHZhcigtLXdlYmlueS10aGVtZS1jb2xvci10ZXh0LXNlY29uZGFyeSk7XG4gICAgZmlsbDogY3VycmVudENvbG9yO1xuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICAmOmhvdmVyIC5mb2xkZXItdHJlZS1tZW51LWFjdGlvbiB7XG4gICAgICAgIHZpc2liaWxpdHk6IHZpc2libGU7XG4gICAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IEljb24gPSBzdHlsZWQoXCJkaXZcIilgXG4gICAgZGlzcGxheTogZmxleDtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICAgIGhlaWdodDogMjRweDtcbiAgICB3aWR0aDogMjRweDtcbiAgICBjdXJzb3I6IHBvaW50ZXI7XG4gICAgZmlsbDogdmFyKC0tbWRjLXRoZW1lLXRleHQtc2Vjb25kYXJ5LW9uLWJhY2tncm91bmQpO1xuYDtcblxuZXhwb3J0IGNvbnN0IEFycm93SWNvbiA9IHN0eWxlZChJY29uKTxBcnJvd0ljb25Db250YWluZXJQcm9wcz5gXG4gICAgdHJhbnNpdGlvbjogdHJhbnNmb3JtIGxpbmVhciAwLjFzO1xuICAgIHRyYW5zZm9ybTogJHtwcm9wcyA9PiAocHJvcHMuaXNPcGVuID8gXCJyb3RhdGUoOTBkZWcpXCIgOiBcInJvdGF0ZSgwZGVnKVwiKX07XG5gO1xuXG5leHBvcnQgY29uc3QgRm9sZGVySWNvbiA9IHN0eWxlZChJY29uKWBcbiAgICBtYXJnaW4tcmlnaHQ6IDRweDtcbmA7XG5cbmV4cG9ydCBjb25zdCBDb250ZW50ID0gc3R5bGVkKFwiZGl2XCIpYFxuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICBjdXJzb3I6IHBvaW50ZXI7XG4gICAgd2hpdGUtc3BhY2U6IG5vd3JhcDtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIHdpZHRoOiAxMDAlO1xuYDtcblxuZXhwb3J0IGNvbnN0IFRleHQgPSBzdHlsZWQoVHlwb2dyYXBoeSlgXG4gICAgd2hpdGUtc3BhY2U6IG5vd3JhcDtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIHRleHQtb3ZlcmZsb3c6IGVsbGlwc2lzO1xuICAgIGxpbmUtaGVpZ2h0OiAyNHB4O1xuICAgICYuZm9jdXNlZCB7XG4gICAgICAgIGZvbnQtd2VpZ2h0OiA2MDA7XG4gICAgfVxuYDtcbiJdfQ== */",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlZC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBOENvQyIsImZpbGUiOiJzdHlsZWQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBUeXBvZ3JhcGh5IH0gZnJvbSBcIkB3ZWJpbnkvdWkvVHlwb2dyYXBoeVwiO1xuXG50eXBlIENvbnRhaW5lclByb3BzID0ge1xuICAgIGlzRm9jdXNlZDogYm9vbGVhbjtcbiAgICBpc0xvYWRpbmc/OiBib29sZWFuO1xufTtcblxudHlwZSBBcnJvd0ljb25Db250YWluZXJQcm9wcyA9IHtcbiAgICBpc09wZW46IGJvb2xlYW47XG59O1xuXG5leHBvcnQgY29uc3QgQ29udGFpbmVyID0gc3R5bGVkKFwiZGl2XCIpPENvbnRhaW5lclByb3BzPmBcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgcGFkZGluZzogNHB4IDAgNHB4IDRweDtcbiAgICBiYWNrZ3JvdW5kOiAke3Byb3BzID0+IHByb3BzLmlzRm9jdXNlZCAmJiAhcHJvcHMuaXNMb2FkaW5nICYmIFwidmFyKC0tbWRjLXRoZW1lLW9uLWJhY2tncm91bmQpXCJ9O1xuICAgIGNvbG9yOiB2YXIoLS13ZWJpbnktdGhlbWUtY29sb3ItdGV4dC1zZWNvbmRhcnkpO1xuICAgIGZpbGw6IGN1cnJlbnRDb2xvcjtcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gICAgb3BhY2l0eTogJHtwcm9wcyA9PiAocHJvcHMuaXNMb2FkaW5nID8gMC41IDogMSl9O1xuICAgIHBvaW50ZXItZXZlbnRzOiAke3Byb3BzID0+IChwcm9wcy5pc0xvYWRpbmcgPyBcIm5vbmVcIiA6IFwiYXV0b1wiKX07XG4gICAgJjpob3ZlciAuZm9sZGVyLXRyZWUtbWVudS1hY3Rpb24ge1xuICAgICAgICB2aXNpYmlsaXR5OiB2aXNpYmxlO1xuICAgIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBJY29uID0gc3R5bGVkKFwiZGl2XCIpYFxuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgICBoZWlnaHQ6IDI0cHg7XG4gICAgd2lkdGg6IDI0cHg7XG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICAgIGZpbGw6IHZhcigtLW1kYy10aGVtZS10ZXh0LXNlY29uZGFyeS1vbi1iYWNrZ3JvdW5kKTtcbmA7XG5cbmV4cG9ydCBjb25zdCBBcnJvd0ljb24gPSBzdHlsZWQoSWNvbik8QXJyb3dJY29uQ29udGFpbmVyUHJvcHM+YFxuICAgIHRyYW5zaXRpb246IHRyYW5zZm9ybSBsaW5lYXIgMC4xcztcbiAgICB0cmFuc2Zvcm06ICR7cHJvcHMgPT4gKHByb3BzLmlzT3BlbiA/IFwicm90YXRlKDkwZGVnKVwiIDogXCJyb3RhdGUoMGRlZylcIil9O1xuYDtcblxuZXhwb3J0IGNvbnN0IEZvbGRlckljb24gPSBzdHlsZWQoSWNvbilgXG4gICAgbWFyZ2luLXJpZ2h0OiA0cHg7XG5gO1xuXG5leHBvcnQgY29uc3QgQ29udGVudCA9IHN0eWxlZChcImRpdlwiKWBcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICAgIHdoaXRlLXNwYWNlOiBub3dyYXA7XG4gICAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgICB3aWR0aDogMTAwJTtcbmA7XG5cbmV4cG9ydCBjb25zdCBUZXh0ID0gc3R5bGVkKFR5cG9ncmFwaHkpYFxuICAgIHdoaXRlLXNwYWNlOiBub3dyYXA7XG4gICAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgICB0ZXh0LW92ZXJmbG93OiBlbGxpcHNpcztcbiAgICBsaW5lLWhlaWdodDogMjRweDtcbiAgICAmLmZvY3VzZWQge1xuICAgICAgICBmb250LXdlaWdodDogNjAwO1xuICAgIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBMb2FkZXJDb250YWluZXIgPSBzdHlsZWQoXCJkaXZcIilgXG4gICAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAgIGhlaWdodDogMjRweDtcbiAgICB3aWR0aDogMjZweDtcbmA7XG4iXX0= */",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });
 var Text = exports.Text = /*#__PURE__*/(0, _base.default)(_Typography.Typography, process.env.NODE_ENV === "production" ? {
-  target: "e1py1adz0"
+  target: "e1py1adz1"
 } : {
-  target: "e1py1adz0",
+  target: "e1py1adz1",
   label: "Text"
 })(process.env.NODE_ENV === "production" ? {
   name: "1nv8pn6",
@@ -77,7 +81,21 @@ var Text = exports.Text = /*#__PURE__*/(0, _base.default)(_Typography.Typography
 } : {
   name: "1nv8pn6",
   styles: "white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:24px;&.focused{font-weight:600;}",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlZC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBb0RzQyIsImZpbGUiOiJzdHlsZWQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBUeXBvZ3JhcGh5IH0gZnJvbSBcIkB3ZWJpbnkvdWkvVHlwb2dyYXBoeVwiO1xuXG50eXBlIENvbnRhaW5lclByb3BzID0ge1xuICAgIGlzRm9jdXNlZDogYm9vbGVhbjtcbn07XG5cbnR5cGUgQXJyb3dJY29uQ29udGFpbmVyUHJvcHMgPSB7XG4gICAgaXNPcGVuOiBib29sZWFuO1xufTtcblxuZXhwb3J0IGNvbnN0IENvbnRhaW5lciA9IHN0eWxlZChcImRpdlwiKTxDb250YWluZXJQcm9wcz5gXG4gICAgZGlzcGxheTogZmxleDtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgIHBhZGRpbmc6IDRweCAwIDRweCA0cHg7XG4gICAgYmFja2dyb3VuZDogJHtwcm9wcyA9PiBwcm9wcy5pc0ZvY3VzZWQgJiYgXCJ2YXIoLS1tZGMtdGhlbWUtb24tYmFja2dyb3VuZClcIn07XG4gICAgY29sb3I6IHZhcigtLXdlYmlueS10aGVtZS1jb2xvci10ZXh0LXNlY29uZGFyeSk7XG4gICAgZmlsbDogY3VycmVudENvbG9yO1xuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICAmOmhvdmVyIC5mb2xkZXItdHJlZS1tZW51LWFjdGlvbiB7XG4gICAgICAgIHZpc2liaWxpdHk6IHZpc2libGU7XG4gICAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IEljb24gPSBzdHlsZWQoXCJkaXZcIilgXG4gICAgZGlzcGxheTogZmxleDtcbiAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICAgIGhlaWdodDogMjRweDtcbiAgICB3aWR0aDogMjRweDtcbiAgICBjdXJzb3I6IHBvaW50ZXI7XG4gICAgZmlsbDogdmFyKC0tbWRjLXRoZW1lLXRleHQtc2Vjb25kYXJ5LW9uLWJhY2tncm91bmQpO1xuYDtcblxuZXhwb3J0IGNvbnN0IEFycm93SWNvbiA9IHN0eWxlZChJY29uKTxBcnJvd0ljb25Db250YWluZXJQcm9wcz5gXG4gICAgdHJhbnNpdGlvbjogdHJhbnNmb3JtIGxpbmVhciAwLjFzO1xuICAgIHRyYW5zZm9ybTogJHtwcm9wcyA9PiAocHJvcHMuaXNPcGVuID8gXCJyb3RhdGUoOTBkZWcpXCIgOiBcInJvdGF0ZSgwZGVnKVwiKX07XG5gO1xuXG5leHBvcnQgY29uc3QgRm9sZGVySWNvbiA9IHN0eWxlZChJY29uKWBcbiAgICBtYXJnaW4tcmlnaHQ6IDRweDtcbmA7XG5cbmV4cG9ydCBjb25zdCBDb250ZW50ID0gc3R5bGVkKFwiZGl2XCIpYFxuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICBjdXJzb3I6IHBvaW50ZXI7XG4gICAgd2hpdGUtc3BhY2U6IG5vd3JhcDtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIHdpZHRoOiAxMDAlO1xuYDtcblxuZXhwb3J0IGNvbnN0IFRleHQgPSBzdHlsZWQoVHlwb2dyYXBoeSlgXG4gICAgd2hpdGUtc3BhY2U6IG5vd3JhcDtcbiAgICBvdmVyZmxvdzogaGlkZGVuO1xuICAgIHRleHQtb3ZlcmZsb3c6IGVsbGlwc2lzO1xuICAgIGxpbmUtaGVpZ2h0OiAyNHB4O1xuICAgICYuZm9jdXNlZCB7XG4gICAgICAgIGZvbnQtd2VpZ2h0OiA2MDA7XG4gICAgfVxuYDtcbiJdfQ== */",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlZC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBdURzQyIsImZpbGUiOiJzdHlsZWQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBUeXBvZ3JhcGh5IH0gZnJvbSBcIkB3ZWJpbnkvdWkvVHlwb2dyYXBoeVwiO1xuXG50eXBlIENvbnRhaW5lclByb3BzID0ge1xuICAgIGlzRm9jdXNlZDogYm9vbGVhbjtcbiAgICBpc0xvYWRpbmc/OiBib29sZWFuO1xufTtcblxudHlwZSBBcnJvd0ljb25Db250YWluZXJQcm9wcyA9IHtcbiAgICBpc09wZW46IGJvb2xlYW47XG59O1xuXG5leHBvcnQgY29uc3QgQ29udGFpbmVyID0gc3R5bGVkKFwiZGl2XCIpPENvbnRhaW5lclByb3BzPmBcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgcGFkZGluZzogNHB4IDAgNHB4IDRweDtcbiAgICBiYWNrZ3JvdW5kOiAke3Byb3BzID0+IHByb3BzLmlzRm9jdXNlZCAmJiAhcHJvcHMuaXNMb2FkaW5nICYmIFwidmFyKC0tbWRjLXRoZW1lLW9uLWJhY2tncm91bmQpXCJ9O1xuICAgIGNvbG9yOiB2YXIoLS13ZWJpbnktdGhlbWUtY29sb3ItdGV4dC1zZWNvbmRhcnkpO1xuICAgIGZpbGw6IGN1cnJlbnRDb2xvcjtcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gICAgb3BhY2l0eTogJHtwcm9wcyA9PiAocHJvcHMuaXNMb2FkaW5nID8gMC41IDogMSl9O1xuICAgIHBvaW50ZXItZXZlbnRzOiAke3Byb3BzID0+IChwcm9wcy5pc0xvYWRpbmcgPyBcIm5vbmVcIiA6IFwiYXV0b1wiKX07XG4gICAgJjpob3ZlciAuZm9sZGVyLXRyZWUtbWVudS1hY3Rpb24ge1xuICAgICAgICB2aXNpYmlsaXR5OiB2aXNpYmxlO1xuICAgIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBJY29uID0gc3R5bGVkKFwiZGl2XCIpYFxuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgICBoZWlnaHQ6IDI0cHg7XG4gICAgd2lkdGg6IDI0cHg7XG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICAgIGZpbGw6IHZhcigtLW1kYy10aGVtZS10ZXh0LXNlY29uZGFyeS1vbi1iYWNrZ3JvdW5kKTtcbmA7XG5cbmV4cG9ydCBjb25zdCBBcnJvd0ljb24gPSBzdHlsZWQoSWNvbik8QXJyb3dJY29uQ29udGFpbmVyUHJvcHM+YFxuICAgIHRyYW5zaXRpb246IHRyYW5zZm9ybSBsaW5lYXIgMC4xcztcbiAgICB0cmFuc2Zvcm06ICR7cHJvcHMgPT4gKHByb3BzLmlzT3BlbiA/IFwicm90YXRlKDkwZGVnKVwiIDogXCJyb3RhdGUoMGRlZylcIil9O1xuYDtcblxuZXhwb3J0IGNvbnN0IEZvbGRlckljb24gPSBzdHlsZWQoSWNvbilgXG4gICAgbWFyZ2luLXJpZ2h0OiA0cHg7XG5gO1xuXG5leHBvcnQgY29uc3QgQ29udGVudCA9IHN0eWxlZChcImRpdlwiKWBcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICAgIHdoaXRlLXNwYWNlOiBub3dyYXA7XG4gICAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgICB3aWR0aDogMTAwJTtcbmA7XG5cbmV4cG9ydCBjb25zdCBUZXh0ID0gc3R5bGVkKFR5cG9ncmFwaHkpYFxuICAgIHdoaXRlLXNwYWNlOiBub3dyYXA7XG4gICAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgICB0ZXh0LW92ZXJmbG93OiBlbGxpcHNpcztcbiAgICBsaW5lLWhlaWdodDogMjRweDtcbiAgICAmLmZvY3VzZWQge1xuICAgICAgICBmb250LXdlaWdodDogNjAwO1xuICAgIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBMb2FkZXJDb250YWluZXIgPSBzdHlsZWQoXCJkaXZcIilgXG4gICAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAgIGhlaWdodDogMjRweDtcbiAgICB3aWR0aDogMjZweDtcbmA7XG4iXX0= */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+var LoaderContainer = exports.LoaderContainer = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
+  target: "e1py1adz0"
+} : {
+  target: "e1py1adz0",
+  label: "LoaderContainer"
+})(process.env.NODE_ENV === "production" ? {
+  name: "h9buf",
+  styles: "position:relative;height:24px;width:26px"
+} : {
+  name: "h9buf",
+  styles: "position:relative;height:24px;width:26px",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInN0eWxlZC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBaUU0QyIsImZpbGUiOiJzdHlsZWQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBUeXBvZ3JhcGh5IH0gZnJvbSBcIkB3ZWJpbnkvdWkvVHlwb2dyYXBoeVwiO1xuXG50eXBlIENvbnRhaW5lclByb3BzID0ge1xuICAgIGlzRm9jdXNlZDogYm9vbGVhbjtcbiAgICBpc0xvYWRpbmc/OiBib29sZWFuO1xufTtcblxudHlwZSBBcnJvd0ljb25Db250YWluZXJQcm9wcyA9IHtcbiAgICBpc09wZW46IGJvb2xlYW47XG59O1xuXG5leHBvcnQgY29uc3QgQ29udGFpbmVyID0gc3R5bGVkKFwiZGl2XCIpPENvbnRhaW5lclByb3BzPmBcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgcGFkZGluZzogNHB4IDAgNHB4IDRweDtcbiAgICBiYWNrZ3JvdW5kOiAke3Byb3BzID0+IHByb3BzLmlzRm9jdXNlZCAmJiAhcHJvcHMuaXNMb2FkaW5nICYmIFwidmFyKC0tbWRjLXRoZW1lLW9uLWJhY2tncm91bmQpXCJ9O1xuICAgIGNvbG9yOiB2YXIoLS13ZWJpbnktdGhlbWUtY29sb3ItdGV4dC1zZWNvbmRhcnkpO1xuICAgIGZpbGw6IGN1cnJlbnRDb2xvcjtcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gICAgb3BhY2l0eTogJHtwcm9wcyA9PiAocHJvcHMuaXNMb2FkaW5nID8gMC41IDogMSl9O1xuICAgIHBvaW50ZXItZXZlbnRzOiAke3Byb3BzID0+IChwcm9wcy5pc0xvYWRpbmcgPyBcIm5vbmVcIiA6IFwiYXV0b1wiKX07XG4gICAgJjpob3ZlciAuZm9sZGVyLXRyZWUtbWVudS1hY3Rpb24ge1xuICAgICAgICB2aXNpYmlsaXR5OiB2aXNpYmxlO1xuICAgIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBJY29uID0gc3R5bGVkKFwiZGl2XCIpYFxuICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgICBoZWlnaHQ6IDI0cHg7XG4gICAgd2lkdGg6IDI0cHg7XG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICAgIGZpbGw6IHZhcigtLW1kYy10aGVtZS10ZXh0LXNlY29uZGFyeS1vbi1iYWNrZ3JvdW5kKTtcbmA7XG5cbmV4cG9ydCBjb25zdCBBcnJvd0ljb24gPSBzdHlsZWQoSWNvbik8QXJyb3dJY29uQ29udGFpbmVyUHJvcHM+YFxuICAgIHRyYW5zaXRpb246IHRyYW5zZm9ybSBsaW5lYXIgMC4xcztcbiAgICB0cmFuc2Zvcm06ICR7cHJvcHMgPT4gKHByb3BzLmlzT3BlbiA/IFwicm90YXRlKDkwZGVnKVwiIDogXCJyb3RhdGUoMGRlZylcIil9O1xuYDtcblxuZXhwb3J0IGNvbnN0IEZvbGRlckljb24gPSBzdHlsZWQoSWNvbilgXG4gICAgbWFyZ2luLXJpZ2h0OiA0cHg7XG5gO1xuXG5leHBvcnQgY29uc3QgQ29udGVudCA9IHN0eWxlZChcImRpdlwiKWBcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICAgIHdoaXRlLXNwYWNlOiBub3dyYXA7XG4gICAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgICB3aWR0aDogMTAwJTtcbmA7XG5cbmV4cG9ydCBjb25zdCBUZXh0ID0gc3R5bGVkKFR5cG9ncmFwaHkpYFxuICAgIHdoaXRlLXNwYWNlOiBub3dyYXA7XG4gICAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgICB0ZXh0LW92ZXJmbG93OiBlbGxpcHNpcztcbiAgICBsaW5lLWhlaWdodDogMjRweDtcbiAgICAmLmZvY3VzZWQge1xuICAgICAgICBmb250LXdlaWdodDogNjAwO1xuICAgIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBMb2FkZXJDb250YWluZXIgPSBzdHlsZWQoXCJkaXZcIilgXG4gICAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAgIGhlaWdodDogMjRweDtcbiAgICB3aWR0aDogMjZweDtcbmA7XG4iXX0= */",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });
 

package/components/FolderTree/Node/styled.js.map

@@ -1 +1 @@
-{"version":3,"names":["_Typography","require","_EMOTION_STRINGIFIED_CSS_ERROR__","Container","exports","_base","default","process","env","NODE_ENV","target","label","props","isFocused","Icon","name","styles","map","toString","ArrowIcon","isOpen","FolderIcon","Content","Text","Typography"],"sources":["styled.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { Typography } from \"@webiny/ui/Typography\";\n\ntype ContainerProps = {\n    isFocused: boolean;\n};\n\ntype ArrowIconContainerProps = {\n    isOpen: boolean;\n};\n\nexport const Container = styled(\"div\")<ContainerProps>`\n    display: flex;\n    align-items: center;\n    padding: 4px 0 4px 4px;\n    background: ${props => props.isFocused && \"var(--mdc-theme-on-background)\"};\n    color: var(--webiny-theme-color-text-secondary);\n    fill: currentColor;\n    position: relative;\n    &:hover .folder-tree-menu-action {\n        visibility: visible;\n    }\n`;\n\nexport const Icon = styled(\"div\")`\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    height: 24px;\n    width: 24px;\n    cursor: pointer;\n    fill: var(--mdc-theme-text-secondary-on-background);\n`;\n\nexport const ArrowIcon = styled(Icon)<ArrowIconContainerProps>`\n    transition: transform linear 0.1s;\n    transform: ${props => (props.isOpen ? \"rotate(90deg)\" : \"rotate(0deg)\")};\n`;\n\nexport const FolderIcon = styled(Icon)`\n    margin-right: 4px;\n`;\n\nexport const Content = styled(\"div\")`\n    display: flex;\n    align-items: center;\n    cursor: pointer;\n    white-space: nowrap;\n    overflow: hidden;\n    width: 100%;\n`;\n\nexport const Text = styled(Typography)`\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    line-height: 24px;\n    &.focused {\n        font-weight: 600;\n    }\n`;\n"],"mappings":";;;;;;;;AACA,IAAAA,WAAA,GAAAC,OAAA;AAAmD,SAAAC,iCAAA;AAU5C,IAAMC,SAAS,GAAAC,OAAA,CAAAD,SAAA,gBAAG,IAAAE,KAAA,CAAAC,OAAA,EAAO,KAAK,EAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,EAAC,sEAIpB,UAAAC,KAAK;EAAA,OAAIA,KAAK,CAACC,SAAS,IAAI,gCAAgC;AAAA,kJAAAN,OAAA,CAAAC,GAAA,CAAAC,QAAA,wsEAO7E;AAEM,IAAMK,IAAI,GAAAV,OAAA,CAAAU,IAAA,gBAAG,IAAAT,KAAA,CAAAC,OAAA,EAAO,KAAK,EAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,EAAC,CAAAJ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAM,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAhB;AAAA,EAQhC;AAEM,IAAMiB,SAAS,GAAAf,OAAA,CAAAe,SAAA,gBAAG,IAAAd,KAAA,CAAAC,OAAA,EAAOQ,IAAI,EAAAP,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,EAAC,gDAEpB,UAAAC,KAAK;EAAA,OAAKA,KAAK,CAACQ,MAAM,GAAG,eAAe,GAAG,cAAc;AAAA,CAAC,SAAAb,OAAA,CAAAC,GAAA,CAAAC,QAAA,4sEAC1E;AAEM,IAAMY,UAAU,GAAAjB,OAAA,CAAAiB,UAAA,gBAAG,IAAAhB,KAAA,CAAAC,OAAA,EAAOQ,IAAI,EAAAP,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,EAAC,CAAAJ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAM,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAhB;AAAA,EAErC;AAEM,IAAMoB,OAAO,GAAAlB,OAAA,CAAAkB,OAAA,gBAAG,IAAAjB,KAAA,CAAAC,OAAA,EAAO,KAAK,EAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,EAAC,CAAAJ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAM,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAhB;AAAA,EAOnC;AAEM,IAAMqB,IAAI,GAAAnB,OAAA,CAAAmB,IAAA,gBAAG,IAAAlB,KAAA,CAAAC,OAAA,EAAOkB,sBAAU,EAAAjB,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,EAAC,CAAAJ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAM,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAhB;AAAA,EAQrC","ignoreList":[]}
+{"version":3,"names":["_Typography","require","_EMOTION_STRINGIFIED_CSS_ERROR__","Container","exports","_base","default","process","env","NODE_ENV","target","label","props","isFocused","isLoading","Icon","name","styles","map","toString","ArrowIcon","isOpen","FolderIcon","Content","Text","Typography","LoaderContainer"],"sources":["styled.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { Typography } from \"@webiny/ui/Typography\";\n\ntype ContainerProps = {\n    isFocused: boolean;\n    isLoading?: boolean;\n};\n\ntype ArrowIconContainerProps = {\n    isOpen: boolean;\n};\n\nexport const Container = styled(\"div\")<ContainerProps>`\n    display: flex;\n    align-items: center;\n    padding: 4px 0 4px 4px;\n    background: ${props => props.isFocused && !props.isLoading && \"var(--mdc-theme-on-background)\"};\n    color: var(--webiny-theme-color-text-secondary);\n    fill: currentColor;\n    position: relative;\n    opacity: ${props => (props.isLoading ? 0.5 : 1)};\n    pointer-events: ${props => (props.isLoading ? \"none\" : \"auto\")};\n    &:hover .folder-tree-menu-action {\n        visibility: visible;\n    }\n`;\n\nexport const Icon = styled(\"div\")`\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    height: 24px;\n    width: 24px;\n    cursor: pointer;\n    fill: var(--mdc-theme-text-secondary-on-background);\n`;\n\nexport const ArrowIcon = styled(Icon)<ArrowIconContainerProps>`\n    transition: transform linear 0.1s;\n    transform: ${props => (props.isOpen ? \"rotate(90deg)\" : \"rotate(0deg)\")};\n`;\n\nexport const FolderIcon = styled(Icon)`\n    margin-right: 4px;\n`;\n\nexport const Content = styled(\"div\")`\n    display: flex;\n    align-items: center;\n    cursor: pointer;\n    white-space: nowrap;\n    overflow: hidden;\n    width: 100%;\n`;\n\nexport const Text = styled(Typography)`\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    line-height: 24px;\n    &.focused {\n        font-weight: 600;\n    }\n`;\n\nexport const LoaderContainer = styled(\"div\")`\n    position: relative;\n    height: 24px;\n    width: 26px;\n`;\n"],"mappings":"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","ignoreList":[]}

package/components/FolderTree/index.js

@@ -18,7 +18,6 @@ var _react = _interopRequireWildcard(require("react"));
 var _Tooltip = require("@webiny/ui/Tooltip");
 var _features = require("../../features");
 var _ButtonCreate = require("./ButtonCreate");
-var _Empty = require("./Empty");
 var _Loader = require("./Loader");
 var _List = require("./List");
 var _styled = require("./styled");
@@ -31,9 +30,9 @@ var FolderTree = exports.FolderTree = function FolderTree(_ref) {
     enableCreate = _ref.enableCreate,
     onFolderClick = _ref.onFolderClick,
     rootFolderLabel = _ref.rootFolderLabel;
-  var _useListFolders = (0, _features.useListFolders)(),
-    loading = _useListFolders.loading,
-    folders = _useListFolders.folders;
+  var _useGetFolderHierarch = (0, _features.useGetFolderHierarchy)(),
+    folders = _useGetFolderHierarch.folders,
+    getIsFolderLoading = _useGetFolderHierarch.getIsFolderLoading;
   var _useGetFolderLevelPer = (0, _features.useGetFolderLevelPermission)("canManageStructure"),
     canManageStructure = _useGetFolderLevelPer.getFolderLevelPermission;
   var localFolders = (0, _react.useMemo)(function () {
@@ -50,7 +49,7 @@ var FolderTree = exports.FolderTree = function FolderTree(_ref) {
     }, []);
   }, [folders]);
   var renderList = function renderList() {
-    if (loading.INIT || loading.LIST) {
+    if (getIsFolderLoading()) {
       return /*#__PURE__*/_react.default.createElement(_Loader.Loader, null);
     }
     var createButton = null;
@@ -65,16 +64,13 @@ var FolderTree = exports.FolderTree = function FolderTree(_ref) {
         }, createButton);
       }
     }
-    if (localFolders.length > 0) {
-      return /*#__PURE__*/_react.default.createElement(_config.AcoWithConfig, null, /*#__PURE__*/_react.default.createElement(_List.List, {
-        folders: localFolders,
-        onFolderClick: onFolderClick,
-        focusedFolderId: focusedFolderId,
-        hiddenFolderIds: hiddenFolderIds,
-        enableActions: enableActions
-      }), enableCreate && createButton);
-    }
-    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Empty.Empty, null), createButton);
+    return /*#__PURE__*/_react.default.createElement(_config.AcoWithConfig, null, /*#__PURE__*/_react.default.createElement(_List.List, {
+      folders: localFolders,
+      onFolderClick: onFolderClick,
+      focusedFolderId: focusedFolderId,
+      hiddenFolderIds: hiddenFolderIds,
+      enableActions: enableActions
+    }), enableCreate && createButton);
   };
   return /*#__PURE__*/_react.default.createElement(_styled.Container, null, renderList());
 };