@haklex/rich-ext-dynamic 0.25.0

package/dist/DynamicEditNode.d.ts

@@ -0,0 +1,14 @@
+import { CommandItemConfig } from '@haklex/rich-editor/commands';
+import { EditorConfig, LexicalEditor, LexicalNode, NodeKey } from 'lexical';
+import { ReactElement } from 'react';
+import { DynamicNodePayload, SerializedDynamicNode, DynamicNode } from './DynamicNode';
+export declare class DynamicEditNode extends DynamicNode {
+    static commandItems: CommandItemConfig[];
+    static clone(node: DynamicEditNode): DynamicEditNode;
+    constructor(url: string, props?: Record<string, unknown>, initialHeight?: number, key?: NodeKey);
+    static importJSON(serializedNode: SerializedDynamicNode): DynamicEditNode;
+    decorate(editor: LexicalEditor, config: EditorConfig): ReactElement;
+}
+export declare function $createDynamicEditNode(payload?: Partial<DynamicNodePayload>): DynamicEditNode;
+export declare function $isDynamicEditNode(node: LexicalNode | null | undefined): node is DynamicEditNode;
+//# sourceMappingURL=DynamicEditNode.d.ts.map

package/dist/DynamicEditNode.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DynamicEditNode.d.ts","sourceRoot":"","sources":["../src/DynamicEditNode.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,8BAA8B,CAAC;AACtE,OAAO,KAAK,EAAE,YAAY,EAAE,aAAa,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAGjF,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAG1C,OAAO,KAAK,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC;AAC/E,OAAO,EAA0B,WAAW,EAAE,MAAM,eAAe,CAAC;AAQpE,qBAAa,eAAgB,SAAQ,WAAW;IAC9C,MAAM,CAAC,YAAY,EAAE,iBAAiB,EAAE,CAetC;IAEF,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE,eAAe,GAAG,eAAe;gBAKlD,GAAG,EAAE,MAAM,EACX,KAAK,GAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAM,EACnC,aAAa,GAAE,MAA+B,EAC9C,GAAG,CAAC,EAAE,OAAO;IAKf,MAAM,CAAC,UAAU,CAAC,cAAc,EAAE,qBAAqB,GAAG,eAAe;IAQzE,QAAQ,CAAC,MAAM,EAAE,aAAa,EAAE,MAAM,EAAE,YAAY,GAAG,YAAY;CAqBpE;AAED,wBAAgB,sBAAsB,CAAC,OAAO,GAAE,OAAO,CAAC,kBAAkB,CAAM,GAAG,eAAe,CAMjG;AAED,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI,GAAG,SAAS,GAAG,IAAI,IAAI,eAAe,CAEhG"}

package/dist/DynamicEditRenderer.d.ts

