@strapi/upload 5.54.0 → 5.55.1

package/dist/admin/legacy/components/TableList/TableRows.js

@@ -0,0 +1,105 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var designSystem = require('@strapi/design-system');
+var icons = require('@strapi/icons');
+var reactIntl = require('react-intl');
+var reactRouterDom = require('react-router-dom');
+var constants = require('../../../constants.js');
+require('byte-size');
+require('date-fns');
+var getTrad = require('../../utils/getTrad.js');
+require('@strapi/admin/strapi-admin');
+require('qs');
+require('../../utils/urlYupSchema.js');
+var CellContent = require('./CellContent.js');
+
+const TableRows = ({ onChangeFolder = null, onEditAsset, onEditFolder, onSelectOne, rows = [], selected = [] })=>{
+    const { formatMessage } = reactIntl.useIntl();
+    const handleRowClickFn = (element, id, path, elementType)=>{
+        if (elementType === 'asset') {
+            onEditAsset(element);
+        } else {
+            if (onChangeFolder) {
+                onChangeFolder(id, path);
+            }
+        }
+    };
+    return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Tbody, {
+        children: rows.map((element)=>{
+            const { path, id, isSelectable, name, folderURL, type: contentType } = element;
+            const isSelected = !!selected.find((currentRow)=>currentRow.id === id && currentRow.type === contentType);
+            return /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Tr, {
+                onClick: ()=>handleRowClickFn(element, id, path || undefined, contentType),
+                children: [
+                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Td, {
+                        onClick: (e)=>e.stopPropagation(),
+                        children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Checkbox, {
+                            "aria-label": formatMessage({
+                                id: contentType === 'asset' ? 'list-assets-select' : 'list.folder.select',
+                                defaultMessage: contentType === 'asset' ? 'Select {name} asset' : 'Select {name} folder'
+                            }, {
+                                name
+                            }),
+                            disabled: !isSelectable,
+                            onCheckedChange: ()=>onSelectOne(element),
+                            onPointerDown: (e)=>{
+                                e.preventDefault();
+                            },
+                            checked: isSelected
+                        })
+                    }),
+                    constants.tableHeaders.map(({ name, type: cellType })=>{
+                        return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Td, {
+                            children: /*#__PURE__*/ jsxRuntime.jsx(CellContent.CellContent, {
+                                content: element,
+                                cellType: cellType,
+                                contentType: contentType,
+                                name: name
+                            })
+                        }, name);
+                    }),
+                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Td, {
+                        onClick: (e)=>e.stopPropagation(),
+                        children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
+                            justifyContent: "flex-end",
+                            children: [
+                                contentType === 'folder' && (folderURL ? /*#__PURE__*/ jsxRuntime.jsx(designSystem.IconButton, {
+                                    tag: reactRouterDom.Link,
+                                    label: formatMessage({
+                                        id: getTrad.getTrad('list.folders.link-label'),
+                                        defaultMessage: 'Access folder'
+                                    }),
+                                    to: folderURL,
+                                    variant: "ghost",
+                                    children: /*#__PURE__*/ jsxRuntime.jsx(icons.Eye, {})
+                                }) : /*#__PURE__*/ jsxRuntime.jsx(designSystem.IconButton, {
+                                    tag: "button",
+                                    label: formatMessage({
+                                        id: getTrad.getTrad('list.folders.link-label'),
+                                        defaultMessage: 'Access folder'
+                                    }),
+                                    onClick: ()=>onChangeFolder && onChangeFolder(id),
+                                    variant: "ghost",
+                                    children: /*#__PURE__*/ jsxRuntime.jsx(icons.Eye, {})
+                                })),
+                                /*#__PURE__*/ jsxRuntime.jsx(designSystem.IconButton, {
+                                    label: formatMessage({
+                                        id: getTrad.getTrad('control-card.edit'),
+                                        defaultMessage: 'Edit'
+                                    }),
+                                    onClick: ()=>contentType === 'asset' ? onEditAsset(element) : onEditFolder(element),
+                                    variant: "ghost",
+                                    children: /*#__PURE__*/ jsxRuntime.jsx(icons.Pencil, {})
+                                })
+                            ]
+                        })
+                    })
+                ]
+            }, `${contentType}-${id}`);
+        })
+    });
+};
+
+exports.TableRows = TableRows;
+//# sourceMappingURL=TableRows.js.map

