@webiny/app-file-manager 6.3.0 → 6.4.0-beta.1

package/modules/Settings/views/FileManagerSettings.js

@@ -1,152 +1,134 @@
-import * as React from "react";
-import { Button, Grid, Input, Link, OverlayLoader, Text, Heading } from "@webiny/admin-ui";
+import { Button, Grid, Heading, Input, Link, OverlayLoader, Text } from "@webiny/admin-ui";
 import { Form, useBind } from "@webiny/form";
 import { Mutation, Query } from "@apollo/react-components";
 import { CenteredView, SimpleForm, SimpleFormContent, SimpleFormFooter, SimpleFormHeader, useDialogs, useSnackbar } from "@webiny/app-admin";
 import graphql from "../graphql.js";
 import get from "lodash/get.js";
 import { validation } from "@webiny/validation";
-const Code = ({
-  children
-}) => {
-  return /*#__PURE__*/React.createElement("code", {
-    className: "text-md font-bold"
-  }, children);
-};
+import * as __rspack_external_react from "react";
+const Code = ({ children })=>/*#__PURE__*/ __rspack_external_react.createElement("code", {
+        className: "text-md font-bold"
+    }, children);
 const textClassName = "mb-md";
 const headingLevel = 5;
-export const FileManagerSettings = () => {
-  const {
-    showSnackbar
-  } = useSnackbar();
-  const {
-    showDialog
-  } = useDialogs();
-  const learnMore = () => {
-    showDialog({
-      title: "How to configure file delivery URL?",
-      content: /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Text, {
-        as: "div",
-        className: textClassName
-      }, "The file delivery URL must include the ", /*#__PURE__*/React.createElement(Code, null, "/files/"), " path to reach Webiny Asset Delivery through AWS CloudFront. When configuring a custom domain, you have two options:"), /*#__PURE__*/React.createElement(Heading, {
-        level: headingLevel,
-        className: "mb-xs"
-      }, "Option 1: Custom domain directly on CloudFront"), /*#__PURE__*/React.createElement(Text, {
-        as: "div",
-        className: textClassName
-      }, "Keep the ", /*#__PURE__*/React.createElement(Code, null, "/files/"), " path in your URL.", /*#__PURE__*/React.createElement("br", null), "Example: ", /*#__PURE__*/React.createElement(Code, null, "https://mydomain.com/files/"), "."), /*#__PURE__*/React.createElement(Heading, {
-        level: headingLevel,
-        className: "mb-xs"
-      }, "Option 2: Additional CDN in front of CloudFront"), /*#__PURE__*/React.createElement(Text, {
-        as: "div",
-        className: textClassName
-      }, "Configure your CDN to forward requests to CloudFront's /files/ path. This lets you use a clean URL for users while maintaining the required path on the backend.", /*#__PURE__*/React.createElement("ul", {
-        className: "list-disc my-sm ml-md"
-      }, /*#__PURE__*/React.createElement("li", null, "User-facing URL: ", /*#__PURE__*/React.createElement(Code, null, "https://mydomain.com/")), /*#__PURE__*/React.createElement("li", null, "Your CDN forwards to: ", /*#__PURE__*/React.createElement(Code, null, "https://api.cloudfront.net/files/"))))),
-      acceptLabel: "Got it!",
-      cancelLabel: null
-    });
-  };
-  return /*#__PURE__*/React.createElement(Query, {
-    query: graphql.GET_SETTINGS
-  }, ({
-    data,
-    loading: queryInProgress
-  }) => /*#__PURE__*/React.createElement(Mutation, {
-    mutation: graphql.UPDATE_SETTINGS
-  }, (update, result) => {
-    const settings = get(data, "fileManager.getSettings.data") || {};
-    const {
-      loading: mutationInProgress
-    } = result;
-    const onSubmit = async data => {
-      await update({
-        variables: {
-          data: {
-            uploadMinFileSize: parseFloat(data.uploadMinFileSize),
-            uploadMaxFileSize: parseFloat(data.uploadMaxFileSize),
-            srcPrefix: data.srcPrefix
-          }
-        },
-        update: (cache, result) => {
-          const data = structuredClone(cache.readQuery({
-            query: graphql.GET_SETTINGS
-          }));
-          if (!data) {
-            return;
-          }
-          const error = result.data.fileManager.updateSettings.error;
-          if (error) {
-            showSnackbar(`Error updating settings: ${error.message}`);
-            console.error(error);
-            return;
-          }
-          data.fileManager.getSettings.data = {
-            ...data.fileManager.getSettings.data,
-            ...result.data.fileManager.updateSettings.data
-          };
-          cache.writeQuery({
-            query: graphql.GET_SETTINGS,
-            data
-          });
-          showSnackbar("Settings updated successfully.");
-        }
-      });
+const FileManagerSettings = ()=>{
+    const { showSnackbar } = useSnackbar();
+    const { showDialog } = useDialogs();
+    const learnMore = ()=>{
+        showDialog({
+            title: "How to configure file delivery URL?",
+            content: /*#__PURE__*/ __rspack_external_react.createElement("div", null, /*#__PURE__*/ __rspack_external_react.createElement(Text, {
+                as: "div",
+                className: textClassName
+            }, "The file delivery URL must include the ", /*#__PURE__*/ __rspack_external_react.createElement(Code, null, "/files/"), " path to reach Webiny Asset Delivery through AWS CloudFront. When configuring a custom domain, you have two options:"), /*#__PURE__*/ __rspack_external_react.createElement(Heading, {
+                level: headingLevel,
+                className: "mb-xs"
+            }, "Option 1: Custom domain directly on CloudFront"), /*#__PURE__*/ __rspack_external_react.createElement(Text, {
+                as: "div",
+                className: textClassName
+            }, "Keep the ", /*#__PURE__*/ __rspack_external_react.createElement(Code, null, "/files/"), " path in your URL.", /*#__PURE__*/ __rspack_external_react.createElement("br", null), "Example: ", /*#__PURE__*/ __rspack_external_react.createElement(Code, null, "https://mydomain.com/files/"), "."), /*#__PURE__*/ __rspack_external_react.createElement(Heading, {
+                level: headingLevel,
+                className: "mb-xs"
+            }, "Option 2: Additional CDN in front of CloudFront"), /*#__PURE__*/ __rspack_external_react.createElement(Text, {
+                as: "div",
+                className: textClassName
+            }, "Configure your CDN to forward requests to CloudFront's /files/ path. This lets you use a clean URL for users while maintaining the required path on the backend.", /*#__PURE__*/ __rspack_external_react.createElement("ul", {
+                className: "list-disc my-sm ml-md"
+            }, /*#__PURE__*/ __rspack_external_react.createElement("li", null, "User-facing URL: ", /*#__PURE__*/ __rspack_external_react.createElement(Code, null, "https://mydomain.com/")), /*#__PURE__*/ __rspack_external_react.createElement("li", null, "Your CDN forwards to: ", /*#__PURE__*/ __rspack_external_react.createElement(Code, null, "https://api.cloudfront.net/files/"))))),
+            acceptLabel: "Got it!",
+            cancelLabel: null
+        });
     };
-    return /*#__PURE__*/React.createElement(CenteredView, null, /*#__PURE__*/React.createElement(Form, {
-      data: settings,
-      onSubmit: data => {
-        /**
-         * We are positive that data is Settings.
-         */
-        onSubmit(data);
-      }
-    }, ({
-      Bind,
-      form
-    }) => /*#__PURE__*/React.createElement(SimpleForm, null, (queryInProgress || mutationInProgress) && /*#__PURE__*/React.createElement(OverlayLoader, null), /*#__PURE__*/React.createElement(SimpleFormHeader, {
-      title: "General Settings"
-    }), /*#__PURE__*/React.createElement(SimpleFormContent, null, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Grid.Column, {
-      span: 12
-    }, /*#__PURE__*/React.createElement(Bind, {
-      name: "uploadMinFileSize"
-    }, /*#__PURE__*/React.createElement(Input, {
-      type: "number",
-      label: "Minimum file upload size",
-      description: "The smallest file size in bytes."
-    }))), /*#__PURE__*/React.createElement(Grid.Column, {
-      span: 12
-    }, /*#__PURE__*/React.createElement(Bind, {
-      name: "uploadMaxFileSize"
-    }, /*#__PURE__*/React.createElement(Input, {
-      type: "number",
-      label: "Maximum file upload size",
-      description: "The largest file size in bytes."
-    }))), /*#__PURE__*/React.createElement(Grid.Column, {
-      span: 12
-    }, /*#__PURE__*/React.createElement(Bind, {
-      name: "srcPrefix",
-      validators: [validation.create("required,url")]
-    }, /*#__PURE__*/React.createElement(Input, {
-      label: "File delivery URL",
-      note: /*#__PURE__*/React.createElement(UrlPreview, null),
-      description: /*#__PURE__*/React.createElement(React.Fragment, null, "This URL will be prepended to the file key.\xA0", /*#__PURE__*/React.createElement(Link, {
-        to: "#",
-        onClick: learnMore
-      }, "How to configure?"))
-    }))))), /*#__PURE__*/React.createElement(SimpleFormFooter, null, /*#__PURE__*/React.createElement(Button, {
-      text: "Save settings",
-      onClick: form.submit
-    })))));
-  }));
+    return /*#__PURE__*/ __rspack_external_react.createElement(Query, {
+        query: graphql.GET_SETTINGS
+    }, ({ data, loading: queryInProgress })=>/*#__PURE__*/ __rspack_external_react.createElement(Mutation, {
+            mutation: graphql.UPDATE_SETTINGS
+        }, (update, result)=>{
+            const settings = get(data, "fileManager.getSettings.data") || {};
+            const { loading: mutationInProgress } = result;
+            const onSubmit = async (data)=>{
+                await update({
+                    variables: {
+                        data: {
+                            uploadMinFileSize: parseFloat(data.uploadMinFileSize),
+                            uploadMaxFileSize: parseFloat(data.uploadMaxFileSize),
+                            srcPrefix: data.srcPrefix
+                        }
+                    },
+                    update: (cache, result)=>{
+                        const data = structuredClone(cache.readQuery({
+                            query: graphql.GET_SETTINGS
+                        }));
+                        if (!data) return;
+                        const error = result.data.fileManager.updateSettings.error;
+                        if (error) {
+                            showSnackbar(`Error updating settings: ${error.message}`);
+                            console.error(error);
+                            return;
+                        }
+                        data.fileManager.getSettings.data = {
+                            ...data.fileManager.getSettings.data,
+                            ...result.data.fileManager.updateSettings.data
+                        };
+                        cache.writeQuery({
+                            query: graphql.GET_SETTINGS,
+                            data
+                        });
+                        showSnackbar("Settings updated successfully.");
+                    }
+                });
+            };
+            return /*#__PURE__*/ __rspack_external_react.createElement(CenteredView, null, /*#__PURE__*/ __rspack_external_react.createElement(Form, {
+                data: settings,
+                onSubmit: (data)=>{
+                    onSubmit(data);
+                }
+            }, ({ Bind, form })=>/*#__PURE__*/ __rspack_external_react.createElement(SimpleForm, null, (queryInProgress || mutationInProgress) && /*#__PURE__*/ __rspack_external_react.createElement(OverlayLoader, null), /*#__PURE__*/ __rspack_external_react.createElement(SimpleFormHeader, {
+                    title: "General Settings"
+                }), /*#__PURE__*/ __rspack_external_react.createElement(SimpleFormContent, null, /*#__PURE__*/ __rspack_external_react.createElement(Grid, null, /*#__PURE__*/ __rspack_external_react.createElement(Grid.Column, {
+                    span: 12
+                }, /*#__PURE__*/ __rspack_external_react.createElement(Bind, {
+                    name: "uploadMinFileSize"
+                }, /*#__PURE__*/ __rspack_external_react.createElement(Input, {
+                    type: "number",
+                    label: "Minimum file upload size",
+                    description: "The smallest file size in bytes."
+                }))), /*#__PURE__*/ __rspack_external_react.createElement(Grid.Column, {
+                    span: 12
+                }, /*#__PURE__*/ __rspack_external_react.createElement(Bind, {
+                    name: "uploadMaxFileSize"
+                }, /*#__PURE__*/ __rspack_external_react.createElement(Input, {
+                    type: "number",
+                    label: "Maximum file upload size",
+                    description: "The largest file size in bytes."
+                }))), /*#__PURE__*/ __rspack_external_react.createElement(Grid.Column, {
+                    span: 12
+                }, /*#__PURE__*/ __rspack_external_react.createElement(Bind, {
+                    name: "srcPrefix",
+                    validators: [
+                        validation.create("required,url")
+                    ]
+                }, /*#__PURE__*/ __rspack_external_react.createElement(Input, {
+                    label: "File delivery URL",
+                    note: /*#__PURE__*/ __rspack_external_react.createElement(UrlPreview, null),
+                    description: /*#__PURE__*/ __rspack_external_react.createElement(__rspack_external_react.Fragment, null, "This URL will be prepended to the file key.\xa0", /*#__PURE__*/ __rspack_external_react.createElement(Link, {
+                        to: "#",
+                        onClick: learnMore
+                    }, "How to configure?"))
+                }))))), /*#__PURE__*/ __rspack_external_react.createElement(SimpleFormFooter, null, /*#__PURE__*/ __rspack_external_react.createElement(Button, {
+                    text: "Save settings",
+                    onClick: form.submit
+                })))));
+        }));
 };
