"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.CardWithBar = exports.CardRenderedWithDifferentHtmlTags = exports.BasicCard = void 0;
var _react = _interopRequireDefault(require("react"));
var _styledComponents = _interopRequireDefault(require("styled-components"));
var _ = require("../..");
var _Display = require("../../common/Display");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var StyledContent = _styledComponents.default.div.withConfig({
  displayName: "Cardstories__StyledContent",
  componentId: "sc-eexhxe-0"
})(["height:50vh;display:flex;align-items:center;justify-content:center;"]);
var Content = function Content(_ref) {
  var children = _ref.children;
  return _react.default.createElement(StyledContent, null, children);
};
var _default = exports.default = {
  title: 'Atoms / Card',
  parameters: {
    component: _.Card
  }
};
var BasicCard = exports.BasicCard = function BasicCard() {
  return _react.default.createElement(_.Card, null, _react.default.createElement(Content, null, _react.default.createElement(_.Typography, null, "A Card as a div containing content")));
};
var CardRenderedWithDifferentHtmlTags = exports.CardRenderedWithDifferentHtmlTags = {
  render: function render() {
    return _react.default.createElement(_Display.Display, {
      items: [{
        title: 'Section',
        component: _react.default.createElement(_.Card, {
          as: "section"
        }, _react.default.createElement(Content, null, _react.default.createElement(_.Typography, null, "A Card as a section containing content")))
      }, {
        title: 'Article',
        component: _react.default.createElement(_.Card, {
          as: "article"
        }, _react.default.createElement(Content, null, _react.default.createElement(_.Typography, null, "A Card as a article containing content")))
      }]
    });
  },
  name: 'Card rendered with different html tags'
};
var CardWithBar = exports.CardWithBar = {
  render: function render() {
    return _react.default.createElement(_.Card, {
      barColor: function barColor(t) {
        return t.color.shareville;
      }
    }, _react.default.createElement(Content, null, _react.default.createElement(_.Typography, null, "A Card as a div containing content")));
  },
  name: 'Card with colored top bar'
};