'use strict';

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

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _show = require('../components/show');

var _show2 = _interopRequireDefault(_show);

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/pages/lineradial.js?entry';

exports.default = function () {
  return _react2.default.createElement(_show2.default, { component: _lineradial2.default, title: 'Line Radial', __source: {
      fileName: _jsxFileName,
      lineNumber: 7
    }
  }, 'import React from \'react\';\nimport { Group } from \'@vx/group\';\nimport { LineRadial } from \'@vx/shape\';\nimport { scaleLinear } from \'@vx/scale\';\nimport { curveBasisClosed } from \'@vx/curve\';\n\nconst data = [\n  -100, -60, 0,\n  60, 120, 145,\n  180, 230, 270,\n  310, 350, 390\n];\n\nexport default function LineRadialTile({\n  width,\n  height,\n  margin = {\n    top: 10,\n    left: 10,\n    right: 10,\n    bottom: 120,\n  }\n}) {\n  const radius = Math.min(width, height) / 2;\n  return (\n    <svg width={width} height={height}>\n      <rect\n        x={0}\n        y={0}\n        width={width}\n        height={height}\n        fill="#744cca"\n        rx={14}\n      />\n      <Group top={width / 2} left={height / 2}>\n        <LineRadial\n          data={data}\n          angle={d => d * (Math.PI / 180)}\n          radius={(d,i) => 60 + i * 20}\n          fill="none"\n          stroke={"#761ae3"}\n          strokeWidth={6}\n          curve={curveBasisClosed}\n        />\n        <LineRadial\n          data={data}\n          angle={d => d * (Math.PI / 180)}\n          radius={(d,i) => 60 + i * 10}\n          fill="none"\n          stroke={"#dff84d"}\n          strokeWidth={3}\n          curve={curveBasisClosed}\n        />\n        <LineRadial\n          data={data}\n          angle={d => d * (Math.PI / 90)}\n          radius={(d,i) => 60 + i * 40}\n          fill="none"\n          stroke={"#aeeef8"}\n          strokeWidth={8}\n          curve={curveBasisClosed}\n        />\n        <LineRadial\n          data={data}\n          angle={d => d * (Math.PI / 90)}\n          radius={(d,i) => 120 + i * 80}\n          fill="none"\n          stroke={"#dff84d"}\n          strokeWidth={8}\n          curve={curveBasisClosed}\n        />\n      </Group>\n    </svg>\n  );\n}');
};