@lunit/oui
Version:
Lunit Oncology UI components
11 lines (10 loc) • 1.25 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { forwardRef } from 'react';
import { Typography } from '@mui/material';
import clsx from 'clsx';
import { Container, StyledCheckbox } from './Checkbox.styled';
import { UncheckedIcon, CheckedIcon, IndeterminateIcon } from './Checkbox.utils';
const Checkbox = forwardRef(({ value, name, checked, defaultChecked, disabled, required, indeterminate, onChange, onChangeCapture, label, inputProps, inputRef, ...rootProps }, ref) => {
return (_jsxs(Container, { ...rootProps, className: clsx('checkbox', rootProps.className), component: label != null ? 'label' : 'span', ref: ref, children: [_jsx(StyledCheckbox, { disableRipple: true, icon: _jsx(UncheckedIcon, {}), checkedIcon: _jsx(CheckedIcon, {}), indeterminateIcon: _jsx(IndeterminateIcon, {}), value: value, name: name, checked: indeterminate ? true : checked, defaultChecked: defaultChecked, disabled: disabled, required: required, indeterminate: indeterminate, onChange: onChange, onChangeCapture: onChangeCapture, slotProps: { input: { ...inputProps, ref: inputRef } } }), label && (_jsx(Typography, { variant: "body5", sx: { display: 'flex', alignItems: 'center' }, children: label }))] }));
});
export default Checkbox;