@webiny/app-aco 5.36.0-beta.1 → 5.36.0-beta.2

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

@@ -1,9 +0,0 @@
-/// <reference types="react" />
-import { FolderItem } from "../../../types";
-interface Props {
-    folder: FolderItem;
-    onUpdateFolder: (data: FolderItem) => void;
-    onDeleteFolder: (data: FolderItem) => void;
-}
-export declare const MenuActions: ({ folder, onUpdateFolder, onDeleteFolder }: Props) => JSX.Element | null;
-export {};

package/components/Tree/MenuActions/index.js

@@ -1,45 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.MenuActions = void 0;
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-var _react = _interopRequireDefault(require("react"));
-var _delete = require("@material-design-icons/svg/outlined/delete.svg");
-var _edit = require("@material-design-icons/svg/outlined/edit.svg");
-var _more_vert = require("@material-design-icons/svg/outlined/more_vert.svg");
-var _i18n = require("@webiny/app/i18n");
-var _Icon = require("@webiny/ui/Icon");
-var _Menu = require("@webiny/ui/Menu");
-var _styled = require("./styled");
-var _templateObject, _templateObject2;
-var t = _i18n.i18n.ns("app-aco/components/tree/menu-actions");
-var MenuActions = function MenuActions(_ref) {
-  var folder = _ref.folder,
-    onUpdateFolder = _ref.onUpdateFolder,
-    onDeleteFolder = _ref.onDeleteFolder;
-  if (folder) {
-    return /*#__PURE__*/_react.default.createElement(_styled.Container, {
-      className: "folder-tree-menu-action"
-    }, /*#__PURE__*/_react.default.createElement(_Menu.Menu, {
-      handle: /*#__PURE__*/_react.default.createElement(_more_vert.ReactComponent, null),
-      renderToPortal: true
-    }, /*#__PURE__*/_react.default.createElement(_Menu.MenuItem, {
-      onClick: function onClick() {
-        return onUpdateFolder(folder);
-      }
-    }, /*#__PURE__*/_react.default.createElement(_styled.ListItemGraphic, null, /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
-      icon: /*#__PURE__*/_react.default.createElement(_edit.ReactComponent, null)
-    })), t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Edit"])))), /*#__PURE__*/_react.default.createElement(_Menu.MenuItem, {
-      onClick: function onClick() {
-        return onDeleteFolder(folder);
-      }
-    }, /*#__PURE__*/_react.default.createElement(_styled.ListItemGraphic, null, /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
-      icon: /*#__PURE__*/_react.default.createElement(_delete.ReactComponent, null)
-    })), t(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["Delete"]))))));
-  }
-  return null;
-};
-exports.MenuActions = MenuActions;

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

@@ -1 +0,0 @@
-{"version":3,"names":["t","i18n","ns","MenuActions","folder","onUpdateFolder","onDeleteFolder"],"sources":["index.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { ReactComponent as Delete } from \"@material-design-icons/svg/outlined/delete.svg\";\nimport { ReactComponent as Edit } from \"@material-design-icons/svg/outlined/edit.svg\";\nimport { ReactComponent as More } from \"@material-design-icons/svg/outlined/more_vert.svg\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { Icon } from \"@webiny/ui/Icon\";\nimport { Menu, MenuItem } from \"@webiny/ui/Menu\";\n\nimport { Container, ListItemGraphic } from \"~/components/Tree/MenuActions/styled\";\n\nimport { FolderItem } from \"~/types\";\n\nconst t = i18n.ns(\"app-aco/components/tree/menu-actions\");\n\ninterface Props {\n    folder: FolderItem;\n    onUpdateFolder: (data: FolderItem) => void;\n    onDeleteFolder: (data: FolderItem) => void;\n}\n\nexport const MenuActions = ({ folder, onUpdateFolder, onDeleteFolder }: Props) => {\n    if (folder) {\n        return (\n            <Container className={\"folder-tree-menu-action\"}>\n                <Menu handle={<More />} renderToPortal={true}>\n                    <MenuItem onClick={() => onUpdateFolder(folder)}>\n                        <ListItemGraphic>\n                            <Icon icon={<Edit />} />\n                        </ListItemGraphic>\n                        {t`Edit`}\n                    </MenuItem>\n                    <MenuItem onClick={() => onDeleteFolder(folder)}>\n                        <ListItemGraphic>\n                            <Icon icon={<Delete />} />\n                        </ListItemGraphic>\n                        {t`Delete`}\n                    </MenuItem>\n                </Menu>\n            </Container>\n        );\n    }\n\n    return null;\n};\n"],"mappings":";;;;;;;;AAAA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAkF;AAIlF,IAAMA,CAAC,GAAGC,UAAI,CAACC,EAAE,CAAC,sCAAsC,CAAC;AAQlD,IAAMC,WAAW,GAAG,SAAdA,WAAW,OAA0D;EAAA,IAApDC,MAAM,QAANA,MAAM;IAAEC,cAAc,QAAdA,cAAc;IAAEC,cAAc,QAAdA,cAAc;EAChE,IAAIF,MAAM,EAAE;IACR,oBACI,6BAAC,iBAAS;MAAC,SAAS,EAAE;IAA0B,gBAC5C,6BAAC,UAAI;MAAC,MAAM,eAAE,6BAAC,yBAAI,OAAI;MAAC,cAAc,EAAE;IAAK,gBACzC,6BAAC,cAAQ;MAAC,OAAO,EAAE;QAAA,OAAMC,cAAc,CAACD,MAAM,CAAC;MAAA;IAAC,gBAC5C,6BAAC,uBAAe,qBACZ,6BAAC,UAAI;MAAC,IAAI,eAAE,6BAAC,oBAAI;IAAI,EAAG,CACV,EACjBJ,CAAC,wFACK,eACX,6BAAC,cAAQ;MAAC,OAAO,EAAE;QAAA,OAAMM,cAAc,CAACF,MAAM,CAAC;MAAA;IAAC,gBAC5C,6BAAC,uBAAe,qBACZ,6BAAC,UAAI;MAAC,IAAI,eAAE,6BAAC,sBAAM;IAAI,EAAG,CACZ,EACjBJ,CAAC,4FACK,CACR,CACC;EAEpB;EAEA,OAAO,IAAI;AACf,CAAC;AAAC"}

