import styles from './SectionHeader.module.css'
import type { ReactNode } from 'react'

interface SectionHeaderProps {
  children: ReactNode
  action?: ReactNode
  className?: string
}

export function SectionHeader({ children, action, className }: SectionHeaderProps) {
  return (
    <div className={`${styles.header} ${className ?? ''}`}>
      <span className={styles.label}>{children}</span>
      {action && <span className={styles.action}>{action}</span>}
    </div>
  )
}
