"use strict";

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

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.ButtonWithIcons = exports.ButtonSizes = exports.ButtonLevels = void 0;

var _react = _interopRequireDefault(require("react"));

var _uiIcons = require("@teamleader/ui-icons");

var _Button = _interopRequireDefault(require("./Button"));

var _default = {
  component: _Button.default,
  title: _Button.default.displayName
};
exports.default = _default;

var Wrapper = function Wrapper(_ref) {
  var children = _ref.children,
      _ref$inverse = _ref.inverse,
      inverse = _ref$inverse === void 0 ? false : _ref$inverse;
  return /*#__PURE__*/_react.default.createElement("div", {
    style: {
      minHeight: '50px',
      padding: '6px',
      display: 'flex',
      backgroundColor: inverse ? 'black' : 'transparent'
    }
  }, children);
};

var Spacer = function Spacer() {
  return /*#__PURE__*/_react.default.createElement("div", {
    style: {
      width: '12px'
    }
  });
};

var ButtonLevels = function ButtonLevels() {
  return /*#__PURE__*/_react.default.createElement("div", null, ['primary', 'secondary', 'destructive', 'timer'].map(function (level) {
    return /*#__PURE__*/_react.default.createElement(Wrapper, {
      key: level
    }, /*#__PURE__*/_react.default.createElement(_Button.default, {
      level: level
    }, level), /*#__PURE__*/_react.default.createElement(Spacer, null), /*#__PURE__*/_react.default.createElement(_Button.default, {
      level: level,
      disabled: true
    }, level, " disabled"), /*#__PURE__*/_react.default.createElement(Spacer, null), /*#__PURE__*/_react.default.createElement(_Button.default, {
      level: level,
      active: true
    }, level, " active"));
  }), /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_Button.default, {
    level: "link"
  }, "link"), /*#__PURE__*/_react.default.createElement(Spacer, null), /*#__PURE__*/_react.default.createElement(_Button.default, {
    level: "link",
    disabled: true
  }, "link disabled"), /*#__PURE__*/_react.default.createElement(Spacer, null), /*#__PURE__*/_react.default.createElement(Spacer, null), /*#__PURE__*/_react.default.createElement(_Button.default, {
    level: "link",
    active: true
  }, "link active")), ['teal', 'neutral', 'mint', 'violet', 'ruby', 'gold', 'aqua', 'white'].map(function (color) {
    return /*#__PURE__*/_react.default.createElement(Wrapper, {
      key: color,
      inverse: color === 'white'
    }, /*#__PURE__*/_react.default.createElement(_Button.default, {
      level: "outline",
      color: color
    }, "outline ", color), /*#__PURE__*/_react.default.createElement(Spacer, null), /*#__PURE__*/_react.default.createElement(_Button.default, {
      level: "outline",
      color: color,
      disabled: true
    }, "outline ", color, " disabled"), /*#__PURE__*/_react.default.createElement(Spacer, null), /*#__PURE__*/_react.default.createElement(_Button.default, {
      level: "outline",
      color: color,
      active: true
    }, "outline ", color, " active"));
  }));
};

exports.ButtonLevels = ButtonLevels;

var ButtonSizes = function ButtonSizes() {
  return /*#__PURE__*/_react.default.createElement("div", null, ['primary', 'secondary', 'destructive', 'link', 'timer'].map(function (level) {
    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, {
      key: level
    }, /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_Button.default, {
      level: level,
      size: "tiny"
    }, level, " tiny"), /*#__PURE__*/_react.default.createElement(Spacer, null), /*#__PURE__*/_react.default.createElement(_Button.default, {
      level: level,
      size: "small"
    }, level, " small"), /*#__PURE__*/_react.default.createElement(Spacer, null), /*#__PURE__*/_react.default.createElement(_Button.default, {
      level: level,
      size: "medium"
    }, level, " medium"), /*#__PURE__*/_react.default.createElement(Spacer, null), /*#__PURE__*/_react.default.createElement(_Button.default, {
      level: level,
      size: "large"
    }, level, " large")), /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_Button.default, {
      level: level,
      size: "tiny",
      fullWidth: true
    }, level, " tiny")), /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_Button.default, {
      level: level,
      size: "small",
      fullWidth: true
    }, level, " small")), /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_Button.default, {
      level: level,
      size: "medium",
      fullWidth: true
    }, level, " medium")), /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_Button.default, {
      level: level,
      size: "large",
      fullWidth: true
    }, level, " large")));
  }));
};

exports.ButtonSizes = ButtonSizes;

var ButtonWithIcons = function ButtonWithIcons() {
  return /*#__PURE__*/_react.default.createElement("div", null, ['primary', 'secondary', 'destructive', 'link', 'timer'].map(function (level) {
    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, {
      key: level
    }, /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(_Button.default, {
      level: level,
      size: "tiny",
      icon: /*#__PURE__*/_react.default.createElement(_uiIcons.IconAddSmallOutline, null)
    }, level, " tiny"), /*#__PURE__*/_react.default.createElement(Spacer, null), /*#__PURE__*/_react.default.createElement(_Button.default, {
      level: level,
      size: "small",
      icon: /*#__PURE__*/_react.default.createElement(_uiIcons.IconAddSmallOutline, null)
    }, level, " small"), /*#__PURE__*/_react.default.createElement(Spacer, null), /*#__PURE__*/_react.default.createElement(_Button.default, {
      level: level,
      size: "medium",
      icon: /*#__PURE__*/_react.default.createElement(_uiIcons.IconAddMediumOutline, null)
    }, level, " medium"), /*#__PURE__*/_react.default.createElement(Spacer, null), /*#__PURE__*/_react.default.createElement(_Button.default, {
      level: level,
      size: "large",
      icon: /*#__PURE__*/_react.default.createElement(_uiIcons.IconAddMediumOutline, null)
    }, level, " large")), /*#__PURE__*/_react.default.createElement(Wrapper, {
      key: level
    }, /*#__PURE__*/_react.default.createElement(_Button.default, {
      level: level,
      size: "tiny",
      icon: /*#__PURE__*/_react.default.createElement(_uiIcons.IconAddSmallOutline, null),
      iconPlacement: "right"
    }, level, " tiny"), /*#__PURE__*/_react.default.createElement(Spacer, null), /*#__PURE__*/_react.default.createElement(_Button.default, {
      level: level,
      size: "small",
      icon: /*#__PURE__*/_react.default.createElement(_uiIcons.IconAddSmallOutline, null),
      iconPlacement: "right"
    }, level, " small"), /*#__PURE__*/_react.default.createElement(Spacer, null), /*#__PURE__*/_react.default.createElement(_Button.default, {
      level: level,
      size: "medium",
      icon: /*#__PURE__*/_react.default.createElement(_uiIcons.IconAddMediumOutline, null),
      iconPlacement: "right"
    }, level, " medium"), /*#__PURE__*/_react.default.createElement(Spacer, null), /*#__PURE__*/_react.default.createElement(_Button.default, {
      level: level,
      size: "large",
      icon: /*#__PURE__*/_react.default.createElement(_uiIcons.IconAddMediumOutline, null),
      iconPlacement: "right"
    }, level, " large")));
  }));
};

exports.ButtonWithIcons = ButtonWithIcons;