@hyperspan/framework 1.0.6 → 1.0.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hyperspan/framework",
-  "version": "1.0.6",
+  "version": "1.0.7",
   "description": "Hyperspan Web Framework",
   "main": "src/server.ts",
   "types": "src/server.ts",

package/src/actions.test.ts

@@ -256,7 +256,7 @@ describe('createAction', () => {
 
     const responseText = await response.text();
     // Should render the custom error handler
-    expect(responseText).toContain('Caught error in custom error handler: Input validation error(s)');
+    expect(responseText).toContain('Invalid email address');
     expect(responseText).toContain('Data: {"email":"not-an-email"}');
     // Should NOT contain the success message from post handler
     expect(responseText).not.toContain('Hello,');

package/src/actions.ts

@@ -84,8 +84,8 @@ export function createAction<T extends z.ZodObject<any, any>>(params: { name: st
      * Form to render
      * This will be wrapped in a <hs-action> web component and submitted via fetch()
      */
-    form(form: HS.ActionFormHandler<T>) {
-      api._form = form;
+    form(_formFn) {
+      api._form = _formFn;
       return api;
     },
     /**
@@ -101,7 +101,7 @@ export function createAction<T extends z.ZodObject<any, any>>(params: { name: st
     /**
      * Get form renderer method
      */
-    render(c: HS.Context, props?: HS.ActionProps<T>) {
+    render(c, props) {
       const formContent = api._form ? api._form(c, props || {}) : null;
       return formContent ? html`<hs-action url="${this._path()}">${formContent}</hs-action>${actionsClientJS.renderScriptTag()}` : null;
     },
@@ -109,6 +109,10 @@ export function createAction<T extends z.ZodObject<any, any>>(params: { name: st
       _errorHandler = handler;
       return api;
     },
+    use(middleware: HS.MiddlewareFunction) {
+      route.use(middleware);
+      return api;
+    },
     middleware(middleware: Array<HS.MiddlewareFunction>) {
       route.middleware(middleware);
       return api;

package/src/middleware.ts

@@ -1,5 +1,5 @@
 import { formDataToJSON } from './utils';
-import { z, flattenError } from 'zod/v4';
+import { z, flattenError, prettifyError } from 'zod/v4';
 
 import type { ZodAny, ZodObject, ZodError } from 'zod/v4';
 import type { Hyperspan as HS } from './types';
@@ -26,12 +26,15 @@ function inferValidationType(headers: Headers): TValidationType {
 }
 
 export class ZodValidationError extends Error {
-  constructor(flattened: ReturnType<typeof flattenError>) {
-    super('Input validation error(s)');
+  public fieldErrors;
+  public formErrors: unknown[];
+  constructor(error: ZodError, schema: ZodObject | ZodAny) {
+    const message = prettifyError(error);
+    const flattened = flattenError<z.infer<typeof schema>>(error);
+    super(message);
     this.name = 'ZodValidationError';
-
-    // Copy all properties from flattened error
-    Object.assign(this, flattened);
+    this.fieldErrors = flattened.fieldErrors;
+    this.formErrors = flattened.formErrors;
   }
 }
 
@@ -44,8 +47,8 @@ export function validateQuery(schema: ZodObject | ZodAny): HS.MiddlewareFunction
     context.vars.query = validated.data as z.infer<typeof schema>;
 
     if (!validated.success) {
-      const err = formatZodError(validated.error);
-      return context.res.error(err, { status: 400 });
+      const err = new ZodValidationError(validated.error, schema);
+      throw new HTTPResponseException(err, { status: 400 });
     }
 
     return next();
@@ -72,20 +75,14 @@ export function validateBody(schema: ZodObject | ZodAny, type?: TValidationType)
     const validated = schema.safeParse(body);
 
     if (!validated.success) {
-      const err = formatZodError(validated.error);
+      const err = new ZodValidationError(validated.error, schema);
       throw new HTTPResponseException(err, { status: 400 });
-      //return context.res.error(err, { status: 400 });
     }
 
     return next();
   }
 }
 
-export function formatZodError(error: ZodError): ZodValidationError {
-  const zodError = flattenError(error);
-  return new ZodValidationError(zodError);
-}
-
 /**
  * Type guard to check if a handler is a middleware function
  * Middleware functions have 2 parameters (context, next)

package/src/types.ts

@@ -1,4 +1,5 @@
 import { HSHtml } from '@hyperspan/html';
+import { ZodValidationError } from './middleware';
 import * as z from 'zod/v4';
 
 /**
@@ -156,20 +157,29 @@ export namespace Hyperspan {
   /**
    * Action = Form + route handler
    */
-  export type ActionResponse = HSHtml | void | null | Promise<HSHtml | void | null> | Response | Promise<Response>;
-  export type ActionProps<T extends z.ZodTypeAny> = { data?: Partial<z.infer<T>>; error?: z.ZodError | Error };
+  // Form renderer
+  export type ActionFormResponse = HSHtml | void | null | Promise<HSHtml | void | null>;
+  export type ActionFormProps<T extends z.ZodTypeAny> = { data?: Partial<z.infer<T>>; error?: ZodValidationError };
+  export type ActionForm<T extends z.ZodTypeAny> = (
+    c: Context, props: ActionFormProps<T>
+  ) => ActionFormResponse;
+  // Form handler
+  export type ActionFormHandlerResponse = ActionFormResponse | Response | Promise<Response>;
+  export type ActionFormHandlerProps<T extends z.ZodTypeAny> = { data: z.infer<T>; error?: ZodValidationError | Error };
   export type ActionFormHandler<T extends z.ZodTypeAny> = (
-    c: Context, props: ActionProps<T>
-  ) => ActionResponse;
+    c: Context, props: ActionFormHandlerProps<T>
+  ) => ActionFormHandlerResponse;
+  // Action API
   export interface Action<T extends z.ZodTypeAny> {
     _kind: 'hsAction';
     _config: Partial<Hyperspan.RouteConfig>;
     _path(): string;
-    _form: null | ActionFormHandler<T>;
-    form(form: ActionFormHandler<T>): Action<T>;
-    render: (c: Context, props?: ActionProps<T>) => ActionResponse;
+    _form: null | ActionForm<T>;
+    form(form: ActionForm<T>): Action<T>;
+    render: (c: Context, props?: ActionFormProps<T>) => ActionFormResponse;
     post: (handler: ActionFormHandler<T>) => Action<T>;
     errorHandler: (handler: ActionFormHandler<T>) => Action<T>;
+    use: (middleware: Hyperspan.MiddlewareFunction) => Action<T>;
     middleware: (middleware: Array<Hyperspan.MiddlewareFunction>) => Action<T>;
     fetch: (request: Request) => Promise<Response>;
   }