chadtmiller.com/pds.js

Switch repository

Loading…

import { cva } from 'class-variance-authority';
import { cn } from '#/lib/utils.js';

const noticeVariants = cva(
  'rounded-xl border px-3.5 py-3 text-sm leading-relaxed',
  {
    variants: {
      variant: {
        info: 'border-input bg-card text-muted-foreground',
        error: 'border-destructive/40 bg-destructive-dim text-destructive',
        success: 'border-success/30 bg-success-dim text-success',
        warning: 'border-warning/30 bg-warning-dim text-warning',
      },
    },
    defaultVariants: { variant: 'info' },
  },
);

export function Notice({ className, variant, ...props }) {
  return (
    <div
      role={variant === 'error' ? 'alert' : undefined}
      className={cn(noticeVariants({ variant }), className)}
      {...props}
    />
  );
}