@payloadcms/richtext-slate 3.0.0-canary.6041f49 → 3.0.0-canary.f1db24e

package/dist/cell/index.js

@@ -1,9 +1,12 @@
 'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
 export const RichTextCell = ({ cellData })=>{
     const flattenedText = cellData?.map((i)=>i?.children?.map((c)=>c.text)).join(' ');
     // Limiting the number of characters shown is done in a CSS rule
-    return /*#__PURE__*/ React.createElement("span", null, flattenedText);
+    return /*#__PURE__*/ _jsx("span", {
+        children: flattenedText
+    });
 };
 
 //# sourceMappingURL=index.js.map

package/dist/cell/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/cell/index.tsx"],"sourcesContent":["'use client'\nimport type { DefaultCellComponentProps } from 'payload/types'\n\nimport React from 'react'\n\nexport const RichTextCell: React.FC<DefaultCellComponentProps<any[]>> = ({ cellData }) => {\n  const flattenedText = cellData?.map((i) => i?.children?.map((c) => c.text)).join(' ')\n\n  // Limiting the number of characters shown is done in a CSS rule\n  return <span>{flattenedText}</span>\n}\n"],"names":["React","RichTextCell","cellData","flattenedText","map","i","children","c","text","join","span"],"rangeMappings":";;;;;;","mappings":"AAAA;AAGA,OAAOA,WAAW,QAAO;AAEzB,OAAO,MAAMC,eAA2D,CAAC,EAAEC,QAAQ,EAAE;IACnF,MAAMC,gBAAgBD,UAAUE,IAAI,CAACC,IAAMA,GAAGC,UAAUF,IAAI,CAACG,IAAMA,EAAEC,IAAI,GAAGC,KAAK;IAEjF,gEAAgE;IAChE,qBAAO,oBAACC,cAAMP;AAChB,EAAC"}
+{"version":3,"sources":["../../src/cell/index.tsx"],"sourcesContent":["'use client'\nimport type { DefaultCellComponentProps } from 'payload/types'\n\nimport React from 'react'\n\nexport const RichTextCell: React.FC<DefaultCellComponentProps<any[]>> = ({ cellData }) => {\n  const flattenedText = cellData?.map((i) => i?.children?.map((c) => c.text)).join(' ')\n\n  // Limiting the number of characters shown is done in a CSS rule\n  return <span>{flattenedText}</span>\n}\n"],"names":["React","RichTextCell","cellData","flattenedText","map","i","children","c","text","join","span"],"rangeMappings":";;;;;;;;;","mappings":"AAAA;;AAGA,OAAOA,WAAW,QAAO;AAEzB,OAAO,MAAMC,eAA2D,CAAC,EAAEC,QAAQ,EAAE;IACnF,MAAMC,gBAAgBD,UAAUE,IAAI,CAACC,IAAMA,GAAGC,UAAUF,IAAI,CAACG,IAAMA,EAAEC,IAAI,GAAGC,KAAK;IAEjF,gEAAgE;IAChE,qBAAO,KAACC;kBAAMP;;AAChB,EAAC"}

package/dist/field/RichText.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RichText.d.ts","sourceRoot":"","sources":["../../src/field/RichText.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAA;AAEjE,OAAO,KAAK,EAAE,UAAU,EAAiB,MAAM,OAAO,CAAA;AACtD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,eAAe,CAAA;AAClD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAA;AAY9C,OAAO,KAAkD,MAAM,OAAO,CAAA;AAKtE,OAAO,KAAK,EAAE,WAAW,EAAE,cAAc,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AACxE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,YAAY,CAAA;AAMjD,OAAO,cAAc,CAAA;AAWrB,OAAO,QAAQ,OAAO,CAAC;IACrB,UAAU,WAAW;QACnB,MAAM,EAAE,UAAU,GAAG,WAAW,GAAG,aAAa,CAAA;QAChD,OAAO,EAAE,WAAW,CAAA;QACpB,IAAI,EAAE,QAAQ,CAAA;KACf;CACF;AAiaD,eAAO,MAAM,QAAQ;cA7ZP,eAAe,CAAC,UAAU,CAAC;YAC7B,eAAe,CAAC,QAAQ,CAAC;UAC3B,MAAM;kBACE,MAAM;aACX,cAAc,EAAE;0BACH,IAAI,MAAM,EAAE,MAAM,SAAS,CAAC;YAC1C,MAAM;EAuZkC,CAAA"}
+{"version":3,"file":"RichText.d.ts","sourceRoot":"","sources":["../../src/field/RichText.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAA;AAEjE,OAAO,KAAK,EAAE,UAAU,EAAiB,MAAM,OAAO,CAAA;AACtD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,eAAe,CAAA;AAClD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAA;AAY9C,OAAO,KAAkD,MAAM,OAAO,CAAA;AAKtE,OAAO,KAAK,EAAE,WAAW,EAAE,cAAc,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AACxE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,YAAY,CAAA;AAMjD,OAAO,cAAc,CAAA;AAWrB,OAAO,QAAQ,OAAO,CAAC;IACrB,UAAU,WAAW;QACnB,MAAM,EAAE,UAAU,GAAG,WAAW,GAAG,aAAa,CAAA;QAChD,OAAO,EAAE,WAAW,CAAA;QACpB,IAAI,EAAE,QAAQ,CAAA;KACf;CACF;AAsaD,eAAO,MAAM,QAAQ;cAlaP,eAAe,CAAC,UAAU,CAAC;YAC7B,eAAe,CAAC,QAAQ,CAAC;UAC3B,MAAM;kBACE,MAAM;aACX,cAAc,EAAE;0BACH,IAAI,MAAM,EAAE,MAAM,SAAS,CAAC;YAC1C,MAAM;EA4ZkC,CAAA"}

package/dist/field/RichText.js

@@ -1,4 +1,5 @@
 'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { getTranslation } from '@payloadcms/translations';
 import { FieldDescription } from '@payloadcms/ui/forms/FieldDescription';
 import { FieldError } from '@payloadcms/ui/forms/FieldError';
@@ -8,7 +9,7 @@ import { useField } from '@payloadcms/ui/forms/useField';
 import { withCondition } from '@payloadcms/ui/forms/withCondition';
 import { useEditDepth } from '@payloadcms/ui/providers/EditDepth';
 import { useTranslation } from '@payloadcms/ui/providers/Translation';
-import isHotkey from 'is-hotkey';
+import { isHotkey } from 'is-hotkey';
 import React, { useCallback, useEffect, useMemo, useRef } from 'react';
 import { Node, Element as SlateElement, Text, Transforms, createEditor } from 'slate';
 import { withHistory } from 'slate-history';
@@ -27,7 +28,7 @@ import { LeafButtonProvider } from './providers/LeafButtonProvider.js';
 import { LeafProvider } from './providers/LeafProvider.js';
 const baseClass = 'rich-text';
 const RichTextField = (props)=>{
-    const { name, CustomDescription, CustomError, CustomLabel, className, descriptionProps, elements, errorProps, label, labelProps, leaves, path: pathFromProps, placeholder, plugins, readOnly, required, style, validate = richTextValidate, width } = props;
+    const { name, CustomDescription, CustomError, CustomLabel, className, descriptionProps, elements, errorProps, label, labelProps, leaves, path: pathFromProps, placeholder, plugins, readOnly: readOnlyFromProps, required, style, validate = richTextValidate, width } = props;
     const { i18n } = useTranslation();
     const editorRef = useRef(null);
     const toolbarRef = useRef(null);
@@ -48,11 +49,12 @@ const RichTextField = (props)=>{
         required,
         i18n
     ]);
-    const { path: pathFromContext } = useFieldProps();
-    const { initialValue, path, schemaPath, setValue, showError, value } = useField({
+    const { path: pathFromContext, readOnly: readOnlyFromContext } = useFieldProps();
+    const { formInitializing, initialValue, path, schemaPath, setValue, showError, value } = useField({
         path: pathFromContext || pathFromProps || name,
         validate: memoizedValidate
     });
+    const disabled = readOnlyFromProps || readOnlyFromContext || formInitializing;
     const editor = useMemo(()=>{
         let CreatedEditor = withEnterBreakOut(withHistory(withReact(createEditor())));
         CreatedEditor = withHTML(CreatedEditor);
@@ -151,18 +153,22 @@ const RichTextField = (props)=>{
             }
         }
         if (Element) {
-            const el = /*#__PURE__*/ React.createElement(ElementProvider, {
+            const el = /*#__PURE__*/ _jsx(ElementProvider, {
                 attributes: attr,
                 childNodes: children,
                 editorRef: editorRef,
                 element: element,
                 fieldProps: props,
                 path: path,
-                schemaPath: schemaPath
-            }, Element);
+                schemaPath: schemaPath,
+                children: Element
+            });
             return el;
         }
-        return /*#__PURE__*/ React.createElement("div", attr, children);
+        return /*#__PURE__*/ _jsx("div", {
+            ...attr,
+            children: children
+        });
     }, [
         elements,
         path,
@@ -175,21 +181,27 @@ const RichTextField = (props)=>{
             return matchedLeaves.reduce((result, [, leafConfig], i)=>{
                 if (leafConfig?.Leaf) {
                     const Leaf = leafConfig.Leaf;
-                    return /*#__PURE__*/ React.createElement(LeafProvider, {
+                    return /*#__PURE__*/ _jsx(LeafProvider, {
                         attributes: attributes,
                         editorRef: editorRef,
                         fieldProps: props,
-                        key: i,
                         leaf: leaf,
                         path: path,
                         result: result,
-                        schemaPath: schemaPath
-                    }, Leaf);
+                        schemaPath: schemaPath,
+                        children: Leaf
+                    }, i);
                 }
                 return result;
-            }, /*#__PURE__*/ React.createElement("span", attributes, children));
+            }, /*#__PURE__*/ _jsx("span", {
+                ...attributes,
+                children: children
+            }));
         }
-        return /*#__PURE__*/ React.createElement("span", attributes, children);
+        return /*#__PURE__*/ _jsx("span", {
+            ...attributes,
+            children: children
+        });
     }, [
         path,
         props,
@@ -208,13 +220,13 @@ const RichTextField = (props)=>{
             return false;
         });
         if (ops && Array.isArray(ops) && ops.length > 0) {
-            if (!readOnly && val !== defaultRichTextValue && val !== value) {
+            if (!disabled && val !== defaultRichTextValue && val !== value) {
                 setValue(val);
             }
         }
     }, [
         editor?.operations,
-        readOnly,
+        disabled,
         setValue,
         value
     ]);
@@ -229,16 +241,16 @@ const RichTextField = (props)=>{
                 if (isButton) child.setAttribute('disabled', isDisabling ? 'disabled' : null);
             });
         }
