@spirobel/mininext 0.2.27 → 0.3.1

package/dist/html.d.ts

@@ -54,5 +54,20 @@ export declare function isError(submissionResult: any | {
     error: HtmlString;
 };
 declare global {
-    var Reloader: HtmlString | undefined;
+    var Reloader: BasedHtml | HtmlString | undefined;
 }
+/**
+ * The difference between this and HtmlString is that it is fully resolved and only accepts primitive types.
+ * In plain english this means:
+ * It does not accept functions (that will be resolved at request time with (mini)=>mini.html) like mini.html does.
+ */
+export declare class BasedHtml extends String {
+}
+export type BasedHtmlValues = number | string | undefined | null | boolean | BasedHtml | BasedHtml[];
+/**
+ * The difference between this and HtmlString is that it is fully resolved and only accepts primitive types.
+ * @param strings - html literals
+ * @param values - values will get escaped to prevent xss
+ * @returns
+ */
+export declare const basedHtml: (strings: TemplateStringsArray, ...values: BasedHtmlValues[]) => BasedHtml;

package/dist/html.js

@@ -245,3 +245,35 @@ export async function htmlResponder(mini, maybeUnresolved, head = default_head,
 export function isError(submissionResult) {
     return ("error" in submissionResult && submissionResult.error instanceof HtmlString);
 }
+/**
+ * The difference between this and HtmlString is that it is fully resolved and only accepts primitive types.
+ * In plain english this means:
+ * It does not accept functions (that will be resolved at request time with (mini)=>mini.html) like mini.html does.
+ */
+export class BasedHtml extends String {
+}
+//TODO make it so we can embed BasedHtml into mini.html partially resolved html strings
+/**
+ * The difference between this and HtmlString is that it is fully resolved and only accepts primitive types.
+ * @param strings - html literals
+ * @param values - values will get escaped to prevent xss
+ * @returns
+ */
+export const basedHtml = (strings, ...values) => {
+    // Apply escapeHtml to each value before using them in the template string
+    // In case it didn't already get escaped
+    for (const [index, value] of values.entries()) {
+        // we can pass arrays of BasedHtml and they will get flattened automatically
+        if (Array.isArray(value) &&
+            value.every((val) => val instanceof BasedHtml)) {
+            // If the value is an array of BasedHtml objects, flatten it and add to ...values
+            values[index] = value.join("");
+        }
+        else if (!(value instanceof BasedHtml)) {
+            const notEmpty = value || "";
+            // values will be escaped by default
+            values[index] = Bun.escapeHTML(notEmpty + "");
+        }
+    }
+    return new BasedHtml(String.raw({ raw: strings }, ...values));
+};

package/dist/mininext.d.ts

@@ -1,9 +1,15 @@
+/// <reference types="bun-types" />
+/// <reference types="bun-types" />
 import { url, Mini, type HtmlHandler } from "./url";
-import { isError, HtmlString, head, commonHead, cssReset } from "./html";
+import { isError, HtmlString, BasedHtml, head, commonHead, cssReset, basedHtml as html } from "./html";
+import type { Server, WebSocketHandler } from "bun";
 declare global {
     var PROJECT_ROOT: string | undefined;
 }
 declare function build(backendPath?: string): Promise<void>;
-declare const standardDevReloader: HtmlString;
-declare function makeEntrypoint(): Promise<(w: any) => Promise<Response>>;
-export { url, head, build, makeEntrypoint, isError, HtmlString, type HtmlHandler, Mini, standardDevReloader, commonHead, cssReset, };
+declare const standardDevReloader: BasedHtml;
+declare function makeEntrypoint(): Promise<{
+    fetch: (req: Request, server: Server) => Promise<Response>;
+    websocket: WebSocketHandler;
+}>;
+export { html, url, head, build, makeEntrypoint, isError, BasedHtml, HtmlString, type HtmlHandler, Mini, standardDevReloader, commonHead, cssReset, };

package/dist/mininext.js

@@ -1,5 +1,5 @@
 import { url, Mini } from "./url";
-import { html, isError, HtmlString, head, commonHead, cssReset } from "./html";
+import { isError, HtmlString, BasedHtml, head, commonHead, cssReset, basedHtml as html, } from "./html";
 import { watch } from "fs/promises";
 import * as path from "path";
 function projectRoot() {
@@ -156,6 +156,6 @@ async function makeEntrypoint() {
         // @ts-ignore
         module = await import(backendImportPath);
     }
-    return module.default;
+    return module.default();
 }
-export { url, head, build, makeEntrypoint, isError, HtmlString, Mini, standardDevReloader, commonHead, cssReset, };
+export { html, url, head, build, makeEntrypoint, isError, BasedHtml, HtmlString, Mini, standardDevReloader, commonHead, cssReset, };

package/dist/url.d.ts

@@ -1,3 +1,6 @@
+/// <reference types="bun-types" />
+/// <reference types="bun-types" />
+import type { Server, WebSocketHandler } from "bun";
 import { html, json, dangerjson, HtmlString } from "./html";
 import type { DangerJsonInHtml, JsonString, JsonStringValues } from "./html";
 export type Form = {
@@ -68,6 +71,8 @@ interface LinkSettings {
     [key: string]: string | null | undefined;
 }
 export declare class url {
+    static websocket: WebSocketHandler | undefined;
+    static server: Server;
     static direct_handlers_html: ReadonlyMap<string, HtmlHandler>;
     private static frontends;
     private static svgs;
@@ -146,7 +151,7 @@ export declare class url {
      * @param handler - normal html handler with mini as the argument
      * @returns a wrapped html handler that will only be called when the request is post
      */
-    static post<Y = unknown>(handler: HtmlHandler<Y>): (mini: Mini<Y>) => LazyHandlerReturnType;
+    static post(handler: HtmlHandler): (mini: Mini) => LazyHandlerReturnType;
     /**
      * wrap your handlers in this if you mutate something to prevent CSRF issues.
      * @param handler - normal html handler with mini as the argument
@@ -183,11 +188,19 @@ export declare class url {
      */
     static get(Url: string): string;
     static match(req: Request, reqPath?: string): Promise<Response | undefined>;
+    /**
+     * user this to set the Websocket object. Check out [the bun docs](https://bun.sh/docs/api/websockets) for more details.
+     * @param wsObject the websocketsocket object {@link WebSocketHandler}
+     */
+    static setWebsocket<T = undefined>(wsObject: WebSocketHandler<T>): void;
     /**
      * Fetch handler that is called by the server when a request is made to any of the urls.
      * @param {Request} req - The Request object.
      * @return {Promise<Response>} - The Response object.
      */
-    static install(req: Request): Promise<Response>;
+    static install(): {
+        fetch: (req: Request, server: Server) => Promise<Response>;
+        websocket: WebSocketHandler<undefined> | undefined;
+    };
 }
 export {};

package/dist/url.js

@@ -47,6 +47,8 @@ export class Mini {
     }
 }
 export class url {
+    static websocket = undefined;
+    static server;
     // direct mapping of "url string" -> function leads to Html Response
     static direct_handlers_html;
     // An array of the uncompiled frontend files, example frontends[0] = "index.tsx" -> frontend/index.tsx (from the project root)
@@ -386,29 +388,41 @@ export class url {
             return htmlResponder(mini, unresolved, handlerHead, handlerOptions);
         }
     }
+    /**
+     * user this to set the Websocket object. Check out [the bun docs](https://bun.sh/docs/api/websockets) for more details.
+     * @param wsObject the websocketsocket object {@link WebSocketHandler}
+     */
+    static setWebsocket(wsObject) {
+        url.websocket = wsObject;
+    }
     /**
      * Fetch handler that is called by the server when a request is made to any of the urls.
      * @param {Request} req - The Request object.
      * @return {Promise<Response>} - The Response object.
      */
-    static async install(req) {
-        //go through all the Htmlhandlers and see if there is a match
-        let res = await url.match(req);
-        if (res)
-            return res;
-        //handle frontend js file serving
-        res = url.serveFrontend(req);
-        if (res)
-            return res;
-        //handle svg file serving
-        res = url.serveSvg(req);
-        if (res)
-            return res;
-        // go through all the Htmlhandlers again with added slash at the end.
-        res = await url.match(req, new URL(req.url).pathname + "/");
-        if (res)
-            return res;
-        return new Response("No matching url found", { status: 404 });
+    static install() {
+        async function fetchFunction(req, server) {
+            if (!url.server)
+                url.server = server;
+            //go through all the Htmlhandlers and see if there is a match
+            let res = await url.match(req);
+            if (res)
+                return res;
+            //handle frontend js file serving
+            res = url.serveFrontend(req);
+            if (res)
+                return res;
+            //handle svg file serving
+            res = url.serveSvg(req);
+            if (res)
+                return res;
+            // go through all the Htmlhandlers again with added slash at the end.
+            res = await url.match(req, new URL(req.url).pathname + "/");
+            if (res)
+                return res;
+            return new Response("No matching url found", { status: 404 });
+        }
+        return { fetch: fetchFunction, websocket: url.websocket };
     }
 }
 const no_post_warning = html `<div style="color:red;">

package/mininext/html.ts

@@ -295,5 +295,48 @@ export function isError(
 }
 
 declare global {
-  var Reloader: HtmlString | undefined;
+  var Reloader: BasedHtml | HtmlString | undefined;
 }
+/**
+ * The difference between this and HtmlString is that it is fully resolved and only accepts primitive types.
+ * In plain english this means:
+ * It does not accept functions (that will be resolved at request time with (mini)=>mini.html) like mini.html does.
+ */
+export class BasedHtml extends String {}
+export type BasedHtmlValues =
+  | number
+  | string
+  | undefined
+  | null
+  | boolean
+  | BasedHtml
+  | BasedHtml[];
+//TODO make it so we can embed BasedHtml into mini.html partially resolved html strings
+/**
+ * The difference between this and HtmlString is that it is fully resolved and only accepts primitive types.
+ * @param strings - html literals
+ * @param values - values will get escaped to prevent xss
+ * @returns
+ */
+export const basedHtml = (
+  strings: TemplateStringsArray,
+  ...values: BasedHtmlValues[]
+) => {
+  // Apply escapeHtml to each value before using them in the template string
+  // In case it didn't already get escaped
+  for (const [index, value] of values.entries()) {
+    // we can pass arrays of BasedHtml and they will get flattened automatically
+    if (
+      Array.isArray(value) &&
+      value.every((val) => val instanceof BasedHtml)
+    ) {
+      // If the value is an array of BasedHtml objects, flatten it and add to ...values
+      values[index] = value.join("");
+    } else if (!(value instanceof BasedHtml)) {
+      const notEmpty = value || "";
+      // values will be escaped by default
+      values[index] = Bun.escapeHTML(notEmpty + "");
+    }
+  }
+  return new BasedHtml(String.raw({ raw: strings }, ...values));
+};

package/mininext/mininext.ts

@@ -1,5 +1,14 @@
 import { url, Mini, type HtmlHandler } from "./url";
-import { html, isError, HtmlString, head, commonHead, cssReset } from "./html";
+import {
+  isError,
+  HtmlString,
+  BasedHtml,
+  head,
+  commonHead,
+  cssReset,
+  basedHtml as html,
+} from "./html";
+import type { BunPlugin, Server, WebSocketHandler } from "bun";
 import { watch } from "fs/promises";
 import * as path from "path";
 function projectRoot() {
@@ -14,7 +23,6 @@ async function build(backendPath: string = "backend/backend.ts") {
     await devServer();
   }
 }
-import type { BunPlugin } from "bun";
 
 const myPlugin: BunPlugin = {
   name: "node buffer in the frontend",
@@ -168,14 +176,19 @@ async function makeEntrypoint() {
     // @ts-ignore
     module = await import(backendImportPath);
   }
-  return module.default as (w: any) => Promise<Response>;
+  return module.default() as {
+    fetch: (req: Request, server: Server) => Promise<Response>;
+    websocket: WebSocketHandler;
+  };
 }
 export {
+  html,
   url,
   head,
   build,
   makeEntrypoint,
   isError,
+  BasedHtml,
   HtmlString,
   type HtmlHandler,
   Mini,

package/mininext/url.ts

@@ -1,3 +1,4 @@
+import type { Server, WebSocketHandler } from "bun";
 import { htmlResponder, html, json, dangerjson, HtmlString } from "./html";
 import type { DangerJsonInHtml, JsonString, JsonStringValues } from "./html";
 export type Form = {
@@ -116,6 +117,9 @@ interface LinkSettings {
   [key: string]: string | null | undefined;
 }
 export class url {
+  static websocket: WebSocketHandler | undefined = undefined;
+  static server: Server;
+
   // direct mapping of "url string" -> function leads to Html Response
   static direct_handlers_html: ReadonlyMap<string, HtmlHandler>;
 
@@ -272,8 +276,8 @@ export class url {
    * @param handler - normal html handler with mini as the argument
    * @returns a wrapped html handler that will only be called when the request is post
    */
-  static post<Y = unknown>(handler: HtmlHandler<Y>) {
-    return (mini: Mini<Y>) => {
+  static post(handler: HtmlHandler) {
+    return (mini: Mini) => {
       if (mini.form.post) {
         return handler(mini);
       } else {
@@ -486,28 +490,39 @@ export class url {
       return htmlResponder(mini, unresolved, handlerHead, handlerOptions);
     }
   }
+  /**
+   * user this to set the Websocket object. Check out [the bun docs](https://bun.sh/docs/api/websockets) for more details.
+   * @param wsObject the websocketsocket object {@link WebSocketHandler}
+   */
+  static setWebsocket<T = undefined>(wsObject: WebSocketHandler<T>) {
+    url.websocket = wsObject as WebSocketHandler;
+  }
 
   /**
    * Fetch handler that is called by the server when a request is made to any of the urls.
    * @param {Request} req - The Request object.
    * @return {Promise<Response>} - The Response object.
    */
-  static async install(req: Request) {
-    //go through all the Htmlhandlers and see if there is a match
-    let res = await url.match(req);
-    if (res) return res;
+  static install() {
+    async function fetchFunction(req: Request, server: Server) {
+      if (!url.server) url.server = server;
+      //go through all the Htmlhandlers and see if there is a match
+      let res = await url.match(req);
+      if (res) return res;
 
-    //handle frontend js file serving
-    res = url.serveFrontend(req);
-    if (res) return res;
-    //handle svg file serving
-    res = url.serveSvg(req);
-    if (res) return res;
-    // go through all the Htmlhandlers again with added slash at the end.
-    res = await url.match(req, new URL(req.url).pathname + "/");
-    if (res) return res;
+      //handle frontend js file serving
+      res = url.serveFrontend(req);
+      if (res) return res;
+      //handle svg file serving
+      res = url.serveSvg(req);
+      if (res) return res;
+      // go through all the Htmlhandlers again with added slash at the end.
+      res = await url.match(req, new URL(req.url).pathname + "/");
+      if (res) return res;
 
-    return new Response("No matching url found", { status: 404 });
+      return new Response("No matching url found", { status: 404 });
+    }
+    return { fetch: fetchFunction, websocket: url.websocket };
   }
 }
 

package/package.json

@@ -12,7 +12,7 @@
 
   },
   "files": ["dist", "mininext"],
-  "version": "0.2.27",
+  "version": "0.3.1",
   "devDependencies": {
     "@types/bun": "latest"
   },