package/components/Tree/MenuActions/styled.d.ts

@@ -1,10 +0,0 @@
-/// <reference types="react" />
-/// <reference types="react" />
-/// <reference types="web" />
-export declare const Container: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const ListItemGraphic: import("@emotion/styled").StyledComponent<import("@webiny/ui/List").ListItemGraphicProps & {
-    theme?: import("@emotion/react").Theme | undefined;
-}, {}, {}>;

package/components/Tree/MenuActions/styled.js

@@ -1,19 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ListItemGraphic = exports.Container = void 0;
-var _styled = _interopRequireDefault(require("@emotion/styled"));
-var _List = require("@webiny/ui/List");
-var Container = /*#__PURE__*/(0, _styled.default)("div", {
-  label: "Container",
-  target: "e1t0ug620"
-})("position:absolute;right:8px;visibility:hidden;cursor:pointer;");
-exports.Container = Container;
-var ListItemGraphic = /*#__PURE__*/(0, _styled.default)(_List.ListItemGraphic, {
-  label: "ListItemGraphic",
-  target: "e1t0ug621"
-})("margin-right:8px;");
-exports.ListItemGraphic = ListItemGraphic;

package/components/Tree/MenuActions/styled.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["Container","styled","ListItemGraphic","ListItemGraphicBase"],"sources":["styled.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { ListItemGraphic as ListItemGraphicBase } from \"@webiny/ui/List\";\n\nexport const Container = styled(\"div\")`\n    position: absolute;\n    right: 8px;\n    visibility: hidden;\n    cursor: pointer;\n`;\n\nexport const ListItemGraphic = styled(ListItemGraphicBase)`\n    margin-right: 8px;\n`;\n"],"mappings":";;;;;;;AAAA;AACA;AAEO,IAAMA,SAAS,oBAAGC,eAAM,EAAC,KAAK;EAAA;EAAA;AAAA,mEAKpC;AAAC;AAEK,IAAMC,eAAe,oBAAGD,eAAM,EAACE,qBAAmB;EAAA;EAAA;AAAA,uBAExD;AAAC"}

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

@@ -1,21 +0,0 @@
-/// <reference types="react" />
-import { NodeModel } from "@minoru/react-dnd-treeview";
-import { DndItemData } from "../../../types";
-declare type Props = {
-    node: NodeModel<DndItemData>;
-    depth: number;
-    isOpen: boolean;
-    enableActions?: boolean;
-    onToggle: (id: NodeModel<DndItemData>["id"]) => void;
-    onClick: (data: NodeModel<DndItemData>["data"]) => void;
-    onUpdateFolder: (data: NodeModel<DndItemData>["data"]) => void;
-    onDeleteFolder: (data: NodeModel<DndItemData>["data"]) => void;
-};
-declare type FolderProps = {
-    text: string;
-    isOpen: boolean;
-    isFocused?: boolean;
-};
-export declare const FolderNode: ({ isOpen, isFocused, text }: FolderProps) => JSX.Element;
-export declare const Node: ({ node, depth, isOpen, enableActions, onToggle, onClick, onUpdateFolder, onDeleteFolder }: Props) => JSX.Element;
-export {};

package/components/Tree/Node/index.js

