import React from 'react';
import PropTypes from 'prop-types';
import { a as withNano, b as classNames } from '../chunk-566df01b.js';
import { a as classCallCheck, b as createClass, c as defineProperty, d as inherits, e as objectWithoutProperties, f as possibleConstructorReturn, g as slicedToArray, h as _typeof, i as _extends } from '../chunk-aad905a2.js';
import '../chunk-aeb80e51.js';

var styles = (function (theme) {
  var typography = theme.typography,
      transitions = theme.transitions;

  return {
    text: {
      border: 'none',
      backgroundColor: 'transparent',
      fontFamily: typography.fontFamily,
      fontSize: typography.fontSize,
      fontStyle: typography.fontStyle,
      fontStretch: typography.fontStretch,
      lineHeight: typography.lineHeight,
      letterSpacing: typography.letterSpacing,
      fontWeight: typography.fontWeightBold,
      cursor: 'pointer',
      outline: 'none',
      color: theme.palette.blue,
      '&:disabled': {
        color: theme.palette.grey90,
        '&:hover': {
          cursor: 'not-allowed'
        }
      }
    },

    button: {
      margin: 0,
      borderRadius: 4,
      border: 'none',
      fontFamily: typography.fontFamily,
      fontSize: typography.fontSize,
      fontStyle: typography.fontStyle,
      fontStretch: typography.fontStretch,
      lineHeight: typography.lineHeight,
      letterSpacing: typography.letterSpacing,
      fontWeight: typography.fontWeightBold,
      textAlign: 'center',
      padding: 10,
      cursor: 'pointer',
      outline: 'none',
      width: 'fit-content',
      display: 'flex',
      justifyContent: 'center',
      alignItems: 'center',
      alignContent: 'center',
      transition: transitions.duration.short + 'ms ' + transitions.easing.easeOut,
      '&:active': {
        boxShadow: 'inset 0 1px 8px 0 rgba(0, 0, 0, 0.08)'
      },
      '&:disabled': {
        '&:hover': {
          boxShadow: 'unset',
          cursor: 'not-allowed'
        }
      },
      '& > p': {
        fontWeight: typography.fontWeightBold
      }
    },
    secondary: {
      backgroundColor: theme.palette.white,
      border: 'solid 1px ' + theme.palette.lightBlue,
      '& > p': {
        color: theme.palette.blue
      },
      color: theme.palette.blue,
      '&:active': {
        backgroundColor: 'rgba(163, 207, 255, 0.3607843137254902)'
      },
      '&:disabled': {
        borderColor: theme.palette.grey80,
        backgroundColor: theme.palette.grey80
      }
    },
    primary: {
      backgroundColor: theme.palette.blue,
      color: theme.palette.white,
      border: 'solid 1px ' + theme.palette.blue,
      '& > p': {
        color: theme.palette.white
      },
      '&:active': {
        backgroundColor: theme.palette.darkBlue
      },
      '&:disabled': {
        backgroundColor: 'rgba(141, 175, 213, 0.98)',
        borderColor: 'rgba(141, 175, 213, 0.98)'
      }
    },
    size1: {
      fontSize: 8,
      padding: '5px 8px'
    },
    size2: {
      fontSize: 12,
      padding: '7px 11px'
    },
    size3: {
      fontSize: 14,
      padding: '10px 14px'
    },
    fullWidth: {
      width: '100%'
    },
    hoverEffect: {
      '&:hover': {
        boxShadow: theme.shadows[2]
      }
    }
  };
});

var Button = function Button(_ref) {
  var children = _ref.children,
      onClick = _ref.onClick,
      secondary = _ref.secondary,
      primary = _ref.primary,
      size = _ref.size,
      classes = _ref.classes,
      className = _ref.className,
      fullWidth = _ref.fullWidth,
      hoverEffect = _ref.hoverEffect,
      type = _ref.type,
      submit = _ref.submit,
      rest = objectWithoutProperties(_ref, ['children', 'onClick', 'secondary', 'primary', 'size', 'classes', 'className', 'fullWidth', 'hoverEffect', 'type', 'submit']);

  var getSizeClass = function getSizeClass(s) {
    if (s === 1) return classes.size1;
    if (s === 2) return classes.size2;
    if (s === 3) return classes.size3;
    return classes.size2;
  };

  return (
    // eslint-disable-next-line react/button-has-type
    React.createElement(
      'button',
      _extends({
        type: submit ? 'submit' : 'button',
        onClick: onClick,
        className: classNames(type === 'button' && classes.button, type === 'text' && classes.text, classes.app, secondary && classes.secondary, primary && classes.primary, size && getSizeClass(size), fullWidth && classes.fullWidth, type === 'button' && hoverEffect && classes.hoverEffect, className)
      }, rest),
      children
    )
  );
};

Button.defaultProps = {
  type: 'button',
  hoverEffect: true
};

Button.propTypes = {
  children: PropTypes.node,
  onClick: PropTypes.func,
  secondary: PropTypes.bool,
  primary: PropTypes.bool,
  size: PropTypes.number,
  classes: PropTypes.object,
  className: PropTypes.string,
  fullWidth: PropTypes.bool,
  hoverEffect: PropTypes.bool,
  sumbit: PropTypes.bool,
  type: PropTypes.oneOf(['button', 'text']),
  submit: PropTypes.bool
};

var Button$1 = withNano(styles)(Button);

export default Button$1;
//# sourceMappingURL=index.js.map
