@ntragas/pouncejstest/dist/cjs/components/Button/Button.js

A collection of UI components from Panther labs

"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

exports.__esModule = true;
exports.default = exports.Button = void 0;

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));

var React = _interopRequireWildcard(require("react"));

var _AbstractButton = _interopRequireDefault(require("../AbstractButton"));

var _useButtonStyles = _interopRequireDefault(require("./useButtonStyles"));

var _Spinner = _interopRequireDefault(require("../Spinner"));

var _Icon = _interopRequireDefault(require("../Icon"));

/**
 * Extends <a href="/#/Box">Box</a>
 *
 * The core re-usable button that you will use in the app.
 */
var Button = /*#__PURE__*/React.forwardRef(function Button(_ref, ref) {
  var _ref$size = _ref.size,
      size = _ref$size === void 0 ? 'large' : _ref$size,
      _ref$variant = _ref.variant,
      variant = _ref$variant === void 0 ? 'solid' : _ref$variant,
      _ref$variantColor = _ref.variantColor,
      variantColor = _ref$variantColor === void 0 ? 'blue' : _ref$variantColor,
      _ref$loading = _ref.loading,
      loading = _ref$loading === void 0 ? false : _ref$loading,
      _ref$fullWidth = _ref.fullWidth,
      fullWidth = _ref$fullWidth === void 0 ? false : _ref$fullWidth,
      _ref$iconAlignment = _ref.iconAlignment,
      iconAlignment = _ref$iconAlignment === void 0 ? 'left' : _ref$iconAlignment,
      active = _ref.active,
      icon = _ref.icon,
      children = _ref.children,
      rest = (0, _objectWithoutPropertiesLoose2.default)(_ref, ["size", "variant", "variantColor", "loading", "fullWidth", "iconAlignment", "active", "icon", "children"]);
  var styles = (0, _useButtonStyles.default)({
    variantColor,
    variant,
    size
  });
  var iconSize = size === 'large' ? 'medium' : 'small';
  return /*#__PURE__*/React.createElement(_AbstractButton.default, (0, _extends2.default)({
    "aria-pressed": active !== undefined ? active : undefined,
    "data-active": active || undefined,
    width: fullWidth ? '100%' : 'auto'
  }, styles, rest, {
    ref: ref
  }), icon && iconAlignment === 'left' && !loading && /*#__PURE__*/React.createElement(_Icon.default, {
    size: iconSize,
    ml: -1,
    mr: 2,
    type: icon
  }), loading && /*#__PURE__*/React.createElement(_Spinner.default, {
    size: "small",
    mr: 2
  }), children, icon && iconAlignment === 'right' && !loading && /*#__PURE__*/React.createElement(_Icon.default, {
    size: iconSize,
    mr: -1,
    ml: 3,
    type: icon
  }));
});
exports.Button = Button;
var _default = Button;
exports.default = _default;