-const UrlPreview = () => {
-  const deliveryUrl = useBind({
-    name: "srcPrefix"
-  });
-  let prefix = deliveryUrl.value ?? "";
-  prefix = prefix.endsWith("/") ? prefix : `${prefix}/`;
-  return /*#__PURE__*/React.createElement(React.Fragment, null, "Example URL: ", /*#__PURE__*/React.createElement("strong", null, prefix, "768bed3e544f/image.jpg"));
+const UrlPreview = ()=>{
+    const deliveryUrl = useBind({
+        name: "srcPrefix"
+    });
+    let prefix = deliveryUrl.value ?? "";
+    prefix = prefix.endsWith("/") ? prefix : `${prefix}/`;
+    return /*#__PURE__*/ __rspack_external_react.createElement(__rspack_external_react.Fragment, null, "Example URL: ", /*#__PURE__*/ __rspack_external_react.createElement("strong", null, prefix, "768bed3e544f/image.jpg"));
 };
+export { FileManagerSettings };
 
 //# sourceMappingURL=FileManagerSettings.js.map

package/modules/Settings/views/FileManagerSettings.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Button","Grid","Input","Link","OverlayLoader","Text","Heading","Form","useBind","Mutation","Query","CenteredView","SimpleForm","SimpleFormContent","SimpleFormFooter","SimpleFormHeader","useDialogs","useSnackbar","graphql","get","validation","Code","children","createElement","className","textClassName","headingLevel","FileManagerSettings","showSnackbar","showDialog","learnMore","title","content","as","level","acceptLabel","cancelLabel","query","GET_SETTINGS","data","loading","queryInProgress","mutation","UPDATE_SETTINGS","update","result","settings","mutationInProgress","onSubmit","variables","uploadMinFileSize","parseFloat","uploadMaxFileSize","srcPrefix","cache","structuredClone","readQuery","error","fileManager","updateSettings","message","console","getSettings","writeQuery","Bind","form","Column","span","name","type","label","description","validators","create","note","UrlPreview","Fragment","to","onClick","text","submit","deliveryUrl","prefix","value","endsWith"],"sources":["FileManagerSettings.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Button, Grid, Input, Link, OverlayLoader, Text, Heading } from \"@webiny/admin-ui\";\nimport { Form, useBind } from \"@webiny/form\";\nimport { Mutation, Query } from \"@apollo/react-components\";\nimport {\n    CenteredView,\n    SimpleForm,\n    SimpleFormContent,\n    SimpleFormFooter,\n    SimpleFormHeader,\n    useDialogs,\n    useSnackbar\n} from \"@webiny/app-admin\";\nimport type { GetSettingsResponse } from \"../graphql.js\";\nimport graphql from \"../graphql.js\";\nimport get from \"lodash/get.js\";\nimport { validation } from \"@webiny/validation\";\nimport type { QueryGetSettingsResult, Settings } from \"~/types.js\";\nimport type { MutationFunction, MutationResult } from \"@apollo/react-common\";\n\nconst Code = ({ children }: { children: React.ReactNode }) => {\n    return <code className={\"text-md font-bold\"}>{children}</code>;\n};\n\nconst textClassName = \"mb-md\";\nconst headingLevel = 5;\n\nexport const FileManagerSettings = () => {\n    const { showSnackbar } = useSnackbar();\n\n    const { showDialog } = useDialogs();\n\n    const learnMore = () => {\n        showDialog({\n            title: \"How to configure file delivery URL?\",\n            content: (\n                <div>\n                    <Text as={\"div\"} className={textClassName}>\n                        The file delivery URL must include the <Code>/files/</Code> path to reach\n                        Webiny Asset Delivery through AWS CloudFront. When configuring a custom\n                        domain, you have two options:\n                    </Text>\n                    <Heading level={headingLevel} className={\"mb-xs\"}>\n                        Option 1: Custom domain directly on CloudFront\n                    </Heading>\n                    <Text as={\"div\"} className={textClassName}>\n                        Keep the <Code>/files/</Code> path in your URL.\n                        <br />\n                        Example: <Code>https://mydomain.com/files/</Code>.\n                    </Text>\n                    <Heading level={headingLevel} className={\"mb-xs\"}>\n                        Option 2: Additional CDN in front of CloudFront\n                    </Heading>\n                    <Text as={\"div\"} className={textClassName}>\n                        Configure your CDN to forward requests to CloudFront&apos;s /files/ path.\n                        This lets you use a clean URL for users while maintaining the required path\n                        on the backend.\n                        <ul className={\"list-disc my-sm ml-md\"}>\n                            <li>\n                                User-facing URL: <Code>https://mydomain.com/</Code>\n                            </li>\n                            <li>\n                                Your CDN forwards to: <Code>https://api.cloudfront.net/files/</Code>\n                            </li>\n                        </ul>\n                    </Text>\n                </div>\n            ),\n            acceptLabel: \"Got it!\",\n            cancelLabel: null\n        });\n    };\n\n    return (\n        <Query query={graphql.GET_SETTINGS}>\n            {({ data, loading: queryInProgress }: MutationResult<QueryGetSettingsResult>) => (\n                <Mutation mutation={graphql.UPDATE_SETTINGS}>\n                    {(update: MutationFunction, result: MutationResult) => {\n                        const settings = (get(data, \"fileManager.getSettings.data\") ||\n                            {}) as Settings;\n                        const { loading: mutationInProgress } = result;\n\n                        const onSubmit = async (data: Settings): Promise<void> => {\n                            await update({\n                                variables: {\n                                    data: {\n                                        uploadMinFileSize: parseFloat(data.uploadMinFileSize),\n                                        uploadMaxFileSize: parseFloat(data.uploadMaxFileSize),\n                                        srcPrefix: data.srcPrefix\n                                    }\n                                },\n                                update: (cache, result) => {\n                                    const data = structuredClone(\n                                        cache.readQuery<GetSettingsResponse>({\n                                            query: graphql.GET_SETTINGS\n                                        })\n                                    );\n                                    if (!data) {\n                                        return;\n                                    }\n                                    const error = result.data.fileManager.updateSettings.error;\n                                    if (error) {\n                                        showSnackbar(`Error updating settings: ${error.message}`);\n                                        console.error(error);\n                                        return;\n                                    }\n\n                                    data.fileManager.getSettings.data = {\n                                        ...data.fileManager.getSettings.data,\n                                        ...result.data.fileManager.updateSettings.data\n                                    };\n\n                                    cache.writeQuery({\n                                        query: graphql.GET_SETTINGS,\n                                        data\n                                    });\n                                    showSnackbar(\"Settings updated successfully.\");\n                                }\n                            });\n                        };\n                        return (\n                            <CenteredView>\n                                <Form\n                                    data={settings}\n                                    onSubmit={data => {\n                                        /**\n                                         * We are positive that data is Settings.\n                                         */\n                                        onSubmit(data as unknown as Settings);\n                                    }}\n                                >\n                                    {({ Bind, form }) => (\n                                        <SimpleForm>\n                                            {(queryInProgress || mutationInProgress) && (\n                                                <OverlayLoader />\n                                            )}\n                                            <SimpleFormHeader title=\"General Settings\" />\n                                            <SimpleFormContent>\n                                                <Grid>\n                                                    <Grid.Column span={12}>\n                                                        <Bind name={\"uploadMinFileSize\"}>\n                                                            <Input\n                                                                type=\"number\"\n                                                                label=\"Minimum file upload size\"\n                                                                description=\"The smallest file size in bytes.\"\n                                                            />\n                                                        </Bind>\n                                                    </Grid.Column>\n                                                    <Grid.Column span={12}>\n                                                        <Bind name={\"uploadMaxFileSize\"}>\n                                                            <Input\n                                                                type=\"number\"\n                                                                label=\"Maximum file upload size\"\n                                                                description=\"The largest file size in bytes.\"\n                                                            />\n                                                        </Bind>\n                                                    </Grid.Column>\n                                                    <Grid.Column span={12}>\n                                                        <Bind\n                                                            name={\"srcPrefix\"}\n                                                            validators={[\n                                                                validation.create(\"required,url\")\n                                                            ]}\n                                                        >\n                                                            <Input\n                                                                label=\"File delivery URL\"\n                                                                note={<UrlPreview />}\n                                                                description={\n                                                                    <>\n                                                                        This URL will be prepended\n                                                                        to the file key.&nbsp;\n                                                                        <Link\n                                                                            to=\"#\"\n                                                                            onClick={learnMore}\n                                                                        >\n                                                                            How to configure?\n                                                                        </Link>\n                                                                    </>\n                                                                }\n                                                            />\n                                                        </Bind>\n                                                    </Grid.Column>\n                                                </Grid>\n                                            </SimpleFormContent>\n                                            <SimpleFormFooter>\n                                                <Button\n                                                    text={\"Save settings\"}\n                                                    onClick={form.submit}\n                                                />\n                                            </SimpleFormFooter>\n                                        </SimpleForm>\n                                    )}\n                                </Form>\n                            </CenteredView>\n                        );\n                    }}\n                </Mutation>\n            )}\n        </Query>\n    );\n};\n\nconst UrlPreview = () => {\n    const deliveryUrl = useBind({\n        name: \"srcPrefix\"\n    });\n\n    let prefix = deliveryUrl.value ?? \"\";\n\n    prefix = prefix.endsWith(\"/\") ? prefix : `${prefix}/`;\n\n    return (\n        <>\n            Example URL: <strong>{prefix}768bed3e544f/image.jpg</strong>\n        </>\n    );\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"modules/Settings/views/FileManagerSettings.js","sources":["../../../../src/modules/Settings/views/FileManagerSettings.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Button, Grid, Input, Link, OverlayLoader, Text, Heading } from \"@webiny/admin-ui\";\nimport { Form, useBind } from \"@webiny/form\";\nimport { Mutation, Query } from \"@apollo/react-components\";\nimport {\n    CenteredView,\n    SimpleForm,\n    SimpleFormContent,\n    SimpleFormFooter,\n    SimpleFormHeader,\n    useDialogs,\n    useSnackbar\n} from \"@webiny/app-admin\";\nimport type { GetSettingsResponse } from \"../graphql.js\";\nimport graphql from \"../graphql.js\";\nimport get from \"lodash/get.js\";\nimport { validation } from \"@webiny/validation\";\nimport type { QueryGetSettingsResult, Settings } from \"~/domain/types.js\";\nimport type { MutationFunction, MutationResult } from \"@apollo/react-common\";\n\nconst Code = ({ children }: { children: React.ReactNode }) => {\n    return <code className={\"text-md font-bold\"}>{children}</code>;\n};\n\nconst textClassName = \"mb-md\";\nconst headingLevel = 5;\n\nexport const FileManagerSettings = () => {\n    const { showSnackbar } = useSnackbar();\n\n    const { showDialog } = useDialogs();\n\n    const learnMore = () => {\n        showDialog({\n            title: \"How to configure file delivery URL?\",\n            content: (\n                <div>\n                    <Text as={\"div\"} className={textClassName}>\n                        The file delivery URL must include the <Code>/files/</Code> path to reach\n                        Webiny Asset Delivery through AWS CloudFront. When configuring a custom\n                        domain, you have two options:\n                    </Text>\n                    <Heading level={headingLevel} className={\"mb-xs\"}>\n                        Option 1: Custom domain directly on CloudFront\n                    </Heading>\n                    <Text as={\"div\"} className={textClassName}>\n                        Keep the <Code>/files/</Code> path in your URL.\n                        <br />\n                        Example: <Code>https://mydomain.com/files/</Code>.\n                    </Text>\n                    <Heading level={headingLevel} className={\"mb-xs\"}>\n                        Option 2: Additional CDN in front of CloudFront\n                    </Heading>\n                    <Text as={\"div\"} className={textClassName}>\n                        Configure your CDN to forward requests to CloudFront&apos;s /files/ path.\n                        This lets you use a clean URL for users while maintaining the required path\n                        on the backend.\n                        <ul className={\"list-disc my-sm ml-md\"}>\n                            <li>\n                                User-facing URL: <Code>https://mydomain.com/</Code>\n                            </li>\n                            <li>\n                                Your CDN forwards to: <Code>https://api.cloudfront.net/files/</Code>\n                            </li>\n                        </ul>\n                    </Text>\n                </div>\n            ),\n            acceptLabel: \"Got it!\",\n            cancelLabel: null\n        });\n    };\n\n    return (\n        <Query query={graphql.GET_SETTINGS}>\n            {({ data, loading: queryInProgress }: MutationResult<QueryGetSettingsResult>) => (\n                <Mutation mutation={graphql.UPDATE_SETTINGS}>\n                    {(update: MutationFunction, result: MutationResult) => {\n                        const settings = (get(data, \"fileManager.getSettings.data\") ||\n                            {}) as Settings;\n                        const { loading: mutationInProgress } = result;\n\n                        const onSubmit = async (data: Settings): Promise<void> => {\n                            await update({\n                                variables: {\n                                    data: {\n                                        uploadMinFileSize: parseFloat(data.uploadMinFileSize),\n                                        uploadMaxFileSize: parseFloat(data.uploadMaxFileSize),\n                                        srcPrefix: data.srcPrefix\n                                    }\n                                },\n                                update: (cache, result) => {\n                                    const data = structuredClone(\n                                        cache.readQuery<GetSettingsResponse>({\n                                            query: graphql.GET_SETTINGS\n                                        })\n                                    );\n                                    if (!data) {\n                                        return;\n                                    }\n                                    const error = result.data.fileManager.updateSettings.error;\n                                    if (error) {\n                                        showSnackbar(`Error updating settings: ${error.message}`);\n                                        console.error(error);\n                                        return;\n                                    }\n\n                                    data.fileManager.getSettings.data = {\n                                        ...data.fileManager.getSettings.data,\n                                        ...result.data.fileManager.updateSettings.data\n                                    };\n\n                                    cache.writeQuery({\n                                        query: graphql.GET_SETTINGS,\n                                        data\n                                    });\n                                    showSnackbar(\"Settings updated successfully.\");\n                                }\n                            });\n                        };\n                        return (\n                            <CenteredView>\n                                <Form\n                                    data={settings}\n                                    onSubmit={data => {\n                                        /**\n                                         * We are positive that data is Settings.\n                                         */\n                                        onSubmit(data as unknown as Settings);\n                                    }}\n                                >\n                                    {({ Bind, form }) => (\n                                        <SimpleForm>\n                                            {(queryInProgress || mutationInProgress) && (\n                                                <OverlayLoader />\n                                            )}\n                                            <SimpleFormHeader title=\"General Settings\" />\n                                            <SimpleFormContent>\n                                                <Grid>\n                                                    <Grid.Column span={12}>\n                                                        <Bind name={\"uploadMinFileSize\"}>\n                                                            <Input\n                                                                type=\"number\"\n                                                                label=\"Minimum file upload size\"\n                                                                description=\"The smallest file size in bytes.\"\n                                                            />\n                                                        </Bind>\n                                                    </Grid.Column>\n                                                    <Grid.Column span={12}>\n                                                        <Bind name={\"uploadMaxFileSize\"}>\n                                                            <Input\n                                                                type=\"number\"\n                                                                label=\"Maximum file upload size\"\n                                                                description=\"The largest file size in bytes.\"\n                                                            />\n                                                        </Bind>\n                                                    </Grid.Column>\n                                                    <Grid.Column span={12}>\n                                                        <Bind\n                                                            name={\"srcPrefix\"}\n                                                            validators={[\n                                                                validation.create(\"required,url\")\n                                                            ]}\n                                                        >\n                                                            <Input\n                                                                label=\"File delivery URL\"\n                                                                note={<UrlPreview />}\n                                                                description={\n                                                                    <>\n                                                                        This URL will be prepended\n                                                                        to the file key.&nbsp;\n                                                                        <Link\n                                                                            to=\"#\"\n                                                                            onClick={learnMore}\n                                                                        >\n                                                                            How to configure?\n                                                                        </Link>\n                                                                    </>\n                                                                }\n                                                            />\n                                                        </Bind>\n                                                    </Grid.Column>\n                                                </Grid>\n                                            </SimpleFormContent>\n                                            <SimpleFormFooter>\n                                                <Button\n                                                    text={\"Save settings\"}\n                                                    onClick={form.submit}\n                                                />\n                                            </SimpleFormFooter>\n                                        </SimpleForm>\n                                    )}\n                                </Form>\n                            </CenteredView>\n                        );\n                    }}\n                </Mutation>\n            )}\n        </Query>\n    );\n};\n\nconst UrlPreview = () => {\n    const deliveryUrl = useBind({\n        name: \"srcPrefix\"\n    });\n\n    let prefix = deliveryUrl.value ?? \"\";\n\n    prefix = prefix.endsWith(\"/\") ? prefix : `${prefix}/`;\n\n    return (\n        <>\n            Example URL: <strong>{prefix}768bed3e544f/image.jpg</strong>\n        </>\n    );\n};\n"],"names":["Code","children","textClassName","headingLevel","FileManagerSettings","showSnackbar","useSnackbar","showDialog","useDialogs","learnMore","Text","Heading","Query","graphql","data","queryInProgress","Mutation","update","result","settings","get","mutationInProgress","onSubmit","parseFloat","cache","structuredClone","error","console","CenteredView","Form","Bind","form","SimpleForm","OverlayLoader","SimpleFormHeader","SimpleFormContent","Grid","Input","validation","UrlPreview","Link","SimpleFormFooter","Button","deliveryUrl","useBind","prefix"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@webiny/app-file-manager",
-	"version": "6.3.0",
+	"version": "6.4.0-beta.1",
 	"type": "module",
 	"exports": {
 		".": "./index.js",
@@ -15,25 +15,23 @@
 	"dependencies": {
 		"@apollo/react-common": "3.1.4",
 		"@apollo/react-components": "3.1.5",
-		"@apollo/react-hooks": "3.1.5",
 		"@types/react": "18.3.28",
-		"@webiny/admin-ui": "6.3.0",
-		"@webiny/app": "6.3.0",
-		"@webiny/app-aco": "6.3.0",
-		"@webiny/app-admin": "6.3.0",
-		"@webiny/app-headless-cms": "6.3.0",
-		"@webiny/app-headless-cms-common": "6.3.0",
-		"@webiny/app-websockets": "6.3.0",
-		"@webiny/error": "6.3.0",
-		"@webiny/feature": "6.3.0",
-		"@webiny/form": "6.3.0",
-		"@webiny/icons": "6.3.0",
-		"@webiny/plugins": "6.3.0",
-		"@webiny/react-composition": "6.3.0",
-		"@webiny/react-properties": "6.3.0",
-		"@webiny/sdk": "6.3.0",
-		"@webiny/utils": "6.3.0",
-		"@webiny/validation": "6.3.0",
+		"@webiny/admin-ui": "6.4.0-beta.1",
+		"@webiny/app": "6.4.0-beta.1",
+		"@webiny/app-aco": "6.4.0-beta.1",
+		"@webiny/app-admin": "6.4.0-beta.1",
+		"@webiny/app-headless-cms": "6.4.0-beta.1",
+		"@webiny/app-headless-cms-common": "6.4.0-beta.1",
+		"@webiny/app-websockets": "6.4.0-beta.1",
+		"@webiny/di": "1.0.0",
+		"@webiny/feature": "6.4.0-beta.1",
+		"@webiny/form": "6.4.0-beta.1",
+		"@webiny/icons": "6.4.0-beta.1",
+		"@webiny/plugins": "6.4.0-beta.1",
+		"@webiny/react-composition": "6.4.0-beta.1",
+		"@webiny/react-properties": "6.4.0-beta.1",
+		"@webiny/sdk": "6.4.0-beta.1",
+		"@webiny/validation": "6.4.0-beta.1",
 		"apollo-cache": "1.3.5",
 		"apollo-client": "2.6.10",
 		"apollo-link": "1.2.14",
@@ -41,30 +39,28 @@
 		"bytes": "3.1.2",
 		"dayjs": "1.11.20",
 		"dot-prop-immutable": "2.1.1",
-		"graphql": "16.13.2",
+		"graphql": "16.14.0",
 		"graphql-tag": "2.12.6",
 		"lodash": "4.18.1",
 		"mime": "4.1.0",
 		"minimatch": "10.2.5",
-		"mobx": "6.15.1",
+		"mobx": "6.15.3",
 		"mobx-react-lite": "4.1.1",
 		"react": "18.3.1",
-		"react-butterfiles": "1.3.3",
-		"react-custom-scrollbars": "4.2.1",
 		"react-dom": "18.3.1",
 		"react-lazy-load": "4.0.1",
-		"zod": "4.3.6"
+		"zod": "4.4.3"
 	},
 	"devDependencies": {
 		"@svgr/webpack": "8.1.0",
-		"@webiny/build-tools": "6.3.0",
+		"@webiny/build-tools": "6.4.0-beta.1",
 		"rimraf": "6.1.3",
 		"typescript": "6.0.3",
-		"vitest": "4.1.5"
+		"vitest": "4.1.6"
 	},
 	"publishConfig": {
 		"access": "public",
 		"directory": "dist"
 	},
-	"gitHead": "7cefe15431dbd65504e1f58147dc9e55bcbfa693"
+	"gitHead": "73237b8243693038c072bae1c0b783387448cbbe"
 }

package/presentation/FileActions/FileDetails/CopyUrl.js

@@ -0,0 +1,19 @@
+import react from "react";
+import { ReactComponent } from "@webiny/icons/content_copy.svg";
+import { useCopyFile } from "../../hooks/useCopyFile.js";
+import { FileManagerViewConfig, useFile } from "../../../index.js";
+const { FileDetails: FileDetails } = FileManagerViewConfig;
+const CopyUrl = ()=>{
+    const { file } = useFile();
+    const { copyFileUrl } = useCopyFile({
+        file
+    });
+    return /*#__PURE__*/ react.createElement(FileDetails.Action.Button, {
+        label: "Copy URL",
+        onAction: copyFileUrl,
+        icon: /*#__PURE__*/ react.createElement(ReactComponent, null)
+    });
+};
+export { CopyUrl };
+
+//# sourceMappingURL=CopyUrl.js.map

package/presentation/FileActions/FileDetails/CopyUrl.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/FileActions/FileDetails/CopyUrl.js","sources":["../../../../src/presentation/FileActions/FileDetails/CopyUrl.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as CopyContentIcon } from \"@webiny/icons/content_copy.svg\";\nimport { useCopyFile } from \"~/presentation/hooks/useCopyFile.js\";\nimport { FileManagerViewConfig, useFile } from \"~/index.js\";\n\nconst { FileDetails } = FileManagerViewConfig;\n\nexport const CopyUrl = () => {\n    const { file } = useFile();\n    const { copyFileUrl } = useCopyFile({ file });\n\n    return (\n        <FileDetails.Action.Button\n            label={\"Copy URL\"}\n            onAction={copyFileUrl}\n            icon={<CopyContentIcon />}\n        />\n    );\n};\n"],"names":["FileDetails","FileManagerViewConfig","CopyUrl","file","useFile","copyFileUrl","useCopyFile","CopyContentIcon"],"mappings":";;;;AAKA,MAAM,EAAEA,aAAAA,WAAW,EAAE,GAAGC;AAEjB,MAAMC,UAAU;IACnB,MAAM,EAAEC,IAAI,EAAE,GAAGC;IACjB,MAAM,EAAEC,WAAW,EAAE,GAAGC,YAAY;QAAEH;IAAK;IAE3C,OAAO,WAAP,GACI,oBAACH,YAAY,MAAM,CAAC,MAAM;QACtB,OAAO;QACP,UAAUK;QACV,oBAAM,oBAACE,gBAAeA;;AAGlC"}

