import _extends from "@babel/runtime/helpers/extends";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
var _excluded = ["children", "className", "variant", "isLoading", "loadingLabel", "component"];
import React from "react";
import PropTypes from "prop-types";
import classnames from "classnames";
import CssFlex from "../../CssFlex";
import Typography from "../../Typography";
import createComponent from "../../system/createComponent";
import ButtonBase from "../ButtonBase";
import getClasses from "./styles";
import Loading from "./Loading";
var Button = /*#__PURE__*/React.forwardRef(function (props, ref) {
  var _classnames, _classnames2;

  var children = props.children,
      className = props.className,
      variant = props.variant,
      isLoading = props.isLoading,
      loadingLabel = props.loadingLabel,
      component = props.component,
      buttonProps = _objectWithoutProperties(props, _excluded);

  var classes = getClasses();
  var rootClassName = classnames(className, classes.root, (_classnames = {}, _defineProperty(_classnames, classes.outlined, variant === "secondary"), _defineProperty(_classnames, classes.contained, variant === "primary"), _classnames));
  var contentClassName = classnames(classes.content, (_classnames2 = {}, _defineProperty(_classnames2, classes.hiddenWithLabel, isLoading && loadingLabel), _defineProperty(_classnames2, classes.hiddenWithoutLabel, isLoading && !loadingLabel), _classnames2));
  var ButtonRoot = component || ButtonBase;
  return /*#__PURE__*/React.createElement(ButtonRoot, _extends({
    className: rootClassName,
    ref: ref,
    "aria-busy": isLoading,
    disabled: isLoading
  }, buttonProps), /*#__PURE__*/React.createElement(CssFlex, {
    alignItems: "center",
    gap: "sm"
  }, isLoading && /*#__PURE__*/React.createElement(Loading, {
    loadingLabel: loadingLabel
  }), typeof children === "string" ? /*#__PURE__*/React.createElement(Typography, {
    variant: "inputText",
    color: "inherit",
    className: contentClassName
  }, children) : /*#__PURE__*/React.createElement("span", {
    className: contentClassName
  }, children)));
}); // @ts-ignore

Button.propTypes = {
  component: PropTypes.elementType,
  variant: PropTypes.oneOf(["primary", "secondary"]),
  disabled: PropTypes.bool,
  isLoading: PropTypes.bool,
  loadingLabel: PropTypes.string,
  href: PropTypes.string,
  target: PropTypes.string,
  onClick: PropTypes.func,
  type: PropTypes.oneOf(["button", "reset", "submit"]),
  sx: PropTypes.object
}; // @ts-ignore

Button.defaultProps = {
  variant: "primary",
  loadingLabel: ""
};

if (process.env.NODE_ENV !== "production") {
  // @ts-ignore
  Button.displayName = "NextButton";
}

export default createComponent(Button);