Aedis UI

Breadcrumb

Where a page sits in the site.

Installation

Once per app, set up Aedis UI. The CLI verifies the signed release before writing anything and pins every dependency:

npx @aedis/cli@0.1.0 init

Import the theme once in your global CSS, after Tailwind:

app/globals.css
@import "tailwindcss";@import "./styles/aedis-theme.css";

Then add the component:

npx @aedis/cli@0.1.0 add breadcrumb# pnpm dlx @aedis/cli@0.1.0 add breadcrumb · yarn dlx @aedis/cli@0.1.0 add breadcrumb · bunx @aedis/cli@0.1.0 add breadcrumb

Props

PropTypeDefaultDescription
BreadcrumbLink hrefstring—Goes through safeUrl; pass render={<Link />} for a router link.
BreadcrumbPagespan—The current page, with aria-current="page".
labelsPartial<BreadcrumbLabels>—label (landmark), more (ellipsis).

Security

  • Every href goes through safeUrl; external links get noopener noreferrer and a marker.