Add checkbox component

Signed-off-by: Ajay Bura <ajbura@gmail.com>
This commit is contained in:
Ajay Bura 2021-12-30 11:37:18 +05:30
parent fd9f734de1
commit d3dcb320f4
2 changed files with 67 additions and 0 deletions

View file

@ -0,0 +1,30 @@
import React from 'react';
import PropTypes from 'prop-types';
import './Checkbox.scss';
function Checkbox({ variant, isActive, onToggle }) {
const className = `checkbox checkbox-${variant}${isActive ? ' checkbox--active' : ''}`;
if (onToggle === null) return <span className={className} />;
return (
// eslint-disable-next-line jsx-a11y/control-has-associated-label
<button
onClick={() => onToggle(!isActive)}
className={className}
type="button"
/>
);
}
Checkbox.defaultProps = {
variant: 'primary',
isActive: false,
onToggle: null,
};
Checkbox.propTypes = {
variant: PropTypes.oneOf(['primary', 'positive', 'caution', 'danger']),
isActive: PropTypes.bool,
onToggle: PropTypes.func,
};
export default Checkbox;