@spirobel/mininext 0.7.6 → 0.8.0

package/dist/frontend/miniresolve.js

@@ -0,0 +1,143 @@
+import { getCacheEntry, getResolvedMiniHtmlStringThrows, } from "../minicache";
+import { resolveMiniValue, } from "../mininext";
+import { isInside, render } from "./minirender";
+export function resolveMiniHtmlString(stringLiterals, unresolvedValues, mini, slots) {
+    const resolvedValues = [];
+    let index = 0;
+    for (const unresolvedValue of unresolvedValues) {
+        const slotId = slots[index];
+        if (!slotId)
+            throw new Error(`Could not find slot id for ${unresolvedValue}`);
+        resolvedValues.push(resolveMiniValue(unresolvedValue, mini, slotId));
+        index++;
+    }
+    return {
+        slots,
+        stringLiterals,
+        values: resolvedValues,
+        render: (target, cacheAndCursor) => {
+            if (!cacheAndCursor)
+                cacheAndCursor = mini.cacheAndCursor; //and cache here
+            return render(target, cacheAndCursor);
+        },
+    };
+}
+export function resolveValuesForCache(unresolvedValues, cac, slots = null) {
+    if (!slots)
+        slots = unresolvedValues.map(() => crypto.randomUUID());
+    const values = unresolvedValues.map((value, index) => {
+        const childId = slots[index];
+        if (!childId)
+            throw new Error("Could not find slot id for value");
+        // CASE: primitive
+        if (typeof value === "string" || typeof value === "number") {
+            const cacheEntry = cac.cache.get(childId);
+            if (cacheEntry) {
+                if (cacheEntry.value === value)
+                    return value;
+                cacheEntry.value = value;
+                cacheEntry.dirty = true;
+                return value;
+            }
+            cac.cache.set(childId, { value, dirty: true });
+            return value;
+        }
+        // CASE: child mini htmlstring or component
+        return { childId };
+    });
+    return { slots, values };
+}
+export function resolve(stringLiterals, unresolvedValues, mini) {
+    // CASE our cache entry does not exist yet
+    const cac = mini.cacheAndCursor;
+    const cacheEntry = getCacheEntry(cac);
+    if (!cacheEntry) {
+        const { slots, values } = resolveValuesForCache(unresolvedValues, cac);
+        cac.cache.set(cac.cursor, {
+            value: { stringLiterals, values, slots, state: null },
+            dirty: true,
+        });
+    }
+    else if (cacheEntry && typeof cacheEntry.value !== "object") {
+        const { slots, values } = resolveValuesForCache(unresolvedValues, cac);
+        cacheEntry.dirty = true;
+        cacheEntry.value = {
+            stringLiterals,
+            values,
+            slots,
+            state: null,
+        };
+    }
+    else {
+        const cacheValue = getResolvedMiniHtmlStringThrows(cac);
+        const htmlUnchanged = arraysEqual(stringLiterals, cacheValue.stringLiterals || []);
+        const styleOrTagContentChanged = parametricHtmlChanges(stringLiterals, cacheValue.values, unresolvedValues);
+        const { slots, values } = resolveValuesForCache(unresolvedValues, cac, htmlUnchanged
+            ? cacheValue.slots
+            : unresolvedValues.map(() => crypto.randomUUID()));
+        if (!htmlUnchanged || styleOrTagContentChanged) {
+            //recursively delete all children
+            deleteAllChildren(cac);
+            cacheValue.stringLiterals = stringLiterals;
+            cacheValue.slots = slots;
+            cacheEntry.dirty = true;
+        }
+        cacheValue.values = values;
+    }
+    // at this point we know the cache entry exists
+    const cacheValue = getResolvedMiniHtmlStringThrows(cac);
+    const slots = cacheValue.slots;
+    // we also know slots exist
+    if (!slots)
+        throw new Error("slots not found");
+    return resolveMiniHtmlString(stringLiterals, unresolvedValues, mini, slots);
+}
+function deleteAllChildren(cac, last = true) {
+    const cacheEntry = getCacheEntry(cac);
+    if (!cacheEntry)
+        return;
+    if (typeof cacheEntry.value !== "object") {
+        cac.cache.delete(cac.cursor); // leaf primitive value
+        return;
+    }
+    const cacheValue = getResolvedMiniHtmlStringThrows(cac);
+    if (!cacheValue.slots) {
+        // when attaching state we have a placeholder cache entry with slots null
+        return;
+    }
+    for (const child of cacheValue.slots) {
+        deleteAllChildren({ ...cac, cursor: child }, false); // delete all children
+    }
+    if (last)
+        return; // dont delete the node that called this
+    cac.cache.delete(cac.cursor); // delete intermediate nodes
+}
+function arraysEqual(arr1, arr2) {
+    if (arr1.length !== arr2.length)
+        return false;
+    return arr1.every((str, index) => str === arr2[index]);
+}
+export function parametricHtmlChanges(stringLiterals, cached_values, values) {
+    const inside = {
+        element: false,
+        singleQuotes: false,
+        doubleQuotes: false,
+        lastElement: "",
+    };
+    let index = 0;
+    for (const literal of stringLiterals) {
+        isInside(literal, inside);
+        if (inside.element || inside.lastElement.trim().endsWith("<style")) {
+            const oldValue = cached_values ? cached_values[index] : undefined;
+            const newValue = values[index];
+            if (oldValue !== newValue)
+                return true;
+            if (typeof oldValue === "undefined")
+                return true;
+            if (typeof newValue === "undefined")
+                return true;
+        }
+        index++;
+    }
+    return false;
+}

