@strapi/upload 5.12.1 → 5.12.3

package/dist/admin/components/TableList/CellContent.js

@@ -0,0 +1,76 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var designSystem = require('@strapi/design-system');
+var parseISO = require('date-fns/parseISO');
+var reactIntl = require('react-intl');
+var formatBytes = require('../../utils/formatBytes.js');
+require('date-fns');
+require('qs');
+var getFileExtension = require('../../utils/getFileExtension.js');
+require('../../constants.js');
+require('../../utils/urlYupSchema.js');
+var PreviewCell = require('./PreviewCell.js');
+
+const CellContent = ({ cellType, contentType, content, name })=>{
+    const { formatDate, formatMessage } = reactIntl.useIntl();
+    const contentValue = content[name];
+    switch(cellType){
+        case 'image':
+            return /*#__PURE__*/ jsxRuntime.jsx(PreviewCell.PreviewCell, {
+                type: contentType,
+                content: content
+            });
+        case 'date':
+            if (typeof contentValue === 'string') {
+                return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
+                    children: formatDate(parseISO(contentValue), {
+                        dateStyle: 'full'
+                    })
+                });
+            }
+        case 'size':
+            if (contentType === 'folder') return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
+                "aria-label": formatMessage({
+                    id: 'list.table.content.empty-label',
+                    defaultMessage: 'This field is empty'
+                }),
+                children: "-"
+            });
+            if (typeof contentValue === 'string' || typeof contentValue === 'number') {
+                return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
+                    children: formatBytes.formatBytes(contentValue)
+                });
+            }
+        case 'ext':
+            if (contentType === 'folder') return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
+                "aria-label": formatMessage({
+                    id: 'list.table.content.empty-label',
+                    defaultMessage: 'This field is empty'
+                }),
+                children: "-"
+            });
+            if (typeof contentValue === 'string') {
+                return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
+                    children: getFileExtension.getFileExtension(contentValue)?.toUpperCase()
+                });
+            }
+        case 'text':
+            if (typeof contentValue === 'string') {
+                return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
+                    children: contentValue
+                });
+            }
+        default:
+            return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
+                "aria-label": formatMessage({
+                    id: 'list.table.content.empty-label',
+                    defaultMessage: 'This field is empty'
+                }),
+                children: "-"
+            });
+    }
+};
+
+exports.CellContent = CellContent;
+//# sourceMappingURL=CellContent.js.map

package/dist/admin/components/TableList/CellContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CellContent.js","sources":["../../../../admin/src/components/TableList/CellContent.tsx"],"sourcesContent":["import { Typography } from '@strapi/design-system';\nimport parseISO from 'date-fns/parseISO';\nimport { useIntl } from 'react-intl';\n\nimport { formatBytes, getFileExtension } from '../../utils';\n\nimport { PreviewCell } from './PreviewCell';\n\nimport type { File } from '../../../../shared/contracts/files';\n\nexport interface CellContentProps {\n  cellType: string;\n  contentType?: string;\n  content: File;\n  name: string;\n}\n\nexport const CellContent = ({ cellType, contentType, content, name }: CellContentProps) => {\n  const { formatDate, formatMessage } = useIntl();\n  const contentValue = content[name as Extract<keyof File, string>];\n\n  switch (cellType) {\n    case 'image':\n      return <PreviewCell type={contentType} content={content} />;\n\n    case 'date':\n      if (typeof contentValue === 'string') {\n        return <Typography>{formatDate(parseISO(contentValue), { dateStyle: 'full' })}</Typography>;\n      }\n\n    case 'size':\n      if (contentType === 'folder')\n        return (\n          <Typography\n            aria-label={formatMessage({\n              id: 'list.table.content.empty-label',\n              defaultMessage: 'This field is empty',\n            })}\n          >\n            -\n          </Typography>\n        );\n      if (typeof contentValue === 'string' || typeof contentValue === 'number') {\n        return <Typography>{formatBytes(contentValue)}</Typography>;\n      }\n\n    case 'ext':\n      if (contentType === 'folder')\n        return (\n          <Typography\n            aria-label={formatMessage({\n              id: 'list.table.content.empty-label',\n              defaultMessage: 'This field is empty',\n            })}\n          >\n            -\n          </Typography>\n        );\n\n      if (typeof contentValue === 'string') {\n        return <Typography>{getFileExtension(contentValue)?.toUpperCase()}</Typography>;\n      }\n    case 'text':\n      if (typeof contentValue === 'string') {\n        return <Typography>{contentValue}</Typography>;\n      }\n\n    default:\n      return (\n        <Typography\n          aria-label={formatMessage({\n            id: 'list.table.content.empty-label',\n            defaultMessage: 'This field is empty',\n          })}\n        >\n          -\n        </Typography>\n      );\n  }\n};\n"],"names":["CellContent","cellType","contentType","content","name","formatDate","formatMessage","useIntl","contentValue","_jsx","PreviewCell","type","Typography","parseISO","dateStyle","aria-label","id","defaultMessage","formatBytes","getFileExtension","toUpperCase"],"mappings":";;;;;;;;;;;;;;AAiBO,MAAMA,WAAc,GAAA,CAAC,EAAEC,QAAQ,EAAEC,WAAW,EAAEC,OAAO,EAAEC,IAAI,EAAoB,GAAA;AACpF,IAAA,MAAM,EAAEC,UAAU,EAAEC,aAAa,EAAE,GAAGC,iBAAAA,EAAAA;IACtC,MAAMC,YAAAA,GAAeL,OAAO,CAACC,IAAoC,CAAA;IAEjE,OAAQH,QAAAA;QACN,KAAK,OAAA;AACH,YAAA,qBAAOQ,cAACC,CAAAA,uBAAAA,EAAAA;gBAAYC,IAAMT,EAAAA,WAAAA;gBAAaC,OAASA,EAAAA;;QAElD,KAAK,MAAA;YACH,IAAI,OAAOK,iBAAiB,QAAU,EAAA;AACpC,gBAAA,qBAAOC,cAACG,CAAAA,uBAAAA,EAAAA;AAAYP,oBAAAA,QAAAA,EAAAA,UAAAA,CAAWQ,SAASL,YAAe,CAAA,EAAA;wBAAEM,SAAW,EAAA;AAAO,qBAAA;;AAC7E;QAEF,KAAK,MAAA;YACH,IAAIZ,WAAAA,KAAgB,QAClB,EAAA,qBACEO,cAACG,CAAAA,uBAAAA,EAAAA;AACCG,gBAAAA,YAAAA,EAAYT,aAAc,CAAA;oBACxBU,EAAI,EAAA,gCAAA;oBACJC,cAAgB,EAAA;AAClB,iBAAA,CAAA;AACD,gBAAA,QAAA,EAAA;;AAIL,YAAA,IAAI,OAAOT,YAAAA,KAAiB,QAAY,IAAA,OAAOA,iBAAiB,QAAU,EAAA;AACxE,gBAAA,qBAAOC,cAACG,CAAAA,uBAAAA,EAAAA;8BAAYM,uBAAYV,CAAAA,YAAAA;;AAClC;QAEF,KAAK,KAAA;YACH,IAAIN,WAAAA,KAAgB,QAClB,EAAA,qBACEO,cAACG,CAAAA,uBAAAA,EAAAA;AACCG,gBAAAA,YAAAA,EAAYT,aAAc,CAAA;oBACxBU,EAAI,EAAA,gCAAA;oBACJC,cAAgB,EAAA;AAClB,iBAAA,CAAA;AACD,gBAAA,QAAA,EAAA;;YAKL,IAAI,OAAOT,iBAAiB,QAAU,EAAA;AACpC,gBAAA,qBAAOC,cAACG,CAAAA,uBAAAA,EAAAA;AAAYO,oBAAAA,QAAAA,EAAAA,iCAAAA,CAAiBX,YAAeY,CAAAA,EAAAA,WAAAA;;AACtD;QACF,KAAK,MAAA;YACH,IAAI,OAAOZ,iBAAiB,QAAU,EAAA;AACpC,gBAAA,qBAAOC,cAACG,CAAAA,uBAAAA,EAAAA;AAAYJ,oBAAAA,QAAAA,EAAAA;;AACtB;AAEF,QAAA;AACE,YAAA,qBACEC,cAACG,CAAAA,uBAAAA,EAAAA;AACCG,gBAAAA,YAAAA,EAAYT,aAAc,CAAA;oBACxBU,EAAI,EAAA,gCAAA;oBACJC,cAAgB,EAAA;AAClB,iBAAA,CAAA;AACD,gBAAA,QAAA,EAAA;;AAIP;AACF;;;;"}