-        if (readOnly) {
+        if (disabled) {
             setClickableState('disabled');
         }
         return ()=>{
-            if (readOnly) {
+            if (disabled) {
                 setClickableState('enabled');
             }
         };
     }, [
-        readOnly
+        disabled
     ]);
     // useEffect(() => {
     //   // If there is a change to the initial value, we need to reset Slate history
@@ -254,7 +266,7 @@ const RichTextField = (props)=>{
         'field-type',
         className,
         showError && 'error',
-        readOnly && `${baseClass}--read-only`
+        disabled && `${baseClass}--read-only`
     ].filter(Boolean).join(' ');
     let valueToRender = value;
     if (typeof valueToRender === 'string') {
@@ -266,130 +278,152 @@ const RichTextField = (props)=>{
         }
     }
     if (!valueToRender) valueToRender = defaultRichTextValue;
-    return /*#__PURE__*/ React.createElement("div", {
+    return /*#__PURE__*/ _jsxs("div", {
         className: classes,
         style: {
             ...style,
             width
-        }
-    }, /*#__PURE__*/ React.createElement("div", {
-        className: `${baseClass}__wrap`
-    }, /*#__PURE__*/ React.createElement(FieldError, {
-        CustomError: CustomError,
-        path: path,
-        ...errorProps || {}
-    }), /*#__PURE__*/ React.createElement(FieldLabel, {
-        CustomLabel: CustomLabel,
-        label: label,
-        required: required,
-        ...labelProps || {}
-    }), /*#__PURE__*/ React.createElement(Slate, {
-        editor: editor,
-        key: JSON.stringify({
-            initialValue,
-            path
-        }),
-        onChange: handleChange,
-        value: valueToRender
-    }, /*#__PURE__*/ React.createElement("div", {
-        className: `${baseClass}__wrapper`
-    }, Object.keys(elements)?.length + Object.keys(leaves)?.length > 0 && /*#__PURE__*/ React.createElement("div", {
-        className: [
-            `${baseClass}__toolbar`,
-            drawerIsOpen && `${baseClass}__drawerIsOpen`
-        ].filter(Boolean).join(' '),
-        ref: toolbarRef
-    }, /*#__PURE__*/ React.createElement("div", {
-        className: `${baseClass}__toolbar-wrap`
-    }, Object.values(elements).map((element)=>{
-        const Button = element?.Button;
-        if (Button) {
-            return /*#__PURE__*/ React.createElement(ElementButtonProvider, {
-                fieldProps: props,
-                key: element.name,
-                path: path,
-                schemaPath: schemaPath
-            }, Button);
-        }
-        return null;
-    }), Object.values(leaves).map((leaf)=>{
-        const Button = leaf?.Button;
-        if (Button) {
-            return /*#__PURE__*/ React.createElement(LeafButtonProvider, {
-                fieldProps: props,
-                key: leaf.name,
-                path: path,
-                schemaPath: schemaPath
-            }, Button);
-        }
-        return null;
-    }))), /*#__PURE__*/ React.createElement("div", {
-        className: `${baseClass}__editor`,
-        ref: editorRef
-    }, /*#__PURE__*/ React.createElement(Editable, {
-        className: `${baseClass}__input`,
-        id: `field-${path.replace(/\./g, '__')}`,
-        onKeyDown: (event)=>{
-            if (event.key === 'Enter') {
-                if (event.shiftKey) {
-                    event.preventDefault();
-                    editor.insertText('\n');
-                } else {
-                    const selectedElement = Node.descendant(editor, editor.selection.anchor.path.slice(0, -1));
-                    if (SlateElement.isElement(selectedElement)) {
-                        // Allow hard enter to "break out" of certain elements
-                        if (editor.shouldBreakOutOnEnter(selectedElement)) {
-                            event.preventDefault();
-                            const selectedLeaf = Node.descendant(editor, editor.selection.anchor.path);
-                            if (Text.isText(selectedLeaf) && String(selectedLeaf.text).length === editor.selection.anchor.offset) {
-                                Transforms.insertNodes(editor, {
-                                    children: [
-                                        {
-                                            text: ''
-                                        }
-                                    ]
-                                });
-                            } else {
-                                Transforms.splitNodes(editor);
-                                Transforms.setNodes(editor, {});
-                            }
-                        }
-                    }
-                }
-            }
-            if (event.key === 'Backspace') {
-                const selectedElement = Node.descendant(editor, editor.selection.anchor.path.slice(0, -1));
-                if (SlateElement.isElement(selectedElement) && selectedElement.type === 'li') {
-                    const selectedLeaf = Node.descendant(editor, editor.selection.anchor.path);
-                    if (Text.isText(selectedLeaf) && String(selectedLeaf.text).length === 0) {
-                        event.preventDefault();
-                        Transforms.unwrapNodes(editor, {
-                            match: (n)=>SlateElement.isElement(n) && listTypes.includes(n.type),
-                            mode: 'lowest',
-                            split: true
-                        });
-                        Transforms.setNodes(editor, {
-                            type: undefined
-                        });
-                    }
-                } else if (editor.isVoid(selectedElement)) {
-                    Transforms.removeNodes(editor);
-                }
-            }
-            Object.keys(hotkeys).forEach((hotkey)=>{
-                if (isHotkey(hotkey, event)) {
-                    event.preventDefault();
-                    const mark = hotkeys[hotkey];
-                    toggleLeaf(editor, mark);
-                }
-            });
         },
-        placeholder: getTranslation(placeholder, i18n),
-        readOnly: readOnly,
-        renderElement: renderElement,
-        renderLeaf: renderLeaf,
-        spellCheck: true
-    })))), CustomDescription !== undefined ? CustomDescription : /*#__PURE__*/ React.createElement(FieldDescription, descriptionProps || {})));
+        children: [
+            /*#__PURE__*/ _jsx(FieldLabel, {
+                CustomLabel: CustomLabel,
+                label: label,
+                required: required,
+                ...labelProps || {}
+            }),
+            /*#__PURE__*/ _jsxs("div", {
+                className: `${baseClass}__wrap`,
+                children: [
+                    /*#__PURE__*/ _jsx(FieldError, {
+                        CustomError: CustomError,
+                        path: path,
+                        ...errorProps || {}
+                    }),
+                    /*#__PURE__*/ _jsx(Slate, {
+                        editor: editor,
+                        onChange: handleChange,
+                        value: valueToRender,
+                        children: /*#__PURE__*/ _jsxs("div", {
+                            className: `${baseClass}__wrapper`,
+                            children: [
+                                Object.keys(elements)?.length + Object.keys(leaves)?.length > 0 && /*#__PURE__*/ _jsx("div", {
+                                    className: [
+                                        `${baseClass}__toolbar`,
+                                        drawerIsOpen && `${baseClass}__drawerIsOpen`
+                                    ].filter(Boolean).join(' '),
+                                    ref: toolbarRef,
+                                    children: /*#__PURE__*/ _jsxs("div", {
+                                        className: `${baseClass}__toolbar-wrap`,
+                                        children: [
+                                            Object.values(elements).map((element)=>{
+                                                const Button = element?.Button;
+                                                if (Button) {
+                                                    return /*#__PURE__*/ _jsx(ElementButtonProvider, {
+                                                        disabled: disabled,
+                                                        fieldProps: props,
+                                                        path: path,
+                                                        schemaPath: schemaPath,
+                                                        children: Button
+                                                    }, element.name);
+                                                }
+                                                return null;
+                                            }),
+                                            Object.values(leaves).map((leaf)=>{
+                                                const Button = leaf?.Button;
+                                                if (Button) {
+                                                    return /*#__PURE__*/ _jsx(LeafButtonProvider, {
+                                                        fieldProps: props,
+                                                        path: path,
+                                                        schemaPath: schemaPath,
+                                                        children: Button
+                                                    }, leaf.name);
+                                                }
+                                                return null;
+                                            })
+                                        ]
+                                    })
+                                }),
+                                /*#__PURE__*/ _jsx("div", {
+                                    className: `${baseClass}__editor`,
+                                    ref: editorRef,
+                                    children: /*#__PURE__*/ _jsx(Editable, {
+                                        className: `${baseClass}__input`,
+                                        id: `field-${path.replace(/\./g, '__')}`,
+                                        onKeyDown: (event)=>{
+                                            if (event.key === 'Enter') {
+                                                if (event.shiftKey) {
+                                                    event.preventDefault();
+                                                    editor.insertText('\n');
+                                                } else {
+                                                    const selectedElement = Node.descendant(editor, editor.selection.anchor.path.slice(0, -1));
+                                                    if (SlateElement.isElement(selectedElement)) {
+                                                        // Allow hard enter to "break out" of certain elements
+                                                        if (editor.shouldBreakOutOnEnter(selectedElement)) {
+                                                            event.preventDefault();
+                                                            const selectedLeaf = Node.descendant(editor, editor.selection.anchor.path);
+                                                            if (Text.isText(selectedLeaf) && String(selectedLeaf.text).length === editor.selection.anchor.offset) {
+                                                                Transforms.insertNodes(editor, {
+                                                                    children: [
+                                                                        {
+                                                                            text: ''
+                                                                        }
+                                                                    ]
+                                                                });
+                                                            } else {
+                                                                Transforms.splitNodes(editor);
+                                                                Transforms.setNodes(editor, {});
+                                                            }
+                                                        }
+                                                    }
+                                                }
+                                            }
+                                            if (event.key === 'Backspace') {
+                                                const selectedElement = Node.descendant(editor, editor.selection.anchor.path.slice(0, -1));
+                                                if (SlateElement.isElement(selectedElement) && selectedElement.type === 'li') {
+                                                    const selectedLeaf = Node.descendant(editor, editor.selection.anchor.path);
+                                                    if (Text.isText(selectedLeaf) && String(selectedLeaf.text).length === 0) {
+                                                        event.preventDefault();
+                                                        Transforms.unwrapNodes(editor, {
+                                                            match: (n)=>SlateElement.isElement(n) && listTypes.includes(n.type),
+                                                            mode: 'lowest',
+                                                            split: true
+                                                        });
+                                                        Transforms.setNodes(editor, {
+                                                            type: undefined
+                                                        });
+                                                    }
+                                                } else if (editor.isVoid(selectedElement)) {
+                                                    Transforms.removeNodes(editor);
+                                                }
+                                            }
+                                            Object.keys(hotkeys).forEach((hotkey)=>{
+                                                if (isHotkey(hotkey, event)) {
+                                                    event.preventDefault();
+                                                    const mark = hotkeys[hotkey];
+                                                    toggleLeaf(editor, mark);
+                                                }
+                                            });
+                                        },
+                                        placeholder: getTranslation(placeholder, i18n),
+                                        readOnly: disabled,
+                                        renderElement: renderElement,
+                                        renderLeaf: renderLeaf,
+                                        spellCheck: true
+                                    })
+                                })
+                            ]
+                        })
+                    }, JSON.stringify({
+                        initialValue,
+                        path
+                    })),
+                    CustomDescription !== undefined ? CustomDescription : /*#__PURE__*/ _jsx(FieldDescription, {
+                        ...descriptionProps || {}
+                    })
+                ]
+            })
+        ]
+    });
 };
 export const RichText = withCondition(RichTextField);
 

