@strapi/content-manager 0.0.0-next.0791cd2736057a8f66ee1682f02c46307a4d6e4a → 0.0.0-next.0fc44faf3ab6f94c481a4d426988705776878bb3

package/dist/admin/pages/EditView/components/FormInputs/Wysiwyg/EditorLayout.js

@@ -1,117 +1,73 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
-var React = require('react');
+require('react');
 var designSystem = require('@strapi/design-system');
 var Icons = require('@strapi/icons');
 var reactIntl = require('react-intl');
 var styledComponents = require('styled-components');
 var PreviewWysiwyg = require('./PreviewWysiwyg.js');
 
-function _interopNamespaceDefault(e) {
-  var n = Object.create(null);
-  if (e) {
-    Object.keys(e).forEach(function (k) {
-      if (k !== 'default') {
-        var d = Object.getOwnPropertyDescriptor(e, k);
-        Object.defineProperty(n, k, d.get ? d : {
-          enumerable: true,
-          get: function () { return e[k]; }
-        });
-      }
-    });
-  }
-  n.default = e;
-  return Object.freeze(n);
-}
-
-var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
-
 const EditorLayout = ({ children, isExpandMode, error, previewContent = '', onCollapse })=>{
     const { formatMessage } = reactIntl.useIntl();
-    React__namespace.useEffect(()=>{
-        if (isExpandMode) {
-            document.body.classList.add('lock-body-scroll');
-        }
-        return ()=>{
-            document.body.classList.remove('lock-body-scroll');
-        };
-    }, [
-        isExpandMode
-    ]);
     if (isExpandMode) {
-        return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Portal, {
-            role: "dialog",
-            "aria-modal": false,
-            children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.FocusTrap, {
-                onEscape: onCollapse,
-                children: /*#__PURE__*/ jsxRuntime.jsx(ExpandWrapper, {
-                    position: "fixed",
-                    top: 0,
-                    left: 0,
-                    right: 0,
-                    bottom: 0,
-                    zIndex: 4,
-                    justifyContent: "center",
-                    onClick: onCollapse,
-                    children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Box, {
-                        background: "neutral0",
-                        hasRadius: true,
-                        shadow: "popupShadow",
-                        overflow: "hidden",
-                        width: "90%",
-                        height: "90%",
-                        onClick: (e)=>e.stopPropagation(),
-                        children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
+        return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Modal.Root, {
+            open: isExpandMode,
+            onOpenChange: onCollapse,
+            children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Modal.Content, {
+                style: {
+                    maxWidth: 'unset',
+                    width: 'unset'
+                },
+                children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
+                    height: "90vh",
+                    width: "90vw",
+                    alignItems: "flex-start",
+                    children: [
+                        /*#__PURE__*/ jsxRuntime.jsx(BoxWithBorder, {
+                            flex: "1",
                             height: "100%",
-                            alignItems: "flex-start",
+                            children: children
+                        }),
+                        /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
+                            alignItems: "start",
+                            direction: "column",
+                            flex: 1,
+                            height: "100%",
+                            width: "100%",
                             children: [
-                                /*#__PURE__*/ jsxRuntime.jsx(BoxWithBorder, {
-                                    flex: "1",
-                                    height: "100%",
-                                    children: children
+                                /*#__PURE__*/ jsxRuntime.jsx(designSystem.Flex, {
+                                    height: "4.8rem",
+                                    background: "neutral100",
+                                    justifyContent: "flex-end",
+                                    shrink: 0,
+                                    width: "100%",
+                                    children: /*#__PURE__*/ jsxRuntime.jsxs(ExpandButton, {
+                                        onClick: onCollapse,
+                                        variant: "tertiary",
+                                        size: "M",
+                                        children: [
+                                            /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
+                                                children: formatMessage({
+                                                    id: 'components.Wysiwyg.collapse',
+                                                    defaultMessage: 'Collapse'
+                                                })
+                                            }),
+                                            /*#__PURE__*/ jsxRuntime.jsx(Icons.Collapse, {})
+                                        ]
+                                    })
                                 }),
-                                /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
-                                    alignItems: "start",
-                                    direction: "column",
-                                    flex: 1,
+                                /*#__PURE__*/ jsxRuntime.jsx(designSystem.Box, {
+                                    position: "relative",
                                     height: "100%",
                                     width: "100%",
-                                    children: [
-                                        /*#__PURE__*/ jsxRuntime.jsx(designSystem.Flex, {
-                                            height: "4.8rem",
-                                            background: "neutral100",
-                                            justifyContent: "flex-end",
-                                            shrink: 0,
-                                            width: "100%",
-                                            children: /*#__PURE__*/ jsxRuntime.jsxs(ExpandButton, {
-                                                onClick: onCollapse,
-                                                variant: "tertiary",
-                                                size: "M",
-                                                children: [
-                                                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
-                                                        children: formatMessage({
-                                                            id: 'components.Wysiwyg.collapse',
-                                                            defaultMessage: 'Collapse'
-                                                        })
-                                                    }),
-                                                    /*#__PURE__*/ jsxRuntime.jsx(Icons.Collapse, {})
-                                                ]
-                                            })
-                                        }),
-                                        /*#__PURE__*/ jsxRuntime.jsx(designSystem.Box, {
-                                            position: "relative",
-                                            height: "100%",
-                                            width: "100%",
-                                            children: /*#__PURE__*/ jsxRuntime.jsx(PreviewWysiwyg.PreviewWysiwyg, {
-                                                data: previewContent
-                                            })
-                                        })
-                                    ]
+                                    children: /*#__PURE__*/ jsxRuntime.jsx(PreviewWysiwyg.PreviewWysiwyg, {
+                                        data: previewContent
+                                    })
                                 })
                             ]
                         })
-                    })
+                    ]
                 })
             })
         });
@@ -126,9 +82,6 @@ const EditorLayout = ({ children, isExpandMode, error, previewContent = '', onCo
         children: children
     });
 };
-const ExpandWrapper = styledComponents.styled(designSystem.Flex)`
-  background: ${({ theme })=>`${theme.colors.neutral800}${Math.floor(0.2 * 255).toString(16).padStart(2, '0')}`};
-`;
 const BoxWithBorder = styledComponents.styled(designSystem.Box)`
   border-right: 1px solid ${({ theme })=>theme.colors.neutral200};
 `;

