smartrte-react 0.1.2

package/dist/components/TableInsertDialog.js

@@ -0,0 +1,42 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+export const TableInsertDialog = ({ onInsert, onClose, }) => {
+    const [hoverRows, setHoverRows] = useState(0);
+    const [hoverCols, setHoverCols] = useState(0);
+    const maxRows = 10;
+    const maxCols = 10;
+    return (_jsxs("div", { style: {
+            position: "absolute",
+            top: 60,
+            left: 100,
+            background: "#fff",
+            border: "1px solid #ddd",
+            padding: 12,
+            zIndex: 1000,
+            boxShadow: "0 4px 10px rgba(0,0,0,0.15)",
+        }, children: [_jsx("div", { style: {
+                    display: "grid",
+                    gridTemplateColumns: `repeat(${maxCols}, 20px)`,
+                    gap: 4,
+                }, children: Array.from({ length: maxRows }).map((_, r) => Array.from({ length: maxCols }).map((_, c) => {
+                    const active = r < hoverRows && c < hoverCols;
+                    return (_jsx("div", { style: {
+                            width: 20,
+                            height: 20,
+                            border: "1px solid #ccc",
+                            background: active ? "#3399ff" : "#f9f9f9",
+                            cursor: "pointer",
+                        }, onMouseEnter: () => {
+                            setHoverRows(r + 1);
+                            setHoverCols(c + 1);
+                        }, onClick: () => {
+                            onInsert(r + 1, c + 1);
+                            onClose();
+                        } }, `${r}-${c}`));
+                })) }), _jsxs("div", { style: { marginTop: 8, textAlign: "center", fontSize: 12 }, children: [hoverRows, " \u00D7 ", hoverCols] }), _jsx("button", { style: {
+                    marginTop: 8,
+                    padding: "4px 8px",
+                    fontSize: 12,
+                    cursor: "pointer",
+                }, onClick: onClose, children: "Cancel" })] }));
+};

package/dist/hooks/useEditorSync.d.ts

@@ -0,0 +1,5 @@
+export declare function useEditorSync(editor: any): {
+    doc: any;
+    setDoc: import("react").Dispatch<any>;
+    sync: () => void;
+};

package/dist/hooks/useEditorSync.js

@@ -0,0 +1,53 @@
+import { useCallback, useEffect, useRef, useState } from "react";
+export function useEditorSync(editor) {
+    const [doc, setDoc] = useState({ nodes: [] });
+    const retryRef = useRef(null);
+    const sync = useCallback(() => {
+        if (!editor)
+            return;
+        // Skip if the wasm Editor was freed (HMR/unmount). __wbg_ptr === 0 means invalid.
+        try {
+            if (typeof editor.__wbg_ptr === 'number' && editor.__wbg_ptr === 0)
+                return;
+        }
+        catch { }
+        // Defer to next tick to avoid wasm RefCell re-entrancy when calling
+        // multiple &mut self methods back-to-back in the same event loop turn.
+        setTimeout(() => {
+            try {
+                if (typeof editor.__wbg_ptr === 'number' && editor.__wbg_ptr === 0)
+                    return;
+                const json = editor.to_json();
+                const parsed = JSON.parse(json);
+                setDoc(parsed);
+            }
+            catch (err) {
+                // Avoid noisy logs during HMR/refresh when wasm may be temporarily invalid
+                // Retry once shortly after in case module just reloaded
+                if (retryRef.current)
+                    window.clearTimeout(retryRef.current);
+                retryRef.current = window.setTimeout(() => {
+                    try {
+                        if (typeof editor.__wbg_ptr === 'number' && editor.__wbg_ptr !== 0) {
+                            const j = editor.to_json();
+                            setDoc(JSON.parse(j));
+                        }
+                    }
+                    catch { }
+                    retryRef.current = null;
+                }, 100);
+            }
+        }, 0);
+    }, [editor]);
+    useEffect(() => {
+        if (!editor)
+            return;
+        try {
+            if (typeof editor.__wbg_ptr === 'number' && editor.__wbg_ptr === 0)
+                return;
+        }
+        catch { }
+        sync();
+    }, [editor, sync]);
+    return { doc, setDoc, sync };
+}

package/dist/index.d.ts

@@ -0,0 +1 @@
+export { ClassicEditor } from './components/ClassicEditor';

package/dist/index.js

@@ -0,0 +1 @@
+export { ClassicEditor } from './components/ClassicEditor';

package/dist/smart-editor.js

