/* 开关组件 - 用于切换启用/禁用状态 */

interface SwitchProps {
  checked: boolean;
  onChange?: (checked: boolean) => void;
  disabled?: boolean;
  loading?: boolean;
  className?: string;
  id?: string;
}

export function Switch({
  checked,
  onChange,
  disabled = false,
  loading = false,
  className = '',
  id
}: SwitchProps) {
  const handleClick = () => {
    if (!disabled && !loading && onChange) {
      onChange(!checked);
    }
  };

  const isDisabled = disabled || loading;

  return (
    <button
      type="button"
      id={id}
      className={`
        switch
        ${checked ? 'switch-checked' : 'switch-unchecked'}
        ${isDisabled ? 'switch-disabled' : ''}
        ${loading ? 'switch-loading' : ''}
        ${className}
      `}
      onClick={handleClick}
      disabled={isDisabled}
      aria-checked={checked}
      role="switch"
    >
      <span className={`switch-handle ${checked ? 'switch-handle-checked' : 'switch-handle-unchecked'}`}>
        {loading && <span className="switch-loading-icon"></span>}
      </span>
    </button>
  );
}