"use strict";

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

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

var _react2 = require("@storybook/react");

var _ = require(".");

var _Box = require("../Box");

var _CloseButton = require("../CloseButton");

var __jsx = _react["default"].createElement;
var stories = (0, _react2.storiesOf)('Alert', module);
stories.addDecorator(function (story) {
  return __jsx(_Box.Box, {
    maxWidth: "sm",
    mt: "40px",
    mx: "auto"
  }, story());
});
stories.add('Default', function () {
  return __jsx(_.Alert, null, __jsx(_.AlertIcon, null), __jsx(_.AlertTitle, {
    display: "inline-block",
    mr: "spacing-sm"
  }, "Basic Alert"), __jsx(_CloseButton.CloseButton, {
    position: "absolute",
    right: "8px",
    top: "8px"
  }));
});
stories.add('Top Accent', function () {
  return __jsx(_.Alert, {
    status: "success",
    variant: "top-accent"
  }, __jsx(_.AlertIcon, null), __jsx(_Box.Box, {
    flex: "1"
  }, __jsx(_.AlertTitle, null, "Holy Smokes!"), __jsx(_.AlertDescription, null, "Something just happened!")));
});
stories.add('Subtle', function () {
  return __jsx(_.Alert, {
    status: "success",
    variant: "subtle",
    alignItems: "start"
  }, __jsx(_.AlertIcon, null), __jsx(_Box.Box, {
    flex: "1"
  }, __jsx(_.AlertTitle, null, "Holy Smokes!"), __jsx(_.AlertDescription, null, "Something just happened!")));
});
stories.add('Solid', function () {
  return __jsx(_.Alert, {
    status: "error",
    variant: "solid",
    justifyContent: "center"
  }, __jsx(_.AlertIcon, null), __jsx(_.AlertTitle, {
    display: "inline-block",
    mr: "spacing-sm"
  }, "Your browser is outdated!"), __jsx(_.AlertDescription, {
    display: "inline-block"
  }, "Your Chakra experience may be degraded."), __jsx(_CloseButton.CloseButton, {
    position: "absolute",
    right: "8px",
    top: "8px"
  }));
});
//# sourceMappingURL=examples.js.map