Game UI

"use client";

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

// ========================================
// HEALTH BAR COMPONENT
// ========================================

const pixelHealthBarVariants = cva(
  "relative border-4 border-black shadow-[4px_4px_0px_0px_rgba(0,0,0,1)]",
  {
    variants: {
      variant: {
        default: "bg-white dark:bg-[#2a2a2a]",
        outlined: "bg-transparent",
      },
      size: {
        sm: "h-6",
        md: "h-8",
        lg: "h-12",
      },
    },
    defaultVariants: {
      variant: "default",
      size: "md",
    },
  },
);

export interface PixelHealthBarProps
  extends React.HTMLAttributes<HTMLDivElement>,
    VariantProps<typeof pixelHealthBarVariants> {
  current: number;
  max: number;
  showLabel?: boolean;
  label?: string;
  color?: string;
}

const PixelHealthBar = React.forwardRef<HTMLDivElement, PixelHealthBarProps>(
  (
    {
      className,
      variant,
      size,
      current,
      max,
      showLabel = true,

// ... (more code below)