@webiny/app-file-manager 6.0.0-beta.0 → 6.0.0-rc.0

package/components/Table/Cells/CellName.js

@@ -1,61 +1,68 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.FolderCellName = exports.FileCellName = exports.CellName = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _folder = require("@material-design-icons/svg/outlined/folder.svg");
-var _folder_shared = require("@material-design-icons/svg/outlined/folder_shared.svg");
-var _insert_photo = require("@material-design-icons/svg/outlined/insert_photo.svg");
-var _description = require("@material-design-icons/svg/outlined/description.svg");
-var _Cells = require("./Cells.styled");
-var _FileManagerViewProvider = require("../../../modules/FileManagerRenderer/FileManagerViewProvider");
-var _FileManagerViewConfig = require("../../../modules/FileManagerRenderer/FileManagerView/FileManagerViewConfig");
-var FolderCellName = exports.FolderCellName = function FolderCellName(_ref) {
-  var folder = _ref.folder,
-    _onClick = _ref.onClick;
-  var icon = /*#__PURE__*/_react.default.createElement(_folder.ReactComponent, null);
+import React from "react";
+import { FolderIcon, FolderSharedIcon } from "@webiny/app-aco";
+import { useFileManagerView } from "../../../modules/FileManagerRenderer/FileManagerViewProvider/index.js";
+import { FileManagerViewConfig } from "../../../modules/FileManagerRenderer/FileManagerView/FileManagerViewConfig.js";
+import { cn, Text } from "@webiny/admin-ui";
+import { CellThumbnail } from "./CellThumbnail.js";
+import { FileProvider } from "../../../contexts/FileProvider.js";
+export const FolderCellName = ({
+  folder,
+  onClick
+}) => {
+  let icon = /*#__PURE__*/React.createElement(FolderIcon, {
+    width: 32,
+    height: 32
+  });
   if (folder.hasNonInheritedPermissions && folder.canManagePermissions) {
-    icon = /*#__PURE__*/_react.default.createElement(_folder_shared.ReactComponent, null);
+    icon = /*#__PURE__*/React.createElement(FolderSharedIcon, {
+      width: 32,
+      height: 32
+    });
   }
-  return /*#__PURE__*/_react.default.createElement(_Cells.RowTitle, {
-    onClick: function onClick() {
-      return _onClick(folder.id);
-    }
-  }, /*#__PURE__*/_react.default.createElement(_Cells.RowIcon, null, icon), /*#__PURE__*/_react.default.createElement(_Cells.RowText, {
-    use: "subtitle2"
+  return /*#__PURE__*/React.createElement("div", {
+    className: cn(["flex items-center gap-md", "truncate cursor-pointer font-semibold", "hover:underline"]),
+    onClick: () => onClick(folder.id)
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "size-xl rounded-md overflow-hidden shrink-0"
+  }, icon), /*#__PURE__*/React.createElement(Text, {
+    className: "truncate min-w-0 shrink"
   }, folder.title));
 };
-var FileCellName = exports.FileCellName = function FileCellName(_ref2) {
-  var file = _ref2.file,
-    _onClick2 = _ref2.onClick;
-  return /*#__PURE__*/_react.default.createElement(_Cells.RowTitle, {
-    onClick: function onClick() {
-      return _onClick2(file.id);
-    }
-  }, /*#__PURE__*/_react.default.createElement(_Cells.RowIcon, null, file.type && file.type.includes("image") ? /*#__PURE__*/_react.default.createElement(_insert_photo.ReactComponent, null) : /*#__PURE__*/_react.default.createElement(_description.ReactComponent, null)), /*#__PURE__*/_react.default.createElement(_Cells.RowText, {
-    use: "subtitle2"
+export const FileCellName = ({
+  file,
+  onClick
+}) => {
+  return /*#__PURE__*/React.createElement("div", {
+    className: cn(["flex items-center gap-md", "truncate cursor-pointer", "hover:underline"]),
+    onClick: () => onClick(file.id)
+  }, /*#__PURE__*/React.createElement(FileProvider, {
+    file: file
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "size-xl aspect-square rounded-md bg-neutral-muted overflow-hidden shrink-0"
+  }, /*#__PURE__*/React.createElement(CellThumbnail, null))), /*#__PURE__*/React.createElement(Text, {
+    className: "truncate min-w-0 shrink"
   }, file.name));
 };
-var CellName = exports.CellName = function CellName() {
-  var _FileManagerViewConfi = _FileManagerViewConfig.FileManagerViewConfig.Browser.Table.Column,
-    useTableRow = _FileManagerViewConfi.useTableRow,
-    isFolderRow = _FileManagerViewConfi.isFolderRow;
-  var _useTableRow = useTableRow(),
-    row = _useTableRow.row;
-  var _useFileManagerView = (0, _FileManagerViewProvider.useFileManagerView)(),
-    showFileDetails = _useFileManagerView.showFileDetails,
-    setFolderId = _useFileManagerView.setFolderId;
+export const CellName = () => {
+  const {
+    useTableRow,
+    isFolderRow
+  } = FileManagerViewConfig.Browser.Table.Column;
+  const {
+    row
+  } = useTableRow();
+  const {
+    showFileDetails,
+    setFolderId
+  } = useFileManagerView();
   if (isFolderRow(row)) {
-    return /*#__PURE__*/_react.default.createElement(FolderCellName, {
-      folder: row,
+    return /*#__PURE__*/React.createElement(FolderCellName, {
+      folder: row.data,
       onClick: setFolderId
     });
   }
-  return /*#__PURE__*/_react.default.createElement(FileCellName, {
-    file: row,
+  return /*#__PURE__*/React.createElement(FileCellName, {
+    file: row.data,
     onClick: showFileDetails
   });
 };

package/components/Table/Cells/CellName.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_folder","_folder_shared","_insert_photo","_description","_Cells","_FileManagerViewProvider","_FileManagerViewConfig","FolderCellName","exports","_ref","folder","onClick","icon","default","createElement","ReactComponent","hasNonInheritedPermissions","canManagePermissions","RowTitle","id","RowIcon","RowText","use","title","FileCellName","_ref2","file","type","includes","name","CellName","_FileManagerViewConfi","FileManagerViewConfig","Browser","Table","Column","useTableRow","isFolderRow","_useTableRow","row","_useFileManagerView","useFileManagerView","showFileDetails","setFolderId"],"sources":["CellName.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { ReactComponent as Folder } from \"@material-design-icons/svg/outlined/folder.svg\";\nimport { ReactComponent as FolderShared } from \"@material-design-icons/svg/outlined/folder_shared.svg\";\nimport { ReactComponent as Image } from \"@material-design-icons/svg/outlined/insert_photo.svg\";\nimport { ReactComponent as File } from \"@material-design-icons/svg/outlined/description.svg\";\n\nimport { RowIcon, RowText, RowTitle } from \"./Cells.styled\";\nimport { useFileManagerView } from \"~/modules/FileManagerRenderer/FileManagerViewProvider\";\nimport { FileManagerViewConfig } from \"~/modules/FileManagerRenderer/FileManagerView/FileManagerViewConfig\";\nimport { FileTableItem } from \"~/types\";\nimport { FolderTableItem } from \"@webiny/app-aco/types\";\n\ninterface DefaultProps {\n    onClick: (id: string) => void;\n}\n\ninterface FolderCellNameProps extends DefaultProps {\n    folder: FolderTableItem;\n}\n\nexport const FolderCellName = ({ folder, onClick }: FolderCellNameProps) => {\n    let icon = <Folder />;\n    if (folder.hasNonInheritedPermissions && folder.canManagePermissions) {\n        icon = <FolderShared />;\n    }\n\n    return (\n        <RowTitle onClick={() => onClick(folder.id)}>\n            <RowIcon>{icon}</RowIcon>\n            <RowText use={\"subtitle2\"}>{folder.title}</RowText>\n        </RowTitle>\n    );\n};\n\ninterface FileCellNameProps extends DefaultProps {\n    file: FileTableItem;\n}\n\nexport const FileCellName = ({ file, onClick }: FileCellNameProps) => {\n    return (\n        <RowTitle onClick={() => onClick(file.id)}>\n            <RowIcon>{file.type && file.type.includes(\"image\") ? <Image /> : <File />}</RowIcon>\n            <RowText use={\"subtitle2\"}>{file.name}</RowText>\n        </RowTitle>\n    );\n};\n\nexport const CellName = () => {\n    const { useTableRow, isFolderRow } = FileManagerViewConfig.Browser.Table.Column;\n    const { row } = useTableRow();\n    const { showFileDetails, setFolderId } = useFileManagerView();\n\n    if (isFolderRow(row)) {\n        return <FolderCellName folder={row} onClick={setFolderId} />;\n    }\n\n    return <FileCellName file={row} onClick={showFileDetails} />;\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","FolderIcon","FolderSharedIcon","useFileManagerView","FileManagerViewConfig","cn","Text","CellThumbnail","FileProvider","FolderCellName","folder","onClick","icon","createElement","width","height","hasNonInheritedPermissions","canManagePermissions","className","id","title","FileCellName","file","name","CellName","useTableRow","isFolderRow","Browser","Table","Column","row","showFileDetails","setFolderId","data"],"sources":["CellName.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { FolderIcon, FolderSharedIcon } from \"@webiny/app-aco\";\nimport { useFileManagerView } from \"~/modules/FileManagerRenderer/FileManagerViewProvider/index.js\";\nimport { FileManagerViewConfig } from \"~/modules/FileManagerRenderer/FileManagerView/FileManagerViewConfig.js\";\nimport { cn, Text } from \"@webiny/admin-ui\";\nimport { CellThumbnail } from \"./CellThumbnail.js\";\nimport { FileProvider } from \"~/contexts/FileProvider.js\";\nimport type { FileItem } from \"~/types.js\";\nimport type { FolderDto } from \"@webiny/app-aco\";\n\ninterface DefaultProps {\n    onClick: (id: string) => void;\n}\n\ninterface FolderCellNameProps extends DefaultProps {\n    folder: FolderDto;\n}\n\nexport const FolderCellName = ({ folder, onClick }: FolderCellNameProps) => {\n    let icon = <FolderIcon width={32} height={32} />;\n    if (folder.hasNonInheritedPermissions && folder.canManagePermissions) {\n        icon = <FolderSharedIcon width={32} height={32} />;\n    }\n\n    return (\n        <div\n            className={cn([\n                \"flex items-center gap-md\",\n                \"truncate cursor-pointer font-semibold\",\n                \"hover:underline\"\n            ])}\n            onClick={() => onClick(folder.id)}\n        >\n            <div className={\"size-xl rounded-md overflow-hidden shrink-0\"}>{icon}</div>\n            <Text className={\"truncate min-w-0 shrink\"}>{folder.title}</Text>\n        </div>\n    );\n};\n\ninterface FileCellNameProps extends DefaultProps {\n    file: FileItem;\n}\n\nexport const FileCellName = ({ file, onClick }: FileCellNameProps) => {\n    return (\n        <div\n            className={cn([\n                \"flex items-center gap-md\",\n                \"truncate cursor-pointer\",\n                \"hover:underline\"\n            ])}\n            onClick={() => onClick(file.id)}\n        >\n            <FileProvider file={file}>\n                <div\n                    className={\n                        \"size-xl aspect-square rounded-md bg-neutral-muted overflow-hidden shrink-0\"\n                    }\n                >\n                    <CellThumbnail />\n                </div>\n            </FileProvider>\n            <Text className={\"truncate min-w-0 shrink\"}>{file.name}</Text>\n        </div>\n    );\n};\n\nexport const CellName = () => {\n    const { useTableRow, isFolderRow } = FileManagerViewConfig.Browser.Table.Column;\n    const { row } = useTableRow();\n    const { showFileDetails, setFolderId } = useFileManagerView();\n\n    if (isFolderRow(row)) {\n        return <FolderCellName folder={row.data} onClick={setFolderId} />;\n    }\n\n    return <FileCellName file={row.data} onClick={showFileDetails} />;\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,UAAU,EAAEC,gBAAgB,QAAQ,iBAAiB;AAC9D,SAASC,kBAAkB;AAC3B,SAASC,qBAAqB;AAC9B,SAASC,EAAE,EAAEC,IAAI,QAAQ,kBAAkB;AAC3C,SAASC,aAAa;AACtB,SAASC,YAAY;AAYrB,OAAO,MAAMC,cAAc,GAAGA,CAAC;EAAEC,MAAM;EAAEC;AAA6B,CAAC,KAAK;EACxE,IAAIC,IAAI,gBAAGZ,KAAA,CAAAa,aAAA,CAACZ,UAAU;IAACa,KAAK,EAAE,EAAG;IAACC,MAAM,EAAE;EAAG,CAAE,CAAC;EAChD,IAAIL,MAAM,CAACM,0BAA0B,IAAIN,MAAM,CAACO,oBAAoB,EAAE;IAClEL,IAAI,gBAAGZ,KAAA,CAAAa,aAAA,CAACX,gBAAgB;MAACY,KAAK,EAAE,EAAG;MAACC,MAAM,EAAE;IAAG,CAAE,CAAC;EACtD;EAEA,oBACIf,KAAA,CAAAa,aAAA;IACIK,SAAS,EAAEb,EAAE,CAAC,CACV,0BAA0B,EAC1B,uCAAuC,EACvC,iBAAiB,CACpB,CAAE;IACHM,OAAO,EAAEA,CAAA,KAAMA,OAAO,CAACD,MAAM,CAACS,EAAE;EAAE,gBAElCnB,KAAA,CAAAa,aAAA;IAAKK,SAAS,EAAE;EAA8C,GAAEN,IAAU,CAAC,eAC3EZ,KAAA,CAAAa,aAAA,CAACP,IAAI;IAACY,SAAS,EAAE;EAA0B,GAAER,MAAM,CAACU,KAAY,CAC/D,CAAC;AAEd,CAAC;AAMD,OAAO,MAAMC,YAAY,GAAGA,CAAC;EAAEC,IAAI;EAAEX;AAA2B,CAAC,KAAK;EAClE,oBACIX,KAAA,CAAAa,aAAA;IACIK,SAAS,EAAEb,EAAE,CAAC,CACV,0BAA0B,EAC1B,yBAAyB,EACzB,iBAAiB,CACpB,CAAE;IACHM,OAAO,EAAEA,CAAA,KAAMA,OAAO,CAACW,IAAI,CAACH,EAAE;EAAE,gBAEhCnB,KAAA,CAAAa,aAAA,CAACL,YAAY;IAACc,IAAI,EAAEA;EAAK,gBACrBtB,KAAA,CAAAa,aAAA;IACIK,SAAS,EACL;EACH,gBAEDlB,KAAA,CAAAa,aAAA,CAACN,aAAa,MAAE,CACf,CACK,CAAC,eACfP,KAAA,CAAAa,aAAA,CAACP,IAAI;IAACY,SAAS,EAAE;EAA0B,GAAEI,IAAI,CAACC,IAAW,CAC5D,CAAC;AAEd,CAAC;AAED,OAAO,MAAMC,QAAQ,GAAGA,CAAA,KAAM;EAC1B,MAAM;IAAEC,WAAW;IAAEC;EAAY,CAAC,GAAGtB,qBAAqB,CAACuB,OAAO,CAACC,KAAK,CAACC,MAAM;EAC/E,MAAM;IAAEC;EAAI,CAAC,GAAGL,WAAW,CAAC,CAAC;EAC7B,MAAM;IAAEM,eAAe;IAAEC;EAAY,CAAC,GAAG7B,kBAAkB,CAAC,CAAC;EAE7D,IAAIuB,WAAW,CAACI,GAAG,CAAC,EAAE;IAClB,oBAAO9B,KAAA,CAAAa,aAAA,CAACJ,cAAc;MAACC,MAAM,EAAEoB,GAAG,CAACG,IAAK;MAACtB,OAAO,EAAEqB;IAAY,CAAE,CAAC;EACrE;EAEA,oBAAOhC,KAAA,CAAAa,aAAA,CAACQ,YAAY;IAACC,IAAI,EAAEQ,GAAG,CAACG,IAAK;IAACtB,OAAO,EAAEoB;EAAgB,CAAE,CAAC;AACrE,CAAC","ignoreList":[]}

package/components/Table/Cells/CellSize.js

@@ -1,23 +1,18 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.CellSize = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _bytes = _interopRequireDefault(require("bytes"));
-var _FileManagerViewConfig = require("../../../modules/FileManagerRenderer/FileManagerView/FileManagerViewConfig");
-var CellSize = exports.CellSize = function CellSize() {
-  var _FileManagerViewConfi = _FileManagerViewConfig.FileManagerViewConfig.Browser.Table.Column,
-    useTableRow = _FileManagerViewConfi.useTableRow,
-    isFolderRow = _FileManagerViewConfi.isFolderRow;
-  var _useTableRow = useTableRow(),
-    row = _useTableRow.row;
+import React from "react";
+import bytes from "bytes";
+import { FileManagerViewConfig } from "../../../modules/FileManagerRenderer/FileManagerView/FileManagerViewConfig.js";
+export const CellSize = () => {
+  const {
+    useTableRow,
+    isFolderRow
+  } = FileManagerViewConfig.Browser.Table.Column;
+  const {
+    row
+  } = useTableRow();
   if (isFolderRow(row)) {
-    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "-");
+    return /*#__PURE__*/React.createElement(React.Fragment, null, "-");
   }
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, _bytes.default.format(row.size, {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, bytes.format(row.data.size, {
     unitSeparator: " "
   }));
 };

package/components/Table/Cells/CellSize.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_bytes","_FileManagerViewConfig","CellSize","exports","_FileManagerViewConfi","FileManagerViewConfig","Browser","Table","Column","useTableRow","isFolderRow","_useTableRow","row","default","createElement","Fragment","bytes","format","size","unitSeparator"],"sources":["CellSize.tsx"],"sourcesContent":["import React from \"react\";\nimport bytes from \"bytes\";\nimport { FileManagerViewConfig } from \"~/modules/FileManagerRenderer/FileManagerView/FileManagerViewConfig\";\n\nexport const CellSize = () => {\n    const { useTableRow, isFolderRow } = FileManagerViewConfig.Browser.Table.Column;\n    const { row } = useTableRow();\n\n    if (isFolderRow(row)) {\n        return <>{\"-\"}</>;\n    }\n\n    return <>{bytes.format(row.size, { unitSeparator: \" \" })}</>;\n};\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,MAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,sBAAA,GAAAF,OAAA;AAEO,IAAMG,QAAQ,GAAAC,OAAA,CAAAD,QAAA,GAAG,SAAXA,QAAQA,CAAA,EAAS;EAC1B,IAAAE,qBAAA,GAAqCC,4CAAqB,CAACC,OAAO,CAACC,KAAK,CAACC,MAAM;IAAvEC,WAAW,GAAAL,qBAAA,CAAXK,WAAW;IAAEC,WAAW,GAAAN,qBAAA,CAAXM,WAAW;EAChC,IAAAC,YAAA,GAAgBF,WAAW,CAAC,CAAC;IAArBG,GAAG,GAAAD,YAAA,CAAHC,GAAG;EAEX,IAAIF,WAAW,CAACE,GAAG,CAAC,EAAE;IAClB,oBAAOf,MAAA,CAAAgB,OAAA,CAAAC,aAAA,CAAAjB,MAAA,CAAAgB,OAAA,CAAAE,QAAA,QAAG,GAAM,CAAC;EACrB;EAEA,oBAAOlB,MAAA,CAAAgB,OAAA,CAAAC,aAAA,CAAAjB,MAAA,CAAAgB,OAAA,CAAAE,QAAA,QAAGC,cAAK,CAACC,MAAM,CAACL,GAAG,CAACM,IAAI,EAAE;IAAEC,aAAa,EAAE;EAAI,CAAC,CAAI,CAAC;AAChE,CAAC","ignoreList":[]}
+{"version":3,"names":["React","bytes","FileManagerViewConfig","CellSize","useTableRow","isFolderRow","Browser","Table","Column","row","createElement","Fragment","format","data","size","unitSeparator"],"sources":["CellSize.tsx"],"sourcesContent":["import React from \"react\";\nimport bytes from \"bytes\";\nimport { FileManagerViewConfig } from \"~/modules/FileManagerRenderer/FileManagerView/FileManagerViewConfig.js\";\n\nexport const CellSize = () => {\n    const { useTableRow, isFolderRow } = FileManagerViewConfig.Browser.Table.Column;\n    const { row } = useTableRow();\n\n    if (isFolderRow(row)) {\n        return <>{\"-\"}</>;\n    }\n\n    return <>{bytes.format(row.data.size, { unitSeparator: \" \" })}</>;\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,KAAK,MAAM,OAAO;AACzB,SAASC,qBAAqB;AAE9B,OAAO,MAAMC,QAAQ,GAAGA,CAAA,KAAM;EAC1B,MAAM;IAAEC,WAAW;IAAEC;EAAY,CAAC,GAAGH,qBAAqB,CAACI,OAAO,CAACC,KAAK,CAACC,MAAM;EAC/E,MAAM;IAAEC;EAAI,CAAC,GAAGL,WAAW,CAAC,CAAC;EAE7B,IAAIC,WAAW,CAACI,GAAG,CAAC,EAAE;IAClB,oBAAOT,KAAA,CAAAU,aAAA,CAAAV,KAAA,CAAAW,QAAA,QAAG,GAAM,CAAC;EACrB;EAEA,oBAAOX,KAAA,CAAAU,aAAA,CAAAV,KAAA,CAAAW,QAAA,QAAGV,KAAK,CAACW,MAAM,CAACH,GAAG,CAACI,IAAI,CAACC,IAAI,EAAE;IAAEC,aAAa,EAAE;EAAI,CAAC,CAAI,CAAC;AACrE,CAAC","ignoreList":[]}

package/components/Table/Cells/CellThumbnail.d.ts

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

package/components/Table/Cells/CellThumbnail.js

@@ -0,0 +1,16 @@
+import React from "react";
+import { useFile } from "../../../hooks/useFile.js";
+import { useFileManagerViewConfig } from "../../../index.js";
+export const CellThumbnail = () => {
+  const {
+    file
+  } = useFile();
+  const {
+    browser,
+    getThumbnailRenderer
+  } = useFileManagerViewConfig();
+  const renderer = getThumbnailRenderer(browser.table.cellThumbnails, file);
+  return /*#__PURE__*/React.createElement(React.Fragment, null, renderer?.element || null);
+};
+
+//# sourceMappingURL=CellThumbnail.js.map

package/components/Table/Cells/CellThumbnail.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useFile","useFileManagerViewConfig","CellThumbnail","file","browser","getThumbnailRenderer","renderer","table","cellThumbnails","createElement","Fragment","element"],"sources":["CellThumbnail.tsx"],"sourcesContent":["import React from \"react\";\nimport { useFile } from \"~/hooks/useFile.js\";\nimport { useFileManagerViewConfig } from \"~/index.js\";\n\nexport const CellThumbnail = () => {\n    const { file } = useFile();\n    const { browser, getThumbnailRenderer } = useFileManagerViewConfig();\n\n    const renderer = getThumbnailRenderer(browser.table.cellThumbnails, file);\n\n    return <>{renderer?.element || null}</>;\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,OAAO;AAChB,SAASC,wBAAwB;AAEjC,OAAO,MAAMC,aAAa,GAAGA,CAAA,KAAM;EAC/B,MAAM;IAAEC;EAAK,CAAC,GAAGH,OAAO,CAAC,CAAC;EAC1B,MAAM;IAAEI,OAAO;IAAEC;EAAqB,CAAC,GAAGJ,wBAAwB,CAAC,CAAC;EAEpE,MAAMK,QAAQ,GAAGD,oBAAoB,CAACD,OAAO,CAACG,KAAK,CAACC,cAAc,EAAEL,IAAI,CAAC;EAEzE,oBAAOJ,KAAA,CAAAU,aAAA,CAAAV,KAAA,CAAAW,QAAA,QAAGJ,QAAQ,EAAEK,OAAO,IAAI,IAAO,CAAC;AAC3C,CAAC","ignoreList":[]}

package/components/Table/Cells/CellType.js

@@ -1,22 +1,17 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.CellType = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _FileManagerViewConfig = require("../../../modules/FileManagerRenderer/FileManagerView/FileManagerViewConfig");
-var CellType = exports.CellType = function CellType() {
-  var _FileManagerViewConfi = _FileManagerViewConfig.FileManagerViewConfig.Browser.Table.Column,
-    useTableRow = _FileManagerViewConfi.useTableRow,
-    isFolderRow = _FileManagerViewConfi.isFolderRow;
-  var _useTableRow = useTableRow(),
-    row = _useTableRow.row;
+import React from "react";
+import { FileManagerViewConfig } from "../../../modules/FileManagerRenderer/FileManagerView/FileManagerViewConfig.js";
+export const CellType = () => {
+  const {
+    useTableRow,
+    isFolderRow
+  } = FileManagerViewConfig.Browser.Table.Column;
+  const {
+    row
+  } = useTableRow();
   if (isFolderRow(row)) {
-    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "-");
+    return /*#__PURE__*/React.createElement(React.Fragment, null, "-");
   }
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, row.type);
+  return /*#__PURE__*/React.createElement(React.Fragment, null, row.data.type);
 };
 
 //# sourceMappingURL=CellType.js.map

package/components/Table/Cells/CellType.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_FileManagerViewConfig","CellType","exports","_FileManagerViewConfi","FileManagerViewConfig","Browser","Table","Column","useTableRow","isFolderRow","_useTableRow","row","default","createElement","Fragment","type"],"sources":["CellType.tsx"],"sourcesContent":["import React from \"react\";\nimport { FileManagerViewConfig } from \"~/modules/FileManagerRenderer/FileManagerView/FileManagerViewConfig\";\n\nexport const CellType = () => {\n    const { useTableRow, isFolderRow } = FileManagerViewConfig.Browser.Table.Column;\n    const { row } = useTableRow();\n\n    if (isFolderRow(row)) {\n        return <>{\"-\"}</>;\n    }\n\n    return <>{row.type}</>;\n};\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,sBAAA,GAAAD,OAAA;AAEO,IAAME,QAAQ,GAAAC,OAAA,CAAAD,QAAA,GAAG,SAAXA,QAAQA,CAAA,EAAS;EAC1B,IAAAE,qBAAA,GAAqCC,4CAAqB,CAACC,OAAO,CAACC,KAAK,CAACC,MAAM;IAAvEC,WAAW,GAAAL,qBAAA,CAAXK,WAAW;IAAEC,WAAW,GAAAN,qBAAA,CAAXM,WAAW;EAChC,IAAAC,YAAA,GAAgBF,WAAW,CAAC,CAAC;IAArBG,GAAG,GAAAD,YAAA,CAAHC,GAAG;EAEX,IAAIF,WAAW,CAACE,GAAG,CAAC,EAAE;IAClB,oBAAOd,MAAA,CAAAe,OAAA,CAAAC,aAAA,CAAAhB,MAAA,CAAAe,OAAA,CAAAE,QAAA,QAAG,GAAM,CAAC;EACrB;EAEA,oBAAOjB,MAAA,CAAAe,OAAA,CAAAC,aAAA,CAAAhB,MAAA,CAAAe,OAAA,CAAAE,QAAA,QAAGH,GAAG,CAACI,IAAO,CAAC;AAC1B,CAAC","ignoreList":[]}
+{"version":3,"names":["React","FileManagerViewConfig","CellType","useTableRow","isFolderRow","Browser","Table","Column","row","createElement","Fragment","data","type"],"sources":["CellType.tsx"],"sourcesContent":["import React from \"react\";\nimport { FileManagerViewConfig } from \"~/modules/FileManagerRenderer/FileManagerView/FileManagerViewConfig.js\";\n\nexport const CellType = () => {\n    const { useTableRow, isFolderRow } = FileManagerViewConfig.Browser.Table.Column;\n    const { row } = useTableRow();\n\n    if (isFolderRow(row)) {\n        return <>{\"-\"}</>;\n    }\n\n    return <>{row.data.type}</>;\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,qBAAqB;AAE9B,OAAO,MAAMC,QAAQ,GAAGA,CAAA,KAAM;EAC1B,MAAM;IAAEC,WAAW;IAAEC;EAAY,CAAC,GAAGH,qBAAqB,CAACI,OAAO,CAACC,KAAK,CAACC,MAAM;EAC/E,MAAM;IAAEC;EAAI,CAAC,GAAGL,WAAW,CAAC,CAAC;EAE7B,IAAIC,WAAW,CAACI,GAAG,CAAC,EAAE;IAClB,oBAAOR,KAAA,CAAAS,aAAA,CAAAT,KAAA,CAAAU,QAAA,QAAG,GAAM,CAAC;EACrB;EAEA,oBAAOV,KAAA,CAAAS,aAAA,CAAAT,KAAA,CAAAU,QAAA,QAAGF,GAAG,CAACG,IAAI,CAACC,IAAO,CAAC;AAC/B,CAAC","ignoreList":[]}

package/components/Table/Cells/index.d.ts

@@ -1,7 +1,7 @@
-export * from "./CellActions";
-export * from "./CellAuthor";
-export * from "./CellCreated";
-export * from "./CellModified";
-export * from "./CellName";
-export * from "./CellSize";
-export * from "./CellType";
+export * from "./CellActions.js";
+export * from "./CellAuthor.js";
+export * from "./CellCreated.js";
+export * from "./CellModified.js";
+export * from "./CellName.js";
+export * from "./CellSize.js";
+export * from "./CellType.js";

package/components/Table/Cells/index.js

@@ -1,84 +1,9 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var _CellActions = require("./CellActions");
-Object.keys(_CellActions).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _CellActions[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _CellActions[key];
-    }
-  });
-});
-var _CellAuthor = require("./CellAuthor");
-Object.keys(_CellAuthor).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _CellAuthor[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _CellAuthor[key];
-    }
-  });
-});
-var _CellCreated = require("./CellCreated");
-Object.keys(_CellCreated).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _CellCreated[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _CellCreated[key];
-    }
-  });
-});
-var _CellModified = require("./CellModified");
-Object.keys(_CellModified).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _CellModified[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _CellModified[key];
-    }
-  });
-});
-var _CellName = require("./CellName");
-Object.keys(_CellName).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _CellName[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _CellName[key];
-    }
-  });
-});
-var _CellSize = require("./CellSize");
-Object.keys(_CellSize).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _CellSize[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _CellSize[key];
-    }
-  });
-});
-var _CellType = require("./CellType");
-Object.keys(_CellType).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _CellType[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _CellType[key];
-    }
-  });
-});
+export * from "./CellActions.js";
+export * from "./CellAuthor.js";
+export * from "./CellCreated.js";
+export * from "./CellModified.js";
+export * from "./CellName.js";
+export * from "./CellSize.js";
+export * from "./CellType.js";
 
 //# sourceMappingURL=index.js.map