package/dist/admin/legacy/components/TableList/TableRows.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableRows.js","sources":["../../../../../admin/src/legacy/components/TableList/TableRows.tsx"],"sourcesContent":["import { Checkbox, Flex, IconButton, Tbody, Td, Tr } from '@strapi/design-system';\nimport { Eye, Pencil } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { Link } from 'react-router-dom';\n\nimport { tableHeaders as cells } from '../../../constants';\nimport { getTrad } from '../../utils';\n\nimport { CellContent } from './CellContent';\n\nimport type { File } from '../../../../../shared/contracts/files';\nimport type { Folder } from '../../../../../shared/contracts/folders';\n\ninterface FileRow extends File {\n  folderURL?: string;\n  isSelectable?: boolean;\n  type?: string;\n}\n\ninterface FolderRow extends Folder {\n  folderURL?: string;\n  isSelectable?: boolean;\n  type?: string;\n}\n\nexport interface TableRowsProps {\n  onChangeFolder?: ((folderId: number, folderPath?: string) => void) | null;\n  onEditAsset: (asset: FileRow) => void;\n  onEditFolder: (folder: FolderRow) => void;\n  onSelectOne: (element: FileRow | FolderRow) => void;\n  rows: FileRow[] | FolderRow[];\n  selected: FileRow[] | FolderRow[];\n}\n\nexport const TableRows = ({\n  onChangeFolder = null,\n  onEditAsset,\n  onEditFolder,\n  onSelectOne,\n  rows = [],\n  selected = [],\n}: TableRowsProps) => {\n  const { formatMessage } = useIntl();\n\n  const handleRowClickFn = (\n    element: FileRow | FolderRow,\n    id: number,\n    path: FolderRow['path'],\n    elementType?: string\n  ) => {\n    if (elementType === 'asset') {\n      onEditAsset(element as FileRow);\n    } else {\n      if (onChangeFolder) {\n        onChangeFolder(id, path);\n      }\n    }\n  };\n\n  return (\n    <Tbody>\n      {rows.map((element) => {\n        const { path, id, isSelectable, name, folderURL, type: contentType } = element;\n\n        const isSelected = !!selected.find(\n          (currentRow) => currentRow.id === id && currentRow.type === contentType\n        );\n\n        return (\n          <Tr\n            key={`${contentType}-${id}`}\n            onClick={() => handleRowClickFn(element, id, path || undefined, contentType)}\n          >\n            <Td onClick={(e) => e.stopPropagation()}>\n              <Checkbox\n                aria-label={formatMessage(\n                  {\n                    id: contentType === 'asset' ? 'list-assets-select' : 'list.folder.select',\n                    defaultMessage:\n                      contentType === 'asset' ? 'Select {name} asset' : 'Select {name} folder',\n                  },\n                  { name }\n                )}\n                disabled={!isSelectable}\n                onCheckedChange={() => onSelectOne(element)}\n                onPointerDown={(e) => {\n                  e.preventDefault();\n                }}\n                checked={isSelected}\n              />\n            </Td>\n            {cells.map(({ name, type: cellType }) => {\n              return (\n                <Td key={name}>\n                  <CellContent\n                    content={element as FileRow}\n                    cellType={cellType}\n                    contentType={contentType}\n                    name={name}\n                  />\n                </Td>\n              );\n            })}\n\n            <Td onClick={(e) => e.stopPropagation()}>\n              <Flex justifyContent=\"flex-end\">\n                {contentType === 'folder' &&\n                  (folderURL ? (\n                    <IconButton\n                      tag={Link}\n                      label={formatMessage({\n                        id: getTrad('list.folders.link-label'),\n                        defaultMessage: 'Access folder',\n                      })}\n                      to={folderURL}\n                      variant=\"ghost\"\n                    >\n                      <Eye />\n                    </IconButton>\n                  ) : (\n                    <IconButton\n                      tag=\"button\"\n                      label={formatMessage({\n                        id: getTrad('list.folders.link-label'),\n                        defaultMessage: 'Access folder',\n                      })}\n                      onClick={() => onChangeFolder && onChangeFolder(id)}\n                      variant=\"ghost\"\n                    >\n                      <Eye />\n                    </IconButton>\n                  ))}\n                <IconButton\n                  label={formatMessage({\n                    id: getTrad('control-card.edit'),\n                    defaultMessage: 'Edit',\n                  })}\n                  onClick={() =>\n                    contentType === 'asset'\n                      ? onEditAsset(element as FileRow)\n                      : onEditFolder(element as FolderRow)\n                  }\n                  variant=\"ghost\"\n                >\n                  <Pencil />\n                </IconButton>\n              </Flex>\n            </Td>\n          </Tr>\n        );\n      })}\n    </Tbody>\n  );\n};\n"],"names":["TableRows","onChangeFolder","onEditAsset","onEditFolder","onSelectOne","rows","selected","formatMessage","useIntl","handleRowClickFn","element","id","path","elementType","_jsx","Tbody","map","isSelectable","name","folderURL","type","contentType","isSelected","find","currentRow","_jsxs","Tr","onClick","undefined","Td","e","stopPropagation","Checkbox","aria-label","defaultMessage","disabled","onCheckedChange","onPointerDown","preventDefault","checked","cells","cellType","CellContent","content","Flex","justifyContent","IconButton","tag","Link","label","getTrad","to","variant","Eye","Pencil"],"mappings":"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"}

package/dist/admin/legacy/components/TableList/TableRows.mjs

@@ -0,0 +1,103 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { Tbody, Tr, Td, Checkbox, Flex, IconButton } from '@strapi/design-system';
+import { Eye, Pencil } from '@strapi/icons';
+import { useIntl } from 'react-intl';
+import { Link } from 'react-router-dom';
+import { tableHeaders } from '../../../constants.mjs';
+import 'byte-size';
+import 'date-fns';
+import { getTrad } from '../../utils/getTrad.mjs';
+import '@strapi/admin/strapi-admin';
+import 'qs';
+import '../../utils/urlYupSchema.mjs';
+import { CellContent } from './CellContent.mjs';
+
+const TableRows = ({ onChangeFolder = null, onEditAsset, onEditFolder, onSelectOne, rows = [], selected = [] })=>{
+    const { formatMessage } = useIntl();
+    const handleRowClickFn = (element, id, path, elementType)=>{
+        if (elementType === 'asset') {
+            onEditAsset(element);
+        } else {
+            if (onChangeFolder) {
+                onChangeFolder(id, path);
+            }
+        }
+    };
+    return /*#__PURE__*/ jsx(Tbody, {
+        children: rows.map((element)=>{
+            const { path, id, isSelectable, name, folderURL, type: contentType } = element;
+            const isSelected = !!selected.find((currentRow)=>currentRow.id === id && currentRow.type === contentType);
+            return /*#__PURE__*/ jsxs(Tr, {
+                onClick: ()=>handleRowClickFn(element, id, path || undefined, contentType),
+                children: [
+                    /*#__PURE__*/ jsx(Td, {
+                        onClick: (e)=>e.stopPropagation(),
+                        children: /*#__PURE__*/ jsx(Checkbox, {
+                            "aria-label": formatMessage({
+                                id: contentType === 'asset' ? 'list-assets-select' : 'list.folder.select',
+                                defaultMessage: contentType === 'asset' ? 'Select {name} asset' : 'Select {name} folder'
+                            }, {
+                                name
+                            }),
+                            disabled: !isSelectable,
+                            onCheckedChange: ()=>onSelectOne(element),
+                            onPointerDown: (e)=>{
+                                e.preventDefault();
+                            },
+                            checked: isSelected
+                        })
+                    }),
+                    tableHeaders.map(({ name, type: cellType })=>{
+                        return /*#__PURE__*/ jsx(Td, {
+                            children: /*#__PURE__*/ jsx(CellContent, {
+                                content: element,
+                                cellType: cellType,
+                                contentType: contentType,
+                                name: name
+                            })
+                        }, name);
+                    }),
+                    /*#__PURE__*/ jsx(Td, {
+                        onClick: (e)=>e.stopPropagation(),
+                        children: /*#__PURE__*/ jsxs(Flex, {
+                            justifyContent: "flex-end",
+                            children: [
+                                contentType === 'folder' && (folderURL ? /*#__PURE__*/ jsx(IconButton, {
+                                    tag: Link,
+                                    label: formatMessage({
+                                        id: getTrad('list.folders.link-label'),
+                                        defaultMessage: 'Access folder'
+                                    }),
+                                    to: folderURL,
+                                    variant: "ghost",
+                                    children: /*#__PURE__*/ jsx(Eye, {})
+                                }) : /*#__PURE__*/ jsx(IconButton, {
+                                    tag: "button",
+                                    label: formatMessage({
+                                        id: getTrad('list.folders.link-label'),
+                                        defaultMessage: 'Access folder'
+                                    }),
+                                    onClick: ()=>onChangeFolder && onChangeFolder(id),
+                                    variant: "ghost",
+                                    children: /*#__PURE__*/ jsx(Eye, {})
+                                })),
+                                /*#__PURE__*/ jsx(IconButton, {
+                                    label: formatMessage({
+                                        id: getTrad('control-card.edit'),
+                                        defaultMessage: 'Edit'
+                                    }),
+                                    onClick: ()=>contentType === 'asset' ? onEditAsset(element) : onEditFolder(element),
+                                    variant: "ghost",
+                                    children: /*#__PURE__*/ jsx(Pencil, {})
+                                })
+                            ]
+                        })
+                    })
+                ]
+            }, `${contentType}-${id}`);
+        })
+    });
+};
+
+export { TableRows };
+//# sourceMappingURL=TableRows.mjs.map

package/dist/admin/legacy/components/TableList/TableRows.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableRows.mjs","sources":["../../../../../admin/src/legacy/components/TableList/TableRows.tsx"],"sourcesContent":["import { Checkbox, Flex, IconButton, Tbody, Td, Tr } from '@strapi/design-system';\nimport { Eye, Pencil } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { Link } from 'react-router-dom';\n\nimport { tableHeaders as cells } from '../../../constants';\nimport { getTrad } from '../../utils';\n\nimport { CellContent } from './CellContent';\n\nimport type { File } from '../../../../../shared/contracts/files';\nimport type { Folder } from '../../../../../shared/contracts/folders';\n\ninterface FileRow extends File {\n  folderURL?: string;\n  isSelectable?: boolean;\n  type?: string;\n}\n\ninterface FolderRow extends Folder {\n  folderURL?: string;\n  isSelectable?: boolean;\n  type?: string;\n}\n\nexport interface TableRowsProps {\n  onChangeFolder?: ((folderId: number, folderPath?: string) => void) | null;\n  onEditAsset: (asset: FileRow) => void;\n  onEditFolder: (folder: FolderRow) => void;\n  onSelectOne: (element: FileRow | FolderRow) => void;\n  rows: FileRow[] | FolderRow[];\n  selected: FileRow[] | FolderRow[];\n}\n\nexport const TableRows = ({\n  onChangeFolder = null,\n  onEditAsset,\n  onEditFolder,\n  onSelectOne,\n  rows = [],\n  selected = [],\n}: TableRowsProps) => {\n  const { formatMessage } = useIntl();\n\n  const handleRowClickFn = (\n    element: FileRow | FolderRow,\n    id: number,\n    path: FolderRow['path'],\n    elementType?: string\n  ) => {\n    if (elementType === 'asset') {\n      onEditAsset(element as FileRow);\n    } else {\n      if (onChangeFolder) {\n        onChangeFolder(id, path);\n      }\n    }\n  };\n\n  return (\n    <Tbody>\n      {rows.map((element) => {\n        const { path, id, isSelectable, name, folderURL, type: contentType } = element;\n\n        const isSelected = !!selected.find(\n          (currentRow) => currentRow.id === id && currentRow.type === contentType\n        );\n\n        return (\n          <Tr\n            key={`${contentType}-${id}`}\n            onClick={() => handleRowClickFn(element, id, path || undefined, contentType)}\n          >\n            <Td onClick={(e) => e.stopPropagation()}>\n              <Checkbox\n                aria-label={formatMessage(\n                  {\n                    id: contentType === 'asset' ? 'list-assets-select' : 'list.folder.select',\n                    defaultMessage:\n                      contentType === 'asset' ? 'Select {name} asset' : 'Select {name} folder',\n                  },\n                  { name }\n                )}\n                disabled={!isSelectable}\n                onCheckedChange={() => onSelectOne(element)}\n                onPointerDown={(e) => {\n                  e.preventDefault();\n                }}\n                checked={isSelected}\n              />\n            </Td>\n            {cells.map(({ name, type: cellType }) => {\n              return (\n                <Td key={name}>\n                  <CellContent\n                    content={element as FileRow}\n                    cellType={cellType}\n                    contentType={contentType}\n                    name={name}\n                  />\n                </Td>\n              );\n            })}\n\n            <Td onClick={(e) => e.stopPropagation()}>\n              <Flex justifyContent=\"flex-end\">\n                {contentType === 'folder' &&\n                  (folderURL ? (\n                    <IconButton\n                      tag={Link}\n                      label={formatMessage({\n                        id: getTrad('list.folders.link-label'),\n                        defaultMessage: 'Access folder',\n                      })}\n                      to={folderURL}\n                      variant=\"ghost\"\n                    >\n                      <Eye />\n                    </IconButton>\n                  ) : (\n                    <IconButton\n                      tag=\"button\"\n                      label={formatMessage({\n                        id: getTrad('list.folders.link-label'),\n                        defaultMessage: 'Access folder',\n                      })}\n                      onClick={() => onChangeFolder && onChangeFolder(id)}\n                      variant=\"ghost\"\n                    >\n                      <Eye />\n                    </IconButton>\n                  ))}\n                <IconButton\n                  label={formatMessage({\n                    id: getTrad('control-card.edit'),\n                    defaultMessage: 'Edit',\n                  })}\n                  onClick={() =>\n                    contentType === 'asset'\n                      ? onEditAsset(element as FileRow)\n                      : onEditFolder(element as FolderRow)\n                  }\n                  variant=\"ghost\"\n                >\n                  <Pencil />\n                </IconButton>\n              </Flex>\n            </Td>\n          </Tr>\n        );\n      })}\n    </Tbody>\n  );\n};\n"],"names":["TableRows","onChangeFolder","onEditAsset","onEditFolder","onSelectOne","rows","selected","formatMessage","useIntl","handleRowClickFn","element","id","path","elementType","_jsx","Tbody","map","isSelectable","name","folderURL","type","contentType","isSelected","find","currentRow","_jsxs","Tr","onClick","undefined","Td","e","stopPropagation","Checkbox","aria-label","defaultMessage","disabled","onCheckedChange","onPointerDown","preventDefault","checked","cells","cellType","CellContent","content","Flex","justifyContent","IconButton","tag","Link","label","getTrad","to","variant","Eye","Pencil"],"mappings":"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"}

package/dist/admin/legacy/components/UploadAssetDialog/AddAssetStep/AddAssetStep.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AddAssetStep.js","sources":["../../../../../../admin/src/legacy/components/UploadAssetDialog/AddAssetStep/AddAssetStep.tsx"],"sourcesContent":["import { Box, Divider, Modal, Tabs } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\n\nimport { getTrad } from '../../../utils';\n\nimport { FromComputerForm } from './FromComputerForm';\nimport { FromUrlForm } from './FromUrlForm';\n\nimport type { RawFile, File } from '../../../../../../shared/contracts/files';\n\nexport interface FileWithRawFile extends Omit<File, 'id' | 'hash'> {\n  id?: string;\n  hash?: string;\n  rawFile: RawFile;\n}\n\ninterface AddAssetStepProps {\n  onClose: () => void;\n  onAddAsset: (assets: FileWithRawFile[]) => void;\n  trackedLocation?: string;\n}\n\nexport const AddAssetStep = ({ onClose, onAddAsset, trackedLocation }: AddAssetStepProps) => {\n  const { formatMessage } = useIntl();\n\n  return (\n    <>\n      <Modal.Header>\n        <Modal.Title>\n          {formatMessage({\n            id: getTrad('header.actions.add-assets'),\n            defaultMessage: 'Add new assets',\n          })}\n        </Modal.Title>\n      </Modal.Header>\n      <Tabs.Root variant=\"simple\" defaultValue=\"computer\">\n        <Box paddingLeft={8} paddingRight={8} paddingTop={6}>\n          <Tabs.List\n            aria-label={formatMessage({\n              id: getTrad('tabs.title'),\n              defaultMessage: 'How do you want to upload your assets?',\n            })}\n          >\n            <Tabs.Trigger value=\"computer\">\n              {formatMessage({\n                id: getTrad('modal.nav.computer'),\n                defaultMessage: 'From computer',\n              })}\n            </Tabs.Trigger>\n            <Tabs.Trigger value=\"url\">\n              {formatMessage({\n                id: getTrad('modal.nav.url'),\n                defaultMessage: 'From URL',\n              })}\n            </Tabs.Trigger>\n          </Tabs.List>\n\n          <Divider />\n        </Box>\n        <Tabs.Content value=\"computer\">\n          <FromComputerForm\n            onClose={onClose}\n            onAddAssets={onAddAsset}\n            trackedLocation={trackedLocation}\n          />\n        </Tabs.Content>\n        <Tabs.Content value=\"url\">\n          <FromUrlForm\n            onClose={onClose}\n            onAddAsset={onAddAsset}\n            trackedLocation={trackedLocation}\n          />\n        </Tabs.Content>\n      </Tabs.Root>\n    </>\n  );\n};\n"],"names":["AddAssetStep","onClose","onAddAsset","trackedLocation","formatMessage","useIntl","_jsxs","_Fragment","_jsx","Modal","Header","Title","id","getTrad","defaultMessage","Tabs","Root","variant","defaultValue","Box","paddingLeft","paddingRight","paddingTop","List","aria-label","Trigger","value","Divider","Content","FromComputerForm","onAddAssets","FromUrlForm"],"mappings":";;;;;;;;;;;;;;AAsBO,MAAMA,eAAe,CAAC,EAAEC,OAAO,EAAEC,UAAU,EAAEC,eAAe,EAAqB,GAAA;IACtF,MAAM,EAAEC,aAAa,EAAE,GAAGC,iBAAAA,EAAAA;IAE1B,qBACEC,eAAA,CAAAC,mBAAA,EAAA;;AACE,0BAAAC,cAAA,CAACC,mBAAMC,MAAM,EAAA;wCACXF,cAAA,CAACC,mBAAME,KAAK,EAAA;8BACTP,aAAAA,CAAc;AACbQ,wBAAAA,EAAAA,EAAIC,eAAAA,CAAQ,2BAAA,CAAA;wBACZC,cAAAA,EAAgB;AAClB,qBAAA;;;AAGJ,0BAAAR,eAAA,CAACS,kBAAKC,IAAI,EAAA;gBAACC,OAAAA,EAAQ,QAAA;gBAASC,YAAAA,EAAa,UAAA;;kCACvCZ,eAAA,CAACa,gBAAAA,EAAAA;wBAAIC,WAAAA,EAAa,CAAA;wBAAGC,YAAAA,EAAc,CAAA;wBAAGC,UAAAA,EAAY,CAAA;;AAChD,0CAAAhB,eAAA,CAACS,kBAAKQ,IAAI,EAAA;AACRC,gCAAAA,YAAAA,EAAYpB,aAAAA,CAAc;AACxBQ,oCAAAA,EAAAA,EAAIC,eAAAA,CAAQ,YAAA,CAAA;oCACZC,cAAAA,EAAgB;AAClB,iCAAA,CAAA;;AAEA,kDAAAN,cAAA,CAACO,kBAAKU,OAAO,EAAA;wCAACC,KAAAA,EAAM,UAAA;kDACjBtB,aAAAA,CAAc;AACbQ,4CAAAA,EAAAA,EAAIC,eAAAA,CAAQ,oBAAA,CAAA;4CACZC,cAAAA,EAAgB;AAClB,yCAAA;;AAEF,kDAAAN,cAAA,CAACO,kBAAKU,OAAO,EAAA;wCAACC,KAAAA,EAAM,KAAA;kDACjBtB,aAAAA,CAAc;AACbQ,4CAAAA,EAAAA,EAAIC,eAAAA,CAAQ,eAAA,CAAA;4CACZC,cAAAA,EAAgB;AAClB,yCAAA;;;;0CAIJN,cAAA,CAACmB,oBAAAA,EAAAA,EAAAA;;;AAEH,kCAAAnB,cAAA,CAACO,kBAAKa,OAAO,EAAA;wBAACF,KAAAA,EAAM,UAAA;AAClB,wBAAA,QAAA,gBAAAlB,cAAA,CAACqB,iCAAAA,EAAAA;4BACC5B,OAAAA,EAASA,OAAAA;4BACT6B,WAAAA,EAAa5B,UAAAA;4BACbC,eAAAA,EAAiBA;;;AAGrB,kCAAAK,cAAA,CAACO,kBAAKa,OAAO,EAAA;wBAACF,KAAAA,EAAM,KAAA;AAClB,wBAAA,QAAA,gBAAAlB,cAAA,CAACuB,uBAAAA,EAAAA;4BACC9B,OAAAA,EAASA,OAAAA;4BACTC,UAAAA,EAAYA,UAAAA;4BACZC,eAAAA,EAAiBA;;;;;;;AAM7B;;;;"}

package/dist/admin/legacy/components/UploadAssetDialog/AddAssetStep/AddAssetStep.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AddAssetStep.mjs","sources":["../../../../../../admin/src/legacy/components/UploadAssetDialog/AddAssetStep/AddAssetStep.tsx"],"sourcesContent":["import { Box, Divider, Modal, Tabs } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\n\nimport { getTrad } from '../../../utils';\n\nimport { FromComputerForm } from './FromComputerForm';\nimport { FromUrlForm } from './FromUrlForm';\n\nimport type { RawFile, File } from '../../../../../../shared/contracts/files';\n\nexport interface FileWithRawFile extends Omit<File, 'id' | 'hash'> {\n  id?: string;\n  hash?: string;\n  rawFile: RawFile;\n}\n\ninterface AddAssetStepProps {\n  onClose: () => void;\n  onAddAsset: (assets: FileWithRawFile[]) => void;\n  trackedLocation?: string;\n}\n\nexport const AddAssetStep = ({ onClose, onAddAsset, trackedLocation }: AddAssetStepProps) => {\n  const { formatMessage } = useIntl();\n\n  return (\n    <>\n      <Modal.Header>\n        <Modal.Title>\n          {formatMessage({\n            id: getTrad('header.actions.add-assets'),\n            defaultMessage: 'Add new assets',\n          })}\n        </Modal.Title>\n      </Modal.Header>\n      <Tabs.Root variant=\"simple\" defaultValue=\"computer\">\n        <Box paddingLeft={8} paddingRight={8} paddingTop={6}>\n          <Tabs.List\n            aria-label={formatMessage({\n              id: getTrad('tabs.title'),\n              defaultMessage: 'How do you want to upload your assets?',\n            })}\n          >\n            <Tabs.Trigger value=\"computer\">\n              {formatMessage({\n                id: getTrad('modal.nav.computer'),\n                defaultMessage: 'From computer',\n              })}\n            </Tabs.Trigger>\n            <Tabs.Trigger value=\"url\">\n              {formatMessage({\n                id: getTrad('modal.nav.url'),\n                defaultMessage: 'From URL',\n              })}\n            </Tabs.Trigger>\n          </Tabs.List>\n\n          <Divider />\n        </Box>\n        <Tabs.Content value=\"computer\">\n          <FromComputerForm\n            onClose={onClose}\n            onAddAssets={onAddAsset}\n            trackedLocation={trackedLocation}\n          />\n        </Tabs.Content>\n        <Tabs.Content value=\"url\">\n          <FromUrlForm\n            onClose={onClose}\n            onAddAsset={onAddAsset}\n            trackedLocation={trackedLocation}\n          />\n        </Tabs.Content>\n      </Tabs.Root>\n    </>\n  );\n};\n"],"names":["AddAssetStep","onClose","onAddAsset","trackedLocation","formatMessage","useIntl","_jsxs","_Fragment","_jsx","Modal","Header","Title","id","getTrad","defaultMessage","Tabs","Root","variant","defaultValue","Box","paddingLeft","paddingRight","paddingTop","List","aria-label","Trigger","value","Divider","Content","FromComputerForm","onAddAssets","FromUrlForm"],"mappings":";;;;;;;;;;;;AAsBO,MAAMA,eAAe,CAAC,EAAEC,OAAO,EAAEC,UAAU,EAAEC,eAAe,EAAqB,GAAA;IACtF,MAAM,EAAEC,aAAa,EAAE,GAAGC,OAAAA,EAAAA;IAE1B,qBACEC,IAAA,CAAAC,QAAA,EAAA;;AACE,0BAAAC,GAAA,CAACC,MAAMC,MAAM,EAAA;wCACXF,GAAA,CAACC,MAAME,KAAK,EAAA;8BACTP,aAAAA,CAAc;AACbQ,wBAAAA,EAAAA,EAAIC,OAAAA,CAAQ,2BAAA,CAAA;wBACZC,cAAAA,EAAgB;AAClB,qBAAA;;;AAGJ,0BAAAR,IAAA,CAACS,KAAKC,IAAI,EAAA;gBAACC,OAAAA,EAAQ,QAAA;gBAASC,YAAAA,EAAa,UAAA;;kCACvCZ,IAAA,CAACa,GAAAA,EAAAA;wBAAIC,WAAAA,EAAa,CAAA;wBAAGC,YAAAA,EAAc,CAAA;wBAAGC,UAAAA,EAAY,CAAA;;AAChD,0CAAAhB,IAAA,CAACS,KAAKQ,IAAI,EAAA;AACRC,gCAAAA,YAAAA,EAAYpB,aAAAA,CAAc;AACxBQ,oCAAAA,EAAAA,EAAIC,OAAAA,CAAQ,YAAA,CAAA;oCACZC,cAAAA,EAAgB;AAClB,iCAAA,CAAA;;AAEA,kDAAAN,GAAA,CAACO,KAAKU,OAAO,EAAA;wCAACC,KAAAA,EAAM,UAAA;kDACjBtB,aAAAA,CAAc;AACbQ,4CAAAA,EAAAA,EAAIC,OAAAA,CAAQ,oBAAA,CAAA;4CACZC,cAAAA,EAAgB;AAClB,yCAAA;;AAEF,kDAAAN,GAAA,CAACO,KAAKU,OAAO,EAAA;wCAACC,KAAAA,EAAM,KAAA;kDACjBtB,aAAAA,CAAc;AACbQ,4CAAAA,EAAAA,EAAIC,OAAAA,CAAQ,eAAA,CAAA;4CACZC,cAAAA,EAAgB;AAClB,yCAAA;;;;0CAIJN,GAAA,CAACmB,OAAAA,EAAAA,EAAAA;;;AAEH,kCAAAnB,GAAA,CAACO,KAAKa,OAAO,EAAA;wBAACF,KAAAA,EAAM,UAAA;AAClB,wBAAA,QAAA,gBAAAlB,GAAA,CAACqB,gBAAAA,EAAAA;4BACC5B,OAAAA,EAASA,OAAAA;4BACT6B,WAAAA,EAAa5B,UAAAA;4BACbC,eAAAA,EAAiBA;;;AAGrB,kCAAAK,GAAA,CAACO,KAAKa,OAAO,EAAA;wBAACF,KAAAA,EAAM,KAAA;AAClB,wBAAA,QAAA,gBAAAlB,GAAA,CAACuB,WAAAA,EAAAA;4BACC9B,OAAAA,EAASA,OAAAA;4BACTC,UAAAA,EAAYA,UAAAA;4BACZC,eAAAA,EAAiBA;;;;;;;AAM7B;;;;"}

package/dist/admin/legacy/components/UploadAssetDialog/AddAssetStep/FromComputerForm.js

@@ -0,0 +1,177 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var designSystem = require('@strapi/design-system');
+var icons = require('@strapi/icons');
+var reactIntl = require('react-intl');
+var styledComponents = require('styled-components');
+var constants = require('../../../../constants.js');
+var useTracking = require('../../../hooks/useTracking.js');
+require('byte-size');
+require('date-fns');
+var getTrad = require('../../../utils/getTrad.js');
+require('@strapi/admin/strapi-admin');
+require('qs');
+var rawFileToAsset = require('../../../utils/rawFileToAsset.js');
+require('../../../utils/urlYupSchema.js');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+const Wrapper = styledComponents.styled(designSystem.Flex)`
+  flex-direction: column;
+`;
+const IconWrapper = styledComponents.styled.div`
+  font-size: 6rem;
+
+  svg path {
+    fill: ${({ theme })=>theme.colors.primary600};
+  }
+`;
+const MediaBox = styledComponents.styled(designSystem.Box)`
+  border-style: dashed;
+`;
+const OpaqueBox = styledComponents.styled(designSystem.Box)`
+  opacity: 0;
+  cursor: pointer;
+`;
+const FromComputerForm = ({ onClose, onAddAssets, trackedLocation })=>{
+    const { formatMessage } = reactIntl.useIntl();
+    const [dragOver, setDragOver] = React__namespace.useState(false);
+    const inputRef = React__namespace.useRef(null);
+    const { trackUsage } = useTracking.useTracking();
+    const handleDragOver = (event)=>{
+        event.preventDefault();
+    };
+    const handleDragEnter = (event)=>{
+        event.preventDefault();
+        setDragOver(true);
+    };
+    const handleDragLeave = ()=>setDragOver(false);
+    const filesToAssets = async (fileList)=>{
+        const files = Array.from(fileList);
+        return Promise.all(files.map((file)=>rawFileToAsset.rawFileToAsset(file, constants.ASSET_SOURCES.Computer)));
+    };
+    const handleChange = async ()=>{
+        const files = inputRef.current?.files;
+        const assets = files ? await filesToAssets(files) : [];
+        if (trackedLocation) {
+            trackUsage('didSelectFile', {
+                source: 'computer',
+                location: trackedLocation
+            });
+        }
+        onAddAssets(assets);
+    };
+    const handleDrop = async (e)=>{
+        e.preventDefault();
+        if (e?.dataTransfer?.files) {
+            const assets = await filesToAssets(e.dataTransfer.files);
+            onAddAssets(assets);
+        }
+        setDragOver(false);
+    };
+    return /*#__PURE__*/ jsxRuntime.jsxs("form", {
+        children: [
+            /*#__PURE__*/ jsxRuntime.jsx(designSystem.Box, {
+                paddingLeft: 8,
+                paddingRight: 8,
+                paddingTop: 6,
+                paddingBottom: 6,
+                children: /*#__PURE__*/ jsxRuntime.jsx("label", {
+                    children: /*#__PURE__*/ jsxRuntime.jsx(MediaBox, {
+                        paddingTop: 11,
+                        paddingBottom: 11,
+                        hasRadius: true,
+                        justifyContent: "center",
+                        borderColor: dragOver ? 'primary500' : 'neutral300',
+                        background: dragOver ? 'primary100' : 'neutral100',
+                        position: "relative",
+                        onDragEnter: handleDragEnter,
+                        onDragLeave: handleDragLeave,
+                        onDragOver: handleDragOver,
+                        onDrop: handleDrop,
+                        children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Flex, {
+                            justifyContent: "center",
+                            children: /*#__PURE__*/ jsxRuntime.jsxs(Wrapper, {
+                                children: [
+                                    /*#__PURE__*/ jsxRuntime.jsx(IconWrapper, {
+                                        children: /*#__PURE__*/ jsxRuntime.jsx(icons.PlusCircle, {
+                                            "aria-hidden": true,
+                                            width: "3.2rem",
+                                            height: "3.2rem"
+                                        })
+                                    }),
+                                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Box, {
+                                        paddingTop: 3,
+                                        paddingBottom: 5,
+                                        children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
+                                            variant: "delta",
+                                            textColor: "neutral600",
+                                            tag: "span",
+                                            children: formatMessage({
+                                                id: getTrad.getTrad('input.label'),
+                                                defaultMessage: 'Drag & Drop here or'
+                                            })
+                                        })
+                                    }),
+                                    /*#__PURE__*/ jsxRuntime.jsx(OpaqueBox, {
+                                        tag: "input",
+                                        position: "absolute",
+                                        left: 0,
+                                        right: 0,
+                                        bottom: 0,
+                                        top: 0,
+                                        width: "100%",
+                                        type: "file",
+                                        multiple: true,
+                                        name: "files",
+                                        "aria-label": formatMessage({
+                                            id: getTrad.getTrad('input.label'),
+                                            defaultMessage: 'Drag & Drop here or'
+                                        }),
+                                        tabIndex: -1,
+                                        ref: inputRef,
+                                        zIndex: 1,
+                                        onChange: handleChange
+                                    })
+                                ]
+                            })
+                        })
+                    })
+                })
+            }),
+            /*#__PURE__*/ jsxRuntime.jsx(designSystem.Modal.Footer, {
+                children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Button, {
+                    onClick: onClose,
+                    variant: "tertiary",
+                    children: formatMessage({
+                        id: 'app.components.Button.cancel',
+                        defaultMessage: 'cancel'
+                    })
+                })
+            })
+        ]
+    });
+};
+
+exports.FromComputerForm = FromComputerForm;
+//# sourceMappingURL=FromComputerForm.js.map

package/dist/admin/legacy/components/UploadAssetDialog/AddAssetStep/FromComputerForm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FromComputerForm.js","sources":["../../../../../../admin/src/legacy/components/UploadAssetDialog/AddAssetStep/FromComputerForm.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Box, Button, Flex, Modal, Typography } from '@strapi/design-system';\nimport { PlusCircle as PicturePlus } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { ASSET_SOURCES } from '../../../../constants';\nimport { useTracking } from '../../../hooks/useTracking';\nimport { getTrad, rawFileToAsset } from '../../../utils';\n\nimport type { FileWithRawFile } from './AddAssetStep';\n\nconst Wrapper = styled(Flex)`\n  flex-direction: column;\n`;\n\nconst IconWrapper = styled.div`\n  font-size: 6rem;\n\n  svg path {\n    fill: ${({ theme }) => theme.colors.primary600};\n  }\n`;\n\nconst MediaBox = styled(Box)`\n  border-style: dashed;\n`;\n\nconst OpaqueBox = styled(Box)`\n  opacity: 0;\n  cursor: pointer;\n`;\n\ninterface FromComputerFormProps {\n  onClose: () => void;\n  onAddAssets: (assets: FileWithRawFile[]) => void;\n  trackedLocation?: string;\n}\n\nexport const FromComputerForm = ({\n  onClose,\n  onAddAssets,\n  trackedLocation,\n}: FromComputerFormProps) => {\n  const { formatMessage } = useIntl();\n  const [dragOver, setDragOver] = React.useState(false);\n  const inputRef = React.useRef<HTMLInputElement>(null);\n  const { trackUsage } = useTracking();\n\n  const handleDragOver = (event: React.DragEvent<HTMLDivElement>) => {\n    event.preventDefault();\n  };\n\n  const handleDragEnter = (event: React.DragEvent<HTMLDivElement>) => {\n    event.preventDefault();\n    setDragOver(true);\n  };\n\n  const handleDragLeave = () => setDragOver(false);\n\n  const filesToAssets = async (fileList: FileList) => {\n    const files = Array.from(fileList);\n\n    return Promise.all(files.map((file) => rawFileToAsset(file, ASSET_SOURCES.Computer)));\n  };\n\n  const handleChange = async () => {\n    const files = inputRef.current?.files;\n    const assets = files ? await filesToAssets(files) : [];\n\n    if (trackedLocation) {\n      trackUsage('didSelectFile', { source: 'computer', location: trackedLocation });\n    }\n\n    onAddAssets(assets);\n  };\n\n  const handleDrop = async (e: React.DragEvent<HTMLDivElement>) => {\n    e.preventDefault();\n\n    if (e?.dataTransfer?.files) {\n      const assets = await filesToAssets(e.dataTransfer.files);\n      onAddAssets(assets);\n    }\n\n    setDragOver(false);\n  };\n\n  return (\n    <form>\n      <Box paddingLeft={8} paddingRight={8} paddingTop={6} paddingBottom={6}>\n        <label>\n          <MediaBox\n            paddingTop={11}\n            paddingBottom={11}\n            hasRadius\n            justifyContent=\"center\"\n            borderColor={dragOver ? 'primary500' : 'neutral300'}\n            background={dragOver ? 'primary100' : 'neutral100'}\n            position=\"relative\"\n            onDragEnter={handleDragEnter}\n            onDragLeave={handleDragLeave}\n            onDragOver={handleDragOver}\n            onDrop={handleDrop}\n          >\n            <Flex justifyContent=\"center\">\n              <Wrapper>\n                <IconWrapper>\n                  <PicturePlus aria-hidden width=\"3.2rem\" height=\"3.2rem\" />\n                </IconWrapper>\n\n                <Box paddingTop={3} paddingBottom={5}>\n                  <Typography variant=\"delta\" textColor=\"neutral600\" tag=\"span\">\n                    {formatMessage({\n                      id: getTrad('input.label'),\n                      defaultMessage: 'Drag & Drop here or',\n                    })}\n                  </Typography>\n                </Box>\n\n                <OpaqueBox\n                  tag=\"input\"\n                  position=\"absolute\"\n                  left={0}\n                  right={0}\n                  bottom={0}\n                  top={0}\n                  width=\"100%\"\n                  type=\"file\"\n                  multiple\n                  name=\"files\"\n                  aria-label={formatMessage({\n                    id: getTrad('input.label'),\n                    defaultMessage: 'Drag & Drop here or',\n                  })}\n                  tabIndex={-1}\n                  ref={inputRef}\n                  zIndex={1}\n                  onChange={handleChange}\n                />\n              </Wrapper>\n            </Flex>\n          </MediaBox>\n        </label>\n      </Box>\n\n      <Modal.Footer>\n        <Button onClick={onClose} variant=\"tertiary\">\n          {formatMessage({\n            id: 'app.components.Button.cancel',\n            defaultMessage: 'cancel',\n          })}\n        </Button>\n      </Modal.Footer>\n    </form>\n  );\n};\n"],"names":["Wrapper","styled","Flex","IconWrapper","div","theme","colors","primary600","MediaBox","Box","OpaqueBox","FromComputerForm","onClose","onAddAssets","trackedLocation","formatMessage","useIntl","dragOver","setDragOver","React","useState","inputRef","useRef","trackUsage","useTracking","handleDragOver","event","preventDefault","handleDragEnter","handleDragLeave","filesToAssets","fileList","files","Array","from","Promise","all","map","file","rawFileToAsset","ASSET_SOURCES","Computer","handleChange","current","assets","source","location","handleDrop","e","dataTransfer","_jsxs","form","_jsx","paddingLeft","paddingRight","paddingTop","paddingBottom","label","hasRadius","justifyContent","borderColor","background","position","onDragEnter","onDragLeave","onDragOver","onDrop","PicturePlus","aria-hidden","width","height","Typography","variant","textColor","tag","id","getTrad","defaultMessage","left","right","bottom","top","type","multiple","name","aria-label","tabIndex","ref","zIndex","onChange","Modal","Footer","Button","onClick"],"mappings":"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"}

package/dist/admin/legacy/components/UploadAssetDialog/AddAssetStep/FromComputerForm.mjs

@@ -0,0 +1,155 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import * as React from 'react';
+import { Flex, Box, Typography, Modal, Button } from '@strapi/design-system';
+import { PlusCircle } from '@strapi/icons';
+import { useIntl } from 'react-intl';
+import { styled } from 'styled-components';
+import { ASSET_SOURCES } from '../../../../constants.mjs';
+import { useTracking } from '../../../hooks/useTracking.mjs';
+import 'byte-size';
+import 'date-fns';
+import { getTrad } from '../../../utils/getTrad.mjs';
+import '@strapi/admin/strapi-admin';
+import 'qs';
+import { rawFileToAsset } from '../../../utils/rawFileToAsset.mjs';
+import '../../../utils/urlYupSchema.mjs';
+
+const Wrapper = styled(Flex)`
+  flex-direction: column;
+`;
+const IconWrapper = styled.div`
+  font-size: 6rem;
+
+  svg path {
+    fill: ${({ theme })=>theme.colors.primary600};
+  }
+`;
+const MediaBox = styled(Box)`
+  border-style: dashed;
+`;
+const OpaqueBox = styled(Box)`
+  opacity: 0;
+  cursor: pointer;
+`;
+const FromComputerForm = ({ onClose, onAddAssets, trackedLocation })=>{
+    const { formatMessage } = useIntl();
+    const [dragOver, setDragOver] = React.useState(false);
+    const inputRef = React.useRef(null);
+    const { trackUsage } = useTracking();
+    const handleDragOver = (event)=>{
+        event.preventDefault();
+    };
+    const handleDragEnter = (event)=>{
+        event.preventDefault();
+        setDragOver(true);
+    };
+    const handleDragLeave = ()=>setDragOver(false);
+    const filesToAssets = async (fileList)=>{
+        const files = Array.from(fileList);
+        return Promise.all(files.map((file)=>rawFileToAsset(file, ASSET_SOURCES.Computer)));
+    };
+    const handleChange = async ()=>{
+        const files = inputRef.current?.files;
+        const assets = files ? await filesToAssets(files) : [];
+        if (trackedLocation) {
+            trackUsage('didSelectFile', {
+                source: 'computer',
+                location: trackedLocation
+            });
+        }
+        onAddAssets(assets);
+    };
+    const handleDrop = async (e)=>{
+        e.preventDefault();
+        if (e?.dataTransfer?.files) {
+            const assets = await filesToAssets(e.dataTransfer.files);
+            onAddAssets(assets);
+        }
+        setDragOver(false);
+    };
+    return /*#__PURE__*/ jsxs("form", {
+        children: [
+            /*#__PURE__*/ jsx(Box, {
+                paddingLeft: 8,
+                paddingRight: 8,
+                paddingTop: 6,
+                paddingBottom: 6,
+                children: /*#__PURE__*/ jsx("label", {
+                    children: /*#__PURE__*/ jsx(MediaBox, {
+                        paddingTop: 11,
+                        paddingBottom: 11,
+                        hasRadius: true,
+                        justifyContent: "center",
+                        borderColor: dragOver ? 'primary500' : 'neutral300',
+                        background: dragOver ? 'primary100' : 'neutral100',
+                        position: "relative",
+                        onDragEnter: handleDragEnter,
+                        onDragLeave: handleDragLeave,
+                        onDragOver: handleDragOver,
+                        onDrop: handleDrop,
+                        children: /*#__PURE__*/ jsx(Flex, {
+                            justifyContent: "center",
+                            children: /*#__PURE__*/ jsxs(Wrapper, {
+                                children: [
+                                    /*#__PURE__*/ jsx(IconWrapper, {
+                                        children: /*#__PURE__*/ jsx(PlusCircle, {
+                                            "aria-hidden": true,
+                                            width: "3.2rem",
+                                            height: "3.2rem"
+                                        })
+                                    }),
+                                    /*#__PURE__*/ jsx(Box, {
+                                        paddingTop: 3,
+                                        paddingBottom: 5,
+                                        children: /*#__PURE__*/ jsx(Typography, {
+                                            variant: "delta",
+                                            textColor: "neutral600",
+                                            tag: "span",
+                                            children: formatMessage({
+                                                id: getTrad('input.label'),
+                                                defaultMessage: 'Drag & Drop here or'
+                                            })
+                                        })
+                                    }),
+                                    /*#__PURE__*/ jsx(OpaqueBox, {
+                                        tag: "input",
+                                        position: "absolute",
+                                        left: 0,
+                                        right: 0,
+                                        bottom: 0,
+                                        top: 0,
+                                        width: "100%",
+                                        type: "file",
+                                        multiple: true,
+                                        name: "files",
+                                        "aria-label": formatMessage({
+                                            id: getTrad('input.label'),
+                                            defaultMessage: 'Drag & Drop here or'
+                                        }),
+                                        tabIndex: -1,
+                                        ref: inputRef,
+                                        zIndex: 1,
+                                        onChange: handleChange
+                                    })
+                                ]
+                            })
+                        })
+                    })
+                })
+            }),
+            /*#__PURE__*/ jsx(Modal.Footer, {
+                children: /*#__PURE__*/ jsx(Button, {
+                    onClick: onClose,
+                    variant: "tertiary",
+                    children: formatMessage({
+                        id: 'app.components.Button.cancel',
+                        defaultMessage: 'cancel'
+                    })
+                })
+            })
+        ]
+    });
+};
+
+export { FromComputerForm };
+//# sourceMappingURL=FromComputerForm.mjs.map