@@ -0,0 +1,7 @@
+import { NodeKey } from 'lexical';
+import { DynamicSlotProps } from './slot';
+export interface DynamicEditRendererProps extends DynamicSlotProps {
+    nodeKey: NodeKey;
+}
+export declare function DynamicEditRenderer(props: DynamicEditRendererProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=DynamicEditRenderer.d.ts.map

package/dist/DynamicEditRenderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DynamicEditRenderer.d.ts","sourceRoot":"","sources":["../src/DynamicEditRenderer.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AASvC,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,QAAQ,CAAC;AAG/C,MAAM,WAAW,wBAAyB,SAAQ,gBAAgB;IAChE,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,wBAAwB,2CAclE"}

package/dist/DynamicHostRenderer.d.ts

@@ -0,0 +1,6 @@
+import { DynamicSlotProps } from './slot';
+export interface DynamicHostRendererProps extends DynamicSlotProps {
+    validateUrl?: (url: string) => boolean;
+}
+export declare function DynamicHostRenderer({ url, componentProps, initialHeight, validateUrl, }: DynamicHostRendererProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=DynamicHostRenderer.d.ts.map

package/dist/DynamicHostRenderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DynamicHostRenderer.d.ts","sourceRoot":"","sources":["../src/DynamicHostRenderer.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,QAAQ,CAAC;AAG/C,MAAM,WAAW,wBAAyB,SAAQ,gBAAgB;IAChE,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC;CACxC;AAaD,wBAAgB,mBAAmB,CAAC,EAClC,GAAG,EACH,cAAc,EACd,aAAa,EACb,WAAW,GACZ,EAAE,wBAAwB,2CAgH1B"}

package/dist/DynamicNode-BVlebpiA.js

@@ -0,0 +1,283 @@
+import { DecoratorNode } from "lexical";
+import { useEffect, useRef, useState } from "react";
+import { createRendererDecoration, useColorScheme } from "@haklex/rich-editor/static";
+import { ViewportGate } from "@haklex/rich-editor-ui";
+import { isDynamicComponentModule } from "@haklex/rich-dynamic-protocol";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/styles.css.ts
+var semanticClassNames = {
+	root: "rich-dynamic-root",
+	host: "rich-dynamic-host",
+	placeholder: "rich-dynamic-placeholder",
+	error: "rich-dynamic-error",
+	settingsButton: "rich-dynamic-settings-button",
+	editPanel: "rich-dynamic-edit-panel",
+	editField: "rich-dynamic-edit-field",
+	editFieldIcon: "rich-dynamic-edit-field-icon",
+	editInput: "rich-dynamic-edit-input",
+	editTextarea: "rich-dynamic-edit-textarea",
+	editError: "rich-dynamic-edit-error"
+};
+var root = "_1b17zou0";
+var host = "_1b17zou1";
+var overlay = "_1b17zou2";
+var settingsButton = "_1b17zou5";
+var editPanel = "_1b17zou6";
+var editField = "_1b17zou7";
+var editFieldIcon = "_1b17zou8";
+var editInput = "_1b17zou9";
+var editTextarea = "_1b17zoua";
+var editError = "_1b17zoub";
+//#endregion
+//#region src/DynamicHostRenderer.tsx
+function parseProps(json) {
+	try {
+		const value = JSON.parse(json);
+		return value && typeof value === "object" ? value : {};
+	} catch {
+		return {};
+	}
+}
+function DynamicHostRenderer({ url, componentProps, initialHeight, validateUrl }) {
+	const hostRef = useRef(null);
+	const handleRef = useRef(null);
+	const latestInputRef = useRef(null);
+	const [status, setStatus] = useState("loading");
+	const [attempt, setAttempt] = useState(0);
+	const theme = useColorScheme();
+	const propsJson = JSON.stringify(componentProps ?? {});
+	useEffect(() => {
+		const input = {
+			props: parseProps(propsJson),
+			host: { theme }
+		};
+		latestInputRef.current = input;
+		handleRef.current?.update?.(input);
+	}, [propsJson, theme]);
+	useEffect(() => {
+		const container = hostRef.current?.shadowRoot?.firstElementChild;
+		if (container instanceof HTMLElement) container.style.minHeight = `${initialHeight}px`;
+	}, [initialHeight]);
+	useEffect(() => {
+		const hostEl = hostRef.current;
+		if (!hostEl || !url) return;
+		if (validateUrl && !validateUrl(url)) {
+			setStatus("error");
+			return;
+		}
+		let cancelled = false;
+		setStatus("loading");
+		const shadow = hostEl.shadowRoot ?? hostEl.attachShadow({ mode: "open" });
+		shadow.replaceChildren();
+		const container = document.createElement("div");
+		container.style.minHeight = `${initialHeight}px`;
+		shadow.append(container);
+		import(
+			/* @vite-ignore */
+			url
+).then((mod) => {
+			if (cancelled) return;
+			const component = mod?.default;
+			if (!isDynamicComponentModule(component)) throw new Error("module default export does not implement the dynamic mount protocol");
+			const input = latestInputRef.current ?? {
+				props: parseProps(propsJson),
+				host: { theme }
+			};
+			handleRef.current = component.mount(container, input);
+			setStatus("mounted");
+		}).catch((error) => {
+			if (cancelled) return;
+			console.error("[DynamicHostRenderer]", error);
+			setStatus("error");
+		});
+		return () => {
+			cancelled = true;
+			try {
+				handleRef.current?.unmount();
+			} catch (error) {
+				console.error("[DynamicHostRenderer]", error);
+			}
+			handleRef.current = null;
+		};
+	}, [
+		url,
+		attempt,
+		validateUrl
+	]);
+	if (!url) return /* @__PURE__ */ jsx("div", {
+		className: `${root} ${semanticClassNames.root}`,
+		style: { minHeight: initialHeight },
+		children: /* @__PURE__ */ jsx("div", {
+			className: `${overlay} ${semanticClassNames.placeholder}`,
+			children: /* @__PURE__ */ jsx("span", { children: "No component URL" })
+		})
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		className: `${root} ${semanticClassNames.root}`,
+		style: { minHeight: initialHeight },
+		children: [
+			/* @__PURE__ */ jsx("div", {
+				className: `${host} ${semanticClassNames.host}`,
+				ref: hostRef
+			}),
+			status === "loading" && /* @__PURE__ */ jsx("div", {
+				className: `_1b17zou2 ${semanticClassNames.placeholder}`,
+				children: /* @__PURE__ */ jsx("span", { children: "Loading component…" })
+			}),
+			status === "error" && /* @__PURE__ */ jsxs("div", {
+				className: `_1b17zou2 ${semanticClassNames.error}`,
+				children: [
+					/* @__PURE__ */ jsx("span", { children: "Failed to load component" }),
+					/* @__PURE__ */ jsx("span", {
+						className: "_1b17zou4",
+						children: url
+					}),
+					/* @__PURE__ */ jsx("button", {
+						className: "_1b17zou3",
+						type: "button",
+						onClick: () => setAttempt((n) => n + 1),
+						children: "Retry"
+					})
+				]
+			})
+		]
+	});
+}
+//#endregion
+//#region src/DynamicSSRRenderer.tsx
+var DynamicPlaceholder = ({ initialHeight }) => /* @__PURE__ */ jsx("div", {
+	"aria-label": "Interactive component",
+	className: `${root} ${semanticClassNames.root}`,
+	style: { minHeight: initialHeight },
+	children: /* @__PURE__ */ jsx("div", {
+		className: `${overlay} ${semanticClassNames.placeholder}`,
+		children: /* @__PURE__ */ jsx("span", { children: "Interactive component" })
+	})
+});
+var DynamicSSRRenderer = (props) => {
+	return /* @__PURE__ */ jsx(ViewportGate, {
+		fallback: /* @__PURE__ */ jsx(DynamicPlaceholder, { initialHeight: props.initialHeight }),
+		children: /* @__PURE__ */ jsx(DynamicHostRenderer, { ...props })
+	});
+};
+//#endregion
+//#region src/slot.ts
+var DYNAMIC_NODE_KEY = "Dynamic";
+//#endregion
+//#region \0@oxc-project+runtime@0.132.0/helpers/typeof.js
+function _typeof(o) {
+	"@babel/helpers - typeof";
+	return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o) {
+		return typeof o;
+	} : function(o) {
+		return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
+	}, _typeof(o);
+}
+//#endregion
+//#region \0@oxc-project+runtime@0.132.0/helpers/toPrimitive.js
+function toPrimitive(t, r) {
+	if ("object" != _typeof(t) || !t) return t;
+	var e = t[Symbol.toPrimitive];
+	if (void 0 !== e) {
+		var i = e.call(t, r || "default");
+		if ("object" != _typeof(i)) return i;
+		throw new TypeError("@@toPrimitive must return a primitive value.");
+	}
+	return ("string" === r ? String : Number)(t);
+}
+//#endregion
+//#region \0@oxc-project+runtime@0.132.0/helpers/toPropertyKey.js
+function toPropertyKey(t) {
+	var i = toPrimitive(t, "string");
+	return "symbol" == _typeof(i) ? i : i + "";
+}
+//#endregion
+//#region \0@oxc-project+runtime@0.132.0/helpers/defineProperty.js
+function _defineProperty(e, r, t) {
+	return (r = toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
+		value: t,
+		enumerable: !0,
+		configurable: !0,
+		writable: !0
+	}) : e[r] = t, e;
+}
+//#endregion
+//#region src/DynamicNode.ts
+var DEFAULT_DYNAMIC_HEIGHT = 320;
+var DynamicNode = class DynamicNode extends DecoratorNode {
+	static getType() {
+		return "dynamic";
+	}
+	static clone(node) {
+		return new DynamicNode(node.__url, node.__props, node.__initialHeight, node.__key);
+	}
+	constructor(url, props = {}, initialHeight = 320, key) {
+		super(key);
+		_defineProperty(this, "__url", void 0);
+		_defineProperty(this, "__props", void 0);
+		_defineProperty(this, "__initialHeight", void 0);
+		this.__url = url;
+		this.__props = props;
+		this.__initialHeight = initialHeight;
+	}
+	createDOM(_config) {
+		const div = document.createElement("div");
+		div.className = "rich-dynamic-wrapper";
+		return div;
+	}
+	updateDOM() {
+		return false;
+	}
+	isInline() {
+		return false;
+	}
+	static importJSON(serializedNode) {
+		return $createDynamicNode(serializedNode);
+	}
+	exportJSON() {
+		return {
+			...super.exportJSON(),
+			type: "dynamic",
+			url: this.__url,
+			props: this.__props,
+			initialHeight: this.__initialHeight,
+			version: 1
+		};
+	}
+	getUrl() {
+		return this.getLatest().__url;
+	}
+	setUrl(url) {
+		const writable = this.getWritable();
+		writable.__url = url;
+	}
+	getProps() {
+		return this.getLatest().__props;
+	}
+	setProps(props) {
+		const writable = this.getWritable();
+		writable.__props = props;
+	}
+	getInitialHeight() {
+		return this.getLatest().__initialHeight;
+	}
+	setInitialHeight(initialHeight) {
+		const writable = this.getWritable();
+		writable.__initialHeight = initialHeight;
+	}
+	decorate(_editor, _config) {
+		return createRendererDecoration(DYNAMIC_NODE_KEY, DynamicSSRRenderer, {
+			url: this.__url,
+			componentProps: this.__props,
+			initialHeight: this.__initialHeight
+		});
+	}
+};
+function $createDynamicNode(payload = {}) {
+	return new DynamicNode(payload.url ?? "", payload.props ?? {}, payload.initialHeight ?? 320);
+}
+function $isDynamicNode(node) {
+	return node instanceof DynamicNode;
+}
+//#endregion
+export { semanticClassNames as _, _defineProperty as a, DynamicHostRenderer as c, editFieldIcon as d, editInput as f, root as g, overlay as h, DynamicNode as i, editError as l, editTextarea as m, $isDynamicNode as n, DYNAMIC_NODE_KEY as o, editPanel as p, DEFAULT_DYNAMIC_HEIGHT as r, DynamicSSRRenderer as s, $createDynamicNode as t, editField as u, settingsButton as v };