@@ -1,68 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Node = exports.FolderNode = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _arrow_right = require("@material-symbols/svg-400/rounded/arrow_right.svg");
-var _folderFill = require("@material-symbols/svg-400/rounded/folder-fill.svg");
-var _folder_openFill = require("@material-symbols/svg-400/rounded/folder_open-fill.svg");
-var _reactDndTreeview = require("@minoru/react-dnd-treeview");
-var _MenuActions = require("../MenuActions");
-var _styled = require("./styled");
-var FolderNode = function FolderNode(_ref) {
-  var isOpen = _ref.isOpen,
-    isFocused = _ref.isFocused,
-    text = _ref.text;
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styled.FolderIcon, null, isOpen ? /*#__PURE__*/_react.default.createElement(_folder_openFill.ReactComponent, null) : /*#__PURE__*/_react.default.createElement(_folderFill.ReactComponent, null)), /*#__PURE__*/_react.default.createElement(_styled.Text, {
-    className: isFocused ? "focused" : "",
-    use: "body2"
-  }, text));
-};
-exports.FolderNode = FolderNode;
-var Node = function Node(_ref2) {
-  var _node$data, _node$data2;
-  var node = _ref2.node,
-    depth = _ref2.depth,
-    isOpen = _ref2.isOpen,
-    enableActions = _ref2.enableActions,
-    onToggle = _ref2.onToggle,
-    onClick = _ref2.onClick,
-    onUpdateFolder = _ref2.onUpdateFolder,
-    onDeleteFolder = _ref2.onDeleteFolder;
-  // 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 * 24 + 8;
-  var dragOverProps = (0, _reactDndTreeview.useDragOver)(node.id, isOpen, onToggle);
-  var handleToggle = function handleToggle(e) {
-    e.stopPropagation();
-    onToggle(node.id);
-  };
-  var handleClick = function handleClick(e) {
-    e.stopPropagation();
-    onClick(node.data);
-    onToggle(node.id);
-  };
-  return /*#__PURE__*/_react.default.createElement(_styled.Container, Object.assign({
-    isFocused: !!((_node$data = node.data) !== null && _node$data !== void 0 && _node$data.isFocused),
-    style: {
-      paddingInlineStart: indent
-    }
-  }, dragOverProps), /*#__PURE__*/_react.default.createElement(_styled.ArrowIcon, {
-    isOpen: isOpen,
-    onClick: handleToggle
-  }, /*#__PURE__*/_react.default.createElement(_arrow_right.ReactComponent, null)), /*#__PURE__*/_react.default.createElement(_styled.Content, {
-    onClick: handleClick
-  }, /*#__PURE__*/_react.default.createElement(FolderNode, {
-    text: node.text,
-    isOpen: isOpen,
-    isFocused: !!((_node$data2 = node.data) !== null && _node$data2 !== void 0 && _node$data2.isFocused)
-  })), node.data && enableActions && /*#__PURE__*/_react.default.createElement(_MenuActions.MenuActions, {
-    folder: node.data,
-    onUpdateFolder: onUpdateFolder,
-    onDeleteFolder: onDeleteFolder
-  }));
-};
-exports.Node = Node;

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