package/dist/admin/components/TableList/CellContent.mjs

@@ -0,0 +1,74 @@
+import { jsx } from 'react/jsx-runtime';
+import { Typography } from '@strapi/design-system';
+import parseISO from 'date-fns/parseISO';
+import { useIntl } from 'react-intl';
+import { formatBytes } from '../../utils/formatBytes.mjs';
+import 'date-fns';
+import 'qs';
+import { getFileExtension } from '../../utils/getFileExtension.mjs';
+import '../../constants.mjs';
+import '../../utils/urlYupSchema.mjs';
+import { PreviewCell } from './PreviewCell.mjs';
+
+const CellContent = ({ cellType, contentType, content, name })=>{
+    const { formatDate, formatMessage } = useIntl();
+    const contentValue = content[name];
+    switch(cellType){
+        case 'image':
+            return /*#__PURE__*/ jsx(PreviewCell, {
+                type: contentType,
+                content: content
+            });
+        case 'date':
+            if (typeof contentValue === 'string') {
+                return /*#__PURE__*/ jsx(Typography, {
+                    children: formatDate(parseISO(contentValue), {
+                        dateStyle: 'full'
+                    })
+                });
+            }
+        case 'size':
+            if (contentType === 'folder') return /*#__PURE__*/ jsx(Typography, {
+                "aria-label": formatMessage({
+                    id: 'list.table.content.empty-label',
+                    defaultMessage: 'This field is empty'
+                }),
+                children: "-"
+            });
+            if (typeof contentValue === 'string' || typeof contentValue === 'number') {
+                return /*#__PURE__*/ jsx(Typography, {
+                    children: formatBytes(contentValue)
+                });
+            }
+        case 'ext':
+            if (contentType === 'folder') return /*#__PURE__*/ jsx(Typography, {
+                "aria-label": formatMessage({
+                    id: 'list.table.content.empty-label',
+                    defaultMessage: 'This field is empty'
+                }),
+                children: "-"
+            });
+            if (typeof contentValue === 'string') {
+                return /*#__PURE__*/ jsx(Typography, {
+                    children: getFileExtension(contentValue)?.toUpperCase()
+                });
+            }
+        case 'text':
+            if (typeof contentValue === 'string') {
+                return /*#__PURE__*/ jsx(Typography, {
+                    children: contentValue
+                });
+            }
+        default:
+            return /*#__PURE__*/ jsx(Typography, {
+                "aria-label": formatMessage({
+                    id: 'list.table.content.empty-label',
+                    defaultMessage: 'This field is empty'
+                }),
+                children: "-"
+            });
+    }
+};
+
+export { CellContent };
+//# sourceMappingURL=CellContent.mjs.map

package/dist/admin/components/TableList/CellContent.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CellContent.mjs","sources":["../../../../admin/src/components/TableList/CellContent.tsx"],"sourcesContent":["import { Typography } from '@strapi/design-system';\nimport parseISO from 'date-fns/parseISO';\nimport { useIntl } from 'react-intl';\n\nimport { formatBytes, getFileExtension } from '../../utils';\n\nimport { PreviewCell } from './PreviewCell';\n\nimport type { File } from '../../../../shared/contracts/files';\n\nexport interface CellContentProps {\n  cellType: string;\n  contentType?: string;\n  content: File;\n  name: string;\n}\n\nexport const CellContent = ({ cellType, contentType, content, name }: CellContentProps) => {\n  const { formatDate, formatMessage } = useIntl();\n  const contentValue = content[name as Extract<keyof File, string>];\n\n  switch (cellType) {\n    case 'image':\n      return <PreviewCell type={contentType} content={content} />;\n\n    case 'date':\n      if (typeof contentValue === 'string') {\n        return <Typography>{formatDate(parseISO(contentValue), { dateStyle: 'full' })}</Typography>;\n      }\n\n    case 'size':\n      if (contentType === 'folder')\n        return (\n          <Typography\n            aria-label={formatMessage({\n              id: 'list.table.content.empty-label',\n              defaultMessage: 'This field is empty',\n            })}\n          >\n            -\n          </Typography>\n        );\n      if (typeof contentValue === 'string' || typeof contentValue === 'number') {\n        return <Typography>{formatBytes(contentValue)}</Typography>;\n      }\n\n    case 'ext':\n      if (contentType === 'folder')\n        return (\n          <Typography\n            aria-label={formatMessage({\n              id: 'list.table.content.empty-label',\n              defaultMessage: 'This field is empty',\n            })}\n          >\n            -\n          </Typography>\n        );\n\n      if (typeof contentValue === 'string') {\n        return <Typography>{getFileExtension(contentValue)?.toUpperCase()}</Typography>;\n      }\n    case 'text':\n      if (typeof contentValue === 'string') {\n        return <Typography>{contentValue}</Typography>;\n      }\n\n    default:\n      return (\n        <Typography\n          aria-label={formatMessage({\n            id: 'list.table.content.empty-label',\n            defaultMessage: 'This field is empty',\n          })}\n        >\n          -\n        </Typography>\n      );\n  }\n};\n"],"names":["CellContent","cellType","contentType","content","name","formatDate","formatMessage","useIntl","contentValue","_jsx","PreviewCell","type","Typography","parseISO","dateStyle","aria-label","id","defaultMessage","formatBytes","getFileExtension","toUpperCase"],"mappings":";;;;;;;;;;;;AAiBO,MAAMA,WAAc,GAAA,CAAC,EAAEC,QAAQ,EAAEC,WAAW,EAAEC,OAAO,EAAEC,IAAI,EAAoB,GAAA;AACpF,IAAA,MAAM,EAAEC,UAAU,EAAEC,aAAa,EAAE,GAAGC,OAAAA,EAAAA;IACtC,MAAMC,YAAAA,GAAeL,OAAO,CAACC,IAAoC,CAAA;IAEjE,OAAQH,QAAAA;QACN,KAAK,OAAA;AACH,YAAA,qBAAOQ,GAACC,CAAAA,WAAAA,EAAAA;gBAAYC,IAAMT,EAAAA,WAAAA;gBAAaC,OAASA,EAAAA;;QAElD,KAAK,MAAA;YACH,IAAI,OAAOK,iBAAiB,QAAU,EAAA;AACpC,gBAAA,qBAAOC,GAACG,CAAAA,UAAAA,EAAAA;AAAYP,oBAAAA,QAAAA,EAAAA,UAAAA,CAAWQ,SAASL,YAAe,CAAA,EAAA;wBAAEM,SAAW,EAAA;AAAO,qBAAA;;AAC7E;QAEF,KAAK,MAAA;YACH,IAAIZ,WAAAA,KAAgB,QAClB,EAAA,qBACEO,GAACG,CAAAA,UAAAA,EAAAA;AACCG,gBAAAA,YAAAA,EAAYT,aAAc,CAAA;oBACxBU,EAAI,EAAA,gCAAA;oBACJC,cAAgB,EAAA;AAClB,iBAAA,CAAA;AACD,gBAAA,QAAA,EAAA;;AAIL,YAAA,IAAI,OAAOT,YAAAA,KAAiB,QAAY,IAAA,OAAOA,iBAAiB,QAAU,EAAA;AACxE,gBAAA,qBAAOC,GAACG,CAAAA,UAAAA,EAAAA;8BAAYM,WAAYV,CAAAA,YAAAA;;AAClC;QAEF,KAAK,KAAA;YACH,IAAIN,WAAAA,KAAgB,QAClB,EAAA,qBACEO,GAACG,CAAAA,UAAAA,EAAAA;AACCG,gBAAAA,YAAAA,EAAYT,aAAc,CAAA;oBACxBU,EAAI,EAAA,gCAAA;oBACJC,cAAgB,EAAA;AAClB,iBAAA,CAAA;AACD,gBAAA,QAAA,EAAA;;YAKL,IAAI,OAAOT,iBAAiB,QAAU,EAAA;AACpC,gBAAA,qBAAOC,GAACG,CAAAA,UAAAA,EAAAA;AAAYO,oBAAAA,QAAAA,EAAAA,gBAAAA,CAAiBX,YAAeY,CAAAA,EAAAA,WAAAA;;AACtD;QACF,KAAK,MAAA;YACH,IAAI,OAAOZ,iBAAiB,QAAU,EAAA;AACpC,gBAAA,qBAAOC,GAACG,CAAAA,UAAAA,EAAAA;AAAYJ,oBAAAA,QAAAA,EAAAA;;AACtB;AAEF,QAAA;AACE,YAAA,qBACEC,GAACG,CAAAA,UAAAA,EAAAA;AACCG,gBAAAA,YAAAA,EAAYT,aAAc,CAAA;oBACxBU,EAAI,EAAA,gCAAA;oBACJC,cAAgB,EAAA;AAClB,iBAAA,CAAA;AACD,gBAAA,QAAA,EAAA;;AAIP;AACF;;;;"}

