@portabletext/editor 1.49.0 → 1.49.2

package/lib/index.cjs

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: !0 });
-var reactCompilerRuntime = require("react-compiler-runtime"), React = require("react"), useEffectEvent = require("use-effect-event"), editorProvider = require("./_chunks-cjs/editor-provider.cjs"), jsxRuntime = require("react/jsx-runtime"), react = require("@xstate/react"), noop = require("lodash/noop.js"), slate = require("slate"), slateReact = require("slate-react"), util_sliceBlocks = require("./_chunks-cjs/util.slice-blocks.cjs"), selector_isSelectingEntireBlocks = require("./_chunks-cjs/selector.is-selecting-entire-blocks.cjs"), selector_getFocusInlineObject = require("./_chunks-cjs/selector.get-focus-inline-object.cjs"), slateDom = require("slate-dom"), util_isSelectionCollapsed = require("./_chunks-cjs/util.is-selection-collapsed.cjs"), isEqual = require("lodash/isEqual.js"), util_selectionPointToBlockOffset = require("./_chunks-cjs/util.selection-point-to-block-offset.cjs"), uniq = require("lodash/uniq.js"), behaviors_index = require("./behaviors/index.cjs"), xstate = require("xstate");
+var reactCompilerRuntime = require("react-compiler-runtime"), React = require("react"), useEffectEvent = require("use-effect-event"), editorProvider = require("./_chunks-cjs/editor-provider.cjs"), jsxRuntime = require("react/jsx-runtime"), react = require("@xstate/react"), noop = require("lodash/noop.js"), slate = require("slate"), slateReact = require("slate-react"), util_sliceBlocks = require("./_chunks-cjs/util.slice-blocks.cjs"), selector_isSelectingEntireBlocks = require("./_chunks-cjs/selector.is-selecting-entire-blocks.cjs"), selector_getFocusInlineObject = require("./_chunks-cjs/selector.get-focus-inline-object.cjs"), slateDom = require("slate-dom"), util_isSelectionCollapsed = require("./_chunks-cjs/util.is-selection-collapsed.cjs"), isEqual = require("lodash/isEqual.js"), util_selectionPointToBlockOffset = require("./_chunks-cjs/util.selection-point-to-block-offset.cjs"), behaviors_index = require("./behaviors/index.cjs"), uniq = require("lodash/uniq.js"), xstate = require("xstate");
 function _interopDefaultCompat(e) {
   return e && typeof e == "object" && "default" in e ? e : { default: e };
 }
@@ -330,130 +330,6 @@ function getSelectionDomNodes({
     childNodes: childEntries.map(([childNode]) => slateDom.DOMEditor.toDOMNode(slateEditor, childNode))
   };
 }
