Header

import { Header } from "@/components/Header";
import { Button } from "@/components/Button";
import {
  NavigationMenu,
  NavigationMenuItem,
  NavigationMenuLink,
  NavigationMenuList,
} from "@/components/ui/navigation-menu";
import {
  Popover,
  PopoverContent,
  PopoverTrigger,
} from "@/components/ui/popover";

<Header
  variant="white"
  actions={
    <div className="flex items-center gap-[var(--spacing-xxs)]">
      <NavigationMenu>
        <NavigationMenuList>
          <NavigationMenuItem>
            <NavigationMenuLink
              href="https://kaiwa.cloud/support/manual"
              target="_blank"
              rel="noopener noreferrer"
            >
              マニュアル FAQ
            </NavigationMenuLink>
          </NavigationMenuItem>
        </NavigationMenuList>
      </NavigationMenu>
      <Popover>
        <PopoverTrigger asChild>
          <Button variant="ghost" size="m">お知らせ</Button>
        </PopoverTrigger>
        <PopoverContent align="end">
          {/* お知らせ一覧 */}
        </PopoverContent>
      </Popover>
      <Button variant="ghost" size="m">ログアウト</Button>
    </div>
  }
>
  <span>デモ環境 曽川 さん</span>
  <span>(前回ログイン日時: 2026-03-19 11:03:22)</span>
</Header>