'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _set = require('babel-runtime/core-js/set');

var _set2 = _interopRequireDefault(_set);

var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');

var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);

var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');

var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);

var _createClass2 = require('babel-runtime/helpers/createClass');

var _createClass3 = _interopRequireDefault(_createClass2);

var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');

var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);

var _inherits2 = require('babel-runtime/helpers/inherits');

var _inherits3 = _interopRequireDefault(_inherits2);

var _style = require('styled-jsx/style.js');

var _style2 = _interopRequireDefault(_style);

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _reactTilt = require('react-tilt');

var _reactTilt2 = _interopRequireDefault(_reactTilt);

var _link = require('next/dist/lib/link.js');

var _link2 = _interopRequireDefault(_link);

var _d3Array = require('d3-array');

var _page = require('../components/page');

var _page2 = _interopRequireDefault(_page);

var _footer = require('../components/footer');

var _footer2 = _interopRequireDefault(_footer);

var _lines = require('../components/tiles/lines');

var _lines2 = _interopRequireDefault(_lines);

var _bars = require('../components/tiles/bars');

var _bars2 = _interopRequireDefault(_bars);

var _dots = require('../components/tiles/dots');

var _dots2 = _interopRequireDefault(_dots);

var _patterns = require('../components/tiles/patterns');

var _patterns2 = _interopRequireDefault(_patterns);

var _gradients = require('../components/tiles/gradients');

var _gradients2 = _interopRequireDefault(_gradients);

var _area = require('../components/tiles/area');

var _area2 = _interopRequireDefault(_area);

var _stacked = require('../components/tiles/stacked');

var _stacked2 = _interopRequireDefault(_stacked);

var _multiline = require('../components/tiles/multiline');

var _multiline2 = _interopRequireDefault(_multiline);

var _axis = require('../components/tiles/axis');

var _axis2 = _interopRequireDefault(_axis);

var _bargroup = require('../components/tiles/bargroup');

var _bargroup2 = _interopRequireDefault(_bargroup);

var _barstack = require('../components/tiles/barstack');

var _barstack2 = _interopRequireDefault(_barstack);

var _heatmap = require('../components/tiles/heatmap');

var _heatmap2 = _interopRequireDefault(_heatmap);

var _lineradial = require('../components/tiles/lineradial');

var _lineradial2 = _interopRequireDefault(_lineradial);

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

var _jsxFileName = '/Users/hshoff/Code/vx/packages/vx-demo/components/gallery.js';


var items = ["#242424", "#c3dae8", "#ef5843", "#f5f2e3", "#f6c431", "#32deaa", "rgba(243, 129, 129, 1.000)", "#00f2ff", "#f4419f", "#3130e3", "#12122e", "#ff657c"];

