@strapi/upload 5.58.0 → 5.60.0

package/dist/admin/pages/Assets/components/Dnd/dndIds.js.map

@@ -1 +1 @@
-{"version":3,"file":"dndIds.js","sources":["../../../../../../admin/src/pages/Assets/components/Dnd/dndIds.ts"],"sourcesContent":["export const toFileDraggableId = (id: number) => `file:${id}` as const;\n\nexport const toFolderDraggableId = (id: number) => `folder:${id}` as const;\n\nexport const toFolderTargetId = (id: number) => `folder-target:${id}` as const;\n\nexport const parseFolderTargetId = (dndId: string | number): number | null => {\n  if (typeof dndId !== 'string') {\n    return null;\n  }\n\n  const match = /^folder-target:(\\d+)$/.exec(dndId);\n  return match ? Number(match[1]) : null;\n};\n\nexport const toFolderTreeTargetId = (id: number) => `folder-tree-target:${id}` as const;\n\nexport const HOME_TREE_TARGET_ID = 'folder-tree-target:home' as const;\n\nexport const parseFolderTreeTargetId = (dndId: string | number): number | 'root' | null => {\n  if (typeof dndId !== 'string') {\n    return null;\n  }\n\n  if (dndId === HOME_TREE_TARGET_ID) {\n    return 'root';\n  }\n\n  const match = /^folder-tree-target:(\\d+)$/.exec(dndId);\n  return match ? Number(match[1]) : null;\n};\n"],"names":["toFileDraggableId","id","toFolderDraggableId","toFolderTargetId","parseFolderTargetId","dndId","match","exec","Number","toFolderTreeTargetId","HOME_TREE_TARGET_ID","parseFolderTreeTargetId"],"mappings":";;AAAO,MAAMA,oBAAoB,CAACC,EAAAA,GAAe,CAAC,KAAK,EAAEA;AAElD,MAAMC,sBAAsB,CAACD,EAAAA,GAAe,CAAC,OAAO,EAAEA;AAEtD,MAAME,mBAAmB,CAACF,EAAAA,GAAe,CAAC,cAAc,EAAEA;AAE1D,MAAMG,sBAAsB,CAACC,KAAAA,GAAAA;IAClC,IAAI,OAAOA,UAAU,QAAA,EAAU;QAC7B,OAAO,IAAA;AACT,IAAA;IAEA,MAAMC,KAAAA,GAAQ,uBAAA,CAAwBC,IAAI,CAACF,KAAAA,CAAAA;AAC3C,IAAA,OAAOC,KAAAA,GAAQE,MAAAA,CAAOF,KAAK,CAAC,EAAE,CAAA,GAAI,IAAA;AACpC;AAEO,MAAMG,uBAAuB,CAACR,EAAAA,GAAe,CAAC,mBAAmB,EAAEA;AAEnE,MAAMS,sBAAsB;AAE5B,MAAMC,0BAA0B,CAACN,KAAAA,GAAAA;IACtC,IAAI,OAAOA,UAAU,QAAA,EAAU;QAC7B,OAAO,IAAA;AACT,IAAA;AAEA,IAAA,IAAIA,UAAUK,mBAAAA,EAAqB;QACjC,OAAO,MAAA;AACT,IAAA;IAEA,MAAMJ,KAAAA,GAAQ,4BAAA,CAA6BC,IAAI,CAACF,KAAAA,CAAAA;AAChD,IAAA,OAAOC,KAAAA,GAAQE,MAAAA,CAAOF,KAAK,CAAC,EAAE,CAAA,GAAI,IAAA;AACpC;;;;;;;;;;"}
+{"version":3,"file":"dndIds.js","sources":["../../../../../../admin/src/pages/Assets/components/Dnd/dndIds.ts"],"sourcesContent":["export const toFileDraggableId = (id: number) => `file:${id}` as const;\n\nexport const toFolderDraggableId = (id: number) => `folder:${id}` as const;\n\nexport const toFolderTargetId = (id: number) => `folder-target:${id}` as const;\n\nexport const parseFolderTargetId = (dndId: string | number): number | null => {\n  if (typeof dndId !== 'string') {\n    return null;\n  }\n\n  const match = /^folder-target:(\\d+)$/.exec(dndId);\n  return match ? Number(match[1]) : null;\n};\n\nexport const toFolderTreeTargetId = (id: number) => `folder-tree-target:${id}` as const;\n\n/**\n * The \"N parent folders\" row in the sidebar. Only there so hovering it during a\n * drag opens it; no parser recognises it, so a drop on it moves nothing.\n */\nexport const toFolderTreeSummaryId = (rootId: number) => `folder-tree-summary:${rootId}` as const;\n\nexport const HOME_TREE_TARGET_ID = 'folder-tree-target:home' as const;\n\nexport const parseFolderTreeTargetId = (dndId: string | number): number | 'root' | null => {\n  if (typeof dndId !== 'string') {\n    return null;\n  }\n\n  if (dndId === HOME_TREE_TARGET_ID) {\n    return 'root';\n  }\n\n  const match = /^folder-tree-target:(\\d+)$/.exec(dndId);\n  return match ? Number(match[1]) : null;\n};\n"],"names":["toFileDraggableId","id","toFolderDraggableId","toFolderTargetId","parseFolderTargetId","dndId","match","exec","Number","toFolderTreeTargetId","toFolderTreeSummaryId","rootId","HOME_TREE_TARGET_ID","parseFolderTreeTargetId"],"mappings":";;AAAO,MAAMA,oBAAoB,CAACC,EAAAA,GAAe,CAAC,KAAK,EAAEA;AAElD,MAAMC,sBAAsB,CAACD,EAAAA,GAAe,CAAC,OAAO,EAAEA;AAEtD,MAAME,mBAAmB,CAACF,EAAAA,GAAe,CAAC,cAAc,EAAEA;AAE1D,MAAMG,sBAAsB,CAACC,KAAAA,GAAAA;IAClC,IAAI,OAAOA,UAAU,QAAA,EAAU;QAC7B,OAAO,IAAA;AACT,IAAA;IAEA,MAAMC,KAAAA,GAAQ,uBAAA,CAAwBC,IAAI,CAACF,KAAAA,CAAAA;AAC3C,IAAA,OAAOC,KAAAA,GAAQE,MAAAA,CAAOF,KAAK,CAAC,EAAE,CAAA,GAAI,IAAA;AACpC;AAEO,MAAMG,uBAAuB,CAACR,EAAAA,GAAe,CAAC,mBAAmB,EAAEA;AAE1E;;;UAIaS,qBAAAA,GAAwB,CAACC,SAAmB,CAAC,oBAAoB,EAAEA,MAAAA,CAAAA;AAEzE,MAAMC,sBAAsB;AAE5B,MAAMC,0BAA0B,CAACR,KAAAA,GAAAA;IACtC,IAAI,OAAOA,UAAU,QAAA,EAAU;QAC7B,OAAO,IAAA;AACT,IAAA;AAEA,IAAA,IAAIA,UAAUO,mBAAAA,EAAqB;QACjC,OAAO,MAAA;AACT,IAAA;IAEA,MAAMN,KAAAA,GAAQ,4BAAA,CAA6BC,IAAI,CAACF,KAAAA,CAAAA;AAChD,IAAA,OAAOC,KAAAA,GAAQE,MAAAA,CAAOF,KAAK,CAAC,EAAE,CAAA,GAAI,IAAA;AACpC;;;;;;;;;;;"}

package/dist/admin/pages/Assets/components/Dnd/dndIds.mjs

@@ -9,6 +9,10 @@ const parseFolderTargetId = (dndId)=>{
     return match ? Number(match[1]) : null;
 };
 const toFolderTreeTargetId = (id)=>`folder-tree-target:${id}`;
