@hyperspan/framework 0.1.5 → 0.1.6

package/build.ts

@@ -1,5 +1,4 @@
 import {build} from 'bun';
-import dts from 'bun-plugin-dts';
 
 const entrypoints = ['./src/server.ts', './src/assets.ts'];
 const external = ['@hyperspan/html'];
@@ -7,23 +6,11 @@ const outdir = './dist';
 const target = 'node';
 const splitting = true;
 
-await Promise.all([
-  // Build JS
-  build({
-    entrypoints,
-    external,
-    outdir,
-    target,
-    splitting,
-  }),
-
-  // Build type files for TypeScript
-  build({
-    entrypoints,
-    external,
-    outdir,
-    target,
-    splitting,
-    plugins: [dts()],
-  }),
-]);
+// Build JS
+await build({
+  entrypoints,
+  external,
+  outdir,
+  target,
+  splitting,
+});

package/dist/assets.js

@@ -1,145 +1,10 @@
 // src/assets.ts
 import { html } from "@hyperspan/html";
-
-// src/clientjs/md5.js
-function md5cycle(x, k) {
-  var a = x[0], b = x[1], c = x[2], d = x[3];
-  a = ff(a, b, c, d, k[0], 7, -680876936);
-  d = ff(d, a, b, c, k[1], 12, -389564586);
-  c = ff(c, d, a, b, k[2], 17, 606105819);
-  b = ff(b, c, d, a, k[3], 22, -1044525330);
-  a = ff(a, b, c, d, k[4], 7, -176418897);
-  d = ff(d, a, b, c, k[5], 12, 1200080426);
-  c = ff(c, d, a, b, k[6], 17, -1473231341);
-  b = ff(b, c, d, a, k[7], 22, -45705983);
-  a = ff(a, b, c, d, k[8], 7, 1770035416);
-  d = ff(d, a, b, c, k[9], 12, -1958414417);
-  c = ff(c, d, a, b, k[10], 17, -42063);
-  b = ff(b, c, d, a, k[11], 22, -1990404162);
-  a = ff(a, b, c, d, k[12], 7, 1804603682);
-  d = ff(d, a, b, c, k[13], 12, -40341101);
-  c = ff(c, d, a, b, k[14], 17, -1502002290);
-  b = ff(b, c, d, a, k[15], 22, 1236535329);
-  a = gg(a, b, c, d, k[1], 5, -165796510);
-  d = gg(d, a, b, c, k[6], 9, -1069501632);
-  c = gg(c, d, a, b, k[11], 14, 643717713);
-  b = gg(b, c, d, a, k[0], 20, -373897302);
-  a = gg(a, b, c, d, k[5], 5, -701558691);
-  d = gg(d, a, b, c, k[10], 9, 38016083);
-  c = gg(c, d, a, b, k[15], 14, -660478335);
-  b = gg(b, c, d, a, k[4], 20, -405537848);
-  a = gg(a, b, c, d, k[9], 5, 568446438);
-  d = gg(d, a, b, c, k[14], 9, -1019803690);
-  c = gg(c, d, a, b, k[3], 14, -187363961);
-  b = gg(b, c, d, a, k[8], 20, 1163531501);
-  a = gg(a, b, c, d, k[13], 5, -1444681467);
-  d = gg(d, a, b, c, k[2], 9, -51403784);
-  c = gg(c, d, a, b, k[7], 14, 1735328473);
-  b = gg(b, c, d, a, k[12], 20, -1926607734);
-  a = hh(a, b, c, d, k[5], 4, -378558);
-  d = hh(d, a, b, c, k[8], 11, -2022574463);
-  c = hh(c, d, a, b, k[11], 16, 1839030562);
-  b = hh(b, c, d, a, k[14], 23, -35309556);
-  a = hh(a, b, c, d, k[1], 4, -1530992060);
-  d = hh(d, a, b, c, k[4], 11, 1272893353);
-  c = hh(c, d, a, b, k[7], 16, -155497632);
-  b = hh(b, c, d, a, k[10], 23, -1094730640);
-  a = hh(a, b, c, d, k[13], 4, 681279174);
-  d = hh(d, a, b, c, k[0], 11, -358537222);
-  c = hh(c, d, a, b, k[3], 16, -722521979);
-  b = hh(b, c, d, a, k[6], 23, 76029189);
-  a = hh(a, b, c, d, k[9], 4, -640364487);
-  d = hh(d, a, b, c, k[12], 11, -421815835);
-  c = hh(c, d, a, b, k[15], 16, 530742520);
-  b = hh(b, c, d, a, k[2], 23, -995338651);
-  a = ii(a, b, c, d, k[0], 6, -198630844);
-  d = ii(d, a, b, c, k[7], 10, 1126891415);
-  c = ii(c, d, a, b, k[14], 15, -1416354905);
-  b = ii(b, c, d, a, k[5], 21, -57434055);
-  a = ii(a, b, c, d, k[12], 6, 1700485571);
-  d = ii(d, a, b, c, k[3], 10, -1894986606);
-  c = ii(c, d, a, b, k[10], 15, -1051523);
-  b = ii(b, c, d, a, k[1], 21, -2054922799);
-  a = ii(a, b, c, d, k[8], 6, 1873313359);
-  d = ii(d, a, b, c, k[15], 10, -30611744);
-  c = ii(c, d, a, b, k[6], 15, -1560198380);
-  b = ii(b, c, d, a, k[13], 21, 1309151649);
-  a = ii(a, b, c, d, k[4], 6, -145523070);
-  d = ii(d, a, b, c, k[11], 10, -1120210379);
-  c = ii(c, d, a, b, k[2], 15, 718787259);
-  b = ii(b, c, d, a, k[9], 21, -343485551);
-  x[0] = add32(a, x[0]);
-  x[1] = add32(b, x[1]);
-  x[2] = add32(c, x[2]);
-  x[3] = add32(d, x[3]);
-}
-function cmn(q, a, b, x, s, t) {
-  a = add32(add32(a, q), add32(x, t));
-  return add32(a << s | a >>> 32 - s, b);
-}
-function ff(a, b, c, d, x, s, t) {
-  return cmn(b & c | ~b & d, a, b, x, s, t);
-}
-function gg(a, b, c, d, x, s, t) {
-  return cmn(b & d | c & ~d, a, b, x, s, t);
-}
-function hh(a, b, c, d, x, s, t) {
-  return cmn(b ^ c ^ d, a, b, x, s, t);
-}
-function ii(a, b, c, d, x, s, t) {
-  return cmn(c ^ (b | ~d), a, b, x, s, t);
-}
-function md51(s) {
-  var txt = "";
-  var n = s.length, state = [1732584193, -271733879, -1732584194, 271733878], i;
-  for (i = 64;i <= s.length; i += 64) {
-    md5cycle(state, md5blk(s.substring(i - 64, i)));
-  }
-  s = s.substring(i - 64);
-  var tail = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
-  for (i = 0;i < s.length; i++)
-    tail[i >> 2] |= s.charCodeAt(i) << (i % 4 << 3);
-  tail[i >> 2] |= 128 << (i % 4 << 3);
-  if (i > 55) {
-    md5cycle(state, tail);
-    for (i = 0;i < 16; i++)
-      tail[i] = 0;
-  }
-  tail[14] = n * 8;
-  md5cycle(state, tail);
-  return state;
-}
-function md5blk(s) {
-  var md5blks = [], i;
-  for (i = 0;i < 64; i += 4) {
-    md5blks[i >> 2] = s.charCodeAt(i) + (s.charCodeAt(i + 1) << 8) + (s.charCodeAt(i + 2) << 16) + (s.charCodeAt(i + 3) << 24);
-  }
-  return md5blks;
-}
-var hex_chr = "0123456789abcdef".split("");
-function rhex(n) {
-  var s = "", j = 0;
-  for (;j < 4; j++)
-    s += hex_chr[n >> j * 8 + 4 & 15] + hex_chr[n >> j * 8 & 15];
-  return s;
-}
-function hex(x) {
-  for (var i = 0;i < x.length; i++)
-    x[i] = rhex(x[i]);
-  return x.join("");
-}
-function add32(a, b) {
-  return a + b & 4294967295;
-}
-function md5(s) {
-  return hex(md51(s));
-}
-
-// src/assets.ts
 import { readdir } from "node:fs/promises";
 import { resolve } from "node:path";
 var IS_PROD = false;
 var PWD = import.meta.dir;
