Pixelact Spinner

1import { cn } from "@/lib/utils";
2 
3function Spinner({ className, ...props }: React.ComponentProps<"svg">) {
4  return (
5    <svg
6      xmlns="http://www.w3.org/2000/svg"
7      width="32"
8      height="32"
9      viewBox="0 0 24 24"
10      className={cn(
11        "animate-[hourglassFlip_3s_ease-in-out_infinite]",
12        className
13      )}
14      {...props}
15    >
16      <defs>
17        <style>{`
18          @keyframes hourglassFlip {
19            0% { transform: rotate(0deg); }
20            20% { transform: rotate(180deg); }
21            50% { transform: rotate(180deg); }
22            70% { transform: rotate(360deg); }
23            100% { transform: rotate(360deg); }
24          }
25        `}</style>
26      </defs>
27      <path
28        fill="currentColor"
29        d="M18 2H6v6h2v2h2v4H8v2H6v6h12v-6h-2v-2h-2v-4h2V8h2zm-2 6h-2v2h-4V8H8V4h8zm-2 6v2h2v4H8v-4h2v-2z"
30      />
31    </svg>
32  );
33}
34 
35export { Spinner };