@tiptap/react 3.18.0 → 3.19.0

package/dist/index.cjs

@@ -48,11 +48,8 @@ __export(index_exports, {
   ReactNodeViewRenderer: () => ReactNodeViewRenderer,
   ReactRenderer: () => ReactRenderer,
   Tiptap: () => Tiptap,
-  TiptapBubbleMenu: () => TiptapBubbleMenu,
   TiptapContent: () => TiptapContent,
   TiptapContext: () => TiptapContext,
-  TiptapFloatingMenu: () => TiptapFloatingMenu,
-  TiptapLoading: () => TiptapLoading,
   TiptapWrapper: () => TiptapWrapper,
   useCurrentEditor: () => useCurrentEditor,
   useEditor: () => useEditor,
@@ -1123,203 +1120,15 @@ function ReactNodeViewRenderer(component, options) {
 }
 
 // src/Tiptap.tsx
-var import_react14 = require("react");
-
-// src/menus/BubbleMenu.tsx
-var import_extension_bubble_menu = require("@tiptap/extension-bubble-menu");
-var import_react10 = require("@tiptap/react");
-var import_react11 = __toESM(require("react"), 1);
-var import_react_dom3 = require("react-dom");
+var import_react10 = require("react");
 var import_jsx_runtime8 = require("react/jsx-runtime");
-var BubbleMenu = import_react11.default.forwardRef(
-  ({
-    pluginKey = "bubbleMenu",
-    editor,
-    updateDelay,
-    resizeDelay,
-    appendTo,
-    shouldShow = null,
-    getReferencedVirtualElement,
-    options,
-    children,
-    ...restProps
-  }, ref) => {
-    const menuEl = (0, import_react11.useRef)(document.createElement("div"));
-    if (typeof ref === "function") {
-      ref(menuEl.current);
-    } else if (ref) {
-      ref.current = menuEl.current;
-    }
-    const { editor: currentEditor } = (0, import_react10.useCurrentEditor)();
-    const pluginEditor = editor || currentEditor;
-    const bubbleMenuPluginProps = {
-      updateDelay,
-      resizeDelay,
-      appendTo,
-      pluginKey,
-      shouldShow,
-      getReferencedVirtualElement,
-      options
-    };
-    const bubbleMenuPluginPropsRef = (0, import_react11.useRef)(bubbleMenuPluginProps);
-    bubbleMenuPluginPropsRef.current = bubbleMenuPluginProps;
-    const [pluginInitialized, setPluginInitialized] = (0, import_react11.useState)(false);
-    const skipFirstUpdateRef = (0, import_react11.useRef)(true);
-    (0, import_react11.useEffect)(() => {
-      if (pluginEditor == null ? void 0 : pluginEditor.isDestroyed) {
-        return;
-      }
-      if (!pluginEditor) {
-        console.warn("BubbleMenu component is not rendered inside of an editor component or does not have editor prop.");
-        return;
-      }
-      const bubbleMenuElement = menuEl.current;
-      bubbleMenuElement.style.visibility = "hidden";
-      bubbleMenuElement.style.position = "absolute";
-      const plugin = (0, import_extension_bubble_menu.BubbleMenuPlugin)({
-        ...bubbleMenuPluginPropsRef.current,
-        editor: pluginEditor,
-        element: bubbleMenuElement
-      });
-      pluginEditor.registerPlugin(plugin);
-      const createdPluginKey = bubbleMenuPluginPropsRef.current.pluginKey;
-      skipFirstUpdateRef.current = true;
-      setPluginInitialized(true);
-      return () => {
-        setPluginInitialized(false);
-        pluginEditor.unregisterPlugin(createdPluginKey);
-        window.requestAnimationFrame(() => {
-          if (bubbleMenuElement.parentNode) {
-            bubbleMenuElement.parentNode.removeChild(bubbleMenuElement);
-          }
-        });
-      };
-    }, [pluginEditor]);
-    (0, import_react11.useEffect)(() => {
-      if (!pluginInitialized || !pluginEditor || pluginEditor.isDestroyed) {
-        return;
-      }
-      if (skipFirstUpdateRef.current) {
-        skipFirstUpdateRef.current = false;
-        return;
-      }
-      pluginEditor.view.dispatch(
-        pluginEditor.state.tr.setMeta("bubbleMenu", {
-          type: "updateOptions",
-          options: bubbleMenuPluginPropsRef.current
-        })
-      );
-    }, [
-      pluginInitialized,
-      pluginEditor,
-      updateDelay,
-      resizeDelay,
-      shouldShow,
-      options,
-      appendTo,
-      getReferencedVirtualElement
-    ]);
-    return (0, import_react_dom3.createPortal)(/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { ...restProps, children }), menuEl.current);
+var TiptapContext = (0, import_react10.createContext)({
+  get editor() {
+    throw new Error("useTiptap must be used within a <Tiptap> provider");
   }
-);
-
-// src/menus/FloatingMenu.tsx
-var import_extension_floating_menu = require("@tiptap/extension-floating-menu");
-var import_react12 = require("@tiptap/react");
-var import_react13 = __toESM(require("react"), 1);
-var import_react_dom4 = require("react-dom");
-var import_jsx_runtime9 = require("react/jsx-runtime");
-var FloatingMenu = import_react13.default.forwardRef(
-  ({
-    pluginKey = "floatingMenu",
-    editor,
-    updateDelay,
-    resizeDelay,
-    appendTo,
-    shouldShow = null,
-    options,
-    children,
-    ...restProps
-  }, ref) => {
-    const menuEl = (0, import_react13.useRef)(document.createElement("div"));
-    if (typeof ref === "function") {
-      ref(menuEl.current);
-    } else if (ref) {
-      ref.current = menuEl.current;
-    }
-    const { editor: currentEditor } = (0, import_react12.useCurrentEditor)();
-    const pluginEditor = editor || currentEditor;
-    const floatingMenuPluginProps = {
-      updateDelay,
-      resizeDelay,
-      appendTo,
-      pluginKey,
-      shouldShow,
-      options
-    };
-    const floatingMenuPluginPropsRef = (0, import_react13.useRef)(floatingMenuPluginProps);
-    floatingMenuPluginPropsRef.current = floatingMenuPluginProps;
-    const [pluginInitialized, setPluginInitialized] = (0, import_react13.useState)(false);
-    const skipFirstUpdateRef = (0, import_react13.useRef)(true);
-    (0, import_react13.useEffect)(() => {
-      if (pluginEditor == null ? void 0 : pluginEditor.isDestroyed) {
-        return;
-      }
-      if (!pluginEditor) {
-        console.warn(
-          "FloatingMenu component is not rendered inside of an editor component or does not have editor prop."
-        );
-        return;
-      }
-      const floatingMenuElement = menuEl.current;
-      floatingMenuElement.style.visibility = "hidden";
-      floatingMenuElement.style.position = "absolute";
-      const plugin = (0, import_extension_floating_menu.FloatingMenuPlugin)({
-        ...floatingMenuPluginPropsRef.current,
-        editor: pluginEditor,
-        element: floatingMenuElement
-      });
-      pluginEditor.registerPlugin(plugin);
-      const createdPluginKey = floatingMenuPluginPropsRef.current.pluginKey;
-      skipFirstUpdateRef.current = true;
-      setPluginInitialized(true);
-      return () => {
-        setPluginInitialized(false);
-        pluginEditor.unregisterPlugin(createdPluginKey);
-        window.requestAnimationFrame(() => {
-          if (floatingMenuElement.parentNode) {
-            floatingMenuElement.parentNode.removeChild(floatingMenuElement);
-          }
-        });
-      };
-    }, [pluginEditor]);
-    (0, import_react13.useEffect)(() => {
-      if (!pluginInitialized || !pluginEditor || pluginEditor.isDestroyed) {
-        return;
-      }
-      if (skipFirstUpdateRef.current) {
-        skipFirstUpdateRef.current = false;
-        return;
-      }
-      pluginEditor.view.dispatch(
-        pluginEditor.state.tr.setMeta("floatingMenu", {
-          type: "updateOptions",
-          options: floatingMenuPluginPropsRef.current
-        })
-      );
-    }, [pluginInitialized, pluginEditor, updateDelay, resizeDelay, shouldShow, options, appendTo]);
-    return (0, import_react_dom4.createPortal)(/* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { ...restProps, children }), menuEl.current);
-  }
-);
-
-// src/Tiptap.tsx
-var import_jsx_runtime10 = require("react/jsx-runtime");
-var TiptapContext = (0, import_react14.createContext)({
-  editor: null,
-  isReady: false
 });
 TiptapContext.displayName = "TiptapContext";
-var useTiptap = () => (0, import_react14.useContext)(TiptapContext);
+var useTiptap = () => (0, import_react10.useContext)(TiptapContext);
 function useTiptapState(selector, equalityFn) {
   const { editor } = useTiptap();
   return useEditorState({
@@ -1328,81 +1137,27 @@ function useTiptapState(selector, equalityFn) {
     equalityFn
   });
 }
-function TiptapWrapper({ instance, children }) {
-  var _a;
-  const [isReady, setIsReady] = (0, import_react14.useState)((_a = instance == null ? void 0 : instance.isInitialized) != null ? _a : false);
-  (0, import_react14.useEffect)(() => {
-    if (!instance) {
-      setIsReady(false);
-      return;
-    }
-    if (instance.isInitialized) {
-      setIsReady(true);
-      return;
-    }
-    const handleCreate = () => {
-      setIsReady(true);
-    };
-    instance.on("create", handleCreate);
-    return () => {
-      instance.off("create", handleCreate);
-    };
-  }, [instance]);
-  const tiptapContextValue = (0, import_react14.useMemo)(() => ({ editor: instance, isReady }), [instance, isReady]);
-  const legacyContextValue = (0, import_react14.useMemo)(() => ({ editor: instance }), [instance]);
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(EditorContext.Provider, { value: legacyContextValue, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(TiptapContext.Provider, { value: tiptapContextValue, children }) });
+function TiptapWrapper({ editor, instance, children }) {
+  const resolvedEditor = editor != null ? editor : instance;
+  if (!resolvedEditor) {
+    throw new Error("Tiptap: An editor instance is required. Pass a non-null `editor` prop.");
+  }
+  const tiptapContextValue = (0, import_react10.useMemo)(() => ({ editor: resolvedEditor }), [resolvedEditor]);
+  const legacyContextValue = (0, import_react10.useMemo)(() => ({ editor: resolvedEditor }), [resolvedEditor]);
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(EditorContext.Provider, { value: legacyContextValue, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(TiptapContext.Provider, { value: tiptapContextValue, children }) });
 }
 TiptapWrapper.displayName = "Tiptap";
 function TiptapContent({ ...rest }) {
   const { editor } = useTiptap();
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(EditorContent, { editor, ...rest });
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(EditorContent, { editor, ...rest });
 }
 TiptapContent.displayName = "Tiptap.Content";
-function TiptapLoading({ children }) {
-  const { isReady } = useTiptap();
-  if (isReady) {
-    return null;
-  }
-  return children;
-}
-TiptapLoading.displayName = "Tiptap.Loading";
-function TiptapBubbleMenu({ children, ...rest }) {
-  const { editor } = useTiptap();
-  if (!editor) {
-    return null;
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(BubbleMenu, { editor, ...rest, children });
-}
-TiptapBubbleMenu.displayName = "Tiptap.BubbleMenu";
-function TiptapFloatingMenu({ children, ...rest }) {
-  const { editor } = useTiptap();
-  if (!editor) {
-    return null;
-  }
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FloatingMenu, { ...rest, editor, children });
-}
-TiptapFloatingMenu.displayName = "Tiptap.FloatingMenu";
 var Tiptap = Object.assign(TiptapWrapper, {
   /**
    * The Tiptap Content component that renders the EditorContent with the editor instance from the context.
    * @see TiptapContent
    */
-  Content: TiptapContent,
-  /**
-   * The Tiptap Loading component that renders its children only when the editor is not ready.
-   * @see TiptapLoading
-   */
-  Loading: TiptapLoading,
-  /**
-   * The Tiptap BubbleMenu component that wraps the BubbleMenu from Tiptap and provides the editor instance from the context.
-   * @see TiptapBubbleMenu
-   */
-  BubbleMenu: TiptapBubbleMenu,
-  /**
-   * The Tiptap FloatingMenu component that wraps the FloatingMenu from Tiptap and provides the editor instance from the context.
-   * @see TiptapFloatingMenu
-   */
-  FloatingMenu: TiptapFloatingMenu
+  Content: TiptapContent
 });
 
 // src/index.ts
@@ -1426,11 +1181,8 @@ __reExport(index_exports, require("@tiptap/core"), module.exports);
   ReactNodeViewRenderer,
   ReactRenderer,
   Tiptap,
-  TiptapBubbleMenu,
   TiptapContent,
   TiptapContext,
-  TiptapFloatingMenu,
-  TiptapLoading,
   TiptapWrapper,
   useCurrentEditor,
   useEditor,