@elementor/editor-controls 4.1.0-740 → 4.1.0-742

package/dist/index.d.mts

@@ -640,6 +640,7 @@ type InlineEditorProps = {
     onEditorCreate?: Dispatch<SetStateAction<Editor | null>>;
     wrapperClassName?: string;
     onSelectionEnd?: (view: EditorView) => void;
+    mountElement?: HTMLElement | null;
 };
 declare const InlineEditor: React$1.ForwardRefExoticComponent<InlineEditorProps & React$1.RefAttributes<unknown>>;
 

package/dist/index.d.ts

@@ -640,6 +640,7 @@ type InlineEditorProps = {
     onEditorCreate?: Dispatch<SetStateAction<Editor | null>>;
     wrapperClassName?: string;
     onSelectionEnd?: (view: EditorView) => void;
+    mountElement?: HTMLElement | null;
 };
 declare const InlineEditor: React$1.ForwardRefExoticComponent<InlineEditorProps & React$1.RefAttributes<unknown>>;
 

package/dist/index.js

@@ -6523,9 +6523,12 @@ var InlineEditor = React100.forwardRef((props, ref) => {
     expectedTag = null,
     onEditorCreate,
     wrapperClassName,
-    onSelectionEnd
+    onSelectionEnd,
+    mountElement = null
   } = props;
   const containerRef = (0, import_react55.useRef)(null);
+  const onBlurRef = (0, import_react55.useRef)(onBlur);
+  onBlurRef.current = onBlur;
   const documentContentSettings = !!expectedTag ? "block+" : "inline*";
   const onUpdate = ({ editor: updatedEditor }) => {
     const newValue = updatedEditor.getHTML();
@@ -6533,7 +6536,7 @@ var InlineEditor = React100.forwardRef((props, ref) => {
   };
   const onKeyDown = (_, event) => {
     if (event.key === "Escape") {
-      onBlur?.();
+      onBlurRef.current?.();
     }
     if (!event.metaKey && !event.ctrlKey || event.altKey) {
       return;
@@ -6547,6 +6550,7 @@ var InlineEditor = React100.forwardRef((props, ref) => {
     class: elementClasses
   });
   const editor = (0, import_react56.useEditor)({
+    ...mountElement ? { element: mountElement } : {},
     extensions: [
       import_extension_document.default.extend({
         content: documentContentSettings
@@ -6600,6 +6604,7 @@ var InlineEditor = React100.forwardRef((props, ref) => {
       }
     },
     onCreate: onEditorCreate ? ({ editor: mountedEditor }) => onEditorCreate(mountedEditor) : void 0,
+    onBlur: mountElement ? void 0 : () => onBlurRef.current?.(),
     onSelectionUpdate: onSelectionEnd ? ({ editor: updatedEditor }) => onSelectionEnd(updatedEditor.view) : void 0
   });
   useOnUpdate(() => {
@@ -6611,33 +6616,11 @@ var InlineEditor = React100.forwardRef((props, ref) => {
       editor.commands.setContent(value, { emitUpdate: false });
     }
   }, [editor, value]);
-  return /* @__PURE__ */ React100.createElement(React100.Fragment, null, /* @__PURE__ */ React100.createElement(
-    Wrapper,
-    {
-      containerRef,
-      editor,
-      sx,
-      onBlur,
-      className: wrapperClassName
-    },
-    /* @__PURE__ */ React100.createElement(import_react56.EditorContent, { ref, editor })
-  ));
+  if (mountElement) {
+    return null;
+  }
+  return /* @__PURE__ */ React100.createElement(import_ui86.Box, { ref: containerRef, sx, className: wrapperClassName }, /* @__PURE__ */ React100.createElement(import_react56.EditorContent, { ref, editor }));
 });
-var Wrapper = ({ children, containerRef, editor, sx, onBlur, className }) => {
-  const wrappedChildren = /* @__PURE__ */ React100.createElement(import_ui86.Box, { ref: containerRef, ...sx, className }, children);
-  return onBlur ? /* @__PURE__ */ React100.createElement(
-    import_ui86.ClickAwayListener,
-    {
-      onClickAway: (event) => {
-        if (containerRef.current?.contains(event.target) || editor.view.dom.contains(event.target)) {
-          return;
-        }
-        onBlur?.();
-      }
-    },
-    wrappedChildren
-  ) : /* @__PURE__ */ React100.createElement(React100.Fragment, null, wrappedChildren);
-};
 var useOnUpdate = (callback, dependencies) => {
   const hasMounted = (0, import_react55.useRef)(false);
   (0, import_react55.useEffect)(() => {