all the modules in src

src/AreaBarChart.js

@@ -1,4 +1,6 @@
-import _ from "lodash";
+import get from "lodash/get";
+import isFunction from "lodash/isFunction";
+import partial, { placeholder } from "lodash/partial";
 import PropTypes from "prop-types";
 import React from "react";
 import RangeRect from "./RangeRect";
@@ -146,8 +148,10 @@ export default class AreaBarChart extends React.Component {
             "onMouseLeaveBar"
           ].map(eventName => {
             // partially apply this bar's data point as 2nd callback argument
-            const callback = _.get(this.props, eventName);
-            return _.isFunction(callback) ? _.partial(callback, _, d) : null;
+            const callback = get(this.props, eventName);
+            return isFunction(callback)
+              ? partial(callback, placeholder, d)
+              : null;
           });
 
           return (

src/AreaChart.js

@@ -1,5 +1,6 @@
 import { area } from "d3";
-import _ from "lodash";
+import isUndefined from "lodash/isUndefined";
+import uniqueId from "lodash/uniqueId";
 import PropTypes from "prop-types";
 import React from "react";
 import * as CustomPropTypes from "./utils/CustomPropTypes";
@@ -93,8 +94,7 @@ export default class AreaChart extends React.Component {
     shouldShowGaps: true,
     isDefined: (d, i, accessors) => {
       return (
-        !_.isUndefined(accessors.y(d, i)) &&
-        !_.isUndefined(accessors.yEnd(d, i))
+        !isUndefined(accessors.y(d, i)) && !isUndefined(accessors.yEnd(d, i))
       );
     },
     pathClassName: ""
@@ -176,7 +176,7 @@ export default class AreaChart extends React.Component {
       const clipAbovePathStr = areaGenerator(data);
 
       // make sure we have a unique ID for this chart, so clip path IDs don't affect other charts
-      const chartId = _.uniqueId();
+      const chartId = uniqueId();
       const clipAboveId = `clip-above-area-${chartId}`;
       const clipBelowId = `clip-below-area-${chartId}`;
       const pathStyleAbove = pathStylePositive || pathStyle || {};

src/AreaHeatmap.js

@@ -1,5 +1,8 @@
 import { extent } from "d3";
-import _ from "lodash";
+import flatten from "lodash/flatten";
+import isFunction from "lodash/isFunction";
+import every from "lodash/every";
+import isFinite from "lodash/isFinite";
 import PropTypes from "prop-types";
 import React from "react";
 import { methodIfFuncProp } from "./util.js";
@@ -51,10 +54,10 @@ export default class AreaHeatmap extends React.Component {
     const { data, x, xEnd, y, yEnd } = props;
     return {
       x: extent(
-        _.flatten([data.map(makeAccessor2(x)), data.map(makeAccessor2(xEnd))])
+        flatten([data.map(makeAccessor2(x)), data.map(makeAccessor2(xEnd))])
       ),
       y: extent(
-        _.flatten([data.map(makeAccessor2(y)), data.map(makeAccessor2(yEnd))])
+        flatten([data.map(makeAccessor2(y)), data.map(makeAccessor2(yEnd))])
       )
     };
   }
@@ -74,7 +77,7 @@ export default class AreaHeatmap extends React.Component {
 
   onMouseMove = e => {
     const { xScale, yScale, onMouseMove } = this.props;
-    if (!_.isFunction(onMouseMove)) return;
+    if (!isFunction(onMouseMove)) return;
 
     const boundBox = this.refs.background.getBoundingClientRect();
     if (!boundBox) return;
@@ -174,7 +177,7 @@ export default class AreaHeatmap extends React.Component {
           const rectX = fullRectX + (fullWidth - width) / 2;
           const rectY = fullRectY + (fullHeight - height) / 2;
 
-          if (!_.every([rectX, rectY, width, height], _.isFinite)) return null;
+          if (!every([rectX, rectY, width, height], isFinite)) return null;
 
           const className = `rct-area-heatmap-rect ${getValue(
             rectClassName,

src/ColorHeatmap.js

@@ -5,7 +5,9 @@ import {
   interpolateRgb,
   scaleLinear
 } from "d3";
-import _ from "lodash";
+import isString from "lodash/isString";
+import range from "lodash/range";
+import times from "lodash/times";
 import PropTypes from "prop-types";
 import React from "react";
 import RangeRect from "./RangeRect";
@@ -37,8 +39,7 @@ function interpolatorFromType(type) {
 function makeColorScale(domain, colors, interpolator) {
   // invariant(domain.length === colors.length, 'ColorHeatmap makeColorScale: domain.length should equal colors.length');
 
-  if (_.isString(interpolator))
-    interpolator = interpolatorFromType(interpolator);
+  if (isString(interpolator)) interpolator = interpolatorFromType(interpolator);
 
   return scaleLinear()
     .domain(domain)
@@ -166,9 +167,9 @@ export default class ColorHeatmap extends React.Component {
         this.props.colors ||
         (valueDomain.length === 2
           ? ["#000000", "#ffffff"]
-          : _.times(
+          : times(
               valueDomain.length,
-              scale.schemeCategory10().domain(_.range(10))
+              scale.schemeCategory10().domain(range(10))
             ));
       colorScale = makeColorScale(valueDomain, colors, interpolator);
     }

src/FunnelChart.js

@@ -1,5 +1,6 @@
 import { area, scaleOrdinal, schemeCategory10 } from "d3";
-import _ from "lodash";
+import range from "lodash/range";
+import defaults from "lodash/defaults";
 import PropTypes from "prop-types";
 import React from "react";
 import * as CustomPropTypes from "./utils/CustomPropTypes";
@@ -117,7 +118,7 @@ export default class FunnelChart extends React.Component {
         .y1((d, i) => yScale(getValue(y, d, i)));
     }
 
-    const colors = scaleOrdinal(schemeCategory10).domain(_.range(10));
+    const colors = scaleOrdinal(schemeCategory10).domain(range(10));
 
     return (
       <g className="rct-funnel-chart">
@@ -127,7 +128,7 @@ export default class FunnelChart extends React.Component {
           const fill = color ? getValue(color, d, i) : colors(i - 1);
           let style = pathStyle ? getValue(pathStyle, d, i) : {};
 
-          style = _.defaults({}, style, { fill, stroke: "transparent" });
+          style = defaults({}, style, { fill, stroke: "transparent" });
 
           return (
             <path

src/Histogram.js

@@ -1,5 +1,7 @@
 import { extent, histogram, scaleLinear } from "d3";
-import _ from "lodash";
+import first from "lodash/first";
+import last from "lodash/last";
+import maxBy from "lodash/maxBy";
 import PropTypes from "prop-types";
 import React from "react";
 import AreaBarChart from "./AreaBarChart";
@@ -100,8 +102,8 @@ export default class Histogram extends React.Component {
     );
 
     const domains = {
-      xDomain: [_.first(bins).x0, _.last(bins).x1],
-      yDomain: [0, _.maxBy(bins, bin => bin.length).length]
+      xDomain: [first(bins).x0, last(bins).x1],
+      yDomain: [0, maxBy(bins, bin => bin.length).length]
     };
 
     return domains;
@@ -133,8 +135,8 @@ export default class Histogram extends React.Component {
 
       // Set nicely rounded domain as domain for makeHistogram
       makeHistogram = makeHistogram.domain([
-        _.first(niceBinDomain),
-        _.last(niceBinDomain)
+        first(niceBinDomain),
+        last(niceBinDomain)
       ]);
     }
 

src/LineChart.js

@@ -1,5 +1,4 @@
 import { bisector, line, curveLinear } from "d3";
-import _ from "lodash";
 import PropTypes from "prop-types";
 import React from "react";
 import * as CustomPropTypes from "./utils/CustomPropTypes";

src/MarkerLineChart.js

@@ -1,4 +1,12 @@
-import _ from "lodash";
+import isUndefined from "lodash/isUndefined";
+import isFunction from "lodash/isFunction";
+import partial, { placeholder } from "lodash/partial";
+import every from "lodash/every";
+import _ from "lodash/wrapperLodash";
+import isFinite from "lodash/isFinite";
+import first from "lodash/first";
+import last from "lodash/last";
+import clamp from "lodash/clamp";
 import PropTypes from "prop-types";
 import React from "react";
 import { methodIfFuncProp } from "./util.js";
@@ -15,18 +23,12 @@ import xyPropsEqual from "./utils/xyPropsEqual";
 function getTickType(props) {
   const { xEnd, yEnd, horizontal } = props;
   // warn if a range is passed for the dependent variable, which is expected to be a value
-  if (
-    (!horizontal && !_.isUndefined(yEnd)) ||
-    (horizontal && !_.isUndefined(xEnd))
-  )
+  if ((!horizontal && !isUndefined(yEnd)) || (horizontal && !isUndefined(xEnd)))
     console.warn(
       "Warning: MarkerLineChart can only show the independent variable as a range, not the dependent variable."
     );
 
-  if (
-    (!horizontal && !_.isUndefined(xEnd)) ||
-    (horizontal && !_.isUndefined(yEnd))
-  )
+  if ((!horizontal && !isUndefined(xEnd)) || (horizontal && !isUndefined(yEnd)))
     return "RangeValue";
 
   return "ValueValue";
@@ -152,23 +154,23 @@ export default class MarkerLineChart extends React.Component {
 
     // todo refactor/add better comments to clarify
     // find the edges of the tick domain, and map them through the scale function
-    const [domainHead, domainTail] = _([
-      _.first(markDomain),
-      _.last(markDomain)
+    const [domainHead, domainTail] = chain([
+      first(markDomain),
+      last(markDomain)
     ])
       .map(markScale)
       .sortBy(); //sort the pixel values return by the domain extents
     // find the edges of the data domain, and map them through the scale function
-    const [dataDomainHead, dataDomainTail] = _([
-      _.first(markDataDomain),
-      _.last(markDataDomain)
+    const [dataDomainHead, dataDomainTail] = chain([
+      first(markDataDomain),
+      last(markDataDomain)
     ])
       .map(markScale)
       .sortBy(); //sort the pixel values return by the domain extents
     // find the necessary spacing (based on bar width) to push the bars completely inside the tick domain
     const [spacingTail, spacingHead] = [
-      _.clamp(P - (domainTail - dataDomainTail), 0, P),
-      _.clamp(P - (dataDomainHead - domainHead), 0, P)
+      clamp(P - (domainTail - dataDomainTail), 0, P),
+      clamp(P - (dataDomainHead - domainHead), 0, P)
     ];
 
     if (horizontal) {
@@ -251,7 +253,7 @@ export default class MarkerLineChart extends React.Component {
     ].map(eventName => {
       // partially apply this bar's data point as 2nd callback argument
       const callback = methodIfFuncProp(eventName, this.props, this);
-      return _.isFunction(callback) ? _.partial(callback, _, d) : null;
+      return isFunction(callback) ? partial(callback, placeholder, d) : null;
     });
 
     const {
@@ -267,14 +269,14 @@ export default class MarkerLineChart extends React.Component {
     } = this.props;
     const xVal = xScale(makeAccessor2(x)(d));
     const yVal = yScale(makeAccessor2(y)(d));
-    const xEndVal = _.isUndefined(xEnd) ? 0 : xScale(makeAccessor2(xEnd)(d));
-    const yEndVal = _.isUndefined(yEnd) ? 0 : yScale(makeAccessor2(yEnd)(d));
+    const xEndVal = isUndefined(xEnd) ? 0 : xScale(makeAccessor2(xEnd)(d));
+    const yEndVal = isUndefined(yEnd) ? 0 : yScale(makeAccessor2(yEnd)(d));
     const [x1, y1] = [xVal, yVal];
     const x2 = horizontal ? xVal : xEndVal;
     const y2 = horizontal ? yEndVal : yVal;
     const key = `marker-line-${i}`;
 
-    if (!_.every([x1, x2, y1, y2], _.isFinite)) return null;
+    if (!every([x1, x2, y1, y2], isFinite)) return null;
     return (
       <line
         className={`${getValue(lineClassName, d, i)}`}
@@ -292,7 +294,7 @@ export default class MarkerLineChart extends React.Component {
     ].map(eventName => {
       // partially apply this bar's data point as 2nd callback argument
       const callback = methodIfFuncProp(eventName, this.props, this);
-      return _.isFunction(callback) ? _.partial(callback, _, d) : null;
+      return isFunction(callback) ? partial(callback, placeholder, d) : null;
     });
 
     const {
@@ -313,7 +315,7 @@ export default class MarkerLineChart extends React.Component {
     const y2 = !horizontal ? yVal : yVal + lineLength / 2;
     const key = `marker-line-${i}`;
 
-    if (!_.every([x1, x2, y1, y2], _.isFinite)) return null;
+    if (!every([x1, x2, y1, y2], isFinite)) return null;
     return (
       <line
         className={`${getValue(lineClassName, d, i)}`}

src/MeasuredValueLabel.js

@@ -1,5 +1,8 @@
 import React from "react";
-import _ from "lodash";
+import identity from "lodash/identity";
+import defaults from "lodash/defaults";
+import assign from "lodash/assign";
+import omit from "lodash/omit";
 import measureText from "./utils/measureText";
 import PropTypes from "prop-types";
 
@@ -8,7 +11,7 @@ export default class MeasuredValueLabel extends React.Component {
     value: PropTypes.any
   };
   static defaultProps = {
-    format: _.identity,
+    format: identity,
     style: {
       fontFamily: "Helvetica, sans-serif",
       fontSize: "20px",
@@ -18,12 +21,9 @@ export default class MeasuredValueLabel extends React.Component {
   };
   static getLabel(props) {
     const { value, format } = props;
-    const style = _.defaults(
-      props.style,
-      MeasuredValueLabel.defaultProps.style
-    );
+    const style = defaults(props.style, MeasuredValueLabel.defaultProps.style);
     const labelStr = format(value);
-    const measured = measureText(_.assign({ text: labelStr }, style));
+    const measured = measureText(assign({ text: labelStr }, style));
 
     return {
       value: props.value,
@@ -35,7 +35,7 @@ export default class MeasuredValueLabel extends React.Component {
 
   render() {
     const { value, format } = this.props;
-    const passedProps = _.omit(this.props, ["value", "format"]);
+    const passedProps = omit(this.props, ["value", "format"]);
 
     return (
       <text {...passedProps}>

src/PieChart.js

@@ -1,4 +1,7 @@
-import _ from "lodash";
+import sumBy from "lodash/sumBy";
+import isFinite from "lodash/isFinite";
+import isFunction from "lodash/isFunction";
+import partial, { placeholder } from "lodash/partial";
 import PropTypes from "prop-types";
 import React from "react";
 import { methodIfFuncProp } from "./util.js";
@@ -212,9 +215,9 @@ class PieChart extends React.Component {
     } = this.props;
 
     const valueAccessor = makeAccessor(this.props.getValue);
-    const sum = _.sumBy(this.props.data, valueAccessor);
+    const sum = sumBy(this.props.data, valueAccessor);
     const total = this.props.total || sum;
-    const markerLinePercent = _.isFinite(markerLineValue)
+    const markerLinePercent = isFinite(markerLineValue)
       ? markerLineValue / total
       : null;
 
@@ -240,7 +243,9 @@ class PieChart extends React.Component {
           ].map(eventName => {
             // partially apply this bar's data point as 2nd callback argument
             const callback = methodIfFuncProp(eventName, this.props, this);
-            return _.isFunction(callback) ? _.partial(callback, _, d) : null;
+            return isFunction(callback)
+              ? partial(callback, placeholder, d)
+              : null;
           });
 
           const className = `rct-pie-slice rct-pie-slice-${i} ${getValue(
@@ -280,7 +285,7 @@ class PieChart extends React.Component {
           />
         ) : null}
 
-        {_.isFinite(markerLinePercent)
+        {isFinite(markerLinePercent)
           ? this.renderMarkerLine(
               markerLine(
                 markerLinePercent,
@@ -316,7 +321,9 @@ class PieChart extends React.Component {
     ].map(eventName => {
       // partially apply this bar's data point as 2nd callback argument
       const callback = methodIfFuncProp(eventName, this.props, this);
-      return _.isFunction(callback) ? _.partial(callback, _, lineD) : null;
+      return isFunction(callback)
+        ? partial(callback, placeholder, lineD)
+        : null;
     });
 
     return (