Components

Components are React files in components/**/*.tsx — yours and registry-installed ones side by side.

Every component is automatically available in every slide — no imports:

components/metric-card.tsx     ->   <MetricCard />
components/revenue-chart.tsx   ->   <RevenueChart />

Naming

The component name is the PascalCase of the filename:

metric-card.tsx          -> MetricCard
logo-cloud.tsx           -> LogoCloud
charts/revenue-line.tsx  -> RevenueLine

Names form a single flat namespace — directories are ignored. If two files map to the same name, Campfire reports a component-collision warning and the file with the shallower path wins.

Each component file should default-export its component (a named export matching the component name also works).

Base markdown rendering

Most of a deck isn't components — it's markdown. components/mdx.tsx is the file that decides how that markdown renders at slide scale. It is not a registry item: every deck needs it, so camp init scaffolds it and it is yours to edit. There is nothing to call — the runtime picks the file up automatically and applies it to every slide's markdown.

The file exports a single mdxComponents map. Each entry wraps one intrinsic element, extends its ComponentProps, and merges className through cn:

import type { ComponentProps } from "react";
import { cn } from "@/lib/utils";

export const mdxComponents = {
  h1: ({ className, ...props }: ComponentProps<"h1">) => (
    <h1 className={cn("font-bold text-7xl tracking-tight", className)} {...props} />
  ),
  p: ({ className, ...props }: ComponentProps<"p">) => (
    <p className={cn("text-2xl leading-relaxed", className)} {...props} />
  ),
};

Edit a renderer and the whole deck restyles.

What's covered

The scaffolded file styles every markdown element slides commonly use:

Add any other intrinsic element by extending the map — the file is yours.

Precedence

In the slide component map:

components/mdx.tsx  >  discovered components  >  defaults

That order also means mdxComponents can shadow a discovered component by name — handy for swapping implementations without touching slides.