package/dist/admin/pages/EditView/components/FormInputs/Wysiwyg/EditorLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"EditorLayout.js","sources":["../../../../../../../admin/src/pages/EditView/components/FormInputs/Wysiwyg/EditorLayout.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport {\n  Button,\n  Box,\n  BoxComponent,\n  Flex,\n  FlexComponent,\n  FocusTrap,\n  Portal,\n  Typography,\n} from '@strapi/design-system';\nimport { Collapse } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { PreviewWysiwyg } from './PreviewWysiwyg';\n\ninterface EditorLayoutProps {\n  children: React.ReactNode;\n  isExpandMode: boolean;\n  error?: string;\n  previewContent?: string;\n  onCollapse: () => void;\n}\n\nconst EditorLayout = ({\n  children,\n  isExpandMode,\n  error,\n  previewContent = '',\n  onCollapse,\n}: EditorLayoutProps) => {\n  const { formatMessage } = useIntl();\n\n  React.useEffect(() => {\n    if (isExpandMode) {\n      document.body.classList.add('lock-body-scroll');\n    }\n\n    return () => {\n      document.body.classList.remove('lock-body-scroll');\n    };\n  }, [isExpandMode]);\n\n  if (isExpandMode) {\n    return (\n      <Portal role=\"dialog\" aria-modal={false}>\n        <FocusTrap onEscape={onCollapse}>\n          <ExpandWrapper\n            position=\"fixed\"\n            top={0}\n            left={0}\n            right={0}\n            bottom={0}\n            zIndex={4}\n            justifyContent=\"center\"\n            onClick={onCollapse}\n          >\n            <Box<'div'>\n              background=\"neutral0\"\n              hasRadius\n              shadow=\"popupShadow\"\n              overflow=\"hidden\"\n              width=\"90%\"\n              height=\"90%\"\n              onClick={(e) => e.stopPropagation()}\n            >\n              <Flex height=\"100%\" alignItems=\"flex-start\">\n                <BoxWithBorder flex=\"1\" height=\"100%\">\n                  {children}\n                </BoxWithBorder>\n                <Flex alignItems=\"start\" direction=\"column\" flex={1} height=\"100%\" width=\"100%\">\n                  <Flex\n                    height=\"4.8rem\"\n                    background=\"neutral100\"\n                    justifyContent=\"flex-end\"\n                    shrink={0}\n                    width=\"100%\"\n                  >\n                    <ExpandButton onClick={onCollapse} variant=\"tertiary\" size=\"M\">\n                      <Typography>\n                        {formatMessage({\n                          id: 'components.Wysiwyg.collapse',\n                          defaultMessage: 'Collapse',\n                        })}\n                      </Typography>\n                      <Collapse />\n                    </ExpandButton>\n                  </Flex>\n\n                  <Box position=\"relative\" height=\"100%\" width=\"100%\">\n                    <PreviewWysiwyg data={previewContent} />\n                  </Box>\n                </Flex>\n              </Flex>\n            </Box>\n          </ExpandWrapper>\n        </FocusTrap>\n      </Portal>\n    );\n  }\n\n  return (\n    <Flex\n      borderColor={error ? 'danger600' : 'neutral200'}\n      borderStyle=\"solid\"\n      borderWidth=\"1px\"\n      hasRadius\n      direction=\"column\"\n      alignItems=\"stretch\"\n    >\n      {children}\n    </Flex>\n  );\n};\n\nconst ExpandWrapper = styled<FlexComponent>(Flex)`\n  background: ${({ theme }) =>\n    `${theme.colors.neutral800}${Math.floor(0.2 * 255)\n      .toString(16)\n      .padStart(2, '0')}`};\n`;\n\nconst BoxWithBorder = styled<BoxComponent>(Box)`\n  border-right: 1px solid ${({ theme }) => theme.colors.neutral200};\n`;\n\nconst ExpandButton = styled(Button)`\n  background-color: transparent;\n  border: none;\n  align-items: center;\n\n  & > span {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    width: 100%;\n    font-weight: ${({ theme }) => theme.fontWeights.regular};\n  }\n\n  svg {\n    margin-left: ${({ theme }) => `${theme.spaces[2]}`};\n\n    path {\n      fill: ${({ theme }) => theme.colors.neutral700};\n      width: 1.2rem;\n      height: 1.2rem;\n    }\n  }\n`;\n\nexport { EditorLayout, ExpandButton };\nexport type { EditorLayoutProps };\n"],"names":["EditorLayout","children","isExpandMode","error","previewContent","onCollapse","formatMessage","useIntl","React","useEffect","document","body","classList","add","remove","_jsx","Portal","role","aria-modal","FocusTrap","onEscape","ExpandWrapper","position","top","left","right","bottom","zIndex","justifyContent","onClick","Box","background","hasRadius","shadow","overflow","width","height","e","stopPropagation","_jsxs","Flex","alignItems","BoxWithBorder","flex","direction","shrink","ExpandButton","variant","size","Typography","id","defaultMessage","Collapse","PreviewWysiwyg","data","borderColor","borderStyle","borderWidth","styled","theme","colors","neutral800","Math","floor","toString","padStart","neutral200","Button","fontWeights","regular","spaces","neutral700"],"mappings":"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"}
+{"version":3,"file":"EditorLayout.js","sources":["../../../../../../../admin/src/pages/EditView/components/FormInputs/Wysiwyg/EditorLayout.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Button, Box, BoxComponent, Flex, Typography, Modal } from '@strapi/design-system';\nimport { Collapse } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { PreviewWysiwyg } from './PreviewWysiwyg';\n\ninterface EditorLayoutProps {\n  children: React.ReactNode;\n  isExpandMode: boolean;\n  error?: string;\n  previewContent?: string;\n  onCollapse: () => void;\n}\n\nconst EditorLayout = ({\n  children,\n  isExpandMode,\n  error,\n  previewContent = '',\n  onCollapse,\n}: EditorLayoutProps) => {\n  const { formatMessage } = useIntl();\n\n  if (isExpandMode) {\n    return (\n      <Modal.Root open={isExpandMode} onOpenChange={onCollapse}>\n        <Modal.Content style={{ maxWidth: 'unset', width: 'unset' }}>\n          <Flex height=\"90vh\" width=\"90vw\" alignItems=\"flex-start\">\n            <BoxWithBorder flex=\"1\" height=\"100%\">\n              {children}\n            </BoxWithBorder>\n            <Flex alignItems=\"start\" direction=\"column\" flex={1} height=\"100%\" width=\"100%\">\n              <Flex\n                height=\"4.8rem\"\n                background=\"neutral100\"\n                justifyContent=\"flex-end\"\n                shrink={0}\n                width=\"100%\"\n              >\n                <ExpandButton onClick={onCollapse} variant=\"tertiary\" size=\"M\">\n                  <Typography>\n                    {formatMessage({\n                      id: 'components.Wysiwyg.collapse',\n                      defaultMessage: 'Collapse',\n                    })}\n                  </Typography>\n                  <Collapse />\n                </ExpandButton>\n              </Flex>\n              <Box position=\"relative\" height=\"100%\" width=\"100%\">\n                <PreviewWysiwyg data={previewContent} />\n              </Box>\n            </Flex>\n          </Flex>\n        </Modal.Content>\n      </Modal.Root>\n    );\n  }\n\n  return (\n    <Flex\n      borderColor={error ? 'danger600' : 'neutral200'}\n      borderStyle=\"solid\"\n      borderWidth=\"1px\"\n      hasRadius\n      direction=\"column\"\n      alignItems=\"stretch\"\n    >\n      {children}\n    </Flex>\n  );\n};\n\nconst BoxWithBorder = styled<BoxComponent>(Box)`\n  border-right: 1px solid ${({ theme }) => theme.colors.neutral200};\n`;\n\nconst ExpandButton = styled(Button)`\n  background-color: transparent;\n  border: none;\n  align-items: center;\n\n  & > span {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    width: 100%;\n    font-weight: ${({ theme }) => theme.fontWeights.regular};\n  }\n\n  svg {\n    margin-left: ${({ theme }) => `${theme.spaces[2]}`};\n\n    path {\n      fill: ${({ theme }) => theme.colors.neutral700};\n      width: 1.2rem;\n      height: 1.2rem;\n    }\n  }\n`;\n\nexport { EditorLayout, ExpandButton };\nexport type { EditorLayoutProps };\n"],"names":["EditorLayout","children","isExpandMode","error","previewContent","onCollapse","formatMessage","useIntl","_jsx","Modal","Root","open","onOpenChange","Content","style","maxWidth","width","_jsxs","Flex","height","alignItems","BoxWithBorder","flex","direction","background","justifyContent","shrink","ExpandButton","onClick","variant","size","Typography","id","defaultMessage","Collapse","Box","position","PreviewWysiwyg","data","borderColor","borderStyle","borderWidth","hasRadius","styled","theme","colors","neutral200","Button","fontWeights","regular","spaces","neutral700"],"mappings":"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"}

