@superdoc-dev/react 1.0.0-test.1 → 1.1.0

package/README.md

@@ -10,6 +10,34 @@ npm install @superdoc-dev/react
 
 > `superdoc` is included as a dependency - no need to install it separately.
 
+## Pinning SuperDoc Version (Optional)
+
+If you need to force a specific `superdoc` version (for example, to align multiple apps or test a local build), pin it in your app's `package.json` using overrides.
+
+### npm
+
+```json
+{
+  "overrides": {
+    "superdoc": "1.14.1"
+  }
+}
+```
+
+### pnpm
+
+```json
+{
+  "pnpm": {
+    "overrides": {
+      "superdoc": "1.14.1"
+    }
+  }
+}
+```
+
+Then run your package manager install command again.
+
 ## Quick Start
 
 ```tsx

package/dist/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const f=require("react/jsx-runtime"),e=require("react");function G(r){const i=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const s in r)if(s!=="default"){const a=Object.getOwnPropertyDescriptor(r,s);Object.defineProperty(i,s,a.get?a:{enumerable:!0,get:()=>r[s]})}}return i.default=r,Object.freeze(i)}const N=G(e);function J(){const r=N.useRef(null);return r.current===null&&(r.current=`-${Date.now()}-${Math.random().toString(36).slice(2,9)}`),r.current}const K=typeof N.useId=="function"?N.useId:J;function Q(r,i){const[s,a]=e.useState(!1),{id:T,renderLoading:w,hideToolbar:m=!1,className:U,style:q,onReady:E,onEditorCreate:S,onEditorDestroy:y,onEditorUpdate:R,onContentError:g,onException:D,document:b,user:I,users:h,modules:j,...F}=r,n=r.documentMode??"editing",O=r.role??"editor",d=e.useRef(null),$=e.useRef(null),H=K(),_=T??`superdoc${H}`,C=_,M=`${_}-toolbar`,[L,v]=e.useState(!0),c=e.useRef({onReady:E,onEditorCreate:S,onEditorDestroy:y,onEditorUpdate:R,onContentError:g,onException:D});e.useEffect(()=>{c.current={onReady:E,onEditorCreate:S,onEditorDestroy:y,onEditorUpdate:R,onContentError:g,onException:D}},[E,S,y,R,g,D]);const u=e.useRef(null),l=e.useRef(!1),k=e.useRef(n);e.useEffect(()=>{k.current!==n&&(d.current?d.current.setDocumentMode(n):l.current&&(u.current=n)),k.current=n},[n]),e.useImperativeHandle(i,()=>({getInstance:()=>d.current}),[]),e.useEffect(()=>{v(!0),a(!1),l.current=!0;let o=!1,p=null;return(async()=>{try{const W=(await import("superdoc")).SuperDoc;if(o)return;const A={...F,selector:`#${CSS.escape(C)}`,...!m&&$.current?{toolbar:`#${CSS.escape(M)}`}:{},documentMode:n,role:O,...b!=null?{document:b}:{},...I?{user:I}:{},...h?{users:h}:{},...j?{modules:j}:{},onReady:t=>{o||(v(!1),l.current=!1,u.current&&u.current!==n&&(t.superdoc.setDocumentMode(u.current),u.current=null),c.current.onReady?.(t))},onEditorCreate:t=>{o||c.current.onEditorCreate?.(t)},onEditorDestroy:()=>{o||c.current.onEditorDestroy?.()},onEditorUpdate:t=>{o||c.current.onEditorUpdate?.(t)},onContentError:t=>{o||c.current.onContentError?.(t)},onException:t=>{o||c.current.onException?.(t)}};p=new W(A),d.current=p}catch(x){o||(l.current=!1,v(!1),a(!0),console.error("[SuperDocEditor] Failed to initialize SuperDoc:",x),c.current.onException?.({error:x}))}})(),()=>{l.current=!1,u.current=null,p&&(p.destroy(),d.current=null),o=!0}},[b,I,h,j,O,m,C,M]);const B=["superdoc-wrapper",U].filter(Boolean).join(" "),z=L?{display:"none"}:void 0;return f.jsxs("div",{className:B,style:q,children:[!m&&f.jsx("div",{ref:$,id:M,className:"superdoc-toolbar-container",style:z}),f.jsx("div",{id:C,className:"superdoc-editor-container",style:z}),L&&!s&&w&&f.jsx("div",{className:"superdoc-loading-container",children:w()}),s&&f.jsx("div",{className:"superdoc-error-container",children:"Failed to load editor. Check console for details."})]})}const P=e.forwardRef(Q);P.displayName="SuperDocEditor";exports.SuperDocEditor=P;exports.default=P;
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;l<u;l++)d=c[l],!a.call(e,d)&&d!==o&&t(e,d,{get:(e=>i[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},s=(n,r,a)=>(a=n==null?{}:e(i(n)),o(r||!n||!n.__esModule?t(a,`default`,{value:n,enumerable:!0}):a,n));let c=require(`react`);c=s(c);let l=require(`react/jsx-runtime`);function u(){let e=c.useRef(null);return e.current===null&&(e.current=`-${Date.now()}-${Math.random().toString(36).slice(2,9)}`),e.current}const d=typeof c.useId==`function`?c.useId:u;function f(e,t){let[n,r]=(0,c.useState)(!1),{id:i,renderLoading:a,hideToolbar:o=!1,contained:s=!1,className:u,style:f,onReady:p,onEditorCreate:m,onEditorDestroy:h,onEditorUpdate:g,onContentError:_,onException:v,document:y,user:b,users:x,modules:S,...C}=e,w=e.documentMode??`editing`,T=e.role??`editor`,E=(0,c.useRef)(null),D=(0,c.useRef)(null),O=d(),k=i??`superdoc${O}`,A=k,j=`${k}-toolbar`,[M,N]=(0,c.useState)(!0),P=(0,c.useRef)({onReady:p,onEditorCreate:m,onEditorDestroy:h,onEditorUpdate:g,onContentError:_,onException:v});(0,c.useEffect)(()=>{P.current={onReady:p,onEditorCreate:m,onEditorDestroy:h,onEditorUpdate:g,onContentError:_,onException:v}},[p,m,h,g,_,v]);let F=(0,c.useRef)(null),I=(0,c.useRef)(!1),L=(0,c.useRef)(w);(0,c.useEffect)(()=>{L.current!==w&&(E.current?E.current.setDocumentMode(w):I.current&&(F.current=w)),L.current=w},[w]),(0,c.useImperativeHandle)(t,()=>({getInstance:()=>E.current}),[]),(0,c.useEffect)(()=>{N(!0),r(!1),I.current=!0;let e=!1,t=null;return(async()=>{try{let n=(await import(`superdoc`)).SuperDoc;if(e)return;t=new n({...C,selector:`#${CSS.escape(A)}`,...!o&&D.current?{toolbar:`#${CSS.escape(j)}`}:{},documentMode:w,role:T,contained:s,...y==null?{}:{document:y},...b?{user:b}:{},...x?{users:x}:{},...S?{modules:S}:{},onReady:t=>{e||(N(!1),I.current=!1,F.current&&F.current!==w&&(t.superdoc.setDocumentMode(F.current),F.current=null),P.current.onReady?.(t))},onEditorCreate:t=>{e||P.current.onEditorCreate?.(t)},onEditorDestroy:()=>{e||P.current.onEditorDestroy?.()},onEditorUpdate:t=>{e||P.current.onEditorUpdate?.(t)},onContentError:t=>{e||P.current.onContentError?.(t)},onException:t=>{e||P.current.onException?.(t)}}),E.current=t}catch(t){e||(I.current=!1,N(!1),r(!0),console.error(`[SuperDocEditor] Failed to initialize SuperDoc:`,t),P.current.onException?.({error:t}))}})(),()=>{I.current=!1,F.current=null,t&&(t.destroy(),E.current=null),e=!0}},[y,b,x,S,T,o,s,A,j]);let R=[`superdoc-wrapper`,u].filter(Boolean).join(` `),z=M?{display:`none`}:void 0;return(0,l.jsxs)(`div`,{className:R,style:{...f,...s&&{display:`flex`,flexDirection:`column`}},children:[!o&&(0,l.jsx)(`div`,{ref:D,id:j,className:`superdoc-toolbar-container`,style:z}),(0,l.jsx)(`div`,{id:A,className:`superdoc-editor-container`,style:{...z,...s&&{flex:1,minHeight:0}}}),M&&!n&&a&&(0,l.jsx)(`div`,{className:`superdoc-loading-container`,children:a()}),n&&(0,l.jsx)(`div`,{className:`superdoc-error-container`,children:`Failed to load editor. Check console for details.`})]})}const p=(0,c.forwardRef)(f);p.displayName=`SuperDocEditor`;var m=p;exports.SuperDocEditor=p,exports.default=m;

package/dist/index.d.ts

@@ -57,6 +57,9 @@ declare interface ReactProps {
     renderLoading?: () => ReactNode;
     /** Hide the toolbar container. When true, no toolbar is rendered. @default false */
     hideToolbar?: boolean;
+    /** Enable contained mode for fixed-height container embedding. When true, SuperDoc
+     *  fits within its parent's height and scrolls internally. @default false */
+    contained?: boolean;
     /** Additional CSS class name for the wrapper element */
     className?: string;
     /** Additional inline styles for the wrapper element */
@@ -107,13 +110,13 @@ export declare interface SuperDocEditorProps extends Omit<SuperDocConfig, Intern
 }
 
 /** Event passed to onEditorUpdate callback */
-export declare interface SuperDocEditorUpdateEvent {
-    editor: Editor;
-}
+export declare type SuperDocEditorUpdateEvent = Parameters<NonNullable<SuperDocConstructorConfig['onEditorUpdate']>>[0];
 
 /** Event passed to onException callback */
 export declare interface SuperDocExceptionEvent {
     error: Error;
+    editor?: Editor | null;
+    code?: string;
 }
 
 /** SuperDoc instance type - from superdoc package */
@@ -135,6 +138,9 @@ export declare interface SuperDocRef {
     getInstance(): SuperDocInstance | null;
 }
 
+/** Event passed to onTransaction callback */
+export declare type SuperDocTransactionEvent = Parameters<NonNullable<SuperDocConstructorConfig['onTransaction']>>[0];
+
 /** User object - extracted from Config.user */
 export declare type SuperDocUser = NonNullable<SuperDocConstructorConfig['user']>;
 

package/dist/index.js

@@ -1,117 +1,134 @@
-import { jsxs as O, jsx as a } from "react/jsx-runtime";
-import * as v from "react";
-import { forwardRef as Q, useState as F, useRef as s, useEffect as N, useImperativeHandle as V } from "react";
-function X() {
-  const n = v.useRef(null);
-  return n.current === null && (n.current = `-${Date.now()}-${Math.random().toString(36).slice(2, 9)}`), n.current;
+import * as React from "react";
+import { forwardRef, useEffect, useImperativeHandle, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+function useIdPolyfill() {
+	let s = React.useRef(null);
+	return s.current === null && (s.current = `-${Date.now()}-${Math.random().toString(36).slice(2, 9)}`), s.current;
 }
-const Y = typeof v.useId == "function" ? v.useId : X;
-function Z(n, H) {
-  const [x, w] = F(!1), {
-    // React-specific
-    id: B,
-    renderLoading: $,
-    hideToolbar: l = !1,
-    className: T,
-    style: W,
-    // Callbacks (stored in ref to avoid triggering rebuilds)
-    onReady: f,
-    onEditorCreate: p,
-    onEditorDestroy: m,
-    onEditorUpdate: E,
-    onContentError: y,
-    onException: D,
-    // Key props that trigger rebuild when changed
-    document: S,
-    user: I,
-    users: R,
-    modules: g,
-    // All other props passed through
-    ...q
-  } = n, o = n.documentMode ?? "editing", P = n.role ?? "editor", i = s(null), L = s(null), A = Y(), j = B ?? `superdoc${A}`, h = j, C = `${j}-toolbar`, [U, b] = F(!0), t = s({
-    onReady: f,
-    onEditorCreate: p,
-    onEditorDestroy: m,
-    onEditorUpdate: E,
-    onContentError: y,
-    onException: D
-  });
-  N(() => {
-    t.current = {
-      onReady: f,
-      onEditorCreate: p,
-      onEditorDestroy: m,
-      onEditorUpdate: E,
-      onContentError: y,
-      onException: D
-    };
-  }, [f, p, m, E, y, D]);
-  const c = s(null), u = s(!1), k = s(o);
-  N(() => {
-    k.current !== o && (i.current ? i.current.setDocumentMode(o) : u.current && (c.current = o)), k.current = o;
-  }, [o]), V(
-    H,
-    () => ({
-      getInstance: () => i.current
-    }),
-    []
-  ), N(() => {
-    b(!0), w(!1), u.current = !0;
-    let r = !1, d = null;
-    return (async () => {
-      try {
-        const J = (await import("superdoc")).SuperDoc;
-        if (r) return;
-        const K = {
-          ...q,
-          selector: `#${CSS.escape(h)}`,
-          // Use internal toolbar container unless hideToolbar is true
-          ...!l && L.current ? { toolbar: `#${CSS.escape(C)}` } : {},
-          documentMode: o,
-          role: P,
-          ...S != null ? { document: S } : {},
-          ...I ? { user: I } : {},
-          ...R ? { users: R } : {},
-          ...g ? { modules: g } : {},
-          // Wire up callbacks with lifecycle guards
-          onReady: (e) => {
-            r || (b(!1), u.current = !1, c.current && c.current !== o && (e.superdoc.setDocumentMode(c.current), c.current = null), t.current.onReady?.(e));
-          },
-          onEditorCreate: (e) => {
-            r || t.current.onEditorCreate?.(e);
-          },
-          onEditorDestroy: () => {
-            r || t.current.onEditorDestroy?.();
-          },
-          onEditorUpdate: (e) => {
-            r || t.current.onEditorUpdate?.(e);
-          },
-          onContentError: (e) => {
-            r || t.current.onContentError?.(e);
-          },
-          onException: (e) => {
-            r || t.current.onException?.(e);
-          }
-        };
-        d = new J(K), i.current = d;
-      } catch (M) {
-        r || (u.current = !1, b(!1), w(!0), console.error("[SuperDocEditor] Failed to initialize SuperDoc:", M), t.current.onException?.({ error: M }));
-      }
-    })(), () => {
-      u.current = !1, c.current = null, d && (d.destroy(), i.current = null), r = !0;
-    };
-  }, [S, I, R, g, P, l, h, C]);
-  const G = ["superdoc-wrapper", T].filter(Boolean).join(" "), z = U ? { display: "none" } : void 0;
-  return /* @__PURE__ */ O("div", { className: G, style: W, children: [
-    !l && /* @__PURE__ */ a("div", { ref: L, id: C, className: "superdoc-toolbar-container", style: z }),
-    /* @__PURE__ */ a("div", { id: h, className: "superdoc-editor-container", style: z }),
-    U && !x && $ && /* @__PURE__ */ a("div", { className: "superdoc-loading-container", children: $() }),
-    x && /* @__PURE__ */ a("div", { className: "superdoc-error-container", children: "Failed to load editor. Check console for details." })
-  ] });
+const useStableId = typeof React.useId == "function" ? React.useId : useIdPolyfill;
+function SuperDocEditorInner(e, s) {
+	let [l, u] = useState(!1), { id: d, renderLoading: f, hideToolbar: p = !1, contained: m = !1, className: h, style: g, onReady: _, onEditorCreate: v, onEditorDestroy: y, onEditorUpdate: b, onContentError: x, onException: S, document: C, user: w, users: T, modules: E, ...D } = e, O = e.documentMode ?? "editing", k = e.role ?? "editor", A = useRef(null), j = useRef(null), M = useStableId(), N = d ?? `superdoc${M}`, P = N, F = `${N}-toolbar`, [I, L] = useState(!0), R = useRef({
+		onReady: _,
+		onEditorCreate: v,
+		onEditorDestroy: y,
+		onEditorUpdate: b,
+		onContentError: x,
+		onException: S
+	});
+	useEffect(() => {
+		R.current = {
+			onReady: _,
+			onEditorCreate: v,
+			onEditorDestroy: y,
+			onEditorUpdate: b,
+			onContentError: x,
+			onException: S
+		};
+	}, [
+		_,
+		v,
+		y,
+		b,
+		x,
+		S
+	]);
+	let z = useRef(null), B = useRef(!1), V = useRef(O);
+	useEffect(() => {
+		V.current !== O && (A.current ? A.current.setDocumentMode(O) : B.current && (z.current = O)), V.current = O;
+	}, [O]), useImperativeHandle(s, () => ({ getInstance: () => A.current }), []), useEffect(() => {
+		L(!0), u(!1), B.current = !0;
+		let e = !1, s = null;
+		return (async () => {
+			try {
+				let c = (await import("superdoc")).SuperDoc;
+				if (e) return;
+				s = new c({
+					...D,
+					selector: `#${CSS.escape(P)}`,
+					...!p && j.current ? { toolbar: `#${CSS.escape(F)}` } : {},
+					documentMode: O,
+					role: k,
+					contained: m,
+					...C == null ? {} : { document: C },
+					...w ? { user: w } : {},
+					...T ? { users: T } : {},
+					...E ? { modules: E } : {},
+					onReady: (s) => {
+						e || (L(!1), B.current = !1, z.current && z.current !== O && (s.superdoc.setDocumentMode(z.current), z.current = null), R.current.onReady?.(s));
+					},
+					onEditorCreate: (s) => {
+						e || R.current.onEditorCreate?.(s);
+					},
+					onEditorDestroy: () => {
+						e || R.current.onEditorDestroy?.();
+					},
+					onEditorUpdate: (s) => {
+						e || R.current.onEditorUpdate?.(s);
+					},
+					onContentError: (s) => {
+						e || R.current.onContentError?.(s);
+					},
+					onException: (s) => {
+						e || R.current.onException?.(s);
+					}
+				}), A.current = s;
+			} catch (s) {
+				e || (B.current = !1, L(!1), u(!0), console.error("[SuperDocEditor] Failed to initialize SuperDoc:", s), R.current.onException?.({ error: s }));
+			}
+		})(), () => {
+			B.current = !1, z.current = null, s && (s.destroy(), A.current = null), e = !0;
+		};
+	}, [
+		C,
+		w,
+		T,
+		E,
+		k,
+		p,
+		m,
+		P,
+		F
+	]);
+	let H = ["superdoc-wrapper", h].filter(Boolean).join(" "), U = I ? { display: "none" } : void 0;
+	return /* @__PURE__ */ jsxs("div", {
+		className: H,
+		style: {
+			...g,
+			...m && {
+				display: "flex",
+				flexDirection: "column"
+			}
+		},
+		children: [
+			!p && /* @__PURE__ */ jsx("div", {
+				ref: j,
+				id: F,
+				className: "superdoc-toolbar-container",
+				style: U
+			}),
+			/* @__PURE__ */ jsx("div", {
+				id: P,
+				className: "superdoc-editor-container",
+				style: {
+					...U,
+					...m && {
+						flex: 1,
+						minHeight: 0
+					}
+				}
+			}),
+			I && !l && f && /* @__PURE__ */ jsx("div", {
+				className: "superdoc-loading-container",
+				children: f()
+			}),
+			l && /* @__PURE__ */ jsx("div", {
+				className: "superdoc-error-container",
+				children: "Failed to load editor. Check console for details."
+			})
+		]
+	});
 }
-const _ = Q(Z);
-_.displayName = "SuperDocEditor";
-export {
-  _ as SuperDocEditor,
-  _ as default
-};
+const SuperDocEditor = forwardRef(SuperDocEditorInner);
+SuperDocEditor.displayName = "SuperDocEditor";
+var SuperDocEditor_default = SuperDocEditor;
+export { SuperDocEditor, SuperDocEditor_default as default };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@superdoc-dev/react",
-  "version": "1.0.0-test.1",
+  "version": "1.1.0",
   "description": "Official React wrapper for the SuperDoc document editor",
   "type": "module",
   "main": "./dist/index.cjs",