+var clientImportMap = new Map;
 var clientJSFiles = new Map;
 async function buildClientJS() {
   const sourceFile = resolve(PWD, "../", "./src/clientjs/hyperspan-client.ts");
@@ -197,39 +62,11 @@ function hyperspanScriptTags() {
         ></script>`)}
   `;
 }
-async function createPreactIsland(file) {
-  let filePath = file.replace("file://", "");
-  let resultStr = 'import{h,render}from"preact";';
-  const build = await Bun.build({
-    entrypoints: [filePath],
-    minify: true,
-    external: ["react", "preact"],
-    env: "APP_PUBLIC_*"
-  });
-  for (const output of build.outputs) {
-    resultStr += await output.text();
-  }
-  const r = /export\{([a-zA-Z]+) as default\}/g;
-  const matchExport = r.exec(resultStr);
-  const jsId = md5(resultStr);
-  if (!matchExport) {
-    throw new Error("File does not have a default export! Ensure a function has export default to use this.");
-  }
-  const fn = matchExport[1];
-  let _mounted = false;
-  return (props) => {
-    if (!_mounted) {
-      _mounted = true;
-      resultStr += `render(h(${fn}, ${JSON.stringify(props)}), document.getElementById("${jsId}"));`;
-    }
-    return html.raw(`<div id="${jsId}"></div><script type="module" data-source-id="${jsId}">${resultStr}</script>`);
-  };
-}
 export {
   hyperspanStyleTags,
   hyperspanScriptTags,
-  createPreactIsland,
   clientJSFiles,
+  clientImportMap,
   clientCSSFiles,
   buildClientJS,
   buildClientCSS

package/package.json

@@ -1,8 +1,9 @@
 {
   "name": "@hyperspan/framework",
-  "version": "0.1.5",
+  "version": "0.1.6",
   "description": "Hyperspan Web Framework",
   "main": "dist/server.js",
+  "types": "src/server.ts",
   "public": true,
   "publishConfig": {
     "access": "public"
@@ -63,7 +64,7 @@
     "typescript": "^5.0.0"
   },
   "dependencies": {
-    "@hyperspan/html": "^0.1.4",
+    "@hyperspan/html": "^0.1.5",
     "@preact/compat": "^18.3.1",
     "hono": "^4.7.4",
     "isbot": "^5.1.25",

package/src/actions.test.ts

@@ -1,16 +1,16 @@
 import z from 'zod';
-import { createAction, THSFormData } from './actions';
+import { createAction } from './actions';
 import { describe, it, expect } from 'bun:test';
 import { html, render, type TmplHtml } from '@hyperspan/html';
 import type { Context } from 'hono';
 
 describe('createAction', () => {
-  const formWithNameOnly = ({ data }: THSFormData) => {
+  const formWithNameOnly = ({ data }: { data?: { name: string } }) => {
     return html`
       <form>
         <p>
           Name:
-          <input type="text" name="name" value="${data.name || ''}" />
+          <input type="text" name="name" value="${data?.name || ''}" />
         </p>
         <button type="submit">Submit</button>
       </form>
@@ -22,7 +22,7 @@ describe('createAction', () => {
       const schema = z.object({
         name: z.string(),
       });
-      const action = createAction(schema).form(formWithNameOnly);
+      const action = createAction(schema, formWithNameOnly);
 
       const formResponse = render(action.render({ data: { name: 'John' } }) as TmplHtml);
       expect(formResponse).toContain('value="John"');
@@ -34,10 +34,9 @@ describe('createAction', () => {
       const schema = z.object({
         name: z.string().nonempty(),
       });
-      const action = createAction(schema)
-        .form(formWithNameOnly)
-        .handler((c, { data }) => {
-          return html`<div>Thanks for submitting the form, ${data.name}!</div>`;
+      const action = createAction(schema, formWithNameOnly)
+        .post((c, { data }) => {
+          return html`<div>Thanks for submitting the form, ${data?.name}!</div>`;
         })
         .error((c, { error }) => {
           return html`<div>There was an error! ${error?.message}</div>`;
@@ -68,8 +67,8 @@ describe('createAction', () => {
       });
       const action = createAction(schema)
         .form(formWithNameOnly)
-        .handler((c, { data }) => {
-          return html`<div>Thanks for submitting the form, ${data.name}!</div>`;
+        .post((c, { data }) => {
+          return html`<div>Thanks for submitting the form, ${data?.name}!</div>`;
         })
         .error((c, { error }) => {
           return html`<div>There was an error! ${error?.message}</div>`;

package/src/actions.ts

@@ -1,4 +1,4 @@
-import { html } from '@hyperspan/html';
+import { html, TmplHtml } from '@hyperspan/html';
 import * as z from 'zod';
 import { HTTPException } from 'hono/http-exception';
 
@@ -20,21 +20,24 @@ import type { Context } from 'hono';
  */
 export interface HSAction<T extends z.ZodTypeAny> {
   _kind: string;
-  form(renderForm: (data: z.infer<T>) => THSResponseTypes): HSAction<T>;
-  handler(handler: (c: Context, { data }: { data: z.infer<T> }) => THSResponseTypes): HSAction<T>;
+  form(renderForm: ({ data }: { data?: z.infer<T> }) => TmplHtml): HSAction<T>;
+  post(handler: (c: Context, { data }: { data?: z.infer<T> }) => THSResponseTypes): HSAction<T>;
   error(
     handler: (
       c: Context,
-      { data, error }: { data: z.infer<T>; error?: z.ZodError | Error }
+      { data, error }: { data?: z.infer<T>; error?: z.ZodError | Error }
     ) => THSResponseTypes
   ): HSAction<T>;
-  render(props?: { data: z.infer<T>; error?: z.ZodError | Error }): THSResponseTypes;
+  render(props?: { data?: z.infer<T>; error?: z.ZodError | Error }): THSResponseTypes;
   run(method: 'GET' | 'POST', c: Context): Promise<THSResponseTypes>;
 }
 
-export function createAction<T extends z.ZodTypeAny>(schema: T | null = null) {
-  let _handler: Parameters<HSAction<T>['handler']>[0] | null = null,
-    _form: Parameters<HSAction<T>['form']>[0] | null = null,
+export function createAction<T extends z.ZodTypeAny>(
+  schema: T | null = null,
+  form: Parameters<HSAction<T>['form']>[0] | null = null
+) {
+  let _handler: Parameters<HSAction<T>['post']>[0] | null = null,
+    _form: Parameters<HSAction<T>['form']>[0] | null = form,
     _errorHandler: Parameters<HSAction<T>['error']>[0] | null = null;
 
   const api: HSAction<T> = {
@@ -50,7 +53,7 @@ export function createAction<T extends z.ZodTypeAny>(schema: T | null = null) {
      * Returns result from form processing if successful
      * Re-renders form with data and error information otherwise
      */
-    handler(handler) {
+    post(handler) {
       _handler = handler;
       return api;
     },
@@ -63,8 +66,8 @@ export function createAction<T extends z.ZodTypeAny>(schema: T | null = null) {
     /**
      * Get form renderer method
      */
-    render(data) {
-      const form = _form ? _form(data || { data: {} }) : null;
+    render(formState?: { data?: z.infer<T>; error?: z.ZodError | Error }) {
+      const form = _form ? _form(formState || {}) : null;
       return form ? html`<hs-action>${form}</hs-action>` : null;
     },
 
@@ -86,7 +89,7 @@ export function createAction<T extends z.ZodTypeAny>(schema: T | null = null) {
       const formData = await c.req.formData();
       const jsonData = formDataToJSON(formData);
       const schemaData = schema ? schema.safeParse(jsonData) : null;
-      const data = schemaData?.success ? (schemaData.data as z.infer<T>) : {};
+      const data = schemaData?.success ? (schemaData.data as z.infer<T>) : undefined;
       let error: z.ZodError | Error | null = null;
 
       try {
@@ -95,7 +98,7 @@ export function createAction<T extends z.ZodTypeAny>(schema: T | null = null) {
         }
 
         if (!_handler) {
-          throw new Error('Action handler not set! Every action must have a handler.');
+          throw new Error('Action POST handler not set! Every action must have a POST handler.');
         }
 
         return _handler(c, { data });

package/src/assets.ts

@@ -1,11 +1,12 @@
 import { html } from '@hyperspan/html';
-import { md5 } from './clientjs/md5';
 import { readdir } from 'node:fs/promises';
 import { resolve } from 'node:path';
 
 const IS_PROD = process.env.NODE_ENV === 'production';
 const PWD = import.meta.dir;
 
+export const clientImportMap = new Map<string, string>();
+
 /**
  * Build client JS for end users (minimal JS for Hyperspan to work)
  */
@@ -94,49 +95,3 @@ export function hyperspanScriptTags() {
     )}
   `;
 }
-
-/**
- * Return a Preact component, mounted as an island in a <script> tag so it can be embedded into the page response.
- */
-export async function createPreactIsland(file: string) {
-  let filePath = file.replace('file://', '');
-
-  let resultStr = 'import{h,render}from"preact";';
-  const build = await Bun.build({
-    entrypoints: [filePath],
-    minify: true,
-    external: ['react', 'preact'],
-    // @ts-ignore
-    env: 'APP_PUBLIC_*', // Inlines any ENV that starts with 'APP_PUBLIC_'
-  });
-
-  for (const output of build.outputs) {
-    resultStr += await output.text(); // string
-  }
-
-  // Find default export - this is our component
-  const r = /export\{([a-zA-Z]+) as default\}/g;
-  const matchExport = r.exec(resultStr);
-  const jsId = md5(resultStr);
-
-  if (!matchExport) {
-    throw new Error(
-      'File does not have a default export! Ensure a function has export default to use this.'
-    );
-  }
-
-  // Preact render/mount component
-  const fn = matchExport[1];
-  let _mounted = false;
-
-  // Return HTML that will embed this component
-  return (props: any) => {
-    if (!_mounted) {
-      _mounted = true;
-      resultStr += `render(h(${fn}, ${JSON.stringify(props)}), document.getElementById("${jsId}"));`;
-    }
-    return html.raw(
-      `<div id="${jsId}"></div><script type="module" data-source-id="${jsId}">${resultStr}</script>`
-    );
-  };
-}

package/dist/assets.d.ts

@@ -1,46 +0,0 @@
-// Generated by dts-bundle-generator v9.5.1
-
-declare class TmplHtml {
-	_kind: string;
-	content: string;
-	asyncContent: Array<{
-		id: string;
-		promise: Promise<{
-			id: string;
-			value: unknown;
-		}>;
-	}>;
-	constructor(props: Pick<TmplHtml, "content" | "asyncContent">);
-}
-/**
- * Build client JS for end users (minimal JS for Hyperspan to work)
- */
-export declare const clientJSFiles: Map<string, {
-	src: string;
-	type?: string;
-}>;
-export declare function buildClientJS(): Promise<void>;
-/**
- * Find client CSS file built for end users
- * @TODO: Build this in code here vs. relying on tailwindcss CLI tool from package scripts
- */
-export declare const clientCSSFiles: Map<string, string>;
-export declare function buildClientCSS(): Promise<string | undefined>;
-/**
- * Output HTML style tag for Hyperspan app
- */
-export declare function hyperspanStyleTags(): TmplHtml;
-/**
- * Output HTML script tag for Hyperspan app
- * Required for functioning streaming so content can pop into place properly once ready
- */
-export declare function hyperspanScriptTags(): TmplHtml;
-/**
- * Return a Preact component, mounted as an island in a <script> tag so it can be embedded into the page response.
- */
-export declare function createPreactIsland(file: string): Promise<(props: any) => {
-	_kind: string;
-	content: string;
-}>;
-
-export {};

package/dist/server.d.ts

@@ -1,88 +0,0 @@
-// Generated by dts-bundle-generator v9.5.1
-
-import { Context, Hono } from 'hono';
-
-declare class TmplHtml {
-	_kind: string;
-	content: string;
-	asyncContent: Array<{
-		id: string;
-		promise: Promise<{
-			id: string;
-			value: unknown;
-		}>;
-	}>;
-	constructor(props: Pick<TmplHtml, "content" | "asyncContent">);
-}
-export declare const IS_PROD: boolean;
-/**
- * Types
- */
-export type THSResponseTypes = TmplHtml | Response | string | null;
-export type THSRouteHandler = (context: Context) => THSResponseTypes | Promise<THSResponseTypes>;
-export type THSRoute = {
-	_kind: "hsRoute";
-	get: (handler: THSRouteHandler) => THSRoute;
-	post: (handler: THSRouteHandler) => THSRoute;
-	put: (handler: THSRouteHandler) => THSRoute;
-	delete: (handler: THSRouteHandler) => THSRoute;
-	patch: (handler: THSRouteHandler) => THSRoute;
-	run: (method: string, context: Context) => Promise<Response>;
-};
-/**
- * Define a route that can handle a direct HTTP request.
- * Route handlers should return a TmplHtml or Response object
- */
-export declare function createRoute(handler?: THSRouteHandler): THSRoute;
-/**
- * Create new API Route
- * API Route handlers should return a JSON object or a Response
- */
-export declare function createAPIRoute(handler?: THSRouteHandler): THSRoute;
-/**
- * Get a Hyperspan runnable route from a module import
- * @throws Error if no runnable route found
- */
-export declare function getRunnableRoute(route: unknown): THSRoute;
-export declare function isRunnableRoute(route: unknown): boolean;
-export type THSServerConfig = {
-	appDir: string;
-	staticFileRoot: string;
-	rewrites?: Array<{
-		source: string;
-		destination: string;
-	}>;
-	beforeRoutesAdded?: (app: Hono) => void;
-	afterRoutesAdded?: (app: Hono) => void;
-};
-export type THSRouteMap = {
-	file: string;
-	route: string;
-	params: string[];
-};
-export declare function buildRoutes(config: THSServerConfig): Promise<THSRouteMap[]>;
-/**
- * Run route from file
- */
-export declare function createRouteFromModule(RouteModule: any): (context: Context) => Promise<Response>;
-/**
- * Create and start Bun HTTP server
- */
-export declare function createServer(config: THSServerConfig): Promise<Hono>;
-/**
- * Streaming HTML Response
- */
-export declare class StreamResponse extends Response {
-	constructor(iterator: AsyncIterator<unknown>, options?: {});
-}
-/**
- * Does what it says on the tin...
- */
-export declare function createReadableStreamFromAsyncGenerator(output: AsyncGenerator): ReadableStream<any>;
-/**
- * Normalize URL path
- * Removes trailing slash and lowercases path
- */
-export declare function normalizePath(urlPath: string): string;
-
-export {};