Logo

What it does

Logo is a server component that wraps everything in a Link to /. It renders an <img> from config.logoUrl if one is set, followed by a text wordmark using config.appName. If logoUrl is empty, the image is omitted and only the text wordmark shows.

Props

• size — pixel height and width of the logo image. Defaults to 28. Has no effect if logoUrl is not set.
• showWordmark — whether to show the app name next to the logo. Defaults to whatever config.showWordmark is set to. Pass false to show the logo mark only.
• className — extra CSS classes on the wrapping <Link>. Useful for spacing adjustments.

Usage

import Logo from "@/components/Logo";

<Logo />
<Logo size={40} />
<Logo showWordmark={false} />

Configuring

• logoUrl — path to your logo file in /public, e.g. "/logo.svg". Leave it as an empty string to show only the text wordmark.
• showWordmark — set to false to hide the app name globally (still overridable per-instance via the prop).
• appName — used as the alt attribute on the image and as the wordmark text.

// src/config.ts
appName: "YourApp",
logoUrl: "/logo.svg",
showWordmark: true,