@nivo/pie - npm Package Compare versions

Comparing version 0.71.0 to 0.72.0

dist/nivo-pie.cjs.js

@@ -5,9 +5,7 @@ 'use strict';
 
-function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
-
-var React = require('react');
-var React__default = _interopDefault(React);
+var react = require('react');
 var core = require('@nivo/core');
 var arcs = require('@nivo/arcs');
 var legends = require('@nivo/legends');
+var jsxRuntime = require('react/jsx-runtime');
 var d3Shape = require('d3-shape');
@@ -17,2 +15,45 @@ var colors = require('@nivo/colors');
 
+function _defineProperty(obj, key, value) {
+  if (key in obj) {
+    Object.defineProperty(obj, key, {
+      value: value,
+      enumerable: true,
+      configurable: true,
+      writable: true
+    });
+  } else {
+    obj[key] = value;
+  }
+  return obj;
+}
+
+function ownKeys(object, enumerableOnly) {
+  var keys = Object.keys(object);
+  if (Object.getOwnPropertySymbols) {
+    var symbols = Object.getOwnPropertySymbols(object);
+    if (enumerableOnly) symbols = symbols.filter(function (sym) {
+      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+    });
+    keys.push.apply(keys, symbols);
+  }
+  return keys;
+}
+function _objectSpread2(target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = arguments[i] != null ? arguments[i] : {};
+    if (i % 2) {
+      ownKeys(Object(source), true).forEach(function (key) {
+        _defineProperty(target, key, source[key]);
+      });
+    } else if (Object.getOwnPropertyDescriptors) {
+      Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+    } else {
+      ownKeys(Object(source)).forEach(function (key) {
+        Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+      });
+    }
+  }
+  return target;
+}
+
 function _objectWithoutPropertiesLoose(source, excluded) {
@@ -53,14 +94,14 @@ if (source == null) return {};
       toggleSerie = _ref.toggleSerie;
-  return React__default.createElement(React__default.Fragment, null, legends$1.map(function (legend, i) {
-    var _legend$data;
+  return jsxRuntime.jsx(jsxRuntime.Fragment, {
+    children: legends$1.map(function (legend, i) {
+      var _legend$data;
 
-    return React__default.createElement(legends.BoxLegendSvg, Object.assign({
-      key: i
-    }, legend, {
-      containerWidth: width,
-      containerHeight: height,
-      data: (_legend$data = legend.data) !== null && _legend$data !== void 0 ? _legend$data : data,
-      toggleSerie: legend.toggleSerie ? toggleSerie : undefined
-    }));
-  }));
+      return jsxRuntime.jsx(legends.BoxLegendSvg, _objectSpread2(_objectSpread2({}, legend), {}, {
+        containerWidth: width,
+        containerHeight: height,
+        data: (_legend$data = legend.data) !== null && _legend$data !== void 0 ? _legend$data : data,
+        toggleSerie: legend.toggleSerie ? toggleSerie : undefined
+      }), i);
+    })
+  });
 };
@@ -89,3 +130,3 @@
   if (n === "Object" && o.constructor) n = o.constructor.name;
-  if (n === "Map" || n === "Set") return Array.from(n);
+  if (n === "Map" || n === "Set") return Array.from(o);
   if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
@@ -138,48 +179,5 @@ }
 