package/dist/field/RichText.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/field/RichText.tsx"],"sourcesContent":["'use client'\n\nimport type { FormFieldBase } from '@payloadcms/ui/fields/shared'\nimport type { ClientValidate } from 'payload/types'\nimport type { BaseEditor, BaseOperation } from 'slate'\nimport type { HistoryEditor } from 'slate-history'\nimport type { ReactEditor } from 'slate-react'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { FieldDescription } from '@payloadcms/ui/forms/FieldDescription'\nimport { FieldError } from '@payloadcms/ui/forms/FieldError'\nimport { FieldLabel } from '@payloadcms/ui/forms/FieldLabel'\nimport { useFieldProps } from '@payloadcms/ui/forms/FieldPropsProvider'\nimport { useField } from '@payloadcms/ui/forms/useField'\nimport { withCondition } from '@payloadcms/ui/forms/withCondition'\nimport { useEditDepth } from '@payloadcms/ui/providers/EditDepth'\nimport { useTranslation } from '@payloadcms/ui/providers/Translation'\nimport isHotkey from 'is-hotkey'\nimport React, { useCallback, useEffect, useMemo, useRef } from 'react'\nimport { Node, Element as SlateElement, Text, Transforms, createEditor } from 'slate'\nimport { withHistory } from 'slate-history'\nimport { Editable, Slate, withReact } from 'slate-react'\n\nimport type { ElementNode, RichTextPlugin, TextNode } from '../types.js'\nimport type { EnabledFeatures } from './types.js'\n\nimport { defaultRichTextValue } from '../data/defaultValue.js'\nimport { richTextValidate } from '../data/validation.js'\nimport { listTypes } from './elements/listTypes.js'\nimport { hotkeys } from './hotkeys.js'\nimport './index.scss'\nimport { toggleLeaf } from './leaves/toggle.js'\nimport { withEnterBreakOut } from './plugins/withEnterBreakOut.js'\nimport { withHTML } from './plugins/withHTML.js'\nimport { ElementButtonProvider } from './providers/ElementButtonProvider.js'\nimport { ElementProvider } from './providers/ElementProvider.js'\nimport { LeafButtonProvider } from './providers/LeafButtonProvider.js'\nimport { LeafProvider } from './providers/LeafProvider.js'\n\nconst baseClass = 'rich-text'\n\ndeclare module 'slate' {\n  interface CustomTypes {\n    Editor: BaseEditor & ReactEditor & HistoryEditor\n    Element: ElementNode\n    Text: TextNode\n  }\n}\n\nconst RichTextField: React.FC<\n  FormFieldBase & {\n    elements: EnabledFeatures['elements']\n    leaves: EnabledFeatures['leaves']\n    name: string\n    placeholder?: string\n    plugins: RichTextPlugin[]\n    richTextComponentMap: Map<string, React.ReactNode>\n    width?: string\n  }\n> = (props) => {\n  const {\n    name,\n    CustomDescription,\n    CustomError,\n    CustomLabel,\n    className,\n    descriptionProps,\n    elements,\n    errorProps,\n    label,\n    labelProps,\n    leaves,\n    path: pathFromProps,\n    placeholder,\n    plugins,\n    readOnly,\n    required,\n    style,\n    validate = richTextValidate,\n    width,\n  } = props\n\n  const { i18n } = useTranslation()\n  const editorRef = useRef(null)\n  const toolbarRef = useRef(null)\n\n  const drawerDepth = useEditDepth()\n  const drawerIsOpen = drawerDepth > 1\n\n  const memoizedValidate: ClientValidate = useCallback(\n    (value, validationOptions) => {\n      if (typeof validate === 'function') {\n        return validate(value, {\n          ...validationOptions,\n          req: {\n            t: i18n.t,\n          },\n          required,\n        })\n      }\n    },\n    [validate, required, i18n],\n  )\n\n  const { path: pathFromContext } = useFieldProps()\n\n  const { initialValue, path, schemaPath, setValue, showError, value } = useField({\n    path: pathFromContext || pathFromProps || name,\n    validate: memoizedValidate,\n  })\n\n  const editor = useMemo(() => {\n    let CreatedEditor = withEnterBreakOut(withHistory(withReact(createEditor())))\n\n    CreatedEditor = withHTML(CreatedEditor)\n\n    if (plugins.length) {\n      CreatedEditor = plugins.reduce((editorWithPlugins, plugin) => {\n        return plugin(editorWithPlugins)\n      }, CreatedEditor)\n    }\n\n    return CreatedEditor\n  }, [plugins])\n\n  const renderElement = useCallback(\n    ({ attributes, children, element }) => {\n      // return <div {...attributes}>{children}</div>\n\n      const matchedElement = elements[element.type]\n      const Element = matchedElement?.Element\n\n      let attr = { ...attributes }\n\n      // this converts text alignment to margin when dealing with void elements\n      if (element.textAlign) {\n        if (element.type === 'relationship' || element.type === 'upload') {\n          switch (element.textAlign) {\n            case 'left':\n              attr = { ...attr, style: { marginRight: 'auto' } }\n              break\n            case 'right':\n              attr = { ...attr, style: { marginLeft: 'auto' } }\n              break\n            case 'center':\n              attr = { ...attr, style: { marginLeft: 'auto', marginRight: 'auto' } }\n              break\n            default:\n              attr = { ...attr, style: { textAlign: element.textAlign } }\n              break\n          }\n        } else if (element.type === 'li') {\n          switch (element.textAlign) {\n            case 'right':\n              attr = { ...attr, style: { listStylePosition: 'inside', textAlign: 'right' } }\n              break\n            case 'center':\n              attr = { ...attr, style: { listStylePosition: 'inside', textAlign: 'center' } }\n              break\n            case 'left':\n            default:\n              attr = { ...attr, style: { listStylePosition: 'outside', textAlign: 'left' } }\n              break\n          }\n        } else {\n          attr = { ...attr, style: { textAlign: element.textAlign } }\n        }\n      }\n\n      if (Element) {\n        const el = (\n          <ElementProvider\n            attributes={attr}\n            childNodes={children}\n            editorRef={editorRef}\n            element={element}\n            fieldProps={props}\n            path={path}\n            schemaPath={schemaPath}\n          >\n            {Element}\n          </ElementProvider>\n        )\n\n        return el\n      }\n\n      return <div {...attr}>{children}</div>\n    },\n    [elements, path, props, schemaPath],\n  )\n\n  const renderLeaf = useCallback(\n    ({ attributes, children, leaf }) => {\n      const matchedLeaves = Object.entries(leaves).filter(([leafName]) => leaf[leafName])\n\n      if (matchedLeaves.length > 0) {\n        return matchedLeaves.reduce(\n          (result, [, leafConfig], i) => {\n            if (leafConfig?.Leaf) {\n              const Leaf = leafConfig.Leaf\n\n              return (\n                <LeafProvider\n                  attributes={attributes}\n                  editorRef={editorRef}\n                  fieldProps={props}\n                  key={i}\n                  leaf={leaf}\n                  path={path}\n                  result={result}\n                  schemaPath={schemaPath}\n                >\n                  {Leaf}\n                </LeafProvider>\n              )\n            }\n\n            return result\n          },\n          <span {...attributes}>{children}</span>,\n        )\n      }\n\n      return <span {...attributes}>{children}</span>\n    },\n    [path, props, schemaPath, leaves],\n  )\n\n  // All slate changes fire the onChange event\n  // including selection changes\n  // so we will filter the set_selection operations out\n  // and only fire setValue when onChange is because of value\n  const handleChange = useCallback(\n    (val: unknown) => {\n      const ops = editor?.operations.filter((o: BaseOperation) => {\n        if (o) {\n          return o.type !== 'set_selection'\n        }\n        return false\n      })\n\n      if (ops && Array.isArray(ops) && ops.length > 0) {\n        if (!readOnly && val !== defaultRichTextValue && val !== value) {\n          setValue(val)\n        }\n      }\n    },\n    [editor?.operations, readOnly, setValue, value],\n  )\n\n  useEffect(() => {\n    function setClickableState(clickState: 'disabled' | 'enabled') {\n      const selectors = 'button, a, [role=\"button\"]'\n      const toolbarButtons: (HTMLAnchorElement | HTMLButtonElement)[] =\n        toolbarRef.current?.querySelectorAll(selectors)\n\n      ;(toolbarButtons || []).forEach((child) => {\n        const isButton = child.tagName === 'BUTTON'\n        const isDisabling = clickState === 'disabled'\n        child.setAttribute('tabIndex', isDisabling ? '-1' : '0')\n        if (isButton) child.setAttribute('disabled', isDisabling ? 'disabled' : null)\n      })\n    }\n\n    if (readOnly) {\n      setClickableState('disabled')\n    }\n\n    return () => {\n      if (readOnly) {\n        setClickableState('enabled')\n      }\n    }\n  }, [readOnly])\n\n  // useEffect(() => {\n  //   // If there is a change to the initial value, we need to reset Slate history\n  //   // and clear selection because the old selection may no longer be valid\n  //   // as returned JSON may be modified in hooks and have a different shape\n  //   if (editor.selection) {\n  //     console.log('deselecting');\n  //     ReactEditor.deselect(editor);\n  //   }\n  // }, [path, editor]);\n\n  const classes = [\n    baseClass,\n    'field-type',\n    className,\n    showError && 'error',\n    readOnly && `${baseClass}--read-only`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  let valueToRender = value\n\n  if (typeof valueToRender === 'string') {\n    try {\n      const parsedJSON = JSON.parse(valueToRender)\n      valueToRender = parsedJSON\n    } catch (err) {\n      valueToRender = null\n    }\n  }\n\n  if (!valueToRender) valueToRender = defaultRichTextValue\n\n  return (\n    <div\n      className={classes}\n      style={{\n        ...style,\n        width,\n      }}\n    >\n      <div className={`${baseClass}__wrap`}>\n        <FieldError CustomError={CustomError} path={path} {...(errorProps || {})} />\n        <FieldLabel\n          CustomLabel={CustomLabel}\n          label={label}\n          required={required}\n          {...(labelProps || {})}\n        />\n        <Slate\n          editor={editor}\n          key={JSON.stringify({ initialValue, path })} // makes sure slate is completely re-rendered when initialValue changes, bypassing the slate-internal value memoization. That way, external changes to the form will update the editor\n          onChange={handleChange}\n          value={valueToRender as any[]}\n        >\n          <div className={`${baseClass}__wrapper`}>\n            {Object.keys(elements)?.length + Object.keys(leaves)?.length > 0 && (\n              <div\n                className={[`${baseClass}__toolbar`, drawerIsOpen && `${baseClass}__drawerIsOpen`]\n                  .filter(Boolean)\n                  .join(' ')}\n                ref={toolbarRef}\n              >\n                <div className={`${baseClass}__toolbar-wrap`}>\n                  {Object.values(elements).map((element) => {\n                    const Button = element?.Button\n\n                    if (Button) {\n                      return (\n                        <ElementButtonProvider\n                          fieldProps={props}\n                          key={element.name}\n                          path={path}\n                          schemaPath={schemaPath}\n                        >\n                          {Button}\n                        </ElementButtonProvider>\n                      )\n                    }\n\n                    return null\n                  })}\n                  {Object.values(leaves).map((leaf) => {\n                    const Button = leaf?.Button\n\n                    if (Button) {\n                      return (\n                        <LeafButtonProvider\n                          fieldProps={props}\n                          key={leaf.name}\n                          path={path}\n                          schemaPath={schemaPath}\n                        >\n                          {Button}\n                        </LeafButtonProvider>\n                      )\n                    }\n\n                    return null\n                  })}\n                </div>\n              </div>\n            )}\n            <div className={`${baseClass}__editor`} ref={editorRef}>\n              <Editable\n                className={`${baseClass}__input`}\n                id={`field-${path.replace(/\\./g, '__')}`}\n                onKeyDown={(event) => {\n                  if (event.key === 'Enter') {\n                    if (event.shiftKey) {\n                      event.preventDefault()\n                      editor.insertText('\\n')\n                    } else {\n                      const selectedElement = Node.descendant(\n                        editor,\n                        editor.selection.anchor.path.slice(0, -1),\n                      )\n\n                      if (SlateElement.isElement(selectedElement)) {\n                        // Allow hard enter to \"break out\" of certain elements\n                        if (editor.shouldBreakOutOnEnter(selectedElement)) {\n                          event.preventDefault()\n                          const selectedLeaf = Node.descendant(editor, editor.selection.anchor.path)\n\n                          if (\n                            Text.isText(selectedLeaf) &&\n                            String(selectedLeaf.text).length === editor.selection.anchor.offset\n                          ) {\n                            Transforms.insertNodes(editor, { children: [{ text: '' }] })\n                          } else {\n                            Transforms.splitNodes(editor)\n                            Transforms.setNodes(editor, {})\n                          }\n                        }\n                      }\n                    }\n                  }\n\n                  if (event.key === 'Backspace') {\n                    const selectedElement = Node.descendant(\n                      editor,\n                      editor.selection.anchor.path.slice(0, -1),\n                    )\n\n                    if (SlateElement.isElement(selectedElement) && selectedElement.type === 'li') {\n                      const selectedLeaf = Node.descendant(editor, editor.selection.anchor.path)\n                      if (Text.isText(selectedLeaf) && String(selectedLeaf.text).length === 0) {\n                        event.preventDefault()\n                        Transforms.unwrapNodes(editor, {\n                          match: (n) => SlateElement.isElement(n) && listTypes.includes(n.type),\n                          mode: 'lowest',\n                          split: true,\n                        })\n\n                        Transforms.setNodes(editor, { type: undefined })\n                      }\n                    } else if (editor.isVoid(selectedElement)) {\n                      Transforms.removeNodes(editor)\n                    }\n                  }\n\n                  Object.keys(hotkeys).forEach((hotkey) => {\n                    if (isHotkey(hotkey, event as any)) {\n                      event.preventDefault()\n                      const mark = hotkeys[hotkey]\n                      toggleLeaf(editor, mark)\n                    }\n                  })\n                }}\n                placeholder={getTranslation(placeholder, i18n)}\n                readOnly={readOnly}\n                renderElement={renderElement}\n                renderLeaf={renderLeaf}\n                spellCheck\n              />\n            </div>\n          </div>\n        </Slate>\n        {CustomDescription !== undefined ? (\n          CustomDescription\n        ) : (\n          <FieldDescription {...(descriptionProps || {})} />\n        )}\n      </div>\n    </div>\n  )\n}\n\nexport const RichText = withCondition(RichTextField)\n"],"names":["getTranslation","FieldDescription","FieldError","FieldLabel","useFieldProps","useField","withCondition","useEditDepth","useTranslation","isHotkey","React","useCallback","useEffect","useMemo","useRef","Node","Element","SlateElement","Text","Transforms","createEditor","withHistory","Editable","Slate","withReact","defaultRichTextValue","richTextValidate","listTypes","hotkeys","toggleLeaf","withEnterBreakOut","withHTML","ElementButtonProvider","ElementProvider","LeafButtonProvider","LeafProvider","baseClass","RichTextField","props","name","CustomDescription","CustomError","CustomLabel","className","descriptionProps","elements","errorProps","label","labelProps","leaves","path","pathFromProps","placeholder","plugins","readOnly","required","style","validate","width","i18n","editorRef","toolbarRef","drawerDepth","drawerIsOpen","memoizedValidate","value","validationOptions","req","t","pathFromContext","initialValue","schemaPath","setValue","showError","editor","CreatedEditor","length","reduce","editorWithPlugins","plugin","renderElement","attributes","children","element","matchedElement","type","attr","textAlign","marginRight","marginLeft","listStylePosition","el","childNodes","fieldProps","div","renderLeaf","leaf","matchedLeaves","Object","entries","filter","leafName","result","leafConfig","i","Leaf","key","span","handleChange","val","ops","operations","o","Array","isArray","setClickableState","clickState","selectors","toolbarButtons","current","querySelectorAll","forEach","child","isButton","tagName","isDisabling","setAttribute","classes","Boolean","join","valueToRender","parsedJSON","JSON","parse","err","stringify","onChange","keys","ref","values","map","Button","id","replace","onKeyDown","event","shiftKey","preventDefault","insertText","selectedElement","descendant","selection","anchor","slice","isElement","shouldBreakOutOnEnter","selectedLeaf","isText","String","text","offset","insertNodes","splitNodes","setNodes","unwrapNodes","match","n","includes","mode","split","undefined","isVoid","removeNodes","hotkey","mark","spellCheck","RichText"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["../../src/field/RichText.tsx"],"sourcesContent":["'use client'\n\nimport type { FormFieldBase } from '@payloadcms/ui/fields/shared'\nimport type { ClientValidate } from 'payload/types'\nimport type { BaseEditor, BaseOperation } from 'slate'\nimport type { HistoryEditor } from 'slate-history'\nimport type { ReactEditor } from 'slate-react'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { FieldDescription } from '@payloadcms/ui/forms/FieldDescription'\nimport { FieldError } from '@payloadcms/ui/forms/FieldError'\nimport { FieldLabel } from '@payloadcms/ui/forms/FieldLabel'\nimport { useFieldProps } from '@payloadcms/ui/forms/FieldPropsProvider'\nimport { useField } from '@payloadcms/ui/forms/useField'\nimport { withCondition } from '@payloadcms/ui/forms/withCondition'\nimport { useEditDepth } from '@payloadcms/ui/providers/EditDepth'\nimport { useTranslation } from '@payloadcms/ui/providers/Translation'\nimport { isHotkey } from 'is-hotkey'\nimport React, { useCallback, useEffect, useMemo, useRef } from 'react'\nimport { Node, Element as SlateElement, Text, Transforms, createEditor } from 'slate'\nimport { withHistory } from 'slate-history'\nimport { Editable, Slate, withReact } from 'slate-react'\n\nimport type { ElementNode, RichTextPlugin, TextNode } from '../types.js'\nimport type { EnabledFeatures } from './types.js'\n\nimport { defaultRichTextValue } from '../data/defaultValue.js'\nimport { richTextValidate } from '../data/validation.js'\nimport { listTypes } from './elements/listTypes.js'\nimport { hotkeys } from './hotkeys.js'\nimport './index.scss'\nimport { toggleLeaf } from './leaves/toggle.js'\nimport { withEnterBreakOut } from './plugins/withEnterBreakOut.js'\nimport { withHTML } from './plugins/withHTML.js'\nimport { ElementButtonProvider } from './providers/ElementButtonProvider.js'\nimport { ElementProvider } from './providers/ElementProvider.js'\nimport { LeafButtonProvider } from './providers/LeafButtonProvider.js'\nimport { LeafProvider } from './providers/LeafProvider.js'\n\nconst baseClass = 'rich-text'\n\ndeclare module 'slate' {\n  interface CustomTypes {\n    Editor: BaseEditor & ReactEditor & HistoryEditor\n    Element: ElementNode\n    Text: TextNode\n  }\n}\n\nconst RichTextField: React.FC<\n  FormFieldBase & {\n    elements: EnabledFeatures['elements']\n    leaves: EnabledFeatures['leaves']\n    name: string\n    placeholder?: string\n    plugins: RichTextPlugin[]\n    richTextComponentMap: Map<string, React.ReactNode>\n    width?: string\n  }\n> = (props) => {\n  const {\n    name,\n    CustomDescription,\n    CustomError,\n    CustomLabel,\n    className,\n    descriptionProps,\n    elements,\n    errorProps,\n    label,\n    labelProps,\n    leaves,\n    path: pathFromProps,\n    placeholder,\n    plugins,\n    readOnly: readOnlyFromProps,\n    required,\n    style,\n    validate = richTextValidate,\n    width,\n  } = props\n\n  const { i18n } = useTranslation()\n  const editorRef = useRef(null)\n  const toolbarRef = useRef(null)\n\n  const drawerDepth = useEditDepth()\n  const drawerIsOpen = drawerDepth > 1\n\n  const memoizedValidate: ClientValidate = useCallback(\n    (value, validationOptions) => {\n      if (typeof validate === 'function') {\n        return validate(value, {\n          ...validationOptions,\n          req: {\n            t: i18n.t,\n          },\n          required,\n        })\n      }\n    },\n    [validate, required, i18n],\n  )\n\n  const { path: pathFromContext, readOnly: readOnlyFromContext } = useFieldProps()\n\n  const { formInitializing, initialValue, path, schemaPath, setValue, showError, value } = useField(\n    {\n      path: pathFromContext || pathFromProps || name,\n      validate: memoizedValidate,\n    },\n  )\n\n  const disabled = readOnlyFromProps || readOnlyFromContext || formInitializing\n\n  const editor = useMemo(() => {\n    let CreatedEditor = withEnterBreakOut(withHistory(withReact(createEditor())))\n\n    CreatedEditor = withHTML(CreatedEditor)\n\n    if (plugins.length) {\n      CreatedEditor = plugins.reduce((editorWithPlugins, plugin) => {\n        return plugin(editorWithPlugins)\n      }, CreatedEditor)\n    }\n\n    return CreatedEditor\n  }, [plugins])\n\n  const renderElement = useCallback(\n    ({ attributes, children, element }) => {\n      // return <div {...attributes}>{children}</div>\n\n      const matchedElement = elements[element.type]\n      const Element = matchedElement?.Element\n\n      let attr = { ...attributes }\n\n      // this converts text alignment to margin when dealing with void elements\n      if (element.textAlign) {\n        if (element.type === 'relationship' || element.type === 'upload') {\n          switch (element.textAlign) {\n            case 'left':\n              attr = { ...attr, style: { marginRight: 'auto' } }\n              break\n            case 'right':\n              attr = { ...attr, style: { marginLeft: 'auto' } }\n              break\n            case 'center':\n              attr = { ...attr, style: { marginLeft: 'auto', marginRight: 'auto' } }\n              break\n            default:\n              attr = { ...attr, style: { textAlign: element.textAlign } }\n              break\n          }\n        } else if (element.type === 'li') {\n          switch (element.textAlign) {\n            case 'right':\n              attr = { ...attr, style: { listStylePosition: 'inside', textAlign: 'right' } }\n              break\n            case 'center':\n              attr = { ...attr, style: { listStylePosition: 'inside', textAlign: 'center' } }\n              break\n            case 'left':\n            default:\n              attr = { ...attr, style: { listStylePosition: 'outside', textAlign: 'left' } }\n              break\n          }\n        } else {\n          attr = { ...attr, style: { textAlign: element.textAlign } }\n        }\n      }\n\n      if (Element) {\n        const el = (\n          <ElementProvider\n            attributes={attr}\n            childNodes={children}\n            editorRef={editorRef}\n            element={element}\n            fieldProps={props}\n            path={path}\n            schemaPath={schemaPath}\n          >\n            {Element}\n          </ElementProvider>\n        )\n\n        return el\n      }\n\n      return <div {...attr}>{children}</div>\n    },\n    [elements, path, props, schemaPath],\n  )\n\n  const renderLeaf = useCallback(\n    ({ attributes, children, leaf }) => {\n      const matchedLeaves = Object.entries(leaves).filter(([leafName]) => leaf[leafName])\n\n      if (matchedLeaves.length > 0) {\n        return matchedLeaves.reduce(\n          (result, [, leafConfig], i) => {\n            if (leafConfig?.Leaf) {\n              const Leaf = leafConfig.Leaf\n\n              return (\n                <LeafProvider\n                  attributes={attributes}\n                  editorRef={editorRef}\n                  fieldProps={props}\n                  key={i}\n                  leaf={leaf}\n                  path={path}\n                  result={result}\n                  schemaPath={schemaPath}\n                >\n                  {Leaf}\n                </LeafProvider>\n              )\n            }\n\n            return result\n          },\n          <span {...attributes}>{children}</span>,\n        )\n      }\n\n      return <span {...attributes}>{children}</span>\n    },\n    [path, props, schemaPath, leaves],\n  )\n\n  // All slate changes fire the onChange event\n  // including selection changes\n  // so we will filter the set_selection operations out\n  // and only fire setValue when onChange is because of value\n  const handleChange = useCallback(\n    (val: unknown) => {\n      const ops = editor?.operations.filter((o: BaseOperation) => {\n        if (o) {\n          return o.type !== 'set_selection'\n        }\n        return false\n      })\n\n      if (ops && Array.isArray(ops) && ops.length > 0) {\n        if (!disabled && val !== defaultRichTextValue && val !== value) {\n          setValue(val)\n        }\n      }\n    },\n    [editor?.operations, disabled, setValue, value],\n  )\n\n  useEffect(() => {\n    function setClickableState(clickState: 'disabled' | 'enabled') {\n      const selectors = 'button, a, [role=\"button\"]'\n      const toolbarButtons: (HTMLAnchorElement | HTMLButtonElement)[] =\n        toolbarRef.current?.querySelectorAll(selectors)\n\n      ;(toolbarButtons || []).forEach((child) => {\n        const isButton = child.tagName === 'BUTTON'\n        const isDisabling = clickState === 'disabled'\n        child.setAttribute('tabIndex', isDisabling ? '-1' : '0')\n        if (isButton) child.setAttribute('disabled', isDisabling ? 'disabled' : null)\n      })\n    }\n\n    if (disabled) {\n      setClickableState('disabled')\n    }\n\n    return () => {\n      if (disabled) {\n        setClickableState('enabled')\n      }\n    }\n  }, [disabled])\n\n  // useEffect(() => {\n  //   // If there is a change to the initial value, we need to reset Slate history\n  //   // and clear selection because the old selection may no longer be valid\n  //   // as returned JSON may be modified in hooks and have a different shape\n  //   if (editor.selection) {\n  //     console.log('deselecting');\n  //     ReactEditor.deselect(editor);\n  //   }\n  // }, [path, editor]);\n\n  const classes = [\n    baseClass,\n    'field-type',\n    className,\n    showError && 'error',\n    disabled && `${baseClass}--read-only`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  let valueToRender = value\n\n  if (typeof valueToRender === 'string') {\n    try {\n      const parsedJSON = JSON.parse(valueToRender)\n      valueToRender = parsedJSON\n    } catch (err) {\n      valueToRender = null\n    }\n  }\n\n  if (!valueToRender) valueToRender = defaultRichTextValue\n\n  return (\n    <div\n      className={classes}\n      style={{\n        ...style,\n        width,\n      }}\n    >\n      <FieldLabel\n        CustomLabel={CustomLabel}\n        label={label}\n        required={required}\n        {...(labelProps || {})}\n      />\n      <div className={`${baseClass}__wrap`}>\n        <FieldError CustomError={CustomError} path={path} {...(errorProps || {})} />\n        <Slate\n          editor={editor}\n          key={JSON.stringify({ initialValue, path })} // makes sure slate is completely re-rendered when initialValue changes, bypassing the slate-internal value memoization. That way, external changes to the form will update the editor\n          onChange={handleChange}\n          value={valueToRender as any[]}\n        >\n          <div className={`${baseClass}__wrapper`}>\n            {Object.keys(elements)?.length + Object.keys(leaves)?.length > 0 && (\n              <div\n                className={[`${baseClass}__toolbar`, drawerIsOpen && `${baseClass}__drawerIsOpen`]\n                  .filter(Boolean)\n                  .join(' ')}\n                ref={toolbarRef}\n              >\n                <div className={`${baseClass}__toolbar-wrap`}>\n                  {Object.values(elements).map((element) => {\n                    const Button = element?.Button\n\n                    if (Button) {\n                      return (\n                        <ElementButtonProvider\n                          disabled={disabled}\n                          fieldProps={props}\n                          key={element.name}\n                          path={path}\n                          schemaPath={schemaPath}\n                        >\n                          {Button}\n                        </ElementButtonProvider>\n                      )\n                    }\n\n                    return null\n                  })}\n                  {Object.values(leaves).map((leaf) => {\n                    const Button = leaf?.Button\n\n                    if (Button) {\n                      return (\n                        <LeafButtonProvider\n                          fieldProps={props}\n                          key={leaf.name}\n                          path={path}\n                          schemaPath={schemaPath}\n                        >\n                          {Button}\n                        </LeafButtonProvider>\n                      )\n                    }\n\n                    return null\n                  })}\n                </div>\n              </div>\n            )}\n            <div className={`${baseClass}__editor`} ref={editorRef}>\n              <Editable\n                className={`${baseClass}__input`}\n                id={`field-${path.replace(/\\./g, '__')}`}\n                onKeyDown={(event) => {\n                  if (event.key === 'Enter') {\n                    if (event.shiftKey) {\n                      event.preventDefault()\n                      editor.insertText('\\n')\n                    } else {\n                      const selectedElement = Node.descendant(\n                        editor,\n                        editor.selection.anchor.path.slice(0, -1),\n                      )\n\n                      if (SlateElement.isElement(selectedElement)) {\n                        // Allow hard enter to \"break out\" of certain elements\n                        if (editor.shouldBreakOutOnEnter(selectedElement)) {\n                          event.preventDefault()\n                          const selectedLeaf = Node.descendant(editor, editor.selection.anchor.path)\n\n                          if (\n                            Text.isText(selectedLeaf) &&\n                            String(selectedLeaf.text).length === editor.selection.anchor.offset\n                          ) {\n                            Transforms.insertNodes(editor, { children: [{ text: '' }] })\n                          } else {\n                            Transforms.splitNodes(editor)\n                            Transforms.setNodes(editor, {})\n                          }\n                        }\n                      }\n                    }\n                  }\n\n                  if (event.key === 'Backspace') {\n                    const selectedElement = Node.descendant(\n                      editor,\n                      editor.selection.anchor.path.slice(0, -1),\n                    )\n\n                    if (SlateElement.isElement(selectedElement) && selectedElement.type === 'li') {\n                      const selectedLeaf = Node.descendant(editor, editor.selection.anchor.path)\n                      if (Text.isText(selectedLeaf) && String(selectedLeaf.text).length === 0) {\n                        event.preventDefault()\n                        Transforms.unwrapNodes(editor, {\n                          match: (n) => SlateElement.isElement(n) && listTypes.includes(n.type),\n                          mode: 'lowest',\n                          split: true,\n                        })\n\n                        Transforms.setNodes(editor, { type: undefined })\n                      }\n                    } else if (editor.isVoid(selectedElement)) {\n                      Transforms.removeNodes(editor)\n                    }\n                  }\n\n                  Object.keys(hotkeys).forEach((hotkey) => {\n                    if (isHotkey(hotkey, event as any)) {\n                      event.preventDefault()\n                      const mark = hotkeys[hotkey]\n                      toggleLeaf(editor, mark)\n                    }\n                  })\n                }}\n                placeholder={getTranslation(placeholder, i18n)}\n                readOnly={disabled}\n                renderElement={renderElement}\n                renderLeaf={renderLeaf}\n                spellCheck\n              />\n            </div>\n          </div>\n        </Slate>\n        {CustomDescription !== undefined ? (\n          CustomDescription\n        ) : (\n          <FieldDescription {...(descriptionProps || {})} />\n        )}\n      </div>\n    </div>\n  )\n}\n\nexport const RichText = withCondition(RichTextField)\n"],"names":["getTranslation","FieldDescription","FieldError","FieldLabel","useFieldProps","useField","withCondition","useEditDepth","useTranslation","isHotkey","React","useCallback","useEffect","useMemo","useRef","Node","Element","SlateElement","Text","Transforms","createEditor","withHistory","Editable","Slate","withReact","defaultRichTextValue","richTextValidate","listTypes","hotkeys","toggleLeaf","withEnterBreakOut","withHTML","ElementButtonProvider","ElementProvider","LeafButtonProvider","LeafProvider","baseClass","RichTextField","props","name","CustomDescription","CustomError","CustomLabel","className","descriptionProps","elements","errorProps","label","labelProps","leaves","path","pathFromProps","placeholder","plugins","readOnly","readOnlyFromProps","required","style","validate","width","i18n","editorRef","toolbarRef","drawerDepth","drawerIsOpen","memoizedValidate","value","validationOptions","req","t","pathFromContext","readOnlyFromContext","formInitializing","initialValue","schemaPath","setValue","showError","disabled","editor","CreatedEditor","length","reduce","editorWithPlugins","plugin","renderElement","attributes","children","element","matchedElement","type","attr","textAlign","marginRight","marginLeft","listStylePosition","el","childNodes","fieldProps","div","renderLeaf","leaf","matchedLeaves","Object","entries","filter","leafName","result","leafConfig","i","Leaf","span","handleChange","val","ops","operations","o","Array","isArray","setClickableState","clickState","selectors","toolbarButtons","current","querySelectorAll","forEach","child","isButton","tagName","isDisabling","setAttribute","classes","Boolean","join","valueToRender","parsedJSON","JSON","parse","err","onChange","keys","ref","values","map","Button","id","replace","onKeyDown","event","key","shiftKey","preventDefault","insertText","selectedElement","descendant","selection","anchor","slice","isElement","shouldBreakOutOnEnter","selectedLeaf","isText","String","text","offset","insertNodes","splitNodes","setNodes","unwrapNodes","match","n","includes","mode","split","undefined","isVoid","removeNodes","hotkey","mark","spellCheck","stringify","RichText"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AAQA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,SAASC,gBAAgB,QAAQ,wCAAuC;AACxE,SAASC,UAAU,QAAQ,kCAAiC;AAC5D,SAASC,UAAU,QAAQ,kCAAiC;AAC5D,SAASC,aAAa,QAAQ,0CAAyC;AACvE,SAASC,QAAQ,QAAQ,gCAA+B;AACxD,SAASC,aAAa,QAAQ,qCAAoC;AAClE,SAASC,YAAY,QAAQ,qCAAoC;AACjE,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,QAAQ,QAAQ,YAAW;AACpC,OAAOC,SAASC,WAAW,EAAEC,SAAS,EAAEC,OAAO,EAAEC,MAAM,QAAQ,QAAO;AACtE,SAASC,IAAI,EAAEC,WAAWC,YAAY,EAAEC,IAAI,EAAEC,UAAU,EAAEC,YAAY,QAAQ,QAAO;AACrF,SAASC,WAAW,QAAQ,gBAAe;AAC3C,SAASC,QAAQ,EAAEC,KAAK,EAAEC,SAAS,QAAQ,cAAa;AAKxD,SAASC,oBAAoB,QAAQ,0BAAyB;AAC9D,SAASC,gBAAgB,QAAQ,wBAAuB;AACxD,SAASC,SAAS,QAAQ,0BAAyB;AACnD,SAASC,OAAO,QAAQ,eAAc;AACtC,OAAO,eAAc;AACrB,SAASC,UAAU,QAAQ,qBAAoB;AAC/C,SAASC,iBAAiB,QAAQ,iCAAgC;AAClE,SAASC,QAAQ,QAAQ,wBAAuB;AAChD,SAASC,qBAAqB,QAAQ,uCAAsC;AAC5E,SAASC,eAAe,QAAQ,iCAAgC;AAChE,SAASC,kBAAkB,QAAQ,oCAAmC;AACtE,SAASC,YAAY,QAAQ,8BAA6B;AAE1D,MAAMC,YAAY;AAUlB,MAAMC,gBAUF,CAACC;IACH,MAAM,EACJC,IAAI,EACJC,iBAAiB,EACjBC,WAAW,EACXC,WAAW,EACXC,SAAS,EACTC,gBAAgB,EAChBC,QAAQ,EACRC,UAAU,EACVC,KAAK,EACLC,UAAU,EACVC,MAAM,EACNC,MAAMC,aAAa,EACnBC,WAAW,EACXC,OAAO,EACPC,UAAUC,iBAAiB,EAC3BC,QAAQ,EACRC,KAAK,EACLC,WAAWhC,gBAAgB,EAC3BiC,KAAK,EACN,GAAGrB;IAEJ,MAAM,EAAEsB,IAAI,EAAE,GAAGpD;IACjB,MAAMqD,YAAY/C,OAAO;IACzB,MAAMgD,aAAahD,OAAO;IAE1B,MAAMiD,cAAcxD;IACpB,MAAMyD,eAAeD,cAAc;IAEnC,MAAME,mBAAmCtD,YACvC,CAACuD,OAAOC;QACN,IAAI,OAAOT,aAAa,YAAY;YAClC,OAAOA,SAASQ,OAAO;gBACrB,GAAGC,iBAAiB;gBACpBC,KAAK;oBACHC,GAAGT,KAAKS,CAAC;gBACX;gBACAb;YACF;QACF;IACF,GACA;QAACE;QAAUF;QAAUI;KAAK;IAG5B,MAAM,EAAEV,MAAMoB,eAAe,EAAEhB,UAAUiB,mBAAmB,EAAE,GAAGnE;IAEjE,MAAM,EAAEoE,gBAAgB,EAAEC,YAAY,EAAEvB,IAAI,EAAEwB,UAAU,EAAEC,QAAQ,EAAEC,SAAS,EAAEV,KAAK,EAAE,GAAG7D,SACvF;QACE6C,MAAMoB,mBAAmBnB,iBAAiBZ;QAC1CmB,UAAUO;IACZ;IAGF,MAAMY,WAAWtB,qBAAqBgB,uBAAuBC;IAE7D,MAAMM,SAASjE,QAAQ;QACrB,IAAIkE,gBAAgBjD,kBAAkBT,YAAYG,UAAUJ;QAE5D2D,gBAAgBhD,SAASgD;QAEzB,IAAI1B,QAAQ2B,MAAM,EAAE;YAClBD,gBAAgB1B,QAAQ4B,MAAM,CAAC,CAACC,mBAAmBC;gBACjD,OAAOA,OAAOD;YAChB,GAAGH;QACL;QAEA,OAAOA;IACT,GAAG;QAAC1B;KAAQ;IAEZ,MAAM+B,gBAAgBzE,YACpB,CAAC,EAAE0E,UAAU,EAAEC,QAAQ,EAAEC,OAAO,EAAE;QAChC,+CAA+C;QAE/C,MAAMC,iBAAiB3C,QAAQ,CAAC0C,QAAQE,IAAI,CAAC;QAC7C,MAAMzE,UAAUwE,gBAAgBxE;QAEhC,IAAI0E,OAAO;YAAE,GAAGL,UAAU;QAAC;QAE3B,yEAAyE;QACzE,IAAIE,QAAQI,SAAS,EAAE;YACrB,IAAIJ,QAAQE,IAAI,KAAK,kBAAkBF,QAAQE,IAAI,KAAK,UAAU;gBAChE,OAAQF,QAAQI,SAAS;oBACvB,KAAK;wBACHD,OAAO;4BAAE,GAAGA,IAAI;4BAAEjC,OAAO;gCAAEmC,aAAa;4BAAO;wBAAE;wBACjD;oBACF,KAAK;wBACHF,OAAO;4BAAE,GAAGA,IAAI;4BAAEjC,OAAO;gCAAEoC,YAAY;4BAAO;wBAAE;wBAChD;oBACF,KAAK;wBACHH,OAAO;4BAAE,GAAGA,IAAI;4BAAEjC,OAAO;gCAAEoC,YAAY;gCAAQD,aAAa;4BAAO;wBAAE;wBACrE;oBACF;wBACEF,OAAO;4BAAE,GAAGA,IAAI;4BAAEjC,OAAO;gCAAEkC,WAAWJ,QAAQI,SAAS;4BAAC;wBAAE;wBAC1D;gBACJ;YACF,OAAO,IAAIJ,QAAQE,IAAI,KAAK,MAAM;gBAChC,OAAQF,QAAQI,SAAS;oBACvB,KAAK;wBACHD,OAAO;4BAAE,GAAGA,IAAI;4BAAEjC,OAAO;gCAAEqC,mBAAmB;gCAAUH,WAAW;4BAAQ;wBAAE;wBAC7E;oBACF,KAAK;wBACHD,OAAO;4BAAE,GAAGA,IAAI;4BAAEjC,OAAO;gCAAEqC,mBAAmB;gCAAUH,WAAW;4BAAS;wBAAE;wBAC9E;oBACF,KAAK;oBACL;wBACED,OAAO;4BAAE,GAAGA,IAAI;4BAAEjC,OAAO;gCAAEqC,mBAAmB;gCAAWH,WAAW;4BAAO;wBAAE;wBAC7E;gBACJ;YACF,OAAO;gBACLD,OAAO;oBAAE,GAAGA,IAAI;oBAAEjC,OAAO;wBAAEkC,WAAWJ,QAAQI,SAAS;oBAAC;gBAAE;YAC5D;QACF;QAEA,IAAI3E,SAAS;YACX,MAAM+E,mBACJ,KAAC9D;gBACCoD,YAAYK;gBACZM,YAAYV;gBACZzB,WAAWA;gBACX0B,SAASA;gBACTU,YAAY3D;gBACZY,MAAMA;gBACNwB,YAAYA;0BAEX1D;;YAIL,OAAO+E;QACT;QAEA,qBAAO,KAACG;YAAK,GAAGR,IAAI;sBAAGJ;;IACzB,GACA;QAACzC;QAAUK;QAAMZ;QAAOoC;KAAW;IAGrC,MAAMyB,aAAaxF,YACjB,CAAC,EAAE0E,UAAU,EAAEC,QAAQ,EAAEc,IAAI,EAAE;QAC7B,MAAMC,gBAAgBC,OAAOC,OAAO,CAACtD,QAAQuD,MAAM,CAAC,CAAC,CAACC,SAAS,GAAKL,IAAI,CAACK,SAAS;QAElF,IAAIJ,cAAcrB,MAAM,GAAG,GAAG;YAC5B,OAAOqB,cAAcpB,MAAM,CACzB,CAACyB,QAAQ,GAAGC,WAAW,EAAEC;gBACvB,IAAID,YAAYE,MAAM;oBACpB,MAAMA,OAAOF,WAAWE,IAAI;oBAE5B,qBACE,KAAC1E;wBACCkD,YAAYA;wBACZxB,WAAWA;wBACXoC,YAAY3D;wBAEZ8D,MAAMA;wBACNlD,MAAMA;wBACNwD,QAAQA;wBACRhC,YAAYA;kCAEXmC;uBANID;gBASX;gBAEA,OAAOF;YACT,iBACA,KAACI;gBAAM,GAAGzB,UAAU;0BAAGC;;QAE3B;QAEA,qBAAO,KAACwB;YAAM,GAAGzB,UAAU;sBAAGC;;IAChC,GACA;QAACpC;QAAMZ;QAAOoC;QAAYzB;KAAO;IAGnC,4CAA4C;IAC5C,8BAA8B;IAC9B,qDAAqD;IACrD,2DAA2D;IAC3D,MAAM8D,eAAepG,YACnB,CAACqG;QACC,MAAMC,MAAMnC,QAAQoC,WAAWV,OAAO,CAACW;YACrC,IAAIA,GAAG;gBACL,OAAOA,EAAE1B,IAAI,KAAK;YACpB;YACA,OAAO;QACT;QAEA,IAAIwB,OAAOG,MAAMC,OAAO,CAACJ,QAAQA,IAAIjC,MAAM,GAAG,GAAG;YAC/C,IAAI,CAACH,YAAYmC,QAAQvF,wBAAwBuF,QAAQ9C,OAAO;gBAC9DS,SAASqC;YACX;QACF;IACF,GACA;QAAClC,QAAQoC;QAAYrC;QAAUF;QAAUT;KAAM;IAGjDtD,UAAU;QACR,SAAS0G,kBAAkBC,UAAkC;YAC3D,MAAMC,YAAY;YAClB,MAAMC,iBACJ3D,WAAW4D,OAAO,EAAEC,iBAAiBH;YAErCC,CAAAA,kBAAkB,EAAE,AAAD,EAAGG,OAAO,CAAC,CAACC;gBAC/B,MAAMC,WAAWD,MAAME,OAAO,KAAK;gBACnC,MAAMC,cAAcT,eAAe;gBACnCM,MAAMI,YAAY,CAAC,YAAYD,cAAc,OAAO;gBACpD,IAAIF,UAAUD,MAAMI,YAAY,CAAC,YAAYD,cAAc,aAAa;YAC1E;QACF;QAEA,IAAInD,UAAU;YACZyC,kBAAkB;QACpB;QAEA,OAAO;YACL,IAAIzC,UAAU;gBACZyC,kBAAkB;YACpB;QACF;IACF,GAAG;QAACzC;KAAS;IAEb,oBAAoB;IACpB,iFAAiF;IACjF,4EAA4E;IAC5E,4EAA4E;IAC5E,4BAA4B;IAC5B,kCAAkC;IAClC,oCAAoC;IACpC,MAAM;IACN,sBAAsB;IAEtB,MAAMqD,UAAU;QACd9F;QACA;QACAO;QACAiC,aAAa;QACbC,YAAY,CAAC,EAAEzC,UAAU,WAAW,CAAC;KACtC,CACEoE,MAAM,CAAC2B,SACPC,IAAI,CAAC;IAER,IAAIC,gBAAgBnE;IAEpB,IAAI,OAAOmE,kBAAkB,UAAU;QACrC,IAAI;YACF,MAAMC,aAAaC,KAAKC,KAAK,CAACH;YAC9BA,gBAAgBC;QAClB,EAAE,OAAOG,KAAK;YACZJ,gBAAgB;QAClB;IACF;IAEA,IAAI,CAACA,eAAeA,gBAAgB5G;IAEpC,qBACE,MAACyE;QACCvD,WAAWuF;QACXzE,OAAO;YACL,GAAGA,KAAK;YACRE;QACF;;0BAEA,KAACxD;gBACCuC,aAAaA;gBACbK,OAAOA;gBACPS,UAAUA;gBACT,GAAIR,cAAc,CAAC,CAAC;;0BAEvB,MAACkD;gBAAIvD,WAAW,CAAC,EAAEP,UAAU,MAAM,CAAC;;kCAClC,KAAClC;wBAAWuC,aAAaA;wBAAaS,MAAMA;wBAAO,GAAIJ,cAAc,CAAC,CAAC;;kCACvE,KAACvB;wBACCuD,QAAQA;wBAER4D,UAAU3B;wBACV7C,OAAOmE;kCAEP,cAAA,MAACnC;4BAAIvD,WAAW,CAAC,EAAEP,UAAU,SAAS,CAAC;;gCACpCkE,OAAOqC,IAAI,CAAC9F,WAAWmC,SAASsB,OAAOqC,IAAI,CAAC1F,SAAS+B,SAAS,mBAC7D,KAACkB;oCACCvD,WAAW;wCAAC,CAAC,EAAEP,UAAU,SAAS,CAAC;wCAAE4B,gBAAgB,CAAC,EAAE5B,UAAU,cAAc,CAAC;qCAAC,CAC/EoE,MAAM,CAAC2B,SACPC,IAAI,CAAC;oCACRQ,KAAK9E;8CAEL,cAAA,MAACoC;wCAAIvD,WAAW,CAAC,EAAEP,UAAU,cAAc,CAAC;;4CACzCkE,OAAOuC,MAAM,CAAChG,UAAUiG,GAAG,CAAC,CAACvD;gDAC5B,MAAMwD,SAASxD,SAASwD;gDAExB,IAAIA,QAAQ;oDACV,qBACE,KAAC/G;wDACC6C,UAAUA;wDACVoB,YAAY3D;wDAEZY,MAAMA;wDACNwB,YAAYA;kEAEXqE;uDAJIxD,QAAQhD,IAAI;gDAOvB;gDAEA,OAAO;4CACT;4CACC+D,OAAOuC,MAAM,CAAC5F,QAAQ6F,GAAG,CAAC,CAAC1C;gDAC1B,MAAM2C,SAAS3C,MAAM2C;gDAErB,IAAIA,QAAQ;oDACV,qBACE,KAAC7G;wDACC+D,YAAY3D;wDAEZY,MAAMA;wDACNwB,YAAYA;kEAEXqE;uDAJI3C,KAAK7D,IAAI;gDAOpB;gDAEA,OAAO;4CACT;;;;8CAIN,KAAC2D;oCAAIvD,WAAW,CAAC,EAAEP,UAAU,QAAQ,CAAC;oCAAEwG,KAAK/E;8CAC3C,cAAA,KAACvC;wCACCqB,WAAW,CAAC,EAAEP,UAAU,OAAO,CAAC;wCAChC4G,IAAI,CAAC,MAAM,EAAE9F,KAAK+F,OAAO,CAAC,OAAO,MAAM,CAAC;wCACxCC,WAAW,CAACC;4CACV,IAAIA,MAAMC,GAAG,KAAK,SAAS;gDACzB,IAAID,MAAME,QAAQ,EAAE;oDAClBF,MAAMG,cAAc;oDACpBxE,OAAOyE,UAAU,CAAC;gDACpB,OAAO;oDACL,MAAMC,kBAAkBzI,KAAK0I,UAAU,CACrC3E,QACAA,OAAO4E,SAAS,CAACC,MAAM,CAACzG,IAAI,CAAC0G,KAAK,CAAC,GAAG,CAAC;oDAGzC,IAAI3I,aAAa4I,SAAS,CAACL,kBAAkB;wDAC3C,sDAAsD;wDACtD,IAAI1E,OAAOgF,qBAAqB,CAACN,kBAAkB;4DACjDL,MAAMG,cAAc;4DACpB,MAAMS,eAAehJ,KAAK0I,UAAU,CAAC3E,QAAQA,OAAO4E,SAAS,CAACC,MAAM,CAACzG,IAAI;4DAEzE,IACEhC,KAAK8I,MAAM,CAACD,iBACZE,OAAOF,aAAaG,IAAI,EAAElF,MAAM,KAAKF,OAAO4E,SAAS,CAACC,MAAM,CAACQ,MAAM,EACnE;gEACAhJ,WAAWiJ,WAAW,CAACtF,QAAQ;oEAAEQ,UAAU;wEAAC;4EAAE4E,MAAM;wEAAG;qEAAE;gEAAC;4DAC5D,OAAO;gEACL/I,WAAWkJ,UAAU,CAACvF;gEACtB3D,WAAWmJ,QAAQ,CAACxF,QAAQ,CAAC;4DAC/B;wDACF;oDACF;gDACF;4CACF;4CAEA,IAAIqE,MAAMC,GAAG,KAAK,aAAa;gDAC7B,MAAMI,kBAAkBzI,KAAK0I,UAAU,CACrC3E,QACAA,OAAO4E,SAAS,CAACC,MAAM,CAACzG,IAAI,CAAC0G,KAAK,CAAC,GAAG,CAAC;gDAGzC,IAAI3I,aAAa4I,SAAS,CAACL,oBAAoBA,gBAAgB/D,IAAI,KAAK,MAAM;oDAC5E,MAAMsE,eAAehJ,KAAK0I,UAAU,CAAC3E,QAAQA,OAAO4E,SAAS,CAACC,MAAM,CAACzG,IAAI;oDACzE,IAAIhC,KAAK8I,MAAM,CAACD,iBAAiBE,OAAOF,aAAaG,IAAI,EAAElF,MAAM,KAAK,GAAG;wDACvEmE,MAAMG,cAAc;wDACpBnI,WAAWoJ,WAAW,CAACzF,QAAQ;4DAC7B0F,OAAO,CAACC,IAAMxJ,aAAa4I,SAAS,CAACY,MAAM9I,UAAU+I,QAAQ,CAACD,EAAEhF,IAAI;4DACpEkF,MAAM;4DACNC,OAAO;wDACT;wDAEAzJ,WAAWmJ,QAAQ,CAACxF,QAAQ;4DAAEW,MAAMoF;wDAAU;oDAChD;gDACF,OAAO,IAAI/F,OAAOgG,MAAM,CAACtB,kBAAkB;oDACzCrI,WAAW4J,WAAW,CAACjG;gDACzB;4CACF;4CAEAwB,OAAOqC,IAAI,CAAC/G,SAASgG,OAAO,CAAC,CAACoD;gDAC5B,IAAIvK,SAASuK,QAAQ7B,QAAe;oDAClCA,MAAMG,cAAc;oDACpB,MAAM2B,OAAOrJ,OAAO,CAACoJ,OAAO;oDAC5BnJ,WAAWiD,QAAQmG;gDACrB;4CACF;wCACF;wCACA7H,aAAapD,eAAeoD,aAAaQ;wCACzCN,UAAUuB;wCACVO,eAAeA;wCACfe,YAAYA;wCACZ+E,UAAU;;;;;uBA3HX3C,KAAK4C,SAAS,CAAC;wBAAE1G;wBAAcvB;oBAAK;oBAgI1CV,sBAAsBqI,YACrBrI,kCAEA,KAACvC;wBAAkB,GAAI2C,oBAAoB,CAAC,CAAC;;;;;;AAKvD;AAEA,OAAO,MAAMwI,WAAW9K,cAAc+B,eAAc"}

package/dist/field/elements/Button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/field/elements/Button.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAgC,MAAM,OAAO,CAAA;AAGpD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,YAAY,CAAA;AAE7C,OAAO,iBAAiB,CAAA;AAIxB,eAAO,MAAM,SAAS,sBAAsB,CAAA;AAE5C,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAmC/C,CAAA"}
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/field/elements/Button.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAgC,MAAM,OAAO,CAAA;AAGpD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,YAAY,CAAA;AAE7C,OAAO,iBAAiB,CAAA;AAKxB,eAAO,MAAM,SAAS,sBAAsB,CAAA;AAE5C,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CA+C/C,CAAA"}

package/dist/field/elements/Button.js

@@ -1,14 +1,17 @@
 'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Tooltip } from '@payloadcms/ui/elements/Tooltip';
 import React, { useCallback, useState } from 'react';
 import { useSlate } from 'slate-react';
 import '../buttons.scss';
+import { useElementButton } from '../providers/ElementButtonProvider.js';
 import { isElementActive } from './isActive.js';
 import { toggleElement } from './toggle.js';
 export const baseClass = 'rich-text__button';
 export const ElementButton = (props)=>{
-    const { type = 'type', children, className, el = 'button', format, onClick, tooltip } = props;
+    const { type = 'type', children, className, disabled: disabledFromProps, el = 'button', format, onClick, tooltip } = props;
     const editor = useSlate();
+    const { disabled: disabledFromContext } = useElementButton();
     const [showTooltip, setShowTooltip] = useState(false);
     const defaultOnClick = useCallback((event)=>{
         event.preventDefault();
@@ -20,9 +23,11 @@ export const ElementButton = (props)=>{
         type
     ]);
     const Tag = el;
-    return /*#__PURE__*/ React.createElement(Tag, {
+    const disabled = disabledFromProps || disabledFromContext;
+    return /*#__PURE__*/ _jsxs(Tag, {
         ...el === 'button' && {
-            type: 'button'
+            type: 'button',
+            disabled
         },
         className: [
             baseClass,
@@ -31,10 +36,15 @@ export const ElementButton = (props)=>{
         ].filter(Boolean).join(' '),
         onClick: onClick || defaultOnClick,
         onMouseEnter: ()=>setShowTooltip(true),
-        onMouseLeave: ()=>setShowTooltip(false)
-    }, tooltip && /*#__PURE__*/ React.createElement(Tooltip, {
-        show: showTooltip
-    }, tooltip), children);
+        onMouseLeave: ()=>setShowTooltip(false),
+        children: [
+            tooltip && /*#__PURE__*/ _jsx(Tooltip, {
+                show: showTooltip,
+                children: tooltip
+            }),
+            children
+        ]
+    });
 };
 
 //# sourceMappingURL=Button.js.map