@lifeart/async-dom 2.0.0-alpha.3

package/dist/react.cjs

@@ -0,0 +1,116 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_resolve_debug = require("./resolve-debug.cjs");
+require("./cli.cjs");
+let react = require("react");
+//#region src/react/use-async-dom.ts
+/**
+* React hook that creates and manages an async-dom instance.
+*
+* Attaches an async-dom worker to the container element referenced by
+* `containerRef`. The instance is created on mount and destroyed on unmount.
+*
+* @param options - Configuration for the async-dom instance.
+* @returns An object containing the container ref and the instance (null until ready).
+*
+* @example
+* ```tsx
+* function MyComponent() {
+*   const { containerRef, instance } = useAsyncDom({
+*     worker: "./my-worker.ts",
+*     onReady: (inst) => console.log("Ready!", inst),
+*   });
+*   return <div ref={containerRef} />;
+* }
+* ```
+*/
+function useAsyncDom(options) {
+	const containerRef = (0, react.useRef)(null);
+	const [instance, setInstance] = (0, react.useState)(null);
+	const instanceRef = (0, react.useRef)(null);
+	const workerRef = (0, react.useRef)(options.worker);
+	workerRef.current = options.worker;
+	const onReadyRef = (0, react.useRef)(options.onReady);
+	onReadyRef.current = options.onReady;
+	const onErrorRef = (0, react.useRef)(options.onError);
+	onErrorRef.current = options.onError;
+	const debugRef = (0, react.useRef)(options.debug);
+	debugRef.current = options.debug;
+	const schedulerRef = (0, react.useRef)(options.scheduler);
+	schedulerRef.current = options.scheduler;
+	(0, react.useEffect)(() => {
+		const el = containerRef.current;
+		if (!el) return;
+		let cancelled = false;
+		const workerProp = workerRef.current;
+		const worker = typeof workerProp === "string" ? new Worker(new URL(workerProp, require("url").pathToFileURL(__filename).href), { type: "module" }) : workerProp();
+		Promise.resolve().then(() => require("./main-thread.cjs")).then((n) => n.main_thread_exports).then(({ createAsyncDom }) => {
+			if (cancelled) {
+				worker.terminate();
+				return;
+			}
+			const inst = createAsyncDom({
+				target: el,
+				worker,
+				scheduler: schedulerRef.current,
+				debug: require_resolve_debug.resolveDebugOption(debugRef.current)
+			});
+			inst.start();
+			instanceRef.current = inst;
+			setInstance(inst);
+			onReadyRef.current?.(inst);
+		});
+		return () => {
+			cancelled = true;
+			instanceRef.current?.destroy();
+			instanceRef.current = null;
+			setInstance(null);
+		};
+	}, []);
+	return {
+		containerRef,
+		instance
+	};
+}
+//#endregion
+//#region src/react/async-dom-component.ts
+/**
+* React component that renders an async-dom worker application.
+*
+* Wraps {@link useAsyncDom} in a self-contained component with a container div.
+* Supports a `fallback` prop for loading state, and passes through `className`
+* and `style` to the container element.
+*
+* @param props - Component props.
+* @returns A React element containing the async-dom container.
+*
+* @example
+* ```tsx
+* <AsyncDom
+*   worker="./app.worker.ts"
+*   fallback={<p>Loading...</p>}
+*   onReady={(instance) => console.log("ready", instance)}
+* />
+* ```
+*/
+function AsyncDom(props) {
+	const { containerRef, instance } = useAsyncDom({
+		worker: props.worker,
+		scheduler: props.scheduler,
+		debug: props.debug,
+		onReady: props.onReady,
+		onError: props.onError
+	});
+	if (typeof window === "undefined") return (0, react.createElement)("div", {
+		className: props.className,
+		style: props.style
+	});
+	return (0, react.createElement)("div", {
+		className: props.className,
+		style: props.style
+	}, !instance && props.fallback ? props.fallback : null, (0, react.createElement)("div", { ref: containerRef }));
+}
+//#endregion
+exports.AsyncDom = AsyncDom;
+exports.useAsyncDom = useAsyncDom;
+
+//# sourceMappingURL=react.cjs.map

