@strapi/content-manager 0.0.0-experimental.e0df4d50334a17a1beb3d203bff414fbbff62f7b → 0.0.0-experimental.e100737b0ed96d0d80a5c6f4925c7374e63a342a

package/dist/admin/pages/EditView/components/FormInputs/BlocksInput/Blocks/Heading.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Heading.js","sources":["../../../../../../../../admin/src/pages/EditView/components/FormInputs/BlocksInput/Blocks/Heading.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Typography, TypographyComponent } from '@strapi/design-system';\nimport {\n  HeadingFive,\n  HeadingFour,\n  HeadingOne,\n  HeadingSix,\n  HeadingThree,\n  HeadingTwo,\n} from '@strapi/icons';\nimport { Editor } from 'slate';\nimport { styled } from 'styled-components';\n\nimport { type BlocksStore } from '../BlocksEditor';\nimport { baseHandleConvert } from '../utils/conversions';\nimport { type Block } from '../utils/types';\n\nconst H1 = styled<TypographyComponent<'h1'>>(Typography).attrs({ tag: 'h1' })`\n  font-size: 4.2rem;\n  line-height: ${({ theme }) => theme.lineHeights[1]};\n`;\n\nconst H2 = styled<TypographyComponent<'h2'>>(Typography).attrs({ tag: 'h2' })`\n  font-size: 3.5rem;\n  line-height: ${({ theme }) => theme.lineHeights[1]};\n`;\n\nconst H3 = styled<TypographyComponent<'h3'>>(Typography).attrs({ tag: 'h3' })`\n  font-size: 2.9rem;\n  line-height: ${({ theme }) => theme.lineHeights[1]};\n`;\n\nconst H4 = styled<TypographyComponent<'h4'>>(Typography).attrs({ tag: 'h4' })`\n  font-size: 2.4rem;\n  line-height: ${({ theme }) => theme.lineHeights[1]};\n`;\n\nconst H5 = styled<TypographyComponent<'h5'>>(Typography).attrs({ tag: 'h5' })`\n  font-size: 2rem;\n  line-height: ${({ theme }) => theme.lineHeights[1]};\n`;\n\nconst H6 = styled<TypographyComponent<'h6'>>(Typography).attrs({ tag: 'h6' })`\n  font-size: 1.6rem;\n  line-height: ${({ theme }) => theme.lineHeights[1]};\n`;\n\n/**\n * Common handler for converting a node to a heading\n */\nconst handleConvertToHeading = (editor: Editor, level: Block<'heading'>['level']) => {\n  baseHandleConvert<Block<'heading'>>(editor, { type: 'heading', level });\n};\n\nconst headingBlocks: Pick<\n  BlocksStore,\n  'heading-one' | 'heading-two' | 'heading-three' | 'heading-four' | 'heading-five' | 'heading-six'\n> = {\n  'heading-one': {\n    renderElement: (props) => <H1 {...props.attributes}>{props.children}</H1>,\n    icon: HeadingOne,\n    label: {\n      id: 'components.Blocks.blocks.heading1',\n      defaultMessage: 'Heading 1',\n    },\n    handleConvert: (editor) => handleConvertToHeading(editor, 1),\n    matchNode: (node) => node.type === 'heading' && node.level === 1,\n    isInBlocksSelector: true,\n    snippets: ['#'],\n    dragHandleTopMargin: '14px',\n  },\n  'heading-two': {\n    renderElement: (props) => <H2 {...props.attributes}>{props.children}</H2>,\n    icon: HeadingTwo,\n    label: {\n      id: 'components.Blocks.blocks.heading2',\n      defaultMessage: 'Heading 2',\n    },\n    handleConvert: (editor) => handleConvertToHeading(editor, 2),\n    matchNode: (node) => node.type === 'heading' && node.level === 2,\n    isInBlocksSelector: true,\n    snippets: ['##'],\n    dragHandleTopMargin: '10px',\n  },\n  'heading-three': {\n    renderElement: (props) => <H3 {...props.attributes}>{props.children}</H3>,\n    icon: HeadingThree,\n    label: {\n      id: 'components.Blocks.blocks.heading3',\n      defaultMessage: 'Heading 3',\n    },\n    handleConvert: (editor) => handleConvertToHeading(editor, 3),\n    matchNode: (node) => node.type === 'heading' && node.level === 3,\n    isInBlocksSelector: true,\n    snippets: ['###'],\n    dragHandleTopMargin: '7px',\n  },\n  'heading-four': {\n    renderElement: (props) => <H4 {...props.attributes}>{props.children}</H4>,\n    icon: HeadingFour,\n    label: {\n      id: 'components.Blocks.blocks.heading4',\n      defaultMessage: 'Heading 4',\n    },\n    handleConvert: (editor) => handleConvertToHeading(editor, 4),\n    matchNode: (node) => node.type === 'heading' && node.level === 4,\n    isInBlocksSelector: true,\n    snippets: ['####'],\n    dragHandleTopMargin: '4px',\n  },\n  'heading-five': {\n    renderElement: (props) => <H5 {...props.attributes}>{props.children}</H5>,\n    icon: HeadingFive,\n    label: {\n      id: 'components.Blocks.blocks.heading5',\n      defaultMessage: 'Heading 5',\n    },\n    handleConvert: (editor) => handleConvertToHeading(editor, 5),\n    matchNode: (node) => node.type === 'heading' && node.level === 5,\n    isInBlocksSelector: true,\n    snippets: ['#####'],\n  },\n  'heading-six': {\n    renderElement: (props) => <H6 {...props.attributes}>{props.children}</H6>,\n    icon: HeadingSix,\n    label: {\n      id: 'components.Blocks.blocks.heading6',\n      defaultMessage: 'Heading 6',\n    },\n    handleConvert: (editor) => handleConvertToHeading(editor, 6),\n    matchNode: (node) => node.type === 'heading' && node.level === 6,\n    isInBlocksSelector: true,\n    snippets: ['######'],\n    dragHandleTopMargin: '-2px',\n  },\n};\n\nexport { headingBlocks };\n"],"names":["H1","styled","Typography","attrs","tag","theme","lineHeights","H2","H3","H4","H5","H6","handleConvertToHeading","editor","level","baseHandleConvert","type","headingBlocks","renderElement","props","_jsx","attributes","children","icon","HeadingOne","label","id","defaultMessage","handleConvert","matchNode","node","isInBlocksSelector","snippets","dragHandleTopMargin","HeadingTwo","HeadingThree","HeadingFour","HeadingFive","HeadingSix"],"mappings":"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"}

