tabler/shared/ui/CardHeader.astro

---
import type { HTMLTag } from 'astro/types'

// Card header (.card-header) with an optional h3.card-title; slot renders after the title.

// `as` must stay out of the Props body: Astro's frontmatter scanner bails on a member
// literally named `as` and silently falls back to untyped props.
type PolymorphicProps = { as?: HTMLTag }

interface Props extends PolymorphicProps {
  title?: string
  /** card-header-light */
  light?: boolean
  class?: string
}

const { title, as: TitleTag = 'h3', light, class: className }: Props = Astro.props
---

<div class:list={['card-header', light && 'card-header-light', className]}>
  {title && <TitleTag class:list={['card-title']}>{title}</TitleTag>}
  <slot />
</div>