@@ -1 +0,0 @@
-{"version":3,"names":["FolderNode","isOpen","isFocused","text","Node","node","depth","enableActions","onToggle","onClick","onUpdateFolder","onDeleteFolder","indent","dragOverProps","useDragOver","id","handleToggle","e","stopPropagation","handleClick","data","paddingInlineStart"],"sources":["index.tsx"],"sourcesContent":["import React 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 FolderOpen } from \"@material-symbols/svg-400/rounded/folder_open-fill.svg\";\nimport { NodeModel, useDragOver } from \"@minoru/react-dnd-treeview\";\n\nimport { MenuActions } from \"~/components/Tree/MenuActions\";\n\nimport { Container, ArrowIcon, FolderIcon, Text, Content } from \"./styled\";\n\nimport { DndItemData } from \"~/types\";\n\ntype Props = {\n    node: NodeModel<DndItemData>;\n    depth: number;\n    isOpen: boolean;\n    enableActions?: boolean;\n    onToggle: (id: NodeModel<DndItemData>[\"id\"]) => void;\n    onClick: (data: NodeModel<DndItemData>[\"data\"]) => void;\n    onUpdateFolder: (data: NodeModel<DndItemData>[\"data\"]) => void;\n    onDeleteFolder: (data: NodeModel<DndItemData>[\"data\"]) => void;\n};\n\ntype FolderProps = {\n    text: string;\n    isOpen: boolean;\n    isFocused?: boolean;\n};\n\nexport const FolderNode = ({ isOpen, isFocused, text }: FolderProps) => {\n    return (\n        <>\n            <FolderIcon>{isOpen ? <FolderOpen /> : <Folder />}</FolderIcon>\n            <Text className={isFocused ? \"focused\" : \"\"} use={\"body2\"}>\n                {text}\n            </Text>\n        </>\n    );\n};\n\nexport const Node = ({\n    node,\n    depth,\n    isOpen,\n    enableActions,\n    onToggle,\n    onClick,\n    onUpdateFolder,\n    onDeleteFolder\n}: Props) => {\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 * 24 + 8;\n\n    const dragOverProps = useDragOver(node.id, isOpen, onToggle);\n\n    const handleToggle = (e: React.MouseEvent) => {\n        e.stopPropagation();\n        onToggle(node.id);\n    };\n\n    const handleClick = (e: React.MouseEvent) => {\n        e.stopPropagation();\n        onClick(node.data);\n        onToggle(node.id);\n    };\n\n    return (\n        <Container\n            isFocused={!!node.data?.isFocused}\n            style={{ paddingInlineStart: indent }}\n            {...dragOverProps}\n        >\n            <ArrowIcon isOpen={isOpen} onClick={handleToggle}>\n                <ArrowRight />\n            </ArrowIcon>\n            <Content onClick={handleClick}>\n                <FolderNode text={node.text} isOpen={isOpen} isFocused={!!node.data?.isFocused} />\n            </Content>\n            {node.data && enableActions && (\n                <MenuActions\n                    folder={node.data}\n                    onUpdateFolder={onUpdateFolder}\n                    onDeleteFolder={onDeleteFolder}\n                />\n            )}\n        </Container>\n    );\n};\n"],"mappings":";;;;;;;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AAqBO,IAAMA,UAAU,GAAG,SAAbA,UAAU,OAAiD;EAAA,IAA3CC,MAAM,QAANA,MAAM;IAAEC,SAAS,QAATA,SAAS;IAAEC,IAAI,QAAJA,IAAI;EAChD,oBACI,yEACI,6BAAC,kBAAU,QAAEF,MAAM,gBAAG,6BAAC,+BAAU,OAAG,gBAAG,6BAAC,0BAAM,OAAG,CAAc,eAC/D,6BAAC,YAAI;IAAC,SAAS,EAAEC,SAAS,GAAG,SAAS,GAAG,EAAG;IAAC,GAAG,EAAE;EAAQ,GACrDC,IAAI,CACF,CACR;AAEX,CAAC;AAAC;AAEK,IAAMC,IAAI,GAAG,SAAPA,IAAI,QASJ;EAAA;EAAA,IARTC,IAAI,SAAJA,IAAI;IACJC,KAAK,SAALA,KAAK;IACLL,MAAM,SAANA,MAAM;IACNM,aAAa,SAAbA,aAAa;IACbC,QAAQ,SAARA,QAAQ;IACRC,OAAO,SAAPA,OAAO;IACPC,cAAc,SAAdA,cAAc;IACdC,cAAc,SAAdA,cAAc;EAEd;EACA;EACA,IAAMC,MAAM,GAAGN,KAAK,GAAG,EAAE,GAAG,CAAC;EAE7B,IAAMO,aAAa,GAAG,IAAAC,6BAAW,EAACT,IAAI,CAACU,EAAE,EAAEd,MAAM,EAAEO,QAAQ,CAAC;EAE5D,IAAMQ,YAAY,GAAG,SAAfA,YAAY,CAAIC,CAAmB,EAAK;IAC1CA,CAAC,CAACC,eAAe,EAAE;IACnBV,QAAQ,CAACH,IAAI,CAACU,EAAE,CAAC;EACrB,CAAC;EAED,IAAMI,WAAW,GAAG,SAAdA,WAAW,CAAIF,CAAmB,EAAK;IACzCA,CAAC,CAACC,eAAe,EAAE;IACnBT,OAAO,CAACJ,IAAI,CAACe,IAAI,CAAC;IAClBZ,QAAQ,CAACH,IAAI,CAACU,EAAE,CAAC;EACrB,CAAC;EAED,oBACI,6BAAC,iBAAS;IACN,SAAS,EAAE,CAAC,gBAACV,IAAI,CAACe,IAAI,uCAAT,WAAWlB,SAAS,CAAC;IAClC,KAAK,EAAE;MAAEmB,kBAAkB,EAAET;IAAO;EAAE,GAClCC,aAAa,gBAEjB,6BAAC,iBAAS;IAAC,MAAM,EAAEZ,MAAO;IAAC,OAAO,EAAEe;EAAa,gBAC7C,6BAAC,2BAAU,OAAG,CACN,eACZ,6BAAC,eAAO;IAAC,OAAO,EAAEG;EAAY,gBAC1B,6BAAC,UAAU;IAAC,IAAI,EAAEd,IAAI,CAACF,IAAK;IAAC,MAAM,EAAEF,MAAO;IAAC,SAAS,EAAE,CAAC,iBAACI,IAAI,CAACe,IAAI,wCAAT,YAAWlB,SAAS;EAAC,EAAG,CAC5E,EACTG,IAAI,CAACe,IAAI,IAAIb,aAAa,iBACvB,6BAAC,wBAAW;IACR,MAAM,EAAEF,IAAI,CAACe,IAAK;IAClB,cAAc,EAAEV,cAAe;IAC/B,cAAc,EAAEC;EAAe,EAEtC,CACO;AAEpB,CAAC;AAAC"}

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

@@ -1,43 +0,0 @@
-/// <reference types="react" />
-/// <reference types="react" />
-/// <reference types="web" />
-declare type ContainerProps = {
-    isFocused: boolean;
-};
-declare type ArrowIconContainerProps = {
-    isOpen: boolean;
-};
-export declare const Container: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & ContainerProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const Icon: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const ArrowIcon: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
-    children?: import("react").ReactNode;
-} & {
-    theme?: import("@emotion/react").Theme | undefined;
-} & ArrowIconContainerProps, {}, {}>;
-export declare const FolderIcon: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
-    children?: import("react").ReactNode;
-} & {
-    theme?: import("@emotion/react").Theme | undefined;
-}, {}, {}>;
-export declare const Content: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const Text: import("@emotion/styled").StyledComponent<import("@webiny/ui/Typography/Typography").TypographyProps & {
-    children?: import("react").ReactNode;
-} & {
-    theme?: import("@emotion/react").Theme | undefined;
-}, {}, {}>;
-export {};

