'use strict';

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

var _objectDestructuringEmpty2 = require('babel-runtime/helpers/objectDestructuringEmpty');

var _objectDestructuringEmpty3 = _interopRequireDefault(_objectDestructuringEmpty2);

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _Codeblock = require('./Codeblock');

var _Codeblock2 = _interopRequireDefault(_Codeblock);

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

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

exports.default = function (_ref) {
  (0, _objectDestructuringEmpty3.default)(_ref);

  return _react2.default.createElement(_Codeblock2.default, {
    __source: {
      fileName: _jsxFileName,
      lineNumber: 6
    }
  }, '// SimpleAreaChart.js\nfunction SimpleAreaChart({\n  margin,\n  data,\n  screenWidth,\n  screenHeight,\n}) {\n  const stock = Mock.appleStock;\n\n  const width = screenWidth / 1.5;\n  const height = width / 2;\n\n  // bounds\n  const xMax = width - margin.left - margin.right;\n  const yMax = height - margin.top - margin.bottom;\n\n  // accessors\n  const xStock = d => new Date(d.date);\n  const yStock = d => d.close;\n\n  // scales\n  const xStockScale = Scale.scaleTime({\n    range: [0, xMax],\n    domain: extent(stock, xStock),\n  });\n  const yStockScale = Scale.scaleLinear({\n    range: [yMax, 0],\n    domain: [0, max(stock, yStock)],\n    nice: true,\n  });\n\n  return (\n    <svg height={height} width={width}>\n      <defs>\n        <linearGradient id="linear" x1="0%" y1="0%" x2="0%" y2="100%">\n          <stop offset="0%"   stopColor="rgba(181, 49, 206, 1.000)"/>\n          <stop offset="100%" stopColor="rgba(1, 179, 239, 1.000)"/>\n        </linearGradient>\n      </defs>\n      <rect\n        width={width}\n        height={height}\n        stroke="black"\n        strokeWidth={1}\n        fill={\'none\'}\n      />\n      <Group top={margin.top} left={margin.left}>\n        <Grid.Rows\n          scale={yStockScale}\n          width={xMax}\n          strokeDasharray="2,2"\n          numTicks={numTicksForHeight(height)}\n        />\n        <Shape.AreaClosed\n          data={stock}\n          xScale={xStockScale}\n          yScale={yStockScale}\n          x={xStock}\n          y={yStock}\n          strokeWidth={2}\n          stroke={\'url(#linear)\'}\n          fill={\'url(#linear)\'}\n        />\n      </Group>\n      <Axis.AxisBottom\n        top={height - margin.bottom}\n        left={margin.left}\n        scale={xStockScale}\n        numTicks={numTicksForWidth(width)}\n        label={\'date\'}\n      />\n      <Axis.AxisLeft\n        top={margin.top}\n        left={margin.left}\n        scale={yStockScale}\n        numTicks={numTicksForHeight(height)}\n        label={\'close price ($)\'}\n        hideAxisLine\n        hideTicks\n        hideZero\n      />\n    </svg>\n  );\n}\n\nexport default Responsive.withScreenSize(SimpleAreaChart);');
};