@strapi/upload 5.49.0 → 5.50.1

package/dist/admin/future/pages/Assets/components/AssetsTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"AssetsTable.js","sources":["../../../../../../admin/src/future/pages/Assets/components/AssetsTable.tsx"],"sourcesContent":["import { useIsMobile } from '@strapi/admin/strapi-admin';\nimport {\n  Flex,\n  IconButton,\n  RawTable,\n  RawTbody,\n  RawTd,\n  RawTh,\n  RawThead,\n  RawTr,\n  Typography,\n  VisuallyHidden,\n} from '@strapi/design-system';\nimport { Folder as FolderIcon, More } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { formatBytes } from '../../../utils/files';\nimport { getAssetIcon } from '../../../utils/getAssetIcon';\nimport { getTranslationKey } from '../../../utils/translations';\nimport { TABLE_HEADERS } from '../constants';\nimport { useFolderNavigation } from '../hooks/useFolderNavigation';\n\nimport type { File } from '../../../../../../shared/contracts/files';\nimport type { Folder } from '../../../../../../shared/contracts/folders';\n\nconst StyledTable = styled(RawTable)`\n  width: 100%;\n  border-collapse: separate;\n  border-spacing: 0;\n  border: 1px solid ${({ theme }) => theme.colors.neutral150};\n  border-radius: 4px;\n  overflow: hidden;\n`;\n\nconst StyledThead = styled(RawThead)`\n  background: ${({ theme }) => theme.colors.neutral100};\n\n  tr {\n    border-bottom: 1px solid ${({ theme }) => theme.colors.neutral150};\n  }\n`;\n\nconst StyledTh = styled(RawTh)`\n  height: 40px;\n  padding: 0 ${({ theme }) => theme.spaces[4]};\n  text-align: left;\n`;\n\nconst StyledTd = styled(RawTd)`\n  padding: 0 ${({ theme }) => theme.spaces[4]};\n  border-bottom: 1px solid ${({ theme }) => theme.colors.neutral150};\n`;\n\nconst StyledTr = styled(RawTr)`\n  height: 48px;\n  background: ${({ theme }) => theme.colors.neutral0};\n  cursor: pointer;\n\n  &:hover {\n    background: ${({ theme }) => theme.colors.primary100};\n  }\n\n  &:focus-visible {\n    outline: 2px solid ${({ theme }) => theme.colors.primary600};\n    outline-offset: -2px;\n  }\n\n  &:last-child {\n    ${StyledTd} {\n      border-bottom: 0;\n    }\n  }\n`;\n\nconst StyledBodyTd = styled(RawTd)`\n  padding: ${({ theme }) => theme.spaces[4]};\n  border-bottom: 1px solid ${({ theme }) => theme.colors.neutral150};\n`;\n\ninterface AssetPreviewCellProps {\n  asset: File;\n}\n\nconst AssetPreviewCell = ({ asset }: AssetPreviewCellProps) => {\n  const { ext, mime } = asset;\n\n  const DocIcon = getAssetIcon(mime, ext);\n\n  return (\n    <Flex\n      justifyContent=\"center\"\n      alignItems=\"center\"\n      borderRadius=\"4px\"\n      color=\"neutral500\"\n      width=\"3.2rem\"\n      height=\"3.2rem\"\n      shrink={0}\n    >\n      <DocIcon width={20} height={20} />\n    </Flex>\n  );\n};\n\ninterface AssetRowProps {\n  asset: File;\n  onAssetItemClick: (assetId: number) => void;\n}\n\nconst AssetRow = ({ asset, onAssetItemClick }: AssetRowProps) => {\n  const isMobile = useIsMobile();\n  const { formatDate, formatMessage } = useIntl();\n\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      onAssetItemClick(asset.id);\n    }\n  };\n\n  return (\n    <StyledTr\n      tabIndex={0}\n      role=\"row\"\n      onClick={() => onAssetItemClick(asset.id)}\n      onKeyDown={handleKeyDown}\n    >\n      <StyledTd>\n        <Flex gap={3} alignItems=\"center\">\n          <AssetPreviewCell asset={asset} />\n          <Flex direction=\"column\" alignItems=\"flex-start\">\n            <Typography textColor=\"neutral800\" fontWeight=\"semiBold\" ellipsis>\n              {asset.name}\n            </Typography>\n            {isMobile && (\n              <Typography textColor=\"neutral600\" variant=\"pi\">\n                {asset.size ? formatBytes(asset.size, 1) : '-'}\n              </Typography>\n            )}\n          </Flex>\n        </Flex>\n      </StyledTd>\n      {!isMobile && (\n        <>\n          <StyledTd>\n            <Typography textColor=\"neutral600\">\n              {asset.createdAt ? formatDate(new Date(asset.createdAt), { dateStyle: 'long' }) : '-'}\n            </Typography>\n          </StyledTd>\n          <StyledTd>\n            <Typography textColor=\"neutral600\">\n              {asset.updatedAt ? formatDate(new Date(asset.updatedAt), { dateStyle: 'long' }) : '-'}\n            </Typography>\n          </StyledTd>\n          <StyledTd>\n            <Typography textColor=\"neutral600\">\n              {asset.size ? formatBytes(asset.size, 1) : '-'}\n            </Typography>\n          </StyledTd>\n        </>\n      )}\n      <StyledTd>\n        <Flex justifyContent=\"flex-end\">\n          <IconButton\n            label={formatMessage({\n              id: getTranslationKey('control-card.more-actions'),\n              defaultMessage: 'More actions',\n            })}\n            variant=\"ghost\"\n          >\n            <More />\n          </IconButton>\n        </Flex>\n      </StyledTd>\n    </StyledTr>\n  );\n};\n\nconst FolderTr = styled(StyledTr)`\n  cursor: pointer;\n\n  &:hover {\n    background: ${({ theme }) => theme.colors.primary100};\n  }\n`;\n\ninterface FolderRowProps {\n  folder: Folder;\n}\n\nconst FolderRow = ({ folder }: FolderRowProps) => {\n  const isMobile = useIsMobile();\n  const { formatDate, formatMessage } = useIntl();\n  const { navigateToFolder } = useFolderNavigation();\n\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      navigateToFolder(folder);\n    }\n  };\n\n  return (\n    <FolderTr\n      tabIndex={0}\n      role=\"row\"\n      onClick={() => navigateToFolder(folder)}\n      onKeyDown={handleKeyDown}\n    >\n      <StyledTd>\n        <Flex gap={3} alignItems=\"center\">\n          <Flex\n            justifyContent=\"center\"\n            alignItems=\"center\"\n            borderRadius=\"4px\"\n            color=\"neutral600\"\n            width=\"3.2rem\"\n            height=\"3.2rem\"\n            shrink={0}\n          >\n            <FolderIcon width={20} height={20} />\n          </Flex>\n          <Typography textColor=\"neutral800\" fontWeight=\"semiBold\" ellipsis>\n            {folder.name}\n          </Typography>\n        </Flex>\n      </StyledTd>\n      {!isMobile && (\n        <>\n          <StyledTd>\n            <Typography textColor=\"neutral600\">\n              {folder.createdAt\n                ? formatDate(new Date(folder.createdAt), { dateStyle: 'long' })\n                : '-'}\n            </Typography>\n          </StyledTd>\n          <StyledTd>\n            <Typography textColor=\"neutral600\">\n              {folder.updatedAt\n                ? formatDate(new Date(folder.updatedAt), { dateStyle: 'long' })\n                : '-'}\n            </Typography>\n          </StyledTd>\n          <StyledTd>\n            <Typography textColor=\"neutral600\">-</Typography>\n          </StyledTd>\n        </>\n      )}\n      <StyledTd>\n        <Flex justifyContent=\"flex-end\">\n          <IconButton\n            label={formatMessage({\n              id: getTranslationKey('control-card.more-actions'),\n              defaultMessage: 'More actions',\n            })}\n            variant=\"ghost\"\n            onClick={(e: React.MouseEvent) => e.stopPropagation()}\n          >\n            <More />\n          </IconButton>\n        </Flex>\n      </StyledTd>\n    </FolderTr>\n  );\n};\n\ninterface AssetsTableProps {\n  assets: File[];\n  folders?: Folder[];\n  onAssetItemClick: (assetId: number) => void;\n}\n\nexport const AssetsTable = ({ assets, folders = [], onAssetItemClick }: AssetsTableProps) => {\n  const isMobile = useIsMobile();\n  const { formatMessage } = useIntl();\n\n  const visibleHeaders = isMobile\n    ? TABLE_HEADERS.filter((h) => h.name === 'name' || h.name === 'actions')\n    : TABLE_HEADERS;\n\n  const totalRows = folders.length + assets.length;\n\n  return (\n    <StyledTable colCount={visibleHeaders.length} rowCount={totalRows + 1}>\n      <StyledThead>\n        <RawTr>\n          {visibleHeaders.map((header) => {\n            const tableHeaderLabel = formatMessage(header.label);\n            const isVisuallyHidden = 'isVisuallyHidden' in header && header.isVisuallyHidden;\n\n            if (isVisuallyHidden) {\n              return (\n                <StyledTh key={header.name}>\n                  <VisuallyHidden>\n                    {formatMessage({\n                      id: getTranslationKey('table.header.actions'),\n                      defaultMessage: 'actions',\n                    })}\n                  </VisuallyHidden>\n                </StyledTh>\n              );\n            }\n\n            return (\n              <StyledTh key={header.name}>\n                <Typography textColor=\"neutral600\" variant=\"sigma\">\n                  {tableHeaderLabel}\n                </Typography>\n              </StyledTh>\n            );\n          })}\n        </RawTr>\n      </StyledThead>\n      <RawTbody>\n        {totalRows === 0 ? (\n          <RawTr>\n            <StyledBodyTd colSpan={visibleHeaders.length}>\n              <Typography textColor=\"neutral600\">\n                {formatMessage({\n                  id: 'app.components.EmptyStateLayout.content-document',\n                  defaultMessage: 'No content found',\n                })}\n              </Typography>\n            </StyledBodyTd>\n          </RawTr>\n        ) : (\n          <>\n            {folders.map((folder) => (\n              <FolderRow key={`folder-${folder.id}`} folder={folder} />\n            ))}\n            {assets.map((asset) => (\n              <AssetRow key={asset.id} asset={asset} onAssetItemClick={onAssetItemClick} />\n            ))}\n          </>\n        )}\n      </RawTbody>\n    </StyledTable>\n  );\n};\n"],"names":["StyledTable","styled","RawTable","theme","colors","neutral150","StyledThead","RawThead","neutral100","StyledTh","RawTh","spaces","StyledTd","RawTd","StyledTr","RawTr","neutral0","primary100","primary600","StyledBodyTd","AssetPreviewCell","asset","ext","mime","DocIcon","getAssetIcon","_jsx","Flex","justifyContent","alignItems","borderRadius","color","width","height","shrink","AssetRow","onAssetItemClick","isMobile","useIsMobile","formatDate","formatMessage","useIntl","handleKeyDown","e","key","preventDefault","id","_jsxs","tabIndex","role","onClick","onKeyDown","gap","direction","Typography","textColor","fontWeight","ellipsis","name","variant","size","formatBytes","_Fragment","createdAt","Date","dateStyle","updatedAt","IconButton","label","getTranslationKey","defaultMessage","More","FolderTr","FolderRow","folder","navigateToFolder","useFolderNavigation","FolderIcon","stopPropagation","AssetsTable","assets","folders","visibleHeaders","TABLE_HEADERS","filter","h","totalRows","length","colCount","rowCount","map","header","tableHeaderLabel","isVisuallyHidden","VisuallyHidden","RawTbody","colSpan"],"mappings":"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"}
+{"version":3,"file":"AssetsTable.js","sources":["../../../../../../admin/src/future/pages/Assets/components/AssetsTable.tsx"],"sourcesContent":["import { useIsMobile } from '@strapi/admin/strapi-admin';\nimport {\n  Flex,\n  IconButton,\n  RawTable,\n  RawTbody,\n  RawTd,\n  RawTh,\n  RawThead,\n  RawTr,\n  Typography,\n  VisuallyHidden,\n} from '@strapi/design-system';\nimport { Folder as FolderIcon, More } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled, css } from 'styled-components';\n\nimport { formatBytes } from '../../../utils/files';\nimport { getAssetIcon } from '../../../utils/getAssetIcon';\nimport { getTranslationKey } from '../../../utils/translations';\nimport { TABLE_HEADERS } from '../constants';\nimport { useFolderNavigation } from '../hooks/useFolderNavigation';\n\nimport { useAssetsDndOptional } from './Dnd/AssetsDndProvider';\nimport { useFileDraggable, useFolderDraggableDroppable } from './Dnd/useAssetDnd';\n\nimport type { File } from '../../../../../../shared/contracts/files';\nimport type { Folder } from '../../../../../../shared/contracts/folders';\n\nconst StyledTable = styled(RawTable)`\n  width: 100%;\n  border-collapse: separate;\n  border-spacing: 0;\n  border: 1px solid ${({ theme }) => theme.colors.neutral150};\n  border-radius: 4px;\n  overflow: hidden;\n`;\n\nconst StyledThead = styled(RawThead)`\n  background: ${({ theme }) => theme.colors.neutral100};\n\n  tr {\n    border-bottom: 1px solid ${({ theme }) => theme.colors.neutral150};\n  }\n`;\n\nconst StyledTh = styled(RawTh)`\n  height: 40px;\n  padding: 0 ${({ theme }) => theme.spaces[4]};\n  text-align: left;\n`;\n\nconst StyledTd = styled(RawTd)`\n  padding: 0 ${({ theme }) => theme.spaces[4]};\n  border-bottom: 1px solid ${({ theme }) => theme.colors.neutral150};\n`;\n\nconst StyledTr = styled.tr<{\n  $isDragging?: boolean;\n  $isMovePending?: boolean;\n  $isValidDropTarget?: boolean;\n  $isInvalidDropTarget?: boolean;\n}>`\n  height: 48px;\n  background: ${({ theme }) => theme.colors.neutral0};\n  cursor: ${({ $isMovePending, $isInvalidDropTarget }) => {\n    if ($isMovePending) {\n      return 'wait';\n    }\n\n    return $isInvalidDropTarget ? 'not-allowed' : 'pointer';\n  }};\n  opacity: ${({ $isDragging }) => ($isDragging ? 0.4 : 1)};\n  pointer-events: ${({ $isMovePending }) => ($isMovePending ? 'none' : 'auto')};\n\n  ${({ $isValidDropTarget, theme }) =>\n    $isValidDropTarget &&\n    css`\n      background: ${theme.colors.primary100};\n      outline: 1px dashed ${theme.colors.primary600};\n      outline-offset: -1px;\n    `}\n\n  &:hover {\n    background: ${({ theme }) => theme.colors.primary100};\n  }\n\n  &:focus-visible {\n    outline: 2px solid ${({ theme }) => theme.colors.primary600};\n    outline-offset: -2px;\n  }\n\n  &:last-child {\n    ${StyledTd} {\n      border-bottom: 0;\n    }\n  }\n`;\n\nconst StyledBodyTd = styled(RawTd)`\n  padding: ${({ theme }) => theme.spaces[4]};\n  border-bottom: 1px solid ${({ theme }) => theme.colors.neutral150};\n`;\n\ninterface AssetPreviewCellProps {\n  asset: File;\n}\n\nconst AssetPreviewCell = ({ asset }: AssetPreviewCellProps) => {\n  const { ext, mime } = asset;\n\n  const DocIcon = getAssetIcon(mime, ext);\n\n  return (\n    <Flex\n      justifyContent=\"center\"\n      alignItems=\"center\"\n      borderRadius=\"4px\"\n      color=\"neutral500\"\n      width=\"3.2rem\"\n      height=\"3.2rem\"\n      shrink={0}\n    >\n      <DocIcon width={20} height={20} />\n    </Flex>\n  );\n};\n\ninterface AssetRowProps {\n  asset: File;\n  onAssetItemClick: (assetId: number) => void;\n}\n\nconst AssetRow = ({ asset, onAssetItemClick }: AssetRowProps) => {\n  const isMobile = useIsMobile();\n  const { formatDate, formatMessage } = useIntl();\n  const { isMovePending } = useAssetsDndOptional() ?? { isMovePending: false };\n  const { attributes, listeners, setNodeRef, isDragging } = useFileDraggable(asset);\n\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      onAssetItemClick(asset.id);\n    }\n  };\n\n  return (\n    <StyledTr\n      ref={setNodeRef}\n      {...attributes}\n      {...listeners}\n      $isDragging={isDragging}\n      $isMovePending={isMovePending}\n      tabIndex={0}\n      role=\"row\"\n      onDragStart={(e) => e.preventDefault()}\n      onClick={() => onAssetItemClick(asset.id)}\n      onKeyDown={handleKeyDown}\n    >\n      <StyledTd>\n        <Flex gap={3} alignItems=\"center\">\n          <AssetPreviewCell asset={asset} />\n          <Flex direction=\"column\" alignItems=\"flex-start\">\n            <Typography textColor=\"neutral800\" fontWeight=\"semiBold\" ellipsis>\n              {asset.name}\n            </Typography>\n            {isMobile && (\n              <Typography textColor=\"neutral600\" variant=\"pi\">\n                {asset.size ? formatBytes(asset.size, 1) : '-'}\n              </Typography>\n            )}\n          </Flex>\n        </Flex>\n      </StyledTd>\n      {!isMobile && (\n        <>\n          <StyledTd>\n            <Typography textColor=\"neutral600\">\n              {asset.createdAt ? formatDate(new Date(asset.createdAt), { dateStyle: 'long' }) : '-'}\n            </Typography>\n          </StyledTd>\n          <StyledTd>\n            <Typography textColor=\"neutral600\">\n              {asset.updatedAt ? formatDate(new Date(asset.updatedAt), { dateStyle: 'long' }) : '-'}\n            </Typography>\n          </StyledTd>\n          <StyledTd>\n            <Typography textColor=\"neutral600\">\n              {asset.size ? formatBytes(asset.size, 1) : '-'}\n            </Typography>\n          </StyledTd>\n        </>\n      )}\n      <StyledTd>\n        <Flex justifyContent=\"flex-end\">\n          <IconButton\n            label={formatMessage({\n              id: getTranslationKey('control-card.more-actions'),\n              defaultMessage: 'More actions',\n            })}\n            variant=\"ghost\"\n            onClick={(e: React.MouseEvent) => e.stopPropagation()}\n          >\n            <More />\n          </IconButton>\n        </Flex>\n      </StyledTd>\n    </StyledTr>\n  );\n};\n\nconst FolderTr = styled(StyledTr)`\n  &:hover {\n    background: ${({ theme }) => theme.colors.primary100};\n  }\n`;\n\ninterface FolderRowProps {\n  folder: Folder;\n}\n\nconst FolderRow = ({ folder }: FolderRowProps) => {\n  const isMobile = useIsMobile();\n  const { formatDate, formatMessage } = useIntl();\n  const { navigateToFolder } = useFolderNavigation();\n  const { isMovePending } = useAssetsDndOptional() ?? { isMovePending: false };\n  const {\n    draggable: { attributes, listeners, setNodeRef: setDragRef, isDragging },\n    droppable: { setNodeRef: setDropRef },\n    showValidDropHighlight,\n    showInvalidDropCursor,\n  } = useFolderDraggableDroppable(folder);\n\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      navigateToFolder(folder);\n    }\n  };\n\n  return (\n    <FolderTr\n      ref={(node) => {\n        setDragRef(node);\n        setDropRef(node);\n      }}\n      {...attributes}\n      {...listeners}\n      $isDragging={isDragging}\n      $isMovePending={isMovePending}\n      $isValidDropTarget={showValidDropHighlight}\n      $isInvalidDropTarget={showInvalidDropCursor}\n      tabIndex={0}\n      role=\"row\"\n      onDragStart={(e) => e.preventDefault()}\n      onClick={() => navigateToFolder(folder)}\n      onKeyDown={handleKeyDown}\n    >\n      <StyledTd>\n        <Flex gap={3} alignItems=\"center\">\n          <Flex\n            justifyContent=\"center\"\n            alignItems=\"center\"\n            borderRadius=\"4px\"\n            color=\"neutral600\"\n            width=\"3.2rem\"\n            height=\"3.2rem\"\n            shrink={0}\n          >\n            <FolderIcon width={20} height={20} />\n          </Flex>\n          <Typography textColor=\"neutral800\" fontWeight=\"semiBold\" ellipsis>\n            {folder.name}\n          </Typography>\n        </Flex>\n      </StyledTd>\n      {!isMobile && (\n        <>\n          <StyledTd>\n            <Typography textColor=\"neutral600\">\n              {folder.createdAt\n                ? formatDate(new Date(folder.createdAt), { dateStyle: 'long' })\n                : '-'}\n            </Typography>\n          </StyledTd>\n          <StyledTd>\n            <Typography textColor=\"neutral600\">\n              {folder.updatedAt\n                ? formatDate(new Date(folder.updatedAt), { dateStyle: 'long' })\n                : '-'}\n            </Typography>\n          </StyledTd>\n          <StyledTd>\n            <Typography textColor=\"neutral600\">-</Typography>\n          </StyledTd>\n        </>\n      )}\n      <StyledTd>\n        <Flex justifyContent=\"flex-end\">\n          <IconButton\n            label={formatMessage({\n              id: getTranslationKey('control-card.more-actions'),\n              defaultMessage: 'More actions',\n            })}\n            variant=\"ghost\"\n            onClick={(e: React.MouseEvent) => e.stopPropagation()}\n          >\n            <More />\n          </IconButton>\n        </Flex>\n      </StyledTd>\n    </FolderTr>\n  );\n};\n\ninterface AssetsTableProps {\n  assets: File[];\n  folders?: Folder[];\n  onAssetItemClick: (assetId: number) => void;\n}\n\nexport const AssetsTable = ({ assets, folders = [], onAssetItemClick }: AssetsTableProps) => {\n  const isMobile = useIsMobile();\n  const { formatMessage } = useIntl();\n\n  const visibleHeaders = isMobile\n    ? TABLE_HEADERS.filter((h) => h.name === 'name' || h.name === 'actions')\n    : TABLE_HEADERS;\n\n  const totalRows = folders.length + assets.length;\n\n  return (\n    <StyledTable colCount={visibleHeaders.length} rowCount={totalRows + 1}>\n      <StyledThead>\n        <RawTr>\n          {visibleHeaders.map((header) => {\n            const tableHeaderLabel = formatMessage(header.label);\n            const isVisuallyHidden = 'isVisuallyHidden' in header && header.isVisuallyHidden;\n\n            if (isVisuallyHidden) {\n              return (\n                <StyledTh key={header.name}>\n                  <VisuallyHidden>\n                    {formatMessage({\n                      id: getTranslationKey('table.header.actions'),\n                      defaultMessage: 'actions',\n                    })}\n                  </VisuallyHidden>\n                </StyledTh>\n              );\n            }\n\n            return (\n              <StyledTh key={header.name}>\n                <Typography textColor=\"neutral600\" variant=\"sigma\">\n                  {tableHeaderLabel}\n                </Typography>\n              </StyledTh>\n            );\n          })}\n        </RawTr>\n      </StyledThead>\n      <RawTbody>\n        {totalRows === 0 ? (\n          <RawTr>\n            <StyledBodyTd colSpan={visibleHeaders.length}>\n              <Typography textColor=\"neutral600\">\n                {formatMessage({\n                  id: 'app.components.EmptyStateLayout.content-document',\n                  defaultMessage: 'No content found',\n                })}\n              </Typography>\n            </StyledBodyTd>\n          </RawTr>\n        ) : (\n          <>\n            {folders.map((folder) => (\n              <FolderRow key={`folder-${folder.id}`} folder={folder} />\n            ))}\n            {assets.map((asset) => (\n              <AssetRow key={asset.id} asset={asset} onAssetItemClick={onAssetItemClick} />\n            ))}\n          </>\n        )}\n      </RawTbody>\n    </StyledTable>\n  );\n};\n"],"names":["StyledTable","styled","RawTable","theme","colors","neutral150","StyledThead","RawThead","neutral100","StyledTh","RawTh","spaces","StyledTd","RawTd","StyledTr","tr","neutral0","$isMovePending","$isInvalidDropTarget","$isDragging","$isValidDropTarget","css","primary100","primary600","StyledBodyTd","AssetPreviewCell","asset","ext","mime","DocIcon","getAssetIcon","_jsx","Flex","justifyContent","alignItems","borderRadius","color","width","height","shrink","AssetRow","onAssetItemClick","isMobile","useIsMobile","formatDate","formatMessage","useIntl","isMovePending","useAssetsDndOptional","attributes","listeners","setNodeRef","isDragging","useFileDraggable","handleKeyDown","e","key","preventDefault","id","_jsxs","ref","tabIndex","role","onDragStart","onClick","onKeyDown","gap","direction","Typography","textColor","fontWeight","ellipsis","name","variant","size","formatBytes","_Fragment","createdAt","Date","dateStyle","updatedAt","IconButton","label","getTranslationKey","defaultMessage","stopPropagation","More","FolderTr","FolderRow","folder","navigateToFolder","useFolderNavigation","draggable","setDragRef","droppable","setDropRef","showValidDropHighlight","showInvalidDropCursor","useFolderDraggableDroppable","node","FolderIcon","AssetsTable","assets","folders","visibleHeaders","TABLE_HEADERS","filter","h","totalRows","length","colCount","rowCount","RawTr","map","header","tableHeaderLabel","isVisuallyHidden","VisuallyHidden","RawTbody","colSpan"],"mappings":"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"}

