@superdoc-dev/react 1.2.0-next.8 → 1.2.0

package/dist/index.cjs

@@ -1 +1 @@
-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;
+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){let t=c.useRef(e),n=c.useRef(e);return t.current!==e&&(p(n.current,e)||(n.current=e),t.current=e),n.current}function p(e,t){if(e===t)return!0;if(e==null||t==null)return e===t;try{return JSON.stringify(e)===JSON.stringify(t)}catch{return!1}}function m(e,t){let[n,r]=(0,c.useState)(!1),{id:i,renderLoading:a,hideToolbar:o=!1,contained:s=!1,className:u,style:p,onReady:m,onEditorCreate:h,onEditorDestroy:g,onEditorUpdate:_,onTransaction:v,onContentError:y,onException:b,document:x,user:S,users:C,modules:w,...T}=e,E=e.documentMode??`editing`,D=e.role??`editor`,O=f(S),k=f(C),A=(0,c.useRef)(null),j=(0,c.useRef)(null),M=d(),N=i??`superdoc${M}`,P=N,F=`${N}-toolbar`,[I,L]=(0,c.useState)(!0),R=(0,c.useRef)({onReady:m,onEditorCreate:h,onEditorDestroy:g,onEditorUpdate:_,onTransaction:v,onContentError:y,onException:b});(0,c.useEffect)(()=>{R.current={onReady:m,onEditorCreate:h,onEditorDestroy:g,onEditorUpdate:_,onTransaction:v,onContentError:y,onException:b}},[m,h,g,_,v,y,b]);let z=(0,c.useRef)(null),B=(0,c.useRef)(!1),V=(0,c.useRef)(E);(0,c.useEffect)(()=>{V.current!==E&&(A.current?A.current.setDocumentMode(E):B.current&&(z.current=E)),V.current=E},[E]),(0,c.useImperativeHandle)(t,()=>({getInstance:()=>A.current}),[]),(0,c.useEffect)(()=>{L(!0),r(!1),B.current=!0;let e=!1,t=null;return(async()=>{try{let n=(await import(`superdoc`)).SuperDoc;if(e)return;t=new n({...T,selector:`#${CSS.escape(P)}`,...!o&&j.current?{toolbar:`#${CSS.escape(F)}`}:{},documentMode:E,role:D,contained:s,...x==null?{}:{document:x},...O?{user:O}:{},...k?{users:k}:{},...w?{modules:w}:{},onReady:t=>{e||(L(!1),B.current=!1,z.current&&z.current!==E&&(t.superdoc.setDocumentMode(z.current),z.current=null),R.current.onReady?.(t))},onEditorCreate:t=>{e||R.current.onEditorCreate?.(t)},onEditorDestroy:()=>{e||R.current.onEditorDestroy?.()},onEditorUpdate:t=>{e||R.current.onEditorUpdate?.(t)},onTransaction:t=>{e||R.current.onTransaction?.(t)},onContentError:t=>{e||R.current.onContentError?.(t)},onException:t=>{e||R.current.onException?.(t)}}),A.current=t}catch(t){e||(B.current=!1,L(!1),r(!0),console.error(`[SuperDocEditor] Failed to initialize SuperDoc:`,t),R.current.onException?.({error:t}))}})(),()=>{B.current=!1,z.current=null,t&&(t.destroy(),A.current=null),e=!0}},[x,O,k,w,D,o,s,P,F]);let H=[`superdoc-wrapper`,u].filter(Boolean).join(` `),U=I?{display:`none`}:void 0;return(0,l.jsxs)(`div`,{className:H,style:{...p,...s&&{display:`flex`,flexDirection:`column`}},children:[!o&&(0,l.jsx)(`div`,{ref:j,id:F,className:`superdoc-toolbar-container`,style:U}),(0,l.jsx)(`div`,{id:P,className:`superdoc-editor-container`,style:{...U,...s&&{flex:1,minHeight:0}}}),I&&!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 h=(0,c.forwardRef)(m);h.displayName=`SuperDocEditor`;var g=h;exports.SuperDocEditor=h,exports.default=g;

package/dist/index.d.ts

@@ -18,6 +18,8 @@ export declare interface CallbackProps {
     onEditorDestroy?: () => void;
     /** Callback when document content is updated */
     onEditorUpdate?: (event: SuperDocEditorUpdateEvent) => void;
+    /** Callback when a transaction is emitted */
+    onTransaction?: (event: SuperDocTransactionEvent) => void;
     /** Callback when there is a content parsing error */
     onContentError?: (event: SuperDocContentErrorEvent) => void;
     /** Callback when an exception is thrown */
@@ -29,11 +31,14 @@ export declare type DocumentMode = NonNullable<SuperDocConstructorConfig['docume
 
 export { Editor }
 
+/** Surface where an editor event originated. */
+export declare type EditorSurface = 'body' | 'header' | 'footer';
+
 /**
  * Callback props that are explicitly typed in CallbackProps.
  * These are excluded from SuperDocConfig to avoid type conflicts.
  */
-declare type ExplicitCallbackProps = 'onReady' | 'onEditorCreate' | 'onEditorDestroy' | 'onEditorUpdate' | 'onContentError' | 'onException';
+declare type ExplicitCallbackProps = 'onReady' | 'onEditorCreate' | 'onEditorDestroy' | 'onEditorUpdate' | 'onTransaction' | 'onContentError' | 'onException';
 
 /**
  * Props managed internally by the React component (not exposed to users).
@@ -109,8 +114,19 @@ export declare interface SuperDocEditorCreateEvent {
 export declare interface SuperDocEditorProps extends Omit<SuperDocConfig, InternalProps | OptionalInReact | ExplicitCallbackProps>, Partial<Pick<SuperDocConfig, OptionalInReact>>, CallbackProps, ReactProps {
 }
 
-/** Event passed to onEditorUpdate callback */
-export declare type SuperDocEditorUpdateEvent = Parameters<NonNullable<SuperDocConstructorConfig['onEditorUpdate']>>[0];
+/** Event passed to onEditorUpdate callback. Mirrors superdoc's EditorUpdateEvent. */
+export declare interface SuperDocEditorUpdateEvent {
+    /** The primary editor associated with the update. For header/footer edits, this is the main body editor. */
+    editor: Editor;
+    /** The editor instance that emitted the update. For body edits, this matches `editor`. */
+    sourceEditor: Editor;
+    /** The surface where the edit originated. */
+    surface: EditorSurface;
+    /** Relationship ID for header/footer edits. */
+    headerId?: string | null;
+    /** Header/footer variant (`default`, `first`, `even`, `odd`) when available. */
+    sectionType?: string | null;
+}
 
 /** Event passed to onException callback */
 export declare interface SuperDocExceptionEvent {
@@ -138,8 +154,23 @@ export declare interface SuperDocRef {
     getInstance(): SuperDocInstance | null;
 }
 
-/** Event passed to onTransaction callback */
-export declare type SuperDocTransactionEvent = Parameters<NonNullable<SuperDocConstructorConfig['onTransaction']>>[0];
+/** Event passed to onTransaction callback. Mirrors superdoc's EditorTransactionEvent. */
+export declare interface SuperDocTransactionEvent {
+    /** The primary editor associated with the transaction. For header/footer edits, this is the main body editor. */
+    editor: Editor;
+    /** The editor instance that emitted the transaction. For body edits, this matches `editor`. */
+    sourceEditor: Editor;
+    /** The ProseMirror transaction or transaction-like payload emitted by the source editor. */
+    transaction: any;
+    /** Time spent applying the transaction, in milliseconds. */
+    duration?: number;
+    /** The surface where the transaction originated. */
+    surface: EditorSurface;
+    /** Relationship ID for header/footer edits. */
+    headerId?: string | null;
+    /** Header/footer variant (`default`, `first`, `even`, `odd`) when available. */
+    sectionType?: string | null;
+}
 
 /** User object - extracted from Config.user */
 export declare type SuperDocUser = NonNullable<SuperDocConstructorConfig['user']>;

package/dist/index.js

@@ -6,122 +6,141 @@ function useIdPolyfill() {
 	return s.current === null && (s.current = `-${Date.now()}-${Math.random().toString(36).slice(2, 9)}`), s.current;
 }
 const useStableId = typeof React.useId == "function" ? React.useId : useIdPolyfill;
+function useMemoByValue(s) {
+	let c = React.useRef(s), l = React.useRef(s);
+	return c.current !== s && (shallowJsonEqual(l.current, s) || (l.current = s), c.current = s), l.current;
+}
+function shallowJsonEqual(e, s) {
+	if (e === s) return !0;
+	if (e == null || s == null) return e === s;
+	try {
+		return JSON.stringify(e) === JSON.stringify(s);
+	} catch {
+		return !1;
+	}
+}
 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
+	let [u, d] = useState(!1), { id: f, renderLoading: p, hideToolbar: m = !1, contained: h = !1, className: g, style: _, onReady: v, onEditorCreate: y, onEditorDestroy: b, onEditorUpdate: x, onTransaction: S, onContentError: C, onException: w, document: T, user: E, users: D, modules: O, ...k } = e, A = e.documentMode ?? "editing", j = e.role ?? "editor", M = useMemoByValue(E), N = useMemoByValue(D), P = useRef(null), F = useRef(null), I = useStableId(), L = f ?? `superdoc${I}`, R = L, z = `${L}-toolbar`, [B, V] = useState(!0), H = useRef({
+		onReady: v,
+		onEditorCreate: y,
+		onEditorDestroy: b,
+		onEditorUpdate: x,
+		onTransaction: S,
+		onContentError: C,
+		onException: w
 	});
 	useEffect(() => {
-		R.current = {
-			onReady: _,
-			onEditorCreate: v,
-			onEditorDestroy: y,
-			onEditorUpdate: b,
-			onContentError: x,
-			onException: S
+		H.current = {
+			onReady: v,
+			onEditorCreate: y,
+			onEditorDestroy: b,
+			onEditorUpdate: x,
+			onTransaction: S,
+			onContentError: C,
+			onException: w
 		};
 	}, [
-		_,
 		v,
 		y,
 		b,
 		x,
-		S
+		S,
+		C,
+		w
 	]);
-	let z = useRef(null), B = useRef(!1), V = useRef(O);
+	let U = useRef(null), W = useRef(!1), G = useRef(A);
 	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;
+		G.current !== A && (P.current ? P.current.setDocumentMode(A) : W.current && (U.current = A)), G.current = A;
+	}, [A]), useImperativeHandle(s, () => ({ getInstance: () => P.current }), []), useEffect(() => {
+		V(!0), d(!1), W.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 } : {},
+					...k,
+					selector: `#${CSS.escape(R)}`,
+					...!m && F.current ? { toolbar: `#${CSS.escape(z)}` } : {},
+					documentMode: A,
+					role: j,
+					contained: h,
+					...T == null ? {} : { document: T },
+					...M ? { user: M } : {},
+					...N ? { users: N } : {},
+					...O ? { modules: O } : {},
 					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));
+						e || (V(!1), W.current = !1, U.current && U.current !== A && (s.superdoc.setDocumentMode(U.current), U.current = null), H.current.onReady?.(s));
 					},
 					onEditorCreate: (s) => {
-						e || R.current.onEditorCreate?.(s);
+						e || H.current.onEditorCreate?.(s);
 					},
 					onEditorDestroy: () => {
-						e || R.current.onEditorDestroy?.();
+						e || H.current.onEditorDestroy?.();
 					},
 					onEditorUpdate: (s) => {
-						e || R.current.onEditorUpdate?.(s);
+						e || H.current.onEditorUpdate?.(s);
+					},
+					onTransaction: (s) => {
+						e || H.current.onTransaction?.(s);
 					},
 					onContentError: (s) => {
-						e || R.current.onContentError?.(s);
+						e || H.current.onContentError?.(s);
 					},
 					onException: (s) => {
-						e || R.current.onException?.(s);
+						e || H.current.onException?.(s);
 					}
-				}), A.current = s;
+				}), P.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 }));
+				e || (W.current = !1, V(!1), d(!0), console.error("[SuperDocEditor] Failed to initialize SuperDoc:", s), H.current.onException?.({ error: s }));
 			}
 		})(), () => {
-			B.current = !1, z.current = null, s && (s.destroy(), A.current = null), e = !0;
+			W.current = !1, U.current = null, s && (s.destroy(), P.current = null), e = !0;
 		};
 	}, [
-		C,
-		w,
 		T,
-		E,
-		k,
-		p,
+		M,
+		N,
+		O,
+		j,
 		m,
-		P,
-		F
+		h,
+		R,
+		z
 	]);