package/dist/DynamicNode.d.ts

@@ -0,0 +1,32 @@
+import { EditorConfig, LexicalEditor, LexicalNode, NodeKey, SerializedLexicalNode, Spread, DecoratorNode } from 'lexical';
+import { ReactElement } from 'react';
+export interface DynamicNodePayload {
+    initialHeight: number;
+    props: Record<string, unknown>;
+    url: string;
+}
+export type SerializedDynamicNode = Spread<DynamicNodePayload, SerializedLexicalNode>;
+export declare const DEFAULT_DYNAMIC_HEIGHT = 320;
+export declare class DynamicNode extends DecoratorNode<ReactElement> {
+    __url: string;
+    __props: Record<string, unknown>;
+    __initialHeight: number;
+    static getType(): string;
+    static clone(node: DynamicNode): DynamicNode;
+    constructor(url: string, props?: Record<string, unknown>, initialHeight?: number, key?: NodeKey);
+    createDOM(_config: EditorConfig): HTMLElement;
+    updateDOM(): boolean;
+    isInline(): boolean;
+    static importJSON(serializedNode: SerializedDynamicNode): DynamicNode;
+    exportJSON(): SerializedDynamicNode;
+    getUrl(): string;
+    setUrl(url: string): void;
+    getProps(): Record<string, unknown>;
+    setProps(props: Record<string, unknown>): void;
+    getInitialHeight(): number;
+    setInitialHeight(initialHeight: number): void;
+    decorate(_editor: LexicalEditor, _config: EditorConfig): ReactElement;
+}
+export declare function $createDynamicNode(payload?: Partial<DynamicNodePayload>): DynamicNode;
+export declare function $isDynamicNode(node: LexicalNode | null | undefined): node is DynamicNode;
+//# sourceMappingURL=DynamicNode.d.ts.map

package/dist/DynamicNode.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DynamicNode.d.ts","sourceRoot":"","sources":["../src/DynamicNode.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,YAAY,EACZ,aAAa,EACb,WAAW,EACX,OAAO,EACP,qBAAqB,EACrB,MAAM,EACP,MAAM,SAAS,CAAC;AACjB,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AACxC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAK1C,MAAM,WAAW,kBAAkB;IACjC,aAAa,EAAE,MAAM,CAAC;IACtB,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC/B,GAAG,EAAE,MAAM,CAAC;CACb;AAED,MAAM,MAAM,qBAAqB,GAAG,MAAM,CAAC,kBAAkB,EAAE,qBAAqB,CAAC,CAAC;AAEtF,eAAO,MAAM,sBAAsB,MAAM,CAAC;AAE1C,qBAAa,WAAY,SAAQ,aAAa,CAAC,YAAY,CAAC;IAC1D,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACjC,eAAe,EAAE,MAAM,CAAC;IAExB,MAAM,CAAC,OAAO,IAAI,MAAM;IAIxB,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE,WAAW,GAAG,WAAW;gBAK1C,GAAG,EAAE,MAAM,EACX,KAAK,GAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAM,EACnC,aAAa,GAAE,MAA+B,EAC9C,GAAG,CAAC,EAAE,OAAO;IAQf,SAAS,CAAC,OAAO,EAAE,YAAY,GAAG,WAAW;IAM7C,SAAS,IAAI,OAAO;IAIpB,QAAQ,IAAI,OAAO;IAInB,MAAM,CAAC,UAAU,CAAC,cAAc,EAAE,qBAAqB,GAAG,WAAW;IAIrE,UAAU,IAAI,qBAAqB;IAWnC,MAAM,IAAI,MAAM;IAIhB,MAAM,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;IAKzB,QAAQ,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IAInC,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAK9C,gBAAgB,IAAI,MAAM;IAI1B,gBAAgB,CAAC,aAAa,EAAE,MAAM,GAAG,IAAI;IAK7C,QAAQ,CAAC,OAAO,EAAE,aAAa,EAAE,OAAO,EAAE,YAAY,GAAG,YAAY;CAOtE;AAED,wBAAgB,kBAAkB,CAAC,OAAO,GAAE,OAAO,CAAC,kBAAkB,CAAM,GAAG,WAAW,CAMzF;AAED,wBAAgB,cAAc,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI,GAAG,SAAS,GAAG,IAAI,IAAI,WAAW,CAExF"}

package/dist/DynamicPlugin.d.ts

@@ -0,0 +1,4 @@
+import { DynamicNodePayload } from './DynamicNode';
+export declare const INSERT_DYNAMIC_COMMAND: import('lexical').LexicalCommand<Partial<DynamicNodePayload> | undefined>;
+export declare function DynamicPlugin(): null;
+//# sourceMappingURL=DynamicPlugin.d.ts.map

package/dist/DynamicPlugin.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DynamicPlugin.d.ts","sourceRoot":"","sources":["../src/DynamicPlugin.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAC;AAExD,eAAO,MAAM,sBAAsB,2EAElC,CAAC;AAEF,wBAAgB,aAAa,SAgB5B"}

package/dist/DynamicSSRRenderer.d.ts

@@ -0,0 +1,5 @@
+import { FC } from 'react';
+import { DynamicHostRendererProps } from './DynamicHostRenderer';
+export type DynamicSSRRendererProps = DynamicHostRendererProps;
+export declare const DynamicSSRRenderer: FC<DynamicSSRRendererProps>;
+//# sourceMappingURL=DynamicSSRRenderer.d.ts.map

