/**
 * Hamster wheel loading animation.
 * From Uiverse.io by Nawsome — converted to React component.
 */
import React from 'react';

interface HamsterLoaderProps {
  size?: 'sm' | 'md' | 'lg';
  className?: string;
}

const SIZE_MAP = {
  sm: '8px',
  md: '14px',
  lg: '20px',
};

export function HamsterLoader({ size = 'md', className = '' }: HamsterLoaderProps) {
  return (
    <div
      aria-label="Loading"
      role="status"
      className={`wheel-and-hamster ${className}`}
      style={{ fontSize: SIZE_MAP[size] }}
    >
      <div className="wheel" />
      <div className="hamster">
        <div className="hamster__body">
          <div className="hamster__head">
            <div className="hamster__ear" />
            <div className="hamster__eye" />
            <div className="hamster__nose" />
          </div>
          <div className="hamster__limb hamster__limb--fr" />
          <div className="hamster__limb hamster__limb--fl" />
          <div className="hamster__limb hamster__limb--br" />
          <div className="hamster__limb hamster__limb--bl" />
          <div className="hamster__tail" />
        </div>
      </div>
      <div className="spoke" />
    </div>
  );
}