Undo Chip

"use client";

import { cva, type VariantProps } from "class-variance-authority";
import { CheckCircle2, Undo2, X } from "lucide-react";
import * as React from "react";
import { cn } from "@/lib/utils";

const undoChipVariants = cva(
  "pixel-borders border-4 border-black p-3 shadow-[4px_4px_0px_0px_rgba(0,0,0,1)] font-[family-name:var(--font-press-start)] text-xs flex items-center gap-3 animate-in slide-in-from-bottom-5 duration-0",
  {
    variants: {
      variant: {
        default:
          "bg-[#4ade80] text-black dark:bg-[#15803d] dark:text-white dark:border-[#22c55e]",
        info: "bg-[#60a5fa] text-black dark:bg-[#1e40af] dark:text-white dark:border-[#3b82f6]",
        warning:
          "bg-[#fbbf24] text-black dark:bg-[#92400e] dark:text-white dark:border-[#f59e0b]",
        error:
          "bg-[#f87171] text-black dark:bg-[#991b1b] dark:text-white dark:border-[#ef4444]",
      },
      size: {
        sm: "text-[8px] py-2 px-3 gap-2",
        md: "text-[10px] py-3 px-4 gap-3",
        lg: "text-[12px] py-4 px-5 gap-4",
      },
    },
    defaultVariants: {
      variant: "default",
      size: "md",
    },
  },
);

export interface UndoChipProps extends VariantProps<typeof undoChipVariants> {
  message: string;
  onUndo?: () => void;
  onClose?: () => void;
  duration?: number;
  showIcon?: boolean;
  showUndoIcon?: boolean;
  className?: string;
}

export function PixelUndoChip({
  message,
  onUndo,
  onClose,
  duration = 5000,
  showIcon = true,
  showUndoIcon = true,

// ... (more code below)