package/dist/DynamicSSRRenderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DynamicSSRRenderer.d.ts","sourceRoot":"","sources":["../src/DynamicSSRRenderer.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,uBAAuB,CAAC;AAItE,MAAM,MAAM,uBAAuB,GAAG,wBAAwB,CAAC;AAc/D,eAAO,MAAM,kBAAkB,EAAE,EAAE,CAAC,uBAAuB,CAM1D,CAAC"}

package/dist/index.d.ts

@@ -0,0 +1,13 @@
+export { $createDynamicEditNode, $isDynamicEditNode, DynamicEditNode } from './DynamicEditNode';
+export type { DynamicEditRendererProps } from './DynamicEditRenderer';
+export { DynamicEditRenderer } from './DynamicEditRenderer';
+export type { DynamicHostRendererProps } from './DynamicHostRenderer';
+export { DynamicHostRenderer } from './DynamicHostRenderer';
+export type { DynamicNodePayload, SerializedDynamicNode } from './DynamicNode';
+export { $createDynamicNode, $isDynamicNode, DEFAULT_DYNAMIC_HEIGHT, DynamicNode, } from './DynamicNode';
+export { DynamicPlugin, INSERT_DYNAMIC_COMMAND } from './DynamicPlugin';
+export type { DynamicSSRRendererProps } from './DynamicSSRRenderer';
+export { DynamicSSRRenderer } from './DynamicSSRRenderer';
+export type { DynamicSlotProps } from './slot';
+export { DYNAMIC_NODE_KEY } from './slot';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAE,kBAAkB,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAChG,YAAY,EAAE,wBAAwB,EAAE,MAAM,uBAAuB,CAAC;AACtE,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,YAAY,EAAE,wBAAwB,EAAE,MAAM,uBAAuB,CAAC;AACtE,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,YAAY,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC;AAC/E,OAAO,EACL,kBAAkB,EAClB,cAAc,EACd,sBAAsB,EACtB,WAAW,GACZ,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,aAAa,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAC;AACxE,YAAY,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAC;AACpE,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,YAAY,EAAE,gBAAgB,EAAE,MAAM,QAAQ,CAAC;AAC/C,OAAO,EAAE,gBAAgB,EAAE,MAAM,QAAQ,CAAC"}

package/dist/index.mjs