package/components/Tree/Node/styled.js

@@ -1,43 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Text = exports.Icon = exports.FolderIcon = exports.Content = exports.Container = exports.ArrowIcon = void 0;
-var _styled = _interopRequireDefault(require("@emotion/styled"));
-var _Typography = require("@webiny/ui/Typography");
-var Container = /*#__PURE__*/(0, _styled.default)("div", {
-  label: "Container",
-  target: "e12afjno0"
-})("display:flex;align-items:center;padding:4px 32px 4px 0;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;}");
-exports.Container = Container;
-var Icon = /*#__PURE__*/(0, _styled.default)("div", {
-  label: "Icon",
-  target: "e12afjno1"
-})("display:flex;align-items:center;justify-content:center;height:24px;width:24px;cursor:pointer;fill:var(--mdc-theme-text-secondary-on-background);");
-exports.Icon = Icon;
-var ArrowIcon = /*#__PURE__*/(0, _styled.default)(Icon, {
-  label: "ArrowIcon",
-  target: "e12afjno2"
-})("transition:transform linear 0.1s;transform:", function (props) {
-  return props.isOpen ? "rotate(90deg)" : "rotate(0deg)";
-}, ";");
-exports.ArrowIcon = ArrowIcon;
-var FolderIcon = /*#__PURE__*/(0, _styled.default)(Icon, {
-  label: "FolderIcon",
-  target: "e12afjno3"
-})("margin-right:4px;");
-exports.FolderIcon = FolderIcon;
-var Content = /*#__PURE__*/(0, _styled.default)("div", {
-  label: "Content",
-  target: "e12afjno4"
-})("display:flex;align-items:center;cursor:pointer;white-space:nowrap;overflow:hidden;width:100%;");
-exports.Content = Content;
-var Text = /*#__PURE__*/(0, _styled.default)(_Typography.Typography, {
-  label: "Text",
-  target: "e12afjno5"
-})("white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:24px;&.focused{font-weight:600;}");
-exports.Text = Text;

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

@@ -1 +0,0 @@
-{"version":3,"names":["Container","styled","props","isFocused","Icon","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 32px 4px 0;\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":";;;;;;;AAAA;AACA;AAUO,IAAMA,SAAS,oBAAGC,eAAM,EAAC,KAAK;EAAA;EAAA;AAAA,yEAInB,UAAAC,KAAK;EAAA,OAAIA,KAAK,CAACC,SAAS,IAAI,gCAAgC;AAAA,+IAO7E;AAAC;AAEK,IAAMC,IAAI,oBAAGH,eAAM,EAAC,KAAK;EAAA;EAAA;AAAA,sJAQ/B;AAAC;AAEK,IAAMI,SAAS,oBAAGJ,eAAM,EAACG,IAAI;EAAA;EAAA;AAAA,kDAEnB,UAAAF,KAAK;EAAA,OAAKA,KAAK,CAACI,MAAM,GAAG,eAAe,GAAG,cAAc;AAAA,CAAC,MAC1E;AAAC;AAEK,IAAMC,UAAU,oBAAGN,eAAM,EAACG,IAAI;EAAA;EAAA;AAAA,uBAEpC;AAAC;AAEK,IAAMI,OAAO,oBAAGP,eAAM,EAAC,KAAK;EAAA;EAAA;AAAA,mGAOlC;AAAC;AAEK,IAAMQ,IAAI,oBAAGR,eAAM,EAACS,sBAAU;EAAA;EAAA;AAAA,4GAQpC;AAAC"}

package/components/Tree/NodePreview/index.d.ts

@@ -1,8 +0,0 @@
-import React from "react";
-import { DragLayerMonitorProps } from "@minoru/react-dnd-treeview";
-import { DndItemData } from "../../../types";
-declare type Props = {
-    monitorProps: DragLayerMonitorProps<DndItemData>;
-};
-export declare const NodePreview: React.FC<Props>;
-export {};

package/components/Tree/NodePreview/index.js

@@ -1,18 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.NodePreview = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _Node = require("../Node");
-var _styled = require("./styled");
-var NodePreview = function NodePreview(props) {
-  var item = props.monitorProps.item;
-  return /*#__PURE__*/_react.default.createElement(_styled.Container, null, /*#__PURE__*/_react.default.createElement(_Node.FolderNode, {
-    text: item.text,
-    isOpen: false
-  }));
-};
-exports.NodePreview = NodePreview;

package/components/Tree/NodePreview/index.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["NodePreview","props","item","monitorProps","text"],"sources":["index.tsx"],"sourcesContent":["import React from \"react\";\nimport { DragLayerMonitorProps } from \"@minoru/react-dnd-treeview\";\n\nimport { FolderNode } from \"~/components/Tree/Node\";\nimport { Container } from \"./styled\";\n\nimport { DndItemData } from \"~/types\";\n\ntype Props = {\n    monitorProps: DragLayerMonitorProps<DndItemData>;\n};\n\nexport const NodePreview: React.FC<Props> = props => {\n    const item = props.monitorProps.item;\n\n    return (\n        <Container>\n            <FolderNode text={item.text} isOpen={false} />\n        </Container>\n    );\n};\n"],"mappings":";;;;;;;AAAA;AAGA;AACA;AAQO,IAAMA,WAA4B,GAAG,SAA/BA,WAA4B,CAAGC,KAAK,EAAI;EACjD,IAAMC,IAAI,GAAGD,KAAK,CAACE,YAAY,CAACD,IAAI;EAEpC,oBACI,6BAAC,iBAAS,qBACN,6BAAC,gBAAU;IAAC,IAAI,EAAEA,IAAI,CAACE,IAAK;IAAC,MAAM,EAAE;EAAM,EAAG,CACtC;AAEpB,CAAC;AAAC"}

