import { type ReactNode } from "react";

interface WarningBannerProps {
  children: ReactNode;
  action?: ReactNode;
}

export function WarningBanner({ children, action }: WarningBannerProps) {
  return (
    <div
      role="status"
      className="flex flex-wrap items-start justify-between gap-3 rounded-md border-l-4 border-warning bg-amber-50 p-4 text-sm text-warning"
    >
      <div>{children}</div>
      {action}
    </div>
  );
}