var Gallery = function (_React$Component) {
  (0, _inherits3.default)(Gallery, _React$Component);

  function Gallery() {
    (0, _classCallCheck3.default)(this, Gallery);

    var _this = (0, _possibleConstructorReturn3.default)(this, (Gallery.__proto__ || (0, _getPrototypeOf2.default)(Gallery)).call(this));

    _this.nodes = new _set2.default();
    _this.state = { dimensions: [] };
    _this.resize = _this.resize.bind(_this);
    return _this;
  }

  (0, _createClass3.default)(Gallery, [{
    key: 'componentDidMount',
    value: function componentDidMount() {
      var _this2 = this;

      window.addEventListener('resize', this.resize, false);
      setTimeout(function () {
        _this2.resize();
      }, 1);
    }
  }, {
    key: 'componentWillUnmount',
    value: function componentWillUnmount() {
      window.removeEventListener('resize', this.resize);
    }
  }, {
    key: 'resize',
    value: function resize() {
      var newState = [];
      this.nodes.forEach(function (node) {
        if (!node) return;
        newState.push([node.offsetWidth, node.clientHeight]);
      });
      this.setState({ dimensions: newState });
    }
  }, {
    key: 'render',
    value: function render() {
      var _this3 = this;

      var t1 = this.state.dimensions[0] || [8, 300];
      var t2 = this.state.dimensions[1] || [8, 300];
      var t3 = this.state.dimensions[2] || [8, 300];
      var t4 = this.state.dimensions[3] || [8, 300];
      var t5 = this.state.dimensions[4] || [8, 300];
      var t6 = this.state.dimensions[5] || [8, 300];
      var t7 = this.state.dimensions[6] || [8, 300];
      var t8 = this.state.dimensions[7] || [8, 300];
      var t9 = this.state.dimensions[8] || [8, 300];
      var t10 = this.state.dimensions[9] || [8, 300];
      var t11 = this.state.dimensions[10] || [8, 300];
      var t12 = this.state.dimensions[11] || [8, 300];
      var t13 = this.state.dimensions[12] || [8, 300];

      return _react2.default.createElement('div', {
        'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 82
        }
      }, _react2.default.createElement('div', { className: 'gallery', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 83
        }
      }, _react2.default.createElement(_reactTilt2.default, {
        className: 'tilt',
        options: { max: 8, scale: 1 },
        __source: {
          fileName: _jsxFileName,
          lineNumber: 84
        }
      }, _react2.default.createElement(_link2.default, { prefetch: true, href: '/lines', __source: {
          fileName: _jsxFileName,
          lineNumber: 88
        }
      }, _react2.default.createElement('div', {
        className: 'gallery-item',
        style: { background: items[0] },
        ref: function ref(d) {
          return _this3.nodes.add(d);
        },
        'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 89
        }
      }, _react2.default.createElement('div', { className: 'image', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 94
        }
      }, _react2.default.createElement(_lines2.default, {
        width: t1[0],
        height: t1[1],
        __source: {
          fileName: _jsxFileName,
          lineNumber: 95
        }
      })), _react2.default.createElement('div', { className: 'details', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 100
        }
      }, _react2.default.createElement('div', { className: 'title', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 101
        }
      }, 'Lines'), _react2.default.createElement('div', { className: 'description', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 102
        }
      }, _react2.default.createElement('pre', {
        'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 103
        }
      }, '<Shape.Line />')))))), _react2.default.createElement(_reactTilt2.default, {
        className: 'tilt',
        options: { max: 8, scale: 1 },
        __source: {
          fileName: _jsxFileName,
          lineNumber: 109
        }
      }, _react2.default.createElement(_link2.default, { prefetch: true, href: '/bars', __source: {
          fileName: _jsxFileName,
          lineNumber: 113
        }
      }, _react2.default.createElement('div', {
        className: 'gallery-item',
        style: { background: items[1] },
        ref: function ref(d) {
          return _this3.nodes.add(d);
        },
        'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 114
        }
      }, _react2.default.createElement('div', { className: 'image', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 119
        }
      }, _react2.default.createElement(_bars2.default, {
        width: t2[0],
        height: t2[1],
        __source: {
          fileName: _jsxFileName,
          lineNumber: 120
        }
      })), _react2.default.createElement('div', { className: 'details color-blue', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 125
        }
      }, _react2.default.createElement('div', { className: 'title', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 126
        }
      }, 'Bars'), _react2.default.createElement('div', { className: 'description', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 127
        }
      }, _react2.default.createElement('pre', {
        'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 128
        }
      }, '<Shape.Bar />')))))), _react2.default.createElement(_reactTilt2.default, {
        className: 'tilt',
        options: { max: 8, scale: 1 },
        __source: {
          fileName: _jsxFileName,
          lineNumber: 134
        }
      }, _react2.default.createElement(_link2.default, { prefetch: true, href: '/dots', __source: {
          fileName: _jsxFileName,
          lineNumber: 138
        }
      }, _react2.default.createElement('div', {
        className: 'gallery-item',
        style: { background: items[2] },
        ref: function ref(d) {
          return _this3.nodes.add(d);
        },
        'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 139
        }
      }, _react2.default.createElement('div', { className: 'image', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 144
        }
      }, _react2.default.createElement(_dots2.default, {
        width: t3[0],
        height: t3[1],
        __source: {
          fileName: _jsxFileName,
          lineNumber: 145
        }
      })), _react2.default.createElement('div', { className: 'details color-yellow', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 150
        }
      }, _react2.default.createElement('div', { className: 'title', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 151
        }
      }, 'Dots'), _react2.default.createElement('div', { className: 'description', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 152
        }
      }, _react2.default.createElement('pre', {
        'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 153
        }
      }, '<Glyph.GlyphDot />')))))), _react2.default.createElement(_reactTilt2.default, {
        className: 'tilt',
        options: { max: 8, scale: 1 },
        __source: {
          fileName: _jsxFileName,
          lineNumber: 159
        }
      }, _react2.default.createElement(_link2.default, { prefetch: true, href: '/patterns', __source: {
          fileName: _jsxFileName,
          lineNumber: 163
        }
      }, _react2.default.createElement('div', {
        className: 'gallery-item',
        style: { background: items[3] },
        ref: function ref(d) {
          return _this3.nodes.add(d);
        },
        'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 164
        }
      }, _react2.default.createElement('div', { className: 'image', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 169
        }
      }, _react2.default.createElement(_patterns2.default, {
        width: t4[0],
        height: t4[1],
        __source: {
          fileName: _jsxFileName,
          lineNumber: 170
        }
      })), _react2.default.createElement('div', { className: 'details color-gray', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 175
        }
      }, _react2.default.createElement('div', { className: 'title', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 176
        }
      }, 'Patterns'), _react2.default.createElement('div', { className: 'description', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 177
        }
      }, _react2.default.createElement('pre', {
        'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 178
        }
      }, '<Pattern />')))))), _react2.default.createElement(_reactTilt2.default, {
        className: 'tilt',
        options: { max: 8, scale: 1 },
        __source: {
          fileName: _jsxFileName,
          lineNumber: 184
        }
      }, _react2.default.createElement(_link2.default, { prefetch: true, href: '/areas', __source: {
          fileName: _jsxFileName,
          lineNumber: 188
        }
      }, _react2.default.createElement('div', {
        className: 'gallery-item',
        style: { background: items[5] },
        ref: function ref(d) {
          return _this3.nodes.add(d);
        },
        'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 189
        }
      }, _react2.default.createElement('div', { className: 'image', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 194
        }
      }, _react2.default.createElement(_area2.default, {
        width: t5[0],
        height: t5[1],
        margin: {
          top: 0,
          left: 0,
          right: 0,
          bottom: 80
        },
        __source: {
          fileName: _jsxFileName,
          lineNumber: 195
        }
      })), _react2.default.createElement('div', { className: 'details', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 206
        }
      }, _react2.default.createElement('div', { className: 'title', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 207
        }
      }, 'Areas'), _react2.default.createElement('div', { className: 'description', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 208
        }
      }, _react2.default.createElement('pre', {
        'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 209
        }
      }, '<Shape.AreaClosed />')))))), _react2.default.createElement(_reactTilt2.default, {
        className: 'tilt',
        options: { max: 8, scale: 1 },
        __source: {
          fileName: _jsxFileName,
          lineNumber: 215
        }
      }, _react2.default.createElement(_link2.default, { prefetch: true, href: '/stacked-areas', __source: {
          fileName: _jsxFileName,
          lineNumber: 219
        }
      }, _react2.default.createElement('div', {
        className: 'gallery-item',
        style: { background: items[6] },
        ref: function ref(d) {
          return _this3.nodes.add(d);
        },
        'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 220
        }
      }, _react2.default.createElement('div', { className: 'image', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 225
        }
      }, _react2.default.createElement(_stacked2.default, {
        width: t6[0],
        height: t6[1],
        margin: {
          top: 0,
          left: 0,
          right: 0,
          bottom: 80
        },
        __source: {
          fileName: _jsxFileName,
          lineNumber: 226
        }
      })), _react2.default.createElement('div', { className: 'details', style: { color: "rgba(251, 224, 137, 1.000)" }, 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 237
        }
      }, _react2.default.createElement('div', { className: 'title', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 238
        }
      }, 'Stacked Areas'), _react2.default.createElement('div', { className: 'description', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 239
        }
      }, _react2.default.createElement('pre', {
        'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 240
        }
      }, '<Shape.AreaStack />')))))), _react2.default.createElement(_reactTilt2.default, {
        className: 'tilt',
        options: { max: 8, scale: 1 },
        __source: {
          fileName: _jsxFileName,
          lineNumber: 246
        }
      }, _react2.default.createElement(_link2.default, { prefetch: true, href: '/gradients', __source: {
          fileName: _jsxFileName,
          lineNumber: 250
        }
      }, _react2.default.createElement('div', { className: 'gallery-item', style: { background: 'white', boxShadow: '0 1px 6px rgba(0,0,0,0.1)' }, ref: function ref(d) {
          return _this3.nodes.add(d);
        }, 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 251
        }
      }, _react2.default.createElement('div', { className: 'image', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 252
        }
      }, _react2.default.createElement(_gradients2.default, {
        width: t7[0],
        height: t7[1],
        __source: {
          fileName: _jsxFileName,
          lineNumber: 253
        }
      })), _react2.default.createElement('div', { className: 'details color-gray', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 258
        }
      }, _react2.default.createElement('div', { className: 'title', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 259
        }
      }, 'Gradients'), _react2.default.createElement('div', { className: 'description', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 260
        }
      }, _react2.default.createElement('pre', {
        'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 261
        }
      }, '<Gradient />')))))), _react2.default.createElement(_reactTilt2.default, {
        className: 'tilt',
        options: { max: 8, scale: 1 },
        __source: {
          fileName: _jsxFileName,
          lineNumber: 267
        }
      }, _react2.default.createElement(_link2.default, { prefetch: true, href: '/glyphs', __source: {
          fileName: _jsxFileName,
          lineNumber: 271
        }
      }, _react2.default.createElement('div', { className: 'gallery-item', style: { background: items[7] }, ref: function ref(d) {
          return _this3.nodes.add(d);
        }, 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 272
        }
      }, _react2.default.createElement('div', { className: 'image', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 273
        }
      }, _react2.default.createElement(_multiline2.default, {
        width: t8[0],
        height: t8[1],
        margin: {
          top: 10,
          left: 0,
          right: 0,
          bottom: 80
        },
        __source: {
          fileName: _jsxFileName,
          lineNumber: 274
        }
      })), _react2.default.createElement('div', { className: 'details', style: { color: 'rgba(126, 31, 220, 1.000)' }, 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 285
        }
      }, _react2.default.createElement('div', { className: 'title', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 286
        }
      }, 'Glyphs'), _react2.default.createElement('div', { className: 'description', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 287
        }
      }, _react2.default.createElement('pre', {
        'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 288
        }
      }, '<Glyph.GlyphDot />')))))), _react2.default.createElement(_reactTilt2.default, {
        className: 'tilt',
        options: { max: 8, scale: 1 },
        __source: {
          fileName: _jsxFileName,
          lineNumber: 294
        }
      }, _react2.default.createElement(_link2.default, { prefetch: true, href: '/axis', __source: {
          fileName: _jsxFileName,
          lineNumber: 298
        }
      }, _react2.default.createElement('div', { className: 'gallery-item', style: { background: items[8] }, ref: function ref(d) {
          return _this3.nodes.add(d);
        }, 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 299
        }
      }, _react2.default.createElement('div', { className: 'image', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 300
        }
      }, _react2.default.createElement(_axis2.default, {
        width: t9[0],
        height: t9[1],
        margin: {
          top: 20,
          left: 60,
          right: 40,
          bottom: 120
        },
        __source: {
          fileName: _jsxFileName,
          lineNumber: 301
        }
      })), _react2.default.createElement('div', { className: 'details', style: { color: '#8e205f' }, 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 312
        }
      }, _react2.default.createElement('div', { className: 'title', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 313
        }
      }, 'Axis'), _react2.default.createElement('div', { className: 'description', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 314
        }
      }, _react2.default.createElement('pre', {
        'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 315
        }
      }, '<Axis.AxisLeft /> + <Axis.AxisBottom />')))))), _react2.default.createElement(_reactTilt2.default, {
        className: 'tilt',
        options: { max: 8, scale: 1 },
        __source: {
          fileName: _jsxFileName,
          lineNumber: 321
        }
      }, _react2.default.createElement(_link2.default, { prefetch: true, href: '/bargroup', __source: {
          fileName: _jsxFileName,
          lineNumber: 325
        }
      }, _react2.default.createElement('div', { className: 'gallery-item', style: { background: '#612efb' }, ref: function ref(d) {
          return _this3.nodes.add(d);
        }, 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 326
        }
      }, _react2.default.createElement('div', { className: 'image', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 327
        }
      }, _react2.default.createElement(_bargroup2.default, {
        width: t10[0],
        height: t10[1],
        __source: {
          fileName: _jsxFileName,
          lineNumber: 328
        }
      })), _react2.default.createElement('div', { className: 'details', style: { color: '#e5fd3d' }, 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 333
        }
      }, _react2.default.createElement('div', { className: 'title', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 334
        }
      }, 'Bar Group'), _react2.default.createElement('div', { className: 'description', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 335
        }
      }, _react2.default.createElement('pre', {
        'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 336
        }
      }, '<Shape.BarGroup />')))))), _react2.default.createElement(_reactTilt2.default, {
        className: 'tilt',
        options: { max: 8, scale: 1 },
        __source: {
          fileName: _jsxFileName,
          lineNumber: 342
        }
      }, _react2.default.createElement(_link2.default, { prefetch: true, href: '/barstack', __source: {
          fileName: _jsxFileName,
          lineNumber: 346
        }
      }, _react2.default.createElement('div', { className: 'gallery-item', style: { background: '#eaedff' }, ref: function ref(d) {
          return _this3.nodes.add(d);
        }, 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 347
        }
      }, _react2.default.createElement('div', { className: 'image', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 348
        }
      }, _react2.default.createElement(_barstack2.default, {
        width: t11[0],
        height: t11[1],
        __source: {
          fileName: _jsxFileName,
          lineNumber: 349
        }
      })), _react2.default.createElement('div', { className: 'details', style: { color: '#a44afe' }, 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 354
        }
      }, _react2.default.createElement('div', { className: 'title', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 355
        }
      }, 'Bar Stack'), _react2.default.createElement('div', { className: 'description', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 356
        }
      }, _react2.default.createElement('pre', {
        'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 357
        }
      }, '<Shape.BarStack />')))))), _react2.default.createElement(_reactTilt2.default, {
        className: 'tilt',
        options: { max: 8, scale: 1 },
        __source: {
          fileName: _jsxFileName,
          lineNumber: 363
        }
      }, _react2.default.createElement(_link2.default, { prefetch: true, href: '/heatmaps', __source: {
          fileName: _jsxFileName,
          lineNumber: 367
        }
      }, _react2.default.createElement('div', { className: 'gallery-item', style: { background: '#28272c' }, ref: function ref(d) {
          return _this3.nodes.add(d);
        }, 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 368
        }
      }, _react2.default.createElement('div', { className: 'image', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 369
        }
      }, _react2.default.createElement(_heatmap2.default, {
        width: t12[0],
        height: t12[1],
        __source: {
          fileName: _jsxFileName,
          lineNumber: 370
        }
      })), _react2.default.createElement('div', { className: 'details', style: { color: 'rgba(255,255,255,0.3)' }, 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 375
        }
      }, _react2.default.createElement('div', { className: 'title', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 376
        }
      }, 'Heatmaps'), _react2.default.createElement('div', { className: 'description', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 377
        }
      }, _react2.default.createElement('pre', {
        'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 378
        }
      }, '<HeatmapCircle /> + <HeatmapRect />')))))), _react2.default.createElement(_reactTilt2.default, {
        className: 'tilt',
        options: { max: 8, scale: 1 },
        __source: {
          fileName: _jsxFileName,
          lineNumber: 384
        }
      }, _react2.default.createElement(_link2.default, { prefetch: true, href: '/lineradial', __source: {
          fileName: _jsxFileName,
          lineNumber: 388
        }
      }, _react2.default.createElement('div', { className: 'gallery-item', style: { background: '#744cca' }, ref: function ref(d) {
          return _this3.nodes.add(d);
        }, 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 389
        }
      }, _react2.default.createElement('div', { className: 'image', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 390
        }
      }, _react2.default.createElement(_lineradial2.default, {
        width: t13[0],
        height: t13[1] - 80,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 391
        }
      })), _react2.default.createElement('div', { className: 'details', style: { color: '#dff84d' }, 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 396
        }
      }, _react2.default.createElement('div', { className: 'title', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 397
        }
      }, 'Radial Lines'), _react2.default.createElement('div', { className: 'description', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 398
        }
      }, _react2.default.createElement('pre', {
        'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 399
        }
      }, '<Shape.LineRadial />')))))), _react2.default.createElement('div', { className: 'gallery-item placeholder', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 405
        }
      }), _react2.default.createElement('div', { className: 'gallery-item placeholder', 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 406
        }
      })), _react2.default.createElement('div', {
        'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 409
        }
      }, _react2.default.createElement('h1', { style: { textAlign: 'center', lineHeight: '.8em' }, 'data-jsx': 747220135,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 410
        }
      }, 'More on the way!')), _react2.default.createElement(_footer2.default, {
        __source: {
          fileName: _jsxFileName,
          lineNumber: 415
        }
      }), _react2.default.createElement(_style2.default, {
        styleId: 747220135,
        css: 'h3[data-jsx="747220135"] {margin-top: 0;margin-left: 40px;margin-bottom: 0;}.gallery[data-jsx="747220135"] {display:-webkit-flex; display:flex;-webkit-flex-direction: row;-moz-flex-direction: row;flex-direction: row;-webkit-flex-wrap: wrap;-moz-flex-wrap: wrap;flex-wrap: wrap;justify-content: space-around;overflow-x: hidden;padding-bottom: 20px;}.gallery-item[data-jsx="747220135"] {background-color: white;margin: 5px;display:-webkit-flex; display:flex;height: 390px;-webkit-flex: 1;-moz-flex: 1;flex: 1;min-width: 25%;-webkit-flex-direction: column;-moz-flex-direction: column;flex-direction: column;border-radius: 14px;}.gallery-item.placeholder[data-jsx="747220135"] {height: 1px;}.image[data-jsx="747220135"] {-webkit-flex: 1;-moz-flex: 1;flex: 1;display:-webkit-flex; display:flex;}.details[data-jsx="747220135"] {text-align: center;padding: 15px 20px;color: #ffffff;}.title[data-jsx="747220135"] {font-weight: 900;line-height: 0.9rem;}.description[data-jsx="747220135"] {font-weight: 300;font-size: 14px;}pre[data-jsx="747220135"] {margin: 0;}.color-blue[data-jsx="747220135"] {color: rgba(25, 231, 217, 1.000);}.color-yellow[data-jsx="747220135"] {color: #f6c431;}.color-gray[data-jsx="747220135"] {color: #333;}@media (max-width: 960px) {.gallery-item[data-jsx="747220135"] {min-width: 45%;}}@media (max-width: 600px) {.gallery-item[data-jsx="747220135"] {min-width: 100%;}}\n/*# sourceMappingURL=data:application/json;base64,  */\n/*@ sourceURL=components/gallery.js */'
      }));
    }
  }]);

  return Gallery;
}(_react2.default.Component);

exports.default = Gallery;