package/components/Tree/NodePreview/styled.d.ts

@@ -1,7 +0,0 @@
-/// <reference types="react" />
-/// <reference types="react" />
-/// <reference types="web" />
-export declare const Container: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/components/Tree/NodePreview/styled.js

@@ -1,13 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Container = void 0;
-var _styled = _interopRequireDefault(require("@emotion/styled"));
-var Container = /*#__PURE__*/(0, _styled.default)("div", {
-  label: "Container",
-  target: "e2my8y90"
-})("background-color:var(--webiny-theme-color-primary);border-radius:var(--webiny-theme-border-radius);color:var(--webiny-theme-color-on-primary);fill:currentColor;display:inline-grid;grid-template-columns:auto auto;align-items:center;padding:4px 8px;pointer-events:none;");
-exports.Container = Container;

package/components/Tree/NodePreview/styled.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["Container","styled"],"sources":["styled.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\n\nexport const Container = styled(\"div\")`\n    background-color: var(--webiny-theme-color-primary);\n    border-radius: var(--webiny-theme-border-radius);\n    color: var(--webiny-theme-color-on-primary);\n    fill: currentColor;\n    display: inline-grid;\n    grid-template-columns: auto auto;\n    align-items: center;\n    padding: 4px 8px;\n    pointer-events: none;\n`;\n"],"mappings":";;;;;;;AAAA;AAEO,IAAMA,SAAS,oBAAGC,eAAM,EAAC,KAAK;EAAA;EAAA;AAAA,iRAUpC;AAAC"}

package/components/Tree/Placeholder/index.d.ts

@@ -1,9 +0,0 @@
-/// <reference types="react" />
-import { NodeModel } from "@minoru/react-dnd-treeview";
-import { DndItemData } from "../../../types";
-interface Props {
-    depth: number;
-    node: NodeModel<DndItemData>;
-}
-export declare const Placeholder: ({ depth }: Props) => JSX.Element;
-export {};

package/components/Tree/Placeholder/index.js

@@ -1,21 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Placeholder = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _styled = require("./styled");
-var Placeholder = function Placeholder(_ref) {
-  var depth = _ref.depth;
-  // 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 left = depth * 24 + 8;
-  return /*#__PURE__*/_react.default.createElement(_styled.Element, {
-    style: {
-      left: left
-    }
-  });
-};
-exports.Placeholder = Placeholder;

package/components/Tree/Placeholder/index.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["Placeholder","depth","left"],"sources":["index.tsx"],"sourcesContent":["import { NodeModel } from \"@minoru/react-dnd-treeview\";\nimport React from \"react\";\n\nimport { Element } from \"./styled\";\nimport { DndItemData } from \"~/types\";\n\ninterface Props {\n    depth: number;\n    node: NodeModel<DndItemData>;\n}\n\nexport const Placeholder = ({ depth }: Props) => {\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 left = depth * 24 + 8;\n    return <Element style={{ left }} />;\n};\n"],"mappings":";;;;;;;AACA;AAEA;AAQO,IAAMA,WAAW,GAAG,SAAdA,WAAW,OAAyB;EAAA,IAAnBC,KAAK,QAALA,KAAK;EAC/B;EACA;EACA,IAAMC,IAAI,GAAGD,KAAK,GAAG,EAAE,GAAG,CAAC;EAC3B,oBAAO,6BAAC,eAAO;IAAC,KAAK,EAAE;MAAEC,IAAI,EAAJA;IAAK;EAAE,EAAG;AACvC,CAAC;AAAC"}

package/components/Tree/Placeholder/styled.d.ts

@@ -1,7 +0,0 @@
-/// <reference types="react" />
-/// <reference types="react" />
-/// <reference types="web" />
-export declare const Element: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/components/Tree/Placeholder/styled.js

@@ -1,13 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Element = void 0;
-var _styled = _interopRequireDefault(require("@emotion/styled"));
-var Element = /*#__PURE__*/(0, _styled.default)("div", {
-  label: "Element",
-  target: "ehnecm90"
-})("background-color:var(--webiny-theme-color-primary);height:2px;position:absolute;right:0;top:0;transform:translateY(-50%);");
-exports.Element = Element;

