"use client";

import type { ReactNode } from "react";

interface PageHeaderProps {
  eyebrow?: string;
  title: string;
  subtitle?: string;
  actions?: ReactNode;
}

export function PageHeader({ eyebrow, title, subtitle, actions }: PageHeaderProps) {
  return (
    <header className="ks-page-header">
      <div className="ks-page-header-main">
        {eyebrow ? <p className="ks-page-eyebrow">{eyebrow}</p> : null}
        <h1 className="ks-page-title">{title}</h1>
        {subtitle ? <p className="ks-page-subtitle">{subtitle}</p> : null}
      </div>
      {actions ? <div className="ks-page-actions">{actions}</div> : null}
    </header>
  );
}