| 1 | import type { ComponentPropsWithoutRef } from "react"; |
| 2 | |
| 3 | import { cn } from "../lib/utils"; |
| 4 | import { COLLAPSED_SIDEBAR_TITLEBAR_INSET_CLASS } from "../workspaceTitlebar"; |
| 5 | |
| 6 | /** |
| 7 | * Shared workspace top-bar geometry. The height is `!important` so callers cannot |
| 8 | * grow the bar and pull its content off the sidebar header's center line. |
| 9 | */ |
| 10 | export function WorkspacePageHeader({ |
| 11 | electron = false, |
| 12 | reserveNativeControls = electron, |
| 13 | className, |
| 14 | ...props |
| 15 | }: ComponentPropsWithoutRef<"header"> & { |
| 16 | readonly electron?: boolean; |
| 17 | readonly reserveNativeControls?: boolean; |
| 18 | }) { |
| 19 | return ( |
| 20 | <header |
| 21 | className={cn( |
| 22 | "flex h-[var(--workspace-topbar-height)]! min-h-[var(--workspace-topbar-height)]! max-h-[var(--workspace-topbar-height)]! shrink-0 items-center gap-3 pl-(--workspace-gutter-start) pr-(--workspace-gutter-end) [[data-panel-animations=true]_&]:motion-safe:transition-[padding-left,padding-right] [[data-panel-animations=true]_&]:motion-safe:duration-(--panel-animation-duration) [[data-panel-animations=true]_&]:motion-safe:ease-out", |
| 23 | electron && "drag-region", |
| 24 | reserveNativeControls && "wco:pr-(--workspace-native-controls-inset)", |
| 25 | COLLAPSED_SIDEBAR_TITLEBAR_INSET_CLASS, |
| 26 | className, |
| 27 | )} |
| 28 | {...props} |
| 29 | /> |
| 30 | ); |
| 31 | } |