package/presentation/FileActions/FileDetails/DeleteImage.js

@@ -0,0 +1,24 @@
+import react from "react";
+import { ReactComponent } from "@webiny/icons/delete.svg";
+import { FileManagerViewConfig, useFile } from "../../../index.js";
+import { useDeleteFile } from "../../hooks/useDeleteFile.js";
+import { useFileManagerPresenter } from "../../FileList/FileManagerPresenterProvider.js";
+const { FileDetails: FileDetails } = FileManagerViewConfig;
+const DeleteImage = ()=>{
+    const { file } = useFile();
+    const { vm, actions } = useFileManagerPresenter();
+    const { openDialogDeleteFile } = useDeleteFile({
+        file,
+        onDelete: actions.hideFileDetails
+    });
+    if (!vm.permissions.canEditFile(file)) return null;
+    return /*#__PURE__*/ react.createElement(FileDetails.Action.Button, {
+        label: "Delete",
+        onAction: openDialogDeleteFile,
+        icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+        "data-testid": "fm-delete-file-button"
+    });
+};
+export { DeleteImage };
+
+//# sourceMappingURL=DeleteImage.js.map

package/presentation/FileActions/FileDetails/DeleteImage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/FileActions/FileDetails/DeleteImage.js","sources":["../../../../src/presentation/FileActions/FileDetails/DeleteImage.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as DeleteIcon } from \"@webiny/icons/delete.svg\";\nimport { FileManagerViewConfig, useFile } from \"~/index.js\";\nimport { useDeleteFile } from \"~/presentation/hooks/useDeleteFile.js\";\nimport { useFileManagerPresenter } from \"~/presentation/FileList/FileManagerPresenterProvider.js\";\n\nconst { FileDetails } = FileManagerViewConfig;\n\nexport const DeleteImage = () => {\n    const { file } = useFile();\n    const { vm, actions } = useFileManagerPresenter();\n    const { openDialogDeleteFile } = useDeleteFile({\n        file,\n        onDelete: actions.hideFileDetails\n    });\n\n    if (!vm.permissions.canEditFile(file)) {\n        return null;\n    }\n\n    return (\n        <FileDetails.Action.Button\n            label={\"Delete\"}\n            onAction={openDialogDeleteFile}\n            icon={<DeleteIcon />}\n            data-testid={\"fm-delete-file-button\"}\n        />\n    );\n};\n"],"names":["FileDetails","FileManagerViewConfig","DeleteImage","file","useFile","vm","actions","useFileManagerPresenter","openDialogDeleteFile","useDeleteFile","DeleteIcon"],"mappings":";;;;;AAMA,MAAM,EAAEA,aAAAA,WAAW,EAAE,GAAGC;AAEjB,MAAMC,cAAc;IACvB,MAAM,EAAEC,IAAI,EAAE,GAAGC;IACjB,MAAM,EAAEC,EAAE,EAAEC,OAAO,EAAE,GAAGC;IACxB,MAAM,EAAEC,oBAAoB,EAAE,GAAGC,cAAc;QAC3CN;QACA,UAAUG,QAAQ,eAAe;IACrC;IAEA,IAAI,CAACD,GAAG,WAAW,CAAC,WAAW,CAACF,OAC5B,OAAO;IAGX,OAAO,WAAP,GACI,oBAACH,YAAY,MAAM,CAAC,MAAM;QACtB,OAAO;QACP,UAAUQ;QACV,oBAAM,oBAACE,gBAAUA;QACjB,eAAa;;AAGzB"}

