Macro

Macros are small compile-time modules that are transformed out when being installed.

This is useful for writing a component file once, and adopt to consumer's framework once installed.

Default Macros

Fuma CLI comes with a few pre-built macros.

`$routeHandler()`

Framework-agnostic HTTP request handler.

src/post-route.ts

import { $routeHandler } from "fuma-cli/macros/route-handler";

export const handler = $routeHandler(
  { methods: ["GET", "POST"], params: ["id"] },
  async (req, params) => {
    return Response.json({ id: params.id });
  },
);

The first parameter must be analyzable as literals in the AST.

Option	Description
`methods`	Non-empty array of HTTP method strings (e.g. `"GET"`, `"POST"`).
`params`	A list of path parameters.
`catchAll`	Name for the catch-all / splat parameter.

Reserved Variables

Avoid naming the parameters args or ctx.

Describe the route in its rule, and add the file to a component:

const registry: Registry = {
  name: "acme-ui",
  dir: "src",
  components: {
    posts: ["posts.tsx", "post-route.ts"],
  },
  files: {
    "post-route.ts": {
      type: "route-handler",
      route: "api/posts/[id]", // see below for correct format
    },
    "posts.tsx": { type: "components" },
  },
};

The route field defines the actual route to handle requests, its format is same as Next.js App Router (without the extra route.ts).

Route Format	Example	Description
Static path	`api/posts`	Matches requests to `/api/posts`
Dynamic parameter	`api/posts/[id]`	Matches requests to `/api/posts/123`, exposes `params.id`
Multiple parameters	`api/posts/[postId]/[commentId]`	Matches `/api/posts/1/2`, exposes `params.postId` and `params.commentId`
Catch-all (splat) segment	`api/posts/[...slug]`	Matches `/api/posts/a/b/c`, exposes `params.slug` as array
Optional catch-all segment	`api/posts/[[...slug]]`	Matches `/api/posts` or `/api/posts/a/b`, exposes `params.slug`

Macro

Default Macros

$routeHandler()

On this page

`$routeHandler()`