-const debug$2 = editorProvider.debugWithName("components:Leaf"), EMPTY_MARKS = [], Leaf = (props) => {
-  const {
-    editorActor,
-    attributes,
-    children,
-    leaf,
-    schemaTypes,
-    renderChild,
-    renderDecorator,
-    renderAnnotation
-  } = props, spanRef = React.useRef(null), portableTextEditor = editorProvider.usePortableTextEditor(), blockSelected = slateReact.useSelected(), [focused, setFocused] = React.useState(!1), [selected, setSelected] = React.useState(!1), block = children.props.parent, path = React.useMemo(() => block ? [{
-    _key: block?._key
-  }, "children", {
-    _key: leaf._key
-  }] : [], [block, leaf._key]), decoratorValues = React.useMemo(() => schemaTypes.decorators.map((dec) => dec.value), [schemaTypes.decorators]), marks = React.useMemo(() => uniq__default.default((leaf.marks || EMPTY_MARKS).filter((mark) => decoratorValues.includes(mark))), [decoratorValues, leaf.marks]), annotationMarks = Array.isArray(leaf.marks) ? leaf.marks : EMPTY_MARKS, annotations = React.useMemo(() => annotationMarks.map((mark_0) => !decoratorValues.includes(mark_0) && block?.markDefs?.find((def) => def._key === mark_0)).filter(Boolean), [annotationMarks, block, decoratorValues]), shouldTrackSelectionAndFocus = annotations.length > 0 && blockSelected;
-  React.useEffect(() => {
-    if (!shouldTrackSelectionAndFocus) {
-      setFocused(!1);
-      return;
-    }
-    const sel = editorProvider.PortableTextEditor.getSelection(portableTextEditor);
-    sel && isEqual__default.default(sel.focus.path, path) && editorProvider.PortableTextEditor.isCollapsedSelection(portableTextEditor) && React.startTransition(() => {
-      setFocused(!0);
-    });
-  }, [shouldTrackSelectionAndFocus, path, portableTextEditor]);
-  const setSelectedFromRange = React.useCallback(() => {
-    if (!shouldTrackSelectionAndFocus)
-      return;
-    debug$2("Setting selection and focus from range");
-    const winSelection = window.getSelection();
-    if (!winSelection) {
-      setSelected(!1);
-      return;
-    }
-    if (winSelection && winSelection.rangeCount > 0) {
-      const range = winSelection.getRangeAt(0);
-      spanRef.current && range.intersectsNode(spanRef.current) ? setSelected(!0) : setSelected(!1);
-    } else
-      setSelected(!1);
-  }, [shouldTrackSelectionAndFocus]);
-  React.useEffect(() => {
-    if (!shouldTrackSelectionAndFocus)
-      return;
-    const onBlur = editorActor.on("blurred", () => {
-      setFocused(!1), setSelected(!1);
-    }), onFocus = editorActor.on("focused", () => {
-      const sel_0 = editorProvider.PortableTextEditor.getSelection(portableTextEditor);
-      sel_0 && isEqual__default.default(sel_0.focus.path, path) && editorProvider.PortableTextEditor.isCollapsedSelection(portableTextEditor) && setFocused(!0), setSelectedFromRange();
-    }), onSelection = editorActor.on("selection", (event) => {
-      event.selection && isEqual__default.default(event.selection.focus.path, path) && editorProvider.PortableTextEditor.isCollapsedSelection(portableTextEditor) ? setFocused(!0) : setFocused(!1), setSelectedFromRange();
-    });
-    return () => {
-      onBlur.unsubscribe(), onFocus.unsubscribe(), onSelection.unsubscribe();
-    };
-  }, [editorActor, path, portableTextEditor, setSelectedFromRange, shouldTrackSelectionAndFocus]), React.useEffect(() => setSelectedFromRange(), [setSelectedFromRange]);
-  const content = React.useMemo(() => {
-    let returnedChildren = children;
-    if (slate.Text.isText(leaf) && leaf._type === schemaTypes.span.name && (marks.forEach((mark_1) => {
-      const schemaType = schemaTypes.decorators.find((dec_0) => dec_0.value === mark_1);
-      if (schemaType && renderDecorator) {
-        const _props = Object.defineProperty({
-          children: returnedChildren,
-          editorElementRef: spanRef,
-          focused,
-          path,
-          selected,
-          schemaType,
-          value: mark_1
-        }, "type", {
-          enumerable: !1,
-          get() {
-            return console.warn("Property 'type' is deprecated, use 'schemaType' instead."), schemaType;
-          }
-        });
-        returnedChildren = renderDecorator(_props);
-      }
-    }), block && annotations.length > 0 && annotations.forEach((annotation) => {
-      const schemaType_0 = schemaTypes.annotations.find((t) => t.name === annotation._type);
-      if (schemaType_0)
-        if (renderAnnotation) {
-          const _props_0 = Object.defineProperty({
-            block,
-            children: returnedChildren,
-            editorElementRef: spanRef,
-            focused,
-            path,
-            selected,
-            schemaType: schemaType_0,
-            value: annotation
-          }, "type", {
-            enumerable: !1,
-            get() {
-              return console.warn("Property 'type' is deprecated, use 'schemaType' instead."), schemaType_0;
-            }
-          });
-          returnedChildren = /* @__PURE__ */ jsxRuntime.jsx("span", { ref: spanRef, children: renderAnnotation(_props_0) });
-        } else
-          returnedChildren = /* @__PURE__ */ jsxRuntime.jsx("span", { ref: spanRef, children: returnedChildren });
-    }), block && renderChild)) {
-      const child = block.children.find((_child) => _child._key === leaf._key);
-      if (child) {
-        const _props_1 = Object.defineProperty({
-          annotations,
-          children: /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: returnedChildren }),
-          editorElementRef: spanRef,
-          focused,
-          path,
-          schemaType: schemaTypes.span,
-          selected,
-          value: child
-        }, "type", {
-          enumerable: !1,
-          get() {
-            return console.warn("Property 'type' is deprecated, use 'schemaType' instead."), schemaTypes.span;
-          }
-        });
-        returnedChildren = renderChild(_props_1);
-      }
-    }
-    return returnedChildren;
-  }, [annotations, block, children, focused, leaf, marks, path, renderAnnotation, renderChild, renderDecorator, schemaTypes.annotations, schemaTypes.decorators, schemaTypes.span, selected]);
-  return React.useMemo(() => /* @__PURE__ */ jsxRuntime.jsx("span", { ...attributes, ref: spanRef, "data-child-key": leaf._key, "data-child-name": leaf._type, "data-child-type": "span", children: content }, leaf._key), [leaf, attributes, content]);
-};
-Leaf.displayName = "Leaf";
 function DropIndicator() {
   const $ = reactCompilerRuntime.c(1);
   let t0;
@@ -615,7 +491,7 @@ function RenderBlockObject(props) {
       value: props.blockObject
     }) : /* @__PURE__ */ jsxRuntime.jsx(RenderDefaultBlockObject, { blockObject: props.blockObject }) }),
     dragPositionBlock === "end" ? /* @__PURE__ */ jsxRuntime.jsx(DropIndicator, {}) : null