package/dist/frontend/minirouter.d.ts

@@ -0,0 +1,18 @@
+import type { Mini, MiniHtmlString } from "../mininext";
+export type ExtractRouteParam<Path extends string> = Path extends `:${infer Param}/${infer Rest}` ? Param | ExtractRouteParam<Rest> : Path extends `:${infer Param}` ? Param : Path extends `${infer Prefix}/*` ? ExtractRouteParam<Prefix> | "*" : Path extends `${infer _Prefix}/${infer Rest}` ? ExtractRouteParam<Rest> : never;
+export type Params<Path extends string> = {
+    [Param in ExtractRouteParam<Path>]: string;
+};
+export type Handler<Path extends string = string> = (params: Params<Path>, mini: Mini) => MiniHtmlString;
+export type RoutePaths<RoutesObj> = {
+    [K in keyof RoutesObj]: K extends string ? K extends `/${string}` | "/*" ? K : never : never;
+}[keyof RoutesObj];
+export type TypedRouter<TRoutes extends Record<string, any>> = {
+    component: (mini: Mini) => MiniHtmlString;
+    navigate(path: string): void;
+    navigate<Path extends RoutePaths<TRoutes>>(path: Path, params: Params<Path>): void;
+    link(path: string): string;
+    link<Path extends RoutePaths<TRoutes>>(path: Path, params: Params<Path>): string;
+    getCurrentPath(): string;
+};
+export declare function createRouter<const TRoutes extends Record<string, Handler<any>>>(routes: TRoutes): TypedRouter<TRoutes>;

package/dist/frontend/minirouter.js