package/dist/react.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"react.cjs","names":["resolveDebugOption"],"sources":["../src/react/use-async-dom.ts","../src/react/async-dom-component.ts"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport type { DebugOptions, SchedulerConfig, SerializedError } from \"../index.ts\";\nimport type { AsyncDomInstance } from \"../main-thread/index.ts\";\nimport { resolveDebugOption } from \"../shared/resolve-debug.ts\";\n\nexport interface UseAsyncDomOptions {\n\t/** Worker script path or factory function */\n\tworker: string | (() => Worker);\n\t/** Scheduler configuration */\n\tscheduler?: SchedulerConfig;\n\t/** Debug options (pass `true` for sensible defaults, or a `DebugOptions` object) */\n\tdebug?: DebugOptions | boolean;\n\t/** Called when the async-dom instance is ready */\n\tonReady?: (instance: AsyncDomInstance) => void;\n\t/** Called when a worker error occurs */\n\tonError?: (error: SerializedError) => void;\n}\n\nexport interface UseAsyncDomResult {\n\t/** Ref to attach to the container element */\n\tcontainerRef: React.RefObject<HTMLDivElement | null>;\n\t/** The async-dom instance (null until ready) */\n\tinstance: AsyncDomInstance | null;\n}\n\n/**\n * React hook that creates and manages an async-dom instance.\n *\n * Attaches an async-dom worker to the container element referenced by\n * `containerRef`. The instance is created on mount and destroyed on unmount.\n *\n * @param options - Configuration for the async-dom instance.\n * @returns An object containing the container ref and the instance (null until ready).\n *\n * @example\n * ```tsx\n * function MyComponent() {\n *   const { containerRef, instance } = useAsyncDom({\n *     worker: \"./my-worker.ts\",\n *     onReady: (inst) => console.log(\"Ready!\", inst),\n *   });\n *   return <div ref={containerRef} />;\n * }\n * ```\n */\nexport function useAsyncDom(options: UseAsyncDomOptions): UseAsyncDomResult {\n\tconst containerRef = useRef<HTMLDivElement | null>(null);\n\tconst [instance, setInstance] = useState<AsyncDomInstance | null>(null);\n\tconst instanceRef = useRef<AsyncDomInstance | null>(null);\n\n\t// Stabilize callback refs to prevent re-creation on re-renders\n\tconst workerRef = useRef(options.worker);\n\tworkerRef.current = options.worker;\n\n\tconst onReadyRef = useRef(options.onReady);\n\tonReadyRef.current = options.onReady;\n\n\tconst onErrorRef = useRef(options.onError);\n\tonErrorRef.current = options.onError;\n\n\tconst debugRef = useRef(options.debug);\n\tdebugRef.current = options.debug;\n\n\tconst schedulerRef = useRef(options.scheduler);\n\tschedulerRef.current = options.scheduler;\n\n\tuseEffect(() => {\n\t\tconst el = containerRef.current;\n\t\tif (!el) return;\n\n\t\tlet cancelled = false;\n\t\tconst workerProp = workerRef.current;\n\t\tconst worker =\n\t\t\ttypeof workerProp === \"string\"\n\t\t\t\t? new Worker(new URL(workerProp, import.meta.url), { type: \"module\" })\n\t\t\t\t: workerProp();\n\n\t\t// Dynamic import to avoid pulling main-thread code into SSR bundles\n\t\timport(\"../main-thread/index.ts\").then(({ createAsyncDom }) => {\n\t\t\tif (cancelled) {\n\t\t\t\tworker.terminate();\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst inst = createAsyncDom({\n\t\t\t\ttarget: el,\n\t\t\t\tworker,\n\t\t\t\tscheduler: schedulerRef.current,\n\t\t\t\tdebug: resolveDebugOption(debugRef.current),\n\t\t\t});\n\t\t\tinst.start();\n\t\t\tinstanceRef.current = inst;\n\t\t\tsetInstance(inst);\n\t\t\tonReadyRef.current?.(inst);\n\t\t});\n\n\t\treturn () => {\n\t\t\tcancelled = true;\n\t\t\tinstanceRef.current?.destroy();\n\t\t\tinstanceRef.current = null;\n\t\t\tsetInstance(null);\n\t\t};\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, []);\n\n\treturn { containerRef, instance };\n}\n","import { createElement, type ReactNode } from \"react\";\nimport type { DebugOptions, SchedulerConfig, SerializedError } from \"../index.ts\";\nimport type { AsyncDomInstance } from \"../main-thread/index.ts\";\nimport { useAsyncDom } from \"./use-async-dom.ts\";\n\nexport interface AsyncDomProps {\n\t/** Worker script path or factory function */\n\tworker: string | (() => Worker);\n\t/** Scheduler configuration */\n\tscheduler?: SchedulerConfig;\n\t/** Enable debug mode (true for defaults, or pass DebugOptions) */\n\tdebug?: DebugOptions | boolean;\n\t/** Fallback content shown while loading */\n\tfallback?: ReactNode;\n\t/** Called when the async-dom instance is ready */\n\tonReady?: (instance: AsyncDomInstance) => void;\n\t/** Called when a worker error occurs */\n\tonError?: (error: SerializedError) => void;\n\t/** CSS class name for the container div */\n\tclassName?: string;\n\t/** Inline styles for the container div */\n\tstyle?: React.CSSProperties;\n}\n\n/**\n * React component that renders an async-dom worker application.\n *\n * Wraps {@link useAsyncDom} in a self-contained component with a container div.\n * Supports a `fallback` prop for loading state, and passes through `className`\n * and `style` to the container element.\n *\n * @param props - Component props.\n * @returns A React element containing the async-dom container.\n *\n * @example\n * ```tsx\n * <AsyncDom\n *   worker=\"./app.worker.ts\"\n *   fallback={<p>Loading...</p>}\n *   onReady={(instance) => console.log(\"ready\", instance)}\n * />\n * ```\n */\nexport function AsyncDom(props: AsyncDomProps): ReactNode {\n\tconst { containerRef, instance } = useAsyncDom({\n\t\tworker: props.worker,\n\t\tscheduler: props.scheduler,\n\t\tdebug: props.debug,\n\t\tonReady: props.onReady,\n\t\tonError: props.onError,\n\t});\n\n\t// SSR guard: render only the container div\n\tif (typeof window === \"undefined\") {\n\t\treturn createElement(\"div\", {\n\t\t\tclassName: props.className,\n\t\t\tstyle: props.style,\n\t\t});\n\t}\n\n\t// Fallback is rendered as a sibling before the container to avoid\n\t// conflicting with createAsyncDom's DOM manipulation of the target element.\n\treturn createElement(\n\t\t\"div\",\n\t\t{ className: props.className, style: props.style },\n\t\t!instance && props.fallback ? props.fallback : null,\n\t\tcreateElement(\"div\", { ref: containerRef }),\n\t);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AA6CA,SAAgB,YAAY,SAAgD;CAC3E,MAAM,gBAAA,GAAA,MAAA,QAA6C,KAAK;CACxD,MAAM,CAAC,UAAU,gBAAA,GAAA,MAAA,UAAiD,KAAK;CACvE,MAAM,eAAA,GAAA,MAAA,QAA8C,KAAK;CAGzD,MAAM,aAAA,GAAA,MAAA,QAAmB,QAAQ,OAAO;AACxC,WAAU,UAAU,QAAQ;CAE5B,MAAM,cAAA,GAAA,MAAA,QAAoB,QAAQ,QAAQ;AAC1C,YAAW,UAAU,QAAQ;CAE7B,MAAM,cAAA,GAAA,MAAA,QAAoB,QAAQ,QAAQ;AAC1C,YAAW,UAAU,QAAQ;CAE7B,MAAM,YAAA,GAAA,MAAA,QAAkB,QAAQ,MAAM;AACtC,UAAS,UAAU,QAAQ;CAE3B,MAAM,gBAAA,GAAA,MAAA,QAAsB,QAAQ,UAAU;AAC9C,cAAa,UAAU,QAAQ;AAE/B,EAAA,GAAA,MAAA,iBAAgB;EACf,MAAM,KAAK,aAAa;AACxB,MAAI,CAAC,GAAI;EAET,IAAI,YAAY;EAChB,MAAM,aAAa,UAAU;EAC7B,MAAM,SACL,OAAO,eAAe,WACnB,IAAI,OAAO,IAAI,IAAI,YAAA,QAAA,MAAA,CAAA,cAAA,WAAA,CAAA,KAA4B,EAAE,EAAE,MAAM,UAAU,CAAC,GACpE,YAAY;AAGhB,UAAA,SAAA,CAAA,WAAA,QAAA,oBAAA,CAAA,CAAA,MAAA,MAAA,EAAA,oBAAA,CAAkC,MAAM,EAAE,qBAAqB;AAC9D,OAAI,WAAW;AACd,WAAO,WAAW;AAClB;;GAGD,MAAM,OAAO,eAAe;IAC3B,QAAQ;IACR;IACA,WAAW,aAAa;IACxB,OAAOA,sBAAAA,mBAAmB,SAAS,QAAQ;IAC3C,CAAC;AACF,QAAK,OAAO;AACZ,eAAY,UAAU;AACtB,eAAY,KAAK;AACjB,cAAW,UAAU,KAAK;IACzB;AAEF,eAAa;AACZ,eAAY;AACZ,eAAY,SAAS,SAAS;AAC9B,eAAY,UAAU;AACtB,eAAY,KAAK;;IAGhB,EAAE,CAAC;AAEN,QAAO;EAAE;EAAc;EAAU;;;;;;;;;;;;;;;;;;;;;;;AC9DlC,SAAgB,SAAS,OAAiC;CACzD,MAAM,EAAE,cAAc,aAAa,YAAY;EAC9C,QAAQ,MAAM;EACd,WAAW,MAAM;EACjB,OAAO,MAAM;EACb,SAAS,MAAM;EACf,SAAS,MAAM;EACf,CAAC;AAGF,KAAI,OAAO,WAAW,YACrB,SAAA,GAAA,MAAA,eAAqB,OAAO;EAC3B,WAAW,MAAM;EACjB,OAAO,MAAM;EACb,CAAC;AAKH,SAAA,GAAA,MAAA,eACC,OACA;EAAE,WAAW,MAAM;EAAW,OAAO,MAAM;EAAO,EAClD,CAAC,YAAY,MAAM,WAAW,MAAM,WAAW,OAAA,GAAA,MAAA,eACjC,OAAO,EAAE,KAAK,cAAc,CAAC,CAC3C"}

