@strapi/content-manager 0.0.0-experimental.f75e3c6d67cc47c64ab37479efdbb7b43be50b78 → 0.0.0-next.ce84fada19d58a7dfbdd553035e6558f8befcba4

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.
Files changed (137) hide show
  1. package/LICENSE +18 -3
  2. package/dist/_chunks/{ComponentConfigurationPage-CuWgXugY.mjs → ComponentConfigurationPage-DfFSZQxe.mjs} +3 -3
  3. package/dist/_chunks/{ComponentConfigurationPage-CuWgXugY.mjs.map → ComponentConfigurationPage-DfFSZQxe.mjs.map} +1 -1
  4. package/dist/_chunks/{ComponentConfigurationPage-by0e_kNd.js → ComponentConfigurationPage-FqfsxQ1j.js} +3 -3
  5. package/dist/_chunks/{ComponentConfigurationPage-by0e_kNd.js.map → ComponentConfigurationPage-FqfsxQ1j.js.map} +1 -1
  6. package/dist/_chunks/{EditConfigurationPage-CqBeCPGH.js → EditConfigurationPage-Cn0e8t3I.js} +3 -3
  7. package/dist/_chunks/{EditConfigurationPage-CqBeCPGH.js.map → EditConfigurationPage-Cn0e8t3I.js.map} +1 -1
  8. package/dist/_chunks/{EditConfigurationPage-DbI4KMyz.mjs → EditConfigurationPage-DdPNAbl3.mjs} +3 -3
  9. package/dist/_chunks/{EditConfigurationPage-DbI4KMyz.mjs.map → EditConfigurationPage-DdPNAbl3.mjs.map} +1 -1
  10. package/dist/_chunks/{EditViewPage-dFPBya9U.mjs → EditViewPage-B82x_x1b.mjs} +69 -48
  11. package/dist/_chunks/EditViewPage-B82x_x1b.mjs.map +1 -0
  12. package/dist/_chunks/{EditViewPage-ChgloMyO.js → EditViewPage-DlxEHhUt.js} +68 -47
  13. package/dist/_chunks/EditViewPage-DlxEHhUt.js.map +1 -0
  14. package/dist/_chunks/{Field-dLk-vgLL.js → Field-COL25JiC.js} +581 -229
  15. package/dist/_chunks/Field-COL25JiC.js.map +1 -0
  16. package/dist/_chunks/{Field-C1nUKcdS.mjs → Field-DufHXW17.mjs} +579 -227
  17. package/dist/_chunks/Field-DufHXW17.mjs.map +1 -0
  18. package/dist/_chunks/{Form-CbXtmHC_.js → Form-BssUwrTO.js} +52 -34
  19. package/dist/_chunks/Form-BssUwrTO.js.map +1 -0
  20. package/dist/_chunks/{Form-DOlpi7Js.mjs → Form-u_kAOhwB.mjs} +54 -36
  21. package/dist/_chunks/Form-u_kAOhwB.mjs.map +1 -0
  22. package/dist/_chunks/{History-BjDfohBr.js → History-C9t9UqpO.js} +158 -40
  23. package/dist/_chunks/History-C9t9UqpO.js.map +1 -0
  24. package/dist/_chunks/{History-BFNUAiGc.mjs → History-DRwA3oMM.mjs} +159 -41
  25. package/dist/_chunks/History-DRwA3oMM.mjs.map +1 -0
  26. package/dist/_chunks/{ListConfigurationPage-IQBgWTaa.js → ListConfigurationPage-BXYPohh-.js} +57 -46
  27. package/dist/_chunks/ListConfigurationPage-BXYPohh-.js.map +1 -0
  28. package/dist/_chunks/{ListConfigurationPage-DDi0KqFm.mjs → ListConfigurationPage-BxfQJzPk.mjs} +58 -48
  29. package/dist/_chunks/ListConfigurationPage-BxfQJzPk.mjs.map +1 -0
  30. package/dist/_chunks/{ListViewPage-BPjljUsH.mjs → ListViewPage-CELx2ysp.mjs} +116 -103
  31. package/dist/_chunks/ListViewPage-CELx2ysp.mjs.map +1 -0
  32. package/dist/_chunks/{ListViewPage-CZYGqlvF.js → ListViewPage-D2VD8Szg.js} +117 -104
  33. package/dist/_chunks/ListViewPage-D2VD8Szg.js.map +1 -0
  34. package/dist/_chunks/{NoContentTypePage-BOAI6VZ1.js → NoContentTypePage-BV9IjJSM.js} +2 -2
  35. package/dist/_chunks/{NoContentTypePage-BOAI6VZ1.js.map → NoContentTypePage-BV9IjJSM.js.map} +1 -1
  36. package/dist/_chunks/{NoContentTypePage-DaWw67K-.mjs → NoContentTypePage-DtJ9jcfk.mjs} +2 -2
  37. package/dist/_chunks/{NoContentTypePage-DaWw67K-.mjs.map → NoContentTypePage-DtJ9jcfk.mjs.map} +1 -1
  38. package/dist/_chunks/{NoPermissionsPage-CZrJH00p.mjs → NoPermissionsPage-DWleVYK7.mjs} +2 -2
  39. package/dist/_chunks/{NoPermissionsPage-CZrJH00p.mjs.map → NoPermissionsPage-DWleVYK7.mjs.map} +1 -1
  40. package/dist/_chunks/{NoPermissionsPage-cYEtLc_e.js → NoPermissionsPage-Dp8NpF9I.js} +2 -2
  41. package/dist/_chunks/{NoPermissionsPage-cYEtLc_e.js.map → NoPermissionsPage-Dp8NpF9I.js.map} +1 -1
  42. package/dist/_chunks/{Relations-DTowyge2.mjs → Relations-BTcf5xaw.mjs} +34 -25
  43. package/dist/_chunks/Relations-BTcf5xaw.mjs.map +1 -0
  44. package/dist/_chunks/{Relations-DU6B7irU.js → Relations-DR7EUgyC.js} +34 -25
  45. package/dist/_chunks/Relations-DR7EUgyC.js.map +1 -0
  46. package/dist/_chunks/{en-DTULi5-d.js → en-Bm0D0IWz.js} +21 -15
  47. package/dist/_chunks/{en-DTULi5-d.js.map → en-Bm0D0IWz.js.map} +1 -1
  48. package/dist/_chunks/{en-GCOTL6jR.mjs → en-DKV44jRb.mjs} +21 -15
  49. package/dist/_chunks/{en-GCOTL6jR.mjs.map → en-DKV44jRb.mjs.map} +1 -1
  50. package/dist/_chunks/{index-CCJeB7Rw.js → index-BdMf2lfT.js} +1357 -747
  51. package/dist/_chunks/index-BdMf2lfT.js.map +1 -0
  52. package/dist/_chunks/{index-BaGHmIir.mjs → index-wnqzm4Q8.mjs} +1390 -780
  53. package/dist/_chunks/index-wnqzm4Q8.mjs.map +1 -0
  54. package/dist/_chunks/{layout-BinjszSQ.mjs → layout-2CfjL0T9.mjs} +41 -23
  55. package/dist/_chunks/layout-2CfjL0T9.mjs.map +1 -0
  56. package/dist/_chunks/{layout-ni_L9kT1.js → layout-B2MyZU-_.js} +39 -21
  57. package/dist/_chunks/layout-B2MyZU-_.js.map +1 -0
  58. package/dist/_chunks/{relations-CeJAJc5I.js → relations-BH7JJGGe.js} +2 -2
  59. package/dist/_chunks/{relations-CeJAJc5I.js.map → relations-BH7JJGGe.js.map} +1 -1
  60. package/dist/_chunks/{relations-c91ji5eR.mjs → relations-C0w0GcXi.mjs} +2 -2
  61. package/dist/_chunks/{relations-c91ji5eR.mjs.map → relations-C0w0GcXi.mjs.map} +1 -1
  62. package/dist/_chunks/{usePrev-B9w_-eYc.js → useDebounce-CtcjDB3L.js} +14 -1
  63. package/dist/_chunks/useDebounce-CtcjDB3L.js.map +1 -0
  64. package/dist/_chunks/useDebounce-DmuSJIF3.mjs +29 -0
  65. package/dist/_chunks/useDebounce-DmuSJIF3.mjs.map +1 -0
  66. package/dist/admin/index.js +2 -1
  67. package/dist/admin/index.js.map +1 -1
  68. package/dist/admin/index.mjs +7 -6
  69. package/dist/admin/src/exports.d.ts +1 -1
  70. package/dist/admin/src/history/components/VersionInputRenderer.d.ts +1 -1
  71. package/dist/admin/src/history/index.d.ts +3 -0
  72. package/dist/admin/src/history/services/historyVersion.d.ts +1 -1
  73. package/dist/admin/src/hooks/useDocument.d.ts +32 -1
  74. package/dist/admin/src/hooks/useDocumentActions.d.ts +1 -1
  75. package/dist/admin/src/index.d.ts +1 -0
  76. package/dist/admin/src/pages/EditView/components/DocumentActions.d.ts +8 -3
  77. package/dist/admin/src/pages/EditView/components/FormInputs/BlocksInput/utils/constants.d.ts +4 -0
  78. package/dist/admin/src/pages/EditView/components/FormInputs/Relations.d.ts +20 -0
  79. package/dist/admin/src/pages/EditView/components/FormInputs/Wysiwyg/EditorLayout.d.ts +2 -2
  80. package/dist/admin/src/pages/EditView/components/FormInputs/Wysiwyg/WysiwygFooter.d.ts +2 -2
  81. package/dist/admin/src/pages/EditView/components/FormInputs/Wysiwyg/WysiwygStyles.d.ts +6 -58
  82. package/dist/admin/src/pages/EditView/components/Header.d.ts +11 -11
  83. package/dist/admin/src/pages/ListView/components/BulkActions/Actions.d.ts +3 -30
  84. package/dist/admin/src/pages/ListView/components/BulkActions/ConfirmBulkActionDialog.d.ts +2 -2
  85. package/dist/admin/src/pages/ListView/components/BulkActions/PublishAction.d.ts +14 -0
  86. package/dist/admin/src/services/api.d.ts +1 -1
  87. package/dist/admin/src/services/components.d.ts +2 -2
  88. package/dist/admin/src/services/contentTypes.d.ts +3 -3
  89. package/dist/admin/src/services/documents.d.ts +19 -17
  90. package/dist/admin/src/services/init.d.ts +1 -1
  91. package/dist/admin/src/services/relations.d.ts +2 -2
  92. package/dist/admin/src/services/uid.d.ts +3 -3
  93. package/dist/admin/src/utils/validation.d.ts +4 -1
  94. package/dist/server/index.js +218 -126
  95. package/dist/server/index.js.map +1 -1
  96. package/dist/server/index.mjs +219 -127
  97. package/dist/server/index.mjs.map +1 -1
  98. package/dist/server/src/controllers/collection-types.d.ts.map +1 -1
  99. package/dist/server/src/controllers/relations.d.ts.map +1 -1
  100. package/dist/server/src/controllers/single-types.d.ts.map +1 -1
  101. package/dist/server/src/controllers/uid.d.ts.map +1 -1
  102. package/dist/server/src/controllers/validation/dimensions.d.ts +4 -2
  103. package/dist/server/src/controllers/validation/dimensions.d.ts.map +1 -1
  104. package/dist/server/src/history/services/history.d.ts.map +1 -1
  105. package/dist/server/src/history/services/lifecycles.d.ts.map +1 -1
  106. package/dist/server/src/history/services/utils.d.ts +2 -1
  107. package/dist/server/src/history/services/utils.d.ts.map +1 -1
  108. package/dist/server/src/policies/hasPermissions.d.ts.map +1 -1
  109. package/dist/server/src/services/document-manager.d.ts.map +1 -1
  110. package/dist/server/src/services/document-metadata.d.ts.map +1 -1
  111. package/dist/server/src/services/permission-checker.d.ts.map +1 -1
  112. package/dist/server/src/services/utils/populate.d.ts.map +1 -1
  113. package/dist/shared/contracts/collection-types.d.ts +3 -1
  114. package/dist/shared/contracts/collection-types.d.ts.map +1 -1
  115. package/package.json +12 -12
  116. package/dist/_chunks/EditViewPage-ChgloMyO.js.map +0 -1
  117. package/dist/_chunks/EditViewPage-dFPBya9U.mjs.map +0 -1
  118. package/dist/_chunks/Field-C1nUKcdS.mjs.map +0 -1
  119. package/dist/_chunks/Field-dLk-vgLL.js.map +0 -1
  120. package/dist/_chunks/Form-CbXtmHC_.js.map +0 -1
  121. package/dist/_chunks/Form-DOlpi7Js.mjs.map +0 -1
  122. package/dist/_chunks/History-BFNUAiGc.mjs.map +0 -1
  123. package/dist/_chunks/History-BjDfohBr.js.map +0 -1
  124. package/dist/_chunks/ListConfigurationPage-DDi0KqFm.mjs.map +0 -1
  125. package/dist/_chunks/ListConfigurationPage-IQBgWTaa.js.map +0 -1
  126. package/dist/_chunks/ListViewPage-BPjljUsH.mjs.map +0 -1
  127. package/dist/_chunks/ListViewPage-CZYGqlvF.js.map +0 -1
  128. package/dist/_chunks/Relations-DTowyge2.mjs.map +0 -1
  129. package/dist/_chunks/Relations-DU6B7irU.js.map +0 -1
  130. package/dist/_chunks/index-BaGHmIir.mjs.map +0 -1
  131. package/dist/_chunks/index-CCJeB7Rw.js.map +0 -1
  132. package/dist/_chunks/layout-BinjszSQ.mjs.map +0 -1
  133. package/dist/_chunks/layout-ni_L9kT1.js.map +0 -1
  134. package/dist/_chunks/usePrev-B9w_-eYc.js.map +0 -1
  135. package/dist/_chunks/usePrev-DH6iah0A.mjs +0 -16
  136. package/dist/_chunks/usePrev-DH6iah0A.mjs.map +0 -1
  137. package/strapi-server.js +0 -3