@@ -0,0 +1 @@
+// Removed: SmartEditor shim no longer needed

package/dist/standalone/classic-editor-embed.d.ts

@@ -0,0 +1,12 @@
+export type ClassicEditorController = {
+    setHtml: (html: string) => void;
+    getHtml: () => string;
+    focus: () => void;
+    blur: () => void;
+    destroy: () => void;
+};
+declare global {
+    interface Window {
+        SmartRTE?: any;
+    }
+}

package/dist/standalone/classic-editor-embed.js

@@ -0,0 +1,108 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React, { useImperativeHandle, useRef, useState } from "react";
+import { createRoot } from "react-dom/client";
+import { ClassicEditor as ClassicEditorComponent } from "../components/ClassicEditor";
+function ClassicEditorHost(props, ref) {
+    const [html, setHtml] = useState(props.value || "");
+    const containerRef = useRef(null);
+    useImperativeHandle(ref, () => ({
+        setHtml(next) {
+            setHtml(next ?? "");
+        },
+        getHtml() {
+            return (containerRef.current?.querySelector('[contenteditable="true"]')
+                ?.innerHTML ?? html);
+        },
+        focus() {
+            const el = containerRef.current?.querySelector('[contenteditable="true"]');
+            el?.focus();
+        },
+        blur() {
+            const el = containerRef.current?.querySelector('[contenteditable="true"]');
+            el?.blur();
+        },
+        destroy() {
+            // No-op here; actual unmount happens in init
+        },
+    }), [html]);
+    return (_jsx("div", { ref: containerRef, style: { height: "100%", width: "100%" }, children: _jsx(ClassicEditorComponent, { value: html, onChange: (v) => {
+                setHtml(v);
+                props.onChange?.(v);
+                try {
+                    // Bridge to Flutter if present
+                    // @ts-ignore
+                    const ch = window.ToFlutter;
+                    if (ch && typeof ch.postMessage === "function") {
+                        ch.postMessage(JSON.stringify({ type: "change", html: v }));
+                    }
+                }
+                catch { }
+            }, placeholder: props.placeholder, minHeight: props.minHeight, maxHeight: props.maxHeight, readOnly: props.readOnly }) }));
+}
+const ClassicEditorHostWithRef = React.forwardRef(ClassicEditorHost);
+function initClassicEditor(opts) {
+    const { target, onChange, ...rest } = opts;
+    const root = createRoot(target);
+    const ref = React.createRef();
+    root.render(_jsx(ClassicEditorHostWithRef, { ref: ref, onChange: onChange, ...rest }));
+    const controller = {
+        setHtml: (html) => ref.current?.setHtml(html),
+        getHtml: () => ref.current?.getHtml() ?? "",
+        focus: () => ref.current?.focus?.(),
+        blur: () => ref.current?.blur?.(),
+        destroy: () => {
+            try {
+                root.unmount();
+            }
+            catch { }
+        },
+    };
+    // Attach controller globally for simple bridges
+    try {
+        const g = window;
+        g.SmartRTE = g.SmartRTE || {};
+        g.SmartRTE.__controller = controller;
+        g.SmartBridge = g.SmartBridge || {};
+        if (typeof g.SmartBridge.handle !== "function") {
+            g.SmartBridge.handle = (msg) => {
+                try {
+                    if (!msg || typeof msg !== "object")
+                        return;
+                    const t = msg.type;
+                    if (t === "setHtml")
+                        controller.setHtml(String(msg.html ?? ""));
+                    else if (t === "focus")
+                        controller.focus();
+                    else if (t === "blur")
+                        controller.blur();
+                    else if (t === "getHtml") {
+                        const html = controller.getHtml();
+                        const ch = g.ToFlutter;
+                        if (ch && typeof ch.postMessage === "function") {
+                            ch.postMessage(JSON.stringify({ type: "getHtmlResult", html }));
+                        }
+                    }
+                }
+                catch { }
+            };
+        }
+    }
+    catch { }
+    // Inform Flutter bridge we are ready
+    try {
+        // @ts-ignore
+        const ch = window.ToFlutter;
+        if (ch && typeof ch.postMessage === "function") {
+            ch.postMessage(JSON.stringify({ type: "ready" }));
+        }
+    }
+    catch { }
+    return controller;
+}
+(function attachGlobal() {
+    const g = window;
+    g.SmartRTE = g.SmartRTE || {};
+    g.SmartRTE.ClassicEditor = {
+        init: initClassicEditor,
+    };
+})();