package/dist/react.d.cts

@@ -0,0 +1,91 @@
+import { v as SerializedError } from "./base.cjs";
+import { n as DebugOptions } from "./debug.cjs";
+import { g as SchedulerConfig, r as AsyncDomInstance } from "./index.cjs";
+import { ReactNode } from "react";
+
+//#region src/react/async-dom-component.d.ts
+interface AsyncDomProps {
+  /** Worker script path or factory function */
+  worker: string | (() => Worker);
+  /** Scheduler configuration */
+  scheduler?: SchedulerConfig;
+  /** Enable debug mode (true for defaults, or pass DebugOptions) */
+  debug?: DebugOptions | boolean;
+  /** Fallback content shown while loading */
+  fallback?: ReactNode;
+  /** Called when the async-dom instance is ready */
+  onReady?: (instance: AsyncDomInstance) => void;
+  /** Called when a worker error occurs */
+  onError?: (error: SerializedError) => void;
+  /** CSS class name for the container div */
+  className?: string;
+  /** Inline styles for the container div */
+  style?: React.CSSProperties;
+}
+/**
+ * React component that renders an async-dom worker application.
+ *
+ * Wraps {@link useAsyncDom} in a self-contained component with a container div.
+ * Supports a `fallback` prop for loading state, and passes through `className`
+ * and `style` to the container element.
+ *
+ * @param props - Component props.
+ * @returns A React element containing the async-dom container.
+ *
+ * @example
+ * ```tsx
+ * <AsyncDom
+ *   worker="./app.worker.ts"
+ *   fallback={<p>Loading...</p>}
+ *   onReady={(instance) => console.log("ready", instance)}
+ * />
+ * ```
+ */
+declare function AsyncDom(props: AsyncDomProps): ReactNode;
+//# sourceMappingURL=async-dom-component.d.ts.map
+//#endregion
+//#region src/react/use-async-dom.d.ts
+interface UseAsyncDomOptions {
+  /** Worker script path or factory function */
+  worker: string | (() => Worker);
+  /** Scheduler configuration */
+  scheduler?: SchedulerConfig;
+  /** Debug options (pass `true` for sensible defaults, or a `DebugOptions` object) */
+  debug?: DebugOptions | boolean;
+  /** Called when the async-dom instance is ready */
+  onReady?: (instance: AsyncDomInstance) => void;
+  /** Called when a worker error occurs */
+  onError?: (error: SerializedError) => void;
+}
+interface UseAsyncDomResult {
+  /** Ref to attach to the container element */
+  containerRef: React.RefObject<HTMLDivElement | null>;
+  /** The async-dom instance (null until ready) */
+  instance: AsyncDomInstance | null;
+}
+/**
+ * React hook that creates and manages an async-dom instance.
+ *
+ * Attaches an async-dom worker to the container element referenced by
+ * `containerRef`. The instance is created on mount and destroyed on unmount.
+ *
+ * @param options - Configuration for the async-dom instance.
+ * @returns An object containing the container ref and the instance (null until ready).
+ *
+ * @example
+ * ```tsx
+ * function MyComponent() {
+ *   const { containerRef, instance } = useAsyncDom({
+ *     worker: "./my-worker.ts",
+ *     onReady: (inst) => console.log("Ready!", inst),
+ *   });
+ *   return <div ref={containerRef} />;
+ * }
+ * ```
+ */
+declare function useAsyncDom(options: UseAsyncDomOptions): UseAsyncDomResult;
+//# sourceMappingURL=use-async-dom.d.ts.map
+
+//#endregion
+export { AsyncDom, type AsyncDomInstance, type AsyncDomProps, type DebugOptions, type SchedulerConfig, type SerializedError, type UseAsyncDomOptions, type UseAsyncDomResult, useAsyncDom };
+//# sourceMappingURL=react.d.cts.map

