createApp middleware modification

.changeset/twenty-zebras-watch.md

@@ -0,0 +1,8 @@
+---
+"domco": minor
+"create-domco": patch
+---
+
+Adds the ability paths to `CreateAppMiddleware`.
+
+- This is breaking if you are using a custom setup and passing middleware into `createApp`, you now need to specify the `path` in addition to the `handler` passed in. [See example here](https://domco.robino.dev/deploy#example)

apps/docs/src/+server.tsx

@@ -6,12 +6,15 @@ import apiReference from "@/generated/globals.md?raw";
 import { processMarkdown } from "@robino/md";
 import type { Prerender } from "domco";
 import { Hono } from "hono";
+import { etag } from "hono/etag";
 import { raw } from "hono/html";
 
 export const prerender: Prerender = ["/", "/api-reference"];
 
 const app = new Hono();
 
+app.use(etag());
+
 app.use(async (c, next) => {
 	c.setRenderer(({ title, client }, content) => {
 		const tags = [c.var.client()];

apps/docs/src/components/Layout.tsx

@@ -36,7 +36,7 @@ export const Layout: FC<LayoutProps> = ({ title, children, client }) => {
 						<main class="flex flex-col lg:flex-row">
 							<Nav />
 							<div class="grow justify-center md:flex">
-								<div class="prose m-6 max-w-screen-md">{children}</div>
+								<div class="prose m-6 max-w-[700px]">{children}</div>
 							</div>
 						</main>
 					</drab-prefetch>

apps/docs/src/content/deploy.md

@@ -30,7 +30,9 @@ import { createApp } from "./dist/server/app.js";
 import { serve } from "@hono/node-server";
 import { serveStatic } from "@hono/node-server/serve-static";
 
-const app = createApp({ middleware: [serveStatic({ root: "./dist/client" })] });
+const app = createApp({
+	middleware: [{ path: "/*", handler: serveStatic({ root: "./dist/client" }) }],
+});
 
 serve(app);
 ```

apps/docs/src/generated/globals.md

@@ -12,7 +12,7 @@
 
 ##### devMiddleware?
 
-> `optional` **devMiddleware**: `MiddlewareHandler`[]
+> `optional` **devMiddleware**: [`CreateAppOptions`](globals.md#createappoptions)\[`"middleware"`\]
 
 Middleware to apply in `dev` mode.
 For production middleware, export it from the adapter module,
@@ -46,7 +46,7 @@ The name of the adapter.
 
 ##### previewMiddleware?
 
-> `optional` **previewMiddleware**: `MiddlewareHandler`[]
+> `optional` **previewMiddleware**: [`CreateAppOptions`](globals.md#createappoptions)\[`"middleware"`\]
 
 Middleware to apply in `preview` mode.
 For production middleware, export it from the adapter module,
@@ -74,9 +74,9 @@ Target for SSR build.
 
 #### Defined in
 
-[types/public/index.ts:21](https://github.com/rossrobino/domco/blob/901651aa5239610bc8c1558f2e4c7e072bc52ee6/packages/domco/src/types/public/index.ts#L21)
+[types/public/index.ts:44](https://github.com/rossrobino/domco/blob/fde430c2d32883df987ac54237edd49a27dfdd7e/packages/domco/src/types/public/index.ts#L44)
 
-***
+---
 
 <a id="adapterbuilderadapteroptions" name="adapterbuilderadapteroptions"></a>
 
@@ -98,9 +98,9 @@ Target for SSR build.
 
 #### Defined in
 
-[types/public/index.ts:60](https://github.com/rossrobino/domco/blob/901651aa5239610bc8c1558f2e4c7e072bc52ee6/packages/domco/src/types/public/index.ts#L60)
+[types/public/index.ts:83](https://github.com/rossrobino/domco/blob/fde430c2d32883df987ac54237edd49a27dfdd7e/packages/domco/src/types/public/index.ts#L83)
 
-***
+---
 
 <a id="adapterentry" name="adapterentry"></a>
 
@@ -135,14 +135,14 @@ The name of the entrypoint without extension.
 ###### Example
 
 ```ts
-"main"
+"main";
 ```
 
 #### Defined in
 
-[types/public/index.ts:6](https://github.com/rossrobino/domco/blob/901651aa5239610bc8c1558f2e4c7e072bc52ee6/packages/domco/src/types/public/index.ts#L6)
+[types/public/index.ts:29](https://github.com/rossrobino/domco/blob/fde430c2d32883df987ac54237edd49a27dfdd7e/packages/domco/src/types/public/index.ts#L29)
 
-***
+---
 
 <a id="client" name="client"></a>
 
@@ -160,9 +160,78 @@ The name of the entrypoint without extension.
 
 #### Defined in
 
-[types/public/index.ts:123](https://github.com/rossrobino/domco/blob/901651aa5239610bc8c1558f2e4c7e072bc52ee6/packages/domco/src/types/public/index.ts#L123)
+[types/public/index.ts:146](https://github.com/rossrobino/domco/blob/fde430c2d32883df987ac54237edd49a27dfdd7e/packages/domco/src/types/public/index.ts#L146)
 
-***
+---
+
+<a id="createappmiddleware" name="createappmiddleware"></a>
+
+### CreateAppMiddleware
+
+> **CreateAppMiddleware**: `object`
+
+#### Type declaration
+
+<a id="handler" name="handler"></a>
+
+##### handler
+
+> **handler**: `MiddlewareHandler`
+
+The middleware to apply.
+
+<a id="path" name="path"></a>
+
+##### path
+
+> **path**: `string`
+
+Path to apply the middleware to.
+
+#### Defined in
+
+[types/public/index.ts:7](https://github.com/rossrobino/domco/blob/fde430c2d32883df987ac54237edd49a27dfdd7e/packages/domco/src/types/public/index.ts#L7)
+
+---
+
+<a id="createappoptions" name="createappoptions"></a>
+
+### CreateAppOptions
+
+> **CreateAppOptions**: `object`
+
+#### Type declaration
+
+<a id="devserver" name="devserver"></a>
+
+##### devServer?
+
+> `optional` **devServer**: `ViteDevServer`
+
+Only used in `dev` to call the server.
+
+<a id="honooptions" name="honooptions"></a>
+
+##### honoOptions?
+
+> `optional` **honoOptions**: `HonoOptions`\<`Env`\>
+
+Passthrough options to the Hono app.
+
+<a id="middleware" name="middleware"></a>
+
+##### middleware?
+
+> `optional` **middleware**: [`CreateAppMiddleware`](globals.md#createappmiddleware)[]
+
+Middleware to be applied before any routes. Useful for adapters that need to
+inject middleware.
+
+#### Defined in
+
+[types/public/index.ts:15](https://github.com/rossrobino/domco/blob/fde430c2d32883df987ac54237edd49a27dfdd7e/packages/domco/src/types/public/index.ts#L15)
+
+---
 
 <a id="domcoconfig" name="domcoconfig"></a>
 
@@ -190,7 +259,7 @@ Defaults to `undefined` - creates a `app` build only.
 ###### Default
 
 ```ts
-undefined
+undefined;
 ```
 
 ###### Example
@@ -203,8 +272,8 @@ import { adapter } from `"domco/adapter/...";`
 
 ```ts
 // vite.config.ts
-import { defineConfig } from "vite";
 import { domco, type DomcoConfig } from "domco";
+import { defineConfig } from "vite";
 
 const config: DomcoConfig = {
 	// options...
@@ -217,9 +286,9 @@ export default defineConfig({
 
 #### Defined in
 
-[types/public/index.ts:86](https://github.com/rossrobino/domco/blob/901651aa5239610bc8c1558f2e4c7e072bc52ee6/packages/domco/src/types/public/index.ts#L86)
+[types/public/index.ts:109](https://github.com/rossrobino/domco/blob/fde430c2d32883df987ac54237edd49a27dfdd7e/packages/domco/src/types/public/index.ts#L109)
 
-***
+---
 
 <a id="domcocontextvariablemap" name="domcocontextvariablemap"></a>
 
@@ -320,7 +389,7 @@ app.get("/", (c) => {
 	const page = c.var.page();
 
 	// gets `src/route/path/+page.html`
-	const differentPage = c.var.page("/route/path")
+	const differentPage = c.var.page("/route/path");
 
 	return c.html(page);
 });
@@ -378,9 +447,9 @@ declare module "hono" {
 
 #### Defined in
 
-[types/public/index.ts:148](https://github.com/rossrobino/domco/blob/901651aa5239610bc8c1558f2e4c7e072bc52ee6/packages/domco/src/types/public/index.ts#L148)
+[types/public/index.ts:171](https://github.com/rossrobino/domco/blob/fde430c2d32883df987ac54237edd49a27dfdd7e/packages/domco/src/types/public/index.ts#L171)
 
-***
+---
 
 <a id="page-1" name="page-1"></a>
 
@@ -398,9 +467,9 @@ declare module "hono" {
 
 #### Defined in
 
-[types/public/index.ts:121](https://github.com/rossrobino/domco/blob/901651aa5239610bc8c1558f2e4c7e072bc52ee6/packages/domco/src/types/public/index.ts#L121)
+[types/public/index.ts:144](https://github.com/rossrobino/domco/blob/fde430c2d32883df987ac54237edd49a27dfdd7e/packages/domco/src/types/public/index.ts#L144)
 
-***
+---
 
 <a id="prerender" name="prerender"></a>
 
@@ -425,9 +494,9 @@ export const prerender: Prerender = ["/", "/post-1", "/post-2"];
 
 #### Defined in
 
-[types/public/index.ts:119](https://github.com/rossrobino/domco/blob/901651aa5239610bc8c1558f2e4c7e072bc52ee6/packages/domco/src/types/public/index.ts#L119)
+[types/public/index.ts:142](https://github.com/rossrobino/domco/blob/fde430c2d32883df987ac54237edd49a27dfdd7e/packages/domco/src/types/public/index.ts#L142)
 
-***
+---
 
 <a id="server-1" name="server-1"></a>
 
@@ -447,7 +516,7 @@ export const prerender: Prerender = ["/", "/post-1", "/post-2"];
 
 #### Defined in
 
-[types/public/index.ts:125](https://github.com/rossrobino/domco/blob/901651aa5239610bc8c1558f2e4c7e072bc52ee6/packages/domco/src/types/public/index.ts#L125)
+[types/public/index.ts:148](https://github.com/rossrobino/domco/blob/fde430c2d32883df987ac54237edd49a27dfdd7e/packages/domco/src/types/public/index.ts#L148)
 
 ## Functions
 
@@ -474,8 +543,8 @@ The domco Vite plugin.
 
 ```ts
 // vite.config.ts
-import { defineConfig } from "vite";
 import { domco } from "domco";
+import { defineConfig } from "vite";
 
 export default defineConfig({
 	plugins: [domco()],
@@ -484,4 +553,4 @@ export default defineConfig({
 
 #### Defined in
 
-[plugin/index.ts:31](https://github.com/rossrobino/domco/blob/901651aa5239610bc8c1558f2e4c7e072bc52ee6/packages/domco/src/plugin/index.ts#L31)
+[plugin/index.ts:31](https://github.com/rossrobino/domco/blob/fde430c2d32883df987ac54237edd49a27dfdd7e/packages/domco/src/plugin/index.ts#L31)

apps/docs/src/lib/docs/+client.ts

@@ -1,5 +1,3 @@
-import { html } from "hono/html";
-
 const headings = document.querySelectorAll("h2, h3");
 const tableOfContents = document.createElement("ul");
 tableOfContents.classList.add("overflow-hidden", "!my-0", "!pl-0");

packages/create-domco/src/template/index.ts

@@ -1,5 +1,5 @@
 const versions = {
-	domco: "0.10.0",
+	domco: "0.11.0",
 	hono: "4.5.11",
 	autoprefixer: "10.4.20",
 	prettier: "3.3.3",
@@ -118,7 +118,6 @@ lerna-debug.log*
 
 node_modules
 dist
-dist-ssr
 *.local
 
 .vercel

packages/domco/src/adapter/vercel/index.ts

@@ -1,5 +1,9 @@
 import { dirNames, headers } from "../../constants/index.js";
-import type { AdapterBuilder, AdapterEntry } from "../../types/public/index.js";
+import type {
+	AdapterBuilder,
+	AdapterEntry,
+	CreateAppMiddleware,
+} from "../../types/public/index.js";
 import { clearDir, copyClient, copyServer } from "../../util/fs/index.js";
 import { version } from "../../version/index.js";
 import type {
@@ -121,26 +125,30 @@ export const adapter: AdapterBuilder<VercelAdapterOptions | undefined> = (
 	/**
 	 * This is applied in `dev` and `preview` so users can see the src images.
 	 */
-	const imageMiddleware = createMiddleware(async (c, next) => {
-		if (resolvedOptions.images) {
-			if (c.req.path.startsWith("/_vercel/image")) {
-				const { url, w, q } = c.req.query();
-
-				if (!url) throw new Error(`Add a \`url\` query param to ${c.req.url}`);
-				if (!w) throw new Error(`Add a \`w\` query param to ${c.req.url}`);
-				if (!q) throw new Error(`Add a \`q\` query param to ${c.req.url}`);
-
-				if (!resolvedOptions.images.sizes.includes(parseInt(w))) {
-					throw new Error(
-						`\`${w}\` is not an included image size. Add \`${w}\` to \`sizes\` in your adapter config to support this width.`,
-					);
-				}
+	const imageMiddleware: CreateAppMiddleware = {
+		path: "/*",
+		handler: createMiddleware(async (c, next) => {
+			if (resolvedOptions.images) {
+				if (c.req.path.startsWith("/_vercel/image")) {
+					const { url, w, q } = c.req.query();
+
+					if (!url)
+						throw new Error(`Add a \`url\` query param to ${c.req.url}`);
+					if (!w) throw new Error(`Add a \`w\` query param to ${c.req.url}`);
+					if (!q) throw new Error(`Add a \`q\` query param to ${c.req.url}`);
 
-				return c.redirect(url);
+					if (!resolvedOptions.images.sizes.includes(parseInt(w))) {
+						throw new Error(
+							`\`${w}\` is not an included image size. Add \`${w}\` to \`sizes\` in your adapter config to support this width.`,
+						);
+					}
+
+					return c.redirect(url);
+				}
 			}
-		}
-		await next();
-	});
+			await next();
+		}),
+	};
 
 	return {
 		name: "vercel",