@semcore/d3-chart 16.0.2-prerelease.4 → 16.0.3-prerelease.0

package/lib/cjs/RadialTree.js

@@ -1,6 +1,6 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -11,50 +11,53 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _isNativeReflectConstruct2 = _interopRequireDefault(require("@babel/runtime/helpers/isNativeReflectConstruct"));
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _core = require("@semcore/core");
-var _react = _interopRequireDefault(require("react"));
-var _d3Transition = require("d3-transition");
-var _uniqueID = _interopRequireDefault(require("@semcore/core/lib/utils/uniqueID"));
 var _assignProps = _interopRequireDefault(require("@semcore/core/lib/utils/assignProps"));
-var _getOriginChildren = _interopRequireDefault(require("@semcore/core/lib/utils/getOriginChildren"));
 var _canUseDOM = _interopRequireDefault(require("@semcore/core/lib/utils/canUseDOM"));
+var _getOriginChildren = _interopRequireDefault(require("@semcore/core/lib/utils/getOriginChildren"));
+var _uniqueID = _interopRequireDefault(require("@semcore/core/lib/utils/uniqueID"));
+var _d3Transition = require("d3-transition");
+var _react = _interopRequireDefault(require("react"));
 var _createElement = _interopRequireDefault(require("./createElement"));
-var _utils = require("./utils");
 var _Pattern = require("./Pattern");
+var _utils = require("./utils");
 var _excluded = ["data"];
+function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, (0, _isNativeReflectConstruct2["default"])() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); }
 /*!__reshadow-styles__:"./style/radial-tree.shadow.css"*/
-var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___SRadian_1nmaa_gg_{cursor:pointer;fill:var(--intergalactic-text-large-info, #008ff8)}.___SLine_1nmaa_gg_{stroke:var(--intergalactic-text-large-info, #008ff8)}.___SLine_1nmaa_gg_.__stroke_1nmaa_gg_{stroke:var(--stroke_1nmaa)}.___SLine_1nmaa_gg_.__transparent_1nmaa_gg_{opacity:.3}.___SCap_1nmaa_gg_{transition:r .1s}.___SCap_1nmaa_gg_.__pattern_1nmaa_gg_{stroke:var(--intergalactic-chart-grid-border, #ffffff);stroke-width:1px}.___SCap_1nmaa_gg_.__transparent_1nmaa_gg_,.___SIcon_1nmaa_gg_.__transparent_1nmaa_gg_,.___SLabel_1nmaa_gg_.__transparent_1nmaa_gg_{opacity:.3}.___SLabel_1nmaa_gg_{fill:var(--color_1nmaa)}@media (hover:hover){.___SRadian_1nmaa_gg_:hover .___SLabel_1nmaa_gg_{cursor:pointer;filter:brightness(.6)}}@media (prefers-reduced-motion){.___SLineCap_1nmaa_gg_{transition:none}}", /*__inner_css_end__*/"1nmaa_gg_"),
+var style = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".___SRadian_1k51n_gg_{cursor:pointer;fill:var(--intergalactic-text-large-info, #008ff8)}.___SLine_1k51n_gg_{stroke:var(--intergalactic-text-large-info, #008ff8)}.___SLine_1k51n_gg_.__stroke_1k51n_gg_{stroke:var(--stroke_1k51n)}.___SLine_1k51n_gg_.__transparent_1k51n_gg_{opacity:.3}.___SCap_1k51n_gg_{transition:r .1s}.___SCap_1k51n_gg_.__pattern_1k51n_gg_{stroke:var(--intergalactic-chart-grid-border, #ffffff);stroke-width:1px}.___SCap_1k51n_gg_.__transparent_1k51n_gg_,.___SIcon_1k51n_gg_.__transparent_1k51n_gg_,.___SLabel_1k51n_gg_.__transparent_1k51n_gg_{opacity:.3}.___SLabel_1k51n_gg_{fill:var(--color_1k51n)}@media (hover:hover){.___SRadian_1k51n_gg_:hover .___SLabel_1k51n_gg_{cursor:pointer;filter:brightness(.6)}}@media (prefers-reduced-motion){.___SLineCap_1k51n_gg_{transition:none}}", /*__inner_css_end__*/"1k51n_gg_"),
 /*__reshadow_css_end__*/
 {
-  "__SRadian": "___SRadian_1nmaa_gg_",
-  "__SLine": "___SLine_1nmaa_gg_",
-  "_stroke": "__stroke_1nmaa_gg_",
-  "--stroke": "--stroke_1nmaa",
-  "_transparent": "__transparent_1nmaa_gg_",
-  "__SCap": "___SCap_1nmaa_gg_",
-  "_pattern": "__pattern_1nmaa_gg_",
-  "__SIcon": "___SIcon_1nmaa_gg_",
-  "__SLabel": "___SLabel_1nmaa_gg_",
-  "--color": "--color_1nmaa",
-  "__SLineCap": "___SLineCap_1nmaa_gg_"
+  "__SRadian": "___SRadian_1k51n_gg_",
+  "__SLine": "___SLine_1k51n_gg_",
+  "_stroke": "__stroke_1k51n_gg_",
+  "--stroke": "--stroke_1k51n",
+  "_transparent": "__transparent_1k51n_gg_",
+  "__SCap": "___SCap_1k51n_gg_",
+  "_pattern": "__pattern_1k51n_gg_",
+  "__SIcon": "___SIcon_1k51n_gg_",
+  "__SLabel": "___SLabel_1k51n_gg_",
+  "--color": "--color_1k51n",
+  "__SLineCap": "___SLineCap_1k51n_gg_"
 });
 var baseAngle = -Math.PI / 2; // The top vertical line
