@semcore/d3-chart 3.60.2-prerelease.0 → 3.61.0-prerelease.0

package/lib/esm/Reference.mjs

@@ -1,14 +1,13 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
 import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _callSuper from "@babel/runtime/helpers/esm/callSuper";
 import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import { sstyled } from "@semcore/utils/lib/core/index";
+import { sstyled, Component } from "@semcore/core";
+import uniqueIDEnhancement from "@semcore/core/lib/utils/uniqueID";
 import React from "react";
-import { sstyled as sstyled$1, Component } from "@semcore/core";
-import uniqueIDEnhancement from "@semcore/utils/lib/uniqueID";
 import createElement from "./createElement.mjs";
 import { scaleOfBandwidth } from "./utils.mjs";
 /*!__reshadow-styles__:"./style/reference.shadow.css"*/
@@ -16,22 +15,22 @@ var style = (
   /*__reshadow_css_start__*/
   (sstyled.insert(
     /*__inner_css_start__*/
-    ".___SReferenceLine_1i11x_gg_{fill:none;stroke:var(--intergalactic-chart-grid-y-accent-hover-line, #a9abb6)}.___STitle_1i11x_gg_{font-size:var(--intergalactic-fs-100, 12px);fill:var(--intergalactic-chart-grid-text-label, #6c6e79);transform-origin:var(--transform-origin_1i11x)}.___STitle_1i11x_gg_._position_top_1i11x_gg_{text-anchor:middle}.___STitle_1i11x_gg_._position_bottom_1i11x_gg_{text-anchor:middle;dominant-baseline:hanging}.___STitle_1i11x_gg_._position_left_1i11x_gg_,.___STitle_1i11x_gg_._position_right_1i11x_gg_{transform:rotate(-90deg);text-anchor:middle;dominant-baseline:middle}.___SBackground_1i11x_gg_{fill:var(--intergalactic-chart-grid-period-bg, rgba(196, 199, 207, 0.2))}.___SStripes_1i11x_gg_{fill:var(--fill_1i11x)}.___SStripesPatternPath_1i11x_gg_{stroke:var(--intergalactic-chart-grid-period-pattern, rgba(25, 27, 35, 0.15));stroke-width:1px}",
+    ".___SReferenceLine_cfpzn_gg_{fill:none;stroke:var(--intergalactic-chart-grid-y-accent-hover-line, rgb(214, 216, 215))}.___STitle_cfpzn_gg_{font-size:var(--intergalactic-fs-100, 12px);fill:var(--intergalactic-chart-grid-text-label, rgba(0, 3, 0, 0.583));transform-origin:var(--transform-origin_cfpzn)}@supports (color:color(display-p3 0 0 0%)){.___STitle_cfpzn_gg_{fill:var(--intergalactic-chart-grid-text-label, rgba(0, 3, 0, 0.583))}@media (color-gamut:p3){.___STitle_cfpzn_gg_{fill:var(--intergalactic-chart-grid-text-label, color(display-p3 0.00228 0.01289 0.00252 / 0.583))}}}.___STitle_cfpzn_gg_._position_top_cfpzn_gg_{text-anchor:middle}.___STitle_cfpzn_gg_._position_bottom_cfpzn_gg_{text-anchor:middle;dominant-baseline:hanging}.___STitle_cfpzn_gg_._position_left_cfpzn_gg_,.___STitle_cfpzn_gg_._position_right_cfpzn_gg_{transform:rotate(-90deg);text-anchor:middle;dominant-baseline:middle}.___SBackground_cfpzn_gg_{fill:var(--intergalactic-chart-grid-period-bg, rgb(241, 242, 242))}.___SStripes_cfpzn_gg_{fill:var(--fill_cfpzn)}.___SStripesPatternPath_cfpzn_gg_{stroke:var(--intergalactic-chart-grid-period-pattern, rgb(237, 239, 238));stroke-width:1px}",
     /*__inner_css_end__*/
-    "1i11x_gg_"
+    "cfpzn_gg_"
   ), /*__reshadow_css_end__*/
   {
-    "__SReferenceLine": "___SReferenceLine_1i11x_gg_",
-    "__STitle": "___STitle_1i11x_gg_",
-    "--transform-origin": "--transform-origin_1i11x",
-    "_position_top": "_position_top_1i11x_gg_",
-    "_position_bottom": "_position_bottom_1i11x_gg_",
-    "_position_right": "_position_right_1i11x_gg_",
-    "_position_left": "_position_left_1i11x_gg_",
-    "__SBackground": "___SBackground_1i11x_gg_",
-    "__SStripes": "___SStripes_1i11x_gg_",
-    "--fill": "--fill_1i11x",
-    "__SStripesPatternPath": "___SStripesPatternPath_1i11x_gg_"
+    "__SReferenceLine": "___SReferenceLine_cfpzn_gg_",
+    "__STitle": "___STitle_cfpzn_gg_",
+    "--transform-origin": "--transform-origin_cfpzn",
+    "_position_top": "_position_top_cfpzn_gg_",
+    "_position_bottom": "_position_bottom_cfpzn_gg_",
+    "_position_right": "_position_right_cfpzn_gg_",
+    "_position_left": "_position_left_cfpzn_gg_",
+    "__SBackground": "___SBackground_cfpzn_gg_",
+    "__SStripes": "___SStripes_cfpzn_gg_",
+    "--fill": "--fill_cfpzn",
+    "__SStripesPatternPath": "___SStripesPatternPath_cfpzn_gg_"
   })
 );
 var side2direction = {
@@ -66,7 +65,7 @@ var lineDirection2props = {
 };
 var rectDirection2props = {
   vertical: function vertical2(_ref9, value, endValue) {
-    var _ref10 = _slicedToArray(_ref9, 2), xScale = _ref10[0], yScale = _ref10[1];
+    var _ref0 = _slicedToArray(_ref9, 2), xScale = _ref0[0], yScale = _ref0[1];
     var yRange = yScale.range();
     var x = scaleOfBandwidth(xScale, value);
     var width = endValue !== void 0 ? scaleOfBandwidth(xScale, endValue) - x : 100;
@@ -77,8 +76,8 @@ var rectDirection2props = {
       height: yRange[0] - yRange[1]
     };
   },
-  horizontal: function horizontal2(_ref11, value, endValue) {
-    var _ref12 = _slicedToArray(_ref11, 2), xScale = _ref12[0], yScale = _ref12[1];
+  horizontal: function horizontal2(_ref1, value, endValue) {
+    var _ref10 = _slicedToArray(_ref1, 2), xScale = _ref10[0], yScale = _ref10[1];
     var xRange = xScale.range();
     var y = scaleOfBandwidth(yScale, value);
     var height = endValue !== void 0 ? scaleOfBandwidth(yScale, endValue) - y : 100;
@@ -92,8 +91,8 @@ var rectDirection2props = {
 };
 var titleOffset = 10;
 var titleSideToProps = {
-  left: function left(_ref13, value) {
-    var _ref14 = _slicedToArray(_ref13, 2), xScale = _ref14[0], yScale = _ref14[1];
+  left: function left(_ref11, value) {
+    var _ref12 = _slicedToArray(_ref11, 2), xScale = _ref12[0], yScale = _ref12[1];
     var yRange = yScale.range();
     var x = scaleOfBandwidth(xScale, value);
     return {
@@ -101,8 +100,8 @@ var titleSideToProps = {
       y: (yRange[0] + yRange[1]) / 2
     };
   },
-  right: function right(_ref15, value) {
-    var _ref16 = _slicedToArray(_ref15, 2), xScale = _ref16[0], yScale = _ref16[1];
+  right: function right(_ref13, value) {
+    var _ref14 = _slicedToArray(_ref13, 2), xScale = _ref14[0], yScale = _ref14[1];
     var yRange = yScale.range();
     var x = scaleOfBandwidth(xScale, value);
     return {
@@ -110,8 +109,8 @@ var titleSideToProps = {
       y: (yRange[0] + yRange[1]) / 2
     };
   },
-  top: function top(_ref17, value) {
-    var _ref18 = _slicedToArray(_ref17, 2), xScale = _ref18[0], yScale = _ref18[1];
+  top: function top(_ref15, value) {
+    var _ref16 = _slicedToArray(_ref15, 2), xScale = _ref16[0], yScale = _ref16[1];
     var xRange = xScale.range();
     var y = scaleOfBandwidth(yScale, value);
     return {
@@ -119,8 +118,8 @@ var titleSideToProps = {
       y: y - titleOffset
     };
   },
-  bottom: function bottom(_ref19, value) {
-    var _ref20 = _slicedToArray(_ref19, 2), xScale = _ref20[0], yScale = _ref20[1];
+  bottom: function bottom(_ref17, value) {
+    var _ref18 = _slicedToArray(_ref17, 2), xScale = _ref18[0], yScale = _ref18[1];
     var xRange = xScale.range();
     var y = scaleOfBandwidth(yScale, value);
     return {
@@ -129,14 +128,13 @@ var titleSideToProps = {
     };
   }
 };
-var ReferenceLineRoot = /* @__PURE__ */ function(_Component) {
-  _inherits(ReferenceLineRoot2, _Component);
-  var _super = _createSuper(ReferenceLineRoot2);
+var ReferenceLineRoot = /* @__PURE__ */ (function(_Component) {
   function ReferenceLineRoot2() {
     _classCallCheck(this, ReferenceLineRoot2);
-    return _super.apply(this, arguments);
+    return _callSuper(this, ReferenceLineRoot2, arguments);
   }
-  _createClass(ReferenceLineRoot2, [{
+  _inherits(ReferenceLineRoot2, _Component);
+  return _createClass(ReferenceLineRoot2, [{
     key: "getTitleProps",
     value: function getTitleProps() {
       var _this$asProps = this.asProps, position = _this$asProps.position, value = _this$asProps.value;
@@ -161,15 +159,14 @@ var ReferenceLineRoot = /* @__PURE__ */ function(_Component) {
       var SReferenceLine = this.Element;
       var _this$asProps3 = this.asProps, title = _this$asProps3.title, scale = _this$asProps3.scale, position = _this$asProps3.position, value = _this$asProps3.value, color = _this$asProps3.color, resolveColor = _this$asProps3.resolveColor, styles = _this$asProps3.styles;
       var positionProps = lineDirection2props[side2direction[position]];
-      return _ref = sstyled$1(styles), /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(SReferenceLine, _ref.cn("SReferenceLine", _objectSpread({
+      return _ref = sstyled(styles), /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(SReferenceLine, _ref.cn("SReferenceLine", _objectSpread({
         "render": "line",
         "__excludeProps": ["data", "scale", "format", "value", "color"],
         "stroke": resolveColor(color)
       }, positionProps(scale, value)))), title && /* @__PURE__ */ React.createElement(ReferenceLine.Title, null, title));
     }
   }]);
-  return ReferenceLineRoot2;
-}(Component);
+})(Component);
 _defineProperty(ReferenceLineRoot, "displayName", "ReferenceLine");
 _defineProperty(ReferenceLineRoot, "style", style);
 _defineProperty(ReferenceLineRoot, "defaultProps", {
@@ -179,11 +176,11 @@ function Title(props) {
   var _ref2;
   var STitle = props.Element, styles = props.styles, scale = props.scale, position = props.position, value = props.value;
   var _titleSideToProps$pos = titleSideToProps[position](scale, value), x = _titleSideToProps$pos.x, y = _titleSideToProps$pos.y;
-  var sstyles = sstyled$1(styles);
+  var sstyles = sstyled(styles);
   var sTitleStyles = sstyles.cn("STitle", {
     "transform-origin": "".concat(x.toFixed(2), "px ").concat(y.toFixed(2), "px")
   });
-  return _ref2 = sstyled$1(styles), /* @__PURE__ */ React.createElement(STitle, _ref2.cn("STitle", {
+  return _ref2 = sstyled(styles), /* @__PURE__ */ React.createElement(STitle, _ref2.cn("STitle", {
     "render": "text",
     "childrenPosition": "inside",
     "className": sTitleStyles.className,
@@ -197,7 +194,7 @@ function Background(props) {
   var _ref3;
   var SBackground = props.Element, styles = props.styles, scale = props.scale, _props$position = props.position, position = _props$position === void 0 ? "left" : _props$position, value = props.value, endValue = props.endValue;
   var positionProps = rectDirection2props[side2direction[position]];
-  return _ref3 = sstyled$1(styles), /* @__PURE__ */ React.createElement(SBackground, _ref3.cn("SBackground", _objectSpread({
+  return _ref3 = sstyled(styles), /* @__PURE__ */ React.createElement(SBackground, _ref3.cn("SBackground", _objectSpread({
     "render": "rect",
     "childrenPosition": "inside"
   }, positionProps(scale, value, endValue))));
@@ -214,7 +211,7 @@ function Stripes(props) {
   var SStripesPatternPath = "path";
   var positionProps = rectDirection2props[side2direction[position]];
   var patternId = "".concat(uid, "-pattern");
-  return _ref4 = sstyled$1(styles), /* @__PURE__ */ React.createElement("g", _ref4.cn("g", {}), /* @__PURE__ */ React.createElement(SStripes, _ref4.cn("SStripes", _objectSpread({
+  return _ref4 = sstyled(styles), /* @__PURE__ */ React.createElement("g", _ref4.cn("g", {}), /* @__PURE__ */ React.createElement(SStripes, _ref4.cn("SStripes", _objectSpread({
     "render": "rect",
     "childrenPosition": "inside",
     "fill": "url(#".concat(patternId, ")")

package/lib/esm/ResponsiveContainer.mjs

@@ -2,27 +2,24 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
 import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
+import _callSuper from "@babel/runtime/helpers/esm/callSuper";
 import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import createComponent, { sstyled, assignProps, Component } from "@semcore/core";
+import { sstyled, assignProps, Component, createComponent } from "@semcore/core";
+import { Box } from "@semcore/base-components";
+import canUseDOM from "@semcore/core/lib/utils/canUseDOM";
+import fire from "@semcore/core/lib/utils/fire";
+import getOriginChildren from "@semcore/core/lib/utils/getOriginChildren";
+import trottle from "@semcore/core/lib/utils/rafTrottle";
 import React from "react";
-import { Box } from "@semcore/flex-box";
-import trottle from "@semcore/utils/lib/rafTrottle";
-import fire from "@semcore/utils/lib/fire";
-import getOriginChildren from "@semcore/utils/lib/getOriginChildren";
-import canUseDOM from "@semcore/utils/lib/canUseDOM";
-var ResponsiveContainerRoot = /* @__PURE__ */ function(_Component) {
-  _inherits(ResponsiveContainerRoot2, _Component);
-  var _super = _createSuper(ResponsiveContainerRoot2);
+var ResponsiveContainerRoot = /* @__PURE__ */ (function(_Component) {
   function ResponsiveContainerRoot2(props) {
     var _this;
     _classCallCheck(this, ResponsiveContainerRoot2);
-    _this = _super.call(this, props);
-    _defineProperty(_assertThisInitialized(_this), "containerRef", /* @__PURE__ */ React.createRef());
-    _defineProperty(_assertThisInitialized(_this), "size", [0, 0]);
-    _defineProperty(_assertThisInitialized(_this), "handleResize", trottle(function(entries) {
+    _this = _callSuper(this, ResponsiveContainerRoot2, [props]);
+    _defineProperty(_this, "containerRef", /* @__PURE__ */ React.createRef());
+    _defineProperty(_this, "size", [0, 0]);
+    _defineProperty(_this, "handleResize", trottle(function(entries) {
       var _this$asProps = _this.asProps, Children = _this$asProps.Children, aspect = _this$asProps.aspect;
       if (!_this.$container) return;
       var _this$$container = _this.$container, width = _this$$container.clientWidth, height = _this$$container.clientHeight;
@@ -40,7 +37,7 @@ var ResponsiveContainerRoot = /* @__PURE__ */ function(_Component) {
       }
       if (_this.size[0] === width && _this.size[1] === height) return;
       _this.size = [width, height];
-      fire(_assertThisInitialized(_this), "onResize", _this.size, entries);
+      fire(_this, "onResize", _this.size, entries);
       if (typeof getOriginChildren(Children) === "function") {
         _this.forceUpdate();
       }
@@ -50,7 +47,8 @@ var ResponsiveContainerRoot = /* @__PURE__ */ function(_Component) {
     }
     return _this;
   }
-  _createClass(ResponsiveContainerRoot2, [{
+  _inherits(ResponsiveContainerRoot2, _Component);
+  return _createClass(ResponsiveContainerRoot2, [{
     key: "$container",
     get: function get() {
       return this.containerRef.current;
@@ -69,7 +67,7 @@ var ResponsiveContainerRoot = /* @__PURE__ */ function(_Component) {
     value: function componentDidMount() {
       if (this.$container) {
         var _this$observer;
-        (_this$observer = this.observer) === null || _this$observer === void 0 ? void 0 : _this$observer.observe(this.$container);
+        (_this$observer = this.observer) === null || _this$observer === void 0 || _this$observer.observe(this.$container);
       }
     }
     // TODO component did update ref?
@@ -77,7 +75,7 @@ var ResponsiveContainerRoot = /* @__PURE__ */ function(_Component) {
     key: "componentWillUnmount",
     value: function componentWillUnmount() {
       var _this$observer2;
-      (_this$observer2 = this.observer) === null || _this$observer2 === void 0 ? void 0 : _this$observer2.disconnect();
+      (_this$observer2 = this.observer) === null || _this$observer2 === void 0 || _this$observer2.disconnect();
     }
   }, {
     key: "render",
@@ -90,8 +88,7 @@ var ResponsiveContainerRoot = /* @__PURE__ */ function(_Component) {
       }, _ref))));
     }
   }]);
-  return ResponsiveContainerRoot2;
-}(Component);
+})(Component);
 _defineProperty(ResponsiveContainerRoot, "displayName", "ResponsiveContainer");
 var ResponsiveContainer = createComponent(ResponsiveContainerRoot);
 export {

package/lib/esm/ScatterPlot.mjs

@@ -2,63 +2,60 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
 import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
+import _callSuper from "@babel/runtime/helpers/esm/callSuper";
 import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import { sstyled } from "@semcore/utils/lib/core/index";
-import { sstyled as sstyled$1, Component, assignProps } from "@semcore/core";
-import React from "react";
+import { sstyled, Component, assignProps } from "@semcore/core";
+import canUseDOM from "@semcore/core/lib/utils/canUseDOM";
+import uniqueIDEnhancement from "@semcore/core/lib/utils/uniqueID";
 import { transition } from "d3-transition";
-import canUseDOM from "@semcore/utils/lib/canUseDOM";
-import uniqueIDEnhancement from "@semcore/utils/lib/uniqueID";
+import React from "react";
 import createElement from "./createElement.mjs";
-import { getScatterPlotRadius } from "./utils.mjs";
-import Tooltip from "./Tooltip.mjs";
 import { PatternFill } from "./Pattern.mjs";
+import Tooltip from "./Tooltip.mjs";
+import { getScatterPlotRadius } from "./utils.mjs";
 /*!__reshadow-styles__:"./style/scatterplot.shadow.css"*/
 var style = (
   /*__reshadow_css_start__*/
   (sstyled.insert(
     /*__inner_css_start__*/
-    ".___SScatterPlot_1ymnd_gg_{fill:var(--intergalactic-chart-palette-order-1, #2bb3ff);transition-property:cx,cy;transition-duration:var(--duration_1ymnd);transition-timing-function:ease-in-out;opacity:.5}@media (hover:hover){.___SScatterPlot_1ymnd_gg_:hover{opacity:.8}}.___SScatterPlot_1ymnd_gg_.__color_1ymnd_gg_{fill:var(--color_1ymnd)}.___SScatterPlot_1ymnd_gg_.__pattern_1ymnd_gg_.__color_1ymnd_gg_{fill:var(--pattern_1ymnd);stroke:var(--color_1ymnd);stroke-width:1px}.___SScatterPlot_1ymnd_gg_.__transparent_1ymnd_gg_{opacity:.3}.___SValue_1ymnd_gg_{text-anchor:middle;font-size:var(--intergalactic-fs-50, 10px);stroke:var(--intergalactic-chart-palette-order-9, #008ff8)}.___SValue_1ymnd_gg_.__color_1ymnd_gg_{stroke:var(--color_1ymnd)}.___SValue_1ymnd_gg_.__transparent_1ymnd_gg_{opacity:.3}",
+    ".___SScatterPlot_1ch38_gg_{fill:var(--intergalactic-chart-palette-order-1, rgb(104, 109, 210));transition-property:cx,cy;transition-duration:var(--duration_1ch38);transition-timing-function:ease-in-out;opacity:.5}@media (hover:hover){.___SScatterPlot_1ch38_gg_:hover{opacity:.8}}.___SScatterPlot_1ch38_gg_.__color_1ch38_gg_{fill:var(--color_1ch38)}.___SScatterPlot_1ch38_gg_.__pattern_1ch38_gg_.__color_1ch38_gg_{fill:var(--pattern_1ch38);stroke:var(--color_1ch38);stroke-width:1px}.___SScatterPlot_1ch38_gg_.__transparent_1ch38_gg_{opacity:.3}.___SValue_1ch38_gg_{text-anchor:middle;font-size:var(--intergalactic-fs-50, 10px);stroke:var(--intergalactic-chart-palette-order-9, rgb(91, 96, 186))}.___SValue_1ch38_gg_.__color_1ch38_gg_{stroke:var(--color_1ch38)}.___SValue_1ch38_gg_.__transparent_1ch38_gg_{opacity:.3}",
     /*__inner_css_end__*/
-    "1ymnd_gg_"
+    "1ch38_gg_"
   ), /*__reshadow_css_end__*/
   {
-    "__SScatterPlot": "___SScatterPlot_1ymnd_gg_",
-    "_color": "__color_1ymnd_gg_",
-    "--color": "--color_1ymnd",
-    "_pattern": "__pattern_1ymnd_gg_",
-    "--pattern": "--pattern_1ymnd",
-    "_transparent": "__transparent_1ymnd_gg_",
-    "__SValue": "___SValue_1ymnd_gg_",
-    "--duration": "--duration_1ymnd"
+    "__SScatterPlot": "___SScatterPlot_1ch38_gg_",
+    "_color": "__color_1ch38_gg_",
+    "--color": "--color_1ch38",
+    "_pattern": "__pattern_1ch38_gg_",
+    "--pattern": "--pattern_1ch38",
+    "_transparent": "__transparent_1ch38_gg_",
+    "__SValue": "___SValue_1ch38_gg_",
+    "--duration": "--duration_1ch38"
   })
 );
-var ScatterPlotRoot = /* @__PURE__ */ function(_Component) {
-  _inherits(ScatterPlotRoot2, _Component);
-  var _super = _createSuper(ScatterPlotRoot2);
+var ScatterPlotRoot = /* @__PURE__ */ (function(_Component) {
   function ScatterPlotRoot2() {
     var _this;
     _classCallCheck(this, ScatterPlotRoot2);
     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), "virtualElement", canUseDOM() ? document.createElement("div") : {});
-    _defineProperty(_assertThisInitialized(_this), "bindHandlerTooltip", function(visible, props, tooltipProps) {
+    _this = _callSuper(this, ScatterPlotRoot2, [].concat(args));
+    _defineProperty(_this, "virtualElement", canUseDOM() ? document.createElement("div") : {});
+    _defineProperty(_this, "bindHandlerTooltip", function(visible, props, tooltipProps) {
       return function(_ref4) {
         var clientX = _ref4.clientX, clientY = _ref4.clientY;
-        var eventEmitter = _this.asProps.eventEmitter;
-        eventEmitter.emit("setTooltipPosition", clientX, clientY);
-        eventEmitter.emit("setTooltipRenderingProps", props, tooltipProps);
-        eventEmitter.emit("setTooltipVisible", visible);
+        var _this$asProps = _this.asProps, eventEmitter = _this$asProps.eventEmitter, plotId = _this$asProps.plotId;
+        eventEmitter.emit("setTooltipPosition_".concat(plotId), clientX, clientY);
+        eventEmitter.emit("setTooltipRenderingProps_".concat(plotId), props, tooltipProps);
+        eventEmitter.emit("setTooltipVisible_".concat(plotId), visible);
       };
     });
     return _this;
   }
-  _createClass(ScatterPlotRoot2, [{
+  _inherits(ScatterPlotRoot2, _Component);
+  return _createClass(ScatterPlotRoot2, [{
     key: "generateGetBoundingClientRect",
     value: function generateGetBoundingClientRect() {
       var x = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : 0;
@@ -77,7 +74,7 @@ var ScatterPlotRoot = /* @__PURE__ */ function(_Component) {
   }, {
     key: "animationCircle",
     value: function animationCircle() {
-      var _this$asProps = this.asProps, duration = _this$asProps.duration, uid = _this$asProps.uid, r = _this$asProps.r, value = _this$asProps.value;
+      var _this$asProps2 = this.asProps, duration = _this$asProps2.duration, uid = _this$asProps2.uid, r = _this$asProps2.r, value = _this$asProps2.value;
       var radius = r ? r : getScatterPlotRadius(value);
       var selectRect = transition().selection().selectAll("[id^=".concat(uid, "]")).attr("r", 0);
       var selectRectNode = selectRect.node();
@@ -97,18 +94,29 @@ var ScatterPlotRoot = /* @__PURE__ */ function(_Component) {
     value: function componentDidMount() {
       this.animationCircle();
     }
+  }, {
+    key: "handlerOnClick",
+    value: function handlerOnClick(index) {
+      var _this2 = this;
+      return function(e) {
+        e.stopPropagation();
+        var onClick = _this2.asProps.onClick;
+        if (!onClick) return;
+        onClick(index, e);
+      };
+    }
   }, {
     key: "renderCircle",
     value: function renderCircle(d, i) {
       var _ref2;
-      var _this$asProps2 = this.asProps, color = _this$asProps2.color, scale = _this$asProps2.scale, x = _this$asProps2.x, y = _this$asProps2.y, r = _this$asProps2.r, offset = _this$asProps2.offset, styles = _this$asProps2.styles, uid = _this$asProps2.uid, duration = _this$asProps2.duration, value = _this$asProps2.value, valueColor = _this$asProps2.valueColor, transparent = _this$asProps2.transparent, resolveColor = _this$asProps2.resolveColor, patterns = _this$asProps2.patterns;
+      var _this$asProps3 = this.asProps, color = _this$asProps3.color, scale = _this$asProps3.scale, x = _this$asProps3.x, y = _this$asProps3.y, r = _this$asProps3.r, offset = _this$asProps3.offset, styles = _this$asProps3.styles, uid = _this$asProps3.uid, duration = _this$asProps3.duration, value = _this$asProps3.value, valueColor = _this$asProps3.valueColor, transparent = _this$asProps3.transparent, resolveColor = _this$asProps3.resolveColor, patterns = _this$asProps3.patterns;
       var _scale = _slicedToArray(scale, 2), xScale = _scale[0], yScale = _scale[1];
       var SScatterPlot = this.Element;
       var SValue = "text";
       if (Number.isNaN(d[x]) || Number.isNaN(d[y])) {
         return null;
       }
-      return _ref2 = sstyled$1(styles), /* @__PURE__ */ React.createElement("g", _ref2.cn("g", {
+      return _ref2 = sstyled(styles), /* @__PURE__ */ React.createElement("g", _ref2.cn("g", {
         "aria-hidden": true,
         "key": "circle(#".concat(i, ")"),
         "onMouseMove": this.bindHandlerTooltip(true, this.props, {
@@ -120,7 +128,8 @@ var ScatterPlotRoot = /* @__PURE__ */ function(_Component) {
           xIndex: i,
           index: i,
           patterns
-        })
+        }),
+        "onClickCapture": this.handlerOnClick(i)
       }), /* @__PURE__ */ React.createElement(SScatterPlot, _ref2.cn("SScatterPlot", {
         "aria-hidden": true,
         "id": "".concat(uid).concat(i),
@@ -152,7 +161,7 @@ var ScatterPlotRoot = /* @__PURE__ */ function(_Component) {
   }, {
     key: "render",
     value: function render() {
-      var _this$asProps3 = this.asProps, data = _this$asProps3.data, uid = _this$asProps3.uid, scale = _this$asProps3.scale, x = _this$asProps3.x, y = _this$asProps3.y, value = _this$asProps3.value;
+      var _this$asProps4 = this.asProps, data = _this$asProps4.data, uid = _this$asProps4.uid, scale = _this$asProps4.scale, x = _this$asProps4.x, y = _this$asProps4.y, value = _this$asProps4.value;
       var _scale2 = _slicedToArray(scale, 2), xScale = _scale2[0], yScale = _scale2[1];
       var xSize = Math.abs(xScale.range()[0] - xScale.range()[1]);
       var ySize = Math.abs(yScale.range()[0] - yScale.range()[1]);
@@ -170,8 +179,7 @@ var ScatterPlotRoot = /* @__PURE__ */ function(_Component) {
       })));
     }
   }]);
-  return ScatterPlotRoot2;
-}(Component);
+})(Component);
 _defineProperty(ScatterPlotRoot, "displayName", "ScatterPlot");
 _defineProperty(ScatterPlotRoot, "style", style);
 _defineProperty(ScatterPlotRoot, "enhance", [uniqueIDEnhancement()]);
@@ -179,13 +187,14 @@ _defineProperty(ScatterPlotRoot, "defaultProps", {
   offset: [0, 0],
   duration: 500
 });
-var ScatterPlotTooltip = function ScatterPlotTooltip2(props) {
+function ScatterPlotTooltip(props) {
   var _ref = arguments[0], _ref3;
   var SScatterPlotTooltip = Tooltip;
-  return _ref3 = sstyled$1(props.styles), /* @__PURE__ */ React.createElement(SScatterPlotTooltip, _ref3.cn("SScatterPlotTooltip", _objectSpread({}, assignProps({
+  return _ref3 = sstyled(props.styles), /* @__PURE__ */ React.createElement(SScatterPlotTooltip, _ref3.cn("SScatterPlotTooltip", _objectSpread({}, assignProps({
     "excludeAnchorProps": true
   }, _ref))));
-};
+}
+;
 var ScatterPlot = createElement(ScatterPlotRoot, {
   Tooltip: [ScatterPlotTooltip, Tooltip._______childrenComponents]
 });

package/lib/esm/StackBar.mjs

@@ -2,34 +2,32 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
 import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
+import _callSuper from "@babel/runtime/helpers/esm/callSuper";
 import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import React from "react";
-import { stack } from "d3-shape";
 import { Component } from "@semcore/core";
-import getOriginChildren from "@semcore/utils/lib/getOriginChildren";
-import createElement from "./createElement.mjs";
+import getOriginChildren from "@semcore/core/lib/utils/getOriginChildren";
+import { stack } from "d3-shape";
+import React from "react";
 import Bar, { MIN_HEIGHT } from "./Bar.mjs";
+import createElement from "./createElement.mjs";
 import HorizontalBar, { MIN_WIDTH } from "./HorizontalBar.mjs";
 import { getChartDefaultColorName } from "./utils.mjs";
-var DEFAULT_INSTANCE = Symbol("DEFAULT_INSTANCE");
-var XY0 = Symbol("XY0");
-var StackBarRoot = /* @__PURE__ */ function(_Component) {
-  _inherits(StackBarRoot2, _Component);
-  var _super = _createSuper(StackBarRoot2);
+var DEFAULT_INSTANCE = /* @__PURE__ */ Symbol("DEFAULT_INSTANCE");
+var XY0 = /* @__PURE__ */ Symbol("XY0");
+var StackBarRoot = /* @__PURE__ */ (function(_Component) {
   function StackBarRoot2() {
     var _this;
     _classCallCheck(this, StackBarRoot2);
     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), "offsetBars", []);
+    _this = _callSuper(this, StackBarRoot2, [].concat(args));
+    _defineProperty(_this, "offsetBars", []);
     return _this;
   }
-  _createClass(StackBarRoot2, [{
+  _inherits(StackBarRoot2, _Component);
+  return _createClass(StackBarRoot2, [{
     key: "getSeries",
     value: function getSeries() {
       var _this$asProps = this.asProps, Children = _this$asProps.Children, data = _this$asProps.data, stack2 = _this$asProps.stack;
@@ -58,15 +56,14 @@ var StackBarRoot = /* @__PURE__ */ function(_Component) {
         return s.key === y;
       });
       var series = this.series[seriesIndex] || [];
-      var rBar = series.map(function(s, i) {
+      var rBar = series.map(function(_s, i) {
         return _this2.series.slice(seriesIndex + 1).some(function(bar) {
           return bar[i][0] !== bar[i][1];
         }) ? 0 : r;
       });
       this.offsetBars[seriesIndex] = (_this$offsetBars$seri = this.offsetBars[seriesIndex]) !== null && _this$offsetBars$seri !== void 0 ? _this$offsetBars$seri : [];
       var data = series.map(function(s) {
-        var _objectSpread2;
-        return _objectSpread(_objectSpread({}, s.data), {}, (_objectSpread2 = {}, _defineProperty(_objectSpread2, y, s[1]), _defineProperty(_objectSpread2, XY0, s[0]), _objectSpread2));
+        return _objectSpread(_objectSpread({}, s.data), {}, _defineProperty(_defineProperty({}, y, s[1]), XY0, s[0]));
       });
       var calcOffset = function calcOffset2(i) {
         var _d$XY, _d$XY2;
@@ -101,7 +98,7 @@ var StackBarRoot = /* @__PURE__ */ function(_Component) {
   }, {
     key: "getHorizontalBarProps",
     value: function getHorizontalBarProps(_ref2, index) {
-      var _this3 = this, _this$offsetBars$seri2;
+      var _this$offsetBars$seri2, _this3 = this;
       var x = _ref2.x, _ref2$wMin = _ref2.wMin, wMin = _ref2$wMin === void 0 ? MIN_WIDTH : _ref2$wMin;
       var _this$asProps3 = this.asProps, y = _this$asProps3.y, r = _this$asProps3.r, scale = _this$asProps3.scale, maxBarSize = _this$asProps3.maxBarSize, patterns = _this$asProps3.patterns;
       var _scale2 = _slicedToArray(scale, 1), xScale = _scale2[0];
@@ -109,15 +106,9 @@ var StackBarRoot = /* @__PURE__ */ function(_Component) {
         return s.key === x;
       });
       var series = this.series[seriesIndex];
-      var rBar = series.map(function(s, i) {
-        return _this3.series.slice(seriesIndex + 1).some(function(bar) {
-          return bar[i][0] !== bar[i][1];
-        }) ? 0 : r;
-      });
       this.offsetBars[seriesIndex] = (_this$offsetBars$seri2 = this.offsetBars[seriesIndex]) !== null && _this$offsetBars$seri2 !== void 0 ? _this$offsetBars$seri2 : [];
       var data = series.map(function(s) {
-        var _objectSpread3;
-        return _objectSpread(_objectSpread({}, s.data), {}, (_objectSpread3 = {}, _defineProperty(_objectSpread3, x, s[1]), _defineProperty(_objectSpread3, XY0, s[0]), _objectSpread3));
+        return _objectSpread(_objectSpread({}, s.data), {}, _defineProperty(_defineProperty({}, x, s[1]), XY0, s[0]));
       });
       var calcOffset = function calcOffset2(i) {
         var _d$XY3, _d$XY4;
@@ -135,7 +126,7 @@ var StackBarRoot = /* @__PURE__ */ function(_Component) {
         wMin,
         x0: XY0,
         y,
-        r: rBar,
+        r: 0,
         groupKey: y,
         offset: calcOffset,
         maxBarSize,
@@ -157,8 +148,7 @@ var StackBarRoot = /* @__PURE__ */ function(_Component) {
       });
     }
   }]);
-  return StackBarRoot2;
-}(Component);
+})(Component);
 _defineProperty(StackBarRoot, "displayName", "StackBar");
 _defineProperty(StackBarRoot, "defaultProps", function() {
   var stack$1 = stack();

package/lib/esm/StackedArea.mjs

@@ -1,26 +1,25 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
 import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _callSuper from "@babel/runtime/helpers/esm/callSuper";
 import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import React from "react";
-import { stack } from "d3-shape";
 import { Component } from "@semcore/core";
-import getOriginChildren from "@semcore/utils/lib/getOriginChildren";
-import createElement from "./createElement.mjs";
+import getOriginChildren from "@semcore/core/lib/utils/getOriginChildren";
+import { stack } from "d3-shape";
+import React from "react";
 import Area from "./Area.mjs";
+import createElement from "./createElement.mjs";
 import { getChartDefaultColorName } from "./utils.mjs";
-var DEFAULT_INSTANCE = Symbol("DEFAULT_INSTANCE");
-var Y0 = Symbol("Y0");
-var StackedAreaRoot = /* @__PURE__ */ function(_Component) {
-  _inherits(StackedAreaRoot2, _Component);
-  var _super = _createSuper(StackedAreaRoot2);
+var DEFAULT_INSTANCE = /* @__PURE__ */ Symbol("DEFAULT_INSTANCE");
+var Y0 = /* @__PURE__ */ Symbol("Y0");
+var StackedAreaRoot = /* @__PURE__ */ (function(_Component) {
   function StackedAreaRoot2() {
     _classCallCheck(this, StackedAreaRoot2);
-    return _super.apply(this, arguments);
+    return _callSuper(this, StackedAreaRoot2, arguments);
   }
-  _createClass(StackedAreaRoot2, [{
+  _inherits(StackedAreaRoot2, _Component);
+  return _createClass(StackedAreaRoot2, [{
     key: "getSeries",
     value: function getSeries() {
       var _this$asProps = this.asProps, Children = _this$asProps.Children, data = _this$asProps.data, stack2 = _this$asProps.stack;
@@ -47,8 +46,7 @@ var StackedAreaRoot = /* @__PURE__ */ function(_Component) {
         color: getChartDefaultColorName(index),
         patterns,
         data: series.map(function(s) {
-          var _objectSpread2;
-          return _objectSpread(_objectSpread({}, s.data), {}, (_objectSpread2 = {}, _defineProperty(_objectSpread2, y, s.data[y] === null ? null : s[1]), _defineProperty(_objectSpread2, Y0, s[0]), _objectSpread2));
+          return _objectSpread(_objectSpread({}, s.data), {}, _defineProperty(_defineProperty({}, y, s.data[y] === null ? null : s[1]), Y0, s[0]));
         }),
         y0: Y0,
         x
@@ -66,8 +64,7 @@ var StackedAreaRoot = /* @__PURE__ */ function(_Component) {
       });
     }
   }]);
-  return StackedAreaRoot2;
-}(Component);
+})(Component);
 _defineProperty(StackedAreaRoot, "displayName", "StackedArea");
 _defineProperty(StackedAreaRoot, "defaultProps", function() {
   var stack$1 = stack();