Retro Loader

"use client";

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

const pixelLoaderVariants = cva(
  "relative flex flex-col items-center justify-center p-8 border-4 border-black bg-white dark:bg-[#1a1a1a] shadow-[8px_8px_0px_0px_rgba(0,0,0,1)]",
  {
    variants: {
      variant: {
        cassette: "min-h-[300px]",
        floppy: "min-h-[300px]",
        crt: "min-h-[400px] bg-black text-[#00ff00]",
      },
      size: {
        sm: "w-[250px]",
        md: "w-[350px]",
        lg: "w-[450px]",
        full: "w-full",
      },
    },
    defaultVariants: {
      variant: "cassette",
      size: "md",
    },
  },
);

export interface PixelLoaderProps
  extends React.HTMLAttributes<HTMLDivElement>,
    VariantProps<typeof pixelLoaderVariants> {
  progress?: number;
  text?: string;
  isLoading?: boolean;
}

const PixelLoader = React.forwardRef<HTMLDivElement, PixelLoaderProps>(
  (
    {
      className,
      variant,
      size,
      progress = 0,
      text,
      isLoading = true,
      children,
      ...props
    },
    ref,

// ... (more code below)