hono 1.4.5 → 1.5.0

package/README.md

@@ -73,6 +73,8 @@ Built-in middleware make _"**Write Less, do more**"_ in reality. You can use a l
 - [CORS](https://github.com/honojs/hono/tree/master/src/middleware/cors/)
 - [ETag](https://github.com/honojs/hono/tree/master/src/middleware/etag/)
 - [GraphQL Server](https://github.com/honojs/hono/tree/master/src/middleware/graphql-server/)
+- [html](https://github.com/honojs/hono/tree/master/src/middleware/html/)
+- [JSX](https://github.com/honojs/hono/tree/master/src/middleware/jsx/)
 - [JWT Authentication](https://github.com/honojs/hono/tree/master/src/middleware/jwt/)
 - [Logger](https://github.com/honojs/hono/tree/master/src/middleware/logger/)
 - [Mustache template engine](https://github.com/honojs/hono/tree/master/src/middleware/mustache/) (Only for Cloudflare Workers)
@@ -495,6 +497,8 @@ app.get('/foo', async (c) => {
 
 ### c.env
 
+Environment variables, secrets, and KV namespaces are known as bindings. Regardless of type, bindings are always available as global variables and can be accessed via the context `c.env.BINDING_KEY`.
+
 ```ts
 // Environment object for Cloudflare Workers
 app.get('*', async c => {
@@ -552,9 +556,9 @@ import { RegExpRouter } from 'hono/router/reg-exp-router'
 const app = new Hono({ router: new RegExpRouter() })
 ```
 
-## Routing Ordering
+## Routing priority
 
-The routing priority is decided by the order of registration. Only one handler will be dispatched.
+Handlers or middleware will be executed in registration order.
 
 ```ts
 app.get('/book/a', (c) => c.text('a')) // a
@@ -562,27 +566,37 @@ app.get('/book/:slug', (c) => c.text('common')) // common
 ```
 
 ```http
-GET /book/a ---> `a` // common will not be dispatched
-GET /book/b ---> `common` // a will not be dispatched
+GET /book/a ---> `a`
+GET /book/b ---> `common`
 ```
 
-All scoring rules:
+When a handler is executed, the process will be stopped.
 
 ```ts
-app.get('/api/*', 'c') // score 1.1 <--- `/*` is special wildcard
-app.get('/api/:type/:id', 'd') // score 3.2
-app.get('/api/posts/:id', 'e') // score 3.3
-app.get('/api/posts/123', 'f') // score 3.4
-app.get('/*/*/:id', 'g') // score 3.5
-app.get('/api/posts/*/comment', 'h') // score 4.6 - not match
-app.get('*', 'a') // score 0.7
-app.get('*', 'b') // score 0.8
+app.get('*', (c) => c.text('common')) // common
+app.get('/foo', (c) => c.text('foo')) // foo
 ```
 
-```plain
-GET /api/posts/123
----> will match => c, d, e, f, b, a, b
----> sort by score => a, b, c, d, e, f, g
+```http
+GET /foo ---> `common` // foo will not be dispatched
+```
+
+If you have the middleware that you want to execute, write the code above the handler.
+
+```ts
+app.use('*', logger())
+app.get('/foo', (c) => c.text('foo'))
+```
+
+If you want a "_fallback_" handler, write the code below the other handler.
+
+```ts
+app.get('/foo', (c) => c.text('foo')) // foo
+app.get('*', (c) => c.text('fallback')) // fallback
+```
+
+```http
+GET /bar ---> `fallback`
 ```
 
 ## Cloudflare Workers with Hono

package/dist/compose.js

@@ -17,7 +17,7 @@ const compose = (middleware, onError, onNotFound) => {
                 handler = next;
             if (!handler) {
                 if (context instanceof context_1.Context && context.finalized === false && onNotFound) {
-                    context.res = onNotFound(context);
+                    context.res = await onNotFound(context);
                 }
                 return Promise.resolve(context);
             }

package/dist/context.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="@cloudflare/workers-types" />
+import type { NotFoundHandler } from './hono';
 import type { StatusCode } from './utils/http-status';
 declare type Headers = Record<string, string>;
 export declare type Data = string | ArrayBuffer | ReadableStream;
@@ -15,8 +16,8 @@ export declare class Context<RequestParamKeyType extends string = string, E = En
     private _headers;
     private _res;
     private notFoundHandler;
-    render: (template: string, params?: object, options?: object) => Promise<Response>;
-    constructor(req: Request<RequestParamKeyType>, env?: E | undefined, event?: FetchEvent | undefined, notFoundHandler?: (c: Context<string, E>) => Response);
+    render: (content: string, params?: object, options?: object) => Response | Promise<Response>;
+    constructor(req: Request<RequestParamKeyType>, env?: E | undefined, event?: FetchEvent | undefined, notFoundHandler?: NotFoundHandler);
     get res(): Response;
     set res(_res: Response);
     header(name: string, value: string): void;

package/dist/hono.d.ts

@@ -3,7 +3,7 @@ import { Context } from './context';
 import type { Env } from './context';
 import type { Router } from './router';
 export declare type Handler<RequestParamKeyType extends string = string, E = Env> = (c: Context<RequestParamKeyType, E>, next: Next) => Response | Promise<Response> | Promise<void> | Promise<Response | undefined>;
-export declare type NotFoundHandler<E = Env> = (c: Context<string, E>) => Response;
+export declare type NotFoundHandler<E = Env> = (c: Context<string, E>) => Response | Promise<Response>;
 export declare type ErrorHandler<E = Env> = (err: Error, c: Context<string, E>) => Response;
 export declare type Next = () => Promise<void>;
 declare type ParamKeyName<NameWithPattern> = NameWithPattern extends `${infer Name}{${infer _Pattern}` ? Name : NameWithPattern;

package/dist/middleware/html/index.d.ts

@@ -0,0 +1,5 @@
+export declare type HtmlEscapedString = string & {
+    isEscaped: true;
+};
+export declare const raw: (value: any) => HtmlEscapedString;
+export declare const html: (strings: TemplateStringsArray, ...values: any[]) => HtmlEscapedString;

package/dist/middleware/html/index.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.html = exports.raw = void 0;
+const html_1 = require("../../utils/html");
+const raw = (value) => {
+    const escapedString = new String(value);
+    escapedString.isEscaped = true;
+    return escapedString;
+};
+exports.raw = raw;
+const html = (strings, ...values) => {
+    let result = '';
+    for (let i = 0, len = strings.length - 1; i < len; i++) {
+        result += strings[i];
+        const children = values[i] instanceof Array ? values[i].flat(Infinity) : [values[i]];
+        for (let i = 0, len = children.length; i < len; i++) {
+            const child = children[i];
+            if (typeof child === 'boolean' || child === null || child === undefined) {
+                continue;
+            }
+            else if (typeof child === 'object' && child.isEscaped) {
+                result += child;
+            }
+            else {
+                result += (0, html_1.escape)(child.toString());
+            }
+        }
+    }
+    result += strings[strings.length - 1];
+    return (0, exports.raw)(result);
+};
+exports.html = html;

package/dist/middleware/jsx/index.d.ts

@@ -0,0 +1,16 @@
+import type { HtmlEscapedString } from '../../utils/html';
+declare global {
+    namespace jsx.JSX {
+        interface IntrinsicElements {
+            [tagName: string]: Record<string, any>;
+        }
+    }
+}
+export declare const jsx: (tag: string | Function, props: Record<string, any>, ...children: (string | HtmlEscapedString)[]) => HtmlEscapedString;
+declare type FC<T = Record<string, any>> = (props: T) => HtmlEscapedString;
+export declare const memo: <T>(component: FC<T>, propsAreEqual?: (prevProps: Readonly<T>, nextProps: Readonly<T>) => boolean) => FC<T>;
+export declare const Fragment: (props: {
+    key?: string;
+    children?: any;
+}) => HtmlEscapedString;
+export {};

package/dist/middleware/jsx/index.js

@@ -0,0 +1,82 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Fragment = exports.memo = exports.jsx = void 0;
+const html_1 = require("../../utils/html");
+const jsx = (tag, props, ...children) => {
+    if (typeof tag === 'function') {
+        return tag.call(null, { ...props, children: children.length <= 1 ? children[0] : children });
+    }
+    let result = tag !== '' ? `<${tag}` : '';
+    const propsKeys = Object.keys(props || {});
+    for (let i = 0, len = propsKeys.length; i < len; i++) {
+        const v = props[propsKeys[i]];
+        if (propsKeys[i] === 'dangerouslySetInnerHTML') {
+            if (children.length > 0) {
+                throw 'Can only set one of `children` or `props.dangerouslySetInnerHTML`.';
+            }
+            const escapedString = new String(v.__html);
+            escapedString.isEscaped = true;
+            children = [escapedString];
+            continue;
+        }
+        else if (v === null || v === undefined) {
+            continue;
+        }
+        result += ` ${propsKeys[i]}="${(0, html_1.escape)(v.toString())}"`;
+    }
+    if (tag !== '') {
+        result += '>';
+    }
+    const flattenChildren = children.flat(Infinity);
+    for (let i = 0, len = flattenChildren.length; i < len; i++) {
+        const child = flattenChildren[i];
+        if (typeof child === 'boolean' || child === null || child === undefined) {
+            continue;
+        }
+        else if (typeof child === 'object' && child.isEscaped) {
+            result += child;
+        }
+        else {
+            result += (0, html_1.escape)(child.toString());
+        }
+    }
+    if (tag !== '') {
+        result += `</${tag}>`;
+    }
+    const escapedString = new String(result);
+    escapedString.isEscaped = true;
+    return escapedString;
+};
+exports.jsx = jsx;
+const shallowEqual = (a, b) => {
+    if (a === b) {
+        return true;
+    }
+    const aKeys = Object.keys(a);
+    const bKeys = Object.keys(b);
+    if (aKeys.length !== bKeys.length) {
+        return false;
+    }
+    for (let i = 0, len = aKeys.length; i < len; i++) {
+        if (a[aKeys[i]] !== b[aKeys[i]]) {
+            return false;
+        }
+    }
+    return true;
+};
+const memo = (component, propsAreEqual = shallowEqual) => {
+    let computed = undefined;
+    let prevProps = undefined;
+    return ((props) => {
+        if (prevProps && !propsAreEqual(prevProps, props)) {
+            computed = undefined;
+        }
+        prevProps = props;
+        return (computed || (computed = component(props)));
+    });
+};
+exports.memo = memo;
+const Fragment = (props) => {
+    return (0, exports.jsx)('', {}, ...(props.children || []));
+};
+exports.Fragment = Fragment;

package/dist/middleware/mustache/module.d.mts

@@ -1,3 +1,3 @@
 import type { MustacheOptions } from './mustache';
-declare const module: (options?: MustacheOptions) => import("../../hono").Handler<string, import("../../context").Env>;
+declare const module: (options?: MustacheOptions) => (c: import("../../context").Context<string, import("../../context").Env>, next: import("../../hono").Next) => Promise<void>;
 export { module as mustache };

package/dist/middleware/mustache/mustache.d.ts

@@ -1,8 +1,9 @@
 /// <reference types="@cloudflare/workers-types" />
-import type { Handler } from '../../hono';
+import type { Context } from '../../context';
+import type { Next } from '../../hono';
 export declare type MustacheOptions = {
     root: string;
     manifest?: object | string;
     namespace?: KVNamespace;
 };
-export declare const mustache: (init?: MustacheOptions) => Handler;
+export declare const mustache: (init?: MustacheOptions) => (c: Context, next: Next) => Promise<void>;

package/dist/router/reg-exp-router/router.d.ts

@@ -11,7 +11,6 @@ interface Hint {
 interface HandlerWithSortIndex<T> {
     handler: T;
     index: number;
-    componentsLength: number;
 }
 interface Route<T> {
     method: string;

package/dist/router/reg-exp-router/router.js

@@ -65,9 +65,7 @@ function compareRoute(a, b) {
     return i === b.hint.regExpComponents.length || a.hint.endWithWildcard ? 1 : 0;
 }
 function compareHandler(a, b) {
-    return a.componentsLength !== b.componentsLength
-        ? a.componentsLength - b.componentsLength
-        : a.index - b.index;
+    return a.index - b.index;
 }
 function getSortedHandlers(handlers) {
     return [...handlers].sort(compareHandler).map((h) => h.handler);
@@ -158,7 +156,6 @@ class RegExpRouter {
         const handlerWithSortIndex = {
             index,
             handler,
-            componentsLength: hint.components.length || 1,
         };
         for (let i = 0, len = routes.length; i < len; i++) {
             if (routes[i].method === method && routes[i].path === path) {
@@ -318,9 +315,7 @@ class RegExpRouter {
                         }
                     }
                     if (routes[j].hint.components.length < routes[i].hint.components.length) {
-                        const componentsLength = routes[j].hint.components.length || 1;
                         routes[j].middleware.push(...routes[i].handlers.map((h) => ({
-                            componentsLength,
                             index: h.index,
                             handler: h.handler,
                         })));

package/dist/router/trie-router/node.js

@@ -66,18 +66,11 @@ class Node {
             parentPatterns.push(...curNode.patterns);
             curNode = curNode.children[p];
         }
-        let score = 1;
-        if (path === '*') {
-            score = score + this.order * 0.01;
-        }
-        else {
-            score = parts.length + this.order * 0.01;
-        }
         if (!curNode.methods.length) {
             curNode.methods = [];
         }
         const m = {};
-        const handlerSet = { handler: handler, name: this.name, score: score };
+        const handlerSet = { handler: handler, name: this.name, score: this.order };
         m[method] = handlerSet;
         curNode.methods.push(m);
         return curNode;
@@ -90,9 +83,6 @@ class Node {
                 const handlerSet = m[method] || m[router_1.METHOD_NAME_ALL];
                 if (handlerSet !== undefined) {
                     const hs = { ...handlerSet };
-                    if (wildcard) {
-                        hs.score = handlerSet.score - 1;
-                    }
                     handlerSets.push(hs);
                     return;
                 }

package/dist/utils/crypto.d.ts

@@ -5,5 +5,6 @@ declare type Algorithm = {
 declare type Data = string | object | boolean;
 export declare const sha256: (data: Data) => Promise<string | null>;
 export declare const sha1: (data: Data) => Promise<string | null>;
+export declare const md5: (data: Data) => Promise<string | null>;
 export declare const createHash: (data: Data, algorithm: Algorithm) => Promise<string | null>;
 export {};

package/dist/utils/crypto.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.createHash = exports.sha1 = exports.sha256 = void 0;
+exports.createHash = exports.md5 = exports.sha1 = exports.sha256 = void 0;
 const sha256 = async (data) => {
     const algorithm = { name: 'SHA-256', alias: 'sha256' };
     const hash = await (0, exports.createHash)(data, algorithm);
@@ -13,6 +13,12 @@ const sha1 = async (data) => {
     return hash;
 };
 exports.sha1 = sha1;
+const md5 = async (data) => {
+    const algorithm = { name: 'MD5', alias: 'md5' };
+    const hash = await (0, exports.createHash)(data, algorithm);
+    return hash;
+};
+exports.md5 = md5;
 const createHash = async (data, algorithm) => {
     if (crypto && crypto.subtle) {
         const buffer = await crypto.subtle.digest({

package/dist/utils/html.d.ts

@@ -0,0 +1,4 @@
+export declare type HtmlEscapedString = string & {
+    isEscaped: true;
+};
+export declare const escape: (str: string) => string;

package/dist/utils/html.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.escape = void 0;
+const entityMap = {
+    '&': '&',
+    '<': '&lt;',
+    '>': '&gt;',
+    '"': '&quot;',
+};
+const escapeRe = new RegExp(`[${Object.keys(entityMap).join('')}]`, 'g');
+const replaceFn = (m) => entityMap[m];
+const escape = (str) => {
+    return str.replace(escapeRe, replaceFn);
+};
+exports.escape = escape;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hono",
-  "version": "1.4.5",
+  "version": "1.5.0",
   "description": "Ultrafast web framework for Cloudflare Workers.",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -24,6 +24,8 @@
     "./cors": "./dist/middleware/cors/index.js",
     "./etag": "./dist/middleware/etag/index.js",
     "./graphql-server": "./dist/middleware/graphql-server/index.js",
+    "./html": "./dist/middleware/html/index.js",
+    "./jsx": "./dist/middleware/jsx/index.js",
     "./jwt": "./dist/middleware/jwt/index.js",
     "./logger": "./dist/middleware/logger/index.js",
     "./mustache": "./dist/middleware/mustache/index.js",
@@ -60,6 +62,12 @@
       "graphql-server": [
         "./dist/middleware/graphql-server"
       ],
+      "html": [
+        "./dist/middleware/html"
+      ],
+      "jsx": [
+        "./dist/middleware/jsx"
+      ],
       "jwt": [
         "./dist/middleware/jwt"
       ],