@@ -6,7 +6,7 @@ const designSystem = require("@strapi/design-system");
6
6
  const fractionalIndexing = require("fractional-indexing");
7
7
  const pipe = require("lodash/fp/pipe");
8
8
  const reactIntl = require("react-intl");
9
- const index = require("./index-CCJeB7Rw.js");
9
+ const index = require("./index-BdMf2lfT.js");
10
10
  const Icons = require("@strapi/icons");
11
11
  const reactDndHtml5Backend = require("react-dnd-html5-backend");
12
12
  const reactRouterDom = require("react-router-dom");
@@ -38,14 +38,13 @@ const React__namespace = /* @__PURE__ */ _interopNamespace(React);
38
38
  const pipe__default = /* @__PURE__ */ _interopDefault(pipe);
39
39
  const yup__namespace = /* @__PURE__ */ _interopNamespace(yup);
40
40
  const FIELD_SCHEMA = yup__namespace.object().shape({
41
- label: yup__namespace.string().required(),
41
+ label: yup__namespace.string().required().nullable(),
42
42
  description: yup__namespace.string(),
43
43
  editable: yup__namespace.boolean(),
44
44
  size: yup__namespace.number().required()
45
45
  });
46
46
  const EditFieldForm = ({ attribute, name, onClose }) => {
47
47
  const { formatMessage } = reactIntl.useIntl();
48
- const id = React__namespace.useId();
49
48
  const { toggleNotification } = strapiAdmin.useNotification();
50
49
  const { value, onChange } = strapiAdmin.useField(name);
51
50
  const { data: mainFieldOptions } = index.useGetInitialDataQuery(void 0, {
@@ -88,7 +87,7 @@ const EditFieldForm = ({ attribute, name, onClose }) => {
88
87
  });
89
88
  return null;
90
89
  }
91
- return /* @__PURE__ */ jsxRuntime.jsx(designSystem.ModalLayout, { onClose, labelledBy: id, children: /* @__PURE__ */ jsxRuntime.jsxs(
90
+ return /* @__PURE__ */ jsxRuntime.jsx(designSystem.Modal.Content, { children: /* @__PURE__ */ jsxRuntime.jsxs(
92
91
  strapiAdmin.Form,
93
92
  {
94
93
  method: "PUT",
@@ -99,9 +98,9 @@ const EditFieldForm = ({ attribute, name, onClose }) => {
99
98
  onClose();
100
99
  },
101
100
  children: [
102
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.ModalHeader, { children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { gap: 3, children: [
101
+ /* @__PURE__ */ jsxRuntime.jsx(designSystem.Modal.Header, { children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { gap: 3, children: [
103
102
  /* @__PURE__ */ jsxRuntime.jsx(FieldTypeIcon.FieldTypeIcon, { type: attribute.type }),
104
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { fontWeight: "bold", textColor: "neutral800", tag: "h2", id, children: formatMessage(
103
+ /* @__PURE__ */ jsxRuntime.jsx(designSystem.Modal.Title, { children: formatMessage(
105
104
  {
106
105
  id: "content-manager.containers.edit-settings.modal-form.label",
107
106
  defaultMessage: "Edit {fieldName}"
@@ -109,7 +108,7 @@ const EditFieldForm = ({ attribute, name, onClose }) => {
109
108
  { fieldName: index.capitalise(value.name) }
110
109
  ) })
111
110
  ] }) }),
112
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.ModalBody, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid, { gap: 4, children: [
111
+ /* @__PURE__ */ jsxRuntime.jsx(designSystem.Modal.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Root, { gap: 4, children: [
113
112
  {
114
113
  name: "label",
115
114
  label: formatMessage({
@@ -177,14 +176,11 @@ const EditFieldForm = ({ attribute, name, onClose }) => {
177
176
  ],
178
177
  type: "enumeration"
179
178
  }
180
- ].filter(filterFieldsBasedOnAttributeType(attribute.type)).map(({ size, ...field }) => /* @__PURE__ */ jsxRuntime.jsx(designSystem.GridItem, { col: size, children: /* @__PURE__ */ jsxRuntime.jsx(strapiAdmin.InputRenderer, { ...field }) }, field.name)) }) }),
181
- /* @__PURE__ */ jsxRuntime.jsx(
182
- designSystem.ModalFooter,
183
- {
184
- startActions: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { onClick: onClose, variant: "tertiary", children: formatMessage({ id: "app.components.Button.cancel", defaultMessage: "Cancel" }) }),
185
- endActions: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { type: "submit", children: formatMessage({ id: "global.finish", defaultMessage: "Finish" }) })
186
- }
187
- )
179
+ ].filter(filterFieldsBasedOnAttributeType(attribute.type)).map(({ size, ...field }) => /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: size, direction: "column", alignItems: "stretch", children: /* @__PURE__ */ jsxRuntime.jsx(strapiAdmin.InputRenderer, { ...field }) }, field.name)) }) }),
180
+ /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Modal.Footer, { children: [
181
+ /* @__PURE__ */ jsxRuntime.jsx(designSystem.Modal.Close, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { variant: "tertiary", children: formatMessage({ id: "app.components.Button.cancel", defaultMessage: "Cancel" }) }) }),
182
+ /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { type: "submit", children: formatMessage({ id: "global.finish", defaultMessage: "Finish" }) })
183
+ ] })
188
184
  ]
189
185
  }
190
186
  ) });
