@ozen-ui/kit/__inner__/esm/components/Checkbox/Checkbox.js

React component library

import { __assign, __rest } from "tslib";
import './Checkbox.css';
import React, { forwardRef, useContext } from 'react';
import { useDeprecatedComponent } from '../../hooks/useDeprecated';
import { useThemeProps } from '../../hooks/useThemeProps';
import { cn } from '../../utils/classname';
import { CheckboxGroupContext } from '../CheckboxGroup/CheckboxGroupContext';
import { FormControlLabel } from '../FormControlLabel';
import { CheckboxIcon } from './components';
import { CHECKBOX_DEFAULT_ALIGN, CHECKBOX_DEFAULT_LABEL_PLACEMENT, CHECKBOX_DEFAULT_SIZE, } from './constants';
export var cnCheckbox = cn('Checkbox');
/**
 * @deprecated Компонент устарел. Для замены используйте компонент CheckboxNext
 */
export var Checkbox = forwardRef(function (inProps, ref) {
    useDeprecatedComponent('Checkbox');
    var props = useThemeProps({
        props: inProps,
        name: 'Checkbox',
    });
    var _a = props.align, align = _a === void 0 ? CHECKBOX_DEFAULT_ALIGN : _a, _b = props.labelPlacement, labelPlacement = _b === void 0 ? CHECKBOX_DEFAULT_LABEL_PLACEMENT : _b, _c = props.size, sizeProp = _c === void 0 ? CHECKBOX_DEFAULT_SIZE : _c, className = props.className, label = props.label, labelProps = props.labelProps, disabled = props.disabled, checkedProp = props.checked, inputRef = props.inputRef, indeterminate = props.indeterminate, nameProp = props.name, onChangeProp = props.onChange, other = __rest(props, ["align", "labelPlacement", "size", "className", "label", "labelProps", "disabled", "checked", "inputRef", "indeterminate", "name", "onChange"]);
    var checked = checkedProp;
    var name = nameProp;
    var size = sizeProp;
    var checkboxGroup = useContext(CheckboxGroupContext);
    if (checkboxGroup) {
        if (checked === undefined && checkboxGroup.value) {
            checked = checkboxGroup === null || checkboxGroup === void 0 ? void 0 : checkboxGroup.value.includes(other === null || other === void 0 ? void 0 : other.value);
        }
        if (name === undefined && checkboxGroup.name) {
            name = checkboxGroup.name;
        }
        if (inProps.size === undefined && checkboxGroup.size) {
            size = checkboxGroup.size;
        }
    }
    var onChange = function (event) {
        onChangeProp === null || onChangeProp === void 0 ? void 0 : onChangeProp(event);
        checkboxGroup === null || checkboxGroup === void 0 ? void 0 : checkboxGroup.onChange(event);
    };
    return (React.createElement(FormControlLabel, __assign({ label: label, size: size, labelPlacement: labelPlacement, disabled: disabled, align: align, className: className, ref: ref }, labelProps),
        React.createElement("span", { className: cnCheckbox({
                size: size,
                disabled: disabled,
                checked: checked,
                indeterminate: indeterminate,
            }) },
            React.createElement("input", __assign({ type: "checkbox", className: cnCheckbox('Input'), disabled: disabled, checked: checked, onChange: onChange, name: name }, other, { ref: inputRef })),
            React.createElement("span", { className: cnCheckbox('Box') },
                React.createElement(CheckboxIcon, { indeterminate: indeterminate, className: cnCheckbox('Icon') })))));
});
Checkbox.displayName = 'Checkbox';