@semcore/d3-chart 2.13.4 → 2.13.5

package/lib/es6/Radar.js

@@ -17,69 +17,53 @@ import { polygonContains } from 'd3-polygon';
 import { line, lineRadial, curveLinearClosed, arc } from 'd3-shape';
 import createElement from './createElement';
 import { CONSTANT, eventToPoint, measureText } from './utils';
-
 /*__reshadow-styles__:"./style/radar.shadow.css"*/
-var style = (
-/*__reshadow_css_start__*/
-_sstyled.insert(
-/*__inner_css_start__*/
-".___SAxisLine_con5p_gg_,.___SAxisTick_con5p_gg_,.___SAxis_con5p_gg_{stroke:var(--intergalactic-chart-grid-line, #e0e1e9);stroke-width:1;fill:transparent}.___SAxisLine_con5p_gg_,.___SAxisTick_con5p_gg_{stroke-dasharray:2}.___SAxisLine_con5p_gg_.__active_con5p_gg_{stroke:var(--intergalactic-chart-grid-y-accent-hover-line, #a9abb6)}.___SAxisLabel_con5p_gg_{text-anchor:middle;dominant-baseline:central;font-size:12px}.___SAxisLabel_con5p_gg_.__xDirection_con5p_gg_{text-anchor:var(--xDirection_con5p)}.___SAxisLabel_con5p_gg_.__yDirection_con5p_gg_{dominant-baseline:var(--yDirection_con5p)}.___SPolygonDot_con5p_gg_,.___SPolygon_con5p_gg_{fill:var(--intergalactic-chart-palette-order-1, #2bb3ff)}.___SPolygon_con5p_gg_{opacity:.2}.___SPolygon_con5p_gg_.__color_con5p_gg_{fill:var(--color_con5p)}.___SPolygonDot_con5p_gg_{stroke-width:2px;stroke:var(--intergalactic-chart-grid-border, #ffffff);r:6px}.___SPolygonDot_con5p_gg_.__transparent_con5p_gg_{opacity:.3}.___SPolygonDot_con5p_gg_.__color_con5p_gg_{fill:var(--color_con5p)}.___SPolygonLine_con5p_gg_{stroke:var(--intergalactic-chart-palette-order-1, #2bb3ff);stroke-width:3;fill:transparent}.___SPolygonLine_con5p_gg_.__transparent_con5p_gg_{opacity:.3}.___SPolygonLine_con5p_gg_.__color_con5p_gg_{stroke:var(--color_con5p)}.___SPieRect_con5p_gg_{fill:var(--intergalactic-chart-grid-bar-chart-hover, rgba(196, 199, 207, 0.3))}"
-/*__inner_css_end__*/
-, "con5p_gg_")
-/*__reshadow_css_end__*/
-, {
-  "__SAxis": "___SAxis_con5p_gg_",
-  "__SAxisLine": "___SAxisLine_con5p_gg_",
-  "__SAxisTick": "___SAxisTick_con5p_gg_",
-  "_active": "__active_con5p_gg_",
-  "__SAxisLabel": "___SAxisLabel_con5p_gg_",
-  "_xDirection": "__xDirection_con5p_gg_",
-  "--xDirection": "--xDirection_con5p",
-  "_yDirection": "__yDirection_con5p_gg_",
-  "--yDirection": "--yDirection_con5p",
-  "__SPolygon": "___SPolygon_con5p_gg_",
-  "_color": "__color_con5p_gg_",
-  "--color": "--color_con5p",
-  "__SPolygonDot": "___SPolygonDot_con5p_gg_",
-  "_transparent": "__transparent_con5p_gg_",
-  "__SPolygonLine": "___SPolygonLine_con5p_gg_",
-  "__SPieRect": "___SPieRect_con5p_gg_"
+var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SAxisLine_1oec7_gg_,.___SAxisTick_1oec7_gg_,.___SAxis_1oec7_gg_{stroke:var(--intergalactic-chart-grid-line, #e0e1e9);stroke-width:1;fill:transparent}.___SAxisLine_1oec7_gg_,.___SAxisTick_1oec7_gg_{stroke-dasharray:2}.___SAxisLine_1oec7_gg_.__active_1oec7_gg_{stroke:var(--intergalactic-chart-grid-y-accent-hover-line, #a9abb6)}.___SAxisLabel_1oec7_gg_{text-anchor:middle;dominant-baseline:central;font-size:12px}.___SAxisLabel_1oec7_gg_.__xDirection_1oec7_gg_{text-anchor:var(--xDirection_1oec7)}.___SAxisLabel_1oec7_gg_.__yDirection_1oec7_gg_{dominant-baseline:var(--yDirection_1oec7)}.___SPolygonDot_1oec7_gg_,.___SPolygon_1oec7_gg_{fill:var(--intergalactic-chart-palette-order-1, #2bb3ff)}.___SPolygon_1oec7_gg_{opacity:.2}.___SPolygon_1oec7_gg_.__color_1oec7_gg_{fill:var(--color_1oec7)}.___SPolygonDot_1oec7_gg_{stroke-width:2px;stroke:var(--intergalactic-chart-grid-border, #ffffff);r:6px}.___SPolygonDot_1oec7_gg_.__transparent_1oec7_gg_{opacity:.3}.___SPolygonDot_1oec7_gg_.__color_1oec7_gg_{fill:var(--color_1oec7)}.___SPolygonLine_1oec7_gg_{stroke:var(--intergalactic-chart-palette-order-1, #2bb3ff);stroke-width:3;fill:transparent}.___SPolygonLine_1oec7_gg_.__transparent_1oec7_gg_{opacity:.3}.___SPolygonLine_1oec7_gg_.__color_1oec7_gg_{stroke:var(--color_1oec7)}.___SPieRect_1oec7_gg_{fill:var(--intergalactic-chart-grid-bar-chart-hover, rgba(196, 199, 207, 0.3))}" /*__inner_css_end__*/, "1oec7_gg_") /*__reshadow_css_end__*/, {
+  "__SAxis": "___SAxis_1oec7_gg_",
+  "__SAxisLine": "___SAxisLine_1oec7_gg_",
+  "__SAxisTick": "___SAxisTick_1oec7_gg_",
+  "_active": "__active_1oec7_gg_",
+  "__SAxisLabel": "___SAxisLabel_1oec7_gg_",
+  "_xDirection": "__xDirection_1oec7_gg_",
+  "--xDirection": "--xDirection_1oec7",
+  "_yDirection": "__yDirection_1oec7_gg_",
+  "--yDirection": "--yDirection_1oec7",
+  "__SPolygon": "___SPolygon_1oec7_gg_",
+  "_color": "__color_1oec7_gg_",
+  "--color": "--color_1oec7",
+  "__SPolygonDot": "___SPolygonDot_1oec7_gg_",
+  "_transparent": "__transparent_1oec7_gg_",
+  "__SPolygonLine": "___SPolygonLine_1oec7_gg_",
+  "__SPieRect": "___SPieRect_1oec7_gg_"
 });
-
 var clampAngle = function clampAngle(angle) {
   angle = angle % (2 * Math.PI);
   if (angle < 0) angle += 2 * Math.PI;
   return angle;
 };
-
 function getBoxAxesValue(i, range, axes, total, angleOffset) {
   var func = axes === 'y' ? Math.sin : Math.cos;
   var angle = clampAngle((total - i) * 2 * Math.PI / total + angleOffset);
   return range * (1 - func(angle)) - range;
 }
-
 function getRadianPosition(i, range, total, angleOffset) {
   return [getBoxAxesValue(i, range, 'y', total, angleOffset), getBoxAxesValue(i, range, 'x', total, angleOffset)];
 }
-
 var getLabelXPlacement = function getLabelXPlacement(i, total, angleOffset) {
   var angle = clampAngle(i / total * (Math.PI * 2) - angleOffset);
   if (angle >= Math.PI + Math.PI * (8 / 9) || angle <= Math.PI * (1 / 9)) return 'middle';
   if (angle >= Math.PI * (8 / 9) && angle <= Math.PI + Math.PI * (1 / 9)) return 'middle';
   return angle < Math.PI ? 'start' : 'end';
 };
-
 var getLabelYPlacement = function getLabelYPlacement(i, total, angleOffset) {
   var angle = clampAngle(i / total * (Math.PI * 2) - angleOffset);
   if (angle >= Math.PI + Math.PI * (8 / 9) || angle <= Math.PI * (1 / 9)) return 'alphabetic';
   if (angle >= Math.PI * (8 / 9) && angle <= Math.PI + Math.PI * (1 / 9)) return 'mathematical';
   return 'middle';
 };
-
 function getLabelPlacement(i, total, angleOffset) {
   return [getLabelXPlacement(i, total, angleOffset), getLabelYPlacement(i, total, angleOffset)];
 }
-
 function computeTextWidth(texts, textSize) {
   var defaultWidth = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 50;
   var defaultHeight = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 20;
@@ -87,42 +71,33 @@ function computeTextWidth(texts, textSize) {
     if (typeof text === 'string') {
       return measureText(text, textSize);
     }
-
     if ( /*#__PURE__*/React.isValidElement(text)) {
       var _text$props, _text$props2;
-
       // @ts-ignore
       return Math.max(((_text$props = text.props) === null || _text$props === void 0 ? void 0 : _text$props.width) || defaultWidth, ((_text$props2 = text.props) === null || _text$props2 === void 0 ? void 0 : _text$props2.height) || defaultHeight);
     }
-
     return defaultWidth;
   });
   return Math.max.apply(Math, _toConsumableArray(widths));
 }
-
 function getTicks(tickSize, radius) {
   var ticks = 0;
-
   while (Math.trunc(radius / (tickSize / 2)) > ticks) {
     ticks += 1;
   }
-
   return _toConsumableArray(Array(ticks).keys()).reduce(function (ticks, t, i, total) {
     if (i) ticks.push(i / total.length);
     return ticks;
   }, []);
 }
-
 function pieContains(_ref10, _ref11) {
   var _ref12 = _slicedToArray(_ref10, 3),
-      startAngle = _ref12[0],
-      endAngle = _ref12[1],
-      radius = _ref12[2];
-
+    startAngle = _ref12[0],
+    endAngle = _ref12[1],
+    radius = _ref12[2];
   var _ref13 = _slicedToArray(_ref11, 2),
-      x = _ref13[0],
-      y = _ref13[1];
-
+    x = _ref13[0],
+    y = _ref13[1];
   var distance = Math.sqrt(Math.pow(x, 2) + Math.pow(y, 2));
   if (distance > radius) return false;
   startAngle = clampAngle(startAngle);
@@ -136,62 +111,46 @@ function pieContains(_ref10, _ref11) {
   if (nextAngle > startAngle && nextAngle < endAngle) return true;
   return false;
 }
-
 export function getLabelOffsetPosition(xDirection, yDirection, width, height) {
   var xOffset = 0;
   var yOffset = 0;
-
   switch ("".concat(xDirection, "-").concat(yDirection)) {
     case 'middle-alphabetic':
       yOffset = height / 2;
       break;
-
     case 'start-middle':
       xOffset = -width / 2;
       break;
-
     case 'middle-mathematical':
       yOffset = -height / 2;
       break;
-
     case 'end-middle':
       xOffset = width / 2;
       break;
   }
-
   return [xOffset + width / 2, yOffset + height / 2];
 }
 var MINIMUM_OFFSET = 5;
-
 var RadarRoot = /*#__PURE__*/function (_Component) {
   _inherits(RadarRoot, _Component);
-
   var _super = _createSuper(RadarRoot);
-
   function RadarRoot() {
     var _this;
-
     _classCallCheck(this, RadarRoot);
-
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-
     _this = _super.call.apply(_super, [this].concat(args));
-
     _defineProperty(_assertThisInitialized(_this), "computeOffset", 0);
-
     _defineProperty(_assertThisInitialized(_this), "categoriesKey", null);
-
     return _this;
   }
-
   _createClass(RadarRoot, [{
     key: "id",
     get: function get() {
       var _this$asProps = this.asProps,
-          id = _this$asProps.id,
-          uid = _this$asProps.uid;
+        id = _this$asProps.id,
+        uid = _this$asProps.uid;
       return id || uid;
     }
   }, {
@@ -221,9 +180,9 @@ var RadarRoot = /*#__PURE__*/function (_Component) {
     value: function getPolygonProps(_ref14) {
       var dataKey = _ref14.dataKey;
       var _this$asProps2 = this.asProps,
-          data = _this$asProps2.data,
-          scale = _this$asProps2.scale,
-          angleOffset = _this$asProps2.angleOffset;
+        data = _this$asProps2.data,
+        scale = _this$asProps2.scale,
+        angleOffset = _this$asProps2.angleOffset;
       return {
         offset: this.offset,
         data: data[dataKey] || [],
@@ -245,19 +204,16 @@ var RadarRoot = /*#__PURE__*/function (_Component) {
     key: "render",
     value: function render() {
       var _ref;
-
       var SRadar = this.Element;
       var _this$asProps3 = this.asProps,
-          Children = _this$asProps3.Children,
-          style = _this$asProps3.style,
-          size = _this$asProps3.size,
-          data = _this$asProps3.data,
-          offset = _this$asProps3.offset;
-
+        Children = _this$asProps3.Children,
+        style = _this$asProps3.style,
+        size = _this$asProps3.size,
+        data = _this$asProps3.data,
+        offset = _this$asProps3.offset;
       var _size = _slicedToArray(size, 2),
-          width = _size[0],
-          height = _size[1];
-
+        width = _size[0],
+        height = _size[1];
       this.asProps.dataHintsHandler.establishDataType('indexed-groups');
       var dataKey;
       React.Children.toArray(getOriginChildren(Children)).forEach(function (child) {
@@ -265,16 +221,13 @@ var RadarRoot = /*#__PURE__*/function (_Component) {
           dataKey = child.props.dataKey;
         }
       });
-
       if (dataKey) {
         if (offset === undefined) {
           // +5 because font might not be loaded and just in case)
           this.computeOffset = computeTextWidth(data[dataKey], this.textSize) + MINIMUM_OFFSET;
         }
-
         this.categoriesKey = dataKey;
       }
-
       return _ref = sstyled(style), /*#__PURE__*/React.createElement(SRadar, _ref.cn("SRadar", {
         "aria-hidden": true,
         "id": this.id,
@@ -284,43 +237,33 @@ var RadarRoot = /*#__PURE__*/function (_Component) {
       }));
     }
   }]);
-
   return RadarRoot;
 }(Component);
-
 _defineProperty(RadarRoot, "displayName", 'Line');
-
 _defineProperty(RadarRoot, "style", style);
-
 _defineProperty(RadarRoot, "enhance", [uniqueIDEnhancement()]);
-
 _defineProperty(RadarRoot, "defaultProps", {
   type: 'polygon',
   angleOffset: 0
 });
-
 var PolygonRoot = /*#__PURE__*/function (_Component2) {
   _inherits(PolygonRoot, _Component2);
-
   var _super2 = _createSuper(PolygonRoot);
-
   function PolygonRoot() {
     _classCallCheck(this, PolygonRoot);
-
     return _super2.apply(this, arguments);
   }
-
   _createClass(PolygonRoot, [{
     key: "getDotsProps",
     value: function getDotsProps() {
       var _this$asProps4 = this.asProps,
-          data = _this$asProps4.data,
-          scale = _this$asProps4.scale,
-          color = _this$asProps4.color,
-          transparent = _this$asProps4.transparent,
-          dataKey = _this$asProps4.dataKey,
-          dataHintsHandler = _this$asProps4.dataHintsHandler,
-          angleOffset = _this$asProps4.angleOffset;
+        data = _this$asProps4.data,
+        scale = _this$asProps4.scale,
+        color = _this$asProps4.color,
+        transparent = _this$asProps4.transparent,
+        dataKey = _this$asProps4.dataKey,
+        dataHintsHandler = _this$asProps4.dataHintsHandler,
+        angleOffset = _this$asProps4.angleOffset;
       return {
         data: data,
         scale: scale,
@@ -335,10 +278,10 @@ var PolygonRoot = /*#__PURE__*/function (_Component2) {
     key: "getLineProps",
     value: function getLineProps() {
       var _this$asProps5 = this.asProps,
-          d3 = _this$asProps5.d3,
-          data = _this$asProps5.data,
-          color = _this$asProps5.color,
-          transparent = _this$asProps5.transparent;
+        d3 = _this$asProps5.d3,
+        data = _this$asProps5.data,
+        color = _this$asProps5.color,
+        transparent = _this$asProps5.transparent;
       return {
         data: data,
         color: color,
@@ -350,14 +293,13 @@ var PolygonRoot = /*#__PURE__*/function (_Component2) {
     key: "render",
     value: function render() {
       var _ref2;
-
       var _this$asProps6 = this.asProps,
-          SPolygon = _this$asProps6.Element,
-          styles = _this$asProps6.styles,
-          d3 = _this$asProps6.d3,
-          data = _this$asProps6.data,
-          color = _this$asProps6.color,
-          fill = _this$asProps6.fill;
+        SPolygon = _this$asProps6.Element,
+        styles = _this$asProps6.styles,
+        d3 = _this$asProps6.d3,
+        data = _this$asProps6.data,
+        color = _this$asProps6.color,
+        fill = _this$asProps6.fill;
       return _ref2 = sstyled(styles), /*#__PURE__*/React.createElement(SPolygon, _ref2.cn("SPolygon", {
         "render": "path",
         "d": d3(data),
@@ -365,21 +307,17 @@ var PolygonRoot = /*#__PURE__*/function (_Component2) {
       }));
     }
   }]);
-
   return PolygonRoot;
 }(Component);
-
 _defineProperty(PolygonRoot, "displayName", 'Polygon');
-
 _defineProperty(PolygonRoot, "style", style);
-
 _defineProperty(PolygonRoot, "defaultProps", function (_ref18) {
   var scale = _ref18.scale,
-      _ref18$curve = _ref18.curve,
-      curve = _ref18$curve === void 0 ? curveLinearClosed : _ref18$curve,
-      size = _ref18.size,
-      offset = _ref18.offset,
-      angleOffset = _ref18.angleOffset;
+    _ref18$curve = _ref18.curve,
+    curve = _ref18$curve === void 0 ? curveLinearClosed : _ref18$curve,
+    size = _ref18.size,
+    offset = _ref18.offset,
+    angleOffset = _ref18.angleOffset;
   scale.range([0, Math.min(size[0], size[1]) / 2 - offset]);
   return {
     d3: lineRadial().curve(curve).radius(function (d) {
@@ -389,16 +327,14 @@ _defineProperty(PolygonRoot, "defaultProps", function (_ref18) {
     })
   };
 });
-
 function PolygonLine(props) {
   var _ref3;
-
   var SPolygonLine = props.Element,
-      styles = props.styles,
-      d3 = props.d3,
-      color = props.color,
-      data = props.data,
-      transparent = props.transparent;
+    styles = props.styles,
+    d3 = props.d3,
+    color = props.color,
+    data = props.data,
+    transparent = props.transparent;
   return _ref3 = sstyled(styles), /*#__PURE__*/React.createElement(SPolygonLine, _ref3.cn("SPolygonLine", {
     "render": "path",
     "d": d3(data),
@@ -406,28 +342,24 @@ function PolygonLine(props) {
     "transparent": transparent
   }));
 }
-
 function PolygonDots(props) {
   var SPolygonDot = props.Element,
-      styles = props.styles,
-      color = props.color,
-      data = props.data,
-      scale = props.scale,
-      transparent = props.transparent,
-      categoryKey = props.categoryKey,
-      angleOffset = props.angleOffset;
+    styles = props.styles,
+    color = props.color,
+    data = props.data,
+    scale = props.scale,
+    transparent = props.transparent,
+    categoryKey = props.categoryKey,
+    angleOffset = props.angleOffset;
   return data.map(function (value, i) {
     var _ref4;
-
     if (value === null || value === undefined) return;
     var radius = scale(value);
     props.dataHintsHandler.describeGroupedValues(categoryKey, "".concat(categoryKey, ".").concat(i));
-
     var _getRadianPosition = getRadianPosition(i, radius, data.length, angleOffset),
-        _getRadianPosition2 = _slicedToArray(_getRadianPosition, 2),
-        cx = _getRadianPosition2[0],
-        cy = _getRadianPosition2[1];
-
+      _getRadianPosition2 = _slicedToArray(_getRadianPosition, 2),
+      cx = _getRadianPosition2[0],
+      cy = _getRadianPosition2[1];
     return _ref4 = sstyled(styles), /*#__PURE__*/React.createElement(SPolygonDot, _ref4.cn("SPolygonDot", {
       "key": i,
       "render": "circle",
@@ -438,40 +370,28 @@ function PolygonDots(props) {
     }));
   });
 }
-
 var AxisRoot = /*#__PURE__*/function (_Component3) {
   _inherits(AxisRoot, _Component3);
-
   var _super3 = _createSuper(AxisRoot);
-
   function AxisRoot() {
     var _this2;
-
     _classCallCheck(this, AxisRoot);
-
     for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
       args[_key2] = arguments[_key2];
     }
-
     _this2 = _super3.call.apply(_super3, [this].concat(args));
-
     _defineProperty(_assertThisInitialized(_this2), "unsubscribeTooltipVisible", null);
-
     _defineProperty(_assertThisInitialized(_this2), "state", {
       activeLineIndex: null
     });
-
     _defineProperty(_assertThisInitialized(_this2), "handlerTooltipVisible", function (visible, _ref15) {
       var index = _ref15.index;
-
       _this2.setState({
         activeLineIndex: index
       });
     });
-
     return _this2;
   }
-
   _createClass(AxisRoot, [{
     key: "createLineRadial",
     value: function createLineRadial(radius, total) {
@@ -485,13 +405,13 @@ var AxisRoot = /*#__PURE__*/function (_Component3) {
     key: "getTicksProps",
     value: function getTicksProps(_ref16) {
       var _ref16$tickSize = _ref16.tickSize,
-          tickSize = _ref16$tickSize === void 0 ? 100 : _ref16$tickSize;
+        tickSize = _ref16$tickSize === void 0 ? 100 : _ref16$tickSize;
       var _this$asProps7 = this.asProps,
-          data = _this$asProps7.data,
-          offset = _this$asProps7.offset,
-          categories = _this$asProps7.categories,
-          size = _this$asProps7.size,
-          type = _this$asProps7.type;
+        data = _this$asProps7.data,
+        offset = _this$asProps7.offset,
+        categories = _this$asProps7.categories,
+        size = _this$asProps7.size,
+        type = _this$asProps7.type;
       var radius = Math.min(size[0], size[1]) / 2 - offset;
       return {
         type: type,
@@ -506,12 +426,12 @@ var AxisRoot = /*#__PURE__*/function (_Component3) {
     key: "getLabelsProps",
     value: function getLabelsProps(_ref17) {
       var _ref17$labelOffset = _ref17.labelOffset,
-          labelOffset = _ref17$labelOffset === void 0 ? 10 : _ref17$labelOffset;
+        labelOffset = _ref17$labelOffset === void 0 ? 10 : _ref17$labelOffset;
       var _this$asProps8 = this.asProps,
-          offset = _this$asProps8.offset,
-          categories = _this$asProps8.categories,
-          textSize = _this$asProps8.textSize,
-          angleOffset = _this$asProps8.angleOffset;
+        offset = _this$asProps8.offset,
+        categories = _this$asProps8.categories,
+        textSize = _this$asProps8.textSize,
+        angleOffset = _this$asProps8.angleOffset;
       return {
         categories: categories,
         textSize: textSize,
@@ -536,15 +456,14 @@ var AxisRoot = /*#__PURE__*/function (_Component3) {
     key: "render",
     value: function render() {
       var _ref5;
-
       var _this$asProps9 = this.asProps,
-          SAxis = _this$asProps9.Element,
-          styles = _this$asProps9.styles,
-          categories = _this$asProps9.categories,
-          size = _this$asProps9.size,
-          offset = _this$asProps9.offset,
-          type = _this$asProps9.type,
-          angleOffset = _this$asProps9.angleOffset;
+        SAxis = _this$asProps9.Element,
+        styles = _this$asProps9.styles,
+        categories = _this$asProps9.categories,
+        size = _this$asProps9.size,
+        offset = _this$asProps9.offset,
+        type = _this$asProps9.type,
+        angleOffset = _this$asProps9.angleOffset;
       var activeLineIndex = this.state.activeLineIndex;
       var radius = Math.min(size[0], size[1]) / 2 - offset;
       var total = categories.length;
@@ -558,15 +477,13 @@ var AxisRoot = /*#__PURE__*/function (_Component3) {
         "d": this.createLineRadial(radius, total)(categories)
       })), categories.map(function (category, i) {
         var _getRadianPosition3 = getRadianPosition(i, radius, total, angleOffset),
-            _getRadianPosition4 = _slicedToArray(_getRadianPosition3, 2),
-            x = _getRadianPosition4[0],
-            y = _getRadianPosition4[1];
-
+          _getRadianPosition4 = _slicedToArray(_getRadianPosition3, 2),
+          x = _getRadianPosition4[0],
+          y = _getRadianPosition4[1];
         var _sstyled$cn = sstyled(styles).cn('SAxisLine', {
-          active: activeLineIndex === i
-        }),
-            className = _sstyled$cn.className;
-
+            active: activeLineIndex === i
+          }),
+          className = _sstyled$cn.className;
         return /*#__PURE__*/React.createElement("line", {
           key: i,
           x1: 0,
@@ -578,36 +495,30 @@ var AxisRoot = /*#__PURE__*/function (_Component3) {
       }));
     }
   }]);
-
   return AxisRoot;
 }(Component);
-
 _defineProperty(AxisRoot, "displayName", 'Polygon');
-
 _defineProperty(AxisRoot, "style", style);
-
 _defineProperty(AxisRoot, "defaultProps", function (_ref19) {
   var data = _ref19.data,
-      dataKey = _ref19.dataKey;
+    dataKey = _ref19.dataKey;
   var categories = data[dataKey];
   return {
     categories: categories
   };
 });
-
 function AxisTicks(props) {
   var SAxisTick = props.Element,
-      styles = props.styles,
-      size = props.size,
-      ticks = props.ticks,
-      d3 = props.d3,
-      categories = props.categories,
-      offset = props.offset,
-      type = props.type;
+    styles = props.styles,
+    size = props.size,
+    ticks = props.ticks,
+    d3 = props.d3,
+    categories = props.categories,
+    offset = props.offset,
+    type = props.type;
   var radius = Math.min(size[0], size[1]) / 2 - offset;
   return ticks.map(function (tick, i) {
     var _ref6;
-
     d3.radius(function () {
       return radius * tick;
     });
@@ -624,30 +535,26 @@ function AxisTicks(props) {
     }));
   });
 }
-
 function AxisLabels(props) {
   var SAxisLabel = props.Element,
-      styles = props.styles,
-      textSize = props.textSize,
-      size = props.size,
-      offset = props.offset,
-      categories = props.categories,
-      angleOffset = props.angleOffset;
+    styles = props.styles,
+    textSize = props.textSize,
+    size = props.size,
+    offset = props.offset,
+    categories = props.categories,
+    angleOffset = props.angleOffset;
   var radius = Math.min(size[0], size[1]) / 2 - offset;
   return categories.map(function (category, i) {
     var _getRadianPosition5 = getRadianPosition(i, radius, categories.length, angleOffset),
-        _getRadianPosition6 = _slicedToArray(_getRadianPosition5, 2),
-        x = _getRadianPosition6[0],
-        y = _getRadianPosition6[1];
-
+      _getRadianPosition6 = _slicedToArray(_getRadianPosition5, 2),
+      x = _getRadianPosition6[0],
+      y = _getRadianPosition6[1];
     var _getLabelPlacement = getLabelPlacement(i, categories.length, angleOffset),
-        _getLabelPlacement2 = _slicedToArray(_getLabelPlacement, 2),
-        xDirection = _getLabelPlacement2[0],
-        yDirection = _getLabelPlacement2[1];
-
+      _getLabelPlacement2 = _slicedToArray(_getLabelPlacement, 2),
+      xDirection = _getLabelPlacement2[0],
+      yDirection = _getLabelPlacement2[1];
     if (typeof category === 'string') {
       var _ref7;
-
       props.dataHintsHandler.labelKey('value', i, category);
       var lines = category.split('\n');
       return _ref7 = sstyled(styles), /*#__PURE__*/React.createElement(SAxisLabel, _ref7.cn("SAxisLabel", {
@@ -666,19 +573,16 @@ function AxisLabels(props) {
         }, lineText);
       }));
     }
-
     if ( /*#__PURE__*/React.isValidElement(category)) {
       var _category$props = category === null || category === void 0 ? void 0 : category.props,
-          _category$props$width = _category$props.width,
-          width = _category$props$width === void 0 ? 0 : _category$props$width,
-          _category$props$heigh = _category$props.height,
-          height = _category$props$heigh === void 0 ? 0 : _category$props$heigh;
-
+        _category$props$width = _category$props.width,
+        width = _category$props$width === void 0 ? 0 : _category$props$width,
+        _category$props$heigh = _category$props.height,
+        height = _category$props$heigh === void 0 ? 0 : _category$props$heigh;
       var _getLabelOffsetPositi = getLabelOffsetPosition(xDirection, yDirection, width, height),
-          _getLabelOffsetPositi2 = _slicedToArray(_getLabelOffsetPositi, 2),
-          xOffset = _getLabelOffsetPositi2[0],
-          yOffset = _getLabelOffsetPositi2[1];
-
+        _getLabelOffsetPositi2 = _slicedToArray(_getLabelOffsetPositi, 2),
+        xOffset = _getLabelOffsetPositi2[0],
+        yOffset = _getLabelOffsetPositi2[1];
       return /*#__PURE__*/cloneElement(category, {
         key: i,
         x: x - xOffset,
@@ -687,50 +591,37 @@ function AxisLabels(props) {
     }
   });
 }
-
 var Hover = /*#__PURE__*/function (_Component4) {
   _inherits(Hover, _Component4);
-
   var _super4 = _createSuper(Hover);
-
   function Hover() {
     var _this3;
-
     _classCallCheck(this, Hover);
-
     for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
       args[_key3] = arguments[_key3];
     }
-
     _this3 = _super4.call.apply(_super4, [this].concat(args));
-
     _defineProperty(_assertThisInitialized(_this3), "state", {
       index: null
     });
-
     _defineProperty(_assertThisInitialized(_this3), "virtualElement", canUseDOM() ? document.createElement('div') : {});
-
     _defineProperty(_assertThisInitialized(_this3), "unsubscribeMouseMoveRoot", null);
-
     _defineProperty(_assertThisInitialized(_this3), "unsubscribeMouseLeaveRoot", null);
-
     _defineProperty(_assertThisInitialized(_this3), "handlerMouseMoveRoot", trottle(function (e) {
       var _this3$asProps = _this3.asProps,
-          eventEmitter = _this3$asProps.eventEmitter,
-          size = _this3$asProps.size,
-          rootRef = _this3$asProps.rootRef;
+        eventEmitter = _this3$asProps.eventEmitter,
+        size = _this3$asProps.size,
+        rootRef = _this3$asProps.rootRef;
       var point = eventToPoint(e, rootRef.current);
       var diam = Math.min(size[0], size[1]);
       var centerX = point[0] - diam / 2;
       var centerY = point[1] - diam / 2;
       var clientX = e.clientX,
-          clientY = e.clientY; // @ts-ignore
-
+        clientY = e.clientY;
+      // @ts-ignore
       _this3.virtualElement.getBoundingClientRect = _this3.generateGetBoundingClientRect(clientX, clientY);
       _this3.virtualElement[CONSTANT.VIRTUAL_ELEMENT] = true;
-
       var index = _this3.getIndex([centerX, centerY]);
-
       _this3.setState({
         index: index
       }, function () {
@@ -739,7 +630,6 @@ var Hover = /*#__PURE__*/function (_Component4) {
         }, _this3.virtualElement);
       });
     }));
-
     _defineProperty(_assertThisInitialized(_this3), "handlerMouseLeaveRoot", trottle(function () {
       _this3.setState({
         index: null
@@ -749,10 +639,8 @@ var Hover = /*#__PURE__*/function (_Component4) {
         });
       });
     }));
-
     return _this3;
   }
-
   _createClass(Hover, [{
     key: "generateGetBoundingClientRect",
     value: function generateGetBoundingClientRect() {
@@ -773,41 +661,37 @@ var Hover = /*#__PURE__*/function (_Component4) {
     key: "getPolygon",
     value: function getPolygon(index) {
       var _this$asProps10 = this.asProps,
-          categories = _this$asProps10.categories,
-          size = _this$asProps10.size,
-          offset = _this$asProps10.offset,
-          angleOffset = _this$asProps10.angleOffset;
+        categories = _this$asProps10.categories,
+        size = _this$asProps10.size,
+        offset = _this$asProps10.offset,
+        angleOffset = _this$asProps10.angleOffset;
       var total = categories.length;
       var diam = Math.min(size[0], size[1]);
       var radius = diam / 2 - offset;
       var prevIndex = (index - 1 + total) % total;
       var nextIndex = (index + 1 + total) % total;
-
       var _getRadianPosition7 = getRadianPosition(prevIndex, radius, total, angleOffset),
-          _getRadianPosition8 = _slicedToArray(_getRadianPosition7, 2),
-          prevX1 = _getRadianPosition8[0],
-          prevY1 = _getRadianPosition8[1];
-
+        _getRadianPosition8 = _slicedToArray(_getRadianPosition7, 2),
+        prevX1 = _getRadianPosition8[0],
+        prevY1 = _getRadianPosition8[1];
       var _getRadianPosition9 = getRadianPosition(index, radius, total, angleOffset),
-          _getRadianPosition10 = _slicedToArray(_getRadianPosition9, 2),
-          x = _getRadianPosition10[0],
-          y = _getRadianPosition10[1];
-
+        _getRadianPosition10 = _slicedToArray(_getRadianPosition9, 2),
+        x = _getRadianPosition10[0],
+        y = _getRadianPosition10[1];
       var _getRadianPosition11 = getRadianPosition(nextIndex, radius, total, angleOffset),
-          _getRadianPosition12 = _slicedToArray(_getRadianPosition11, 2),
-          nextX1 = _getRadianPosition12[0],
-          nextY1 = _getRadianPosition12[1];
-
+        _getRadianPosition12 = _slicedToArray(_getRadianPosition11, 2),
+        nextX1 = _getRadianPosition12[0],
+        nextY1 = _getRadianPosition12[1];
       return [[0, 0], [(prevX1 + x) / 2, (prevY1 + y) / 2], [x, y], [(nextX1 + x) / 2, (nextY1 + y) / 2]];
     }
   }, {
     key: "getPie",
     value: function getPie(index) {
       var _this$asProps11 = this.asProps,
-          categories = _this$asProps11.categories,
-          size = _this$asProps11.size,
-          offset = _this$asProps11.offset,
-          angleOffset = _this$asProps11.angleOffset;
+        categories = _this$asProps11.categories,
+        size = _this$asProps11.size,
+        offset = _this$asProps11.offset,
+        angleOffset = _this$asProps11.angleOffset;
       var angle = Math.PI * 2 / categories.length;
       var radius = Math.min(size[0], size[1]) / 2 - offset;
       return [index * angle - angle / 2 - angleOffset, (index + 1) * angle - angle / 2 - angleOffset, radius];
@@ -816,12 +700,10 @@ var Hover = /*#__PURE__*/function (_Component4) {
     key: "getIndex",
     value: function getIndex(point) {
       var _this4 = this;
-
       var _this$asProps12 = this.asProps,
-          categories = _this$asProps12.categories,
-          type = _this$asProps12.type;
+        categories = _this$asProps12.categories,
+        type = _this$asProps12.type;
       var index;
-
       if (type === 'circle') {
         index = categories.findIndex(function (c, i) {
           return pieContains(_this4.getPie(i), point);
@@ -831,18 +713,15 @@ var Hover = /*#__PURE__*/function (_Component4) {
           return polygonContains(_this4.getPolygon(i), point);
         });
       }
-
       return index === -1 ? null : index;
     }
   }, {
     key: "componentDidMount",
     value: function componentDidMount() {
       var _this5 = this;
-
       var eventEmitter = this.asProps.eventEmitter;
       this.unsubscribeMouseMoveRoot = eventEmitter.subscribe('onMouseMoveRoot', function (e) {
         e.persist();
-
         _this5.handlerMouseMoveRoot(e);
       });
       this.unsubscribeMouseLeaveRoot = eventEmitter.subscribe('onMouseLeaveRoot', this.handlerMouseLeaveRoot);
@@ -853,7 +732,6 @@ var Hover = /*#__PURE__*/function (_Component4) {
       if (this.unsubscribeMouseMoveRoot) {
         this.unsubscribeMouseMoveRoot();
       }
-
       if (this.unsubscribeMouseLeaveRoot) {
         this.unsubscribeMouseLeaveRoot();
       }
@@ -862,21 +740,18 @@ var Hover = /*#__PURE__*/function (_Component4) {
     key: "render",
     value: function render() {
       var _this$asProps13 = this.asProps,
-          styles = _this$asProps13.styles,
-          type = _this$asProps13.type;
+        styles = _this$asProps13.styles,
+        type = _this$asProps13.type;
       var index = this.state.index;
       var SPieRect = this.Element;
-
       if (index !== null) {
         if (type === 'circle') {
           var _ref8;
-
           var _this$getPie = this.getPie(index),
-              _this$getPie2 = _slicedToArray(_this$getPie, 3),
-              startAngle = _this$getPie2[0],
-              endAngle = _this$getPie2[1],
-              radius = _this$getPie2[2];
-
+            _this$getPie2 = _slicedToArray(_this$getPie, 3),
+            startAngle = _this$getPie2[0],
+            endAngle = _this$getPie2[1],
+            radius = _this$getPie2[2];
           var circle = arc().innerRadius(0).outerRadius(radius).startAngle(startAngle).endAngle(endAngle);
           return _ref8 = sstyled(styles), /*#__PURE__*/React.createElement(SPieRect, _ref8.cn("SPieRect", {
             "render": "path",
@@ -884,21 +759,17 @@ var Hover = /*#__PURE__*/function (_Component4) {
           }));
         } else {
           var _ref9;
-
           return _ref9 = sstyled(styles), /*#__PURE__*/React.createElement(SPieRect, _ref9.cn("SPieRect", {
             "render": "path",
             "d": line()(this.getPolygon(index))
           }));
         }
       }
-
       return null;
     }
   }]);
-
   return Hover;
 }(Component);
-
 var Axis = createElement(AxisRoot, {
   Ticks: AxisTicks,
   Labels: AxisLabels