package/dist/admin/future/pages/Assets/components/AssetsTable.mjs

@@ -3,12 +3,14 @@ import { useIsMobile } from '@strapi/admin/strapi-admin';
 import { RawTr, VisuallyHidden, Typography, RawTbody, RawTable, RawThead, RawTh, RawTd, Flex, IconButton } from '@strapi/design-system';
 import { Folder, More } from '@strapi/icons';
 import { useIntl } from 'react-intl';
-import { styled } from 'styled-components';
+import { styled, css } from 'styled-components';
 import { formatBytes } from '../../../utils/files.mjs';
 import { getAssetIcon } from '../../../utils/getAssetIcon.mjs';
 import { getTranslationKey } from '../../../utils/translations.mjs';
 import { TABLE_HEADERS } from '../constants.mjs';
 import { useFolderNavigation } from '../hooks/useFolderNavigation.mjs';
+import { useAssetsDndOptional } from './Dnd/AssetsDndProvider.mjs';
+import { useFolderDraggableDroppable, useFileDraggable } from './Dnd/useAssetDnd.mjs';
 
 const StyledTable = styled(RawTable)`
   width: 100%;
@@ -34,10 +36,23 @@ const StyledTd = styled(RawTd)`
   padding: 0 ${({ theme })=>theme.spaces[4]};
   border-bottom: 1px solid ${({ theme })=>theme.colors.neutral150};
 `;
-const StyledTr = styled(RawTr)`
+const StyledTr = styled.tr`
   height: 48px;
   background: ${({ theme })=>theme.colors.neutral0};
-  cursor: pointer;
+  cursor: ${({ $isMovePending, $isInvalidDropTarget })=>{
+    if ($isMovePending) {
+        return 'wait';
+    }
+    return $isInvalidDropTarget ? 'not-allowed' : 'pointer';
+}};
+  opacity: ${({ $isDragging })=>$isDragging ? 0.4 : 1};
+  pointer-events: ${({ $isMovePending })=>$isMovePending ? 'none' : 'auto'};
+
+  ${({ $isValidDropTarget, theme })=>$isValidDropTarget && css`
+      background: ${theme.colors.primary100};
+      outline: 1px dashed ${theme.colors.primary600};
+      outline-offset: -1px;
+    `}
 
   &:hover {
     background: ${({ theme })=>theme.colors.primary100};
@@ -78,6 +93,10 @@ const AssetPreviewCell = ({ asset })=>{
 const AssetRow = ({ asset, onAssetItemClick })=>{
     const isMobile = useIsMobile();
     const { formatDate, formatMessage } = useIntl();
+    const { isMovePending } = useAssetsDndOptional() ?? {
+        isMovePending: false
+    };
+    const { attributes, listeners, setNodeRef, isDragging } = useFileDraggable(asset);
     const handleKeyDown = (e)=>{
         if (e.key === 'Enter' || e.key === ' ') {
             e.preventDefault();
@@ -85,8 +104,14 @@ const AssetRow = ({ asset, onAssetItemClick })=>{
         }
     };
     return /*#__PURE__*/ jsxs(StyledTr, {
+        ref: setNodeRef,
+        ...attributes,
+        ...listeners,
+        $isDragging: isDragging,
+        $isMovePending: isMovePending,
         tabIndex: 0,
         role: "row",
+        onDragStart: (e)=>e.preventDefault(),
         onClick: ()=>onAssetItemClick(asset.id),
         onKeyDown: handleKeyDown,
         children: [
@@ -153,6 +178,7 @@ const AssetRow = ({ asset, onAssetItemClick })=>{
                             defaultMessage: 'More actions'
                         }),
                         variant: "ghost",
+                        onClick: (e)=>e.stopPropagation(),
                         children: /*#__PURE__*/ jsx(More, {})
                     })
                 })
@@ -161,8 +187,6 @@ const AssetRow = ({ asset, onAssetItemClick })=>{
     });
 };
 const FolderTr = styled(StyledTr)`
