@i-novus/ui-core/dist/data-entry/Radio/RadioButton.js

Базовые UI компоненты

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { forwardRef, useMemo, useState } from 'react';
import classNames from 'classnames';
import { useConfigProvider } from '../../core';
import { useRadioGroupContext } from './RadioGroup';
import { createUniqueId } from './helpers';
export const RadioButton = forwardRef((props, ref) => {
    const { children, prefix, id: optionId, className, onChange, style, visible = true, ...restProps } = props;
    const { getPrefix } = useConfigProvider();
    const prefixCls = getPrefix(prefix);
    const [inputId] = useState(createUniqueId('input-'));
    const radioButtonPrefix = useMemo(() => `${prefixCls}-radio-button`, [prefixCls]);
    const groupContext = useRadioGroupContext();
    const radioProps = {
        ...restProps,
        name: groupContext.name || restProps.name,
        disabled: restProps.disabled || groupContext.disabled,
        checked: optionId === (groupContext.value || groupContext.defaultValue),
        readOnly: restProps.readOnly || groupContext.readOnly,
    };
    const onRadioButtonChange = (event) => {
        onChange?.(optionId, event);
        groupContext?.onChange?.(optionId, event);
    };
    const labelClassName = useMemo(() => classNames(className, radioButtonPrefix, {
        [`${radioButtonPrefix}_unchecked`]: !radioProps.checked,
        [`${radioButtonPrefix}_checked`]: radioProps.checked,
        [`${radioButtonPrefix}_disabled`]: radioProps.disabled,
        [`${radioButtonPrefix}_readonly`]: radioProps.readOnly,
    }), [className, radioButtonPrefix, radioProps.checked, radioProps.disabled, radioProps.readOnly]);
    if (!visible) {
        return null;
    }
    return (_jsxs("label", { className: labelClassName, htmlFor: inputId, style: style, children: [_jsxs("div", { className: `${radioButtonPrefix}__input-wrapper`, children: [_jsx("input", { ...radioProps, ref: ref, id: inputId, type: "radio", onChange: onRadioButtonChange, className: `${radioButtonPrefix}__input`, disabled: restProps.disabled || restProps.readOnly || false }), _jsx("div", { className: `${radioButtonPrefix}__focus-element` })] }), _jsx("div", { className: `${radioButtonPrefix}__content`, children: children })] }));
});
RadioButton.displayName = 'RadioButton';