// Adapted from Untitled UI React (MIT). See THIRD_PARTY_NOTICES.md.
import type { ComponentProps } from "react";

export function EmptyState({
  className = "",
  ...props
}: ComponentProps<"section">) {
  return <section {...props} className={`ynr-empty-state ${className}`} />;
}

export function EmptyStateIcon({
  className = "",
  ...props
}: ComponentProps<"div">) {
  return (
    <div
      {...props}
      aria-hidden={props["aria-label"] ? undefined : true}
      className={`ynr-empty-state-icon ${className}`}
    />
  );
}

export function EmptyStateTitle({
  className = "",
  ...props
}: ComponentProps<"h2">) {
  return <h2 {...props} className={`ynr-empty-state-title ${className}`} />;
}

export function EmptyStateDescription({
  className = "",
  ...props
}: ComponentProps<"p">) {
  return (
    <p {...props} className={`ynr-empty-state-description ${className}`} />
  );
}

export function EmptyStateActions({
  className = "",
  ...props
}: ComponentProps<"div">) {
  return <div {...props} className={`ynr-empty-state-actions ${className}`} />;
}