package/components/Table/Cells/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_CellActions","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get","_CellAuthor","_CellCreated","_CellModified","_CellName","_CellSize","_CellType"],"sources":["index.ts"],"sourcesContent":["export * from \"./CellActions\";\nexport * from \"./CellAuthor\";\nexport * from \"./CellCreated\";\nexport * from \"./CellModified\";\nexport * from \"./CellName\";\nexport * from \"./CellSize\";\nexport * from \"./CellType\";\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./CellActions.js\";\nexport * from \"./CellAuthor.js\";\nexport * from \"./CellCreated.js\";\nexport * from \"./CellModified.js\";\nexport * from \"./CellName.js\";\nexport * from \"./CellSize.js\";\nexport * from \"./CellType.js\";\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA","ignoreList":[]}

package/components/Table/Table.d.ts

@@ -1,10 +1,10 @@
 import React from "react";
-import { OnSortingChange, Sorting } from "@webiny/ui/DataTable";
-import { TableItem } from "../../types";
+import type { DataTableSorting, OnDataTableSortingChange } from "@webiny/admin-ui";
+import type { TableItem } from "../../types.js";
 export interface TableProps {
     onSelectRow: ((rows: TableItem[] | []) => void) | undefined;
     onToggleRow: ((row: TableItem) => void) | undefined;
-    sorting: Sorting;
-    onSortingChange: OnSortingChange;
+    sorting: DataTableSorting;
+    onSortingChange: OnDataTableSortingChange;
 }
 export declare const Table: React.ForwardRefExoticComponent<TableProps & React.RefAttributes<HTMLDivElement>>;

