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

package/dist/admin/pages/EditView/components/FormInputs/BlocksInput/BlocksEditor.js

@@ -0,0 +1,222 @@
+'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 reactIntl = require('react-intl');
+var slate = require('slate');
+var slateHistory = require('slate-history');
+var slateReact = require('slate-react');
+var styledComponents = require('styled-components');
+var translations = require('../../../../../utils/translations.js');
+var Code = require('./Blocks/Code.js');
+var Heading = require('./Blocks/Heading.js');
+var Image = require('./Blocks/Image.js');
+var Link = require('./Blocks/Link.js');
+var List = require('./Blocks/List.js');
+var Paragraph = require('./Blocks/Paragraph.js');
+var Quote = require('./Blocks/Quote.js');
+var BlocksContent = require('./BlocksContent.js');
+var BlocksToolbar = require('./BlocksToolbar.js');
+var EditorLayout = require('./EditorLayout.js');
+var Modifiers = require('./Modifiers.js');
+var withImages = require('./plugins/withImages.js');
+var withLinks = require('./plugins/withLinks.js');
+var withStrapiSchema = require('./plugins/withStrapiSchema.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 selectorBlockKeys = [
+    'paragraph',
+    'heading-one',
+    'heading-two',
+    'heading-three',
+    'heading-four',
+    'heading-five',
+    'heading-six',
+    'list-ordered',
+    'list-unordered',
+    'image',
+    'quote',
+    'code'
+];
+const isSelectorBlockKey = (key)=>{
+    return typeof key === 'string' && selectorBlockKeys.includes(key);
+};
+const [BlocksEditorProvider, usePartialBlocksEditorContext] = strapiAdmin.createContext('BlocksEditor');
+function useBlocksEditorContext(consumerName) {
+    const context = usePartialBlocksEditorContext(consumerName, (state)=>state);
+    const editor = slateReact.useSlate();
+    return {
+        ...context,
+        editor
+    };
+}
+/* -------------------------------------------------------------------------------------------------
+ * BlocksEditor
+ * -----------------------------------------------------------------------------------------------*/ const EditorDivider = styledComponents.styled(designSystem.Divider)`
+  background: ${({ theme })=>theme.colors.neutral200};
+`;
+const ExpandIconButton = styledComponents.styled(designSystem.IconButton)`
+  position: absolute;
+  bottom: 1.2rem;
+  right: 1.2rem;
+  box-shadow: ${({ theme })=>theme.shadows.filterShadow};
+`;
+/**
+ * Forces an update of the Slate editor when the value prop changes from outside of Slate.
+ * The root cause is that Slate is not a controlled component: https://github.com/ianstormtaylor/slate/issues/4612
+ * Why not use JSON.stringify(value) as the key?
+ * Because it would force a rerender of the entire editor every time the user types a character.
+ * Why not use the entity id as the key, since it's unique for each locale?
+ * Because it would not solve the problem when using the "fill in from other locale" feature
+ */ function useResetKey(value) {
+    // Keep track how many times Slate detected a change from a user interaction in the editor
+    const slateUpdatesCount = React__namespace.useRef(0);
+    // Keep track of how many times the value prop was updated, whether from within editor or from outside
+    const valueUpdatesCount = React__namespace.useRef(0);
+    // Use a key to force a rerender of the Slate editor when needed
+    const [key, setKey] = React__namespace.useState(0);
+    React__namespace.useEffect(()=>{
+        valueUpdatesCount.current += 1;
+        // If the 2 refs are not equal, it means the value was updated from outside
+        if (valueUpdatesCount.current !== slateUpdatesCount.current) {
+            // So we change the key to force a rerender of the Slate editor,
+            // which will pick up the new value through its initialValue prop
+            setKey((previousKey)=>previousKey + 1);
+            // Then bring the 2 refs back in sync
+            slateUpdatesCount.current = valueUpdatesCount.current;
+        }
+    }, [
+        value
+    ]);
+    return {
+        key,
+        incrementSlateUpdatesCount: ()=>slateUpdatesCount.current += 1
+    };
+}
+const pipe = (...fns)=>(value)=>fns.reduce((prev, fn)=>fn(prev), value);
+const BlocksEditor = /*#__PURE__*/ React__namespace.forwardRef(({ disabled = false, name, onChange, value, error, ...contentProps }, forwardedRef)=>{
+    const { formatMessage } = reactIntl.useIntl();
+    const [editor] = React__namespace.useState(()=>pipe(slateHistory.withHistory, withImages.withImages, withStrapiSchema.withStrapiSchema, slateReact.withReact, withLinks.withLinks)(slate.createEditor()));
+    const [liveText, setLiveText] = React__namespace.useState('');
+    const ariaDescriptionId = React__namespace.useId();
+    const [isExpandedMode, setIsExpandedMode] = React__namespace.useState(false);
+    const handleToggleExpand = ()=>{
+        setIsExpandedMode((prev)=>!prev);
+    };
+    /**
+     * Editable is not able to hold the ref, https://github.com/ianstormtaylor/slate/issues/4082
+     * so with "useImperativeHandle" we can use ReactEditor methods to expose to the parent above
+     * also not passing forwarded ref here, gives console warning.
+     */ React__namespace.useImperativeHandle(forwardedRef, ()=>({
+            focus () {
+                slateReact.ReactEditor.focus(editor);
+            }
+        }), [
+        editor
+    ]);
+    const { key, incrementSlateUpdatesCount } = useResetKey(value);
+    const handleSlateChange = (state)=>{
+        const isAstChange = editor.operations.some((op)=>op.type !== 'set_selection');
+        if (isAstChange) {
+            incrementSlateUpdatesCount();
+            onChange(name, state);
+        }
+    };
+    const blocks = {
+        ...Paragraph.paragraphBlocks,
+        ...Heading.headingBlocks,
+        ...List.listBlocks,
+        ...Link.linkBlocks,
+        ...Image.imageBlocks,
+        ...Quote.quoteBlocks,
+        ...Code.codeBlocks
+    };
+    return /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [
+            /*#__PURE__*/ jsxRuntime.jsx(designSystem.VisuallyHidden, {
+                id: ariaDescriptionId,
+                children: formatMessage({
+                    id: translations.getTranslation('components.Blocks.dnd.instruction'),
+                    defaultMessage: `To reorder blocks, press Command or Control along with Shift and the Up or Down arrow keys`
+                })
+            }),
+            /*#__PURE__*/ jsxRuntime.jsx(designSystem.VisuallyHidden, {
+                "aria-live": "assertive",
+                children: liveText
+            }),
+            /*#__PURE__*/ jsxRuntime.jsx(slateReact.Slate, {
+                editor: editor,
+                initialValue: value || [
+                    {
+                        type: 'paragraph',
+                        children: [
+                            {
+                                type: 'text',
+                                text: ''
+                            }
+                        ]
+                    }
+                ],
+                onChange: handleSlateChange,
+                children: /*#__PURE__*/ jsxRuntime.jsx(BlocksEditorProvider, {
+                    blocks: blocks,
+                    modifiers: Modifiers.modifiers,
+                    disabled: disabled,
+                    name: name,
+                    setLiveText: setLiveText,
+                    isExpandedMode: isExpandedMode,
+                    children: /*#__PURE__*/ jsxRuntime.jsxs(EditorLayout.EditorLayout, {
+                        error: error,
+                        disabled: disabled,
+                        onCollapse: handleToggleExpand,
+                        ariaDescriptionId: ariaDescriptionId,
+                        children: [
+                            /*#__PURE__*/ jsxRuntime.jsx(BlocksToolbar.BlocksToolbar, {}),
+                            /*#__PURE__*/ jsxRuntime.jsx(EditorDivider, {
+                                width: "100%"
+                            }),
+                            /*#__PURE__*/ jsxRuntime.jsx(BlocksContent.BlocksContent, {
+                                ...contentProps
+                            }),
+                            !isExpandedMode && /*#__PURE__*/ jsxRuntime.jsx(ExpandIconButton, {
+                                label: formatMessage({
+                                    id: translations.getTranslation('components.Blocks.expand'),
+                                    defaultMessage: 'Expand'
+                                }),
+                                onClick: handleToggleExpand,
+                                children: /*#__PURE__*/ jsxRuntime.jsx(Icons.Expand, {})
+                            })
+                        ]
+                    })
+                })
+            }, key)
+        ]
+    });
+});
+
+exports.BlocksEditor = BlocksEditor;
+exports.BlocksEditorProvider = BlocksEditorProvider;
+exports.isSelectorBlockKey = isSelectorBlockKey;
+exports.useBlocksEditorContext = useBlocksEditorContext;
+//# sourceMappingURL=BlocksEditor.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"BlocksEditor.js","sources":["../../../../../../../admin/src/pages/EditView/components/FormInputs/BlocksInput/BlocksEditor.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { createContext, type FieldValue } from '@strapi/admin/strapi-admin';\nimport { IconButton, Divider, VisuallyHidden } from '@strapi/design-system';\nimport { Expand } from '@strapi/icons';\nimport { MessageDescriptor, useIntl } from 'react-intl';\nimport { Editor, type Descendant, createEditor } from 'slate';\nimport { withHistory } from 'slate-history';\nimport { type RenderElementProps, Slate, withReact, ReactEditor, useSlate } from 'slate-react';\nimport { styled, type CSSProperties } from 'styled-components';\n\nimport { getTranslation } from '../../../../../utils/translations';\n\nimport { codeBlocks } from './Blocks/Code';\nimport { headingBlocks } from './Blocks/Heading';\nimport { imageBlocks } from './Blocks/Image';\nimport { linkBlocks } from './Blocks/Link';\nimport { listBlocks } from './Blocks/List';\nimport { paragraphBlocks } from './Blocks/Paragraph';\nimport { quoteBlocks } from './Blocks/Quote';\nimport { BlocksContent, type BlocksContentProps } from './BlocksContent';\nimport { BlocksToolbar } from './BlocksToolbar';\nimport { EditorLayout } from './EditorLayout';\nimport { type ModifiersStore, modifiers } from './Modifiers';\nimport { withImages } from './plugins/withImages';\nimport { withLinks } from './plugins/withLinks';\nimport { withStrapiSchema } from './plugins/withStrapiSchema';\n\nimport type { Schema } from '@strapi/types';\n\n/* -------------------------------------------------------------------------------------------------\n * BlocksEditorProvider\n * -----------------------------------------------------------------------------------------------*/\n\ninterface BaseBlock {\n  renderElement: (props: RenderElementProps) => React.JSX.Element;\n  matchNode: (node: Schema.Attribute.BlocksNode) => boolean;\n  handleConvert?: (editor: Editor) => void | (() => React.JSX.Element);\n  handleEnterKey?: (editor: Editor) => void;\n  handleBackspaceKey?: (editor: Editor, event: React.KeyboardEvent<HTMLElement>) => void;\n  handleTab?: (editor: Editor) => void;\n  snippets?: string[];\n  dragHandleTopMargin?: CSSProperties['marginTop'];\n}\n\ninterface NonSelectorBlock extends BaseBlock {\n  isInBlocksSelector: false;\n}\n\ninterface SelectorBlock extends BaseBlock {\n  isInBlocksSelector: true;\n  icon: React.ComponentType;\n  label: MessageDescriptor;\n}\n\ntype NonSelectorBlockKey = 'list-item' | 'link';\n\nconst selectorBlockKeys = [\n  'paragraph',\n  'heading-one',\n  'heading-two',\n  'heading-three',\n  'heading-four',\n  'heading-five',\n  'heading-six',\n  'list-ordered',\n  'list-unordered',\n  'image',\n  'quote',\n  'code',\n] as const;\n\ntype SelectorBlockKey = (typeof selectorBlockKeys)[number];\n\nconst isSelectorBlockKey = (key: unknown): key is SelectorBlockKey => {\n  return typeof key === 'string' && selectorBlockKeys.includes(key as SelectorBlockKey);\n};\n\ntype BlocksStore = {\n  [K in SelectorBlockKey]: SelectorBlock;\n} & {\n  [K in NonSelectorBlockKey]: NonSelectorBlock;\n};\n\ninterface BlocksEditorContextValue {\n  blocks: BlocksStore;\n  modifiers: ModifiersStore;\n  disabled: boolean;\n  name: string;\n  setLiveText: (text: string) => void;\n  isExpandedMode: boolean;\n}\n\nconst [BlocksEditorProvider, usePartialBlocksEditorContext] =\n  createContext<BlocksEditorContextValue>('BlocksEditor');\n\nfunction useBlocksEditorContext(\n  consumerName: string\n): BlocksEditorContextValue & { editor: Editor } {\n  const context = usePartialBlocksEditorContext(consumerName, (state) => state);\n  const editor = useSlate();\n\n  return {\n    ...context,\n    editor,\n  };\n}\n\n/* -------------------------------------------------------------------------------------------------\n * BlocksEditor\n * -----------------------------------------------------------------------------------------------*/\n\nconst EditorDivider = styled(Divider)`\n  background: ${({ theme }) => theme.colors.neutral200};\n`;\n\nconst ExpandIconButton = styled(IconButton)`\n  position: absolute;\n  bottom: 1.2rem;\n  right: 1.2rem;\n  box-shadow: ${({ theme }) => theme.shadows.filterShadow};\n`;\n\n/**\n * Forces an update of the Slate editor when the value prop changes from outside of Slate.\n * The root cause is that Slate is not a controlled component: https://github.com/ianstormtaylor/slate/issues/4612\n * Why not use JSON.stringify(value) as the key?\n * Because it would force a rerender of the entire editor every time the user types a character.\n * Why not use the entity id as the key, since it's unique for each locale?\n * Because it would not solve the problem when using the \"fill in from other locale\" feature\n */\nfunction useResetKey(value?: Schema.Attribute.BlocksValue): {\n  key: number;\n  incrementSlateUpdatesCount: () => void;\n} {\n  // Keep track how many times Slate detected a change from a user interaction in the editor\n  const slateUpdatesCount = React.useRef(0);\n  // Keep track of how many times the value prop was updated, whether from within editor or from outside\n  const valueUpdatesCount = React.useRef(0);\n  // Use a key to force a rerender of the Slate editor when needed\n  const [key, setKey] = React.useState(0);\n\n  React.useEffect(() => {\n    valueUpdatesCount.current += 1;\n\n    // If the 2 refs are not equal, it means the value was updated from outside\n    if (valueUpdatesCount.current !== slateUpdatesCount.current) {\n      // So we change the key to force a rerender of the Slate editor,\n      // which will pick up the new value through its initialValue prop\n      setKey((previousKey) => previousKey + 1);\n\n      // Then bring the 2 refs back in sync\n      slateUpdatesCount.current = valueUpdatesCount.current;\n    }\n  }, [value]);\n\n  return { key, incrementSlateUpdatesCount: () => (slateUpdatesCount.current += 1) };\n}\n\nconst pipe =\n  (...fns: ((baseEditor: Editor) => Editor)[]) =>\n  (value: Editor) =>\n    fns.reduce<Editor>((prev, fn) => fn(prev), value);\n\ninterface BlocksEditorProps\n  extends Pick<FieldValue<Schema.Attribute.BlocksValue>, 'onChange' | 'value' | 'error'>,\n    BlocksContentProps {\n  disabled?: boolean;\n  name: string;\n}\n\nconst BlocksEditor = React.forwardRef<{ focus: () => void }, BlocksEditorProps>(\n  ({ disabled = false, name, onChange, value, error, ...contentProps }, forwardedRef) => {\n    const { formatMessage } = useIntl();\n    const [editor] = React.useState(() =>\n      pipe(withHistory, withImages, withStrapiSchema, withReact, withLinks)(createEditor())\n    );\n    const [liveText, setLiveText] = React.useState('');\n    const ariaDescriptionId = React.useId();\n    const [isExpandedMode, setIsExpandedMode] = React.useState(false);\n\n    const handleToggleExpand = () => {\n      setIsExpandedMode((prev) => !prev);\n    };\n\n    /**\n     * Editable is not able to hold the ref, https://github.com/ianstormtaylor/slate/issues/4082\n     * so with \"useImperativeHandle\" we can use ReactEditor methods to expose to the parent above\n     * also not passing forwarded ref here, gives console warning.\n     */\n    React.useImperativeHandle(\n      forwardedRef,\n      () => ({\n        focus() {\n          ReactEditor.focus(editor);\n        },\n      }),\n      [editor]\n    );\n\n    const { key, incrementSlateUpdatesCount } = useResetKey(value);\n\n    const handleSlateChange = (state: Descendant[]) => {\n      const isAstChange = editor.operations.some((op) => op.type !== 'set_selection');\n\n      if (isAstChange) {\n        incrementSlateUpdatesCount();\n\n        onChange(name, state as Schema.Attribute.BlocksValue);\n      }\n    };\n\n    const blocks: BlocksStore = {\n      ...paragraphBlocks,\n      ...headingBlocks,\n      ...listBlocks,\n      ...linkBlocks,\n      ...imageBlocks,\n      ...quoteBlocks,\n      ...codeBlocks,\n    };\n\n    return (\n      <>\n        <VisuallyHidden id={ariaDescriptionId}>\n          {formatMessage({\n            id: getTranslation('components.Blocks.dnd.instruction'),\n            defaultMessage: `To reorder blocks, press Command or Control along with Shift and the Up or Down arrow keys`,\n          })}\n        </VisuallyHidden>\n        <VisuallyHidden aria-live=\"assertive\">{liveText}</VisuallyHidden>\n        <Slate\n          editor={editor}\n          initialValue={value || [{ type: 'paragraph', children: [{ type: 'text', text: '' }] }]}\n          onChange={handleSlateChange}\n          key={key}\n        >\n          <BlocksEditorProvider\n            blocks={blocks}\n            modifiers={modifiers}\n            disabled={disabled}\n            name={name}\n            setLiveText={setLiveText}\n            isExpandedMode={isExpandedMode}\n          >\n            <EditorLayout\n              error={error}\n              disabled={disabled}\n              onCollapse={handleToggleExpand}\n              ariaDescriptionId={ariaDescriptionId}\n            >\n              <BlocksToolbar />\n              <EditorDivider width=\"100%\" />\n              <BlocksContent {...contentProps} />\n              {!isExpandedMode && (\n                <ExpandIconButton\n                  label={formatMessage({\n                    id: getTranslation('components.Blocks.expand'),\n                    defaultMessage: 'Expand',\n                  })}\n                  onClick={handleToggleExpand}\n                >\n                  <Expand />\n                </ExpandIconButton>\n              )}\n            </EditorLayout>\n          </BlocksEditorProvider>\n        </Slate>\n      </>\n    );\n  }\n);\n\nexport {\n  type BlocksStore,\n  type SelectorBlockKey,\n  BlocksEditor,\n  BlocksEditorProvider,\n  useBlocksEditorContext,\n  isSelectorBlockKey,\n};\n"],"names":["selectorBlockKeys","isSelectorBlockKey","key","includes","BlocksEditorProvider","usePartialBlocksEditorContext","createContext","useBlocksEditorContext","consumerName","context","state","editor","useSlate","EditorDivider","styled","Divider","theme","colors","neutral200","ExpandIconButton","IconButton","shadows","filterShadow","useResetKey","value","slateUpdatesCount","React","useRef","valueUpdatesCount","setKey","useState","useEffect","current","previousKey","incrementSlateUpdatesCount","pipe","fns","reduce","prev","fn","BlocksEditor","forwardRef","disabled","name","onChange","error","contentProps","forwardedRef","formatMessage","useIntl","withHistory","withImages","withStrapiSchema","withReact","withLinks","createEditor","liveText","setLiveText","ariaDescriptionId","useId","isExpandedMode","setIsExpandedMode","handleToggleExpand","useImperativeHandle","focus","ReactEditor","handleSlateChange","isAstChange","operations","some","op","type","blocks","paragraphBlocks","headingBlocks","listBlocks","linkBlocks","imageBlocks","quoteBlocks","codeBlocks","_jsxs","_Fragment","_jsx","VisuallyHidden","id","getTranslation","defaultMessage","aria-live","Slate","initialValue","children","text","modifiers","EditorLayout","onCollapse","BlocksToolbar","width","BlocksContent","label","onClick","Expand"],"mappings":"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"}

