Files
piratepoet/assets/js/src/common/form/toggle/toggle.tsx
Ján Mikláš 7517baeea8 Add disabled states for form control components
[MAILPOET-2773]
2020-05-25 15:52:18 +02:00

33 lines
699 B
TypeScript

import React, { InputHTMLAttributes } from 'react';
import classnames from 'classnames';
type Props = InputHTMLAttributes<HTMLInputElement> & {
dimension?: 'small',
onCheck: (isChecked: boolean) => void,
};
const Toggle = ({
dimension,
onCheck,
...attributes
}: Props) => (
<label
className={
classnames({
'mailpoet-form-toggle': true,
[`mailpoet-form-toggle-${dimension}`]: dimension,
'mailpoet-disabled': attributes.disabled,
})
}
>
<input
type="checkbox"
onChange={(e) => onCheck(e.target.checked)}
{...attributes}
/>
<span className="mailpoet-form-toggle-control" />
</label>
);
export default Toggle;