import * as React from 'react';
import { cn } from '../../lib/utils';

export interface SwitchProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'onChange'> {
  checked: boolean;
  onCheckedChange?: (checked: boolean) => void;
}

export const Switch = React.forwardRef<HTMLButtonElement, SwitchProps>(
  ({ checked, className, disabled, onCheckedChange, ...props }, ref) => (
    <button
      aria-checked={checked}
      className={cn('shSwitch', className)}
      data-state={checked ? 'checked' : 'unchecked'}
      disabled={disabled}
      ref={ref}
      role="switch"
      {...props}
      type="button"
      onClick={(event) => {
        props.onClick?.(event);
        if (!event.defaultPrevented && !disabled) {
          onCheckedChange?.(!checked);
        }
      }}
    >
      <span className="shSwitchThumb" />
    </button>
  ),
);

Switch.displayName = 'Switch';