package/dist/admin/pages/EditView/components/FormInputs/BlocksInput/BlocksEditor.mjs

@@ -0,0 +1,198 @@
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import * as React from 'react';
+import { createContext } from '@strapi/admin/strapi-admin';
+import { Divider, IconButton, VisuallyHidden } from '@strapi/design-system';
+import { Expand } from '@strapi/icons';
+import { useIntl } from 'react-intl';
+import { createEditor } from 'slate';
+import { withHistory } from 'slate-history';
+import { ReactEditor, Slate, useSlate, withReact } from 'slate-react';
+import { styled } from 'styled-components';
+import { getTranslation } from '../../../../../utils/translations.mjs';
+import { codeBlocks } from './Blocks/Code.mjs';
+import { headingBlocks } from './Blocks/Heading.mjs';
+import { imageBlocks } from './Blocks/Image.mjs';
+import { linkBlocks } from './Blocks/Link.mjs';
+import { listBlocks } from './Blocks/List.mjs';
+import { paragraphBlocks } from './Blocks/Paragraph.mjs';
+import { quoteBlocks } from './Blocks/Quote.mjs';
+import { BlocksContent } from './BlocksContent.mjs';
+import { BlocksToolbar } from './BlocksToolbar.mjs';
+import { EditorLayout } from './EditorLayout.mjs';
+import { modifiers } from './Modifiers.mjs';
+import { withImages } from './plugins/withImages.mjs';
+import { withLinks } from './plugins/withLinks.mjs';
+import { withStrapiSchema } from './plugins/withStrapiSchema.mjs';
+
+const selectorBlockKeys = [
+    'paragraph',
+    'heading-one',
+    'heading-two',
+    'heading-three',
+    'heading-four',
+    'heading-five',
+    'heading-six',
+    'list-ordered',
+    'list-unordered',
+    'image',
+    'quote',
+    'code'
+];
+const isSelectorBlockKey = (key)=>{
+    return typeof key === 'string' && selectorBlockKeys.includes(key);
+};
+const [BlocksEditorProvider, usePartialBlocksEditorContext] = createContext('BlocksEditor');
+function useBlocksEditorContext(consumerName) {
+    const context = usePartialBlocksEditorContext(consumerName, (state)=>state);
+    const editor = useSlate();
+    return {
+        ...context,
+        editor
+    };
+}
+/* -------------------------------------------------------------------------------------------------
+ * BlocksEditor
+ * -----------------------------------------------------------------------------------------------*/ const EditorDivider = styled(Divider)`
+  background: ${({ theme })=>theme.colors.neutral200};
+`;
+const ExpandIconButton = styled(IconButton)`
+  position: absolute;
+  bottom: 1.2rem;
+  right: 1.2rem;
+  box-shadow: ${({ theme })=>theme.shadows.filterShadow};
+`;
+/**
+ * Forces an update of the Slate editor when the value prop changes from outside of Slate.
+ * The root cause is that Slate is not a controlled component: https://github.com/ianstormtaylor/slate/issues/4612
+ * Why not use JSON.stringify(value) as the key?
+ * Because it would force a rerender of the entire editor every time the user types a character.
+ * Why not use the entity id as the key, since it's unique for each locale?
+ * Because it would not solve the problem when using the "fill in from other locale" feature
+ */ function useResetKey(value) {
+    // Keep track how many times Slate detected a change from a user interaction in the editor
+    const slateUpdatesCount = React.useRef(0);
+    // Keep track of how many times the value prop was updated, whether from within editor or from outside
+    const valueUpdatesCount = React.useRef(0);
+    // Use a key to force a rerender of the Slate editor when needed
+    const [key, setKey] = React.useState(0);
+    React.useEffect(()=>{
+        valueUpdatesCount.current += 1;
+        // If the 2 refs are not equal, it means the value was updated from outside
+        if (valueUpdatesCount.current !== slateUpdatesCount.current) {
+            // So we change the key to force a rerender of the Slate editor,
+            // which will pick up the new value through its initialValue prop
+            setKey((previousKey)=>previousKey + 1);
+            // Then bring the 2 refs back in sync
+            slateUpdatesCount.current = valueUpdatesCount.current;
+        }
+    }, [
+        value
+    ]);
+    return {
+        key,
+        incrementSlateUpdatesCount: ()=>slateUpdatesCount.current += 1
+    };
+}
+const pipe = (...fns)=>(value)=>fns.reduce((prev, fn)=>fn(prev), value);
+const BlocksEditor = /*#__PURE__*/ React.forwardRef(({ disabled = false, name, onChange, value, error, ...contentProps }, forwardedRef)=>{
+    const { formatMessage } = useIntl();
+    const [editor] = React.useState(()=>pipe(withHistory, withImages, withStrapiSchema, withReact, withLinks)(createEditor()));
+    const [liveText, setLiveText] = React.useState('');
+    const ariaDescriptionId = React.useId();
+    const [isExpandedMode, setIsExpandedMode] = React.useState(false);
+    const handleToggleExpand = ()=>{
+        setIsExpandedMode((prev)=>!prev);
+    };
+    /**
+     * Editable is not able to hold the ref, https://github.com/ianstormtaylor/slate/issues/4082
+     * so with "useImperativeHandle" we can use ReactEditor methods to expose to the parent above
+     * also not passing forwarded ref here, gives console warning.
+     */ React.useImperativeHandle(forwardedRef, ()=>({
+            focus () {
+                ReactEditor.focus(editor);
+            }
+        }), [
+        editor
+    ]);
+    const { key, incrementSlateUpdatesCount } = useResetKey(value);
+    const handleSlateChange = (state)=>{
+        const isAstChange = editor.operations.some((op)=>op.type !== 'set_selection');
+        if (isAstChange) {
+            incrementSlateUpdatesCount();
+            onChange(name, state);
+        }
+    };
+    const blocks = {
+        ...paragraphBlocks,
+        ...headingBlocks,
+        ...listBlocks,
+        ...linkBlocks,
+        ...imageBlocks,
+        ...quoteBlocks,
+        ...codeBlocks
+    };
+    return /*#__PURE__*/ jsxs(Fragment, {
+        children: [
+            /*#__PURE__*/ jsx(VisuallyHidden, {
+                id: ariaDescriptionId,
+                children: formatMessage({
+                    id: getTranslation('components.Blocks.dnd.instruction'),
+                    defaultMessage: `To reorder blocks, press Command or Control along with Shift and the Up or Down arrow keys`
+                })
+            }),
+            /*#__PURE__*/ jsx(VisuallyHidden, {
+                "aria-live": "assertive",
+                children: liveText
+            }),
+            /*#__PURE__*/ jsx(Slate, {
+                editor: editor,
+                initialValue: value || [
+                    {
+                        type: 'paragraph',
+                        children: [
+                            {
+                                type: 'text',
+                                text: ''
+                            }
+                        ]
+                    }
+                ],
+                onChange: handleSlateChange,
+                children: /*#__PURE__*/ jsx(BlocksEditorProvider, {
+                    blocks: blocks,
+                    modifiers: modifiers,
+                    disabled: disabled,
+                    name: name,
+                    setLiveText: setLiveText,
+                    isExpandedMode: isExpandedMode,
+                    children: /*#__PURE__*/ jsxs(EditorLayout, {
+                        error: error,
+                        disabled: disabled,
+                        onCollapse: handleToggleExpand,
+                        ariaDescriptionId: ariaDescriptionId,
+                        children: [
+                            /*#__PURE__*/ jsx(BlocksToolbar, {}),
+                            /*#__PURE__*/ jsx(EditorDivider, {
+                                width: "100%"
+                            }),
+                            /*#__PURE__*/ jsx(BlocksContent, {
+                                ...contentProps
+                            }),
+                            !isExpandedMode && /*#__PURE__*/ jsx(ExpandIconButton, {
+                                label: formatMessage({
+                                    id: getTranslation('components.Blocks.expand'),
+                                    defaultMessage: 'Expand'
+                                }),
+                                onClick: handleToggleExpand,
+                                children: /*#__PURE__*/ jsx(Expand, {})
+                            })
+                        ]
+                    })
+                })
+            }, key)
+        ]
+    });
+});
+
+export { BlocksEditor, BlocksEditorProvider, isSelectorBlockKey, useBlocksEditorContext };
+//# sourceMappingURL=BlocksEditor.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"BlocksEditor.mjs","sources":["../../../../../../../admin/src/pages/EditView/components/FormInputs/BlocksInput/BlocksEditor.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { createContext, type FieldValue } from '@strapi/admin/strapi-admin';\nimport { IconButton, Divider, VisuallyHidden } from '@strapi/design-system';\nimport { Expand } from '@strapi/icons';\nimport { MessageDescriptor, useIntl } from 'react-intl';\nimport { Editor, type Descendant, createEditor } from 'slate';\nimport { withHistory } from 'slate-history';\nimport { type RenderElementProps, Slate, withReact, ReactEditor, useSlate } from 'slate-react';\nimport { styled, type CSSProperties } from 'styled-components';\n\nimport { getTranslation } from '../../../../../utils/translations';\n\nimport { codeBlocks } from './Blocks/Code';\nimport { headingBlocks } from './Blocks/Heading';\nimport { imageBlocks } from './Blocks/Image';\nimport { linkBlocks } from './Blocks/Link';\nimport { listBlocks } from './Blocks/List';\nimport { paragraphBlocks } from './Blocks/Paragraph';\nimport { quoteBlocks } from './Blocks/Quote';\nimport { BlocksContent, type BlocksContentProps } from './BlocksContent';\nimport { BlocksToolbar } from './BlocksToolbar';\nimport { EditorLayout } from './EditorLayout';\nimport { type ModifiersStore, modifiers } from './Modifiers';\nimport { withImages } from './plugins/withImages';\nimport { withLinks } from './plugins/withLinks';\nimport { withStrapiSchema } from './plugins/withStrapiSchema';\n\nimport type { Schema } from '@strapi/types';\n\n/* -------------------------------------------------------------------------------------------------\n * BlocksEditorProvider\n * -----------------------------------------------------------------------------------------------*/\n\ninterface BaseBlock {\n  renderElement: (props: RenderElementProps) => React.JSX.Element;\n  matchNode: (node: Schema.Attribute.BlocksNode) => boolean;\n  handleConvert?: (editor: Editor) => void | (() => React.JSX.Element);\n  handleEnterKey?: (editor: Editor) => void;\n  handleBackspaceKey?: (editor: Editor, event: React.KeyboardEvent<HTMLElement>) => void;\n  handleTab?: (editor: Editor) => void;\n  snippets?: string[];\n  dragHandleTopMargin?: CSSProperties['marginTop'];\n}\n\ninterface NonSelectorBlock extends BaseBlock {\n  isInBlocksSelector: false;\n}\n\ninterface SelectorBlock extends BaseBlock {\n  isInBlocksSelector: true;\n  icon: React.ComponentType;\n  label: MessageDescriptor;\n}\n\ntype NonSelectorBlockKey = 'list-item' | 'link';\n\nconst selectorBlockKeys = [\n  'paragraph',\n  'heading-one',\n  'heading-two',\n  'heading-three',\n  'heading-four',\n  'heading-five',\n  'heading-six',\n  'list-ordered',\n  'list-unordered',\n  'image',\n  'quote',\n  'code',\n] as const;\n\ntype SelectorBlockKey = (typeof selectorBlockKeys)[number];\n\nconst isSelectorBlockKey = (key: unknown): key is SelectorBlockKey => {\n  return typeof key === 'string' && selectorBlockKeys.includes(key as SelectorBlockKey);\n};\n\ntype BlocksStore = {\n  [K in SelectorBlockKey]: SelectorBlock;\n} & {\n  [K in NonSelectorBlockKey]: NonSelectorBlock;\n};\n\ninterface BlocksEditorContextValue {\n  blocks: BlocksStore;\n  modifiers: ModifiersStore;\n  disabled: boolean;\n  name: string;\n  setLiveText: (text: string) => void;\n  isExpandedMode: boolean;\n}\n\nconst [BlocksEditorProvider, usePartialBlocksEditorContext] =\n  createContext<BlocksEditorContextValue>('BlocksEditor');\n\nfunction useBlocksEditorContext(\n  consumerName: string\n): BlocksEditorContextValue & { editor: Editor } {\n  const context = usePartialBlocksEditorContext(consumerName, (state) => state);\n  const editor = useSlate();\n\n  return {\n    ...context,\n    editor,\n  };\n}\n\n/* -------------------------------------------------------------------------------------------------\n * BlocksEditor\n * -----------------------------------------------------------------------------------------------*/\n\nconst EditorDivider = styled(Divider)`\n  background: ${({ theme }) => theme.colors.neutral200};\n`;\n\nconst ExpandIconButton = styled(IconButton)`\n  position: absolute;\n  bottom: 1.2rem;\n  right: 1.2rem;\n  box-shadow: ${({ theme }) => theme.shadows.filterShadow};\n`;\n\n/**\n * Forces an update of the Slate editor when the value prop changes from outside of Slate.\n * The root cause is that Slate is not a controlled component: https://github.com/ianstormtaylor/slate/issues/4612\n * Why not use JSON.stringify(value) as the key?\n * Because it would force a rerender of the entire editor every time the user types a character.\n * Why not use the entity id as the key, since it's unique for each locale?\n * Because it would not solve the problem when using the \"fill in from other locale\" feature\n */\nfunction useResetKey(value?: Schema.Attribute.BlocksValue): {\n  key: number;\n  incrementSlateUpdatesCount: () => void;\n} {\n  // Keep track how many times Slate detected a change from a user interaction in the editor\n  const slateUpdatesCount = React.useRef(0);\n  // Keep track of how many times the value prop was updated, whether from within editor or from outside\n  const valueUpdatesCount = React.useRef(0);\n  // Use a key to force a rerender of the Slate editor when needed\n  const [key, setKey] = React.useState(0);\n\n  React.useEffect(() => {\n    valueUpdatesCount.current += 1;\n\n    // If the 2 refs are not equal, it means the value was updated from outside\n    if (valueUpdatesCount.current !== slateUpdatesCount.current) {\n      // So we change the key to force a rerender of the Slate editor,\n      // which will pick up the new value through its initialValue prop\n      setKey((previousKey) => previousKey + 1);\n\n      // Then bring the 2 refs back in sync\n      slateUpdatesCount.current = valueUpdatesCount.current;\n    }\n  }, [value]);\n\n  return { key, incrementSlateUpdatesCount: () => (slateUpdatesCount.current += 1) };\n}\n\nconst pipe =\n  (...fns: ((baseEditor: Editor) => Editor)[]) =>\n  (value: Editor) =>\n    fns.reduce<Editor>((prev, fn) => fn(prev), value);\n\ninterface BlocksEditorProps\n  extends Pick<FieldValue<Schema.Attribute.BlocksValue>, 'onChange' | 'value' | 'error'>,\n    BlocksContentProps {\n  disabled?: boolean;\n  name: string;\n}\n\nconst BlocksEditor = React.forwardRef<{ focus: () => void }, BlocksEditorProps>(\n  ({ disabled = false, name, onChange, value, error, ...contentProps }, forwardedRef) => {\n    const { formatMessage } = useIntl();\n    const [editor] = React.useState(() =>\n      pipe(withHistory, withImages, withStrapiSchema, withReact, withLinks)(createEditor())\n    );\n    const [liveText, setLiveText] = React.useState('');\n    const ariaDescriptionId = React.useId();\n    const [isExpandedMode, setIsExpandedMode] = React.useState(false);\n\n    const handleToggleExpand = () => {\n      setIsExpandedMode((prev) => !prev);\n    };\n\n    /**\n     * Editable is not able to hold the ref, https://github.com/ianstormtaylor/slate/issues/4082\n     * so with \"useImperativeHandle\" we can use ReactEditor methods to expose to the parent above\n     * also not passing forwarded ref here, gives console warning.\n     */\n    React.useImperativeHandle(\n      forwardedRef,\n      () => ({\n        focus() {\n          ReactEditor.focus(editor);\n        },\n      }),\n      [editor]\n    );\n\n    const { key, incrementSlateUpdatesCount } = useResetKey(value);\n\n    const handleSlateChange = (state: Descendant[]) => {\n      const isAstChange = editor.operations.some((op) => op.type !== 'set_selection');\n\n      if (isAstChange) {\n        incrementSlateUpdatesCount();\n\n        onChange(name, state as Schema.Attribute.BlocksValue);\n      }\n    };\n\n    const blocks: BlocksStore = {\n      ...paragraphBlocks,\n      ...headingBlocks,\n      ...listBlocks,\n      ...linkBlocks,\n      ...imageBlocks,\n      ...quoteBlocks,\n      ...codeBlocks,\n    };\n\n    return (\n      <>\n        <VisuallyHidden id={ariaDescriptionId}>\n          {formatMessage({\n            id: getTranslation('components.Blocks.dnd.instruction'),\n            defaultMessage: `To reorder blocks, press Command or Control along with Shift and the Up or Down arrow keys`,\n          })}\n        </VisuallyHidden>\n        <VisuallyHidden aria-live=\"assertive\">{liveText}</VisuallyHidden>\n        <Slate\n          editor={editor}\n          initialValue={value || [{ type: 'paragraph', children: [{ type: 'text', text: '' }] }]}\n          onChange={handleSlateChange}\n          key={key}\n        >\n          <BlocksEditorProvider\n            blocks={blocks}\n            modifiers={modifiers}\n            disabled={disabled}\n            name={name}\n            setLiveText={setLiveText}\n            isExpandedMode={isExpandedMode}\n          >\n            <EditorLayout\n              error={error}\n              disabled={disabled}\n              onCollapse={handleToggleExpand}\n              ariaDescriptionId={ariaDescriptionId}\n            >\n              <BlocksToolbar />\n              <EditorDivider width=\"100%\" />\n              <BlocksContent {...contentProps} />\n              {!isExpandedMode && (\n                <ExpandIconButton\n                  label={formatMessage({\n                    id: getTranslation('components.Blocks.expand'),\n                    defaultMessage: 'Expand',\n                  })}\n                  onClick={handleToggleExpand}\n                >\n                  <Expand />\n                </ExpandIconButton>\n              )}\n            </EditorLayout>\n          </BlocksEditorProvider>\n        </Slate>\n      </>\n    );\n  }\n);\n\nexport {\n  type BlocksStore,\n  type SelectorBlockKey,\n  BlocksEditor,\n  BlocksEditorProvider,\n  useBlocksEditorContext,\n  isSelectorBlockKey,\n};\n"],"names":["selectorBlockKeys","isSelectorBlockKey","key","includes","BlocksEditorProvider","usePartialBlocksEditorContext","createContext","useBlocksEditorContext","consumerName","context","state","editor","useSlate","EditorDivider","styled","Divider","theme","colors","neutral200","ExpandIconButton","IconButton","shadows","filterShadow","useResetKey","value","slateUpdatesCount","React","useRef","valueUpdatesCount","setKey","useState","useEffect","current","previousKey","incrementSlateUpdatesCount","pipe","fns","reduce","prev","fn","BlocksEditor","forwardRef","disabled","name","onChange","error","contentProps","forwardedRef","formatMessage","useIntl","withHistory","withImages","withStrapiSchema","withReact","withLinks","createEditor","liveText","setLiveText","ariaDescriptionId","useId","isExpandedMode","setIsExpandedMode","handleToggleExpand","useImperativeHandle","focus","ReactEditor","handleSlateChange","isAstChange","operations","some","op","type","blocks","paragraphBlocks","headingBlocks","listBlocks","linkBlocks","imageBlocks","quoteBlocks","codeBlocks","_jsxs","_Fragment","_jsx","VisuallyHidden","id","getTranslation","defaultMessage","aria-live","Slate","initialValue","children","text","modifiers","EditorLayout","onCollapse","BlocksToolbar","width","BlocksContent","label","onClick","Expand"],"mappings":"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"}

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

