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

React component library

import { __assign, __rest } from "tslib";
import './ButtonBase.css';
import React from 'react';
import { useThemeProps } from '../../hooks/useThemeProps';
import { cn } from '../../utils/classname';
import { polymorphicComponentWithRef } from '../../utils/polymorphicComponentWithRef';
import { BUTTON_BASE_DEFAULT_TAG } from './constants';
export var cnButtonBase = cn('ButtonBase');
export var ButtonBase = polymorphicComponentWithRef(function (inProps, ref) {
    var props = useThemeProps({
        props: inProps,
        name: 'Button',
    });
    var _a = props.as, Tag = _a === void 0 ? BUTTON_BASE_DEFAULT_TAG : _a, loadingProp = props.loading, disabledProp = props.disabled, children = props.children, className = props.className, onClick = props.onClick, unstyled = props.unstyled, other = __rest(props, ["as", "loading", "disabled", "children", "className", "onClick", "unstyled"]);
    var loading = Boolean(loadingProp);
    var disabled = Boolean(disabledProp || loadingProp);
    // TODO: подумать на тем, чтобы не блокировать кнопку в «заблокированном состоянии»,
    //  чтобы не терять установленный на неё фокус
    var onDisabledClick = function (event) {
        event.preventDefault();
        event.stopPropagation();
        event.nativeEvent.stopImmediatePropagation();
    };
    return (React.createElement(Tag, __assign({ disabled: disabled, onClick: disabled ? onDisabledClick : onClick }, (disabled && {
        'aria-disabled': true,
    }), { type: "button", className: cnButtonBase({
            disabled: disabled,
            loading: loading,
            unstyled: unstyled,
        }, [className]) }, (disabled && { tabIndex: -1 }), other, { ref: ref }), children));
});
ButtonBase.displayName = 'ButtonBase';