package/components/Table/Table.js

@@ -1,31 +1,33 @@
-"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.Table = void 0;
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-var _react = _interopRequireWildcard(require("react"));
-var _appAco = require("@webiny/app-aco");
-var _FileManagerViewProvider = require("../../modules/FileManagerRenderer/FileManagerViewProvider");
-var Table = exports.Table = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
-  var view = (0, _FileManagerViewProvider.useFileManagerView)();
-  var data = (0, _react.useMemo)(function () {
-    return [].concat((0, _toConsumableArray2.default)((0, _appAco.createFoldersData)(view.folders)), (0, _toConsumableArray2.default)((0, _appAco.createRecordsData)(view.files)));
-  }, [view.folders, view.files]);
-  return /*#__PURE__*/_react.default.createElement("div", {
+import React, { forwardRef, useMemo } from "react";
+import { createFoldersData, createRecordsData, Table as AcoTable } from "@webiny/app-aco";
+import { useFileManagerView } from "../../modules/FileManagerRenderer/FileManagerViewProvider/index.js";
+import { useFileManagerViewConfig } from "../../modules/FileManagerRenderer/FileManagerView/FileManagerViewConfig.js";
+export const Table = /*#__PURE__*/forwardRef((props, ref) => {
+  const view = useFileManagerView();
+  const {
+    browser
+  } = useFileManagerViewConfig();
+  const data = useMemo(() => {
+    if (!view.displaySubFolders) {
+      return createRecordsData(view.files);
+    }
+    return [...createFoldersData(view.folders), ...createRecordsData(view.files)];
+  }, [view.folders, view.files, view.displaySubFolders]);
+  const selected = useMemo(() => {
+    return createRecordsData(view.selected);
+  }, [view.selected]);
+  return /*#__PURE__*/React.createElement("div", {
     ref: ref
-  }, /*#__PURE__*/_react.default.createElement(_appAco.Table, {
+  }, /*#__PURE__*/React.createElement(AcoTable, {
+    columns: browser.table.columns,
     data: data,
     loading: view.isListLoading,
     onSelectRow: props.onSelectRow,
     onToggleRow: props.onToggleRow,
     sorting: props.sorting,
     onSortingChange: props.onSortingChange,
-    selected: view.selected,
-    namespace: "fm.file"
+    selected: selected,
+    namespace: "fm/file/list"
   }));
 });
 Table.displayName = "Table";

package/components/Table/Table.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_appAco","_FileManagerViewProvider","Table","exports","forwardRef","props","ref","view","useFileManagerView","data","useMemo","concat","_toConsumableArray2","default","createFoldersData","folders","createRecordsData","files","createElement","loading","isListLoading","onSelectRow","onToggleRow","sorting","onSortingChange","selected","namespace","displayName"],"sources":["Table.tsx"],"sourcesContent":["import React, { forwardRef, useMemo } from \"react\";\nimport { createFoldersData, createRecordsData, Table as AcoTable } from \"@webiny/app-aco\";\nimport { OnSortingChange, Sorting } from \"@webiny/ui/DataTable\";\nimport { useFileManagerView } from \"~/modules/FileManagerRenderer/FileManagerViewProvider\";\nimport { TableItem } from \"~/types\";\n\nexport interface TableProps {\n    onSelectRow: ((rows: TableItem[] | []) => void) | undefined;\n    onToggleRow: ((row: TableItem) => void) | undefined;\n    sorting: Sorting;\n    onSortingChange: OnSortingChange;\n}\n\nexport const Table = forwardRef<HTMLDivElement, TableProps>((props, ref) => {\n    const view = useFileManagerView();\n\n    const data = useMemo<TableItem[]>(() => {\n        return [...createFoldersData(view.folders), ...createRecordsData(view.files)];\n    }, [view.folders, view.files]);\n\n    return (\n        <div ref={ref}>\n            <AcoTable<TableItem>\n                data={data}\n                loading={view.isListLoading}\n                onSelectRow={props.onSelectRow}\n                onToggleRow={props.onToggleRow}\n                sorting={props.sorting}\n                onSortingChange={props.onSortingChange}\n                selected={view.selected}\n                namespace={\"fm.file\"}\n            />\n        </div>\n    );\n});\n\nTable.displayName = \"Table\";\n"],"mappings":";;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AAEA,IAAAE,wBAAA,GAAAF,OAAA;AAUO,IAAMG,KAAK,GAAAC,OAAA,CAAAD,KAAA,gBAAG,IAAAE,iBAAU,EAA6B,UAACC,KAAK,EAAEC,GAAG,EAAK;EACxE,IAAMC,IAAI,GAAG,IAAAC,2CAAkB,EAAC,CAAC;EAEjC,IAAMC,IAAI,GAAG,IAAAC,cAAO,EAAc,YAAM;IACpC,UAAAC,MAAA,KAAAC,mBAAA,CAAAC,OAAA,EAAW,IAAAC,yBAAiB,EAACP,IAAI,CAACQ,OAAO,CAAC,OAAAH,mBAAA,CAAAC,OAAA,EAAK,IAAAG,yBAAiB,EAACT,IAAI,CAACU,KAAK,CAAC;EAChF,CAAC,EAAE,CAACV,IAAI,CAACQ,OAAO,EAAER,IAAI,CAACU,KAAK,CAAC,CAAC;EAE9B,oBACIpB,MAAA,CAAAgB,OAAA,CAAAK,aAAA;IAAKZ,GAAG,EAAEA;EAAI,gBACVT,MAAA,CAAAgB,OAAA,CAAAK,aAAA,CAAClB,OAAA,CAAAE,KAAQ;IACLO,IAAI,EAAEA,IAAK;IACXU,OAAO,EAAEZ,IAAI,CAACa,aAAc;IAC5BC,WAAW,EAAEhB,KAAK,CAACgB,WAAY;IAC/BC,WAAW,EAAEjB,KAAK,CAACiB,WAAY;IAC/BC,OAAO,EAAElB,KAAK,CAACkB,OAAQ;IACvBC,eAAe,EAAEnB,KAAK,CAACmB,eAAgB;IACvCC,QAAQ,EAAElB,IAAI,CAACkB,QAAS;IACxBC,SAAS,EAAE;EAAU,CACxB,CACA,CAAC;AAEd,CAAC,CAAC;AAEFxB,KAAK,CAACyB,WAAW,GAAG,OAAO","ignoreList":[]}
+{"version":3,"names":["React","forwardRef","useMemo","createFoldersData","createRecordsData","Table","AcoTable","useFileManagerView","useFileManagerViewConfig","props","ref","view","browser","data","displaySubFolders","files","folders","selected","createElement","columns","table","loading","isListLoading","onSelectRow","onToggleRow","sorting","onSortingChange","namespace","displayName"],"sources":["Table.tsx"],"sourcesContent":["import React, { forwardRef, useMemo } from \"react\";\nimport type { DataTableSorting, OnDataTableSortingChange } from \"@webiny/admin-ui\";\nimport { createFoldersData, createRecordsData, Table as AcoTable } from \"@webiny/app-aco\";\nimport { useFileManagerView } from \"~/modules/FileManagerRenderer/FileManagerViewProvider/index.js\";\nimport type { TableItem } from \"~/types.js\";\nimport { useFileManagerViewConfig } from \"~/modules/FileManagerRenderer/FileManagerView/FileManagerViewConfig.js\";\n\nexport interface TableProps {\n    onSelectRow: ((rows: TableItem[] | []) => void) | undefined;\n    onToggleRow: ((row: TableItem) => void) | undefined;\n    sorting: DataTableSorting;\n    onSortingChange: OnDataTableSortingChange;\n}\n\nexport const Table = forwardRef<HTMLDivElement, TableProps>((props, ref) => {\n    const view = useFileManagerView();\n    const { browser } = useFileManagerViewConfig();\n\n    const data = useMemo<TableItem[]>(() => {\n        if (!view.displaySubFolders) {\n            return createRecordsData(view.files);\n        }\n        return [...createFoldersData(view.folders), ...createRecordsData(view.files)];\n    }, [view.folders, view.files, view.displaySubFolders]);\n\n    const selected = useMemo<TableItem[]>(() => {\n        return createRecordsData(view.selected);\n    }, [view.selected]);\n\n    return (\n        <div ref={ref}>\n            <AcoTable<TableItem>\n                columns={browser.table.columns}\n                data={data}\n                loading={view.isListLoading}\n                onSelectRow={props.onSelectRow}\n                onToggleRow={props.onToggleRow}\n                sorting={props.sorting}\n                onSortingChange={props.onSortingChange}\n                selected={selected}\n                namespace={\"fm/file/list\"}\n            />\n        </div>\n    );\n});\n\nTable.displayName = \"Table\";\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,OAAO,QAAQ,OAAO;AAElD,SAASC,iBAAiB,EAAEC,iBAAiB,EAAEC,KAAK,IAAIC,QAAQ,QAAQ,iBAAiB;AACzF,SAASC,kBAAkB;AAE3B,SAASC,wBAAwB;AASjC,OAAO,MAAMH,KAAK,gBAAGJ,UAAU,CAA6B,CAACQ,KAAK,EAAEC,GAAG,KAAK;EACxE,MAAMC,IAAI,GAAGJ,kBAAkB,CAAC,CAAC;EACjC,MAAM;IAAEK;EAAQ,CAAC,GAAGJ,wBAAwB,CAAC,CAAC;EAE9C,MAAMK,IAAI,GAAGX,OAAO,CAAc,MAAM;IACpC,IAAI,CAACS,IAAI,CAACG,iBAAiB,EAAE;MACzB,OAAOV,iBAAiB,CAACO,IAAI,CAACI,KAAK,CAAC;IACxC;IACA,OAAO,CAAC,GAAGZ,iBAAiB,CAACQ,IAAI,CAACK,OAAO,CAAC,EAAE,GAAGZ,iBAAiB,CAACO,IAAI,CAACI,KAAK,CAAC,CAAC;EACjF,CAAC,EAAE,CAACJ,IAAI,CAACK,OAAO,EAAEL,IAAI,CAACI,KAAK,EAAEJ,IAAI,CAACG,iBAAiB,CAAC,CAAC;EAEtD,MAAMG,QAAQ,GAAGf,OAAO,CAAc,MAAM;IACxC,OAAOE,iBAAiB,CAACO,IAAI,CAACM,QAAQ,CAAC;EAC3C,CAAC,EAAE,CAACN,IAAI,CAACM,QAAQ,CAAC,CAAC;EAEnB,oBACIjB,KAAA,CAAAkB,aAAA;IAAKR,GAAG,EAAEA;EAAI,gBACVV,KAAA,CAAAkB,aAAA,CAACZ,QAAQ;IACLa,OAAO,EAAEP,OAAO,CAACQ,KAAK,CAACD,OAAQ;IAC/BN,IAAI,EAAEA,IAAK;IACXQ,OAAO,EAAEV,IAAI,CAACW,aAAc;IAC5BC,WAAW,EAAEd,KAAK,CAACc,WAAY;IAC/BC,WAAW,EAAEf,KAAK,CAACe,WAAY;IAC/BC,OAAO,EAAEhB,KAAK,CAACgB,OAAQ;IACvBC,eAAe,EAAEjB,KAAK,CAACiB,eAAgB;IACvCT,QAAQ,EAAEA,QAAS;IACnBU,SAAS,EAAE;EAAe,CAC7B,CACA,CAAC;AAEd,CAAC,CAAC;AAEFtB,KAAK,CAACuB,WAAW,GAAG,OAAO","ignoreList":[]}

package/components/Table/index.d.ts

@@ -1,3 +1,3 @@
-export * from "./Actions";
-export * from "./Cells";
-export * from "./Table";
+export * from "./Actions/index.js";
+export * from "./Cells/index.js";
+export * from "./Table.js";

package/components/Table/index.js

@@ -1,40 +1,5 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var _Actions = require("./Actions");
-Object.keys(_Actions).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _Actions[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _Actions[key];
-    }
-  });
-});
-var _Cells = require("./Cells");
-Object.keys(_Cells).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _Cells[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _Cells[key];
-    }
-  });
-});
-var _Table = require("./Table");
-Object.keys(_Table).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _Table[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _Table[key];
-    }
-  });
-});
+export * from "./Actions/index.js";
+export * from "./Cells/index.js";
+export * from "./Table.js";
 
 //# sourceMappingURL=index.js.map