@@ -0,0 +1,245 @@
+import { _ as semanticClassNames, a as _defineProperty, c as DynamicHostRenderer, d as editFieldIcon, f as editInput, g as root, h as overlay, i as DynamicNode, m as editTextarea, n as $isDynamicNode, o as DYNAMIC_NODE_KEY, p as editPanel, r as DEFAULT_DYNAMIC_HEIGHT, s as DynamicSSRRenderer, t as $createDynamicNode, u as editField, v as settingsButton } from "./DynamicNode-BVlebpiA.js";
+import { $getNodeByKey, $insertNodes, COMMAND_PRIORITY_EDITOR, createCommand } from "lexical";
+import { Boxes, Braces, Link2, Ruler, Settings2, Trash2 } from "lucide-react";
+import { Suspense, createElement, lazy, useCallback, useEffect, useState } from "react";
+import { useRendererMode } from "@haklex/rich-editor/static";
+import { ActionBar, ActionButton, Popover, PopoverPanel, PopoverTrigger } from "@haklex/rich-editor-ui";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
+//#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
+//#region src/DynamicEditNode.ts
+var LazyEditRenderer = lazy(() => Promise.resolve().then(() => DynamicEditRenderer_exports).then((m) => ({ default: m.DynamicEditRenderer })));
+var DynamicEditNode = class DynamicEditNode extends DynamicNode {
+	static clone(node) {
+		return new DynamicEditNode(node.__url, node.__props, node.__initialHeight, node.__key);
+	}
+	constructor(url, props = {}, initialHeight = 320, key) {
+		super(url, props, initialHeight, key);
+	}
+	static importJSON(serializedNode) {
+		return new DynamicEditNode(serializedNode.url, serializedNode.props, serializedNode.initialHeight);
+	}
+	decorate(editor, config) {
+		if (!editor.isEditable()) return super.decorate(editor, config);
+		return createElement(Suspense, { fallback: createElement("div", {
+			className: "rich-dynamic-loading",
+			style: {
+				minHeight: this.__initialHeight,
+				margin: "1.25rem 0"
+			}
+		}) }, createElement(LazyEditRenderer, {
+			url: this.__url,
+			componentProps: this.__props,
+			initialHeight: this.__initialHeight,
+			nodeKey: this.__key
+		}));
+	}
+};
+_defineProperty(DynamicEditNode, "commandItems", [{
+	title: "Dynamic Component",
+	icon: createElement(Boxes, { size: 20 }),
+	description: "Embed an external interactive component",
+	keywords: [
+		"dynamic",
+		"component",
+		"widget",
+		"interactive",
+		"external"
+	],
+	section: "MEDIA",
+	placement: ["slash", "toolbar"],
+	group: "insert",
+	onSelect: (editor) => {
+		editor.update(() => {
+			$insertNodes([$createDynamicEditNode()]);
+		});
+	}
+}]);
+function $createDynamicEditNode(payload = {}) {
+	return new DynamicEditNode(payload.url ?? "", payload.props ?? {}, payload.initialHeight ?? 320);
+}
+function $isDynamicEditNode(node) {
+	return node instanceof DynamicEditNode;
+}
+//#endregion
+//#region src/DynamicEditRenderer.tsx
+var DynamicEditRenderer_exports = /* @__PURE__ */ __exportAll({ DynamicEditRenderer: () => DynamicEditRenderer });
+function DynamicEditRenderer(props) {
+	if (useRendererMode() !== "editor") return /* @__PURE__ */ jsx(DynamicSSRRenderer, {
+		componentProps: props.componentProps,
+		initialHeight: props.initialHeight,
+		url: props.url
+	});
+	return /* @__PURE__ */ jsx(DynamicEditRendererInner, { ...props });
+}
+function DynamicEditRendererInner({ url, componentProps, initialHeight, nodeKey }) {
+	const [editor] = useLexicalComposerContext();
+	const [open, setOpen] = useState(!url);
+	const [editUrl, setEditUrl] = useState(url);
+	const [editHeight, setEditHeight] = useState(String(initialHeight));
+	const [editProps, setEditProps] = useState(() => JSON.stringify(componentProps ?? {}, null, 2));
+	const [propsError, setPropsError] = useState(null);
+	const resetDraft = useCallback(() => {
+		setEditUrl(url);
+		setEditHeight(String(initialHeight));
+		setEditProps(JSON.stringify(componentProps ?? {}, null, 2));
+		setPropsError(null);
+	}, [
+		url,
+		initialHeight,
+		componentProps
+	]);
+	useEffect(() => {
+		resetDraft();
+	}, [resetDraft]);
+	const commitChanges = useCallback(() => {
+		let parsedProps;
+		try {
+			const value = JSON.parse(editProps.trim() || "{}");
+			if (!value || typeof value !== "object" || Array.isArray(value)) {
+				setPropsError("Props must be a JSON object");
+				return;
+			}
+			parsedProps = value;
+		} catch {
+			setPropsError("Invalid JSON");
+			return;
+		}
+		const parsedHeight = Number(editHeight);
+		const nextHeight = Number.isFinite(parsedHeight) && parsedHeight > 0 ? parsedHeight : 320;
+		editor.update(() => {
+			const node = $getNodeByKey(nodeKey);
+			if (!$isDynamicNode(node)) return;
+			const dynamicNode = node;
+			dynamicNode.setUrl(editUrl.trim());
+			dynamicNode.setProps(parsedProps);
+			dynamicNode.setInitialHeight(nextHeight);
+		});
+		setPropsError(null);
+		setOpen(false);
+	}, [
+		editor,
+		nodeKey,
+		editUrl,
+		editHeight,
+		editProps
+	]);
+	const handleDelete = useCallback(() => {
+		editor.update(() => {
+			$getNodeByKey(nodeKey)?.remove();
+		});
+		setOpen(false);
+	}, [editor, nodeKey]);
+	return /* @__PURE__ */ jsxs("div", {
+		className: `${root} ${semanticClassNames.root}`,
+		children: [url ? /* @__PURE__ */ jsx(DynamicHostRenderer, {
+			componentProps,
+			initialHeight,
+			url
+		}) : /* @__PURE__ */ jsx("div", {
+			style: {
+				minHeight: initialHeight,
+				position: "relative"
+			},
+			children: /* @__PURE__ */ jsx("div", {
+				className: `${overlay} ${semanticClassNames.placeholder}`,
+				children: /* @__PURE__ */ jsx("span", { children: "Dynamic component — configure a module URL" })
+			})
+		}), /* @__PURE__ */ jsxs(Popover, {
+			open,
+			onOpenChange: (nextOpen) => {
+				setOpen(nextOpen);
+				if (!nextOpen) resetDraft();
+			},
+			children: [/* @__PURE__ */ jsx(PopoverTrigger, {
+				"aria-label": "Dynamic component settings",
+				className: `${settingsButton} ${semanticClassNames.settingsButton}`,
+				children: /* @__PURE__ */ jsx(Settings2, { size: 14 })
+			}), /* @__PURE__ */ jsxs(PopoverPanel, {
+				className: `${editPanel} ${semanticClassNames.editPanel}`,
+				side: "bottom",
+				sideOffset: 8,
+				children: [
+					/* @__PURE__ */ jsxs("div", {
+						className: `${editField} ${semanticClassNames.editField}`,
+						children: [/* @__PURE__ */ jsx(Link2, {
+							className: `${editFieldIcon} ${semanticClassNames.editFieldIcon}`,
+							size: 14
+						}), /* @__PURE__ */ jsx("input", {
+							className: `${editInput} ${semanticClassNames.editInput}`,
+							placeholder: "Module URL (ESM)",
+							type: "url",
+							value: editUrl,
+							onChange: (e) => setEditUrl(e.target.value)
+						})]
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: `${editField} ${semanticClassNames.editField}`,
+						children: [/* @__PURE__ */ jsx(Ruler, {
+							className: `${editFieldIcon} ${semanticClassNames.editFieldIcon}`,
+							size: 14
+						}), /* @__PURE__ */ jsx("input", {
+							className: `${editInput} ${semanticClassNames.editInput}`,
+							min: 0,
+							placeholder: "Initial height (px)",
+							type: "number",
+							value: editHeight,
+							onChange: (e) => setEditHeight(e.target.value)
+						})]
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: `${editField} ${semanticClassNames.editField}`,
+						children: [/* @__PURE__ */ jsx(Braces, {
+							className: `${editFieldIcon} ${semanticClassNames.editFieldIcon}`,
+							size: 14
+						}), /* @__PURE__ */ jsx("textarea", {
+							className: `${editTextarea} ${semanticClassNames.editTextarea}`,
+							placeholder: "Props JSON, e.g. {\"level\": 1}",
+							spellCheck: false,
+							value: editProps,
+							onChange: (e) => setEditProps(e.target.value)
+						})]
+					}),
+					propsError && /* @__PURE__ */ jsx("span", {
+						className: `_1b17zoub ${semanticClassNames.editError}`,
+						children: propsError
+					}),
+					/* @__PURE__ */ jsxs(ActionBar, { children: [/* @__PURE__ */ jsx(ActionButton, {
+						onClick: commitChanges,
+						children: "Apply"
+					}), /* @__PURE__ */ jsxs(ActionButton, {
+						danger: true,
+						onClick: handleDelete,
+						children: [/* @__PURE__ */ jsx(Trash2, { size: 14 }), "Remove"]
+					})] })
+				]
+			})]
+		})]
+	});
+}
+//#endregion
+//#region src/DynamicPlugin.tsx
+var INSERT_DYNAMIC_COMMAND = createCommand("INSERT_DYNAMIC");
+function DynamicPlugin() {
+	const [editor] = useLexicalComposerContext();
+	useEffect(() => {
+		return editor.registerCommand(INSERT_DYNAMIC_COMMAND, (payload) => {
+			$insertNodes([$createDynamicEditNode(payload ?? {})]);
+			return true;
+		}, COMMAND_PRIORITY_EDITOR);
+	}, [editor]);
+	return null;
+}
+//#endregion
+export { $createDynamicEditNode, $createDynamicNode, $isDynamicEditNode, $isDynamicNode, DEFAULT_DYNAMIC_HEIGHT, DYNAMIC_NODE_KEY, DynamicEditNode, DynamicEditRenderer, DynamicHostRenderer, DynamicNode, DynamicPlugin, DynamicSSRRenderer, INSERT_DYNAMIC_COMMAND };

package/dist/rich-ext-dynamic.css

