htmx-router 0.0.1

package/bin/cli.d.ts

@@ -0,0 +1,2 @@
+#!/usr/bin/env node
+export {};

package/bin/cli.js

@@ -0,0 +1,46 @@
+#!/usr/bin/env node
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const fs_1 = require("fs");
+const path_1 = require("path");
+const router_1 = require("./router");
+const cwd = process.argv[2] || "./";
+const rootMatcher = new RegExp(/^root\.(j|t)sx?$/);
+const root = (0, fs_1.readdirSync)(cwd)
+    .filter(x => rootMatcher.test(x))[0];
+if (!root) {
+    console.log(`Missing root.jsx/tsx`);
+    process.exit(1);
+}
+function readDirRecursively(dir) {
+    const files = (0, fs_1.readdirSync)(dir, { withFileTypes: true });
+    let filePaths = [];
+    for (const file of files) {
+        if (file.isDirectory()) {
+            filePaths = [...filePaths, ...readDirRecursively((0, path_1.join)(dir, file.name))];
+        }
+        else {
+            filePaths.push((0, path_1.join)(dir, file.name));
+        }
+    }
+    return filePaths;
+}
+const DIR = './routes';
+const files = readDirRecursively(`${cwd}/routes`)
+    .filter(x => (0, router_1.IsAllowedExt)((0, path_1.extname)(x).slice(1)))
+    .map(x => (0, path_1.relative)(cwd, x.slice(0, x.lastIndexOf("."))).replace(/\\/g, "/"))
+    .sort();
+let script = `import { RouteTree } from "htmx-router";\n`;
+for (let i = 0; i < files.length; i++) {
+    const file = files[i];
+    script += `import * as Route${i} from "./${file}";\n`;
+}
+script += `import * as RootRoute from "./root";\n`;
+script += `\nexport const Router = new RouteTree;\n`;
+for (let i = 0; i < files.length; i++) {
+    const file = files[i];
+    script += `Router.ingest("${file.slice(DIR.length - 1)}", Route${i}, []);\n`;
+}
+script += `Router.assignRoot(RootRoute);\n`;
+(0, fs_1.writeFileSync)(`${cwd}/router.ts`, script);
+console.log(`Build with routes;\n` + files.map(x => `  - ${x}`).join("\n"));

package/bin/helper.d.ts

@@ -0,0 +1,3 @@
+export declare function StyleCSS(props: {
+    [key: string]: string | number;
+}): string;

package/bin/helper.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StyleCSS = void 0;
+function StyleCSS(props) {
+    let out = "";
+    for (const key in props) {
+        const safeKey = key.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();
+        const safeVal = props[key].toString().replace(/"/g, "\\\"");
+        out += `${safeKey}: ${safeVal};`;
+    }
+    return out;
+}
+exports.StyleCSS = StyleCSS;

package/bin/index.d.ts

@@ -0,0 +1,4 @@
+import { RouteTree } from "./router";
+import { ErrorResponse, Redirect, Outlet, Override, RenderArgs } from "./shared";
+import { StyleCSS } from "./helper";
+export { RouteTree, ErrorResponse, Redirect, Override, RenderArgs, Outlet, StyleCSS };

package/bin/index.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StyleCSS = exports.RenderArgs = exports.Override = exports.Redirect = exports.ErrorResponse = exports.RouteTree = void 0;
+const router_1 = require("./router");
+Object.defineProperty(exports, "RouteTree", { enumerable: true, get: function () { return router_1.RouteTree; } });
+const shared_1 = require("./shared");
+Object.defineProperty(exports, "ErrorResponse", { enumerable: true, get: function () { return shared_1.ErrorResponse; } });
+Object.defineProperty(exports, "Redirect", { enumerable: true, get: function () { return shared_1.Redirect; } });
+Object.defineProperty(exports, "Override", { enumerable: true, get: function () { return shared_1.Override; } });
+Object.defineProperty(exports, "RenderArgs", { enumerable: true, get: function () { return shared_1.RenderArgs; } });
+const helper_1 = require("./helper");
+Object.defineProperty(exports, "StyleCSS", { enumerable: true, get: function () { return helper_1.StyleCSS; } });

package/bin/router.d.ts

@@ -0,0 +1,23 @@
+/// <reference types="node" />
+import type http from "node:http";
+import { Outlet, RenderArgs, RouteModule } from "./shared";
+export declare function IsAllowedExt(ext: string): boolean;
+declare class RouteLeaf {
+    module: RouteModule;
+    mask: boolean[];
+    constructor(module: RouteModule, mask: boolean[]);
+    makeOutlet(args: RenderArgs, outlet: Outlet): Outlet;
+}
+export declare class RouteTree {
+    nested: Map<string, RouteTree>;
+    wild: RouteTree | null;
+    wildCard: string;
+    default: RouteLeaf | null;
+    route: RouteLeaf | null;
+    constructor();
+    assignRoot(module: RouteModule): void;
+    ingest(path: string | string[], module: RouteModule, override: boolean[]): void;
+    render(req: http.IncomingMessage, res: http.ServerResponse, url: URL): Promise<string> | "";
+    private _recursiveRender;
+}
+export {};