package/presentation/FileActions/FileDetails/Download.js

@@ -0,0 +1,19 @@
+import react from "react";
+import { ReactComponent } from "@webiny/icons/file_download.svg";
+import { FileManagerViewConfig, useFile } from "../../../index.js";
+const { FileDetails: FileDetails } = FileManagerViewConfig;
+const Download = ()=>{
+    const { file } = useFile();
+    return /*#__PURE__*/ react.createElement("a", {
+        rel: "noreferrer",
+        target: "_blank",
+        href: `${file.src}?original`
+    }, /*#__PURE__*/ react.createElement(FileDetails.Action.Button, {
+        label: "Download",
+        icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+        onAction: ()=>{}
+    }));
+};
+export { Download };
+
+//# sourceMappingURL=Download.js.map

package/presentation/FileActions/FileDetails/Download.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/FileActions/FileDetails/Download.js","sources":["../../../../src/presentation/FileActions/FileDetails/Download.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as DownloadIcon } from \"@webiny/icons/file_download.svg\";\nimport { FileManagerViewConfig, useFile } from \"~/index.js\";\n\nconst { FileDetails } = FileManagerViewConfig;\n\nexport const Download = () => {\n    const { file } = useFile();\n\n    return (\n        <a rel=\"noreferrer\" target={\"_blank\"} href={`${file.src}?original`}>\n            <FileDetails.Action.Button\n                label={\"Download\"}\n                icon={<DownloadIcon />}\n                onAction={() => {\n                    /* Do nothing. */\n                }}\n            />\n        </a>\n    );\n};\n"],"names":["FileDetails","FileManagerViewConfig","Download","file","useFile","DownloadIcon"],"mappings":";;;AAIA,MAAM,EAAEA,aAAAA,WAAW,EAAE,GAAGC;AAEjB,MAAMC,WAAW;IACpB,MAAM,EAAEC,IAAI,EAAE,GAAGC;IAEjB,OAAO,WAAP,GACI,oBAAC;QAAE,KAAI;QAAa,QAAQ;QAAU,MAAM,GAAGD,KAAK,GAAG,CAAC,SAAS,CAAC;qBAC9D,oBAACH,YAAY,MAAM,CAAC,MAAM;QACtB,OAAO;QACP,oBAAM,oBAACK,gBAAYA;QACnB,UAAU,KAEV;;AAIhB"}

