continue

Author: lowlighter

@mizu/render/client/client.ts

@@ -17,10 +17,13 @@ export class Client {
   static defaults = {
     window: globalThis.window,
     directives: defaults,
-    context: {},
+    // @ts-expect-error: custom builder
+    context: globalThis.MIZU_CUSTOM_DEFAULTS_CONTEXT ?? {},
+    // @ts-expect-error: custom builder
     // deno-lint-ignore no-console
-    warn: console.warn,
-    debug: undefined,
+    warn: globalThis.MIZU_CUSTOM_DEFAULTS_WARN ?? console.warn,
+    // @ts-expect-error: custom builder
+    debug: globalThis.MIZU_CUSTOM_DEFAULTS_DEBUG ?? false,
   } as unknown as Required<ClientOptions>
 
   /** {@linkcode Client} constructor. */

deno.jsonc

@@ -118,7 +118,7 @@
     // Development server dependencies
     "@www/": "./www/",
     "@deno/doc": "jsr:@deno/doc@~0.161",
-    "@libs/bundle": "jsr:@libs/bundle@12",
+    "@libs/bundle": "jsr:@libs/bundle@12.5",
     "@libs/logger": "jsr:@libs/logger@3",
     "@std/collections": "jsr:@std/collections@1",
     "@std/http": "jsr:@std/http@1",

deno.lock

@@ -13,10 +13,43 @@ export default async function (request: Request) {
   }
   try {
     const options = await request.json()
-    const banner = _banner.replace(`${meta.name} — ${meta.version}\n`, `${meta.name} — ${meta.version} — Custom build (${new Date().toDateString()})\n`)
-    const bundled = await js("@mizu/render/client", { format: "iife", banner, minify: options.minify ? "terser" : false })
+    const bundled = await js("@mizu/render/client", {
+      banner: _banner.replace(`${meta.name} — ${meta.version}\n`, `${meta.name} — ${meta.version} — Custom build (${new Date().toDateString()})\n`),
+      minify: options.minify === true ? "terser" : false,
+      format: ["iife", "esm"].includes(options.format) ? options.format : throws("format: must be 'iife' or 'esm'"),
+      raw: {
+        define: {
+          "globalThis.MIZU_CUSTOM_DEFAULTS_CONTEXT": options.context ? options.context : "null",
+          "globalThis.MIZU_CUSTOM_DEFAULTS_WARN": options.console?.includes("warn") ? "console.warn" : "false",
+          "globalThis.MIZU_CUSTOM_DEFAULTS_DEBUG": options.console?.includes("debug") ? "console.debug" : "false",
+        },
+      },
+      overrides: {
+        imports: {
+          "./defaults.ts": Array.isArray(options.directives) && options.directives.every((name) => typeof name === "string")
+            ? `data:text/javascript;base64,${
+              btoa(
+                `
+            import _mizu from "@mizu/mizu"
+            ${options.directives.map((name: string, i: number) => `import _${i} from "@mizu/${name}"`).join("\n")}
+            export default [${options.directives.map((_: string, i: number) => `_${i}`).join(", ")}].flat(Infinity)
+          `.split("\n").map((line) => line.trim()).filter(Boolean).join("\n"),
+              )
+            }`
+            : throws("directives: must be an array of string"),
+        },
+      },
+    })
     return new Response(bundled, { headers: { "Content-Type": "application/javascript; charset=utf-8" } })
   } catch (error) {
+    if (error instanceof TypeError) {
+      return new Response(error.message, { status: Status.BadRequest })
+    }
     return new Response(error.message, { status: Status.InternalServerError })
   }
 }
+
+/** Throws a `TypeError` with the provided message. */
+function throws(message: string): never {
+  throw new TypeError(message)
+}

www/api/build.ts

@@ -108,12 +108,11 @@
     event.preventDefault()
     // Prepare data
     const raw = new FormData(form)
-    const data = {}
+    const data = { format: "", console: [], directives: [], minify: false }
     for (const [key, value] of raw) {
       switch (key) {
-        case "directives":
         case "console":
-          data[key] ??= []
+        case "directives":
           data[key].push(value)
           break
         case "minify":

www/html/build.html

@@ -46,14 +46,15 @@ function config(name: string, { parse = true } = {} as { parse?: boolean }) {
 }
 
 /** Generate JS. */
-export function js(exported: string, options = {} as Pick<NonNullable<Arg<typeof bundle, 1>>, "format" | "banner" | "minify"> & { raw?: Record<PropertyKey, unknown> }) {
+export function js(exported: string, options = {} as Pick<NonNullable<Arg<typeof bundle, 1>>, "format" | "banner" | "minify" | "overrides"> & { raw?: Record<PropertyKey, unknown> }) {
   const packaged = exported.match(jsr)?.groups?.package ?? exported
   const url = import.meta.resolve(exported)
   log.with({ package: packaged, url }).debug("bundling javascript")
   if (options?.format === "iife") {
     options.raw ??= {}
+    options.raw.define ??= {}
     options.raw.target = "es2020"
-    options.raw.define = { "globalThis.MIZU_IIFE": "true" }
+    Object.assign(options.raw.define as Record<PropertyKey, string>, { ["globalThis.MIZU_IIFE"]: "true" })
   }
   return bundle(new URL(url), { banner, ...options })
 }