@@ -0,0 +1,64 @@
+'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 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 BlocksInput = /*#__PURE__*/ React__namespace.forwardRef(({ label, name, required = false, hint, labelAction, ...editorProps }, forwardedRef)=>{
+    const id = React__namespace.useId();
+    const field = strapiAdmin.useField(name);
+    return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Root, {
+        id: id,
+        name: name,
+        hint: hint,
+        error: field.error,
+        required: required,
+        children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
+            direction: "column",
+            alignItems: "stretch",
+            gap: 1,
+            children: [
+                /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Label, {
+                    action: labelAction,
+                    children: label
+                }),
+                /*#__PURE__*/ jsxRuntime.jsx(BlocksEditor.BlocksEditor, {
+                    name: name,
+                    error: field.error,
+                    ref: forwardedRef,
+                    value: field.value,
+                    onChange: field.onChange,
+                    ariaLabelId: id,
+                    ...editorProps
+                }),
+                /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Hint, {}),
+                /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Error, {})
+            ]
+        })
+    });
+});
+const MemoizedBlocksInput = /*#__PURE__*/ React__namespace.memo(BlocksInput);
+
+exports.BlocksInput = MemoizedBlocksInput;
+//# sourceMappingURL=BlocksInput.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"BlocksInput.js","sources":["../../../../../../../admin/src/pages/EditView/components/FormInputs/BlocksInput/BlocksInput.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { useField, type InputProps } from '@strapi/admin/strapi-admin';\nimport { Field, Flex } from '@strapi/design-system';\n\nimport { BlocksEditor } from './BlocksEditor';\n\nimport type { Schema } from '@strapi/types';\n\ninterface BlocksInputProps extends Omit<InputProps, 'type'> {\n  labelAction?: React.ReactNode;\n  type: Schema.Attribute.Blocks['type'];\n}\n\nconst BlocksInput = React.forwardRef<{ focus: () => void }, BlocksInputProps>(\n  ({ label, name, required = false, hint, labelAction, ...editorProps }, forwardedRef) => {\n    const id = React.useId();\n    const field = useField(name);\n\n    return (\n      <Field.Root id={id} name={name} hint={hint} error={field.error} required={required}>\n        <Flex direction=\"column\" alignItems=\"stretch\" gap={1}>\n          <Field.Label action={labelAction}>{label}</Field.Label>\n          <BlocksEditor\n            name={name}\n            error={field.error}\n            ref={forwardedRef}\n            value={field.value}\n            onChange={field.onChange}\n            ariaLabelId={id}\n            {...editorProps}\n          />\n          <Field.Hint />\n          <Field.Error />\n        </Flex>\n      </Field.Root>\n    );\n  }\n);\n\nconst MemoizedBlocksInput = React.memo(BlocksInput);\n\nexport { MemoizedBlocksInput as BlocksInput };\n"],"names":["BlocksInput","React","forwardRef","label","name","required","hint","labelAction","editorProps","forwardedRef","id","useId","field","useField","_jsx","Field","Root","error","_jsxs","Flex","direction","alignItems","gap","Label","action","BlocksEditor","ref","value","onChange","ariaLabelId","Hint","Error","MemoizedBlocksInput","memo"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAcA,MAAMA,4BAAcC,gBAAMC,CAAAA,UAAU,CAClC,CAAC,EAAEC,KAAK,EAAEC,IAAI,EAAEC,QAAW,GAAA,KAAK,EAAEC,IAAI,EAAEC,WAAW,EAAE,GAAGC,aAAa,EAAEC,YAAAA,GAAAA;IACrE,MAAMC,EAAAA,GAAKT,iBAAMU,KAAK,EAAA;AACtB,IAAA,MAAMC,QAAQC,oBAAST,CAAAA,IAAAA,CAAAA;IAEvB,qBACEU,cAAA,CAACC,mBAAMC,IAAI,EAAA;QAACN,EAAIA,EAAAA,EAAAA;QAAIN,IAAMA,EAAAA,IAAAA;QAAME,IAAMA,EAAAA,IAAAA;AAAMW,QAAAA,KAAAA,EAAOL,MAAMK,KAAK;QAAEZ,QAAUA,EAAAA,QAAAA;AACxE,QAAA,QAAA,gBAAAa,eAACC,CAAAA,iBAAAA,EAAAA;YAAKC,SAAU,EAAA,QAAA;YAASC,UAAW,EAAA,SAAA;YAAUC,GAAK,EAAA,CAAA;;AACjD,8BAAAR,cAAA,CAACC,mBAAMQ,KAAK,EAAA;oBAACC,MAAQjB,EAAAA,WAAAA;AAAcJ,oBAAAA,QAAAA,EAAAA;;8BACnCW,cAACW,CAAAA,yBAAAA,EAAAA;oBACCrB,IAAMA,EAAAA,IAAAA;AACNa,oBAAAA,KAAAA,EAAOL,MAAMK,KAAK;oBAClBS,GAAKjB,EAAAA,YAAAA;AACLkB,oBAAAA,KAAAA,EAAOf,MAAMe,KAAK;AAClBC,oBAAAA,QAAAA,EAAUhB,MAAMgB,QAAQ;oBACxBC,WAAanB,EAAAA,EAAAA;AACZ,oBAAA,GAAGF;;AAEN,8BAAAM,cAAA,CAACC,mBAAMe,IAAI,EAAA,EAAA,CAAA;AACX,8BAAAhB,cAAA,CAACC,mBAAMgB,KAAK,EAAA,EAAA;;;;AAIpB,CAAA,CAAA;AAGIC,MAAAA,mBAAAA,iBAAsB/B,gBAAMgC,CAAAA,IAAI,CAACjC,WAAAA;;;;"}

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