-  cursor: pointer;
-
   &:hover {
     background: ${({ theme })=>theme.colors.primary100};
   }
@@ -171,6 +195,10 @@ const FolderRow = ({ folder })=>{
     const isMobile = useIsMobile();
     const { formatDate, formatMessage } = useIntl();
     const { navigateToFolder } = useFolderNavigation();
+    const { isMovePending } = useAssetsDndOptional() ?? {
+        isMovePending: false
+    };
+    const { draggable: { attributes, listeners, setNodeRef: setDragRef, isDragging }, droppable: { setNodeRef: setDropRef }, showValidDropHighlight, showInvalidDropCursor } = useFolderDraggableDroppable(folder);
     const handleKeyDown = (e)=>{
         if (e.key === 'Enter' || e.key === ' ') {
             e.preventDefault();
@@ -178,8 +206,19 @@ const FolderRow = ({ folder })=>{
         }
     };
     return /*#__PURE__*/ jsxs(FolderTr, {
+        ref: (node)=>{
+            setDragRef(node);
+            setDropRef(node);
+        },
+        ...attributes,
+        ...listeners,
+        $isDragging: isDragging,
+        $isMovePending: isMovePending,
+        $isValidDropTarget: showValidDropHighlight,
+        $isInvalidDropTarget: showInvalidDropCursor,
         tabIndex: 0,
         role: "row",
+        onDragStart: (e)=>e.preventDefault(),
         onClick: ()=>navigateToFolder(folder),
         onKeyDown: handleKeyDown,
         children: [

package/dist/admin/future/pages/Assets/components/AssetsTable.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"AssetsTable.mjs","sources":["../../../../../../admin/src/future/pages/Assets/components/AssetsTable.tsx"],"sourcesContent":["import { useIsMobile } from '@strapi/admin/strapi-admin';\nimport {\n  Flex,\n  IconButton,\n  RawTable,\n  RawTbody,\n  RawTd,\n  RawTh,\n  RawThead,\n  RawTr,\n  Typography,\n  VisuallyHidden,\n} from '@strapi/design-system';\nimport { Folder as FolderIcon, More } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { formatBytes } from '../../../utils/files';\nimport { getAssetIcon } from '../../../utils/getAssetIcon';\nimport { getTranslationKey } from '../../../utils/translations';\nimport { TABLE_HEADERS } from '../constants';\nimport { useFolderNavigation } from '../hooks/useFolderNavigation';\n\nimport type { File } from '../../../../../../shared/contracts/files';\nimport type { Folder } from '../../../../../../shared/contracts/folders';\n\nconst StyledTable = styled(RawTable)`\n  width: 100%;\n  border-collapse: separate;\n  border-spacing: 0;\n  border: 1px solid ${({ theme }) => theme.colors.neutral150};\n  border-radius: 4px;\n  overflow: hidden;\n`;\n\nconst StyledThead = styled(RawThead)`\n  background: ${({ theme }) => theme.colors.neutral100};\n\n  tr {\n    border-bottom: 1px solid ${({ theme }) => theme.colors.neutral150};\n  }\n`;\n\nconst StyledTh = styled(RawTh)`\n  height: 40px;\n  padding: 0 ${({ theme }) => theme.spaces[4]};\n  text-align: left;\n`;\n\nconst StyledTd = styled(RawTd)`\n  padding: 0 ${({ theme }) => theme.spaces[4]};\n  border-bottom: 1px solid ${({ theme }) => theme.colors.neutral150};\n`;\n\nconst StyledTr = styled(RawTr)`\n  height: 48px;\n  background: ${({ theme }) => theme.colors.neutral0};\n  cursor: pointer;\n\n  &:hover {\n    background: ${({ theme }) => theme.colors.primary100};\n  }\n\n  &:focus-visible {\n    outline: 2px solid ${({ theme }) => theme.colors.primary600};\n    outline-offset: -2px;\n  }\n\n  &:last-child {\n    ${StyledTd} {\n      border-bottom: 0;\n    }\n  }\n`;\n\nconst StyledBodyTd = styled(RawTd)`\n  padding: ${({ theme }) => theme.spaces[4]};\n  border-bottom: 1px solid ${({ theme }) => theme.colors.neutral150};\n`;\n\ninterface AssetPreviewCellProps {\n  asset: File;\n}\n\nconst AssetPreviewCell = ({ asset }: AssetPreviewCellProps) => {\n  const { ext, mime } = asset;\n\n  const DocIcon = getAssetIcon(mime, ext);\n\n  return (\n    <Flex\n      justifyContent=\"center\"\n      alignItems=\"center\"\n      borderRadius=\"4px\"\n      color=\"neutral500\"\n      width=\"3.2rem\"\n      height=\"3.2rem\"\n      shrink={0}\n    >\n      <DocIcon width={20} height={20} />\n    </Flex>\n  );\n};\n\ninterface AssetRowProps {\n  asset: File;\n  onAssetItemClick: (assetId: number) => void;\n}\n\nconst AssetRow = ({ asset, onAssetItemClick }: AssetRowProps) => {\n  const isMobile = useIsMobile();\n  const { formatDate, formatMessage } = useIntl();\n\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      onAssetItemClick(asset.id);\n    }\n  };\n\n  return (\n    <StyledTr\n      tabIndex={0}\n      role=\"row\"\n      onClick={() => onAssetItemClick(asset.id)}\n      onKeyDown={handleKeyDown}\n    >\n      <StyledTd>\n        <Flex gap={3} alignItems=\"center\">\n          <AssetPreviewCell asset={asset} />\n          <Flex direction=\"column\" alignItems=\"flex-start\">\n            <Typography textColor=\"neutral800\" fontWeight=\"semiBold\" ellipsis>\n              {asset.name}\n            </Typography>\n            {isMobile && (\n              <Typography textColor=\"neutral600\" variant=\"pi\">\n                {asset.size ? formatBytes(asset.size, 1) : '-'}\n              </Typography>\n            )}\n          </Flex>\n        </Flex>\n      </StyledTd>\n      {!isMobile && (\n        <>\n          <StyledTd>\n            <Typography textColor=\"neutral600\">\n              {asset.createdAt ? formatDate(new Date(asset.createdAt), { dateStyle: 'long' }) : '-'}\n            </Typography>\n          </StyledTd>\n          <StyledTd>\n            <Typography textColor=\"neutral600\">\n              {asset.updatedAt ? formatDate(new Date(asset.updatedAt), { dateStyle: 'long' }) : '-'}\n            </Typography>\n          </StyledTd>\n          <StyledTd>\n            <Typography textColor=\"neutral600\">\n              {asset.size ? formatBytes(asset.size, 1) : '-'}\n            </Typography>\n          </StyledTd>\n        </>\n      )}\n      <StyledTd>\n        <Flex justifyContent=\"flex-end\">\n          <IconButton\n            label={formatMessage({\n              id: getTranslationKey('control-card.more-actions'),\n              defaultMessage: 'More actions',\n            })}\n            variant=\"ghost\"\n          >\n            <More />\n          </IconButton>\n        </Flex>\n      </StyledTd>\n    </StyledTr>\n  );\n};\n\nconst FolderTr = styled(StyledTr)`\n  cursor: pointer;\n\n  &:hover {\n    background: ${({ theme }) => theme.colors.primary100};\n  }\n`;\n\ninterface FolderRowProps {\n  folder: Folder;\n}\n\nconst FolderRow = ({ folder }: FolderRowProps) => {\n  const isMobile = useIsMobile();\n  const { formatDate, formatMessage } = useIntl();\n  const { navigateToFolder } = useFolderNavigation();\n\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      navigateToFolder(folder);\n    }\n  };\n\n  return (\n    <FolderTr\n      tabIndex={0}\n      role=\"row\"\n      onClick={() => navigateToFolder(folder)}\n      onKeyDown={handleKeyDown}\n    >\n      <StyledTd>\n        <Flex gap={3} alignItems=\"center\">\n          <Flex\n            justifyContent=\"center\"\n            alignItems=\"center\"\n            borderRadius=\"4px\"\n            color=\"neutral600\"\n            width=\"3.2rem\"\n            height=\"3.2rem\"\n            shrink={0}\n          >\n            <FolderIcon width={20} height={20} />\n          </Flex>\n          <Typography textColor=\"neutral800\" fontWeight=\"semiBold\" ellipsis>\n            {folder.name}\n          </Typography>\n        </Flex>\n      </StyledTd>\n      {!isMobile && (\n        <>\n          <StyledTd>\n            <Typography textColor=\"neutral600\">\n              {folder.createdAt\n                ? formatDate(new Date(folder.createdAt), { dateStyle: 'long' })\n                : '-'}\n            </Typography>\n          </StyledTd>\n          <StyledTd>\n            <Typography textColor=\"neutral600\">\n              {folder.updatedAt\n                ? formatDate(new Date(folder.updatedAt), { dateStyle: 'long' })\n                : '-'}\n            </Typography>\n          </StyledTd>\n          <StyledTd>\n            <Typography textColor=\"neutral600\">-</Typography>\n          </StyledTd>\n        </>\n      )}\n      <StyledTd>\n        <Flex justifyContent=\"flex-end\">\n          <IconButton\n            label={formatMessage({\n              id: getTranslationKey('control-card.more-actions'),\n              defaultMessage: 'More actions',\n            })}\n            variant=\"ghost\"\n            onClick={(e: React.MouseEvent) => e.stopPropagation()}\n          >\n            <More />\n          </IconButton>\n        </Flex>\n      </StyledTd>\n    </FolderTr>\n  );\n};\n\ninterface AssetsTableProps {\n  assets: File[];\n  folders?: Folder[];\n  onAssetItemClick: (assetId: number) => void;\n}\n\nexport const AssetsTable = ({ assets, folders = [], onAssetItemClick }: AssetsTableProps) => {\n  const isMobile = useIsMobile();\n  const { formatMessage } = useIntl();\n\n  const visibleHeaders = isMobile\n    ? TABLE_HEADERS.filter((h) => h.name === 'name' || h.name === 'actions')\n    : TABLE_HEADERS;\n\n  const totalRows = folders.length + assets.length;\n\n  return (\n    <StyledTable colCount={visibleHeaders.length} rowCount={totalRows + 1}>\n      <StyledThead>\n        <RawTr>\n          {visibleHeaders.map((header) => {\n            const tableHeaderLabel = formatMessage(header.label);\n            const isVisuallyHidden = 'isVisuallyHidden' in header && header.isVisuallyHidden;\n\n            if (isVisuallyHidden) {\n              return (\n                <StyledTh key={header.name}>\n                  <VisuallyHidden>\n                    {formatMessage({\n                      id: getTranslationKey('table.header.actions'),\n                      defaultMessage: 'actions',\n                    })}\n                  </VisuallyHidden>\n                </StyledTh>\n              );\n            }\n\n            return (\n              <StyledTh key={header.name}>\n                <Typography textColor=\"neutral600\" variant=\"sigma\">\n                  {tableHeaderLabel}\n                </Typography>\n              </StyledTh>\n            );\n          })}\n        </RawTr>\n      </StyledThead>\n      <RawTbody>\n        {totalRows === 0 ? (\n          <RawTr>\n            <StyledBodyTd colSpan={visibleHeaders.length}>\n              <Typography textColor=\"neutral600\">\n                {formatMessage({\n                  id: 'app.components.EmptyStateLayout.content-document',\n                  defaultMessage: 'No content found',\n                })}\n              </Typography>\n            </StyledBodyTd>\n          </RawTr>\n        ) : (\n          <>\n            {folders.map((folder) => (\n              <FolderRow key={`folder-${folder.id}`} folder={folder} />\n            ))}\n            {assets.map((asset) => (\n              <AssetRow key={asset.id} asset={asset} onAssetItemClick={onAssetItemClick} />\n            ))}\n          </>\n        )}\n      </RawTbody>\n    </StyledTable>\n  );\n};\n"],"names":["StyledTable","styled","RawTable","theme","colors","neutral150","StyledThead","RawThead","neutral100","StyledTh","RawTh","spaces","StyledTd","RawTd","StyledTr","RawTr","neutral0","primary100","primary600","StyledBodyTd","AssetPreviewCell","asset","ext","mime","DocIcon","getAssetIcon","_jsx","Flex","justifyContent","alignItems","borderRadius","color","width","height","shrink","AssetRow","onAssetItemClick","isMobile","useIsMobile","formatDate","formatMessage","useIntl","handleKeyDown","e","key","preventDefault","id","_jsxs","tabIndex","role","onClick","onKeyDown","gap","direction","Typography","textColor","fontWeight","ellipsis","name","variant","size","formatBytes","_Fragment","createdAt","Date","dateStyle","updatedAt","IconButton","label","getTranslationKey","defaultMessage","More","FolderTr","FolderRow","folder","navigateToFolder","useFolderNavigation","FolderIcon","stopPropagation","AssetsTable","assets","folders","visibleHeaders","TABLE_HEADERS","filter","h","totalRows","length","colCount","rowCount","map","header","tableHeaderLabel","isVisuallyHidden","VisuallyHidden","RawTbody","colSpan"],"mappings":"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"}
+{"version":3,"file":"AssetsTable.mjs","sources":["../../../../../../admin/src/future/pages/Assets/components/AssetsTable.tsx"],"sourcesContent":["import { useIsMobile } from '@strapi/admin/strapi-admin';\nimport {\n  Flex,\n  IconButton,\n  RawTable,\n  RawTbody,\n  RawTd,\n  RawTh,\n  RawThead,\n  RawTr,\n  Typography,\n  VisuallyHidden,\n} from '@strapi/design-system';\nimport { Folder as FolderIcon, More } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled, css } from 'styled-components';\n\nimport { formatBytes } from '../../../utils/files';\nimport { getAssetIcon } from '../../../utils/getAssetIcon';\nimport { getTranslationKey } from '../../../utils/translations';\nimport { TABLE_HEADERS } from '../constants';\nimport { useFolderNavigation } from '../hooks/useFolderNavigation';\n\nimport { useAssetsDndOptional } from './Dnd/AssetsDndProvider';\nimport { useFileDraggable, useFolderDraggableDroppable } from './Dnd/useAssetDnd';\n\nimport type { File } from '../../../../../../shared/contracts/files';\nimport type { Folder } from '../../../../../../shared/contracts/folders';\n\nconst StyledTable = styled(RawTable)`\n  width: 100%;\n  border-collapse: separate;\n  border-spacing: 0;\n  border: 1px solid ${({ theme }) => theme.colors.neutral150};\n  border-radius: 4px;\n  overflow: hidden;\n`;\n\nconst StyledThead = styled(RawThead)`\n  background: ${({ theme }) => theme.colors.neutral100};\n\n  tr {\n    border-bottom: 1px solid ${({ theme }) => theme.colors.neutral150};\n  }\n`;\n\nconst StyledTh = styled(RawTh)`\n  height: 40px;\n  padding: 0 ${({ theme }) => theme.spaces[4]};\n  text-align: left;\n`;\n\nconst StyledTd = styled(RawTd)`\n  padding: 0 ${({ theme }) => theme.spaces[4]};\n  border-bottom: 1px solid ${({ theme }) => theme.colors.neutral150};\n`;\n\nconst StyledTr = styled.tr<{\n  $isDragging?: boolean;\n  $isMovePending?: boolean;\n  $isValidDropTarget?: boolean;\n  $isInvalidDropTarget?: boolean;\n}>`\n  height: 48px;\n  background: ${({ theme }) => theme.colors.neutral0};\n  cursor: ${({ $isMovePending, $isInvalidDropTarget }) => {\n    if ($isMovePending) {\n      return 'wait';\n    }\n\n    return $isInvalidDropTarget ? 'not-allowed' : 'pointer';\n  }};\n  opacity: ${({ $isDragging }) => ($isDragging ? 0.4 : 1)};\n  pointer-events: ${({ $isMovePending }) => ($isMovePending ? 'none' : 'auto')};\n\n  ${({ $isValidDropTarget, theme }) =>\n    $isValidDropTarget &&\n    css`\n      background: ${theme.colors.primary100};\n      outline: 1px dashed ${theme.colors.primary600};\n      outline-offset: -1px;\n    `}\n\n  &:hover {\n    background: ${({ theme }) => theme.colors.primary100};\n  }\n\n  &:focus-visible {\n    outline: 2px solid ${({ theme }) => theme.colors.primary600};\n    outline-offset: -2px;\n  }\n\n  &:last-child {\n    ${StyledTd} {\n      border-bottom: 0;\n    }\n  }\n`;\n\nconst StyledBodyTd = styled(RawTd)`\n  padding: ${({ theme }) => theme.spaces[4]};\n  border-bottom: 1px solid ${({ theme }) => theme.colors.neutral150};\n`;\n\ninterface AssetPreviewCellProps {\n  asset: File;\n}\n\nconst AssetPreviewCell = ({ asset }: AssetPreviewCellProps) => {\n  const { ext, mime } = asset;\n\n  const DocIcon = getAssetIcon(mime, ext);\n\n  return (\n    <Flex\n      justifyContent=\"center\"\n      alignItems=\"center\"\n      borderRadius=\"4px\"\n      color=\"neutral500\"\n      width=\"3.2rem\"\n      height=\"3.2rem\"\n      shrink={0}\n    >\n      <DocIcon width={20} height={20} />\n    </Flex>\n  );\n};\n\ninterface AssetRowProps {\n  asset: File;\n  onAssetItemClick: (assetId: number) => void;\n}\n\nconst AssetRow = ({ asset, onAssetItemClick }: AssetRowProps) => {\n  const isMobile = useIsMobile();\n  const { formatDate, formatMessage } = useIntl();\n  const { isMovePending } = useAssetsDndOptional() ?? { isMovePending: false };\n  const { attributes, listeners, setNodeRef, isDragging } = useFileDraggable(asset);\n\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      onAssetItemClick(asset.id);\n    }\n  };\n\n  return (\n    <StyledTr\n      ref={setNodeRef}\n      {...attributes}\n      {...listeners}\n      $isDragging={isDragging}\n      $isMovePending={isMovePending}\n      tabIndex={0}\n      role=\"row\"\n      onDragStart={(e) => e.preventDefault()}\n      onClick={() => onAssetItemClick(asset.id)}\n      onKeyDown={handleKeyDown}\n    >\n      <StyledTd>\n        <Flex gap={3} alignItems=\"center\">\n          <AssetPreviewCell asset={asset} />\n          <Flex direction=\"column\" alignItems=\"flex-start\">\n            <Typography textColor=\"neutral800\" fontWeight=\"semiBold\" ellipsis>\n              {asset.name}\n            </Typography>\n            {isMobile && (\n              <Typography textColor=\"neutral600\" variant=\"pi\">\n                {asset.size ? formatBytes(asset.size, 1) : '-'}\n              </Typography>\n            )}\n          </Flex>\n        </Flex>\n      </StyledTd>\n      {!isMobile && (\n        <>\n          <StyledTd>\n            <Typography textColor=\"neutral600\">\n              {asset.createdAt ? formatDate(new Date(asset.createdAt), { dateStyle: 'long' }) : '-'}\n            </Typography>\n          </StyledTd>\n          <StyledTd>\n            <Typography textColor=\"neutral600\">\n              {asset.updatedAt ? formatDate(new Date(asset.updatedAt), { dateStyle: 'long' }) : '-'}\n            </Typography>\n          </StyledTd>\n          <StyledTd>\n            <Typography textColor=\"neutral600\">\n              {asset.size ? formatBytes(asset.size, 1) : '-'}\n            </Typography>\n          </StyledTd>\n        </>\n      )}\n      <StyledTd>\n        <Flex justifyContent=\"flex-end\">\n          <IconButton\n            label={formatMessage({\n              id: getTranslationKey('control-card.more-actions'),\n              defaultMessage: 'More actions',\n            })}\n            variant=\"ghost\"\n            onClick={(e: React.MouseEvent) => e.stopPropagation()}\n          >\n            <More />\n          </IconButton>\n        </Flex>\n      </StyledTd>\n    </StyledTr>\n  );\n};\n\nconst FolderTr = styled(StyledTr)`\n  &:hover {\n    background: ${({ theme }) => theme.colors.primary100};\n  }\n`;\n\ninterface FolderRowProps {\n  folder: Folder;\n}\n\nconst FolderRow = ({ folder }: FolderRowProps) => {\n  const isMobile = useIsMobile();\n  const { formatDate, formatMessage } = useIntl();\n  const { navigateToFolder } = useFolderNavigation();\n  const { isMovePending } = useAssetsDndOptional() ?? { isMovePending: false };\n  const {\n    draggable: { attributes, listeners, setNodeRef: setDragRef, isDragging },\n    droppable: { setNodeRef: setDropRef },\n    showValidDropHighlight,\n    showInvalidDropCursor,\n  } = useFolderDraggableDroppable(folder);\n\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      navigateToFolder(folder);\n    }\n  };\n\n  return (\n    <FolderTr\n      ref={(node) => {\n        setDragRef(node);\n        setDropRef(node);\n      }}\n      {...attributes}\n      {...listeners}\n      $isDragging={isDragging}\n      $isMovePending={isMovePending}\n      $isValidDropTarget={showValidDropHighlight}\n      $isInvalidDropTarget={showInvalidDropCursor}\n      tabIndex={0}\n      role=\"row\"\n      onDragStart={(e) => e.preventDefault()}\n      onClick={() => navigateToFolder(folder)}\n      onKeyDown={handleKeyDown}\n    >\n      <StyledTd>\n        <Flex gap={3} alignItems=\"center\">\n          <Flex\n            justifyContent=\"center\"\n            alignItems=\"center\"\n            borderRadius=\"4px\"\n            color=\"neutral600\"\n            width=\"3.2rem\"\n            height=\"3.2rem\"\n            shrink={0}\n          >\n            <FolderIcon width={20} height={20} />\n          </Flex>\n          <Typography textColor=\"neutral800\" fontWeight=\"semiBold\" ellipsis>\n            {folder.name}\n          </Typography>\n        </Flex>\n      </StyledTd>\n      {!isMobile && (\n        <>\n          <StyledTd>\n            <Typography textColor=\"neutral600\">\n              {folder.createdAt\n                ? formatDate(new Date(folder.createdAt), { dateStyle: 'long' })\n                : '-'}\n            </Typography>\n          </StyledTd>\n          <StyledTd>\n            <Typography textColor=\"neutral600\">\n              {folder.updatedAt\n                ? formatDate(new Date(folder.updatedAt), { dateStyle: 'long' })\n                : '-'}\n            </Typography>\n          </StyledTd>\n          <StyledTd>\n            <Typography textColor=\"neutral600\">-</Typography>\n          </StyledTd>\n        </>\n      )}\n      <StyledTd>\n        <Flex justifyContent=\"flex-end\">\n          <IconButton\n            label={formatMessage({\n              id: getTranslationKey('control-card.more-actions'),\n              defaultMessage: 'More actions',\n            })}\n            variant=\"ghost\"\n            onClick={(e: React.MouseEvent) => e.stopPropagation()}\n          >\n            <More />\n          </IconButton>\n        </Flex>\n      </StyledTd>\n    </FolderTr>\n  );\n};\n\ninterface AssetsTableProps {\n  assets: File[];\n  folders?: Folder[];\n  onAssetItemClick: (assetId: number) => void;\n}\n\nexport const AssetsTable = ({ assets, folders = [], onAssetItemClick }: AssetsTableProps) => {\n  const isMobile = useIsMobile();\n  const { formatMessage } = useIntl();\n\n  const visibleHeaders = isMobile\n    ? TABLE_HEADERS.filter((h) => h.name === 'name' || h.name === 'actions')\n    : TABLE_HEADERS;\n\n  const totalRows = folders.length + assets.length;\n\n  return (\n    <StyledTable colCount={visibleHeaders.length} rowCount={totalRows + 1}>\n      <StyledThead>\n        <RawTr>\n          {visibleHeaders.map((header) => {\n            const tableHeaderLabel = formatMessage(header.label);\n            const isVisuallyHidden = 'isVisuallyHidden' in header && header.isVisuallyHidden;\n\n            if (isVisuallyHidden) {\n              return (\n                <StyledTh key={header.name}>\n                  <VisuallyHidden>\n                    {formatMessage({\n                      id: getTranslationKey('table.header.actions'),\n                      defaultMessage: 'actions',\n                    })}\n                  </VisuallyHidden>\n                </StyledTh>\n              );\n            }\n\n            return (\n              <StyledTh key={header.name}>\n                <Typography textColor=\"neutral600\" variant=\"sigma\">\n                  {tableHeaderLabel}\n                </Typography>\n              </StyledTh>\n            );\n          })}\n        </RawTr>\n      </StyledThead>\n      <RawTbody>\n        {totalRows === 0 ? (\n          <RawTr>\n            <StyledBodyTd colSpan={visibleHeaders.length}>\n              <Typography textColor=\"neutral600\">\n                {formatMessage({\n                  id: 'app.components.EmptyStateLayout.content-document',\n                  defaultMessage: 'No content found',\n                })}\n              </Typography>\n            </StyledBodyTd>\n          </RawTr>\n        ) : (\n          <>\n            {folders.map((folder) => (\n              <FolderRow key={`folder-${folder.id}`} folder={folder} />\n            ))}\n            {assets.map((asset) => (\n              <AssetRow key={asset.id} asset={asset} onAssetItemClick={onAssetItemClick} />\n            ))}\n          </>\n        )}\n      </RawTbody>\n    </StyledTable>\n  );\n};\n"],"names":["StyledTable","styled","RawTable","theme","colors","neutral150","StyledThead","RawThead","neutral100","StyledTh","RawTh","spaces","StyledTd","RawTd","StyledTr","tr","neutral0","$isMovePending","$isInvalidDropTarget","$isDragging","$isValidDropTarget","css","primary100","primary600","StyledBodyTd","AssetPreviewCell","asset","ext","mime","DocIcon","getAssetIcon","_jsx","Flex","justifyContent","alignItems","borderRadius","color","width","height","shrink","AssetRow","onAssetItemClick","isMobile","useIsMobile","formatDate","formatMessage","useIntl","isMovePending","useAssetsDndOptional","attributes","listeners","setNodeRef","isDragging","useFileDraggable","handleKeyDown","e","key","preventDefault","id","_jsxs","ref","tabIndex","role","onDragStart","onClick","onKeyDown","gap","direction","Typography","textColor","fontWeight","ellipsis","name","variant","size","formatBytes","_Fragment","createdAt","Date","dateStyle","updatedAt","IconButton","label","getTranslationKey","defaultMessage","stopPropagation","More","FolderTr","FolderRow","folder","navigateToFolder","useFolderNavigation","draggable","setDragRef","droppable","setDropRef","showValidDropHighlight","showInvalidDropCursor","useFolderDraggableDroppable","node","FolderIcon","AssetsTable","assets","folders","visibleHeaders","TABLE_HEADERS","filter","h","totalRows","length","colCount","rowCount","RawTr","map","header","tableHeaderLabel","isVisuallyHidden","VisuallyHidden","RawTbody","colSpan"],"mappings":";;;;;;;;;;;;;;AA6BA,MAAMA,WAAAA,GAAcC,MAAAA,CAAOC,QAAAA,CAAS;;;;oBAIhB,EAAE,CAAC,EAAEC,KAAK,EAAE,GAAKA,KAAAA,CAAMC,MAAM,CAACC,UAAU,CAAC;;;AAG7D,CAAC;AAED,MAAMC,WAAAA,GAAcL,MAAAA,CAAOM,QAAAA,CAAS;cACtB,EAAE,CAAC,EAAEJ,KAAK,EAAE,GAAKA,KAAAA,CAAMC,MAAM,CAACI,UAAU,CAAC;;;6BAG1B,EAAE,CAAC,EAAEL,KAAK,EAAE,GAAKA,KAAAA,CAAMC,MAAM,CAACC,UAAU,CAAC;;AAEtE,CAAC;AAED,MAAMI,QAAAA,GAAWR,MAAAA,CAAOS,KAAAA,CAAM;;aAEjB,EAAE,CAAC,EAAEP,KAAK,EAAE,GAAKA,KAAAA,CAAMQ,MAAM,CAAC,CAAA,CAAE,CAAC;;AAE9C,CAAC;AAED,MAAMC,QAAAA,GAAWX,MAAAA,CAAOY,KAAAA,CAAM;aACjB,EAAE,CAAC,EAAEV,KAAK,EAAE,GAAKA,KAAAA,CAAMQ,MAAM,CAAC,CAAA,CAAE,CAAC;2BACnB,EAAE,CAAC,EAAER,KAAK,EAAE,GAAKA,KAAAA,CAAMC,MAAM,CAACC,UAAU,CAAC;AACpE,CAAC;AAED,MAAMS,QAAAA,GAAWb,MAAAA,CAAOc,EAKtB;;cAEY,EAAE,CAAC,EAAEZ,KAAK,EAAE,GAAKA,KAAAA,CAAMC,MAAM,CAACY,QAAQ,CAAC;AAC3C,UAAA,EAAE,CAAC,EAAEC,cAAc,EAAEC,oBAAoB,EAAE,GAAA;AACjD,IAAA,IAAID,cAAAA,EAAgB;QAClB,OAAO,MAAA;AACT,IAAA;AAEA,IAAA,OAAOC,uBAAuB,aAAA,GAAgB,SAAA;AAChD,CAAA,CAAE;AACO,WAAA,EAAE,CAAC,EAAEC,WAAW,EAAE,GAAMA,WAAAA,GAAc,MAAM,CAAA,CAAG;AACxC,kBAAA,EAAE,CAAC,EAAEF,cAAc,EAAE,GAAMA,cAAAA,GAAiB,SAAS,MAAA,CAAQ;;EAE7E,EAAE,CAAC,EAAEG,kBAAkB,EAAEjB,KAAK,EAAE,GAC9BiB,kBAAAA,IACAC,GAAG;AACW,kBAAA,EAAElB,KAAAA,CAAMC,MAAM,CAACkB,UAAU,CAAC;AAClB,0BAAA,EAAEnB,KAAAA,CAAMC,MAAM,CAACmB,UAAU,CAAC;;AAEhD,IAAA,CAAC;;;gBAGW,EAAE,CAAC,EAAEpB,KAAK,EAAE,GAAKA,KAAAA,CAAMC,MAAM,CAACkB,UAAU,CAAC;;;;uBAIlC,EAAE,CAAC,EAAEnB,KAAK,EAAE,GAAKA,KAAAA,CAAMC,MAAM,CAACmB,UAAU,CAAC;;;;;AAK5D,IAAA,EAAEX,QAAAA,CAAS;;;;AAIf,CAAC;AAED,MAAMY,YAAAA,GAAevB,MAAAA,CAAOY,KAAAA,CAAM;WACvB,EAAE,CAAC,EAAEV,KAAK,EAAE,GAAKA,KAAAA,CAAMQ,MAAM,CAAC,CAAA,CAAE,CAAC;2BACjB,EAAE,CAAC,EAAER,KAAK,EAAE,GAAKA,KAAAA,CAAMC,MAAM,CAACC,UAAU,CAAC;AACpE,CAAC;AAMD,MAAMoB,gBAAAA,GAAmB,CAAC,EAAEC,KAAK,EAAyB,GAAA;AACxD,IAAA,MAAM,EAAEC,GAAG,EAAEC,IAAI,EAAE,GAAGF,KAAAA;IAEtB,MAAMG,OAAAA,GAAUC,aAAaF,IAAAA,EAAMD,GAAAA,CAAAA;AAEnC,IAAA,qBACEI,GAAA,CAACC,IAAAA,EAAAA;QACCC,cAAAA,EAAe,QAAA;QACfC,UAAAA,EAAW,QAAA;QACXC,YAAAA,EAAa,KAAA;QACbC,KAAAA,EAAM,YAAA;QACNC,KAAAA,EAAM,QAAA;QACNC,MAAAA,EAAO,QAAA;QACPC,MAAAA,EAAQ,CAAA;AAER,QAAA,QAAA,gBAAAR,GAAA,CAACF,OAAAA,EAAAA;YAAQQ,KAAAA,EAAO,EAAA;YAAIC,MAAAA,EAAQ;;;AAGlC,CAAA;AAOA,MAAME,WAAW,CAAC,EAAEd,KAAK,EAAEe,gBAAgB,EAAiB,GAAA;AAC1D,IAAA,MAAMC,QAAAA,GAAWC,WAAAA,EAAAA;AACjB,IAAA,MAAM,EAAEC,UAAU,EAAEC,aAAa,EAAE,GAAGC,OAAAA,EAAAA;AACtC,IAAA,MAAM,EAAEC,aAAa,EAAE,GAAGC,oBAAAA,EAAAA,IAA0B;QAAED,aAAAA,EAAe;AAAM,KAAA;IAC3E,MAAM,EAAEE,UAAU,EAAEC,SAAS,EAAEC,UAAU,EAAEC,UAAU,EAAE,GAAGC,gBAAAA,CAAiB3B,KAAAA,CAAAA;AAE3E,IAAA,MAAM4B,gBAAgB,CAACC,CAAAA,GAAAA;AACrB,QAAA,IAAIA,EAAEC,GAAG,KAAK,WAAWD,CAAAA,CAAEC,GAAG,KAAK,GAAA,EAAK;AACtCD,YAAAA,CAAAA,CAAEE,cAAc,EAAA;AAChBhB,YAAAA,gBAAAA,CAAiBf,MAAMgC,EAAE,CAAA;AAC3B,QAAA;AACF,IAAA,CAAA;AAEA,IAAA,qBACEC,IAAA,CAAC7C,QAAAA,EAAAA;QACC8C,GAAAA,EAAKT,UAAAA;AACJ,QAAA,GAAGF,UAAU;AACb,QAAA,GAAGC,SAAS;QACb/B,WAAAA,EAAaiC,UAAAA;QACbnC,cAAAA,EAAgB8B,aAAAA;QAChBc,QAAAA,EAAU,CAAA;QACVC,IAAAA,EAAK,KAAA;QACLC,WAAAA,EAAa,CAACR,CAAAA,GAAMA,CAAAA,CAAEE,cAAc,EAAA;QACpCO,OAAAA,EAAS,IAAMvB,gBAAAA,CAAiBf,KAAAA,CAAMgC,EAAE,CAAA;QACxCO,SAAAA,EAAWX,aAAAA;;0BAEXvB,GAAA,CAACnB,QAAAA,EAAAA;AACC,gBAAA,QAAA,gBAAA+C,IAAA,CAAC3B,IAAAA,EAAAA;oBAAKkC,GAAAA,EAAK,CAAA;oBAAGhC,UAAAA,EAAW,QAAA;;sCACvBH,GAAA,CAACN,gBAAAA,EAAAA;4BAAiBC,KAAAA,EAAOA;;sCACzBiC,IAAA,CAAC3B,IAAAA,EAAAA;4BAAKmC,SAAAA,EAAU,QAAA;4BAASjC,UAAAA,EAAW,YAAA;;8CAClCH,GAAA,CAACqC,UAAAA,EAAAA;oCAAWC,SAAAA,EAAU,YAAA;oCAAaC,UAAAA,EAAW,UAAA;oCAAWC,QAAQ,EAAA,IAAA;AAC9D7C,oCAAAA,QAAAA,EAAAA,KAAAA,CAAM8C;;AAER9B,gCAAAA,QAAAA,kBACCX,GAAA,CAACqC,UAAAA,EAAAA;oCAAWC,SAAAA,EAAU,YAAA;oCAAaI,OAAAA,EAAQ,IAAA;AACxC/C,oCAAAA,QAAAA,EAAAA,KAAAA,CAAMgD,IAAI,GAAGC,WAAAA,CAAYjD,KAAAA,CAAMgD,IAAI,EAAE,CAAA,CAAA,GAAK;;;;;;;AAMpD,YAAA,CAAChC,QAAAA,kBACAiB,IAAA,CAAAiB,QAAA,EAAA;;kCACE7C,GAAA,CAACnB,QAAAA,EAAAA;AACC,wBAAA,QAAA,gBAAAmB,GAAA,CAACqC,UAAAA,EAAAA;4BAAWC,SAAAA,EAAU,YAAA;AACnB3C,4BAAAA,QAAAA,EAAAA,KAAAA,CAAMmD,SAAS,GAAGjC,UAAAA,CAAW,IAAIkC,IAAAA,CAAKpD,KAAAA,CAAMmD,SAAS,CAAA,EAAG;gCAAEE,SAAAA,EAAW;6BAAO,CAAA,GAAK;;;kCAGtFhD,GAAA,CAACnB,QAAAA,EAAAA;AACC,wBAAA,QAAA,gBAAAmB,GAAA,CAACqC,UAAAA,EAAAA;4BAAWC,SAAAA,EAAU,YAAA;AACnB3C,4BAAAA,QAAAA,EAAAA,KAAAA,CAAMsD,SAAS,GAAGpC,UAAAA,CAAW,IAAIkC,IAAAA,CAAKpD,KAAAA,CAAMsD,SAAS,CAAA,EAAG;gCAAED,SAAAA,EAAW;6BAAO,CAAA,GAAK;;;kCAGtFhD,GAAA,CAACnB,QAAAA,EAAAA;AACC,wBAAA,QAAA,gBAAAmB,GAAA,CAACqC,UAAAA,EAAAA;4BAAWC,SAAAA,EAAU,YAAA;AACnB3C,4BAAAA,QAAAA,EAAAA,KAAAA,CAAMgD,IAAI,GAAGC,WAAAA,CAAYjD,KAAAA,CAAMgD,IAAI,EAAE,CAAA,CAAA,GAAK;;;;;0BAKnD3C,GAAA,CAACnB,QAAAA,EAAAA;AACC,gBAAA,QAAA,gBAAAmB,GAAA,CAACC,IAAAA,EAAAA;oBAAKC,cAAAA,EAAe,UAAA;AACnB,oBAAA,QAAA,gBAAAF,GAAA,CAACkD,UAAAA,EAAAA;AACCC,wBAAAA,KAAAA,EAAOrC,aAAAA,CAAc;AACnBa,4BAAAA,EAAAA,EAAIyB,iBAAAA,CAAkB,2BAAA,CAAA;4BACtBC,cAAAA,EAAgB;AAClB,yBAAA,CAAA;wBACAX,OAAAA,EAAQ,OAAA;wBACRT,OAAAA,EAAS,CAACT,CAAAA,GAAwBA,CAAAA,CAAE8B,eAAe,EAAA;AAEnD,wBAAA,QAAA,gBAAAtD,GAAA,CAACuD,IAAAA,EAAAA,EAAAA;;;;;;AAMb,CAAA;AAEA,MAAMC,QAAAA,GAAWtF,MAAAA,CAAOa,QAAAA,CAAS;;gBAEjB,EAAE,CAAC,EAAEX,KAAK,EAAE,GAAKA,KAAAA,CAAMC,MAAM,CAACkB,UAAU,CAAC;;AAEzD,CAAC;AAMD,MAAMkE,SAAAA,GAAY,CAAC,EAAEC,MAAM,EAAkB,GAAA;AAC3C,IAAA,MAAM/C,QAAAA,GAAWC,WAAAA,EAAAA;AACjB,IAAA,MAAM,EAAEC,UAAU,EAAEC,aAAa,EAAE,GAAGC,OAAAA,EAAAA;IACtC,MAAM,EAAE4C,gBAAgB,EAAE,GAAGC,mBAAAA,EAAAA;AAC7B,IAAA,MAAM,EAAE5C,aAAa,EAAE,GAAGC,oBAAAA,EAAAA,IAA0B;QAAED,aAAAA,EAAe;AAAM,KAAA;IAC3E,MAAM,EACJ6C,SAAAA,EAAW,EAAE3C,UAAU,EAAEC,SAAS,EAAEC,UAAAA,EAAY0C,UAAU,EAAEzC,UAAU,EAAE,EACxE0C,SAAAA,EAAW,EAAE3C,UAAAA,EAAY4C,UAAU,EAAE,EACrCC,sBAAsB,EACtBC,qBAAqB,EACtB,GAAGC,2BAAAA,CAA4BT,MAAAA,CAAAA;AAEhC,IAAA,MAAMnC,gBAAgB,CAACC,CAAAA,GAAAA;AACrB,QAAA,IAAIA,EAAEC,GAAG,KAAK,WAAWD,CAAAA,CAAEC,GAAG,KAAK,GAAA,EAAK;AACtCD,YAAAA,CAAAA,CAAEE,cAAc,EAAA;YAChBiC,gBAAAA,CAAiBD,MAAAA,CAAAA;AACnB,QAAA;AACF,IAAA,CAAA;AAEA,IAAA,qBACE9B,IAAA,CAAC4B,QAAAA,EAAAA;AACC3B,QAAAA,GAAAA,EAAK,CAACuC,IAAAA,GAAAA;YACJN,UAAAA,CAAWM,IAAAA,CAAAA;YACXJ,UAAAA,CAAWI,IAAAA,CAAAA;AACb,QAAA,CAAA;AACC,QAAA,GAAGlD,UAAU;AACb,QAAA,GAAGC,SAAS;QACb/B,WAAAA,EAAaiC,UAAAA;QACbnC,cAAAA,EAAgB8B,aAAAA;QAChB3B,kBAAAA,EAAoB4E,sBAAAA;QACpB9E,oBAAAA,EAAsB+E,qBAAAA;QACtBpC,QAAAA,EAAU,CAAA;QACVC,IAAAA,EAAK,KAAA;QACLC,WAAAA,EAAa,CAACR,CAAAA,GAAMA,CAAAA,CAAEE,cAAc,EAAA;AACpCO,QAAAA,OAAAA,EAAS,IAAM0B,gBAAAA,CAAiBD,MAAAA,CAAAA;QAChCxB,SAAAA,EAAWX,aAAAA;;0BAEXvB,GAAA,CAACnB,QAAAA,EAAAA;AACC,gBAAA,QAAA,gBAAA+C,IAAA,CAAC3B,IAAAA,EAAAA;oBAAKkC,GAAAA,EAAK,CAAA;oBAAGhC,UAAAA,EAAW,QAAA;;sCACvBH,GAAA,CAACC,IAAAA,EAAAA;4BACCC,cAAAA,EAAe,QAAA;4BACfC,UAAAA,EAAW,QAAA;4BACXC,YAAAA,EAAa,KAAA;4BACbC,KAAAA,EAAM,YAAA;4BACNC,KAAAA,EAAM,QAAA;4BACNC,MAAAA,EAAO,QAAA;4BACPC,MAAAA,EAAQ,CAAA;AAER,4BAAA,QAAA,gBAAAR,GAAA,CAACqE,MAAAA,EAAAA;gCAAW/D,KAAAA,EAAO,EAAA;gCAAIC,MAAAA,EAAQ;;;sCAEjCP,GAAA,CAACqC,UAAAA,EAAAA;4BAAWC,SAAAA,EAAU,YAAA;4BAAaC,UAAAA,EAAW,UAAA;4BAAWC,QAAQ,EAAA,IAAA;AAC9DkB,4BAAAA,QAAAA,EAAAA,MAAAA,CAAOjB;;;;;AAIb,YAAA,CAAC9B,QAAAA,kBACAiB,IAAA,CAAAiB,QAAA,EAAA;;kCACE7C,GAAA,CAACnB,QAAAA,EAAAA;AACC,wBAAA,QAAA,gBAAAmB,GAAA,CAACqC,UAAAA,EAAAA;4BAAWC,SAAAA,EAAU,YAAA;AACnBoB,4BAAAA,QAAAA,EAAAA,MAAAA,CAAOZ,SAAS,GACbjC,UAAAA,CAAW,IAAIkC,IAAAA,CAAKW,MAAAA,CAAOZ,SAAS,CAAA,EAAG;gCAAEE,SAAAA,EAAW;6BAAO,CAAA,GAC3D;;;kCAGRhD,GAAA,CAACnB,QAAAA,EAAAA;AACC,wBAAA,QAAA,gBAAAmB,GAAA,CAACqC,UAAAA,EAAAA;4BAAWC,SAAAA,EAAU,YAAA;AACnBoB,4BAAAA,QAAAA,EAAAA,MAAAA,CAAOT,SAAS,GACbpC,UAAAA,CAAW,IAAIkC,IAAAA,CAAKW,MAAAA,CAAOT,SAAS,CAAA,EAAG;gCAAED,SAAAA,EAAW;6BAAO,CAAA,GAC3D;;;kCAGRhD,GAAA,CAACnB,QAAAA,EAAAA;AACC,wBAAA,QAAA,gBAAAmB,GAAA,CAACqC,UAAAA,EAAAA;4BAAWC,SAAAA,EAAU,YAAA;AAAa,4BAAA,QAAA,EAAA;;;;;0BAIzCtC,GAAA,CAACnB,QAAAA,EAAAA;AACC,gBAAA,QAAA,gBAAAmB,GAAA,CAACC,IAAAA,EAAAA;oBAAKC,cAAAA,EAAe,UAAA;AACnB,oBAAA,QAAA,gBAAAF,GAAA,CAACkD,UAAAA,EAAAA;AACCC,wBAAAA,KAAAA,EAAOrC,aAAAA,CAAc;AACnBa,4BAAAA,EAAAA,EAAIyB,iBAAAA,CAAkB,2BAAA,CAAA;4BACtBC,cAAAA,EAAgB;AAClB,yBAAA,CAAA;wBACAX,OAAAA,EAAQ,OAAA;wBACRT,OAAAA,EAAS,CAACT,CAAAA,GAAwBA,CAAAA,CAAE8B,eAAe,EAAA;AAEnD,wBAAA,QAAA,gBAAAtD,GAAA,CAACuD,IAAAA,EAAAA,EAAAA;;;;;;AAMb,CAAA;AAQO,MAAMe,WAAAA,GAAc,CAAC,EAAEC,MAAM,EAAEC,OAAAA,GAAU,EAAE,EAAE9D,gBAAgB,EAAoB,GAAA;AACtF,IAAA,MAAMC,QAAAA,GAAWC,WAAAA,EAAAA;IACjB,MAAM,EAAEE,aAAa,EAAE,GAAGC,OAAAA,EAAAA;AAE1B,IAAA,MAAM0D,cAAAA,GAAiB9D,QAAAA,GACnB+D,aAAAA,CAAcC,MAAM,CAAC,CAACC,CAAAA,GAAMA,CAAAA,CAAEnC,IAAI,KAAK,MAAA,IAAUmC,CAAAA,CAAEnC,IAAI,KAAK,SAAA,CAAA,GAC5DiC,aAAAA;AAEJ,IAAA,MAAMG,SAAAA,GAAYL,OAAAA,CAAQM,MAAM,GAAGP,OAAOO,MAAM;AAEhD,IAAA,qBACElD,IAAA,CAAC3D,WAAAA,EAAAA;AAAY8G,QAAAA,QAAAA,EAAUN,eAAeK,MAAM;AAAEE,QAAAA,QAAAA,EAAUH,SAAAA,GAAY,CAAA;;0BAClE7E,GAAA,CAACzB,WAAAA,EAAAA;AACC,gBAAA,QAAA,gBAAAyB,GAAA,CAACiF,KAAAA,EAAAA;8BACER,cAAAA,CAAeS,GAAG,CAAC,CAACC,MAAAA,GAAAA;wBACnB,MAAMC,gBAAAA,GAAmBtE,aAAAA,CAAcqE,MAAAA,CAAOhC,KAAK,CAAA;AACnD,wBAAA,MAAMkC,gBAAAA,GAAmB,kBAAA,IAAsBF,MAAAA,IAAUA,MAAAA,CAAOE,gBAAgB;AAEhF,wBAAA,IAAIA,gBAAAA,EAAkB;AACpB,4BAAA,qBACErF,GAAA,CAACtB,QAAAA,EAAAA;AACC,gCAAA,QAAA,gBAAAsB,GAAA,CAACsF,cAAAA,EAAAA;8CACExE,aAAAA,CAAc;AACba,wCAAAA,EAAAA,EAAIyB,iBAAAA,CAAkB,sBAAA,CAAA;wCACtBC,cAAAA,EAAgB;AAClB,qCAAA;;AALW8B,6BAAAA,EAAAA,MAAAA,CAAO1C,IAAI,CAAA;AAS9B,wBAAA;AAEA,wBAAA,qBACEzC,GAAA,CAACtB,QAAAA,EAAAA;AACC,4BAAA,QAAA,gBAAAsB,GAAA,CAACqC,UAAAA,EAAAA;gCAAWC,SAAAA,EAAU,YAAA;gCAAaI,OAAAA,EAAQ,OAAA;AACxC0C,gCAAAA,QAAAA,EAAAA;;AAFUD,yBAAAA,EAAAA,MAAAA,CAAO1C,IAAI,CAAA;AAM9B,oBAAA,CAAA;;;0BAGJzC,GAAA,CAACuF,QAAAA,EAAAA;AACEV,gBAAAA,QAAAA,EAAAA,SAAAA,KAAc,kBACb7E,GAAA,CAACiF,KAAAA,EAAAA;AACC,oBAAA,QAAA,gBAAAjF,GAAA,CAACP,YAAAA,EAAAA;AAAa+F,wBAAAA,OAAAA,EAASf,eAAeK,MAAM;AAC1C,wBAAA,QAAA,gBAAA9E,GAAA,CAACqC,UAAAA,EAAAA;4BAAWC,SAAAA,EAAU,YAAA;sCACnBxB,aAAAA,CAAc;gCACba,EAAAA,EAAI,kDAAA;gCACJ0B,cAAAA,EAAgB;AAClB,6BAAA;;;AAKN,iBAAA,CAAA,iBAAAzB,IAAA,CAAAiB,QAAA,EAAA;;AACG2B,wBAAAA,OAAAA,CAAQU,GAAG,CAAC,CAACxB,MAAAA,iBACZ1D,GAAA,CAACyD,SAAAA,EAAAA;gCAAsCC,MAAAA,EAAQA;AAA/B,6BAAA,EAAA,CAAC,OAAO,EAAEA,MAAAA,CAAO/B,EAAE,CAAA,CAAE,CAAA,CAAA;AAEtC4C,wBAAAA,MAAAA,CAAOW,GAAG,CAAC,CAACvF,KAAAA,iBACXK,GAAA,CAACS,QAAAA,EAAAA;gCAAwBd,KAAAA,EAAOA,KAAAA;gCAAOe,gBAAAA,EAAkBA;AAA1Cf,6BAAAA,EAAAA,KAAAA,CAAMgC,EAAE,CAAA;;;;;;AAOrC;;;;"}

package/dist/admin/future/pages/Assets/components/Dnd/AssetsDndProvider.js

@@ -0,0 +1,195 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var core = require('@dnd-kit/core');
+var strapiAdmin = require('@strapi/admin/strapi-admin');
+var designSystem = require('@strapi/design-system');
+var reactIntl = require('react-intl');
+var folders = require('../../../../services/folders.js');
+var buildBulkMovePayload = require('../../../../utils/buildBulkMovePayload.js');
+var canDropItemOnFolder = require('../../../../utils/canDropItemOnFolder.js');
+var getBulkMoveErrorMessage = require('../../../../utils/getBulkMoveErrorMessage.js');
+var translations = require('../../../../utils/translations.js');
+var dndIds = require('./dndIds.js');
+var DragOverlayChip = require('./DragOverlayChip.js');
+
+const AssetsDndContext = /*#__PURE__*/ React.createContext(null);
+const useAssetsDndOptional = ()=>React.useContext(AssetsDndContext);
+const getDragItems = (activeData)=>{
+    if (!activeData) {
+        return [];
+    }
+    // TODO(CMS-433): include selectedItems from active data for multi-drag payload members.
+    return [
+        activeData
+    ];
+};
+const AssetsDndProvider = ({ children })=>{
+    const { formatMessage } = reactIntl.useIntl();
+    const { toggleNotification } = strapiAdmin.useNotification();
+    const { data: folderStructure = [] } = folders.useGetFolderStructureQuery();
+    const [bulkMove, { isLoading: isMovePending }] = folders.useBulkMoveMutation();
+    const [activeItem, setActiveItem] = React.useState(null);
+    const [liveAnnouncement, setLiveAnnouncement] = React.useState('');
+    const announceToLiveRegion = React.useCallback((message)=>{
+        setLiveAnnouncement('');
+        requestAnimationFrame(()=>setLiveAnnouncement(message));
+    }, []);
+    const sensors = core.useSensors(core.useSensor(core.PointerSensor, {
+        activationConstraint: {
+            distance: 8
+        }
+    }));
+    const contextValue = React.useMemo(()=>({
+            isInternalDragActive: activeItem !== null,
+            isMovePending
+        }), [
+        activeItem,
+        isMovePending
+    ]);
+    const handleDragStart = React.useCallback((event)=>{
+        const data = event.active.data.current;
+        setActiveItem(data ?? null);
+    }, []);
+    const handleDragEnd = React.useCallback(async (event)=>{
+        const { active, over } = event;
+        setActiveItem(null);
+        if (isMovePending || !over) {
+            return;
+        }
+        const targetFolderId = dndIds.parseFolderTargetId(over.id);
+        const activeData = active.data.current;
+        if (targetFolderId == null || !activeData) {
+            return;
+        }
+        const items = getDragItems(activeData);
+        if (!canDropItemOnFolder.canDropItemOnFolder({
+            items,
+            targetFolderId,
+            folderStructure
+        })) {
+            return;
+        }
+        const payload = buildBulkMovePayload.buildBulkMovePayload(items);
+        const successMessage = formatMessage({
+            id: translations.getTranslationKey('modal.move.success-label'),
+            defaultMessage: 'Elements have been moved successfully.'
+        });
+        const errorFallback = formatMessage({
+            id: translations.getTranslationKey('modal.move.error-label'),
+            defaultMessage: 'An error occurred while moving the elements.'
+        });
+        try {
+            await bulkMove({
+                ...payload,
+                destinationFolderId: targetFolderId
+            }).unwrap();
+            announceToLiveRegion(successMessage);
+            toggleNotification({
+                type: 'success',
+                message: successMessage
+            });
+        } catch (error) {
+            const errorMessage = getBulkMoveErrorMessage.getBulkMoveErrorMessage(error, errorFallback);
+            announceToLiveRegion(formatMessage({
+                id: translations.getTranslationKey('dnd.announce.move-failure'),
+                defaultMessage: 'Move failed. {message}'
+            }, {
+                message: errorMessage
+            }));
+            toggleNotification({
+                type: 'danger',
+                message: errorMessage
+            });
+        }
+    }, [
+        announceToLiveRegion,
+        bulkMove,
+        folderStructure,
+        formatMessage,
+        isMovePending,
+        toggleNotification
+    ]);
+    const handleDragCancel = React.useCallback(()=>{
+        setActiveItem(null);
+    }, []);
+    const announcements = React.useMemo(()=>({
+            onDragStart: ({ active })=>{
+                const data = active.data.current;
+                return data ? formatMessage({
+                    id: translations.getTranslationKey('dnd.announce.drag-start'),
+                    defaultMessage: 'Picked up {name}. Drop on a folder to move.'
+                }, {
+                    name: data.name
+                }) : '';
+            },
+            onDragOver: ()=>'',
+            onDragEnd: ({ active, over })=>{
+                if (!over) {
+                    return formatMessage({
+                        id: translations.getTranslationKey('dnd.announce.cancel'),
+                        defaultMessage: 'Drag cancelled.'
+                    });
+                }
+                const targetFolderId = dndIds.parseFolderTargetId(over.id);
+                const activeData = active.data.current;
+                if (targetFolderId == null || !activeData) {
+                    return '';
+                }
+                const items = getDragItems(activeData);
+                if (!canDropItemOnFolder.canDropItemOnFolder({
+                    items,
+                    targetFolderId,
+                    folderStructure
+                })) {
+                    return formatMessage({
+                        id: translations.getTranslationKey('dnd.announce.invalid-drop'),
+                        defaultMessage: 'Cannot move item to this folder.'
+                    });
+                }
+                return '';
+            },
+            onDragCancel: ()=>formatMessage({
+                    id: translations.getTranslationKey('dnd.announce.cancel'),
+                    defaultMessage: 'Drag cancelled.'
+                })
+        }), [
+        folderStructure,
+        formatMessage
+    ]);
+    return /*#__PURE__*/ jsxRuntime.jsx(AssetsDndContext.Provider, {
+        value: contextValue,
+        children: /*#__PURE__*/ jsxRuntime.jsxs(core.DndContext, {
+            sensors: sensors,
+            collisionDetection: core.pointerWithin,
+            onDragStart: handleDragStart,
+            onDragEnd: handleDragEnd,
+            onDragCancel: handleDragCancel,
+            accessibility: {
+                announcements
+            },
+            children: [
+                /*#__PURE__*/ jsxRuntime.jsx(designSystem.VisuallyHidden, {
+                    "aria-live": "polite",
+                    "aria-atomic": "true",
+                    children: liveAnnouncement
+                }),
+                /*#__PURE__*/ jsxRuntime.jsx(designSystem.Box, {
+                    position: "relative",
+                    children: children
+                }),
+                /*#__PURE__*/ jsxRuntime.jsx(core.DragOverlay, {
+                    dropAnimation: null,
+                    children: activeItem ? /*#__PURE__*/ jsxRuntime.jsx(DragOverlayChip.DragOverlayChip, {
+                        item: activeItem
+                    }) : null
+                })
+            ]
+        })
+    });
+}; // TODO(CMS-229): FolderTree droppables + keyboard move path.
+
+exports.AssetsDndProvider = AssetsDndProvider;
+exports.useAssetsDndOptional = useAssetsDndOptional;
+//# sourceMappingURL=AssetsDndProvider.js.map

package/dist/admin/future/pages/Assets/components/Dnd/AssetsDndProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AssetsDndProvider.js","sources":["../../../../../../../admin/src/future/pages/Assets/components/Dnd/AssetsDndProvider.tsx"],"sourcesContent":["import { createContext, useCallback, useContext, useMemo, useState, type ReactNode } from 'react';\n\nimport {\n  DndContext,\n  DragOverlay,\n  PointerSensor,\n  pointerWithin,\n  useSensor,\n  useSensors,\n  type DragEndEvent,\n  type DragStartEvent,\n} from '@dnd-kit/core';\nimport { useNotification } from '@strapi/admin/strapi-admin';\nimport { Box, VisuallyHidden } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\n\nimport { useBulkMoveMutation, useGetFolderStructureQuery } from '../../../../services/folders';\nimport { buildBulkMovePayload } from '../../../../utils/buildBulkMovePayload';\nimport { canDropItemOnFolder } from '../../../../utils/canDropItemOnFolder';\nimport { getBulkMoveErrorMessage } from '../../../../utils/getBulkMoveErrorMessage';\nimport { getTranslationKey } from '../../../../utils/translations';\n\nimport { parseFolderTargetId } from './dndIds';\nimport { DragOverlayChip } from './DragOverlayChip';\n\nimport type { DragItemData } from '../../../../types/dnd';\n\n/* -------------------------------------------------------------------------------------------------\n * Context — shared with UploadDropZoneProvider for bidirectional drag guard.\n * See UploadDropZoneContext.tsx TODO linking both providers.\n * -----------------------------------------------------------------------------------------------*/\n\ninterface AssetsDndContextValue {\n  isInternalDragActive: boolean;\n  isMovePending: boolean;\n}\n\nconst AssetsDndContext = createContext<AssetsDndContextValue | null>(null);\n\nexport const useAssetsDnd = () => {\n  const context = useContext(AssetsDndContext);\n\n  if (!context) {\n    throw new Error('useAssetsDnd must be used within AssetsDndProvider');\n  }\n\n  return context;\n};\n\nexport const useAssetsDndOptional = () => useContext(AssetsDndContext);\n\n/* -------------------------------------------------------------------------------------------------\n * Provider\n * -----------------------------------------------------------------------------------------------*/\n\ninterface AssetsDndProviderProps {\n  children: ReactNode;\n}\n\nconst getDragItems = (activeData: DragItemData | undefined): DragItemData[] => {\n  if (!activeData) {\n    return [];\n  }\n\n  // TODO(CMS-433): include selectedItems from active data for multi-drag payload members.\n  return [activeData];\n};\n\nexport const AssetsDndProvider = ({ children }: AssetsDndProviderProps) => {\n  const { formatMessage } = useIntl();\n  const { toggleNotification } = useNotification();\n  const { data: folderStructure = [] } = useGetFolderStructureQuery();\n  const [bulkMove, { isLoading: isMovePending }] = useBulkMoveMutation();\n  const [activeItem, setActiveItem] = useState<DragItemData | null>(null);\n  const [liveAnnouncement, setLiveAnnouncement] = useState('');\n\n  const announceToLiveRegion = useCallback((message: string) => {\n    setLiveAnnouncement('');\n    requestAnimationFrame(() => setLiveAnnouncement(message));\n  }, []);\n\n  const sensors = useSensors(\n    useSensor(PointerSensor, {\n      activationConstraint: { distance: 8 },\n    })\n  );\n\n  const contextValue = useMemo<AssetsDndContextValue>(\n    () => ({\n      isInternalDragActive: activeItem !== null,\n      isMovePending,\n    }),\n    [activeItem, isMovePending]\n  );\n\n  const handleDragStart = useCallback((event: DragStartEvent) => {\n    const data = event.active.data.current as DragItemData | undefined;\n    setActiveItem(data ?? null);\n  }, []);\n\n  const handleDragEnd = useCallback(\n    async (event: DragEndEvent) => {\n      const { active, over } = event;\n      setActiveItem(null);\n\n      if (isMovePending || !over) {\n        return;\n      }\n\n      const targetFolderId = parseFolderTargetId(over.id);\n      const activeData = active.data.current as DragItemData | undefined;\n\n      if (targetFolderId == null || !activeData) {\n        return;\n      }\n\n      const items = getDragItems(activeData);\n\n      if (\n        !canDropItemOnFolder({\n          items,\n          targetFolderId,\n          folderStructure,\n        })\n      ) {\n        return;\n      }\n\n      const payload = buildBulkMovePayload(items);\n      const successMessage = formatMessage({\n        id: getTranslationKey('modal.move.success-label'),\n        defaultMessage: 'Elements have been moved successfully.',\n      });\n      const errorFallback = formatMessage({\n        id: getTranslationKey('modal.move.error-label'),\n        defaultMessage: 'An error occurred while moving the elements.',\n      });\n\n      try {\n        await bulkMove({ ...payload, destinationFolderId: targetFolderId }).unwrap();\n\n        announceToLiveRegion(successMessage);\n\n        toggleNotification({\n          type: 'success',\n          message: successMessage,\n        });\n      } catch (error) {\n        const errorMessage = getBulkMoveErrorMessage(error, errorFallback);\n\n        announceToLiveRegion(\n          formatMessage(\n            {\n              id: getTranslationKey('dnd.announce.move-failure'),\n              defaultMessage: 'Move failed. {message}',\n            },\n            { message: errorMessage }\n          )\n        );\n\n        toggleNotification({\n          type: 'danger',\n          message: errorMessage,\n        });\n      }\n    },\n    [\n      announceToLiveRegion,\n      bulkMove,\n      folderStructure,\n      formatMessage,\n      isMovePending,\n      toggleNotification,\n    ]\n  );\n\n  const handleDragCancel = useCallback(() => {\n    setActiveItem(null);\n  }, []);\n\n  const announcements = useMemo(\n    () => ({\n      onDragStart: ({ active }: DragStartEvent) => {\n        const data = active.data.current as DragItemData | undefined;\n        return data\n          ? formatMessage(\n              {\n                id: getTranslationKey('dnd.announce.drag-start'),\n                defaultMessage: 'Picked up {name}. Drop on a folder to move.',\n              },\n              { name: data.name }\n            )\n          : '';\n      },\n      onDragOver: () => '',\n      onDragEnd: ({ active, over }: DragEndEvent) => {\n        if (!over) {\n          return formatMessage({\n            id: getTranslationKey('dnd.announce.cancel'),\n            defaultMessage: 'Drag cancelled.',\n          });\n        }\n\n        const targetFolderId = parseFolderTargetId(over.id);\n        const activeData = active.data.current as DragItemData | undefined;\n\n        if (targetFolderId == null || !activeData) {\n          return '';\n        }\n\n        const items = getDragItems(activeData);\n\n        if (\n          !canDropItemOnFolder({\n            items,\n            targetFolderId,\n            folderStructure,\n          })\n        ) {\n          return formatMessage({\n            id: getTranslationKey('dnd.announce.invalid-drop'),\n            defaultMessage: 'Cannot move item to this folder.',\n          });\n        }\n\n        return '';\n      },\n      onDragCancel: () =>\n        formatMessage({\n          id: getTranslationKey('dnd.announce.cancel'),\n          defaultMessage: 'Drag cancelled.',\n        }),\n    }),\n    [folderStructure, formatMessage]\n  );\n\n  return (\n    <AssetsDndContext.Provider value={contextValue}>\n      <DndContext\n        sensors={sensors}\n        collisionDetection={pointerWithin}\n        onDragStart={handleDragStart}\n        onDragEnd={handleDragEnd}\n        onDragCancel={handleDragCancel}\n        accessibility={{ announcements }}\n      >\n        <VisuallyHidden aria-live=\"polite\" aria-atomic=\"true\">\n          {liveAnnouncement}\n        </VisuallyHidden>\n        <Box position=\"relative\">{children}</Box>\n        <DragOverlay dropAnimation={null}>\n          {activeItem ? <DragOverlayChip item={activeItem} /> : null}\n        </DragOverlay>\n      </DndContext>\n    </AssetsDndContext.Provider>\n  );\n};\n\n// TODO(CMS-229): FolderTree droppables + keyboard move path.\n"],"names":["AssetsDndContext","createContext","useAssetsDndOptional","useContext","getDragItems","activeData","AssetsDndProvider","children","formatMessage","useIntl","toggleNotification","useNotification","data","folderStructure","useGetFolderStructureQuery","bulkMove","isLoading","isMovePending","useBulkMoveMutation","activeItem","setActiveItem","useState","liveAnnouncement","setLiveAnnouncement","announceToLiveRegion","useCallback","message","requestAnimationFrame","sensors","useSensors","useSensor","PointerSensor","activationConstraint","distance","contextValue","useMemo","isInternalDragActive","handleDragStart","event","active","current","handleDragEnd","over","targetFolderId","parseFolderTargetId","id","items","canDropItemOnFolder","payload","buildBulkMovePayload","successMessage","getTranslationKey","defaultMessage","errorFallback","destinationFolderId","unwrap","type","error","errorMessage","getBulkMoveErrorMessage","handleDragCancel","announcements","onDragStart","name","onDragOver","onDragEnd","onDragCancel","_jsx","Provider","value","_jsxs","DndContext","collisionDetection","pointerWithin","accessibility","VisuallyHidden","aria-live","aria-atomic","Box","position","DragOverlay","dropAnimation","DragOverlayChip","item"],"mappings":"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"}