package/dist/react.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"react.d.cts","names":[],"sources":["../src/react/async-dom-component.ts","../src/react/use-async-dom.ts"],"sourcesContent":[],"mappings":";;;;;;UAKiB,aAAA;;0BAEQ;EAFR;EAAa,SAAA,CAAA,EAIjB,eAJiB;;OAIjB,CAAA,EAEJ,YAFI,GAAA,OAAA;;UAID,CAAA,EAAA,SAAA;;SAIO,CAAA,EAAA,CAAA,QAAA,EAFG,gBAEH,EAAA,GAAA,IAAA;;EAIS,OAAA,CAAA,EAAA,CAAA,KAAA,EAJT,eAIS,EAAA,GAAA,IAAA;EAsBZ;EAAQ,SAAA,CAAA,EAAA,MAAA;;OAAwB,CAAA,EAtBvC,KAAA,CAAM,aAsBiC;;;;;ACtChD;;;;;;;;AAaA;;;;;;AA2BA;;AAAqC,iBDFrB,QAAA,CCEqB,KAAA,EDFL,aCEK,CAAA,EDFW,SCEX;;;;UAxCpB,kBAAA;;0BAEQ;;EDFR,SAAA,CAAA,ECIJ,eDJiB;EAAA;OAEL,CAAA,ECIhB,YDJgB,GAAA,OAAA;;SAIhB,CAAA,EAAA,CAAA,QAAA,ECEa,gBDFb,EAAA,GAAA,IAAA;;SAIa,CAAA,EAAA,CAAA,KAAA,ECAH,eDAG,EAAA,GAAA,IAAA;;AAMb,UCHQ,iBAAA,CDGF;EAAa;EAsBZ,YAAQ,ECvBT,KAAA,CAAM,SDuBG,CCvBO,cDuBP,GAAA,IAAA,CAAA;EAAA;UAAQ,ECrBrB,gBDqBqB,GAAA,IAAA;;;;;;ACtChC;;;;;;;;AAaA;;;;;;AA2BA;;AAAqC,iBAArB,WAAA,CAAqB,OAAA,EAAA,kBAAA,CAAA,EAAqB,iBAArB"}

package/dist/react.d.ts

