import * as React from 'react';
import classNames from 'classnames';
import { withFocusable, } from '../../common/Focusable';
import { st, classes } from './ButtonCore.st.css.js';
import { dataHooks } from './constants';
import { isStatelessComponent } from './utils';
const _addAffix = (Affix, styleClass, dataHook) => Affix &&
    React.cloneElement(Affix, {
        className: classNames(classes[styleClass], Affix.props.className),
        'data-hook': Affix.props['data-hook'] || Affix.props.dataHook || dataHook,
    });
/**
 * ButtonCore
 */
class ButtonCore extends React.Component {
    constructor() {
        super(...arguments);
        this.innerComponentRef = React.createRef();
    }
    focus() {
        if (this.innerComponentRef && this.innerComponentRef.focus) {
            this.innerComponentRef.focus();
        }
    }
    /**
     * Returns the size and position of the element
     */
    getBoundingClientRect() {
        if (this.innerComponentRef &&
            this.innerComponentRef.getBoundingClientRect) {
            return this.innerComponentRef.getBoundingClientRect();
        }
        return;
    }
    render() {
        const { as: Component, suffixIcon, prefixIcon, children, disabled, focusableOnFocus, focusableOnBlur, href, contentClassName, contentRef, onClick, onKeyDown, onKeyUp, ...rest } = this.props;
        const htmlTabIndex = rest.tabIndex || 0;
        const htmlHref = disabled ? undefined : href;
        const reference = isStatelessComponent(Component) && typeof Component !== 'string'
            ? undefined
            : (ref) => (this.innerComponentRef = ref);
        // Block action handlers when disabled (using aria-disabled instead of native disabled)
        const handleClick = disabled
            ? (e) => e.preventDefault()
            : onClick;
        const handleKeyDown = disabled
            ? (e) => {
                if (e.key === 'Enter' || e.key === ' ') {
                    e.preventDefault();
                }
            }
            : onKeyDown;
        if (!Component) {
            return null;
        }
        return (React.createElement(Component, { "data-hook": dataHooks.button, ...rest, onFocus: focusableOnFocus, onBlur: focusableOnBlur, onClick: handleClick, onKeyDown: handleKeyDown, onKeyUp: disabled ? undefined : onKeyUp, href: htmlHref, ref: reference, tabIndex: htmlTabIndex, "aria-disabled": disabled || undefined, className: st(classes.root, { disabled }, this.props.className) },
            prefixIcon && _addAffix(prefixIcon, 'prefix', dataHooks.prefixIcon),
            React.createElement("span", { className: st(classes.content, contentClassName), ref: contentRef }, children),
            suffixIcon && _addAffix(suffixIcon, 'suffix', dataHooks.suffixIcon)));
    }
}
ButtonCore.defaultProps = {
    as: 'button',
    type: 'button',
};
ButtonCore.displayName = 'ButtonCore';
export default withFocusable(ButtonCore);
//# sourceMappingURL=ButtonCore.js.map