@strapi/upload 5.51.1 → 5.52.0

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

@@ -1,9 +1,10 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useState, useEffect, useCallback, useRef, useLayoutEffect } from 'react';
-import { Typography, Box, Flex, Loader, IconButton, Tooltip } from '@strapi/design-system';
+import { SubNav } from '@strapi/admin/strapi-admin';
+import { Flex, Typography, Box, Loader, IconButton, Tooltip } from '@strapi/design-system';
 import { House, Folder, ChevronDown } from '@strapi/icons';
 import { useIntl } from 'react-intl';
-import { styled, css } from 'styled-components';
+import { css, styled } from 'styled-components';
 import { useGetFolderStructureQuery } from '../../../../services/folders.mjs';
 import { getTranslationKey } from '../../../../utils/translations.mjs';
 import { useAssetsDndOptional } from '../Dnd/AssetsDndProvider.mjs';
@@ -197,11 +198,11 @@ const RotatingChevron = styled(ChevronDown)`
   transform: rotate(${({ $expanded })=>$expanded ? '0deg' : '-90deg'});
   transition: transform 0.2s ease;
 `;
-const FolderTreeItemInner = ({ id, name, folderChildren, level, currentFolderId, isExpanded, onToggle, onExpand, onSelect, isMovePending })=>{
+const FolderTreeItemInner = ({ id, name, folderChildren, level, currentFolderId, showActiveFolder, isExpanded, onToggle, onExpand, onSelect, isMovePending })=>{
     const { formatMessage } = useIntl();
     const hasChildren = folderChildren.length > 0;
     const isFolderExpanded = isExpanded(id);
-    const isActive = currentFolderId === id;
+    const isActive = showActiveFolder && currentFolderId === id;
     const { droppable: { setNodeRef }, isOver, showValidDropHighlight, showInvalidDropCursor } = useFolderTreeDroppable({
         id,
         name
@@ -273,6 +274,7 @@ const FolderTreeItemInner = ({ id, name, folderChildren, level, currentFolderId,
                         node: child,
                         level: level + 1,
                         currentFolderId: currentFolderId,
+                        showActiveFolder: showActiveFolder,
                         isExpanded: isExpanded,
                         onToggle: onToggle,
                         onExpand: onExpand,
@@ -294,47 +296,30 @@ const FolderTreeItem = ({ node, ...props })=>{
         folderChildren: node.children ?? []
     });
 };
-/* -------------------------------------------------------------------------------------------------
- * FolderTree — public sidebar component
- * -----------------------------------------------------------------------------------------------*/ const SidebarNav = styled(Flex)`
-  /* TODO: reconcile 25.6rem (Figma) with admin WIDTH_SIDE_NAVIGATION (23.2rem) */
-  width: 25.6rem;
-  height: 100%;
-  min-height: 100%;
-  background: ${({ theme })=>theme.colors.neutral0};
-  flex-shrink: 0;
-  flex-direction: column;
-  border-right: 1px solid ${({ theme })=>theme.colors.neutral150};
-`;
-const SidebarHeader = styled(Box)`
-  flex-shrink: 0;
-  border-bottom: 1px solid ${({ theme })=>theme.colors.neutral150};
-`;
-const SidebarBody = styled(Flex)`
-  flex: 1;
-  min-height: 0;
-  overflow-y: auto;
-`;
 /**
  * Left-rail navigation for the Media Library. Fetches folder structure internally
  * and renders:
  *
  * 1. A "Media library" title
- * 2. A "Home" entry that clears the folder query param
- * 3. A "FOLDERS" section header
- * 4. The folder tree itself
+ * 2. A filter input that prunes the tree to matching destinations
+ * 3. A "Home" entry that clears the folder query param
+ * 4. A "FOLDERS" section header
+ * 5. The folder tree itself
+ *
+ * The filter is purely local: it never touches the URL and never affects the
+ * asset list, which has its own independent search in the content toolbar.
  *
  * Presentational with respect to routing — navigation is delegated to the parent
  * via `onSelectFolder` so the URL stays the single source of truth (see
  * `useFolderNavigation`).
- */ const FolderTree = ({ currentFolderId, onSelectFolder })=>{
+ */ const FolderTree = ({ currentFolderId, showActiveFolder = true, onSelectFolder })=>{
     const { formatMessage } = useIntl();
     const { data: folderStructure = [], isLoading, isError } = useGetFolderStructureQuery();
     const { isExpanded, toggleExpanded, expandFolder } = useExpandedFolders(folderStructure, currentFolderId);
     const { isMovePending } = useAssetsDndOptional() ?? {
         isMovePending: false
     };
-    const isHomeActive = currentFolderId == null;
+    const isHomeActive = showActiveFolder && currentFolderId == null;
     const homeLabel = formatMessage({
         id: getTranslationKey('sidebar.home'),
         defaultMessage: 'Home'
@@ -343,139 +328,131 @@ const SidebarBody = styled(Flex)`
         id: null,
         name: homeLabel
     });
-    return /*#__PURE__*/ jsxs(SidebarNav, {
-        direction: "column",
-        alignItems: "stretch",
-        tag: "nav",
+    return /*#__PURE__*/ jsxs(SubNav.Main, {
         "aria-label": formatMessage({
             id: getTranslationKey('sidebar.tree.aria-label'),
             defaultMessage: 'Media library folders'
         }),
         children: [
-            /*#__PURE__*/ jsx(SidebarHeader, {
-                paddingTop: 4,
-                paddingBottom: 4,
-                paddingLeft: 5,
-                paddingRight: 5,
-                children: /*#__PURE__*/ jsx(Typography, {
-                    variant: "beta",
-                    tag: "h2",
-                    children: formatMessage({
-                        id: getTranslationKey('sidebar.title'),
-                        defaultMessage: 'Media library'
-                    })
+            /*#__PURE__*/ jsx(SubNav.Header, {
+                label: formatMessage({
+                    id: getTranslationKey('sidebar.title'),
+                    defaultMessage: 'Media library'
                 })
             }),
-            /*#__PURE__*/ jsxs(SidebarBody, {
-                direction: "column",
-                alignItems: "stretch",
-                gap: 1,
-                padding: 3,
-                children: [
-                    /*#__PURE__*/ jsxs(RowButton, {
-                        ref: setHomeDropRef,
-                        type: "button",
-                        $isActive: isHomeActive,
-                        $isValidDropTarget: showHomeValidDropHighlight,
-                        $isInvalidDropCursor: showHomeInvalidDropCursor,
-                        $isMovePending: isMovePending,
-                        "aria-current": isHomeActive ? 'page' : undefined,
-                        onClick: ()=>onSelectFolder(null),
-                        "data-testid": "folder-tree-home",
-                        children: [
-                            /*#__PURE__*/ jsx(House, {
-                                "aria-hidden": true,
-                                width: "1.6rem",
-                                height: "1.6rem"
-                            }),
-                            /*#__PURE__*/ jsx(Typography, {
-                                variant: "omega",
-                                fontWeight: isHomeActive ? 'semiBold' : 'regular',
-                                children: homeLabel
-                            })
-                        ]
-                    }),
-                    /*#__PURE__*/ jsxs(Box, {
-                        marginTop: 4,
-                        children: [
-                            /*#__PURE__*/ jsxs(Flex, {
-                                alignItems: "center",
-                                gap: 1,
-                                paddingTop: 1,
-                                paddingBottom: 1,
-                                paddingLeft: 2,
-                                paddingRight: 2,
-                                marginBottom: 2,
-                                children: [
-                                    /*#__PURE__*/ jsx(Folder, {
-                                        "aria-hidden": true,
-                                        width: "1.6rem",
-                                        height: "1.6rem",
-                                        fill: "neutral500"
-                                    }),
-                                    /*#__PURE__*/ jsx(Typography, {
-                                        variant: "sigma",
-                                        textColor: "neutral600",
-                                        style: {
-                                            textTransform: 'uppercase'
-                                        },
+            /*#__PURE__*/ jsx(SubNav.Content, {
+                children: /*#__PURE__*/ jsxs(Flex, {
+                    direction: "column",
+                    alignItems: "stretch",
+                    gap: 1,
+                    padding: 3,
+                    children: [
+                        /*#__PURE__*/ jsxs(RowButton, {
+                            ref: setHomeDropRef,
+                            type: "button",
+                            $isActive: isHomeActive,
+                            $isValidDropTarget: showHomeValidDropHighlight,
+                            $isInvalidDropCursor: showHomeInvalidDropCursor,
+                            $isMovePending: isMovePending,
+                            "aria-current": isHomeActive ? 'page' : undefined,
+                            onClick: ()=>onSelectFolder(null),
+                            "data-testid": "folder-tree-home",
+                            children: [
+                                /*#__PURE__*/ jsx(House, {
+                                    "aria-hidden": true,
+                                    width: "1.6rem",
+                                    height: "1.6rem"
+                                }),
+                                /*#__PURE__*/ jsx(Typography, {
+                                    variant: "omega",
+                                    fontWeight: isHomeActive ? 'semiBold' : 'regular',
+                                    children: homeLabel
+                                })
+                            ]
+                        }),
+                        /*#__PURE__*/ jsxs(Box, {
+                            marginTop: 4,
+                            children: [
+                                /*#__PURE__*/ jsxs(Flex, {
+                                    alignItems: "center",
+                                    gap: 1,
+                                    paddingTop: 1,
+                                    paddingBottom: 1,
+                                    paddingLeft: 2,
+                                    paddingRight: 2,
+                                    marginBottom: 2,
+                                    children: [
+                                        /*#__PURE__*/ jsx(Folder, {
+                                            "aria-hidden": true,
+                                            width: "1.6rem",
+                                            height: "1.6rem",
+                                            fill: "neutral500"
+                                        }),
+                                        /*#__PURE__*/ jsx(Typography, {
+                                            variant: "sigma",
+                                            textColor: "neutral600",
+                                            style: {
+                                                textTransform: 'uppercase'
+                                            },
+                                            children: formatMessage({
+                                                id: getTranslationKey('sidebar.folders'),
+                                                defaultMessage: 'Folders'
+                                            })
+                                        })
+                                    ]
+                                }),
+                                isLoading ? // TODO: revisit loading state before revamp GA
+                                /*#__PURE__*/ jsx(Flex, {
+                                    justifyContent: "center",
+                                    padding: 1,
+                                    paddingTop: 2,
+                                    children: /*#__PURE__*/ jsx(Loader, {
                                         children: formatMessage({
-                                            id: getTranslationKey('sidebar.folders'),
-                                            defaultMessage: 'Folders'
+                                            id: getTranslationKey('sidebar.tree.loading'),
+                                            defaultMessage: 'Loading folders...'
                                         })
                                     })
-                                ]
-                            }),
-                            isLoading ? // TODO: revisit loading state before revamp GA
-                            /*#__PURE__*/ jsx(Flex, {
-                                justifyContent: "center",
-                                padding: 1,
-                                paddingTop: 2,
-                                children: /*#__PURE__*/ jsx(Loader, {
-                                    children: formatMessage({
-                                        id: getTranslationKey('sidebar.tree.loading'),
-                                        defaultMessage: 'Loading folders...'
-                                    })
-                                })
-                            }) : isError ? // TODO: revisit error state before revamp GA
-                            /*#__PURE__*/ jsx(Box, {
-                                padding: 1,
-                                paddingTop: 2,
-                                children: /*#__PURE__*/ jsx(Typography, {
-                                    variant: "pi",
-                                    textColor: "danger600",
-                                    children: formatMessage({
-                                        id: getTranslationKey('sidebar.tree.error'),
-                                        defaultMessage: 'Could not load folders.'
+                                }) : isError ? // TODO: revisit error state before revamp GA
+                                /*#__PURE__*/ jsx(Box, {
+                                    padding: 1,
+                                    paddingTop: 2,
+                                    children: /*#__PURE__*/ jsx(Typography, {
+                                        variant: "pi",
+                                        textColor: "danger600",
+                                        children: formatMessage({
+                                            id: getTranslationKey('sidebar.tree.error'),
+                                            defaultMessage: 'Could not load folders.'
+                                        })
                                     })
-                                })
-                            }) : folderStructure.length === 0 ? // TODO: revisit empty state before revamp GA
-                            /*#__PURE__*/ jsx(Box, {
-                                padding: 1,
-                                paddingTop: 2,
-                                children: /*#__PURE__*/ jsx(Typography, {
-                                    variant: "pi",
-                                    textColor: "neutral500",
-                                    children: formatMessage({
-                                        id: getTranslationKey('sidebar.tree.empty'),
-                                        defaultMessage: 'No folders yet'
+                                }) : folderStructure.length === 0 ? // TODO: revisit empty state before revamp GA
+                                /*#__PURE__*/ jsx(Box, {
+                                    padding: 1,
+                                    paddingTop: 2,
+                                    children: /*#__PURE__*/ jsx(Typography, {
+                                        variant: "pi",
+                                        textColor: "neutral500",
+                                        children: formatMessage({
+                                            id: getTranslationKey('sidebar.tree.empty'),
+                                            defaultMessage: 'No folders yet'
+                                        })
                                     })
+                                }) : /*#__PURE__*/ jsx(NavList, {
+                                    children: folderStructure.map((node)=>/*#__PURE__*/ jsx(FolderTreeItem, {
+                                            node: node,
+                                            level: 0,
+                                            currentFolderId: currentFolderId,
+                                            showActiveFolder: showActiveFolder,
+                                            isExpanded: isExpanded,
+                                            onToggle: toggleExpanded,
+                                            onExpand: expandFolder,
+                                            onSelect: onSelectFolder,
+                                            isMovePending: isMovePending
+                                        }, node.id ?? node.name))
                                 })
-                            }) : /*#__PURE__*/ jsx(NavList, {
-                                children: folderStructure.map((node)=>/*#__PURE__*/ jsx(FolderTreeItem, {
-                                        node: node,
-                                        level: 0,
-                                        currentFolderId: currentFolderId,
-                                        isExpanded: isExpanded,
-                                        onToggle: toggleExpanded,
-                                        onExpand: expandFolder,
-                                        onSelect: onSelectFolder,
-                                        isMovePending: isMovePending
-                                    }, node.id ?? node.name))
-                            })
-                        ]
-                    })
-                ]
+                            ]
+                        })
+                    ]
+                })
             })
         ]
     });

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

@@ -1 +1 @@
-{"version":3,"file":"FolderTree.mjs","sources":["../../../../../../../admin/src/future/pages/Assets/components/FolderTree/FolderTree.tsx"],"sourcesContent":["import { useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react';\n\nimport { Box, Flex, IconButton, Loader, Tooltip, Typography } from '@strapi/design-system';\nimport { ChevronDown, Folder as FolderIcon, House } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { css, styled } from 'styled-components';\n\nimport { useGetFolderStructureQuery } from '../../../../services/folders';\nimport { getTranslationKey } from '../../../../utils/translations';\nimport { useAssetsDndOptional } from '../Dnd/AssetsDndProvider';\nimport { useFolderTreeDroppable } from '../Dnd/useFolderTreeDroppable';\n\nimport { useSpringLoadedExpand } from './useSpringLoadedExpand';\n\nimport type { FolderNode } from '../../../../../../../shared/contracts/folders';\n\n/* -------------------------------------------------------------------------------------------------\n * RowButton — shared row styling aligned with admin SubNav.Link\n * -----------------------------------------------------------------------------------------------*/\n\nconst RowButton = styled.button<{\n  $isActive: boolean;\n  $isValidDropTarget?: boolean;\n  $isInvalidDropCursor?: boolean;\n  $isMovePending?: boolean;\n}>`\n  display: flex;\n  align-items: center;\n  gap: ${({ theme }) => theme.spaces[2]};\n  width: 100%;\n  min-height: 3.2rem;\n  padding: ${({ theme }) => `${theme.spaces[1]} ${theme.spaces[2]}`};\n  border: 0;\n  background: ${({ $isActive, $isValidDropTarget, theme }) => {\n    if ($isValidDropTarget) {\n      return theme.colors.primary100;\n    }\n\n    return $isActive ? theme.colors.primary100 : 'transparent';\n  }};\n  color: ${({ $isActive, theme }) =>\n    $isActive ? theme.colors.primary700 : theme.colors.neutral800};\n  border-radius: ${({ theme }) => theme.borderRadius};\n  cursor: ${({ $isMovePending, $isInvalidDropCursor }) => {\n    if ($isMovePending) {\n      return 'wait';\n    }\n\n    return $isInvalidDropCursor ? 'not-allowed' : 'pointer';\n  }};\n  text-align: left;\n  font: inherit;\n  pointer-events: ${({ $isMovePending }) => ($isMovePending ? 'none' : 'auto')};\n\n  ${({ $isValidDropTarget, theme }) =>\n    $isValidDropTarget &&\n    css`\n      outline: 1px dashed ${theme.colors.primary600};\n      outline-offset: -1px;\n    `}\n\n  &:hover {\n    background: ${({ $isActive, $isValidDropTarget, theme }) => {\n      if ($isValidDropTarget) {\n        return theme.colors.primary100;\n      }\n\n      return $isActive ? theme.colors.primary100 : theme.colors.neutral100;\n    }};\n  }\n\n  &:focus-visible {\n    outline: 2px solid ${({ theme }) => theme.colors.primary600};\n    outline-offset: -2px;\n  }\n`;\n\nconst TreeRow = styled(Flex)<{\n  $isValidDropTarget?: boolean;\n  $isInvalidDropCursor?: boolean;\n  $isMovePending?: boolean;\n}>`\n  cursor: ${({ $isMovePending, $isInvalidDropCursor }) => {\n    if ($isMovePending) {\n      return 'wait';\n    }\n\n    return $isInvalidDropCursor ? 'not-allowed' : 'default';\n  }};\n  pointer-events: ${({ $isMovePending }) => ($isMovePending ? 'none' : 'auto')};\n  border-radius: ${({ theme }) => theme.borderRadius};\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\n/* -------------------------------------------------------------------------------------------------\n * useExpandedFolders — local expand/collapse state\n * -----------------------------------------------------------------------------------------------*/\n\nconst findAncestorIds = (\n  nodes: FolderNode[],\n  targetId: number,\n  trail: number[] = []\n): number[] | null => {\n  for (const node of nodes) {\n    if (node.id === targetId) {\n      return trail;\n    }\n\n    if (node.children?.length) {\n      const nextTrail = node.id != null ? [...trail, node.id] : trail;\n      const found = findAncestorIds(node.children, targetId, nextTrail);\n      if (found !== null) {\n        return found;\n      }\n    }\n  }\n\n  return null;\n};\n\nconst useExpandedFolders = (folderStructure: FolderNode[], currentFolderId: number | null) => {\n  const [expandedIds, setExpandedIds] = useState<Set<number>>(() => new Set());\n\n  useEffect(() => {\n    if (currentFolderId == null) {\n      return;\n    }\n\n    const ancestors = findAncestorIds(folderStructure, currentFolderId);\n    if (!ancestors || ancestors.length === 0) {\n      return;\n    }\n\n    setExpandedIds((prev) => {\n      const next = new Set(prev);\n      let changed = false;\n      for (const id of ancestors) {\n        if (!next.has(id)) {\n          next.add(id);\n          changed = true;\n        }\n      }\n      return changed ? next : prev;\n    });\n  }, [folderStructure, currentFolderId]);\n\n  const toggleExpanded = useCallback((id: number) => {\n    setExpandedIds((prev) => {\n      const next = new Set(prev);\n      if (next.has(id)) {\n        next.delete(id);\n      } else {\n        next.add(id);\n      }\n      return next;\n    });\n  }, []);\n\n  const expandFolder = useCallback((id: number) => {\n    setExpandedIds((prev) => {\n      if (prev.has(id)) {\n        return prev;\n      }\n\n      const next = new Set(prev);\n      next.add(id);\n      return next;\n    });\n  }, []);\n\n  const isExpanded = useCallback((id: number) => expandedIds.has(id), [expandedIds]);\n\n  return { isExpanded, toggleExpanded, expandFolder };\n};\n\n/* -------------------------------------------------------------------------------------------------\n * TruncatedFolderName — tooltip when the label is ellipsized\n * -----------------------------------------------------------------------------------------------*/\n\nconst TruncatedFolderName = ({ name, isActive }: { name: string; isActive: boolean }) => {\n  const textRef = useRef<HTMLSpanElement>(null);\n  const [isTruncated, setIsTruncated] = useState(false);\n\n  useLayoutEffect(() => {\n    const el = textRef.current;\n    if (!el) {\n      return;\n    }\n\n    const checkTruncation = () => {\n      setIsTruncated(el.scrollWidth > el.clientWidth);\n    };\n\n    checkTruncation();\n\n    const observer = new ResizeObserver(checkTruncation);\n    observer.observe(el);\n\n    return () => observer.disconnect();\n  }, [name]);\n\n  const label = (\n    <Typography\n      ref={textRef}\n      variant=\"omega\"\n      fontWeight={isActive ? 'semiBold' : 'regular'}\n      ellipsis\n    >\n      {name}\n    </Typography>\n  );\n\n  if (isTruncated) {\n    return <Tooltip label={name}>{label}</Tooltip>;\n  }\n\n  return label;\n};\n\n/* -------------------------------------------------------------------------------------------------\n * NavList — unstyled list for tree rows\n * -----------------------------------------------------------------------------------------------*/\n\nconst NavList = styled.ul`\n  list-style: none;\n  margin: 0;\n  padding: 0;\n`;\n\n/* -------------------------------------------------------------------------------------------------\n * FolderTreeItem — single tree row (internal)\n * -----------------------------------------------------------------------------------------------*/\n\nconst INDENT_PER_LEVEL_REM = 1.6;\n\nconst RotatingChevron = styled(ChevronDown)<{ $expanded: boolean }>`\n  transform: rotate(${({ $expanded }) => ($expanded ? '0deg' : '-90deg')});\n  transition: transform 0.2s ease;\n`;\n\ninterface FolderTreeItemProps {\n  node: FolderNode;\n  level: number;\n  currentFolderId: number | null;\n  isExpanded: (id: number) => boolean;\n  onToggle: (id: number) => void;\n  onExpand: (id: number) => void;\n  onSelect: (folderId: number) => void;\n  isMovePending: boolean;\n}\n\ninterface FolderTreeItemInnerProps extends Omit<FolderTreeItemProps, 'node'> {\n  id: number;\n  name: string;\n  folderChildren: FolderNode[];\n}\n\nconst FolderTreeItemInner = ({\n  id,\n  name,\n  folderChildren,\n  level,\n  currentFolderId,\n  isExpanded,\n  onToggle,\n  onExpand,\n  onSelect,\n  isMovePending,\n}: FolderTreeItemInnerProps) => {\n  const { formatMessage } = useIntl();\n  const hasChildren = folderChildren.length > 0;\n  const isFolderExpanded = isExpanded(id);\n  const isActive = currentFolderId === id;\n\n  const {\n    droppable: { setNodeRef },\n    isOver,\n    showValidDropHighlight,\n    showInvalidDropCursor,\n  } = useFolderTreeDroppable({ id, name });\n\n  const handleExpand = useCallback(() => onExpand(id), [id, onExpand]);\n\n  useSpringLoadedExpand({\n    isOver,\n    canExpand: hasChildren && !isFolderExpanded,\n    onExpand: handleExpand,\n  });\n\n  // TODO: full `role=\"tree\"` + arrow-key treeview navigation before revamp GA\n  // if an accessibility audit requires it (v1 is button rows only).\n  return (\n    <li>\n      <TreeRow\n        ref={setNodeRef}\n        alignItems=\"center\"\n        paddingLeft={`${level * INDENT_PER_LEVEL_REM}rem`}\n        gap={1}\n        $isValidDropTarget={showValidDropHighlight}\n        $isInvalidDropCursor={showInvalidDropCursor}\n        $isMovePending={isMovePending}\n      >\n        <IconButton\n          label={formatMessage(\n            {\n              id: getTranslationKey(\n                isFolderExpanded ? 'sidebar.tree.collapse' : 'sidebar.tree.expand'\n              ),\n              defaultMessage: isFolderExpanded ? 'Collapse {name}' : 'Expand {name}',\n            },\n            { name }\n          )}\n          onClick={(event: React.MouseEvent) => {\n            event.stopPropagation();\n            onToggle(id);\n          }}\n          variant=\"ghost\"\n          withTooltip={false}\n          aria-expanded={isFolderExpanded}\n        >\n          <RotatingChevron $expanded={isFolderExpanded} fill=\"neutral500\" />\n        </IconButton>\n\n        <Box flex=\"1\" minWidth={0}>\n          <RowButton\n            type=\"button\"\n            $isActive={isActive}\n            $isValidDropTarget={showValidDropHighlight}\n            $isInvalidDropCursor={showInvalidDropCursor}\n            $isMovePending={isMovePending}\n            aria-current={isActive ? 'page' : undefined}\n            onClick={() => onSelect(id)}\n            data-testid={`folder-tree-node-${id}`}\n            data-folder-id={id}\n          >\n            <TruncatedFolderName name={name} isActive={isActive} />\n          </RowButton>\n        </Box>\n      </TreeRow>\n\n      {hasChildren && isFolderExpanded && (\n        <NavList>\n          {folderChildren.map((child) => (\n            <FolderTreeItem\n              key={child.id ?? child.name}\n              node={child}\n              level={level + 1}\n              currentFolderId={currentFolderId}\n              isExpanded={isExpanded}\n              onToggle={onToggle}\n              onExpand={onExpand}\n              onSelect={onSelect}\n              isMovePending={isMovePending}\n            />\n          ))}\n        </NavList>\n      )}\n    </li>\n  );\n};\n\nconst FolderTreeItem = ({ node, ...props }: FolderTreeItemProps) => {\n  if (node.id == null) {\n    return null;\n  }\n\n  return (\n    <FolderTreeItemInner\n      {...props}\n      id={node.id}\n      name={node.name ?? ''}\n      folderChildren={node.children ?? []}\n    />\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * FolderTree — public sidebar component\n * -----------------------------------------------------------------------------------------------*/\n\nconst SidebarNav = styled(Flex)`\n  /* TODO: reconcile 25.6rem (Figma) with admin WIDTH_SIDE_NAVIGATION (23.2rem) */\n  width: 25.6rem;\n  height: 100%;\n  min-height: 100%;\n  background: ${({ theme }) => theme.colors.neutral0};\n  flex-shrink: 0;\n  flex-direction: column;\n  border-right: 1px solid ${({ theme }) => theme.colors.neutral150};\n`;\n\nconst SidebarHeader = styled(Box)`\n  flex-shrink: 0;\n  border-bottom: 1px solid ${({ theme }) => theme.colors.neutral150};\n`;\n\nconst SidebarBody = styled(Flex)`\n  flex: 1;\n  min-height: 0;\n  overflow-y: auto;\n`;\n\ninterface FolderTreeProps {\n  currentFolderId: number | null;\n  onSelectFolder: (folderId: number | null) => void;\n}\n\n/**\n * Left-rail navigation for the Media Library. Fetches folder structure internally\n * and renders:\n *\n * 1. A \"Media library\" title\n * 2. A \"Home\" entry that clears the folder query param\n * 3. A \"FOLDERS\" section header\n * 4. The folder tree itself\n *\n * Presentational with respect to routing — navigation is delegated to the parent\n * via `onSelectFolder` so the URL stays the single source of truth (see\n * `useFolderNavigation`).\n */\nexport const FolderTree = ({ currentFolderId, onSelectFolder }: FolderTreeProps) => {\n  const { formatMessage } = useIntl();\n  const { data: folderStructure = [], isLoading, isError } = useGetFolderStructureQuery();\n  const { isExpanded, toggleExpanded, expandFolder } = useExpandedFolders(\n    folderStructure,\n    currentFolderId\n  );\n  const { isMovePending } = useAssetsDndOptional() ?? { isMovePending: false };\n\n  const isHomeActive = currentFolderId == null;\n  const homeLabel = formatMessage({\n    id: getTranslationKey('sidebar.home'),\n    defaultMessage: 'Home',\n  });\n\n  const {\n    droppable: { setNodeRef: setHomeDropRef },\n    showValidDropHighlight: showHomeValidDropHighlight,\n    showInvalidDropCursor: showHomeInvalidDropCursor,\n  } = useFolderTreeDroppable({ id: null, name: homeLabel });\n\n  return (\n    <SidebarNav\n      direction=\"column\"\n      alignItems=\"stretch\"\n      tag=\"nav\"\n      aria-label={formatMessage({\n        id: getTranslationKey('sidebar.tree.aria-label'),\n        defaultMessage: 'Media library folders',\n      })}\n    >\n      <SidebarHeader paddingTop={4} paddingBottom={4} paddingLeft={5} paddingRight={5}>\n        <Typography variant=\"beta\" tag=\"h2\">\n          {formatMessage({\n            id: getTranslationKey('sidebar.title'),\n            defaultMessage: 'Media library',\n          })}\n        </Typography>\n      </SidebarHeader>\n\n      <SidebarBody direction=\"column\" alignItems=\"stretch\" gap={1} padding={3}>\n        <RowButton\n          ref={setHomeDropRef}\n          type=\"button\"\n          $isActive={isHomeActive}\n          $isValidDropTarget={showHomeValidDropHighlight}\n          $isInvalidDropCursor={showHomeInvalidDropCursor}\n          $isMovePending={isMovePending}\n          aria-current={isHomeActive ? 'page' : undefined}\n          onClick={() => onSelectFolder(null)}\n          data-testid=\"folder-tree-home\"\n        >\n          <House aria-hidden width=\"1.6rem\" height=\"1.6rem\" />\n          <Typography variant=\"omega\" fontWeight={isHomeActive ? 'semiBold' : 'regular'}>\n            {homeLabel}\n          </Typography>\n        </RowButton>\n\n        <Box marginTop={4}>\n          <Flex\n            alignItems=\"center\"\n            gap={1}\n            paddingTop={1}\n            paddingBottom={1}\n            paddingLeft={2}\n            paddingRight={2}\n            marginBottom={2}\n          >\n            <FolderIcon aria-hidden width=\"1.6rem\" height=\"1.6rem\" fill=\"neutral500\" />\n            <Typography\n              variant=\"sigma\"\n              textColor=\"neutral600\"\n              style={{ textTransform: 'uppercase' }}\n            >\n              {formatMessage({\n                id: getTranslationKey('sidebar.folders'),\n                defaultMessage: 'Folders',\n              })}\n            </Typography>\n          </Flex>\n\n          {isLoading ? (\n            // TODO: revisit loading state before revamp GA\n            <Flex justifyContent=\"center\" padding={1} paddingTop={2}>\n              <Loader>\n                {formatMessage({\n                  id: getTranslationKey('sidebar.tree.loading'),\n                  defaultMessage: 'Loading folders...',\n                })}\n              </Loader>\n            </Flex>\n          ) : isError ? (\n            // TODO: revisit error state before revamp GA\n            <Box padding={1} paddingTop={2}>\n              <Typography variant=\"pi\" textColor=\"danger600\">\n                {formatMessage({\n                  id: getTranslationKey('sidebar.tree.error'),\n                  defaultMessage: 'Could not load folders.',\n                })}\n              </Typography>\n            </Box>\n          ) : folderStructure.length === 0 ? (\n            // TODO: revisit empty state before revamp GA\n            <Box padding={1} paddingTop={2}>\n              <Typography variant=\"pi\" textColor=\"neutral500\">\n                {formatMessage({\n                  id: getTranslationKey('sidebar.tree.empty'),\n                  defaultMessage: 'No folders yet',\n                })}\n              </Typography>\n            </Box>\n          ) : (\n            <NavList>\n              {folderStructure.map((node) => (\n                <FolderTreeItem\n                  key={node.id ?? node.name}\n                  node={node}\n                  level={0}\n                  currentFolderId={currentFolderId}\n                  isExpanded={isExpanded}\n                  onToggle={toggleExpanded}\n                  onExpand={expandFolder}\n                  onSelect={onSelectFolder}\n                  isMovePending={isMovePending}\n                />\n              ))}\n            </NavList>\n          )}\n        </Box>\n      </SidebarBody>\n    </SidebarNav>\n  );\n};\n"],"names":["RowButton","styled","button","theme","spaces","$isActive","$isValidDropTarget","colors","primary100","primary700","neutral800","borderRadius","$isMovePending","$isInvalidDropCursor","css","primary600","neutral100","TreeRow","Flex","findAncestorIds","nodes","targetId","trail","node","id","children","length","nextTrail","found","useExpandedFolders","folderStructure","currentFolderId","expandedIds","setExpandedIds","useState","Set","useEffect","ancestors","prev","next","changed","has","add","toggleExpanded","useCallback","delete","expandFolder","isExpanded","TruncatedFolderName","name","isActive","textRef","useRef","isTruncated","setIsTruncated","useLayoutEffect","el","current","checkTruncation","scrollWidth","clientWidth","observer","ResizeObserver","observe","disconnect","label","_jsx","Typography","ref","variant","fontWeight","ellipsis","Tooltip","NavList","ul","INDENT_PER_LEVEL_REM","RotatingChevron","ChevronDown","$expanded","FolderTreeItemInner","folderChildren","level","onToggle","onExpand","onSelect","isMovePending","formatMessage","useIntl","hasChildren","isFolderExpanded","droppable","setNodeRef","isOver","showValidDropHighlight","showInvalidDropCursor","useFolderTreeDroppable","handleExpand","useSpringLoadedExpand","canExpand","_jsxs","li","alignItems","paddingLeft","gap","IconButton","getTranslationKey","defaultMessage","onClick","event","stopPropagation","withTooltip","aria-expanded","fill","Box","flex","minWidth","type","aria-current","undefined","data-testid","data-folder-id","map","child","FolderTreeItem","props","SidebarNav","neutral0","neutral150","SidebarHeader","SidebarBody","FolderTree","onSelectFolder","data","isLoading","isError","useGetFolderStructureQuery","useAssetsDndOptional","isHomeActive","homeLabel","setHomeDropRef","showHomeValidDropHighlight","showHomeInvalidDropCursor","direction","tag","aria-label","paddingTop","paddingBottom","paddingRight","padding","House","aria-hidden","width","height","marginTop","marginBottom","FolderIcon","textColor","style","textTransform","justifyContent","Loader"],"mappings":"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"}
+{"version":3,"file":"FolderTree.mjs","sources":["../../../../../../../admin/src/future/pages/Assets/components/FolderTree/FolderTree.tsx"],"sourcesContent":["import { useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react';\n\nimport { SubNav } from '@strapi/admin/strapi-admin';\nimport { Box, Flex, IconButton, Loader, Tooltip, Typography } from '@strapi/design-system';\nimport { ChevronDown, Folder as FolderIcon, House } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { css, styled } from 'styled-components';\n\nimport { useGetFolderStructureQuery } from '../../../../services/folders';\nimport { getTranslationKey } from '../../../../utils/translations';\nimport { useAssetsDndOptional } from '../Dnd/AssetsDndProvider';\nimport { useFolderTreeDroppable } from '../Dnd/useFolderTreeDroppable';\n\nimport { useSpringLoadedExpand } from './useSpringLoadedExpand';\n\nimport type { FolderNode } from '../../../../../../../shared/contracts/folders';\n\n/* -------------------------------------------------------------------------------------------------\n * RowButton — shared row styling aligned with admin SubNav.Link\n * -----------------------------------------------------------------------------------------------*/\n\nconst RowButton = styled.button<{\n  $isActive: boolean;\n  $isValidDropTarget?: boolean;\n  $isInvalidDropCursor?: boolean;\n  $isMovePending?: boolean;\n}>`\n  display: flex;\n  align-items: center;\n  gap: ${({ theme }) => theme.spaces[2]};\n  width: 100%;\n  min-height: 3.2rem;\n  padding: ${({ theme }) => `${theme.spaces[1]} ${theme.spaces[2]}`};\n  border: 0;\n  background: ${({ $isActive, $isValidDropTarget, theme }) => {\n    if ($isValidDropTarget) {\n      return theme.colors.primary100;\n    }\n\n    return $isActive ? theme.colors.primary100 : 'transparent';\n  }};\n  color: ${({ $isActive, theme }) =>\n    $isActive ? theme.colors.primary700 : theme.colors.neutral800};\n  border-radius: ${({ theme }) => theme.borderRadius};\n  cursor: ${({ $isMovePending, $isInvalidDropCursor }) => {\n    if ($isMovePending) {\n      return 'wait';\n    }\n\n    return $isInvalidDropCursor ? 'not-allowed' : 'pointer';\n  }};\n  text-align: left;\n  font: inherit;\n  pointer-events: ${({ $isMovePending }) => ($isMovePending ? 'none' : 'auto')};\n\n  ${({ $isValidDropTarget, theme }) =>\n    $isValidDropTarget &&\n    css`\n      outline: 1px dashed ${theme.colors.primary600};\n      outline-offset: -1px;\n    `}\n\n  &:hover {\n    background: ${({ $isActive, $isValidDropTarget, theme }) => {\n      if ($isValidDropTarget) {\n        return theme.colors.primary100;\n      }\n\n      return $isActive ? theme.colors.primary100 : theme.colors.neutral100;\n    }};\n  }\n\n  &:focus-visible {\n    outline: 2px solid ${({ theme }) => theme.colors.primary600};\n    outline-offset: -2px;\n  }\n`;\n\nconst TreeRow = styled(Flex)<{\n  $isValidDropTarget?: boolean;\n  $isInvalidDropCursor?: boolean;\n  $isMovePending?: boolean;\n}>`\n  cursor: ${({ $isMovePending, $isInvalidDropCursor }) => {\n    if ($isMovePending) {\n      return 'wait';\n    }\n\n    return $isInvalidDropCursor ? 'not-allowed' : 'default';\n  }};\n  pointer-events: ${({ $isMovePending }) => ($isMovePending ? 'none' : 'auto')};\n  border-radius: ${({ theme }) => theme.borderRadius};\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\n/* -------------------------------------------------------------------------------------------------\n * useExpandedFolders — local expand/collapse state\n * -----------------------------------------------------------------------------------------------*/\n\nconst findAncestorIds = (\n  nodes: FolderNode[],\n  targetId: number,\n  trail: number[] = []\n): number[] | null => {\n  for (const node of nodes) {\n    if (node.id === targetId) {\n      return trail;\n    }\n\n    if (node.children?.length) {\n      const nextTrail = node.id != null ? [...trail, node.id] : trail;\n      const found = findAncestorIds(node.children, targetId, nextTrail);\n      if (found !== null) {\n        return found;\n      }\n    }\n  }\n\n  return null;\n};\n\nconst useExpandedFolders = (folderStructure: FolderNode[], currentFolderId: number | null) => {\n  const [expandedIds, setExpandedIds] = useState<Set<number>>(() => new Set());\n\n  useEffect(() => {\n    if (currentFolderId == null) {\n      return;\n    }\n\n    const ancestors = findAncestorIds(folderStructure, currentFolderId);\n    if (!ancestors || ancestors.length === 0) {\n      return;\n    }\n\n    setExpandedIds((prev) => {\n      const next = new Set(prev);\n      let changed = false;\n      for (const id of ancestors) {\n        if (!next.has(id)) {\n          next.add(id);\n          changed = true;\n        }\n      }\n      return changed ? next : prev;\n    });\n  }, [folderStructure, currentFolderId]);\n\n  const toggleExpanded = useCallback((id: number) => {\n    setExpandedIds((prev) => {\n      const next = new Set(prev);\n      if (next.has(id)) {\n        next.delete(id);\n      } else {\n        next.add(id);\n      }\n      return next;\n    });\n  }, []);\n\n  const expandFolder = useCallback((id: number) => {\n    setExpandedIds((prev) => {\n      if (prev.has(id)) {\n        return prev;\n      }\n\n      const next = new Set(prev);\n      next.add(id);\n      return next;\n    });\n  }, []);\n\n  const isExpanded = useCallback((id: number) => expandedIds.has(id), [expandedIds]);\n\n  return { isExpanded, toggleExpanded, expandFolder };\n};\n\n/* -------------------------------------------------------------------------------------------------\n * TruncatedFolderName — tooltip when the label is ellipsized\n * -----------------------------------------------------------------------------------------------*/\n\nconst TruncatedFolderName = ({ name, isActive }: { name: string; isActive: boolean }) => {\n  const textRef = useRef<HTMLSpanElement>(null);\n  const [isTruncated, setIsTruncated] = useState(false);\n\n  useLayoutEffect(() => {\n    const el = textRef.current;\n    if (!el) {\n      return;\n    }\n\n    const checkTruncation = () => {\n      setIsTruncated(el.scrollWidth > el.clientWidth);\n    };\n\n    checkTruncation();\n\n    const observer = new ResizeObserver(checkTruncation);\n    observer.observe(el);\n\n    return () => observer.disconnect();\n  }, [name]);\n\n  const label = (\n    <Typography\n      ref={textRef}\n      variant=\"omega\"\n      fontWeight={isActive ? 'semiBold' : 'regular'}\n      ellipsis\n    >\n      {name}\n    </Typography>\n  );\n\n  if (isTruncated) {\n    return <Tooltip label={name}>{label}</Tooltip>;\n  }\n\n  return label;\n};\n\n/* -------------------------------------------------------------------------------------------------\n * NavList — unstyled list for tree rows\n * -----------------------------------------------------------------------------------------------*/\n\nconst NavList = styled.ul`\n  list-style: none;\n  margin: 0;\n  padding: 0;\n`;\n\n/* -------------------------------------------------------------------------------------------------\n * FolderTreeItem — single tree row (internal)\n * -----------------------------------------------------------------------------------------------*/\n\nconst INDENT_PER_LEVEL_REM = 1.6;\n\nconst RotatingChevron = styled(ChevronDown)<{ $expanded: boolean }>`\n  transform: rotate(${({ $expanded }) => ($expanded ? '0deg' : '-90deg')});\n  transition: transform 0.2s ease;\n`;\n\ninterface FolderTreeItemProps {\n  node: FolderNode;\n  level: number;\n  currentFolderId: number | null;\n  showActiveFolder: boolean;\n  isExpanded: (id: number) => boolean;\n  onToggle: (id: number) => void;\n  onExpand: (id: number) => void;\n  onSelect: (folderId: number) => void;\n  isMovePending: boolean;\n}\n\ninterface FolderTreeItemInnerProps extends Omit<FolderTreeItemProps, 'node'> {\n  id: number;\n  name: string;\n  folderChildren: FolderNode[];\n}\n\nconst FolderTreeItemInner = ({\n  id,\n  name,\n  folderChildren,\n  level,\n  currentFolderId,\n  showActiveFolder,\n  isExpanded,\n  onToggle,\n  onExpand,\n  onSelect,\n  isMovePending,\n}: FolderTreeItemInnerProps) => {\n  const { formatMessage } = useIntl();\n  const hasChildren = folderChildren.length > 0;\n  const isFolderExpanded = isExpanded(id);\n  const isActive = showActiveFolder && currentFolderId === id;\n\n  const {\n    droppable: { setNodeRef },\n    isOver,\n    showValidDropHighlight,\n    showInvalidDropCursor,\n  } = useFolderTreeDroppable({ id, name });\n\n  const handleExpand = useCallback(() => onExpand(id), [id, onExpand]);\n\n  useSpringLoadedExpand({\n    isOver,\n    canExpand: hasChildren && !isFolderExpanded,\n    onExpand: handleExpand,\n  });\n\n  // TODO: full `role=\"tree\"` + arrow-key treeview navigation before revamp GA\n  // if an accessibility audit requires it (v1 is button rows only).\n  return (\n    <li>\n      <TreeRow\n        ref={setNodeRef}\n        alignItems=\"center\"\n        paddingLeft={`${level * INDENT_PER_LEVEL_REM}rem`}\n        gap={1}\n        $isValidDropTarget={showValidDropHighlight}\n        $isInvalidDropCursor={showInvalidDropCursor}\n        $isMovePending={isMovePending}\n      >\n        <IconButton\n          label={formatMessage(\n            {\n              id: getTranslationKey(\n                isFolderExpanded ? 'sidebar.tree.collapse' : 'sidebar.tree.expand'\n              ),\n              defaultMessage: isFolderExpanded ? 'Collapse {name}' : 'Expand {name}',\n            },\n            { name }\n          )}\n          onClick={(event: React.MouseEvent) => {\n            event.stopPropagation();\n            onToggle(id);\n          }}\n          variant=\"ghost\"\n          withTooltip={false}\n          aria-expanded={isFolderExpanded}\n        >\n          <RotatingChevron $expanded={isFolderExpanded} fill=\"neutral500\" />\n        </IconButton>\n\n        <Box flex=\"1\" minWidth={0}>\n          <RowButton\n            type=\"button\"\n            $isActive={isActive}\n            $isValidDropTarget={showValidDropHighlight}\n            $isInvalidDropCursor={showInvalidDropCursor}\n            $isMovePending={isMovePending}\n            aria-current={isActive ? 'page' : undefined}\n            onClick={() => onSelect(id)}\n            data-testid={`folder-tree-node-${id}`}\n            data-folder-id={id}\n          >\n            <TruncatedFolderName name={name} isActive={isActive} />\n          </RowButton>\n        </Box>\n      </TreeRow>\n\n      {hasChildren && isFolderExpanded && (\n        <NavList>\n          {folderChildren.map((child) => (\n            <FolderTreeItem\n              key={child.id ?? child.name}\n              node={child}\n              level={level + 1}\n              currentFolderId={currentFolderId}\n              showActiveFolder={showActiveFolder}\n              isExpanded={isExpanded}\n              onToggle={onToggle}\n              onExpand={onExpand}\n              onSelect={onSelect}\n              isMovePending={isMovePending}\n            />\n          ))}\n        </NavList>\n      )}\n    </li>\n  );\n};\n\nconst FolderTreeItem = ({ node, ...props }: FolderTreeItemProps) => {\n  if (node.id == null) {\n    return null;\n  }\n\n  return (\n    <FolderTreeItemInner\n      {...props}\n      id={node.id}\n      name={node.name ?? ''}\n      folderChildren={node.children ?? []}\n    />\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * FolderTree — public sidebar component\n * -----------------------------------------------------------------------------------------------*/\n\ninterface FolderTreeProps {\n  currentFolderId: number | null;\n  /**\n   * Set to `false` while a global asset search is active: the results span the\n   * whole library, so highlighting one folder would misrepresent them.\n   * */\n  showActiveFolder?: boolean;\n  onSelectFolder: (folderId: number | null) => void;\n}\n\n/**\n * Left-rail navigation for the Media Library. Fetches folder structure internally\n * and renders:\n *\n * 1. A \"Media library\" title\n * 2. A filter input that prunes the tree to matching destinations\n * 3. A \"Home\" entry that clears the folder query param\n * 4. A \"FOLDERS\" section header\n * 5. The folder tree itself\n *\n * The filter is purely local: it never touches the URL and never affects the\n * asset list, which has its own independent search in the content toolbar.\n *\n * Presentational with respect to routing — navigation is delegated to the parent\n * via `onSelectFolder` so the URL stays the single source of truth (see\n * `useFolderNavigation`).\n */\nexport const FolderTree = ({\n  currentFolderId,\n  showActiveFolder = true,\n  onSelectFolder,\n}: FolderTreeProps) => {\n  const { formatMessage } = useIntl();\n  const { data: folderStructure = [], isLoading, isError } = useGetFolderStructureQuery();\n  const { isExpanded, toggleExpanded, expandFolder } = useExpandedFolders(\n    folderStructure,\n    currentFolderId\n  );\n  const { isMovePending } = useAssetsDndOptional() ?? { isMovePending: false };\n\n  const isHomeActive = showActiveFolder && currentFolderId == null;\n  const homeLabel = formatMessage({\n    id: getTranslationKey('sidebar.home'),\n    defaultMessage: 'Home',\n  });\n\n  const {\n    droppable: { setNodeRef: setHomeDropRef },\n    showValidDropHighlight: showHomeValidDropHighlight,\n    showInvalidDropCursor: showHomeInvalidDropCursor,\n  } = useFolderTreeDroppable({ id: null, name: homeLabel });\n\n  return (\n    <SubNav.Main\n      aria-label={formatMessage({\n        id: getTranslationKey('sidebar.tree.aria-label'),\n        defaultMessage: 'Media library folders',\n      })}\n    >\n      <SubNav.Header\n        label={formatMessage({\n          id: getTranslationKey('sidebar.title'),\n          defaultMessage: 'Media library',\n        })}\n      />\n\n      <SubNav.Content>\n        <Flex direction=\"column\" alignItems=\"stretch\" gap={1} padding={3}>\n          <RowButton\n            ref={setHomeDropRef}\n            type=\"button\"\n            $isActive={isHomeActive}\n            $isValidDropTarget={showHomeValidDropHighlight}\n            $isInvalidDropCursor={showHomeInvalidDropCursor}\n            $isMovePending={isMovePending}\n            aria-current={isHomeActive ? 'page' : undefined}\n            onClick={() => onSelectFolder(null)}\n            data-testid=\"folder-tree-home\"\n          >\n            <House aria-hidden width=\"1.6rem\" height=\"1.6rem\" />\n            <Typography variant=\"omega\" fontWeight={isHomeActive ? 'semiBold' : 'regular'}>\n              {homeLabel}\n            </Typography>\n          </RowButton>\n\n          <Box marginTop={4}>\n            <Flex\n              alignItems=\"center\"\n              gap={1}\n              paddingTop={1}\n              paddingBottom={1}\n              paddingLeft={2}\n              paddingRight={2}\n              marginBottom={2}\n            >\n              <FolderIcon aria-hidden width=\"1.6rem\" height=\"1.6rem\" fill=\"neutral500\" />\n              <Typography\n                variant=\"sigma\"\n                textColor=\"neutral600\"\n                style={{ textTransform: 'uppercase' }}\n              >\n                {formatMessage({\n                  id: getTranslationKey('sidebar.folders'),\n                  defaultMessage: 'Folders',\n                })}\n              </Typography>\n            </Flex>\n\n            {isLoading ? (\n              // TODO: revisit loading state before revamp GA\n              <Flex justifyContent=\"center\" padding={1} paddingTop={2}>\n                <Loader>\n                  {formatMessage({\n                    id: getTranslationKey('sidebar.tree.loading'),\n                    defaultMessage: 'Loading folders...',\n                  })}\n                </Loader>\n              </Flex>\n            ) : isError ? (\n              // TODO: revisit error state before revamp GA\n              <Box padding={1} paddingTop={2}>\n                <Typography variant=\"pi\" textColor=\"danger600\">\n                  {formatMessage({\n                    id: getTranslationKey('sidebar.tree.error'),\n                    defaultMessage: 'Could not load folders.',\n                  })}\n                </Typography>\n              </Box>\n            ) : folderStructure.length === 0 ? (\n              // TODO: revisit empty state before revamp GA\n              <Box padding={1} paddingTop={2}>\n                <Typography variant=\"pi\" textColor=\"neutral500\">\n                  {formatMessage({\n                    id: getTranslationKey('sidebar.tree.empty'),\n                    defaultMessage: 'No folders yet',\n                  })}\n                </Typography>\n              </Box>\n            ) : (\n              <NavList>\n                {folderStructure.map((node) => (\n                  <FolderTreeItem\n                    key={node.id ?? node.name}\n                    node={node}\n                    level={0}\n                    currentFolderId={currentFolderId}\n                    showActiveFolder={showActiveFolder}\n                    isExpanded={isExpanded}\n                    onToggle={toggleExpanded}\n                    onExpand={expandFolder}\n                    onSelect={onSelectFolder}\n                    isMovePending={isMovePending}\n                  />\n                ))}\n              </NavList>\n            )}\n          </Box>\n        </Flex>\n      </SubNav.Content>\n    </SubNav.Main>\n  );\n};\n"],"names":["RowButton","styled","button","theme","spaces","$isActive","$isValidDropTarget","colors","primary100","primary700","neutral800","borderRadius","$isMovePending","$isInvalidDropCursor","css","primary600","neutral100","TreeRow","Flex","findAncestorIds","nodes","targetId","trail","node","id","children","length","nextTrail","found","useExpandedFolders","folderStructure","currentFolderId","expandedIds","setExpandedIds","useState","Set","useEffect","ancestors","prev","next","changed","has","add","toggleExpanded","useCallback","delete","expandFolder","isExpanded","TruncatedFolderName","name","isActive","textRef","useRef","isTruncated","setIsTruncated","useLayoutEffect","el","current","checkTruncation","scrollWidth","clientWidth","observer","ResizeObserver","observe","disconnect","label","_jsx","Typography","ref","variant","fontWeight","ellipsis","Tooltip","NavList","ul","INDENT_PER_LEVEL_REM","RotatingChevron","ChevronDown","$expanded","FolderTreeItemInner","folderChildren","level","showActiveFolder","onToggle","onExpand","onSelect","isMovePending","formatMessage","useIntl","hasChildren","isFolderExpanded","droppable","setNodeRef","isOver","showValidDropHighlight","showInvalidDropCursor","useFolderTreeDroppable","handleExpand","useSpringLoadedExpand","canExpand","_jsxs","li","alignItems","paddingLeft","gap","IconButton","getTranslationKey","defaultMessage","onClick","event","stopPropagation","withTooltip","aria-expanded","fill","Box","flex","minWidth","type","aria-current","undefined","data-testid","data-folder-id","map","child","FolderTreeItem","props","FolderTree","onSelectFolder","data","isLoading","isError","useGetFolderStructureQuery","useAssetsDndOptional","isHomeActive","homeLabel","setHomeDropRef","showHomeValidDropHighlight","showHomeInvalidDropCursor","SubNav","Main","aria-label","Header","Content","direction","padding","House","aria-hidden","width","height","marginTop","paddingTop","paddingBottom","paddingRight","marginBottom","FolderIcon","textColor","style","textTransform","justifyContent","Loader"],"mappings":"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"}

package/dist/admin/future/pages/Assets/components/SortMenu.js

@@ -47,9 +47,7 @@ const FOLDERS_LABELS = {
 };
 // Stretch to the toolbar row height so the trigger matches the view toggle
 // (the parent Flex uses alignItems="stretch").
-const SortTrigger = styledComponents.styled(designSystem.Menu.Trigger)`
-  height: auto;
-`;
+const SortTrigger = styledComponents.styled(designSystem.Menu.Trigger)``;
 // Full-width section band, like the design mock (sits inside the Menu.Content
 // padding, so the band stops short of the panel edges).
 const GroupLabel = styledComponents.styled(designSystem.Menu.Label)`
@@ -64,6 +62,12 @@ const GroupLabel = styledComponents.styled(designSystem.Menu.Label)`
  * option keeps the menu open (`onSelect` preventDefault) so several facets can
  * be tuned in one visit; clicking a checked facet clears it (the hook
  * guarantees at least one sort rule stays active).
+ *
+ * Each section is single-select, so its items are radios: the checkmark icon is
+ * decorative, and `aria-checked` is what assistive tech reads. The DS `Menu`
+ * exposes no `RadioItem`, but `Menu.Item` forwards extra props onto the element
+ * it renders through Radix's `asChild`, where they take precedence over Radix's
+ * own `role="menuitem"`.
  */ const SortMenu = ({ sort, showFoldersGroup = true })=>{
     const { formatMessage } = reactIntl.useIntl();
     const triggerLabel = formatMessage({
@@ -78,22 +82,10 @@ const GroupLabel = styledComponents.styled(designSystem.Menu.Label)`
         height: "1.6rem",
         fill: "primary600"
     });
-    // The checkmark icon is aria-hidden, so the active option carries a
-    // visually-hidden suffix for screen readers instead (menuitem does not
-    // allow aria-checked).
-    const activeMark = /*#__PURE__*/ jsxRuntime.jsxs(designSystem.VisuallyHidden, {
-        children: [
-            ' ',
-            formatMessage({
-                id: translations.getTranslationKey('list.sort.active'),
-                defaultMessage: '(active)'
-            })
-        ]
-    });
     return /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Menu.Root, {
         children: [
             /*#__PURE__*/ jsxRuntime.jsx(SortTrigger, {
-                variant: "tertiary",
+                variant: "ghost",
                 endIcon: /*#__PURE__*/ jsxRuntime.jsx(icons.ChevronDown, {
                     "aria-hidden": true
                 }),
@@ -103,7 +95,7 @@ const GroupLabel = styledComponents.styled(designSystem.Menu.Label)`
                 popoverPlacement: "bottom-end",
                 zIndex: 2,
                 maxHeight: "70vh",
-                width: "25rem",
+                minWidth: "25rem",
                 children: [
                     /*#__PURE__*/ jsxRuntime.jsx(GroupLabel, {
                         children: formatMessage({
@@ -111,27 +103,25 @@ const GroupLabel = styledComponents.styled(designSystem.Menu.Label)`
                             defaultMessage: 'Sort'
                         })
                     }),
-                    Object.keys(SORT_BY_LABELS).map((key)=>/*#__PURE__*/ jsxRuntime.jsxs(designSystem.Menu.Item, {
+                    Object.keys(SORT_BY_LABELS).map((key)=>/*#__PURE__*/ jsxRuntime.jsx(designSystem.Menu.Item, {
+                            role: "menuitemradio",
+                            "aria-checked": sort.sortBy === key,
                             onSelect: (e)=>{
                                 e.preventDefault();
                                 sort.setSortBy(sort.sortBy === key ? null : key);
                             },
                             endIcon: sort.sortBy === key ? checkmark : null,
-                            children: [
-                                formatMessage(SORT_BY_LABELS[key]),
-                                sort.sortBy === key && activeMark
-                            ]
+                            children: formatMessage(SORT_BY_LABELS[key])
                         }, key)),
-                    Object.keys(SORT_DIRECTION_LABELS).map((key)=>/*#__PURE__*/ jsxRuntime.jsxs(designSystem.Menu.Item, {
+                    Object.keys(SORT_DIRECTION_LABELS).map((key)=>/*#__PURE__*/ jsxRuntime.jsx(designSystem.Menu.Item, {
+                            role: "menuitemradio",
+                            "aria-checked": sort.direction === key,
                             onSelect: (e)=>{
                                 e.preventDefault();
                                 sort.setDirection(sort.direction === key ? null : key);
                             },
                             endIcon: sort.direction === key ? checkmark : null,
-                            children: [
-                                formatMessage(SORT_DIRECTION_LABELS[key]),
-                                sort.direction === key && activeMark
-                            ]
+                            children: formatMessage(SORT_DIRECTION_LABELS[key])
                         }, key)),
                     showFoldersGroup && /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
                         children: [
@@ -142,16 +132,15 @@ const GroupLabel = styledComponents.styled(designSystem.Menu.Label)`
                                     defaultMessage: 'Folders'
                                 })
                             }),
-                            Object.keys(FOLDERS_LABELS).map((position)=>/*#__PURE__*/ jsxRuntime.jsxs(designSystem.Menu.Item, {
+                            Object.keys(FOLDERS_LABELS).map((position)=>/*#__PURE__*/ jsxRuntime.jsx(designSystem.Menu.Item, {
+                                    role: "menuitemradio",
+                                    "aria-checked": sort.foldersPosition === position,
                                     onSelect: (e)=>{
                                         e.preventDefault();
                                         sort.setFoldersPosition(position);
                                     },
                                     endIcon: sort.foldersPosition === position ? checkmark : null,
-                                    children: [
-                                        formatMessage(FOLDERS_LABELS[position]),
-                                        sort.foldersPosition === position && activeMark
-                                    ]
+                                    children: formatMessage(FOLDERS_LABELS[position])
                                 }, position))
                         ]
                     })