package/components/Tree/Placeholder/styled.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["Element","styled"],"sources":["styled.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\n\nexport const Element = styled(\"div\")`\n    background-color: var(--webiny-theme-color-primary);\n    height: 2px;\n    position: absolute;\n    right: 0;\n    top: 0;\n    transform: translateY(-50%);\n`;\n"],"mappings":";;;;;;;AAAA;AAEO,IAAMA,OAAO,oBAAGC,eAAM,EAAC,KAAK;EAAA;EAAA;AAAA,+HAOlC;AAAC"}

package/components/Tree/Title/index.d.ts

@@ -1,9 +0,0 @@
-/// <reference types="web" />
-import React from "react";
-declare type Props = {
-    title: string;
-    isDragging: boolean;
-    onClick?: (event: React.MouseEvent<HTMLElement>) => void;
-};
-export declare const Title: React.FC<Props>;
-export {};

package/components/Tree/Title/index.js

@@ -1,24 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Title = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _home = require("@material-design-icons/svg/filled/home.svg");
-var _styled = require("./styled");
-var _Typography = require("@webiny/ui/Typography");
-var Title = function Title(_ref) {
-  var title = _ref.title,
-    onClick = _ref.onClick,
-    isDragging = _ref.isDragging;
-  return /*#__PURE__*/_react.default.createElement(_styled.Container, {
-    onClick: onClick,
-    hasClickAction: Boolean(onClick),
-    isDragging: isDragging
-  }, /*#__PURE__*/_react.default.createElement(_styled.IconContainer, null, /*#__PURE__*/_react.default.createElement(_home.ReactComponent, null)), /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
-    use: "subtitle2"
-  }, title));
-};
-exports.Title = Title;

package/components/Tree/Title/index.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["Title","title","onClick","isDragging","Boolean"],"sources":["index.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { ReactComponent as Dashboard } from \"@material-design-icons/svg/filled/home.svg\";\n\nimport { Container, IconContainer } from \"./styled\";\nimport { Typography } from \"@webiny/ui/Typography\";\n\ntype Props = {\n    title: string;\n    isDragging: boolean;\n    onClick?: (event: React.MouseEvent<HTMLElement>) => void;\n};\n\nexport const Title: React.FC<Props> = ({ title, onClick, isDragging }) => {\n    return (\n        <Container onClick={onClick} hasClickAction={Boolean(onClick)} isDragging={isDragging}>\n            <IconContainer>\n                <Dashboard />\n            </IconContainer>\n            <Typography use={\"subtitle2\"}>{title}</Typography>\n        </Container>\n    );\n};\n"],"mappings":";;;;;;;AAAA;AAEA;AAEA;AACA;AAQO,IAAMA,KAAsB,GAAG,SAAzBA,KAAsB,OAAuC;EAAA,IAAjCC,KAAK,QAALA,KAAK;IAAEC,OAAO,QAAPA,OAAO;IAAEC,UAAU,QAAVA,UAAU;EAC/D,oBACI,6BAAC,iBAAS;IAAC,OAAO,EAAED,OAAQ;IAAC,cAAc,EAAEE,OAAO,CAACF,OAAO,CAAE;IAAC,UAAU,EAAEC;EAAW,gBAClF,6BAAC,qBAAa,qBACV,6BAAC,oBAAS,OAAG,CACD,eAChB,6BAAC,sBAAU;IAAC,GAAG,EAAE;EAAY,GAAEF,KAAK,CAAc,CAC1C;AAEpB,CAAC;AAAC"}

package/components/Tree/Title/styled.d.ts

@@ -1,16 +0,0 @@
-/// <reference types="react" />
-/// <reference types="react" />
-/// <reference types="web" />
-declare type ContainerProps = {
-    hasClickAction: boolean;
-    isDragging: boolean;
-};
-export declare const Container: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & ContainerProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const IconContainer: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export {};

package/components/Tree/Title/styled.js

@@ -1,24 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.IconContainer = exports.Container = void 0;
-var _styled = _interopRequireDefault(require("@emotion/styled"));
-var Container = /*#__PURE__*/(0, _styled.default)("div", {
-  label: "Container",
-  target: "eteslgk0"
-})("position:absolute;top:8px;left:0;display:flex;align-items:center;color:var(--webiny-theme-color-text-secondary);fill:currentColor;padding:0 8px 0;cursor:", function (_ref) {
-  var hasClickAction = _ref.hasClickAction;
-  return hasClickAction && "pointer";
-}, ";pointer-events:", function (_ref2) {
-  var isDragging = _ref2.isDragging;
-  return isDragging ? "none" : "auto";
-}, ";");
-exports.Container = Container;
-var IconContainer = /*#__PURE__*/(0, _styled.default)("div", {
-  label: "IconContainer",
-  target: "eteslgk1"
-})("margin-right:4px;height:24px;width:24px;fill:var(--mdc-theme-text-secondary-on-background);");
-exports.IconContainer = IconContainer;

