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

Beans' product component library

import * as React from 'react';
import { classNames, useUncontrolled } from '@/utils';
import { CheckboxGroupProvider } from './CheckboxGroup.context';
export const CheckboxGroup = React.forwardRef((props, ref) => {
    const { title, children, className, value, defaultValue, onChange, orientation = 'vertical' } = props;
    const [internalValue, setInternalValue] = useUncontrolled({
        value,
        defaultValue,
        finalValue: [],
        onChange,
    });
    const handleChange = (event) => {
        const itemValue = event.currentTarget.value;
        setInternalValue(internalValue.includes(itemValue)
            ? internalValue.filter((item) => item !== itemValue)
            : [...internalValue, itemValue]);
    };
    return (React.createElement(CheckboxGroupProvider, { value: { value: internalValue, onChange: handleChange } },
        React.createElement("p", null, title),
        React.createElement("div", { ref: ref, className: classNames('option-list checkbox', { 'items-group': orientation === 'horizontal' }, className) }, children)));
});
CheckboxGroup.displayName = 'CheckboxGroup';