package/components/Table/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_Actions","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get","_Cells","_Table"],"sources":["index.tsx"],"sourcesContent":["export * from \"./Actions\";\nexport * from \"./Cells\";\nexport * from \"./Table\";\n"],"mappings":";;;;;AAAA,IAAAA,QAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,QAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,QAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAT,QAAA,CAAAK,GAAA;IAAA;EAAA;AAAA;AACA,IAAAK,MAAA,GAAAT,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAO,MAAA,EAAAN,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAK,MAAA,CAAAL,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAC,MAAA,CAAAL,GAAA;IAAA;EAAA;AAAA;AACA,IAAAM,MAAA,GAAAV,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAQ,MAAA,EAAAP,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAM,MAAA,CAAAN,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAE,MAAA,CAAAN,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}
+{"version":3,"names":[],"sources":["index.tsx"],"sourcesContent":["export * from \"./Actions/index.js\";\nexport * from \"./Cells/index.js\";\nexport * from \"./Table.js\";\n"],"mappings":"AAAA;AACA;AACA","ignoreList":[]}

package/{modules/FileManagerRenderer/FileManagerView/components → components}/TagsList/Empty.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-declare type EmptyProps = {
+type EmptyProps = {
     disclaimer?: string;
 };
 export declare const Empty: ({ disclaimer }: EmptyProps) => React.JSX.Element;

package/components/TagsList/Empty.js

@@ -0,0 +1,11 @@
+import React from "react";
+import { Text } from "@webiny/admin-ui";
+export const Empty = ({
+  disclaimer = `No tags found...`
+}) => {
+  return /*#__PURE__*/React.createElement(Text, {
+    className: "text-neutral-muted"
+  }, disclaimer);
+};
+
+//# sourceMappingURL=Empty.js.map

package/components/TagsList/Empty.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Text","Empty","disclaimer","createElement","className"],"sources":["Empty.tsx"],"sourcesContent":["import React from \"react\";\nimport { Text } from \"@webiny/admin-ui\";\n\ntype EmptyProps = {\n    disclaimer?: string;\n};\n\nexport const Empty = ({ disclaimer = `No tags found...` }: EmptyProps) => {\n    return <Text className={\"text-neutral-muted\"}>{disclaimer}</Text>;\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAAQ,kBAAkB;AAMvC,OAAO,MAAMC,KAAK,GAAGA,CAAC;EAAEC,UAAU,GAAG;AAA+B,CAAC,KAAK;EACtE,oBAAOH,KAAA,CAAAI,aAAA,CAACH,IAAI;IAACI,SAAS,EAAE;EAAqB,GAAEF,UAAiB,CAAC;AACrE,CAAC","ignoreList":[]}

package/components/TagsList/FilterSelect.d.ts

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