import React__default, { createContext, useContext } from 'react';
import { Link } from 'react-router-dom';
import classnames from 'classnames';
import { _ as __rest } from './tslib.es6-es.js';
import { I as Icon } from './Icon-es.js';
import { T as Typography } from './Typography-es.js';

var styles = {"button":"_7BLGtYNuJOU-","work":"amVSJ50CiOo-","learning":"V4GfDDF1ESI-","subtle":"MVT-qs-bO9M-","destructive":"_9YS8IK6Inew-","primary":"TrzCxs3OEpM-","disabled":"zgRx3ehZ2z8-","secondary":"QaWL8FLJ5Aw-","tertiary":"MhDYVRl8PUc-","small":"lPPuBfTJl5k-","base":"VyMJpVxCrxI-","large":"Uh29dvNk6I0-","buttonChildren":"H8uYM7Udc4o-","fullWidth":"yBId-F-geAA-","loading":"NCs-BISj1XU-","animateStripes":"M0LU-Rdq-MA-","spinning":"IHmVqV9ionc-"};

const ButtonContext = createContext({
    size: "base",
});
function ButtonProvider({ children, size = "base", }) {
    return (React__default.createElement(ButtonContext.Provider, { value: { size } }, children));
}
function useButtonContext() {
    return useContext(ButtonContext);
}

function useButtonStyles({ size: sizeProp, disabled, fullWidth, loading, variation = "work", type = "primary", }) {
    const { size: contextSize } = useButtonContext();
    const size = sizeProp || contextSize;
    const wrapper = classnames([styles.button, styles[size], styles[variation], styles[type]], {
        [styles.disabled]: disabled,
        [styles.fullWidth]: fullWidth,
        [styles.loading]: loading,
    });
    const children = styles.buttonChildren;
    return {
        wrapper,
        children,
        combined: classnames(wrapper, children),
    };
}

/**
 * For backwards compatibility with the legacy button
 * @deprecated Used composed solution instead
 */
function ButtonContent({ label, icon, size = "base", iconOnRight = false, UNSAFE_className, UNSAFE_style, }) {
    return (React__default.createElement(React__default.Fragment, null,
        icon && !iconOnRight && (React__default.createElement(ButtonIcon, { name: icon, size: size, UNSAFE_className: UNSAFE_className === null || UNSAFE_className === void 0 ? void 0 : UNSAFE_className.buttonIcon, UNSAFE_style: UNSAFE_style === null || UNSAFE_style === void 0 ? void 0 : UNSAFE_style.buttonIcon })),
        label && (React__default.createElement(ButtonLabel, { size: size, UNSAFE_className: UNSAFE_className === null || UNSAFE_className === void 0 ? void 0 : UNSAFE_className.buttonLabel, UNSAFE_style: UNSAFE_style === null || UNSAFE_style === void 0 ? void 0 : UNSAFE_style.buttonLabel }, label)),
        icon && iconOnRight && (React__default.createElement(ButtonIcon, { name: icon, size: size, UNSAFE_className: UNSAFE_className === null || UNSAFE_className === void 0 ? void 0 : UNSAFE_className.buttonIcon, UNSAFE_style: UNSAFE_style === null || UNSAFE_style === void 0 ? void 0 : UNSAFE_style.buttonIcon }))));
}
function getTypeSizes(size) {
    switch (size) {
        case "small":
            return "base";
        case "large":
            return "large";
        default:
            return "base";
    }
}
function ButtonIcon(_a) {
    var { size: sizeProp } = _a, props = __rest(_a, ["size"]);
    const { size: contextSize } = useButtonContext();
    const size = sizeProp || contextSize;
    return React__default.createElement(Icon, Object.assign({}, props, { size: size }));
}
function ButtonLabel(_a) {
    var { element = "span", fontWeight = "semiBold", fontFamily = "base", size: sizeProp } = _a, props = __rest(_a, ["element", "fontWeight", "fontFamily", "size"]);
    const { size: contextSize } = useButtonContext();
    const size = sizeProp || contextSize;
    return (React__default.createElement(Typography, Object.assign({ element: element, fontWeight: fontWeight, fontFamily: fontFamily, size: getTypeSizes(size) }, props)));
}

function Button(props) {
    const { size } = props;
    return (React__default.createElement(ButtonProvider, { size: size },
        React__default.createElement(ButtonWrapper, Object.assign({}, props))));
}
function ButtonWrapper(props) {
    const { ariaControls, ariaHaspopup, ariaExpanded, ariaLabel, disabled = false, external, id, name, onClick, onMouseDown, loading, role, value, submit, to, url, UNSAFE_className = {}, UNSAFE_style = {}, children, } = props;
    const { combined } = useButtonStyles(props);
    const buttonType = submit ? "submit" : "button";
    const buttonClassNames = classnames(combined, UNSAFE_className.container);
    const tagProps = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({ className: buttonClassNames, disabled,
        id, style: UNSAFE_style.container }, (submit && { name, value })), (!disabled && { href: url })), (!disabled && { onClick: onClick })), (!disabled && { onMouseDown: onMouseDown })), (external && {
        target: "_blank",
        rel: "noopener noreferrer",
    })), (url === undefined && to === undefined && { type: buttonType })), { "aria-controls": ariaControls, "aria-haspopup": ariaHaspopup, "aria-busy": loading, "aria-expanded": ariaExpanded, "aria-label": ariaLabel, role: role });
    const buttonInternals = children || React__default.createElement(ButtonContent, Object.assign({}, props));
    if (to) {
        return (React__default.createElement(Link, Object.assign({}, tagProps, { to: to }), buttonInternals));
    }
    const Tag = url ? "a" : "button";
    return React__default.createElement(Tag, Object.assign({}, tagProps), buttonInternals);
}
Button.Label = ButtonLabel;
Button.Icon = ButtonIcon;

export { Button as B, useButtonContext as a, useButtonStyles as u };