@@ -0,0 +1,43 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import * as React from 'react';
+import { useField } from '@strapi/admin/strapi-admin';
+import { Field, Flex } from '@strapi/design-system';
+import { BlocksEditor } from './BlocksEditor.mjs';
+
+const BlocksInput = /*#__PURE__*/ React.forwardRef(({ label, name, required = false, hint, labelAction, ...editorProps }, forwardedRef)=>{
+    const id = React.useId();
+    const field = useField(name);
+    return /*#__PURE__*/ jsx(Field.Root, {
+        id: id,
+        name: name,
+        hint: hint,
+        error: field.error,
+        required: required,
+        children: /*#__PURE__*/ jsxs(Flex, {
+            direction: "column",
+            alignItems: "stretch",
+            gap: 1,
+            children: [
+                /*#__PURE__*/ jsx(Field.Label, {
+                    action: labelAction,
+                    children: label
+                }),
+                /*#__PURE__*/ jsx(BlocksEditor, {
+                    name: name,
+                    error: field.error,
+                    ref: forwardedRef,
+                    value: field.value,
+                    onChange: field.onChange,
+                    ariaLabelId: id,
+                    ...editorProps
+                }),
+                /*#__PURE__*/ jsx(Field.Hint, {}),
+                /*#__PURE__*/ jsx(Field.Error, {})
+            ]
+        })
+    });
+});
+const MemoizedBlocksInput = /*#__PURE__*/ React.memo(BlocksInput);
+
+export { MemoizedBlocksInput as BlocksInput };
+//# sourceMappingURL=BlocksInput.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"BlocksInput.mjs","sources":["../../../../../../../admin/src/pages/EditView/components/FormInputs/BlocksInput/BlocksInput.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { useField, type InputProps } from '@strapi/admin/strapi-admin';\nimport { Field, Flex } from '@strapi/design-system';\n\nimport { BlocksEditor } from './BlocksEditor';\n\nimport type { Schema } from '@strapi/types';\n\ninterface BlocksInputProps extends Omit<InputProps, 'type'> {\n  labelAction?: React.ReactNode;\n  type: Schema.Attribute.Blocks['type'];\n}\n\nconst BlocksInput = React.forwardRef<{ focus: () => void }, BlocksInputProps>(\n  ({ label, name, required = false, hint, labelAction, ...editorProps }, forwardedRef) => {\n    const id = React.useId();\n    const field = useField(name);\n\n    return (\n      <Field.Root id={id} name={name} hint={hint} error={field.error} required={required}>\n        <Flex direction=\"column\" alignItems=\"stretch\" gap={1}>\n          <Field.Label action={labelAction}>{label}</Field.Label>\n          <BlocksEditor\n            name={name}\n            error={field.error}\n            ref={forwardedRef}\n            value={field.value}\n            onChange={field.onChange}\n            ariaLabelId={id}\n            {...editorProps}\n          />\n          <Field.Hint />\n          <Field.Error />\n        </Flex>\n      </Field.Root>\n    );\n  }\n);\n\nconst MemoizedBlocksInput = React.memo(BlocksInput);\n\nexport { MemoizedBlocksInput as BlocksInput };\n"],"names":["BlocksInput","React","forwardRef","label","name","required","hint","labelAction","editorProps","forwardedRef","id","useId","field","useField","_jsx","Field","Root","error","_jsxs","Flex","direction","alignItems","gap","Label","action","BlocksEditor","ref","value","onChange","ariaLabelId","Hint","Error","MemoizedBlocksInput","memo"],"mappings":";;;;;;AAcA,MAAMA,4BAAcC,KAAMC,CAAAA,UAAU,CAClC,CAAC,EAAEC,KAAK,EAAEC,IAAI,EAAEC,QAAW,GAAA,KAAK,EAAEC,IAAI,EAAEC,WAAW,EAAE,GAAGC,aAAa,EAAEC,YAAAA,GAAAA;IACrE,MAAMC,EAAAA,GAAKT,MAAMU,KAAK,EAAA;AACtB,IAAA,MAAMC,QAAQC,QAAST,CAAAA,IAAAA,CAAAA;IAEvB,qBACEU,GAAA,CAACC,MAAMC,IAAI,EAAA;QAACN,EAAIA,EAAAA,EAAAA;QAAIN,IAAMA,EAAAA,IAAAA;QAAME,IAAMA,EAAAA,IAAAA;AAAMW,QAAAA,KAAAA,EAAOL,MAAMK,KAAK;QAAEZ,QAAUA,EAAAA,QAAAA;AACxE,QAAA,QAAA,gBAAAa,IAACC,CAAAA,IAAAA,EAAAA;YAAKC,SAAU,EAAA,QAAA;YAASC,UAAW,EAAA,SAAA;YAAUC,GAAK,EAAA,CAAA;;AACjD,8BAAAR,GAAA,CAACC,MAAMQ,KAAK,EAAA;oBAACC,MAAQjB,EAAAA,WAAAA;AAAcJ,oBAAAA,QAAAA,EAAAA;;8BACnCW,GAACW,CAAAA,YAAAA,EAAAA;oBACCrB,IAAMA,EAAAA,IAAAA;AACNa,oBAAAA,KAAAA,EAAOL,MAAMK,KAAK;oBAClBS,GAAKjB,EAAAA,YAAAA;AACLkB,oBAAAA,KAAAA,EAAOf,MAAMe,KAAK;AAClBC,oBAAAA,QAAAA,EAAUhB,MAAMgB,QAAQ;oBACxBC,WAAanB,EAAAA,EAAAA;AACZ,oBAAA,GAAGF;;AAEN,8BAAAM,GAAA,CAACC,MAAMe,IAAI,EAAA,EAAA,CAAA;AACX,8BAAAhB,GAAA,CAACC,MAAMgB,KAAK,EAAA,EAAA;;;;AAIpB,CAAA,CAAA;AAGIC,MAAAA,mBAAAA,iBAAsB/B,KAAMgC,CAAAA,IAAI,CAACjC,WAAAA;;;;"}