text: 'use strict';
  
  Object.defineProperty(exports, "__esModule", {
    value: true
  });
  exports.Circle = undefined;
  
  var _react = require('react');
  
  var _react2 = _interopRequireDefault(_react);
  
  var _reactcss = require('reactcss');
  
  var _reactcss2 = _interopRequireDefault(_reactcss);
  
  var _map = require('lodash/map');
  
  var _map2 = _interopRequireDefault(_map);
  
  var _materialColors = require('material-colors');
  
  var material = _interopRequireWildcard(_materialColors);
  
  var _common = require('../common');
  
  var _CircleSwatch = require('./CircleSwatch');
  
  var _CircleSwatch2 = _interopRequireDefault(_CircleSwatch);
  
  function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
  
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
  
  var Circle = exports.Circle = function Circle(_ref) {
    var width = _ref.width,
        onChange = _ref.onChange,
        onSwatchHover = _ref.onSwatchHover,
        colors = _ref.colors,
        hex = _ref.hex,
        circleSize = _ref.circleSize,
        circleSpacing = _ref.circleSpacing;
  
    var styles = (0, _reactcss2.default)({
      'default': {
        card: {
          width: width,
          display: 'flex',
          flexWrap: 'wrap',
          marginRight: -circleSpacing,
          marginBottom: -circleSpacing
        }
      }
    });
  
    var handleChange = function handleChange(hexCode, e) {
      return onChange({ hex: hexCode, source: 'hex' }, e);
    };
  
    return _react2.default.createElement(
      'div',
      { style: styles.card, className: 'circle-picker' },
      (0, _map2.default)(colors, function (c) {
        return _react2.default.createElement(_CircleSwatch2.default, {
          key: c,
          color: c,
          onClick: handleChange,
          onSwatchHover: onSwatchHover,
          active: hex === c.toLowerCase(),
          circleSize: circleSize,
          circleSpacing: circleSpacing
        });
      })
    );
  };
  
  Circle.defaultProps = {
    width: '252px',
    circleSize: 28,
    circleSpacing: 14,
    colors: [material.red['500'], material.pink['500'], material.purple['500'], material.deepPurple['500'], material.indigo['500'], material.blue['500'], material.lightBlue['500'], material.cyan['500'], material.teal['500'], material.green['500'], material.lightGreen['500'], material.lime['500'], material.yellow['500'], material.amber['500'], material.orange['500'], material.deepOrange['500'], material.brown['500'], material.blueGrey['500']]
  };
  
  exports.default = (0, _common.ColorWrap)(Circle);