package/dist/admin/components/TableList/PreviewCell.js

@@ -0,0 +1,82 @@
+'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 styledComponents = require('styled-components');
+var constants = require('../../constants.js');
+var createAssetUrl = require('../../utils/createAssetUrl.js');
+require('byte-size');
+require('date-fns');
+var getTrad = require('../../utils/getTrad.js');
+require('qs');
+var getFileExtension = require('../../utils/getFileExtension.js');
+var prefixFileUrlWithBackendUrl = require('../../utils/prefixFileUrlWithBackendUrl.js');
+require('../../utils/urlYupSchema.js');
+var VideoPreview = require('../AssetCard/VideoPreview.js');
+
+const VideoPreviewWrapper = styledComponents.styled(designSystem.Box)`
+  figure {
+    width: ${({ theme })=>theme.spaces[7]};
+    height: ${({ theme })=>theme.spaces[7]};
+  }
+
+  canvas,
+  video {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+    border-radius: 50%;
+  }
+`;
+const PreviewCell = ({ type, content })=>{
+    const { formatMessage } = reactIntl.useIntl();
+    if (type === 'folder') {
+        return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Flex, {
+            justifyContent: "center",
+            background: "secondary100",
+            width: "3.2rem",
+            height: "3.2rem",
+            borderRadius: "50%",
+            children: /*#__PURE__*/ jsxRuntime.jsx(icons.Folder, {
+                "aria-label": formatMessage({
+                    id: getTrad.getTrad('header.actions.add-assets.folder'),
+                    defaultMessage: 'folder'
+                }),
+                fill: "secondary500",
+                width: "1.6rem",
+                height: "1.6rem"
+            })
+        });
+    }
+    const { alternativeText, ext, formats, mime, name, url } = content;
+    if (mime?.includes(constants.AssetType.Image)) {
+        const mediaURL = prefixFileUrlWithBackendUrl.prefixFileUrlWithBackendUrl(formats?.thumbnail?.url) ?? prefixFileUrlWithBackendUrl.prefixFileUrlWithBackendUrl(url);
+        return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Avatar.Item, {
+            src: mediaURL,
+            alt: alternativeText || undefined,
+            preview: true,
+            fallback: alternativeText
+        });
+    }
+    if (mime?.includes(constants.AssetType.Video)) {
+        return /*#__PURE__*/ jsxRuntime.jsx(VideoPreviewWrapper, {
+            children: /*#__PURE__*/ jsxRuntime.jsx(VideoPreview.VideoPreview, {
+                url: createAssetUrl.createAssetUrl(content, true) || '',
+                mime: mime,
+                alt: alternativeText ?? name
+            })
+        });
+    }
+    return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Box, {
+        background: "secondary100",
+        color: "secondary600",
+        width: "3.2rem",
+        height: "3.2rem",
+        children: getFileExtension.getFileExtension(ext)
+    });
+};
+
+exports.PreviewCell = PreviewCell;
+//# sourceMappingURL=PreviewCell.js.map

