@jon49/sw 0.12.9

package/bin/lib/arguments.ts

@@ -0,0 +1,46 @@
+import argvGenerator from "minimist"
+
+export class Arguments {
+    argv: Argv
+    constructor() {
+        this.argv = argvGenerator(process.argv.slice(2)) as Argv
+    }
+    get _() {
+        return this.argv._
+    }
+    get environment() {
+        return this.argv.e || this.argv.env || "dev"
+    }
+    get port() {
+        return this.argv.p || this.argv.port || 3000
+    }
+    get targetDirectory() {
+        return this.argv.t || this.argv.target || "./public"
+    }
+    get help() {
+        return this.argv.h || this.argv.help
+    }
+    get isHelp() {
+        return this.help
+    }
+    get isProd() {
+        return this.environment === "prod"
+    }
+}
+
+export interface Argv {
+    _: string[]
+    // Environment
+    e: "dev" | "server" | "prod"
+    env: "dev" | "server" | "prod"
+    // Port
+    p: number
+    port: number
+    // Target directory
+    t: string
+    target: string
+    // Help
+    h: boolean
+    help: boolean
+}
+

package/bin/lib/esbuild-plugins.ts

@@ -0,0 +1,114 @@
+import path from "node:path"
+import { cp, readFile, writeFile } from "node:fs/promises"
+
+import type { BuildResult, PluginBuild } from "esbuild"
+
+import { findHashedFile, glob, makeUrlPath, write } from "./system.ts"
+import { fileMapper } from "./file-mapper.ts"
+
+export function transformExportToReturn(targetDirectory: string) {
+    return {
+        name: 'transform-export-to-return',
+        setup(build: PluginBuild) {
+            build.onEnd(async result => {
+                if (result.errors.length !== 0) {
+                    return
+                }
+                await setPagesToReturn(targetDirectory)
+            })
+        },
+    }
+}
+
+async function setPagesToReturn(targetDirectory: string) {
+    let files = await glob("**/*.js", targetDirectory)
+    await Promise.all(files.map(async (file: string) => {
+        let filename = path.join(targetDirectory, file)
+        let content = await readFile(filename, "utf-8")
+        let matched = content.match(/,(\w*)=(\w*);export/)
+        if (matched) {
+            let [, name, value] = matched
+            content = content.replace(`,${name}=${value}`, "")
+            content = content.replace(
+                `export{${name} as default}`,
+                `return ${value}`)
+        } else {
+            let matched = content.match(/var (\w*) = (\w*);\sexport \{\s.*\s.*/)
+            if (!matched) {
+                return
+            }
+            content = content.replace(matched[0], `return ${matched[2]};`)
+        }
+        await writeFile(filename, content, 'utf-8')
+    }))
+}
+
+export function updateFileMapper(targetDirectory: string) {
+    return {
+        name: 'update-file-mapper',
+        setup(build: PluginBuild) {
+            build.onEnd(async (result: BuildResult) => {
+                if (result.errors.length !== 0) {
+                    return
+                }
+                await fileMapper(targetDirectory)
+            })
+        },
+    }
+}
+
+export function updateHTML(targetDirectory: string) {
+    return {
+        name: 'update-html-files',
+        setup(build: PluginBuild) {
+            build.onEnd(async result => {
+                if (result.errors.length !== 0) {
+                    return
+                }
+                await handleHTML(targetDirectory)
+            })
+        },
+    }
+}
+
+async function handleHTML(targetDirectory: string) {
+    console.time("Copying HTML")
+    await cp(
+        "./node_modules/@jon49/sw/lib/app-loader.html",
+        `${targetDirectory}/web/index.html`,
+        { recursive: true }
+    )
+
+    let files = await glob("**/*.html", "./src")
+
+    let mappableFiles =
+        (await Promise.all(
+        (await glob("**/{css,js,images}/*.*", "./src"))
+        .map(async x => {
+            let ext = path.extname(x)
+            if (ext === ".ts") {
+                ext = ".js"
+            }
+            let hashedFile = await findHashedFile(x, ext, targetDirectory)
+            if (!hashedFile) {
+                return
+            }
+            return {
+                url: makeUrlPath(x),
+                file: makeUrlPath(hashedFile),
+            }
+        })))
+        .filter(x => x) as { url: string, file: string }[]
+
+    await Promise.all(files.map(async (filename: string) => {
+        let content = await readFile(`./src/${filename}`, "utf-8")
+        for (let mappableFile of mappableFiles) {
+            content = content.replace(mappableFile.url, mappableFile.file)
+        }
+
+        await write(`${targetDirectory}/${filename}`, content)
+    }))
+
+    console.timeEnd("Copying HTML")
+}
+

package/bin/lib/file-mapper.ts

@@ -0,0 +1,83 @@
+import { rm } from "node:fs/promises"
+import path from "node:path"
+
+import { getHash, glob, write } from "./system.ts"
+
+export interface FileMapper {
+    url: string
+    file: string
+}
+
+function isFileMapper(x: any | undefined): x is FileMapper {
+    return x?.url && x?.file
+}
+
+let option: { isRunning: boolean, isWaiting: NodeJS.Timeout | null } = {
+    isRunning: false,
+    isWaiting: null
+}
+
+export async function fileMapper(targetDirectory: string, force = false) {
+    if (option.isRunning || option.isWaiting || !force) {
+        if (option.isWaiting) {
+            clearTimeout(option.isWaiting)
+        }
+        option.isWaiting = setTimeout(() => {
+            option.isWaiting = null
+            fileMapper(targetDirectory, true)
+        }, 30)
+        return
+    }
+    try {
+        option.isRunning = true
+        console.time("File Mapper")
+
+        let oldFileMapperFiles = await glob("**/file-map.*.js", targetDirectory)
+        Promise.all(oldFileMapperFiles.map(async x => {
+            await rm(`${targetDirectory}/${x}`)
+        }))
+
+        let files: string[] = await glob("**/*.{js,css,json,ico,svg,png}", targetDirectory)
+
+        let mapper = files.map(x => {
+            let parsed = path.parse(x)
+            let parsed2 = path.parse(parsed.name)
+            let url = `/${parsed.dir}/${parsed2.name}${parsed.ext}`
+            let file = `/${x}`
+            return {
+                url,
+                file,
+            }
+        })
+        .filter(isFileMapper)
+
+        // Write mapper to file in src/web/file-map.js
+        if (option.isWaiting) return
+        let fileMapContent = `(() => { self.app = { links: ${JSON.stringify(mapper)} } })()`
+        let hash = getHash(fileMapContent)
+        let fileMapUrl = `/web/file-map.${hash}.js`
+        await write(`${targetDirectory}${fileMapUrl}`, fileMapContent)
+
+        let globalFiles =
+            mapper
+            .filter(x => x.url.includes(".global."))
+            .map(x => x.file)
+            .join(`","`)
+
+        let swFile = mapper.find(x => x.url === "/web/sw.js")?.file
+
+        let globals = `${globalFiles && `"`}${globalFiles}${globalFiles && `",`}`
+        // Create service worker central file
+        if (option.isWaiting) return
+        await write(
+            `${targetDirectory}/web/sw.js`,
+            `importScripts("${fileMapUrl}",${globals}"${swFile}")`)
+
+    } catch (error) {
+        console.error(error)
+    } finally {
+        option.isRunning = false
+        console.timeEnd("File Mapper")
+    }
+}
+

package/bin/lib/system.ts

@@ -0,0 +1,71 @@
+import { glob as Glob, mkdir, writeFile } from "node:fs/promises"
+import path from "node:path"
+import crypto from 'crypto'
+import { createReadStream, existsSync } from "node:fs"
+
+function getHashOfFile(path: string): Promise<string> {
+    return new Promise((resolve, reject) => {
+        const hash = crypto.createHash('sha1')
+        const rs = createReadStream(path)
+        rs.on('error', reject)
+        rs.on('data', chunk => hash.update(chunk))
+        rs.on('end', () => resolve(hash.digest('hex').slice(0, 8)))
+    })
+}
+
+export async function addHash(filename: string) {
+    let hash = await getHashOfFile(`./src/${filename}`)
+    let ext = path.extname(filename)
+
+    return insertString(filename, `.${hash}`, -ext.length)
+}
+
+function insertString(original: string, insert: string, index: number) {
+    let result = original.slice(0, index) + insert + original.slice(index)
+    return result
+}
+
+export async function glob(globString: string, targetDirectory: string) {
+    let files: string[] = []
+    for await (const file of Glob(globString, { cwd: targetDirectory })) {
+        files.push(file)
+    }
+    return files
+}
+
+export async function findHashedFile(
+    filename: string,
+    ext: string,
+    targetDirectory: string) {
+
+    let parsed = path.parse(filename)
+    for await (const file of Glob(`**/${parsed.dir}/${parsed.name}.*${ext}`, { cwd: targetDirectory })) {
+        return file
+    }
+}
+
+export function getHash(content: string) {
+    return crypto.createHash('sha1').update(content).digest('hex').slice(0, 8)
+}
+
+export async function write(filename: string, text: string) {
+    let directory = path.dirname(filename)
+    if (!existsSync(directory)) {
+        await mkdir(directory, { recursive: true })
+    }
+    await writeFile(filename, text, 'utf-8')
+}
+
+export function makeUrlPath(filename: string | undefined) {
+    if (filename == undefined) {
+        return
+    }
+    if (filename.startsWith("/")) {
+        return filename
+    }
+    if (filename.startsWith("./")) {
+        return filename.slice(1)
+    }
+    return `/${filename}`
+}
+

package/bin/start.ts

@@ -0,0 +1,154 @@
+import { cp, rm, mkdir } from "node:fs/promises"
+import path from "node:path"
+
+import esbuild from "esbuild"
+
+import { transformExportToReturn, updateFileMapper, updateHTML } from "./lib/esbuild-plugins.ts"
+import { addHash, glob } from "./lib/system.ts"
+import { Arguments } from "./lib/arguments.ts"
+
+let argv = new Arguments()
+
+if (argv.isHelp) {
+    console.log("Usage: node --experimental-strip-types start.ts [options]")
+    console.log("Options:")
+    console.log("  -e, --env, --environment  Environment (dev, server, prod)")
+    console.log("  -p, --port                Port (default: 3000)")
+    console.log("  -t, --target              Target directory (default: ./public)")
+    console.log("  -h, --help                Help")
+    process.exit(0)
+}
+
+let targetDirectory = argv.targetDirectory
+let isProd = argv.isProd
+
+console.time("Cleaning")
+await rm(targetDirectory, { recursive: true, force: true })
+console.timeEnd("Cleaning")
+
+console.time("Copying Files")
+await mkdir(targetDirectory, { recursive: true })
+let filesToCopy = await glob("**/*.{ico,png,svg,json}", "./src")
+let copyFiles = await glob("**/*.min.*", "./src")
+filesToCopy.push(...copyFiles)
+let hashedFiles = await Promise.all(filesToCopy.map(x => addHash(x)))
+await Promise.all(filesToCopy.map((filename, i) => {
+    let source = path.join("src", filename)
+    let target = path.join(targetDirectory, hashedFiles[i])
+    return cp(source, target, { recursive: true })
+}))
+console.timeEnd("Copying Files")
+
+// Bundled modules
+const bundleConfig = {
+    entryPoints: [
+        "./src/**/*.bundle.ts",
+    ],
+    entryNames: "[dir]/[name].[hash]",
+    bundle: true,
+    format: "esm",
+    minify: isProd,
+    outbase: "src",
+    outdir: targetDirectory,
+    plugins: [
+        updateFileMapper(targetDirectory),
+    ],
+    target: "es2023",
+    // logLevel: "debug",
+}
+
+// IIFEs
+const iifeConfig = {
+    entryPoints: [
+        "./src/**/*.global.ts",
+        "./src/web/sw.ts",
+    ],
+    entryNames: "[dir]/[name].[hash]",
+    bundle: true,
+    format: "iife",
+    minify: isProd,
+    outbase: "src",
+    outdir: targetDirectory,
+    plugins: [
+        updateFileMapper(targetDirectory),
+    ],
+    target: "es2023",
+    // logLevel: "debug",
+}
+
+// Static JS files
+let staticFiles = await glob("**/js/*.{js,ts}", "./src")
+let isStaticFile = /.*\/[0-9a-zA-Z\-]+.[jt]s/
+let staticEntryPoints =
+        staticFiles
+            .filter(x =>
+                    isStaticFile.test(x)
+                    && !x.includes(".bundle.")
+                    && !x.includes(".min.")
+                    && !x.includes("sw.ts"))
+            .map(x => `./src/${x}`)
+
+const staticFileConfig = {
+    entryPoints: [
+        "./src/**/*.css",
+        ...staticEntryPoints,
+    ],
+    entryNames: "[dir]/[name].[hash]",
+    bundle: true,
+    format: "esm",
+    minify: isProd,
+    outbase: "src",
+    outdir: targetDirectory,
+    plugins: [
+        updateHTML(targetDirectory),
+        updateFileMapper(targetDirectory),
+    ],
+    target: "es2023",
+    external: ["*"],
+}
+
+// Pages
+const pagesConfig = {
+    entryPoints: [
+        "./src/**/*.page.ts",
+    ],
+    entryNames: "[dir]/[name].[hash]",
+    bundle: true,
+    format: "esm",
+    minify: isProd,
+    outbase: "src",
+    outdir: targetDirectory,
+    plugins: [
+        transformExportToReturn(targetDirectory),
+        updateFileMapper(targetDirectory),
+    ],
+    target: "es2023",
+}
+
+const configs = [
+    bundleConfig,
+    iifeConfig,
+    staticFileConfig,
+    pagesConfig,
+]
+
+if (isProd) {
+    console.time("Building")
+    // @ts-ignore
+    await Promise.all(configs.map(x => esbuild.build(x)))
+    console.timeEnd("Building")
+} else {
+    console.time("Watching")
+    // @ts-ignore
+    let contexts = await Promise.all(configs.map(x => esbuild.context(x)))
+    for (let i = 0; i < contexts.length; i++) {
+        let ctx = contexts[i]
+        if (i === 0) {
+            ctx.serve({ port: argv.port, servedir: targetDirectory, host: "localhost" })
+        } else {
+            ctx.watch()
+        }
+    }
+    console.timeEnd("Watching")
+}
+

package/lib/app-loader.html

@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Loading&hellip;</title>
+</head>
+<body>
+
+<p>Loading&hellip;</p>
+
+<script>
+
+(async () => {
+    if ('serviceWorker' in navigator) {
+        let registration = await navigator.serviceWorker.register(`/web/sw.js`)
+        registration.installing.addEventListener('statechange', event => {
+            if (event.target.state === 'installed') {
+                setTimeout(() => {
+                    document.location.reload()
+                }, 100)
+            }
+        })
+    } else {
+        document.body.innerHTML = `<p>Service worker is not supported. Please
+        use a browser which supports service workers.</p>`
+    }
+})()
+
+</script>
+
+</body>
+</html>
+

package/lib/arguments.ts

@@ -0,0 +1,46 @@
+import argvGenerator from "minimist"
+
+export class Arguments {
+    argv: Argv
+    constructor() {
+        this.argv = argvGenerator(process.argv.slice(2)) as Argv
+    }
+    get _() {
+        return this.argv._
+    }
+    get environment() {
+        return this.argv.e || this.argv.env || "dev"
+    }
+    get port() {
+        return this.argv.p || this.argv.port || 3000
+    }
+    get targetDirectory() {
+        return this.argv.t || this.argv.target || "./public"
+    }
+    get help() {
+        return this.argv.h || this.argv.help
+    }
+    get isHelp() {
+        return this.help
+    }
+    get isProd() {
+        return this.environment === "prod"
+    }
+}
+
+export interface Argv {
+    _: string[]
+    // Environment
+    e: "dev" | "server" | "prod"
+    env: "dev" | "server" | "prod"
+    // Port
+    p: number
+    port: number
+    // Target directory
+    t: string
+    target: string
+    // Help
+    h: boolean
+    help: boolean
+}
+

package/lib/db.ts

@@ -0,0 +1,69 @@
+import { get, getMany, setMany, set as set1, update as update1, clear } from "idb-keyval"
+
+const _updated =
+    async (key: IDBValidKey) => {
+        await update1("updated", (val?: Updated) => {
+            if (Array.isArray(key)) {
+                key = JSON.stringify(key)
+            }
+
+            // If key is not string or number then make it a string.
+            if (typeof key !== "string" && typeof key !== "number") {
+                key = key.toString()
+            }
+
+            return (val || new Set).add(key)
+        })
+    }
+
+export interface DBSet<DBAccessors extends any> {
+    <K extends keyof DBAccessors>(key: K, value: DBAccessors[K], sync?: boolean): Promise<void>
+    <T>(key: string, value: T, sync?: boolean): Promise<void>
+    (key: string | any[], value: any, sync?: boolean): Promise<void>
+}
+const set: DBSet<any> =
+async function(key: any, value: any, sync = true) {
+    if (sync && "_rev" in value) {
+        if ("_rev" in value) {
+            await _updated(key)
+        } else {
+            return Promise.reject(`Revision number not specified! For "${key}".`)
+        }
+    }
+    await set1(key, value)
+    return
+}
+
+export interface DBUpdate<DBAccessors extends any> {
+    <K extends keyof DBAccessors>(key: K, f: (val: DBAccessors[K]) => DBAccessors[K], options?: { sync: boolean }): Promise<void>
+    <T>(key: string, f: (val: T) => T, options?: { sync: boolean }): Promise<void>
+    (key: string, f: (v: any) => any, options?: { sync: boolean }): Promise<void>
+}
+
+const update: DBUpdate<any> =
+async function update(key: any, f: any, options = { sync: true }) {
+    await update1(key, f)
+    if (options.sync) {
+        let o: any = await get<any>(key)
+        if (o && "_rev" in o) {
+            await _updated(key)
+        } else {
+            Promise.reject(`Revision number not found for "${key}".`)
+        }
+    }
+}
+
+export { update, set, get, getMany, setMany, clear }
+
+export interface DBGet<DBAccessors extends any> {
+    <K extends keyof DBAccessors>(key: K): Promise<DBAccessors[K] | undefined>
+    <T>(key: string): Promise<T | undefined>
+}
+
+export type Updated = Set<IDBValidKey>
+
+export interface Revision { _rev: number }
+
+export type FormReturn<T> = { [key in keyof T]: string|undefined }
+
+export type Theme = "light" | "dark" | "system"

package/lib/new-app-notifier.ts

@@ -0,0 +1,51 @@
+// https://deanhume.com/displaying-a-new-version-available-progressive-web-app/
+let refreshing = false
+// The event listener that is fired when the service worker updates
+// Here we reload the page
+navigator.serviceWorker.addEventListener('controllerchange', function () {
+    if (refreshing) return
+    window.location.reload()
+    refreshing = true
+})
+
+/// Checks if there is a new version of the app available
+/// @param fn - Callback function to be called when a new version is available
+/// @returns void
+/// @example
+/// notifier((state, worker) => {
+///     if (state !== "waiting") {
+///         // Show notification
+///     }
+///     if (/* user confirms update */) {
+///         worker.postMessage("skipWaiting")
+///     }
+/// })
+export function notifier(fn: (state: "" | "waiting", worker: ServiceWorker) => void) {
+    let newWorker: ServiceWorker | undefined | null
+
+    if ('serviceWorker' in navigator) {
+        // Register the service worker
+        navigator.serviceWorker.register('/web/sw.js').then(reg => {
+            if ((newWorker = reg.waiting)?.state === 'installed') {
+                // @ts-ignore
+                fn("waiting", newWorker)
+                return
+            }
+            reg.addEventListener('updatefound', () => {
+                // An updated service worker has appeared in reg.installing!
+                newWorker = reg.installing
+
+                newWorker?.addEventListener('statechange', () => {
+
+                    // There is a new service worker available, show the notification
+                    if (newWorker?.state === "installed" && navigator.serviceWorker.controller) {
+                        navigator.serviceWorker.controller.postMessage("installed")
+                        fn("", newWorker)
+                    }
+
+                })
+            })
+        })
+    }
+}
+

package/lib/routes.ts

@@ -0,0 +1,366 @@
+// @ts-ignore
+let links: { file: string, url: string }[] | undefined = self.app?.links
+
+if (!links) {
+    console.error("Expecting links defined with `self.app.links`, but found none.")
+}
+
+function redirect(req: Request) {
+  return Response.redirect(req.referrer, 303)
+}
+
+const searchParamsHandler = {
+  get(obj: any, prop: string) {
+    if (prop === "_url") {
+      return obj
+    }
+    return obj.searchParams.get(prop)
+  }
+}
+
+function searchParams<TReturn>(req: Request) : TReturn & {_url: URL} {
+  let url = new URL(req.url)
+  return new Proxy(url, searchParamsHandler)
+}
+
+interface ResponseOptions {
+    handleErrors?: Function
+}
+
+export let options: ResponseOptions = {}
+
+// Test if value is Async Generator
+let isHtml = (value: any) =>
+    value?.next instanceof Function
+    && value.throw instanceof Function
+
+// @ts-ignore
+export async function getResponse(event: FetchEvent): Promise<Response>  {
+    try {
+        const req : Request = event.request
+        const url = normalizeUrl(req.url)
+        return (
+            !url.pathname.startsWith("/web/")
+                ? fetch(req)
+            : executeHandler({ url, req, event }))
+    } catch(error) {
+        console.error("Get Response Error", error)
+        return new Response("Oops something happened which shouldn't have!")
+    }
+}
+
+function getErrors(errors: any): string[] {
+    return typeof errors === "string"
+        ? [errors]
+    : call(options.handleErrors, errors) ?? []
+}
+
+function isHtmf(req: Request) {
+    return req.headers.has("HF-Request")
+}
+
+function htmfHeader(req: Request, events: any = {}, messages: string[] = [])
+    : Record<string, string> {
+    if (!isHtmf(req)) return {}
+    let userMessages =
+        messages?.length > 0
+            ? { "user-messages": messages }
+        : null
+    return {
+        "hf-events": JSON.stringify({
+        ...userMessages,
+        ...(events || {})
+    }) ?? "{}" }
+}
+
+function call(fn: Function | undefined, args: any) {
+    return fn instanceof Function && fn(args)
+}
+
+const methodTypes = ['get', 'post'] as const
+type MethodTypes = typeof methodTypes[number] | null
+
+function isMethod(method: unknown) {
+    if (typeof method === "string" && methodTypes.includes(<any>method)) {
+        return method as MethodTypes
+    }
+    return null
+}
+
+let cache = new Map<string, any>()
+export async function findRoute(url: URL, method: unknown) {
+    let validMethod : MethodTypes = isMethod(method)
+    if (validMethod) {
+        // @ts-ignore
+        if (!self.app?.routes) {
+            console.error("Expecting routes defined with `self.app.routes`, but found none.")
+            return null
+        }
+        // @ts-ignore
+        for (const r of self.app.routes) {
+            if (r.file
+                && (r.route instanceof RegExp && r.route.test(url.pathname)
+                 || (r.route instanceof Function && r.route(url)))) {
+                let file = links?.find(x => x.url === r.file)?.file
+                // Load file
+                if (!file) {
+                    console.error(`"${r.file}" not found in links!`)
+                    return null
+                }
+                if (!cache.has(file)) {
+                    let cachedResponse = await cacheResponse(file)
+                    if (!cacheResponse) {
+                        console.error(`"${file}" not found in cache!`)
+                        return null
+                    }
+                    let text = await cachedResponse.text()
+                    let func = new Function(text)()
+                    cache.set(file, func)
+                }
+
+                let routeDef = cache.get(file)
+                if (routeDef[validMethod]) {
+                    return routeDef[validMethod]
+                }
+            }
+
+            if (r[validMethod]
+                && (r.route instanceof RegExp && r.route.test(url.pathname)
+                    || (r.route instanceof Function && r.route(url)))) {
+                return r[validMethod]
+            }
+        }
+    }
+    return null
+}
+
+interface ExectuteHandlerOptions {
+    url: URL
+    req: Request
+    // @ts-ignore
+    event: FetchEvent
+}
+async function executeHandler({ url, req, event }: ExectuteHandlerOptions) : Promise<Response> {
+    let method = req.method.toLowerCase()
+    let isPost = method === "post"
+    if (!isPost && !url.pathname.endsWith("/")) return cacheResponse(url.pathname, event)
+
+    let handlers =
+        <RouteHandler<RouteGetArgs | RoutePostArgs> | null>
+        await findRoute(url, method)
+
+    // @ts-ignore
+    if (handlers) {
+        try {
+            let messages: string[] = []
+            const data = await getData(req)
+            let query = searchParams<{ handler?: string }>(req)
+            let args = { req, data, query }
+            let result = await (
+                handlers instanceof Function
+                    ? handlers(args)
+                : (call(handlers[query.handler ?? ""], args)
+                   || call(handlers[method], args)
+                   || Promise.reject("I'm sorry, I didn't understand where to route your request.")))
+
+            if (!result) {
+                return isPost
+                    ? redirect(req)
+                : new Response("Not Found!", { status: 404 })
+            }
+
+            if (isPost && result.message == null) {
+                messages.push("Saved!")
+            }
+
+            if (isHtml(result)) {
+                return streamResponse({
+                    body: result,
+                    headers: htmfHeader(req, null, messages)
+                })
+            }
+
+            if (result.message?.length > 0) {
+                messages.push(result.message)
+            } else if (result.messages?.length > 0) {
+                messages.push(...result.messages)
+            }
+
+            result.headers = {
+                ...htmfHeader(req, result.events, messages),
+                ...result.headers
+            }
+
+            if (isHtml(result.body)) {
+                return streamResponse(result)
+            } else {
+                if ("json" in result) {
+                    result.body = JSON.stringify(result.json)
+                    result.headers = {
+                        ...result.headers,
+                        "content-type": "application/json"
+                    }
+                }
+                return new Response(result.body, {
+                        status: result.status ?? 200,
+                        headers: result.headers
+                    })
+            }
+
+        } catch (error) {
+            console.error(`"${method}" error:`, error, "\nURL:", url);
+            if (!isHtmf(req)) {
+                if (isPost) {
+                    return redirect(req)
+                } else {
+                    return new Response("Not Found!", { status: 404 })
+                }
+            } else {
+                let errors : string[] = getErrors(error)
+                let headers = htmfHeader(req, {}, errors)
+                return new Response(null, {
+                    status: isPost ? 400 : 500,
+                    headers
+                })
+            }
+        }
+    }
+
+    return new Response(null, {
+        status: 404,
+        headers: htmfHeader(req, {}, ["Not Found!"])
+    })
+}
+
+async function getData(req: Request) {
+    let o : any = {}
+    if (req.headers.get("content-type")?.includes("application/x-www-form-urlencoded")) {
+        const formData = await req.formData()
+        for (let [key, val] of formData.entries()) {
+            if (key.endsWith("[]")) {
+                key = key.slice(0, -2)
+                if (key in o) {
+                    o[key].push(val)
+                } else {
+                    o[key] = [val]
+                }
+            } else {
+                o[key] = val
+            }
+        }
+    } else if (req.headers.get("Content-Type")?.includes("json")) {
+        o = await req.json()
+    }
+    return o
+}
+
+async function cacheResponse(url: string, event?: { request: string | Request } | undefined) : Promise<Response> {
+    url = links?.find(x => x.url === url)?.file || url
+    const match = await caches.match(url)
+    if (match) return match
+    const res = await fetch(event?.request || url)
+    if (!res || res.status !== 200 || res.type !== "basic") return res
+    const responseToCache = res.clone()
+    // @ts-ignore
+    let version: string = self.app?.version
+        ?? (console.warn("The version number is not available, expected glboal value `self.app.version`."), "")
+    const cache = await caches.open(version)
+    cache.put(url, responseToCache)
+    return res
+}
+
+const encoder = new TextEncoder()
+function streamResponse(response: { body: Generator, headers?: any }) : Response {
+    let { body, headers } = response
+    const stream = new ReadableStream({
+        async start(controller : ReadableStreamDefaultController<any>) {
+            try {
+                for await (let x of body) {
+                    if (typeof x === "string")
+                        controller.enqueue(encoder.encode(x))
+                }
+                controller.close()
+            } catch (error) {
+                console.error(error)
+            }
+        }
+    })
+
+    return new Response(stream, {
+        headers: {
+            "content-type": "text/html; charset=utf-8",
+            ...headers,
+        }})
+}
+
+/**
+*  /my/url -> /my/url/
+*  /my/script.js -> /my/script.js
+*/
+function normalizeUrl(url: string) : URL {
+    let uri = new URL(url)
+    let path = uri.pathname
+    !uri.pathname.endsWith("/") && (uri.pathname = isFile(path) ? path : path+"/")
+    return uri
+}
+
+function isFile(s: string) {
+    return s.lastIndexOf("/") < s.lastIndexOf(".")
+}
+
+export interface RouteGetArgs {
+    req: Request
+    query: any
+}
+
+export interface RoutePostArgs {
+    query: any
+    data: any
+    req: Request 
+}
+
+export interface  RouteObjectReturn {
+    body?: string | AsyncGenerator | null
+    status?: number
+    headers?: any
+    events?: any
+    message?: string
+    messages?: string[]
+    json?: any
+}
+
+export interface RouteHandler<T> {
+    (options: T): Promise<
+        AsyncGenerator
+        | Response
+        | RouteObjectReturn
+        | undefined
+        | null
+        | void >
+}
+
+export interface RoutePostHandler {
+    [handler: string]: RouteHandler<RoutePostArgs>
+}
+
+export interface RouteGetHandler {
+    [handler: string]: RouteHandler<RouteGetArgs>
+}
+
+interface Route_ {
+    route: RegExp | ((a: URL) => boolean)
+    file?: string
+    get?: RouteHandler<RouteGetArgs> | RouteGetHandler
+    post?: RouteHandler<RoutePostArgs> | RoutePostHandler
+}
+
+type RequireAtLeastOne<T, Keys extends keyof T = keyof T> =
+    Pick<T, Exclude<keyof T, Keys>> 
+    & {
+        [K in Keys]-?: Required<Pick<T, K>> & Partial<Pick<T, Exclude<Keys, K>>>
+    }[Keys]
+
+export type Route = RequireAtLeastOne<Route_, "file" | "get" | "post">
+export type RoutePage = Pick<Route_, "get" | "post">
+
+

package/lib/utils.ts

@@ -0,0 +1,26 @@
+export function when<S, T>(b: S | undefined, s: (a: S) => T): T | undefined
+export function when<T>(b: any, s: T): T | undefined
+export function when(b: any, s: any) {
+    return b
+        ? (s instanceof Function && s.length ? s(b) : s)
+    : typeof s === "string"
+        ? ""
+    : undefined
+}
+
+export class DbCache {
+    #cache: Map<string, any>
+    constructor() {
+        this.#cache = new Map()
+    }
+
+    async get<T>(key: string, fn: () => Promise<T>): Promise<T> {
+        if (this.#cache.has(key)) {
+            return this.#cache.get(key)
+        }
+        let value = await fn()
+        this.#cache.set(key, value)
+        return value
+    }
+}
+

package/lib/validation.ts

@@ -0,0 +1,143 @@
+export async function reject(s: string | string[]) {
+    return Promise.reject(s)
+}
+
+interface Value<T> {
+    value: T
+}
+interface String_ extends Value<string> {
+}
+export interface String100 extends String_ {}
+export interface String50 extends String_ {}
+export type TableType = string
+export interface IDType<T extends TableType> extends Value<number> { 
+    _id: T
+}
+
+const notFalsey = async (error: string, val: string | undefined) =>
+    !val ? reject(error) : val
+
+const maxLength = async (error: string, val: string, maxLength: number) =>
+    (val.length > maxLength)
+        ? reject(error)
+    : val
+
+const createString = async (name: string, maxLength_: number, val?: string | undefined) => {
+    const trimmed = await notFalsey(`"${name}" is required.`, val?.trim())
+    const s = await maxLength(`'${name}' must be less than ${maxLength_} characters.`, trimmed, maxLength_)
+    return <string>s
+}
+
+function isInteger(val: number) {
+    try {
+        BigInt(val)
+        return true
+    } catch(e) {
+        return false
+    }
+}
+
+export async function createNumber(name: string, val: number | string) : Promise<number> {
+    let num = +val
+    if (isNaN(num)) {
+        return reject(`'${name}' was expecting a number but was given ${val}`)
+    }
+    return num
+}
+
+export function createPositiveNumber(name: string) {
+    return async function (val: number | string | undefined | null) {
+        if (val == null) return reject(`'${name}' is required.`)
+        let num = await createNumber(name, val)
+        if (num < 0) return reject(`'${name}' must be 0 or greater. But was given '${val}'.`)
+        return num
+    }
+}
+
+export function createPositiveWholeNumber(name: string) : (val: number | string | undefined | null) => Promise<number> {
+    return async (val: number | string | undefined | null) => {
+        let num = await createPositiveNumber(name)(val)
+        if (!isInteger(num)) return reject(`${name} must be a whole number. But was given '${num}' and was expecting '${num|0}'.`)
+        return num
+    }
+}
+
+export function createArrayOf<S, T>(fn: (val: S) => Promise<T>) : (val: S[]) => Promise<T[]> {
+    return async (values: S[]) => {
+        let result = Promise.all(values.map(fn))
+        return result
+    }
+}
+
+export function createIdNumber(name: string) : (val: number | string) => Promise<number> {
+    return async (val: number | string) => {
+        let wholeNumber = await createPositiveWholeNumber(name)(val)
+        if (wholeNumber < 1) return reject(`'${name}' must be 1 or greater. But was given '${val}'.`)
+        return wholeNumber
+    }
+}
+
+export const maybe =
+    <T, S>(f: (val: T) => Promise<S>) =>
+    (val: T | undefined | null) =>
+        val == null || val === "" ? Promise.resolve(void 0) : f(val)
+
+export const createDateString =
+    (name: string) =>
+    (val: string | undefined) : Promise<string> =>
+        /\d{4}-[01]\d-[0123]\d/.test(val ?? "")
+            ? Promise.resolve(<string>val)
+        : reject(`'${name}' must be a valid date string. But was given '${val}'.`)
+
+export const createTimeString =
+    (name: string) =>
+    (val: string | undefined) : Promise<string> =>
+        /\d{2}:\d{2}/.test(val ?? "")
+            ? Promise.resolve(<string>val)
+        : reject(`'${name}' must be a valid time string. But was given '${val}'.`)
+
+export const createDateTimeString =
+    (name: string) =>
+    (val: string | undefined) : Promise<string> => {
+        if (/\d{4}-\d{2}-\d{2}T\d{2}:\d{2}/.test(val ?? "")) {
+            return Promise.resolve(<string>val)
+        }
+        return reject(`'${name}' must be a valid date time string. But was given '${val}'.`)
+    }
+
+export const createString25 =
+    (name: string) =>
+    (val: string | undefined) =>
+        createString(name, 25, val)
+
+export const createString50 =
+    (name: string) =>
+    (val: string | undefined) =>
+        createString(name, 50, val)
+
+export const createStringInfinity =
+    (name: string) =>
+    (val: string | undefined) =>
+        createString(name, Infinity, val)
+
+export function createCheckbox(val: string | undefined) {
+    return Promise.resolve(val === "on")
+}
+
+type Nullable<T> = T | undefined | null
+export async function required<T>(o: Nullable<T>, message: string): Promise<T> {
+    if (!o) return reject(message)
+    return o
+}
+
+class Assert {
+    isFalse(value: boolean, message: string) {
+        return !value ? Promise.resolve() : reject(message)
+    }
+    isTrue(value: boolean, message: string) {
+        return this.isFalse(!value, message)
+    }
+}
+export const assert = new Assert()
+
+

package/package.json

@@ -0,0 +1,44 @@
+{
+  "name": "@jon49/sw",
+  "version": "0.12.9",
+  "description": "Packages for MVC service workers.",
+  "type": "module",
+  "files": [
+    "lib",
+    "bin"
+  ],
+  "exports": {
+    "./routes.js": "./lib/routes.ts",
+    "./new-app-notifier.js": "./lib/new-app-notifier.ts",
+    "./validation.js": "./lib/validation.ts",
+    "./utils.js": "./lib/utils.ts",
+    "./db.js": "./lib/db.ts"
+  },
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [
+    "service-worker",
+    "MVC"
+  ],
+  "author": "Jon Nyman",
+  "license": "ISC",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/jon49/jon49-sw.git"
+  },
+  "bugs": {
+    "url": "https://github.com/jon49/jon49-sw/issues"
+  },
+  "homepage": "https://github.com/jon49/jon49-sw#readme",
+  "dependencies": {
+    "esbuild": "^0.24.0",
+    "idb-keyval": "^6.2.1",
+    "minimist": "^1.2.8"
+  },
+  "devDependencies": {
+    "@types/minimist": "^1.2.5",
+    "@types/node": "^22.7.7",
+    "typescript": "^5.6.3"
+  }
+}