@@ -0,0 +1,91 @@
+import { v as SerializedError } from "./base.js";
+import { n as DebugOptions } from "./debug.js";
+import { g as SchedulerConfig, r as AsyncDomInstance } from "./index.js";
+import { ReactNode } from "react";
+
+//#region src/react/async-dom-component.d.ts
+interface AsyncDomProps {
+  /** Worker script path or factory function */
+  worker: string | (() => Worker);
+  /** Scheduler configuration */
+  scheduler?: SchedulerConfig;
+  /** Enable debug mode (true for defaults, or pass DebugOptions) */
+  debug?: DebugOptions | boolean;
+  /** Fallback content shown while loading */
+  fallback?: ReactNode;
+  /** Called when the async-dom instance is ready */
+  onReady?: (instance: AsyncDomInstance) => void;
+  /** Called when a worker error occurs */
+  onError?: (error: SerializedError) => void;
+  /** CSS class name for the container div */
+  className?: string;
+  /** Inline styles for the container div */
+  style?: React.CSSProperties;
+}
+/**
+ * React component that renders an async-dom worker application.
+ *
+ * Wraps {@link useAsyncDom} in a self-contained component with a container div.
+ * Supports a `fallback` prop for loading state, and passes through `className`
+ * and `style` to the container element.
+ *
+ * @param props - Component props.
+ * @returns A React element containing the async-dom container.
+ *
+ * @example
+ * ```tsx
+ * <AsyncDom
+ *   worker="./app.worker.ts"
+ *   fallback={<p>Loading...</p>}
+ *   onReady={(instance) => console.log("ready", instance)}
+ * />
+ * ```
+ */
+declare function AsyncDom(props: AsyncDomProps): ReactNode;
+//# sourceMappingURL=async-dom-component.d.ts.map
+//#endregion
+//#region src/react/use-async-dom.d.ts
+interface UseAsyncDomOptions {
+  /** Worker script path or factory function */
+  worker: string | (() => Worker);
+  /** Scheduler configuration */
+  scheduler?: SchedulerConfig;
+  /** Debug options (pass `true` for sensible defaults, or a `DebugOptions` object) */
+  debug?: DebugOptions | boolean;
+  /** Called when the async-dom instance is ready */
+  onReady?: (instance: AsyncDomInstance) => void;
+  /** Called when a worker error occurs */
+  onError?: (error: SerializedError) => void;
+}
+interface UseAsyncDomResult {
+  /** Ref to attach to the container element */
+  containerRef: React.RefObject<HTMLDivElement | null>;
+  /** The async-dom instance (null until ready) */
+  instance: AsyncDomInstance | null;
+}
+/**
+ * React hook that creates and manages an async-dom instance.
+ *
+ * Attaches an async-dom worker to the container element referenced by
+ * `containerRef`. The instance is created on mount and destroyed on unmount.
+ *
+ * @param options - Configuration for the async-dom instance.
+ * @returns An object containing the container ref and the instance (null until ready).
+ *
+ * @example
+ * ```tsx
+ * function MyComponent() {
+ *   const { containerRef, instance } = useAsyncDom({
+ *     worker: "./my-worker.ts",
+ *     onReady: (inst) => console.log("Ready!", inst),
+ *   });
+ *   return <div ref={containerRef} />;
+ * }
+ * ```
+ */
+declare function useAsyncDom(options: UseAsyncDomOptions): UseAsyncDomResult;
+//# sourceMappingURL=use-async-dom.d.ts.map
+
+//#endregion
+export { AsyncDom, type AsyncDomInstance, type AsyncDomProps, type DebugOptions, type SchedulerConfig, type SerializedError, type UseAsyncDomOptions, type UseAsyncDomResult, useAsyncDom };
+//# sourceMappingURL=react.d.ts.map

package/dist/react.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"react.d.ts","names":[],"sources":["../src/react/async-dom-component.ts","../src/react/use-async-dom.ts"],"sourcesContent":[],"mappings":";;;;;;UAKiB,aAAA;;0BAEQ;EAFR;EAAa,SAAA,CAAA,EAIjB,eAJiB;;OAIjB,CAAA,EAEJ,YAFI,GAAA,OAAA;;UAID,CAAA,EAAA,SAAA;;SAIO,CAAA,EAAA,CAAA,QAAA,EAFG,gBAEH,EAAA,GAAA,IAAA;;EAIS,OAAA,CAAA,EAAA,CAAA,KAAA,EAJT,eAIS,EAAA,GAAA,IAAA;EAsBZ;EAAQ,SAAA,CAAA,EAAA,MAAA;;OAAwB,CAAA,EAtBvC,KAAA,CAAM,aAsBiC;;;;;ACtChD;;;;;;;;AAaA;;;;;;AA2BA;;AAAqC,iBDFrB,QAAA,CCEqB,KAAA,EDFL,aCEK,CAAA,EDFW,SCEX;;;;UAxCpB,kBAAA;;0BAEQ;;EDFR,SAAA,CAAA,ECIJ,eDJiB;EAAA;OAEL,CAAA,ECIhB,YDJgB,GAAA,OAAA;;SAIhB,CAAA,EAAA,CAAA,QAAA,ECEa,gBDFb,EAAA,GAAA,IAAA;;SAIa,CAAA,EAAA,CAAA,KAAA,ECAH,eDAG,EAAA,GAAA,IAAA;;AAMb,UCHQ,iBAAA,CDGF;EAAa;EAsBZ,YAAQ,ECvBT,KAAA,CAAM,SDuBG,CCvBO,cDuBP,GAAA,IAAA,CAAA;EAAA;UAAQ,ECrBrB,gBDqBqB,GAAA,IAAA;;;;;;ACtChC;;;;;;;;AAaA;;;;;;AA2BA;;AAAqC,iBAArB,WAAA,CAAqB,OAAA,EAAA,kBAAA,CAAA,EAAqB,iBAArB"}

package/dist/react.js

