@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
@@ -2,12 +2,12 @@ import { jsx, jsxs, Fragment } from "react/jsx-runtime";
2
2
  import * as React from "react";
3
3
  import { useState, useEffect, useCallback, memo } from "react";
4
4
  import { useStrapiApp, createContext, useField, useNotification, useForm, useAPIErrorHandler, useQueryParams, useFocusInputField, InputRenderer as InputRenderer$1 } from "@strapi/admin/strapi-admin";
5
- import { Typography, Flex, Box, BaseLink, Button, useComposedRefs, Popover, Field, Tooltip, SingleSelect, SingleSelectOption, IconButton, Portal, FocusTrap, Divider, VisuallyHidden, Grid as Grid$1, GridItem, Accordion, TextButton, BaseButton, TextInput, IconButtonGroup, Menu, MenuItem } from "@strapi/design-system";
5
+ import { Box, SingleSelect, SingleSelectOption, Typography, Flex, BaseLink, Button, Popover, Field, Tooltip, IconButton, useComposedRefs, Portal, FocusTrap, Divider, VisuallyHidden, Grid as Grid$1, Accordion, TextButton, TextInput, IconButtonGroup, Menu, MenuItem } from "@strapi/design-system";
6
6
  import pipe$1 from "lodash/fp/pipe";
7
7
  import { useIntl } from "react-intl";
8
- import { l as DOCUMENT_META_FIELDS, g as getTranslation, b as useDoc, d as contentManagerApi, c as buildValidParams, e as useDocumentRBAC, m as useDocLayout } from "./index-BaGHmIir.mjs";
8
+ import { m as DOCUMENT_META_FIELDS, g as getTranslation, c as useDoc, e as contentManagerApi, n as CLONE_PATH, d as buildValidParams, f as useDocumentRBAC, S as SINGLE_TYPES, o as useDocLayout } from "./index-wnqzm4Q8.mjs";
9
9
  import { generateNKeysBetween } from "fractional-indexing";
10
- import { u as useComponent, C as ComponentProvider, M as MemoizedRelationsField } from "./Relations-DTowyge2.mjs";
10
+ import { u as useComponent, C as ComponentProvider, M as MemoizedRelationsField } from "./Relations-BTcf5xaw.mjs";
11
11
  import { Code, HeadingOne, HeadingTwo, HeadingThree, HeadingFour, HeadingFive, HeadingSix, Image as Image$1, NumberList, BulletList, Paragraph, Quotes, Link as Link$1, Drag, Collapse, Bold, Italic, Underline, StrikeThrough, Expand, PlusCircle, Plus, Trash, EyeStriked, CheckCircle, WarningCircle, Loader, ArrowClockwise, More } from "@strapi/icons";
12
12
  import { styled, css, keyframes } from "styled-components";
13
13
  import { C as ComponentIcon, a as COMPONENT_ICONS } from "./ComponentIcon-u4bIXTFY.mjs";
@@ -17,9 +17,9 @@ import { g as getIn } from "./objects-mKMAmfec.mjs";
17
17
  import { Editor as Editor$1, Transforms, Node, Element, Range, Path, Point, createEditor } from "slate";
18
18
  import { withHistory } from "slate-history";
19
19
  import { useFocused, useSelected, ReactEditor, Editable, useSlate, Slate, withReact } from "slate-react";
20
- import { p as prefixFileUrlWithBackendUrl, u as usePrev } from "./usePrev-DH6iah0A.mjs";
20
+ import { p as prefixFileUrlWithBackendUrl, u as usePrev, a as useDebounce } from "./useDebounce-DmuSJIF3.mjs";
21
21
  import * as Toolbar from "@radix-ui/react-toolbar";
22
- import { useLocation } from "react-router-dom";
22
+ import { useLocation, useMatch } from "react-router-dom";
23
23
  import CodeMirror from "codemirror5";
24
24
  import sanitizeHtml from "sanitize-html";
25
25
  import { getLanguage, highlight, highlightAuto } from "highlight.js";
@@ -160,6 +160,220 @@ const useLazyComponents = (componentUids = []) => {
160
160
  }, []);
161
161
  return { isLazyLoading: loading, lazyComponentStore, cleanup };
162
162
  };