package/bin/router.js

@@ -0,0 +1,155 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RouteTree = exports.IsAllowedExt = void 0;
+const shared_1 = require("./shared");
+function IsAllowedExt(ext) {
+    // js, jsx, tsx, ts
+    if (ext[1] !== "s")
+        return false;
+    if (ext[0] !== "j" && ext[0] !== "t")
+        return false;
+    if (ext.length == 2)
+        return true;
+    if (ext.length != 3)
+        return false;
+    if (ext[2] !== "x")
+        return false;
+    return true;
+}
+exports.IsAllowedExt = IsAllowedExt;
+async function blankOutlet() {
+    return "";
+}
+class RouteLeaf {
+    constructor(module, mask) {
+        this.module = module;
+        this.mask = mask;
+    }
+    makeOutlet(args, outlet) {
+        const renderer = this.module.Render || blankOutlet;
+        const catcher = this.module.CatchError;
+        return async () => {
+            try {
+                return await renderer(args, outlet);
+            }
+            catch (e) {
+                if (e instanceof shared_1.Redirect || e instanceof shared_1.Override)
+                    throw e;
+                const err = (e instanceof shared_1.ErrorResponse) ? e :
+                    new shared_1.ErrorResponse(500, "Runtime Error", e);
+                if (catcher)
+                    return await catcher(args, err);
+                throw err;
+            }
+        };
+    }
+}
+class RouteTree {
+    constructor() {
+        this.nested = new Map();
+        this.wildCard = "";
+        this.wild = null;
+        this.default = null;
+        this.route = null;
+    }
+    assignRoot(module) {
+        if (!module.Render)
+            throw new Error(`Root route is missing Render()`);
+        if (!module.CatchError)
+            throw new Error(`Root route is missing CatchError()`);
+        this.route = new RouteLeaf(module, []);
+    }
+    ingest(path, module, override) {
+        if (!Array.isArray(path)) {
+            path = path.split(/[\./\\]/g);
+        }
+        if (path.length === 0) {
+            this.route = new RouteLeaf(module, override);
+            return;
+        }
+        if (path.length === 1 && path[0] === "_index") {
+            this.default = new RouteLeaf(module, override);
+            return;
+        }
+        if (path[0].endsWith("_")) {
+            path[0] = path[0].slice(0, -1);
+            override.push(true);
+        }
+        else {
+            override.push(false);
+        }
+        if (path[0][0] === "$") {
+            const wildCard = path[0].slice(1);
+            // Check wildcard isn't being changed
+            if (!this.wild) {
+                this.wildCard = wildCard;
+                this.wild = new RouteTree();
+            }
+            else if (wildCard !== this.wildCard) {
+                throw new Error(`Redefinition of wild card ${this.wildCard} to ${wildCard}`);
+            }
+            path.splice(0, 1);
+            this.wild.ingest(path, module, override);
+            return;
+        }
+        let next = this.nested.get(path[0]);
+        if (!next) {
+            next = new RouteTree();
+            this.nested.set(path[0], next);
+        }
+        path.splice(0, 1);
+        next.ingest(path, module, override);
+    }
+    render(req, res, url) {
+        const args = new shared_1.RenderArgs(req, res, url);
+        if (!this.default || !this.default.module.Render) {
+            return "";
+        }
+        const frags = url.pathname.split('/').slice(1);
+        if (frags.length === 1 && frags[0] === "") {
+            frags.splice(0, 1);
+        }
+        return this._recursiveRender(args, frags).outlet();
+    }
+    _recursiveRender(args, frags) {
+        var _a;
+        let out = {
+            outlet: blankOutlet,
+            mask: [],
+        };
+        if (frags.length == 0) {
+            if (!this.default) {
+                out.outlet = () => {
+                    throw new shared_1.ErrorResponse(404, "Resource Not Found", `Unable to find ${args.url.pathname}`);
+                };
+            }
+            else if ((_a = this.default) === null || _a === void 0 ? void 0 : _a.module.Render) {
+                out.outlet = this.default.makeOutlet(args, out.outlet);
+                out.mask = [...this.default.mask];
+            }
+        }
+        else {
+            const segment = frags.splice(0, 1)[0];
+            const subRoute = this.nested.get(segment);
+            if (subRoute) {
+                out = subRoute._recursiveRender(args, frags);
+            }
+            else if (this.wild) {
+                args.params[this.wildCard] = segment;
+                out = this.wild._recursiveRender(args, frags);
+            }
+            else {
+                out.outlet = () => {
+                    throw new shared_1.ErrorResponse(404, "Resource Not Found", `Unable to find ${args.url.pathname}`);
+                };
+            }
+        }
+        // Is this route masked out?
+        const ignored = out.mask.splice(0, 1)[0] === true;
+        if (!ignored && this.route) {
+            out.outlet = this.route.makeOutlet(args, out.outlet);
+        }
+        return out;
+    }
+}
+exports.RouteTree = RouteTree;