package/presentation/FileActions/FileDetails/MoveToFolder.js

@@ -0,0 +1,16 @@
+import react from "react";
+import { ReactComponent } from "@webiny/icons/exit_to_app.svg";
+import { FileManagerViewConfig, useFile, useMoveFileToFolder } from "../../../index.js";
+const { FileDetails: FileDetails } = FileManagerViewConfig;
+const MoveToFolder = ()=>{
+    const { file } = useFile();
+    const moveToFolder = useMoveFileToFolder(file);
+    return /*#__PURE__*/ react.createElement(FileDetails.Action.Button, {
+        label: "Move",
+        icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+        onAction: moveToFolder
+    });
+};
+export { MoveToFolder };
+
+//# sourceMappingURL=MoveToFolder.js.map

package/presentation/FileActions/FileDetails/MoveToFolder.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/FileActions/FileDetails/MoveToFolder.js","sources":["../../../../src/presentation/FileActions/FileDetails/MoveToFolder.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as MoveIcon } from \"@webiny/icons/exit_to_app.svg\";\nimport { FileManagerViewConfig, useFile, useMoveFileToFolder } from \"~/index.js\";\n\nconst { FileDetails } = FileManagerViewConfig;\n\nexport const MoveToFolder = () => {\n    const { file } = useFile();\n    const moveToFolder = useMoveFileToFolder(file);\n\n    return <FileDetails.Action.Button label={\"Move\"} icon={<MoveIcon />} onAction={moveToFolder} />;\n};\n"],"names":["FileDetails","FileManagerViewConfig","MoveToFolder","file","useFile","moveToFolder","useMoveFileToFolder","MoveIcon"],"mappings":";;;AAIA,MAAM,EAAEA,aAAAA,WAAW,EAAE,GAAGC;AAEjB,MAAMC,eAAe;IACxB,MAAM,EAAEC,IAAI,EAAE,GAAGC;IACjB,MAAMC,eAAeC,oBAAoBH;IAEzC,OAAO,WAAP,GAAO,oBAACH,YAAY,MAAM,CAAC,MAAM;QAAC,OAAO;QAAQ,oBAAM,oBAACO,gBAAQA;QAAK,UAAUF;;AACnF"}

