text: "use strict";
  
  exports.__esModule = true;
  
  var _each2 = require("lodash/each");
  
  var _each3 = _interopRequireDefault(_each2);
  
  var _min2 = require("lodash/min");
  
  var _min3 = _interopRequireDefault(_min2);
  
  var _max2 = require("lodash/max");
  
  var _max3 = _interopRequireDefault(_max2);
  
  var _sample2 = require("lodash/sample");
  
  var _sample3 = _interopRequireDefault(_sample2);
  
  var _react = require("react");
  
  var _react2 = _interopRequireDefault(_react);
  
  var _base = require("../../../src/styles/base.css");
  
  var _base2 = _interopRequireDefault(_base);
  
  var _prettysize = require("prettysize");
  
  var _prettysize2 = _interopRequireDefault(_prettysize);
  
  var _d = require("d3");
  
  var _d2 = _interopRequireDefault(_d);
  
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
  
  /* eslint react/prop-types: 0 */
  var Asset = function Asset(props) {
    var color = (0, _sample3.default)(["#ff6e30", "#008586", "#ff4d64", "#9e9f34", "#00fdfe"]);
    var assetSize = (0, _prettysize2.default)(props.asset.size).split(" ");
  
    return _react2.default.createElement(
      "div",
      { className: _base2.default.assetItem },
      _react2.default.createElement(
        "div",
        { style: { backgroundColor: color }, className: _base2.default.assetSize },
        _react2.default.createElement(
          "h4",
          null,
          assetSize[0]
        ),
        _react2.default.createElement(
          "h4",
          null,
          assetSize[1]
        )
      ),
      _react2.default.createElement(
        "div",
        { className: _base2.default.assetProgressBarContainer },
        _react2.default.createElement(
          "h4",
          { style: { marginLeft: 15 } },
          props.asset.name
        ),
        _react2.default.createElement(
          "div",
          { className: _base2.default.assetProgressBar },
          _react2.default.createElement("div", { style: {
              width: props.scaledSize + "%",
              height: "100%",
              backgroundColor: color,
              borderRadius: 25
            } })
        )
      )
    );
  };
  
  var WebpackAssets = function WebpackAssets(props) {
    var maxAssetFileSize = (0, _max3.default)(props.assets.map(function (asset) {
      return asset.size;
    }));
    var minAssetFileSize = (0, _min3.default)(props.assets.map(function (asset) {
      return asset.size;
    }));
    var logScale = _d2.default.scale.log().domain([minAssetFileSize, maxAssetFileSize]).range([1, 100]); //eslint-disable-line no-magic-numbers
  
    (0, _each3.default)(props.assets, function (asset) {
      return asset.logScaledSize = logScale(asset.size);
    });
  
    return _react2.default.createElement(
      "div",
      { style: { height: 480, overflow: "scroll" } },
      props.assets.map(function (asset) {
        return _react2.default.createElement(Asset, { key: asset.size, asset: asset, scaledSize: asset.logScaledSize });
      })
    );
  };
  
  exports.default = WebpackAssets;
  
  
  WebpackAssets.propTypes = {
    assets: _react.PropTypes.array
  };