import { _ as __rest } from './tslib.es6-es.js';
import React__default, { createContext, useContext } from 'react';
import { Link } from 'react-router-dom';
import classnames from 'classnames';
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, }) {
    const iconSize = size === "large" ? "base" : size;
    return (React__default.createElement(React__default.Fragment, null,
        icon && !iconOnRight && (React__default.createElement(ButtonIcon, { name: icon, size: iconSize, 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: iconSize, 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))));
}
// eslint-disable-next-line max-statements
function ButtonWrapper(props) {
    const { ariaControls, ariaHaspopup, ariaExpanded, ariaLabel, "aria-controls": ariaControlsProp, "aria-haspopup": ariaHaspopupProp, "aria-expanded": ariaExpandedProp, "aria-label": ariaLabelProp, disabled = false, external, id, name, onClick, onMouseDown, loading, role, value, submit, fullWidth: _fullWidth, icon: _icon, iconOnRight: _iconOnRight, label: _label, size: _size, to, type: _type, url, variation: _variation, UNSAFE_className = {}, UNSAFE_style = {}, children, className, style, ref, onKeyDown, onKeyUp, onFocus, onBlur, onPointerDown, onPointerUp, onPointerEnter, onPointerLeave, onMouseEnter, onMouseLeave, onTouchStart, onTouchEnd, onContextMenu, tabIndex, title } = props, rest = __rest(props, ["ariaControls", "ariaHaspopup", "ariaExpanded", "ariaLabel", "aria-controls", "aria-haspopup", "aria-expanded", "aria-label", "disabled", "external", "id", "name", "onClick", "onMouseDown", "loading", "role", "value", "submit", "fullWidth", "icon", "iconOnRight", "label", "size", "to", "type", "url", "variation", "UNSAFE_className", "UNSAFE_style", "children", "className", "style", "ref", "onKeyDown", "onKeyUp", "onFocus", "onBlur", "onPointerDown", "onPointerUp", "onPointerEnter", "onPointerLeave", "onMouseEnter", "onMouseLeave", "onTouchStart", "onTouchEnd", "onContextMenu", "tabIndex", "title"]);
    const { combined } = useButtonStyles(props);
    const isLinkButton = Boolean(url || to);
    const buttonClassNames = classnames(combined, UNSAFE_className.container, className);
    const sharedTagProps = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, rest), { className: buttonClassNames, id, style: Object.assign(Object.assign({}, style), UNSAFE_style.container) }), (!disabled && {
        onClick: (event) => {
            onClick === null || onClick === void 0 ? void 0 : onClick(event);
        },
    })), (!disabled && {
        onMouseDown: (event) => {
            onMouseDown === null || onMouseDown === void 0 ? void 0 : onMouseDown(event);
        },
    })), (external && {
        target: "_blank",
        rel: "noopener noreferrer",
    })), { "aria-disabled": disabled && isLinkButton ? true : undefined, "aria-controls": ariaControls !== null && ariaControls !== void 0 ? ariaControls : ariaControlsProp, "aria-haspopup": ariaHaspopup !== null && ariaHaspopup !== void 0 ? ariaHaspopup : ariaHaspopupProp, "aria-busy": loading, "aria-expanded": ariaExpanded !== null && ariaExpanded !== void 0 ? ariaExpanded : ariaExpandedProp, "aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : ariaLabelProp, role,
        tabIndex,
        title,
        onKeyDown,
        onKeyUp,
        onFocus,
        onBlur,
        onPointerDown,
        onPointerUp,
        onPointerEnter,
        onPointerLeave,
        onMouseEnter,
        onMouseLeave,
        onTouchStart,
        onTouchEnd,
        onContextMenu });
    const buttonInternals = children || React__default.createElement(ButtonContent, Object.assign({}, props));
    if (to) {
        return (React__default.createElement(Link, Object.assign({}, sharedTagProps, { to: to }), buttonInternals));
    }
    if (url) {
        return (React__default.createElement("a", Object.assign({}, sharedTagProps, { ref: ref, href: !disabled ? url : undefined }), buttonInternals));
    }
    return (React__default.createElement("button", Object.assign({}, sharedTagProps, { ref: ref, type: submit ? "submit" : "button", disabled: disabled }, (submit ? { name, value } : {})), buttonInternals));
}
Button.Label = ButtonLabel;
Button.Icon = ButtonIcon;

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