@lifeart/async-dom 2.0.0-alpha.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +623 -0
- package/dist/base.d.cts +398 -0
- package/dist/base.d.cts.map +1 -0
- package/dist/base.d.ts +398 -0
- package/dist/base.d.ts.map +1 -0
- package/dist/cli.cjs +528 -0
- package/dist/cli.cjs.map +1 -0
- package/dist/cli.d.cts +1 -0
- package/dist/cli.d.ts +1 -0
- package/dist/cli.js +493 -0
- package/dist/cli.js.map +1 -0
- package/dist/debug.d.cts +145 -0
- package/dist/debug.d.cts.map +1 -0
- package/dist/debug.d.ts +145 -0
- package/dist/debug.d.ts.map +1 -0
- package/dist/index.cjs +26 -0
- package/dist/index.d.cts +560 -0
- package/dist/index.d.cts.map +1 -0
- package/dist/index.d.ts +560 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +5 -0
- package/dist/index2.d.cts +5 -0
- package/dist/index2.d.ts +5 -0
- package/dist/index3.d.cts +882 -0
- package/dist/index3.d.cts.map +1 -0
- package/dist/index3.d.ts +882 -0
- package/dist/index3.d.ts.map +1 -0
- package/dist/main-thread.cjs +5459 -0
- package/dist/main-thread.cjs.map +1 -0
- package/dist/main-thread.js +5429 -0
- package/dist/main-thread.js.map +1 -0
- package/dist/react.cjs +116 -0
- package/dist/react.cjs.map +1 -0
- package/dist/react.d.cts +91 -0
- package/dist/react.d.cts.map +1 -0
- package/dist/react.d.ts +91 -0
- package/dist/react.d.ts.map +1 -0
- package/dist/react.js +113 -0
- package/dist/react.js.map +1 -0
- package/dist/resolve-debug.cjs +24 -0
- package/dist/resolve-debug.cjs.map +1 -0
- package/dist/resolve-debug.js +19 -0
- package/dist/resolve-debug.js.map +1 -0
- package/dist/server.cjs +250 -0
- package/dist/server.cjs.map +1 -0
- package/dist/server.d.cts +127 -0
- package/dist/server.d.cts.map +1 -0
- package/dist/server.d.ts +127 -0
- package/dist/server.d.ts.map +1 -0
- package/dist/server.js +245 -0
- package/dist/server.js.map +1 -0
- package/dist/svelte.cjs +48 -0
- package/dist/svelte.cjs.map +1 -0
- package/dist/svelte.d.cts +38 -0
- package/dist/svelte.d.cts.map +1 -0
- package/dist/svelte.d.ts +38 -0
- package/dist/svelte.d.ts.map +1 -0
- package/dist/svelte.js +47 -0
- package/dist/svelte.js.map +1 -0
- package/dist/sync-channel.cjs +532 -0
- package/dist/sync-channel.cjs.map +1 -0
- package/dist/sync-channel.js +425 -0
- package/dist/sync-channel.js.map +1 -0
- package/dist/transport.cjs +213 -0
- package/dist/transport.cjs.map +1 -0
- package/dist/transport.d.cts +79 -0
- package/dist/transport.d.cts.map +1 -0
- package/dist/transport.d.ts +79 -0
- package/dist/transport.d.ts.map +1 -0
- package/dist/transport.js +202 -0
- package/dist/transport.js.map +1 -0
- package/dist/vite-plugin.cjs +112 -0
- package/dist/vite-plugin.cjs.map +1 -0
- package/dist/vite-plugin.d.cts +39 -0
- package/dist/vite-plugin.d.cts.map +1 -0
- package/dist/vite-plugin.d.ts +39 -0
- package/dist/vite-plugin.d.ts.map +1 -0
- package/dist/vite-plugin.js +107 -0
- package/dist/vite-plugin.js.map +1 -0
- package/dist/vue.cjs +123 -0
- package/dist/vue.cjs.map +1 -0
- package/dist/vue.d.cts +126 -0
- package/dist/vue.d.cts.map +1 -0
- package/dist/vue.d.ts +126 -0
- package/dist/vue.d.ts.map +1 -0
- package/dist/vue.js +120 -0
- package/dist/vue.js.map +1 -0
- package/dist/worker-thread.cjs +2751 -0
- package/dist/worker-thread.cjs.map +1 -0
- package/dist/worker-thread.js +2692 -0
- package/dist/worker-thread.js.map +1 -0
- package/dist/worker-transport.cjs +136 -0
- package/dist/worker-transport.cjs.map +1 -0
- package/dist/worker-transport.d.cts +162 -0
- package/dist/worker-transport.d.cts.map +1 -0
- package/dist/worker-transport.d.ts +162 -0
- package/dist/worker-transport.d.ts.map +1 -0
- package/dist/worker-transport.js +125 -0
- package/dist/worker-transport.js.map +1 -0
- package/dist/worker.cjs +12 -0
- package/dist/worker.d.cts +2 -0
- package/dist/worker.d.ts +2 -0
- package/dist/worker.js +2 -0
- package/dist/ws-server-transport.cjs +147 -0
- package/dist/ws-server-transport.cjs.map +1 -0
- package/dist/ws-server-transport.d.cts +64 -0
- package/dist/ws-server-transport.d.cts.map +1 -0
- package/dist/ws-server-transport.d.ts +64 -0
- package/dist/ws-server-transport.d.ts.map +1 -0
- package/dist/ws-server-transport.js +142 -0
- package/dist/ws-server-transport.js.map +1 -0
- package/dist/ws-transport.cjs +954 -0
- package/dist/ws-transport.cjs.map +1 -0
- package/dist/ws-transport.js +913 -0
- package/dist/ws-transport.js.map +1 -0
- package/package.json +145 -0
|
@@ -0,0 +1,112 @@
|
|
|
1
|
+
Object.defineProperties(exports, {
|
|
2
|
+
__esModule: { value: true },
|
|
3
|
+
[Symbol.toStringTag]: { value: "Module" }
|
|
4
|
+
});
|
|
5
|
+
//#region src/vite-plugin/error-snippet.ts
|
|
6
|
+
/**
|
|
7
|
+
* Client-side snippet injected during development that forwards
|
|
8
|
+
* worker errors to the Vite error overlay via HMR.
|
|
9
|
+
*
|
|
10
|
+
* Note: This is injected as `children` of a `<script type="module">` tag
|
|
11
|
+
* by the Vite `transformIndexHtml` hook — do NOT wrap in `<script>` tags.
|
|
12
|
+
*/
|
|
13
|
+
const workerErrorSnippet = `
|
|
14
|
+
if (import.meta.hot) {
|
|
15
|
+
const origOnerror = self.onerror;
|
|
16
|
+
self.onerror = function(message, source, lineno, colno, error) {
|
|
17
|
+
if (source && source.includes('worker')) {
|
|
18
|
+
import.meta.hot.send('async-dom:error', {
|
|
19
|
+
message: error ? error.message : String(message),
|
|
20
|
+
stack: error ? error.stack : '',
|
|
21
|
+
source: source,
|
|
22
|
+
lineno: lineno,
|
|
23
|
+
colno: colno,
|
|
24
|
+
});
|
|
25
|
+
}
|
|
26
|
+
if (origOnerror) return origOnerror.call(this, message, source, lineno, colno, error);
|
|
27
|
+
};
|
|
28
|
+
}
|
|
29
|
+
`;
|
|
30
|
+
//#endregion
|
|
31
|
+
//#region src/vite-plugin/index.ts
|
|
32
|
+
const COOP_HEADER = "Cross-Origin-Opener-Policy";
|
|
33
|
+
const COEP_HEADER = "Cross-Origin-Embedder-Policy";
|
|
34
|
+
function addCrossOriginHeaders(server, enabled) {
|
|
35
|
+
if (!enabled) return;
|
|
36
|
+
server.middlewares.use((_req, res, next) => {
|
|
37
|
+
if (!res.getHeader(COOP_HEADER)) res.setHeader(COOP_HEADER, "same-origin");
|
|
38
|
+
if (!res.getHeader(COEP_HEADER)) res.setHeader(COEP_HEADER, "require-corp");
|
|
39
|
+
next();
|
|
40
|
+
});
|
|
41
|
+
}
|
|
42
|
+
/**
|
|
43
|
+
* Vite plugin that configures your project for async-dom.
|
|
44
|
+
*
|
|
45
|
+
* - Sets COOP/COEP headers for SharedArrayBuffer support
|
|
46
|
+
* - Injects `__ASYNC_DOM_DEBUG__` and `__ASYNC_DOM_BINARY__` compile-time flags
|
|
47
|
+
* - Forwards worker errors to the Vite error overlay during development
|
|
48
|
+
*
|
|
49
|
+
* @param options - Plugin configuration options.
|
|
50
|
+
* @returns A Vite plugin instance.
|
|
51
|
+
*
|
|
52
|
+
* @example
|
|
53
|
+
* ```ts
|
|
54
|
+
* // vite.config.ts
|
|
55
|
+
* import { defineConfig } from "vite";
|
|
56
|
+
* import { asyncDomPlugin } from "@lifeart/async-dom/vite-plugin";
|
|
57
|
+
*
|
|
58
|
+
* export default defineConfig({
|
|
59
|
+
* plugins: [asyncDomPlugin()],
|
|
60
|
+
* });
|
|
61
|
+
* ```
|
|
62
|
+
*/
|
|
63
|
+
function asyncDomPlugin(options = {}) {
|
|
64
|
+
const { headers = true, debug, binaryTransport = true, workerErrorOverlay = true } = options;
|
|
65
|
+
return {
|
|
66
|
+
name: "async-dom",
|
|
67
|
+
config(_config, env) {
|
|
68
|
+
const isDev = env.mode === "development" || env.command === "serve";
|
|
69
|
+
return {
|
|
70
|
+
define: {
|
|
71
|
+
__ASYNC_DOM_DEBUG__: JSON.stringify(debug ?? isDev),
|
|
72
|
+
__ASYNC_DOM_BINARY__: JSON.stringify(!isDev && binaryTransport)
|
|
73
|
+
},
|
|
74
|
+
worker: { format: "es" }
|
|
75
|
+
};
|
|
76
|
+
},
|
|
77
|
+
configureServer(server) {
|
|
78
|
+
addCrossOriginHeaders(server, headers);
|
|
79
|
+
if (workerErrorOverlay) server.hot.on("async-dom:error", (data) => {
|
|
80
|
+
server.hot.send({
|
|
81
|
+
type: "error",
|
|
82
|
+
err: {
|
|
83
|
+
message: data.message ?? "Worker error",
|
|
84
|
+
stack: data.stack ?? "",
|
|
85
|
+
plugin: "async-dom",
|
|
86
|
+
id: data.source ?? "worker"
|
|
87
|
+
}
|
|
88
|
+
});
|
|
89
|
+
});
|
|
90
|
+
},
|
|
91
|
+
configurePreviewServer(server) {
|
|
92
|
+
addCrossOriginHeaders(server, headers);
|
|
93
|
+
},
|
|
94
|
+
transformIndexHtml: {
|
|
95
|
+
order: "pre",
|
|
96
|
+
handler(_html, ctx) {
|
|
97
|
+
if (ctx.server && workerErrorOverlay) return [{
|
|
98
|
+
tag: "script",
|
|
99
|
+
attrs: { type: "module" },
|
|
100
|
+
children: workerErrorSnippet,
|
|
101
|
+
injectTo: "head"
|
|
102
|
+
}];
|
|
103
|
+
return [];
|
|
104
|
+
}
|
|
105
|
+
}
|
|
106
|
+
};
|
|
107
|
+
}
|
|
108
|
+
//#endregion
|
|
109
|
+
exports.asyncDomPlugin = asyncDomPlugin;
|
|
110
|
+
exports.default = asyncDomPlugin;
|
|
111
|
+
|
|
112
|
+
//# sourceMappingURL=vite-plugin.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"vite-plugin.cjs","names":[],"sources":["../src/vite-plugin/error-snippet.ts","../src/vite-plugin/index.ts"],"sourcesContent":["/**\n * Client-side snippet injected during development that forwards\n * worker errors to the Vite error overlay via HMR.\n *\n * Note: This is injected as `children` of a `<script type=\"module\">` tag\n * by the Vite `transformIndexHtml` hook — do NOT wrap in `<script>` tags.\n */\nexport const workerErrorSnippet = `\nif (import.meta.hot) {\n const origOnerror = self.onerror;\n self.onerror = function(message, source, lineno, colno, error) {\n if (source && source.includes('worker')) {\n import.meta.hot.send('async-dom:error', {\n message: error ? error.message : String(message),\n stack: error ? error.stack : '',\n source: source,\n lineno: lineno,\n colno: colno,\n });\n }\n if (origOnerror) return origOnerror.call(this, message, source, lineno, colno, error);\n };\n}\n`;\n","import type { Plugin, ViteDevServer } from \"vite\";\nimport { workerErrorSnippet } from \"./error-snippet.ts\";\n\n/** Configuration options for the async-dom Vite plugin. */\nexport interface AsyncDomPluginOptions {\n\t/** Enable COOP/COEP headers for SharedArrayBuffer support (default: true) */\n\theaders?: boolean;\n\t/** Force debug mode (default: auto — enabled in development) */\n\tdebug?: boolean;\n\t/** Use binary transport in production (default: true) */\n\tbinaryTransport?: boolean;\n\t/** Forward worker errors to Vite error overlay (default: true) */\n\tworkerErrorOverlay?: boolean;\n}\n\nconst COOP_HEADER = \"Cross-Origin-Opener-Policy\";\nconst COEP_HEADER = \"Cross-Origin-Embedder-Policy\";\n\nfunction addCrossOriginHeaders(server: ViteDevServer, enabled: boolean): void {\n\tif (!enabled) return;\n\n\tserver.middlewares.use((_req, res, next) => {\n\t\t// Don't override if already set by the user\n\t\tif (!res.getHeader(COOP_HEADER)) {\n\t\t\tres.setHeader(COOP_HEADER, \"same-origin\");\n\t\t}\n\t\tif (!res.getHeader(COEP_HEADER)) {\n\t\t\tres.setHeader(COEP_HEADER, \"require-corp\");\n\t\t}\n\t\tnext();\n\t});\n}\n\n/**\n * Vite plugin that configures your project for async-dom.\n *\n * - Sets COOP/COEP headers for SharedArrayBuffer support\n * - Injects `__ASYNC_DOM_DEBUG__` and `__ASYNC_DOM_BINARY__` compile-time flags\n * - Forwards worker errors to the Vite error overlay during development\n *\n * @param options - Plugin configuration options.\n * @returns A Vite plugin instance.\n *\n * @example\n * ```ts\n * // vite.config.ts\n * import { defineConfig } from \"vite\";\n * import { asyncDomPlugin } from \"@lifeart/async-dom/vite-plugin\";\n *\n * export default defineConfig({\n * plugins: [asyncDomPlugin()],\n * });\n * ```\n */\nexport function asyncDomPlugin(options: AsyncDomPluginOptions = {}): Plugin {\n\tconst { headers = true, debug, binaryTransport = true, workerErrorOverlay = true } = options;\n\n\treturn {\n\t\tname: \"async-dom\",\n\n\t\tconfig(_config, env) {\n\t\t\tconst isDev = env.mode === \"development\" || env.command === \"serve\";\n\t\t\treturn {\n\t\t\t\tdefine: {\n\t\t\t\t\t__ASYNC_DOM_DEBUG__: JSON.stringify(debug ?? isDev),\n\t\t\t\t\t__ASYNC_DOM_BINARY__: JSON.stringify(!isDev && binaryTransport),\n\t\t\t\t},\n\t\t\t\tworker: {\n\t\t\t\t\tformat: \"es\" as const,\n\t\t\t\t},\n\t\t\t};\n\t\t},\n\n\t\tconfigureServer(server) {\n\t\t\taddCrossOriginHeaders(server, headers);\n\n\t\t\tif (workerErrorOverlay) {\n\t\t\t\tserver.hot.on(\"async-dom:error\", (data) => {\n\t\t\t\t\tserver.hot.send({\n\t\t\t\t\t\ttype: \"error\",\n\t\t\t\t\t\terr: {\n\t\t\t\t\t\t\tmessage: data.message ?? \"Worker error\",\n\t\t\t\t\t\t\tstack: data.stack ?? \"\",\n\t\t\t\t\t\t\tplugin: \"async-dom\",\n\t\t\t\t\t\t\tid: data.source ?? \"worker\",\n\t\t\t\t\t\t},\n\t\t\t\t\t});\n\t\t\t\t});\n\t\t\t}\n\t\t},\n\n\t\tconfigurePreviewServer(server) {\n\t\t\taddCrossOriginHeaders(server as unknown as ViteDevServer, headers);\n\t\t},\n\n\t\ttransformIndexHtml: {\n\t\t\torder: \"pre\",\n\t\t\thandler(_html, ctx) {\n\t\t\t\tif (ctx.server && workerErrorOverlay) {\n\t\t\t\t\treturn [\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\ttag: \"script\",\n\t\t\t\t\t\t\tattrs: { type: \"module\" },\n\t\t\t\t\t\t\tchildren: workerErrorSnippet,\n\t\t\t\t\t\t\tinjectTo: \"head\" as const,\n\t\t\t\t\t\t},\n\t\t\t\t\t];\n\t\t\t\t}\n\t\t\t\treturn [];\n\t\t\t},\n\t\t},\n\t};\n}\n\nexport default asyncDomPlugin;\n"],"mappings":";;;;;;;;;;;;AAOA,MAAa,qBAAqB;;;;;;;;;;;;;;;;;;;ACQlC,MAAM,cAAc;AACpB,MAAM,cAAc;AAEpB,SAAS,sBAAsB,QAAuB,SAAwB;AAC7E,KAAI,CAAC,QAAS;AAEd,QAAO,YAAY,KAAK,MAAM,KAAK,SAAS;AAE3C,MAAI,CAAC,IAAI,UAAU,YAAY,CAC9B,KAAI,UAAU,aAAa,cAAc;AAE1C,MAAI,CAAC,IAAI,UAAU,YAAY,CAC9B,KAAI,UAAU,aAAa,eAAe;AAE3C,QAAM;GACL;;;;;;;;;;;;;;;;;;;;;;;AAwBH,SAAgB,eAAe,UAAiC,EAAE,EAAU;CAC3E,MAAM,EAAE,UAAU,MAAM,OAAO,kBAAkB,MAAM,qBAAqB,SAAS;AAErF,QAAO;EACN,MAAM;EAEN,OAAO,SAAS,KAAK;GACpB,MAAM,QAAQ,IAAI,SAAS,iBAAiB,IAAI,YAAY;AAC5D,UAAO;IACN,QAAQ;KACP,qBAAqB,KAAK,UAAU,SAAS,MAAM;KACnD,sBAAsB,KAAK,UAAU,CAAC,SAAS,gBAAgB;KAC/D;IACD,QAAQ,EACP,QAAQ,MACR;IACD;;EAGF,gBAAgB,QAAQ;AACvB,yBAAsB,QAAQ,QAAQ;AAEtC,OAAI,mBACH,QAAO,IAAI,GAAG,oBAAoB,SAAS;AAC1C,WAAO,IAAI,KAAK;KACf,MAAM;KACN,KAAK;MACJ,SAAS,KAAK,WAAW;MACzB,OAAO,KAAK,SAAS;MACrB,QAAQ;MACR,IAAI,KAAK,UAAU;MACnB;KACD,CAAC;KACD;;EAIJ,uBAAuB,QAAQ;AAC9B,yBAAsB,QAAoC,QAAQ;;EAGnE,oBAAoB;GACnB,OAAO;GACP,QAAQ,OAAO,KAAK;AACnB,QAAI,IAAI,UAAU,mBACjB,QAAO,CACN;KACC,KAAK;KACL,OAAO,EAAE,MAAM,UAAU;KACzB,UAAU;KACV,UAAU;KACV,CACD;AAEF,WAAO,EAAE;;GAEV;EACD"}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import { Plugin } from "vite";
|
|
2
|
+
|
|
3
|
+
//#region src/vite-plugin/index.d.ts
|
|
4
|
+
/** Configuration options for the async-dom Vite plugin. */
|
|
5
|
+
interface AsyncDomPluginOptions {
|
|
6
|
+
/** Enable COOP/COEP headers for SharedArrayBuffer support (default: true) */
|
|
7
|
+
headers?: boolean;
|
|
8
|
+
/** Force debug mode (default: auto — enabled in development) */
|
|
9
|
+
debug?: boolean;
|
|
10
|
+
/** Use binary transport in production (default: true) */
|
|
11
|
+
binaryTransport?: boolean;
|
|
12
|
+
/** Forward worker errors to Vite error overlay (default: true) */
|
|
13
|
+
workerErrorOverlay?: boolean;
|
|
14
|
+
}
|
|
15
|
+
/**
|
|
16
|
+
* Vite plugin that configures your project for async-dom.
|
|
17
|
+
*
|
|
18
|
+
* - Sets COOP/COEP headers for SharedArrayBuffer support
|
|
19
|
+
* - Injects `__ASYNC_DOM_DEBUG__` and `__ASYNC_DOM_BINARY__` compile-time flags
|
|
20
|
+
* - Forwards worker errors to the Vite error overlay during development
|
|
21
|
+
*
|
|
22
|
+
* @param options - Plugin configuration options.
|
|
23
|
+
* @returns A Vite plugin instance.
|
|
24
|
+
*
|
|
25
|
+
* @example
|
|
26
|
+
* ```ts
|
|
27
|
+
* // vite.config.ts
|
|
28
|
+
* import { defineConfig } from "vite";
|
|
29
|
+
* import { asyncDomPlugin } from "@lifeart/async-dom/vite-plugin";
|
|
30
|
+
*
|
|
31
|
+
* export default defineConfig({
|
|
32
|
+
* plugins: [asyncDomPlugin()],
|
|
33
|
+
* });
|
|
34
|
+
* ```
|
|
35
|
+
*/
|
|
36
|
+
declare function asyncDomPlugin(options?: AsyncDomPluginOptions): Plugin;
|
|
37
|
+
//#endregion
|
|
38
|
+
export { AsyncDomPluginOptions, asyncDomPlugin, asyncDomPlugin as default };
|
|
39
|
+
//# sourceMappingURL=vite-plugin.d.cts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"vite-plugin.d.cts","names":[],"sources":["../src/vite-plugin/index.ts"],"sourcesContent":[],"mappings":";;;;UAIiB,qBAAA;EAAA;EAkDD,OAAA,CAAA,EAAA,OAAc;EAAA;OAAU,CAAA,EAAA,OAAA;;EAAmC,eAAA,CAAA,EAAA,OAAA;;;;;;;;;;;;;;;;;;;;;;;;;iBAA3D,cAAA,WAAwB,wBAA6B"}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import { Plugin } from "vite";
|
|
2
|
+
|
|
3
|
+
//#region src/vite-plugin/index.d.ts
|
|
4
|
+
/** Configuration options for the async-dom Vite plugin. */
|
|
5
|
+
interface AsyncDomPluginOptions {
|
|
6
|
+
/** Enable COOP/COEP headers for SharedArrayBuffer support (default: true) */
|
|
7
|
+
headers?: boolean;
|
|
8
|
+
/** Force debug mode (default: auto — enabled in development) */
|
|
9
|
+
debug?: boolean;
|
|
10
|
+
/** Use binary transport in production (default: true) */
|
|
11
|
+
binaryTransport?: boolean;
|
|
12
|
+
/** Forward worker errors to Vite error overlay (default: true) */
|
|
13
|
+
workerErrorOverlay?: boolean;
|
|
14
|
+
}
|
|
15
|
+
/**
|
|
16
|
+
* Vite plugin that configures your project for async-dom.
|
|
17
|
+
*
|
|
18
|
+
* - Sets COOP/COEP headers for SharedArrayBuffer support
|
|
19
|
+
* - Injects `__ASYNC_DOM_DEBUG__` and `__ASYNC_DOM_BINARY__` compile-time flags
|
|
20
|
+
* - Forwards worker errors to the Vite error overlay during development
|
|
21
|
+
*
|
|
22
|
+
* @param options - Plugin configuration options.
|
|
23
|
+
* @returns A Vite plugin instance.
|
|
24
|
+
*
|
|
25
|
+
* @example
|
|
26
|
+
* ```ts
|
|
27
|
+
* // vite.config.ts
|
|
28
|
+
* import { defineConfig } from "vite";
|
|
29
|
+
* import { asyncDomPlugin } from "@lifeart/async-dom/vite-plugin";
|
|
30
|
+
*
|
|
31
|
+
* export default defineConfig({
|
|
32
|
+
* plugins: [asyncDomPlugin()],
|
|
33
|
+
* });
|
|
34
|
+
* ```
|
|
35
|
+
*/
|
|
36
|
+
declare function asyncDomPlugin(options?: AsyncDomPluginOptions): Plugin;
|
|
37
|
+
//#endregion
|
|
38
|
+
export { AsyncDomPluginOptions, asyncDomPlugin, asyncDomPlugin as default };
|
|
39
|
+
//# sourceMappingURL=vite-plugin.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"vite-plugin.d.ts","names":[],"sources":["../src/vite-plugin/index.ts"],"sourcesContent":[],"mappings":";;;;UAIiB,qBAAA;EAAA;EAkDD,OAAA,CAAA,EAAA,OAAc;EAAA;OAAU,CAAA,EAAA,OAAA;;EAAmC,eAAA,CAAA,EAAA,OAAA;;;;;;;;;;;;;;;;;;;;;;;;;iBAA3D,cAAA,WAAwB,wBAA6B"}
|
|
@@ -0,0 +1,107 @@
|
|
|
1
|
+
//#region src/vite-plugin/error-snippet.ts
|
|
2
|
+
/**
|
|
3
|
+
* Client-side snippet injected during development that forwards
|
|
4
|
+
* worker errors to the Vite error overlay via HMR.
|
|
5
|
+
*
|
|
6
|
+
* Note: This is injected as `children` of a `<script type="module">` tag
|
|
7
|
+
* by the Vite `transformIndexHtml` hook — do NOT wrap in `<script>` tags.
|
|
8
|
+
*/
|
|
9
|
+
const workerErrorSnippet = `
|
|
10
|
+
if (import.meta.hot) {
|
|
11
|
+
const origOnerror = self.onerror;
|
|
12
|
+
self.onerror = function(message, source, lineno, colno, error) {
|
|
13
|
+
if (source && source.includes('worker')) {
|
|
14
|
+
import.meta.hot.send('async-dom:error', {
|
|
15
|
+
message: error ? error.message : String(message),
|
|
16
|
+
stack: error ? error.stack : '',
|
|
17
|
+
source: source,
|
|
18
|
+
lineno: lineno,
|
|
19
|
+
colno: colno,
|
|
20
|
+
});
|
|
21
|
+
}
|
|
22
|
+
if (origOnerror) return origOnerror.call(this, message, source, lineno, colno, error);
|
|
23
|
+
};
|
|
24
|
+
}
|
|
25
|
+
`;
|
|
26
|
+
//#endregion
|
|
27
|
+
//#region src/vite-plugin/index.ts
|
|
28
|
+
const COOP_HEADER = "Cross-Origin-Opener-Policy";
|
|
29
|
+
const COEP_HEADER = "Cross-Origin-Embedder-Policy";
|
|
30
|
+
function addCrossOriginHeaders(server, enabled) {
|
|
31
|
+
if (!enabled) return;
|
|
32
|
+
server.middlewares.use((_req, res, next) => {
|
|
33
|
+
if (!res.getHeader(COOP_HEADER)) res.setHeader(COOP_HEADER, "same-origin");
|
|
34
|
+
if (!res.getHeader(COEP_HEADER)) res.setHeader(COEP_HEADER, "require-corp");
|
|
35
|
+
next();
|
|
36
|
+
});
|
|
37
|
+
}
|
|
38
|
+
/**
|
|
39
|
+
* Vite plugin that configures your project for async-dom.
|
|
40
|
+
*
|
|
41
|
+
* - Sets COOP/COEP headers for SharedArrayBuffer support
|
|
42
|
+
* - Injects `__ASYNC_DOM_DEBUG__` and `__ASYNC_DOM_BINARY__` compile-time flags
|
|
43
|
+
* - Forwards worker errors to the Vite error overlay during development
|
|
44
|
+
*
|
|
45
|
+
* @param options - Plugin configuration options.
|
|
46
|
+
* @returns A Vite plugin instance.
|
|
47
|
+
*
|
|
48
|
+
* @example
|
|
49
|
+
* ```ts
|
|
50
|
+
* // vite.config.ts
|
|
51
|
+
* import { defineConfig } from "vite";
|
|
52
|
+
* import { asyncDomPlugin } from "@lifeart/async-dom/vite-plugin";
|
|
53
|
+
*
|
|
54
|
+
* export default defineConfig({
|
|
55
|
+
* plugins: [asyncDomPlugin()],
|
|
56
|
+
* });
|
|
57
|
+
* ```
|
|
58
|
+
*/
|
|
59
|
+
function asyncDomPlugin(options = {}) {
|
|
60
|
+
const { headers = true, debug, binaryTransport = true, workerErrorOverlay = true } = options;
|
|
61
|
+
return {
|
|
62
|
+
name: "async-dom",
|
|
63
|
+
config(_config, env) {
|
|
64
|
+
const isDev = env.mode === "development" || env.command === "serve";
|
|
65
|
+
return {
|
|
66
|
+
define: {
|
|
67
|
+
__ASYNC_DOM_DEBUG__: JSON.stringify(debug ?? isDev),
|
|
68
|
+
__ASYNC_DOM_BINARY__: JSON.stringify(!isDev && binaryTransport)
|
|
69
|
+
},
|
|
70
|
+
worker: { format: "es" }
|
|
71
|
+
};
|
|
72
|
+
},
|
|
73
|
+
configureServer(server) {
|
|
74
|
+
addCrossOriginHeaders(server, headers);
|
|
75
|
+
if (workerErrorOverlay) server.hot.on("async-dom:error", (data) => {
|
|
76
|
+
server.hot.send({
|
|
77
|
+
type: "error",
|
|
78
|
+
err: {
|
|
79
|
+
message: data.message ?? "Worker error",
|
|
80
|
+
stack: data.stack ?? "",
|
|
81
|
+
plugin: "async-dom",
|
|
82
|
+
id: data.source ?? "worker"
|
|
83
|
+
}
|
|
84
|
+
});
|
|
85
|
+
});
|
|
86
|
+
},
|
|
87
|
+
configurePreviewServer(server) {
|
|
88
|
+
addCrossOriginHeaders(server, headers);
|
|
89
|
+
},
|
|
90
|
+
transformIndexHtml: {
|
|
91
|
+
order: "pre",
|
|
92
|
+
handler(_html, ctx) {
|
|
93
|
+
if (ctx.server && workerErrorOverlay) return [{
|
|
94
|
+
tag: "script",
|
|
95
|
+
attrs: { type: "module" },
|
|
96
|
+
children: workerErrorSnippet,
|
|
97
|
+
injectTo: "head"
|
|
98
|
+
}];
|
|
99
|
+
return [];
|
|
100
|
+
}
|
|
101
|
+
}
|
|
102
|
+
};
|
|
103
|
+
}
|
|
104
|
+
//#endregion
|
|
105
|
+
export { asyncDomPlugin, asyncDomPlugin as default };
|
|
106
|
+
|
|
107
|
+
//# sourceMappingURL=vite-plugin.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"vite-plugin.js","names":[],"sources":["../src/vite-plugin/error-snippet.ts","../src/vite-plugin/index.ts"],"sourcesContent":["/**\n * Client-side snippet injected during development that forwards\n * worker errors to the Vite error overlay via HMR.\n *\n * Note: This is injected as `children` of a `<script type=\"module\">` tag\n * by the Vite `transformIndexHtml` hook — do NOT wrap in `<script>` tags.\n */\nexport const workerErrorSnippet = `\nif (import.meta.hot) {\n const origOnerror = self.onerror;\n self.onerror = function(message, source, lineno, colno, error) {\n if (source && source.includes('worker')) {\n import.meta.hot.send('async-dom:error', {\n message: error ? error.message : String(message),\n stack: error ? error.stack : '',\n source: source,\n lineno: lineno,\n colno: colno,\n });\n }\n if (origOnerror) return origOnerror.call(this, message, source, lineno, colno, error);\n };\n}\n`;\n","import type { Plugin, ViteDevServer } from \"vite\";\nimport { workerErrorSnippet } from \"./error-snippet.ts\";\n\n/** Configuration options for the async-dom Vite plugin. */\nexport interface AsyncDomPluginOptions {\n\t/** Enable COOP/COEP headers for SharedArrayBuffer support (default: true) */\n\theaders?: boolean;\n\t/** Force debug mode (default: auto — enabled in development) */\n\tdebug?: boolean;\n\t/** Use binary transport in production (default: true) */\n\tbinaryTransport?: boolean;\n\t/** Forward worker errors to Vite error overlay (default: true) */\n\tworkerErrorOverlay?: boolean;\n}\n\nconst COOP_HEADER = \"Cross-Origin-Opener-Policy\";\nconst COEP_HEADER = \"Cross-Origin-Embedder-Policy\";\n\nfunction addCrossOriginHeaders(server: ViteDevServer, enabled: boolean): void {\n\tif (!enabled) return;\n\n\tserver.middlewares.use((_req, res, next) => {\n\t\t// Don't override if already set by the user\n\t\tif (!res.getHeader(COOP_HEADER)) {\n\t\t\tres.setHeader(COOP_HEADER, \"same-origin\");\n\t\t}\n\t\tif (!res.getHeader(COEP_HEADER)) {\n\t\t\tres.setHeader(COEP_HEADER, \"require-corp\");\n\t\t}\n\t\tnext();\n\t});\n}\n\n/**\n * Vite plugin that configures your project for async-dom.\n *\n * - Sets COOP/COEP headers for SharedArrayBuffer support\n * - Injects `__ASYNC_DOM_DEBUG__` and `__ASYNC_DOM_BINARY__` compile-time flags\n * - Forwards worker errors to the Vite error overlay during development\n *\n * @param options - Plugin configuration options.\n * @returns A Vite plugin instance.\n *\n * @example\n * ```ts\n * // vite.config.ts\n * import { defineConfig } from \"vite\";\n * import { asyncDomPlugin } from \"@lifeart/async-dom/vite-plugin\";\n *\n * export default defineConfig({\n * plugins: [asyncDomPlugin()],\n * });\n * ```\n */\nexport function asyncDomPlugin(options: AsyncDomPluginOptions = {}): Plugin {\n\tconst { headers = true, debug, binaryTransport = true, workerErrorOverlay = true } = options;\n\n\treturn {\n\t\tname: \"async-dom\",\n\n\t\tconfig(_config, env) {\n\t\t\tconst isDev = env.mode === \"development\" || env.command === \"serve\";\n\t\t\treturn {\n\t\t\t\tdefine: {\n\t\t\t\t\t__ASYNC_DOM_DEBUG__: JSON.stringify(debug ?? isDev),\n\t\t\t\t\t__ASYNC_DOM_BINARY__: JSON.stringify(!isDev && binaryTransport),\n\t\t\t\t},\n\t\t\t\tworker: {\n\t\t\t\t\tformat: \"es\" as const,\n\t\t\t\t},\n\t\t\t};\n\t\t},\n\n\t\tconfigureServer(server) {\n\t\t\taddCrossOriginHeaders(server, headers);\n\n\t\t\tif (workerErrorOverlay) {\n\t\t\t\tserver.hot.on(\"async-dom:error\", (data) => {\n\t\t\t\t\tserver.hot.send({\n\t\t\t\t\t\ttype: \"error\",\n\t\t\t\t\t\terr: {\n\t\t\t\t\t\t\tmessage: data.message ?? \"Worker error\",\n\t\t\t\t\t\t\tstack: data.stack ?? \"\",\n\t\t\t\t\t\t\tplugin: \"async-dom\",\n\t\t\t\t\t\t\tid: data.source ?? \"worker\",\n\t\t\t\t\t\t},\n\t\t\t\t\t});\n\t\t\t\t});\n\t\t\t}\n\t\t},\n\n\t\tconfigurePreviewServer(server) {\n\t\t\taddCrossOriginHeaders(server as unknown as ViteDevServer, headers);\n\t\t},\n\n\t\ttransformIndexHtml: {\n\t\t\torder: \"pre\",\n\t\t\thandler(_html, ctx) {\n\t\t\t\tif (ctx.server && workerErrorOverlay) {\n\t\t\t\t\treturn [\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\ttag: \"script\",\n\t\t\t\t\t\t\tattrs: { type: \"module\" },\n\t\t\t\t\t\t\tchildren: workerErrorSnippet,\n\t\t\t\t\t\t\tinjectTo: \"head\" as const,\n\t\t\t\t\t\t},\n\t\t\t\t\t];\n\t\t\t\t}\n\t\t\t\treturn [];\n\t\t\t},\n\t\t},\n\t};\n}\n\nexport default asyncDomPlugin;\n"],"mappings":";;;;;;;;AAOA,MAAa,qBAAqB;;;;;;;;;;;;;;;;;;;ACQlC,MAAM,cAAc;AACpB,MAAM,cAAc;AAEpB,SAAS,sBAAsB,QAAuB,SAAwB;AAC7E,KAAI,CAAC,QAAS;AAEd,QAAO,YAAY,KAAK,MAAM,KAAK,SAAS;AAE3C,MAAI,CAAC,IAAI,UAAU,YAAY,CAC9B,KAAI,UAAU,aAAa,cAAc;AAE1C,MAAI,CAAC,IAAI,UAAU,YAAY,CAC9B,KAAI,UAAU,aAAa,eAAe;AAE3C,QAAM;GACL;;;;;;;;;;;;;;;;;;;;;;;AAwBH,SAAgB,eAAe,UAAiC,EAAE,EAAU;CAC3E,MAAM,EAAE,UAAU,MAAM,OAAO,kBAAkB,MAAM,qBAAqB,SAAS;AAErF,QAAO;EACN,MAAM;EAEN,OAAO,SAAS,KAAK;GACpB,MAAM,QAAQ,IAAI,SAAS,iBAAiB,IAAI,YAAY;AAC5D,UAAO;IACN,QAAQ;KACP,qBAAqB,KAAK,UAAU,SAAS,MAAM;KACnD,sBAAsB,KAAK,UAAU,CAAC,SAAS,gBAAgB;KAC/D;IACD,QAAQ,EACP,QAAQ,MACR;IACD;;EAGF,gBAAgB,QAAQ;AACvB,yBAAsB,QAAQ,QAAQ;AAEtC,OAAI,mBACH,QAAO,IAAI,GAAG,oBAAoB,SAAS;AAC1C,WAAO,IAAI,KAAK;KACf,MAAM;KACN,KAAK;MACJ,SAAS,KAAK,WAAW;MACzB,OAAO,KAAK,SAAS;MACrB,QAAQ;MACR,IAAI,KAAK,UAAU;MACnB;KACD,CAAC;KACD;;EAIJ,uBAAuB,QAAQ;AAC9B,yBAAsB,QAAoC,QAAQ;;EAGnE,oBAAoB;GACnB,OAAO;GACP,QAAQ,OAAO,KAAK;AACnB,QAAI,IAAI,UAAU,mBACjB,QAAO,CACN;KACC,KAAK;KACL,OAAO,EAAE,MAAM,UAAU;KACzB,UAAU;KACV,UAAU;KACV,CACD;AAEF,WAAO,EAAE;;GAEV;EACD"}
|
package/dist/vue.cjs
ADDED
|
@@ -0,0 +1,123 @@
|
|
|
1
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
2
|
+
const require_resolve_debug = require("./resolve-debug.cjs");
|
|
3
|
+
require("./cli.cjs");
|
|
4
|
+
let vue = require("vue");
|
|
5
|
+
//#region src/vue/use-async-dom.ts
|
|
6
|
+
/**
|
|
7
|
+
* Vue composable that creates and manages an async-dom instance.
|
|
8
|
+
*
|
|
9
|
+
* Attaches an async-dom worker to the container element referenced by
|
|
10
|
+
* `containerRef`. The instance is created on `onMounted` and destroyed on
|
|
11
|
+
* `onBeforeUnmount`. Must be called during component setup.
|
|
12
|
+
*
|
|
13
|
+
* @param options - Configuration for the async-dom instance.
|
|
14
|
+
* @returns An object containing the container template ref and a shallow ref to the instance.
|
|
15
|
+
*
|
|
16
|
+
* @example
|
|
17
|
+
* ```vue
|
|
18
|
+
* <script setup lang="ts">
|
|
19
|
+
* import { useAsyncDom } from "@lifeart/async-dom/vue";
|
|
20
|
+
*
|
|
21
|
+
* const { containerRef, instance } = useAsyncDom({
|
|
22
|
+
* worker: "./my-worker.ts",
|
|
23
|
+
* onReady: (inst) => console.log("Ready!", inst),
|
|
24
|
+
* });
|
|
25
|
+
* <\/script>
|
|
26
|
+
*
|
|
27
|
+
* <template>
|
|
28
|
+
* <div ref="containerRef" />
|
|
29
|
+
* </template>
|
|
30
|
+
* ```
|
|
31
|
+
*/
|
|
32
|
+
function useAsyncDom(options) {
|
|
33
|
+
const containerRef = (0, vue.ref)(null);
|
|
34
|
+
const instance = (0, vue.shallowRef)(null);
|
|
35
|
+
let destroyed = false;
|
|
36
|
+
(0, vue.onMounted)(async () => {
|
|
37
|
+
const el = containerRef.value;
|
|
38
|
+
if (!el) return;
|
|
39
|
+
const workerProp = options.worker;
|
|
40
|
+
const worker = typeof workerProp === "string" ? new Worker(new URL(workerProp, require("url").pathToFileURL(__filename).href), { type: "module" }) : workerProp();
|
|
41
|
+
const { createAsyncDom } = await Promise.resolve().then(() => require("./main-thread.cjs")).then((n) => n.main_thread_exports);
|
|
42
|
+
if (destroyed) {
|
|
43
|
+
worker.terminate();
|
|
44
|
+
return;
|
|
45
|
+
}
|
|
46
|
+
const inst = createAsyncDom({
|
|
47
|
+
target: el,
|
|
48
|
+
worker,
|
|
49
|
+
scheduler: options.scheduler,
|
|
50
|
+
debug: require_resolve_debug.resolveDebugOption(options.debug)
|
|
51
|
+
});
|
|
52
|
+
inst.start();
|
|
53
|
+
instance.value = inst;
|
|
54
|
+
options.onReady?.(inst);
|
|
55
|
+
});
|
|
56
|
+
(0, vue.onBeforeUnmount)(() => {
|
|
57
|
+
destroyed = true;
|
|
58
|
+
instance.value?.destroy();
|
|
59
|
+
instance.value = null;
|
|
60
|
+
});
|
|
61
|
+
return {
|
|
62
|
+
containerRef,
|
|
63
|
+
instance
|
|
64
|
+
};
|
|
65
|
+
}
|
|
66
|
+
//#endregion
|
|
67
|
+
//#region src/vue/AsyncDom.ts
|
|
68
|
+
/**
|
|
69
|
+
* Vue component that renders an async-dom worker application.
|
|
70
|
+
*
|
|
71
|
+
* Wraps the {@link useAsyncDom} composable in a self-contained component.
|
|
72
|
+
* Supports a `fallback` slot for loading state.
|
|
73
|
+
*
|
|
74
|
+
* @example
|
|
75
|
+
* ```vue
|
|
76
|
+
* <template>
|
|
77
|
+
* <AsyncDom worker="./app.worker.ts" @ready="onReady">
|
|
78
|
+
* <template #fallback>
|
|
79
|
+
* <p>Loading...</p>
|
|
80
|
+
* </template>
|
|
81
|
+
* </AsyncDom>
|
|
82
|
+
* </template>
|
|
83
|
+
* ```
|
|
84
|
+
*/
|
|
85
|
+
const AsyncDom = (0, vue.defineComponent)({
|
|
86
|
+
name: "AsyncDom",
|
|
87
|
+
props: {
|
|
88
|
+
worker: {
|
|
89
|
+
type: [String, Function],
|
|
90
|
+
required: true
|
|
91
|
+
},
|
|
92
|
+
scheduler: {
|
|
93
|
+
type: Object,
|
|
94
|
+
default: void 0
|
|
95
|
+
},
|
|
96
|
+
debug: {
|
|
97
|
+
type: [Boolean, Object],
|
|
98
|
+
default: void 0
|
|
99
|
+
}
|
|
100
|
+
},
|
|
101
|
+
emits: {
|
|
102
|
+
ready: (_instance) => true,
|
|
103
|
+
error: (_error) => true
|
|
104
|
+
},
|
|
105
|
+
slots: Object,
|
|
106
|
+
setup(props, { emit, slots }) {
|
|
107
|
+
const { containerRef, instance } = useAsyncDom({
|
|
108
|
+
worker: props.worker,
|
|
109
|
+
scheduler: props.scheduler,
|
|
110
|
+
debug: props.debug,
|
|
111
|
+
onReady: (inst) => emit("ready", inst),
|
|
112
|
+
onError: (err) => emit("error", err)
|
|
113
|
+
});
|
|
114
|
+
return () => {
|
|
115
|
+
return (0, vue.h)("div", null, [!instance.value && slots.fallback ? slots.fallback() : null, (0, vue.h)("div", { ref: containerRef })]);
|
|
116
|
+
};
|
|
117
|
+
}
|
|
118
|
+
});
|
|
119
|
+
//#endregion
|
|
120
|
+
exports.AsyncDom = AsyncDom;
|
|
121
|
+
exports.useAsyncDom = useAsyncDom;
|
|
122
|
+
|
|
123
|
+
//# sourceMappingURL=vue.cjs.map
|
package/dist/vue.cjs.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"vue.cjs","names":["resolveDebugOption"],"sources":["../src/vue/use-async-dom.ts","../src/vue/AsyncDom.ts"],"sourcesContent":["import { onBeforeUnmount, onMounted, type Ref, ref, type ShallowRef, shallowRef } from \"vue\";\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/** Template ref to bind to the container element */\n\tcontainerRef: Ref<HTMLDivElement | null>;\n\t/** The async-dom instance (null until ready) */\n\tinstance: ShallowRef<AsyncDomInstance | null>;\n}\n\n/**\n * Vue composable 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 `onMounted` and destroyed on\n * `onBeforeUnmount`. Must be called during component setup.\n *\n * @param options - Configuration for the async-dom instance.\n * @returns An object containing the container template ref and a shallow ref to the instance.\n *\n * @example\n * ```vue\n * <script setup lang=\"ts\">\n * import { useAsyncDom } from \"@lifeart/async-dom/vue\";\n *\n * const { containerRef, instance } = useAsyncDom({\n * worker: \"./my-worker.ts\",\n * onReady: (inst) => console.log(\"Ready!\", inst),\n * });\n * </script>\n *\n * <template>\n * <div ref=\"containerRef\" />\n * </template>\n * ```\n */\nexport function useAsyncDom(options: UseAsyncDomOptions): UseAsyncDomResult {\n\tconst containerRef = ref<HTMLDivElement | null>(null);\n\tconst instance = shallowRef<AsyncDomInstance | null>(null);\n\tlet destroyed = false;\n\n\tonMounted(async () => {\n\t\tconst el = containerRef.value;\n\t\tif (!el) return;\n\n\t\tconst workerProp = options.worker;\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\tconst { createAsyncDom } = await import(\"../main-thread/index.ts\");\n\n\t\tif (destroyed) {\n\t\t\tworker.terminate();\n\t\t\treturn;\n\t\t}\n\n\t\tconst inst = createAsyncDom({\n\t\t\ttarget: el,\n\t\t\tworker,\n\t\t\tscheduler: options.scheduler,\n\t\t\tdebug: resolveDebugOption(options.debug),\n\t\t});\n\t\tinst.start();\n\t\tinstance.value = inst;\n\t\toptions.onReady?.(inst);\n\t});\n\n\tonBeforeUnmount(() => {\n\t\tdestroyed = true;\n\t\tinstance.value?.destroy();\n\t\tinstance.value = null;\n\t});\n\n\treturn { containerRef, instance };\n}\n","import { defineComponent, h, type PropType, type SlotsType } from \"vue\";\nimport type { DebugOptions, SchedulerConfig, SerializedError } from \"../index.ts\";\nimport type { AsyncDomInstance } from \"../main-thread/index.ts\";\nimport { useAsyncDom } from \"./use-async-dom.ts\";\n\n/** Props for the {@link AsyncDom} Vue component. */\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}\n\n/**\n * Vue component that renders an async-dom worker application.\n *\n * Wraps the {@link useAsyncDom} composable in a self-contained component.\n * Supports a `fallback` slot for loading state.\n *\n * @example\n * ```vue\n * <template>\n * <AsyncDom worker=\"./app.worker.ts\" @ready=\"onReady\">\n * <template #fallback>\n * <p>Loading...</p>\n * </template>\n * </AsyncDom>\n * </template>\n * ```\n */\nexport const AsyncDom = defineComponent({\n\tname: \"AsyncDom\",\n\n\tprops: {\n\t\tworker: {\n\t\t\ttype: [String, Function] as PropType<string | (() => Worker)>,\n\t\t\trequired: true,\n\t\t},\n\t\tscheduler: {\n\t\t\ttype: Object as PropType<SchedulerConfig>,\n\t\t\tdefault: undefined,\n\t\t},\n\t\tdebug: {\n\t\t\ttype: [Boolean, Object] as PropType<boolean | DebugOptions>,\n\t\t\tdefault: undefined,\n\t\t},\n\t},\n\n\temits: {\n\t\tready: (_instance: AsyncDomInstance) => true,\n\t\terror: (_error: SerializedError) => true,\n\t},\n\n\tslots: Object as SlotsType<{\n\t\tfallback?: Record<string, never>;\n\t}>,\n\n\tsetup(props, { emit, slots }) {\n\t\t// biome-ignore lint/correctness/useHookAtTopLevel: Vue composable, not a React hook\n\t\tconst { containerRef, instance } = useAsyncDom({\n\t\t\tworker: props.worker,\n\t\t\tscheduler: props.scheduler,\n\t\t\tdebug: props.debug,\n\t\t\tonReady: (inst) => emit(\"ready\", inst),\n\t\t\tonError: (err) => emit(\"error\", err),\n\t\t});\n\n\t\treturn () => {\n\t\t\t// Fallback is rendered as a sibling before the container div to avoid\n\t\t\t// Vue's VDOM diffing from clearing the worker-rendered content inside it.\n\t\t\treturn h(\"div\", null, [\n\t\t\t\t!instance.value && slots.fallback ? slots.fallback() : null,\n\t\t\t\th(\"div\", { ref: containerRef }),\n\t\t\t]);\n\t\t};\n\t},\n});\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmDA,SAAgB,YAAY,SAAgD;CAC3E,MAAM,gBAAA,GAAA,IAAA,KAA0C,KAAK;CACrD,MAAM,YAAA,GAAA,IAAA,YAA+C,KAAK;CAC1D,IAAI,YAAY;AAEhB,EAAA,GAAA,IAAA,WAAU,YAAY;EACrB,MAAM,KAAK,aAAa;AACxB,MAAI,CAAC,GAAI;EAET,MAAM,aAAa,QAAQ;EAC3B,MAAM,SACL,OAAO,eAAe,WACnB,IAAI,OAAO,IAAI,IAAI,YAAA,QAAA,MAAA,CAAA,cAAA,WAAA,CAAA,KAA4B,EAAE,EAAE,MAAM,UAAU,CAAC,GACpE,YAAY;EAEhB,MAAM,EAAE,mBAAmB,MAAA,QAAA,SAAA,CAAA,WAAA,QAAM,oBAAA,CAAA,CAAA,MAAA,MAAA,EAAA,oBAAA;AAEjC,MAAI,WAAW;AACd,UAAO,WAAW;AAClB;;EAGD,MAAM,OAAO,eAAe;GAC3B,QAAQ;GACR;GACA,WAAW,QAAQ;GACnB,OAAOA,sBAAAA,mBAAmB,QAAQ,MAAM;GACxC,CAAC;AACF,OAAK,OAAO;AACZ,WAAS,QAAQ;AACjB,UAAQ,UAAU,KAAK;GACtB;AAEF,EAAA,GAAA,IAAA,uBAAsB;AACrB,cAAY;AACZ,WAAS,OAAO,SAAS;AACzB,WAAS,QAAQ;GAChB;AAEF,QAAO;EAAE;EAAc;EAAU;;;;;;;;;;;;;;;;;;;;;AC1DlC,MAAa,YAAA,GAAA,IAAA,iBAA2B;CACvC,MAAM;CAEN,OAAO;EACN,QAAQ;GACP,MAAM,CAAC,QAAQ,SAAS;GACxB,UAAU;GACV;EACD,WAAW;GACV,MAAM;GACN,SAAS,KAAA;GACT;EACD,OAAO;GACN,MAAM,CAAC,SAAS,OAAO;GACvB,SAAS,KAAA;GACT;EACD;CAED,OAAO;EACN,QAAQ,cAAgC;EACxC,QAAQ,WAA4B;EACpC;CAED,OAAO;CAIP,MAAM,OAAO,EAAE,MAAM,SAAS;EAE7B,MAAM,EAAE,cAAc,aAAa,YAAY;GAC9C,QAAQ,MAAM;GACd,WAAW,MAAM;GACjB,OAAO,MAAM;GACb,UAAU,SAAS,KAAK,SAAS,KAAK;GACtC,UAAU,QAAQ,KAAK,SAAS,IAAI;GACpC,CAAC;AAEF,eAAa;AAGZ,WAAA,GAAA,IAAA,GAAS,OAAO,MAAM,CACrB,CAAC,SAAS,SAAS,MAAM,WAAW,MAAM,UAAU,GAAG,OAAA,GAAA,IAAA,GACrD,OAAO,EAAE,KAAK,cAAc,CAAC,CAC/B,CAAC;;;CAGJ,CAAC"}
|
package/dist/vue.d.cts
ADDED
|
@@ -0,0 +1,126 @@
|
|
|
1
|
+
import { v as SerializedError } from "./base.cjs";
|
|
2
|
+
import { n as DebugOptions } from "./debug.cjs";
|
|
3
|
+
import { g as SchedulerConfig, r as AsyncDomInstance } from "./index.cjs";
|
|
4
|
+
import * as vue0 from "vue";
|
|
5
|
+
import { PropType, Ref, ShallowRef, SlotsType } from "vue";
|
|
6
|
+
|
|
7
|
+
//#region src/vue/AsyncDom.d.ts
|
|
8
|
+
/** Props for the {@link AsyncDom} Vue component. */
|
|
9
|
+
interface AsyncDomProps {
|
|
10
|
+
/** Worker script path or factory function */
|
|
11
|
+
worker: string | (() => Worker);
|
|
12
|
+
/** Scheduler configuration */
|
|
13
|
+
scheduler?: SchedulerConfig;
|
|
14
|
+
/** Enable debug mode (true for defaults, or pass DebugOptions) */
|
|
15
|
+
debug?: DebugOptions | boolean;
|
|
16
|
+
}
|
|
17
|
+
/**
|
|
18
|
+
* Vue component that renders an async-dom worker application.
|
|
19
|
+
*
|
|
20
|
+
* Wraps the {@link useAsyncDom} composable in a self-contained component.
|
|
21
|
+
* Supports a `fallback` slot for loading state.
|
|
22
|
+
*
|
|
23
|
+
* @example
|
|
24
|
+
* ```vue
|
|
25
|
+
* <template>
|
|
26
|
+
* <AsyncDom worker="./app.worker.ts" @ready="onReady">
|
|
27
|
+
* <template #fallback>
|
|
28
|
+
* <p>Loading...</p>
|
|
29
|
+
* </template>
|
|
30
|
+
* </AsyncDom>
|
|
31
|
+
* </template>
|
|
32
|
+
* ```
|
|
33
|
+
*/
|
|
34
|
+
declare const AsyncDom: vue0.DefineComponent<vue0.ExtractPropTypes<{
|
|
35
|
+
worker: {
|
|
36
|
+
type: PropType<string | (() => Worker)>;
|
|
37
|
+
required: true;
|
|
38
|
+
};
|
|
39
|
+
scheduler: {
|
|
40
|
+
type: PropType<SchedulerConfig>;
|
|
41
|
+
default: undefined;
|
|
42
|
+
};
|
|
43
|
+
debug: {
|
|
44
|
+
type: PropType<boolean | DebugOptions>;
|
|
45
|
+
default: undefined;
|
|
46
|
+
};
|
|
47
|
+
}>, () => vue0.VNode<vue0.RendererNode, vue0.RendererElement, {
|
|
48
|
+
[key: string]: any;
|
|
49
|
+
}>, {}, {}, {}, vue0.ComponentOptionsMixin, vue0.ComponentOptionsMixin, {
|
|
50
|
+
ready: (_instance: AsyncDomInstance) => true;
|
|
51
|
+
error: (_error: SerializedError) => true;
|
|
52
|
+
}, string, vue0.PublicProps, Readonly<vue0.ExtractPropTypes<{
|
|
53
|
+
worker: {
|
|
54
|
+
type: PropType<string | (() => Worker)>;
|
|
55
|
+
required: true;
|
|
56
|
+
};
|
|
57
|
+
scheduler: {
|
|
58
|
+
type: PropType<SchedulerConfig>;
|
|
59
|
+
default: undefined;
|
|
60
|
+
};
|
|
61
|
+
debug: {
|
|
62
|
+
type: PropType<boolean | DebugOptions>;
|
|
63
|
+
default: undefined;
|
|
64
|
+
};
|
|
65
|
+
}>> & Readonly<{
|
|
66
|
+
onReady?: ((_instance: AsyncDomInstance) => any) | undefined;
|
|
67
|
+
onError?: ((_error: SerializedError) => any) | undefined;
|
|
68
|
+
}>, {
|
|
69
|
+
scheduler: SchedulerConfig;
|
|
70
|
+
debug: boolean | DebugOptions;
|
|
71
|
+
}, SlotsType<{
|
|
72
|
+
fallback?: Record<string, never>;
|
|
73
|
+
}>, {}, {}, string, vue0.ComponentProvideOptions, true, {}, any>;
|
|
74
|
+
//# sourceMappingURL=AsyncDom.d.ts.map
|
|
75
|
+
//#endregion
|
|
76
|
+
//#region src/vue/use-async-dom.d.ts
|
|
77
|
+
interface UseAsyncDomOptions {
|
|
78
|
+
/** Worker script path or factory function */
|
|
79
|
+
worker: string | (() => Worker);
|
|
80
|
+
/** Scheduler configuration */
|
|
81
|
+
scheduler?: SchedulerConfig;
|
|
82
|
+
/** Debug options (pass `true` for sensible defaults, or a `DebugOptions` object) */
|
|
83
|
+
debug?: DebugOptions | boolean;
|
|
84
|
+
/** Called when the async-dom instance is ready */
|
|
85
|
+
onReady?: (instance: AsyncDomInstance) => void;
|
|
86
|
+
/** Called when a worker error occurs */
|
|
87
|
+
onError?: (error: SerializedError) => void;
|
|
88
|
+
}
|
|
89
|
+
interface UseAsyncDomResult {
|
|
90
|
+
/** Template ref to bind to the container element */
|
|
91
|
+
containerRef: Ref<HTMLDivElement | null>;
|
|
92
|
+
/** The async-dom instance (null until ready) */
|
|
93
|
+
instance: ShallowRef<AsyncDomInstance | null>;
|
|
94
|
+
}
|
|
95
|
+
/**
|
|
96
|
+
* Vue composable that creates and manages an async-dom instance.
|
|
97
|
+
*
|
|
98
|
+
* Attaches an async-dom worker to the container element referenced by
|
|
99
|
+
* `containerRef`. The instance is created on `onMounted` and destroyed on
|
|
100
|
+
* `onBeforeUnmount`. Must be called during component setup.
|
|
101
|
+
*
|
|
102
|
+
* @param options - Configuration for the async-dom instance.
|
|
103
|
+
* @returns An object containing the container template ref and a shallow ref to the instance.
|
|
104
|
+
*
|
|
105
|
+
* @example
|
|
106
|
+
* ```vue
|
|
107
|
+
* <script setup lang="ts">
|
|
108
|
+
* import { useAsyncDom } from "@lifeart/async-dom/vue";
|
|
109
|
+
*
|
|
110
|
+
* const { containerRef, instance } = useAsyncDom({
|
|
111
|
+
* worker: "./my-worker.ts",
|
|
112
|
+
* onReady: (inst) => console.log("Ready!", inst),
|
|
113
|
+
* });
|
|
114
|
+
* </script>
|
|
115
|
+
*
|
|
116
|
+
* <template>
|
|
117
|
+
* <div ref="containerRef" />
|
|
118
|
+
* </template>
|
|
119
|
+
* ```
|
|
120
|
+
*/
|
|
121
|
+
declare function useAsyncDom(options: UseAsyncDomOptions): UseAsyncDomResult;
|
|
122
|
+
//# sourceMappingURL=use-async-dom.d.ts.map
|
|
123
|
+
|
|
124
|
+
//#endregion
|
|
125
|
+
export { AsyncDom, type AsyncDomInstance, type AsyncDomProps, type DebugOptions, type SchedulerConfig, type SerializedError, type UseAsyncDomOptions, type UseAsyncDomResult, useAsyncDom };
|
|
126
|
+
//# sourceMappingURL=vue.d.cts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"vue.d.cts","names":[],"sources":["../src/vue/AsyncDom.ts","../src/vue/use-async-dom.ts"],"sourcesContent":[],"mappings":";;;;;;;;UAMiB,aAAA;;0BAEQ;EAFR;EAAa,SAAA,CAAA,EAIjB,eAJiB;;OAIjB,CAAA,EAEJ,YAFI,GAAA,OAAA;;;AAsBb;;;;;;;;;;;;;;;;AAoBiC,cApBpB,QAoBoB,OApBZ,eAoBY,CAPK,IAAA,CAbjB,gBAoBY,CAAA;QAfuB,EAAA;IAAzB,IAAA,EAAA,QAAA,CAAA,MAAA,GAAA,CAAA,GAAA,GAAyB,MAAzB,CAAA,CAAA;IAIH,QAAA,EAAA,IAAA;;WAIqB,EAAA;IAAnB,IAAA,EAJX,QAIW,CAJF,eAIE,CAAA;IAAQ,OAAA,EAAA,SAAA;;;UAAR,mBAAmB;;;qBAb5B,IAAA,CAAA,YAAA;MAwBR,EAAA,MAAA,CAAA,EAAA,GAAA;;qBALQ;UAnBA,MAAA,EAoBH,eApBG,EAAA,GAAA,IAAA;CAAA,EAAA,MAAA,EAoBY,IAAA,CAAA,WAAA,UApBZ,CAaiB,IAAA,CAAA,gBAbjB,CAAA;;UAKU,yBAAyB;;EChCvC,CAAA;EAAkB,SAAA,EAAA;IAEV,IAAA,EDkCN,QClCM,CDkCG,eClCH,CAAA;IAEZ,OAAA,EAAA,SAAA;;OAIS,EAAA;IAEH,IAAA,ED8BW,QC9BX,CAAA,OAAA,GD8B8B,YC9B9B,CAAA;IAAe,OAAA,EAAA,SAAA;EAGjB,CAAA;CAAiB,CAAA,CAAA,WAAA,CAAA;SAEf,CAAA,EAAA,CAAA,CAAA,SAAA,kBAAA,EAAA,GAAA,GAAA,CAAA,GAAA,SAAA;SAAJ,CAAA,EAAA,CAAA,CAAA,MAAA,iBAAA,EAAA,GAAA,GAAA,CAAA,GAAA,SAAA;;WAEJ,iBAAA;EAAU,KAAA,EAAA,OAAA,eAAA;AA6BrB,CAAA,WAAgB,CAAA;EAAW,QAAA,CAAA,EDKd,MCLc,CAAA,MAAA,EAAA,KAAA,CAAA;QAAU,CAAA,CAAA,EAAA,MAAA,gCAAA,IAAA,EAAA,CAAA,CAAA,EAAA,GAAA,CAAA;;;;UA9CpB,kBAAA;;0BAEQ;;EDDR,SAAA,CAAA,ECGJ,eDHiB;EAAA;OAEL,CAAA,ECGhB,YDHgB,GAAA,OAAA;;SAIhB,CAAA,EAAA,CAAA,QAAA,ECCa,gBDDb,EAAA,GAAA,IAAA;EAAY;EAoBR,OAAA,CAAA,EAAA,CA8CX,KAAA,EC/DiB,eD+DjB,EAAA,GAAA,IAAA;;AAzCsD,UCnBvC,iBAAA,CDmBuC;;cAI5B,ECrBb,GDqBa,CCrBT,cDqBS,GAAA,IAAA,CAAA;;UAIqB,ECvBtC,UDuBsC,CCvB3B,gBDuB2B,GAAA,IAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAb5B,iBCmBL,WAAA,CDnBK,OAAA,ECmBgB,kBDnBhB,CAAA,ECmBqC,iBDnBrC"}
|