wix-style-react/dist/es/src/Button/Button.js

wix-style-react

import React, { PureComponent } from 'react';
import Ellipsis from '../common/Ellipsis';
import { TooltipCommonProps } from '../common/PropTypes/TooltipCommon';
import { generateDataAttr } from '../utils/generateDataAttr';
import { classes, st } from './Button.st.css';
import PropTypes from 'prop-types';
import { WixStyleReactDefaultsOverrideContext, } from '../WixStyleReactDefaultsOverrideProvider';
import { WixStyleReactContext } from '../WixStyleReactProvider/context';
import deprecationLog from '../utils/deprecationLog';
import ButtonCore from './ButtonCore';
class Button extends PureComponent {
    constructor(props) {
        super(props);
        this.button = React.createRef();
        /**
         * Sets focus on the element
         */
        this.focus = () => {
            this.button.current && this.button.current.focus();
        };
        if (props.skin === 'inverted') {
            deprecationLog('<Button/> - skin="inverted" is deprecated and will be removed in next major version, please use skin="standard" and priority="secondary" instead');
        }
    }
    render() {
        const { button: buttonPropsDefaults } = this
            .context;
        const { skin = 'standard', priority = 'primary', size = buttonPropsDefaults.size, className, fullWidth, children, dataHook, ellipsis, showTooltip, tooltipProps = {}, ...rest } = this.props;
        return (React.createElement(WixStyleReactContext.Consumer, null, ({ newColorsBranding }) => (React.createElement(Ellipsis, { ellipsis: ellipsis, showTooltip: showTooltip, ...tooltipProps, render: ({ ref, ellipsisClasses }) => (React.createElement(ButtonCore, { ...rest, ...generateDataAttr({
                    ...this.props,
                    size,
                }, ['skin', 'size', 'priority']), ref: this.button, className: st(classes.root, {
                    fluid: !!fullWidth,
                    skin,
                    priority,
                    size,
                    ellipsis: !!ellipsis,
                    newColorsBranding,
                }, className), "data-hook": dataHook, contentClassName: ellipsisClasses(), contentRef: ref }, children)) }))));
    }
}
Button.contextType = WixStyleReactDefaultsOverrideContext;
Button.displayName = 'Button';
Button.propTypes = {
    as: PropTypes.oneOfType([
        PropTypes.func,
        PropTypes.object,
        PropTypes.string,
    ]),
    className: PropTypes.string,
    skin: PropTypes.oneOf([
        'standard',
        'inverted',
        'destructive',
        'premium',
        'dark',
        'light',
        'transparent',
        'premium-light',
        'ai',
    ]),
    priority: PropTypes.oneOf(['primary', 'secondary']),
    size: PropTypes.oneOf(['tiny', 'small', 'medium', 'large']),
    onClick: PropTypes.func,
    fullWidth: PropTypes.bool,
    suffixIcon: PropTypes.element,
    prefixIcon: PropTypes.element,
    disabled: PropTypes.bool,
    children: PropTypes.node,
    dataHook: PropTypes.string,
    ellipsis: PropTypes.bool,
    showTooltip: PropTypes.bool,
    tooltipProps: PropTypes.shape(TooltipCommonProps),
};
export default Button;
//# sourceMappingURL=Button.js.map