@strapi/content-manager 5.32.0 → 5.33.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/admin/components/ConfigurationForm/Fields.js +74 -14
- package/dist/admin/components/ConfigurationForm/Fields.js.map +1 -1
- package/dist/admin/components/ConfigurationForm/Fields.mjs +75 -15
- package/dist/admin/components/ConfigurationForm/Fields.mjs.map +1 -1
- package/dist/admin/hooks/useDocument.js +0 -1
- package/dist/admin/hooks/useDocument.js.map +1 -1
- package/dist/admin/hooks/useDocument.mjs +0 -1
- package/dist/admin/hooks/useDocument.mjs.map +1 -1
- package/dist/admin/hooks/useDocumentActions.js +0 -1
- package/dist/admin/hooks/useDocumentActions.js.map +1 -1
- package/dist/admin/hooks/useDocumentActions.mjs +0 -1
- package/dist/admin/hooks/useDocumentActions.mjs.map +1 -1
- package/dist/admin/src/hooks/useDocument.d.ts +0 -1
- package/dist/admin/src/hooks/useDocumentActions.d.ts +0 -1
- package/package.json +5 -5
|
@@ -46,13 +46,22 @@ const GRID_COLUMNS = 12;
|
|
|
46
46
|
return children(droppable);
|
|
47
47
|
};
|
|
48
48
|
const SortableItem = ({ id, children })=>{
|
|
49
|
-
const { attributes, setNodeRef, transform, transition } = sortable.useSortable({
|
|
49
|
+
const { attributes, setNodeRef, transform, transition, isDragging } = sortable.useSortable({
|
|
50
50
|
id
|
|
51
51
|
});
|
|
52
52
|
const style = {
|
|
53
|
-
transform: utilities.CSS.Transform.toString(
|
|
53
|
+
transform: utilities.CSS.Transform.toString({
|
|
54
|
+
x: transform?.x ?? 0,
|
|
55
|
+
y: transform?.y ?? 0,
|
|
56
|
+
// Avoid any scaling animations which can visually "squish" or
|
|
57
|
+
// "stretch" neighbouring cards in mixed-width grids (4/8/12 cols).
|
|
58
|
+
scaleX: 1,
|
|
59
|
+
scaleY: 1
|
|
60
|
+
}),
|
|
54
61
|
transition,
|
|
55
|
-
height: '100%'
|
|
62
|
+
height: '100%',
|
|
63
|
+
opacity: isDragging ? 0.6 : 1,
|
|
64
|
+
outlineOffset: 2
|
|
56
65
|
};
|
|
57
66
|
return /*#__PURE__*/ jsxRuntime.jsx("div", {
|
|
58
67
|
ref: setNodeRef,
|
|
@@ -200,6 +209,7 @@ const Fields = ({ attributes, fieldSizes, components, metadatas = {} })=>{
|
|
|
200
209
|
const draggedItem = getItemFromContainer(active.id, containersAsDictionary[activeContainer]);
|
|
201
210
|
const overItem = getItemFromContainer(over?.id ?? '', containersAsDictionary[overContainer]);
|
|
202
211
|
const overIndex = containersAsDictionary[overContainer].children.findIndex((item)=>item.dndId === over?.id);
|
|
212
|
+
const activeIndex = containersAsDictionary[activeContainer].children.findIndex((item)=>item.dndId === active.id);
|
|
203
213
|
if (!draggedItem) return;
|
|
204
214
|
// Handle a full width field being dragged
|
|
205
215
|
if (draggedItem?.size === GRID_COLUMNS) {
|
|
@@ -214,28 +224,77 @@ const Fields = ({ attributes, fieldSizes, components, metadatas = {} })=>{
|
|
|
214
224
|
/**
|
|
215
225
|
* Handle an item being dragged from one container to another,
|
|
216
226
|
* the item is removed from its current container, and then added to its new container
|
|
217
|
-
* An item can only be added in a container if there is enough space
|
|
227
|
+
* An item can only be added in a container if there is enough space
|
|
218
228
|
*/ const update = immer.produce(containers, (draft)=>{
|
|
219
229
|
draft[activeContainerIndex].children = draft[activeContainerIndex].children.filter((item)=>item.dndId !== active.id);
|
|
220
|
-
const
|
|
230
|
+
const targetChildren = draft[overContainerIndex].children;
|
|
231
|
+
const spaceTaken = targetChildren.reduce((acc, curr)=>{
|
|
221
232
|
if (curr.name === TEMP_FIELD_NAME) {
|
|
222
233
|
return acc;
|
|
223
234
|
}
|
|
224
235
|
return acc + curr.size;
|
|
225
236
|
}, 0);
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
237
|
+
const isNotEnoughSpace = spaceTaken + draggedItem.size > GRID_COLUMNS;
|
|
238
|
+
const canSwapSameSizeItem = overItem && overItem.name !== TEMP_FIELD_NAME && overItem.size === draggedItem.size && activeIndex !== -1 && overIndex !== -1;
|
|
239
|
+
const canCreateNewRowForItem = activeContainerIndex !== overContainerIndex && GRID_COLUMNS - spaceTaken === 0;
|
|
240
|
+
const isHoveringOverSpacer = overItem?.name === TEMP_FIELD_NAME;
|
|
241
|
+
/**
|
|
242
|
+
* Not enough space in the hovered row
|
|
243
|
+
*
|
|
244
|
+
* We still want:
|
|
245
|
+
* - ability to swap items of the same size
|
|
246
|
+
* - ability to create a single extra row to host the dragged item
|
|
247
|
+
* when surrounding rows are full
|
|
248
|
+
*/ if (isNotEnoughSpace) {
|
|
249
|
+
// Try a simple swap when target item is of the same size
|
|
250
|
+
if (canSwapSameSizeItem) {
|
|
251
|
+
const sourceChildren = draft[activeContainerIndex].children;
|
|
252
|
+
// Put the hovered item back where the dragged item came from
|
|
253
|
+
sourceChildren.splice(activeIndex, 0, overItem);
|
|
254
|
+
// Swap the hovered item with the dragged one in the target row
|
|
255
|
+
const draftOverIndex = targetChildren.findIndex((item)=>item.dndId === overItem.dndId);
|
|
256
|
+
if (draftOverIndex !== -1) {
|
|
257
|
+
targetChildren.splice(draftOverIndex, 1, draggedItem);
|
|
258
|
+
}
|
|
259
|
+
return;
|
|
260
|
+
}
|
|
261
|
+
// If there is absolutely no space left in the target row and the
|
|
262
|
+
// dragged item comes from a different row, add it to a new row
|
|
263
|
+
if (canCreateNewRowForItem) {
|
|
264
|
+
const insertIndex = overContainerIndex + 1;
|
|
265
|
+
const existingRow = draft[insertIndex];
|
|
266
|
+
if (existingRow) {
|
|
267
|
+
const nonTempChildren = existingRow.children.filter((child)=>child.name !== TEMP_FIELD_NAME);
|
|
268
|
+
const isNextRowEmpty = nonTempChildren.length === 0;
|
|
269
|
+
// If the row directly after is empty (only spacers), reuse it
|
|
270
|
+
// instead of creating yet another row.
|
|
271
|
+
if (isNextRowEmpty) {
|
|
272
|
+
existingRow.children = [
|
|
273
|
+
draggedItem
|
|
274
|
+
];
|
|
275
|
+
return;
|
|
276
|
+
}
|
|
277
|
+
}
|
|
278
|
+
const newContainerPrototype = draft[overContainerIndex];
|
|
279
|
+
const newContainerId = `container-${draft.length}`;
|
|
280
|
+
draft.splice(insertIndex, 0, {
|
|
281
|
+
...newContainerPrototype,
|
|
282
|
+
dndId: newContainerId,
|
|
283
|
+
children: [
|
|
284
|
+
draggedItem
|
|
285
|
+
]
|
|
286
|
+
});
|
|
287
|
+
return;
|
|
288
|
+
}
|
|
231
289
|
}
|
|
232
|
-
|
|
290
|
+
// There is enough room in the target row
|
|
291
|
+
if (isHoveringOverSpacer) {
|
|
233
292
|
// We are over an invisible spacer, replace it with the dragged item
|
|
234
|
-
|
|
293
|
+
targetChildren.splice(overIndex, 1, draggedItem);
|
|
235
294
|
return;
|
|
236
295
|
}
|
|
237
296
|
// There is room for the item in the container, drop it
|
|
238
|
-
|
|
297
|
+
targetChildren.splice(overIndex, 0, draggedItem);
|
|
239
298
|
});
|
|
240
299
|
setContainers(update);
|
|
241
300
|
},
|
|
@@ -254,7 +313,7 @@ const Fields = ({ attributes, fieldSizes, components, metadatas = {} })=>{
|
|
|
254
313
|
const movedContainerItems = immer.produce(containersAsDictionary, (draft)=>{
|
|
255
314
|
if (activeIndex !== overIndex && activeContainer === overContainer) {
|
|
256
315
|
// Move items around inside their own container
|
|
257
|
-
draft[activeContainer].children = sortable.
|
|
316
|
+
draft[activeContainer].children = sortable.arraySwap(draft[activeContainer].children, activeIndex, overIndex);
|
|
258
317
|
}
|
|
259
318
|
});
|
|
260
319
|
// Remove properties the server does not expect before updating the form
|
|
@@ -312,6 +371,7 @@ const Fields = ({ attributes, fieldSizes, components, metadatas = {} })=>{
|
|
|
312
371
|
items: container.children.map((child)=>({
|
|
313
372
|
id: child.dndId
|
|
314
373
|
})),
|
|
374
|
+
strategy: sortable.rectSwappingStrategy,
|
|
315
375
|
children: /*#__PURE__*/ jsxRuntime.jsx(DroppableContainer, {
|
|
316
376
|
id: container.dndId,
|
|
317
377
|
children: ({ setNodeRef })=>/*#__PURE__*/ jsxRuntime.jsx(designSystem.Grid.Root, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Fields.js","sources":["../../../../admin/src/components/ConfigurationForm/Fields.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { useDroppable, DndContext, UniqueIdentifier, DragOverlay } from '@dnd-kit/core';\nimport { arrayMove, SortableContext, useSortable } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport { useField, useForm, useIsDesktop } from '@strapi/admin/strapi-admin';\nimport {\n Modal,\n Box,\n Flex,\n Grid,\n IconButton,\n IconButtonComponent,\n Typography,\n Link,\n Menu,\n} from '@strapi/design-system';\nimport { Cog, Cross, Drag, Pencil, Plus } from '@strapi/icons';\nimport { generateNKeysBetween as generateNKeysBetweenImpl } from 'fractional-indexing';\nimport { produce } from 'immer';\nimport { useIntl } from 'react-intl';\nimport { NavLink } from 'react-router-dom';\nimport { styled } from 'styled-components';\n\nimport { getTranslation } from '../../utils/translations';\nimport { ComponentIcon } from '../ComponentIcon';\n\nimport { EditFieldForm, EditFieldFormProps } from './EditFieldForm';\n\nimport type { ConfigurationFormData, EditFieldSpacerLayout } from './Form';\nimport type { EditLayout } from '../../hooks/useDocumentLayout';\n\ntype FormField = ConfigurationFormData['layout'][number]['children'][number];\ntype Field = Omit<ConfigurationFormData['layout'][number]['children'][number], '__temp_key__'>;\n\nconst GRID_COLUMNS = 12;\n\n/* -------------------------------------------------------------------------------------------------\n * Drag and Drop\n * -----------------------------------------------------------------------------------------------*/\n\nconst DroppableContainer = ({\n id,\n children,\n}: {\n id: string;\n children: (props: ReturnType<typeof useDroppable>) => React.ReactNode;\n}) => {\n const droppable = useDroppable({\n id,\n });\n\n return children(droppable);\n};\n\nexport const SortableItem = ({ id, children }: { id: string; children: React.ReactNode }) => {\n const { attributes, setNodeRef, transform, transition } = useSortable({\n id,\n });\n\n const style = {\n transform: CSS.Transform.toString(transform),\n transition,\n height: '100%',\n };\n\n return (\n <div ref={setNodeRef} style={style} {...attributes}>\n {children}\n </div>\n );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Fields\n * -----------------------------------------------------------------------------------------------*/\n\ninterface FieldsProps extends Pick<EditLayout, 'metadatas'>, Pick<FieldProps, 'components'> {\n attributes: {\n [key: string]: FieldProps['attribute'];\n };\n fieldSizes: Record<string, number>;\n components: EditLayout['components'];\n}\n\n/**\n * Compute uids and formName for drag and drop items for the incoming layout\n */\nconst createDragAndDropContainersFromLayout = (layout: ConfigurationFormData['layout']) => {\n return layout.map((row, containerIndex) => ({\n ...row,\n // Use unique ids for drag and drop items\n dndId: `container-${containerIndex}`,\n children: row.children.map((child, childIndex) => ({\n ...child,\n dndId: `container-${containerIndex}-child-${childIndex}`,\n\n // The formName must be recomputed each time an item is moved\n formName: `layout.${containerIndex}.children.${childIndex}`,\n })),\n }));\n};\n\nconst Fields = ({ attributes, fieldSizes, components, metadatas = {} }: FieldsProps) => {\n const { formatMessage } = useIntl();\n\n const layout = useForm<ConfigurationFormData['layout']>(\n 'Fields',\n (state) => state.values.layout ?? []\n );\n\n const onChange = useForm('Fields', (state) => state.onChange);\n const addFieldRow = useForm('Fields', (state) => state.addFieldRow);\n const removeFieldRow = useForm('Fields', (state) => state.removeFieldRow);\n\n const existingFields = layout.map((row) => row.children.map((field) => field.name)).flat();\n\n /**\n * Get the fields that are not already in the layout\n * But also check that they are visible before we give users\n * the option to display them. e.g. `id` is not visible.\n */\n const remainingFields = Object.entries(metadatas).reduce<Field[]>((acc, current) => {\n const [name, { visible, ...field }] = current;\n\n if (!existingFields.includes(name) && visible === true) {\n const type = attributes[name]?.type;\n const size = type ? fieldSizes[type] : GRID_COLUMNS;\n\n acc.push({\n ...field,\n label: field.label ?? name,\n name,\n size,\n });\n }\n\n return acc;\n }, []);\n\n const handleRemoveField =\n (rowIndex: number, fieldIndex: number): FieldProps['onRemoveField'] =>\n () => {\n if (layout[rowIndex].children.length === 1) {\n removeFieldRow(`layout`, rowIndex);\n } else {\n onChange(`layout.${rowIndex}.children`, [\n ...layout[rowIndex].children.slice(0, fieldIndex),\n ...layout[rowIndex].children.slice(fieldIndex + 1),\n ]);\n }\n };\n\n const handleAddField = (field: Field) => () => {\n addFieldRow('layout', { children: [field] });\n };\n\n const [containers, setContainers] = React.useState(() =>\n createDragAndDropContainersFromLayout(layout)\n );\n type Container = (typeof containers)[number];\n const [activeDragItem, setActiveDragItem] = React.useState<Container['children'][number] | null>(\n null\n );\n\n /**\n * Finds either the parent container id or the child id within a container\n */\n function findContainer(id: UniqueIdentifier, containersAsDictionary: Record<string, Container>) {\n // If the id is a key, then it is the parent container\n if (id in containersAsDictionary) {\n return id;\n }\n\n // Otherwise, it is a child inside a container\n return Object.keys(containersAsDictionary).find((key) =>\n containersAsDictionary[key].children.find((child) => child.dndId === id)\n );\n }\n\n /**\n * Gets an item from a container based on its id\n */\n const getItemFromContainer = (id: UniqueIdentifier, container: Container) => {\n return container.children.find((item) => id === item.dndId);\n };\n\n /**\n * Gets the containers as dictionary for quick lookup\n */\n const getContainersAsDictionary = () => {\n return Object.fromEntries(containers.map((container) => [container.dndId, container]));\n };\n\n /**\n * Recomputes the empty space in the grid\n */\n const createContainersWithSpacers = (layout: typeof containers) => {\n return layout\n .map((row) => ({\n ...row,\n children: row.children.filter((field) => field.name !== TEMP_FIELD_NAME),\n }))\n .filter((row) => row.children.length > 0)\n .map((row) => {\n const totalSpaceTaken = row.children.reduce((acc, curr) => acc + curr.size, 0);\n\n if (totalSpaceTaken < GRID_COLUMNS) {\n const [spacerKey] = generateNKeysBetweenImpl(\n row.children.at(-1)?.__temp_key__,\n undefined,\n 1\n );\n\n return {\n ...row,\n children: [\n ...row.children,\n {\n name: TEMP_FIELD_NAME,\n size: GRID_COLUMNS - totalSpaceTaken,\n __temp_key__: spacerKey,\n } satisfies EditFieldSpacerLayout,\n ],\n };\n }\n\n return row;\n });\n };\n\n /**\n * When layout changes (e.g. when a field size is changed or the containers are reordered)\n * we need to update the ids and form names\n */\n React.useEffect(() => {\n const containers = createDragAndDropContainersFromLayout(layout);\n setContainers(containers);\n }, [layout, setContainers]);\n\n return (\n <DndContext\n onDragStart={(event) => {\n const containersAsDictionary = getContainersAsDictionary();\n\n const activeContainer = findContainer(event.active.id, containersAsDictionary);\n\n if (!activeContainer) return;\n\n const activeItem = getItemFromContainer(\n event.active.id,\n containersAsDictionary[activeContainer]\n );\n\n if (activeItem) {\n setActiveDragItem(activeItem);\n }\n }}\n onDragOver={({ active, over }) => {\n const containersAsDictionary = getContainersAsDictionary();\n const activeContainer = findContainer(active.id, containersAsDictionary);\n const overContainer = findContainer(over?.id ?? '', containersAsDictionary);\n const activeContainerIndex = containers.findIndex(\n (container) => container.dndId === activeContainer\n );\n const overContainerIndex = containers.findIndex(\n (container) => container.dndId === overContainer\n );\n\n if (!activeContainer || !overContainer) {\n return;\n }\n\n const draggedItem = getItemFromContainer(\n active.id,\n containersAsDictionary[activeContainer]\n );\n const overItem = getItemFromContainer(\n over?.id ?? '',\n containersAsDictionary[overContainer]\n );\n const overIndex = containersAsDictionary[overContainer].children.findIndex(\n (item) => item.dndId === over?.id\n );\n\n if (!draggedItem) return;\n\n // Handle a full width field being dragged\n if (draggedItem?.size === GRID_COLUMNS) {\n // Swap the items in the containers\n const update = produce(containers, (draft) => {\n draft[activeContainerIndex].children = containers[overContainerIndex].children;\n draft[overContainerIndex].children = containers[activeContainerIndex].children;\n });\n setContainers(update);\n return;\n }\n\n /**\n * Handle an item being dragged from one container to another,\n * the item is removed from its current container, and then added to its new container\n * An item can only be added in a container if there is enough space.\n */\n const update = produce(containers, (draft) => {\n draft[activeContainerIndex].children = draft[activeContainerIndex].children.filter(\n (item) => item.dndId !== active.id\n );\n const spaceTaken = draft[overContainerIndex].children.reduce((acc, curr) => {\n if (curr.name === TEMP_FIELD_NAME) {\n return acc;\n }\n\n return acc + curr.size;\n }, 0);\n\n // Check the sizes of the children, if there is no room, exit\n if (spaceTaken + draggedItem.size > GRID_COLUMNS) {\n // Leave the item where it started\n draft[activeContainerIndex].children = containers[activeContainerIndex].children;\n return;\n }\n\n if (overItem?.name === TEMP_FIELD_NAME) {\n // We are over an invisible spacer, replace it with the dragged item\n draft[overContainerIndex].children.splice(overIndex, 1, draggedItem);\n return;\n }\n\n // There is room for the item in the container, drop it\n draft[overContainerIndex].children.splice(overIndex, 0, draggedItem);\n });\n\n setContainers(update);\n }}\n onDragEnd={(event) => {\n const { active, over } = event;\n const { id } = active;\n const overId = over?.id;\n const containersAsDictionary = getContainersAsDictionary();\n const activeContainer = findContainer(id, containersAsDictionary);\n const overContainer = findContainer(overId!, containersAsDictionary);\n\n if (!activeContainer || !overContainer) {\n return;\n }\n\n const activeIndex = containersAsDictionary[activeContainer].children.findIndex(\n (children) => children.dndId === id\n );\n const overIndex = containersAsDictionary[overContainer].children.findIndex(\n (children) => children.dndId === overId\n );\n\n const movedContainerItems = produce(containersAsDictionary, (draft) => {\n if (activeIndex !== overIndex && activeContainer === overContainer) {\n // Move items around inside their own container\n draft[activeContainer].children = arrayMove(\n draft[activeContainer].children,\n activeIndex,\n overIndex\n );\n }\n });\n\n // Remove properties the server does not expect before updating the form\n const updatedContainers = Object.values(movedContainerItems);\n const updatedContainersWithSpacers = createContainersWithSpacers(\n updatedContainers\n ) as typeof containers;\n const updatedLayout = updatedContainersWithSpacers.map(\n ({ dndId: _dndId, children, ...container }) => ({\n ...container,\n children: children.map(({ dndId: _dndId, formName: _formName, ...child }) => child),\n })\n );\n\n // Update the layout\n onChange('layout', updatedLayout);\n setActiveDragItem(null);\n }}\n >\n <Flex paddingTop={6} direction=\"column\" alignItems=\"stretch\" gap={4}>\n <Flex alignItems=\"flex-start\" direction=\"column\" justifyContent=\"space-between\">\n <Typography fontWeight=\"bold\">\n {formatMessage({\n id: getTranslation('containers.list.displayedFields'),\n defaultMessage: 'Displayed fields',\n })}\n </Typography>\n <Typography variant=\"pi\" textColor=\"neutral600\">\n {formatMessage({\n id: 'containers.SettingPage.editSettings.description',\n defaultMessage: 'Drag & drop the fields to build the layout',\n })}\n </Typography>\n </Flex>\n <Box padding={4} hasRadius borderStyle=\"dashed\" borderWidth=\"1px\" borderColor=\"neutral300\">\n <Flex direction=\"column\" alignItems=\"stretch\" gap={2}>\n {containers.map((container, containerIndex) => (\n <SortableContext\n key={container.dndId}\n id={container.dndId}\n items={container.children.map((child) => ({ id: child.dndId }))}\n >\n <DroppableContainer id={container.dndId}>\n {({ setNodeRef }) => (\n <Grid.Root key={container.dndId} ref={setNodeRef} gap={2}>\n {container.children.map((child, childIndex) => (\n <Grid.Item\n col={child.size}\n xs={12}\n key={child.dndId}\n direction=\"column\"\n alignItems=\"stretch\"\n >\n <SortableItem id={child.dndId}>\n <Field\n attribute={attributes[child.name]}\n components={components}\n name={child.formName}\n onRemoveField={handleRemoveField(containerIndex, childIndex)}\n dndId={child.dndId}\n />\n </SortableItem>\n </Grid.Item>\n ))}\n </Grid.Root>\n )}\n </DroppableContainer>\n </SortableContext>\n ))}\n <DragOverlay>\n {activeDragItem ? (\n <Field\n attribute={attributes[activeDragItem.name]}\n components={components}\n name={activeDragItem.formName}\n dndId={activeDragItem.dndId}\n />\n ) : null}\n </DragOverlay>\n <Menu.Root>\n <Menu.Trigger\n startIcon={<Plus />}\n endIcon={null}\n disabled={remainingFields.length === 0}\n fullWidth\n variant=\"secondary\"\n >\n {formatMessage({\n id: getTranslation('containers.SettingPage.add.field'),\n defaultMessage: 'Insert another field',\n })}\n </Menu.Trigger>\n <Menu.Content>\n {remainingFields.map((field) => (\n <Menu.Item key={field.name} onSelect={handleAddField(field)}>\n {field.label}\n </Menu.Item>\n ))}\n </Menu.Content>\n </Menu.Root>\n </Flex>\n </Box>\n </Flex>\n </DndContext>\n );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Field\n * -----------------------------------------------------------------------------------------------*/\n\ninterface FieldProps extends Pick<EditFieldFormProps, 'name' | 'attribute'> {\n components: EditLayout['components'];\n dndId: string;\n onRemoveField?: React.MouseEventHandler<HTMLButtonElement>;\n}\n\nconst TEMP_FIELD_NAME = '_TEMP_';\n\n/**\n * Displays a field in the layout with drag options, also\n * opens a modal to edit the details of said field.\n */\nconst Field = ({ attribute, components, name, onRemoveField, dndId }: FieldProps) => {\n const isDesktop = useIsDesktop();\n const [isModalOpen, setIsModalOpen] = React.useState(false);\n const { formatMessage } = useIntl();\n const { value } = useField<FormField>(name);\n const { listeners, setActivatorNodeRef } = useSortable({\n id: dndId,\n });\n\n const handleRemoveField: React.MouseEventHandler<HTMLButtonElement> = (e) => {\n e.preventDefault();\n e.stopPropagation();\n if (onRemoveField) {\n onRemoveField?.(e);\n }\n };\n\n const onEditFieldMeta: React.MouseEventHandler<HTMLButtonElement> = (e) => {\n e.preventDefault();\n e.stopPropagation();\n setIsModalOpen(true);\n };\n\n if (!value) {\n return null;\n }\n\n if (value.name === TEMP_FIELD_NAME) {\n return <Flex tag=\"span\" height=\"100%\" style={{ opacity: 0 }} />;\n }\n\n if (!attribute) {\n return null;\n }\n\n return (\n <Modal.Root open={isModalOpen} onOpenChange={setIsModalOpen}>\n <Flex\n borderColor=\"neutral150\"\n background=\"neutral100\"\n hasRadius\n gap={3}\n cursor=\"pointer\"\n onClick={() => {\n setIsModalOpen(true);\n }}\n position=\"relative\"\n >\n {isDesktop && (\n <DragButton\n ref={setActivatorNodeRef}\n tag=\"span\"\n withTooltip={false}\n label={formatMessage(\n {\n id: getTranslation('components.DraggableCard.move.field'),\n defaultMessage: 'Move {item}',\n },\n { item: value.label }\n )}\n {...listeners}\n >\n <Drag />\n </DragButton>\n )}\n <Flex direction=\"column\" alignItems=\"flex-start\" grow={1} overflow=\"hidden\">\n <Flex gap={3} justifyContent=\"space-between\" width=\"100%\">\n <Typography ellipsis fontWeight=\"bold\">\n {value.label}\n </Typography>\n <Flex position=\"relative\">\n <IconButton\n type=\"button\"\n variant=\"ghost\"\n background=\"transparent\"\n onClick={onEditFieldMeta}\n withTooltip={false}\n label={formatMessage(\n {\n id: getTranslation('components.DraggableCard.edit.field'),\n defaultMessage: 'Edit {item}',\n },\n { item: value.label }\n )}\n >\n <Pencil />\n </IconButton>\n <IconButton\n type=\"button\"\n variant=\"ghost\"\n onClick={handleRemoveField}\n background=\"transparent\"\n withTooltip={false}\n label={formatMessage(\n {\n id: getTranslation('components.DraggableCard.delete.field'),\n defaultMessage: 'Delete {item}',\n },\n { item: value.label }\n )}\n >\n <Cross />\n </IconButton>\n </Flex>\n </Flex>\n {attribute?.type === 'component' ? (\n <Flex\n paddingTop={3}\n paddingRight={3}\n paddingBottom={3}\n paddingLeft={0}\n alignItems=\"flex-start\"\n direction=\"column\"\n gap={2}\n width=\"100%\"\n >\n <Grid.Root gap={4} width=\"100%\">\n {components[attribute.component].layout.map((row) =>\n row.map(({ size, ...field }) => (\n <Grid.Item\n key={field.name}\n col={size}\n xs={12}\n direction=\"column\"\n alignItems=\"stretch\"\n >\n <Flex\n alignItems=\"center\"\n background=\"neutral0\"\n paddingTop={2}\n paddingBottom={2}\n paddingLeft={3}\n paddingRight={3}\n hasRadius\n borderColor=\"neutral200\"\n >\n <Typography textColor=\"neutral800\">{field.name}</Typography>\n </Flex>\n </Grid.Item>\n ))\n )}\n </Grid.Root>\n <Link\n // used to stop the edit form from appearing when we click here.\n onClick={(e) => e.stopPropagation()}\n startIcon={<Cog />}\n tag={NavLink}\n to={`../components/${attribute.component}/configurations/edit`}\n >\n {formatMessage({\n id: getTranslation('components.FieldItem.linkToComponentLayout'),\n defaultMessage: \"Set the component's layout\",\n })}\n </Link>\n </Flex>\n ) : null}\n {attribute?.type === 'dynamiczone' ? (\n <Flex\n paddingTop={3}\n paddingRight={3}\n paddingBottom={3}\n paddingLeft={0}\n alignItems=\"flex-start\"\n gap={2}\n width=\"100%\"\n wrap=\"wrap\"\n >\n {attribute?.components.map((uid) => (\n <ComponentLink\n // used to stop the edit form from appearing when we click here.\n onClick={(e) => e.stopPropagation()}\n key={uid}\n to={`../components/${uid}/configurations/edit`}\n >\n <ComponentIcon icon={components[uid].settings.icon} />\n <Typography fontSize={1} textColor=\"neutral600\" fontWeight=\"bold\">\n {components[uid].settings.displayName}\n </Typography>\n </ComponentLink>\n ))}\n </Flex>\n ) : null}\n </Flex>\n </Flex>\n {value.name !== TEMP_FIELD_NAME && (\n <EditFieldForm attribute={attribute} name={name} onClose={() => setIsModalOpen(false)} />\n )}\n </Modal.Root>\n );\n};\n\nconst DragButton = styled<IconButtonComponent<'span'>>(IconButton)`\n height: unset;\n align-self: stretch;\n display: flex;\n align-items: center;\n padding: 0;\n border: none;\n background-color: transparent;\n border-radius: 0px;\n border-right: 1px solid ${({ theme }) => theme.colors.neutral150};\n cursor: all-scroll;\n\n svg {\n width: 1.2rem;\n height: 1.2rem;\n }\n`;\n\nconst ComponentLink = styled(NavLink)`\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: ${({ theme }) => theme.spaces[1]};\n padding: ${(props) => props.theme.spaces[2]};\n border: 1px solid ${({ theme }) => theme.colors.neutral200};\n background: ${({ theme }) => theme.colors.neutral0};\n width: 14rem;\n border-radius: ${({ theme }) => theme.borderRadius};\n text-decoration: none;\n\n &:focus,\n &:hover {\n ${({ theme }) => `\n background-color: ${theme.colors.primary100};\n border-color: ${theme.colors.primary200};\n\n ${Typography} {\n color: ${theme.colors.primary600};\n }\n `}\n\n /* > ComponentIcon */\n > div:first-child {\n background: ${({ theme }) => theme.colors.primary200};\n color: ${({ theme }) => theme.colors.primary600};\n\n svg {\n path {\n fill: ${({ theme }) => theme.colors.primary600};\n }\n }\n }\n }\n`;\n\nexport { Fields, TEMP_FIELD_NAME };\nexport type { FieldsProps };\n"],"names":["GRID_COLUMNS","DroppableContainer","id","children","droppable","useDroppable","SortableItem","attributes","setNodeRef","transform","transition","useSortable","style","CSS","Transform","toString","height","_jsx","div","ref","createDragAndDropContainersFromLayout","layout","map","row","containerIndex","dndId","child","childIndex","formName","Fields","fieldSizes","components","metadatas","formatMessage","useIntl","useForm","state","values","onChange","addFieldRow","removeFieldRow","existingFields","field","name","flat","remainingFields","Object","entries","reduce","acc","current","visible","includes","type","size","push","label","handleRemoveField","rowIndex","fieldIndex","length","slice","handleAddField","containers","setContainers","React","useState","activeDragItem","setActiveDragItem","findContainer","containersAsDictionary","keys","find","key","getItemFromContainer","container","item","getContainersAsDictionary","fromEntries","createContainersWithSpacers","filter","TEMP_FIELD_NAME","totalSpaceTaken","curr","spacerKey","generateNKeysBetweenImpl","at","__temp_key__","undefined","useEffect","DndContext","onDragStart","event","activeContainer","active","activeItem","onDragOver","over","overContainer","activeContainerIndex","findIndex","overContainerIndex","draggedItem","overItem","overIndex","update","produce","draft","spaceTaken","splice","onDragEnd","overId","activeIndex","movedContainerItems","arrayMove","updatedContainers","updatedContainersWithSpacers","updatedLayout","_dndId","_formName","_jsxs","Flex","paddingTop","direction","alignItems","gap","justifyContent","Typography","fontWeight","getTranslation","defaultMessage","variant","textColor","Box","padding","hasRadius","borderStyle","borderWidth","borderColor","SortableContext","items","Grid","Root","Item","col","xs","Field","attribute","onRemoveField","DragOverlay","Menu","Trigger","startIcon","Plus","endIcon","disabled","fullWidth","Content","onSelect","isDesktop","useIsDesktop","isModalOpen","setIsModalOpen","value","useField","listeners","setActivatorNodeRef","e","preventDefault","stopPropagation","onEditFieldMeta","tag","opacity","Modal","open","onOpenChange","background","cursor","onClick","position","DragButton","withTooltip","Drag","grow","overflow","width","ellipsis","IconButton","Pencil","Cross","paddingRight","paddingBottom","paddingLeft","component","Link","Cog","NavLink","to","wrap","uid","ComponentLink","ComponentIcon","icon","settings","fontSize","displayName","EditFieldForm","onClose","styled","theme","colors","neutral150","spaces","props","neutral200","neutral0","borderRadius","primary100","primary200","primary600"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Fields.js","sources":["../../../../admin/src/components/ConfigurationForm/Fields.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { useDroppable, DndContext, UniqueIdentifier, DragOverlay } from '@dnd-kit/core';\nimport { arraySwap, SortableContext, useSortable, rectSwappingStrategy } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport { useField, useForm, useIsDesktop } from '@strapi/admin/strapi-admin';\nimport {\n Modal,\n Box,\n Flex,\n Grid,\n IconButton,\n IconButtonComponent,\n Typography,\n Link,\n Menu,\n} from '@strapi/design-system';\nimport { Cog, Cross, Drag, Pencil, Plus } from '@strapi/icons';\nimport { generateNKeysBetween as generateNKeysBetweenImpl } from 'fractional-indexing';\nimport { produce } from 'immer';\nimport { useIntl } from 'react-intl';\nimport { NavLink } from 'react-router-dom';\nimport { styled } from 'styled-components';\n\nimport { getTranslation } from '../../utils/translations';\nimport { ComponentIcon } from '../ComponentIcon';\n\nimport { EditFieldForm, EditFieldFormProps } from './EditFieldForm';\n\nimport type { ConfigurationFormData, EditFieldSpacerLayout } from './Form';\nimport type { EditLayout } from '../../hooks/useDocumentLayout';\n\ntype FormField = ConfigurationFormData['layout'][number]['children'][number];\ntype Field = Omit<ConfigurationFormData['layout'][number]['children'][number], '__temp_key__'>;\n\nconst GRID_COLUMNS = 12;\n\n/* -------------------------------------------------------------------------------------------------\n * Drag and Drop\n * -----------------------------------------------------------------------------------------------*/\n\nconst DroppableContainer = ({\n id,\n children,\n}: {\n id: string;\n children: (props: ReturnType<typeof useDroppable>) => React.ReactNode;\n}) => {\n const droppable = useDroppable({\n id,\n });\n\n return children(droppable);\n};\n\nexport const SortableItem = ({ id, children }: { id: string; children: React.ReactNode }) => {\n const { attributes, setNodeRef, transform, transition, isDragging } = useSortable({\n id,\n });\n\n const style = {\n transform: CSS.Transform.toString({\n x: transform?.x ?? 0,\n y: transform?.y ?? 0,\n // Avoid any scaling animations which can visually \"squish\" or\n // \"stretch\" neighbouring cards in mixed-width grids (4/8/12 cols).\n scaleX: 1,\n scaleY: 1,\n }),\n transition,\n height: '100%',\n opacity: isDragging ? 0.6 : 1,\n outlineOffset: 2,\n };\n\n return (\n <div ref={setNodeRef} style={style} {...attributes}>\n {children}\n </div>\n );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Fields\n * -----------------------------------------------------------------------------------------------*/\n\ninterface FieldsProps extends Pick<EditLayout, 'metadatas'>, Pick<FieldProps, 'components'> {\n attributes: {\n [key: string]: FieldProps['attribute'];\n };\n fieldSizes: Record<string, number>;\n components: EditLayout['components'];\n}\n\n/**\n * Compute uids and formName for drag and drop items for the incoming layout\n */\nconst createDragAndDropContainersFromLayout = (layout: ConfigurationFormData['layout']) => {\n return layout.map((row, containerIndex) => ({\n ...row,\n // Use unique ids for drag and drop items\n dndId: `container-${containerIndex}`,\n children: row.children.map((child, childIndex) => ({\n ...child,\n dndId: `container-${containerIndex}-child-${childIndex}`,\n\n // The formName must be recomputed each time an item is moved\n formName: `layout.${containerIndex}.children.${childIndex}`,\n })),\n }));\n};\n\nconst Fields = ({ attributes, fieldSizes, components, metadatas = {} }: FieldsProps) => {\n const { formatMessage } = useIntl();\n\n const layout = useForm<ConfigurationFormData['layout']>(\n 'Fields',\n (state) => state.values.layout ?? []\n );\n\n const onChange = useForm('Fields', (state) => state.onChange);\n const addFieldRow = useForm('Fields', (state) => state.addFieldRow);\n const removeFieldRow = useForm('Fields', (state) => state.removeFieldRow);\n\n const existingFields = layout.map((row) => row.children.map((field) => field.name)).flat();\n\n /**\n * Get the fields that are not already in the layout\n * But also check that they are visible before we give users\n * the option to display them. e.g. `id` is not visible.\n */\n const remainingFields = Object.entries(metadatas).reduce<Field[]>((acc, current) => {\n const [name, { visible, ...field }] = current;\n\n if (!existingFields.includes(name) && visible === true) {\n const type = attributes[name]?.type;\n const size = type ? fieldSizes[type] : GRID_COLUMNS;\n\n acc.push({\n ...field,\n label: field.label ?? name,\n name,\n size,\n });\n }\n\n return acc;\n }, []);\n\n const handleRemoveField =\n (rowIndex: number, fieldIndex: number): FieldProps['onRemoveField'] =>\n () => {\n if (layout[rowIndex].children.length === 1) {\n removeFieldRow(`layout`, rowIndex);\n } else {\n onChange(`layout.${rowIndex}.children`, [\n ...layout[rowIndex].children.slice(0, fieldIndex),\n ...layout[rowIndex].children.slice(fieldIndex + 1),\n ]);\n }\n };\n\n const handleAddField = (field: Field) => () => {\n addFieldRow('layout', { children: [field] });\n };\n\n const [containers, setContainers] = React.useState(() =>\n createDragAndDropContainersFromLayout(layout)\n );\n type Container = (typeof containers)[number];\n const [activeDragItem, setActiveDragItem] = React.useState<Container['children'][number] | null>(\n null\n );\n\n /**\n * Finds either the parent container id or the child id within a container\n */\n function findContainer(id: UniqueIdentifier, containersAsDictionary: Record<string, Container>) {\n // If the id is a key, then it is the parent container\n if (id in containersAsDictionary) {\n return id;\n }\n\n // Otherwise, it is a child inside a container\n return Object.keys(containersAsDictionary).find((key) =>\n containersAsDictionary[key].children.find((child) => child.dndId === id)\n );\n }\n\n /**\n * Gets an item from a container based on its id\n */\n const getItemFromContainer = (id: UniqueIdentifier, container: Container) => {\n return container.children.find((item) => id === item.dndId);\n };\n\n /**\n * Gets the containers as dictionary for quick lookup\n */\n const getContainersAsDictionary = () => {\n return Object.fromEntries(containers.map((container) => [container.dndId, container]));\n };\n\n /**\n * Recomputes the empty space in the grid\n */\n const createContainersWithSpacers = (layout: typeof containers) => {\n return layout\n .map((row) => ({\n ...row,\n children: row.children.filter((field) => field.name !== TEMP_FIELD_NAME),\n }))\n .filter((row) => row.children.length > 0)\n .map((row) => {\n const totalSpaceTaken = row.children.reduce((acc, curr) => acc + curr.size, 0);\n\n if (totalSpaceTaken < GRID_COLUMNS) {\n const [spacerKey] = generateNKeysBetweenImpl(\n row.children.at(-1)?.__temp_key__,\n undefined,\n 1\n );\n\n return {\n ...row,\n children: [\n ...row.children,\n {\n name: TEMP_FIELD_NAME,\n size: GRID_COLUMNS - totalSpaceTaken,\n __temp_key__: spacerKey,\n } satisfies EditFieldSpacerLayout,\n ],\n };\n }\n\n return row;\n });\n };\n\n /**\n * When layout changes (e.g. when a field size is changed or the containers are reordered)\n * we need to update the ids and form names\n */\n React.useEffect(() => {\n const containers = createDragAndDropContainersFromLayout(layout);\n setContainers(containers);\n }, [layout, setContainers]);\n\n return (\n <DndContext\n onDragStart={(event) => {\n const containersAsDictionary = getContainersAsDictionary();\n\n const activeContainer = findContainer(event.active.id, containersAsDictionary);\n\n if (!activeContainer) return;\n\n const activeItem = getItemFromContainer(\n event.active.id,\n containersAsDictionary[activeContainer]\n );\n\n if (activeItem) {\n setActiveDragItem(activeItem);\n }\n }}\n onDragOver={({ active, over }) => {\n const containersAsDictionary = getContainersAsDictionary();\n const activeContainer = findContainer(active.id, containersAsDictionary);\n const overContainer = findContainer(over?.id ?? '', containersAsDictionary);\n const activeContainerIndex = containers.findIndex(\n (container) => container.dndId === activeContainer\n );\n const overContainerIndex = containers.findIndex(\n (container) => container.dndId === overContainer\n );\n\n if (!activeContainer || !overContainer) {\n return;\n }\n\n const draggedItem = getItemFromContainer(\n active.id,\n containersAsDictionary[activeContainer]\n );\n const overItem = getItemFromContainer(\n over?.id ?? '',\n containersAsDictionary[overContainer]\n );\n const overIndex = containersAsDictionary[overContainer].children.findIndex(\n (item) => item.dndId === over?.id\n );\n const activeIndex = containersAsDictionary[activeContainer].children.findIndex(\n (item) => item.dndId === active.id\n );\n\n if (!draggedItem) return;\n\n // Handle a full width field being dragged\n if (draggedItem?.size === GRID_COLUMNS) {\n // Swap the items in the containers\n const update = produce(containers, (draft) => {\n draft[activeContainerIndex].children = containers[overContainerIndex].children;\n draft[overContainerIndex].children = containers[activeContainerIndex].children;\n });\n setContainers(update);\n return;\n }\n\n /**\n * Handle an item being dragged from one container to another,\n * the item is removed from its current container, and then added to its new container\n * An item can only be added in a container if there is enough space\n */\n const update = produce(containers, (draft) => {\n draft[activeContainerIndex].children = draft[activeContainerIndex].children.filter(\n (item) => item.dndId !== active.id\n );\n\n const targetChildren = draft[overContainerIndex].children;\n const spaceTaken = targetChildren.reduce((acc, curr) => {\n if (curr.name === TEMP_FIELD_NAME) {\n return acc;\n }\n\n return acc + curr.size;\n }, 0);\n const isNotEnoughSpace = spaceTaken + draggedItem.size > GRID_COLUMNS;\n const canSwapSameSizeItem =\n overItem &&\n overItem.name !== TEMP_FIELD_NAME &&\n overItem.size === draggedItem.size &&\n activeIndex !== -1 &&\n overIndex !== -1;\n const canCreateNewRowForItem =\n activeContainerIndex !== overContainerIndex && GRID_COLUMNS - spaceTaken === 0;\n const isHoveringOverSpacer = overItem?.name === TEMP_FIELD_NAME;\n\n /**\n * Not enough space in the hovered row\n *\n * We still want:\n * - ability to swap items of the same size\n * - ability to create a single extra row to host the dragged item\n * when surrounding rows are full\n */\n if (isNotEnoughSpace) {\n // Try a simple swap when target item is of the same size\n if (canSwapSameSizeItem) {\n const sourceChildren = draft[activeContainerIndex].children;\n\n // Put the hovered item back where the dragged item came from\n sourceChildren.splice(activeIndex, 0, overItem);\n\n // Swap the hovered item with the dragged one in the target row\n const draftOverIndex = targetChildren.findIndex(\n (item) => item.dndId === overItem.dndId\n );\n\n if (draftOverIndex !== -1) {\n targetChildren.splice(draftOverIndex, 1, draggedItem);\n }\n\n return;\n }\n\n // If there is absolutely no space left in the target row and the\n // dragged item comes from a different row, add it to a new row\n if (canCreateNewRowForItem) {\n const insertIndex = overContainerIndex + 1;\n const existingRow = draft[insertIndex];\n\n if (existingRow) {\n const nonTempChildren = existingRow.children.filter(\n (child) => child.name !== TEMP_FIELD_NAME\n );\n const isNextRowEmpty = nonTempChildren.length === 0;\n\n // If the row directly after is empty (only spacers), reuse it\n // instead of creating yet another row.\n if (isNextRowEmpty) {\n existingRow.children = [draggedItem];\n return;\n }\n }\n\n const newContainerPrototype = draft[overContainerIndex];\n const newContainerId = `container-${draft.length}`;\n\n draft.splice(insertIndex, 0, {\n ...newContainerPrototype,\n dndId: newContainerId,\n children: [draggedItem],\n });\n\n return;\n }\n }\n\n // There is enough room in the target row\n if (isHoveringOverSpacer) {\n // We are over an invisible spacer, replace it with the dragged item\n targetChildren.splice(overIndex, 1, draggedItem);\n return;\n }\n\n // There is room for the item in the container, drop it\n targetChildren.splice(overIndex, 0, draggedItem);\n });\n\n setContainers(update);\n }}\n onDragEnd={(event) => {\n const { active, over } = event;\n const { id } = active;\n const overId = over?.id;\n const containersAsDictionary = getContainersAsDictionary();\n const activeContainer = findContainer(id, containersAsDictionary);\n const overContainer = findContainer(overId!, containersAsDictionary);\n\n if (!activeContainer || !overContainer) {\n return;\n }\n\n const activeIndex = containersAsDictionary[activeContainer].children.findIndex(\n (children) => children.dndId === id\n );\n const overIndex = containersAsDictionary[overContainer].children.findIndex(\n (children) => children.dndId === overId\n );\n\n const movedContainerItems = produce(containersAsDictionary, (draft) => {\n if (activeIndex !== overIndex && activeContainer === overContainer) {\n // Move items around inside their own container\n draft[activeContainer].children = arraySwap(\n draft[activeContainer].children,\n activeIndex,\n overIndex\n );\n }\n });\n\n // Remove properties the server does not expect before updating the form\n const updatedContainers = Object.values(movedContainerItems);\n const updatedContainersWithSpacers = createContainersWithSpacers(\n updatedContainers\n ) as typeof containers;\n const updatedLayout = updatedContainersWithSpacers.map(\n ({ dndId: _dndId, children, ...container }) => ({\n ...container,\n children: children.map(({ dndId: _dndId, formName: _formName, ...child }) => child),\n })\n );\n\n // Update the layout\n onChange('layout', updatedLayout);\n setActiveDragItem(null);\n }}\n >\n <Flex paddingTop={6} direction=\"column\" alignItems=\"stretch\" gap={4}>\n <Flex alignItems=\"flex-start\" direction=\"column\" justifyContent=\"space-between\">\n <Typography fontWeight=\"bold\">\n {formatMessage({\n id: getTranslation('containers.list.displayedFields'),\n defaultMessage: 'Displayed fields',\n })}\n </Typography>\n <Typography variant=\"pi\" textColor=\"neutral600\">\n {formatMessage({\n id: 'containers.SettingPage.editSettings.description',\n defaultMessage: 'Drag & drop the fields to build the layout',\n })}\n </Typography>\n </Flex>\n <Box padding={4} hasRadius borderStyle=\"dashed\" borderWidth=\"1px\" borderColor=\"neutral300\">\n <Flex direction=\"column\" alignItems=\"stretch\" gap={2}>\n {containers.map((container, containerIndex) => (\n <SortableContext\n key={container.dndId}\n id={container.dndId}\n items={container.children.map((child) => ({ id: child.dndId }))}\n strategy={rectSwappingStrategy}\n >\n <DroppableContainer id={container.dndId}>\n {({ setNodeRef }) => (\n <Grid.Root key={container.dndId} ref={setNodeRef} gap={2}>\n {container.children.map((child, childIndex) => (\n <Grid.Item\n col={child.size}\n xs={12}\n key={child.dndId}\n direction=\"column\"\n alignItems=\"stretch\"\n >\n <SortableItem id={child.dndId}>\n <Field\n attribute={attributes[child.name]}\n components={components}\n name={child.formName}\n onRemoveField={handleRemoveField(containerIndex, childIndex)}\n dndId={child.dndId}\n />\n </SortableItem>\n </Grid.Item>\n ))}\n </Grid.Root>\n )}\n </DroppableContainer>\n </SortableContext>\n ))}\n <DragOverlay>\n {activeDragItem ? (\n <Field\n attribute={attributes[activeDragItem.name]}\n components={components}\n name={activeDragItem.formName}\n dndId={activeDragItem.dndId}\n />\n ) : null}\n </DragOverlay>\n <Menu.Root>\n <Menu.Trigger\n startIcon={<Plus />}\n endIcon={null}\n disabled={remainingFields.length === 0}\n fullWidth\n variant=\"secondary\"\n >\n {formatMessage({\n id: getTranslation('containers.SettingPage.add.field'),\n defaultMessage: 'Insert another field',\n })}\n </Menu.Trigger>\n <Menu.Content>\n {remainingFields.map((field) => (\n <Menu.Item key={field.name} onSelect={handleAddField(field)}>\n {field.label}\n </Menu.Item>\n ))}\n </Menu.Content>\n </Menu.Root>\n </Flex>\n </Box>\n </Flex>\n </DndContext>\n );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Field\n * -----------------------------------------------------------------------------------------------*/\n\ninterface FieldProps extends Pick<EditFieldFormProps, 'name' | 'attribute'> {\n components: EditLayout['components'];\n dndId: string;\n onRemoveField?: React.MouseEventHandler<HTMLButtonElement>;\n}\n\nconst TEMP_FIELD_NAME = '_TEMP_';\n\n/**\n * Displays a field in the layout with drag options, also\n * opens a modal to edit the details of said field.\n */\nconst Field = ({ attribute, components, name, onRemoveField, dndId }: FieldProps) => {\n const isDesktop = useIsDesktop();\n const [isModalOpen, setIsModalOpen] = React.useState(false);\n const { formatMessage } = useIntl();\n const { value } = useField<FormField>(name);\n const { listeners, setActivatorNodeRef } = useSortable({\n id: dndId,\n });\n\n const handleRemoveField: React.MouseEventHandler<HTMLButtonElement> = (e) => {\n e.preventDefault();\n e.stopPropagation();\n if (onRemoveField) {\n onRemoveField?.(e);\n }\n };\n\n const onEditFieldMeta: React.MouseEventHandler<HTMLButtonElement> = (e) => {\n e.preventDefault();\n e.stopPropagation();\n setIsModalOpen(true);\n };\n\n if (!value) {\n return null;\n }\n\n if (value.name === TEMP_FIELD_NAME) {\n return <Flex tag=\"span\" height=\"100%\" style={{ opacity: 0 }} />;\n }\n\n if (!attribute) {\n return null;\n }\n\n return (\n <Modal.Root open={isModalOpen} onOpenChange={setIsModalOpen}>\n <Flex\n borderColor=\"neutral150\"\n background=\"neutral100\"\n hasRadius\n gap={3}\n cursor=\"pointer\"\n onClick={() => {\n setIsModalOpen(true);\n }}\n position=\"relative\"\n >\n {isDesktop && (\n <DragButton\n ref={setActivatorNodeRef}\n tag=\"span\"\n withTooltip={false}\n label={formatMessage(\n {\n id: getTranslation('components.DraggableCard.move.field'),\n defaultMessage: 'Move {item}',\n },\n { item: value.label }\n )}\n {...listeners}\n >\n <Drag />\n </DragButton>\n )}\n <Flex direction=\"column\" alignItems=\"flex-start\" grow={1} overflow=\"hidden\">\n <Flex gap={3} justifyContent=\"space-between\" width=\"100%\">\n <Typography ellipsis fontWeight=\"bold\">\n {value.label}\n </Typography>\n <Flex position=\"relative\">\n <IconButton\n type=\"button\"\n variant=\"ghost\"\n background=\"transparent\"\n onClick={onEditFieldMeta}\n withTooltip={false}\n label={formatMessage(\n {\n id: getTranslation('components.DraggableCard.edit.field'),\n defaultMessage: 'Edit {item}',\n },\n { item: value.label }\n )}\n >\n <Pencil />\n </IconButton>\n <IconButton\n type=\"button\"\n variant=\"ghost\"\n onClick={handleRemoveField}\n background=\"transparent\"\n withTooltip={false}\n label={formatMessage(\n {\n id: getTranslation('components.DraggableCard.delete.field'),\n defaultMessage: 'Delete {item}',\n },\n { item: value.label }\n )}\n >\n <Cross />\n </IconButton>\n </Flex>\n </Flex>\n {attribute?.type === 'component' ? (\n <Flex\n paddingTop={3}\n paddingRight={3}\n paddingBottom={3}\n paddingLeft={0}\n alignItems=\"flex-start\"\n direction=\"column\"\n gap={2}\n width=\"100%\"\n >\n <Grid.Root gap={4} width=\"100%\">\n {components[attribute.component].layout.map((row) =>\n row.map(({ size, ...field }) => (\n <Grid.Item\n key={field.name}\n col={size}\n xs={12}\n direction=\"column\"\n alignItems=\"stretch\"\n >\n <Flex\n alignItems=\"center\"\n background=\"neutral0\"\n paddingTop={2}\n paddingBottom={2}\n paddingLeft={3}\n paddingRight={3}\n hasRadius\n borderColor=\"neutral200\"\n >\n <Typography textColor=\"neutral800\">{field.name}</Typography>\n </Flex>\n </Grid.Item>\n ))\n )}\n </Grid.Root>\n <Link\n // used to stop the edit form from appearing when we click here.\n onClick={(e) => e.stopPropagation()}\n startIcon={<Cog />}\n tag={NavLink}\n to={`../components/${attribute.component}/configurations/edit`}\n >\n {formatMessage({\n id: getTranslation('components.FieldItem.linkToComponentLayout'),\n defaultMessage: \"Set the component's layout\",\n })}\n </Link>\n </Flex>\n ) : null}\n {attribute?.type === 'dynamiczone' ? (\n <Flex\n paddingTop={3}\n paddingRight={3}\n paddingBottom={3}\n paddingLeft={0}\n alignItems=\"flex-start\"\n gap={2}\n width=\"100%\"\n wrap=\"wrap\"\n >\n {attribute?.components.map((uid) => (\n <ComponentLink\n // used to stop the edit form from appearing when we click here.\n onClick={(e) => e.stopPropagation()}\n key={uid}\n to={`../components/${uid}/configurations/edit`}\n >\n <ComponentIcon icon={components[uid].settings.icon} />\n <Typography fontSize={1} textColor=\"neutral600\" fontWeight=\"bold\">\n {components[uid].settings.displayName}\n </Typography>\n </ComponentLink>\n ))}\n </Flex>\n ) : null}\n </Flex>\n </Flex>\n {value.name !== TEMP_FIELD_NAME && (\n <EditFieldForm attribute={attribute} name={name} onClose={() => setIsModalOpen(false)} />\n )}\n </Modal.Root>\n );\n};\n\nconst DragButton = styled<IconButtonComponent<'span'>>(IconButton)`\n height: unset;\n align-self: stretch;\n display: flex;\n align-items: center;\n padding: 0;\n border: none;\n background-color: transparent;\n border-radius: 0px;\n border-right: 1px solid ${({ theme }) => theme.colors.neutral150};\n cursor: all-scroll;\n\n svg {\n width: 1.2rem;\n height: 1.2rem;\n }\n`;\n\nconst ComponentLink = styled(NavLink)`\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: ${({ theme }) => theme.spaces[1]};\n padding: ${(props) => props.theme.spaces[2]};\n border: 1px solid ${({ theme }) => theme.colors.neutral200};\n background: ${({ theme }) => theme.colors.neutral0};\n width: 14rem;\n border-radius: ${({ theme }) => theme.borderRadius};\n text-decoration: none;\n\n &:focus,\n &:hover {\n ${({ theme }) => `\n background-color: ${theme.colors.primary100};\n border-color: ${theme.colors.primary200};\n\n ${Typography} {\n color: ${theme.colors.primary600};\n }\n `}\n\n /* > ComponentIcon */\n > div:first-child {\n background: ${({ theme }) => theme.colors.primary200};\n color: ${({ theme }) => theme.colors.primary600};\n\n svg {\n path {\n fill: ${({ theme }) => theme.colors.primary600};\n }\n }\n }\n }\n`;\n\nexport { Fields, TEMP_FIELD_NAME };\nexport type { FieldsProps };\n"],"names":["GRID_COLUMNS","DroppableContainer","id","children","droppable","useDroppable","SortableItem","attributes","setNodeRef","transform","transition","isDragging","useSortable","style","CSS","Transform","toString","x","y","scaleX","scaleY","height","opacity","outlineOffset","_jsx","div","ref","createDragAndDropContainersFromLayout","layout","map","row","containerIndex","dndId","child","childIndex","formName","Fields","fieldSizes","components","metadatas","formatMessage","useIntl","useForm","state","values","onChange","addFieldRow","removeFieldRow","existingFields","field","name","flat","remainingFields","Object","entries","reduce","acc","current","visible","includes","type","size","push","label","handleRemoveField","rowIndex","fieldIndex","length","slice","handleAddField","containers","setContainers","React","useState","activeDragItem","setActiveDragItem","findContainer","containersAsDictionary","keys","find","key","getItemFromContainer","container","item","getContainersAsDictionary","fromEntries","createContainersWithSpacers","filter","TEMP_FIELD_NAME","totalSpaceTaken","curr","spacerKey","generateNKeysBetweenImpl","at","__temp_key__","undefined","useEffect","DndContext","onDragStart","event","activeContainer","active","activeItem","onDragOver","over","overContainer","activeContainerIndex","findIndex","overContainerIndex","draggedItem","overItem","overIndex","activeIndex","update","produce","draft","targetChildren","spaceTaken","isNotEnoughSpace","canSwapSameSizeItem","canCreateNewRowForItem","isHoveringOverSpacer","sourceChildren","splice","draftOverIndex","insertIndex","existingRow","nonTempChildren","isNextRowEmpty","newContainerPrototype","newContainerId","onDragEnd","overId","movedContainerItems","arraySwap","updatedContainers","updatedContainersWithSpacers","updatedLayout","_dndId","_formName","_jsxs","Flex","paddingTop","direction","alignItems","gap","justifyContent","Typography","fontWeight","getTranslation","defaultMessage","variant","textColor","Box","padding","hasRadius","borderStyle","borderWidth","borderColor","SortableContext","items","strategy","rectSwappingStrategy","Grid","Root","Item","col","xs","Field","attribute","onRemoveField","DragOverlay","Menu","Trigger","startIcon","Plus","endIcon","disabled","fullWidth","Content","onSelect","isDesktop","useIsDesktop","isModalOpen","setIsModalOpen","value","useField","listeners","setActivatorNodeRef","e","preventDefault","stopPropagation","onEditFieldMeta","tag","Modal","open","onOpenChange","background","cursor","onClick","position","DragButton","withTooltip","Drag","grow","overflow","width","ellipsis","IconButton","Pencil","Cross","paddingRight","paddingBottom","paddingLeft","component","Link","Cog","NavLink","to","wrap","uid","ComponentLink","ComponentIcon","icon","settings","fontSize","displayName","EditFieldForm","onClose","styled","theme","colors","neutral150","spaces","props","neutral200","neutral0","borderRadius","primary100","primary200","primary600"],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
2
|
import * as React from 'react';
|
|
3
3
|
import { DndContext, DragOverlay, useDroppable } from '@dnd-kit/core';
|
|
4
|
-
import {
|
|
4
|
+
import { arraySwap, SortableContext, rectSwappingStrategy, useSortable } from '@dnd-kit/sortable';
|
|
5
5
|
import { CSS } from '@dnd-kit/utilities';
|
|
6
6
|
import { useForm, useIsDesktop, useField } from '@strapi/admin/strapi-admin';
|
|
7
7
|
import { IconButton, Typography, Flex, Box, Grid, Menu, Modal, Link } from '@strapi/design-system';
|
|
@@ -25,13 +25,22 @@ const GRID_COLUMNS = 12;
|
|
|
25
25
|
return children(droppable);
|
|
26
26
|
};
|
|
27
27
|
const SortableItem = ({ id, children })=>{
|
|
28
|
-
const { attributes, setNodeRef, transform, transition } = useSortable({
|
|
28
|
+
const { attributes, setNodeRef, transform, transition, isDragging } = useSortable({
|
|
29
29
|
id
|
|
30
30
|
});
|
|
31
31
|
const style = {
|
|
32
|
-
transform: CSS.Transform.toString(
|
|
32
|
+
transform: CSS.Transform.toString({
|
|
33
|
+
x: transform?.x ?? 0,
|
|
34
|
+
y: transform?.y ?? 0,
|
|
35
|
+
// Avoid any scaling animations which can visually "squish" or
|
|
36
|
+
// "stretch" neighbouring cards in mixed-width grids (4/8/12 cols).
|
|
37
|
+
scaleX: 1,
|
|
38
|
+
scaleY: 1
|
|
39
|
+
}),
|
|
33
40
|
transition,
|
|
34
|
-
height: '100%'
|
|
41
|
+
height: '100%',
|
|
42
|
+
opacity: isDragging ? 0.6 : 1,
|
|
43
|
+
outlineOffset: 2
|
|
35
44
|
};
|
|
36
45
|
return /*#__PURE__*/ jsx("div", {
|
|
37
46
|
ref: setNodeRef,
|
|
@@ -179,6 +188,7 @@ const Fields = ({ attributes, fieldSizes, components, metadatas = {} })=>{
|
|
|
179
188
|
const draggedItem = getItemFromContainer(active.id, containersAsDictionary[activeContainer]);
|
|
180
189
|
const overItem = getItemFromContainer(over?.id ?? '', containersAsDictionary[overContainer]);
|
|
181
190
|
const overIndex = containersAsDictionary[overContainer].children.findIndex((item)=>item.dndId === over?.id);
|
|
191
|
+
const activeIndex = containersAsDictionary[activeContainer].children.findIndex((item)=>item.dndId === active.id);
|
|
182
192
|
if (!draggedItem) return;
|
|
183
193
|
// Handle a full width field being dragged
|
|
184
194
|
if (draggedItem?.size === GRID_COLUMNS) {
|
|
@@ -193,28 +203,77 @@ const Fields = ({ attributes, fieldSizes, components, metadatas = {} })=>{
|
|
|
193
203
|
/**
|
|
194
204
|
* Handle an item being dragged from one container to another,
|
|
195
205
|
* the item is removed from its current container, and then added to its new container
|
|
196
|
-
* An item can only be added in a container if there is enough space
|
|
206
|
+
* An item can only be added in a container if there is enough space
|
|
197
207
|
*/ const update = produce(containers, (draft)=>{
|
|
198
208
|
draft[activeContainerIndex].children = draft[activeContainerIndex].children.filter((item)=>item.dndId !== active.id);
|
|
199
|
-
const
|
|
209
|
+
const targetChildren = draft[overContainerIndex].children;
|
|
210
|
+
const spaceTaken = targetChildren.reduce((acc, curr)=>{
|
|
200
211
|
if (curr.name === TEMP_FIELD_NAME) {
|
|
201
212
|
return acc;
|
|
202
213
|
}
|
|
203
214
|
return acc + curr.size;
|
|
204
215
|
}, 0);
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
216
|
+
const isNotEnoughSpace = spaceTaken + draggedItem.size > GRID_COLUMNS;
|
|
217
|
+
const canSwapSameSizeItem = overItem && overItem.name !== TEMP_FIELD_NAME && overItem.size === draggedItem.size && activeIndex !== -1 && overIndex !== -1;
|
|
218
|
+
const canCreateNewRowForItem = activeContainerIndex !== overContainerIndex && GRID_COLUMNS - spaceTaken === 0;
|
|
219
|
+
const isHoveringOverSpacer = overItem?.name === TEMP_FIELD_NAME;
|
|
220
|
+
/**
|
|
221
|
+
* Not enough space in the hovered row
|
|
222
|
+
*
|
|
223
|
+
* We still want:
|
|
224
|
+
* - ability to swap items of the same size
|
|
225
|
+
* - ability to create a single extra row to host the dragged item
|
|
226
|
+
* when surrounding rows are full
|
|
227
|
+
*/ if (isNotEnoughSpace) {
|
|
228
|
+
// Try a simple swap when target item is of the same size
|
|
229
|
+
if (canSwapSameSizeItem) {
|
|
230
|
+
const sourceChildren = draft[activeContainerIndex].children;
|
|
231
|
+
// Put the hovered item back where the dragged item came from
|
|
232
|
+
sourceChildren.splice(activeIndex, 0, overItem);
|
|
233
|
+
// Swap the hovered item with the dragged one in the target row
|
|
234
|
+
const draftOverIndex = targetChildren.findIndex((item)=>item.dndId === overItem.dndId);
|
|
235
|
+
if (draftOverIndex !== -1) {
|
|
236
|
+
targetChildren.splice(draftOverIndex, 1, draggedItem);
|
|
237
|
+
}
|
|
238
|
+
return;
|
|
239
|
+
}
|
|
240
|
+
// If there is absolutely no space left in the target row and the
|
|
241
|
+
// dragged item comes from a different row, add it to a new row
|
|
242
|
+
if (canCreateNewRowForItem) {
|
|
243
|
+
const insertIndex = overContainerIndex + 1;
|
|
244
|
+
const existingRow = draft[insertIndex];
|
|
245
|
+
if (existingRow) {
|
|
246
|
+
const nonTempChildren = existingRow.children.filter((child)=>child.name !== TEMP_FIELD_NAME);
|
|
247
|
+
const isNextRowEmpty = nonTempChildren.length === 0;
|
|
248
|
+
// If the row directly after is empty (only spacers), reuse it
|
|
249
|
+
// instead of creating yet another row.
|
|
250
|
+
if (isNextRowEmpty) {
|
|
251
|
+
existingRow.children = [
|
|
252
|
+
draggedItem
|
|
253
|
+
];
|
|
254
|
+
return;
|
|
255
|
+
}
|
|
256
|
+
}
|
|
257
|
+
const newContainerPrototype = draft[overContainerIndex];
|
|
258
|
+
const newContainerId = `container-${draft.length}`;
|
|
259
|
+
draft.splice(insertIndex, 0, {
|
|
260
|
+
...newContainerPrototype,
|
|
261
|
+
dndId: newContainerId,
|
|
262
|
+
children: [
|
|
263
|
+
draggedItem
|
|
264
|
+
]
|
|
265
|
+
});
|
|
266
|
+
return;
|
|
267
|
+
}
|
|
210
268
|
}
|
|
211
|
-
|
|
269
|
+
// There is enough room in the target row
|
|
270
|
+
if (isHoveringOverSpacer) {
|
|
212
271
|
// We are over an invisible spacer, replace it with the dragged item
|
|
213
|
-
|
|
272
|
+
targetChildren.splice(overIndex, 1, draggedItem);
|
|
214
273
|
return;
|
|
215
274
|
}
|
|
216
275
|
// There is room for the item in the container, drop it
|
|
217
|
-
|
|
276
|
+
targetChildren.splice(overIndex, 0, draggedItem);
|
|
218
277
|
});
|
|
219
278
|
setContainers(update);
|
|
220
279
|
},
|
|
@@ -233,7 +292,7 @@ const Fields = ({ attributes, fieldSizes, components, metadatas = {} })=>{
|
|
|
233
292
|
const movedContainerItems = produce(containersAsDictionary, (draft)=>{
|
|
234
293
|
if (activeIndex !== overIndex && activeContainer === overContainer) {
|
|
235
294
|
// Move items around inside their own container
|
|
236
|
-
draft[activeContainer].children =
|
|
295
|
+
draft[activeContainer].children = arraySwap(draft[activeContainer].children, activeIndex, overIndex);
|
|
237
296
|
}
|
|
238
297
|
});
|
|
239
298
|
// Remove properties the server does not expect before updating the form
|
|
@@ -291,6 +350,7 @@ const Fields = ({ attributes, fieldSizes, components, metadatas = {} })=>{
|
|
|
291
350
|
items: container.children.map((child)=>({
|
|
292
351
|
id: child.dndId
|
|
293
352
|
})),
|
|
353
|
+
strategy: rectSwappingStrategy,
|
|
294
354
|
children: /*#__PURE__*/ jsx(DroppableContainer, {
|
|
295
355
|
id: container.dndId,
|
|
296
356
|
children: ({ setNodeRef })=>/*#__PURE__*/ jsx(Grid.Root, {
|