+
+/** @deprecated */
 var RadialTreeBase = /*#__PURE__*/function (_Component) {
-  (0, _inherits2["default"])(RadialTreeBase, _Component);
-  var _super = (0, _createSuper2["default"])(RadialTreeBase);
   function RadialTreeBase(props) {
     var _this;
     (0, _classCallCheck2["default"])(this, RadialTreeBase);
-    _this = _super.call(this, props);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "Element", void 0);
-    _this.handleRadianClick = _this.handleRadianClick.bind((0, _assertThisInitialized2["default"])(_this));
+    _this = _callSuper(this, RadialTreeBase, [props]);
+    (0, _defineProperty2["default"])(_this, "Element", void 0);
+    _this.handleRadianClick = _this.handleRadianClick.bind(_this);
     return _this;
   }
-  (0, _createClass2["default"])(RadialTreeBase, [{
+  (0, _inherits2["default"])(RadialTreeBase, _Component);
+  return (0, _createClass2["default"])(RadialTreeBase, [{
     key: "uncontrolledProps",
     value: function uncontrolledProps() {
       return {
@@ -71,7 +74,7 @@ var RadialTreeBase = /*#__PURE__*/function (_Component) {
       if (!(0, _canUseDOM["default"])()) return;
       var preferReduceMotion = (_window$matchMedia = window.matchMedia('(prefers-reduced-motion: reduce)')) === null || _window$matchMedia === void 0 ? void 0 : _window$matchMedia.matches;
 
-      /** using `!(>)` instead of `<=` to get true on NaN and non numbers stuff  */
+      /** using `!(>)` instead of `<=` to get true on Number.NaN and non numbers stuff  */
       if (!(duration > 0)) return;
       if (preferReduceMotion) return;
       var circlesAnimation = (0, _d3Transition.transition)().selection().selectAll("[data-radial-animation=".concat(uid, "-cap-circle]")).interrupt();
@@ -84,13 +87,13 @@ var RadialTreeBase = /*#__PURE__*/function (_Component) {
       var labelsNodes = linesAnimation.nodes();
       if (circlesNodes.length > 0) {
         var attrs = circlesNodes.map(function (node) {
-          var _lineNode$x, _lineNode$x$baseVal, _lineNode$y, _lineNode$y$baseVal;
-          var radianIndex = parseInt(node.dataset.radianIndex, 10);
+          var _lineNode$x, _lineNode$y;
+          var radianIndex = Number.parseInt(node.dataset.radianIndex, 10);
           var lineNode = linesNodes[radianIndex];
           return {
             from: {
-              cx: (_lineNode$x = lineNode.x1) === null || _lineNode$x === void 0 ? void 0 : (_lineNode$x$baseVal = _lineNode$x.baseVal) === null || _lineNode$x$baseVal === void 0 ? void 0 : _lineNode$x$baseVal.value,
-              cy: (_lineNode$y = lineNode.y1) === null || _lineNode$y === void 0 ? void 0 : (_lineNode$y$baseVal = _lineNode$y.baseVal) === null || _lineNode$y$baseVal === void 0 ? void 0 : _lineNode$y$baseVal.value
+              cx: (_lineNode$x = lineNode.x1) === null || _lineNode$x === void 0 || (_lineNode$x = _lineNode$x.baseVal) === null || _lineNode$x === void 0 ? void 0 : _lineNode$x.value,
+              cy: (_lineNode$y = lineNode.y1) === null || _lineNode$y === void 0 || (_lineNode$y = _lineNode$y.baseVal) === null || _lineNode$y === void 0 ? void 0 : _lineNode$y.value
             },
             to: {
               cx: node.dataset['cx'],
@@ -104,25 +107,29 @@ var RadialTreeBase = /*#__PURE__*/function (_Component) {
         }).attr('cy', function (_, index) {
           var _attrs$index$from2;
           return (_attrs$index$from2 = attrs[index].from) === null || _attrs$index$from2 === void 0 ? void 0 : _attrs$index$from2.cy;
-        }).transition().duration(duration).attr('opacity', 1).attr('cx', function (_, index) {
+        }).transition().duration(duration).attr('opacity', 1)
+        // eslint-disable-next-line @typescript-eslint/no-non-null-asserted-optional-chain
+        .attr('cx', function (_, index) {
           var _attrs$index$to;
           return (_attrs$index$to = attrs[index].to) === null || _attrs$index$to === void 0 ? void 0 : _attrs$index$to.cx;
-        }).attr('cy', function (_, index) {
+        })
+        // eslint-disable-next-line @typescript-eslint/no-non-null-asserted-optional-chain
+        .attr('cy', function (_, index) {
           var _attrs$index$to2;
           return (_attrs$index$to2 = attrs[index].to) === null || _attrs$index$to2 === void 0 ? void 0 : _attrs$index$to2.cy;
         });
       }
       if (iconsNodes.length > 0) {
         var _attrs = iconsNodes.map(function (node) {
-          var _node$width, _node$width$baseVal, _node$height, _node$height$baseVal, _lineNode$x2, _lineNode$x2$baseVal, _lineNode$y2, _lineNode$y2$baseVal;
-          var width = (_node$width = node.width) === null || _node$width === void 0 ? void 0 : (_node$width$baseVal = _node$width.baseVal) === null || _node$width$baseVal === void 0 ? void 0 : _node$width$baseVal.value;
-          var height = (_node$height = node.height) === null || _node$height === void 0 ? void 0 : (_node$height$baseVal = _node$height.baseVal) === null || _node$height$baseVal === void 0 ? void 0 : _node$height$baseVal.value;
-          var radianIndex = parseInt(node.dataset.radianIndex, 10);
+          var _node$width, _node$height, _lineNode$x2, _lineNode$y2;
+          var width = (_node$width = node.width) === null || _node$width === void 0 || (_node$width = _node$width.baseVal) === null || _node$width === void 0 ? void 0 : _node$width.value;
+          var height = (_node$height = node.height) === null || _node$height === void 0 || (_node$height = _node$height.baseVal) === null || _node$height === void 0 ? void 0 : _node$height.value;
+          var radianIndex = Number.parseInt(node.dataset.radianIndex, 10);
           var lineNode = linesNodes[radianIndex];
           return {
             from: {
-              x: ((_lineNode$x2 = lineNode.x1) === null || _lineNode$x2 === void 0 ? void 0 : (_lineNode$x2$baseVal = _lineNode$x2.baseVal) === null || _lineNode$x2$baseVal === void 0 ? void 0 : _lineNode$x2$baseVal.value) - width / 2,
-              y: ((_lineNode$y2 = lineNode.y1) === null || _lineNode$y2 === void 0 ? void 0 : (_lineNode$y2$baseVal = _lineNode$y2.baseVal) === null || _lineNode$y2$baseVal === void 0 ? void 0 : _lineNode$y2$baseVal.value) - height / 2
+              x: ((_lineNode$x2 = lineNode.x1) === null || _lineNode$x2 === void 0 || (_lineNode$x2 = _lineNode$x2.baseVal) === null || _lineNode$x2 === void 0 ? void 0 : _lineNode$x2.value) - width / 2,
+              y: ((_lineNode$y2 = lineNode.y1) === null || _lineNode$y2 === void 0 || (_lineNode$y2 = _lineNode$y2.baseVal) === null || _lineNode$y2 === void 0 ? void 0 : _lineNode$y2.value) - height / 2
             },
             to: {
               x: node.dataset['x'],
@@ -130,27 +137,35 @@ var RadialTreeBase = /*#__PURE__*/function (_Component) {
             }
           };
         });
-        iconsAnimation.attr('opacity', 0).attr('x', function (_, index) {
+        iconsAnimation.attr('opacity', 0)
+        // eslint-disable-next-line @typescript-eslint/no-non-null-asserted-optional-chain
+        .attr('x', function (_, index) {
           var _attrs$index$from3;
           return (_attrs$index$from3 = _attrs[index].from) === null || _attrs$index$from3 === void 0 ? void 0 : _attrs$index$from3.x;
-        }).attr('y', function (_, index) {
+        })
+        // eslint-disable-next-line @typescript-eslint/no-non-null-asserted-optional-chain
+        .attr('y', function (_, index) {
           var _attrs$index$from4;
           return (_attrs$index$from4 = _attrs[index].from) === null || _attrs$index$from4 === void 0 ? void 0 : _attrs$index$from4.y;
-        }).transition().duration(duration).attr('opacity', 1).attr('x', function (_, index) {
+        }).transition().duration(duration).attr('opacity', 1)
+        // eslint-disable-next-line @typescript-eslint/no-non-null-asserted-optional-chain
+        .attr('x', function (_, index) {
           var _attrs$index$to3;
           return (_attrs$index$to3 = _attrs[index].to) === null || _attrs$index$to3 === void 0 ? void 0 : _attrs$index$to3.x;
-        }).attr('y', function (_, index) {
+        })
+        // eslint-disable-next-line @typescript-eslint/no-non-null-asserted-optional-chain
+        .attr('y', function (_, index) {
           var _attrs$index$to4;
           return (_attrs$index$to4 = _attrs[index].to) === null || _attrs$index$to4 === void 0 ? void 0 : _attrs$index$to4.y;
         });
       }
       if (linesNodes.length > 0) {
         var _attrs2 = linesNodes.map(function (node) {
-          var _node$x, _node$x$baseVal, _node$y, _node$y$baseVal;
+          var _node$x, _node$y;
           return {
             from: {
-              x2: (_node$x = node.x1) === null || _node$x === void 0 ? void 0 : (_node$x$baseVal = _node$x.baseVal) === null || _node$x$baseVal === void 0 ? void 0 : _node$x$baseVal.value,
-              y2: (_node$y = node.y1) === null || _node$y === void 0 ? void 0 : (_node$y$baseVal = _node$y.baseVal) === null || _node$y$baseVal === void 0 ? void 0 : _node$y$baseVal.value
+              x2: (_node$x = node.x1) === null || _node$x === void 0 || (_node$x = _node$x.baseVal) === null || _node$x === void 0 ? void 0 : _node$x.value,
+              y2: (_node$y = node.y1) === null || _node$y === void 0 || (_node$y = _node$y.baseVal) === null || _node$y === void 0 ? void 0 : _node$y.value
             },
             to: {
               x2: node.dataset['x2'],
@@ -158,16 +173,24 @@ var RadialTreeBase = /*#__PURE__*/function (_Component) {
             }
           };
         });
-        linesAnimation.attr('opacity', 0).attr('x2', function (_, index) {
+        linesAnimation.attr('opacity', 0)
+        // eslint-disable-next-line @typescript-eslint/no-non-null-asserted-optional-chain
+        .attr('x2', function (_, index) {
           var _attrs2$index$from;
           return (_attrs2$index$from = _attrs2[index].from) === null || _attrs2$index$from === void 0 ? void 0 : _attrs2$index$from.x2;
-        }).attr('y2', function (_, index) {
+        })
+        // eslint-disable-next-line @typescript-eslint/no-non-null-asserted-optional-chain
+        .attr('y2', function (_, index) {
           var _attrs2$index$from2;
           return (_attrs2$index$from2 = _attrs2[index].from) === null || _attrs2$index$from2 === void 0 ? void 0 : _attrs2$index$from2.y2;
-        }).transition().duration(duration).attr('opacity', 1).attr('x2', function (_, index) {
+        }).transition().duration(duration).attr('opacity', 1)
+        // eslint-disable-next-line @typescript-eslint/no-non-null-asserted-optional-chain
+        .attr('x2', function (_, index) {
           var _attrs2$index$to;
           return (_attrs2$index$to = _attrs2[index].to) === null || _attrs2$index$to === void 0 ? void 0 : _attrs2$index$to.x2;
-        }).attr('y2', function (_, index) {
+        })
+        // eslint-disable-next-line @typescript-eslint/no-non-null-asserted-optional-chain
+        .attr('y2', function (_, index) {
           var _attrs2$index$to2;
           return (_attrs2$index$to2 = _attrs2[index].to) === null || _attrs2$index$to2 === void 0 ? void 0 : _attrs2$index$to2.y2;
         });
@@ -204,8 +227,8 @@ var RadialTreeBase = /*#__PURE__*/function (_Component) {
       var _this$asProps2 = this.asProps,
         data = _this$asProps2.data,
         textSize = _this$asProps2.textSize;
-      var widths = data.map(function (_ref10) {
-        var label = _ref10.label;
+      var widths = data.map(function (_ref0) {
+        var label = _ref0.label;
         return (0, _utils.measureText)(label, textSize);
       });
       return Math.max.apply(Math, (0, _toConsumableArray2["default"])(widths));
@@ -255,7 +278,6 @@ var RadialTreeBase = /*#__PURE__*/function (_Component) {
       }), /*#__PURE__*/_react["default"].createElement(Children, _ref.cn("Children", {})));
     }
   }]);
-  return RadialTreeBase;
 }(_core.Component);
 /** @deprecated */
 (0, _defineProperty2["default"])(RadialTreeBase, "displayName", 'RadialTree');
@@ -273,21 +295,20 @@ var RadialTreeBase = /*#__PURE__*/function (_Component) {
   defaultActiveKey: null
 });
 var RadialTreeRadian = /*#__PURE__*/function (_Component2) {
-  (0, _inherits2["default"])(RadialTreeRadian, _Component2);
-  var _super2 = (0, _createSuper2["default"])(RadialTreeRadian);
   function RadialTreeRadian(props) {
     var _this3;
     (0, _classCallCheck2["default"])(this, RadialTreeRadian);
-    _this3 = _super2.call(this, props);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this3), "Element", void 0);
-    _this3.renderRadian = _this3.renderRadian.bind((0, _assertThisInitialized2["default"])(_this3));
+    _this3 = _callSuper(this, RadialTreeRadian, [props]);
+    (0, _defineProperty2["default"])(_this3, "Element", void 0);
+    _this3.renderRadian = _this3.renderRadian.bind(_this3);
     return _this3;
   }
-  (0, _createClass2["default"])(RadialTreeRadian, [{
+  (0, _inherits2["default"])(RadialTreeRadian, _Component2);
+  return (0, _createClass2["default"])(RadialTreeRadian, [{
     key: "getInteractiveAreaProps",
-    value: function getInteractiveAreaProps(_ref12, index) {
+    value: function getInteractiveAreaProps(_ref10, index) {
       var _$rootProps$data;
-      var $rootProps = _ref12.$rootProps;
+      var $rootProps = _ref10.$rootProps;
       var data = (_$rootProps$data = $rootProps.data) === null || _$rootProps$data === void 0 ? void 0 : _$rootProps$data[index];
       var _this$computeRadianPo = this.computeRadianPosition(data, index),
         xStart = _this$computeRadianPo.xStart,
@@ -305,9 +326,9 @@ var RadialTreeRadian = /*#__PURE__*/function (_Component2) {
     }
   }, {
     key: "getLineProps",
-    value: function getLineProps(_ref13, index) {
-      var _$rootProps$data2, _color, _ref14;
-      var $rootProps = _ref13.$rootProps;
+    value: function getLineProps(_ref11, index) {
+      var _$rootProps$data2, _color;
+      var $rootProps = _ref11.$rootProps;
       var data = (_$rootProps$data2 = $rootProps.data) === null || _$rootProps$data2 === void 0 ? void 0 : _$rootProps$data2[index];
       var _this$computeRadianPo2 = this.computeRadianPosition(data, index),
         xStart = _this$computeRadianPo2.xStart,
@@ -319,7 +340,7 @@ var RadialTreeRadian = /*#__PURE__*/function (_Component2) {
         transparent = _this$asProps5.transparent,
         resolveColor = _this$asProps5.resolveColor;
       var color = (_color = data.color) !== null && _color !== void 0 ? _color : this.asProps.color;
-      return _ref14 = {
+      return (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])({
         x1: xStart,
         y1: yStart,
         x2: xEnd,
@@ -327,13 +348,13 @@ var RadialTreeRadian = /*#__PURE__*/function (_Component2) {
         stroke: color,
         resolveColor: resolveColor,
         transparent: transparent
-      }, (0, _defineProperty2["default"])(_ref14, 'data-x1', xStart), (0, _defineProperty2["default"])(_ref14, 'data-y1', yStart), (0, _defineProperty2["default"])(_ref14, 'data-x2', xEnd), (0, _defineProperty2["default"])(_ref14, 'data-y2', yEnd), (0, _defineProperty2["default"])(_ref14, 'data-radial-animation', "".concat(uid, "-line")), (0, _defineProperty2["default"])(_ref14, 'data-radian-index', index), _ref14;
+      }, 'data-x1', xStart), 'data-y1', yStart), 'data-x2', xEnd), 'data-y2', yEnd), 'data-radial-animation', "".concat(uid, "-line")), 'data-radian-index', index);
     }
   }, {
     key: "getCapProps",
-    value: function getCapProps(_ref15, index) {
-      var _$rootProps$data3, _color2, _ref16;
-      var $rootProps = _ref15.$rootProps;
+    value: function getCapProps(_ref13, index) {
+      var _$rootProps$data3, _color2;
+      var $rootProps = _ref13.$rootProps;
       var data = (_$rootProps$data3 = $rootProps.data) === null || _$rootProps$data3 === void 0 ? void 0 : _$rootProps$data3[index];
       var _this$computeRadianPo3 = this.computeRadianPosition(data, index),
         xEnd = _this$computeRadianPo3.xEnd,
@@ -345,16 +366,16 @@ var RadialTreeRadian = /*#__PURE__*/function (_Component2) {
         resolveColor = _this$asProps6.resolveColor,
         patterns = _this$asProps6.patterns;
       var color = (_color2 = data.color) !== null && _color2 !== void 0 ? _color2 : this.asProps.color;
-      return _ref16 = {
+      return (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])({
         x: xEnd,
         y: yEnd
-      }, (0, _defineProperty2["default"])(_ref16, 'data-cx', xEnd), (0, _defineProperty2["default"])(_ref16, 'data-cy', yEnd), (0, _defineProperty2["default"])(_ref16, "radius", capSize), (0, _defineProperty2["default"])(_ref16, "color", color), (0, _defineProperty2["default"])(_ref16, "resolveColor", resolveColor), (0, _defineProperty2["default"])(_ref16, "transparent", transparent), (0, _defineProperty2["default"])(_ref16, "patterns", patterns), (0, _defineProperty2["default"])(_ref16, "uid", "".concat(uid, "-cap-").concat(index)), (0, _defineProperty2["default"])(_ref16, 'data-radial-animation', "".concat(uid, "-cap-circle")), (0, _defineProperty2["default"])(_ref16, 'data-radian-index', index), _ref16;
+      }, 'data-cx', xEnd), 'data-cy', yEnd), "radius", capSize), "color", color), "resolveColor", resolveColor), "transparent", transparent), "patterns", patterns), "uid", "".concat(uid, "-cap-").concat(index)), 'data-radial-animation', "".concat(uid, "-cap-circle")), 'data-radian-index', index);
     }
   }, {
     key: "getIconProps",
-    value: function getIconProps(_ref17, index) {
-      var _$rootProps$data4, _iconColor, _iconSize, _icon, _ref18;
-      var $rootProps = _ref17.$rootProps;
+    value: function getIconProps(_ref15, index) {
+      var _$rootProps$data4, _iconColor, _iconSize, _icon;
+      var $rootProps = _ref15.$rootProps;
       var data = (_$rootProps$data4 = $rootProps.data) === null || _$rootProps$data4 === void 0 ? void 0 : _$rootProps$data4[index];
       var _this$computeRadianPo4 = this.computeRadianPosition(data, index),
         xEnd = _this$computeRadianPo4.xEnd,
@@ -368,16 +389,16 @@ var RadialTreeRadian = /*#__PURE__*/function (_Component2) {
       var icon = (_icon = data.icon) !== null && _icon !== void 0 ? _icon : this.asProps.icon;
       var x = xEnd - iconSize / 2;
       var y = yEnd - iconSize / 2;
-      return _ref18 = {
+      return (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])({
         x: x,
         y: y
-      }, (0, _defineProperty2["default"])(_ref18, 'data-x', x), (0, _defineProperty2["default"])(_ref18, 'data-y', y), (0, _defineProperty2["default"])(_ref18, "iconSize", iconSize), (0, _defineProperty2["default"])(_ref18, "color", iconColor !== null && iconColor !== void 0 ? iconColor : '#fff'), (0, _defineProperty2["default"])(_ref18, "resolveColor", resolveColor), (0, _defineProperty2["default"])(_ref18, 'data-radial-animation', "".concat(uid, "-cap-icon")), (0, _defineProperty2["default"])(_ref18, 'data-radian-index', index), (0, _defineProperty2["default"])(_ref18, "icon", icon), (0, _defineProperty2["default"])(_ref18, "tag", icon), (0, _defineProperty2["default"])(_ref18, "isActive", isActive), _ref18;
+      }, 'data-x', x), 'data-y', y), "iconSize", iconSize), "color", iconColor !== null && iconColor !== void 0 ? iconColor : '#fff'), "resolveColor", resolveColor), 'data-radial-animation', "".concat(uid, "-cap-icon")), 'data-radian-index', index), "icon", icon), "tag", icon), "isActive", isActive);
     }
   }, {
     key: "getLabelProps",
-    value: function getLabelProps(_ref19, index) {
-      var _$rootProps$data5, _color3, _ref21;
-      var $rootProps = _ref19.$rootProps;
+    value: function getLabelProps(_ref17, index) {
+      var _$rootProps$data5, _color3;
+      var $rootProps = _ref17.$rootProps;
       var data = (_$rootProps$data5 = $rootProps.data) === null || _$rootProps$data5 === void 0 ? void 0 : _$rootProps$data5[index];
       var _this$computeRadianPo5 = this.computeRadianPosition(data, index),
         xLabelCenter = _this$computeRadianPo5.xLabelCenter,
@@ -389,14 +410,14 @@ var RadialTreeRadian = /*#__PURE__*/function (_Component2) {
         textSize = _this$asProps8.textSize,
         transparent = _this$asProps8.transparent,
         resolveColor = _this$asProps8.resolveColor;
-      var _ref20 = data,
-        label = _ref20.label;
+      var _ref18 = data,
+        label = _ref18.label;
       var color = (_color3 = data.color) !== null && _color3 !== void 0 ? _color3 : this.asProps.color;
-      return _ref21 = {
+      return (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])({
         x: xLabelCenter,
         y: yLabelCenter,
         angle: labelAngle
-      }, (0, _defineProperty2["default"])(_ref21, 'data-radial-animation', "".concat(uid, "-label")), (0, _defineProperty2["default"])(_ref21, 'data-radian-index', index), (0, _defineProperty2["default"])(_ref21, "label", label), (0, _defineProperty2["default"])(_ref21, "color", color), (0, _defineProperty2["default"])(_ref21, "resolveColor", resolveColor), (0, _defineProperty2["default"])(_ref21, "isHorizontal", isHorizontal), (0, _defineProperty2["default"])(_ref21, "textSize", textSize), (0, _defineProperty2["default"])(_ref21, "transparent", transparent), _ref21;
+      }, 'data-radial-animation', "".concat(uid, "-label")), 'data-radian-index', index), "label", label), "color", color), "resolveColor", resolveColor), "isHorizontal", isHorizontal), "textSize", textSize), "transparent", transparent);
     }
   }, {
     key: "getRadianKey",
@@ -458,10 +479,10 @@ var RadialTreeRadian = /*#__PURE__*/function (_Component2) {
     key: "renderRadian",
     value: function renderRadian(data, index) {
       var _ref2;
-      var _this$asProps10 = this.asProps,
-        styles = _this$asProps10.styles,
-        Children = _this$asProps10.Children,
-        onRadianClick = _this$asProps10.onRadianClick;
+      var _this$asProps0 = this.asProps,
+        styles = _this$asProps0.styles,
+        Children = _this$asProps0.Children,
+        onRadianClick = _this$asProps0.onRadianClick;
       var key = this.getRadianKey(data, index);
       var SRadian = 'g';
       var children = (0, _getOriginChildren["default"])(Children);
@@ -493,7 +514,6 @@ var RadialTreeRadian = /*#__PURE__*/function (_Component2) {
       }));
     }
   }]);
