'use strict';

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

var _stringify = require('babel-runtime/core-js/json/stringify');

var _stringify2 = _interopRequireDefault(_stringify);

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _group = require('@vx/group');

var _hierarchy = require('@vx/hierarchy');

var _shape = require('@vx/shape');

var _d3Hierarchy = require('d3-hierarchy');

var _gradient = require('@vx/gradient');

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

var _jsxFileName = '/Users/hshoff/code/vx/packages/vx-demo/components/tiles/tree.js';


var raw = {
  "name": "T",
  "children": [{
    "name": "A",
    "children": [{ "name": "A1" }, { "name": "A2" }, { "name": "A3" }, { "name": "C",
      "children": [{
        "name": "C1"
      }, {
        "name": "D",
        "children": [{
          "name": "D1"
        }, {
          "name": "D2"
        }, {
          "name": "D3"
        }]
      }]
    }] }, { "name": "Z" }, {
    "name": "B",
    "children": [{ "name": "B1" }, { "name": "B2" }, { "name": "B3" }] }]
};

function Node(_ref) {
  var node = _ref.node,
      events = _ref.events;

  var width = 40;
  var height = 20;
  return _react2.default.createElement(_group.Group, { top: node.x, left: node.y, __source: {
      fileName: _jsxFileName,
      lineNumber: 46
    }
  }, node.depth === 0 && _react2.default.createElement('circle', {
    r: 12,
    fill: 'url(\'#lg\')',
    __source: {
      fileName: _jsxFileName,
      lineNumber: 48
    }
  }), node.depth !== 0 && _react2.default.createElement('rect', {
    height: height,
    width: width,
    y: -height / 2,
    x: -width / 2,
    fill: "#272b4d",
    stroke: node.children ? "#03c0dc" : "#26deb0",
    strokeWidth: 1,
    strokeDasharray: !node.children ? "2,2" : "0",
    strokeOpacity: !node.children ? .6 : 1,
    rx: !node.children ? 10 : 0,
    onClick: function onClick() {
      if (!events) return;
      alert('clicked: ' + (0, _stringify2.default)(node.data.name));
    },
    __source: {
      fileName: _jsxFileName,
      lineNumber: 54
    }
  }), _react2.default.createElement('text', {
    dy: ".33em",
    fontSize: 9,
    fontFamily: 'Arial',
    textAnchor: "middle",
    style: { pointerEvents: "none" },
    fill: node.depth === 0 ? "#71248e" : node.children ? "white" : "#26deb0",
    __source: {
      fileName: _jsxFileName,
      lineNumber: 71
    }
  }, node.data.name));
}

function Link(_ref2) {
  var link = _ref2.link;

  return _react2.default.createElement(_shape.LinkHorizontal, {
    data: link,
    stroke: '#374469',
    strokeWidth: '1',
    fill: 'none',
    __source: {
      fileName: _jsxFileName,
      lineNumber: 87
    }
  });
}

exports.default = function (_ref3) {
  var width = _ref3.width,
      height = _ref3.height,
      _ref3$events = _ref3.events,
      events = _ref3$events === undefined ? false : _ref3$events,
      _ref3$margin = _ref3.margin,
      margin = _ref3$margin === undefined ? {
    top: 10,
    left: 30,
    right: 40,
    bottom: 80
  } : _ref3$margin;

  if (width < 10) return null;
  var data = (0, _d3Hierarchy.hierarchy)(raw);
  return _react2.default.createElement('svg', { width: width, height: height, __source: {
      fileName: _jsxFileName,
      lineNumber: 110
    }
  }, _react2.default.createElement(_gradient.LinearGradient, { id: 'lg', from: '#fd9b93', to: '#fe6e9e', __source: {
      fileName: _jsxFileName,
      lineNumber: 111
    }
  }), _react2.default.createElement('rect', {
    width: width,
    height: height,
    rx: 14,
    fill: '#272b4d',
    __source: {
      fileName: _jsxFileName,
      lineNumber: 112
    }
  }), _react2.default.createElement(_hierarchy.Tree, {
    top: margin.top,
    left: margin.left,
    root: data,
    size: [height - margin.top - margin.bottom, width - margin.left - margin.right],
    nodeComponent: function nodeComponent(_ref4) {
      var node = _ref4.node;
      return _react2.default.createElement(Node, { node: node, events: events, __source: {
          fileName: _jsxFileName,
          lineNumber: 126
        }
      });
    },
    linkComponent: Link,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 118
    }
  }));
};