package/dist/admin/pages/EditView/components/FormInputs/BlocksInput/Blocks/Heading.mjs

@@ -0,0 +1,163 @@
+import { jsx } from 'react/jsx-runtime';
+import 'react';
+import { Typography } from '@strapi/design-system';
+import { HeadingOne, HeadingTwo, HeadingThree, HeadingFour, HeadingFive, HeadingSix } from '@strapi/icons';
+import { styled } from 'styled-components';
+import { baseHandleConvert } from '../utils/conversions.mjs';
+
+const H1 = styled(Typography).attrs({
+    tag: 'h1'
+})`
+  font-size: 4.2rem;
+  line-height: ${({ theme })=>theme.lineHeights[1]};
+`;
+const H2 = styled(Typography).attrs({
+    tag: 'h2'
+})`
+  font-size: 3.5rem;
+  line-height: ${({ theme })=>theme.lineHeights[1]};
+`;
+const H3 = styled(Typography).attrs({
+    tag: 'h3'
+})`
+  font-size: 2.9rem;
+  line-height: ${({ theme })=>theme.lineHeights[1]};
+`;
+const H4 = styled(Typography).attrs({
+    tag: 'h4'
+})`
+  font-size: 2.4rem;
+  line-height: ${({ theme })=>theme.lineHeights[1]};
+`;
+const H5 = styled(Typography).attrs({
+    tag: 'h5'
+})`
+  font-size: 2rem;
+  line-height: ${({ theme })=>theme.lineHeights[1]};
+`;
+const H6 = styled(Typography).attrs({
+    tag: 'h6'
+})`
+  font-size: 1.6rem;
+  line-height: ${({ theme })=>theme.lineHeights[1]};
+`;
+/**
+ * Common handler for converting a node to a heading
+ */ const handleConvertToHeading = (editor, level)=>{
+    baseHandleConvert(editor, {
+        type: 'heading',
+        level
+    });
+};
+const headingBlocks = {
+    'heading-one': {
+        renderElement: (props)=>/*#__PURE__*/ jsx(H1, {
+                ...props.attributes,
+                children: props.children
+            }),
+        icon: HeadingOne,
+        label: {
+            id: 'components.Blocks.blocks.heading1',
+            defaultMessage: 'Heading 1'
+        },
+        handleConvert: (editor)=>handleConvertToHeading(editor, 1),
+        matchNode: (node)=>node.type === 'heading' && node.level === 1,
+        isInBlocksSelector: true,
+        snippets: [
+            '#'
+        ],
+        dragHandleTopMargin: '14px'
+    },
+    'heading-two': {
+        renderElement: (props)=>/*#__PURE__*/ jsx(H2, {
+                ...props.attributes,
+                children: props.children
+            }),
+        icon: HeadingTwo,
+        label: {
+            id: 'components.Blocks.blocks.heading2',
+            defaultMessage: 'Heading 2'
+        },
+        handleConvert: (editor)=>handleConvertToHeading(editor, 2),
+        matchNode: (node)=>node.type === 'heading' && node.level === 2,
+        isInBlocksSelector: true,
+        snippets: [
+            '##'
+        ],
+        dragHandleTopMargin: '10px'
+    },
+    'heading-three': {
+        renderElement: (props)=>/*#__PURE__*/ jsx(H3, {
+                ...props.attributes,
+                children: props.children
+            }),
+        icon: HeadingThree,
+        label: {
+            id: 'components.Blocks.blocks.heading3',
+            defaultMessage: 'Heading 3'
+        },
+        handleConvert: (editor)=>handleConvertToHeading(editor, 3),
+        matchNode: (node)=>node.type === 'heading' && node.level === 3,
+        isInBlocksSelector: true,
+        snippets: [
+            '###'
+        ],
+        dragHandleTopMargin: '7px'
+    },
+    'heading-four': {
+        renderElement: (props)=>/*#__PURE__*/ jsx(H4, {
+                ...props.attributes,
+                children: props.children
+            }),
+        icon: HeadingFour,
+        label: {
+            id: 'components.Blocks.blocks.heading4',
+            defaultMessage: 'Heading 4'
+        },
+        handleConvert: (editor)=>handleConvertToHeading(editor, 4),
+        matchNode: (node)=>node.type === 'heading' && node.level === 4,
+        isInBlocksSelector: true,
+        snippets: [
+            '####'
+        ],
+        dragHandleTopMargin: '4px'
+    },
+    'heading-five': {
+        renderElement: (props)=>/*#__PURE__*/ jsx(H5, {
+                ...props.attributes,
+                children: props.children
+            }),
+        icon: HeadingFive,
+        label: {
+            id: 'components.Blocks.blocks.heading5',
+            defaultMessage: 'Heading 5'
+        },
+        handleConvert: (editor)=>handleConvertToHeading(editor, 5),
+        matchNode: (node)=>node.type === 'heading' && node.level === 5,
+        isInBlocksSelector: true,
+        snippets: [
+            '#####'
+        ]
+    },
+    'heading-six': {
+        renderElement: (props)=>/*#__PURE__*/ jsx(H6, {
+                ...props.attributes,
+                children: props.children
+            }),
+        icon: HeadingSix,
+        label: {
+            id: 'components.Blocks.blocks.heading6',
+            defaultMessage: 'Heading 6'
+        },
+        handleConvert: (editor)=>handleConvertToHeading(editor, 6),
+        matchNode: (node)=>node.type === 'heading' && node.level === 6,
+        isInBlocksSelector: true,
+        snippets: [
+            '######'
+        ],
+        dragHandleTopMargin: '-2px'
+    }
+};
+
+export { headingBlocks };
+//# sourceMappingURL=Heading.mjs.map