@@ -0,0 +1,113 @@
+import { t as resolveDebugOption } from "./resolve-debug.js";
+import { createElement, useEffect, useRef, useState } from "react";
+//#region src/react/use-async-dom.ts
+/**
+* React hook that creates and manages an async-dom instance.
+*
+* Attaches an async-dom worker to the container element referenced by
+* `containerRef`. The instance is created on mount and destroyed on unmount.
+*
+* @param options - Configuration for the async-dom instance.
+* @returns An object containing the container ref and the instance (null until ready).
+*
+* @example
+* ```tsx
+* function MyComponent() {
+*   const { containerRef, instance } = useAsyncDom({
+*     worker: "./my-worker.ts",
+*     onReady: (inst) => console.log("Ready!", inst),
+*   });
+*   return <div ref={containerRef} />;
+* }
+* ```
+*/
+function useAsyncDom(options) {
+	const containerRef = useRef(null);
+	const [instance, setInstance] = useState(null);
+	const instanceRef = useRef(null);
+	const workerRef = useRef(options.worker);
+	workerRef.current = options.worker;
+	const onReadyRef = useRef(options.onReady);
+	onReadyRef.current = options.onReady;
+	const onErrorRef = useRef(options.onError);
+	onErrorRef.current = options.onError;
+	const debugRef = useRef(options.debug);
+	debugRef.current = options.debug;
+	const schedulerRef = useRef(options.scheduler);
+	schedulerRef.current = options.scheduler;
+	useEffect(() => {
+		const el = containerRef.current;
+		if (!el) return;
+		let cancelled = false;
+		const workerProp = workerRef.current;
+		const worker = typeof workerProp === "string" ? new Worker(new URL(workerProp, import.meta.url), { type: "module" }) : workerProp();
+		import("./main-thread.js").then((n) => n.n).then(({ createAsyncDom }) => {
+			if (cancelled) {
+				worker.terminate();
+				return;
+			}
+			const inst = createAsyncDom({
+				target: el,
+				worker,
+				scheduler: schedulerRef.current,
+				debug: resolveDebugOption(debugRef.current)
+			});
+			inst.start();
+			instanceRef.current = inst;
+			setInstance(inst);
+			onReadyRef.current?.(inst);
+		});
+		return () => {
+			cancelled = true;
+			instanceRef.current?.destroy();
+			instanceRef.current = null;
+			setInstance(null);
+		};
+	}, []);
+	return {
+		containerRef,
+		instance
+	};
+}
+//#endregion
+//#region src/react/async-dom-component.ts
+/**
+* React component that renders an async-dom worker application.
+*
+* Wraps {@link useAsyncDom} in a self-contained component with a container div.
+* Supports a `fallback` prop for loading state, and passes through `className`
+* and `style` to the container element.
+*
+* @param props - Component props.
+* @returns A React element containing the async-dom container.
+*
+* @example
+* ```tsx
+* <AsyncDom
+*   worker="./app.worker.ts"
+*   fallback={<p>Loading...</p>}
+*   onReady={(instance) => console.log("ready", instance)}
+* />
+* ```
+*/
+function AsyncDom(props) {
+	const { containerRef, instance } = useAsyncDom({
+		worker: props.worker,
+		scheduler: props.scheduler,
+		debug: props.debug,
+		onReady: props.onReady,
+		onError: props.onError
+	});
+	if (typeof window === "undefined") return createElement("div", {
+		className: props.className,
+		style: props.style
+	});
+	return createElement("div", {
+		className: props.className,
+		style: props.style
+	}, !instance && props.fallback ? props.fallback : null, createElement("div", { ref: containerRef }));
+}
+//#endregion
+export { AsyncDom, useAsyncDom };
+
+//# sourceMappingURL=react.js.map