-  ] }, props.element._key);
+  ] });
 }
 function RenderInlineObject(props) {
   const inlineObjectRef = React.useRef(null), slateEditor = slateReact.useSlateStatic(), selected = slateReact.useSelected(), editorActor = React.useContext(editorProvider.EditorActorContext), legacySchemaType = react.useSelector(editorActor, (s) => s.context.getLegacySchema().inlineObjects.find((inlineObject) => inlineObject.name === props.element._type));
@@ -627,11 +503,11 @@ function RenderInlineObject(props) {
       offset: 0
     }
   });
-  return block || console.error(`Unable to find parent block of inline object ${props.element._key}`), /* @__PURE__ */ jsxRuntime.jsxs("span", { ...props.attributes, children: [
+  return block || console.error(`Unable to find parent block of inline object ${props.element._key}`), /* @__PURE__ */ jsxRuntime.jsxs("span", { ...props.attributes, draggable: !props.readOnly, className: "pt-inline-object", "data-child-key": props.inlineObject._key, "data-child-name": props.inlineObject._type, "data-child-type": "object", children: [
     props.children,
-    /* @__PURE__ */ jsxRuntime.jsx("span", { draggable: !props.readOnly, className: "pt-inline-object", "data-testid": "pt-inline-object", ref: inlineObjectRef, style: {
+    /* @__PURE__ */ jsxRuntime.jsx("span", { ref: inlineObjectRef, style: {
       display: "inline-block"
-    }, "data-child-key": props.inlineObject._key, "data-child-name": props.inlineObject._type, "data-child-type": "object", children: props.renderChild && block && legacySchemaType ? props.renderChild({
+    }, children: props.renderChild && block && legacySchemaType ? props.renderChild({
       annotations: [],
       children: /* @__PURE__ */ jsxRuntime.jsx(RenderDefaultInlineObject, { inlineObject: props.inlineObject }),
       editorElementRef: inlineObjectRef,
@@ -645,7 +521,7 @@ function RenderInlineObject(props) {
       schemaType: legacySchemaType,
       value: props.inlineObject,
       type: legacySchemaType
-    }) : /* @__PURE__ */ jsxRuntime.jsx(RenderDefaultInlineObject, { inlineObject: props.inlineObject }) }, props.element._key)
+    }) : /* @__PURE__ */ jsxRuntime.jsx(RenderDefaultInlineObject, { inlineObject: props.inlineObject }) })
   ] });
 }
 function RenderTextBlock(props) {
@@ -706,10 +582,10 @@ function RenderTextBlock(props) {
       value: props.textBlock
     }) : props.children }),
     dragPositionBlock === "end" ? /* @__PURE__ */ jsxRuntime.jsx(DropIndicator, {}) : null
-  ] }, props.element._key);
+  ] });
 }
 function RenderElement(props) {
-  const $ = reactCompilerRuntime.c(45), editorActor = React.useContext(editorProvider.EditorActorContext), schema = react.useSelector(editorActor, _temp);
+  const $ = reactCompilerRuntime.c(45), editorActor = React.useContext(editorProvider.EditorActorContext), schema = react.useSelector(editorActor, _temp$1);
   if ("__inline" in props.element && props.element.__inline === !0) {
     let t02;
     if ($[0] !== props.element || $[1] !== schema) {
@@ -720,7 +596,8 @@ function RenderElement(props) {
           schema
         },
         options: {
-          refreshKeys: !1
+          refreshKeys: !1,
+          validateFields: !1
         },
         inlineObject: {
           _key: props.element._key,
@@ -747,7 +624,8 @@ function RenderElement(props) {
       schema
     },
     options: {
-      refreshKeys: !1
+      refreshKeys: !1,
+      validateFields: !1
     },
     block: props.element
   }), $[16] = props.element, $[17] = schema, $[18] = t0) : t0 = $[18];
@@ -765,7 +643,8 @@ function RenderElement(props) {
         schema
       },
       options: {
-        refreshKeys: !1
+        refreshKeys: !1,
+        validateFields: !1
       },
       blockObject: {
         _key: props.element._key,
@@ -794,9 +673,145 @@ function _temp3() {
 function _temp2() {
   return "";
 }
+function _temp$1(s) {
+  return s.context.schema;
+}
+function RenderSpan(props) {
+  const slateEditor = slateReact.useSlateStatic(), editorActor = React.useContext(editorProvider.EditorActorContext), legacySchema = react.useSelector(editorActor, (s) => s.context.getLegacySchema()), spanRef = React.useRef(null), portableTextEditor = editorProvider.usePortableTextEditor(), blockSelected = slateReact.useSelected(), [focused, setFocused] = React.useState(!1), [selected, setSelected] = React.useState(!1), parent = props.children.props.parent, block = parent && slateEditor.isTextBlock(parent) ? parent : void 0, path = React.useMemo(() => block ? [{
+    _key: block._key
+  }, "children", {
+    _key: props.leaf._key
+  }] : void 0, [block, props.leaf._key]), decoratorSchemaTypes = editorActor.getSnapshot().context.schema.decorators.map((decorator) => decorator.name), decorators = uniq__default.default((props.leaf.marks ?? []).filter((mark) => decoratorSchemaTypes.includes(mark))), annotationMarkDefs = (props.leaf.marks ?? []).flatMap((mark_0) => {
+    if (decoratorSchemaTypes.includes(mark_0))
+      return [];
+    const markDef_0 = block?.markDefs?.find((markDef) => markDef._key === mark_0);
+    return markDef_0 ? [markDef_0] : [];
+  }), shouldTrackSelectionAndFocus = annotationMarkDefs.length > 0 && blockSelected;
+  React.useEffect(() => {
+    if (!shouldTrackSelectionAndFocus) {
+      setFocused(!1);
+      return;
+    }
+    const sel = editorProvider.PortableTextEditor.getSelection(portableTextEditor);
+    sel && isEqual__default.default(sel.focus.path, path) && editorProvider.PortableTextEditor.isCollapsedSelection(portableTextEditor) && React.startTransition(() => {
+      setFocused(!0);
+    });
+  }, [shouldTrackSelectionAndFocus, path, portableTextEditor]);
+  const setSelectedFromRange = React.useCallback(() => {
+    if (!shouldTrackSelectionAndFocus)
+      return;
+    const winSelection = window.getSelection();
+    if (!winSelection) {
+      setSelected(!1);
+      return;
+    }
+    if (winSelection && winSelection.rangeCount > 0) {
+      const range = winSelection.getRangeAt(0);
+      spanRef.current && range.intersectsNode(spanRef.current) ? setSelected(!0) : setSelected(!1);
+    } else
+      setSelected(!1);
+  }, [shouldTrackSelectionAndFocus]);
+  React.useEffect(() => {
+    if (!shouldTrackSelectionAndFocus)
+      return;
+    const onBlur = editorActor.on("blurred", () => {
+      setFocused(!1), setSelected(!1);
+    }), onFocus = editorActor.on("focused", () => {
+      const sel_0 = editorProvider.PortableTextEditor.getSelection(portableTextEditor);
+      sel_0 && isEqual__default.default(sel_0.focus.path, path) && editorProvider.PortableTextEditor.isCollapsedSelection(portableTextEditor) && setFocused(!0), setSelectedFromRange();
+    }), onSelection = editorActor.on("selection", (event) => {
+      event.selection && isEqual__default.default(event.selection.focus.path, path) && editorProvider.PortableTextEditor.isCollapsedSelection(portableTextEditor) ? setFocused(!0) : setFocused(!1), setSelectedFromRange();
+    });
+    return () => {
+      onBlur.unsubscribe(), onFocus.unsubscribe(), onSelection.unsubscribe();
+    };
+  }, [editorActor, path, portableTextEditor, setSelectedFromRange, shouldTrackSelectionAndFocus]), React.useEffect(() => setSelectedFromRange(), [setSelectedFromRange]);
+  let children = props.children;
+  for (const mark_1 of decorators) {
+    const legacyDecoratorSchemaType = legacySchema.decorators.find((dec) => dec.value === mark_1);
+    path && legacyDecoratorSchemaType && props.renderDecorator && (children = props.renderDecorator({
+      children,
+      editorElementRef: spanRef,
+      focused,
+      path,
+      selected,
+      schemaType: legacyDecoratorSchemaType,
+      value: mark_1,
+      type: legacyDecoratorSchemaType
+    }));
+  }
+  for (const annotationMarkDef of annotationMarkDefs) {
+    const legacyAnnotationSchemaType = legacySchema.annotations.find((t) => t.name === annotationMarkDef._type);
+    legacyAnnotationSchemaType && (block && path && props.renderAnnotation ? children = /* @__PURE__ */ jsxRuntime.jsx("span", { ref: spanRef, children: props.renderAnnotation({
+      block,
+      children,
+      editorElementRef: spanRef,
+      focused,
+      path,
+      selected,
+      schemaType: legacyAnnotationSchemaType,
+      value: annotationMarkDef,
+      type: legacyAnnotationSchemaType
+    }) }) : children = /* @__PURE__ */ jsxRuntime.jsx("span", { ref: spanRef, children }));
+  }
+  if (block && path && props.renderChild) {
+    const child = block.children.find((_child) => _child._key === props.leaf._key);
+    child && (children = props.renderChild({
+      annotations: annotationMarkDefs,
+      children,
+      editorElementRef: spanRef,
+      focused,
+      path,
+      schemaType: legacySchema.span,
+      selected,
+      value: child,
+      type: legacySchema.span
+    }));
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx("span", { ...props.attributes, ref: spanRef, children });
+}
+const PLACEHOLDER_STYLE = {
+  position: "absolute",
+  userSelect: "none",
+  pointerEvents: "none",
+  left: 0,
+  right: 0
+};
+function RenderLeaf(props) {
+  const $ = reactCompilerRuntime.c(12), editorActor = React.useContext(editorProvider.EditorActorContext), schema = react.useSelector(editorActor, _temp);
+  if (props.leaf._type !== schema.span.name)
+    return props.children;
+  let t0;
+  $[0] !== props ? (t0 = /* @__PURE__ */ jsxRuntime.jsx(RenderSpan, { ...props }), $[0] = props, $[1] = t0) : t0 = $[1];
+  let renderedSpan = t0;
+  if (props.renderPlaceholder && props.leaf.placeholder && props.text.text === "") {
+    let t1;
+    $[2] !== props.renderPlaceholder ? (t1 = props.renderPlaceholder(), $[2] = props.renderPlaceholder, $[3] = t1) : t1 = $[3];
+    let t2;
+    $[4] !== t1 ? (t2 = /* @__PURE__ */ jsxRuntime.jsx("span", { style: PLACEHOLDER_STYLE, contentEditable: !1, children: t1 }), $[4] = t1, $[5] = t2) : t2 = $[5];
+    let t3;
+    return $[6] !== renderedSpan || $[7] !== t2 ? (t3 = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      t2,
+      renderedSpan
+    ] }), $[6] = renderedSpan, $[7] = t2, $[8] = t3) : t3 = $[8], t3;
+  }
+  const rangeDecoration = props.leaf.rangeDecoration;
+  if (rangeDecoration) {
+    let t1;
+    $[9] !== rangeDecoration || $[10] !== renderedSpan ? (t1 = rangeDecoration.component({
+      children: renderedSpan
+    }), $[9] = rangeDecoration, $[10] = renderedSpan, $[11] = t1) : t1 = $[11], renderedSpan = t1;
+  }
+  return renderedSpan;
+}
 function _temp(s) {
   return s.context.schema;
 }
+function RenderText(props) {
+  const $ = reactCompilerRuntime.c(5);
+  let t0;
+  return $[0] !== props.attributes || $[1] !== props.children || $[2] !== props.text._key || $[3] !== props.text._type ? (t0 = /* @__PURE__ */ jsxRuntime.jsx("span", { ...props.attributes, "data-child-key": props.text._key, "data-child-name": props.text._type, "data-child-type": "span", children: props.children }), $[0] = props.attributes, $[1] = props.children, $[2] = props.text._key, $[3] = props.text._type, $[4] = t0) : t0 = $[4], t0;
+}
 const debug$1 = editorProvider.debugWithName("plugin:withHotKeys");
 function createWithHotkeys(editorActor, portableTextEditor, hotkeysFromOptions) {
   const reservedHotkeys = ["enter", "tab", "shift", "delete", "end"], activeHotkeys = hotkeysFromOptions ?? {};
@@ -1113,13 +1128,7 @@ function createDecorate(rangeDecorationActor) {
     }) || slate.Range.includes(decoratedRange, path));
   };
 }
