@yandex/ui/esm/ButtonGroup/ButtonGroup.js

Yandex UI components

import { __assign, __rest } from "tslib";
import React, { cloneElement, Children, isValidElement, } from 'react';
import { cn } from '@bem-react/classname';
import './ButtonGroup.css';
export var cnButtonGroup = cn('ButtonGroup');
/**
 * Компонент для объединения нескольких кнопок между собой
 * @param {ButtonGroupProps} props
 */
export var ButtonGroup = function (props) {
    var _a = props.as, AsComponent = _a === void 0 ? 'div' : _a, children = props.children, className = props.className, disabled = props.disabled, onClick = props.onClick, vertical = props.vertical, selected = props.selected, pin = props.pin, divider = props.divider, gap = props.gap, restProps = __rest(props, ["as", "children", "className", "disabled", "onClick", "vertical", "selected", "pin", "divider", "gap"]);
    var clonedChildren = Children.map(children, function (child, index) {
        if (!isValidElement(child)) {
            return null;
        }
        return cloneElement(child, {
            disabled: disabled || child.props.disabled,
            checked: selected && selected.indexOf(index) !== -1,
            onClick: function (event) {
                if (disabled) {
                    return;
                }
                if (child.props.onClick) {
                    child.props.onClick(event);
                }
                if (onClick) {
                    onClick(event, index);
                }
            },
        });
    });
    return (React.createElement(AsComponent, __assign({}, restProps, { role: "group", className: cnButtonGroup({ vertical: vertical, clear: Boolean(pin) }, [className]) }), !divider
        ? clonedChildren
        : clonedChildren.map(function (el, i) { return (React.createElement(React.Fragment, null,
            i > 0 && divider,
            el)); })));
};
ButtonGroup.displayName = cnButtonGroup();