diff --git a/deno_dist/middleware/jsx-renderer/index.ts b/deno_dist/middleware/jsx-renderer/index.ts index 0d76102e3..c33a1bc52 100644 --- a/deno_dist/middleware/jsx-renderer/index.ts +++ b/deno_dist/middleware/jsx-renderer/index.ts @@ -67,6 +67,40 @@ const createRenderer = } } +/** + * JSX renderer middleware for hono. + * + * @see {@link{https://hono.dev/middleware/builtin/jsx-renderer}} + * + * @param {ComponentWithChildren} [component] - The component to render, which can accept children and props. + * @param {RendererOptions} [options] - The options for the JSX renderer middleware. + * @param {boolean | string} [options.docType=true] - The DOCTYPE to be added at the beginning of the HTML. If set to false, no DOCTYPE will be added. + * @param {boolean | Record} [options.stream=false] - If set to true, enables streaming response with default headers. If a record is provided, custom headers will be used. + * @returns {MiddlewareHandler} The middleware handler function. + * + * @example + * ```ts + * const app = new Hono() + * + * app.get( + * '/page/*', + * jsxRenderer(({ children }) => { + * return ( + * + * + *
Menu
+ *
{children}
+ * + * + * ) + * }) + * ) + * + * app.get('/page/about', (c) => { + * return c.render(

About me!

) + * }) + * ``` + */ export const jsxRenderer = ( component?: ComponentWithChildren, options?: RendererOptions @@ -82,6 +116,30 @@ export const jsxRenderer = ( return next() } +/** + * useRequestContext for Hono. + * + * @template E - The environment type. + * @template P - The parameter type. + * @template I - The input type. + * @returns {Context} An instance of Context. + * + * @example + * ```ts + * const RequestUrlBadge: FC = () => { + * const c = useRequestContext() + * return {c.req.url} + * } + * + * app.get('/page/info', (c) => { + * return c.render( + *
+ * You are accessing: + *
+ * ) + * }) + * ``` + */ export const useRequestContext = < E extends Env = any, P extends string = any, diff --git a/src/middleware/jsx-renderer/index.ts b/src/middleware/jsx-renderer/index.ts index e42b9868a..34eb0223c 100644 --- a/src/middleware/jsx-renderer/index.ts +++ b/src/middleware/jsx-renderer/index.ts @@ -67,6 +67,40 @@ const createRenderer = } } +/** + * JSX renderer middleware for hono. + * + * @see {@link{https://hono.dev/middleware/builtin/jsx-renderer}} + * + * @param {ComponentWithChildren} [component] - The component to render, which can accept children and props. + * @param {RendererOptions} [options] - The options for the JSX renderer middleware. + * @param {boolean | string} [options.docType=true] - The DOCTYPE to be added at the beginning of the HTML. If set to false, no DOCTYPE will be added. + * @param {boolean | Record} [options.stream=false] - If set to true, enables streaming response with default headers. If a record is provided, custom headers will be used. + * @returns {MiddlewareHandler} The middleware handler function. + * + * @example + * ```ts + * const app = new Hono() + * + * app.get( + * '/page/*', + * jsxRenderer(({ children }) => { + * return ( + * + * + *
Menu
+ *
{children}
+ * + * + * ) + * }) + * ) + * + * app.get('/page/about', (c) => { + * return c.render(

About me!

) + * }) + * ``` + */ export const jsxRenderer = ( component?: ComponentWithChildren, options?: RendererOptions @@ -82,6 +116,30 @@ export const jsxRenderer = ( return next() } +/** + * useRequestContext for Hono. + * + * @template E - The environment type. + * @template P - The parameter type. + * @template I - The input type. + * @returns {Context} An instance of Context. + * + * @example + * ```ts + * const RequestUrlBadge: FC = () => { + * const c = useRequestContext() + * return {c.req.url} + * } + * + * app.get('/page/info', (c) => { + * return c.render( + *
+ * You are accessing: + *
+ * ) + * }) + * ``` + */ export const useRequestContext = < E extends Env = any, P extends string = any,