package/dist/react.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"react.js","names":[],"sources":["../src/react/use-async-dom.ts","../src/react/async-dom-component.ts"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport type { DebugOptions, SchedulerConfig, SerializedError } from \"../index.ts\";\nimport type { AsyncDomInstance } from \"../main-thread/index.ts\";\nimport { resolveDebugOption } from \"../shared/resolve-debug.ts\";\n\nexport interface UseAsyncDomOptions {\n\t/** Worker script path or factory function */\n\tworker: string | (() => Worker);\n\t/** Scheduler configuration */\n\tscheduler?: SchedulerConfig;\n\t/** Debug options (pass `true` for sensible defaults, or a `DebugOptions` object) */\n\tdebug?: DebugOptions | boolean;\n\t/** Called when the async-dom instance is ready */\n\tonReady?: (instance: AsyncDomInstance) => void;\n\t/** Called when a worker error occurs */\n\tonError?: (error: SerializedError) => void;\n}\n\nexport interface UseAsyncDomResult {\n\t/** Ref to attach to the container element */\n\tcontainerRef: React.RefObject<HTMLDivElement | null>;\n\t/** The async-dom instance (null until ready) */\n\tinstance: AsyncDomInstance | null;\n}\n\n/**\n * React hook that creates and manages an async-dom instance.\n *\n * Attaches an async-dom worker to the container element referenced by\n * `containerRef`. The instance is created on mount and destroyed on unmount.\n *\n * @param options - Configuration for the async-dom instance.\n * @returns An object containing the container ref and the instance (null until ready).\n *\n * @example\n * ```tsx\n * function MyComponent() {\n *   const { containerRef, instance } = useAsyncDom({\n *     worker: \"./my-worker.ts\",\n *     onReady: (inst) => console.log(\"Ready!\", inst),\n *   });\n *   return <div ref={containerRef} />;\n * }\n * ```\n */\nexport function useAsyncDom(options: UseAsyncDomOptions): UseAsyncDomResult {\n\tconst containerRef = useRef<HTMLDivElement | null>(null);\n\tconst [instance, setInstance] = useState<AsyncDomInstance | null>(null);\n\tconst instanceRef = useRef<AsyncDomInstance | null>(null);\n\n\t// Stabilize callback refs to prevent re-creation on re-renders\n\tconst workerRef = useRef(options.worker);\n\tworkerRef.current = options.worker;\n\n\tconst onReadyRef = useRef(options.onReady);\n\tonReadyRef.current = options.onReady;\n\n\tconst onErrorRef = useRef(options.onError);\n\tonErrorRef.current = options.onError;\n\n\tconst debugRef = useRef(options.debug);\n\tdebugRef.current = options.debug;\n\n\tconst schedulerRef = useRef(options.scheduler);\n\tschedulerRef.current = options.scheduler;\n\n\tuseEffect(() => {\n\t\tconst el = containerRef.current;\n\t\tif (!el) return;\n\n\t\tlet cancelled = false;\n\t\tconst workerProp = workerRef.current;\n\t\tconst worker =\n\t\t\ttypeof workerProp === \"string\"\n\t\t\t\t? new Worker(new URL(workerProp, import.meta.url), { type: \"module\" })\n\t\t\t\t: workerProp();\n\n\t\t// Dynamic import to avoid pulling main-thread code into SSR bundles\n\t\timport(\"../main-thread/index.ts\").then(({ createAsyncDom }) => {\n\t\t\tif (cancelled) {\n\t\t\t\tworker.terminate();\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst inst = createAsyncDom({\n\t\t\t\ttarget: el,\n\t\t\t\tworker,\n\t\t\t\tscheduler: schedulerRef.current,\n\t\t\t\tdebug: resolveDebugOption(debugRef.current),\n\t\t\t});\n\t\t\tinst.start();\n\t\t\tinstanceRef.current = inst;\n\t\t\tsetInstance(inst);\n\t\t\tonReadyRef.current?.(inst);\n\t\t});\n\n\t\treturn () => {\n\t\t\tcancelled = true;\n\t\t\tinstanceRef.current?.destroy();\n\t\t\tinstanceRef.current = null;\n\t\t\tsetInstance(null);\n\t\t};\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, []);\n\n\treturn { containerRef, instance };\n}\n","import { createElement, type ReactNode } from \"react\";\nimport type { DebugOptions, SchedulerConfig, SerializedError } from \"../index.ts\";\nimport type { AsyncDomInstance } from \"../main-thread/index.ts\";\nimport { useAsyncDom } from \"./use-async-dom.ts\";\n\nexport interface AsyncDomProps {\n\t/** Worker script path or factory function */\n\tworker: string | (() => Worker);\n\t/** Scheduler configuration */\n\tscheduler?: SchedulerConfig;\n\t/** Enable debug mode (true for defaults, or pass DebugOptions) */\n\tdebug?: DebugOptions | boolean;\n\t/** Fallback content shown while loading */\n\tfallback?: ReactNode;\n\t/** Called when the async-dom instance is ready */\n\tonReady?: (instance: AsyncDomInstance) => void;\n\t/** Called when a worker error occurs */\n\tonError?: (error: SerializedError) => void;\n\t/** CSS class name for the container div */\n\tclassName?: string;\n\t/** Inline styles for the container div */\n\tstyle?: React.CSSProperties;\n}\n\n/**\n * React component that renders an async-dom worker application.\n *\n * Wraps {@link useAsyncDom} in a self-contained component with a container div.\n * Supports a `fallback` prop for loading state, and passes through `className`\n * and `style` to the container element.\n *\n * @param props - Component props.\n * @returns A React element containing the async-dom container.\n *\n * @example\n * ```tsx\n * <AsyncDom\n *   worker=\"./app.worker.ts\"\n *   fallback={<p>Loading...</p>}\n *   onReady={(instance) => console.log(\"ready\", instance)}\n * />\n * ```\n */\nexport function AsyncDom(props: AsyncDomProps): ReactNode {\n\tconst { containerRef, instance } = useAsyncDom({\n\t\tworker: props.worker,\n\t\tscheduler: props.scheduler,\n\t\tdebug: props.debug,\n\t\tonReady: props.onReady,\n\t\tonError: props.onError,\n\t});\n\n\t// SSR guard: render only the container div\n\tif (typeof window === \"undefined\") {\n\t\treturn createElement(\"div\", {\n\t\t\tclassName: props.className,\n\t\t\tstyle: props.style,\n\t\t});\n\t}\n\n\t// Fallback is rendered as a sibling before the container to avoid\n\t// conflicting with createAsyncDom's DOM manipulation of the target element.\n\treturn createElement(\n\t\t\"div\",\n\t\t{ className: props.className, style: props.style },\n\t\t!instance && props.fallback ? props.fallback : null,\n\t\tcreateElement(\"div\", { ref: containerRef }),\n\t);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AA6CA,SAAgB,YAAY,SAAgD;CAC3E,MAAM,eAAe,OAA8B,KAAK;CACxD,MAAM,CAAC,UAAU,eAAe,SAAkC,KAAK;CACvE,MAAM,cAAc,OAAgC,KAAK;CAGzD,MAAM,YAAY,OAAO,QAAQ,OAAO;AACxC,WAAU,UAAU,QAAQ;CAE5B,MAAM,aAAa,OAAO,QAAQ,QAAQ;AAC1C,YAAW,UAAU,QAAQ;CAE7B,MAAM,aAAa,OAAO,QAAQ,QAAQ;AAC1C,YAAW,UAAU,QAAQ;CAE7B,MAAM,WAAW,OAAO,QAAQ,MAAM;AACtC,UAAS,UAAU,QAAQ;CAE3B,MAAM,eAAe,OAAO,QAAQ,UAAU;AAC9C,cAAa,UAAU,QAAQ;AAE/B,iBAAgB;EACf,MAAM,KAAK,aAAa;AACxB,MAAI,CAAC,GAAI;EAET,IAAI,YAAY;EAChB,MAAM,aAAa,UAAU;EAC7B,MAAM,SACL,OAAO,eAAe,WACnB,IAAI,OAAO,IAAI,IAAI,YAAY,OAAO,KAAK,IAAI,EAAE,EAAE,MAAM,UAAU,CAAC,GACpE,YAAY;AAGhB,SAAO,oBAAA,MAAA,MAAA,EAAA,EAAA,CAA2B,MAAM,EAAE,qBAAqB;AAC9D,OAAI,WAAW;AACd,WAAO,WAAW;AAClB;;GAGD,MAAM,OAAO,eAAe;IAC3B,QAAQ;IACR;IACA,WAAW,aAAa;IACxB,OAAO,mBAAmB,SAAS,QAAQ;IAC3C,CAAC;AACF,QAAK,OAAO;AACZ,eAAY,UAAU;AACtB,eAAY,KAAK;AACjB,cAAW,UAAU,KAAK;IACzB;AAEF,eAAa;AACZ,eAAY;AACZ,eAAY,SAAS,SAAS;AAC9B,eAAY,UAAU;AACtB,eAAY,KAAK;;IAGhB,EAAE,CAAC;AAEN,QAAO;EAAE;EAAc;EAAU;;;;;;;;;;;;;;;;;;;;;;;AC9DlC,SAAgB,SAAS,OAAiC;CACzD,MAAM,EAAE,cAAc,aAAa,YAAY;EAC9C,QAAQ,MAAM;EACd,WAAW,MAAM;EACjB,OAAO,MAAM;EACb,SAAS,MAAM;EACf,SAAS,MAAM;EACf,CAAC;AAGF,KAAI,OAAO,WAAW,YACrB,QAAO,cAAc,OAAO;EAC3B,WAAW,MAAM;EACjB,OAAO,MAAM;EACb,CAAC;AAKH,QAAO,cACN,OACA;EAAE,WAAW,MAAM;EAAW,OAAO,MAAM;EAAO,EAClD,CAAC,YAAY,MAAM,WAAW,MAAM,WAAW,MAC/C,cAAc,OAAO,EAAE,KAAK,cAAc,CAAC,CAC3C"}