package/presentation/FileActions/Grid/Delete.js

@@ -0,0 +1,23 @@
+import react from "react";
+import { ReactComponent } from "@webiny/icons/delete.svg";
+import { FileManagerViewConfig, useFile } from "../../../index.js";
+import { useFileManagerPresenter } from "../../FileList/FileManagerPresenterProvider.js";
+import { useDeleteFile } from "../../hooks/useDeleteFile.js";
+const { Browser: Browser } = FileManagerViewConfig;
+const Delete = ()=>{
+    const { file } = useFile();
+    const { vm } = useFileManagerPresenter();
+    const { openDialogDeleteFile } = useDeleteFile({
+        file,
+        onDelete: close
+    });
+    return /*#__PURE__*/ react.createElement(Browser.Grid.Item.Action.IconButton, {
+        label: "Delete file",
+        icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+        onAction: openDialogDeleteFile,
+        disabled: !vm.permissions.canEditFile(file)
+    });
+};
+export { Delete };
+
+//# sourceMappingURL=Delete.js.map

package/presentation/FileActions/Grid/Delete.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/FileActions/Grid/Delete.js","sources":["../../../../src/presentation/FileActions/Grid/Delete.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as DeleteIcon } from \"@webiny/icons/delete.svg\";\nimport { FileManagerViewConfig, useFile } from \"~/index.js\";\nimport { useFileManagerPresenter } from \"~/presentation/FileList/FileManagerPresenterProvider.js\";\nimport { useDeleteFile } from \"~/presentation/hooks/useDeleteFile.js\";\n\nconst { Browser } = FileManagerViewConfig;\n\nexport const Delete = () => {\n    const { file } = useFile();\n    const { vm } = useFileManagerPresenter();\n\n    const { openDialogDeleteFile } = useDeleteFile({\n        file,\n        onDelete: close\n    });\n\n    return (\n        <Browser.Grid.Item.Action.IconButton\n            label={\"Delete file\"}\n            icon={<DeleteIcon />}\n            onAction={openDialogDeleteFile}\n            disabled={!vm.permissions.canEditFile(file)}\n        />\n    );\n};\n"],"names":["Browser","FileManagerViewConfig","Delete","file","useFile","vm","useFileManagerPresenter","openDialogDeleteFile","useDeleteFile","close","DeleteIcon"],"mappings":";;;;;AAMA,MAAM,EAAEA,SAAAA,OAAO,EAAE,GAAGC;AAEb,MAAMC,SAAS;IAClB,MAAM,EAAEC,IAAI,EAAE,GAAGC;IACjB,MAAM,EAAEC,EAAE,EAAE,GAAGC;IAEf,MAAM,EAAEC,oBAAoB,EAAE,GAAGC,cAAc;QAC3CL;QACA,UAAUM;IACd;IAEA,OAAO,WAAP,GACI,oBAACT,QAAQ,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,UAAU;QAChC,OAAO;QACP,oBAAM,oBAACU,gBAAUA;QACjB,UAAUH;QACV,UAAU,CAACF,GAAG,WAAW,CAAC,WAAW,CAACF;;AAGlD"}

