Behive Tech Component Registry

Site Header

v0.1.4Draft

A site header with a brand slot, navigation links and optional actions; once the header itself is at least `64rem` wide the links sit inline, and narrower a menu button opens them in a right-hand Drawer.

pnpm add @behivetech/organisms.site-header

Edit the code and the preview updates as you type. Every registry export is in scope — SiteHeader from this package, plus React hooks and every other component in the registry.

PlaygroundOpen in new tab
const LINKS = [
  { href: "/guide", label: "Guide", current: true },
  { href: "/gallery", label: "Gallery" },
  { href: "/art", label: "Art" },
  { href: "/artists", label: "Artists" },
];

const BasicSiteHeader = () => (
  <SiteHeader
    brand={<a href="/">The BEhive</a>}
    links={LINKS}
    menuLabel="Menu"
  />
);

render(<BasicSiteHeader />);