package/dist/resolve-debug.cjs

@@ -0,0 +1,24 @@
+//#region src/shared/resolve-debug.ts
+/**
+* Resolves a `debug` option that can be `true`, a `DebugOptions` object, or `undefined`.
+* `true` expands to sensible defaults; falsy values resolve to `undefined`.
+*
+* Shared across all framework adapters to avoid logic drift.
+*/
+function resolveDebugOption(debug) {
+	if (debug === true) return {
+		logMutations: true,
+		logEvents: true,
+		exposeDevtools: true
+	};
+	return debug || void 0;
+}
+//#endregion
+Object.defineProperty(exports, "resolveDebugOption", {
+	enumerable: true,
+	get: function() {
+		return resolveDebugOption;
+	}
+});
+
+//# sourceMappingURL=resolve-debug.cjs.map

package/dist/resolve-debug.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolve-debug.cjs","names":[],"sources":["../src/shared/resolve-debug.ts"],"sourcesContent":["import type { DebugOptions } from \"../core/debug.ts\";\n\n/**\n * Resolves a `debug` option that can be `true`, a `DebugOptions` object, or `undefined`.\n * `true` expands to sensible defaults; falsy values resolve to `undefined`.\n *\n * Shared across all framework adapters to avoid logic drift.\n */\nexport function resolveDebugOption(\n\tdebug: DebugOptions | boolean | undefined,\n): DebugOptions | undefined {\n\tif (debug === true) {\n\t\treturn { logMutations: true, logEvents: true, exposeDevtools: true };\n\t}\n\treturn debug || undefined;\n}\n"],"mappings":";;;;;;;AAQA,SAAgB,mBACf,OAC2B;AAC3B,KAAI,UAAU,KACb,QAAO;EAAE,cAAc;EAAM,WAAW;EAAM,gBAAgB;EAAM;AAErE,QAAO,SAAS,KAAA"}

package/dist/resolve-debug.js

@@ -0,0 +1,19 @@
+//#region src/shared/resolve-debug.ts
+/**
+* Resolves a `debug` option that can be `true`, a `DebugOptions` object, or `undefined`.
+* `true` expands to sensible defaults; falsy values resolve to `undefined`.
+*
+* Shared across all framework adapters to avoid logic drift.
+*/
+function resolveDebugOption(debug) {
+	if (debug === true) return {
+		logMutations: true,
+		logEvents: true,
+		exposeDevtools: true
+	};
+	return debug || void 0;
+}
+//#endregion
+export { resolveDebugOption as t };
+
+//# sourceMappingURL=resolve-debug.js.map

package/dist/resolve-debug.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolve-debug.js","names":[],"sources":["../src/shared/resolve-debug.ts"],"sourcesContent":["import type { DebugOptions } from \"../core/debug.ts\";\n\n/**\n * Resolves a `debug` option that can be `true`, a `DebugOptions` object, or `undefined`.\n * `true` expands to sensible defaults; falsy values resolve to `undefined`.\n *\n * Shared across all framework adapters to avoid logic drift.\n */\nexport function resolveDebugOption(\n\tdebug: DebugOptions | boolean | undefined,\n): DebugOptions | undefined {\n\tif (debug === true) {\n\t\treturn { logMutations: true, logEvents: true, exposeDevtools: true };\n\t}\n\treturn debug || undefined;\n}\n"],"mappings":";;;;;;;AAQA,SAAgB,mBACf,OAC2B;AAC3B,KAAI,UAAU,KACb,QAAO;EAAE,cAAc;EAAM,WAAW;EAAM,gBAAgB;EAAM;AAErE,QAAO,SAAS,KAAA"}