@nivo/stream - npm Package Compare versions

Comparing version 0.51.0 to 0.51.4

cjs/nivo-stream.js

@@ -14,4 +14,2 @@ 'use strict';
 var reactMotion = require('react-motion');
-var isFunction = _interopDefault(require('lodash/isFunction'));
-var d3Format = require('d3-format');
 var withState = _interopDefault(require('recompose/withState'));
@@ -21,7 +19,6 @@ var withHandlers = _interopDefault(require('recompose/withHandlers'));
 var legends = require('@nivo/legends');
-var min = _interopDefault(require('lodash/min'));
-var max = _interopDefault(require('lodash/max'));
 var range = _interopDefault(require('lodash/range'));
 var d3Shape = require('d3-shape');
 var d3Scale = require('d3-scale');
+var d3Format = require('d3-format');
 var defaultProps = _interopDefault(require('recompose/defaultProps'));
@@ -52,2 +49,3 @@ var sortBy = _interopDefault(require('lodash/sortBy'));
         hideTooltip = _ref.hideTooltip,
+        getTooltipLabel = _ref.getTooltipLabel,
         animate = _ref.animate,
@@ -62,4 +60,3 @@ motionStiffness = _ref.motionStiffness,
             layers.map(function (layer, i) {
-                var id = layer.id,
-                    path = layer.path,
+                var path = layer.path,
                     color = layer.color;
@@ -69,3 +66,8 @@
                 var handleTooltip = function handleTooltip(e) {
-                    return showTooltip(React__default.createElement(core.BasicTooltip, { id: id, enableChip: true, color: color, theme: theme }), e);
+                    return showTooltip(React__default.createElement(core.BasicTooltip, {
+                        id: getTooltipLabel(layer),
+                        enableChip: true,
+                        color: color,
+                        theme: theme
+                    }), e);
                 };
@@ -97,4 +99,3 @@
         layers.map(function (layer, i) {
-            var id = layer.id,
-                path = layer.path,
+            var path = layer.path,
                 color = layer.color;
@@ -104,3 +105,8 @@
             var handleTooltip = function handleTooltip(e) {
-                return showTooltip(React__default.createElement(core.BasicTooltip, { id: id, enableChip: true, color: color, theme: theme }), e);
+                return showTooltip(React__default.createElement(core.BasicTooltip, {
+                    id: getTooltipLabel(layer),
+                    enableChip: true,
+                    color: color,
+                    theme: theme
+                }), e);
             };
@@ -140,3 +146,6 @@
     getBorderColor: PropTypes.func.isRequired,
-    theme: PropTypes.object.isRequired
+    theme: PropTypes.object.isRequired,
+    showTooltip: PropTypes.func.isRequired,
+    hideTooltip: PropTypes.func.isRequired,
+    getTooltipLabel: PropTypes.func.isRequired
 }, core.motionPropTypes);
@@ -294,2 +303,4 @@
     hideTooltip: PropTypes.func.isRequired,
+    getTooltipLabel: PropTypes.func.isRequired,
+    getTooltipValue: PropTypes.func.isRequired,
     isHover: PropTypes.bool.isRequired,
@@ -299,9 +310,8 @@ theme: PropTypes.object.isRequired
 
-var enhance$1 = compose(withState('isHover', 'setIsHover', false), withPropsOnChange(['slice', 'theme', 'tooltipFormat'], function (_ref2) {
+var enhance$1 = compose(withState('isHover', 'setIsHover', false), withPropsOnChange(['slice', 'theme', 'getTooltipLabel', 'getTooltipValue'], function (_ref2) {
     var slice = _ref2.slice,
         theme = _ref2.theme,
-        tooltipFormat = _ref2.tooltipFormat;
+        getTooltipLabel = _ref2.getTooltipLabel,
+        getTooltipValue = _ref2.getTooltipValue;
 
-    var format = !tooltipFormat || isFunction(tooltipFormat) ? tooltipFormat : d3Format.format(tooltipFormat);
-
     return {
@@ -311,3 +321,3 @@ tooltip: React__default.createElement(core.TableTooltip, {
             rows: slice.stack.map(function (p) {
-                return [React__default.createElement(core.Chip, { key: p.id, color: p.color }), p.id, format ? format(p.value) : p.value];
+                return [React__default.createElement(core.Chip, { key: p.id, color: p.color }), getTooltipLabel(p), getTooltipValue(p)];
             })
@@ -344,3 +354,4 @@ })
         theme = _ref.theme,
-        tooltipFormat = _ref.tooltipFormat;
+        getTooltipLabel = _ref.getTooltipLabel,
+        getTooltipValue = _ref.getTooltipValue;
     return React__default.createElement(
@@ -357,3 +368,4 @@ 'g',
                 theme: theme,
-                tooltipFormat: tooltipFormat
+                getTooltipLabel: getTooltipLabel,
+                getTooltipValue: getTooltipValue
             });
@@ -377,3 +389,4 @@ })
     hideTooltip: PropTypes.func.isRequired,
-    tooltipFormat: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
+    getTooltipLabel: PropTypes.func.isRequired,
+    getTooltipValue: PropTypes.func.isRequired,
     theme: PropTypes.object.isRequired
@@ -456,4 +469,7 @@ };
     isInteractive: PropTypes.bool,
+    tooltipLabel: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
+    getTooltipLabel: PropTypes.func.isRequired,
+    tooltipFormat: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
+    getTooltipValue: PropTypes.func.isRequired,
     enableStackTooltip: PropTypes.bool.isRequired,
-    tooltipFormat: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
 
@@ -496,3 +512,3 @@ legends: PropTypes.arrayOf(PropTypes.shape(legends.LegendPropShape)).isRequired
 var stackMin = function stackMin(layers) {
-    return min(layers.reduce(function (acc, layer) {
+    return Math.min.apply(Math, layers.reduce(function (acc, layer) {
         return [].concat(acc, layer.map(function (d) {
@@ -504,3 +520,3 @@ return d[0];
 var stackMax = function stackMax(layers) {
-    return max(layers.reduce(function (acc, layer) {
+    return Math.max.apply(Math, layers.reduce(function (acc, layer) {
         return [].concat(acc, layer.map(function (d) {
@@ -568,3 +584,3 @@ return d[1];
         return {
-            getDotSize: isFunction(dotSize) ? dotSize : function () {
+            getDotSize: typeof dotSize === 'function' ? dotSize : function () {
                 return dotSize;
@@ -581,3 +597,3 @@ }
         return {
-            getDotBorderWidth: isFunction(dotBorderWidth) ? dotBorderWidth : function () {
+            getDotBorderWidth: typeof dotBorderWidth === 'function' ? dotBorderWidth : function () {
                 return dotBorderWidth;
@@ -591,2 +607,29 @@ }
         };
+    }), withPropsOnChange(['tooltipLabel', 'tooltipFormat'], function (_ref13) {
+        var tooltipLabel = _ref13.tooltipLabel,
+            tooltipFormat = _ref13.tooltipFormat;
+
+        var getTooltipLabel = function getTooltipLabel(d) {
+            return d.id;
+        };
+        if (typeof tooltipLabel === 'function') {
+            getTooltipLabel = tooltipLabel;
+        }
+
+        var getTooltipValue = function getTooltipValue(d) {
+            return d.value;
+        };
+        if (typeof tooltipFormat === 'function') {
+            getTooltipValue = tooltipFormat;
+        } else if (typeof tooltipFormat === 'string' || tooltipFormat instanceof String) {
+            var formatter = d3Format.format(tooltipFormat);
+            getTooltipValue = function getTooltipValue(d) {
+                return formatter(d.value);
+            };
+        }
+
+        return {
+            getTooltipValue: getTooltipValue,
+            getTooltipLabel: getTooltipLabel
+        };
     }), pure)(Component);
@@ -631,3 +674,4 @@ });
         isInteractive = _ref.isInteractive,
-        tooltipFormat = _ref.tooltipFormat,
+        getTooltipValue = _ref.getTooltipValue,
+        getTooltipLabel = _ref.getTooltipLabel,
         enableStackTooltip = _ref.enableStackTooltip,
@@ -705,2 +749,3 @@ legends$$1 = _ref.legends;
                     hideTooltip: hideTooltip,
+                    getTooltipLabel: getTooltipLabel,
                     theme: theme
@@ -739,3 +784,4 @@ }, motionProps)),
                     theme: theme,
-                    tooltipFormat: tooltipFormat
+                    getTooltipValue: getTooltipValue,
+                    getTooltipLabel: getTooltipLabel
                 }),
@@ -742,0 +788,0 @@ legends$$1.map(function (legend, i) {

package.json

 {
   "name": "@nivo/stream",
-  "version": "0.51.0",
+  "version": "0.51.4",
   "license": "MIT",
@@ -40,3 +40,3 @@ "author": {
   },
-  "gitHead": "a17dfedf502a75b969e205620231a5c1fb6a1d67"
+  "gitHead": "b16756f27da2d0994093e1847f73e92d1beda1dc"
 }

umd/nivo-stream.js

 (function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('prop-types'), require('@nivo/core'), require('recompose/compose'), require('recompose/pure'), require('react-motion'), require('lodash/isFunction'), require('d3-format'), require('recompose/withState'), require('recompose/withHandlers'), require('recompose/withPropsOnChange'), require('@nivo/legends'), require('lodash/min'), require('lodash/max'), require('lodash/range'), require('d3-shape'), require('d3-scale'), require('recompose/defaultProps'), require('lodash/sortBy')) :
-  typeof define === 'function' && define.amd ? define(['exports', 'react', 'prop-types', '@nivo/core', 'recompose/compose', 'recompose/pure', 'react-motion', 'lodash/isFunction', 'd3-format', 'recompose/withState', 'recompose/withHandlers', 'recompose/withPropsOnChange', '@nivo/legends', 'lodash/min', 'lodash/max', 'lodash/range', 'd3-shape', 'd3-scale', 'recompose/defaultProps', 'lodash/sortBy'], factory) :
-  (factory((global.nivo = global.nivo || {}),global.React,global.PropTypes,global.nivo,global.RecomposeCompose,global.RecomposePure,global.ReactMotion,global['lodash/isFunction'],global.d3,global.RecomposeWithState,global.RecomposeWithHandlers,global.RecomposeWithPropsOnChange,global.nivo,global['lodash/min'],global['lodash/max'],global['lodash/range'],global.d3,global.d3,global.RecomposeDefaultProps,global['lodash/sortBy']));
-}(this, (function (exports,React,PropTypes,core,compose,pure,reactMotion,isFunction,d3Format,withState,withHandlers,withPropsOnChange,legends,min,max,range,d3Shape,d3Scale,defaultProps,sortBy) { 'use strict';
+  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('prop-types'), require('@nivo/core'), require('recompose/compose'), require('recompose/pure'), require('react-motion'), require('recompose/withState'), require('recompose/withHandlers'), require('recompose/withPropsOnChange'), require('@nivo/legends'), require('lodash/range'), require('d3-shape'), require('d3-scale'), require('d3-format'), require('recompose/defaultProps'), require('lodash/sortBy')) :
+  typeof define === 'function' && define.amd ? define(['exports', 'react', 'prop-types', '@nivo/core', 'recompose/compose', 'recompose/pure', 'react-motion', 'recompose/withState', 'recompose/withHandlers', 'recompose/withPropsOnChange', '@nivo/legends', 'lodash/range', 'd3-shape', 'd3-scale', 'd3-format', 'recompose/defaultProps', 'lodash/sortBy'], factory) :
+  (factory((global.nivo = global.nivo || {}),global.React,global.PropTypes,global.nivo,global.RecomposeCompose,global.RecomposePure,global.ReactMotion,global.RecomposeWithState,global.RecomposeWithHandlers,global.RecomposeWithPropsOnChange,global.nivo,global['lodash/range'],global.d3,global.d3,global.d3,global.RecomposeDefaultProps,global['lodash/sortBy']));
+}(this, (function (exports,React,PropTypes,core,compose,pure,reactMotion,withState,withHandlers,withPropsOnChange,legends,range,d3Shape,d3Scale,d3Format,defaultProps,sortBy) { 'use strict';
 
@@ -11,8 +11,5 @@ var React__default = 'default' in React ? React['default'] : React;
   pure = pure && pure.hasOwnProperty('default') ? pure['default'] : pure;
-  isFunction = isFunction && isFunction.hasOwnProperty('default') ? isFunction['default'] : isFunction;
   withState = withState && withState.hasOwnProperty('default') ? withState['default'] : withState;
   withHandlers = withHandlers && withHandlers.hasOwnProperty('default') ? withHandlers['default'] : withHandlers;
   withPropsOnChange = withPropsOnChange && withPropsOnChange.hasOwnProperty('default') ? withPropsOnChange['default'] : withPropsOnChange;
-  min = min && min.hasOwnProperty('default') ? min['default'] : min;
-  max = max && max.hasOwnProperty('default') ? max['default'] : max;
   range = range && range.hasOwnProperty('default') ? range['default'] : range;
@@ -44,2 +41,3 @@ defaultProps = defaultProps && defaultProps.hasOwnProperty('default') ? defaultProps['default'] : defaultProps;
           hideTooltip = _ref.hideTooltip,
+          getTooltipLabel = _ref.getTooltipLabel,
           animate = _ref.animate,
@@ -54,4 +52,3 @@ motionStiffness = _ref.motionStiffness,
               layers.map(function (layer, i) {
-                  var id = layer.id,
-                      path = layer.path,
+                  var path = layer.path,
                       color = layer.color;
@@ -61,3 +58,8 @@
                   var handleTooltip = function handleTooltip(e) {
-                      return showTooltip(React__default.createElement(core.BasicTooltip, { id: id, enableChip: true, color: color, theme: theme }), e);
+                      return showTooltip(React__default.createElement(core.BasicTooltip, {
+                          id: getTooltipLabel(layer),
+                          enableChip: true,
+                          color: color,
+                          theme: theme
+                      }), e);
                   };
@@ -89,4 +91,3 @@
           layers.map(function (layer, i) {
-              var id = layer.id,
-                  path = layer.path,
+              var path = layer.path,
                   color = layer.color;
@@ -96,3 +97,8 @@
               var handleTooltip = function handleTooltip(e) {
-                  return showTooltip(React__default.createElement(core.BasicTooltip, { id: id, enableChip: true, color: color, theme: theme }), e);
+                  return showTooltip(React__default.createElement(core.BasicTooltip, {
+                      id: getTooltipLabel(layer),
+                      enableChip: true,
+                      color: color,
+                      theme: theme
+                  }), e);
               };
@@ -132,3 +138,6 @@
       getBorderColor: PropTypes.func.isRequired,
-      theme: PropTypes.object.isRequired
+      theme: PropTypes.object.isRequired,
+      showTooltip: PropTypes.func.isRequired,
+      hideTooltip: PropTypes.func.isRequired,
+      getTooltipLabel: PropTypes.func.isRequired
   }, core.motionPropTypes);
@@ -286,2 +295,4 @@
       hideTooltip: PropTypes.func.isRequired,
+      getTooltipLabel: PropTypes.func.isRequired,
+      getTooltipValue: PropTypes.func.isRequired,
       isHover: PropTypes.bool.isRequired,
@@ -291,9 +302,8 @@ theme: PropTypes.object.isRequired
 
-  var enhance$1 = compose(withState('isHover', 'setIsHover', false), withPropsOnChange(['slice', 'theme', 'tooltipFormat'], function (_ref2) {
+  var enhance$1 = compose(withState('isHover', 'setIsHover', false), withPropsOnChange(['slice', 'theme', 'getTooltipLabel', 'getTooltipValue'], function (_ref2) {
       var slice = _ref2.slice,
           theme = _ref2.theme,
-          tooltipFormat = _ref2.tooltipFormat;
+          getTooltipLabel = _ref2.getTooltipLabel,
+          getTooltipValue = _ref2.getTooltipValue;
 
-      var format = !tooltipFormat || isFunction(tooltipFormat) ? tooltipFormat : d3Format.format(tooltipFormat);
-
       return {
@@ -303,3 +313,3 @@ tooltip: React__default.createElement(core.TableTooltip, {
               rows: slice.stack.map(function (p) {
-                  return [React__default.createElement(core.Chip, { key: p.id, color: p.color }), p.id, format ? format(p.value) : p.value];
+                  return [React__default.createElement(core.Chip, { key: p.id, color: p.color }), getTooltipLabel(p), getTooltipValue(p)];
               })
@@ -336,3 +346,4 @@ })
           theme = _ref.theme,
-          tooltipFormat = _ref.tooltipFormat;
+          getTooltipLabel = _ref.getTooltipLabel,
+          getTooltipValue = _ref.getTooltipValue;
       return React__default.createElement(
@@ -349,3 +360,4 @@ 'g',
                   theme: theme,
-                  tooltipFormat: tooltipFormat
+                  getTooltipLabel: getTooltipLabel,
+                  getTooltipValue: getTooltipValue
               });
@@ -369,3 +381,4 @@ })
       hideTooltip: PropTypes.func.isRequired,
-      tooltipFormat: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
+      getTooltipLabel: PropTypes.func.isRequired,
+      getTooltipValue: PropTypes.func.isRequired,
       theme: PropTypes.object.isRequired
@@ -448,4 +461,7 @@ };
       isInteractive: PropTypes.bool,
+      tooltipLabel: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
+      getTooltipLabel: PropTypes.func.isRequired,
+      tooltipFormat: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
+      getTooltipValue: PropTypes.func.isRequired,
       enableStackTooltip: PropTypes.bool.isRequired,
-      tooltipFormat: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
 
@@ -488,3 +504,3 @@ legends: PropTypes.arrayOf(PropTypes.shape(legends.LegendPropShape)).isRequired
   var stackMin = function stackMin(layers) {
-      return min(layers.reduce(function (acc, layer) {
+      return Math.min.apply(Math, layers.reduce(function (acc, layer) {
           return [].concat(acc, layer.map(function (d) {
@@ -496,3 +512,3 @@ return d[0];
   var stackMax = function stackMax(layers) {
-      return max(layers.reduce(function (acc, layer) {
+      return Math.max.apply(Math, layers.reduce(function (acc, layer) {
           return [].concat(acc, layer.map(function (d) {
@@ -560,3 +576,3 @@ return d[1];
           return {
-              getDotSize: isFunction(dotSize) ? dotSize : function () {
+              getDotSize: typeof dotSize === 'function' ? dotSize : function () {
                   return dotSize;
@@ -573,3 +589,3 @@ }
           return {
-              getDotBorderWidth: isFunction(dotBorderWidth) ? dotBorderWidth : function () {
+              getDotBorderWidth: typeof dotBorderWidth === 'function' ? dotBorderWidth : function () {
                   return dotBorderWidth;
@@ -583,2 +599,29 @@ }
           };
+      }), withPropsOnChange(['tooltipLabel', 'tooltipFormat'], function (_ref13) {
+          var tooltipLabel = _ref13.tooltipLabel,
+              tooltipFormat = _ref13.tooltipFormat;
+
+          var getTooltipLabel = function getTooltipLabel(d) {
+              return d.id;
+          };
+          if (typeof tooltipLabel === 'function') {
+              getTooltipLabel = tooltipLabel;
+          }
+
+          var getTooltipValue = function getTooltipValue(d) {
+              return d.value;
+          };
+          if (typeof tooltipFormat === 'function') {
+              getTooltipValue = tooltipFormat;
+          } else if (typeof tooltipFormat === 'string' || tooltipFormat instanceof String) {
+              var formatter = d3Format.format(tooltipFormat);
+              getTooltipValue = function getTooltipValue(d) {
+                  return formatter(d.value);
+              };
+          }
+
+          return {
+              getTooltipValue: getTooltipValue,
+              getTooltipLabel: getTooltipLabel
+          };
       }), pure)(Component);
@@ -623,3 +666,4 @@ });
           isInteractive = _ref.isInteractive,
-          tooltipFormat = _ref.tooltipFormat,
+          getTooltipValue = _ref.getTooltipValue,
+          getTooltipLabel = _ref.getTooltipLabel,
           enableStackTooltip = _ref.enableStackTooltip,
@@ -697,2 +741,3 @@ legends$$1 = _ref.legends;
                       hideTooltip: hideTooltip,
+                      getTooltipLabel: getTooltipLabel,
                       theme: theme
@@ -731,3 +776,4 @@ }, motionProps)),
                       theme: theme,
-                      tooltipFormat: tooltipFormat
+                      getTooltipValue: getTooltipValue,
+                      getTooltipLabel: getTooltipLabel
                   }),
@@ -734,0 +780,0 @@ legends$$1.map(function (legend, i) {

No alert changes

Improved metrics

Total package byte prevSize

60670

increased by5.76%

Lines of code

1469

increased by6.3%

No dependency changes