package/dist/admin/pages/EditView/components/FormInputs/Wysiwyg/EditorLayout.mjs

@@ -1,6 +1,6 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
-import * as React from 'react';
-import { Flex, Box, Button, Portal, FocusTrap, Typography } from '@strapi/design-system';
+import 'react';
+import { Box, Button, Modal, Flex, Typography } from '@strapi/design-system';
 import { Collapse } from '@strapi/icons';
 import { useIntl } from 'react-intl';
 import { styled } from 'styled-components';
@@ -8,89 +8,64 @@ import { PreviewWysiwyg } from './PreviewWysiwyg.mjs';
 
 const EditorLayout = ({ children, isExpandMode, error, previewContent = '', onCollapse })=>{
     const { formatMessage } = useIntl();
-    React.useEffect(()=>{
-        if (isExpandMode) {
-            document.body.classList.add('lock-body-scroll');
-        }
-        return ()=>{
-            document.body.classList.remove('lock-body-scroll');
-        };
-    }, [
-        isExpandMode
-    ]);
     if (isExpandMode) {
-        return /*#__PURE__*/ jsx(Portal, {
-            role: "dialog",
-            "aria-modal": false,
-            children: /*#__PURE__*/ jsx(FocusTrap, {
-                onEscape: onCollapse,
-                children: /*#__PURE__*/ jsx(ExpandWrapper, {
-                    position: "fixed",
-                    top: 0,
-                    left: 0,
-                    right: 0,
-                    bottom: 0,
-                    zIndex: 4,
-                    justifyContent: "center",
-                    onClick: onCollapse,
-                    children: /*#__PURE__*/ jsx(Box, {
-                        background: "neutral0",
-                        hasRadius: true,
-                        shadow: "popupShadow",
-                        overflow: "hidden",
-                        width: "90%",
-                        height: "90%",
-                        onClick: (e)=>e.stopPropagation(),
-                        children: /*#__PURE__*/ jsxs(Flex, {
+        return /*#__PURE__*/ jsx(Modal.Root, {
+            open: isExpandMode,
+            onOpenChange: onCollapse,
+            children: /*#__PURE__*/ jsx(Modal.Content, {
+                style: {
+                    maxWidth: 'unset',
+                    width: 'unset'
+                },
+                children: /*#__PURE__*/ jsxs(Flex, {
+                    height: "90vh",
+                    width: "90vw",
+                    alignItems: "flex-start",
+                    children: [
+                        /*#__PURE__*/ jsx(BoxWithBorder, {
+                            flex: "1",
                             height: "100%",
-                            alignItems: "flex-start",
+                            children: children
+                        }),
+                        /*#__PURE__*/ jsxs(Flex, {
+                            alignItems: "start",
+                            direction: "column",
+                            flex: 1,
+                            height: "100%",
+                            width: "100%",
                             children: [
-                                /*#__PURE__*/ jsx(BoxWithBorder, {
-                                    flex: "1",
-                                    height: "100%",
-                                    children: children
+                                /*#__PURE__*/ jsx(Flex, {
+                                    height: "4.8rem",
+                                    background: "neutral100",
+                                    justifyContent: "flex-end",
+                                    shrink: 0,
+                                    width: "100%",
+                                    children: /*#__PURE__*/ jsxs(ExpandButton, {
+                                        onClick: onCollapse,
+                                        variant: "tertiary",
+                                        size: "M",
+                                        children: [
+                                            /*#__PURE__*/ jsx(Typography, {
+                                                children: formatMessage({
+                                                    id: 'components.Wysiwyg.collapse',
+                                                    defaultMessage: 'Collapse'
+                                                })
+                                            }),
+                                            /*#__PURE__*/ jsx(Collapse, {})
+                                        ]
+                                    })
                                 }),
-                                /*#__PURE__*/ jsxs(Flex, {
-                                    alignItems: "start",
-                                    direction: "column",
-                                    flex: 1,
+                                /*#__PURE__*/ jsx(Box, {
+                                    position: "relative",
                                     height: "100%",
                                     width: "100%",
-                                    children: [
-                                        /*#__PURE__*/ jsx(Flex, {
-                                            height: "4.8rem",
-                                            background: "neutral100",
-                                            justifyContent: "flex-end",
-                                            shrink: 0,
-                                            width: "100%",
-                                            children: /*#__PURE__*/ jsxs(ExpandButton, {
-                                                onClick: onCollapse,
-                                                variant: "tertiary",
-                                                size: "M",
-                                                children: [
-                                                    /*#__PURE__*/ jsx(Typography, {
-                                                        children: formatMessage({
-                                                            id: 'components.Wysiwyg.collapse',
-                                                            defaultMessage: 'Collapse'
-                                                        })
-                                                    }),
-                                                    /*#__PURE__*/ jsx(Collapse, {})
-                                                ]
-                                            })
-                                        }),
-                                        /*#__PURE__*/ jsx(Box, {
-                                            position: "relative",
-                                            height: "100%",
-                                            width: "100%",
-                                            children: /*#__PURE__*/ jsx(PreviewWysiwyg, {
-                                                data: previewContent
-                                            })
-                                        })
-                                    ]
+                                    children: /*#__PURE__*/ jsx(PreviewWysiwyg, {
+                                        data: previewContent
+                                    })
                                 })
                             ]
                         })
-                    })
+                    ]
                 })
             })
         });
@@ -105,9 +80,6 @@ const EditorLayout = ({ children, isExpandMode, error, previewContent = '', onCo
         children: children
     });
 };
-const ExpandWrapper = styled(Flex)`
-  background: ${({ theme })=>`${theme.colors.neutral800}${Math.floor(0.2 * 255).toString(16).padStart(2, '0')}`};
-`;
 const BoxWithBorder = styled(Box)`
   border-right: 1px solid ${({ theme })=>theme.colors.neutral200};
 `;

package/dist/admin/pages/EditView/components/FormInputs/Wysiwyg/EditorLayout.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"EditorLayout.mjs","sources":["../../../../../../../admin/src/pages/EditView/components/FormInputs/Wysiwyg/EditorLayout.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport {\n  Button,\n  Box,\n  BoxComponent,\n  Flex,\n  FlexComponent,\n  FocusTrap,\n  Portal,\n  Typography,\n} from '@strapi/design-system';\nimport { Collapse } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { PreviewWysiwyg } from './PreviewWysiwyg';\n\ninterface EditorLayoutProps {\n  children: React.ReactNode;\n  isExpandMode: boolean;\n  error?: string;\n  previewContent?: string;\n  onCollapse: () => void;\n}\n\nconst EditorLayout = ({\n  children,\n  isExpandMode,\n  error,\n  previewContent = '',\n  onCollapse,\n}: EditorLayoutProps) => {\n  const { formatMessage } = useIntl();\n\n  React.useEffect(() => {\n    if (isExpandMode) {\n      document.body.classList.add('lock-body-scroll');\n    }\n\n    return () => {\n      document.body.classList.remove('lock-body-scroll');\n    };\n  }, [isExpandMode]);\n\n  if (isExpandMode) {\n    return (\n      <Portal role=\"dialog\" aria-modal={false}>\n        <FocusTrap onEscape={onCollapse}>\n          <ExpandWrapper\n            position=\"fixed\"\n            top={0}\n            left={0}\n            right={0}\n            bottom={0}\n            zIndex={4}\n            justifyContent=\"center\"\n            onClick={onCollapse}\n          >\n            <Box<'div'>\n              background=\"neutral0\"\n              hasRadius\n              shadow=\"popupShadow\"\n              overflow=\"hidden\"\n              width=\"90%\"\n              height=\"90%\"\n              onClick={(e) => e.stopPropagation()}\n            >\n              <Flex height=\"100%\" alignItems=\"flex-start\">\n                <BoxWithBorder flex=\"1\" height=\"100%\">\n                  {children}\n                </BoxWithBorder>\n                <Flex alignItems=\"start\" direction=\"column\" flex={1} height=\"100%\" width=\"100%\">\n                  <Flex\n                    height=\"4.8rem\"\n                    background=\"neutral100\"\n                    justifyContent=\"flex-end\"\n                    shrink={0}\n                    width=\"100%\"\n                  >\n                    <ExpandButton onClick={onCollapse} variant=\"tertiary\" size=\"M\">\n                      <Typography>\n                        {formatMessage({\n                          id: 'components.Wysiwyg.collapse',\n                          defaultMessage: 'Collapse',\n                        })}\n                      </Typography>\n                      <Collapse />\n                    </ExpandButton>\n                  </Flex>\n\n                  <Box position=\"relative\" height=\"100%\" width=\"100%\">\n                    <PreviewWysiwyg data={previewContent} />\n                  </Box>\n                </Flex>\n              </Flex>\n            </Box>\n          </ExpandWrapper>\n        </FocusTrap>\n      </Portal>\n    );\n  }\n\n  return (\n    <Flex\n      borderColor={error ? 'danger600' : 'neutral200'}\n      borderStyle=\"solid\"\n      borderWidth=\"1px\"\n      hasRadius\n      direction=\"column\"\n      alignItems=\"stretch\"\n    >\n      {children}\n    </Flex>\n  );\n};\n\nconst ExpandWrapper = styled<FlexComponent>(Flex)`\n  background: ${({ theme }) =>\n    `${theme.colors.neutral800}${Math.floor(0.2 * 255)\n      .toString(16)\n      .padStart(2, '0')}`};\n`;\n\nconst BoxWithBorder = styled<BoxComponent>(Box)`\n  border-right: 1px solid ${({ theme }) => theme.colors.neutral200};\n`;\n\nconst ExpandButton = styled(Button)`\n  background-color: transparent;\n  border: none;\n  align-items: center;\n\n  & > span {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    width: 100%;\n    font-weight: ${({ theme }) => theme.fontWeights.regular};\n  }\n\n  svg {\n    margin-left: ${({ theme }) => `${theme.spaces[2]}`};\n\n    path {\n      fill: ${({ theme }) => theme.colors.neutral700};\n      width: 1.2rem;\n      height: 1.2rem;\n    }\n  }\n`;\n\nexport { EditorLayout, ExpandButton };\nexport type { EditorLayoutProps };\n"],"names":["EditorLayout","children","isExpandMode","error","previewContent","onCollapse","formatMessage","useIntl","React","useEffect","document","body","classList","add","remove","_jsx","Portal","role","aria-modal","FocusTrap","onEscape","ExpandWrapper","position","top","left","right","bottom","zIndex","justifyContent","onClick","Box","background","hasRadius","shadow","overflow","width","height","e","stopPropagation","_jsxs","Flex","alignItems","BoxWithBorder","flex","direction","shrink","ExpandButton","variant","size","Typography","id","defaultMessage","Collapse","PreviewWysiwyg","data","borderColor","borderStyle","borderWidth","styled","theme","colors","neutral800","Math","floor","toString","padStart","neutral200","Button","fontWeights","regular","spaces","neutral700"],"mappings":"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"}
+{"version":3,"file":"EditorLayout.mjs","sources":["../../../../../../../admin/src/pages/EditView/components/FormInputs/Wysiwyg/EditorLayout.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Button, Box, BoxComponent, Flex, Typography, Modal } from '@strapi/design-system';\nimport { Collapse } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { PreviewWysiwyg } from './PreviewWysiwyg';\n\ninterface EditorLayoutProps {\n  children: React.ReactNode;\n  isExpandMode: boolean;\n  error?: string;\n  previewContent?: string;\n  onCollapse: () => void;\n}\n\nconst EditorLayout = ({\n  children,\n  isExpandMode,\n  error,\n  previewContent = '',\n  onCollapse,\n}: EditorLayoutProps) => {\n  const { formatMessage } = useIntl();\n\n  if (isExpandMode) {\n    return (\n      <Modal.Root open={isExpandMode} onOpenChange={onCollapse}>\n        <Modal.Content style={{ maxWidth: 'unset', width: 'unset' }}>\n          <Flex height=\"90vh\" width=\"90vw\" alignItems=\"flex-start\">\n            <BoxWithBorder flex=\"1\" height=\"100%\">\n              {children}\n            </BoxWithBorder>\n            <Flex alignItems=\"start\" direction=\"column\" flex={1} height=\"100%\" width=\"100%\">\n              <Flex\n                height=\"4.8rem\"\n                background=\"neutral100\"\n                justifyContent=\"flex-end\"\n                shrink={0}\n                width=\"100%\"\n              >\n                <ExpandButton onClick={onCollapse} variant=\"tertiary\" size=\"M\">\n                  <Typography>\n                    {formatMessage({\n                      id: 'components.Wysiwyg.collapse',\n                      defaultMessage: 'Collapse',\n                    })}\n                  </Typography>\n                  <Collapse />\n                </ExpandButton>\n              </Flex>\n              <Box position=\"relative\" height=\"100%\" width=\"100%\">\n                <PreviewWysiwyg data={previewContent} />\n              </Box>\n            </Flex>\n          </Flex>\n        </Modal.Content>\n      </Modal.Root>\n    );\n  }\n\n  return (\n    <Flex\n      borderColor={error ? 'danger600' : 'neutral200'}\n      borderStyle=\"solid\"\n      borderWidth=\"1px\"\n      hasRadius\n      direction=\"column\"\n      alignItems=\"stretch\"\n    >\n      {children}\n    </Flex>\n  );\n};\n\nconst BoxWithBorder = styled<BoxComponent>(Box)`\n  border-right: 1px solid ${({ theme }) => theme.colors.neutral200};\n`;\n\nconst ExpandButton = styled(Button)`\n  background-color: transparent;\n  border: none;\n  align-items: center;\n\n  & > span {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    width: 100%;\n    font-weight: ${({ theme }) => theme.fontWeights.regular};\n  }\n\n  svg {\n    margin-left: ${({ theme }) => `${theme.spaces[2]}`};\n\n    path {\n      fill: ${({ theme }) => theme.colors.neutral700};\n      width: 1.2rem;\n      height: 1.2rem;\n    }\n  }\n`;\n\nexport { EditorLayout, ExpandButton };\nexport type { EditorLayoutProps };\n"],"names":["EditorLayout","children","isExpandMode","error","previewContent","onCollapse","formatMessage","useIntl","_jsx","Modal","Root","open","onOpenChange","Content","style","maxWidth","width","_jsxs","Flex","height","alignItems","BoxWithBorder","flex","direction","background","justifyContent","shrink","ExpandButton","onClick","variant","size","Typography","id","defaultMessage","Collapse","Box","position","PreviewWysiwyg","data","borderColor","borderStyle","borderWidth","hasRadius","styled","theme","colors","neutral200","Button","fontWeights","regular","spaces","neutral700"],"mappings":"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"}

package/dist/admin/pages/EditView/components/FormLayout.js

@@ -27,7 +27,7 @@ const ResponsiveGridItem = /**
       `;
 const FormLayout = ({ layout, document, hasBackground = true })=>{
     const { formatMessage } = reactIntl.useIntl();
-    const model = document.schema?.modelName;
+    const modelUid = document.schema?.uid;
     return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Flex, {
         direction: "column",
         alignItems: "stretch",
@@ -39,7 +39,7 @@ const FormLayout = ({ layout, document, hasBackground = true })=>{
                 const fieldWithTranslatedLabel = {
                     ...field,
                     label: formatMessage({
-                        id: `content-manager.content-types.${model}.${field.name}`,
+                        id: `content-manager.content-types.${modelUid}.${field.name}`,
                         defaultMessage: field.label
                     })
                 };
@@ -76,7 +76,7 @@ const FormLayout = ({ layout, document, hasBackground = true })=>{
                                 const fieldWithTranslatedLabel = {
                                     ...field,
                                     label: formatMessage({
-                                        id: `content-manager.content-types.${model}.${field.name}`,
+                                        id: `content-manager.content-types.${modelUid}.${field.name}`,
                                         defaultMessage: field.label
                                     })
                                 };

package/dist/admin/pages/EditView/components/FormLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormLayout.js","sources":["../../../../../admin/src/pages/EditView/components/FormLayout.tsx"],"sourcesContent":["import { Box, Flex, Grid } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { EditLayout } from '../../../hooks/useDocumentLayout';\n\nimport { InputRenderer } from './InputRenderer';\n\nimport type { UseDocument } from '../../../hooks/useDocument';\n\nexport const RESPONSIVE_CONTAINER_BREAKPOINTS = {\n  sm: '27.5rem', // 440px\n};\n\nexport const ResponsiveGridRoot = styled(Grid.Root)`\n  container-type: inline-size;\n`;\n\nexport const ResponsiveGridItem =\n  /**\n   * TODO:\n   * JSDOM cannot handle container queries.\n   * This is a temporary workaround so that tests do not fail in the CI when jestdom throws an error\n   * for failing to parse the stylesheet.\n   */\n  process.env.NODE_ENV !== 'test'\n    ? styled(Grid.Item)<{ col: number }>`\n        grid-column: span 12;\n        @container (min-width: ${RESPONSIVE_CONTAINER_BREAKPOINTS.sm}) {\n          ${({ col }) => col && `grid-column: span ${col};`}\n        }\n      `\n    : styled(Grid.Item)<{ col: number }>`\n        grid-column: span 12;\n      `;\n\ninterface FormLayoutProps extends Pick<EditLayout, 'layout'> {\n  hasBackground?: boolean;\n  model?: string;\n  document: ReturnType<UseDocument>;\n}\n\nconst FormLayout = ({ layout, document, hasBackground = true }: FormLayoutProps) => {\n  const { formatMessage } = useIntl();\n  const model = document.schema?.modelName;\n\n  return (\n    <Flex direction=\"column\" alignItems=\"stretch\" gap={6}>\n      {layout.map((panel, index) => {\n        if (panel.some((row) => row.some((field) => field.type === 'dynamiczone'))) {\n          const [row] = panel;\n          const [field] = row;\n\n          const fieldWithTranslatedLabel = {\n            ...field,\n            label: formatMessage({\n              id: `content-manager.content-types.${model}.${field.name}`,\n              defaultMessage: field.label,\n            }),\n          };\n\n          return (\n            <Grid.Root key={field.name} gap={4}>\n              <Grid.Item col={12} s={12} xs={12} direction=\"column\" alignItems=\"stretch\">\n                <InputRenderer {...fieldWithTranslatedLabel} document={document} />\n              </Grid.Item>\n            </Grid.Root>\n          );\n        }\n\n        return (\n          <Box\n            key={index}\n            {...(hasBackground && {\n              padding: 6,\n              borderColor: 'neutral150',\n              background: 'neutral0',\n              hasRadius: true,\n              shadow: 'tableShadow',\n            })}\n          >\n            <Flex direction=\"column\" alignItems=\"stretch\" gap={6}>\n              {panel.map((row, gridRowIndex) => (\n                <ResponsiveGridRoot key={gridRowIndex} gap={4}>\n                  {row.map(({ size, ...field }) => {\n                    const fieldWithTranslatedLabel = {\n                      ...field,\n                      label: formatMessage({\n                        id: `content-manager.content-types.${model}.${field.name}`,\n                        defaultMessage: field.label,\n                      }),\n                    };\n                    return (\n                      <ResponsiveGridItem\n                        col={size}\n                        key={field.name}\n                        s={12}\n                        xs={12}\n                        direction=\"column\"\n                        alignItems=\"stretch\"\n                      >\n                        <InputRenderer {...fieldWithTranslatedLabel} document={document} />\n                      </ResponsiveGridItem>\n                    );\n                  })}\n                </ResponsiveGridRoot>\n              ))}\n            </Flex>\n          </Box>\n        );\n      })}\n    </Flex>\n  );\n};\n\nexport { FormLayout, FormLayoutProps };\n"],"names":["RESPONSIVE_CONTAINER_BREAKPOINTS","sm","ResponsiveGridRoot","styled","Grid","Root","ResponsiveGridItem","process","env","NODE_ENV","Item","col","FormLayout","layout","document","hasBackground","formatMessage","useIntl","model","schema","modelName","_jsx","Flex","direction","alignItems","gap","map","panel","index","some","row","field","type","fieldWithTranslatedLabel","label","id","name","defaultMessage","s","xs","InputRenderer","Box","padding","borderColor","background","hasRadius","shadow","gridRowIndex","size"],"mappings":"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"}
+{"version":3,"file":"FormLayout.js","sources":["../../../../../admin/src/pages/EditView/components/FormLayout.tsx"],"sourcesContent":["import { Box, Flex, Grid } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { EditLayout } from '../../../hooks/useDocumentLayout';\n\nimport { InputRenderer } from './InputRenderer';\n\nimport type { UseDocument } from '../../../hooks/useDocument';\n\nexport const RESPONSIVE_CONTAINER_BREAKPOINTS = {\n  sm: '27.5rem', // 440px\n};\n\nexport const ResponsiveGridRoot = styled(Grid.Root)`\n  container-type: inline-size;\n`;\n\nexport const ResponsiveGridItem =\n  /**\n   * TODO:\n   * JSDOM cannot handle container queries.\n   * This is a temporary workaround so that tests do not fail in the CI when jestdom throws an error\n   * for failing to parse the stylesheet.\n   */\n  process.env.NODE_ENV !== 'test'\n    ? styled(Grid.Item)<{ col: number }>`\n        grid-column: span 12;\n        @container (min-width: ${RESPONSIVE_CONTAINER_BREAKPOINTS.sm}) {\n          ${({ col }) => col && `grid-column: span ${col};`}\n        }\n      `\n    : styled(Grid.Item)<{ col: number }>`\n        grid-column: span 12;\n      `;\n\ninterface FormLayoutProps extends Pick<EditLayout, 'layout'> {\n  hasBackground?: boolean;\n  document: ReturnType<UseDocument>;\n}\n\nconst FormLayout = ({ layout, document, hasBackground = true }: FormLayoutProps) => {\n  const { formatMessage } = useIntl();\n  const modelUid = document.schema?.uid;\n\n  return (\n    <Flex direction=\"column\" alignItems=\"stretch\" gap={6}>\n      {layout.map((panel, index) => {\n        if (panel.some((row) => row.some((field) => field.type === 'dynamiczone'))) {\n          const [row] = panel;\n          const [field] = row;\n\n          const fieldWithTranslatedLabel = {\n            ...field,\n            label: formatMessage({\n              id: `content-manager.content-types.${modelUid}.${field.name}`,\n              defaultMessage: field.label,\n            }),\n          };\n\n          return (\n            <Grid.Root key={field.name} gap={4}>\n              <Grid.Item col={12} s={12} xs={12} direction=\"column\" alignItems=\"stretch\">\n                <InputRenderer {...fieldWithTranslatedLabel} document={document} />\n              </Grid.Item>\n            </Grid.Root>\n          );\n        }\n\n        return (\n          <Box\n            key={index}\n            {...(hasBackground && {\n              padding: 6,\n              borderColor: 'neutral150',\n              background: 'neutral0',\n              hasRadius: true,\n              shadow: 'tableShadow',\n            })}\n          >\n            <Flex direction=\"column\" alignItems=\"stretch\" gap={6}>\n              {panel.map((row, gridRowIndex) => (\n                <ResponsiveGridRoot key={gridRowIndex} gap={4}>\n                  {row.map(({ size, ...field }) => {\n                    const fieldWithTranslatedLabel = {\n                      ...field,\n                      label: formatMessage({\n                        id: `content-manager.content-types.${modelUid}.${field.name}`,\n                        defaultMessage: field.label,\n                      }),\n                    };\n                    return (\n                      <ResponsiveGridItem\n                        col={size}\n                        key={field.name}\n                        s={12}\n                        xs={12}\n                        direction=\"column\"\n                        alignItems=\"stretch\"\n                      >\n                        <InputRenderer {...fieldWithTranslatedLabel} document={document} />\n                      </ResponsiveGridItem>\n                    );\n                  })}\n                </ResponsiveGridRoot>\n              ))}\n            </Flex>\n          </Box>\n        );\n      })}\n    </Flex>\n  );\n};\n\nexport { FormLayout, FormLayoutProps };\n"],"names":["RESPONSIVE_CONTAINER_BREAKPOINTS","sm","ResponsiveGridRoot","styled","Grid","Root","ResponsiveGridItem","process","env","NODE_ENV","Item","col","FormLayout","layout","document","hasBackground","formatMessage","useIntl","modelUid","schema","uid","_jsx","Flex","direction","alignItems","gap","map","panel","index","some","row","field","type","fieldWithTranslatedLabel","label","id","name","defaultMessage","s","xs","InputRenderer","Box","padding","borderColor","background","hasRadius","shadow","gridRowIndex","size"],"mappings":"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"}

package/dist/admin/pages/EditView/components/FormLayout.mjs

@@ -25,7 +25,7 @@ const ResponsiveGridItem = /**
       `;
 const FormLayout = ({ layout, document, hasBackground = true })=>{
     const { formatMessage } = useIntl();
-    const model = document.schema?.modelName;
+    const modelUid = document.schema?.uid;
     return /*#__PURE__*/ jsx(Flex, {
         direction: "column",
         alignItems: "stretch",
@@ -37,7 +37,7 @@ const FormLayout = ({ layout, document, hasBackground = true })=>{
                 const fieldWithTranslatedLabel = {
                     ...field,
                     label: formatMessage({
-                        id: `content-manager.content-types.${model}.${field.name}`,
+                        id: `content-manager.content-types.${modelUid}.${field.name}`,
                         defaultMessage: field.label
                     })
                 };
@@ -74,7 +74,7 @@ const FormLayout = ({ layout, document, hasBackground = true })=>{
                                 const fieldWithTranslatedLabel = {
                                     ...field,
                                     label: formatMessage({
-                                        id: `content-manager.content-types.${model}.${field.name}`,
+                                        id: `content-manager.content-types.${modelUid}.${field.name}`,
                                         defaultMessage: field.label
                                     })
                                 };

package/dist/admin/pages/EditView/components/FormLayout.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"FormLayout.mjs","sources":["../../../../../admin/src/pages/EditView/components/FormLayout.tsx"],"sourcesContent":["import { Box, Flex, Grid } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { EditLayout } from '../../../hooks/useDocumentLayout';\n\nimport { InputRenderer } from './InputRenderer';\n\nimport type { UseDocument } from '../../../hooks/useDocument';\n\nexport const RESPONSIVE_CONTAINER_BREAKPOINTS = {\n  sm: '27.5rem', // 440px\n};\n\nexport const ResponsiveGridRoot = styled(Grid.Root)`\n  container-type: inline-size;\n`;\n\nexport const ResponsiveGridItem =\n  /**\n   * TODO:\n   * JSDOM cannot handle container queries.\n   * This is a temporary workaround so that tests do not fail in the CI when jestdom throws an error\n   * for failing to parse the stylesheet.\n   */\n  process.env.NODE_ENV !== 'test'\n    ? styled(Grid.Item)<{ col: number }>`\n        grid-column: span 12;\n        @container (min-width: ${RESPONSIVE_CONTAINER_BREAKPOINTS.sm}) {\n          ${({ col }) => col && `grid-column: span ${col};`}\n        }\n      `\n    : styled(Grid.Item)<{ col: number }>`\n        grid-column: span 12;\n      `;\n\ninterface FormLayoutProps extends Pick<EditLayout, 'layout'> {\n  hasBackground?: boolean;\n  model?: string;\n  document: ReturnType<UseDocument>;\n}\n\nconst FormLayout = ({ layout, document, hasBackground = true }: FormLayoutProps) => {\n  const { formatMessage } = useIntl();\n  const model = document.schema?.modelName;\n\n  return (\n    <Flex direction=\"column\" alignItems=\"stretch\" gap={6}>\n      {layout.map((panel, index) => {\n        if (panel.some((row) => row.some((field) => field.type === 'dynamiczone'))) {\n          const [row] = panel;\n          const [field] = row;\n\n          const fieldWithTranslatedLabel = {\n            ...field,\n            label: formatMessage({\n              id: `content-manager.content-types.${model}.${field.name}`,\n              defaultMessage: field.label,\n            }),\n          };\n\n          return (\n            <Grid.Root key={field.name} gap={4}>\n              <Grid.Item col={12} s={12} xs={12} direction=\"column\" alignItems=\"stretch\">\n                <InputRenderer {...fieldWithTranslatedLabel} document={document} />\n              </Grid.Item>\n            </Grid.Root>\n          );\n        }\n\n        return (\n          <Box\n            key={index}\n            {...(hasBackground && {\n              padding: 6,\n              borderColor: 'neutral150',\n              background: 'neutral0',\n              hasRadius: true,\n              shadow: 'tableShadow',\n            })}\n          >\n            <Flex direction=\"column\" alignItems=\"stretch\" gap={6}>\n              {panel.map((row, gridRowIndex) => (\n                <ResponsiveGridRoot key={gridRowIndex} gap={4}>\n                  {row.map(({ size, ...field }) => {\n                    const fieldWithTranslatedLabel = {\n                      ...field,\n                      label: formatMessage({\n                        id: `content-manager.content-types.${model}.${field.name}`,\n                        defaultMessage: field.label,\n                      }),\n                    };\n                    return (\n                      <ResponsiveGridItem\n                        col={size}\n                        key={field.name}\n                        s={12}\n                        xs={12}\n                        direction=\"column\"\n                        alignItems=\"stretch\"\n                      >\n                        <InputRenderer {...fieldWithTranslatedLabel} document={document} />\n                      </ResponsiveGridItem>\n                    );\n                  })}\n                </ResponsiveGridRoot>\n              ))}\n            </Flex>\n          </Box>\n        );\n      })}\n    </Flex>\n  );\n};\n\nexport { FormLayout, FormLayoutProps };\n"],"names":["RESPONSIVE_CONTAINER_BREAKPOINTS","sm","ResponsiveGridRoot","styled","Grid","Root","ResponsiveGridItem","process","env","NODE_ENV","Item","col","FormLayout","layout","document","hasBackground","formatMessage","useIntl","model","schema","modelName","_jsx","Flex","direction","alignItems","gap","map","panel","index","some","row","field","type","fieldWithTranslatedLabel","label","id","name","defaultMessage","s","xs","InputRenderer","Box","padding","borderColor","background","hasRadius","shadow","gridRowIndex","size"],"mappings":"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"}
+{"version":3,"file":"FormLayout.mjs","sources":["../../../../../admin/src/pages/EditView/components/FormLayout.tsx"],"sourcesContent":["import { Box, Flex, Grid } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { EditLayout } from '../../../hooks/useDocumentLayout';\n\nimport { InputRenderer } from './InputRenderer';\n\nimport type { UseDocument } from '../../../hooks/useDocument';\n\nexport const RESPONSIVE_CONTAINER_BREAKPOINTS = {\n  sm: '27.5rem', // 440px\n};\n\nexport const ResponsiveGridRoot = styled(Grid.Root)`\n  container-type: inline-size;\n`;\n\nexport const ResponsiveGridItem =\n  /**\n   * TODO:\n   * JSDOM cannot handle container queries.\n   * This is a temporary workaround so that tests do not fail in the CI when jestdom throws an error\n   * for failing to parse the stylesheet.\n   */\n  process.env.NODE_ENV !== 'test'\n    ? styled(Grid.Item)<{ col: number }>`\n        grid-column: span 12;\n        @container (min-width: ${RESPONSIVE_CONTAINER_BREAKPOINTS.sm}) {\n          ${({ col }) => col && `grid-column: span ${col};`}\n        }\n      `\n    : styled(Grid.Item)<{ col: number }>`\n        grid-column: span 12;\n      `;\n\ninterface FormLayoutProps extends Pick<EditLayout, 'layout'> {\n  hasBackground?: boolean;\n  document: ReturnType<UseDocument>;\n}\n\nconst FormLayout = ({ layout, document, hasBackground = true }: FormLayoutProps) => {\n  const { formatMessage } = useIntl();\n  const modelUid = document.schema?.uid;\n\n  return (\n    <Flex direction=\"column\" alignItems=\"stretch\" gap={6}>\n      {layout.map((panel, index) => {\n        if (panel.some((row) => row.some((field) => field.type === 'dynamiczone'))) {\n          const [row] = panel;\n          const [field] = row;\n\n          const fieldWithTranslatedLabel = {\n            ...field,\n            label: formatMessage({\n              id: `content-manager.content-types.${modelUid}.${field.name}`,\n              defaultMessage: field.label,\n            }),\n          };\n\n          return (\n            <Grid.Root key={field.name} gap={4}>\n              <Grid.Item col={12} s={12} xs={12} direction=\"column\" alignItems=\"stretch\">\n                <InputRenderer {...fieldWithTranslatedLabel} document={document} />\n              </Grid.Item>\n            </Grid.Root>\n          );\n        }\n\n        return (\n          <Box\n            key={index}\n            {...(hasBackground && {\n              padding: 6,\n              borderColor: 'neutral150',\n              background: 'neutral0',\n              hasRadius: true,\n              shadow: 'tableShadow',\n            })}\n          >\n            <Flex direction=\"column\" alignItems=\"stretch\" gap={6}>\n              {panel.map((row, gridRowIndex) => (\n                <ResponsiveGridRoot key={gridRowIndex} gap={4}>\n                  {row.map(({ size, ...field }) => {\n                    const fieldWithTranslatedLabel = {\n                      ...field,\n                      label: formatMessage({\n                        id: `content-manager.content-types.${modelUid}.${field.name}`,\n                        defaultMessage: field.label,\n                      }),\n                    };\n                    return (\n                      <ResponsiveGridItem\n                        col={size}\n                        key={field.name}\n                        s={12}\n                        xs={12}\n                        direction=\"column\"\n                        alignItems=\"stretch\"\n                      >\n                        <InputRenderer {...fieldWithTranslatedLabel} document={document} />\n                      </ResponsiveGridItem>\n                    );\n                  })}\n                </ResponsiveGridRoot>\n              ))}\n            </Flex>\n          </Box>\n        );\n      })}\n    </Flex>\n  );\n};\n\nexport { FormLayout, FormLayoutProps };\n"],"names":["RESPONSIVE_CONTAINER_BREAKPOINTS","sm","ResponsiveGridRoot","styled","Grid","Root","ResponsiveGridItem","process","env","NODE_ENV","Item","col","FormLayout","layout","document","hasBackground","formatMessage","useIntl","modelUid","schema","uid","_jsx","Flex","direction","alignItems","gap","map","panel","index","some","row","field","type","fieldWithTranslatedLabel","label","id","name","defaultMessage","s","xs","InputRenderer","Box","padding","borderColor","background","hasRadius","shadow","gridRowIndex","size"],"mappings":"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"}