Global site or application header. Provides three optional slot regions — `top`, default (middle), and `bottom` — for...

Global site or application header. Provides three optional slot regions — `top`, default (middle), and `bottom` — for layering content vertically. For most applications, compose an `ed-layout-container` inside the default slot with a flex row containing your logo/title and an `ed-primary-nav`. See the **AppHeader** story for the recommended smart-default pattern.

<ed-header></ed-header>

Slots

Name Description
- The primary header content (logo, navigation, actions)
top Optional region above the main row (e.g. alert bar)
bottom Optional region below the main row (e.g. breadcrumbs)

Interactive Documentation

Full interactive examples, variant previews, accessibility audits, and the complete API reference are available in Storybook — generated directly from the component source code.

Source

packages/eddie-web-components/components/header/header.ts