@scrnhq/eurovision-elements/library/__story__/colors.story.js

'use strict';

var _templateObject = _taggedTemplateLiteral(['\n  text-align: center;\n'], ['\n  text-align: center;\n']),
    _templateObject2 = _taggedTemplateLiteral(['\n  height: 100px;\n  width: 100px;\n  border-radius: 50%;\n  background: ', ';\n  box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.25);\n  margin-bottom: 1em;\n'], ['\n  height: 100px;\n  width: 100px;\n  border-radius: 50%;\n  background: ', ';\n  box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.25);\n  margin-bottom: 1em;\n']);

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _each = require('lodash/each');

var _each2 = _interopRequireDefault(_each);

var _styledComponents = require('styled-components');

var _styledComponents2 = _interopRequireDefault(_styledComponents);

var _storybook = require('@kadira/storybook');

var _text = require('../../text');

var _text2 = _interopRequireDefault(_text);

var _config = require('../config');

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _taggedTemplateLiteral(strings, raw) { return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }

var Container = _styledComponents2.default.div(_templateObject);

var ColorCircle = _styledComponents2.default.div(_templateObject2, function (props) {
  return props.color;
});

(0, _each2.default)(_config.colors, function (hex, label) {
  (0, _storybook.storiesOf)('Colors').addWithInfo(label, function () {
    return _react2.default.createElement(
      Container,
      null,
      _react2.default.createElement(ColorCircle, { color: hex }),
      _react2.default.createElement(
        _text2.default,
        null,
        label
      )
    );
  });
});