@haklex/rich-ext-excalidraw 0.0.82 → 0.0.84

package/dist/ExcalidrawEditRenderer-CSchoC4Y.js

@@ -1,475 +0,0 @@
-import { t as __exportAll } from "./rolldown-runtime-CiIaOW0V.js";
-import { C as excalidrawHeaderActions, O as excalidrawStatusDot, S as excalidrawFullscreenPopup, T as excalidrawLoading, _ as excalidrawDialogTitle, b as excalidrawEditorContainer, d as excalidrawConfirmBtnDanger, f as excalidrawConfirmBtnPrimary, g as excalidrawDialogMeta, i as excalidrawActionBarBtn, j as useExcalidrawConfig, k as readonlyUIOptions, l as excalidrawConfirmActions, m as excalidrawDialogHeader, p as excalidrawDialogCanvas, t as useExcalidrawData, u as excalidrawConfirmBtn, v as excalidrawEditLabel, w as excalidrawHeaderClose, x as excalidrawError, y as excalidrawEditOverlay } from "./useExcalidrawData-DcXa8vqV.js";
-import { useCallback, useEffect, useRef, useState } from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { useColorScheme } from "@haklex/rich-editor";
-import { SegmentedControl, dismissTopDialog, presentDialog } from "@haklex/rich-editor-ui";
-import { usePortalTheme } from "@haklex/rich-style-token";
-import { Clipboard, Download, Pencil, Save, X } from "lucide-react";
-//#region src/ExcalidrawEditRenderer.tsx
-var ExcalidrawEditRenderer_exports = /* @__PURE__ */ __exportAll({ ExcalidrawEditRenderer: () => ExcalidrawEditRenderer });
-var SAVE_DEBOUNCE_MS = 2e3;
-var ExcalidrawEditorDialogContent = ({ dismiss, ExcalidrawComponent, initialData, initialSnapshot, theme, onSave, saveSnapshot, onClose, baseRef, baseData }) => {
-	const { className: portalClassName } = usePortalTheme();
-	const apiRef = useRef(null);
-	const saveTimerRef = useRef(void 0);
-	const [isDirty, setIsDirty] = useState(false);
-	const isDirtyRef = useRef(false);
-	const confirmDialogOpenRef = useRef(false);
-	const initializedRef = useRef(false);
-	const baseRefRef = useRef(baseRef);
-	const baseDataRef = useRef(baseData);
-	const [storageMode, setStorageMode] = useState(() => {
-		if (!saveSnapshot || !initialSnapshot) return "inline";
-		return initialSnapshot.type === "delta" ? "delta" : initialSnapshot.type === "remote" ? "remote" : "inline";
-	});
-	const storageModeRef = useRef(storageMode);
-	const [savedRef, setSavedRef] = useState(() => {
-		if (!saveSnapshot || !initialSnapshot) return "";
-		if (initialSnapshot.type === "remote") return initialSnapshot.url;
-		if (initialSnapshot.type === "delta") return initialSnapshot.baseUrl;
-		return "";
-	});
-	const [isSaving, setIsSaving] = useState(false);
-	useEffect(() => {
-		return () => {
-			if (saveTimerRef.current) clearTimeout(saveTimerRef.current);
-		};
-	}, []);
-	const getSnapshot = useCallback(() => {
-		const api = apiRef.current;
-		if (!api) return;
-		const appState = api.getAppState();
-		return {
-			elements: api.getSceneElements(),
-			appState: {
-				viewBackgroundColor: appState.viewBackgroundColor,
-				gridSize: appState.gridSize
-			},
-			files: api.getFiles()
-		};
-	}, []);
-	const performSave = useCallback(() => {
-		if (saveTimerRef.current) clearTimeout(saveTimerRef.current);
-		const doc = getSnapshot();
-		if (!doc) return Promise.resolve();
-		const mode = storageModeRef.current;
-		if (mode === "delta" && saveSnapshot) {
-			setIsSaving(true);
-			return (async () => {
-				try {
-					const currentBaseUrl = baseRefRef.current;
-					const currentBaseData = baseDataRef.current;
-					if (!currentBaseUrl || !currentBaseData) {
-						const ref = await saveSnapshot(doc, baseRefRef.current || void 0);
-						baseRefRef.current = ref;
-						baseDataRef.current = doc;
-						setSavedRef(ref);
-					}
-					isDirtyRef.current = false;
-					setIsDirty(false);
-				} finally {
-					setIsSaving(false);
-				}
-			})();
-		}
-		if (mode === "remote" && saveSnapshot) {
-			if (baseRefRef.current && baseDataRef.current && JSON.stringify(doc) === JSON.stringify(baseDataRef.current)) {
-				isDirtyRef.current = false;
-				setIsDirty(false);
-				return Promise.resolve();
-			}
-			setIsSaving(true);
-			return saveSnapshot(doc, baseRefRef.current || void 0).then((ref) => {
-				baseRefRef.current = ref;
-				baseDataRef.current = doc;
-				isDirtyRef.current = false;
-				setIsDirty(false);
-				setIsSaving(false);
-				setSavedRef(ref);
-			}, () => {
-				setIsSaving(false);
-			});
-		}
-		isDirtyRef.current = false;
-		setIsDirty(false);
-		return Promise.resolve();
-	}, [saveSnapshot, getSnapshot]);
-	const emitSnapshot = useCallback(async () => {
-		const doc = getSnapshot();
-		if (!doc) return;
-		const mode = storageModeRef.current;
-		if (mode === "delta" && saveSnapshot) {
-			const currentBaseUrl = baseRefRef.current;
-			const currentBaseData = baseDataRef.current;
-			if (currentBaseUrl && currentBaseData) {
-				const { diff } = await import("jsondiffpatch");
-				const delta = diff(currentBaseData, structuredClone(doc));
-				onSave(delta ? {
-					type: "delta",
-					baseUrl: currentBaseUrl,
-					delta
-				} : {
-					type: "remote",
-					url: currentBaseUrl
-				});
-			} else onSave({
-				type: "remote",
-				url: await saveSnapshot(doc, baseRefRef.current || void 0)
-			});
-			return;
-		}
-		if (mode === "remote") {
-			const ref = baseRefRef.current;
-			if (ref) onSave({
-				type: "remote",
-				url: ref
-			});
-			else if (saveSnapshot) onSave({
-				type: "remote",
-				url: await saveSnapshot(doc)
-			});
-			return;
-		}
-		onSave({
-			type: "inline",
-			data: doc
-		});
-	}, [
-		onSave,
-		saveSnapshot,
-		getSnapshot
-	]);
-	const handleChange = useCallback((elements) => {
-		if (!initializedRef.current) {
-			initializedRef.current = true;
-			return;
-		}
-		if (elements.length === 0) return;
-		if (!isDirtyRef.current) {
-			isDirtyRef.current = true;
-			setIsDirty(true);
-		}
-		if (saveTimerRef.current) clearTimeout(saveTimerRef.current);
-		saveTimerRef.current = setTimeout(() => performSave(), SAVE_DEBOUNCE_MS);
-	}, [performSave]);
-	const handleSaveAndClose = useCallback(() => {
-		performSave().then(async () => {
-			await emitSnapshot();
-			onClose(getSnapshot());
-			dismiss();
-		});
-	}, [
-		performSave,
-		emitSnapshot,
-		getSnapshot,
-		onClose,
-		dismiss
-	]);
-	const handleDiscard = useCallback(() => {
-		if (saveTimerRef.current) clearTimeout(saveTimerRef.current);
-		dismiss();
-	}, [dismiss]);
-	const showConfirmDialog = useCallback(() => {
-		if (confirmDialogOpenRef.current) return;
-		confirmDialogOpenRef.current = true;
-		presentDialog({
-			title: "Unsaved Changes",
-			description: "You have unsaved changes that will be lost if you close now.",
-			content: ({ dismiss: dismissConfirm }) => {
-				const wrappedDismiss = () => {
-					confirmDialogOpenRef.current = false;
-					dismissConfirm();
-				};
-				return /* @__PURE__ */ jsxs("div", {
-					className: excalidrawConfirmActions,
-					children: [
-						/* @__PURE__ */ jsx("button", {
-							className: excalidrawConfirmBtn,
-							type: "button",
-							onClick: wrappedDismiss,
-							children: "Continue Editing"
-						}),
-						/* @__PURE__ */ jsx("button", {
-							className: excalidrawConfirmBtnDanger,
-							type: "button",
-							onClick: () => {
-								wrappedDismiss();
-								handleDiscard();
-							},
-							children: "Discard"
-						}),
-						/* @__PURE__ */ jsx("button", {
-							className: excalidrawConfirmBtnPrimary,
-							type: "button",
-							onClick: () => {
-								wrappedDismiss();
-								handleSaveAndClose();
-							},
-							children: "Save & Close"
-						})
-					]
-				});
-			},
-			portalClassName,
-			theme,
-			showCloseButton: false,
-			clickOutsideToDismiss: false
-		});
-	}, [
-		handleDiscard,
-		handleSaveAndClose,
-		portalClassName,
-		theme
-	]);
-	const attemptClose = useCallback(() => {
-		if (isDirtyRef.current) showConfirmDialog();
-		else emitSnapshot().then(() => {
-			onClose(getSnapshot());
-			dismiss();
-		});
-	}, [
-		dismiss,
-		showConfirmDialog,
-		emitSnapshot,
-		getSnapshot,
-		onClose
-	]);
-	useEffect(() => {
-		const handleKeyDown = (e) => {
-			if (e.key === "Escape") {
-				e.preventDefault();
-				e.stopImmediatePropagation();
-				if (confirmDialogOpenRef.current) {
-					confirmDialogOpenRef.current = false;
-					dismissTopDialog();
-				} else attemptClose();
-			}
-		};
-		document.addEventListener("keydown", handleKeyDown, true);
-		return () => document.removeEventListener("keydown", handleKeyDown, true);
-	}, [attemptClose]);
-	const handleManualUpload = useCallback(() => {
-		performSave();
-	}, [performSave]);
-	const handleExportJson = useCallback(() => {
-		const doc = getSnapshot();
-		if (!doc) return;
-		const blob = new Blob([JSON.stringify(doc, null, 2)], { type: "application/json" });
-		const url = URL.createObjectURL(blob);
-		const a = document.createElement("a");
-		a.href = url;
-		a.download = "excalidraw-snapshot.json";
-		a.click();
-		URL.revokeObjectURL(url);
-	}, [getSnapshot]);
-	const handleCopyJson = useCallback(() => {
-		const doc = getSnapshot();
-		if (!doc) return;
-		navigator.clipboard.writeText(JSON.stringify(doc));
-	}, [getSnapshot]);
-	const handleRefChange = useCallback((e) => {
-		const { value } = e.target;
-		setSavedRef(value);
-		baseRefRef.current = value;
-		baseDataRef.current = void 0;
-	}, []);
-	const handleStorageModeChange = useCallback((newMode) => {
-		setStorageMode(newMode);
-		storageModeRef.current = newMode;
-		if (newMode === "inline") setSavedRef("");
-		performSave();
-	}, [performSave]);
-	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs("div", {
-		className: excalidrawDialogHeader,
-		children: [
-			/* @__PURE__ */ jsx("span", {
-				className: excalidrawStatusDot,
-				style: { backgroundColor: isDirty ? "#f59e0b" : "#22c55e" }
-			}),
-			/* @__PURE__ */ jsx("span", {
-				className: excalidrawDialogTitle,
-				children: "Canvas Editor"
-			}),
-			/* @__PURE__ */ jsx("span", {
-				className: excalidrawDialogMeta,
-				children: "excalidraw"
-			}),
-			/* @__PURE__ */ jsxs("div", {
-				className: excalidrawHeaderActions,
-				children: [
-					saveSnapshot && /* @__PURE__ */ jsxs(Fragment, { children: [
-						/* @__PURE__ */ jsx(SegmentedControl, {
-							value: storageMode,
-							items: [
-								{
-									value: "inline",
-									label: "Inline"
-								},
-								{
-									value: "remote",
-									label: "Remote"
-								},
-								{
-									value: "delta",
-									label: "Delta"
-								}
-							],
-							onChange: handleStorageModeChange
-						}),
-						/* @__PURE__ */ jsx("div", { className: "_1c3wdzlh" }),
-						/* @__PURE__ */ jsxs("button", {
-							className: "_1c3wdzlg",
-							disabled: isSaving,
-							type: "button",
-							onClick: handleManualUpload,
-							children: [/* @__PURE__ */ jsx(Save, { size: 14 }), /* @__PURE__ */ jsx("span", { children: isSaving ? "Saving..." : "Save" })]
-						}),
-						/* @__PURE__ */ jsx("div", { className: "_1c3wdzlh" })
-					] }),
-					/* @__PURE__ */ jsxs("button", {
-						className: excalidrawActionBarBtn,
-						type: "button",
-						onClick: handleExportJson,
-						children: [/* @__PURE__ */ jsx(Download, { size: 14 }), "JSON"]
-					}),
-					/* @__PURE__ */ jsxs("button", {
-						className: excalidrawActionBarBtn,
-						type: "button",
-						onClick: handleCopyJson,
-						children: [/* @__PURE__ */ jsx(Clipboard, { size: 14 }), "Copy"]
-					}),
-					storageMode !== "inline" && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("div", { className: "_1c3wdzlh" }), /* @__PURE__ */ jsx("input", {
-						className: "_1c3wdzli",
-						placeholder: "base URL / ref",
-						spellCheck: false,
-						type: "text",
-						value: savedRef,
-						onChange: handleRefChange
-					})] })
-				]
-			}),
-			/* @__PURE__ */ jsx("button", {
-				className: excalidrawHeaderClose,
-				type: "button",
-				onClick: attemptClose,
-				children: /* @__PURE__ */ jsx(X, { size: 18 })
-			})
-		]
-	}), /* @__PURE__ */ jsx("div", {
-		className: excalidrawDialogCanvas,
-		children: /* @__PURE__ */ jsx(ExcalidrawComponent, {
-			initialData,
-			theme,
-			excalidrawAPI: (api) => {
-				apiRef.current = api;
-			},
-			onChange: handleChange
-		})
-	})] });
-};
-var ExcalidrawEditRenderer = ({ snapshot, onSnapshotChange }) => {
-	const theme = useColorScheme();
-	const { saveSnapshot } = useExcalidrawConfig();
-	const { snapshot: initialData, loading: dataLoading, error: dataError, baseRef, baseData } = useExcalidrawData(snapshot);
-	const [ExcalidrawComponent, setExcalidrawComponent] = useState(null);
-	const [libLoading, setLibLoading] = useState(true);
-	const previewApiRef = useRef(null);
-	const initialDataRef = useRef(void 0);
-	const [previewKey, setPreviewKey] = useState(0);
-	const onSnapshotChangeRef = useRef(onSnapshotChange);
-	onSnapshotChangeRef.current = onSnapshotChange;
-	const saveSnapshotRef = useRef(saveSnapshot);
-	saveSnapshotRef.current = saveSnapshot;
-	const snapshotRef = useRef(snapshot);
-	snapshotRef.current = snapshot;
-	const { className: portalClassName } = usePortalTheme();
-	useEffect(() => {
-		if (initialData && !initialDataRef.current) initialDataRef.current = initialData;
-	}, [initialData]);
-	useEffect(() => {
-		import("@excalidraw/excalidraw").then((mod) => {
-			const Comp = mod.Excalidraw || mod.default?.Excalidraw;
-			if (Comp) setExcalidrawComponent(() => Comp);
-			setLibLoading(false);
-		}).catch(() => setLibLoading(false));
-	}, []);
-	const baseRefRef = useRef(baseRef);
-	const baseDataRefOuter = useRef(baseData);
-	useEffect(() => {
-		if (baseRef) baseRefRef.current = baseRef;
-	}, [baseRef]);
-	useEffect(() => {
-		if (baseData) baseDataRefOuter.current = baseData;
-	}, [baseData]);
-	const handleOpenEditor = useCallback(() => {
-		if (!ExcalidrawComponent || dataLoading) return;
-		presentDialog({
-			content: ({ dismiss }) => /* @__PURE__ */ jsx(ExcalidrawEditorDialogContent, {
-				ExcalidrawComponent,
-				baseData: baseDataRefOuter.current,
-				baseRef: baseRefRef.current,
-				dismiss,
-				initialData: initialDataRef.current,
-				initialSnapshot: snapshotRef.current,
-				saveSnapshot: saveSnapshotRef.current,
-				theme,
-				onSave: (ref) => onSnapshotChangeRef.current(ref),
-				onClose: (doc) => {
-					if (doc) {
-						initialDataRef.current = doc;
-						setPreviewKey((k) => k + 1);
-					}
-				}
-			}),
-			className: excalidrawFullscreenPopup,
-			portalClassName,
-			theme,
-			showCloseButton: false,
-			clickOutsideToDismiss: false
-		});
-	}, [
-		ExcalidrawComponent,
-		dataLoading,
-		theme,
-		portalClassName
-	]);
-	if (dataLoading || libLoading || !ExcalidrawComponent) return /* @__PURE__ */ jsx("div", {
-		className: excalidrawEditorContainer,
-		children: /* @__PURE__ */ jsx("div", {
-			className: excalidrawLoading,
-			children: "Loading excalidraw editor..."
-		})
-	});
-	if (dataError) return /* @__PURE__ */ jsx("div", {
-		className: excalidrawEditorContainer,
-		children: /* @__PURE__ */ jsx("div", {
-			className: excalidrawError,
-			children: dataError
-		})
-	});
-	return /* @__PURE__ */ jsxs("div", {
-		className: excalidrawEditorContainer,
-		children: [/* @__PURE__ */ jsx(ExcalidrawComponent, {
-			viewModeEnabled: true,
-			zenModeEnabled: true,
-			UIOptions: readonlyUIOptions,
-			initialData: initialDataRef.current,
-			theme,
-			excalidrawAPI: (api) => {
-				previewApiRef.current = api;
-				setTimeout(() => api.scrollToContent(), 100);
-			}
-		}, previewKey), /* @__PURE__ */ jsx("button", {
-			className: excalidrawEditOverlay,
-			type: "button",
-			onClick: handleOpenEditor,
-			children: /* @__PURE__ */ jsxs("span", {
-				className: excalidrawEditLabel,
-				children: [/* @__PURE__ */ jsx(Pencil, { size: 16 }), "Edit Whiteboard"]
-			})
-		})]
-	});
-};
-//#endregion
-export { ExcalidrawEditRenderer_exports as n, ExcalidrawEditRenderer as t };