package/presentation/FileActions/Grid/Download.js

@@ -0,0 +1,19 @@
+import react from "react";
+import { ReactComponent } from "@webiny/icons/file_download.svg";
+import { FileManagerViewConfig, useFile } from "../../../index.js";
+const { Browser: Browser } = FileManagerViewConfig;
+const Download = ()=>{
+    const { file } = useFile();
+    return /*#__PURE__*/ react.createElement("a", {
+        rel: "noreferrer",
+        target: "_blank",
+        href: `${file.src}?original`
+    }, /*#__PURE__*/ react.createElement(Browser.Grid.Item.Action.IconButton, {
+        icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+        label: "Download file",
+        onAction: ()=>{}
+    }));
+};
+export { Download };
+
+//# sourceMappingURL=Download.js.map

package/presentation/FileActions/Grid/Download.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/FileActions/Grid/Download.js","sources":["../../../../src/presentation/FileActions/Grid/Download.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as DownloadIcon } from \"@webiny/icons/file_download.svg\";\nimport { FileManagerViewConfig, useFile } from \"~/index.js\";\n\nconst { Browser } = FileManagerViewConfig;\n\nexport const Download = () => {\n    const { file } = useFile();\n\n    return (\n        <a rel=\"noreferrer\" target={\"_blank\"} href={`${file.src}?original`}>\n            <Browser.Grid.Item.Action.IconButton\n                icon={<DownloadIcon />}\n                label={\"Download file\"}\n                onAction={() => {\n                    /* Do nothing. */\n                }}\n            />\n        </a>\n    );\n};\n"],"names":["Browser","FileManagerViewConfig","Download","file","useFile","DownloadIcon"],"mappings":";;;AAIA,MAAM,EAAEA,SAAAA,OAAO,EAAE,GAAGC;AAEb,MAAMC,WAAW;IACpB,MAAM,EAAEC,IAAI,EAAE,GAAGC;IAEjB,OAAO,WAAP,GACI,oBAAC;QAAE,KAAI;QAAa,QAAQ;QAAU,MAAM,GAAGD,KAAK,GAAG,CAAC,SAAS,CAAC;qBAC9D,oBAACH,QAAQ,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,UAAU;QAChC,oBAAM,oBAACK,gBAAYA;QACnB,OAAO;QACP,UAAU,KAEV;;AAIhB"}