@@ -291,7 +287,10 @@ const Fields = ({ attributes, fieldSizes, components, metadatas = {} }) => {
291
287
  if (layout[rowIndex].children.length === 1) {
292
288
  removeFieldRow(`layout`, rowIndex);
293
289
  } else {
294
- onChange(`layout.${rowIndex}.children.${fieldIndex}`, void 0);
290
+ onChange(`layout.${rowIndex}.children`, [
291
+ ...layout[rowIndex].children.slice(0, fieldIndex),
292
+ ...layout[rowIndex].children.slice(fieldIndex + 1)
293
+ ]);
295
294
  }
296
295
  };
297
296
  const handleAddField = (field) => () => {
@@ -309,7 +308,7 @@ const Fields = ({ attributes, fieldSizes, components, metadatas = {} }) => {
309
308
  }) })
310
309
  ] }),
311
310
  /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { padding: 4, hasRadius: true, borderStyle: "dashed", borderWidth: "1px", borderColor: "neutral300", children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { direction: "column", alignItems: "stretch", gap: 2, children: [
312
- layout.map((row, rowIndex) => /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid, { gap: 2, children: row.children.map(({ size, ...field }, fieldIndex) => /* @__PURE__ */ jsxRuntime.jsx(designSystem.GridItem, { col: size, children: /* @__PURE__ */ jsxRuntime.jsx(
311
+ layout.map((row, rowIndex) => /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Root, { gap: 2, children: row.children.map(({ size, ...field }, fieldIndex) => /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: size, direction: "column", alignItems: "stretch", children: /* @__PURE__ */ jsxRuntime.jsx(
313
312
  Field,
314
313
  {
315
314
  attribute: attributes[field.name],
@@ -380,9 +379,15 @@ const Field = ({ attribute, components, name, index: index$1, onMoveField, onRem
380
379
  }, [dragPreviewRef]);
381
380
  const composedRefs = designSystem.useComposedRefs(dragRef, objectRef);
382
381
  const handleRemoveField = (e) => {
382
+ e.preventDefault();
383
383
  e.stopPropagation();
384
384
  onRemoveField(e);
385
385
  };
386
+ const onEditFieldMeta = (e) => {
387
+ e.preventDefault();
388
+ e.stopPropagation();
389
+ setIsModalOpen(true);
390
+ };
386
391
  const tempRefs = designSystem.useComposedRefs(dropRef, objectRef);
387
392
  if (!value) {
388
393
  return null;
@@ -390,7 +395,7 @@ const Field = ({ attribute, components, name, index: index$1, onMoveField, onRem
390
395
  if (value.name === TEMP_FIELD_NAME) {
391
396
  return /* @__PURE__ */ jsxRuntime.jsx(designSystem.Flex, { tag: "span", height: "100%", style: { opacity: 0 }, ref: tempRefs });
392
397
  }
393
- return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
398
+ return /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Modal.Root, { open: isModalOpen, onOpenChange: setIsModalOpen, children: [
394
399
  /* @__PURE__ */ jsxRuntime.jsxs(
395
400
  designSystem.Flex,
396
401
  {
@@ -429,12 +434,10 @@ const Field = ({ attribute, components, name, index: index$1, onMoveField, onRem
429
434
  /* @__PURE__ */ jsxRuntime.jsx(
430
435
  designSystem.IconButton,
431
436
  {
432
- borderWidth: 0,
437
+ type: "button",
438
+ variant: "ghost",
433
439
  background: "transparent",
434
- onClick: (e) => {
435
- e.stopPropagation();
436
- setIsModalOpen(true);
437
- },
440
+ onClick: onEditFieldMeta,
438
441
  withTooltip: false,
439
442
  label: formatMessage(
440
443
  {
@@ -449,7 +452,8 @@ const Field = ({ attribute, components, name, index: index$1, onMoveField, onRem
449
452
  /* @__PURE__ */ jsxRuntime.jsx(
450
453
  designSystem.IconButton,
451
454
  {
452
- borderWidth: 0,
455
+ type: "button",
456
+ variant: "ghost",
453
457
  onClick: handleRemoveField,
454
458
  background: "transparent",
455
459
  withTooltip: false,
@@ -477,8 +481,8 @@ const Field = ({ attribute, components, name, index: index$1, onMoveField, onRem
477
481
  gap: 2,
478
482
  width: "100%",
479
483
  children: [
480
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid, { gap: 4, width: "100%", children: components[attribute.component].layout.map(
481
- (row) => row.map(({ size, ...field }) => /* @__PURE__ */ jsxRuntime.jsx(designSystem.GridItem, { col: size, children: /* @__PURE__ */ jsxRuntime.jsx(
484
+ /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Root, { gap: 4, width: "100%", children: components[attribute.component].layout.map(
485
+ (row) => row.map(({ size, ...field }) => /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: size, direction: "column", alignItems: "stretch", children: /* @__PURE__ */ jsxRuntime.jsx(
482
486
  designSystem.Flex,
483
487
  {
484
488
  alignItems: "center",
@@ -537,7 +541,7 @@ const Field = ({ attribute, components, name, index: index$1, onMoveField, onRem
537
541
  ]
538
542
  }
539
543
  ),
540
- isModalOpen && value.name !== TEMP_FIELD_NAME && /* @__PURE__ */ jsxRuntime.jsx(EditFieldForm, { attribute, name, onClose: () => setIsModalOpen(false) })
544
+ value.name !== TEMP_FIELD_NAME && /* @__PURE__ */ jsxRuntime.jsx(EditFieldForm, { attribute, name, onClose: () => setIsModalOpen(false) })
541
545
  ] });
542
546
  };
543
547
  const DragButton = styledComponents.styled(designSystem.IconButton)`
@@ -545,7 +549,10 @@ const DragButton = styledComponents.styled(designSystem.IconButton)`
545
549
  align-self: stretch;
546
550
  display: flex;
547
551
  align-items: center;
548
- padding: 0 ${({ theme }) => theme.spaces[3]};
552
+ padding: 0;
553
+ border: none;
554
+ background-color: transparent;
555
+ border-radius: 0px;
549
556
  border-right: 1px solid ${({ theme }) => theme.colors.neutral150};
550
557
  cursor: all-scroll;
551
558
 
@@ -631,8 +638,8 @@ const ConfigurationForm = ({
631
638
  id: index.getTranslation("containers.SettingPage.settings"),
632
639
  defaultMessage: "Settings"
633
640
  }) }),
634
- /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Grid, { children: [
635
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.GridItem, { col: 6, s: 12, children: /* @__PURE__ */ jsxRuntime.jsx(
641
+ /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Grid.Root, { children: [
642
+ /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 6, s: 12, direction: "column", alignItems: "stretch", children: /* @__PURE__ */ jsxRuntime.jsx(
636
643
  strapiAdmin.InputRenderer,
637
644
  {
638
645
  type: "enumeration",
@@ -661,12 +668,23 @@ const ConfigurationForm = ({
661
668
  }, [])
662
669
  }
663
670
  ) }),
664
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.GridItem, { paddingTop: 6, paddingBottom: 6, col: 12, s: 12, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Divider, {}) }),
665
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.GridItem, { col: 12, s: 12, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "delta", tag: "h3", children: formatMessage({
671
+ /* @__PURE__ */ jsxRuntime.jsx(
672
+ designSystem.Grid.Item,
673
+ {
674
+ paddingTop: 6,
675
+ paddingBottom: 6,
676
+ col: 12,
677
+ s: 12,
678
+ direction: "column",
679
+ alignItems: "stretch",
680
+ children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Divider, {})
681
+ }
682
+ ),
683
+ /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 12, s: 12, direction: "column", alignItems: "stretch", children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "delta", tag: "h3", children: formatMessage({
666
684
  id: index.getTranslation("containers.SettingPage.view"),
667
685
  defaultMessage: "View"
668
686
  }) }) }),
669
- /* @__PURE__ */ jsxRuntime.jsx(designSystem.GridItem, { col: 12, s: 12, children: /* @__PURE__ */ jsxRuntime.jsx(
687
+ /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 12, s: 12, direction: "column", alignItems: "stretch", children: /* @__PURE__ */ jsxRuntime.jsx(
670
688
  Fields,
671
689
  {
672
690
  attributes,
@@ -758,4 +776,4 @@ const Header = ({ name }) => {
758
776
  };
759
777
  exports.ConfigurationForm = ConfigurationForm;
760
778
  exports.TEMP_FIELD_NAME = TEMP_FIELD_NAME;
761
- //# sourceMappingURL=Form-CbXtmHC_.js.map
779
+ //# sourceMappingURL=Form-BssUwrTO.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Form-BssUwrTO.js","sources":["../../admin/src/components/ConfigurationForm/EditFieldForm.tsx","../../admin/src/components/ConfigurationForm/Fields.tsx","../../admin/src/components/ConfigurationForm/Form.tsx"],"sourcesContent":["import {\n useNotification,\n InputRenderer,\n Form,\n InputProps,\n useField,\n} from '@strapi/admin/strapi-admin';\nimport { Button, Flex, Grid, Modal } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\nimport * as yup from 'yup';\n\nimport { ATTRIBUTE_TYPES_THAT_CANNOT_BE_MAIN_FIELD } from '../../constants/attributes';\nimport { useGetInitialDataQuery } from '../../services/init';\nimport { capitalise } from '../../utils/strings';\nimport { getTranslation } from '../../utils/translations';\nimport { FieldTypeIcon } from '../FieldTypeIcon';\n\nimport { TEMP_FIELD_NAME } from './Fields';\n\nimport type { ConfigurationFormData } from './Form';\nimport type { Schema } from '@strapi/types';\n\n/* -------------------------------------------------------------------------------------------------\n * Constants\n * -----------------------------------------------------------------------------------------------*/\n\nconst FIELD_SCHEMA = yup.object().shape({\n label: yup.string().required().nullable(),\n description: yup.string(),\n editable: yup.boolean(),\n size: yup.number().required(),\n});\n\n/* -------------------------------------------------------------------------------------------------\n * EditFieldForm\n * -----------------------------------------------------------------------------------------------*/\n\ninterface EditFieldFormProps {\n attribute?: Schema.Attribute.AnyAttribute;\n name: string;\n onClose: () => void;\n}\n\nconst EditFieldForm = ({ attribute, name, onClose }: EditFieldFormProps) => {\n const { formatMessage } = useIntl();\n const { toggleNotification } = useNotification();\n\n const { value, onChange } =\n useField<ConfigurationFormData['layout'][number]['children'][number]>(name);\n\n const { data: mainFieldOptions } = useGetInitialDataQuery(undefined, {\n selectFromResult: (res) => {\n if (attribute?.type !== 'relation' || !res.data) {\n return { data: [] };\n }\n\n if ('targetModel' in attribute && typeof attribute.targetModel === 'string') {\n const targetSchema = res.data.contentTypes.find(\n (schema) => schema.uid === attribute.targetModel\n );\n\n if (targetSchema) {\n return {\n data: Object.entries(targetSchema.attributes).reduce<\n Array<{ label: string; value: string }>\n >((acc, [key, attribute]) => {\n /**\n * Create the list of attributes from the schema as to which can\n * be our `mainField` and dictate the display name of the schema\n * we're editing.\n */\n if (!ATTRIBUTE_TYPES_THAT_CANNOT_BE_MAIN_FIELD.includes(attribute.type)) {\n acc.push({\n label: key,\n value: key,\n });\n }\n\n return acc;\n }, []),\n };\n }\n }\n\n return { data: [] };\n },\n skip: attribute?.type !== 'relation',\n });\n\n if (!value || value.name === TEMP_FIELD_NAME || !attribute) {\n // This is very unlikely to happen, but it ensures the form is not opened without a value.\n console.error(\n \"You've opened a field to edit without it being part of the form, this is likely a bug with Strapi. Please open an issue.\"\n );\n\n toggleNotification({\n message: formatMessage({\n id: 'content-manager.containers.edit-settings.modal-form.error',\n defaultMessage: 'An error occurred while trying to open the form.',\n }),\n type: 'danger',\n });\n\n return null;\n }\n\n return (\n <Modal.Content>\n <Form\n method=\"PUT\"\n initialValues={value}\n validationSchema={FIELD_SCHEMA}\n onSubmit={(data) => {\n onChange(name, data);\n onClose();\n }}\n >\n <Modal.Header>\n <Flex gap={3}>\n <FieldTypeIcon type={attribute.type} />\n <Modal.Title>\n {formatMessage(\n {\n id: 'content-manager.containers.edit-settings.modal-form.label',\n defaultMessage: 'Edit {fieldName}',\n },\n { fieldName: capitalise(value.name) }\n )}\n </Modal.Title>\n </Flex>\n </Modal.Header>\n <Modal.Body>\n <Grid.Root gap={4}>\n {[\n {\n name: 'label',\n label: formatMessage({\n id: getTranslation('containers.edit-settings.modal-form.label'),\n defaultMessage: 'Label',\n }),\n size: 6,\n type: 'string' as const,\n },\n {\n name: 'description',\n label: formatMessage({\n id: getTranslation('containers.edit-settings.modal-form.description'),\n defaultMessage: 'Description',\n }),\n size: 6,\n type: 'string' as const,\n },\n {\n name: 'placeholder',\n label: formatMessage({\n id: getTranslation('containers.edit-settings.modal-form.placeholder'),\n defaultMessage: 'Placeholder',\n }),\n size: 6,\n type: 'string' as const,\n },\n {\n name: 'editable',\n label: formatMessage({\n id: getTranslation('containers.edit-settings.modal-form.editable'),\n defaultMessage: 'Editable',\n }),\n size: 6,\n type: 'boolean' as const,\n },\n {\n name: 'mainField',\n label: formatMessage({\n id: getTranslation('containers.edit-settings.modal-form.mainField'),\n defaultMessage: 'Entry title',\n }),\n hint: formatMessage({\n id: getTranslation(\n 'containers.SettingPage.edit-settings.modal-form.mainField.hint'\n ),\n defaultMessage: 'Set the displayed field',\n }),\n size: 6,\n options: mainFieldOptions,\n type: 'enumeration' as const,\n },\n {\n name: 'size',\n label: formatMessage({\n id: getTranslation('containers.ListSettingsView.modal-form.size'),\n defaultMessage: 'Size',\n }),\n size: 6,\n options: [\n { value: '4', label: '33%' },\n { value: '6', label: '50%' },\n { value: '8', label: '66%' },\n { value: '12', label: '100%' },\n ],\n type: 'enumeration' as const,\n },\n ]\n .filter(filterFieldsBasedOnAttributeType(attribute.type))\n .map(({ size, ...field }) => (\n <Grid.Item key={field.name} col={size} direction=\"column\" alignItems=\"stretch\">\n <InputRenderer {...field} />\n </Grid.Item>\n ))}\n </Grid.Root>\n </Modal.Body>\n <Modal.Footer>\n <Modal.Close>\n <Button variant=\"tertiary\">\n {formatMessage({ id: 'app.components.Button.cancel', defaultMessage: 'Cancel' })}\n </Button>\n </Modal.Close>\n <Button type=\"submit\">\n {formatMessage({ id: 'global.finish', defaultMessage: 'Finish' })}\n </Button>\n </Modal.Footer>\n </Form>\n </Modal.Content>\n );\n};\n\n/**\n * @internal\n * @description not all edit fields have the same editable properties, it depends on the type\n * e.g. a dynamic zone can only change it's label.\n */\nconst filterFieldsBasedOnAttributeType = (type: Schema.Attribute.Kind) => (field: InputProps) => {\n switch (type) {\n case 'blocks':\n case 'richtext':\n return field.name !== 'size' && field.name !== 'mainField';\n case 'boolean':\n case 'media':\n return field.name !== 'placeholder' && field.name !== 'mainField';\n case 'component':\n case 'dynamiczone':\n return field.name === 'label' || field.name === 'editable';\n case 'json':\n return field.name !== 'placeholder' && field.name !== 'mainField' && field.name !== 'size';\n case 'relation':\n return true;\n default:\n return field.name !== 'mainField';\n }\n};\n\nexport { EditFieldForm };\nexport type { EditFieldFormProps };\n","import * as React from 'react';\n\nimport { useField, useForm } from '@strapi/admin/strapi-admin';\nimport {\n Modal,\n Box,\n Flex,\n Grid,\n IconButton,\n IconButtonComponent,\n Typography,\n useComposedRefs,\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 { getEmptyImage } from 'react-dnd-html5-backend';\nimport { useIntl } from 'react-intl';\nimport { NavLink } from 'react-router-dom';\nimport { styled } from 'styled-components';\n\nimport { ItemTypes } from '../../constants/dragAndDrop';\nimport { type UseDragAndDropOptions, useDragAndDrop } from '../../hooks/useDragAndDrop';\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\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\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 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] : 12;\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 handleMoveField: FieldProps['onMoveField'] = (\n [newRowIndex, newFieldIndex],\n [currentRowIndex, currentFieldIndex]\n ) => {\n /**\n * Because this view has the constraint that the sum of field sizes cannot be greater\n * than 12, we don't use the form's method to move field rows, instead, we calculate\n * the new layout and set the entire form.\n */\n const newLayout = structuredClone(layout);\n\n /**\n * Remove field from the current layout space using splice so we have the item\n */\n const [field] = newLayout[currentRowIndex].children.splice(currentFieldIndex, 1);\n\n if (!field || field.name === TEMP_FIELD_NAME) {\n return;\n }\n\n const newRow = newLayout[newRowIndex].children;\n const [newFieldKey] = generateNKeysBetween(newRow, 1, currentFieldIndex, newFieldIndex);\n\n /**\n * Next we inject the field into it's new row at it's specified index, we then remove the spaces\n * if they exist and recalculate into potentially two arrays ONLY if the sizing is now over 12,\n * the row and the rest of the row that couldn't fit.\n *\n * for example, if i have a row of `[{size: 4}, {size: 6}]` and i add `{size: 8}` a index 0,\n * the new array will look like `[{size: 8}, {size: 4}, {size: 6}]` which breaks the limit of 12,\n * so instead we make two arrays for the new rows `[[{size: 8}, {size: 4}], [{size: 6}]]` which we\n * then inject at the original row point with spacers included.\n */\n newRow.splice(newFieldIndex, 0, { ...field, __temp_key__: newFieldKey });\n\n if (newLayout[newRowIndex].children.reduce((acc, curr) => acc + curr.size, 0) > 12) {\n const recalculatedRows = chunkArray(\n newLayout[newRowIndex].children.filter((field) => field.name !== TEMP_FIELD_NAME)\n );\n\n const rowKeys = generateNKeysBetween(\n newLayout,\n recalculatedRows.length,\n currentRowIndex,\n newRowIndex\n );\n\n newLayout.splice(\n newRowIndex,\n 1,\n ...recalculatedRows.map((row, index) => ({\n __temp_key__: rowKeys[index],\n children: row,\n }))\n );\n }\n\n /**\n * Now we remove our spacers from the rows so we can understand what dead rows exist:\n * - if there's only spacers left\n * - there's nothing in the row, e.g. a size 12 field left it.\n * These rows are then filtered out.\n * After that, we recalculate the spacers for the rows that need them.\n */\n const newLayoutWithSpacers = newLayout\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 < 12) {\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: 12 - totalSpaceTaken,\n __temp_key__: spacerKey,\n } satisfies EditFieldSpacerLayout,\n ],\n };\n }\n\n return row;\n });\n\n onChange('layout', newLayoutWithSpacers);\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 return (\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 {layout.map((row, rowIndex) => (\n <Grid.Root gap={2} key={row.__temp_key__}>\n {row.children.map(({ size, ...field }, fieldIndex) => (\n <Grid.Item key={field.name} col={size} direction=\"column\" alignItems=\"stretch\">\n <Field\n attribute={attributes[field.name]}\n components={components}\n index={[rowIndex, fieldIndex]}\n name={`layout.${rowIndex}.children.${fieldIndex}`}\n onMoveField={handleMoveField}\n onRemoveField={handleRemoveField(rowIndex, fieldIndex)}\n />\n </Grid.Item>\n ))}\n </Grid.Root>\n ))}\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 );\n};\n\n/**\n * @internal\n * @description Small abstraction to solve within an array of fields where you can\n * add a field to the beginning or start, move back and forth what it's index range\n * should be when calculating it's new temp key\n */\nconst generateNKeysBetween = <Field extends { __temp_key__: string }>(\n field: Field[],\n count: number,\n currInd: number,\n newInd: number\n) => {\n const startKey = currInd > newInd ? field[newInd - 1]?.__temp_key__ : field[newInd]?.__temp_key__;\n const endKey = currInd > newInd ? field[newInd]?.__temp_key__ : field[newInd + 1]?.__temp_key__;\n\n return generateNKeysBetweenImpl(startKey, endKey, count);\n};\n\n/**\n * @internal\n * @description chunks a row of layouts by the max size we allow, 12. It does not add the\n * spacers again, that should be added separately.\n */\nconst chunkArray = (array: FormField[]) => {\n const result: Array<FormField[]> = [];\n let temp: FormField[] = [];\n\n array.reduce((acc, field) => {\n if (acc + field.size > 12) {\n result.push(temp);\n temp = [field];\n return field.size;\n } else {\n temp.push(field);\n return acc + field.size;\n }\n }, 0);\n\n if (temp.length > 0) {\n result.push(temp);\n }\n\n return result;\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Field\n * -----------------------------------------------------------------------------------------------*/\n\ninterface FieldProps extends Pick<EditFieldFormProps, 'name' | 'attribute'> {\n components: EditLayout['components'];\n index: [row: number, index: number];\n onMoveField: UseDragAndDropOptions<number[]>['onMoveItem'];\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, index, onMoveField, onRemoveField }: FieldProps) => {\n const [isModalOpen, setIsModalOpen] = React.useState(false);\n const { formatMessage } = useIntl();\n\n const { value } = useField<FormField>(name);\n\n const [{ isDragging }, objectRef, dropRef, dragRef, dragPreviewRef] = useDragAndDrop<\n Array<number>\n >(true, {\n dropSensitivity: 'immediate',\n type: ItemTypes.EDIT_FIELD,\n item: { index, label: value?.label, name },\n index,\n onMoveItem: onMoveField,\n });\n\n React.useEffect(() => {\n dragPreviewRef(getEmptyImage(), { captureDraggingState: false });\n }, [dragPreviewRef]);\n\n const composedRefs = useComposedRefs<HTMLSpanElement>(dragRef, objectRef);\n\n const handleRemoveField: React.MouseEventHandler<HTMLButtonElement> = (e) => {\n e.preventDefault();\n e.stopPropagation();\n onRemoveField(e);\n };\n\n const onEditFieldMeta: React.MouseEventHandler<HTMLButtonElement> = (e) => {\n e.preventDefault();\n e.stopPropagation();\n setIsModalOpen(true);\n };\n\n const tempRefs = useComposedRefs<HTMLSpanElement>(dropRef, objectRef);\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 }} ref={tempRefs} />;\n }\n\n return (\n <Modal.Root open={isModalOpen} onOpenChange={setIsModalOpen}>\n <Flex\n borderColor=\"neutral150\"\n background=\"neutral100\"\n hasRadius\n style={{ opacity: isDragging ? 0.5 : 1 }}\n ref={dropRef}\n gap={3}\n cursor=\"pointer\"\n onClick={() => {\n setIsModalOpen(true);\n }}\n >\n <DragButton\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 onClick={(e) => e.stopPropagation()}\n ref={composedRefs}\n >\n <Drag />\n </DragButton>\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>\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 key={field.name} col={size} direction=\"column\" alignItems=\"stretch\">\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 >\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","import * as React from 'react';\n\nimport {\n Form,\n FormProps,\n useForm,\n InputRenderer,\n BackButton,\n Layouts,\n} from '@strapi/admin/strapi-admin';\nimport { Button, Divider, Flex, Grid, Main, Typography } from '@strapi/design-system';\nimport { generateNKeysBetween } from 'fractional-indexing';\nimport pipe from 'lodash/fp/pipe';\nimport { useIntl } from 'react-intl';\n\nimport { ATTRIBUTE_TYPES_THAT_CANNOT_BE_MAIN_FIELD } from '../../constants/attributes';\nimport { capitalise } from '../../utils/strings';\nimport { getTranslation } from '../../utils/translations';\n\nimport { Fields, FieldsProps, TEMP_FIELD_NAME } from './Fields';\n\nimport type { EditFieldLayout, EditLayout } from '../../hooks/useDocumentLayout';\n\n/* -------------------------------------------------------------------------------------------------\n * ConfigurationForm\n * -----------------------------------------------------------------------------------------------*/\n\ninterface ConfigurationFormProps extends Pick<FieldsProps, 'attributes' | 'fieldSizes'> {\n layout: EditLayout;\n onSubmit: FormProps<ConfigurationFormData>['onSubmit'];\n}\n\n/**\n * Every key in EditFieldLayout is turned to optional never and then we overwrite the ones we are using.\n */\n\ntype EditFieldSpacerLayout = {\n [key in keyof Omit<EditFieldLayout, 'name' | 'size'>]?: never;\n} & {\n description?: never;\n editable?: never;\n name: '_TEMP_';\n size: number;\n __temp_key__: string;\n};\n\ninterface ConfigurationFormData extends Pick<EditLayout, 'settings'> {\n layout: Array<{\n __temp_key__: string;\n children: Array<\n | (Pick<EditFieldLayout, 'label' | 'size' | 'name' | 'placeholder' | 'mainField'> & {\n description: EditFieldLayout['hint'];\n editable: EditFieldLayout['disabled'];\n __temp_key__: string;\n })\n | EditFieldSpacerLayout\n >;\n }>;\n}\n\nconst ConfigurationForm = ({\n attributes,\n fieldSizes,\n layout: editLayout,\n onSubmit,\n}: ConfigurationFormProps) => {\n const { components, settings, layout, metadatas } = editLayout;\n\n const { formatMessage } = useIntl();\n\n const initialValues: ConfigurationFormData = React.useMemo(() => {\n const transformations = pipe(\n flattenPanels,\n replaceMainFieldWithNameOnly,\n extractMetadata,\n addTmpSpaceToLayout,\n addTmpKeysToLayout\n );\n\n return {\n layout: transformations(layout),\n settings,\n };\n }, [layout, settings]);\n\n return (\n <Layouts.Root>\n <Main>\n <Form initialValues={initialValues} onSubmit={onSubmit} method=\"PUT\">\n <Header name={settings.displayName ?? ''} />\n <Layouts.Content>\n <Flex\n alignItems=\"stretch\"\n background=\"neutral0\"\n direction=\"column\"\n gap={6}\n hasRadius\n shadow=\"tableShadow\"\n paddingTop={6}\n paddingBottom={6}\n paddingLeft={7}\n paddingRight={7}\n >\n <Typography variant=\"delta\" tag=\"h2\">\n {formatMessage({\n id: getTranslation('containers.SettingPage.settings'),\n defaultMessage: 'Settings',\n })}\n </Typography>\n <Grid.Root>\n <Grid.Item col={6} s={12} direction=\"column\" alignItems=\"stretch\">\n <InputRenderer\n type=\"enumeration\"\n label={formatMessage({\n id: getTranslation('containers.SettingPage.editSettings.entry.title'),\n defaultMessage: 'Entry title',\n })}\n hint={formatMessage({\n id: getTranslation(\n 'containers.SettingPage.editSettings.entry.title.description'\n ),\n defaultMessage: 'Set the display field of your entry',\n })}\n name=\"settings.mainField\"\n options={Object.entries(attributes).reduce<\n Array<{ label: string; value: string }>\n >((acc, [key, attribute]) => {\n if (!attribute) {\n return acc;\n }\n\n /**\n * Create the list of attributes from the schema as to which can\n * be our `mainField` and dictate the display name of the schema\n * we're editing.\n */\n if (!ATTRIBUTE_TYPES_THAT_CANNOT_BE_MAIN_FIELD.includes(attribute.type)) {\n acc.push({\n label: key,\n value: key,\n });\n }\n\n return acc;\n }, [])}\n />\n </Grid.Item>\n <Grid.Item\n paddingTop={6}\n paddingBottom={6}\n col={12}\n s={12}\n direction=\"column\"\n alignItems=\"stretch\"\n >\n <Divider />\n </Grid.Item>\n <Grid.Item col={12} s={12} direction=\"column\" alignItems=\"stretch\">\n <Typography variant=\"delta\" tag=\"h3\">\n {formatMessage({\n id: getTranslation('containers.SettingPage.view'),\n defaultMessage: 'View',\n })}\n </Typography>\n </Grid.Item>\n <Grid.Item col={12} s={12} direction=\"column\" alignItems=\"stretch\">\n <Fields\n attributes={attributes}\n components={components}\n fieldSizes={fieldSizes}\n metadatas={metadatas}\n />\n </Grid.Item>\n </Grid.Root>\n </Flex>\n </Layouts.Content>\n </Form>\n </Main>\n </Layouts.Root>\n );\n};\n\n/**\n * @internal\n * @description Panels don't exist in the layout, so we flatten by one.\n */\nconst flattenPanels = (layout: EditLayout['layout']): EditLayout['layout'][number] =>\n layout.flat(1);\n\n/**\n * @internal\n * @description We don't need the mainField object in the layout, we only need the name.\n */\nconst replaceMainFieldWithNameOnly = (layout: EditLayout['layout'][number]) =>\n layout.map((row) =>\n row.map((field) => ({\n ...field,\n mainField: field.mainField?.name,\n }))\n );\n\n/**\n * @internal\n * @description We extract the metadata values from the field layout, because these are editable by the user.\n */\nconst extractMetadata = (\n layout: EditLayout['layout'][number]\n): Array<Exclude<ConfigurationFormData['layout'], { name: '_TEMP_' }>[number]['children']> => {\n return layout.map((row) =>\n row.map(({ label, disabled, hint, placeholder, size, name, mainField }) => ({\n label,\n editable: !disabled,\n description: hint,\n mainField,\n placeholder,\n size,\n name,\n __temp_key__: '',\n }))\n );\n};\n\n/**\n * @internal\n * @description Each row of the layout has a max size of 12 (based on bootstrap grid system)\n * So in order to offer a better drop zone we add the _TEMP_ div to complete the remaining substract (12 - existing)\n */\nconst addTmpSpaceToLayout = (\n layout: ReturnType<typeof extractMetadata>\n): Array<ConfigurationFormData['layout'][number]['children']> => [\n ...layout.map((row) => {\n const totalSpaceTaken = row.reduce((acc, field) => acc + field.size, 0);\n\n if (totalSpaceTaken < 12) {\n return [\n ...row,\n {\n name: TEMP_FIELD_NAME,\n size: 12 - totalSpaceTaken,\n __temp_key__: '',\n } satisfies EditFieldSpacerLayout,\n ];\n }\n\n return row;\n }),\n];\n\n/**\n * @internal\n * @description At this point of the transformations we have Field[][], but each row for the form should have a __temp_key__\n * applied. This means we need to change it so `Field` is nested under the children property.\n */\nconst addTmpKeysToLayout = (\n layout: ReturnType<typeof addTmpSpaceToLayout>\n): ConfigurationFormData['layout'] => {\n const keys = generateNKeysBetween(undefined, undefined, layout.length);\n\n return layout.map((row, rowIndex) => {\n const fieldKeys = generateNKeysBetween(undefined, undefined, row.length);\n\n return {\n __temp_key__: keys[rowIndex],\n children: row.map((field, fieldIndex) => {\n return {\n ...field,\n __temp_key__: fieldKeys[fieldIndex],\n };\n }),\n };\n });\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Header\n * -----------------------------------------------------------------------------------------------*/\n\ninterface HeaderProps {\n name: string;\n}\n\nconst Header = ({ name }: HeaderProps) => {\n const { formatMessage } = useIntl();\n const modified = useForm('Header', (state) => state.modified);\n const isSubmitting = useForm('Header', (state) => state.isSubmitting);\n\n return (\n <Layouts.Header\n title={formatMessage(\n {\n id: getTranslation('components.SettingsViewWrapper.pluginHeader.title'),\n defaultMessage: `Configure the view - {name}`,\n },\n { name: capitalise(name) }\n )}\n subtitle={formatMessage({\n id: getTranslation('components.SettingsViewWrapper.pluginHeader.description.edit-settings'),\n defaultMessage: 'Customize how the edit view will look like.',\n })}\n navigationAction={<BackButton />}\n primaryAction={\n <Button disabled={!modified} loading={isSubmitting} type=\"submit\">\n {formatMessage({ id: 'global.save', defaultMessage: 'Save' })}\n </Button>\n }\n />\n );\n};\n\nexport { ConfigurationForm };\nexport type { ConfigurationFormProps, ConfigurationFormData, EditFieldSpacerLayout };\n"],"names":["yup","useIntl","useNotification","useField","useGetInitialDataQuery","attribute","ATTRIBUTE_TYPES_THAT_CANNOT_BE_MAIN_FIELD","jsx","Modal","jsxs","Form","Flex","FieldTypeIcon","capitalise","Grid","getTranslation","InputRenderer","Button","useForm","field","index","generateNKeysBetweenImpl","Typography","Box","Menu","Plus","React","useDragAndDrop","ItemTypes","getEmptyImage","useComposedRefs","Drag","IconButton","Pencil","Cross","Link","Cog","NavLink","ComponentIcon","styled","pipe","Layouts","Main","Divider","generateNKeysBetween","BackButton"],"mappings":"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"}
@@ -1,11 +1,11 @@
1
- import { jsx, jsxs, Fragment } from "react/jsx-runtime";
1
+ import { jsx, jsxs } from "react/jsx-runtime";
2
2
  import * as React from "react";
3
3
  import { useNotification, useField, Form, InputRenderer, useForm, Layouts, BackButton } from "@strapi/admin/strapi-admin";
4
- import { ModalLayout, ModalHeader, Flex, Typography, ModalBody, Grid, GridItem, ModalFooter, Button, IconButton, Box, Menu, useComposedRefs, Link, Main, Divider } from "@strapi/design-system";
4
+ import { Modal, Flex, Grid, Button, IconButton, Typography, Box, Menu, useComposedRefs, Link, Main, Divider } from "@strapi/design-system";
5
5
  import { generateNKeysBetween as generateNKeysBetween$1 } from "fractional-indexing";
6
6
  import pipe from "lodash/fp/pipe";
7
7
  import { useIntl } from "react-intl";
8
- import { u as useGetInitialDataQuery, A as ATTRIBUTE_TYPES_THAT_CANNOT_BE_MAIN_FIELD, y as capitalise, g as getTranslation } from "./index-BaGHmIir.mjs";
8
+ import { a as useGetInitialDataQuery, A as ATTRIBUTE_TYPES_THAT_CANNOT_BE_MAIN_FIELD, y as capitalise, g as getTranslation } from "./index-wnqzm4Q8.mjs";
9
9
  import { Plus, Drag, Pencil, Cross, Cog } from "@strapi/icons";
10
10
  import { getEmptyImage } from "react-dnd-html5-backend";
11
11
  import { NavLink } from "react-router-dom";
@@ -15,14 +15,13 @@ import { C as ComponentIcon } from "./ComponentIcon-u4bIXTFY.mjs";
15
15
  import * as yup from "yup";
16
16
  import { F as FieldTypeIcon } from "./FieldTypeIcon-CMlNO8PE.mjs";
17
17
  const FIELD_SCHEMA = yup.object().shape({
18
- label: yup.string().required(),
18
+ label: yup.string().required().nullable(),
19
19
  description: yup.string(),
20
20
  editable: yup.boolean(),
21
21
  size: yup.number().required()
22
22
  });
23
23
  const EditFieldForm = ({ attribute, name, onClose }) => {
24
24
  const { formatMessage } = useIntl();
25
- const id = React.useId();
26
25
  const { toggleNotification } = useNotification();
27
26
  const { value, onChange } = useField(name);
28
27
  const { data: mainFieldOptions } = useGetInitialDataQuery(void 0, {
@@ -65,7 +64,7 @@ const EditFieldForm = ({ attribute, name, onClose }) => {
65
64
  });
66
65
  return null;
67
66
  }
68
- return /* @__PURE__ */ jsx(ModalLayout, { onClose, labelledBy: id, children: /* @__PURE__ */ jsxs(
67
+ return /* @__PURE__ */ jsx(Modal.Content, { children: /* @__PURE__ */ jsxs(
69
68
  Form,
70
69
  {
71
70
  method: "PUT",
@@ -76,9 +75,9 @@ const EditFieldForm = ({ attribute, name, onClose }) => {
76
75
  onClose();
77
76
  },
78
77
  children: [
79
- /* @__PURE__ */ jsx(ModalHeader, { children: /* @__PURE__ */ jsxs(Flex, { gap: 3, children: [
78
+ /* @__PURE__ */ jsx(Modal.Header, { children: /* @__PURE__ */ jsxs(Flex, { gap: 3, children: [
80
79
  /* @__PURE__ */ jsx(FieldTypeIcon, { type: attribute.type }),
81
- /* @__PURE__ */ jsx(Typography, { fontWeight: "bold", textColor: "neutral800", tag: "h2", id, children: formatMessage(
80
+ /* @__PURE__ */ jsx(Modal.Title, { children: formatMessage(
82
81
  {
83
82
  id: "content-manager.containers.edit-settings.modal-form.label",
84
83
  defaultMessage: "Edit {fieldName}"
@@ -86,7 +85,7 @@ const EditFieldForm = ({ attribute, name, onClose }) => {
86
85
  { fieldName: capitalise(value.name) }
87
86
  ) })
88
87
  ] }) }),
89
- /* @__PURE__ */ jsx(ModalBody, { children: /* @__PURE__ */ jsx(Grid, { gap: 4, children: [
88
+ /* @__PURE__ */ jsx(Modal.Body, { children: /* @__PURE__ */ jsx(Grid.Root, { gap: 4, children: [
90
89
  {
91
90
  name: "label",
92
91
  label: formatMessage({
@@ -154,14 +153,11 @@ const EditFieldForm = ({ attribute, name, onClose }) => {
154
153
  ],
155
154
  type: "enumeration"
156
155
  }
157
- ].filter(filterFieldsBasedOnAttributeType(attribute.type)).map(({ size, ...field }) => /* @__PURE__ */ jsx(GridItem, { col: size, children: /* @__PURE__ */ jsx(InputRenderer, { ...field }) }, field.name)) }) }),
158
- /* @__PURE__ */ jsx(
159
- ModalFooter,
160
- {
161
- startActions: /* @__PURE__ */ jsx(Button, { onClick: onClose, variant: "tertiary", children: formatMessage({ id: "app.components.Button.cancel", defaultMessage: "Cancel" }) }),
162
- endActions: /* @__PURE__ */ jsx(Button, { type: "submit", children: formatMessage({ id: "global.finish", defaultMessage: "Finish" }) })
163
- }
164
- )
156
+ ].filter(filterFieldsBasedOnAttributeType(attribute.type)).map(({ size, ...field }) => /* @__PURE__ */ jsx(Grid.Item, { col: size, direction: "column", alignItems: "stretch", children: /* @__PURE__ */ jsx(InputRenderer, { ...field }) }, field.name)) }) }),
157
+ /* @__PURE__ */ jsxs(Modal.Footer, { children: [
158
+ /* @__PURE__ */ jsx(Modal.Close, { children: /* @__PURE__ */ jsx(Button, { variant: "tertiary", children: formatMessage({ id: "app.components.Button.cancel", defaultMessage: "Cancel" }) }) }),
159
+ /* @__PURE__ */ jsx(Button, { type: "submit", children: formatMessage({ id: "global.finish", defaultMessage: "Finish" }) })
160
+ ] })
165
161
  ]
166
162
  }
167
163
  ) });
@@ -268,7 +264,10 @@ const Fields = ({ attributes, fieldSizes, components, metadatas = {} }) => {
268
264
  if (layout[rowIndex].children.length === 1) {
269
265
  removeFieldRow(`layout`, rowIndex);
270
266
  } else {
271
- onChange(`layout.${rowIndex}.children.${fieldIndex}`, void 0);
267
+ onChange(`layout.${rowIndex}.children`, [
268
+ ...layout[rowIndex].children.slice(0, fieldIndex),
269
+ ...layout[rowIndex].children.slice(fieldIndex + 1)
270
+ ]);
272
271
  }
273
272
  };
274
273
  const handleAddField = (field) => () => {
@@ -286,7 +285,7 @@ const Fields = ({ attributes, fieldSizes, components, metadatas = {} }) => {
286
285
  }) })
287
286
  ] }),
288
287
  /* @__PURE__ */ jsx(Box, { padding: 4, hasRadius: true, borderStyle: "dashed", borderWidth: "1px", borderColor: "neutral300", children: /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "stretch", gap: 2, children: [
289
- layout.map((row, rowIndex) => /* @__PURE__ */ jsx(Grid, { gap: 2, children: row.children.map(({ size, ...field }, fieldIndex) => /* @__PURE__ */ jsx(GridItem, { col: size, children: /* @__PURE__ */ jsx(
288
+ layout.map((row, rowIndex) => /* @__PURE__ */ jsx(Grid.Root, { gap: 2, children: row.children.map(({ size, ...field }, fieldIndex) => /* @__PURE__ */ jsx(Grid.Item, { col: size, direction: "column", alignItems: "stretch", children: /* @__PURE__ */ jsx(
290
289
  Field,
291
290
  {
292
291
  attribute: attributes[field.name],
@@ -357,9 +356,15 @@ const Field = ({ attribute, components, name, index, onMoveField, onRemoveField
357
356
  }, [dragPreviewRef]);
358
357
  const composedRefs = useComposedRefs(dragRef, objectRef);
359
358
  const handleRemoveField = (e) => {
359
+ e.preventDefault();
360
360
  e.stopPropagation();
361
361
  onRemoveField(e);
362
362
  };
363
+ const onEditFieldMeta = (e) => {
364
+ e.preventDefault();
365
+ e.stopPropagation();
366
+ setIsModalOpen(true);
367
+ };
363
368
  const tempRefs = useComposedRefs(dropRef, objectRef);
364
369
  if (!value) {
365
370
  return null;
@@ -367,7 +372,7 @@ const Field = ({ attribute, components, name, index, onMoveField, onRemoveField
367
372
  if (value.name === TEMP_FIELD_NAME) {
368
373
  return /* @__PURE__ */ jsx(Flex, { tag: "span", height: "100%", style: { opacity: 0 }, ref: tempRefs });
369
374
  }
370
- return /* @__PURE__ */ jsxs(Fragment, { children: [
375
+ return /* @__PURE__ */ jsxs(Modal.Root, { open: isModalOpen, onOpenChange: setIsModalOpen, children: [
371
376
  /* @__PURE__ */ jsxs(
372
377
  Flex,
373
378
  {
@@ -406,12 +411,10 @@ const Field = ({ attribute, components, name, index, onMoveField, onRemoveField
406
411
  /* @__PURE__ */ jsx(
407
412
  IconButton,
408
413
  {
409
- borderWidth: 0,
414
+ type: "button",
415
+ variant: "ghost",
410
416
  background: "transparent",
411
- onClick: (e) => {
412
- e.stopPropagation();
413
- setIsModalOpen(true);
414
- },
417
+ onClick: onEditFieldMeta,
415
418
  withTooltip: false,
416
419
  label: formatMessage(
417
420
  {
@@ -426,7 +429,8 @@ const Field = ({ attribute, components, name, index, onMoveField, onRemoveField
426
429
  /* @__PURE__ */ jsx(
427
430
  IconButton,
428
431
  {
429
- borderWidth: 0,
432
+ type: "button",
433
+ variant: "ghost",
430
434
  onClick: handleRemoveField,
431
435
  background: "transparent",
432
436
  withTooltip: false,
@@ -454,8 +458,8 @@ const Field = ({ attribute, components, name, index, onMoveField, onRemoveField
454
458
  gap: 2,
455
459
  width: "100%",
456
460
  children: [
457
- /* @__PURE__ */ jsx(Grid, { gap: 4, width: "100%", children: components[attribute.component].layout.map(
458
- (row) => row.map(({ size, ...field }) => /* @__PURE__ */ jsx(GridItem, { col: size, children: /* @__PURE__ */ jsx(
461
+ /* @__PURE__ */ jsx(Grid.Root, { gap: 4, width: "100%", children: components[attribute.component].layout.map(
462
+ (row) => row.map(({ size, ...field }) => /* @__PURE__ */ jsx(Grid.Item, { col: size, direction: "column", alignItems: "stretch", children: /* @__PURE__ */ jsx(
459
463
  Flex,
460
464
  {
461
465
  alignItems: "center",
@@ -514,7 +518,7 @@ const Field = ({ attribute, components, name, index, onMoveField, onRemoveField
514
518
  ]
515
519
  }
516
520
  ),
517
- isModalOpen && value.name !== TEMP_FIELD_NAME && /* @__PURE__ */ jsx(EditFieldForm, { attribute, name, onClose: () => setIsModalOpen(false) })
521
+ value.name !== TEMP_FIELD_NAME && /* @__PURE__ */ jsx(EditFieldForm, { attribute, name, onClose: () => setIsModalOpen(false) })
518
522
  ] });
519
523
  };
520
524
  const DragButton = styled(IconButton)`
@@ -522,7 +526,10 @@ const DragButton = styled(IconButton)`
522
526
  align-self: stretch;
523
527
  display: flex;
524
528
  align-items: center;
525
- padding: 0 ${({ theme }) => theme.spaces[3]};
529
+ padding: 0;
530
+ border: none;
531
+ background-color: transparent;
532
+ border-radius: 0px;
526
533
  border-right: 1px solid ${({ theme }) => theme.colors.neutral150};
527
534
  cursor: all-scroll;
528
535
 
@@ -608,8 +615,8 @@ const ConfigurationForm = ({
608
615
  id: getTranslation("containers.SettingPage.settings"),
609
616
  defaultMessage: "Settings"
610
617
  }) }),
611
- /* @__PURE__ */ jsxs(Grid, { children: [
612
- /* @__PURE__ */ jsx(GridItem, { col: 6, s: 12, children: /* @__PURE__ */ jsx(
618
+ /* @__PURE__ */ jsxs(Grid.Root, { children: [
619
+ /* @__PURE__ */ jsx(Grid.Item, { col: 6, s: 12, direction: "column", alignItems: "stretch", children: /* @__PURE__ */ jsx(
613
620
  InputRenderer,
614
621
  {
615
622
  type: "enumeration",
@@ -638,12 +645,23 @@ const ConfigurationForm = ({
638
645
  }, [])
639
646
  }
640
647
  ) }),
641
- /* @__PURE__ */ jsx(GridItem, { paddingTop: 6, paddingBottom: 6, col: 12, s: 12, children: /* @__PURE__ */ jsx(Divider, {}) }),
642
- /* @__PURE__ */ jsx(GridItem, { col: 12, s: 12, children: /* @__PURE__ */ jsx(Typography, { variant: "delta", tag: "h3", children: formatMessage({
648
+ /* @__PURE__ */ jsx(
649
+ Grid.Item,
650
+ {
651
+ paddingTop: 6,
652
+ paddingBottom: 6,
653
+ col: 12,
654
+ s: 12,
655
+ direction: "column",
656
+ alignItems: "stretch",
657
+ children: /* @__PURE__ */ jsx(Divider, {})
658
+ }
659
+ ),
660
+ /* @__PURE__ */ jsx(Grid.Item, { col: 12, s: 12, direction: "column", alignItems: "stretch", children: /* @__PURE__ */ jsx(Typography, { variant: "delta", tag: "h3", children: formatMessage({
643
661
  id: getTranslation("containers.SettingPage.view"),
644
662
  defaultMessage: "View"
645
663
  }) }) }),
646
- /* @__PURE__ */ jsx(GridItem, { col: 12, s: 12, children: /* @__PURE__ */ jsx(
664
+ /* @__PURE__ */ jsx(Grid.Item, { col: 12, s: 12, direction: "column", alignItems: "stretch", children: /* @__PURE__ */ jsx(
647
665
  Fields,
648
666
  {
649
667
  attributes,
@@ -737,4 +755,4 @@ export {
737
755
  ConfigurationForm as C,
738
756
  TEMP_FIELD_NAME as T
739
757
  };
740
- //# sourceMappingURL=Form-DOlpi7Js.mjs.map
758
+ //# sourceMappingURL=Form-u_kAOhwB.mjs.map