import React from 'react';
import { IconBellMediumOutline } from '@teamleader/ui-icons';
import Banner from './Banner';
import { TextBody } from '../typography';
export default {
  component: Banner,
  title: 'Banner'
};

var Wrapper = function Wrapper(_ref) {
  var children = _ref.children;
  return /*#__PURE__*/React.createElement("div", {
    style: {
      padding: '6px'
    }
  }, children);
};

export var Main = function Main() {
  return /*#__PURE__*/React.createElement("div", null, ['white', 'neutral', 'mint', 'violet', 'ruby', 'gold', 'aqua'].map(function (color) {
    return ['small', 'medium', 'large'].map(function (size) {
      return /*#__PURE__*/React.createElement(React.Fragment, {
        key: color + size
      }, /*#__PURE__*/React.createElement(Wrapper, null, /*#__PURE__*/React.createElement(Banner, {
        color: color,
        size: size
      }, /*#__PURE__*/React.createElement(TextBody, null, color, " - ", size))), /*#__PURE__*/React.createElement(Wrapper, null, /*#__PURE__*/React.createElement(Banner, {
        color: color,
        size: size,
        fullWidth: true
      }, /*#__PURE__*/React.createElement(TextBody, null, color, " - ", size, " - full width"))), /*#__PURE__*/React.createElement(Wrapper, null, /*#__PURE__*/React.createElement(Banner, {
        color: color,
        size: size,
        onClose: function onClose() {}
      }, /*#__PURE__*/React.createElement(TextBody, null, color, " - ", size, " - with onClose"))), /*#__PURE__*/React.createElement(Wrapper, null, /*#__PURE__*/React.createElement(Banner, {
        color: color,
        size: size,
        onClose: function onClose() {},
        fullWidth: true
      }, /*#__PURE__*/React.createElement(TextBody, null, color, " - ", size, " - full width - with onClose"))), /*#__PURE__*/React.createElement(Wrapper, null, /*#__PURE__*/React.createElement(Banner, {
        color: color,
        size: size,
        icon: /*#__PURE__*/React.createElement(IconBellMediumOutline, null)
      }, /*#__PURE__*/React.createElement(TextBody, null, color, " - ", size, " - with onClose"))), /*#__PURE__*/React.createElement(Wrapper, null, /*#__PURE__*/React.createElement(Banner, {
        color: color,
        size: size,
        icon: /*#__PURE__*/React.createElement(IconBellMediumOutline, null),
        fullWidth: true
      }, /*#__PURE__*/React.createElement(TextBody, null, color, " - ", size, " - full width - with onClose"))));
    });
  }));
};