package/dist/admin/pages/EditView/components/FormInputs/BlocksInput/Blocks/Heading.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Heading.mjs","sources":["../../../../../../../../admin/src/pages/EditView/components/FormInputs/BlocksInput/Blocks/Heading.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Typography, TypographyComponent } from '@strapi/design-system';\nimport {\n  HeadingFive,\n  HeadingFour,\n  HeadingOne,\n  HeadingSix,\n  HeadingThree,\n  HeadingTwo,\n} from '@strapi/icons';\nimport { Editor } from 'slate';\nimport { styled } from 'styled-components';\n\nimport { type BlocksStore } from '../BlocksEditor';\nimport { baseHandleConvert } from '../utils/conversions';\nimport { type Block } from '../utils/types';\n\nconst H1 = styled<TypographyComponent<'h1'>>(Typography).attrs({ tag: 'h1' })`\n  font-size: 4.2rem;\n  line-height: ${({ theme }) => theme.lineHeights[1]};\n`;\n\nconst H2 = styled<TypographyComponent<'h2'>>(Typography).attrs({ tag: 'h2' })`\n  font-size: 3.5rem;\n  line-height: ${({ theme }) => theme.lineHeights[1]};\n`;\n\nconst H3 = styled<TypographyComponent<'h3'>>(Typography).attrs({ tag: 'h3' })`\n  font-size: 2.9rem;\n  line-height: ${({ theme }) => theme.lineHeights[1]};\n`;\n\nconst H4 = styled<TypographyComponent<'h4'>>(Typography).attrs({ tag: 'h4' })`\n  font-size: 2.4rem;\n  line-height: ${({ theme }) => theme.lineHeights[1]};\n`;\n\nconst H5 = styled<TypographyComponent<'h5'>>(Typography).attrs({ tag: 'h5' })`\n  font-size: 2rem;\n  line-height: ${({ theme }) => theme.lineHeights[1]};\n`;\n\nconst H6 = styled<TypographyComponent<'h6'>>(Typography).attrs({ tag: 'h6' })`\n  font-size: 1.6rem;\n  line-height: ${({ theme }) => theme.lineHeights[1]};\n`;\n\n/**\n * Common handler for converting a node to a heading\n */\nconst handleConvertToHeading = (editor: Editor, level: Block<'heading'>['level']) => {\n  baseHandleConvert<Block<'heading'>>(editor, { type: 'heading', level });\n};\n\nconst headingBlocks: Pick<\n  BlocksStore,\n  'heading-one' | 'heading-two' | 'heading-three' | 'heading-four' | 'heading-five' | 'heading-six'\n> = {\n  'heading-one': {\n    renderElement: (props) => <H1 {...props.attributes}>{props.children}</H1>,\n    icon: HeadingOne,\n    label: {\n      id: 'components.Blocks.blocks.heading1',\n      defaultMessage: 'Heading 1',\n    },\n    handleConvert: (editor) => handleConvertToHeading(editor, 1),\n    matchNode: (node) => node.type === 'heading' && node.level === 1,\n    isInBlocksSelector: true,\n    snippets: ['#'],\n    dragHandleTopMargin: '14px',\n  },\n  'heading-two': {\n    renderElement: (props) => <H2 {...props.attributes}>{props.children}</H2>,\n    icon: HeadingTwo,\n    label: {\n      id: 'components.Blocks.blocks.heading2',\n      defaultMessage: 'Heading 2',\n    },\n    handleConvert: (editor) => handleConvertToHeading(editor, 2),\n    matchNode: (node) => node.type === 'heading' && node.level === 2,\n    isInBlocksSelector: true,\n    snippets: ['##'],\n    dragHandleTopMargin: '10px',\n  },\n  'heading-three': {\n    renderElement: (props) => <H3 {...props.attributes}>{props.children}</H3>,\n    icon: HeadingThree,\n    label: {\n      id: 'components.Blocks.blocks.heading3',\n      defaultMessage: 'Heading 3',\n    },\n    handleConvert: (editor) => handleConvertToHeading(editor, 3),\n    matchNode: (node) => node.type === 'heading' && node.level === 3,\n    isInBlocksSelector: true,\n    snippets: ['###'],\n    dragHandleTopMargin: '7px',\n  },\n  'heading-four': {\n    renderElement: (props) => <H4 {...props.attributes}>{props.children}</H4>,\n    icon: HeadingFour,\n    label: {\n      id: 'components.Blocks.blocks.heading4',\n      defaultMessage: 'Heading 4',\n    },\n    handleConvert: (editor) => handleConvertToHeading(editor, 4),\n    matchNode: (node) => node.type === 'heading' && node.level === 4,\n    isInBlocksSelector: true,\n    snippets: ['####'],\n    dragHandleTopMargin: '4px',\n  },\n  'heading-five': {\n    renderElement: (props) => <H5 {...props.attributes}>{props.children}</H5>,\n    icon: HeadingFive,\n    label: {\n      id: 'components.Blocks.blocks.heading5',\n      defaultMessage: 'Heading 5',\n    },\n    handleConvert: (editor) => handleConvertToHeading(editor, 5),\n    matchNode: (node) => node.type === 'heading' && node.level === 5,\n    isInBlocksSelector: true,\n    snippets: ['#####'],\n  },\n  'heading-six': {\n    renderElement: (props) => <H6 {...props.attributes}>{props.children}</H6>,\n    icon: HeadingSix,\n    label: {\n      id: 'components.Blocks.blocks.heading6',\n      defaultMessage: 'Heading 6',\n    },\n    handleConvert: (editor) => handleConvertToHeading(editor, 6),\n    matchNode: (node) => node.type === 'heading' && node.level === 6,\n    isInBlocksSelector: true,\n    snippets: ['######'],\n    dragHandleTopMargin: '-2px',\n  },\n};\n\nexport { headingBlocks };\n"],"names":["H1","styled","Typography","attrs","tag","theme","lineHeights","H2","H3","H4","H5","H6","handleConvertToHeading","editor","level","baseHandleConvert","type","headingBlocks","renderElement","props","_jsx","attributes","children","icon","HeadingOne","label","id","defaultMessage","handleConvert","matchNode","node","isInBlocksSelector","snippets","dragHandleTopMargin","HeadingTwo","HeadingThree","HeadingFour","HeadingFive","HeadingSix"],"mappings":"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"}

