nav

Sticky-capable site header with logo, navigation links, and an optional CTA button. On mobile (< 640px) links collapse behind a burger button — clicking it reveals an overlay panel that sits on top of page content without pushing it down. Wired automatically by pulse-ui.js.

MyApp

nav({
  logo:     '<strong>MyApp</strong>',
  logoHref: '/',
  links: [
    { label: 'Features', href: '#features' },
    { label: 'Pricing',  href: '#pricing'  },
    { label: 'FAQ',      href: '#faq'      },
  ],
  action: button({ label: 'Download', size: 'sm' }),
  sticky: true,
})

Mega nav

Replace a link's href with a mega array to render a dropdown panel. Each entry is a column with an optional heading and a list of items. Items support an optional description line.

MyApp

nav({
  links: [
    { label: 'Products', mega: [
      { heading: 'Platform', items: [
        { label: 'Analytics',  href: '/analytics',  description: 'Dashboards and usage metrics' },
        { label: 'Automation', href: '/automation', description: 'Scheduled jobs and webhooks' },
      ]},
      { heading: 'Integrations', items: [
        { label: 'Supabase', href: '/supabase' },
        { label: 'Stripe',   href: '/stripe'   },
      ]},
    ]},
    { label: 'Pricing', href: '/pricing' },
  ],
})

Mobile view

At < 640px the links and action are hidden and replaced with a burger button. The panel opens as an overlay — no layout shift.

MyApp

Tap the burger to open the overlay

Burger on the left

Set burgerAlign: 'left' to place the burger before the logo — common in app-style layouts.

MyApp

Burger on the left — logo stays right

Prop	Type	Default	Description
`logo`	string (HTML)	—	Raw HTML slot — SVG, img, or text
`logoHref`	string	'/'
`links`	array	[]	`{ label, href }[]` or `{ label, mega: Column[] }`
`action`	string (HTML)	—	Raw HTML slot — shown in desktop bar and mobile menu
`sticky`	boolean	false	position: sticky with backdrop blur
`burgerAlign`	string	'right'	'right' or 'left' — mobile burger position

Mega nav column

Prop	Type	Description
`heading`	string	Optional column heading (uppercase label)
`items`	array	`{ label, href, description? }[]`