@trellixio/roaster-coffee/lib/components/Checkbox/Checkbox.js

Beans' product component library

import * as React from 'react';
import { classNames, useUid } from '@/utils';
import { CheckboxGroup } from './CheckboxGroup/CheckboxGroup';
import { useCheckboxGroupContext } from './CheckboxGroup/CheckboxGroup.context';
export const Checkbox = React.forwardRef((props, ref) => {
    const { id, label, name, disabled, value, labelClassName, inputClassName, isRichSelector, checked, onChange } = props;
    const ctx = useCheckboxGroupContext();
    const uid = useUid(id);
    const contextProps = ctx
        ? {
            checked: ctx.value.includes(value),
            onChange: ctx.onChange,
        }
        : {
            checked,
            onChange: (event) => {
                onChange === null || onChange === void 0 ? void 0 : onChange(event.target.checked);
            },
        };
    return (React.createElement("label", { htmlFor: uid, className: classNames(labelClassName, { selector: isRichSelector, selected: contextProps.checked }) },
        React.createElement("input", { value: value, ref: ref, type: "checkbox", name: name, id: uid, disabled: disabled, checked: contextProps.checked, onChange: contextProps.onChange, className: inputClassName }),
        React.createElement("span", { className: classNames('input-checkbox', inputClassName) }),
        React.createElement("div", { className: "content" }, label)));
});
Checkbox.displayName = 'Checkbox';
Checkbox.Group = CheckboxGroup;