163
+ const codeLanguages = [
164
+ {
165
+ value: "asm",
166
+ label: "Assembly"
167
+ },
168
+ {
169
+ value: "bash",
170
+ label: "Bash"
171
+ },
172
+ {
173
+ value: "c",
174
+ label: "C"
175
+ },
176
+ {
177
+ value: "clojure",
178
+ label: "Clojure"
179
+ },
180
+ {
181
+ value: "cobol",
182
+ label: "COBOL"
183
+ },
184
+ {
185
+ value: "cpp",
186
+ label: "C++"
187
+ },
188
+ {
189
+ value: "csharp",
190
+ label: "C#"
191
+ },
192
+ {
193
+ value: "css",
194
+ label: "CSS"
195
+ },
196
+ {
197
+ value: "dart",
198
+ label: "Dart"
199
+ },
200
+ {
201
+ value: "dockerfile",
202
+ label: "Dockerfile"
203
+ },
204
+ {
205
+ value: "elixir",
206
+ label: "Elixir"
207
+ },
208
+ {
209
+ value: "erlang",
210
+ label: "Erlang"
211
+ },
212
+ {
213
+ value: "fortran",
214
+ label: "Fortran"
215
+ },
216
+ {
217
+ value: "fsharp",
218
+ label: "F#"
219
+ },
220
+ {
221
+ value: "go",
222
+ label: "Go"
223
+ },
224
+ {
225
+ value: "graphql",
226
+ label: "GraphQL"
227
+ },
228
+ {
229
+ value: "groovy",
230
+ label: "Groovy"
231
+ },
232
+ {
233
+ value: "haskell",
234
+ label: "Haskell"
235
+ },
236
+ {
237
+ value: "haxe",
238
+ label: "Haxe"
239
+ },
240
+ {
241
+ value: "html",
242
+ label: "HTML"
243
+ },
244
+ {
245
+ value: "ini",
246
+ label: "INI"
247
+ },
248
+ {
249
+ value: "java",
250
+ label: "Java"
251
+ },
252
+ {
253
+ value: "javascript",
254
+ label: "JavaScript"
255
+ },
256
+ {
257
+ value: "jsx",
258
+ label: "JavaScript (React)"
259
+ },
260
+ {
261
+ value: "json",
262
+ label: "JSON"
263
+ },
264
+ {
265
+ value: "julia",
266
+ label: "Julia"
267
+ },
268
+ {
269
+ value: "kotlin",
270
+ label: "Kotlin"
271
+ },
272
+ {
273
+ value: "latex",
274
+ label: "LaTeX"
275
+ },
276
+ {
277
+ value: "lua",
278
+ label: "Lua"
279
+ },
280
+ {
281
+ value: "markdown",
282
+ label: "Markdown"
283
+ },
284
+ {
285
+ value: "matlab",
286
+ label: "MATLAB"
287
+ },
288
+ {
289
+ value: "makefile",
290
+ label: "Makefile"
291
+ },
292
+ {
293
+ value: "objectivec",
294
+ label: "Objective-C"
295
+ },
296
+ {
297
+ value: "perl",
298
+ label: "Perl"
299
+ },
300
+ {
301
+ value: "php",
302
+ label: "PHP"
303
+ },
304
+ {
305
+ value: "plaintext",
306
+ label: "Plain text"
307
+ },
308
+ {
309
+ value: "powershell",
310
+ label: "PowerShell"
311
+ },
312
+ {
313
+ value: "python",
314
+ label: "Python"
315
+ },
316
+ {
317
+ value: "r",
318
+ label: "R"
319
+ },
320
+ {
321
+ value: "ruby",
322
+ label: "Ruby"
323
+ },
324
+ {
325
+ value: "rust",
326
+ label: "Rust"
327
+ },
328
+ {
329
+ value: "sas",
330
+ label: "SAS"
331
+ },
332
+ {
333
+ value: "scala",
334
+ label: "Scala"
335
+ },
336
+ {
337
+ value: "scheme",
338
+ label: "Scheme"
339
+ },
340
+ {
341
+ value: "shell",
342
+ label: "Shell"
343
+ },
344
+ {
345
+ value: "sql",
346
+ label: "SQL"
347
+ },
348
+ {
349
+ value: "stata",
350
+ label: "Stata"
351
+ },
352
+ {
353
+ value: "swift",
354
+ label: "Swift"
355
+ },
356
+ {
357
+ value: "typescript",
358
+ label: "TypeScript"
359
+ },
360
+ {
361
+ value: "tsx",
362
+ label: "TypeScript (React)"
363
+ },
364
+ {
365
+ value: "vbnet",
366
+ label: "VB.NET"
367
+ },
368
+ {
369
+ value: "xml",
370
+ label: "XML"
371
+ },
372
+ {
373
+ value: "yaml",
374
+ label: "YAML"
375
+ }
376
+ ];
163
377
  const baseHandleConvert = (editor, attributesToSet) => {
164
378
  const [_, lastNodePath] = Editor$1.last(editor, []);
165
379
  Transforms.unwrapNodes(editor, {
@@ -230,6 +444,7 @@ const CodeBlock = styled.pre`
230
444
  overflow: auto;
231
445
  padding: ${({ theme }) => `${theme.spaces[3]} ${theme.spaces[4]}`};
232
446
  flex-shrink: 1;
447
+
233
448
  & > code {
234
449
  font-family: 'SF Mono', SFMono-Regular, ui-monospace, 'DejaVu Sans Mono', Menlo, Consolas,
235
450
  monospace;
@@ -238,9 +453,61 @@ const CodeBlock = styled.pre`
238
453
  max-width: 100%;
239
454
  }
240
455
  `;
456
+ const CodeEditor = (props) => {
457
+ const { editor } = useBlocksEditorContext("ImageDialog");
458
+ const editorIsFocused = useFocused();
459
+ const imageIsSelected = useSelected();
460
+ const { formatMessage } = useIntl();
461
+ const [isSelectOpen, setIsSelectOpen] = React.useState(false);
462
+ const shouldDisplayLanguageSelect = editorIsFocused && imageIsSelected || isSelectOpen;
463
+ return /* @__PURE__ */ jsxs(Box, { position: "relative", width: "100%", children: [
464
+ /* @__PURE__ */ jsx(CodeBlock, { ...props.attributes, children: /* @__PURE__ */ jsx("code", { children: props.children }) }),
465
+ shouldDisplayLanguageSelect && /* @__PURE__ */ jsx(
466
+ Box,
467
+ {
468
+ position: "absolute",
469
+ background: "neutral0",
470
+ borderColor: "neutral150",
471
+ borderStyle: "solid",
472
+ borderWidth: "0.5px",
473
+ shadow: "tableShadow",
474
+ top: "100%",
475
+ marginTop: 1,
476
+ right: 0,
477
+ padding: 1,
478
+ hasRadius: true,
479
+ children: /* @__PURE__ */ jsx(
480
+ SingleSelect,
481
+ {
482
+ onChange: (open) => {
483
+ Transforms.setNodes(
484
+ editor,
485
+ { language: open.toString() },
486
+ { match: (node) => !Editor$1.isEditor(node) && node.type === "code" }
487
+ );
488
+ },
489
+ value: props.element.type === "code" && props.element.language || "plaintext",
490
+ onOpenChange: (open) => {
491
+ setIsSelectOpen(open);
492
+ if (!open) {
493
+ ReactEditor.focus(editor);
494
+ }
495
+ },
496
+ onCloseAutoFocus: (e) => e.preventDefault(),
497
+ "aria-label": formatMessage({
498
+ id: "components.Blocks.blocks.code.languageLabel",
499
+ defaultMessage: "Select a language"
500
+ }),
501
+ children: codeLanguages.map(({ value, label }) => /* @__PURE__ */ jsx(SingleSelectOption, { value, children: label }, value))
502
+ }
503
+ )
504
+ }
505
+ )
506
+ ] });
507
+ };
241
508
  const codeBlocks = {
242
509
  code: {
243
- renderElement: (props) => /* @__PURE__ */ jsx(CodeBlock, { ...props.attributes, children: /* @__PURE__ */ jsx("code", { children: props.children }) }),
510
+ renderElement: (props) => /* @__PURE__ */ jsx(CodeEditor, { ...props }),
244
511
  icon: Code,
245
512
  label: {
246
513
  id: "components.Blocks.blocks.code",
@@ -249,7 +516,7 @@ const codeBlocks = {
249
516
  matchNode: (node) => node.type === "code",
250
517
  isInBlocksSelector: true,
251
518
  handleConvert(editor) {
252
- baseHandleConvert(editor, { type: "code" });
519
+ baseHandleConvert(editor, { type: "code", language: "plaintext" });
253
520
  },
254
521
  handleEnterKey(editor) {
255
522
  pressEnterTwiceToExit(editor);
@@ -589,18 +856,12 @@ const LinkContent = React.forwardRef(
589
856
  const [popoverOpen, setPopoverOpen] = React.useState(
590
857
  editor.lastInsertedLinkPath ? Path.equals(path, editor.lastInsertedLinkPath) : false
591
858
  );
592
- const linkRef = React.useRef(null);
593
859
  const elementText = link.children.map((child) => child.text).join("");
594
860
  const [linkText, setLinkText] = React.useState(elementText);
595
861
  const [linkUrl, setLinkUrl] = React.useState(link.url);
596
862
  const linkInputRef = React.useRef(null);
597
- const [showRemoveButton, setShowRemoveButton] = React.useState(false);
863
+ const isLastInsertedLink = editor.lastInsertedLinkPath ? !Path.equals(path, editor.lastInsertedLinkPath) : true;
598
864
  const [isSaveDisabled, setIsSaveDisabled] = React.useState(false);
599
- const handleOpenEditPopover = (e) => {
600
- e.preventDefault();
601
- setPopoverOpen(true);
602
- setShowRemoveButton(true);
603
- };
604
865
  const onLinkChange = (e) => {
605
866
  setIsSaveDisabled(false);
606
867
  setLinkUrl(e.target.value);
@@ -621,33 +882,33 @@ const LinkContent = React.forwardRef(
621
882
  editLink(editor, { url: linkUrl, text: linkText });
622
883
  setPopoverOpen(false);
623
884
  editor.lastInsertedLinkPath = null;
885
+ ReactEditor.focus(editor);
624
886
  };
625
- const handleDismiss = () => {
626
- setPopoverOpen(false);
887
+ const handleClose = () => {
627
888
  if (link.url === "") {
628
889
  removeLink(editor);
629
890
  }
891
+ setPopoverOpen(false);
630
892
  ReactEditor.focus(editor);
631
893
  };
632
- const inputNotDirty = !linkText || !linkUrl || link.url && link.url === linkUrl && elementText && elementText === linkText;
633
- const composedRefs = useComposedRefs(linkRef, forwardedRef);
634
894
  React.useEffect(() => {
635
895
  if (popoverOpen)
636
896
  linkInputRef.current?.focus();
637
897
  }, [popoverOpen]);
638
- return /* @__PURE__ */ jsxs(Fragment, { children: [
639
- /* @__PURE__ */ jsx(
898
+ const inputNotDirty = !linkText || !linkUrl || link.url && link.url === linkUrl && elementText && elementText === linkText;
899
+ return /* @__PURE__ */ jsxs(Popover.Root, { open: popoverOpen, children: [
900
+ /* @__PURE__ */ jsx(Popover.Trigger, { children: /* @__PURE__ */ jsx(
640
901
  StyledBaseLink,
641
902
  {
642
903
  ...attributes,
643
- ref: composedRefs,
904
+ ref: forwardedRef,
644
905
  href: link.url,
645
- onClick: handleOpenEditPopover,
906
+ onClick: () => setPopoverOpen(true),
646
907
  color: "primary600",
647
908
  children
648
909
  }
649
- ),
650
- popoverOpen && /* @__PURE__ */ jsx(Popover, { source: linkRef, onDismiss: handleDismiss, padding: 4, contentEditable: false, children: /* @__PURE__ */ jsxs(Flex, { tag: "form", onSubmit: handleSave, direction: "column", gap: 4, children: [
910
+ ) }),
911
+ /* @__PURE__ */ jsx(Popover.Content, { onPointerDownOutside: handleClose, children: /* @__PURE__ */ jsxs(Flex, { padding: 4, direction: "column", gap: 4, children: [
651
912
  /* @__PURE__ */ jsx(Field.Root, { width: "368px", children: /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 1, alignItems: "stretch", children: [
652
913
  /* @__PURE__ */ jsx(Field.Label, { children: formatMessage({
653
914
  id: "components.Blocks.popover.text",
@@ -693,7 +954,7 @@ const LinkContent = React.forwardRef(
693
954
  {
694
955
  variant: "danger-light",
695
956
  onClick: () => removeLink(editor),
696
- $visible: showRemoveButton,
957
+ $visible: isLastInsertedLink,
697
958
  children: formatMessage({
698
959
  id: "components.Blocks.popover.remove",
699
960
  defaultMessage: "Remove"
@@ -701,11 +962,11 @@ const LinkContent = React.forwardRef(
701
962
  }
702
963
  ),
703
964
  /* @__PURE__ */ jsxs(Flex, { gap: 2, children: [
704
- /* @__PURE__ */ jsx(Button, { variant: "tertiary", onClick: handleDismiss, children: formatMessage({
965
+ /* @__PURE__ */ jsx(Button, { variant: "tertiary", onClick: handleClose, children: formatMessage({
705
966
  id: "components.Blocks.popover.cancel",
706
967
  defaultMessage: "Cancel"
707
968
  }) }),
708
- /* @__PURE__ */ jsx(Button, { type: "submit", disabled: Boolean(inputNotDirty) || isSaveDisabled, children: formatMessage({
969
+ /* @__PURE__ */ jsx(Button, { disabled: Boolean(inputNotDirty) || isSaveDisabled, onClick: handleSave, children: formatMessage({
709
970
  id: "components.Blocks.popover.save",
710
971
  defaultMessage: "Save"
711
972
  }) })
@@ -1146,7 +1407,7 @@ const ToolbarButton = ({
1146
1407
  width: 7,
1147
1408
  height: 7,
1148
1409
  hasRadius: true,
1149
- children: /* @__PURE__ */ jsx(Icon, { width: "1.2rem", height: "1.2rem", fill: disabled ? "neutral300" : enabledColor })
1410
+ children: /* @__PURE__ */ jsx(Icon, { fill: disabled ? "neutral300" : enabledColor })
1150
1411
  }
1151
1412
  )
1152
1413
  }
@@ -1291,6 +1552,26 @@ const ListButton = ({ block, format }) => {
1291
1552
  }
1292
1553
  return false;
1293
1554
  };
1555
+ const isListDisabled = () => {
1556
+ if (disabled) {
1557
+ return true;
1558
+ }
1559
+ if (!editor.selection) {
1560
+ return false;
1561
+ }
1562
+ const anchorNodeEntry = Editor$1.above(editor, {
1563
+ at: editor.selection.anchor,
1564
+ match: (node) => !Editor$1.isEditor(node) && node.type !== "text"
1565
+ });
1566
+ const focusNodeEntry = Editor$1.above(editor, {
1567
+ at: editor.selection.focus,
1568
+ match: (node) => !Editor$1.isEditor(node) && node.type !== "text"
1569
+ });
1570
+ if (!anchorNodeEntry || !focusNodeEntry) {
1571
+ return false;
1572
+ }
1573
+ return anchorNodeEntry[0] !== focusNodeEntry[0];
1574
+ };
1294
1575
  const toggleList = (format2) => {
1295
1576
  let currentListEntry;
1296
1577
  if (editor.selection) {
@@ -1324,7 +1605,7 @@ const ListButton = ({ block, format }) => {
1324
1605
  name: format,
1325
1606
  label: block.label,
1326
1607
  isActive: isListActive(),
1327
- disabled,
1608
+ disabled: isListDisabled(),
1328
1609
  handleClick: () => toggleList(format)
1329
1610
  }
1330
1611
  );
@@ -1468,6 +1749,7 @@ const DragItem = styled(Flex)`
1468
1749
  }
1469
1750
  `;
1470
1751
  const DragIconButton = styled(IconButton)`
1752
+ user-select: none;
1471
1753
  display: flex;
1472
1754
  align-items: center;
1473
1755
  justify-content: center;
@@ -1491,7 +1773,7 @@ const DragIconButton = styled(IconButton)`
1491
1773
  }
1492
1774
  svg {
1493
1775
  height: auto;
1494
- width: ${({ theme }) => theme.spaces[3]};
1776
+ min-width: ${({ theme }) => theme.spaces[3]};
1495
1777
 
1496
1778
  path {
1497
1779
  fill: ${({ theme }) => theme.colors.neutral700};
@@ -1596,6 +1878,7 @@ const DragAndDropElement = ({
1596
1878
  DragIconButton,
1597
1879
  {
1598
1880
  tag: "div",
1881
+ contentEditable: false,
1599
1882
  role: "button",
1600
1883
  tabIndex: 0,
1601
1884
  withTooltip: false,
@@ -1608,7 +1891,7 @@ const DragAndDropElement = ({
1608
1891
  disabled,
1609
1892
  draggable: true,
1610
1893
  $dragHandleTopMargin: dragHandleTopMargin,
1611
- children: /* @__PURE__ */ jsx(Drag, { color: "neutral600" })
1894
+ children: /* @__PURE__ */ jsx(Drag, { color: "primary500" })
1612
1895
  }
1613
1896
  ),
1614
1897
  children
@@ -1932,7 +2215,7 @@ const EditorLayout$1 = ({
1932
2215
  /* @__PURE__ */ jsx(
1933
2216
  CollapseIconButton,
1934
2217
  {
1935
- "aria-label": formatMessage({
2218
+ label: formatMessage({
1936
2219
  id: getTranslation("components.Blocks.collapse"),
1937
2220
  defaultMessage: "Collapse"
1938
2221
  }),
@@ -2271,7 +2554,7 @@ const BlocksEditor = React.forwardRef(
2271
2554
  !isExpandedMode && /* @__PURE__ */ jsx(
2272
2555
  ExpandIconButton,
2273
2556
  {
2274
- "aria-label": formatMessage({
2557
+ label: formatMessage({
2275
2558
  id: getTranslation("components.Blocks.expand"),
2276
2559
  defaultMessage: "Expand"
2277
2560
  }),
@@ -2337,30 +2620,27 @@ const createDefaultForm = (contentType, components = {}) => {
2337
2620
  const Initializer = ({ disabled, name: name2, onClick }) => {
2338
2621
  const { formatMessage } = useIntl();
2339
2622
  const field = useField(name2);
2340
- return /* @__PURE__ */ jsxs(Fragment, { children: [
2341
- /* @__PURE__ */ jsx(
2342
- Box,
2343
- {
2344
- tag: "button",
2345
- background: "neutral100",
2346
- borderColor: field.error ? "danger600" : "neutral200",
2347
- hasRadius: true,
2348
- disabled,
2349
- onClick,
2350
- paddingTop: 9,
2351
- paddingBottom: 9,
2352
- type: "button",
2353
- children: /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 2, children: [
2354
- /* @__PURE__ */ jsx(Flex, { justifyContent: "center", children: /* @__PURE__ */ jsx(CircleIcon, {}) }),
2355
- /* @__PURE__ */ jsx(Flex, { justifyContent: "center", children: /* @__PURE__ */ jsx(Typography, { textColor: "primary600", variant: "pi", fontWeight: "bold", children: formatMessage({
2356
- id: getTranslation("components.empty-repeatable"),
2357
- defaultMessage: "No entry yet. Click on the button below to add one."
2358
- }) }) })
2359
- ] })
2360
- }
2361
- ),
2362
- field.error && /* @__PURE__ */ jsx(Typography, { textColor: "danger600", variant: "pi", children: field.error })
2363
- ] });
2623
+ return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
2624
+ Box,
2625
+ {
2626
+ tag: "button",
2627
+ background: "neutral100",
2628
+ borderColor: field.error ? "danger600" : "neutral200",
2629
+ hasRadius: true,
2630
+ disabled,
2631
+ onClick,
2632
+ paddingTop: 9,
2633
+ paddingBottom: 9,
2634
+ type: "button",
2635
+ children: /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 2, children: [
2636
+ /* @__PURE__ */ jsx(Flex, { justifyContent: "center", children: /* @__PURE__ */ jsx(CircleIcon, {}) }),
2637
+ /* @__PURE__ */ jsx(Flex, { justifyContent: "center", children: /* @__PURE__ */ jsx(Typography, { textColor: "primary600", variant: "pi", fontWeight: "bold", children: formatMessage({
2638
+ id: getTranslation("components.empty-repeatable"),
2639
+ defaultMessage: "No entry yet. Click on the button below to add one."
2640
+ }) }) })
2641
+ ] })
2642
+ }
2643
+ ) });
2364
2644
  };
2365
2645
  const CircleIcon = styled(PlusCircle)`
2366
2646
  width: 2.4rem;
@@ -2392,9 +2672,20 @@ const NonRepeatableComponent = ({
2392
2672
  hasRadius: isNested,
2393
2673
  borderColor: isNested ? "neutral200" : void 0,
2394
2674
  children: /* @__PURE__ */ jsx(Flex, { direction: "column", alignItems: "stretch", gap: 6, children: layout.map((row, index) => {
2395
- return /* @__PURE__ */ jsx(Grid$1, { gap: 4, children: row.map(({ size, ...field }) => {
2675
+ return /* @__PURE__ */ jsx(Grid$1.Root, { gap: 4, children: row.map(({ size, ...field }) => {
2396
2676
  const completeFieldName = `${name2}.${field.name}`;
2397
- return /* @__PURE__ */ jsx(GridItem, { col: size, s: 12, xs: 12, children: children({ ...field, name: completeFieldName }) }, completeFieldName);
2677
+ return /* @__PURE__ */ jsx(
2678
+ Grid$1.Item,
2679
+ {
2680
+ col: size,
2681
+ s: 12,
2682
+ xs: 12,
2683
+ direction: "column",
2684
+ alignItems: "stretch",
2685
+ children: children({ ...field, name: completeFieldName })
2686
+ },
2687
+ completeFieldName
2688
+ );
2398
2689
  }) }, index);
2399
2690
  }) })
2400
2691
  }
@@ -2413,13 +2704,34 @@ const RepeatableComponent = ({
2413
2704
  const { search: searchString } = useLocation();
2414
2705
  const search = React.useMemo(() => new URLSearchParams(searchString), [searchString]);
2415
2706
  const { components } = useDoc();
2416
- const { value = [], error } = useField(name2);
2707
+ const {
2708
+ value = [],
2709
+ error,
2710
+ rawError
2711
+ } = useField(name2);
2417
2712
  const addFieldRow = useForm("RepeatableComponent", (state) => state.addFieldRow);
2418
2713
  const moveFieldRow = useForm("RepeatableComponent", (state) => state.moveFieldRow);
2419
2714
  const removeFieldRow = useForm("RepeatableComponent", (state) => state.removeFieldRow);
2420
2715
  const { max = Infinity } = attribute;
2421
2716
  const [collapseToOpen, setCollapseToOpen] = React.useState("");
2422
2717
  const [liveText, setLiveText] = React.useState("");
2718
+ React.useEffect(() => {
2719
+ const hasNestedErrors = rawError && Array.isArray(rawError) && rawError.length > 0;
2720
+ const hasNestedValue = value && Array.isArray(value) && value.length > 0;
2721
+ if (hasNestedErrors && hasNestedValue) {
2722
+ const errorOpenItems = rawError.map((_, idx) => {
2723
+ return value[idx] ? value[idx].__temp_key__ : null;
2724
+ }).filter((value2) => !!value2);
2725
+ if (errorOpenItems && errorOpenItems.length > 0) {
2726
+ setCollapseToOpen((collapseToOpen2) => {
2727
+ if (!errorOpenItems.includes(collapseToOpen2)) {
2728
+ return errorOpenItems[0];
2729
+ }
2730
+ return collapseToOpen2;
2731
+ });
2732
+ }
2733
+ }
2734
+ }, [rawError, value]);
2423
2735
  const componentTmpKeyWithFocussedField = React.useMemo(() => {
2424
2736
  if (search.has("field")) {
2425
2737
  const fieldParam = search.get("field");
@@ -2570,9 +2882,20 @@ const RepeatableComponent = ({
2570
2882
  onGrabItem: handleGrabItem,
2571
2883
  __temp_key__: key,
2572
2884
  children: layout.map((row, index2) => {
2573
- return /* @__PURE__ */ jsx(Grid$1, { gap: 4, children: row.map(({ size, ...field }) => {
2885
+ return /* @__PURE__ */ jsx(Grid$1.Root, { gap: 4, children: row.map(({ size, ...field }) => {
2574
2886
  const completeFieldName = `${nameWithIndex}.${field.name}`;
2575
- return /* @__PURE__ */ jsx(GridItem, { col: size, s: 12, xs: 12, children: children({ ...field, name: completeFieldName }) }, completeFieldName);
2887
+ return /* @__PURE__ */ jsx(
2888
+ Grid$1.Item,
2889
+ {
2890
+ col: size,
2891
+ s: 12,
2892
+ xs: 12,
2893
+ direction: "column",
2894
+ alignItems: "stretch",
2895
+ children: children({ ...field, name: completeFieldName })
2896
+ },
2897
+ completeFieldName
2898
+ );
2576
2899
  }) }, index2);
2577
2900
  })
2578
2901
  }
@@ -2617,7 +2940,7 @@ const TextButtonCustom = styled(TextButton)`
2617
2940
  }
2618
2941
 
2619
2942
  @media (prefers-reduced-motion: no-preference) {
2620
- transition: background-color 120ms ${(props) => props.theme.easings.easeOutQuad};
2943
+ transition: background-color 120ms ${(props) => props.theme.motion.easings.easeOutQuad};
2621
2944
  }
2622
2945
  `;
2623
2946
  const Component = ({
@@ -2667,7 +2990,7 @@ const Component = ({
2667
2990
  /* @__PURE__ */ jsx(
2668
2991
  IconButton,
2669
2992
  {
2670
- borderWidth: 0,
2993
+ variant: "ghost",
2671
2994
  onClick: onDeleteComponent,
2672
2995
  label: formatMessage({
2673
2996
  id: getTranslation("containers.Edit.delete"),
@@ -2680,7 +3003,7 @@ const Component = ({
2680
3003
  IconButton,
2681
3004
  {
2682
3005
  ref: composedAccordionRefs,
2683
- borderWidth: 0,
3006
+ variant: "ghost",
2684
3007
  onClick: (e) => e.stopPropagation(),
2685
3008
  "data-handler-id": handlerId,
2686
3009
  label: formatMessage({
@@ -2750,7 +3073,7 @@ const ComponentInput = ({
2750
3073
  id: getTranslation("components.reset-entry"),
2751
3074
  defaultMessage: "Reset Entry"
2752
3075
  }),
2753
- borderWidth: 0,
3076
+ variant: "ghost",
2754
3077
  onClick: () => {
2755
3078
  field.onChange(name2, null);
2756
3079
  },
@@ -2779,11 +3102,8 @@ const AddComponentButton = ({
2779
3102
  onClick,
2780
3103
  disabled: isDisabled,
2781
3104
  background: "neutral0",
2782
- paddingTop: 3,
2783
- paddingBottom: 3,
2784
- paddingLeft: 4,
2785
- paddingRight: 4,
2786
3105
  style: { cursor: isDisabled ? "not-allowed" : "pointer" },
3106
+ variant: "tertiary",
2787
3107
  children: /* @__PURE__ */ jsxs(Flex, { tag: "span", gap: 2, children: [
2788
3108
  /* @__PURE__ */ jsx(StyledAddIcon, { "aria-hidden": true, $isOpen: isOpen, $hasError: hasError && !isOpen }),
2789
3109
  /* @__PURE__ */ jsx(
@@ -2812,10 +3132,11 @@ const StyledAddIcon = styled(PlusCircle)`
2812
3132
  }
2813
3133
  `;
2814
3134
  const AddComponentTitle = styled(Typography)``;
2815
- const StyledButton = styled(BaseButton)`
3135
+ const StyledButton = styled(Button)`
2816
3136
  border-radius: 26px;
2817
3137
  border-color: ${({ theme }) => theme.colors.neutral150};
2818
3138
  box-shadow: ${({ theme }) => theme.shadows.filterShadow};
3139
+ height: 5rem;
2819
3140
 
2820
3141
  &:hover {
2821
3142
  ${AddComponentTitle} {
@@ -2827,7 +3148,7 @@ const StyledButton = styled(BaseButton)`
2827
3148
  fill: ${({ theme }) => theme.colors.primary600};
2828
3149
  }
2829
3150
  > path {
2830
- fill: ${({ theme }) => theme.colors.neutral100};
3151
+ fill: ${({ theme }) => theme.colors.primary600};
2831
3152
  }
2832
3153
  }
2833
3154
  }
@@ -2885,7 +3206,7 @@ const ComponentBox = styled(Flex)`
2885
3206
  cursor: pointer;
2886
3207
 
2887
3208
  @media (prefers-reduced-motion: no-preference) {
2888
- transition: color 120ms ${(props) => props.theme.easings.easeOutQuad};
3209
+ transition: color 120ms ${(props) => props.theme.motion.easings.easeOutQuad};
2889
3210
  }
2890
3211
 
2891
3212
  &:focus,
@@ -2958,18 +3279,6 @@ const NotAllowedInput = ({ hint, label, required, name: name2 }) => {
2958
3279
  /* @__PURE__ */ jsx(Field.Hint, {})
2959
3280
  ] });
2960
3281
  };
2961
- function useDebounce(value, delay) {
2962
- const [debouncedValue, setDebouncedValue] = useState(value);
2963
- useEffect(() => {
2964
- const handler = setTimeout(() => {
2965
- setDebouncedValue(value);
2966
- }, delay);
2967
- return () => {
2968
- clearTimeout(handler);
2969
- };
2970
- }, [value, delay]);
2971
- return debouncedValue;
2972
- }
2973
3282
  const uidApi = contentManagerApi.injectEndpoints({
2974
3283
  endpoints: (builder) => ({
2975
3284
  getDefaultUID: builder.query({
@@ -3004,7 +3313,10 @@ const uidApi = contentManagerApi.injectEndpoints({
3004
3313
  config: {
3005
3314
  params
3006
3315
  }
3007
- })
3316
+ }),
3317
+ providesTags: (_res, _error, params) => [
3318
+ { type: "UidAvailability", id: params.contentTypeUID }
3319
+ ]
3008
3320
  })
3009
3321
  })
3010
3322
  });
@@ -3016,8 +3328,10 @@ const UIDInput = React.forwardRef(
3016
3328
  const allFormValues = useForm("InputUID", (form) => form.values);
3017
3329
  const [availability, setAvailability] = React.useState();
3018
3330
  const [showRegenerate, setShowRegenerate] = React.useState(false);
3331
+ const isCloning = useMatch(CLONE_PATH) !== null;
3019
3332
  const field = useField(name2);
3020
3333
  const debouncedValue = useDebounce(field.value, 300);
3334
+ const hasChanged = debouncedValue !== field.initialValue;
3021
3335
  const { toggleNotification } = useNotification();
3022
3336
  const { _unstableFormatAPIError: formatAPIError } = useAPIErrorHandler();
3023
3337
  const { formatMessage } = useIntl();
@@ -3093,8 +3407,9 @@ const UIDInput = React.forwardRef(
3093
3407
  params
3094
3408
  },
3095
3409
  {
3410
+ // Don't check availability if the value is empty or wasn't changed
3096
3411
  skip: !Boolean(
3097
- debouncedValue !== field.initialValue && debouncedValue && UID_REGEX.test(debouncedValue.trim())
3412
+ (hasChanged || isCloning) && debouncedValue && UID_REGEX.test(debouncedValue.trim())
3098
3413
  )
3099
3414
  }
3100
3415
  );
@@ -3123,6 +3438,7 @@ const UIDInput = React.forwardRef(
3123
3438
  const isLoading = isGeneratingDefaultUID || isGeneratingUID || isCheckingAvailability;
3124
3439
  const fieldRef = useFocusInputField(name2);
3125
3440
  const composedRefs = useComposedRefs(ref, fieldRef);
3441
+ const shouldShowAvailability = (hasChanged || isCloning) && debouncedValue != null && availability && !showRegenerate;
3126
3442
  return /* @__PURE__ */ jsxs(Field.Root, { hint, name: name2, error: field.error, required, children: [
3127
3443
  /* @__PURE__ */ jsx(Field.Label, { action: labelAction, children: label }),
3128
3444
  /* @__PURE__ */ jsx(
@@ -3131,7 +3447,7 @@ const UIDInput = React.forwardRef(
3131
3447
  ref: composedRefs,
3132
3448
  disabled: props.disabled,
3133
3449
  endAction: /* @__PURE__ */ jsxs(Flex, { position: "relative", gap: 1, children: [
3134
- availability && !showRegenerate && /* @__PURE__ */ jsxs(
3450
+ shouldShowAvailability && /* @__PURE__ */ jsxs(
3135
3451
  TextValidation,
3136
3452
  {
3137
3453
  alignItems: "center",
@@ -3965,7 +4281,7 @@ const EditorLayout = ({
3965
4281
  justifyContent: "flex-end",
3966
4282
  shrink: 0,
3967
4283
  width: "100%",
3968
- children: /* @__PURE__ */ jsxs(ExpandButton$1, { onClick: onCollapse, children: [
4284
+ children: /* @__PURE__ */ jsxs(ExpandButton$1, { onClick: onCollapse, variant: "tertiary", size: "M", children: [
3969
4285
  /* @__PURE__ */ jsx(Typography, { children: formatMessage({
3970
4286
  id: "components.Wysiwyg.collapse",
3971
4287
  defaultMessage: "Collapse"
@@ -3983,12 +4299,14 @@ const EditorLayout = ({
3983
4299
  ) }) });
3984
4300
  }
3985
4301
  return /* @__PURE__ */ jsx(
3986
- Box,
4302
+ Flex,
3987
4303
  {
3988
4304
  borderColor: error ? "danger600" : "neutral200",
3989
4305
  borderStyle: "solid",
3990
4306
  borderWidth: "1px",
3991
4307
  hasRadius: true,
4308
+ direction: "column",
4309
+ alignItems: "stretch",
3992
4310
  children
3993
4311
  }
3994
4312
  );
@@ -3999,11 +4317,19 @@ const ExpandWrapper = styled(Flex)`
3999
4317
  const BoxWithBorder = styled(Box)`
4000
4318
  border-right: 1px solid ${({ theme }) => theme.colors.neutral200};
4001
4319
  `;
4002
- const ExpandButton$1 = styled(BaseButton)`
4320
+ const ExpandButton$1 = styled(Button)`
4003
4321
  background-color: transparent;
4004
4322
  border: none;
4005
4323
  align-items: center;
4006
4324
 
4325
+ & > span {
4326
+ display: flex;
4327
+ justify-content: space-between;
4328
+ align-items: center;
4329
+ width: 100%;
4330
+ font-weight: ${({ theme }) => theme.fontWeights.regular};
4331
+ }
4332
+
4007
4333
  svg {
4008
4334
  margin-left: ${({ theme }) => `${theme.spaces[2]}`};
4009
4335
 
@@ -4270,42 +4596,28 @@ const quoteAndCodeHandler = (editor, markdownType) => {
4270
4596
  insertWithoutTextToEdit(editor, markdownType, line, contentLength);
4271
4597
  }
4272
4598
  };
4273
- const CustomIconButton = styled(IconButton)`
4274
- padding: ${({ theme }) => theme.spaces[2]};
4275
- /* Trick to prevent the outline from overflowing because of the general outline-offset */
4276
- outline-offset: -2px !important;
4277
-
4278
- svg {
4279
- width: 1.8rem;
4280
- height: 1.8rem;
4281
- }
4282
- `;
4283
- const CustomLinkIconButton = styled(CustomIconButton)`
4284
- svg {
4285
- width: 0.8rem;
4286
- height: 0.8rem;
4287
- }
4288
- `;
4289
4599
  const MainButtons = styled(IconButtonGroup)`
4290
4600
  margin-left: ${({ theme }) => theme.spaces[4]};
4291
4601
  `;
4292
4602
  const MoreButton = styled(IconButton)`
4293
4603
  margin: ${({ theme }) => `0 ${theme.spaces[2]}`};
4294
- padding: ${({ theme }) => theme.spaces[2]};
4295
-
4296
- svg {
4297
- width: 1.8rem;
4298
- height: 1.8rem;
4299
- }
4300
4604
  `;
4301
4605
  const IconButtonGroupMargin = styled(IconButtonGroup)`
4302
4606
  margin-right: ${({ theme }) => `${theme.spaces[2]}`};
4303
4607
  `;
4304
- const ExpandButton = styled(BaseButton)`
4608
+ const ExpandButton = styled(Button)`
4305
4609
  background-color: transparent;
4306
4610
  border: none;
4307
4611
  align-items: center;
4308
4612
 
4613
+ & > span {
4614
+ display: flex;
4615
+ justify-content: space-between;
4616
+ align-items: center;
4617
+ width: 100%;
4618
+ font-weight: ${({ theme }) => theme.fontWeights.regular};
4619
+ }
4620
+
4309
4621
  svg {
4310
4622
  margin-left: ${({ theme }) => `${theme.spaces[2]}`};
4311
4623
  path {
@@ -4317,8 +4629,8 @@ const ExpandButton = styled(BaseButton)`
4317
4629
  `;
4318
4630
  const WysiwygFooter = ({ onToggleExpand }) => {
4319
4631
  const { formatMessage } = useIntl();
4320
- return /* @__PURE__ */ jsx(Box, { padding: 2, background: "neutral100", borderRadius: `0 0 0.4rem 0.4rem`, children: /* @__PURE__ */ jsx(Flex, { justifyContent: "flex-end", alignItems: "flex-end", children: /* @__PURE__ */ jsxs(ExpandButton, { id: "expand", onClick: onToggleExpand, children: [
4321
- /* @__PURE__ */ jsx(Typography, { children: formatMessage({
4632
+ return /* @__PURE__ */ jsx(Box, { padding: 2, background: "neutral100", borderRadius: `0 0 0.4rem 0.4rem`, children: /* @__PURE__ */ jsx(Flex, { justifyContent: "flex-end", alignItems: "flex-end", children: /* @__PURE__ */ jsxs(ExpandButton, { id: "expand", onClick: onToggleExpand, variant: "tertiary", size: "M", children: [
4633
+ /* @__PURE__ */ jsx(Typography, { textColor: "neutral800", children: formatMessage({
4322
4634
  id: "components.WysiwygBottomControls.fullscreen",
4323
4635
  defaultMessage: "Expand"
4324
4636
  }) }),
@@ -4340,7 +4652,7 @@ const WysiwygNav = ({
4340
4652
  id: "components.Wysiwyg.selectOptions.title",
4341
4653
  defaultMessage: "Add a title"
4342
4654
  });
4343
- const buttonMoreRef = React.useRef(null);
4655
+ React.useRef(null);
4344
4656
  const handleTogglePopover = () => {
4345
4657
  setVisiblePopover((prev) => !prev);
4346
4658
  };
@@ -4354,18 +4666,27 @@ const WysiwygNav = ({
4354
4666
  borderRadius: `0.4rem 0.4rem 0 0`,
4355
4667
  children: [
4356
4668
  /* @__PURE__ */ jsxs(Flex, { children: [
4357
- /* @__PURE__ */ jsx(Field.Root, { children: /* @__PURE__ */ jsxs(SingleSelect, { disabled: true, placeholder: selectPlaceholder, "aria-label": selectPlaceholder, children: [
4358
- /* @__PURE__ */ jsx(SingleSelectOption, { value: "h1", children: "h1" }),
4359
- /* @__PURE__ */ jsx(SingleSelectOption, { value: "h2", children: "h2" }),
4360
- /* @__PURE__ */ jsx(SingleSelectOption, { value: "h3", children: "h3" }),
4361
- /* @__PURE__ */ jsx(SingleSelectOption, { value: "h4", children: "h4" }),
4362
- /* @__PURE__ */ jsx(SingleSelectOption, { value: "h5", children: "h5" }),
4363
- /* @__PURE__ */ jsx(SingleSelectOption, { value: "h6", children: "h6" })
4364
- ] }) }),
4669
+ /* @__PURE__ */ jsx(Field.Root, { children: /* @__PURE__ */ jsxs(
4670
+ SingleSelect,
4671
+ {
4672
+ disabled: true,
4673
+ placeholder: selectPlaceholder,
4674
+ "aria-label": selectPlaceholder,
4675
+ size: "S",
4676
+ children: [
4677
+ /* @__PURE__ */ jsx(SingleSelectOption, { value: "h1", children: "h1" }),
4678
+ /* @__PURE__ */ jsx(SingleSelectOption, { value: "h2", children: "h2" }),
4679
+ /* @__PURE__ */ jsx(SingleSelectOption, { value: "h3", children: "h3" }),
4680
+ /* @__PURE__ */ jsx(SingleSelectOption, { value: "h4", children: "h4" }),
4681
+ /* @__PURE__ */ jsx(SingleSelectOption, { value: "h5", children: "h5" }),
4682
+ /* @__PURE__ */ jsx(SingleSelectOption, { value: "h6", children: "h6" })
4683
+ ]
4684
+ }
4685
+ ) }),
4365
4686
  /* @__PURE__ */ jsxs(MainButtons, { children: [
4366
- /* @__PURE__ */ jsx(CustomIconButton, { disabled: true, label: "Bold", name: "Bold", children: /* @__PURE__ */ jsx(Bold, {}) }),
4367
- /* @__PURE__ */ jsx(CustomIconButton, { disabled: true, label: "Italic", name: "Italic", children: /* @__PURE__ */ jsx(Italic, {}) }),
4368
- /* @__PURE__ */ jsx(CustomIconButton, { disabled: true, label: "Underline", name: "Underline", children: /* @__PURE__ */ jsx(Underline, {}) })
4687
+ /* @__PURE__ */ jsx(IconButton, { disabled: true, label: "Bold", name: "Bold", children: /* @__PURE__ */ jsx(Bold, {}) }),
4688
+ /* @__PURE__ */ jsx(IconButton, { disabled: true, label: "Italic", name: "Italic", children: /* @__PURE__ */ jsx(Italic, {}) }),
4689
+ /* @__PURE__ */ jsx(IconButton, { disabled: true, label: "Underline", name: "Underline", children: /* @__PURE__ */ jsx(Underline, {}) })
4369
4690
  ] }),
4370
4691
  /* @__PURE__ */ jsx(MoreButton, { disabled: true, label: "More", children: /* @__PURE__ */ jsx(More, {}) })
4371
4692
  ] }),
@@ -4392,6 +4713,7 @@ const WysiwygNav = ({
4392
4713
  placeholder: selectPlaceholder,
4393
4714
  "aria-label": selectPlaceholder,
4394
4715
  onChange: (value) => onActionClick(value, editorRef),
4716
+ size: "S",
4395
4717
  children: [
4396
4718
  /* @__PURE__ */ jsx(SingleSelectOption, { value: "h1", children: "h1" }),
4397
4719
  /* @__PURE__ */ jsx(SingleSelectOption, { value: "h2", children: "h2" }),
@@ -4403,17 +4725,9 @@ const WysiwygNav = ({
4403
4725
  }
4404
4726
  ) }),
4405
4727
  /* @__PURE__ */ jsxs(MainButtons, { children: [
4728
+ /* @__PURE__ */ jsx(IconButton, { onClick: () => onActionClick("Bold", editorRef), label: "Bold", name: "Bold", children: /* @__PURE__ */ jsx(Bold, {}) }),
4406
4729
  /* @__PURE__ */ jsx(
4407
- CustomIconButton,
4408
- {
4409
- onClick: () => onActionClick("Bold", editorRef),
4410
- label: "Bold",
4411
- name: "Bold",
4412
- children: /* @__PURE__ */ jsx(Bold, {})
4413
- }
4414
- ),
4415
- /* @__PURE__ */ jsx(
4416
- CustomIconButton,
4730
+ IconButton,
4417
4731
  {
4418
4732
  onClick: () => onActionClick("Italic", editorRef),
4419
4733
  label: "Italic",
@@ -4422,7 +4736,7 @@ const WysiwygNav = ({
4422
4736
  }
4423
4737
  ),
4424
4738
  /* @__PURE__ */ jsx(
4425
- CustomIconButton,
4739
+ IconButton,
4426
4740
  {
4427
4741
  onClick: () => onActionClick("Underline", editorRef),
4428
4742
  label: "Underline",
@@ -4431,79 +4745,81 @@ const WysiwygNav = ({
4431
4745
  }
4432
4746
  )
4433
4747
  ] }),
4434
- /* @__PURE__ */ jsx(MoreButton, { ref: buttonMoreRef, onClick: handleTogglePopover, label: "More", children: /* @__PURE__ */ jsx(More, {}) }),
4435
- visiblePopover && /* @__PURE__ */ jsx(Popover, { onDismiss: handleTogglePopover, centered: true, source: buttonMoreRef, spacing: 4, children: /* @__PURE__ */ jsxs(Flex, { children: [
4436
- /* @__PURE__ */ jsxs(IconButtonGroupMargin, { children: [
4437
- /* @__PURE__ */ jsx(
4438
- CustomIconButton,
4439
- {
4440
- onClick: () => onActionClick("Strikethrough", editorRef, handleTogglePopover),
4441
- label: "Strikethrough",
4442
- name: "Strikethrough",
4443
- children: /* @__PURE__ */ jsx(StrikeThrough, {})
4444
- }
4445
- ),
4446
- /* @__PURE__ */ jsx(
4447
- CustomIconButton,
4448
- {
4449
- onClick: () => onActionClick("BulletList", editorRef, handleTogglePopover),
4450
- label: "BulletList",
4451
- name: "BulletList",
4452
- children: /* @__PURE__ */ jsx(BulletList, {})
4453
- }
4454
- ),
4455
- /* @__PURE__ */ jsx(
4456
- CustomIconButton,
4457
- {
4458
- onClick: () => onActionClick("NumberList", editorRef, handleTogglePopover),
4459
- label: "NumberList",
4460
- name: "NumberList",
4461
- children: /* @__PURE__ */ jsx(NumberList, {})
4462
- }
4463
- )
4464
- ] }),
4465
- /* @__PURE__ */ jsxs(IconButtonGroup, { children: [
4466
- /* @__PURE__ */ jsx(
4467
- CustomIconButton,
4468
- {
4469
- onClick: () => onActionClick("Code", editorRef, handleTogglePopover),
4470
- label: "Code",
4471
- name: "Code",
4472
- children: /* @__PURE__ */ jsx(Code, {})
4473
- }
4474
- ),
4475
- /* @__PURE__ */ jsx(
4476
- CustomIconButton,
4477
- {
4478
- onClick: () => {
4479
- handleTogglePopover();
4480
- onToggleMediaLib();
4481
- },
4482
- label: "Image",
4483
- name: "Image",
4484
- children: /* @__PURE__ */ jsx(Image$1, {})
4485
- }
4486
- ),
4487
- /* @__PURE__ */ jsx(
4488
- CustomLinkIconButton,
4489
- {
4490
- onClick: () => onActionClick("Link", editorRef, handleTogglePopover),
4491
- label: "Link",
4492
- name: "Link",
4493
- children: /* @__PURE__ */ jsx(Link$1, {})
4494
- }
4495
- ),
4496
- /* @__PURE__ */ jsx(
4497
- CustomIconButton,
4498
- {
4499
- onClick: () => onActionClick("Quote", editorRef, handleTogglePopover),
4500
- label: "Quote",
4501
- name: "Quote",
4502
- children: /* @__PURE__ */ jsx(Quotes, {})
4503
- }
4504
- )
4505
- ] })
4506
- ] }) })
4748
+ /* @__PURE__ */ jsxs(Popover.Root, { children: [
4749
+ /* @__PURE__ */ jsx(Popover.Trigger, { children: /* @__PURE__ */ jsx(MoreButton, { label: "More", children: /* @__PURE__ */ jsx(More, {}) }) }),
4750
+ /* @__PURE__ */ jsx(Popover.Content, { sideOffset: 12, children: /* @__PURE__ */ jsxs(Flex, { padding: 2, children: [
4751
+ /* @__PURE__ */ jsxs(IconButtonGroupMargin, { children: [
4752
+ /* @__PURE__ */ jsx(
4753
+ IconButton,
4754
+ {
4755
+ onClick: () => onActionClick("Strikethrough", editorRef, handleTogglePopover),
4756
+ label: "Strikethrough",
4757
+ name: "Strikethrough",
4758
+ children: /* @__PURE__ */ jsx(StrikeThrough, {})
4759
+ }
4760
+ ),
4761
+ /* @__PURE__ */ jsx(
4762
+ IconButton,
4763
+ {
4764
+ onClick: () => onActionClick("BulletList", editorRef, handleTogglePopover),
4765
+ label: "BulletList",
4766
+ name: "BulletList",
4767
+ children: /* @__PURE__ */ jsx(BulletList, {})
4768
+ }
4769
+ ),
4770
+ /* @__PURE__ */ jsx(
4771
+ IconButton,
4772
+ {
4773
+ onClick: () => onActionClick("NumberList", editorRef, handleTogglePopover),
4774
+ label: "NumberList",
4775
+ name: "NumberList",
4776
+ children: /* @__PURE__ */ jsx(NumberList, {})
4777
+ }
4778
+ )
4779
+ ] }),
4780
+ /* @__PURE__ */ jsxs(IconButtonGroup, { children: [
4781
+ /* @__PURE__ */ jsx(
4782
+ IconButton,
4783
+ {
4784
+ onClick: () => onActionClick("Code", editorRef, handleTogglePopover),
4785
+ label: "Code",
4786
+ name: "Code",
4787
+ children: /* @__PURE__ */ jsx(Code, {})
4788
+ }
4789
+ ),
4790
+ /* @__PURE__ */ jsx(
4791
+ IconButton,
4792
+ {
4793
+ onClick: () => {
4794
+ handleTogglePopover();
4795
+ onToggleMediaLib();
4796
+ },
4797
+ label: "Image",
4798
+ name: "Image",
4799
+ children: /* @__PURE__ */ jsx(Image$1, {})
4800
+ }
4801
+ ),
4802
+ /* @__PURE__ */ jsx(
4803
+ IconButton,
4804
+ {
4805
+ onClick: () => onActionClick("Link", editorRef, handleTogglePopover),
4806
+ label: "Link",
4807
+ name: "Link",
4808
+ children: /* @__PURE__ */ jsx(Link$1, {})
4809
+ }
4810
+ ),
4811
+ /* @__PURE__ */ jsx(
4812
+ IconButton,
4813
+ {
4814
+ onClick: () => onActionClick("Quote", editorRef, handleTogglePopover),
4815
+ label: "Quote",
4816
+ name: "Quote",
4817
+ children: /* @__PURE__ */ jsx(Quotes, {})
4818
+ }
4819
+ )
4820
+ ] })
4821
+ ] }) })
4822
+ ] })
4507
4823
  ] }),
4508
4824
  onTogglePreviewMode && /* @__PURE__ */ jsx(Button, { onClick: onTogglePreviewMode, variant: "tertiary", children: formatMessage({
4509
4825
  id: "components.Wysiwyg.ToggleMode.preview-mode",
@@ -4630,15 +4946,19 @@ const Wysiwyg = React.forwardRef(
4630
4946
  );
4631
4947
  const MemoizedWysiwyg = React.memo(Wysiwyg);
4632
4948
  const InputRenderer = ({ visible, hint: providedHint, ...props }) => {
4633
- const { id } = useDoc();
4949
+ const { id, document: document2, collectionType } = useDoc();
4634
4950
  const isFormDisabled = useForm("InputRenderer", (state) => state.disabled);
4635
4951
  const isInDynamicZone = useDynamicZone("isInDynamicZone", (state) => state.isInDynamicZone);
4636
4952
  const canCreateFields = useDocumentRBAC("InputRenderer", (rbac) => rbac.canCreateFields);
4637
4953
  const canReadFields = useDocumentRBAC("InputRenderer", (rbac) => rbac.canReadFields);
4638
4954
  const canUpdateFields = useDocumentRBAC("InputRenderer", (rbac) => rbac.canUpdateFields);
4639
4955
  const canUserAction = useDocumentRBAC("InputRenderer", (rbac) => rbac.canUserAction);
4640
- const editableFields = id ? canUpdateFields : canCreateFields;
4641
- const readableFields = id ? canReadFields : canCreateFields;
4956
+ let idToCheck = id;
4957
+ if (collectionType === SINGLE_TYPES) {
4958
+ idToCheck = document2?.documentId;
4959
+ }
4960
+ const editableFields = idToCheck ? canUpdateFields : canCreateFields;
4961
+ const readableFields = idToCheck ? canReadFields : canCreateFields;
4642
4962
  const canUserReadField = canUserAction(props.name, readableFields, props.type);
4643
4963
  const canUserEditField = canUserAction(props.name, editableFields, props.type);
4644
4964
  const fields = useStrapiApp("InputRenderer", (app) => app.fields);
@@ -4649,6 +4969,7 @@ const InputRenderer = ({ visible, hint: providedHint, ...props }) => {
4649
4969
  const {
4650
4970
  edit: { components }
4651
4971
  } = useDocLayout();
4972
+ const field = useField(props.name);
4652
4973
  if (!visible) {
4653
4974
  return null;
4654
4975
  }
@@ -4659,7 +4980,7 @@ const InputRenderer = ({ visible, hint: providedHint, ...props }) => {
4659
4980
  if (attributeHasCustomFieldProperty(props.attribute)) {
4660
4981
  const CustomInput = lazyComponentStore[props.attribute.customField];
4661
4982
  if (CustomInput) {
4662
- return /* @__PURE__ */ jsx(CustomInput, { ...props, hint, disabled: fieldIsDisabled });
4983
+ return /* @__PURE__ */ jsx(CustomInput, { ...props, ...field, hint, disabled: fieldIsDisabled });
4663
4984
  }
4664
4985
  return /* @__PURE__ */ jsx(
4665
4986
  InputRenderer$1,
@@ -4729,7 +5050,9 @@ const useFieldHint = (hint = void 0, attribute) => {
4729
5050
  if (!maximum && !minimum) {
4730
5051
  return hint;
4731
5052
  }
4732
- const units = !["biginteger", "integer", "number"].includes(attribute.type) ? formatMessage(
5053
+ const units = !["biginteger", "integer", "number", "dynamiczone", "component"].includes(
5054
+ attribute.type
5055
+ ) ? formatMessage(
4733
5056
  {
4734
5057
  id: "content-manager.form.Input.hint.character.unit",
4735
5058
  defaultMessage: "{maxValue, plural, one { character} other { characters}}"
@@ -4818,12 +5141,20 @@ const DynamicComponent = ({
4818
5141
  React.useEffect(() => {
4819
5142
  dragPreviewRef(getEmptyImage(), { captureDraggingState: false });
4820
5143
  }, [dragPreviewRef, index]);
5144
+ const accordionValue = React.useId();
5145
+ const { value = [], rawError } = useField(`${name2}.${index}`);
5146
+ const [collapseToOpen, setCollapseToOpen] = React.useState("");
5147
+ React.useEffect(() => {
5148
+ if (rawError && value) {
5149
+ setCollapseToOpen(accordionValue);
5150
+ }
5151
+ }, [rawError, value, accordionValue]);
4821
5152
  const composedBoxRefs = useComposedRefs(boxRef, dropRef);
4822
5153
  const accordionActions = disabled ? null : /* @__PURE__ */ jsxs(Fragment, { children: [
4823
5154
  /* @__PURE__ */ jsx(
4824
5155
  IconButton,
4825
5156
  {
4826
- borderWidth: 0,
5157
+ variant: "ghost",
4827
5158
  label: formatMessage(
4828
5159
  {
4829
5160
  id: getTranslation("components.DynamicZone.delete-label"),
@@ -4838,7 +5169,7 @@ const DynamicComponent = ({
4838
5169
  /* @__PURE__ */ jsx(
4839
5170
  IconButton,
4840
5171
  {
4841
- borderWidth: 0,
5172
+ variant: "ghost",
4842
5173
  onClick: (e) => e.stopPropagation(),
4843
5174
  "data-handler-id": handlerId,
4844
5175
  ref: dragRef,
@@ -4883,10 +5214,9 @@ const DynamicComponent = ({
4883
5214
  ] })
4884
5215
  ] });
4885
5216
  const accordionTitle = title ? `${displayName} ${title}` : displayName;
4886
- const accordionValue = React.useId();
4887
5217
  return /* @__PURE__ */ jsxs(ComponentContainer, { tag: "li", width: "100%", children: [
4888
5218
  /* @__PURE__ */ jsx(Flex, { justifyContent: "center", children: /* @__PURE__ */ jsx(Rectangle, { background: "neutral200" }) }),
4889
- /* @__PURE__ */ jsx(StyledBox, { ref: composedBoxRefs, hasRadius: true, children: isDragging ? /* @__PURE__ */ jsx(Preview, {}) : /* @__PURE__ */ jsx(Accordion.Root, { children: /* @__PURE__ */ jsxs(Accordion.Item, { value: accordionValue, children: [
5219
+ /* @__PURE__ */ jsx(StyledBox, { ref: composedBoxRefs, hasRadius: true, children: isDragging ? /* @__PURE__ */ jsx(Preview, {}) : /* @__PURE__ */ jsx(Accordion.Root, { value: collapseToOpen, onValueChange: setCollapseToOpen, children: /* @__PURE__ */ jsxs(Accordion.Item, { value: accordionValue, children: [
4890
5220
  /* @__PURE__ */ jsxs(Accordion.Header, { children: [
4891
5221
  /* @__PURE__ */ jsx(
4892
5222
  Accordion.Trigger,
@@ -4897,10 +5227,32 @@ const DynamicComponent = ({
4897
5227
  ),
4898
5228
  /* @__PURE__ */ jsx(Accordion.Actions, { children: accordionActions })
4899
5229
  ] }),
4900
- /* @__PURE__ */ jsx(Accordion.Content, { children: /* @__PURE__ */ jsx(AccordionContentRadius, { background: "neutral0", children: /* @__PURE__ */ jsx(Box, { paddingLeft: 6, paddingRight: 6, paddingTop: 6, paddingBottom: 6, children: components[componentUid]?.layout?.map((row, rowInd) => /* @__PURE__ */ jsx(Grid$1, { gap: 4, children: row.map(({ size, ...field }) => {
4901
- const fieldName = `${name2}.${index}.${field.name}`;
4902
- return /* @__PURE__ */ jsx(GridItem, { col: size, s: 12, xs: 12, children: /* @__PURE__ */ jsx(MemoizedInputRenderer, { ...field, name: fieldName }) }, fieldName);
4903
- }) }, rowInd)) }) }) })
5230
+ /* @__PURE__ */ jsx(Accordion.Content, { children: /* @__PURE__ */ jsx(AccordionContentRadius, { background: "neutral0", children: /* @__PURE__ */ jsx(Box, { paddingLeft: 6, paddingRight: 6, paddingTop: 6, paddingBottom: 6, children: /* @__PURE__ */ jsx(Grid$1.Root, { gap: 4, children: components[componentUid]?.layout?.map((row, rowInd) => /* @__PURE__ */ jsx(
5231
+ Grid$1.Item,
5232
+ {
5233
+ col: 12,
5234
+ s: 12,
5235
+ xs: 12,
5236
+ direction: "column",
5237
+ alignItems: "stretch",
5238
+ children: /* @__PURE__ */ jsx(Grid$1.Root, { gap: 4, children: row.map(({ size, ...field }) => {
5239
+ const fieldName = `${name2}.${index}.${field.name}`;
5240
+ return /* @__PURE__ */ jsx(
5241
+ Grid$1.Item,
5242
+ {
5243
+ col: size,
5244
+ s: 12,
5245
+ xs: 12,
5246
+ direction: "column",
5247
+ alignItems: "stretch",
5248
+ children: /* @__PURE__ */ jsx(MemoizedInputRenderer, { ...field, name: fieldName })
5249
+ },
5250
+ fieldName
5251
+ );
5252
+ }) })
5253
+ },
5254
+ rowInd
5255
+ )) }) }) }) })
4904
5256
  ] }) }) })
4905
5257
  ] });
4906
5258
  };
@@ -5092,7 +5444,7 @@ const DynamicZone = ({
5092
5444
  const handleRemoveComponent = (name22, currentIndex) => () => {
5093
5445
  removeFieldRow(name22, currentIndex);
5094
5446
  };
5095
- const hasError = error !== void 0 || dynamicDisplayedComponentsLength < min || dynamicDisplayedComponentsLength > max;
5447
+ const hasError = error !== void 0;
5096
5448
  const renderButtonLabel = () => {
5097
5449
  if (addComponentIsOpen) {
5098
5450
  return formatMessage({ id: "app.utils.close-label", defaultMessage: "Close" });
@@ -5208,4 +5560,4 @@ export {
5208
5560
  transformDocument as t,
5209
5561
  useLazyComponents as u
5210
5562
  };
5211
- //# sourceMappingURL=Field-C1nUKcdS.mjs.map
5563
+ //# sourceMappingURL=Field-DufHXW17.mjs.map