package/components/Tree/Title/styled.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["Container","styled","hasClickAction","isDragging","IconContainer"],"sources":["styled.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\n\ntype ContainerProps = {\n    hasClickAction: boolean;\n    isDragging: boolean;\n};\n\nexport const Container = styled(\"div\")<ContainerProps>`\n    position: absolute;\n    top: 8px;\n    left: 0;\n    display: flex;\n    align-items: center;\n    color: var(--webiny-theme-color-text-secondary);\n    fill: currentColor;\n    padding: 0 8px 0;\n    cursor: ${({ hasClickAction }) => hasClickAction && \"pointer\"};\n    // The title acts like is not there, so user can drag a folder over the title and move it to the root.\n    pointer-events: ${({ isDragging }) => (isDragging ? \"none\" : \"auto\")};\n`;\n\nexport const IconContainer = styled.div`\n    margin-right: 4px;\n    height: 24px;\n    width: 24px;\n    fill: var(--mdc-theme-text-secondary-on-background);\n`;\n"],"mappings":";;;;;;;AAAA;AAOO,IAAMA,SAAS,oBAAGC,eAAM,EAAC,KAAK;EAAA;EAAA;AAAA,gKASvB;EAAA,IAAGC,cAAc,QAAdA,cAAc;EAAA,OAAOA,cAAc,IAAI,SAAS;AAAA,uBAE3C;EAAA,IAAGC,UAAU,SAAVA,UAAU;EAAA,OAAQA,UAAU,GAAG,MAAM,GAAG,MAAM;AAAA,CAAC,MACvE;AAAC;AAEK,IAAMC,aAAa,oBAAGH,eAAM;EAAA;EAAA;AAAA,iGAKlC;AAAC"}

package/components/Tree/index.d.ts

@@ -1,16 +0,0 @@
-/// <reference types="web" />
-import React from "react";
-import { NodeModel } from "@minoru/react-dnd-treeview";
-import { DndItemData } from "../../types";
-declare type Props = {
-    type: string;
-    title: string;
-    onFolderClick: (data: NodeModel<DndItemData>["data"]) => void;
-    enableCreate?: boolean;
-    enableActions?: boolean;
-    onTitleClick?: (event: React.MouseEvent<HTMLElement>) => void;
-    focusedFolderId?: string;
-    hiddenFolderIds?: string[];
-};
-export declare const FolderTree: React.FC<Props>;
-export {};

package/components/Tree/index.js

@@ -1,84 +0,0 @@
-"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.FolderTree = void 0;
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _react = _interopRequireWildcard(require("react"));
-var _useFolders2 = require("../../hooks/useFolders");
-var _ButtonCreate = require("./ButtonCreate");
-var _Empty = require("./Empty");
-var _Loader = require("./Loader");
-var _List = require("./List");
-var _Title = require("./Title");
-var _ = require("./..");
-var _styled = require("./styled");
-var FolderTree = function FolderTree(_ref) {
-  var type = _ref.type,
-    title = _ref.title,
-    focusedFolderId = _ref.focusedFolderId,
-    hiddenFolderIds = _ref.hiddenFolderIds,
-    enableActions = _ref.enableActions,
-    enableCreate = _ref.enableCreate,
-    onFolderClick = _ref.onFolderClick,
-    onTitleClick = _ref.onTitleClick;
-  var _useFolders = (0, _useFolders2.useFolders)(type),
-    folders = _useFolders.folders;
-  var _useState = (0, _react.useState)(false),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    createDialogOpen = _useState2[0],
-    setCreateDialogOpen = _useState2[1];
-
-  // Little CSS trick here: since the folder title has absolute position, user can drag a folder over it and move it to root folder.
-  // While we are moving folders around we disable any title pointer event.
-  var _useState3 = (0, _react.useState)(false),
-    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-    isDragging = _useState4[0],
-    setIsDragging = _useState4[1];
-  var renderList = function renderList() {
-    if (!folders) {
-      return /*#__PURE__*/_react.default.createElement(_Loader.Loader, null);
-    }
-    if (folders.length > 0) {
-      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_List.List, {
-        type: type,
-        folders: folders,
-        onFolderClick: onFolderClick,
-        focusedFolderId: focusedFolderId,
-        hiddenFolderIds: hiddenFolderIds,
-        enableActions: enableActions,
-        onDragStart: function onDragStart() {
-          return setIsDragging(true);
-        },
-        onDragEnd: function onDragEnd() {
-          return setIsDragging(false);
-        }
-      }), enableCreate && /*#__PURE__*/_react.default.createElement(_ButtonCreate.CreateButton, {
-        onClick: function onClick() {
-          return setCreateDialogOpen(true);
-        }
-      }));
-    }
-    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Empty.Empty, null), /*#__PURE__*/_react.default.createElement(_ButtonCreate.CreateButton, {
-      onClick: function onClick() {
-        return setCreateDialogOpen(true);
-      }
-    }));
-  };
-  return /*#__PURE__*/_react.default.createElement(_styled.Container, null, /*#__PURE__*/_react.default.createElement(_Title.Title, {
-    title: title,
-    onClick: onTitleClick,
-    isDragging: isDragging
-  }), renderList(), enableCreate && /*#__PURE__*/_react.default.createElement(_.FolderDialogCreate, {
-    type: type,
-    open: createDialogOpen,
-    onClose: function onClose() {
-      return setCreateDialogOpen(false);
-    },
-    currentParentId: undefined
-  }));
-};
-exports.FolderTree = FolderTree;