+/**
+ * The "N parent folders" row in the sidebar. Only there so hovering it during a
+ * drag opens it; no parser recognises it, so a drop on it moves nothing.
+ */ const toFolderTreeSummaryId = (rootId)=>`folder-tree-summary:${rootId}`;
 const HOME_TREE_TARGET_ID = 'folder-tree-target:home';
 const parseFolderTreeTargetId = (dndId)=>{
     if (typeof dndId !== 'string') {
@@ -21,5 +25,5 @@ const parseFolderTreeTargetId = (dndId)=>{
     return match ? Number(match[1]) : null;
 };
 
-export { HOME_TREE_TARGET_ID, parseFolderTargetId, parseFolderTreeTargetId, toFileDraggableId, toFolderDraggableId, toFolderTargetId, toFolderTreeTargetId };
+export { HOME_TREE_TARGET_ID, parseFolderTargetId, parseFolderTreeTargetId, toFileDraggableId, toFolderDraggableId, toFolderTargetId, toFolderTreeSummaryId, toFolderTreeTargetId };
 //# sourceMappingURL=dndIds.mjs.map

package/dist/admin/pages/Assets/components/Dnd/dndIds.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"dndIds.mjs","sources":["../../../../../../admin/src/pages/Assets/components/Dnd/dndIds.ts"],"sourcesContent":["export const toFileDraggableId = (id: number) => `file:${id}` as const;\n\nexport const toFolderDraggableId = (id: number) => `folder:${id}` as const;\n\nexport const toFolderTargetId = (id: number) => `folder-target:${id}` as const;\n\nexport const parseFolderTargetId = (dndId: string | number): number | null => {\n  if (typeof dndId !== 'string') {\n    return null;\n  }\n\n  const match = /^folder-target:(\\d+)$/.exec(dndId);\n  return match ? Number(match[1]) : null;\n};\n\nexport const toFolderTreeTargetId = (id: number) => `folder-tree-target:${id}` as const;\n\nexport const HOME_TREE_TARGET_ID = 'folder-tree-target:home' as const;\n\nexport const parseFolderTreeTargetId = (dndId: string | number): number | 'root' | null => {\n  if (typeof dndId !== 'string') {\n    return null;\n  }\n\n  if (dndId === HOME_TREE_TARGET_ID) {\n    return 'root';\n  }\n\n  const match = /^folder-tree-target:(\\d+)$/.exec(dndId);\n  return match ? Number(match[1]) : null;\n};\n"],"names":["toFileDraggableId","id","toFolderDraggableId","toFolderTargetId","parseFolderTargetId","dndId","match","exec","Number","toFolderTreeTargetId","HOME_TREE_TARGET_ID","parseFolderTreeTargetId"],"mappings":"AAAO,MAAMA,oBAAoB,CAACC,EAAAA,GAAe,CAAC,KAAK,EAAEA;AAElD,MAAMC,sBAAsB,CAACD,EAAAA,GAAe,CAAC,OAAO,EAAEA;AAEtD,MAAME,mBAAmB,CAACF,EAAAA,GAAe,CAAC,cAAc,EAAEA;AAE1D,MAAMG,sBAAsB,CAACC,KAAAA,GAAAA;IAClC,IAAI,OAAOA,UAAU,QAAA,EAAU;QAC7B,OAAO,IAAA;AACT,IAAA;IAEA,MAAMC,KAAAA,GAAQ,uBAAA,CAAwBC,IAAI,CAACF,KAAAA,CAAAA;AAC3C,IAAA,OAAOC,KAAAA,GAAQE,MAAAA,CAAOF,KAAK,CAAC,EAAE,CAAA,GAAI,IAAA;AACpC;AAEO,MAAMG,uBAAuB,CAACR,EAAAA,GAAe,CAAC,mBAAmB,EAAEA;AAEnE,MAAMS,sBAAsB;AAE5B,MAAMC,0BAA0B,CAACN,KAAAA,GAAAA;IACtC,IAAI,OAAOA,UAAU,QAAA,EAAU;QAC7B,OAAO,IAAA;AACT,IAAA;AAEA,IAAA,IAAIA,UAAUK,mBAAAA,EAAqB;QACjC,OAAO,MAAA;AACT,IAAA;IAEA,MAAMJ,KAAAA,GAAQ,4BAAA,CAA6BC,IAAI,CAACF,KAAAA,CAAAA;AAChD,IAAA,OAAOC,KAAAA,GAAQE,MAAAA,CAAOF,KAAK,CAAC,EAAE,CAAA,GAAI,IAAA;AACpC;;;;"}
+{"version":3,"file":"dndIds.mjs","sources":["../../../../../../admin/src/pages/Assets/components/Dnd/dndIds.ts"],"sourcesContent":["export const toFileDraggableId = (id: number) => `file:${id}` as const;\n\nexport const toFolderDraggableId = (id: number) => `folder:${id}` as const;\n\nexport const toFolderTargetId = (id: number) => `folder-target:${id}` as const;\n\nexport const parseFolderTargetId = (dndId: string | number): number | null => {\n  if (typeof dndId !== 'string') {\n    return null;\n  }\n\n  const match = /^folder-target:(\\d+)$/.exec(dndId);\n  return match ? Number(match[1]) : null;\n};\n\nexport const toFolderTreeTargetId = (id: number) => `folder-tree-target:${id}` as const;\n\n/**\n * The \"N parent folders\" row in the sidebar. Only there so hovering it during a\n * drag opens it; no parser recognises it, so a drop on it moves nothing.\n */\nexport const toFolderTreeSummaryId = (rootId: number) => `folder-tree-summary:${rootId}` as const;\n\nexport const HOME_TREE_TARGET_ID = 'folder-tree-target:home' as const;\n\nexport const parseFolderTreeTargetId = (dndId: string | number): number | 'root' | null => {\n  if (typeof dndId !== 'string') {\n    return null;\n  }\n\n  if (dndId === HOME_TREE_TARGET_ID) {\n    return 'root';\n  }\n\n  const match = /^folder-tree-target:(\\d+)$/.exec(dndId);\n  return match ? Number(match[1]) : null;\n};\n"],"names":["toFileDraggableId","id","toFolderDraggableId","toFolderTargetId","parseFolderTargetId","dndId","match","exec","Number","toFolderTreeTargetId","toFolderTreeSummaryId","rootId","HOME_TREE_TARGET_ID","parseFolderTreeTargetId"],"mappings":"AAAO,MAAMA,oBAAoB,CAACC,EAAAA,GAAe,CAAC,KAAK,EAAEA;AAElD,MAAMC,sBAAsB,CAACD,EAAAA,GAAe,CAAC,OAAO,EAAEA;AAEtD,MAAME,mBAAmB,CAACF,EAAAA,GAAe,CAAC,cAAc,EAAEA;AAE1D,MAAMG,sBAAsB,CAACC,KAAAA,GAAAA;IAClC,IAAI,OAAOA,UAAU,QAAA,EAAU;QAC7B,OAAO,IAAA;AACT,IAAA;IAEA,MAAMC,KAAAA,GAAQ,uBAAA,CAAwBC,IAAI,CAACF,KAAAA,CAAAA;AAC3C,IAAA,OAAOC,KAAAA,GAAQE,MAAAA,CAAOF,KAAK,CAAC,EAAE,CAAA,GAAI,IAAA;AACpC;AAEO,MAAMG,uBAAuB,CAACR,EAAAA,GAAe,CAAC,mBAAmB,EAAEA;AAE1E;;;UAIaS,qBAAAA,GAAwB,CAACC,SAAmB,CAAC,oBAAoB,EAAEA,MAAAA,CAAAA;AAEzE,MAAMC,sBAAsB;AAE5B,MAAMC,0BAA0B,CAACR,KAAAA,GAAAA;IACtC,IAAI,OAAOA,UAAU,QAAA,EAAU;QAC7B,OAAO,IAAA;AACT,IAAA;AAEA,IAAA,IAAIA,UAAUO,mBAAAA,EAAqB;QACjC,OAAO,MAAA;AACT,IAAA;IAEA,MAAMN,KAAAA,GAAQ,4BAAA,CAA6BC,IAAI,CAACF,KAAAA,CAAAA;AAChD,IAAA,OAAOC,KAAAA,GAAQE,MAAAA,CAAOF,KAAK,CAAC,EAAE,CAAA,GAAI,IAAA;AACpC;;;;"}

package/dist/admin/pages/Assets/components/Dnd/useAssetDnd.js

@@ -4,12 +4,23 @@ var React = require('react');
 var core = require('@dnd-kit/core');
 var getRelationId = require('../../../../utils/getRelationId.js');
 var AssetsDndProvider = require('./AssetsDndProvider.js');
+var assetSortable = require('./assetSortable.js');
 var dndIds = require('./dndIds.js');
 
-const useFileDraggable = (asset)=>{
-    const { isMovePending } = AssetsDndProvider.useAssetsDndOptional() ?? {
-        isMovePending: false
+/**
+ * Without an `AssetsDndProvider` (the Content Manager asset picker mounts none)
+ * items are not draggable: nothing handles the drop. Their drag attributes are
+ * withheld too, so they aren't announced as draggable.
+ */ const NO_DRAG_ATTRIBUTES = {};
+const withoutDrag = (draggable, isDndEnabled)=>isDndEnabled ? draggable : {
+        ...draggable,
+        attributes: NO_DRAG_ATTRIBUTES,
+        listeners: undefined
     };
+const useFileDraggable = (asset)=>{
+    const dnd = AssetsDndProvider.useAssetsDndOptional();
+    const isDndEnabled = dnd !== null;
+    const isMovePending = dnd?.isMovePending ?? false;
     const data = React.useMemo(()=>({
             kind: 'file',
             id: asset.id,
@@ -23,20 +34,37 @@ const useFileDraggable = (asset)=>{
     const draggable = core.useDraggable({
         id: dndIds.toFileDraggableId(asset.id),
         data,
-        disabled: isMovePending
+        disabled: !isDndEnabled || isMovePending
     });
+    const sortable = assetSortable.useAssetSortable(asset.id);
+    // In a reorderable list (the picker's Selected tab) dragging reorders
+    // instead of moving between folders: the item takes the sortable's node,
+    // pointer listeners and transform, and exposes a grip for the keyboard.
+    if (sortable) {
+        return {
+            ...withoutDrag(draggable, false),
+            setNodeRef: sortable.setNodeRef,
+            isDragging: sortable.isDragging,
+            listeners: sortable.listeners,
+            dragStyle: sortable.style,
+            dragHandle: sortable.handle,
+            dragData: data
+        };
+    }
     // `dragData` is re-exposed (like `useFolderDraggableDroppable` does) so the
     // row's actions menu can hand the move dialog the asset's real folder.
     return {
-        ...draggable,
+        ...withoutDrag(draggable, isDndEnabled),
+        dragStyle: undefined,
+        dragHandle: undefined,
         dragData: data
     };
 };
 const useFolderDraggableDroppable = (folder)=>{
-    const { isMovePending, isValidDropTarget } = AssetsDndProvider.useAssetsDndOptional() ?? {
-        isMovePending: false,
-        isValidDropTarget: ()=>false
-    };
+    const dnd = AssetsDndProvider.useAssetsDndOptional();
+    const isDndEnabled = dnd !== null;
+    const isMovePending = dnd?.isMovePending ?? false;
+    const isValidDropTarget = dnd?.isValidDropTarget ?? (()=>false);
     const { active } = core.useDndContext();
     const parentId = getRelationId.getRelationId(folder.parent);
     const dragData = React.useMemo(()=>({
@@ -57,15 +85,15 @@ const useFolderDraggableDroppable = (folder)=>{
         folder.id,
         folder.name
     ]);
-    const draggable = core.useDraggable({
+    const draggable = withoutDrag(core.useDraggable({
         id: dndIds.toFolderDraggableId(folder.id),
         data: dragData,
-        disabled: isMovePending
-    });
+        disabled: !isDndEnabled || isMovePending
+    }), isDndEnabled);
     const droppable = core.useDroppable({
         id: dndIds.toFolderTargetId(folder.id),
         data: dropData,
-        disabled: isMovePending
+        disabled: !isDndEnabled || isMovePending
     });
     const isValidTarget = isValidDropTarget(folder.id);
     const isOver = droppable.isOver;

package/dist/admin/pages/Assets/components/Dnd/useAssetDnd.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAssetDnd.js","sources":["../../../../../../admin/src/pages/Assets/components/Dnd/useAssetDnd.ts"],"sourcesContent":["import { useMemo } from 'react';\n\nimport { useDndContext, useDraggable, useDroppable } from '@dnd-kit/core';\n\nimport { getRelationId } from '../../../../utils/getRelationId';\n\nimport { useAssetsDndOptional } from './AssetsDndProvider';\nimport { toFileDraggableId, toFolderDraggableId, toFolderTargetId } from './dndIds';\n\nimport type { DragFileData, DragFolderData, FolderTargetData } from '../../../../types/dnd';\n\nexport const useFileDraggable = (asset: {\n  id: number;\n  name: string;\n  folder?: number | string | { id?: number } | null;\n}) => {\n  const { isMovePending } = useAssetsDndOptional() ?? { isMovePending: false };\n\n  const data = useMemo<DragFileData>(\n    () => ({\n      kind: 'file',\n      id: asset.id,\n      name: asset.name,\n      folderId: getRelationId(asset.folder),\n    }),\n    [asset.folder, asset.id, asset.name]\n  );\n\n  const draggable = useDraggable({\n    id: toFileDraggableId(asset.id),\n    data,\n    disabled: isMovePending,\n  });\n\n  // `dragData` is re-exposed (like `useFolderDraggableDroppable` does) so the\n  // row's actions menu can hand the move dialog the asset's real folder.\n  return { ...draggable, dragData: data };\n};\n\nexport const useFolderDraggableDroppable = (folder: {\n  id: number;\n  name: string;\n  parent?: number | null | { id?: number };\n}) => {\n  const { isMovePending, isValidDropTarget } = useAssetsDndOptional() ?? {\n    isMovePending: false,\n    isValidDropTarget: () => false,\n  };\n  const { active } = useDndContext();\n\n  const parentId = getRelationId(folder.parent);\n\n  const dragData = useMemo<DragFolderData>(\n    () => ({\n      kind: 'folder',\n      id: folder.id,\n      name: folder.name,\n      parentId,\n    }),\n    [folder.id, folder.name, parentId]\n  );\n\n  const dropData = useMemo<FolderTargetData>(\n    () => ({\n      kind: 'folder-target',\n      id: folder.id,\n      name: folder.name,\n    }),\n    [folder.id, folder.name]\n  );\n\n  const draggable = useDraggable({\n    id: toFolderDraggableId(folder.id),\n    data: dragData,\n    disabled: isMovePending,\n  });\n\n  const droppable = useDroppable({\n    id: toFolderTargetId(folder.id),\n    data: dropData,\n    disabled: isMovePending,\n  });\n\n  const isValidTarget = isValidDropTarget(folder.id);\n  const isOver = droppable.isOver;\n  const showValidDropHighlight = isOver && isValidTarget;\n  const showInvalidDropCursor = isOver && !isValidTarget && active != null;\n\n  return {\n    dragData,\n    draggable,\n    droppable,\n    isDragging: draggable.isDragging,\n    showValidDropHighlight,\n    showInvalidDropCursor,\n  };\n};\n"],"names":["useFileDraggable","asset","isMovePending","useAssetsDndOptional","data","useMemo","kind","id","name","folderId","getRelationId","folder","draggable","useDraggable","toFileDraggableId","disabled","dragData","useFolderDraggableDroppable","isValidDropTarget","active","useDndContext","parentId","parent","dropData","toFolderDraggableId","droppable","useDroppable","toFolderTargetId","isValidTarget","isOver","showValidDropHighlight","showInvalidDropCursor","isDragging"],"mappings":"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"}
+{"version":3,"file":"useAssetDnd.js","sources":["../../../../../../admin/src/pages/Assets/components/Dnd/useAssetDnd.ts"],"sourcesContent":["import { useMemo } from 'react';\n\nimport { useDndContext, useDraggable, useDroppable, type DraggableAttributes } from '@dnd-kit/core';\n\nimport { getRelationId } from '../../../../utils/getRelationId';\n\nimport { useAssetsDndOptional } from './AssetsDndProvider';\nimport { useAssetSortable } from './assetSortable';\nimport { toFileDraggableId, toFolderDraggableId, toFolderTargetId } from './dndIds';\n\nimport type { DragFileData, DragFolderData, FolderTargetData } from '../../../../types/dnd';\n\n/**\n * Without an `AssetsDndProvider` (the Content Manager asset picker mounts none)\n * items are not draggable: nothing handles the drop. Their drag attributes are\n * withheld too, so they aren't announced as draggable.\n */\nconst NO_DRAG_ATTRIBUTES: Partial<DraggableAttributes> = {};\n\nconst withoutDrag = <T extends { attributes: DraggableAttributes }>(\n  draggable: T,\n  isDndEnabled: boolean\n) =>\n  isDndEnabled ? draggable : { ...draggable, attributes: NO_DRAG_ATTRIBUTES, listeners: undefined };\n\nexport const useFileDraggable = (asset: {\n  id: number;\n  name: string;\n  folder?: number | string | { id?: number } | null;\n}) => {\n  const dnd = useAssetsDndOptional();\n  const isDndEnabled = dnd !== null;\n  const isMovePending = dnd?.isMovePending ?? false;\n\n  const data = useMemo<DragFileData>(\n    () => ({\n      kind: 'file',\n      id: asset.id,\n      name: asset.name,\n      folderId: getRelationId(asset.folder),\n    }),\n    [asset.folder, asset.id, asset.name]\n  );\n\n  const draggable = useDraggable({\n    id: toFileDraggableId(asset.id),\n    data,\n    disabled: !isDndEnabled || isMovePending,\n  });\n\n  const sortable = useAssetSortable(asset.id);\n\n  // In a reorderable list (the picker's Selected tab) dragging reorders\n  // instead of moving between folders: the item takes the sortable's node,\n  // pointer listeners and transform, and exposes a grip for the keyboard.\n  if (sortable) {\n    return {\n      ...withoutDrag(draggable, false),\n      setNodeRef: sortable.setNodeRef,\n      isDragging: sortable.isDragging,\n      listeners: sortable.listeners,\n      dragStyle: sortable.style,\n      dragHandle: sortable.handle,\n      dragData: data,\n    };\n  }\n\n  // `dragData` is re-exposed (like `useFolderDraggableDroppable` does) so the\n  // row's actions menu can hand the move dialog the asset's real folder.\n  return {\n    ...withoutDrag(draggable, isDndEnabled),\n    dragStyle: undefined,\n    dragHandle: undefined,\n    dragData: data,\n  };\n};\n\nexport const useFolderDraggableDroppable = (folder: {\n  id: number;\n  name: string;\n  parent?: number | null | { id?: number };\n}) => {\n  const dnd = useAssetsDndOptional();\n  const isDndEnabled = dnd !== null;\n  const isMovePending = dnd?.isMovePending ?? false;\n  const isValidDropTarget = dnd?.isValidDropTarget ?? (() => false);\n  const { active } = useDndContext();\n\n  const parentId = getRelationId(folder.parent);\n\n  const dragData = useMemo<DragFolderData>(\n    () => ({\n      kind: 'folder',\n      id: folder.id,\n      name: folder.name,\n      parentId,\n    }),\n    [folder.id, folder.name, parentId]\n  );\n\n  const dropData = useMemo<FolderTargetData>(\n    () => ({\n      kind: 'folder-target',\n      id: folder.id,\n      name: folder.name,\n    }),\n    [folder.id, folder.name]\n  );\n\n  const draggable = withoutDrag(\n    useDraggable({\n      id: toFolderDraggableId(folder.id),\n      data: dragData,\n      disabled: !isDndEnabled || isMovePending,\n    }),\n    isDndEnabled\n  );\n\n  const droppable = useDroppable({\n    id: toFolderTargetId(folder.id),\n    data: dropData,\n    disabled: !isDndEnabled || isMovePending,\n  });\n\n  const isValidTarget = isValidDropTarget(folder.id);\n  const isOver = droppable.isOver;\n  const showValidDropHighlight = isOver && isValidTarget;\n  const showInvalidDropCursor = isOver && !isValidTarget && active != null;\n\n  return {\n    dragData,\n    draggable,\n    droppable,\n    isDragging: draggable.isDragging,\n    showValidDropHighlight,\n    showInvalidDropCursor,\n  };\n};\n"],"names":["NO_DRAG_ATTRIBUTES","withoutDrag","draggable","isDndEnabled","attributes","listeners","undefined","useFileDraggable","asset","dnd","useAssetsDndOptional","isMovePending","data","useMemo","kind","id","name","folderId","getRelationId","folder","useDraggable","toFileDraggableId","disabled","sortable","useAssetSortable","setNodeRef","isDragging","dragStyle","style","dragHandle","handle","dragData","useFolderDraggableDroppable","isValidDropTarget","active","useDndContext","parentId","parent","dropData","toFolderDraggableId","droppable","useDroppable","toFolderTargetId","isValidTarget","isOver","showValidDropHighlight","showInvalidDropCursor"],"mappings":"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"}

package/dist/admin/pages/Assets/components/Dnd/useAssetDnd.mjs

@@ -2,12 +2,23 @@ import { useMemo } from 'react';
 import { useDndContext, useDraggable, useDroppable } from '@dnd-kit/core';
 import { getRelationId } from '../../../../utils/getRelationId.mjs';
 import { useAssetsDndOptional } from './AssetsDndProvider.mjs';
+import { useAssetSortable } from './assetSortable.mjs';
 import { toFolderDraggableId, toFolderTargetId, toFileDraggableId } from './dndIds.mjs';
 
-const useFileDraggable = (asset)=>{
-    const { isMovePending } = useAssetsDndOptional() ?? {
-        isMovePending: false
+/**
+ * Without an `AssetsDndProvider` (the Content Manager asset picker mounts none)
+ * items are not draggable: nothing handles the drop. Their drag attributes are
+ * withheld too, so they aren't announced as draggable.
+ */ const NO_DRAG_ATTRIBUTES = {};
+const withoutDrag = (draggable, isDndEnabled)=>isDndEnabled ? draggable : {
+        ...draggable,
+        attributes: NO_DRAG_ATTRIBUTES,
+        listeners: undefined
     };
+const useFileDraggable = (asset)=>{
+    const dnd = useAssetsDndOptional();
+    const isDndEnabled = dnd !== null;
+    const isMovePending = dnd?.isMovePending ?? false;
     const data = useMemo(()=>({
             kind: 'file',
             id: asset.id,
@@ -21,20 +32,37 @@ const useFileDraggable = (asset)=>{
     const draggable = useDraggable({
         id: toFileDraggableId(asset.id),
         data,
-        disabled: isMovePending
+        disabled: !isDndEnabled || isMovePending
     });
+    const sortable = useAssetSortable(asset.id);
+    // In a reorderable list (the picker's Selected tab) dragging reorders
+    // instead of moving between folders: the item takes the sortable's node,
+    // pointer listeners and transform, and exposes a grip for the keyboard.
+    if (sortable) {
+        return {
+            ...withoutDrag(draggable, false),
+            setNodeRef: sortable.setNodeRef,
+            isDragging: sortable.isDragging,
+            listeners: sortable.listeners,
+            dragStyle: sortable.style,
+            dragHandle: sortable.handle,
+            dragData: data
+        };
+    }
     // `dragData` is re-exposed (like `useFolderDraggableDroppable` does) so the
     // row's actions menu can hand the move dialog the asset's real folder.
     return {
-        ...draggable,
+        ...withoutDrag(draggable, isDndEnabled),
+        dragStyle: undefined,
+        dragHandle: undefined,
         dragData: data
     };
 };
 const useFolderDraggableDroppable = (folder)=>{
-    const { isMovePending, isValidDropTarget } = useAssetsDndOptional() ?? {
-        isMovePending: false,
-        isValidDropTarget: ()=>false
-    };
+    const dnd = useAssetsDndOptional();
+    const isDndEnabled = dnd !== null;
+    const isMovePending = dnd?.isMovePending ?? false;
+    const isValidDropTarget = dnd?.isValidDropTarget ?? (()=>false);
     const { active } = useDndContext();
     const parentId = getRelationId(folder.parent);
     const dragData = useMemo(()=>({
@@ -55,15 +83,15 @@ const useFolderDraggableDroppable = (folder)=>{
         folder.id,
         folder.name
     ]);
-    const draggable = useDraggable({
+    const draggable = withoutDrag(useDraggable({
         id: toFolderDraggableId(folder.id),
         data: dragData,
-        disabled: isMovePending
-    });
+        disabled: !isDndEnabled || isMovePending
+    }), isDndEnabled);
     const droppable = useDroppable({
         id: toFolderTargetId(folder.id),
         data: dropData,
-        disabled: isMovePending
+        disabled: !isDndEnabled || isMovePending
     });
     const isValidTarget = isValidDropTarget(folder.id);
     const isOver = droppable.isOver;

package/dist/admin/pages/Assets/components/Dnd/useAssetDnd.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useAssetDnd.mjs","sources":["../../../../../../admin/src/pages/Assets/components/Dnd/useAssetDnd.ts"],"sourcesContent":["import { useMemo } from 'react';\n\nimport { useDndContext, useDraggable, useDroppable } from '@dnd-kit/core';\n\nimport { getRelationId } from '../../../../utils/getRelationId';\n\nimport { useAssetsDndOptional } from './AssetsDndProvider';\nimport { toFileDraggableId, toFolderDraggableId, toFolderTargetId } from './dndIds';\n\nimport type { DragFileData, DragFolderData, FolderTargetData } from '../../../../types/dnd';\n\nexport const useFileDraggable = (asset: {\n  id: number;\n  name: string;\n  folder?: number | string | { id?: number } | null;\n}) => {\n  const { isMovePending } = useAssetsDndOptional() ?? { isMovePending: false };\n\n  const data = useMemo<DragFileData>(\n    () => ({\n      kind: 'file',\n      id: asset.id,\n      name: asset.name,\n      folderId: getRelationId(asset.folder),\n    }),\n    [asset.folder, asset.id, asset.name]\n  );\n\n  const draggable = useDraggable({\n    id: toFileDraggableId(asset.id),\n    data,\n    disabled: isMovePending,\n  });\n\n  // `dragData` is re-exposed (like `useFolderDraggableDroppable` does) so the\n  // row's actions menu can hand the move dialog the asset's real folder.\n  return { ...draggable, dragData: data };\n};\n\nexport const useFolderDraggableDroppable = (folder: {\n  id: number;\n  name: string;\n  parent?: number | null | { id?: number };\n}) => {\n  const { isMovePending, isValidDropTarget } = useAssetsDndOptional() ?? {\n    isMovePending: false,\n    isValidDropTarget: () => false,\n  };\n  const { active } = useDndContext();\n\n  const parentId = getRelationId(folder.parent);\n\n  const dragData = useMemo<DragFolderData>(\n    () => ({\n      kind: 'folder',\n      id: folder.id,\n      name: folder.name,\n      parentId,\n    }),\n    [folder.id, folder.name, parentId]\n  );\n\n  const dropData = useMemo<FolderTargetData>(\n    () => ({\n      kind: 'folder-target',\n      id: folder.id,\n      name: folder.name,\n    }),\n    [folder.id, folder.name]\n  );\n\n  const draggable = useDraggable({\n    id: toFolderDraggableId(folder.id),\n    data: dragData,\n    disabled: isMovePending,\n  });\n\n  const droppable = useDroppable({\n    id: toFolderTargetId(folder.id),\n    data: dropData,\n    disabled: isMovePending,\n  });\n\n  const isValidTarget = isValidDropTarget(folder.id);\n  const isOver = droppable.isOver;\n  const showValidDropHighlight = isOver && isValidTarget;\n  const showInvalidDropCursor = isOver && !isValidTarget && active != null;\n\n  return {\n    dragData,\n    draggable,\n    droppable,\n    isDragging: draggable.isDragging,\n    showValidDropHighlight,\n    showInvalidDropCursor,\n  };\n};\n"],"names":["useFileDraggable","asset","isMovePending","useAssetsDndOptional","data","useMemo","kind","id","name","folderId","getRelationId","folder","draggable","useDraggable","toFileDraggableId","disabled","dragData","useFolderDraggableDroppable","isValidDropTarget","active","useDndContext","parentId","parent","dropData","toFolderDraggableId","droppable","useDroppable","toFolderTargetId","isValidTarget","isOver","showValidDropHighlight","showInvalidDropCursor","isDragging"],"mappings":"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"}
+{"version":3,"file":"useAssetDnd.mjs","sources":["../../../../../../admin/src/pages/Assets/components/Dnd/useAssetDnd.ts"],"sourcesContent":["import { useMemo } from 'react';\n\nimport { useDndContext, useDraggable, useDroppable, type DraggableAttributes } from '@dnd-kit/core';\n\nimport { getRelationId } from '../../../../utils/getRelationId';\n\nimport { useAssetsDndOptional } from './AssetsDndProvider';\nimport { useAssetSortable } from './assetSortable';\nimport { toFileDraggableId, toFolderDraggableId, toFolderTargetId } from './dndIds';\n\nimport type { DragFileData, DragFolderData, FolderTargetData } from '../../../../types/dnd';\n\n/**\n * Without an `AssetsDndProvider` (the Content Manager asset picker mounts none)\n * items are not draggable: nothing handles the drop. Their drag attributes are\n * withheld too, so they aren't announced as draggable.\n */\nconst NO_DRAG_ATTRIBUTES: Partial<DraggableAttributes> = {};\n\nconst withoutDrag = <T extends { attributes: DraggableAttributes }>(\n  draggable: T,\n  isDndEnabled: boolean\n) =>\n  isDndEnabled ? draggable : { ...draggable, attributes: NO_DRAG_ATTRIBUTES, listeners: undefined };\n\nexport const useFileDraggable = (asset: {\n  id: number;\n  name: string;\n  folder?: number | string | { id?: number } | null;\n}) => {\n  const dnd = useAssetsDndOptional();\n  const isDndEnabled = dnd !== null;\n  const isMovePending = dnd?.isMovePending ?? false;\n\n  const data = useMemo<DragFileData>(\n    () => ({\n      kind: 'file',\n      id: asset.id,\n      name: asset.name,\n      folderId: getRelationId(asset.folder),\n    }),\n    [asset.folder, asset.id, asset.name]\n  );\n\n  const draggable = useDraggable({\n    id: toFileDraggableId(asset.id),\n    data,\n    disabled: !isDndEnabled || isMovePending,\n  });\n\n  const sortable = useAssetSortable(asset.id);\n\n  // In a reorderable list (the picker's Selected tab) dragging reorders\n  // instead of moving between folders: the item takes the sortable's node,\n  // pointer listeners and transform, and exposes a grip for the keyboard.\n  if (sortable) {\n    return {\n      ...withoutDrag(draggable, false),\n      setNodeRef: sortable.setNodeRef,\n      isDragging: sortable.isDragging,\n      listeners: sortable.listeners,\n      dragStyle: sortable.style,\n      dragHandle: sortable.handle,\n      dragData: data,\n    };\n  }\n\n  // `dragData` is re-exposed (like `useFolderDraggableDroppable` does) so the\n  // row's actions menu can hand the move dialog the asset's real folder.\n  return {\n    ...withoutDrag(draggable, isDndEnabled),\n    dragStyle: undefined,\n    dragHandle: undefined,\n    dragData: data,\n  };\n};\n\nexport const useFolderDraggableDroppable = (folder: {\n  id: number;\n  name: string;\n  parent?: number | null | { id?: number };\n}) => {\n  const dnd = useAssetsDndOptional();\n  const isDndEnabled = dnd !== null;\n  const isMovePending = dnd?.isMovePending ?? false;\n  const isValidDropTarget = dnd?.isValidDropTarget ?? (() => false);\n  const { active } = useDndContext();\n\n  const parentId = getRelationId(folder.parent);\n\n  const dragData = useMemo<DragFolderData>(\n    () => ({\n      kind: 'folder',\n      id: folder.id,\n      name: folder.name,\n      parentId,\n    }),\n    [folder.id, folder.name, parentId]\n  );\n\n  const dropData = useMemo<FolderTargetData>(\n    () => ({\n      kind: 'folder-target',\n      id: folder.id,\n      name: folder.name,\n    }),\n    [folder.id, folder.name]\n  );\n\n  const draggable = withoutDrag(\n    useDraggable({\n      id: toFolderDraggableId(folder.id),\n      data: dragData,\n      disabled: !isDndEnabled || isMovePending,\n    }),\n    isDndEnabled\n  );\n\n  const droppable = useDroppable({\n    id: toFolderTargetId(folder.id),\n    data: dropData,\n    disabled: !isDndEnabled || isMovePending,\n  });\n\n  const isValidTarget = isValidDropTarget(folder.id);\n  const isOver = droppable.isOver;\n  const showValidDropHighlight = isOver && isValidTarget;\n  const showInvalidDropCursor = isOver && !isValidTarget && active != null;\n\n  return {\n    dragData,\n    draggable,\n    droppable,\n    isDragging: draggable.isDragging,\n    showValidDropHighlight,\n    showInvalidDropCursor,\n  };\n};\n"],"names":["NO_DRAG_ATTRIBUTES","withoutDrag","draggable","isDndEnabled","attributes","listeners","undefined","useFileDraggable","asset","dnd","useAssetsDndOptional","isMovePending","data","useMemo","kind","id","name","folderId","getRelationId","folder","useDraggable","toFileDraggableId","disabled","sortable","useAssetSortable","setNodeRef","isDragging","dragStyle","style","dragHandle","handle","dragData","useFolderDraggableDroppable","isValidDropTarget","active","useDndContext","parentId","parent","dropData","toFolderDraggableId","droppable","useDroppable","toFolderTargetId","isValidTarget","isOver","showValidDropHighlight","showInvalidDropCursor"],"mappings":"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"}

package/dist/admin/pages/Assets/components/DropZone/UploadDropZoneContext.js

@@ -19,9 +19,11 @@ var styledComponents = require('styled-components');
 const UploadDropZoneProvider = ({ children, onDrop, disabled = false })=>{
     const [isDragging, setIsDragging] = React.useState(false);
     const dragCounterRef = React.useRef(0);
-    const contextValue = {
+    const contextValue = React.useMemo(()=>({
+            isDragging
+        }), [
         isDragging
-    };
+    ]);
     React.useEffect(()=>{
         const handleDragEnd = ()=>{
             setIsDragging(false);

package/dist/admin/pages/Assets/components/DropZone/UploadDropZoneContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"UploadDropZoneContext.js","sources":["../../../../../../admin/src/pages/Assets/components/DropZone/UploadDropZoneContext.tsx"],"sourcesContent":["import {\n  createContext,\n  useCallback,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n  type DragEvent,\n  type ReactNode,\n} from 'react';\n\nimport { Box } from '@strapi/design-system';\nimport { styled } from 'styled-components';\n\n/* -------------------------------------------------------------------------------------------------\n * Types\n * -----------------------------------------------------------------------------------------------*/\n\ntype DropHandler = (files: File[]) => void | Promise<void>;\n\ninterface UploadDropZoneContextValue {\n  isDragging: boolean;\n}\n\n/* -------------------------------------------------------------------------------------------------\n * Context\n * -----------------------------------------------------------------------------------------------*/\n\nconst UploadDropZoneContext = createContext<UploadDropZoneContextValue | null>(null);\n\n/* -------------------------------------------------------------------------------------------------\n * Components\n * -----------------------------------------------------------------------------------------------*/\n\nconst DropZoneWrapper = styled(Box)`\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  min-height: 100%;\n`;\n\n/* -------------------------------------------------------------------------------------------------\n * Provider\n * -----------------------------------------------------------------------------------------------*/\n\ninterface UploadDropZoneProps {\n  children: ReactNode;\n  onDrop?: DropHandler;\n  /**\n   * When true, the zone never enters the dragging state and never fires\n   * `onDrop` — no overlay, no \"drop here\" invitation. Used to hide the whole\n   * upload affordance from users without `assets.create`, so they don't drag a\n   * file onto an inviting target that then silently discards it.\n   */\n  disabled?: boolean;\n}\n\nexport const UploadDropZoneProvider = ({\n  children,\n  onDrop,\n  disabled = false,\n}: UploadDropZoneProps) => {\n  const [isDragging, setIsDragging] = useState(false);\n  const dragCounterRef = useRef(0);\n\n  const contextValue: UploadDropZoneContextValue = {\n    isDragging,\n  };\n\n  useEffect(() => {\n    const handleDragEnd = () => {\n      setIsDragging(false);\n      dragCounterRef.current = 0;\n    };\n\n    // Handle drag leaving the entire document/window\n    const handleDocumentDragLeave = (e: globalThis.DragEvent) => {\n      // When relatedTarget is null, we're leaving the document entirely\n      if (!e.relatedTarget) {\n        setIsDragging(false);\n        dragCounterRef.current = 0;\n      }\n    };\n\n    document.addEventListener('dragend', handleDragEnd);\n    document.addEventListener('dragleave', handleDocumentDragLeave);\n\n    return () => {\n      document.removeEventListener('dragend', handleDragEnd);\n      document.removeEventListener('dragleave', handleDocumentDragLeave);\n    };\n  }, []);\n\n  const handleDragEnter = useCallback(\n    (e: DragEvent<HTMLElement>) => {\n      e.preventDefault();\n      e.stopPropagation();\n\n      // No upload permission → never light up the drop target.\n      if (disabled) {\n        return;\n      }\n\n      // Bidirectional guard with AssetsDndProvider — internal item drags must not\n      // activate the upload overlay. See AssetsDndProvider.tsx.\n      if (!e.dataTransfer.types.includes('Files')) {\n        return;\n      }\n\n      dragCounterRef.current += 1;\n      setIsDragging(true);\n    },\n    [disabled]\n  );\n\n  const handleDragLeave = useCallback((e: DragEvent<HTMLElement>) => {\n    e.preventDefault();\n    e.stopPropagation();\n\n    dragCounterRef.current -= 1;\n\n    // Only set dragging to false if we've left the dropzone completely\n    // (counter reaches 0 or negative)\n    if (dragCounterRef.current <= 0) {\n      setIsDragging(false);\n      dragCounterRef.current = 0;\n    }\n  }, []);\n\n  const handleDragOver = useCallback((e: DragEvent<HTMLElement>) => {\n    e.preventDefault();\n    e.stopPropagation();\n    e.dataTransfer.dropEffect = 'copy';\n  }, []);\n\n  const handleDrop = useCallback(\n    (e: DragEvent<HTMLElement>) => {\n      e.preventDefault();\n      e.stopPropagation();\n      setIsDragging(false);\n      dragCounterRef.current = 0;\n\n      if (disabled) {\n        return;\n      }\n\n      const { files } = e.dataTransfer;\n      if (files?.length && onDrop) {\n        onDrop(Array.from(files));\n      }\n    },\n    [onDrop, disabled]\n  );\n\n  return (\n    <UploadDropZoneContext.Provider value={contextValue}>\n      <DropZoneWrapper\n        data-testid=\"assets-dropzone\"\n        onDragEnter={handleDragEnter}\n        onDragLeave={handleDragLeave}\n        onDragOver={handleDragOver}\n        onDrop={handleDrop}\n      >\n        {children}\n      </DropZoneWrapper>\n    </UploadDropZoneContext.Provider>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Hook\n * -----------------------------------------------------------------------------------------------*/\n\nexport const useUploadDropZone = () => {\n  const context = useContext(UploadDropZoneContext);\n\n  if (!context) {\n    throw new Error('useUploadDropZone must be used within UploadDropZone');\n  }\n\n  return {\n    isDragging: context.isDragging,\n  };\n};\n"],"names":["UploadDropZoneContext","createContext","DropZoneWrapper","styled","Box","UploadDropZoneProvider","children","onDrop","disabled","isDragging","setIsDragging","useState","dragCounterRef","useRef","contextValue","useEffect","handleDragEnd","current","handleDocumentDragLeave","e","relatedTarget","document","addEventListener","removeEventListener","handleDragEnter","useCallback","preventDefault","stopPropagation","dataTransfer","types","includes","handleDragLeave","handleDragOver","dropEffect","handleDrop","files","length","Array","from","_jsx","Provider","value","data-testid","onDragEnter","onDragLeave","onDragOver","useUploadDropZone","context","useContext","Error"],"mappings":"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"}
+{"version":3,"file":"UploadDropZoneContext.js","sources":["../../../../../../admin/src/pages/Assets/components/DropZone/UploadDropZoneContext.tsx"],"sourcesContent":["import {\n  createContext,\n  useCallback,\n  useContext,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  type DragEvent,\n  type ReactNode,\n} from 'react';\n\nimport { Box } from '@strapi/design-system';\nimport { styled } from 'styled-components';\n\n/* -------------------------------------------------------------------------------------------------\n * Types\n * -----------------------------------------------------------------------------------------------*/\n\ntype DropHandler = (files: File[]) => void | Promise<void>;\n\ninterface UploadDropZoneContextValue {\n  isDragging: boolean;\n}\n\n/* -------------------------------------------------------------------------------------------------\n * Context\n * -----------------------------------------------------------------------------------------------*/\n\nconst UploadDropZoneContext = createContext<UploadDropZoneContextValue | null>(null);\n\n/* -------------------------------------------------------------------------------------------------\n * Components\n * -----------------------------------------------------------------------------------------------*/\n\nconst DropZoneWrapper = styled(Box)`\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  min-height: 100%;\n`;\n\n/* -------------------------------------------------------------------------------------------------\n * Provider\n * -----------------------------------------------------------------------------------------------*/\n\ninterface UploadDropZoneProps {\n  children: ReactNode;\n  onDrop?: DropHandler;\n  /**\n   * When true, the zone never enters the dragging state and never fires\n   * `onDrop` — no overlay, no \"drop here\" invitation. Used to hide the whole\n   * upload affordance from users without `assets.create`, so they don't drag a\n   * file onto an inviting target that then silently discards it.\n   */\n  disabled?: boolean;\n}\n\nexport const UploadDropZoneProvider = ({\n  children,\n  onDrop,\n  disabled = false,\n}: UploadDropZoneProps) => {\n  const [isDragging, setIsDragging] = useState(false);\n  const dragCounterRef = useRef(0);\n\n  const contextValue = useMemo<UploadDropZoneContextValue>(() => ({ isDragging }), [isDragging]);\n\n  useEffect(() => {\n    const handleDragEnd = () => {\n      setIsDragging(false);\n      dragCounterRef.current = 0;\n    };\n\n    // Handle drag leaving the entire document/window\n    const handleDocumentDragLeave = (e: globalThis.DragEvent) => {\n      // When relatedTarget is null, we're leaving the document entirely\n      if (!e.relatedTarget) {\n        setIsDragging(false);\n        dragCounterRef.current = 0;\n      }\n    };\n\n    document.addEventListener('dragend', handleDragEnd);\n    document.addEventListener('dragleave', handleDocumentDragLeave);\n\n    return () => {\n      document.removeEventListener('dragend', handleDragEnd);\n      document.removeEventListener('dragleave', handleDocumentDragLeave);\n    };\n  }, []);\n\n  const handleDragEnter = useCallback(\n    (e: DragEvent<HTMLElement>) => {\n      e.preventDefault();\n      e.stopPropagation();\n\n      // No upload permission → never light up the drop target.\n      if (disabled) {\n        return;\n      }\n\n      // Bidirectional guard with AssetsDndProvider — internal item drags must not\n      // activate the upload overlay. See AssetsDndProvider.tsx.\n      if (!e.dataTransfer.types.includes('Files')) {\n        return;\n      }\n\n      dragCounterRef.current += 1;\n      setIsDragging(true);\n    },\n    [disabled]\n  );\n\n  const handleDragLeave = useCallback((e: DragEvent<HTMLElement>) => {\n    e.preventDefault();\n    e.stopPropagation();\n\n    dragCounterRef.current -= 1;\n\n    // Only set dragging to false if we've left the dropzone completely\n    // (counter reaches 0 or negative)\n    if (dragCounterRef.current <= 0) {\n      setIsDragging(false);\n      dragCounterRef.current = 0;\n    }\n  }, []);\n\n  const handleDragOver = useCallback((e: DragEvent<HTMLElement>) => {\n    e.preventDefault();\n    e.stopPropagation();\n    e.dataTransfer.dropEffect = 'copy';\n  }, []);\n\n  const handleDrop = useCallback(\n    (e: DragEvent<HTMLElement>) => {\n      e.preventDefault();\n      e.stopPropagation();\n      setIsDragging(false);\n      dragCounterRef.current = 0;\n\n      if (disabled) {\n        return;\n      }\n\n      const { files } = e.dataTransfer;\n      if (files?.length && onDrop) {\n        onDrop(Array.from(files));\n      }\n    },\n    [onDrop, disabled]\n  );\n\n  return (\n    <UploadDropZoneContext.Provider value={contextValue}>\n      <DropZoneWrapper\n        data-testid=\"assets-dropzone\"\n        onDragEnter={handleDragEnter}\n        onDragLeave={handleDragLeave}\n        onDragOver={handleDragOver}\n        onDrop={handleDrop}\n      >\n        {children}\n      </DropZoneWrapper>\n    </UploadDropZoneContext.Provider>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Hook\n * -----------------------------------------------------------------------------------------------*/\n\nexport const useUploadDropZone = () => {\n  const context = useContext(UploadDropZoneContext);\n\n  if (!context) {\n    throw new Error('useUploadDropZone must be used within UploadDropZone');\n  }\n\n  return {\n    isDragging: context.isDragging,\n  };\n};\n"],"names":["UploadDropZoneContext","createContext","DropZoneWrapper","styled","Box","UploadDropZoneProvider","children","onDrop","disabled","isDragging","setIsDragging","useState","dragCounterRef","useRef","contextValue","useMemo","useEffect","handleDragEnd","current","handleDocumentDragLeave","e","relatedTarget","document","addEventListener","removeEventListener","handleDragEnter","useCallback","preventDefault","stopPropagation","dataTransfer","types","includes","handleDragLeave","handleDragOver","dropEffect","handleDrop","files","length","Array","from","_jsx","Provider","value","data-testid","onDragEnter","onDragLeave","onDragOver","useUploadDropZone","context","useContext","Error"],"mappings":"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"}

package/dist/admin/pages/Assets/components/DropZone/UploadDropZoneContext.mjs

@@ -1,5 +1,5 @@
 import { jsx } from 'react/jsx-runtime';
-import { useState, useRef, useEffect, useCallback, createContext, useContext } from 'react';
+import { useState, useRef, useMemo, useEffect, useCallback, createContext, useContext } from 'react';
 import { Box } from '@strapi/design-system';
 import { styled } from 'styled-components';
 
@@ -17,9 +17,11 @@ import { styled } from 'styled-components';
 const UploadDropZoneProvider = ({ children, onDrop, disabled = false })=>{
     const [isDragging, setIsDragging] = useState(false);
     const dragCounterRef = useRef(0);
-    const contextValue = {
+    const contextValue = useMemo(()=>({
+            isDragging
+        }), [
         isDragging
-    };
+    ]);
     useEffect(()=>{
         const handleDragEnd = ()=>{
             setIsDragging(false);

package/dist/admin/pages/Assets/components/DropZone/UploadDropZoneContext.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"UploadDropZoneContext.mjs","sources":["../../../../../../admin/src/pages/Assets/components/DropZone/UploadDropZoneContext.tsx"],"sourcesContent":["import {\n  createContext,\n  useCallback,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n  type DragEvent,\n  type ReactNode,\n} from 'react';\n\nimport { Box } from '@strapi/design-system';\nimport { styled } from 'styled-components';\n\n/* -------------------------------------------------------------------------------------------------\n * Types\n * -----------------------------------------------------------------------------------------------*/\n\ntype DropHandler = (files: File[]) => void | Promise<void>;\n\ninterface UploadDropZoneContextValue {\n  isDragging: boolean;\n}\n\n/* -------------------------------------------------------------------------------------------------\n * Context\n * -----------------------------------------------------------------------------------------------*/\n\nconst UploadDropZoneContext = createContext<UploadDropZoneContextValue | null>(null);\n\n/* -------------------------------------------------------------------------------------------------\n * Components\n * -----------------------------------------------------------------------------------------------*/\n\nconst DropZoneWrapper = styled(Box)`\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  min-height: 100%;\n`;\n\n/* -------------------------------------------------------------------------------------------------\n * Provider\n * -----------------------------------------------------------------------------------------------*/\n\ninterface UploadDropZoneProps {\n  children: ReactNode;\n  onDrop?: DropHandler;\n  /**\n   * When true, the zone never enters the dragging state and never fires\n   * `onDrop` — no overlay, no \"drop here\" invitation. Used to hide the whole\n   * upload affordance from users without `assets.create`, so they don't drag a\n   * file onto an inviting target that then silently discards it.\n   */\n  disabled?: boolean;\n}\n\nexport const UploadDropZoneProvider = ({\n  children,\n  onDrop,\n  disabled = false,\n}: UploadDropZoneProps) => {\n  const [isDragging, setIsDragging] = useState(false);\n  const dragCounterRef = useRef(0);\n\n  const contextValue: UploadDropZoneContextValue = {\n    isDragging,\n  };\n\n  useEffect(() => {\n    const handleDragEnd = () => {\n      setIsDragging(false);\n      dragCounterRef.current = 0;\n    };\n\n    // Handle drag leaving the entire document/window\n    const handleDocumentDragLeave = (e: globalThis.DragEvent) => {\n      // When relatedTarget is null, we're leaving the document entirely\n      if (!e.relatedTarget) {\n        setIsDragging(false);\n        dragCounterRef.current = 0;\n      }\n    };\n\n    document.addEventListener('dragend', handleDragEnd);\n    document.addEventListener('dragleave', handleDocumentDragLeave);\n\n    return () => {\n      document.removeEventListener('dragend', handleDragEnd);\n      document.removeEventListener('dragleave', handleDocumentDragLeave);\n    };\n  }, []);\n\n  const handleDragEnter = useCallback(\n    (e: DragEvent<HTMLElement>) => {\n      e.preventDefault();\n      e.stopPropagation();\n\n      // No upload permission → never light up the drop target.\n      if (disabled) {\n        return;\n      }\n\n      // Bidirectional guard with AssetsDndProvider — internal item drags must not\n      // activate the upload overlay. See AssetsDndProvider.tsx.\n      if (!e.dataTransfer.types.includes('Files')) {\n        return;\n      }\n\n      dragCounterRef.current += 1;\n      setIsDragging(true);\n    },\n    [disabled]\n  );\n\n  const handleDragLeave = useCallback((e: DragEvent<HTMLElement>) => {\n    e.preventDefault();\n    e.stopPropagation();\n\n    dragCounterRef.current -= 1;\n\n    // Only set dragging to false if we've left the dropzone completely\n    // (counter reaches 0 or negative)\n    if (dragCounterRef.current <= 0) {\n      setIsDragging(false);\n      dragCounterRef.current = 0;\n    }\n  }, []);\n\n  const handleDragOver = useCallback((e: DragEvent<HTMLElement>) => {\n    e.preventDefault();\n    e.stopPropagation();\n    e.dataTransfer.dropEffect = 'copy';\n  }, []);\n\n  const handleDrop = useCallback(\n    (e: DragEvent<HTMLElement>) => {\n      e.preventDefault();\n      e.stopPropagation();\n      setIsDragging(false);\n      dragCounterRef.current = 0;\n\n      if (disabled) {\n        return;\n      }\n\n      const { files } = e.dataTransfer;\n      if (files?.length && onDrop) {\n        onDrop(Array.from(files));\n      }\n    },\n    [onDrop, disabled]\n  );\n\n  return (\n    <UploadDropZoneContext.Provider value={contextValue}>\n      <DropZoneWrapper\n        data-testid=\"assets-dropzone\"\n        onDragEnter={handleDragEnter}\n        onDragLeave={handleDragLeave}\n        onDragOver={handleDragOver}\n        onDrop={handleDrop}\n      >\n        {children}\n      </DropZoneWrapper>\n    </UploadDropZoneContext.Provider>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Hook\n * -----------------------------------------------------------------------------------------------*/\n\nexport const useUploadDropZone = () => {\n  const context = useContext(UploadDropZoneContext);\n\n  if (!context) {\n    throw new Error('useUploadDropZone must be used within UploadDropZone');\n  }\n\n  return {\n    isDragging: context.isDragging,\n  };\n};\n"],"names":["UploadDropZoneContext","createContext","DropZoneWrapper","styled","Box","UploadDropZoneProvider","children","onDrop","disabled","isDragging","setIsDragging","useState","dragCounterRef","useRef","contextValue","useEffect","handleDragEnd","current","handleDocumentDragLeave","e","relatedTarget","document","addEventListener","removeEventListener","handleDragEnter","useCallback","preventDefault","stopPropagation","dataTransfer","types","includes","handleDragLeave","handleDragOver","dropEffect","handleDrop","files","length","Array","from","_jsx","Provider","value","data-testid","onDragEnter","onDragLeave","onDragOver","useUploadDropZone","context","useContext","Error"],"mappings":"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"}
+{"version":3,"file":"UploadDropZoneContext.mjs","sources":["../../../../../../admin/src/pages/Assets/components/DropZone/UploadDropZoneContext.tsx"],"sourcesContent":["import {\n  createContext,\n  useCallback,\n  useContext,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  type DragEvent,\n  type ReactNode,\n} from 'react';\n\nimport { Box } from '@strapi/design-system';\nimport { styled } from 'styled-components';\n\n/* -------------------------------------------------------------------------------------------------\n * Types\n * -----------------------------------------------------------------------------------------------*/\n\ntype DropHandler = (files: File[]) => void | Promise<void>;\n\ninterface UploadDropZoneContextValue {\n  isDragging: boolean;\n}\n\n/* -------------------------------------------------------------------------------------------------\n * Context\n * -----------------------------------------------------------------------------------------------*/\n\nconst UploadDropZoneContext = createContext<UploadDropZoneContextValue | null>(null);\n\n/* -------------------------------------------------------------------------------------------------\n * Components\n * -----------------------------------------------------------------------------------------------*/\n\nconst DropZoneWrapper = styled(Box)`\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  min-height: 100%;\n`;\n\n/* -------------------------------------------------------------------------------------------------\n * Provider\n * -----------------------------------------------------------------------------------------------*/\n\ninterface UploadDropZoneProps {\n  children: ReactNode;\n  onDrop?: DropHandler;\n  /**\n   * When true, the zone never enters the dragging state and never fires\n   * `onDrop` — no overlay, no \"drop here\" invitation. Used to hide the whole\n   * upload affordance from users without `assets.create`, so they don't drag a\n   * file onto an inviting target that then silently discards it.\n   */\n  disabled?: boolean;\n}\n\nexport const UploadDropZoneProvider = ({\n  children,\n  onDrop,\n  disabled = false,\n}: UploadDropZoneProps) => {\n  const [isDragging, setIsDragging] = useState(false);\n  const dragCounterRef = useRef(0);\n\n  const contextValue = useMemo<UploadDropZoneContextValue>(() => ({ isDragging }), [isDragging]);\n\n  useEffect(() => {\n    const handleDragEnd = () => {\n      setIsDragging(false);\n      dragCounterRef.current = 0;\n    };\n\n    // Handle drag leaving the entire document/window\n    const handleDocumentDragLeave = (e: globalThis.DragEvent) => {\n      // When relatedTarget is null, we're leaving the document entirely\n      if (!e.relatedTarget) {\n        setIsDragging(false);\n        dragCounterRef.current = 0;\n      }\n    };\n\n    document.addEventListener('dragend', handleDragEnd);\n    document.addEventListener('dragleave', handleDocumentDragLeave);\n\n    return () => {\n      document.removeEventListener('dragend', handleDragEnd);\n      document.removeEventListener('dragleave', handleDocumentDragLeave);\n    };\n  }, []);\n\n  const handleDragEnter = useCallback(\n    (e: DragEvent<HTMLElement>) => {\n      e.preventDefault();\n      e.stopPropagation();\n\n      // No upload permission → never light up the drop target.\n      if (disabled) {\n        return;\n      }\n\n      // Bidirectional guard with AssetsDndProvider — internal item drags must not\n      // activate the upload overlay. See AssetsDndProvider.tsx.\n      if (!e.dataTransfer.types.includes('Files')) {\n        return;\n      }\n\n      dragCounterRef.current += 1;\n      setIsDragging(true);\n    },\n    [disabled]\n  );\n\n  const handleDragLeave = useCallback((e: DragEvent<HTMLElement>) => {\n    e.preventDefault();\n    e.stopPropagation();\n\n    dragCounterRef.current -= 1;\n\n    // Only set dragging to false if we've left the dropzone completely\n    // (counter reaches 0 or negative)\n    if (dragCounterRef.current <= 0) {\n      setIsDragging(false);\n      dragCounterRef.current = 0;\n    }\n  }, []);\n\n  const handleDragOver = useCallback((e: DragEvent<HTMLElement>) => {\n    e.preventDefault();\n    e.stopPropagation();\n    e.dataTransfer.dropEffect = 'copy';\n  }, []);\n\n  const handleDrop = useCallback(\n    (e: DragEvent<HTMLElement>) => {\n      e.preventDefault();\n      e.stopPropagation();\n      setIsDragging(false);\n      dragCounterRef.current = 0;\n\n      if (disabled) {\n        return;\n      }\n\n      const { files } = e.dataTransfer;\n      if (files?.length && onDrop) {\n        onDrop(Array.from(files));\n      }\n    },\n    [onDrop, disabled]\n  );\n\n  return (\n    <UploadDropZoneContext.Provider value={contextValue}>\n      <DropZoneWrapper\n        data-testid=\"assets-dropzone\"\n        onDragEnter={handleDragEnter}\n        onDragLeave={handleDragLeave}\n        onDragOver={handleDragOver}\n        onDrop={handleDrop}\n      >\n        {children}\n      </DropZoneWrapper>\n    </UploadDropZoneContext.Provider>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Hook\n * -----------------------------------------------------------------------------------------------*/\n\nexport const useUploadDropZone = () => {\n  const context = useContext(UploadDropZoneContext);\n\n  if (!context) {\n    throw new Error('useUploadDropZone must be used within UploadDropZone');\n  }\n\n  return {\n    isDragging: context.isDragging,\n  };\n};\n"],"names":["UploadDropZoneContext","createContext","DropZoneWrapper","styled","Box","UploadDropZoneProvider","children","onDrop","disabled","isDragging","setIsDragging","useState","dragCounterRef","useRef","contextValue","useMemo","useEffect","handleDragEnd","current","handleDocumentDragLeave","e","relatedTarget","document","addEventListener","removeEventListener","handleDragEnter","useCallback","preventDefault","stopPropagation","dataTransfer","types","includes","handleDragLeave","handleDragOver","dropEffect","handleDrop","files","length","Array","from","_jsx","Provider","value","data-testid","onDragEnter","onDragLeave","onDragOver","useUploadDropZone","context","useContext","Error"],"mappings":";;;;;AAyBA;;qGAIA,MAAMA,sCAAwBC,aAAAA,CAAiD,IAAA,CAAA;AAE/E;;AAEkG,qGAElG,MAAMC,eAAAA,GAAkBC,MAAAA,CAAOC,GAAAA,CAAI;;;;;AAKnC,CAAC;AAkBM,MAAMC,sBAAAA,GAAyB,CAAC,EACrCC,QAAQ,EACRC,MAAM,EACNC,QAAAA,GAAW,KAAK,EACI,GAAA;AACpB,IAAA,MAAM,CAACC,UAAAA,EAAYC,aAAAA,CAAc,GAAGC,QAAAA,CAAS,KAAA,CAAA;AAC7C,IAAA,MAAMC,iBAAiBC,MAAAA,CAAO,CAAA,CAAA;IAE9B,MAAMC,YAAAA,GAAeC,OAAAA,CAAoC,KAAO;AAAEN,YAAAA;AAAW,SAAA,CAAA,EAAI;AAACA,QAAAA;AAAW,KAAA,CAAA;IAE7FO,SAAAA,CAAU,IAAA;AACR,QAAA,MAAMC,aAAAA,GAAgB,IAAA;YACpBP,aAAAA,CAAc,KAAA,CAAA;AACdE,YAAAA,cAAAA,CAAeM,OAAO,GAAG,CAAA;AAC3B,QAAA,CAAA;;AAGA,QAAA,MAAMC,0BAA0B,CAACC,CAAAA,GAAAA;;YAE/B,IAAI,CAACA,CAAAA,CAAEC,aAAa,EAAE;gBACpBX,aAAAA,CAAc,KAAA,CAAA;AACdE,gBAAAA,cAAAA,CAAeM,OAAO,GAAG,CAAA;AAC3B,YAAA;AACF,QAAA,CAAA;QAEAI,QAAAA,CAASC,gBAAgB,CAAC,SAAA,EAAWN,aAAAA,CAAAA;QACrCK,QAAAA,CAASC,gBAAgB,CAAC,WAAA,EAAaJ,uBAAAA,CAAAA;QAEvC,OAAO,IAAA;YACLG,QAAAA,CAASE,mBAAmB,CAAC,SAAA,EAAWP,aAAAA,CAAAA;YACxCK,QAAAA,CAASE,mBAAmB,CAAC,WAAA,EAAaL,uBAAAA,CAAAA;AAC5C,QAAA,CAAA;AACF,IAAA,CAAA,EAAG,EAAE,CAAA;IAEL,MAAMM,eAAAA,GAAkBC,YACtB,CAACN,CAAAA,GAAAA;AACCA,QAAAA,CAAAA,CAAEO,cAAc,EAAA;AAChBP,QAAAA,CAAAA,CAAEQ,eAAe,EAAA;;AAGjB,QAAA,IAAIpB,QAAAA,EAAU;AACZ,YAAA;AACF,QAAA;;;QAIA,IAAI,CAACY,EAAES,YAAY,CAACC,KAAK,CAACC,QAAQ,CAAC,OAAA,CAAA,EAAU;AAC3C,YAAA;AACF,QAAA;AAEAnB,QAAAA,cAAAA,CAAeM,OAAO,IAAI,CAAA;QAC1BR,aAAAA,CAAc,IAAA,CAAA;IAChB,CAAA,EACA;AAACF,QAAAA;AAAS,KAAA,CAAA;IAGZ,MAAMwB,eAAAA,GAAkBN,YAAY,CAACN,CAAAA,GAAAA;AACnCA,QAAAA,CAAAA,CAAEO,cAAc,EAAA;AAChBP,QAAAA,CAAAA,CAAEQ,eAAe,EAAA;AAEjBhB,QAAAA,cAAAA,CAAeM,OAAO,IAAI,CAAA;;;QAI1B,IAAIN,cAAAA,CAAeM,OAAO,IAAI,CAAA,EAAG;YAC/BR,aAAAA,CAAc,KAAA,CAAA;AACdE,YAAAA,cAAAA,CAAeM,OAAO,GAAG,CAAA;AAC3B,QAAA;AACF,IAAA,CAAA,EAAG,EAAE,CAAA;IAEL,MAAMe,cAAAA,GAAiBP,YAAY,CAACN,CAAAA,GAAAA;AAClCA,QAAAA,CAAAA,CAAEO,cAAc,EAAA;AAChBP,QAAAA,CAAAA,CAAEQ,eAAe,EAAA;QACjBR,CAAAA,CAAES,YAAY,CAACK,UAAU,GAAG,MAAA;AAC9B,IAAA,CAAA,EAAG,EAAE,CAAA;IAEL,MAAMC,UAAAA,GAAaT,YACjB,CAACN,CAAAA,GAAAA;AACCA,QAAAA,CAAAA,CAAEO,cAAc,EAAA;AAChBP,QAAAA,CAAAA,CAAEQ,eAAe,EAAA;QACjBlB,aAAAA,CAAc,KAAA,CAAA;AACdE,QAAAA,cAAAA,CAAeM,OAAO,GAAG,CAAA;AAEzB,QAAA,IAAIV,QAAAA,EAAU;AACZ,YAAA;AACF,QAAA;AAEA,QAAA,MAAM,EAAE4B,KAAK,EAAE,GAAGhB,EAAES,YAAY;QAChC,IAAIO,KAAAA,EAAOC,UAAU9B,MAAAA,EAAQ;YAC3BA,MAAAA,CAAO+B,KAAAA,CAAMC,IAAI,CAACH,KAAAA,CAAAA,CAAAA;AACpB,QAAA;IACF,CAAA,EACA;AAAC7B,QAAAA,MAAAA;AAAQC,QAAAA;AAAS,KAAA,CAAA;IAGpB,qBACEgC,GAAA,CAACxC,sBAAsByC,QAAQ,EAAA;QAACC,KAAAA,EAAO5B,YAAAA;AACrC,QAAA,QAAA,gBAAA0B,GAAA,CAACtC,eAAAA,EAAAA;YACCyC,aAAAA,EAAY,iBAAA;YACZC,WAAAA,EAAanB,eAAAA;YACboB,WAAAA,EAAab,eAAAA;YACbc,UAAAA,EAAYb,cAAAA;YACZ1B,MAAAA,EAAQ4B,UAAAA;AAEP7B,YAAAA,QAAAA,EAAAA;;;AAIT;AAEA;;2GAIayC,iBAAAA,GAAoB,IAAA;AAC/B,IAAA,MAAMC,UAAUC,UAAAA,CAAWjD,qBAAAA,CAAAA;AAE3B,IAAA,IAAI,CAACgD,OAAAA,EAAS;AACZ,QAAA,MAAM,IAAIE,KAAAA,CAAM,sDAAA,CAAA;AAClB,IAAA;IAEA,OAAO;AACLzC,QAAAA,UAAAA,EAAYuC,QAAQvC;AACtB,KAAA;AACF;;;;"}

package/dist/admin/pages/Assets/components/FilterBadges.js

@@ -397,6 +397,32 @@ const BadgesRoot = styledComponents.styled(designSystem.Flex)`
 `;
 const FilterBadges = ({ listFilters, compact = false })=>{
     const { filters, updateFilter, removeFilter } = listFilters;
+    /**
+   * Stable per-slot keys held in a ref. The ref is written during render, but
+   * the bookkeeping depends on the list length rather than on how often render
+   * runs, so the second pass of a StrictMode double render sees equal lengths
+   * and does nothing. A content-derived key fails twice over here: filters may
+   * legitimately repeat, and the key would change while the user edits a badge,
+   * remounting the badge under its open popover.
+   */ const filterKeyPrefix = React.useId();
+    const nextFilterKey = React.useRef(0);
+    const filterKeys = React.useRef([]);
+    while(filterKeys.current.length < filters.length){
+        filterKeys.current.push(`${filterKeyPrefix}-${nextFilterKey.current}`);
+        nextFilterKey.current += 1;
+    }
+    /**
+   * Keys are truncated from the tail. The `onRemove` closure below splices the
+   * removed slot out first, so removal through this component is correct. Any
+   * other shrink path (browser back or forward, an external filter reset)
+   * shifts the remaining keys and degrades to the index keys this replaced.
+   * Known and accepted.
+   */ filterKeys.current.length = filters.length;
+    const filtersWithKeys = filters.map((filter, index)=>({
+            filter,
+            index,
+            key: filterKeys.current[index]
+        }));
     if (filters.length === 0) {
         return null;
     }
@@ -405,11 +431,14 @@ const FilterBadges = ({ listFilters, compact = false })=>{
         gap: 2,
         wrap: "wrap",
         "data-testid": "filter-badges",
-        children: filters.map((filter, index)=>/*#__PURE__*/ jsxRuntime.jsx(FilterBadge, {
+        children: filtersWithKeys.map(({ filter, index, key })=>/*#__PURE__*/ jsxRuntime.jsx(FilterBadge, {
                 filter: filter,
                 onChange: (next)=>updateFilter(index, next),
-                onRemove: ()=>removeFilter(index)
-            }, index))
+                onRemove: ()=>{
+                    filterKeys.current.splice(index, 1);
+                    removeFilter(index);
+                }
+            }, key))
     });
 };