-  return RadialTreeRadian;
 }(_core.Component);
 /** @deprecated */
 (0, _defineProperty2["default"])(RadialTreeRadian, "displayName", 'RadialTreeRadian');
@@ -506,10 +526,10 @@ var RadialTreeRadian = /*#__PURE__*/function (_Component2) {
   iconSize: 16,
   textSize: 14
 });
-var InteractiveArea = function InteractiveArea(_ref22) {
+var InteractiveArea = function InteractiveArea(_ref20) {
   var _ref4;
-  var SInteractiveArea = _ref22.Element,
-    styles = _ref22.styles;
+  var SInteractiveArea = _ref20.Element,
+    styles = _ref20.styles;
   return _ref4 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SInteractiveArea, _ref4.cn("SInteractiveArea", {
     "stroke": 'transparent',
     "render": 'line'
@@ -518,13 +538,13 @@ var InteractiveArea = function InteractiveArea(_ref22) {
 
 /** @deprecated */
 
-var Line = function Line(_ref23) {
+var Line = function Line(_ref21) {
   var _ref5;
-  var SLine = _ref23.Element,
-    styles = _ref23.styles,
-    stroke = _ref23.stroke,
-    resolveColor = _ref23.resolveColor,
-    transparent = _ref23.transparent;
+  var SLine = _ref21.Element,
+    styles = _ref21.styles,
+    stroke = _ref21.stroke,
+    resolveColor = _ref21.resolveColor,
+    transparent = _ref21.transparent;
   return _ref5 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SLine, _ref5.cn("SLine", {
     "render": 'line',
     "stroke": resolveColor(stroke),
@@ -534,19 +554,19 @@ var Line = function Line(_ref23) {
 
 /** @deprecated */
 
-var Cap = function Cap(_ref24) {
+var Cap = function Cap(_ref22) {
   var _ref7;
-  var SCap = _ref24.Element,
-    styles = _ref24.styles,
-    _ref24$x = _ref24.x,
-    x = _ref24$x === void 0 ? 0 : _ref24$x,
-    _ref24$y = _ref24.y,
-    y = _ref24$y === void 0 ? 0 : _ref24$y,
-    radius = _ref24.radius,
-    color = _ref24.color,
-    resolveColor = _ref24.resolveColor,
-    transparent = _ref24.transparent,
-    patterns = _ref24.patterns;
+  var SCap = _ref22.Element,
+    styles = _ref22.styles,
+    _ref22$x = _ref22.x,
+    x = _ref22$x === void 0 ? 0 : _ref22$x,
+    _ref22$y = _ref22.y,
+    y = _ref22$y === void 0 ? 0 : _ref22$y,
+    radius = _ref22.radius,
+    color = _ref22.color,
+    resolveColor = _ref22.resolveColor,
+    transparent = _ref22.transparent,
+    patterns = _ref22.patterns;
   if (!patterns) {
     var _ref6;
     return _ref6 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SCap, _ref6.cn("SCap", {
@@ -579,16 +599,16 @@ var Cap = function Cap(_ref24) {
 
 /** @deprecated */
 
-var Icon = function Icon(_ref25) {
+var Icon = function Icon(_ref23) {
   var _ref8;
-  var SIcon = _ref25.Element,
-    styles = _ref25.styles,
-    isActive = _ref25.isActive,
-    tag = _ref25.tag,
-    x = _ref25.x,
-    y = _ref25.y,
-    iconSize = _ref25.iconSize,
-    transparent = _ref25.transparent;
+  var SIcon = _ref23.Element,
+    styles = _ref23.styles,
+    isActive = _ref23.isActive,
+    tag = _ref23.tag,
+    x = _ref23.x,
+    y = _ref23.y,
+    iconSize = _ref23.iconSize,
+    transparent = _ref23.transparent;
   if (!(isActive && tag)) return null;
   var width = iconSize;
   var height = iconSize;
@@ -604,19 +624,19 @@ var Icon = function Icon(_ref25) {
 
 /** @deprecated */
 
-var Label = function Label(_ref26) {
-  var SLabel = _ref26.Element,
-    Children = _ref26.Children,
-    styles = _ref26.styles,
-    label = _ref26.label,
-    color = _ref26.color,
-    resolveColor = _ref26.resolveColor,
-    isHorizontal = _ref26.isHorizontal,
-    x = _ref26.x,
-    y = _ref26.y,
-    textSize = _ref26.textSize,
-    angle = _ref26.angle,
-    transparent = _ref26.transparent;
+var Label = function Label(_ref24) {
+  var SLabel = _ref24.Element,
+    Children = _ref24.Children,
+    styles = _ref24.styles,
+    label = _ref24.label,
+    color = _ref24.color,
+    resolveColor = _ref24.resolveColor,
+    isHorizontal = _ref24.isHorizontal,
+    x = _ref24.x,
+    y = _ref24.y,
+    textSize = _ref24.textSize,
+    angle = _ref24.angle,
+    transparent = _ref24.transparent;
   var lines = String(label).split('\n');
   var linesCount = lines.length;
   var SLabelLine = 'tspan';
@@ -625,7 +645,7 @@ var Label = function Label(_ref26) {
   var transform = "rotate(".concat([angleDegs].concat(transformOrigin).join(', '), ")");
   var sstyles = (0, _core.sstyled)(styles);
   var sLabelStyles = sstyles.cn('SLabel', {
-    color: resolveColor(color),
+    'color': resolveColor(color),
     'text-cursor': isHorizontal ? 'text' : 'vertical-text',
     transparent: transparent
   });
@@ -657,18 +677,18 @@ var Radian = (0, _createElement["default"])(RadialTreeRadian, {
 
 /** @deprecated */
 
-var Title = function Title(_ref27) {
+var Title = function Title(_ref25) {
   var _ref9;
-  var STitle = _ref27.Element,
-    Children = _ref27.Children,
-    children = _ref27.children,
-    styles = _ref27.styles,
-    textSize = _ref27.textSize,
-    color = _ref27.color,
-    resolveColor = _ref27.resolveColor,
-    x = _ref27.x,
-    y = _ref27.y,
-    dataHintsHandler = _ref27.dataHintsHandler;
+  var STitle = _ref25.Element,
+    Children = _ref25.Children,
+    children = _ref25.children,
+    styles = _ref25.styles,
+    textSize = _ref25.textSize,
+    color = _ref25.color,
+    resolveColor = _ref25.resolveColor,
+    x = _ref25.x,
+    y = _ref25.y,
+    dataHintsHandler = _ref25.dataHintsHandler;
   if (typeof children === 'string') {
     dataHintsHandler.setTitle('vertical', children);
   }
@@ -687,6 +707,5 @@ var RadialTree = (0, _createElement["default"])(RadialTreeBase, {
   Title: Title,
   Radian: Radian
 });
-var _default = RadialTree;
-exports["default"] = _default;
+var _default = exports["default"] = RadialTree;
 //# sourceMappingURL=RadialTree.js.map