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

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

@@ -0,0 +1,209 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import * as React from 'react';
+import { useStrapiApp } from '@strapi/admin/strapi-admin';
+import { Flex, Box } from '@strapi/design-system';
+import { Image as Image$1 } from '@strapi/icons';
+import { Transforms, Editor } from 'slate';
+import { useFocused, useSelected } from 'slate-react';
+import { styled, css } from 'styled-components';
+import { prefixFileUrlWithBackendUrl } from '../../../../../../utils/urls.mjs';
+import { useBlocksEditorContext } from '../BlocksEditor.mjs';
+
+const ImageWrapper = styled(Flex)`
+  transition-property: box-shadow;
+  transition-duration: 0.2s;
+  ${(props)=>props.$isFocused && 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 = useFocused();
+    const imageIsSelected = useSelected();
+    if (!isImage(element)) {
+        return null;
+    }
+    const { url, alternativeText, width, height } = element.image;
+    return /*#__PURE__*/ jsxs(Box, {
+        ...attributes,
+        children: [
+            children,
+            /*#__PURE__*/ jsx(ImageWrapper, {
+                background: "neutral100",
+                contentEditable: false,
+                justifyContent: "center",
+                $isFocused: editorIsFocused && imageIsSelected,
+                hasRadius: true,
+                children: /*#__PURE__*/ jsx("img", {
+                    src: url,
+                    alt: alternativeText,
+                    width: width,
+                    height: height
+                })
+            })
+        ]
+    });
+};
+const ImageDialog = ()=>{
+    const [isOpen, setIsOpen] = React.useState(true);
+    const { editor } = useBlocksEditorContext('ImageDialog');
+    const components = 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
+        Transforms.unwrapNodes(editor, {
+            match: (node)=>!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 = Editor.above(editor, {
+            match (node) {
+                if (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
+        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;
+        });
+        Transforms.insertNodes(editor, nodesToInsert, {
+            at: pathToInsert
+        });
+        // Set the selection on the image since it was cleared by calling removeNodes
+        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: prefixFileUrlWithBackendUrl(image.url)
+            };
+            return nodeImage;
+        });
+        insertImages(formattedImages);
+        setIsOpen(false);
+    };
+    return /*#__PURE__*/ jsx(MediaLibraryDialog, {
+        allowedTypes: [
+            'images'
+        ],
+        onClose: ()=>setIsOpen(false),
+        onSelectAssets: handleSelectAssets
+    });
+};
+const imageBlocks = {
+    image: {
+        renderElement: (props)=>/*#__PURE__*/ jsx(Image, {
+                ...props
+            }),
+        icon: Image$1,
+        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) {
+                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 {
+                Transforms.removeNodes(editor);
+            }
+        },
+        handleEnterKey (editor) {
+            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__*/ jsx(ImageDialog, {});
+        },
+        snippets: [
+            '!['
+        ]
+    }
+};
+
+export { imageBlocks };
+//# sourceMappingURL=Image.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Image.mjs","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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"}

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

@@ -0,0 +1,232 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var designSystem = require('@strapi/design-system');
+var reactIntl = require('react-intl');
+var slate = require('slate');
+var slateReact = require('slate-react');
+var styledComponents = require('styled-components');
+var BlocksEditor = require('../BlocksEditor.js');
+var links = require('../utils/links.js');
+var types = require('../utils/types.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 StyledLink = styledComponents.styled(designSystem.Box)`
+  text-decoration: none;
+`;
+const RemoveButton = styledComponents.styled(designSystem.Button)`
+  visibility: ${(props)=>props.$visible ? 'visible' : 'hidden'};
+`;
+const LinkContent = /*#__PURE__*/ React__namespace.forwardRef(({ link, children, attributes }, forwardedRef)=>{
+    const { formatMessage } = reactIntl.useIntl();
+    const { editor } = BlocksEditor.useBlocksEditorContext('Link');
+    const path = slateReact.ReactEditor.findPath(editor, link);
+    const [popoverOpen, setPopoverOpen] = React__namespace.useState(editor.lastInsertedLinkPath ? slate.Path.equals(path, editor.lastInsertedLinkPath) : false);
+    const elementText = link.children.map((child)=>child.text).join('');
+    const [linkText, setLinkText] = React__namespace.useState(elementText);
+    const [linkUrl, setLinkUrl] = React__namespace.useState(link.url);
+    const linkInputRef = React__namespace.useRef(null);
+    const isLastInsertedLink = editor.lastInsertedLinkPath ? !slate.Path.equals(path, editor.lastInsertedLinkPath) : true;
+    const [isSaveDisabled, setIsSaveDisabled] = React__namespace.useState(false);
+    const onLinkChange = (e)=>{
+        setIsSaveDisabled(false);
+        setLinkUrl(e.target.value);
+        try {
+            // eslint-disable-next-line no-new
+            new URL(e.target.value?.startsWith('/') ? `https://strapi.io${e.target.value}` : e.target.value);
+        } catch (error) {
+            setIsSaveDisabled(true);
+        }
+    };
+    const handleSave = (e)=>{
+        e.stopPropagation();
+        // If the selection is collapsed, we select the parent node because we want all the link to be replaced)
+        if (editor.selection && slate.Range.isCollapsed(editor.selection)) {
+            const [, parentPath] = slate.Editor.parent(editor, editor.selection.focus?.path);
+            slate.Transforms.select(editor, parentPath);
+        }
+        links.editLink(editor, {
+            url: linkUrl,
+            text: linkText
+        });
+        setPopoverOpen(false);
+        editor.lastInsertedLinkPath = null;
+        slateReact.ReactEditor.focus(editor);
+    };
+    const handleClose = ()=>{
+        if (link.url === '') {
+            links.removeLink(editor);
+        }
+        setPopoverOpen(false);
+        slateReact.ReactEditor.focus(editor);
+    };
+    React__namespace.useEffect(()=>{
+        // Focus on the link input element when the popover opens
+        if (popoverOpen) linkInputRef.current?.focus();
+    }, [
+        popoverOpen
+    ]);
+    const inputNotDirty = !linkText || !linkUrl || link.url && link.url === linkUrl && elementText && elementText === linkText;
+    return /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Popover.Root, {
+        open: popoverOpen,
+        children: [
+            /*#__PURE__*/ jsxRuntime.jsx(designSystem.Popover.Trigger, {
+                children: /*#__PURE__*/ jsxRuntime.jsx(StyledLink, {
+                    ...attributes,
+                    ref: forwardedRef,
+                    tag: "a",
+                    href: link.url,
+                    onClick: ()=>setPopoverOpen(true),
+                    color: "primary600",
+                    children: children
+                })
+            }),
+            /*#__PURE__*/ jsxRuntime.jsx(designSystem.Popover.Content, {
+                onPointerDownOutside: handleClose,
+                children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
+                    padding: 4,
+                    direction: "column",
+                    gap: 4,
+                    children: [
+                        /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Root, {
+                            width: "368px",
+                            children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
+                                direction: "column",
+                                gap: 1,
+                                alignItems: "stretch",
+                                children: [
+                                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Label, {
+                                        children: formatMessage({
+                                            id: 'components.Blocks.popover.text',
+                                            defaultMessage: 'Text'
+                                        })
+                                    }),
+                                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Input, {
+                                        name: "text",
+                                        placeholder: formatMessage({
+                                            id: 'components.Blocks.popover.text.placeholder',
+                                            defaultMessage: 'Enter link text'
+                                        }),
+                                        value: linkText,
+                                        onChange: (e)=>{
+                                            setLinkText(e.target.value);
+                                        }
+                                    })
+                                ]
+                            })
+                        }),
+                        /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Root, {
+                            width: "368px",
+                            children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
+                                direction: "column",
+                                gap: 1,
+                                alignItems: "stretch",
+                                children: [
+                                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Label, {
+                                        children: formatMessage({
+                                            id: 'components.Blocks.popover.link',
+                                            defaultMessage: 'Link'
+                                        })
+                                    }),
+                                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Input, {
+                                        ref: linkInputRef,
+                                        name: "url",
+                                        placeholder: formatMessage({
+                                            id: 'components.Blocks.popover.link.placeholder',
+                                            defaultMessage: 'Paste link'
+                                        }),
+                                        value: linkUrl,
+                                        onChange: onLinkChange
+                                    })
+                                ]
+                            })
+                        }),
+                        /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
+                            justifyContent: "space-between",
+                            width: "100%",
+                            children: [
+                                /*#__PURE__*/ jsxRuntime.jsx(RemoveButton, {
+                                    variant: "danger-light",
+                                    onClick: ()=>links.removeLink(editor),
+                                    $visible: isLastInsertedLink,
+                                    children: formatMessage({
+                                        id: 'components.Blocks.popover.remove',
+                                        defaultMessage: 'Remove'
+                                    })
+                                }),
+                                /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
+                                    gap: 2,
+                                    children: [
+                                        /*#__PURE__*/ jsxRuntime.jsx(designSystem.Button, {
+                                            variant: "tertiary",
+                                            onClick: handleClose,
+                                            children: formatMessage({
+                                                id: 'global.cancel',
+                                                defaultMessage: 'Cancel'
+                                            })
+                                        }),
+                                        /*#__PURE__*/ jsxRuntime.jsx(designSystem.Button, {
+                                            disabled: Boolean(inputNotDirty) || isSaveDisabled,
+                                            onClick: handleSave,
+                                            children: formatMessage({
+                                                id: 'global.save',
+                                                defaultMessage: 'Save'
+                                            })
+                                        })
+                                    ]
+                                })
+                            ]
+                        })
+                    ]
+                })
+            })
+        ]
+    });
+});
+const Link = /*#__PURE__*/ React__namespace.forwardRef((props, forwardedRef)=>{
+    if (!types.isLinkNode(props.element)) {
+        return null;
+    }
+    // LinkContent uses React hooks that rely on props.element being a link. If the type guard above
+    // doesn't pass, those hooks would be called conditionnally, which is not allowed.
+    // Hence the need for a separate component.
+    return /*#__PURE__*/ jsxRuntime.jsx(LinkContent, {
+        ...props,
+        link: props.element,
+        ref: forwardedRef
+    });
+});
+const linkBlocks = {
+    link: {
+        renderElement: (props)=>/*#__PURE__*/ jsxRuntime.jsx(Link, {
+                element: props.element,
+                attributes: props.attributes,
+                children: props.children
+            }),
+        // No handleConvert here, links are created via the link button in the toolbar
+        matchNode: (node)=>node.type === 'link',
+        isInBlocksSelector: false
+    }
+};
+
+exports.linkBlocks = linkBlocks;
+//# sourceMappingURL=Link.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Link.js","sources":["../../../../../../../../admin/src/pages/EditView/components/FormInputs/BlocksInput/Blocks/Link.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Box, Button, Field, Flex, Popover, useComposedRefs } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\nimport { Editor, Path, Range, Transforms } from 'slate';\nimport { type RenderElementProps, ReactEditor } from 'slate-react';\nimport { styled } from 'styled-components';\n\nimport { type BlocksStore, useBlocksEditorContext } from '../BlocksEditor';\nimport { editLink, removeLink } from '../utils/links';\nimport { isLinkNode, type Block } from '../utils/types';\n\nconst StyledLink = styled(Box)`\n  text-decoration: none;\n`;\n\nconst RemoveButton = styled(Button)<{ $visible: boolean }>`\n  visibility: ${(props) => (props.$visible ? 'visible' : 'hidden')};\n`;\n\ninterface LinkContentProps extends RenderElementProps {\n  link: Block<'link'>;\n}\n\nconst LinkContent = React.forwardRef<HTMLAnchorElement, LinkContentProps>(\n  ({ link, children, attributes }, forwardedRef) => {\n    const { formatMessage } = useIntl();\n    const { editor } = useBlocksEditorContext('Link');\n    const path = ReactEditor.findPath(editor, link);\n    const [popoverOpen, setPopoverOpen] = React.useState(\n      editor.lastInsertedLinkPath ? Path.equals(path, editor.lastInsertedLinkPath) : false\n    );\n    const elementText = link.children.map((child) => child.text).join('');\n    const [linkText, setLinkText] = React.useState(elementText);\n    const [linkUrl, setLinkUrl] = React.useState(link.url);\n    const linkInputRef = React.useRef<HTMLInputElement>(null);\n    const isLastInsertedLink = editor.lastInsertedLinkPath\n      ? !Path.equals(path, editor.lastInsertedLinkPath)\n      : true;\n    const [isSaveDisabled, setIsSaveDisabled] = React.useState(false);\n\n    const onLinkChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n      setIsSaveDisabled(false);\n      setLinkUrl(e.target.value);\n\n      try {\n        // eslint-disable-next-line no-new\n        new URL(\n          e.target.value?.startsWith('/') ? `https://strapi.io${e.target.value}` : e.target.value\n        );\n      } catch (error) {\n        setIsSaveDisabled(true);\n      }\n    };\n\n    const handleSave: React.FormEventHandler = (e) => {\n      e.stopPropagation();\n\n      // If the selection is collapsed, we select the parent node because we want all the link to be replaced)\n      if (editor.selection && Range.isCollapsed(editor.selection)) {\n        const [, parentPath] = Editor.parent(editor, editor.selection.focus?.path);\n        Transforms.select(editor, parentPath);\n      }\n\n      editLink(editor, { url: linkUrl, text: linkText });\n      setPopoverOpen(false);\n      editor.lastInsertedLinkPath = null;\n      ReactEditor.focus(editor);\n    };\n\n    const handleClose = () => {\n      if (link.url === '') {\n        removeLink(editor);\n      }\n\n      setPopoverOpen(false);\n      ReactEditor.focus(editor);\n    };\n\n    React.useEffect(() => {\n      // Focus on the link input element when the popover opens\n      if (popoverOpen) linkInputRef.current?.focus();\n    }, [popoverOpen]);\n\n    const inputNotDirty =\n      !linkText ||\n      !linkUrl ||\n      (link.url && link.url === linkUrl && elementText && elementText === linkText);\n\n    return (\n      <Popover.Root open={popoverOpen}>\n        <Popover.Trigger>\n          <StyledLink\n            {...attributes}\n            ref={forwardedRef}\n            tag=\"a\"\n            href={link.url}\n            onClick={() => setPopoverOpen(true)}\n            color=\"primary600\"\n          >\n            {children}\n          </StyledLink>\n        </Popover.Trigger>\n        <Popover.Content onPointerDownOutside={handleClose}>\n          <Flex padding={4} direction=\"column\" gap={4}>\n            <Field.Root width=\"368px\">\n              <Flex direction=\"column\" gap={1} alignItems=\"stretch\">\n                <Field.Label>\n                  {formatMessage({\n                    id: 'components.Blocks.popover.text',\n                    defaultMessage: 'Text',\n                  })}\n                </Field.Label>\n                <Field.Input\n                  name=\"text\"\n                  placeholder={formatMessage({\n                    id: 'components.Blocks.popover.text.placeholder',\n                    defaultMessage: 'Enter link text',\n                  })}\n                  value={linkText}\n                  onChange={(e) => {\n                    setLinkText(e.target.value);\n                  }}\n                />\n              </Flex>\n            </Field.Root>\n            <Field.Root width=\"368px\">\n              <Flex direction=\"column\" gap={1} alignItems=\"stretch\">\n                <Field.Label>\n                  {formatMessage({\n                    id: 'components.Blocks.popover.link',\n                    defaultMessage: 'Link',\n                  })}\n                </Field.Label>\n                <Field.Input\n                  ref={linkInputRef}\n                  name=\"url\"\n                  placeholder={formatMessage({\n                    id: 'components.Blocks.popover.link.placeholder',\n                    defaultMessage: 'Paste link',\n                  })}\n                  value={linkUrl}\n                  onChange={onLinkChange}\n                />\n              </Flex>\n            </Field.Root>\n            <Flex justifyContent=\"space-between\" width=\"100%\">\n              <RemoveButton\n                variant=\"danger-light\"\n                onClick={() => removeLink(editor)}\n                $visible={isLastInsertedLink}\n              >\n                {formatMessage({\n                  id: 'components.Blocks.popover.remove',\n                  defaultMessage: 'Remove',\n                })}\n              </RemoveButton>\n              <Flex gap={2}>\n                <Button variant=\"tertiary\" onClick={handleClose}>\n                  {formatMessage({\n                    id: 'global.cancel',\n                    defaultMessage: 'Cancel',\n                  })}\n                </Button>\n                <Button disabled={Boolean(inputNotDirty) || isSaveDisabled} onClick={handleSave}>\n                  {formatMessage({\n                    id: 'global.save',\n                    defaultMessage: 'Save',\n                  })}\n                </Button>\n              </Flex>\n            </Flex>\n          </Flex>\n        </Popover.Content>\n      </Popover.Root>\n    );\n  }\n);\n\nconst Link = React.forwardRef<HTMLAnchorElement, RenderElementProps>((props, forwardedRef) => {\n  if (!isLinkNode(props.element)) {\n    return null;\n  }\n\n  // LinkContent uses React hooks that rely on props.element being a link. If the type guard above\n  // doesn't pass, those hooks would be called conditionnally, which is not allowed.\n  // Hence the need for a separate component.\n  return <LinkContent {...props} link={props.element} ref={forwardedRef} />;\n});\n\nconst linkBlocks: Pick<BlocksStore, 'link'> = {\n  link: {\n    renderElement: (props) => (\n      <Link element={props.element} attributes={props.attributes}>\n        {props.children}\n      </Link>\n    ),\n    // No handleConvert here, links are created via the link button in the toolbar\n    matchNode: (node) => node.type === 'link',\n    isInBlocksSelector: false,\n  },\n};\n\nexport { linkBlocks };\n"],"names":["StyledLink","styled","Box","RemoveButton","Button","props","$visible","LinkContent","React","forwardRef","link","children","attributes","forwardedRef","formatMessage","useIntl","editor","useBlocksEditorContext","path","ReactEditor","findPath","popoverOpen","setPopoverOpen","useState","lastInsertedLinkPath","Path","equals","elementText","map","child","text","join","linkText","setLinkText","linkUrl","setLinkUrl","url","linkInputRef","useRef","isLastInsertedLink","isSaveDisabled","setIsSaveDisabled","onLinkChange","e","target","value","URL","startsWith","error","handleSave","stopPropagation","selection","Range","isCollapsed","parentPath","Editor","parent","focus","Transforms","select","editLink","handleClose","removeLink","useEffect","current","inputNotDirty","_jsxs","Popover","Root","open","_jsx","Trigger","ref","tag","href","onClick","color","Content","onPointerDownOutside","Flex","padding","direction","gap","Field","width","alignItems","Label","id","defaultMessage","Input","name","placeholder","onChange","justifyContent","variant","disabled","Boolean","Link","isLinkNode","element","linkBlocks","renderElement","matchNode","node","type","isInBlocksSelector"],"mappings":"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"}