@@ -0,0 +1,2 @@
+:root{--rc-text:#000;--rc-text-secondary:#262626;--rc-text-tertiary:#737373;--rc-text-quaternary:#a3a3a3;--rc-bg:#fff;--rc-bg-secondary:#fafafa;--rc-bg-tertiary:#f5f5f5;--rc-fill:#e8e8e8;--rc-fill-secondary:#eee;--rc-fill-tertiary:#f5f5f5;--rc-fill-quaternary:#fafafa;--rc-border:#f5f5f5;--rc-accent:#2563eb;--rc-accent-light:#2563eb20;--rc-link:#2563eb;--rc-code-text:#404040;--rc-code-bg:#f5f5f5;--rc-hr-border:#e5e5e5;--rc-quote-border:#2563eb;--rc-quote-bg:#f5f5f5;--rc-alert-info:#006bb7;--rc-alert-warning:#c50;--rc-alert-tip:#1c0;--rc-alert-caution:#c01;--rc-alert-important:#50c;--rc-max-width:700px;--rc-shadow-top-bar:0 8px 30px #0000001f, 0 2px 8px #0000000f;--rc-shadow-modal:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--rc-shadow-menu:0 1px 4px #0000000a, 0 4px 16px #00000014;--rc-space-xs:4px;--rc-space-sm:8px;--rc-space-md:16px;--rc-space-lg:24px;--rc-space-xl:32px;--rc-font-family-sans:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif:"Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-family-kai:"楷体", KaiTi, STKaiti, "Kaiti SC", "LXGW WenKai", "霞鹜文楷", "Noto Serif CJK SC", serif;--rc-font-mono:"SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs:.625em;--rc-font-size-xs:.75em;--rc-font-size-sm:.8125em;--rc-font-size-md:.875em;--rc-font-size-lg:1.25em;--rc-font-size-base:16px;--rc-font-size-small:14px;--rc-line-height:1.7;--rc-line-height-tight:1.4;--rc-font-family:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm:4px;--rc-radius-md:8px;--rc-radius-lg:12px}:root.dark,[data-theme=dark]{--rc-text:#fafafa;--rc-text-secondary:#a3a3a3;--rc-text-tertiary:#737373;--rc-text-quaternary:#525252;--rc-bg:#0a0a0a;--rc-bg-secondary:#171717;--rc-bg-tertiary:#262626;--rc-fill:#2a2a2a;--rc-fill-secondary:#222;--rc-fill-tertiary:#1a1a1a;--rc-fill-quaternary:#141414;--rc-border:#262626;--rc-accent:#60a5fa;--rc-accent-light:#60a5fa20;--rc-link:#60a5fa;--rc-code-text:#d4d4d4;--rc-code-bg:#262626;--rc-hr-border:#262626;--rc-quote-border:#60a5fa;--rc-quote-bg:#262626;--rc-alert-info:#7db9e5;--rc-alert-warning:#da864a;--rc-alert-tip:#54da48;--rc-alert-caution:#e16973;--rc-alert-important:#9966e0;--rc-shadow-top-bar:0 8px 30px #00000073, 0 2px 8px #0000004d;--rc-shadow-modal:0 10px 15px -3px #0006, 0 4px 6px -4px #00000059;--rc-shadow-menu:0 1px 4px #00000040, 0 4px 16px #0006}.gk60bp0{--rc-text:#000;--rc-text-secondary:#262626;--rc-text-tertiary:#737373;--rc-text-quaternary:#a3a3a3;--rc-bg:#fff;--rc-bg-secondary:#fafafa;--rc-bg-tertiary:#f5f5f5;--rc-fill:#e8e8e8;--rc-fill-secondary:#eee;--rc-fill-tertiary:#f5f5f5;--rc-fill-quaternary:#fafafa;--rc-border:#f5f5f5;--rc-accent:#2563eb;--rc-accent-light:#2563eb20;--rc-link:#2563eb;--rc-code-text:#404040;--rc-code-bg:#f5f5f5;--rc-hr-border:#e5e5e5;--rc-quote-border:#2563eb;--rc-quote-bg:#f5f5f5;--rc-alert-info:#006bb7;--rc-alert-warning:#c50;--rc-alert-tip:#1c0;--rc-alert-caution:#c01;--rc-alert-important:#50c;--rc-max-width:700px;--rc-shadow-top-bar:0 8px 30px #0000001f, 0 2px 8px #0000000f;--rc-shadow-modal:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--rc-shadow-menu:0 1px 4px #0000000a, 0 4px 16px #00000014;--rc-space-xs:4px;--rc-space-sm:8px;--rc-space-md:16px;--rc-space-lg:24px;--rc-space-xl:32px;--rc-font-family-sans:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif:"Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-family-kai:"楷体", KaiTi, STKaiti, "Kaiti SC", "LXGW WenKai", "霞鹜文楷", "Noto Serif CJK SC", serif;--rc-font-mono:"SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs:.625em;--rc-font-size-xs:.75em;--rc-font-size-sm:.8125em;--rc-font-size-md:.875em;--rc-font-size-lg:1.25em;--rc-font-size-base:16px;--rc-font-size-small:14px;--rc-line-height:1.7;--rc-line-height-tight:1.4;--rc-font-family:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm:4px;--rc-radius-md:8px;--rc-radius-lg:12px}.gk60bp1{--rc-text:#000;--rc-text-secondary:#262626;--rc-text-tertiary:#737373;--rc-text-quaternary:#a3a3a3;--rc-bg:#fff;--rc-bg-secondary:#fafafa;--rc-bg-tertiary:#f5f5f5;--rc-fill:#e8e8e8;--rc-fill-secondary:#eee;--rc-fill-tertiary:#f5f5f5;--rc-fill-quaternary:#fafafa;--rc-border:#f5f5f5;--rc-accent:#2563eb;--rc-accent-light:#2563eb20;--rc-link:#2563eb;--rc-code-text:#404040;--rc-code-bg:#f5f5f5;--rc-hr-border:#e5e5e5;--rc-quote-border:#2563eb;--rc-quote-bg:#f5f5f5;--rc-alert-info:#006bb7;--rc-alert-warning:#c50;--rc-alert-tip:#1c0;--rc-alert-caution:#c01;--rc-alert-important:#50c;--rc-max-width:700px;--rc-shadow-top-bar:0 8px 30px #0000001f, 0 2px 8px #0000000f;--rc-shadow-modal:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--rc-shadow-menu:0 1px 4px #0000000a, 0 4px 16px #00000014;--rc-space-xs:4px;--rc-space-sm:8px;--rc-space-md:16px;--rc-space-lg:24px;--rc-space-xl:32px;--rc-font-family-sans:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif:"Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-family-kai:"楷体", KaiTi, STKaiti, "Kaiti SC", "LXGW WenKai", "霞鹜文楷", "Noto Serif CJK SC", serif;--rc-font-mono:"SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs:.625em;--rc-font-size-xs:.75em;--rc-font-size-sm:.8125em;--rc-font-size-md:.875em;--rc-font-size-lg:1.25em;--rc-font-size-base:16px;--rc-font-size-small:14px;--rc-line-height:1.8;--rc-line-height-tight:1.4;--rc-font-family:"Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-radius-sm:4px;--rc-radius-md:8px;--rc-radius-lg:12px}.gk60bp2{--rc-text:#000;--rc-text-secondary:#262626;--rc-text-tertiary:#737373;--rc-text-quaternary:#a3a3a3;--rc-bg:#fff;--rc-bg-secondary:#fafafa;--rc-bg-tertiary:#f5f5f5;--rc-fill:#e8e8e8;--rc-fill-secondary:#eee;--rc-fill-tertiary:#f5f5f5;--rc-fill-quaternary:#fafafa;--rc-border:#f5f5f5;--rc-accent:#2563eb;--rc-accent-light:#2563eb20;--rc-link:#2563eb;--rc-code-text:#404040;--rc-code-bg:#f5f5f5;--rc-hr-border:#e5e5e5;--rc-quote-border:#a3a3a3;--rc-quote-bg:#fafafa;--rc-alert-info:#006bb7;--rc-alert-warning:#c50;--rc-alert-tip:#1c0;--rc-alert-caution:#c01;--rc-alert-important:#50c;--rc-max-width:none;--rc-shadow-top-bar:0 8px 30px #0000001f, 0 2px 8px #0000000f;--rc-shadow-modal:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--rc-shadow-menu:0 1px 4px #0000000a, 0 4px 16px #00000014;--rc-space-xs:2px;--rc-space-sm:4px;--rc-space-md:10px;--rc-space-lg:16px;--rc-space-xl:20px;--rc-font-family-sans:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-font-family-serif:"Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif;--rc-font-family-kai:"楷体", KaiTi, STKaiti, "Kaiti SC", "LXGW WenKai", "霞鹜文楷", "Noto Serif CJK SC", serif;--rc-font-mono:"SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace;--rc-font-size-2xs:.625em;--rc-font-size-xs:.75em;--rc-font-size-sm:.8125em;--rc-font-size-md:.875em;--rc-font-size-lg:1.25em;--rc-font-size-base:14px;--rc-font-size-small:12px;--rc-line-height:1.5;--rc-line-height-tight:1.3;--rc-font-family:"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji;--rc-radius-sm:3px;--rc-radius-md:6px;--rc-radius-lg:12px}.dark .gk60bp0,[data-theme=dark] .gk60bp0,.dark.gk60bp0,[data-theme=dark].gk60bp0,.dark .gk60bp1,[data-theme=dark] .gk60bp1,.dark.gk60bp1,[data-theme=dark].gk60bp1,.dark .gk60bp2,[data-theme=dark] .gk60bp2,.dark.gk60bp2,[data-theme=dark].gk60bp2{--rc-text:#fafafa;--rc-text-secondary:#a3a3a3;--rc-text-tertiary:#737373;--rc-text-quaternary:#525252;--rc-bg:#0a0a0a;--rc-bg-secondary:#171717;--rc-bg-tertiary:#262626;--rc-fill:#2a2a2a;--rc-fill-secondary:#222;--rc-fill-tertiary:#1a1a1a;--rc-fill-quaternary:#141414;--rc-border:#262626;--rc-accent:#60a5fa;--rc-accent-light:#60a5fa20;--rc-link:#60a5fa;--rc-code-text:#d4d4d4;--rc-code-bg:#262626;--rc-hr-border:#262626;--rc-quote-border:#60a5fa;--rc-quote-bg:#262626;--rc-alert-info:#7db9e5;--rc-alert-warning:#da864a;--rc-alert-tip:#54da48;--rc-alert-caution:#e16973;--rc-alert-important:#9966e0;--rc-shadow-top-bar:0 8px 30px #00000073, 0 2px 8px #0000004d;--rc-shadow-modal:0 10px 15px -3px #0006, 0 4px 6px -4px #00000059;--rc-shadow-menu:0 1px 4px #00000040, 0 4px 16px #0006}._1b17zou0{margin:1.25rem 0;position:relative}._1b17zou1{width:100%}._1b17zou2{border-radius:var(--rc-radius-md);border:1px dashed var(--rc-border);background-color:var(--rc-bg-secondary);color:var(--rc-text-tertiary);font-family:var(--rc-font-family-sans);font-size:var(--rc-font-size-sm);flex-direction:column;justify-content:center;align-items:center;gap:8px;display:flex;position:absolute;top:0;bottom:0;left:0;right:0}._1b17zou3{-webkit-appearance:none;appearance:none;border:1px solid var(--rc-border);border-radius:var(--rc-radius-sm);background-color:var(--rc-bg);color:var(--rc-text-secondary);font-size:var(--rc-font-size-sm);cursor:pointer;padding:4px 12px}._1b17zou3:hover{background-color:var(--rc-fill-secondary)}._1b17zou4{text-overflow:ellipsis;white-space:nowrap;max-width:80%;font-family:var(--rc-font-mono);font-size:var(--rc-font-size-xs);color:var(--rc-text-quaternary);overflow:hidden}._1b17zou5{z-index:1;-webkit-appearance:none;appearance:none;border:1px solid var(--rc-border);border-radius:var(--rc-radius-sm);background-color:var(--rc-bg);width:28px;height:28px;color:var(--rc-text-secondary);cursor:pointer;opacity:0;justify-content:center;align-items:center;transition:opacity .15s;display:inline-flex;position:absolute;top:8px;right:8px}._1b17zou0:hover ._1b17zou5,._1b17zou5[data-popup-open]{opacity:1}._1b17zou5:focus-visible{opacity:1}._1b17zou6{width:340px;font-family:var(--rc-font-family-sans);flex-direction:column;gap:8px;padding:12px;display:flex}._1b17zou7{background-color:var(--rc-bg-secondary);border-radius:6px;align-items:center;gap:8px;min-width:0;padding:6px 10px;display:flex}._1b17zou8{color:var(--rc-text-secondary);flex-shrink:0}._1b17zou9{-webkit-appearance:none;appearance:none;color:inherit;font-size:var(--rc-font-size-sm);background-color:#0000;border:none;outline:none;flex:1;min-width:0;padding:0}._1b17zou9::placeholder{color:var(--rc-text-secondary)}._1b17zoua{resize:vertical;-webkit-appearance:none;appearance:none;background-color:var(--rc-bg-secondary);width:100%;min-height:72px;color:inherit;font-family:var(--rc-font-mono);font-size:var(--rc-font-size-xs);border:none;border-radius:6px;outline:none;padding:6px 10px}._1b17zoua::placeholder{color:var(--rc-text-secondary);font-family:var(--rc-font-family-sans)}._1b17zoub{color:var(--rc-alert-caution);font-size:var(--rc-font-size-sm)}
+/*$vite$:1*/

package/dist/slot.d.ts

@@ -0,0 +1,13 @@
+import { ComponentType } from 'react';
+export declare const DYNAMIC_NODE_KEY: "Dynamic";
+export interface DynamicSlotProps {
+    componentProps: Record<string, unknown>;
+    initialHeight: number;
+    url: string;
+}
+declare module '@haklex/rich-editor/static' {
+    interface RendererConfig {
+        Dynamic?: ComponentType<DynamicSlotProps>;
+    }
+}
+//# sourceMappingURL=slot.d.ts.map

package/dist/slot.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"slot.d.ts","sourceRoot":"","sources":["../src/slot.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAE3C,eAAO,MAAM,gBAAgB,EAAG,SAAkB,CAAC;AAEnD,MAAM,WAAW,gBAAgB;IAC/B,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACxC,aAAa,EAAE,MAAM,CAAC;IACtB,GAAG,EAAE,MAAM,CAAC;CACb;AAED,OAAO,QAAQ,4BAA4B,CAAC;IAC1C,UAAU,cAAc;QACtB,OAAO,CAAC,EAAE,aAAa,CAAC,gBAAgB,CAAC,CAAC;KAC3C;CACF"}

package/dist/static.d.ts

@@ -0,0 +1,9 @@
+export type { DynamicHostRendererProps } from './DynamicHostRenderer';
+export { DynamicHostRenderer } from './DynamicHostRenderer';
+export type { DynamicNodePayload, SerializedDynamicNode } from './DynamicNode';
+export { $createDynamicNode, $isDynamicNode, DEFAULT_DYNAMIC_HEIGHT, DynamicNode, } from './DynamicNode';
+export type { DynamicSSRRendererProps } from './DynamicSSRRenderer';
+export { DynamicSSRRenderer } from './DynamicSSRRenderer';
+export type { DynamicSlotProps } from './slot';
+export { DYNAMIC_NODE_KEY } from './slot';
+//# sourceMappingURL=static.d.ts.map

package/dist/static.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"static.d.ts","sourceRoot":"","sources":["../src/static.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,wBAAwB,EAAE,MAAM,uBAAuB,CAAC;AACtE,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,YAAY,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC;AAC/E,OAAO,EACL,kBAAkB,EAClB,cAAc,EACd,sBAAsB,EACtB,WAAW,GACZ,MAAM,eAAe,CAAC;AACvB,YAAY,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAC;AACpE,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,YAAY,EAAE,gBAAgB,EAAE,MAAM,QAAQ,CAAC;AAC/C,OAAO,EAAE,gBAAgB,EAAE,MAAM,QAAQ,CAAC"}

package/dist/static.mjs

@@ -0,0 +1,2 @@
+import { c as DynamicHostRenderer, i as DynamicNode, n as $isDynamicNode, o as DYNAMIC_NODE_KEY, r as DEFAULT_DYNAMIC_HEIGHT, s as DynamicSSRRenderer, t as $createDynamicNode } from "./DynamicNode-BVlebpiA.js";
+export { $createDynamicNode, $isDynamicNode, DEFAULT_DYNAMIC_HEIGHT, DYNAMIC_NODE_KEY, DynamicHostRenderer, DynamicNode, DynamicSSRRenderer };

package/dist/styles.css.d.ts

@@ -0,0 +1,26 @@
+export declare const semanticClassNames: {
+    readonly root: "rich-dynamic-root";
+    readonly host: "rich-dynamic-host";
+    readonly placeholder: "rich-dynamic-placeholder";
+    readonly error: "rich-dynamic-error";
+    readonly settingsButton: "rich-dynamic-settings-button";
+    readonly editPanel: "rich-dynamic-edit-panel";
+    readonly editField: "rich-dynamic-edit-field";
+    readonly editFieldIcon: "rich-dynamic-edit-field-icon";
+    readonly editInput: "rich-dynamic-edit-input";
+    readonly editTextarea: "rich-dynamic-edit-textarea";
+    readonly editError: "rich-dynamic-edit-error";
+};
+export declare const root: string;
+export declare const host: string;
+export declare const overlay: string;
+export declare const retryButton: string;
+export declare const errorUrl: string;
+export declare const settingsButton: string;
+export declare const editPanel: string;
+export declare const editField: string;
+export declare const editFieldIcon: string;
+export declare const editInput: string;
+export declare const editTextarea: string;
+export declare const editError: string;
+//# sourceMappingURL=styles.css.d.ts.map

package/dist/styles.css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.css.d.ts","sourceRoot":"","sources":["../src/styles.css.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,kBAAkB;;;;;;;;;;;;CAYrB,CAAC;AAEX,eAAO,MAAM,IAAI,QAGf,CAAC;AAEH,eAAO,MAAM,IAAI,QAEf,CAAC;AAEH,eAAO,MAAM,OAAO,QAclB,CAAC;AAEH,eAAO,MAAM,WAAW,QActB,CAAC;AAEH,eAAO,MAAM,QAAQ,QAQnB,CAAC;AAEH,eAAO,MAAM,cAAc,QAuBzB,CAAC;AAEH,eAAO,MAAM,SAAS,QAOpB,CAAC;AAEH,eAAO,MAAM,SAAS,QAQpB,CAAC;AAEH,eAAO,MAAM,aAAa,QAGxB,CAAC;AAEH,eAAO,MAAM,SAAS,QAepB,CAAC;AAEH,eAAO,MAAM,YAAY,QAmBvB,CAAC;AAEH,eAAO,MAAM,SAAS,QAGpB,CAAC"}

package/package.json

@@ -0,0 +1,62 @@
+{
+  "name": "@haklex/rich-ext-dynamic",
+  "version": "0.25.0",
+  "description": "Dynamic external component extension",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/Innei/haklex.git",
+    "directory": "packages/rich-ext-dynamic"
+  },
+  "license": "MIT",
+  "type": "module",
+  "exports": {
+    ".": {
+      "import": "./dist/index.mjs",
+      "types": "./dist/index.d.ts"
+    },
+    "./static": {
+      "import": "./dist/static.mjs",
+      "types": "./dist/static.d.ts"
+    },
+    "./style.css": "./dist/rich-ext-dynamic.css"
+  },
+  "main": "./dist/index.mjs",
+  "files": [
+    "dist"
+  ],
+  "dependencies": {
+    "@haklex/rich-dynamic-protocol": "0.25.0"
+  },
+  "devDependencies": {
+    "@lexical/react": "^0.45.0",
+    "@types/react": "^19.2.15",
+    "@types/react-dom": "^19.2.3",
+    "@vanilla-extract/css": "^1.20.1",
+    "@vanilla-extract/vite-plugin": "^5.2.2",
+    "lexical": "^0.45.0",
+    "lucide-react": "^1.17.0",
+    "react": "19.2.6",
+    "react-dom": "19.2.6",
+    "typescript": "^5.9.3",
+    "unplugin-dts": "^1.0.1",
+    "vite": "^8.0.14"
+  },
+  "peerDependencies": {
+    "@lexical/react": "^0.45.0",
+    "lexical": "^0.45.0",
+    "lucide-react": "^1.0.0",
+    "react": ">=19",
+    "react-dom": ">=19",
+    "@haklex/rich-editor": "0.25.0",
+    "@haklex/rich-editor-ui": "0.25.0",
+    "@haklex/rich-style-token": "0.25.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "vite build",
+    "dev:build": "vite build --watch"
+  },
+  "types": "./dist/index.d.ts"
+}