-const debug = editorProvider.debugWithName("component:Editable"), PLACEHOLDER_STYLE = {
-  position: "absolute",
-  userSelect: "none",
-  pointerEvents: "none",
-  left: 0,
-  right: 0
-}, PortableTextEditable = React.forwardRef(function(props, forwardedRef) {
+const debug = editorProvider.debugWithName("component:Editable"), PortableTextEditable = React.forwardRef(function(props, forwardedRef) {
   const {
     hotkeys,
     onBlur,
@@ -1181,21 +1190,7 @@ const debug = editorProvider.debugWithName("component:Editable"), PLACEHOLDER_ST
     const withHotKeys = createWithHotkeys(editorActor, portableTextEditor, hotkeys);
     return debug("Editable is in edit mode"), withHotKeys(slateEditor);
   }, [editorActor, hotkeys, portableTextEditor, readOnly, slateEditor]);
-  const renderElement = React.useCallback((eProps) => /* @__PURE__ */ jsxRuntime.jsx(RenderElement, { ...eProps, readOnly, renderBlock, renderChild, renderListItem, renderStyle, spellCheck }), [spellCheck, readOnly, renderBlock, renderChild, renderListItem, renderStyle]), renderLeaf = React.useCallback((lProps) => {
-    if (lProps.leaf._type === "span") {
-      let rendered = /* @__PURE__ */ jsxRuntime.jsx(Leaf, { ...lProps, editorActor, schemaTypes: portableTextEditor.schemaTypes, renderAnnotation, renderChild, renderDecorator, readOnly });
-      if (renderPlaceholder && lProps.leaf.placeholder && lProps.text.text === "")
-        return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { style: PLACEHOLDER_STYLE, contentEditable: !1, children: renderPlaceholder() }),
-          rendered
-        ] });
-      const decoration = lProps.leaf.rangeDecoration;
-      return decoration && (rendered = decoration.component({
-        children: rendered
-      })), rendered;
-    }
-    return lProps.children;
-  }, [editorActor, portableTextEditor, readOnly, renderAnnotation, renderChild, renderDecorator, renderPlaceholder]), restoreSelectionFromProps = React.useCallback(() => {
+  const renderElement = React.useCallback((eProps) => /* @__PURE__ */ jsxRuntime.jsx(RenderElement, { ...eProps, readOnly, renderBlock, renderChild, renderListItem, renderStyle, spellCheck }), [spellCheck, readOnly, renderBlock, renderChild, renderListItem, renderStyle]), renderLeaf = React.useCallback((leafProps) => /* @__PURE__ */ jsxRuntime.jsx(RenderLeaf, { ...leafProps, readOnly, renderAnnotation, renderChild, renderDecorator, renderPlaceholder }), [readOnly, renderAnnotation, renderChild, renderDecorator, renderPlaceholder]), renderText = React.useCallback((props_0) => /* @__PURE__ */ jsxRuntime.jsx(RenderText, { ...props_0 }), []), restoreSelectionFromProps = React.useCallback(() => {
     if (propsSelection) {
       debug(`Selection from props ${JSON.stringify(propsSelection)}`);
       const normalizedSelection = normalizeSelection(propsSelection, editorProvider.fromSlateValue(slateEditor.children, editorActor.getSnapshot().context.schema.block.name));
@@ -1326,7 +1321,8 @@ const debug = editorProvider.debugWithName("component:Editable"), PLACEHOLDER_ST
               },
               blocks: result_1.insert,
               options: {
-                refreshKeys: !0
+                refreshKeys: !0,
+                validateFields: !0
               }
             }),
             placement: "auto"
@@ -1706,6 +1702,7 @@ const debug = editorProvider.debugWithName("component:Editable"), PLACEHOLDER_ST
       renderPlaceholder: void 0,
       renderElement,
       renderLeaf,
+      renderText,
       scrollSelectionIntoView: scrollSelectionIntoViewToSlate
     }
   ) : null;