package/bin/shared.d.ts

@@ -0,0 +1,40 @@
+/// <reference types="node" />
+import type http from "node:http";
+export type Outlet = () => Promise<string>;
+export type RenderFunction = (args: RenderArgs, Outlet: Outlet) => Promise<string>;
+export type CatchFunction = (args: RenderArgs, err: ErrorResponse) => Promise<string>;
+export type RouteModule = {
+    Render?: RenderFunction;
+    CatchError?: CatchFunction;
+};
+export declare class ErrorResponse {
+    code: number;
+    status: string;
+    data: any;
+    constructor(statusCode: number, statusMessage: string, data?: any);
+}
+export declare class Redirect {
+    location: string;
+    constructor(location: string);
+    run(res: http.ServerResponse): http.ServerResponse<http.IncomingMessage>;
+}
+export declare class Override {
+    data: BufferSource;
+    constructor(data: BufferSource);
+}
+type MetaHTML = {
+    [key: string]: string;
+};
+export declare class RenderArgs {
+    req: http.IncomingMessage;
+    res: http.ServerResponse;
+    params: MetaHTML;
+    url: URL;
+    links: MetaHTML[];
+    meta: MetaHTML[];
+    constructor(req: http.IncomingMessage, res: http.ServerResponse, url: URL);
+    addLinks(links: MetaHTML[], override?: boolean): void;
+    addMeta(links: MetaHTML[], override?: boolean): void;
+    renderHeadHTML(): string;
+}
+export {};

package/bin/shared.js

@@ -0,0 +1,92 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RenderArgs = exports.Override = exports.Redirect = exports.ErrorResponse = void 0;
+class ErrorResponse {
+    constructor(statusCode, statusMessage, data) {
+        this.code = statusCode;
+        this.status = statusMessage;
+        this.data = data || "";
+    }
+}
+exports.ErrorResponse = ErrorResponse;
+class Redirect {
+    constructor(location) {
+        this.location = location;
+    }
+    run(res) {
+        res.statusCode = 302;
+        res.setHeader('Location', this.location);
+        return res.end();
+    }
+}
+exports.Redirect = Redirect;
+class Override {
+    constructor(data) {
+        this.data = data;
+    }
+}
+exports.Override = Override;
+const attrRegex = /[A-z]+/;
+function ValidateMetaHTML(val) {
+    for (const key in val) {
+        if (!attrRegex.test(key))
+            return false;
+    }
+    return true;
+}
+function ValidateMetaHTMLs(val) {
+    for (const meta of val) {
+        if (!ValidateMetaHTML(meta))
+            return false;
+    }
+    return true;
+}
+class RenderArgs {
+    constructor(req, res, url) {
+        this.req = req;
+        this.res = res;
+        this.url = url;
+        this.params = {};
+        this.links = [];
+        this.meta = [];
+    }
+    addLinks(links, override = false) {
+        if (!ValidateMetaHTMLs(links))
+            throw new Error(`Provided links have invalid attribute`);
+        if (override) {
+            this.links = links;
+        }
+        else {
+            this.links.push(...links);
+        }
+    }
+    addMeta(links, override = false) {
+        if (!ValidateMetaHTMLs(links))
+            throw new Error(`Provided links have invalid attribute`);
+        if (override) {
+            this.meta = links;
+        }
+        else {
+            this.meta.push(...links);
+        }
+    }
+    renderHeadHTML() {
+        let out = "";
+        for (const elm of this.links) {
+            out += "<link";
+            for (const attr in elm) {
+                out += ` ${attr}="${elm[attr].replace(/"/g, "\\\"")}"`;
+            }
+            out += "></link>";
+        }
+        for (const elm of this.meta) {
+            out += "<meta";
+            for (const attr in elm) {
+                out += ` ${attr}="${elm[attr].replace(/"/g, "\\\"")}"`;
+            }
+            out += "></meta>";
+        }
+        return out;
+    }
+}
+exports.RenderArgs = RenderArgs;

package/package.json

@@ -0,0 +1,27 @@
+{
+	"name": "htmx-router",
+	"version": "0.0.1",
+	"description": "A remix.js style file path router for htmX websites",
+	"main": "./bin/index.js",
+	"scripts": {
+		"build": "tsc"
+	},
+	"bin": {
+		"htmx-router": "bin/cli.js"
+	},
+	"repository": {
+		"type": "git",
+		"url": "git+https://github.com/AjaniBilby/htmx-router.git"
+	},
+	"author": "Ajani Bilby",
+	"license": "MIT",
+	"bugs": {
+		"url": "https://github.com/AjaniBilby/htmx-router/issues"
+	},
+	"homepage": "https://github.com/AjaniBilby/htmx-router#readme",
+	"devDependencies": {
+		"@types/node": "^20.4.5",
+		"ts-node": "^10.9.1",
+		"typescript": "^5.1.6"
+	}
+}

package/readme.md

@@ -0,0 +1,6 @@
+# htmX Router
+
+> A remix.js style file path router for htmX websites
+
+
+*Documentation coming soon*