All files / src/components/ui/toast index.tsx

100% Statements 48/48
100% Branches 2/2
100% Functions 1/1
100% Lines 48/48

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 491x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 6x 6x 6x 6x 6x 6x 6x 6x  
import { cva, VariantProps } from 'class-variance-authority';
 
import { Icon } from '@/components/icon';
import { cn } from '@/lib/utils';
 
const toastVariants = cva(
  'text-text-sm-semibold flex flex-row items-center gap-2 rounded-2xl px-6 py-3.5',
  {
    variants: {
      type: {
        info: 'text-mono-white bg-[#0D2D3A]/80 justify-center',
        success: 'text-mono-white bg-[#0D2D3A]/80 justify-center',
        // error: 'text-mono-white bg-red-600',
        // warning: 'text-mono-white bg-yellow-600',
      },
      offset: {
        default: 'mb-4',
        button: 'mb-21',
      },
    },
    defaultVariants: {
      type: 'info',
      offset: 'default',
    },
  },
);
 
const toastIcons = {
  info: '',
  success: 'congratulate',
  // error: 'alert-circle',
  // warning: 'alert-triangle',
} as const;
 
interface Props extends VariantProps<typeof toastVariants> {
  className?: string;
  children: React.ReactNode;
}
 
export const Toast = ({ type, offset, className, children }: Props) => {
  const iconId = type && toastIcons[type as keyof typeof toastIcons];
  return (
    <div className={cn(toastVariants({ type, offset }), className)}>
      {iconId && <Icon id={iconId} className='size-6' />}
      {children}
    </div>
  );
};