package/dist/rolldown-runtime-CiIaOW0V.js

@@ -1,13 +0,0 @@
-//#region \0rolldown/runtime.js
-var __defProp = Object.defineProperty;
-var __exportAll = (all, no_symbols) => {
-	let target = {};
-	for (var name in all) __defProp(target, name, {
-		get: all[name],
-		enumerable: true
-	});
-	if (!no_symbols) __defProp(target, Symbol.toStringTag, { value: "Module" });
-	return target;
-};
-//#endregion
-export { __exportAll as t };

package/dist/transformer-DxW-N9IJ.js

@@ -1,88 +0,0 @@
-import { E as excalidrawPlaceholder } from "./useExcalidrawData-DcXa8vqV.js";
-import { r as _defineProperty } from "./ExcalidrawDisplayRenderer-C4fbKYqL.js";
-import { Suspense, createElement, lazy } from "react";
-import { jsx } from "react/jsx-runtime";
-import { ViewportGate } from "@haklex/rich-editor-ui";
-import { DecoratorNode } from "lexical";
-import { EXCALIDRAW_BLOCK_TRANSFORMER } from "@haklex/rich-headless/transformers";
-//#region src/ExcalidrawSSRRenderer.tsx
-var LazyDisplayRenderer = lazy(() => import("./ExcalidrawDisplayRenderer-C4fbKYqL.js").then((n) => n.n).then((m) => ({ default: m.ExcalidrawDisplayRenderer })));
-var ExcalidrawPlaceholder = ({ snapshot }) => {
-	let label = "Excalidraw Whiteboard";
-	try {
-		const data = JSON.parse(snapshot);
-		if (data && typeof data === "object") {
-			const elementCount = Array.isArray(data.elements) ? data.elements.length : 0;
-			if (elementCount > 0) label = `Excalidraw Whiteboard (${elementCount} elements)`;
-		}
-	} catch {}
-	return /* @__PURE__ */ jsx("div", {
-		"aria-label": label,
-		className: excalidrawPlaceholder,
-		children: /* @__PURE__ */ jsx("span", { children: label })
-	});
-};
-var ExcalidrawSSRRenderer = ({ snapshot }) => {
-	return /* @__PURE__ */ jsx(ViewportGate, {
-		fallback: /* @__PURE__ */ jsx(ExcalidrawPlaceholder, { snapshot }),
-		children: /* @__PURE__ */ jsx(Suspense, {
-			fallback: /* @__PURE__ */ jsx(ExcalidrawPlaceholder, { snapshot }),
-			children: /* @__PURE__ */ jsx(LazyDisplayRenderer, { snapshot })
-		})
-	});
-};
-//#endregion
-//#region src/ExcalidrawNode.ts
-var ExcalidrawNode = class ExcalidrawNode extends DecoratorNode {
-	static getType() {
-		return "excalidraw";
-	}
-	static clone(node) {
-		return new ExcalidrawNode(node.__snapshot, node.__key);
-	}
-	constructor(snapshot, key) {
-		super(key);
-		_defineProperty(this, "__snapshot", void 0);
-		this.__snapshot = snapshot;
-	}
-	createDOM(_config) {
-		const div = document.createElement("div");
-		div.className = "rich-excalidraw-wrapper";
-		return div;
-	}
-	updateDOM() {
-		return false;
-	}
-	isInline() {
-		return false;
-	}
-	static importJSON(serializedNode) {
-		return $createExcalidrawNode(serializedNode.snapshot);
-	}
-	exportJSON() {
-		return {
-			...super.exportJSON(),
-			type: "excalidraw",
-			snapshot: this.__snapshot,
-			version: 1
-		};
-	}
-	getSnapshot() {
-		return this.__snapshot;
-	}
-	setSnapshot(snapshot) {
-		const writable = this.getWritable();
-		writable.__snapshot = snapshot;
-	}
-	decorate(_editor, _config) {
-		return createElement(ExcalidrawSSRRenderer, { snapshot: this.__snapshot });
-	}
-};
-function $createExcalidrawNode(snapshot) {
-	return new ExcalidrawNode(snapshot);
-}
-function $isExcalidrawNode(node) {
-	return node instanceof ExcalidrawNode;
-}
-//#endregion
-export { ExcalidrawSSRRenderer as a, ExcalidrawNode as i, $createExcalidrawNode as n, $isExcalidrawNode as r, EXCALIDRAW_BLOCK_TRANSFORMER as t };