@toonstrip/astro 0.1.0

package/dist/index.d.ts

@@ -0,0 +1,3 @@
+export { ComicStrip } from "./tag-name.js";
+export { default as toonstrip } from "./integration.js";
+export type { ToonstripOptions } from "./integration.js";

package/dist/index.js

@@ -0,0 +1,2 @@
+export { ComicStrip } from "./tag-name.js";
+export { default as toonstrip } from "./integration.js";

package/dist/integration.d.ts

@@ -0,0 +1,13 @@
+import type { AstroIntegration } from "astro";
+export interface ToonstripOptions {
+    /**
+     * Module specifiers of `@toonstrip/pack-*` packages to serve to the browser.
+     * Each pack's `pack.json` + `characters/` + `backdrops/` are copied into the
+     * site's public dir under `_toonstrip/<pack.json name>/` at config-setup
+     * time, so `<ComicStrip packs={['comic-chat']} />` can resolve the name to
+     * a URL `@toonstrip/element`'s fetch-based loader can reach. No
+     * auto-discovery — packs used by a page must be listed explicitly here.
+     */
+    packs?: string[];
+}
+export default function toonstrip(options?: ToonstripOptions): AstroIntegration;

package/dist/integration.js

@@ -0,0 +1,47 @@
+// Node built-ins are imported dynamically, inside the hook body, rather than
+// at module scope: this same module is also re-imported client-side (Astro's
+// hydration re-fetches the astro-island's `component-url`, and `ComicStrip`
+// lives in this package's index alongside `toonstrip`) — a static top-level
+// `node:fs`/`node:module` import breaks there ("externalized for browser
+// compatibility"), even though the function body itself never runs in a
+// browser. Dynamic imports keep this module's top level browser-safe.
+async function copyPackAssets(specifier, publicDir) {
+    const { createRequire } = await import("node:module");
+    const { cpSync, existsSync, mkdirSync, readFileSync } = await import("node:fs");
+    const { dirname, join } = await import("node:path");
+    const require = createRequire(import.meta.url);
+    const packDir = dirname(require.resolve(`${specifier}/package.json`));
+    const packJsonPath = join(packDir, "pack.json");
+    const packJson = JSON.parse(readFileSync(packJsonPath, "utf-8"));
+    const dest = join(publicDir, "_toonstrip", packJson.name);
+    mkdirSync(dest, { recursive: true });
+    cpSync(packJsonPath, join(dest, "pack.json"));
+    for (const dir of ["characters", "backdrops"]) {
+        const src = join(packDir, dir);
+        if (existsSync(src))
+            cpSync(src, join(dest, dir), { recursive: true });
+    }
+}
+export default function toonstrip(options = {}) {
+    return {
+        name: "@toonstrip/astro",
+        hooks: {
+            "astro:config:setup": async ({ addRenderer, config }) => {
+                addRenderer({
+                    name: "@toonstrip/astro",
+                    // Bare specifiers (not `new URL(...).href`) so Vite can place these
+                    // in its normal module graph — a raw file:// URL renders fine in
+                    // dev but breaks `astro build`'s static-output "built path" lookup,
+                    // which only resolves entrypoints it can trace through that graph.
+                    serverEntrypoint: "@toonstrip/astro/dist/renderer/server.js",
+                    clientEntrypoint: "@toonstrip/astro/dist/renderer/client.js",
+                });
+                const { fileURLToPath } = await import("node:url");
+                const publicDir = fileURLToPath(config.publicDir);
+                for (const specifier of options.packs ?? []) {
+                    await copyPackAssets(specifier, publicDir);
+                }
+            },
+        },
+    };
+}

package/dist/renderer/client.d.ts

@@ -0,0 +1,6 @@
+interface ComicStripProps {
+    document?: unknown;
+    packs?: string[];
+}
+declare const _default: (element: HTMLElement) => (_component: string, props: ComicStripProps) => Promise<void>;
+export default _default;

package/dist/renderer/client.js

@@ -0,0 +1,23 @@
+/**
+ * Maps a pack *name* (e.g. "comic-chat", per the dev plan's documented
+ * `packs={['comic-chat']}` usage) to the URL the `toonstrip()` integration
+ * copies that pack's assets to. See integration.ts's `astro:config:setup`.
+ */
+function packUrl(name) {
+    return `/_toonstrip/${name}/`;
+}
+export default (element) => async (_component, props) => {
+    // Deferred until the client directive's condition (e.g. `client:visible`)
+    // fires — `@toonstrip/element` defines `<comic-strip>` at module scope via
+    // `extends HTMLElement`, which would crash under Astro's SSR if imported
+    // from anywhere reachable at render time. This dynamic import is the only
+    // place in `@toonstrip/astro` that ever loads it.
+    await import("@toonstrip/element");
+    const target = element.children[0];
+    if (!target)
+        return;
+    if (props.document !== undefined)
+        target.document = props.document;
+    if (props.packs)
+        target.packs = props.packs.map(packUrl);
+};

package/dist/renderer/server.d.ts

@@ -0,0 +1,9 @@
+declare function check(Component: unknown): boolean;
+declare function renderToStaticMarkup(Component: string): {
+    html: string;
+};
+declare const _default: {
+    check: typeof check;
+    renderToStaticMarkup: typeof renderToStaticMarkup;
+};
+export default _default;

package/dist/renderer/server.js

@@ -0,0 +1,12 @@
+import { ComicStrip } from "../tag-name.js";
+function check(Component) {
+    return Component === ComicStrip;
+}
+function renderToStaticMarkup(Component) {
+    // Real content only ever exists client-side (canvas rendering needs a real
+    // browser canvas context) — the server placeholder is intentionally inert.
+    // Props travel via Astro's own astro-island `props` attribute, not through
+    // this markup, so nothing needs serializing into it.
+    return { html: `<${Component}></${Component}>` };
+}
+export default { check, renderToStaticMarkup };

package/dist/tag-name.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Zero-dependency, SSR-safe tag-name constant. Imported directly by consumers'
+ * `.astro` frontmatter (which runs on the server), so this module must never
+ * import anything that touches `HTMLElement`/`window` — `@toonstrip/element`
+ * does exactly that at module scope, which is why it is imported only inside
+ * `renderer/client.ts`, never from here.
+ */
+export declare const ComicStrip = "comic-strip";

package/dist/tag-name.js

@@ -0,0 +1,8 @@
+/**
+ * Zero-dependency, SSR-safe tag-name constant. Imported directly by consumers'
+ * `.astro` frontmatter (which runs on the server), so this module must never
+ * import anything that touches `HTMLElement`/`window` — `@toonstrip/element`
+ * does exactly that at module scope, which is why it is imported only inside
+ * `renderer/client.ts`, never from here.
+ */
+export const ComicStrip = "comic-strip";

package/package.json

@@ -0,0 +1,31 @@
+{
+  "name": "@toonstrip/astro",
+  "version": "0.1.0",
+  "license": "MIT",
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "tsc -p tsconfig.json",
+    "test": "vitest run",
+    "lint": "tsc -p tsconfig.json --noEmit"
+  },
+  "peerDependencies": {
+    "astro": "^7.0.0"
+  },
+  "dependencies": {
+    "@toonstrip/element": "workspace:*",
+    "@toonstrip/schema": "workspace:*"
+  },
+  "devDependencies": {
+    "astro": "^7.2.9",
+    "typescript": "^5.6.3",
+    "vitest": "^2.1.4"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}