@@ -0,0 +1,107 @@
+export function createRouter(routes) {
+    let currentPath = "";
+    function matchRoute(path) {
+        const routeKeys = Object.keys(routes);
+        // Exact matches first
+        for (const key of routeKeys) {
+            const template = String(key);
+            const match = pathMatch(template, path);
+            if (match) {
+                return {
+                    handler: routes[key],
+                    params: match.params,
+                    routeKey: template,
+                };
+            }
+        }
+        // Wildcard routes ending with /*
+        for (const key of routeKeys) {
+            const template = String(key);
+            if (template.endsWith("/*")) {
+                const prefix = template.slice(0, -2);
+                const match = pathMatch(prefix, path, true);
+                if (match) {
+                    const params = match.params;
+                    params["*"] = match.rest ?? "";
+                    return { handler: routes[key], params, routeKey: template };
+                }
+            }
+        }
+        return null;
+    }
+    function pathMatch(template, path, isPrefix = false) {
+        const templateParts = template.split("/").filter(Boolean);
+        const pathParts = path.split("/").filter(Boolean);
+        if (!isPrefix && templateParts.length !== pathParts.length)
+            return null;
+        if (pathParts.length < templateParts.length)
+            return null;
+        const params = {};
+        for (let i = 0; i < templateParts.length; i++) {
+            const part = templateParts[i];
+            if (part.startsWith(":")) {
+                params[part.slice(1)] = pathParts[i];
+            }
+            else if (part !== pathParts[i]) {
+                return null;
+            }
+        }
+        let rest = "";
+        if (isPrefix && pathParts.length > templateParts.length) {
+            rest = "/" + pathParts.slice(templateParts.length).join("/");
+        }
+        return { params, rest };
+    }
+    function buildPath(template, params) {
+        let base = template;
+        let append = "";
+        if (template.endsWith("/*")) {
+            base = template.slice(0, -2);
+            const wildcardValue = params["*"];
+            if (wildcardValue !== undefined) {
+                append = wildcardValue.startsWith("/")
+                    ? wildcardValue
+                    : "/" + wildcardValue;
+            }
+        }
+        return (base.replace(/:(\w+)/g, (_, param) => {
+            const value = params[param];
+            if (value === undefined) {
+                throw new Error(`Missing param: ${param}`);
+            }
+            return value;
+        }) + append);
+    }
+    function link(pathOrTemplate, params) {
+        let finalPath;
+        if (params && typeof pathOrTemplate === "string") {
+            finalPath = buildPath(pathOrTemplate, params);
+        }
+        else {
+            finalPath = pathOrTemplate;
+        }
+        const result = finalPath.startsWith("/") ? finalPath : "/" + finalPath;
+        return result.startsWith("#") ? result : "#" + result;
+    }
+    return {
+        component(mini) {
+            const path = window.location.hash;
+            const cleanPath = path === "#" || path === "" ? "/" : path.slice(1);
+            currentPath = cleanPath;
+            const match = matchRoute(cleanPath);
+            if (match) {
+                const handler = match.handler;
+                const params = match.params;
+                return handler(params, mini);
+            }
+            throw new Error("no url matched");
+        },
+        navigate: function (pathOrTemplate, params) {
+            window.location.hash = link(pathOrTemplate, params);
+        },
+        link,
+        getCurrentPath() {
+            return currentPath;
+        },
+    };
+}

package/dist/minicache.d.ts

@@ -0,0 +1,26 @@
+import type { PrimitiveValue, StateObject, StringArray } from "./mininext";
+export declare function getCacheEntry(cacheAndCursor: CacheAndCursor): CacheObject | undefined;
+export declare function getCacheEntryThrows(cacheAndCursor: CacheAndCursor): CacheObject;
+export declare function getResolvedMiniHtmlStringThrows(cacheAndCursor: CacheAndCursor): ResolvedMiniCacheHtmlString;
+export declare function state<T>(name: string, value: T, cacheAndCursor: CacheAndCursor, global?: boolean): StateObject<T>;
+export type CacheValue = PrimitiveValue | ResolvedMiniCacheHtmlString;
+export type CacheObject = {
+    el?: HTMLElement;
+    value: CacheValue;
+    dirty: boolean;
+};
+export type MiniCache = Map<string, CacheObject>;
+export type CacheAndCursor = {
+    cache: MiniCache;
+    cursor: string;
+};
+export type ResolvedMiniCacheHtmlString = {
+    stringLiterals: StringArray | null;
+    values: ResolvedMiniCacheValue[] | null;
+    slots: string[] | null;
+    state: StateObject[] | null;
+};
+export type ResolvedMiniCacheValue = PrimitiveValue | ResolvedMiniChildHtmlString;
+export type ResolvedMiniChildHtmlString = {
+    childId: string;
+};

package/dist/minicache.js

@@ -0,0 +1,44 @@
+export function getCacheEntry(cacheAndCursor) {
+    return cacheAndCursor.cache.get(cacheAndCursor.cursor);
+}
+export function getCacheEntryThrows(cacheAndCursor) {
+    const entry = getCacheEntry(cacheAndCursor);
+    if (!entry)
+        throw new Error(`Could not find cache entry for cursor ${cacheAndCursor.cursor}`);
+    return entry;
+}
+export function getResolvedMiniHtmlStringThrows(cacheAndCursor) {
+    const cacheEntry = getCacheEntryThrows(cacheAndCursor);
+    if (typeof cacheEntry.value !== "object")
+        throw new Error(`the result is a primitive value, we expected a ResolvedMiniCacheHtmlString. ${JSON.stringify(cacheEntry)}`);
+    return cacheEntry.value;
+}
+export function state(name, value, cacheAndCursor, global) {
+    const localCac = { ...cacheAndCursor };
+    if (global)
+        localCac.cursor = "global";
+    let cacheEntry = getCacheEntry(localCac);
+    if (!cacheEntry) {
+        cacheAndCursor.cache.set(localCac.cursor, {
+            value: {
+                stringLiterals: null,
+                values: null,
+                slots: null,
+                state: [],
+            },
+            dirty: true,
+        });
+        cacheEntry = getCacheEntryThrows(localCac);
+    }
+    const cacheValue = getResolvedMiniHtmlStringThrows(localCac);
+    if (!cacheValue.state)
+        cacheValue.state = [];
+    const stateObjects = cacheValue.state;
+    const stateObject = stateObjects.find((stateObject) => stateObject.name === name);
+    if (stateObject)
+        return stateObject; //CASE: state already exists
+    const newStateObject = { value, name };
+    stateObjects.push(newStateObject);
+    cacheEntry.dirty = true; // we want to dirty the cache in any case, not just if cache entry did not exist yet
+    return newStateObject;
+}