-function _defineProperty(obj, key, value) {
-  if (key in obj) {
-    Object.defineProperty(obj, key, {
-      value: value,
-      enumerable: true,
-      configurable: true,
-      writable: true
-    });
-  } else {
-    obj[key] = value;
-  }
-  return obj;
-}
-
-function ownKeys(object, enumerableOnly) {
-  var keys = Object.keys(object);
-  if (Object.getOwnPropertySymbols) {
-    var symbols = Object.getOwnPropertySymbols(object);
-    if (enumerableOnly) symbols = symbols.filter(function (sym) {
-      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-    });
-    keys.push.apply(keys, symbols);
-  }
-  return keys;
-}
-function _objectSpread2(target) {
-  for (var i = 1; i < arguments.length; i++) {
-    var source = arguments[i] != null ? arguments[i] : {};
-    if (i % 2) {
-      ownKeys(Object(source), true).forEach(function (key) {
-        _defineProperty(target, key, source[key]);
-      });
-    } else if (Object.getOwnPropertyDescriptors) {
-      Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
-    } else {
-      ownKeys(Object(source)).forEach(function (key) {
-        Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
-      });
-    }
-  }
-  return target;
-}
-
 var PieTooltip = function PieTooltip(_ref) {
   var datum = _ref.datum;
-  return React__default.createElement(tooltip.BasicTooltip, {
+  return jsxRuntime.jsx(tooltip.BasicTooltip, {
     id: datum.id,
@@ -260,3 +258,3 @@ value: datum.formattedValue,
   var getColor = colors.useOrdinalColorScale(colors$1, 'id');
-  return React.useMemo(function () {
+  return react.useMemo(function () {
     return data.map(function (datum) {
@@ -293,3 +291,3 @@ var _datum$label;
       hiddenIds = _ref2.hiddenIds;
-  var pie = React.useMemo(function () {
+  var pie = react.useMemo(function () {
     var innerPie = d3Shape.pie().value(function (d) {
@@ -305,3 +303,3 @@ return d.value;
   }, [startAngle, endAngle, padAngle, sortByValue]);
-  return React.useMemo(function () {
+  return react.useMemo(function () {
     var hiddenData = data.filter(function (item) {
@@ -356,3 +354,3 @@ return !hiddenIds.includes(item.id);
 
-  var _useState = React.useState(null),
+  var _useState = react.useState(null),
       _useState2 = _slicedToArray(_useState, 2),
@@ -362,3 +360,3 @@ activeId = _useState2[0],
 
-  var _useState3 = React.useState([]),
+  var _useState3 = react.useState([]),
       _useState4 = _slicedToArray(_useState3, 2),
@@ -381,3 +379,3 @@ hiddenIds = _useState4[0],
   });
-  var toggleSerie = React.useCallback(function (id) {
+  var toggleSerie = react.useCallback(function (id) {
     setHiddenIds(function (state) {
@@ -422,3 +420,3 @@ return state.indexOf(id) > -1 ? state.filter(function (item) {
 
-  var _useState5 = React.useState(null),
+  var _useState5 = react.useState(null),
       _useState6 = _slicedToArray(_useState5, 2),
@@ -428,3 +426,3 @@ activeId = _useState6[0],
 
-  var _useState7 = React.useState([]),
+  var _useState7 = react.useState([]),
       _useState8 = _slicedToArray(_useState7, 2),
@@ -434,3 +432,3 @@ hiddenIds = _useState8[0],
 
-  var computedProps = React.useMemo(function () {
+  var computedProps = react.useMemo(function () {
     var radius = Math.min(width, height) / 2;
@@ -486,3 +484,3 @@ var innerRadius = radius * Math.min(innerRadiusRatio, 1);
   });
-  var toggleSerie = React.useCallback(function (id) {
+  var toggleSerie = react.useCallback(function (id) {
     setHiddenIds(function (state) {
@@ -511,3 +509,3 @@ return state.indexOf(id) > -1 ? state.filter(function (item) {
       innerRadius = _ref5.innerRadius;
-  return React.useMemo(function () {
+  return react.useMemo(function () {
     return {
@@ -543,3 +541,3 @@ dataWithArc: dataWithArc,
 
-  var handleClick = React.useMemo(function () {
+  var handleClick = react.useMemo(function () {
     if (!isInteractive) return undefined;
@@ -550,6 +548,6 @@ return function (datum, event) {
   }, [isInteractive, onClick]);
-  var handleMouseEnter = React.useMemo(function () {
+  var handleMouseEnter = react.useMemo(function () {
     if (!isInteractive) return undefined;
     return function (datum, event) {
-      showTooltipFromEvent(React.createElement(tooltip$1, {
+      showTooltipFromEvent(react.createElement(tooltip$1, {
         datum: datum
@@ -561,6 +559,6 @@ }), event);
   }, [isInteractive, showTooltipFromEvent, setActiveId, onMouseEnter]);
-  var handleMouseMove = React.useMemo(function () {
+  var handleMouseMove = react.useMemo(function () {
     if (!isInteractive) return undefined;
     return function (datum, event) {
-      showTooltipFromEvent(React.createElement(tooltip$1, {
+      showTooltipFromEvent(react.createElement(tooltip$1, {
         datum: datum
@@ -571,3 +569,3 @@ }), event);
   }, [isInteractive, showTooltipFromEvent, onMouseMove]);
-  var handleMouseLeave = React.useMemo(function () {
+  var handleMouseLeave = react.useMemo(function () {
     if (!isInteractive) return undefined;
@@ -580,3 +578,3 @@ return function (datum, event) {
   }, [isInteractive, hideTooltip, setActiveId, onMouseLeave]);
-  return React__default.createElement(arcs.ArcsLayer, {
+  return jsxRuntime.jsx(arcs.ArcsLayer, {
     center: center,
@@ -730,4 +728,3 @@ data: data,
   if (enableArcLinkLabels && layers.includes('arcLinkLabels')) {
-    layerById.arcLinkLabels = React__default.createElement(arcs.ArcLinkLabelsLayer, {
-      key: "arcLinkLabels",
+    layerById.arcLinkLabels = jsxRuntime.jsx(arcs.ArcLinkLabelsLayer, {
       center: [centerX, centerY],
@@ -745,8 +742,7 @@ data: dataWithArc,
       component: arcLinkLabelComponent
-    });
+    }, "arcLinkLabels");
   }
 
   if (layers.includes('arcs')) {
-    layerById.arcs = React__default.createElement(Arcs, {
-      key: "arcs",
+    layerById.arcs = jsxRuntime.jsx(Arcs, {
       center: [centerX, centerY],
@@ -765,8 +761,7 @@ data: dataWithArc,
       transitionMode: transitionMode
-    });
+    }, "arcs");
   }
 
   if (enableArcLabels && layers.includes('arcLabels')) {
-    layerById.arcLabels = React__default.createElement(arcs.ArcLabelsLayer, {
-      key: "arcLabels",
+    layerById.arcLabels = jsxRuntime.jsx(arcs.ArcLabelsLayer, {
       center: [centerX, centerY],
@@ -780,8 +775,7 @@ data: dataWithArc,
       component: arcLabelsComponent
-    });
+    }, "arcLabels");
   }
 
   if (legends.length > 0 && layers.includes('legends')) {
-    layerById.legends = React__default.createElement(PieLegends, {
-      key: "legends",
+    layerById.legends = jsxRuntime.jsx(PieLegends, {
       width: innerWidth,
@@ -792,3 +786,3 @@ height: innerHeight,
       toggleSerie: toggleSerie
-    });
+    }, "legends");
   }
@@ -804,3 +798,3 @@
   });
-  return React__default.createElement(core.SvgWrapper, {
+  return jsxRuntime.jsx(core.SvgWrapper, {
     width: outerWidth,
@@ -810,16 +804,17 @@ height: outerHeight,
     defs: boundDefs,
-    role: role
-  }, layers.map(function (layer, i) {
-    if (layerById[layer] !== undefined) {
-      return layerById[layer];
-    }
+    role: role,
+    children: layers.map(function (layer, i) {
+      if (layerById[layer] !== undefined) {
+        return layerById[layer];
+      }
 
-    if (typeof layer === 'function') {
-      return React__default.createElement(React.Fragment, {
-        key: i
-      }, React.createElement(layer, layerContext));
-    }
+      if (typeof layer === 'function') {
+        return jsxRuntime.jsx(react.Fragment, {
+          children: react.createElement(layer, layerContext)
+        }, i);
+      }
 
-    return null;
-  }));
+      return null;
+    })
+  });
 };
@@ -838,3 +833,3 @@
 
-  return React__default.createElement(core.Container, {
+  return jsxRuntime.jsx(core.Container, {
     animate: animate,
@@ -844,16 +839,19 @@ isInteractive: isInteractive,
     renderWrapper: renderWrapper,
-    theme: theme
-  }, React__default.createElement(InnerPie, Object.assign({
-    isInteractive: isInteractive
-  }, otherProps)));
+    theme: theme,
+    children: jsxRuntime.jsx(InnerPie, _objectSpread2({
+      isInteractive: isInteractive
+    }, otherProps))
+  });
 };
 
 var ResponsivePie = function ResponsivePie(props) {
-  return React__default.createElement(core.ResponsiveWrapper, null, function (_ref) {
-    var width = _ref.width,
-        height = _ref.height;
-    return React__default.createElement(Pie, Object.assign({
-      width: width,
-      height: height
-    }, props));
+  return jsxRuntime.jsx(core.ResponsiveWrapper, {
+    children: function children(_ref) {
+      var width = _ref.width,
+          height = _ref.height;
+      return jsxRuntime.jsx(Pie, _objectSpread2({
+        width: width,
+        height: height
+      }, props));
+    }
   });
@@ -936,3 +934,3 @@ };
       legends$1 = _ref$legends === void 0 ? defaultProps.legends : _ref$legends;
-  var canvasEl = React.useRef(null);
+  var canvasEl = react.useRef(null);
   var theme = core.useTheme();
@@ -996,3 +994,3 @@
   });
-  React.useEffect(function () {
+  react.useEffect(function () {
     if (!canvasEl.current) return;
@@ -1041,3 +1039,3 @@ canvasEl.current.width = outerWidth * pixelRatio;
   }, [canvasEl, innerWidth, innerHeight, outerWidth, outerHeight, margin.top, margin.left, pixelRatio, centerX, centerY, arcGenerator, dataWithArc, getBorderColor, enableArcLabels, arcLabels, enableArcLinkLabels, arcLinkLabels, arcLinkLabelsThickness, legends$1, theme]);
-  var arcs$1 = React.useMemo(function () {
+  var arcs$1 = react.useMemo(function () {
     return dataWithArc.map(function (datum) {
@@ -1075,3 +1073,3 @@ return _objectSpread2({
       setActiveId(datum.id);
-      showTooltipFromEvent(React.createElement(tooltip$1, {
+      showTooltipFromEvent(react.createElement(tooltip$1, {
         datum: datum
@@ -1098,3 +1096,3 @@ }), event);
 
-  return React__default.createElement("canvas", {
+  return jsxRuntime.jsx("canvas", {
     ref: canvasEl,
@@ -1122,19 +1120,22 @@ width: outerWidth * pixelRatio,
 
-  return React__default.createElement(core.Container, {
+  return jsxRuntime.jsx(core.Container, {
     isInteractive: isInteractive,
     renderWrapper: renderWrapper,
-    theme: theme
-  }, React__default.createElement(InnerPieCanvas, Object.assign({
-    isInteractive: isInteractive
-  }, otherProps)));
+    theme: theme,
+    children: jsxRuntime.jsx(InnerPieCanvas, _objectSpread2({
+      isInteractive: isInteractive
+    }, otherProps))
+  });
 };
 
 var ResponsivePieCanvas = function ResponsivePieCanvas(props) {
-  return React__default.createElement(core.ResponsiveWrapper, null, function (_ref) {
-    var width = _ref.width,
-        height = _ref.height;
-    return React__default.createElement(PieCanvas, Object.assign({
-      width: width,
-      height: height
-    }, props));
+  return jsxRuntime.jsx(core.ResponsiveWrapper, {
+    children: function children(_ref) {
+      var width = _ref.width,
+          height = _ref.height;
+      return jsxRuntime.jsx(PieCanvas, _objectSpread2({
+        width: width,
+        height: height
+      }, props));
+    }
   });
@@ -1141,0 +1142,0 @@ };

dist/nivo-pie.es.js

@@ -1,5 +0,6 @@
-import React, { useMemo, useState, useCallback, createElement, Fragment, useRef, useEffect } from 'react';
+import { useMemo, useState, useCallback, createElement, Fragment as Fragment$1, useRef, useEffect } from 'react';
 import { usePropertyAccessor, useValueFormatter, degreesToRadians, radiansToDegrees, Container, useDimensions, bindDefs, SvgWrapper, ResponsiveWrapper, useTheme, getRelativeCursor } from '@nivo/core';
 import { useArcGenerator, computeArcBoundingBox, ArcsLayer, ArcLinkLabelsLayer, ArcLabelsLayer, useArcLabels, useArcLinkLabels, drawCanvasArcLinkLabels, drawCanvasArcLabels, findArcUnderCursor } from '@nivo/arcs';
 import { BoxLegendSvg, renderLegendToCanvas } from '@nivo/legends';
+import { jsx, Fragment } from 'react/jsx-runtime';
 import { pie } from 'd3-shape';
@@ -9,2 +10,45 @@ import { useOrdinalColorScale, useInheritedColor } from '@nivo/colors';
 
+function _defineProperty(obj, key, value) {
+  if (key in obj) {
+    Object.defineProperty(obj, key, {
+      value: value,
+      enumerable: true,
+      configurable: true,
+      writable: true
+    });
+  } else {
+    obj[key] = value;
+  }
+  return obj;
+}
+
+function ownKeys(object, enumerableOnly) {
+  var keys = Object.keys(object);
+  if (Object.getOwnPropertySymbols) {
+    var symbols = Object.getOwnPropertySymbols(object);
+    if (enumerableOnly) symbols = symbols.filter(function (sym) {
+      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+    });
+    keys.push.apply(keys, symbols);
+  }
+  return keys;
+}
+function _objectSpread2(target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = arguments[i] != null ? arguments[i] : {};
+    if (i % 2) {
+      ownKeys(Object(source), true).forEach(function (key) {
+        _defineProperty(target, key, source[key]);
+      });
+    } else if (Object.getOwnPropertyDescriptors) {
+      Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+    } else {
+      ownKeys(Object(source)).forEach(function (key) {
+        Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+      });
+    }
+  }
+  return target;
+}
+
 function _objectWithoutPropertiesLoose(source, excluded) {
@@ -45,14 +89,14 @@ if (source == null) return {};
       toggleSerie = _ref.toggleSerie;
-  return React.createElement(React.Fragment, null, legends.map(function (legend, i) {
-    var _legend$data;
+  return jsx(Fragment, {
+    children: legends.map(function (legend, i) {
+      var _legend$data;
 
-    return React.createElement(BoxLegendSvg, Object.assign({
-      key: i
-    }, legend, {
-      containerWidth: width,
-      containerHeight: height,
-      data: (_legend$data = legend.data) !== null && _legend$data !== void 0 ? _legend$data : data,
-      toggleSerie: legend.toggleSerie ? toggleSerie : undefined
-    }));
-  }));
+      return jsx(BoxLegendSvg, _objectSpread2(_objectSpread2({}, legend), {}, {
+        containerWidth: width,
+        containerHeight: height,
+        data: (_legend$data = legend.data) !== null && _legend$data !== void 0 ? _legend$data : data,
+        toggleSerie: legend.toggleSerie ? toggleSerie : undefined
+      }), i);
+    })
+  });
 };
@@ -81,3 +125,3 @@
   if (n === "Object" && o.constructor) n = o.constructor.name;
-  if (n === "Map" || n === "Set") return Array.from(n);
+  if (n === "Map" || n === "Set") return Array.from(o);
   if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
@@ -130,48 +174,5 @@ }
 
-function _defineProperty(obj, key, value) {
-  if (key in obj) {
-    Object.defineProperty(obj, key, {
-      value: value,
-      enumerable: true,
-      configurable: true,
-      writable: true
-    });
-  } else {
-    obj[key] = value;
-  }
-  return obj;
-}
-
-function ownKeys(object, enumerableOnly) {
-  var keys = Object.keys(object);
-  if (Object.getOwnPropertySymbols) {
-    var symbols = Object.getOwnPropertySymbols(object);
-    if (enumerableOnly) symbols = symbols.filter(function (sym) {
-      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-    });
-    keys.push.apply(keys, symbols);
-  }
-  return keys;
-}
-function _objectSpread2(target) {
-  for (var i = 1; i < arguments.length; i++) {
-    var source = arguments[i] != null ? arguments[i] : {};
-    if (i % 2) {
-      ownKeys(Object(source), true).forEach(function (key) {
-        _defineProperty(target, key, source[key]);
-      });
-    } else if (Object.getOwnPropertyDescriptors) {
-      Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
-    } else {
-      ownKeys(Object(source)).forEach(function (key) {
-        Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
-      });
-    }
-  }
-  return target;
-}
-
 var PieTooltip = function PieTooltip(_ref) {
   var datum = _ref.datum;
-  return React.createElement(BasicTooltip, {
+  return jsx(BasicTooltip, {
     id: datum.id,
@@ -557,3 +558,3 @@ value: datum.formattedValue,
   }, [isInteractive, hideTooltip, setActiveId, onMouseLeave]);
-  return React.createElement(ArcsLayer, {
+  return jsx(ArcsLayer, {
     center: center,
@@ -707,4 +708,3 @@ data: data,
   if (enableArcLinkLabels && layers.includes('arcLinkLabels')) {
-    layerById.arcLinkLabels = React.createElement(ArcLinkLabelsLayer, {
-      key: "arcLinkLabels",
+    layerById.arcLinkLabels = jsx(ArcLinkLabelsLayer, {
       center: [centerX, centerY],
@@ -722,8 +722,7 @@ data: dataWithArc,
       component: arcLinkLabelComponent
-    });
+    }, "arcLinkLabels");
   }
 
   if (layers.includes('arcs')) {
-    layerById.arcs = React.createElement(Arcs, {
-      key: "arcs",
+    layerById.arcs = jsx(Arcs, {
       center: [centerX, centerY],
@@ -742,8 +741,7 @@ data: dataWithArc,
       transitionMode: transitionMode
-    });
+    }, "arcs");
   }
 
   if (enableArcLabels && layers.includes('arcLabels')) {
-    layerById.arcLabels = React.createElement(ArcLabelsLayer, {
-      key: "arcLabels",
+    layerById.arcLabels = jsx(ArcLabelsLayer, {
       center: [centerX, centerY],
@@ -757,8 +755,7 @@ data: dataWithArc,
       component: arcLabelsComponent
-    });
+    }, "arcLabels");
   }
 
   if (legends.length > 0 && layers.includes('legends')) {
-    layerById.legends = React.createElement(PieLegends, {
-      key: "legends",
+    layerById.legends = jsx(PieLegends, {
       width: innerWidth,
@@ -769,3 +766,3 @@ height: innerHeight,
       toggleSerie: toggleSerie
-    });
+    }, "legends");
   }
@@ -781,3 +778,3 @@
   });
-  return React.createElement(SvgWrapper, {
+  return jsx(SvgWrapper, {
     width: outerWidth,
@@ -787,16 +784,17 @@ height: outerHeight,
     defs: boundDefs,
-    role: role
-  }, layers.map(function (layer, i) {
-    if (layerById[layer] !== undefined) {
-      return layerById[layer];
-    }
+    role: role,
+    children: layers.map(function (layer, i) {
+      if (layerById[layer] !== undefined) {
+        return layerById[layer];
+      }
 
-    if (typeof layer === 'function') {
-      return React.createElement(Fragment, {
-        key: i
-      }, createElement(layer, layerContext));
-    }
+      if (typeof layer === 'function') {
+        return jsx(Fragment$1, {
+          children: createElement(layer, layerContext)
+        }, i);
+      }
 
-    return null;
-  }));
+      return null;
+    })
+  });
 };
@@ -815,3 +813,3 @@
 
-  return React.createElement(Container, {
+  return jsx(Container, {
     animate: animate,
@@ -821,16 +819,19 @@ isInteractive: isInteractive,
     renderWrapper: renderWrapper,
-    theme: theme
-  }, React.createElement(InnerPie, Object.assign({
-    isInteractive: isInteractive
-  }, otherProps)));
+    theme: theme,
+    children: jsx(InnerPie, _objectSpread2({
+      isInteractive: isInteractive
+    }, otherProps))
+  });
 };
 
 var ResponsivePie = function ResponsivePie(props) {
-  return React.createElement(ResponsiveWrapper, null, function (_ref) {
-    var width = _ref.width,
-        height = _ref.height;
-    return React.createElement(Pie, Object.assign({
-      width: width,
-      height: height
-    }, props));
+  return jsx(ResponsiveWrapper, {
+    children: function children(_ref) {
+      var width = _ref.width,
+          height = _ref.height;
+      return jsx(Pie, _objectSpread2({
+        width: width,
+        height: height
+      }, props));
+    }
   });
@@ -1071,3 +1072,3 @@ };
 
-  return React.createElement("canvas", {
+  return jsx("canvas", {
     ref: canvasEl,
@@ -1095,19 +1096,22 @@ width: outerWidth * pixelRatio,
 
-  return React.createElement(Container, {
+  return jsx(Container, {
     isInteractive: isInteractive,
     renderWrapper: renderWrapper,
-    theme: theme
-  }, React.createElement(InnerPieCanvas, Object.assign({
-    isInteractive: isInteractive
-  }, otherProps)));
+    theme: theme,
+    children: jsx(InnerPieCanvas, _objectSpread2({
+      isInteractive: isInteractive
+    }, otherProps))
+  });
 };
 
 var ResponsivePieCanvas = function ResponsivePieCanvas(props) {
-  return React.createElement(ResponsiveWrapper, null, function (_ref) {
-    var width = _ref.width,
-        height = _ref.height;
-    return React.createElement(PieCanvas, Object.assign({
-      width: width,
-      height: height
-    }, props));
+  return jsx(ResponsiveWrapper, {
+    children: function children(_ref) {
+      var width = _ref.width,
+          height = _ref.height;
+      return jsx(PieCanvas, _objectSpread2({
+        width: width,
+        height: height
+      }, props));
+    }
   });
@@ -1114,0 +1118,0 @@ };

dist/nivo-pie.umd.js

 (function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('@nivo/core'), require('@nivo/arcs'), require('@nivo/legends'), require('d3-shape'), require('@nivo/colors'), require('@nivo/tooltip')) :
-  typeof define === 'function' && define.amd ? define(['exports', 'react', '@nivo/core', '@nivo/arcs', '@nivo/legends', 'd3-shape', '@nivo/colors', '@nivo/tooltip'], factory) :
-  (global = global || self, factory(global.nivo = global.nivo || {}, global.React, global.nivo, global.nivo, global.nivo, global.d3, global.nivo, global.nivo));
-}(this, (function (exports, React, core, arcs, legends, d3Shape, colors, tooltip) { 'use strict';
+  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('@nivo/core'), require('@nivo/arcs'), require('@nivo/legends'), require('react/jsx-runtime'), require('d3-shape'), require('@nivo/colors'), require('@nivo/tooltip')) :
+  typeof define === 'function' && define.amd ? define(['exports', 'react', '@nivo/core', '@nivo/arcs', '@nivo/legends', 'react/jsx-runtime', 'd3-shape', '@nivo/colors', '@nivo/tooltip'], factory) :
+  (global = global || self, factory(global.nivo = global.nivo || {}, global.React, global.nivo, global.nivo, global.nivo, global['react/jsx-runtime'], global.d3, global.nivo, global.nivo));
+}(this, (function (exports, react, core, arcs, legends, jsxRuntime, d3Shape, colors, tooltip) { 'use strict';
 
-  var React__default = 'default' in React ? React['default'] : React;
+  function _defineProperty(obj, key, value) {
+    if (key in obj) {
+      Object.defineProperty(obj, key, {
+        value: value,
+        enumerable: true,
+        configurable: true,
+        writable: true
+      });
+    } else {
+      obj[key] = value;
+    }
+    return obj;
+  }
 
+  function ownKeys(object, enumerableOnly) {
+    var keys = Object.keys(object);
+    if (Object.getOwnPropertySymbols) {
+      var symbols = Object.getOwnPropertySymbols(object);
+      if (enumerableOnly) symbols = symbols.filter(function (sym) {
+        return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+      });
+      keys.push.apply(keys, symbols);
+    }
+    return keys;
+  }
+  function _objectSpread2(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i] != null ? arguments[i] : {};
+      if (i % 2) {
+        ownKeys(Object(source), true).forEach(function (key) {
+          _defineProperty(target, key, source[key]);
+        });
+      } else if (Object.getOwnPropertyDescriptors) {
+        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+      } else {
+        ownKeys(Object(source)).forEach(function (key) {
+          Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+        });
+      }
+    }
+    return target;
+  }
+
   function _objectWithoutPropertiesLoose(source, excluded) {
@@ -44,14 +85,14 @@ if (source == null) return {};
         toggleSerie = _ref.toggleSerie;
-    return React__default.createElement(React__default.Fragment, null, legends$1.map(function (legend, i) {
-      var _legend$data;
+    return jsxRuntime.jsx(jsxRuntime.Fragment, {
+      children: legends$1.map(function (legend, i) {
+        var _legend$data;
 
-      return React__default.createElement(legends.BoxLegendSvg, Object.assign({
-        key: i
-      }, legend, {
-        containerWidth: width,
-        containerHeight: height,
-        data: (_legend$data = legend.data) !== null && _legend$data !== void 0 ? _legend$data : data,
-        toggleSerie: legend.toggleSerie ? toggleSerie : undefined
-      }));
-    }));
+        return jsxRuntime.jsx(legends.BoxLegendSvg, _objectSpread2(_objectSpread2({}, legend), {}, {
+          containerWidth: width,
+          containerHeight: height,
+          data: (_legend$data = legend.data) !== null && _legend$data !== void 0 ? _legend$data : data,
+          toggleSerie: legend.toggleSerie ? toggleSerie : undefined
+        }), i);
+      })
+    });
   };
@@ -80,3 +121,3 @@
     if (n === "Object" && o.constructor) n = o.constructor.name;
-    if (n === "Map" || n === "Set") return Array.from(n);
+    if (n === "Map" || n === "Set") return Array.from(o);
     if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
@@ -129,48 +170,5 @@ }
 
-  function _defineProperty(obj, key, value) {
-    if (key in obj) {
-      Object.defineProperty(obj, key, {
-        value: value,
-        enumerable: true,
-        configurable: true,
-        writable: true
-      });
-    } else {
-      obj[key] = value;
-    }
-    return obj;
-  }
-
-  function ownKeys(object, enumerableOnly) {
-    var keys = Object.keys(object);
-    if (Object.getOwnPropertySymbols) {
-      var symbols = Object.getOwnPropertySymbols(object);
-      if (enumerableOnly) symbols = symbols.filter(function (sym) {
-        return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-      });
-      keys.push.apply(keys, symbols);
-    }
-    return keys;
-  }
-  function _objectSpread2(target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i] != null ? arguments[i] : {};
-      if (i % 2) {
-        ownKeys(Object(source), true).forEach(function (key) {
-          _defineProperty(target, key, source[key]);
-        });
-      } else if (Object.getOwnPropertyDescriptors) {
-        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
-      } else {
-        ownKeys(Object(source)).forEach(function (key) {
-          Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
-        });
-      }
-    }
-    return target;
-  }
-
   var PieTooltip = function PieTooltip(_ref) {
     var datum = _ref.datum;
-    return React__default.createElement(tooltip.BasicTooltip, {
+    return jsxRuntime.jsx(tooltip.BasicTooltip, {
       id: datum.id,
@@ -251,3 +249,3 @@ value: datum.formattedValue,
     var getColor = colors.useOrdinalColorScale(colors$1, 'id');
-    return React.useMemo(function () {
+    return react.useMemo(function () {
       return data.map(function (datum) {
@@ -284,3 +282,3 @@ var _datum$label;
         hiddenIds = _ref2.hiddenIds;
-    var pie = React.useMemo(function () {
+    var pie = react.useMemo(function () {
       var innerPie = d3Shape.pie().value(function (d) {
@@ -296,3 +294,3 @@ return d.value;
     }, [startAngle, endAngle, padAngle, sortByValue]);
-    return React.useMemo(function () {
+    return react.useMemo(function () {
       var hiddenData = data.filter(function (item) {
@@ -347,3 +345,3 @@ return !hiddenIds.includes(item.id);
 
-    var _useState = React.useState(null),
+    var _useState = react.useState(null),
         _useState2 = _slicedToArray(_useState, 2),
@@ -353,3 +351,3 @@ activeId = _useState2[0],
 
-    var _useState3 = React.useState([]),
+    var _useState3 = react.useState([]),
         _useState4 = _slicedToArray(_useState3, 2),
@@ -372,3 +370,3 @@ hiddenIds = _useState4[0],
     });
-    var toggleSerie = React.useCallback(function (id) {
+    var toggleSerie = react.useCallback(function (id) {
       setHiddenIds(function (state) {
@@ -413,3 +411,3 @@ return state.indexOf(id) > -1 ? state.filter(function (item) {
 
-    var _useState5 = React.useState(null),
+    var _useState5 = react.useState(null),
         _useState6 = _slicedToArray(_useState5, 2),
@@ -419,3 +417,3 @@ activeId = _useState6[0],
 
-    var _useState7 = React.useState([]),
+    var _useState7 = react.useState([]),
         _useState8 = _slicedToArray(_useState7, 2),
@@ -425,3 +423,3 @@ hiddenIds = _useState8[0],
 
-    var computedProps = React.useMemo(function () {
+    var computedProps = react.useMemo(function () {
       var radius = Math.min(width, height) / 2;
@@ -477,3 +475,3 @@ var innerRadius = radius * Math.min(innerRadiusRatio, 1);
     });
-    var toggleSerie = React.useCallback(function (id) {
+    var toggleSerie = react.useCallback(function (id) {
       setHiddenIds(function (state) {
@@ -502,3 +500,3 @@ return state.indexOf(id) > -1 ? state.filter(function (item) {
         innerRadius = _ref5.innerRadius;
-    return React.useMemo(function () {
+    return react.useMemo(function () {
       return {
@@ -534,3 +532,3 @@ dataWithArc: dataWithArc,
 
-    var handleClick = React.useMemo(function () {
+    var handleClick = react.useMemo(function () {
       if (!isInteractive) return undefined;
@@ -541,6 +539,6 @@ return function (datum, event) {
     }, [isInteractive, onClick]);
-    var handleMouseEnter = React.useMemo(function () {
+    var handleMouseEnter = react.useMemo(function () {
       if (!isInteractive) return undefined;
       return function (datum, event) {
-        showTooltipFromEvent(React.createElement(tooltip$1, {
+        showTooltipFromEvent(react.createElement(tooltip$1, {
           datum: datum
@@ -552,6 +550,6 @@ }), event);
     }, [isInteractive, showTooltipFromEvent, setActiveId, onMouseEnter]);
-    var handleMouseMove = React.useMemo(function () {
+    var handleMouseMove = react.useMemo(function () {
       if (!isInteractive) return undefined;
       return function (datum, event) {
-        showTooltipFromEvent(React.createElement(tooltip$1, {
+        showTooltipFromEvent(react.createElement(tooltip$1, {
           datum: datum
@@ -562,3 +560,3 @@ }), event);
     }, [isInteractive, showTooltipFromEvent, onMouseMove]);
-    var handleMouseLeave = React.useMemo(function () {
+    var handleMouseLeave = react.useMemo(function () {
       if (!isInteractive) return undefined;
@@ -571,3 +569,3 @@ return function (datum, event) {
     }, [isInteractive, hideTooltip, setActiveId, onMouseLeave]);
-    return React__default.createElement(arcs.ArcsLayer, {
+    return jsxRuntime.jsx(arcs.ArcsLayer, {
       center: center,
@@ -721,4 +719,3 @@ data: data,
     if (enableArcLinkLabels && layers.includes('arcLinkLabels')) {
-      layerById.arcLinkLabels = React__default.createElement(arcs.ArcLinkLabelsLayer, {
-        key: "arcLinkLabels",
+      layerById.arcLinkLabels = jsxRuntime.jsx(arcs.ArcLinkLabelsLayer, {
         center: [centerX, centerY],
@@ -736,8 +733,7 @@ data: dataWithArc,
         component: arcLinkLabelComponent
-      });
+      }, "arcLinkLabels");
     }
 
     if (layers.includes('arcs')) {
-      layerById.arcs = React__default.createElement(Arcs, {
-        key: "arcs",
+      layerById.arcs = jsxRuntime.jsx(Arcs, {
         center: [centerX, centerY],
@@ -756,8 +752,7 @@ data: dataWithArc,
         transitionMode: transitionMode
-      });
+      }, "arcs");
     }
 
     if (enableArcLabels && layers.includes('arcLabels')) {
-      layerById.arcLabels = React__default.createElement(arcs.ArcLabelsLayer, {
-        key: "arcLabels",
+      layerById.arcLabels = jsxRuntime.jsx(arcs.ArcLabelsLayer, {
         center: [centerX, centerY],
@@ -771,8 +766,7 @@ data: dataWithArc,
         component: arcLabelsComponent
-      });
+      }, "arcLabels");
     }
 
     if (legends.length > 0 && layers.includes('legends')) {
-      layerById.legends = React__default.createElement(PieLegends, {
-        key: "legends",
+      layerById.legends = jsxRuntime.jsx(PieLegends, {
         width: innerWidth,
@@ -783,3 +777,3 @@ height: innerHeight,
         toggleSerie: toggleSerie
-      });
+      }, "legends");
     }
@@ -795,3 +789,3 @@
     });
-    return React__default.createElement(core.SvgWrapper, {
+    return jsxRuntime.jsx(core.SvgWrapper, {
       width: outerWidth,
@@ -801,16 +795,17 @@ height: outerHeight,
       defs: boundDefs,
-      role: role
-    }, layers.map(function (layer, i) {
-      if (layerById[layer] !== undefined) {
-        return layerById[layer];
-      }
+      role: role,
+      children: layers.map(function (layer, i) {
+        if (layerById[layer] !== undefined) {
+          return layerById[layer];
+        }
 
-      if (typeof layer === 'function') {
-        return React__default.createElement(React.Fragment, {
-          key: i
-        }, React.createElement(layer, layerContext));
-      }
+        if (typeof layer === 'function') {
+          return jsxRuntime.jsx(react.Fragment, {
+            children: react.createElement(layer, layerContext)
+          }, i);
+        }
 
-      return null;
-    }));
+        return null;
+      })
+    });
   };
@@ -829,3 +824,3 @@
 
-    return React__default.createElement(core.Container, {
+    return jsxRuntime.jsx(core.Container, {
       animate: animate,
@@ -835,16 +830,19 @@ isInteractive: isInteractive,
       renderWrapper: renderWrapper,
-      theme: theme
-    }, React__default.createElement(InnerPie, Object.assign({
-      isInteractive: isInteractive
-    }, otherProps)));
+      theme: theme,
+      children: jsxRuntime.jsx(InnerPie, _objectSpread2({
+        isInteractive: isInteractive
+      }, otherProps))
+    });
   };
 
   var ResponsivePie = function ResponsivePie(props) {
-    return React__default.createElement(core.ResponsiveWrapper, null, function (_ref) {
-      var width = _ref.width,
-          height = _ref.height;
-      return React__default.createElement(Pie, Object.assign({
-        width: width,
-        height: height
-      }, props));
+    return jsxRuntime.jsx(core.ResponsiveWrapper, {
+      children: function children(_ref) {
+        var width = _ref.width,
+            height = _ref.height;
+        return jsxRuntime.jsx(Pie, _objectSpread2({
+          width: width,
+          height: height
+        }, props));
+      }
     });
@@ -927,3 +925,3 @@ };
         legends$1 = _ref$legends === void 0 ? defaultProps.legends : _ref$legends;
-    var canvasEl = React.useRef(null);
+    var canvasEl = react.useRef(null);
     var theme = core.useTheme();
@@ -987,3 +985,3 @@
     });
-    React.useEffect(function () {
+    react.useEffect(function () {
       if (!canvasEl.current) return;
@@ -1032,3 +1030,3 @@ canvasEl.current.width = outerWidth * pixelRatio;
     }, [canvasEl, innerWidth, innerHeight, outerWidth, outerHeight, margin.top, margin.left, pixelRatio, centerX, centerY, arcGenerator, dataWithArc, getBorderColor, enableArcLabels, arcLabels, enableArcLinkLabels, arcLinkLabels, arcLinkLabelsThickness, legends$1, theme]);
-    var arcs$1 = React.useMemo(function () {
+    var arcs$1 = react.useMemo(function () {
       return dataWithArc.map(function (datum) {
@@ -1066,3 +1064,3 @@ return _objectSpread2({
         setActiveId(datum.id);
-        showTooltipFromEvent(React.createElement(tooltip$1, {
+        showTooltipFromEvent(react.createElement(tooltip$1, {
           datum: datum
@@ -1089,3 +1087,3 @@ }), event);
 
-    return React__default.createElement("canvas", {
+    return jsxRuntime.jsx("canvas", {
       ref: canvasEl,
@@ -1113,19 +1111,22 @@ width: outerWidth * pixelRatio,
 
-    return React__default.createElement(core.Container, {
+    return jsxRuntime.jsx(core.Container, {
       isInteractive: isInteractive,
       renderWrapper: renderWrapper,
-      theme: theme
-    }, React__default.createElement(InnerPieCanvas, Object.assign({
-      isInteractive: isInteractive
-    }, otherProps)));
+      theme: theme,
+      children: jsxRuntime.jsx(InnerPieCanvas, _objectSpread2({
+        isInteractive: isInteractive
+      }, otherProps))
+    });
   };
 
   var ResponsivePieCanvas = function ResponsivePieCanvas(props) {
-    return React__default.createElement(core.ResponsiveWrapper, null, function (_ref) {
-      var width = _ref.width,
-          height = _ref.height;
-      return React__default.createElement(PieCanvas, Object.assign({
-        width: width,
-        height: height
-      }, props));
+    return jsxRuntime.jsx(core.ResponsiveWrapper, {
+      children: function children(_ref) {
+        var width = _ref.width,
+            height = _ref.height;
+        return jsxRuntime.jsx(PieCanvas, _objectSpread2({
+          width: width,
+          height: height
+        }, props));
+      }
     });
@@ -1132,0 +1133,0 @@ };

dist/types/hooks.d.ts

@@ -12,3 +12,3 @@ /// <reference types="react" />
     data: RawDatum[];
-}) => Pick<ComputedDatum<RawDatum>, "hidden" | "color" | "data" | "label" | "id" | "value" | "formattedValue">[];
+}) => Omit<ComputedDatum<RawDatum>, "fill" | "arc">[];
 /**
@@ -18,3 +18,3 @@ * Compute arcs, which don't depend yet on radius.
 export declare const usePieArcs: <RawDatum>({ data, startAngle, endAngle, innerRadius, outerRadius, padAngle, sortByValue, activeId, activeInnerRadiusOffset, activeOuterRadiusOffset, hiddenIds, }: {
-    data: Pick<ComputedDatum<RawDatum>, "hidden" | "color" | "data" | "label" | "id" | "value" | "formattedValue">[];
+    data: Omit<ComputedDatum<RawDatum>, "fill" | "arc">[];
     startAngle: number;
@@ -31,4 +31,4 @@ endAngle: number;
 }) => {
-    dataWithArc: Pick<ComputedDatum<RawDatum>, "hidden" | "color" | "data" | "label" | "id" | "value" | "arc" | "formattedValue">[];
-    legendData: Pick<ComputedDatum<RawDatum>, "hidden" | "color" | "data" | "label" | "id" | "value" | "formattedValue">[];
+    dataWithArc: Omit<ComputedDatum<RawDatum>, "fill">[];
+    legendData: Omit<ComputedDatum<RawDatum>, "fill" | "arc">[];
 };
@@ -40,3 +40,3 @@ /**
 export declare const usePie: <RawDatum>({ data, radius, innerRadius, startAngle, endAngle, padAngle, sortByValue, cornerRadius, activeInnerRadiusOffset, activeOuterRadiusOffset, }: Pick<Partial<CompletePieSvgProps<RawDatum>>, "startAngle" | "endAngle" | "cornerRadius" | "padAngle" | "sortByValue" | "activeInnerRadiusOffset" | "activeOuterRadiusOffset"> & {
-    data: Pick<ComputedDatum<RawDatum>, "hidden" | "color" | "fill" | "data" | "label" | "id" | "value" | "formattedValue">[];
+    data: Omit<ComputedDatum<RawDatum>, "arc">[];
     radius: number;
@@ -46,6 +46,6 @@ innerRadius: number;
     arcGenerator: import("@nivo/arcs").ArcGenerator;
-    setActiveId: import("react").Dispatch<import("react").SetStateAction<string | number | null>>;
+    setActiveId: import("react").Dispatch<import("react").SetStateAction<DatumId | null>>;
     toggleSerie: (id: DatumId) => void;
-    dataWithArc: Pick<ComputedDatum<RawDatum>, "hidden" | "color" | "data" | "label" | "id" | "value" | "arc" | "formattedValue">[];
-    legendData: Pick<ComputedDatum<RawDatum>, "hidden" | "color" | "data" | "label" | "id" | "value" | "formattedValue">[];
+    dataWithArc: Omit<ComputedDatum<RawDatum>, "fill">[];
+    legendData: Omit<ComputedDatum<RawDatum>, "fill" | "arc">[];
 };
@@ -61,3 +61,3 @@ /**
 export declare const usePieFromBox: <RawDatum>({ data, width, height, innerRadius: innerRadiusRatio, startAngle, endAngle, padAngle, sortByValue, cornerRadius, fit, activeInnerRadiusOffset, activeOuterRadiusOffset, }: Pick<CompletePieSvgProps<RawDatum>, "height" | "width" | "startAngle" | "endAngle" | "innerRadius" | "cornerRadius" | "padAngle" | "sortByValue" | "fit" | "activeInnerRadiusOffset" | "activeOuterRadiusOffset"> & {
-    data: Pick<ComputedDatum<RawDatum>, "hidden" | "color" | "fill" | "data" | "label" | "id" | "value" | "formattedValue">[];
+    data: Omit<ComputedDatum<RawDatum>, "arc">[];
 }) => {
@@ -78,4 +78,4 @@ centerX: number;
     } | undefined;
-    dataWithArc: Pick<ComputedDatum<RawDatum>, "hidden" | "color" | "data" | "label" | "id" | "value" | "arc" | "formattedValue">[];
-    legendData: Pick<ComputedDatum<RawDatum>, "hidden" | "color" | "data" | "label" | "id" | "value" | "formattedValue">[];
+    dataWithArc: Omit<ComputedDatum<RawDatum>, "fill">[];
+    legendData: Omit<ComputedDatum<RawDatum>, "fill" | "arc">[];
     arcGenerator: import("@nivo/arcs").ArcGenerator;
@@ -82,0 +82,0 @@ setActiveId: import("react").Dispatch<import("react").SetStateAction<string | number | null>>;

dist/types/props.d.ts

@@ -19,3 +19,3 @@ /// <reference types="react" />
         from: string;
-        modifiers: import("csstype").AnimationIterationCountProperty[][];
+        modifiers: (string | number)[][];
     };
@@ -22,0 +22,0 @@ enableArcLabels: boolean;

dist/types/ResponsivePie.d.ts

 /// <reference types="react" />
 import { PieSvgProps } from './types';
-export declare const ResponsivePie: <RawDatum>(props: Pick<PieSvgProps<RawDatum>, "fill" | "tooltip" | "data" | "animate" | "defs" | "borderColor" | "borderWidth" | "margin" | "id" | "role" | "onClick" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "value" | "legends" | "startAngle" | "endAngle" | "innerRadius" | "theme" | "arcLabelsRadiusOffset" | "arcLabelsSkipAngle" | "arcLabelsTextColor" | "arcLabelsComponent" | "transitionMode" | "component" | "arcLinkLabel" | "arcLinkLabelsSkipAngle" | "arcLinkLabelsOffset" | "arcLinkLabelsDiagonalLength" | "arcLinkLabelsStraightLength" | "arcLinkLabelsThickness" | "arcLinkLabelsTextOffset" | "arcLinkLabelsTextColor" | "arcLinkLabelsColor" | "cornerRadius" | "padAngle" | "valueFormat" | "arcLabel" | "motionConfig" | "isInteractive" | "colors" | "sortByValue" | "fit" | "activeInnerRadiusOffset" | "activeOuterRadiusOffset" | "enableArcLabels" | "enableArcLinkLabels" | "renderWrapper" | "layers" | "arcLinkLabelComponent">) => JSX.Element;
+export declare const ResponsivePie: <RawDatum>(props: Omit<PieSvgProps<RawDatum>, "height" | "width">) => JSX.Element;
 //# sourceMappingURL=ResponsivePie.d.ts.map

dist/types/ResponsivePieCanvas.d.ts

 /// <reference types="react" />
 import { PieCanvasProps } from './types';
-export declare const ResponsivePieCanvas: <RawDatum>(props: Pick<PieCanvasProps<RawDatum>, "tooltip" | "data" | "borderColor" | "borderWidth" | "margin" | "id" | "role" | "onClick" | "onMouseMove" | "value" | "legends" | "startAngle" | "endAngle" | "innerRadius" | "theme" | "arcLabelsRadiusOffset" | "arcLabelsSkipAngle" | "arcLabelsTextColor" | "arcLabelsComponent" | "component" | "arcLinkLabel" | "arcLinkLabelsSkipAngle" | "arcLinkLabelsOffset" | "arcLinkLabelsDiagonalLength" | "arcLinkLabelsStraightLength" | "arcLinkLabelsThickness" | "arcLinkLabelsTextOffset" | "arcLinkLabelsTextColor" | "arcLinkLabelsColor" | "cornerRadius" | "padAngle" | "valueFormat" | "arcLabel" | "isInteractive" | "colors" | "sortByValue" | "fit" | "activeInnerRadiusOffset" | "activeOuterRadiusOffset" | "enableArcLabels" | "enableArcLinkLabels" | "renderWrapper" | "pixelRatio">) => JSX.Element;
+export declare const ResponsivePieCanvas: <RawDatum>(props: Omit<PieCanvasProps<RawDatum>, "height" | "width">) => JSX.Element;
 //# sourceMappingURL=ResponsivePieCanvas.d.ts.map

package.json

 {
   "name": "@nivo/pie",
-  "version": "0.71.0",
+  "version": "0.72.0",
   "license": "MIT",
@@ -32,14 +32,14 @@ "author": {
   "dependencies": {
-    "@nivo/arcs": "0.71.0",
-    "@nivo/colors": "0.71.0",
-    "@nivo/legends": "0.71.0",
-    "@nivo/tooltip": "0.71.0",
+    "@nivo/arcs": "0.72.0",
+    "@nivo/colors": "0.72.0",
+    "@nivo/legends": "0.72.0",
+    "@nivo/tooltip": "0.72.0",
     "d3-shape": "^1.3.5"
   },
   "devDependencies": {
-    "@nivo/core": "0.71.0",
+    "@nivo/core": "0.72.0",
     "@types/d3-shape": "^2.0.0"
   },
   "peerDependencies": {
-    "@nivo/core": "0.71.0",
+    "@nivo/core": "0.72.0",
     "react": ">= 16.8.4 < 18.0.0"
@@ -50,3 +50,3 @@ },
   },
-  "gitHead": "232b613bd61d2b8e5c783f4181b2d14580e2fd27"
+  "gitHead": "26098f6437cd8ab2be166bbc52973dcbb5ee7569"
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Lines of code

3412

increased by0.06%

Worsened metrics

Total package byte prevSize

398775

decreased by-0.57%

Dependency changes

• + Added@nivo/arcs@0.72.0(transitive)

• + Added@nivo/colors@0.72.0(transitive)

• + Added@nivo/core@0.72.0(transitive)

• + Added@nivo/legends@0.72.0(transitive)

• + Added@nivo/recompose@0.72.0(transitive)

• + Added@nivo/tooltip@0.72.0(transitive)

• - Removed@nivo/arcs@0.71.0(transitive)

• - Removed@nivo/colors@0.71.0(transitive)

• - Removed@nivo/core@0.71.0(transitive)

• - Removed@nivo/legends@0.71.0(transitive)

• - Removed@nivo/recompose@0.71.0(transitive)

• - Removed@nivo/tooltip@0.71.0(transitive)

• Updated@nivo/arcs@0.72.0

• Updated@nivo/colors@0.72.0

• Updated@nivo/legends@0.72.0

• Updated@nivo/tooltip@0.72.0