/**
 * EmptyState — Dashed-Box + Primary-CTA (DCT Pattern, KAR-521 Stage 7)
 *
 * Brand-Verbesserung vs DCT:
 *   - DCT zeigt nur dashed box + "+ Hinzufuegen" Button ohne Erklaerung
 *   - Kadi-v2 zeigt zusaetzlich Empty-Headline + 1-Zeiler-Beschreibung
 *   - A11y: role="region" + aria-label fuer Screen-Reader-Context
 */

import * as React from "react"
import { cn } from "@/lib/utils"

export type EmptyStateVariant = "default" | "solid"

export function resolveEmptyStateClasses(variant: EmptyStateVariant): string {
  switch (variant) {
    case "solid":
      return "border border-border bg-card"
    default:
      return "border border-dashed border-border-faint bg-card/50"
  }
}

interface Props {
  title?: string
  description?: string
  action?: React.ReactNode
  icon?: React.ReactNode
  variant?: EmptyStateVariant
  className?: string
}

export default function EmptyState({
  title,
  description,
  action,
  icon,
  variant = "default",
  className,
}: Props) {
  return (
    <div
      role="region"
      aria-label={title ?? "Leer"}
      className={cn(
        "rounded-sm p-8 flex flex-col items-center justify-center gap-3 text-center min-h-[200px]",
        resolveEmptyStateClasses(variant),
        className,
      )}
    >
      {icon ? <div className="text-muted-foreground">{icon}</div> : null}
      {title ? <p className="font-display font-semibold text-base">{title}</p> : null}
      {description ? (
        <p className="text-sm text-muted-foreground max-w-md">{description}</p>
      ) : null}
      {action ? <div className="mt-2">{action}</div> : null}
    </div>
  )
}