package/dist/admin/components/TableList/PreviewCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PreviewCell.js","sources":["../../../../admin/src/components/TableList/PreviewCell.tsx"],"sourcesContent":["import { Avatar, Box, Flex } from '@strapi/design-system';\nimport { Folder } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { AssetType } from '../../constants';\nimport {\n  createAssetUrl,\n  getFileExtension,\n  getTrad,\n  prefixFileUrlWithBackendUrl,\n} from '../../utils';\nimport { VideoPreview } from '../AssetCard/VideoPreview';\n\nimport type { File } from '../../../../shared/contracts/files';\n\nconst VideoPreviewWrapper = styled(Box)`\n  figure {\n    width: ${({ theme }) => theme.spaces[7]};\n    height: ${({ theme }) => theme.spaces[7]};\n  }\n\n  canvas,\n  video {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n    border-radius: 50%;\n  }\n`;\n\ninterface PreviewCellProps {\n  content: File;\n  type?: string;\n}\n\nexport const PreviewCell = ({ type, content }: PreviewCellProps) => {\n  const { formatMessage } = useIntl();\n  if (type === 'folder') {\n    return (\n      <Flex\n        justifyContent=\"center\"\n        background=\"secondary100\"\n        width=\"3.2rem\"\n        height=\"3.2rem\"\n        borderRadius=\"50%\"\n      >\n        <Folder\n          aria-label={formatMessage({\n            id: getTrad('header.actions.add-assets.folder'),\n            defaultMessage: 'folder',\n          })}\n          fill=\"secondary500\"\n          width=\"1.6rem\"\n          height=\"1.6rem\"\n        />\n      </Flex>\n    );\n  }\n\n  const { alternativeText, ext, formats, mime, name, url } = content;\n\n  if (mime?.includes(AssetType.Image)) {\n    const mediaURL =\n      prefixFileUrlWithBackendUrl(formats?.thumbnail?.url) ?? prefixFileUrlWithBackendUrl(url);\n\n    return (\n      <Avatar.Item\n        src={mediaURL}\n        alt={alternativeText || undefined}\n        preview\n        fallback={alternativeText}\n      />\n    );\n  }\n\n  if (mime?.includes(AssetType.Video)) {\n    return (\n      <VideoPreviewWrapper>\n        <VideoPreview\n          url={createAssetUrl(content, true) || ''}\n          mime={mime}\n          alt={alternativeText ?? name}\n        />\n      </VideoPreviewWrapper>\n    );\n  }\n\n  return (\n    <Box background=\"secondary100\" color=\"secondary600\" width=\"3.2rem\" height=\"3.2rem\">\n      {getFileExtension(ext)}\n    </Box>\n  );\n};\n"],"names":["VideoPreviewWrapper","styled","Box","theme","spaces","PreviewCell","type","content","formatMessage","useIntl","_jsx","Flex","justifyContent","background","width","height","borderRadius","Folder","aria-label","id","getTrad","defaultMessage","fill","alternativeText","ext","formats","mime","name","url","includes","AssetType","Image","mediaURL","prefixFileUrlWithBackendUrl","thumbnail","Avatar","Item","src","alt","undefined","preview","fallback","Video","VideoPreview","createAssetUrl","color","getFileExtension"],"mappings":";;;;;;;;;;;;;;;;;;AAgBA,MAAMA,mBAAAA,GAAsBC,uBAAOC,CAAAA,gBAAAA,CAAI;;WAE5B,EAAE,CAAC,EAAEC,KAAK,EAAE,GAAKA,KAAMC,CAAAA,MAAM,CAAC,CAAA,CAAE,CAAC;YAChC,EAAE,CAAC,EAAED,KAAK,EAAE,GAAKA,KAAMC,CAAAA,MAAM,CAAC,CAAA,CAAE,CAAC;;;;;;;;;;AAU7C,CAAC;MAOYC,WAAc,GAAA,CAAC,EAAEC,IAAI,EAAEC,OAAO,EAAoB,GAAA;IAC7D,MAAM,EAAEC,aAAa,EAAE,GAAGC,iBAAAA,EAAAA;AAC1B,IAAA,IAAIH,SAAS,QAAU,EAAA;AACrB,QAAA,qBACEI,cAACC,CAAAA,iBAAAA,EAAAA;YACCC,cAAe,EAAA,QAAA;YACfC,UAAW,EAAA,cAAA;YACXC,KAAM,EAAA,QAAA;YACNC,MAAO,EAAA,QAAA;YACPC,YAAa,EAAA,KAAA;AAEb,YAAA,QAAA,gBAAAN,cAACO,CAAAA,YAAAA,EAAAA;AACCC,gBAAAA,YAAAA,EAAYV,aAAc,CAAA;AACxBW,oBAAAA,EAAAA,EAAIC,eAAQ,CAAA,kCAAA,CAAA;oBACZC,cAAgB,EAAA;AAClB,iBAAA,CAAA;gBACAC,IAAK,EAAA,cAAA;gBACLR,KAAM,EAAA,QAAA;gBACNC,MAAO,EAAA;;;AAIf;AAEA,IAAA,MAAM,EAAEQ,eAAe,EAAEC,GAAG,EAAEC,OAAO,EAAEC,IAAI,EAAEC,IAAI,EAAEC,GAAG,EAAE,GAAGrB,OAAAA;AAE3D,IAAA,IAAImB,IAAMG,EAAAA,QAAAA,CAASC,mBAAUC,CAAAA,KAAK,CAAG,EAAA;AACnC,QAAA,MAAMC,QACJC,GAAAA,uDAAAA,CAA4BR,OAASS,EAAAA,SAAAA,EAAWN,QAAQK,uDAA4BL,CAAAA,GAAAA,CAAAA;QAEtF,qBACElB,cAAA,CAACyB,oBAAOC,IAAI,EAAA;YACVC,GAAKL,EAAAA,QAAAA;AACLM,YAAAA,GAAAA,EAAKf,eAAmBgB,IAAAA,SAAAA;YACxBC,OAAO,EAAA,IAAA;YACPC,QAAUlB,EAAAA;;AAGhB;AAEA,IAAA,IAAIG,IAAMG,EAAAA,QAAAA,CAASC,mBAAUY,CAAAA,KAAK,CAAG,EAAA;AACnC,QAAA,qBACEhC,cAACV,CAAAA,mBAAAA,EAAAA;AACC,YAAA,QAAA,gBAAAU,cAACiC,CAAAA,yBAAAA,EAAAA;gBACCf,GAAKgB,EAAAA,6BAAAA,CAAerC,SAAS,IAAS,CAAA,IAAA,EAAA;gBACtCmB,IAAMA,EAAAA,IAAAA;AACNY,gBAAAA,GAAAA,EAAKf,eAAmBI,IAAAA;;;AAIhC;AAEA,IAAA,qBACEjB,cAACR,CAAAA,gBAAAA,EAAAA;QAAIW,UAAW,EAAA,cAAA;QAAegC,KAAM,EAAA,cAAA;QAAe/B,KAAM,EAAA,QAAA;QAASC,MAAO,EAAA,QAAA;kBACvE+B,iCAAiBtB,CAAAA,GAAAA;;AAGxB;;;;"}

package/dist/admin/components/TableList/PreviewCell.mjs

@@ -0,0 +1,80 @@
+import { jsx } from 'react/jsx-runtime';
+import { Box, Flex, Avatar } from '@strapi/design-system';
+import { Folder } from '@strapi/icons';
+import { useIntl } from 'react-intl';
+import { styled } from 'styled-components';
+import { AssetType } from '../../constants.mjs';
+import { createAssetUrl } from '../../utils/createAssetUrl.mjs';
+import 'byte-size';
+import 'date-fns';
+import { getTrad } from '../../utils/getTrad.mjs';
+import 'qs';
+import { getFileExtension } from '../../utils/getFileExtension.mjs';
+import { prefixFileUrlWithBackendUrl } from '../../utils/prefixFileUrlWithBackendUrl.mjs';
+import '../../utils/urlYupSchema.mjs';
+import { VideoPreview } from '../AssetCard/VideoPreview.mjs';
+
+const VideoPreviewWrapper = styled(Box)`
+  figure {
+    width: ${({ theme })=>theme.spaces[7]};
+    height: ${({ theme })=>theme.spaces[7]};
+  }
+
+  canvas,
+  video {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+    border-radius: 50%;
+  }
+`;
+const PreviewCell = ({ type, content })=>{
+    const { formatMessage } = useIntl();
+    if (type === 'folder') {
+        return /*#__PURE__*/ jsx(Flex, {
+            justifyContent: "center",
+            background: "secondary100",
+            width: "3.2rem",
+            height: "3.2rem",
+            borderRadius: "50%",
+            children: /*#__PURE__*/ jsx(Folder, {
+                "aria-label": formatMessage({
+                    id: getTrad('header.actions.add-assets.folder'),
+                    defaultMessage: 'folder'
+                }),
+                fill: "secondary500",
+                width: "1.6rem",
+                height: "1.6rem"
+            })
+        });
+    }
+    const { alternativeText, ext, formats, mime, name, url } = content;
+    if (mime?.includes(AssetType.Image)) {
+        const mediaURL = prefixFileUrlWithBackendUrl(formats?.thumbnail?.url) ?? prefixFileUrlWithBackendUrl(url);
+        return /*#__PURE__*/ jsx(Avatar.Item, {
+            src: mediaURL,
+            alt: alternativeText || undefined,
+            preview: true,
+            fallback: alternativeText
+        });
+    }
+    if (mime?.includes(AssetType.Video)) {
+        return /*#__PURE__*/ jsx(VideoPreviewWrapper, {
+            children: /*#__PURE__*/ jsx(VideoPreview, {
+                url: createAssetUrl(content, true) || '',
+                mime: mime,
+                alt: alternativeText ?? name
+            })
+        });
+    }
+    return /*#__PURE__*/ jsx(Box, {
+        background: "secondary100",
+        color: "secondary600",
+        width: "3.2rem",
+        height: "3.2rem",
+        children: getFileExtension(ext)
+    });
+};
+
+export { PreviewCell };
+//# sourceMappingURL=PreviewCell.mjs.map

package/dist/admin/components/TableList/PreviewCell.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PreviewCell.mjs","sources":["../../../../admin/src/components/TableList/PreviewCell.tsx"],"sourcesContent":["import { Avatar, Box, Flex } from '@strapi/design-system';\nimport { Folder } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { AssetType } from '../../constants';\nimport {\n  createAssetUrl,\n  getFileExtension,\n  getTrad,\n  prefixFileUrlWithBackendUrl,\n} from '../../utils';\nimport { VideoPreview } from '../AssetCard/VideoPreview';\n\nimport type { File } from '../../../../shared/contracts/files';\n\nconst VideoPreviewWrapper = styled(Box)`\n  figure {\n    width: ${({ theme }) => theme.spaces[7]};\n    height: ${({ theme }) => theme.spaces[7]};\n  }\n\n  canvas,\n  video {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n    border-radius: 50%;\n  }\n`;\n\ninterface PreviewCellProps {\n  content: File;\n  type?: string;\n}\n\nexport const PreviewCell = ({ type, content }: PreviewCellProps) => {\n  const { formatMessage } = useIntl();\n  if (type === 'folder') {\n    return (\n      <Flex\n        justifyContent=\"center\"\n        background=\"secondary100\"\n        width=\"3.2rem\"\n        height=\"3.2rem\"\n        borderRadius=\"50%\"\n      >\n        <Folder\n          aria-label={formatMessage({\n            id: getTrad('header.actions.add-assets.folder'),\n            defaultMessage: 'folder',\n          })}\n          fill=\"secondary500\"\n          width=\"1.6rem\"\n          height=\"1.6rem\"\n        />\n      </Flex>\n    );\n  }\n\n  const { alternativeText, ext, formats, mime, name, url } = content;\n\n  if (mime?.includes(AssetType.Image)) {\n    const mediaURL =\n      prefixFileUrlWithBackendUrl(formats?.thumbnail?.url) ?? prefixFileUrlWithBackendUrl(url);\n\n    return (\n      <Avatar.Item\n        src={mediaURL}\n        alt={alternativeText || undefined}\n        preview\n        fallback={alternativeText}\n      />\n    );\n  }\n\n  if (mime?.includes(AssetType.Video)) {\n    return (\n      <VideoPreviewWrapper>\n        <VideoPreview\n          url={createAssetUrl(content, true) || ''}\n          mime={mime}\n          alt={alternativeText ?? name}\n        />\n      </VideoPreviewWrapper>\n    );\n  }\n\n  return (\n    <Box background=\"secondary100\" color=\"secondary600\" width=\"3.2rem\" height=\"3.2rem\">\n      {getFileExtension(ext)}\n    </Box>\n  );\n};\n"],"names":["VideoPreviewWrapper","styled","Box","theme","spaces","PreviewCell","type","content","formatMessage","useIntl","_jsx","Flex","justifyContent","background","width","height","borderRadius","Folder","aria-label","id","getTrad","defaultMessage","fill","alternativeText","ext","formats","mime","name","url","includes","AssetType","Image","mediaURL","prefixFileUrlWithBackendUrl","thumbnail","Avatar","Item","src","alt","undefined","preview","fallback","Video","VideoPreview","createAssetUrl","color","getFileExtension"],"mappings":";;;;;;;;;;;;;;;;AAgBA,MAAMA,mBAAAA,GAAsBC,MAAOC,CAAAA,GAAAA,CAAI;;WAE5B,EAAE,CAAC,EAAEC,KAAK,EAAE,GAAKA,KAAMC,CAAAA,MAAM,CAAC,CAAA,CAAE,CAAC;YAChC,EAAE,CAAC,EAAED,KAAK,EAAE,GAAKA,KAAMC,CAAAA,MAAM,CAAC,CAAA,CAAE,CAAC;;;;;;;;;;AAU7C,CAAC;MAOYC,WAAc,GAAA,CAAC,EAAEC,IAAI,EAAEC,OAAO,EAAoB,GAAA;IAC7D,MAAM,EAAEC,aAAa,EAAE,GAAGC,OAAAA,EAAAA;AAC1B,IAAA,IAAIH,SAAS,QAAU,EAAA;AACrB,QAAA,qBACEI,GAACC,CAAAA,IAAAA,EAAAA;YACCC,cAAe,EAAA,QAAA;YACfC,UAAW,EAAA,cAAA;YACXC,KAAM,EAAA,QAAA;YACNC,MAAO,EAAA,QAAA;YACPC,YAAa,EAAA,KAAA;AAEb,YAAA,QAAA,gBAAAN,GAACO,CAAAA,MAAAA,EAAAA;AACCC,gBAAAA,YAAAA,EAAYV,aAAc,CAAA;AACxBW,oBAAAA,EAAAA,EAAIC,OAAQ,CAAA,kCAAA,CAAA;oBACZC,cAAgB,EAAA;AAClB,iBAAA,CAAA;gBACAC,IAAK,EAAA,cAAA;gBACLR,KAAM,EAAA,QAAA;gBACNC,MAAO,EAAA;;;AAIf;AAEA,IAAA,MAAM,EAAEQ,eAAe,EAAEC,GAAG,EAAEC,OAAO,EAAEC,IAAI,EAAEC,IAAI,EAAEC,GAAG,EAAE,GAAGrB,OAAAA;AAE3D,IAAA,IAAImB,IAAMG,EAAAA,QAAAA,CAASC,SAAUC,CAAAA,KAAK,CAAG,EAAA;AACnC,QAAA,MAAMC,QACJC,GAAAA,2BAAAA,CAA4BR,OAASS,EAAAA,SAAAA,EAAWN,QAAQK,2BAA4BL,CAAAA,GAAAA,CAAAA;QAEtF,qBACElB,GAAA,CAACyB,OAAOC,IAAI,EAAA;YACVC,GAAKL,EAAAA,QAAAA;AACLM,YAAAA,GAAAA,EAAKf,eAAmBgB,IAAAA,SAAAA;YACxBC,OAAO,EAAA,IAAA;YACPC,QAAUlB,EAAAA;;AAGhB;AAEA,IAAA,IAAIG,IAAMG,EAAAA,QAAAA,CAASC,SAAUY,CAAAA,KAAK,CAAG,EAAA;AACnC,QAAA,qBACEhC,GAACV,CAAAA,mBAAAA,EAAAA;AACC,YAAA,QAAA,gBAAAU,GAACiC,CAAAA,YAAAA,EAAAA;gBACCf,GAAKgB,EAAAA,cAAAA,CAAerC,SAAS,IAAS,CAAA,IAAA,EAAA;gBACtCmB,IAAMA,EAAAA,IAAAA;AACNY,gBAAAA,GAAAA,EAAKf,eAAmBI,IAAAA;;;AAIhC;AAEA,IAAA,qBACEjB,GAACR,CAAAA,GAAAA,EAAAA;QAAIW,UAAW,EAAA,cAAA;QAAegC,KAAM,EAAA,cAAA;QAAe/B,KAAM,EAAA,QAAA;QAASC,MAAO,EAAA,QAAA;kBACvE+B,gBAAiBtB,CAAAA,GAAAA;;AAGxB;;;;"}

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

@@ -0,0 +1,99 @@
+'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 constants = require('../../constants.js');
+require('byte-size');
+require('date-fns');
+var getTrad = require('../../utils/getTrad.js');
+require('qs');
+require('../../utils/urlYupSchema.js');
+var TableRows = require('./TableRows.js');
+
+// TODO: find a better naming convention for the file that was an index file before
+const TableList = ({ assetCount = 0, folderCount = 0, indeterminate = false, onChangeSort = null, onChangeFolder = null, onEditAsset = null, onEditFolder = null, onSelectAll, onSelectOne, rows = [], selected = [], shouldDisableBulkSelect = false, sortQuery = '' })=>{
+    const { formatMessage } = reactIntl.useIntl();
+    const [sortBy, sortOrder] = sortQuery.split(':');
+    const handleClickSort = (isSorted, name)=>{
+        const nextSortOrder = isSorted && sortOrder === 'ASC' ? 'DESC' : 'ASC';
+        const nextSort = `${name}:${nextSortOrder}`;
+        onChangeSort && onChangeSort(nextSort);
+    };
+    return /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Table, {
+        colCount: constants.tableHeaders.length + 2,
+        rowCount: assetCount + folderCount + 1,
+        children: [
+            /*#__PURE__*/ jsxRuntime.jsx(designSystem.Thead, {
+                children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Tr, {
+                    children: [
+                        /*#__PURE__*/ jsxRuntime.jsx(designSystem.Th, {
+                            children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Checkbox, {
+                                "aria-label": formatMessage({
+                                    id: getTrad.getTrad('bulk.select.label'),
+                                    defaultMessage: 'Select all folders & assets'
+                                }),
+                                disabled: shouldDisableBulkSelect,
+                                onCheckedChange: (checked)=>onSelectAll(checked, rows),
+                                checked: indeterminate && !shouldDisableBulkSelect ? 'indeterminate' : (assetCount > 0 || folderCount > 0) && selected.length === assetCount + folderCount
+                            })
+                        }),
+                        constants.tableHeaders.map(({ metadatas: { label, isSortable }, name, key })=>{
+                            const isSorted = sortBy === name;
+                            const isUp = sortOrder === 'ASC';
+                            const tableHeaderLabel = formatMessage(label);
+                            const sortLabel = formatMessage({
+                                id: 'list.table.header.sort',
+                                defaultMessage: 'Sort on {label}'
+                            }, {
+                                label: tableHeaderLabel
+                            });
+                            return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Th, {
+                                action: isSorted && /*#__PURE__*/ jsxRuntime.jsx(designSystem.IconButton, {
+                                    label: sortLabel,
+                                    onClick: ()=>handleClickSort(isSorted, name),
+                                    variant: "ghost",
+                                    children: isUp ? /*#__PURE__*/ jsxRuntime.jsx(icons.CaretUp, {}) : /*#__PURE__*/ jsxRuntime.jsx(icons.CaretDown, {})
+                                }),
+                                children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Tooltip, {
+                                    label: isSortable ? sortLabel : tableHeaderLabel,
+                                    children: isSortable ? /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
+                                        onClick: ()=>handleClickSort(isSorted, name),
+                                        tag: isSorted ? 'span' : 'button',
+                                        textColor: "neutral600",
+                                        variant: "sigma",
+                                        children: tableHeaderLabel
+                                    }) : /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
+                                        textColor: "neutral600",
+                                        variant: "sigma",
+                                        children: tableHeaderLabel
+                                    })
+                                })
+                            }, key);
+                        }),
+                        /*#__PURE__*/ jsxRuntime.jsx(designSystem.Th, {
+                            children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.VisuallyHidden, {
+                                children: formatMessage({
+                                    id: getTrad.getTrad('list.table.header.actions'),
+                                    defaultMessage: 'actions'
+                                })
+                            })
+                        })
+                    ]
+                })
+            }),
+            /*#__PURE__*/ jsxRuntime.jsx(TableRows.TableRows, {
+                onChangeFolder: onChangeFolder,
+                onEditAsset: onEditAsset,
+                onEditFolder: onEditFolder,
+                rows: rows,
+                onSelectOne: onSelectOne,
+                selected: selected
+            })
+        ]
+    });
+};
+
+exports.TableList = TableList;
+//# sourceMappingURL=TableList.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TableList.js","sources":["../../../../admin/src/components/TableList/TableList.tsx"],"sourcesContent":["// TODO: find a better naming convention for the file that was an index file before\nimport {\n  Checkbox,\n  IconButton,\n  Table,\n  Th,\n  Thead,\n  Tooltip,\n  Tr,\n  Typography,\n  VisuallyHidden,\n} from '@strapi/design-system';\nimport { CaretDown, CaretUp } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\n\nimport { tableHeaders } from '../../constants';\nimport { getTrad } from '../../utils';\n\nimport { TableRows } from './TableRows';\n\nimport type { File } from '../../../../shared/contracts/files';\nimport type { Folder } from '../../../../shared/contracts/folders';\nimport type { AllowedTypes } from '../AssetCard/AssetCard';\n\nexport interface FileRow extends File {\n  folderURL?: string;\n  isSelectable?: boolean;\n  type?: string;\n}\n\nexport interface FolderRow extends Folder {\n  folderURL?: string;\n  isSelectable?: boolean;\n  type?: string;\n}\n\nexport interface TableListProps {\n  isFolderSelectionAllowed?: boolean;\n  allowedTypes?: AllowedTypes[];\n  assetCount?: number;\n  folderCount?: number;\n  indeterminate?: boolean;\n  onChangeSort?: ((sortQuery: string) => void) | null;\n  onChangeFolder?: ((folderId: number, folderPath?: string) => void) | null;\n  onEditAsset?: ((asset: FileRow) => void) | null;\n  onEditFolder?: ((folder: FolderRow) => void) | null;\n  onSelectAll: (checked: boolean | string, rows?: FolderRow[] | FileRow[]) => void;\n  onSelectOne: (element: FileRow | FolderRow) => void;\n  rows?: FileRow[] | FolderRow[];\n  selected?: FileRow[] | FolderRow[];\n  shouldDisableBulkSelect?: boolean;\n  sortQuery?: string;\n}\n\nexport const TableList = ({\n  assetCount = 0,\n  folderCount = 0,\n  indeterminate = false,\n  onChangeSort = null,\n  onChangeFolder = null,\n  onEditAsset = null,\n  onEditFolder = null,\n  onSelectAll,\n  onSelectOne,\n  rows = [],\n  selected = [],\n  shouldDisableBulkSelect = false,\n  sortQuery = '',\n}: TableListProps) => {\n  const { formatMessage } = useIntl();\n  const [sortBy, sortOrder] = sortQuery.split(':');\n\n  const handleClickSort = (isSorted: boolean, name: string) => {\n    const nextSortOrder = isSorted && sortOrder === 'ASC' ? 'DESC' : 'ASC';\n    const nextSort = `${name}:${nextSortOrder}`;\n\n    onChangeSort && onChangeSort(nextSort);\n  };\n\n  return (\n    <Table colCount={tableHeaders.length + 2} rowCount={assetCount + folderCount + 1}>\n      <Thead>\n        <Tr>\n          <Th>\n            <Checkbox\n              aria-label={formatMessage({\n                id: getTrad('bulk.select.label'),\n                defaultMessage: 'Select all folders & assets',\n              })}\n              disabled={shouldDisableBulkSelect}\n              onCheckedChange={(checked) => onSelectAll(checked, rows)}\n              checked={\n                indeterminate && !shouldDisableBulkSelect\n                  ? 'indeterminate'\n                  : (assetCount > 0 || folderCount > 0) &&\n                    selected.length === assetCount + folderCount\n              }\n            />\n          </Th>\n          {tableHeaders.map(({ metadatas: { label, isSortable }, name, key }) => {\n            const isSorted = sortBy === name;\n            const isUp = sortOrder === 'ASC';\n            const tableHeaderLabel = formatMessage(label);\n            const sortLabel = formatMessage(\n              { id: 'list.table.header.sort', defaultMessage: 'Sort on {label}' },\n              { label: tableHeaderLabel }\n            );\n\n            return (\n              <Th\n                action={\n                  isSorted && (\n                    <IconButton\n                      label={sortLabel}\n                      onClick={() => handleClickSort(isSorted, name)}\n                      variant=\"ghost\"\n                    >\n                      {isUp ? <CaretUp /> : <CaretDown />}\n                    </IconButton>\n                  )\n                }\n                key={key}\n              >\n                <Tooltip label={isSortable ? sortLabel : tableHeaderLabel}>\n                  {isSortable ? (\n                    <Typography\n                      onClick={() => handleClickSort(isSorted, name)}\n                      tag={isSorted ? 'span' : 'button'}\n                      textColor=\"neutral600\"\n                      variant=\"sigma\"\n                    >\n                      {tableHeaderLabel}\n                    </Typography>\n                  ) : (\n                    <Typography textColor=\"neutral600\" variant=\"sigma\">\n                      {tableHeaderLabel}\n                    </Typography>\n                  )}\n                </Tooltip>\n              </Th>\n            );\n          })}\n          <Th>\n            <VisuallyHidden>\n              {formatMessage({\n                id: getTrad('list.table.header.actions'),\n                defaultMessage: 'actions',\n              })}\n            </VisuallyHidden>\n          </Th>\n        </Tr>\n      </Thead>\n      <TableRows\n        onChangeFolder={onChangeFolder}\n        onEditAsset={onEditAsset!}\n        onEditFolder={onEditFolder!}\n        rows={rows}\n        onSelectOne={onSelectOne}\n        selected={selected}\n      />\n    </Table>\n  );\n};\n"],"names":["TableList","assetCount","folderCount","indeterminate","onChangeSort","onChangeFolder","onEditAsset","onEditFolder","onSelectAll","onSelectOne","rows","selected","shouldDisableBulkSelect","sortQuery","formatMessage","useIntl","sortBy","sortOrder","split","handleClickSort","isSorted","name","nextSortOrder","nextSort","_jsxs","Table","colCount","tableHeaders","length","rowCount","_jsx","Thead","Tr","Th","Checkbox","aria-label","id","getTrad","defaultMessage","disabled","onCheckedChange","checked","map","metadatas","label","isSortable","key","isUp","tableHeaderLabel","sortLabel","action","IconButton","onClick","variant","CaretUp","CaretDown","Tooltip","Typography","tag","textColor","VisuallyHidden","TableRows"],"mappings":"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"}

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

