import React from 'react';
import { View, Input } from '@tarojs/components';
import className from 'classnames';

interface ISwitchProps {
  /** 状态 */
  checked: boolean;
  /** 禁用 */
  disabled?: boolean;
  /** 变更回调 */
  onChange?: () => void;
}

/**
 * 开关组件
 */
const Switch: React.FC<ISwitchProps> = ({
  checked = false,
  disabled = false,
  onChange = () => {},
}) => {
  const checkStyle = className(
    'switch',
    checked && 'switch-checked',
    disabled && !checked && 'disabled',
    disabled && checked && 'checked-disabled',
  );

  return (
    <View onClick={() => !disabled && onChange()} className='wm-switch-box'>
      <Input disabled className={checkStyle} />
    </View>
  );
};

export default Switch;