@blockslides/react 0.3.2 → 0.4.0

package/dist/index.cjs

@@ -31,7 +31,6 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var index_exports = {};
 __export(index_exports, {
-  BubbleMenuPreset: () => BubbleMenuPreset,
   EditorConsumer: () => EditorConsumer,
   EditorContent: () => EditorContent,
   EditorContext: () => EditorContext,
@@ -48,12 +47,10 @@ __export(index_exports, {
   ReactNodeViewContext: () => ReactNodeViewContext,
   ReactNodeViewRenderer: () => ReactNodeViewRenderer,
   ReactRenderer: () => ReactRenderer,
-  ReactSlideEditor: () => SlideEditor,
   useCurrentEditor: () => useCurrentEditor,
   useEditor: () => useEditor,
   useEditorState: () => useEditorState,
-  useReactNodeView: () => useReactNodeView,
-  useSlideEditor: () => useSlideEditor
+  useReactNodeView: () => useReactNodeView
 });
 module.exports = __toCommonJS(index_exports);
 
@@ -1074,340 +1071,10 @@ function ReactNodeViewRenderer(component, options) {
   };
 }
 
-// src/SlideEditor.tsx
-var import_react13 = require("react");
-
-// src/menus/BubbleMenuPreset.tsx
-var import_react11 = __toESM(require("react"), 1);
-var import_react_dom3 = require("react-dom");
-var import_extension_bubble_menu = require("@blockslides/extension-bubble-menu");
-var import_state = require("@blockslides/pm/state");
-var import_extension_bubble_menu_preset = require("@blockslides/extension-bubble-menu-preset");
-var import_core4 = require("@blockslides/core");
-var import_jsx_runtime8 = require("react/jsx-runtime");
-var BubbleMenuPreset = import_react11.default.forwardRef(
-  ({
-    editor,
-    updateDelay,
-    resizeDelay,
-    appendTo,
-    shouldShow,
-    getReferencedVirtualElement,
-    options,
-    items,
-    className,
-    injectStyles,
-    textColors,
-    highlightColors,
-    fonts,
-    fontSizes,
-    alignments,
-    onTextAction,
-    onImageReplace,
-    ...rest
-  }, ref) => {
-    const pluginKey = "bubbleMenuPreset";
-    const { editor: currentEditor } = useCurrentEditor();
-    const menuEl = (0, import_react11.useRef)(null);
-    (0, import_react11.useEffect)(() => {
-      const attachToEditor = editor || currentEditor;
-      if (!attachToEditor || attachToEditor.isDestroyed) {
-        return;
-      }
-      const { element, cleanup } = (0, import_extension_bubble_menu_preset.buildMenuElement)(attachToEditor, {
-        items: items != null ? items : import_extension_bubble_menu_preset.DEFAULT_ITEMS,
-        className: className != null ? className : "",
-        injectStyles: injectStyles !== false,
-        textColors: textColors != null ? textColors : import_extension_bubble_menu_preset.DEFAULT_COLOR_PALETTE,
-        highlightColors: highlightColors != null ? highlightColors : import_extension_bubble_menu_preset.DEFAULT_HIGHLIGHT_PALETTE,
-        fonts: fonts != null ? fonts : import_extension_bubble_menu_preset.DEFAULT_FONTS,
-        fontSizes: fontSizes != null ? fontSizes : import_extension_bubble_menu_preset.DEFAULT_FONT_SIZES,
-        alignments: alignments != null ? alignments : import_extension_bubble_menu_preset.DEFAULT_ALIGNMENTS,
-        onTextAction,
-        onImageReplace
-      });
-      menuEl.current = element;
-      if (typeof ref === "function") {
-        ref(element);
-      } else if (ref) {
-        ;
-        ref.current = element;
-      }
-      const defaultShouldShow = ({
-        state,
-        editor: editor2
-      }) => {
-        var _a, _b;
-        const sel = state.selection;
-        const imageSelection = sel instanceof import_state.NodeSelection && ["image", "imageBlock"].includes((_b = (_a = sel.node) == null ? void 0 : _a.type) == null ? void 0 : _b.name) || editor2.isActive("image") || editor2.isActive("imageBlock");
-        if (imageSelection) return true;
-        if ((0, import_core4.isTextSelection)(sel) && !sel.empty && !imageSelection) return true;
-        return false;
-      };
-      const plugin = (0, import_extension_bubble_menu.BubbleMenuPlugin)({
-        editor: attachToEditor,
-        element,
-        updateDelay,
-        resizeDelay,
-        appendTo,
-        pluginKey,
-        shouldShow: shouldShow != null ? shouldShow : defaultShouldShow,
-        getReferencedVirtualElement,
-        options
-      });
-      attachToEditor.registerPlugin(plugin);
-      return () => {
-        attachToEditor.unregisterPlugin(pluginKey);
-        cleanup == null ? void 0 : cleanup();
-        if (element.parentNode) {
-          element.parentNode.removeChild(element);
-        }
-      };
-    }, [
-      editor,
-      currentEditor,
-      updateDelay,
-      resizeDelay,
-      appendTo,
-      shouldShow,
-      getReferencedVirtualElement,
-      options,
-      items,
-      className,
-      injectStyles,
-      textColors,
-      highlightColors,
-      fonts,
-      fontSizes,
-      alignments,
-      onTextAction,
-      onImageReplace,
-      ref
-    ]);
-    return menuEl.current ? (0, import_react_dom3.createPortal)(/* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { ...rest }), menuEl.current) : null;
-  }
-);
-BubbleMenuPreset.displayName = "BubbleMenuPreset";
-
-// src/useSlideEditor.ts
-var import_react12 = require("react");
-var import_ai_context = require("@blockslides/ai-context");
-var import_extension_kit = require("@blockslides/extension-kit");
-var defaultSlide = () => ({
-  /**
-   * Placeholder slide if no content is provided.
-   */
-  type: "doc",
-  content: [
-    {
-      type: "slide",
-      attrs: {
-        size: "16x9",
-        className: "",
-        id: "slide-1",
-        backgroundMode: "none",
-        backgroundColor: null,
-        backgroundImage: null,
-        backgroundOverlayColor: null,
-        backgroundOverlayOpacity: null
-      },
-      content: [
-        {
-          type: "column",
-          attrs: {
-            align: "center",
-            padding: "lg",
-            margin: null,
-            gap: "md",
-            backgroundColor: "#ffffff",
-            backgroundImage: null,
-            borderRadius: null,
-            border: null,
-            fill: true,
-            width: null,
-            height: null,
-            justify: "center"
-          },
-          content: [
-            {
-              type: "heading",
-              attrs: {
-                align: null,
-                padding: null,
-                margin: null,
-                gap: null,
-                backgroundColor: null,
-                backgroundImage: null,
-                borderRadius: null,
-                border: null,
-                fill: null,
-                width: null,
-                height: null,
-                justify: null,
-                id: "1fc4664c-333d-4203-a3f1-3ad27a54c535",
-                "data-toc-id": "1fc4664c-333d-4203-a3f1-3ad27a54c535",
-                level: 1
-              },
-              content: [
-                {
-                  type: "text",
-                  text: "Lorem ipsum dolor sit amet"
-                }
-              ]
-            },
-            {
-              type: "paragraph",
-              attrs: {
-                align: null,
-                padding: null,
-                margin: null,
-                gap: null,
-                backgroundColor: null,
-                backgroundImage: null,
-                borderRadius: null,
-                border: null,
-                fill: null,
-                width: null,
-                height: null,
-                justify: null
-              },
-              content: [
-                {
-                  type: "text",
-                  text: "Consectetur adipiscing elit. Sed do eiusmod tempor incididunt. "
-                }
-              ]
-            }
-          ]
-        }
-      ]
-    }
-  ]
-});
-var defaultAddSlideButton = (presets) => ({
-  showPresets: true,
-  presets,
-  presetBackground: "#0f172a",
-  presetForeground: "#e5e7eb"
-});
-var defaultSlideOptions = {
-  renderMode: "dynamic",
-  hoverOutline: { color: "#3b82f6", width: "1.5px", offset: "4px" },
-  hoverOutlineCascade: false
-};
-var useSlideEditor = ({
-  content,
-  onChange,
-  extensions,
-  extensionKitOptions,
-  presetTemplates,
-  deps = [],
-  onEditorReady,
-  immediatelyRender = false,
-  shouldRerenderOnTransaction = false,
-  theme = "light",
-  editorProps,
-  onUpdate,
-  ...editorOptions
-} = {}) => {
-  var _a;
-  const presets = (0, import_react12.useMemo)(
-    () => presetTemplates != null ? presetTemplates : import_ai_context.templatesV1.listPresetTemplates(),
-    [presetTemplates]
-  );
-  const mergedExtensionKitOptions = (0, import_react12.useMemo)(() => {
-    var _a2, _b;
-    const addSlideButton = (extensionKitOptions == null ? void 0 : extensionKitOptions.addSlideButton) === false ? false : {
-      ...defaultAddSlideButton(presets),
-      ...(_a2 = extensionKitOptions == null ? void 0 : extensionKitOptions.addSlideButton) != null ? _a2 : {}
-    };
-    const slide = (extensionKitOptions == null ? void 0 : extensionKitOptions.slide) === false ? false : {
-      ...defaultSlideOptions,
-      ...(_b = extensionKitOptions == null ? void 0 : extensionKitOptions.slide) != null ? _b : {}
-    };
-    return {
-      ...extensionKitOptions,
-      addSlideButton,
-      slide
-    };
-  }, [extensionKitOptions, presets]);
-  const resolvedExtensions = (0, import_react12.useMemo)(() => {
-    const kit = import_extension_kit.ExtensionKit.configure(mergedExtensionKitOptions);
-    return extensions ? [kit, ...extensions] : [kit];
-  }, [extensions, mergedExtensionKitOptions]);
-  const initialContent = content != null ? content : defaultSlide();
-  const editor = useEditor(
-    {
-      content: initialContent,
-      extensions: resolvedExtensions,
-      immediatelyRender,
-      shouldRerenderOnTransaction,
-      theme,
-      editorProps: {
-        attributes: {
-          autocomplete: "off",
-          autocorrect: "off",
-          autocapitalize: "off",
-          class: "min-h-full min-w-full",
-          ...(_a = editorProps == null ? void 0 : editorProps.attributes) != null ? _a : {}
-        },
-        ...editorProps
-      },
-      ...editorOptions,
-      onUpdate: (ctx) => {
-        const json = ctx.editor.getJSON();
-        onChange == null ? void 0 : onChange(json, ctx.editor);
-        onUpdate == null ? void 0 : onUpdate(ctx);
-      }
-    },
-    deps
-  );
-  (0, import_react12.useEffect)(() => {
-    if (editor && !editor.isDestroyed) {
-      onEditorReady == null ? void 0 : onEditorReady(editor);
-    }
-  }, [editor, onEditorReady]);
-  return { editor, presets };
-};
-
-// src/SlideEditor.tsx
-var import_jsx_runtime9 = require("react/jsx-runtime");
-var SlideEditor = (0, import_react13.forwardRef)(
-  ({
-    bubbleMenuPreset = true,
-    editorContentProps,
-    viewportScale = 1,
-    className,
-    style,
-    ...hookProps
-  }, ref) => {
-    const { editor } = useSlideEditor(hookProps);
-    const bubbleMenuProps = (0, import_react13.useMemo)(() => {
-      if (bubbleMenuPreset === false) return null;
-      if (bubbleMenuPreset === true) return {};
-      return bubbleMenuPreset;
-    }, [bubbleMenuPreset]);
-    if (!editor) return null;
-    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { ref, className, style, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
-      "div",
-      {
-        className: "bs-viewport",
-        style: { ["--zoom"]: viewportScale },
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(EditorContent, { editor, ...editorContentProps }),
-          bubbleMenuProps && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(BubbleMenuPreset, { editor, ...bubbleMenuProps })
-        ]
-      }
-    ) });
-  }
-);
-SlideEditor.displayName = "SlideEditor";
-
 // src/index.ts
 __reExport(index_exports, require("@blockslides/core"), module.exports);
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  BubbleMenuPreset,
   EditorConsumer,
   EditorContent,
   EditorContext,
@@ -1424,12 +1091,10 @@ __reExport(index_exports, require("@blockslides/core"), module.exports);
   ReactNodeViewContext,
   ReactNodeViewRenderer,
   ReactRenderer,
-  ReactSlideEditor,
   useCurrentEditor,
   useEditor,
   useEditorState,
   useReactNodeView,
-  useSlideEditor,
   ...require("@blockslides/core")
 });
 //# sourceMappingURL=index.cjs.map