@@ -0,0 +1,97 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Table, Thead, Tr, Th, Checkbox, IconButton, Tooltip, Typography, VisuallyHidden } from '@strapi/design-system';
+import { CaretUp, CaretDown } from '@strapi/icons';
+import { useIntl } from 'react-intl';
+import { tableHeaders } from '../../constants.mjs';
+import 'byte-size';
+import 'date-fns';
+import { getTrad } from '../../utils/getTrad.mjs';
+import 'qs';
+import '../../utils/urlYupSchema.mjs';
+import { TableRows } from './TableRows.mjs';
+
+// TODO: find a better naming convention for the file that was an index file before
+const TableList = ({ assetCount = 0, folderCount = 0, indeterminate = false, onChangeSort = null, onChangeFolder = null, onEditAsset = null, onEditFolder = null, onSelectAll, onSelectOne, rows = [], selected = [], shouldDisableBulkSelect = false, sortQuery = '' })=>{
+    const { formatMessage } = useIntl();
+    const [sortBy, sortOrder] = sortQuery.split(':');
+    const handleClickSort = (isSorted, name)=>{
+        const nextSortOrder = isSorted && sortOrder === 'ASC' ? 'DESC' : 'ASC';
+        const nextSort = `${name}:${nextSortOrder}`;
+        onChangeSort && onChangeSort(nextSort);
+    };
+    return /*#__PURE__*/ jsxs(Table, {
+        colCount: tableHeaders.length + 2,
+        rowCount: assetCount + folderCount + 1,
+        children: [
+            /*#__PURE__*/ jsx(Thead, {
+                children: /*#__PURE__*/ jsxs(Tr, {
+                    children: [
+                        /*#__PURE__*/ jsx(Th, {
+                            children: /*#__PURE__*/ jsx(Checkbox, {
+                                "aria-label": formatMessage({
+                                    id: getTrad('bulk.select.label'),
+                                    defaultMessage: 'Select all folders & assets'
+                                }),
+                                disabled: shouldDisableBulkSelect,
+                                onCheckedChange: (checked)=>onSelectAll(checked, rows),
+                                checked: indeterminate && !shouldDisableBulkSelect ? 'indeterminate' : (assetCount > 0 || folderCount > 0) && selected.length === assetCount + folderCount
+                            })
+                        }),
+                        tableHeaders.map(({ metadatas: { label, isSortable }, name, key })=>{
+                            const isSorted = sortBy === name;
+                            const isUp = sortOrder === 'ASC';
+                            const tableHeaderLabel = formatMessage(label);
+                            const sortLabel = formatMessage({
+                                id: 'list.table.header.sort',
+                                defaultMessage: 'Sort on {label}'
+                            }, {
+                                label: tableHeaderLabel
+                            });
+                            return /*#__PURE__*/ jsx(Th, {
+                                action: isSorted && /*#__PURE__*/ jsx(IconButton, {
+                                    label: sortLabel,
+                                    onClick: ()=>handleClickSort(isSorted, name),
+                                    variant: "ghost",
+                                    children: isUp ? /*#__PURE__*/ jsx(CaretUp, {}) : /*#__PURE__*/ jsx(CaretDown, {})
+                                }),
+                                children: /*#__PURE__*/ jsx(Tooltip, {
+                                    label: isSortable ? sortLabel : tableHeaderLabel,
+                                    children: isSortable ? /*#__PURE__*/ jsx(Typography, {
+                                        onClick: ()=>handleClickSort(isSorted, name),
+                                        tag: isSorted ? 'span' : 'button',
+                                        textColor: "neutral600",
+                                        variant: "sigma",
+                                        children: tableHeaderLabel
+                                    }) : /*#__PURE__*/ jsx(Typography, {
+                                        textColor: "neutral600",
+                                        variant: "sigma",
+                                        children: tableHeaderLabel
+                                    })
+                                })
+                            }, key);
+                        }),
+                        /*#__PURE__*/ jsx(Th, {
+                            children: /*#__PURE__*/ jsx(VisuallyHidden, {
+                                children: formatMessage({
+                                    id: getTrad('list.table.header.actions'),
+                                    defaultMessage: 'actions'
+                                })
+                            })
+                        })
+                    ]
+                })
+            }),
+            /*#__PURE__*/ jsx(TableRows, {
+                onChangeFolder: onChangeFolder,
+                onEditAsset: onEditAsset,
+                onEditFolder: onEditFolder,
+                rows: rows,
+                onSelectOne: onSelectOne,
+                selected: selected
+            })
+        ]
+    });
+};
+
+export { TableList };
+//# sourceMappingURL=TableList.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TableList.mjs","sources":["../../../../admin/src/components/TableList/TableList.tsx"],"sourcesContent":["// TODO: find a better naming convention for the file that was an index file before\nimport {\n  Checkbox,\n  IconButton,\n  Table,\n  Th,\n  Thead,\n  Tooltip,\n  Tr,\n  Typography,\n  VisuallyHidden,\n} from '@strapi/design-system';\nimport { CaretDown, CaretUp } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\n\nimport { tableHeaders } from '../../constants';\nimport { getTrad } from '../../utils';\n\nimport { TableRows } from './TableRows';\n\nimport type { File } from '../../../../shared/contracts/files';\nimport type { Folder } from '../../../../shared/contracts/folders';\nimport type { AllowedTypes } from '../AssetCard/AssetCard';\n\nexport interface FileRow extends File {\n  folderURL?: string;\n  isSelectable?: boolean;\n  type?: string;\n}\n\nexport interface FolderRow extends Folder {\n  folderURL?: string;\n  isSelectable?: boolean;\n  type?: string;\n}\n\nexport interface TableListProps {\n  isFolderSelectionAllowed?: boolean;\n  allowedTypes?: AllowedTypes[];\n  assetCount?: number;\n  folderCount?: number;\n  indeterminate?: boolean;\n  onChangeSort?: ((sortQuery: string) => void) | null;\n  onChangeFolder?: ((folderId: number, folderPath?: string) => void) | null;\n  onEditAsset?: ((asset: FileRow) => void) | null;\n  onEditFolder?: ((folder: FolderRow) => void) | null;\n  onSelectAll: (checked: boolean | string, rows?: FolderRow[] | FileRow[]) => void;\n  onSelectOne: (element: FileRow | FolderRow) => void;\n  rows?: FileRow[] | FolderRow[];\n  selected?: FileRow[] | FolderRow[];\n  shouldDisableBulkSelect?: boolean;\n  sortQuery?: string;\n}\n\nexport const TableList = ({\n  assetCount = 0,\n  folderCount = 0,\n  indeterminate = false,\n  onChangeSort = null,\n  onChangeFolder = null,\n  onEditAsset = null,\n  onEditFolder = null,\n  onSelectAll,\n  onSelectOne,\n  rows = [],\n  selected = [],\n  shouldDisableBulkSelect = false,\n  sortQuery = '',\n}: TableListProps) => {\n  const { formatMessage } = useIntl();\n  const [sortBy, sortOrder] = sortQuery.split(':');\n\n  const handleClickSort = (isSorted: boolean, name: string) => {\n    const nextSortOrder = isSorted && sortOrder === 'ASC' ? 'DESC' : 'ASC';\n    const nextSort = `${name}:${nextSortOrder}`;\n\n    onChangeSort && onChangeSort(nextSort);\n  };\n\n  return (\n    <Table colCount={tableHeaders.length + 2} rowCount={assetCount + folderCount + 1}>\n      <Thead>\n        <Tr>\n          <Th>\n            <Checkbox\n              aria-label={formatMessage({\n                id: getTrad('bulk.select.label'),\n                defaultMessage: 'Select all folders & assets',\n              })}\n              disabled={shouldDisableBulkSelect}\n              onCheckedChange={(checked) => onSelectAll(checked, rows)}\n              checked={\n                indeterminate && !shouldDisableBulkSelect\n                  ? 'indeterminate'\n                  : (assetCount > 0 || folderCount > 0) &&\n                    selected.length === assetCount + folderCount\n              }\n            />\n          </Th>\n          {tableHeaders.map(({ metadatas: { label, isSortable }, name, key }) => {\n            const isSorted = sortBy === name;\n            const isUp = sortOrder === 'ASC';\n            const tableHeaderLabel = formatMessage(label);\n            const sortLabel = formatMessage(\n              { id: 'list.table.header.sort', defaultMessage: 'Sort on {label}' },\n              { label: tableHeaderLabel }\n            );\n\n            return (\n              <Th\n                action={\n                  isSorted && (\n                    <IconButton\n                      label={sortLabel}\n                      onClick={() => handleClickSort(isSorted, name)}\n                      variant=\"ghost\"\n                    >\n                      {isUp ? <CaretUp /> : <CaretDown />}\n                    </IconButton>\n                  )\n                }\n                key={key}\n              >\n                <Tooltip label={isSortable ? sortLabel : tableHeaderLabel}>\n                  {isSortable ? (\n                    <Typography\n                      onClick={() => handleClickSort(isSorted, name)}\n                      tag={isSorted ? 'span' : 'button'}\n                      textColor=\"neutral600\"\n                      variant=\"sigma\"\n                    >\n                      {tableHeaderLabel}\n                    </Typography>\n                  ) : (\n                    <Typography textColor=\"neutral600\" variant=\"sigma\">\n                      {tableHeaderLabel}\n                    </Typography>\n                  )}\n                </Tooltip>\n              </Th>\n            );\n          })}\n          <Th>\n            <VisuallyHidden>\n              {formatMessage({\n                id: getTrad('list.table.header.actions'),\n                defaultMessage: 'actions',\n              })}\n            </VisuallyHidden>\n          </Th>\n        </Tr>\n      </Thead>\n      <TableRows\n        onChangeFolder={onChangeFolder}\n        onEditAsset={onEditAsset!}\n        onEditFolder={onEditFolder!}\n        rows={rows}\n        onSelectOne={onSelectOne}\n        selected={selected}\n      />\n    </Table>\n  );\n};\n"],"names":["TableList","assetCount","folderCount","indeterminate","onChangeSort","onChangeFolder","onEditAsset","onEditFolder","onSelectAll","onSelectOne","rows","selected","shouldDisableBulkSelect","sortQuery","formatMessage","useIntl","sortBy","sortOrder","split","handleClickSort","isSorted","name","nextSortOrder","nextSort","_jsxs","Table","colCount","tableHeaders","length","rowCount","_jsx","Thead","Tr","Th","Checkbox","aria-label","id","getTrad","defaultMessage","disabled","onCheckedChange","checked","map","metadatas","label","isSortable","key","isUp","tableHeaderLabel","sortLabel","action","IconButton","onClick","variant","CaretUp","CaretDown","Tooltip","Typography","tag","textColor","VisuallyHidden","TableRows"],"mappings":"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"}