@rufous/ui 0.1.91 → 0.1.93

package/dist/main.cjs

@@ -49678,6 +49678,12 @@ function createSpellCheckPlugin() {
   let viewRef = null;
   const runCheck = (view) => {
     if (!typo || !view.dom?.isConnected) return;
+    if (view.state.doc.content.size <= 2) {
+      const tr2 = view.state.tr.setMeta(spellCheckPluginKey, { decorations: DecorationSet.empty });
+      tr2.setMeta("addToHistory", false);
+      view.dispatch(tr2);
+      return;
+    }
     const { doc: doc3 } = view.state;
     const misspelled = findMisspelled(doc3);
     const decos = misspelled.map(
@@ -49702,10 +49708,17 @@ function createSpellCheckPlugin() {
       init() {
         return DecorationSet.empty;
       },
-      apply(tr, oldDecos) {
+      apply(tr, oldDecos, _oldState, newState) {
         const meta = tr.getMeta(spellCheckPluginKey);
         if (meta?.decorations) return meta.decorations;
-        if (tr.docChanged) return oldDecos.map(tr.mapping, tr.doc);
+        if (tr.docChanged) {
+          if (newState.doc.content.size <= 2) return DecorationSet.empty;
+          try {
+            return oldDecos.map(tr.mapping, tr.doc);
+          } catch {
+            return DecorationSet.empty;
+          }
+        }
         return oldDecos;
       }
     },
@@ -49843,6 +49856,7 @@ var RufousTextEditor = ({
   onSave: onSaveProp,
   onExport: onExportProp,
   onChange,
+  onBlur,
   onAICommand,
   onTranslate,
   onSpeechToText,
@@ -49854,6 +49868,14 @@ var RufousTextEditor = ({
   style
 }) => {
   const mentionSuggestion = (0, import_react60.useMemo)(() => createMentionSuggestion(mentions), [mentions]);
+  const onChangeRef = (0, import_react60.useRef)(onChange);
+  const onBlurRef = (0, import_react60.useRef)(onBlur);
+  (0, import_react60.useEffect)(() => {
+    onChangeRef.current = onChange;
+  }, [onChange]);
+  (0, import_react60.useEffect)(() => {
+    onBlurRef.current = onBlur;
+  }, [onBlur]);
   const editor = (0, import_react61.useEditor)({
     editable,
     extensions: [
@@ -49943,11 +49965,19 @@ var RufousTextEditor = ({
     },
     content: initialContent || "",
     onUpdate: ({ editor: e }) => {
-      if (onChange) {
-        onChange(e.getHTML(), e.getJSON());
-      }
+      onChangeRef.current?.(e.getHTML(), e.getJSON());
     }
   });
+  (0, import_react60.useEffect)(() => {
+    if (!editor) return;
+    const handler = () => {
+      onBlurRef.current?.(editor.getHTML(), editor.getJSON());
+    };
+    editor.on("blur", handler);
+    return () => {
+      editor.off("blur", handler);
+    };
+  }, [editor]);
   const [linkModalOpen, setLinkModalOpen] = (0, import_react60.useState)(false);
   const [linkUrl, setLinkUrl] = (0, import_react60.useState)("");
   const [linkText, setLinkText] = (0, import_react60.useState)("");
@@ -50053,17 +50083,22 @@ var RufousTextEditor = ({
       onImageUpload,
       onClose
     }
-  ), /* @__PURE__ */ import_react60.default.createElement(import_react61.EditorContent, { editor, className: "editor-content-wrapper" }), /* @__PURE__ */ import_react60.default.createElement(ImageToolbar_default, { editor }), /* @__PURE__ */ import_react60.default.createElement(VideoToolbar_default, { editor }), /* @__PURE__ */ import_react60.default.createElement(SpellCheckTooltip, { editor }), /* @__PURE__ */ import_react60.default.createElement(
+  ), /* @__PURE__ */ import_react60.default.createElement(import_react61.EditorContent, { editor, className: "editor-content-wrapper" }), /* @__PURE__ */ import_react60.default.createElement(ImageToolbar_default, { editor }), /* @__PURE__ */ import_react60.default.createElement(VideoToolbar_default, { editor }), /* @__PURE__ */ import_react60.default.createElement(SpellCheckTooltip, { editor }), editor && /* @__PURE__ */ import_react60.default.createElement(
     import_react61.BubbleMenu,
     {
       editor,
       className: "bubble-menu",
       shouldShow: ({ editor: e }) => {
-        const { selection } = e.state;
-        if (selection?.node?.type.name === "image") return false;
-        if (selection?.node?.type.name === "youtube") return false;
-        if (selection?.node?.type.name === "video") return false;
-        return !selection.empty;
+        if (!e || e.isDestroyed) return false;
+        try {
+          const { selection } = e.state;
+          if (selection?.node?.type.name === "image") return false;
+          if (selection?.node?.type.name === "youtube") return false;
+          if (selection?.node?.type.name === "video") return false;
+          return !selection.empty;
+        } catch {
+          return false;
+        }
       }
     },
     /* @__PURE__ */ import_react60.default.createElement(
@@ -50106,42 +50141,62 @@ var RufousTextEditor = ({
       },
       "\u{1F517}"
     )
-  ), /* @__PURE__ */ import_react60.default.createElement(import_react61.FloatingMenu, { editor, className: "floating-menu" }, /* @__PURE__ */ import_react60.default.createElement(
-    "button",
-    {
-      onClick: () => editor?.chain().focus().toggleHeading({ level: 1 }).run(),
-      className: editor?.isActive("heading", { level: 1 }) ? "is-active" : ""
-    },
-    "H1"
-  ), /* @__PURE__ */ import_react60.default.createElement(
-    "button",
-    {
-      onClick: () => editor?.chain().focus().toggleHeading({ level: 2 }).run(),
-      className: editor?.isActive("heading", { level: 2 }) ? "is-active" : ""
-    },
-    "H2"
-  ), /* @__PURE__ */ import_react60.default.createElement(
-    "button",
-    {
-      onClick: () => editor?.chain().focus().toggleBulletList().run(),
-      className: editor?.isActive("bulletList") ? "is-active" : ""
-    },
-    "\u2022 List"
-  ), /* @__PURE__ */ import_react60.default.createElement(
-    "button",
+  ), editor && /* @__PURE__ */ import_react60.default.createElement(
+    import_react61.FloatingMenu,
     {
-      onClick: () => editor?.chain().focus().toggleOrderedList().run(),
-      className: editor?.isActive("orderedList") ? "is-active" : ""
-    },
-    "1. List"
-  ), /* @__PURE__ */ import_react60.default.createElement(
-    "button",
-    {
-      onClick: () => editor?.chain().focus().toggleBlockquote().run(),
-      className: editor?.isActive("blockquote") ? "is-active" : ""
+      editor,
+      className: "floating-menu",
+      shouldShow: ({ editor: e }) => {
+        if (!e || e.isDestroyed) return false;
+        try {
+          const { selection } = e.state;
+          return selection.empty && e.state.doc.textContent.length === 0;
+        } catch {
+          return false;
+        }
+      }
     },
-    "\u201C Quote"
-  )), /* @__PURE__ */ import_react60.default.createElement("div", { className: "status-bar" }, /* @__PURE__ */ import_react60.default.createElement("div", { className: "status-bar-left" }, /* @__PURE__ */ import_react60.default.createElement(
+    /* @__PURE__ */ import_react60.default.createElement(
+      "button",
+      {
+        onClick: () => editor?.chain().focus().toggleHeading({ level: 1 }).run(),
+        className: editor?.isActive("heading", { level: 1 }) ? "is-active" : ""
+      },
+      "H1"
+    ),
+    /* @__PURE__ */ import_react60.default.createElement(
+      "button",
+      {
+        onClick: () => editor?.chain().focus().toggleHeading({ level: 2 }).run(),
+        className: editor?.isActive("heading", { level: 2 }) ? "is-active" : ""
+      },
+      "H2"
+    ),
+    /* @__PURE__ */ import_react60.default.createElement(
+      "button",
+      {
+        onClick: () => editor?.chain().focus().toggleBulletList().run(),
+        className: editor?.isActive("bulletList") ? "is-active" : ""
+      },
+      "\u2022 List"
+    ),
+    /* @__PURE__ */ import_react60.default.createElement(
+      "button",
+      {
+        onClick: () => editor?.chain().focus().toggleOrderedList().run(),
+        className: editor?.isActive("orderedList") ? "is-active" : ""
+      },
+      "1. List"
+    ),
+    /* @__PURE__ */ import_react60.default.createElement(
+      "button",
+      {
+        onClick: () => editor?.chain().focus().toggleBlockquote().run(),
+        className: editor?.isActive("blockquote") ? "is-active" : ""
+      },
+      "\u201C Quote"
+    )
+  ), /* @__PURE__ */ import_react60.default.createElement("div", { className: "status-bar" }, /* @__PURE__ */ import_react60.default.createElement("div", { className: "status-bar-left" }, /* @__PURE__ */ import_react60.default.createElement(
     "select",
     {
       value: saveFormat,

package/dist/main.d.cts

@@ -1683,6 +1683,7 @@ interface RufousTextEditorProps {
     onSave?: (html: string, json: any) => void;
     onExport?: (html: string, json: any) => void;
     onChange?: (html: string, json: any) => void;
+    onBlur?: (html: string, json: any) => void;
     onAICommand?: (prompt: string, text: string, previousResults?: string[]) => Promise<string>;
     onTranslate?: (text: string, sourceLang: string, targetLang: string) => Promise<string>;
     onSpeechToText?: (text: string) => Promise<string>;

package/dist/main.d.ts

@@ -1683,6 +1683,7 @@ interface RufousTextEditorProps {
     onSave?: (html: string, json: any) => void;
     onExport?: (html: string, json: any) => void;
     onChange?: (html: string, json: any) => void;
+    onBlur?: (html: string, json: any) => void;
     onAICommand?: (prompt: string, text: string, previousResults?: string[]) => Promise<string>;
     onTranslate?: (text: string, sourceLang: string, targetLang: string) => Promise<string>;
     onSpeechToText?: (text: string) => Promise<string>;

package/dist/main.js

@@ -8721,7 +8721,7 @@ var PhoneField = forwardRef10(function PhoneField2(props, ref) {
 PhoneField.displayName = "PhoneField";
 
 // lib/RufousTextEditor/RufousTextEditor.tsx
-import React117, { useMemo as useMemo4, useCallback as useCallback14, useState as useState35 } from "react";
+import React117, { useMemo as useMemo4, useCallback as useCallback14, useState as useState35, useRef as useRef31, useEffect as useEffect28 } from "react";
 import { useEditor, EditorContent, EditorContext, FloatingMenu, BubbleMenu } from "@tiptap/react";
 import StarterKit from "@tiptap/starter-kit";
 import Placeholder from "@tiptap/extension-placeholder";
@@ -21009,6 +21009,12 @@ function createSpellCheckPlugin() {
   let viewRef = null;
   const runCheck = (view) => {
     if (!typo || !view.dom?.isConnected) return;
+    if (view.state.doc.content.size <= 2) {
+      const tr2 = view.state.tr.setMeta(spellCheckPluginKey, { decorations: DecorationSet.empty });
+      tr2.setMeta("addToHistory", false);
+      view.dispatch(tr2);
+      return;
+    }
     const { doc: doc3 } = view.state;
     const misspelled = findMisspelled(doc3);
     const decos = misspelled.map(
@@ -21033,10 +21039,17 @@ function createSpellCheckPlugin() {
       init() {
         return DecorationSet.empty;
       },
-      apply(tr, oldDecos) {
+      apply(tr, oldDecos, _oldState, newState) {
         const meta = tr.getMeta(spellCheckPluginKey);
         if (meta?.decorations) return meta.decorations;
-        if (tr.docChanged) return oldDecos.map(tr.mapping, tr.doc);
+        if (tr.docChanged) {
+          if (newState.doc.content.size <= 2) return DecorationSet.empty;
+          try {
+            return oldDecos.map(tr.mapping, tr.doc);
+          } catch {
+            return DecorationSet.empty;
+          }
+        }
         return oldDecos;
       }
     },
@@ -21174,6 +21187,7 @@ var RufousTextEditor = ({
   onSave: onSaveProp,
   onExport: onExportProp,
   onChange,
+  onBlur,
   onAICommand,
   onTranslate,
   onSpeechToText,
@@ -21185,6 +21199,14 @@ var RufousTextEditor = ({
   style
 }) => {
   const mentionSuggestion = useMemo4(() => createMentionSuggestion(mentions), [mentions]);
+  const onChangeRef = useRef31(onChange);
+  const onBlurRef = useRef31(onBlur);
+  useEffect28(() => {
+    onChangeRef.current = onChange;
+  }, [onChange]);
+  useEffect28(() => {
+    onBlurRef.current = onBlur;
+  }, [onBlur]);
   const editor = useEditor({
     editable,
     extensions: [
@@ -21274,11 +21296,19 @@ var RufousTextEditor = ({
     },
     content: initialContent || "",
     onUpdate: ({ editor: e }) => {
-      if (onChange) {
-        onChange(e.getHTML(), e.getJSON());
-      }
+      onChangeRef.current?.(e.getHTML(), e.getJSON());
     }
   });
+  useEffect28(() => {
+    if (!editor) return;
+    const handler = () => {
+      onBlurRef.current?.(editor.getHTML(), editor.getJSON());
+    };
+    editor.on("blur", handler);
+    return () => {
+      editor.off("blur", handler);
+    };
+  }, [editor]);
   const [linkModalOpen, setLinkModalOpen] = useState35(false);
   const [linkUrl, setLinkUrl] = useState35("");
   const [linkText, setLinkText] = useState35("");
@@ -21384,17 +21414,22 @@ var RufousTextEditor = ({
       onImageUpload,
       onClose
     }
-  ), /* @__PURE__ */ React117.createElement(EditorContent, { editor, className: "editor-content-wrapper" }), /* @__PURE__ */ React117.createElement(ImageToolbar_default, { editor }), /* @__PURE__ */ React117.createElement(VideoToolbar_default, { editor }), /* @__PURE__ */ React117.createElement(SpellCheckTooltip, { editor }), /* @__PURE__ */ React117.createElement(
+  ), /* @__PURE__ */ React117.createElement(EditorContent, { editor, className: "editor-content-wrapper" }), /* @__PURE__ */ React117.createElement(ImageToolbar_default, { editor }), /* @__PURE__ */ React117.createElement(VideoToolbar_default, { editor }), /* @__PURE__ */ React117.createElement(SpellCheckTooltip, { editor }), editor && /* @__PURE__ */ React117.createElement(
     BubbleMenu,
     {
       editor,
       className: "bubble-menu",
       shouldShow: ({ editor: e }) => {
-        const { selection } = e.state;
-        if (selection?.node?.type.name === "image") return false;
-        if (selection?.node?.type.name === "youtube") return false;
-        if (selection?.node?.type.name === "video") return false;
-        return !selection.empty;
+        if (!e || e.isDestroyed) return false;
+        try {
+          const { selection } = e.state;
+          if (selection?.node?.type.name === "image") return false;
+          if (selection?.node?.type.name === "youtube") return false;
+          if (selection?.node?.type.name === "video") return false;
+          return !selection.empty;
+        } catch {
+          return false;
+        }
       }
     },
     /* @__PURE__ */ React117.createElement(
@@ -21437,42 +21472,62 @@ var RufousTextEditor = ({
       },
       "\u{1F517}"
     )
-  ), /* @__PURE__ */ React117.createElement(FloatingMenu, { editor, className: "floating-menu" }, /* @__PURE__ */ React117.createElement(
-    "button",
-    {
-      onClick: () => editor?.chain().focus().toggleHeading({ level: 1 }).run(),
-      className: editor?.isActive("heading", { level: 1 }) ? "is-active" : ""
-    },
-    "H1"
-  ), /* @__PURE__ */ React117.createElement(
-    "button",
-    {
-      onClick: () => editor?.chain().focus().toggleHeading({ level: 2 }).run(),
-      className: editor?.isActive("heading", { level: 2 }) ? "is-active" : ""
-    },
-    "H2"
-  ), /* @__PURE__ */ React117.createElement(
-    "button",
-    {
-      onClick: () => editor?.chain().focus().toggleBulletList().run(),
-      className: editor?.isActive("bulletList") ? "is-active" : ""
-    },
-    "\u2022 List"
-  ), /* @__PURE__ */ React117.createElement(
-    "button",
+  ), editor && /* @__PURE__ */ React117.createElement(
+    FloatingMenu,
     {
-      onClick: () => editor?.chain().focus().toggleOrderedList().run(),
-      className: editor?.isActive("orderedList") ? "is-active" : ""
-    },
-    "1. List"
-  ), /* @__PURE__ */ React117.createElement(
-    "button",
-    {
-      onClick: () => editor?.chain().focus().toggleBlockquote().run(),
-      className: editor?.isActive("blockquote") ? "is-active" : ""
+      editor,
+      className: "floating-menu",
+      shouldShow: ({ editor: e }) => {
+        if (!e || e.isDestroyed) return false;
+        try {
+          const { selection } = e.state;
+          return selection.empty && e.state.doc.textContent.length === 0;
+        } catch {
+          return false;
+        }
+      }
     },
-    "\u201C Quote"
-  )), /* @__PURE__ */ React117.createElement("div", { className: "status-bar" }, /* @__PURE__ */ React117.createElement("div", { className: "status-bar-left" }, /* @__PURE__ */ React117.createElement(
+    /* @__PURE__ */ React117.createElement(
+      "button",
+      {
+        onClick: () => editor?.chain().focus().toggleHeading({ level: 1 }).run(),
+        className: editor?.isActive("heading", { level: 1 }) ? "is-active" : ""
+      },
+      "H1"
+    ),
+    /* @__PURE__ */ React117.createElement(
+      "button",
+      {
+        onClick: () => editor?.chain().focus().toggleHeading({ level: 2 }).run(),
+        className: editor?.isActive("heading", { level: 2 }) ? "is-active" : ""
+      },
+      "H2"
+    ),
+    /* @__PURE__ */ React117.createElement(
+      "button",
+      {
+        onClick: () => editor?.chain().focus().toggleBulletList().run(),
+        className: editor?.isActive("bulletList") ? "is-active" : ""
+      },
+      "\u2022 List"
+    ),
+    /* @__PURE__ */ React117.createElement(
+      "button",
+      {
+        onClick: () => editor?.chain().focus().toggleOrderedList().run(),
+        className: editor?.isActive("orderedList") ? "is-active" : ""
+      },
+      "1. List"
+    ),
+    /* @__PURE__ */ React117.createElement(
+      "button",
+      {
+        onClick: () => editor?.chain().focus().toggleBlockquote().run(),
+        className: editor?.isActive("blockquote") ? "is-active" : ""
+      },
+      "\u201C Quote"
+    )
+  ), /* @__PURE__ */ React117.createElement("div", { className: "status-bar" }, /* @__PURE__ */ React117.createElement("div", { className: "status-bar-left" }, /* @__PURE__ */ React117.createElement(
     "select",
     {
       value: saveFormat,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@rufous/ui",
   "private": false,
-  "version": "0.1.91",
+  "version": "0.1.93",
   "type": "module",
   "description": "Experimental: A lightweight React UI component library (Beta)",
   "style": "./dist/main.css",