-	let H = ["superdoc-wrapper", h].filter(Boolean).join(" "), U = I ? { display: "none" } : void 0;
+	let K = ["superdoc-wrapper", g].filter(Boolean).join(" "), q = B ? { display: "none" } : void 0;
 	return /* @__PURE__ */ jsxs("div", {
-		className: H,
+		className: K,
 		style: {
-			...g,
-			...m && {
+			..._,
+			...h && {
 				display: "flex",
 				flexDirection: "column"
 			}
 		},
 		children: [
-			!p && /* @__PURE__ */ jsx("div", {
-				ref: j,
-				id: F,
+			!m && /* @__PURE__ */ jsx("div", {
+				ref: F,
+				id: z,
 				className: "superdoc-toolbar-container",
-				style: U
+				style: q
 			}),
 			/* @__PURE__ */ jsx("div", {
-				id: P,
+				id: R,
 				className: "superdoc-editor-container",
 				style: {
-					...U,
-					...m && {
+					...q,
+					...h && {
 						flex: 1,
 						minHeight: 0
 					}
 				}
 			}),
-			I && !l && f && /* @__PURE__ */ jsx("div", {
+			B && !u && p && /* @__PURE__ */ jsx("div", {
 				className: "superdoc-loading-container",
-				children: f()
+				children: p()
 			}),
-			l && /* @__PURE__ */ jsx("div", {
+			u && /* @__PURE__ */ jsx("div", {
 				className: "superdoc-error-container",
 				children: "Failed to load editor. Check console for details."
 			})

package/package.json

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