package/dist/mininext.d.ts

@@ -1,22 +1,41 @@
-/// <reference types="bun-types" />
-/// <reference types="bun-types" />
-/// <reference types="bun-types" />
-/// <reference types="bun-types" />
-/// <reference types="bun-types" />
-/// <reference types="bun-types" />
-/// <reference types="bun-types" />
-/// <reference types="bun-types" />
-import { url, Mini, has, type HtmlHandler } from "./url";
-import { isError, HtmlString, BasedHtml, head, commonHead, cssReset, basedHtml as html } from "./html";
-import { type Server, type WebSocketHandler } from "bun";
-declare global {
-    var PROJECT_ROOT: string | undefined;
-}
-declare function build(backendPath?: string): Promise<0 | undefined>;
-declare const standardDevReloader: BasedHtml;
-declare function makeEntrypoint(): Promise<{
-    fetch: (req: Request, server: Server) => Promise<Response>;
-    websocket: WebSocketHandler;
-}>;
-export declare function getCallerFilePath(): string;
-export { has, html, url, head, build, makeEntrypoint, isError, BasedHtml, HtmlString, type HtmlHandler, Mini, standardDevReloader, commonHead, cssReset, };
+import { type CacheAndCursor } from "./minicache";
+import { type Skeleton } from "./backend/html";
+export { renderRoot } from "./frontend/minidom";
+export { createRouter, type Params } from "./frontend/minirouter";
+export declare const isBackend: boolean;
+export type PrimitiveValue = string | number | null;
+export type MiniHtmlString = {
+    stringLiterals: TemplateStringsArray;
+    values: MiniValue[];
+    resolve(mini?: Mini): ResolvedMiniHtmlString;
+    build(mini?: Mini, root?: string, config?: Bun.BuildConfig): Promise<Skeleton>;
+    renderBackend(mini?: Mini): string;
+};
+export type MiniComponent = (mini: Mini) => MiniHtmlString;
+export type MiniValue = PrimitiveValue | MiniComponent | MiniHtmlString;
+export type StateObject<T = unknown> = {
+    value: T;
+    name: string;
+};
+export type Mini = {
+    html: typeof html;
+    state: <T>(name: string, value: T, global?: boolean) => StateObject<T>;
+    cacheAndCursor: CacheAndCursor;
+    flatten(htmlStringArray: MiniHtmlString[], flattenRootFn?: (htmlstrings: MiniHtmlString) => MiniHtmlString): MiniHtmlString;
+    fill(...args: MiniValue[]): Blob;
+};
+export declare function html(stringLiterals: TemplateStringsArray, ...values: MiniValue[]): MiniHtmlString;
+export declare function constructMiniHtmlString(stringLiterals: TemplateStringsArray, values: MiniValue[]): MiniHtmlString;
+export declare function makeNewMini(cac: CacheAndCursor): Mini;
+export declare function standardFlattenRoot(htmlstrings: MiniHtmlString): MiniHtmlString;
+export declare function flatten(htmlStringArray: MiniHtmlString[], flattenRootFn?: typeof standardFlattenRoot): MiniHtmlString;
+export declare function flattenValues(miniHtmlString: MiniHtmlString): MiniHtmlString;
+export declare function resolveMiniValue(value: MiniValue, parentMini: Mini, slotId: string): ResolvedMiniValue;
+export type StringArray = string[] | TemplateStringsArray;
+export type ResolvedMiniHtmlString = {
+    stringLiterals: StringArray;
+    values: ResolvedMiniValue[];
+    slots: string[];
+    render: (target: Element | HTMLElement, cacheAndCursor?: CacheAndCursor) => CacheAndCursor;
+};
+export type ResolvedMiniValue = PrimitiveValue | ResolvedMiniHtmlString;