package/dist/admin/pages/EditView/components/FormInputs/BlocksInput/Blocks/Image.js

@@ -0,0 +1,230 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var strapiAdmin = require('@strapi/admin/strapi-admin');
+var designSystem = require('@strapi/design-system');
+var Icons = require('@strapi/icons');
+var slate = require('slate');
+var slateReact = require('slate-react');
+var styledComponents = require('styled-components');
+var urls = require('../../../../../../utils/urls.js');
+var BlocksEditor = require('../BlocksEditor.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 ImageWrapper = styledComponents.styled(designSystem.Flex)`
+  transition-property: box-shadow;
+  transition-duration: 0.2s;
+  ${(props)=>props.$isFocused && styledComponents.css`
+      box-shadow: ${props.theme.colors.primary600} 0px 0px 0px 3px;
+    `}
+
+  & > img {
+    height: auto;
+    // The max-height is decided with the design team, the 56px is the height of the toolbar
+    max-height: calc(512px - 56px);
+    max-width: 100%;
+    object-fit: contain;
+  }
+`;
+const IMAGE_SCHEMA_FIELDS = [
+    'name',
+    'alternativeText',
+    'url',
+    'caption',
+    'width',
+    'height',
+    'formats',
+    'hash',
+    'ext',
+    'mime',
+    'size',
+    'previewUrl',
+    'provider',
+    'provider_metadata',
+    'createdAt',
+    'updatedAt'
+];
+const pick = (object, keys)=>{
+    const entries = keys.map((key)=>[
+            key,
+            object[key]
+        ]);
+    return Object.fromEntries(entries);
+};
+// Type guard to force TypeScript to narrow the type of the element in Blocks component
+const isImage = (element)=>{
+    return element.type === 'image';
+};
+// Added a background color to the image wrapper to make it easier to recognize the image block
+const Image = ({ attributes, children, element })=>{
+    const editorIsFocused = slateReact.useFocused();
+    const imageIsSelected = slateReact.useSelected();
+    if (!isImage(element)) {
+        return null;
+    }
+    const { url, alternativeText, width, height } = element.image;
+    return /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Box, {
+        ...attributes,
+        children: [
+            children,
+            /*#__PURE__*/ jsxRuntime.jsx(ImageWrapper, {
+                background: "neutral100",
+                contentEditable: false,
+                justifyContent: "center",
+                $isFocused: editorIsFocused && imageIsSelected,
+                hasRadius: true,
+                children: /*#__PURE__*/ jsxRuntime.jsx("img", {
+                    src: url,
+                    alt: alternativeText,
+                    width: width,
+                    height: height
+                })
+            })
+        ]
+    });
+};
+const ImageDialog = ()=>{
+    const [isOpen, setIsOpen] = React__namespace.useState(true);
+    const { editor } = BlocksEditor.useBlocksEditorContext('ImageDialog');
+    const components = strapiAdmin.useStrapiApp('ImageDialog', (state)=>state.components);
+    if (!components || !isOpen) return null;
+    const MediaLibraryDialog = components['media-library'];
+    const insertImages = (images)=>{
+        // If the selection is inside a list, split the list so that the modified block is outside of it
+        slate.Transforms.unwrapNodes(editor, {
+            match: (node)=>!slate.Editor.isEditor(node) && node.type === 'list',
+            split: true
+        });
+        // Save the path of the node that is being replaced by an image to insert the images there later
+        // It's the closest full block node above the selection
+        const nodeEntryBeingReplaced = slate.Editor.above(editor, {
+            match (node) {
+                if (slate.Editor.isEditor(node)) return false;
+                const isInlineNode = [
+                    'text',
+                    'link'
+                ].includes(node.type);
+                return !isInlineNode;
+            }
+        });
+        if (!nodeEntryBeingReplaced) return;
+        const [, pathToInsert] = nodeEntryBeingReplaced;
+        // Remove the previous node that is being replaced by an image
+        slate.Transforms.removeNodes(editor);
+        // Convert images to nodes and insert them
+        const nodesToInsert = images.map((image)=>{
+            const imageNode = {
+                type: 'image',
+                image,
+                children: [
+                    {
+                        type: 'text',
+                        text: ''
+                    }
+                ]
+            };
+            return imageNode;
+        });
+        slate.Transforms.insertNodes(editor, nodesToInsert, {
+            at: pathToInsert
+        });
+        // Set the selection on the image since it was cleared by calling removeNodes
+        slate.Transforms.select(editor, pathToInsert);
+    };
+    const handleSelectAssets = (images)=>{
+        const formattedImages = images.map((image)=>{
+            // Create an object with imageSchema defined and exclude unnecessary props coming from media library config
+            const expectedImage = pick(image, IMAGE_SCHEMA_FIELDS);
+            const nodeImage = {
+                ...expectedImage,
+                alternativeText: expectedImage.alternativeText || expectedImage.name,
+                url: urls.prefixFileUrlWithBackendUrl(image.url)
+            };
+            return nodeImage;
+        });
+        insertImages(formattedImages);
+        setIsOpen(false);
+    };
+    return /*#__PURE__*/ jsxRuntime.jsx(MediaLibraryDialog, {
+        allowedTypes: [
+            'images'
+        ],
+        onClose: ()=>setIsOpen(false),
+        onSelectAssets: handleSelectAssets
+    });
+};
+const imageBlocks = {
+    image: {
+        renderElement: (props)=>/*#__PURE__*/ jsxRuntime.jsx(Image, {
+                ...props
+            }),
+        icon: Icons.Image,
+        label: {
+            id: 'components.Blocks.blocks.image',
+            defaultMessage: 'Image'
+        },
+        matchNode: (node)=>node.type === 'image',
+        isInBlocksSelector: true,
+        handleBackspaceKey (editor) {
+            // Prevent issue where the image remains when it's the only block in the document
+            if (editor.children.length === 1) {
+                slate.Transforms.setNodes(editor, {
+                    type: 'paragraph',
+                    // @ts-expect-error we're only setting image as null so that Slate deletes it
+                    image: null,
+                    children: [
+                        {
+                            type: 'text',
+                            text: ''
+                        }
+                    ]
+                });
+            } else {
+                slate.Transforms.removeNodes(editor);
+            }
+        },
+        handleEnterKey (editor) {
+            slate.Transforms.insertNodes(editor, {
+                type: 'paragraph',
+                children: [
+                    {
+                        type: 'text',
+                        text: ''
+                    }
+                ]
+            });
+        },
+        handleConvert: ()=>{
+            /**
+       * All the logic is managed inside the ImageDialog component,
+       * because the blocks are only created when the user selects images in the modal and submits
+       * and if he closes the modal, then no changes are made to the editor
+       */ return ()=>/*#__PURE__*/ jsxRuntime.jsx(ImageDialog, {});
+        },
+        snippets: [
+            '!['
+        ]
+    }
+};
+
+exports.imageBlocks = imageBlocks;
+//# sourceMappingURL=Image.js.map

package/dist/admin/pages/EditView/components/FormInputs/BlocksInput/Blocks/Image.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Image.js","sources":["../../../../../../../../admin/src/pages/EditView/components/FormInputs/BlocksInput/Blocks/Image.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { useStrapiApp } from '@strapi/admin/strapi-admin';\nimport { Box, Flex, FlexComponent } from '@strapi/design-system';\nimport { Image as Picture } from '@strapi/icons';\nimport { type Element, Transforms, Editor } from 'slate';\nimport { useFocused, type RenderElementProps, useSelected } from 'slate-react';\nimport { styled, css } from 'styled-components';\n\nimport { prefixFileUrlWithBackendUrl } from '../../../../../../utils/urls';\nimport { useBlocksEditorContext, type BlocksStore } from '../BlocksEditor';\nimport { type Block } from '../utils/types';\n\nimport type { Schema } from '@strapi/types';\n\nconst ImageWrapper = styled<FlexComponent>(Flex)<{ $isFocused?: boolean }>`\n  transition-property: box-shadow;\n  transition-duration: 0.2s;\n  ${(props) =>\n    props.$isFocused &&\n    css`\n      box-shadow: ${props.theme.colors.primary600} 0px 0px 0px 3px;\n    `}\n\n  & > img {\n    height: auto;\n    // The max-height is decided with the design team, the 56px is the height of the toolbar\n    max-height: calc(512px - 56px);\n    max-width: 100%;\n    object-fit: contain;\n  }\n`;\n\nconst IMAGE_SCHEMA_FIELDS = [\n  'name',\n  'alternativeText',\n  'url',\n  'caption',\n  'width',\n  'height',\n  'formats',\n  'hash',\n  'ext',\n  'mime',\n  'size',\n  'previewUrl',\n  'provider',\n  'provider_metadata',\n  'createdAt',\n  'updatedAt',\n];\n\nconst pick = <T extends object, K extends keyof T>(object: T, keys: K[]): Pick<T, K> => {\n  const entries = keys.map((key) => [key, object[key]]);\n  return Object.fromEntries(entries);\n};\n\n// Type guard to force TypeScript to narrow the type of the element in Blocks component\nconst isImage = (element: Element): element is Block<'image'> => {\n  return element.type === 'image';\n};\n\n// Added a background color to the image wrapper to make it easier to recognize the image block\nconst Image = ({ attributes, children, element }: RenderElementProps) => {\n  const editorIsFocused = useFocused();\n  const imageIsSelected = useSelected();\n\n  if (!isImage(element)) {\n    return null;\n  }\n  const { url, alternativeText, width, height } = element.image;\n\n  return (\n    <Box {...attributes}>\n      {children}\n      <ImageWrapper\n        background=\"neutral100\"\n        contentEditable={false}\n        justifyContent=\"center\"\n        $isFocused={editorIsFocused && imageIsSelected}\n        hasRadius\n      >\n        <img src={url} alt={alternativeText} width={width} height={height} />\n      </ImageWrapper>\n    </Box>\n  );\n};\n\nconst ImageDialog = () => {\n  const [isOpen, setIsOpen] = React.useState(true);\n  const { editor } = useBlocksEditorContext('ImageDialog');\n  const components = useStrapiApp('ImageDialog', (state) => state.components);\n\n  if (!components || !isOpen) return null;\n\n  const MediaLibraryDialog = components['media-library'] as React.ComponentType<{\n    allowedTypes: Schema.Attribute.MediaKind[];\n    onClose: () => void;\n    onSelectAssets: (_images: Schema.Attribute.MediaValue<true>) => void;\n  }>;\n\n  const insertImages = (images: Block<'image'>['image'][]) => {\n    // If the selection is inside a list, split the list so that the modified block is outside of it\n    Transforms.unwrapNodes(editor, {\n      match: (node) => !Editor.isEditor(node) && node.type === 'list',\n      split: true,\n    });\n\n    // Save the path of the node that is being replaced by an image to insert the images there later\n    // It's the closest full block node above the selection\n    const nodeEntryBeingReplaced = Editor.above(editor, {\n      match(node) {\n        if (Editor.isEditor(node)) return false;\n\n        const isInlineNode = ['text', 'link'].includes(node.type);\n\n        return !isInlineNode;\n      },\n    });\n\n    if (!nodeEntryBeingReplaced) return;\n    const [, pathToInsert] = nodeEntryBeingReplaced;\n\n    // Remove the previous node that is being replaced by an image\n    Transforms.removeNodes(editor);\n\n    // Convert images to nodes and insert them\n    const nodesToInsert = images.map((image) => {\n      const imageNode: Block<'image'> = {\n        type: 'image',\n        image,\n        children: [{ type: 'text', text: '' }],\n      };\n      return imageNode;\n    });\n    Transforms.insertNodes(editor, nodesToInsert, { at: pathToInsert });\n\n    // Set the selection on the image since it was cleared by calling removeNodes\n    Transforms.select(editor, pathToInsert);\n  };\n\n  const handleSelectAssets = (images: Schema.Attribute.MediaValue<true>) => {\n    const formattedImages = images.map((image) => {\n      // Create an object with imageSchema defined and exclude unnecessary props coming from media library config\n      const expectedImage = pick(image, IMAGE_SCHEMA_FIELDS);\n\n      const nodeImage: Block<'image'>['image'] = {\n        ...expectedImage,\n        alternativeText: expectedImage.alternativeText || expectedImage.name,\n        url: prefixFileUrlWithBackendUrl(image.url),\n      };\n\n      return nodeImage;\n    });\n\n    insertImages(formattedImages);\n    setIsOpen(false);\n  };\n\n  return (\n    <MediaLibraryDialog\n      allowedTypes={['images']}\n      onClose={() => setIsOpen(false)}\n      onSelectAssets={handleSelectAssets}\n    />\n  );\n};\n\nconst imageBlocks: Pick<BlocksStore, 'image'> = {\n  image: {\n    renderElement: (props) => <Image {...props} />,\n    icon: Picture,\n    label: {\n      id: 'components.Blocks.blocks.image',\n      defaultMessage: 'Image',\n    },\n    matchNode: (node) => node.type === 'image',\n    isInBlocksSelector: true,\n    handleBackspaceKey(editor) {\n      // Prevent issue where the image remains when it's the only block in the document\n      if (editor.children.length === 1) {\n        Transforms.setNodes(editor, {\n          type: 'paragraph',\n          // @ts-expect-error we're only setting image as null so that Slate deletes it\n          image: null,\n          children: [{ type: 'text', text: '' }],\n        });\n      } else {\n        Transforms.removeNodes(editor);\n      }\n    },\n    handleEnterKey(editor) {\n      Transforms.insertNodes(editor, {\n        type: 'paragraph',\n        children: [{ type: 'text', text: '' }],\n      });\n    },\n    handleConvert: () => {\n      /**\n       * All the logic is managed inside the ImageDialog component,\n       * because the blocks are only created when the user selects images in the modal and submits\n       * and if he closes the modal, then no changes are made to the editor\n       */\n      return () => <ImageDialog />;\n    },\n    snippets: ['!['],\n  },\n};\n\nexport { imageBlocks };\n"],"names":["ImageWrapper","styled","Flex","props","$isFocused","css","theme","colors","primary600","IMAGE_SCHEMA_FIELDS","pick","object","keys","entries","map","key","Object","fromEntries","isImage","element","type","Image","attributes","children","editorIsFocused","useFocused","imageIsSelected","useSelected","url","alternativeText","width","height","image","_jsxs","Box","_jsx","background","contentEditable","justifyContent","hasRadius","img","src","alt","ImageDialog","isOpen","setIsOpen","React","useState","editor","useBlocksEditorContext","components","useStrapiApp","state","MediaLibraryDialog","insertImages","images","Transforms","unwrapNodes","match","node","Editor","isEditor","split","nodeEntryBeingReplaced","above","isInlineNode","includes","pathToInsert","removeNodes","nodesToInsert","imageNode","text","insertNodes","at","select","handleSelectAssets","formattedImages","expectedImage","nodeImage","name","prefixFileUrlWithBackendUrl","allowedTypes","onClose","onSelectAssets","imageBlocks","renderElement","icon","Picture","label","id","defaultMessage","matchNode","isInBlocksSelector","handleBackspaceKey","length","setNodes","handleEnterKey","handleConvert","snippets"],"mappings":"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"}