@semcore/d3-chart 16.5.0 → 17.0.0-prerelease.9

package/lib/esm/ScatterPlot.mjs

@@ -1,9 +1,3 @@
-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 _callSuper from "@babel/runtime/helpers/esm/callSuper";
-import _inherits from "@babel/runtime/helpers/esm/inherits";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import { sstyled, assignProps, Component } from "@semcore/core";
 import canUseDOM from "@semcore/core/lib/utils/canUseDOM";
@@ -15,171 +9,176 @@ import { PatternFill } from "./Pattern.mjs";
 import Tooltip from "./Tooltip.mjs";
 import { getScatterPlotRadius } from "./utils.mjs";
 /*!__reshadow-styles__:"./style/scatterplot.shadow.css"*/
-var style = (
+const style = (
   /*__reshadow_css_start__*/
   (sstyled.insert(
     /*__inner_css_start__*/
-    ".___SScatterPlot_1xwes_gg_{fill:var(--intergalactic-chart-palette-order-1, #2bb3ff);transition-property:cx,cy;transition-duration:var(--duration_1xwes);transition-timing-function:ease-in-out;opacity:.5}@media (hover:hover){.___SScatterPlot_1xwes_gg_:hover{opacity:.8}}.___SScatterPlot_1xwes_gg_.__color_1xwes_gg_{fill:var(--color_1xwes)}.___SScatterPlot_1xwes_gg_.__pattern_1xwes_gg_.__color_1xwes_gg_{fill:var(--pattern_1xwes);stroke:var(--color_1xwes);stroke-width:1px}.___SScatterPlot_1xwes_gg_.__transparent_1xwes_gg_{opacity:.3}.___SValue_1xwes_gg_{text-anchor:middle;font-size:var(--intergalactic-fs-50, 10px);stroke:var(--intergalactic-chart-palette-order-9, #008ff8)}.___SValue_1xwes_gg_.__color_1xwes_gg_{stroke:var(--color_1xwes)}.___SValue_1xwes_gg_.__transparent_1xwes_gg_{opacity:.3}",
+    ".___SScatterPlot_8h4j7_gg_{fill:var(--intergalactic-chart-palette-order-1, #2bb3ff);transition-property:cx,cy;transition-duration:var(--duration_8h4j7);transition-timing-function:ease-in-out;opacity:.5}@media (hover:hover){.___SScatterPlot_8h4j7_gg_:hover{opacity:.8}}.___SScatterPlot_8h4j7_gg_.__color_8h4j7_gg_{fill:var(--color_8h4j7)}.___SScatterPlot_8h4j7_gg_.__pattern_8h4j7_gg_.__color_8h4j7_gg_{fill:var(--pattern_8h4j7);stroke:var(--color_8h4j7);stroke-width:1px}.___SScatterPlot_8h4j7_gg_.__transparent_8h4j7_gg_{opacity:.3}.___SValue_8h4j7_gg_{text-anchor:middle;font-size:var(--intergalactic-fs-50, 10px);stroke:var(--intergalactic-chart-palette-order-9, #008ff8)}.___SValue_8h4j7_gg_.__color_8h4j7_gg_{stroke:var(--color_8h4j7)}.___SValue_8h4j7_gg_.__transparent_8h4j7_gg_{opacity:.3}",
     /*__inner_css_end__*/
-    "1xwes_gg_"
+    "8h4j7_gg_"
   ), /*__reshadow_css_end__*/
   {
-    "__SScatterPlot": "___SScatterPlot_1xwes_gg_",
-    "_color": "__color_1xwes_gg_",
-    "--color": "--color_1xwes",
-    "_pattern": "__pattern_1xwes_gg_",
-    "--pattern": "--pattern_1xwes",
-    "_transparent": "__transparent_1xwes_gg_",
-    "__SValue": "___SValue_1xwes_gg_",
-    "--duration": "--duration_1xwes"
+    "__SScatterPlot": "___SScatterPlot_8h4j7_gg_",
+    "_color": "__color_8h4j7_gg_",
+    "--color": "--color_8h4j7",
+    "_pattern": "__pattern_8h4j7_gg_",
+    "--pattern": "--pattern_8h4j7",
+    "_transparent": "__transparent_8h4j7_gg_",
+    "__SValue": "___SValue_8h4j7_gg_",
+    "--duration": "--duration_8h4j7"
   })
 );
-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 = _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 _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);
-      };
+class ScatterPlotRoot extends Component {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "virtualElement", canUseDOM() ? document.createElement("div") : {});
+    _defineProperty(this, "bindHandlerTooltip", (visible, props, tooltipProps) => ({
+      clientX,
+      clientY
+    }) => {
+      const {
+        eventEmitter,
+        plotId
+      } = this.asProps;
+      eventEmitter.emit(`setTooltipPosition_${plotId}`, clientX, clientY);
+      eventEmitter.emit(`setTooltipRenderingProps_${plotId}`, props, tooltipProps);
+      eventEmitter.emit(`setTooltipVisible_${plotId}`, visible);
     });
-    return _this;
   }
-  _inherits(ScatterPlotRoot2, _Component);
-  return _createClass(ScatterPlotRoot2, [{
-    key: "generateGetBoundingClientRect",
-    value: function generateGetBoundingClientRect() {
-      var x = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : 0;
-      var y = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 0;
-      return function() {
-        return {
-          width: 0,
-          height: 0,
-          top: y,
-          right: x,
-          bottom: y,
-          left: x
-        };
-      };
-    }
-  }, {
-    key: "animationCircle",
-    value: function animationCircle() {
-      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();
-      if (duration > 0 && selectRectNode) {
-        selectRect.transition().duration(duration).attr("r", radius);
-      }
-    }
-  }, {
-    key: "componentDidUpdate",
-    value: function componentDidUpdate(prevProps) {
-      if (prevProps.data !== this.props.data) {
-        this.animationCircle();
-      }
+  generateGetBoundingClientRect(x = 0, y = 0) {
+    return () => ({
+      width: 0,
+      height: 0,
+      top: y,
+      right: x,
+      bottom: y,
+      left: x
+    });
+  }
+  animationCircle() {
+    const {
+      duration,
+      uid,
+      r,
+      value
+    } = this.asProps;
+    const radius = r ? r : getScatterPlotRadius(value);
+    const selectRect = transition().selection().selectAll(`[id^=${uid}]`).attr("r", 0);
+    const selectRectNode = selectRect.node();
+    if (duration > 0 && selectRectNode) {
+      selectRect.transition().duration(duration).attr("r", radius);
     }
-  }, {
-    key: "componentDidMount",
-    value: function componentDidMount() {
+  }
+  componentDidUpdate(prevProps) {
+    if (prevProps.data !== this.props.data) {
       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$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(styles), /* @__PURE__ */ React.createElement("g", _ref2.cn("g", {
-        "aria-hidden": true,
-        "key": "circle(#".concat(i, ")"),
-        "onMouseMove": this.bindHandlerTooltip(true, this.props, {
-          xIndex: i,
-          index: i,
-          patterns
-        }),
-        "onMouseLeave": this.bindHandlerTooltip(false, this.props, {
-          xIndex: i,
-          index: i,
-          patterns
-        }),
-        "onClickCapture": this.handlerOnClick(i)
-      }), /* @__PURE__ */ React.createElement(SScatterPlot, _ref2.cn("SScatterPlot", {
-        "aria-hidden": true,
-        "id": "".concat(uid).concat(i),
-        "index": i,
-        "render": "circle",
-        "clipPath": "url(#".concat(uid, ")"),
-        "cx": xScale(d[x]) + offset[0],
-        "cy": yScale(d[y]) + offset[1],
-        "color": resolveColor(color),
-        "pattern": patterns ? "url(#".concat(uid, "-").concat(i, "-pattern)") : void 0,
-        "r": r,
-        "use:duration": "".concat(duration, "ms"),
-        "transparent": transparent
-      })), patterns && /* @__PURE__ */ React.createElement(PatternFill, _ref2.cn("PatternFill", {
-        "id": "".concat(uid, "-").concat(i, "-pattern"),
-        "patternKey": color,
-        "color": resolveColor(color),
-        "patterns": patterns
-      })), d[value] !== void 0 && /* @__PURE__ */ React.createElement(SValue, _ref2.cn("SValue", {
-        "aria-hidden": true,
-        "x": xScale(d[x]) + offset[0],
-        "y": yScale(d[y]) + offset[1],
-        "dy": ".3em",
-        "clipPath": "url(#".concat(uid, ")"),
-        "color": resolveColor(valueColor),
-        "transparent": transparent
-      }), d[value]));
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      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]);
-      var xMargin = Math.min(xScale.range()[0], xScale.range()[1]);
-      var yMargin = Math.min(yScale.range()[0], yScale.range()[1]);
-      this.asProps.dataHintsHandler.specifyDataRowFields(x, y, value);
-      this.asProps.dataHintsHandler.establishDataType("points-cloud");
-      return /* @__PURE__ */ React.createElement(React.Fragment, null, data.map(this.renderCircle.bind(this)), /* @__PURE__ */ React.createElement("clipPath", {
-        id: uid
-      }, /* @__PURE__ */ React.createElement("rect", {
-        x: xMargin,
-        y: yMargin,
-        width: "".concat(xSize, "px"),
-        height: "".concat(ySize, "px")
-      })));
+  }
+  componentDidMount() {
+    this.animationCircle();
+  }
+  handlerOnClick(index) {
+    return (e) => {
+      e.stopPropagation();
+      const {
+        onClick
+      } = this.asProps;
+      if (!onClick) return;
+      onClick(index, e);
+    };
+  }
+  renderCircle(d, i) {
+    var _ref2;
+    const {
+      color,
+      scale,
+      x,
+      y,
+      r,
+      offset,
+      styles,
+      uid,
+      duration,
+      value,
+      valueColor,
+      transparent,
+      resolveColor,
+      patterns
+    } = this.asProps;
+    const [xScale, yScale] = scale;
+    const SScatterPlot = this.Element;
+    const SValue = "text";
+    if (Number.isNaN(d[x]) || Number.isNaN(d[y])) {
+      return null;
     }
-  }]);
-})(Component);
+    return _ref2 = sstyled(styles), /* @__PURE__ */ React.createElement("g", _ref2.cn("g", {
+      "aria-hidden": true,
+      "key": `circle(#${i})`,
+      "onMouseMove": this.bindHandlerTooltip(true, this.props, {
+        xIndex: i,
+        index: i,
+        patterns
+      }),
+      "onMouseLeave": this.bindHandlerTooltip(false, this.props, {
+        xIndex: i,
+        index: i,
+        patterns
+      }),
+      "onClickCapture": this.handlerOnClick(i)
+    }), /* @__PURE__ */ React.createElement(SScatterPlot, _ref2.cn("SScatterPlot", {
+      "aria-hidden": true,
+      "id": `${uid}${i}`,
+      "index": i,
+      "render": "circle",
+      "clipPath": `url(#${uid})`,
+      "cx": xScale(d[x]) + offset[0],
+      "cy": yScale(d[y]) + offset[1],
+      "color": resolveColor(color),
+      "pattern": patterns ? `url(#${uid}-${i}-pattern)` : void 0,
+      "r": r,
+      "use:duration": `${duration}ms`,
+      "transparent": transparent
+    })), patterns && /* @__PURE__ */ React.createElement(PatternFill, _ref2.cn("PatternFill", {
+      "id": `${uid}-${i}-pattern`,
+      "patternKey": color,
+      "color": resolveColor(color),
+      "patterns": patterns
+    })), d[value] !== void 0 && /* @__PURE__ */ React.createElement(SValue, _ref2.cn("SValue", {
+      "aria-hidden": true,
+      "x": xScale(d[x]) + offset[0],
+      "y": yScale(d[y]) + offset[1],
+      "dy": ".3em",
+      "clipPath": `url(#${uid})`,
+      "color": resolveColor(valueColor),
+      "transparent": transparent
+    }), d[value]));
+  }
+  render() {
+    const {
+      data,
+      uid,
+      scale,
+      x,
+      y,
+      value
+    } = this.asProps;
+    const [xScale, yScale] = scale;
+    const xSize = Math.abs(xScale.range()[0] - xScale.range()[1]);
+    const ySize = Math.abs(yScale.range()[0] - yScale.range()[1]);
+    const xMargin = Math.min(xScale.range()[0], xScale.range()[1]);
+    const yMargin = Math.min(yScale.range()[0], yScale.range()[1]);
+    this.asProps.dataHintsHandler.specifyDataRowFields(x, y, value);
+    this.asProps.dataHintsHandler.establishDataType("points-cloud");
+    return /* @__PURE__ */ React.createElement(React.Fragment, null, data.map(this.renderCircle.bind(this)), /* @__PURE__ */ React.createElement("clipPath", {
+      id: uid
+    }, /* @__PURE__ */ React.createElement("rect", {
+      x: xMargin,
+      y: yMargin,
+      width: `${xSize}px`,
+      height: `${ySize}px`
+    })));
+  }
+}
 _defineProperty(ScatterPlotRoot, "displayName", "ScatterPlot");
 _defineProperty(ScatterPlotRoot, "style", style);
 _defineProperty(ScatterPlotRoot, "enhance", [uniqueIDEnhancement()]);
@@ -189,12 +188,14 @@ _defineProperty(ScatterPlotRoot, "defaultProps", {
 });
 function ScatterPlotTooltip(props) {
   var _ref = arguments[0], _ref3;
-  var SScatterPlotTooltip = Tooltip;
-  return _ref3 = sstyled(props.styles), /* @__PURE__ */ React.createElement(SScatterPlotTooltip, _ref3.cn("SScatterPlotTooltip", _objectSpread({}, assignProps({
-    "excludeAnchorProps": true
-  }, _ref))));
+  const SScatterPlotTooltip = Tooltip;
+  return _ref3 = sstyled(props.styles), /* @__PURE__ */ React.createElement(SScatterPlotTooltip, _ref3.cn("SScatterPlotTooltip", {
+    ...assignProps({
+      "excludeAnchorProps": true
+    }, _ref)
+  }));
 }
-var ScatterPlot = createElement(ScatterPlotRoot, {
+const ScatterPlot = createElement(ScatterPlotRoot, {
   Tooltip: [ScatterPlotTooltip, Tooltip._______childrenComponents]
 });
 export {

package/lib/esm/StackBar.mjs

@@ -1,9 +1,3 @@
-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 _callSuper from "@babel/runtime/helpers/esm/callSuper";
-import _inherits from "@babel/runtime/helpers/esm/inherits";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import { Component } from "@semcore/core";
 import getOriginChildren from "@semcore/core/lib/utils/getOriginChildren";
@@ -13,157 +7,142 @@ 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) {
-  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 = _callSuper(this, StackBarRoot2, [].concat(args));
-    _defineProperty(_this, "offsetBars", []);
-    return _this;
+const DEFAULT_INSTANCE = Symbol("DEFAULT_INSTANCE");
+const XY0 = Symbol("XY0");
+class StackBarRoot extends Component {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "offsetBars", []);
   }
-  _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;
-      if (stack2[DEFAULT_INSTANCE]) {
-        var keys = React.Children.toArray(getOriginChildren(Children)).reduce(function(acc, child) {
-          if (/* @__PURE__ */ React.isValidElement(child) && child.type === StackBar.Bar && !child.props.hide) {
-            acc.push(child.props.y);
-          }
-          if (/* @__PURE__ */ React.isValidElement(child) && child.type === StackBar.HorizontalBar && !child.props.hide) {
-            acc.push(child.props.x);
-          }
-          return acc;
-        }, []);
-        stack2.keys(keys);
-      }
-      return stack2(data);
-    }
-  }, {
-    key: "getBarProps",
-    value: function getBarProps(_ref, index) {
-      var _this2 = this, _this$offsetBars$seri;
-      var y = _ref.y, _ref$hMin = _ref.hMin, hMin = _ref$hMin === void 0 ? MIN_HEIGHT : _ref$hMin;
-      var _this$asProps2 = this.asProps, x = _this$asProps2.x, r = _this$asProps2.r, scale = _this$asProps2.scale, maxBarSize = _this$asProps2.maxBarSize, patterns = _this$asProps2.patterns;
-      var _scale = _slicedToArray(scale, 2), yScale = _scale[1];
-      var seriesIndex = this.series.findIndex(function(s) {
-        return s.key === y;
-      });
-      var series = this.series[seriesIndex] || [];
-      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) {
-        return _objectSpread(_objectSpread({}, s.data), {}, _defineProperty(_defineProperty({}, y, s[1]), XY0, s[0]));
-      });
-      var calcOffset = function calcOffset2(i) {
-        var _d$XY, _d$XY2;
-        var offset = _this2.offsetBars.reduce(function(offset2, offsetBar) {
-          var _offsetBar$i;
-          return offset2 - ((_offsetBar$i = offsetBar[i]) !== null && _offsetBar$i !== void 0 ? _offsetBar$i : 0);
-        }, 0);
-        var d = data[i];
-        var absHeight = Math.abs(yScale(d[y]) - Math.min(yScale(yScale.domain()[0]), yScale((_d$XY = d[XY0]) !== null && _d$XY !== void 0 ? _d$XY : 0)));
-        var isEmptyValue = Number(d[y] - ((_d$XY2 = d[XY0]) !== null && _d$XY2 !== void 0 ? _d$XY2 : 0)) === 0;
-        if (isEmptyValue || absHeight >= hMin) {
-          _this2.offsetBars[seriesIndex][i] = 0;
-        } else {
-          var offsetValue = hMin - absHeight;
-          _this2.offsetBars[seriesIndex][i] = d[y] > 0 ? offsetValue : -offsetValue;
+  getSeries() {
+    const {
+      Children,
+      data,
+      stack: stack2
+    } = this.asProps;
+    if (stack2[DEFAULT_INSTANCE]) {
+      const keys = React.Children.toArray(getOriginChildren(Children)).reduce((acc, child) => {
+        if (/* @__PURE__ */ React.isValidElement(child) && child.type === StackBar.Bar && !child.props.hide) {
+          acc.push(child.props.y);
         }
-        return [0, offset];
-      };
-      return {
-        data,
-        hMin,
-        y0: XY0,
-        x,
-        r: rBar,
-        groupKey: x,
-        offset: calcOffset,
-        maxBarSize,
-        color: getChartDefaultColorName(index),
-        patterns
-      };
-    }
-  }, {
-    key: "getHorizontalBarProps",
-    value: function getHorizontalBarProps(_ref2, index) {
-      var _this3 = this, _this$offsetBars$seri2;
-      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];
-      var seriesIndex = this.series.findIndex(function(s) {
-        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) {
-        return _objectSpread(_objectSpread({}, s.data), {}, _defineProperty(_defineProperty({}, x, s[1]), XY0, s[0]));
-      });
-      var calcOffset = function calcOffset2(i) {
-        var _d$XY3, _d$XY4;
-        var offset = _this3.offsetBars.reduce(function(offset2, offsetBar) {
-          var _offsetBar$i2;
-          return offset2 - ((_offsetBar$i2 = offsetBar[i]) !== null && _offsetBar$i2 !== void 0 ? _offsetBar$i2 : 0);
-        }, 0);
-        var d = data[i];
-        var absWidth = Math.abs(xScale(d[x]) - Math.max(xScale(xScale.domain()[0]), xScale((_d$XY3 = d[XY0]) !== null && _d$XY3 !== void 0 ? _d$XY3 : 0)));
-        _this3.offsetBars[seriesIndex][i] = Number(d[x] - ((_d$XY4 = d[XY0]) !== null && _d$XY4 !== void 0 ? _d$XY4 : 0)) === 0 ? 0 : absWidth >= wMin ? 0 : d[x] > 0 ? -wMin : wMin;
-        return [offset, 0];
-      };
-      return {
-        data,
-        wMin,
-        x0: XY0,
-        y,
-        r: rBar,
-        groupKey: y,
-        offset: calcOffset,
-        maxBarSize,
-        color: getChartDefaultColorName(index),
-        patterns
-      };
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var Element = this.Element;
-      this.series = this.getSeries();
-      this.asProps.dataHintsHandler.establishDataType("grouped-values");
-      this.offsetBars = [];
-      return /* @__PURE__ */ React.createElement(Element, {
-        "aria-hidden": true,
-        render: "g",
-        series: this.series
-      });
+        if (/* @__PURE__ */ React.isValidElement(child) && child.type === StackBar.HorizontalBar && !child.props.hide) {
+          acc.push(child.props.x);
+        }
+        return acc;
+      }, []);
+      stack2.keys(keys);
     }
-  }]);
-})(Component);
+    return stack2(data);
+  }
+  getBarProps({
+    y,
+    hMin = MIN_HEIGHT
+  }, index) {
+    const {
+      x,
+      r,
+      scale,
+      maxBarSize,
+      patterns
+    } = this.asProps;
+    const [, yScale] = scale;
+    const seriesIndex = this.series.findIndex((s) => s.key === y);
+    const series = this.series[seriesIndex] || [];
+    const rBar = series.map((_s, i) => this.series.slice(seriesIndex + 1).some((bar) => bar[i][0] !== bar[i][1]) ? 0 : r);
+    this.offsetBars[seriesIndex] = this.offsetBars[seriesIndex] ?? [];
+    const data = series.map((s) => ({
+      ...s.data,
+      [y]: s[1],
+      [XY0]: s[0]
+    }));
+    const calcOffset = (i) => {
+      const offset = this.offsetBars.reduce((offset2, offsetBar) => offset2 - (offsetBar[i] ?? 0), 0);
+      const d = data[i];
+      const absHeight = Math.abs(yScale(d[y]) - Math.min(yScale(yScale.domain()[0]), yScale(d[XY0] ?? 0)));
+      const isEmptyValue = Number(d[y] - (d[XY0] ?? 0)) === 0;
+      if (isEmptyValue || absHeight >= hMin) {
+        this.offsetBars[seriesIndex][i] = 0;
+      } else {
+        const offsetValue = hMin - absHeight;
+        this.offsetBars[seriesIndex][i] = d[y] > 0 ? offsetValue : -offsetValue;
+      }
+      return [0, offset];
+    };
+    return {
+      data,
+      hMin,
+      y0: XY0,
+      x,
+      r: rBar,
+      groupKey: x,
+      offset: calcOffset,
+      maxBarSize,
+      color: getChartDefaultColorName(index),
+      patterns
+    };
+  }
+  getHorizontalBarProps({
+    x,
+    wMin = MIN_WIDTH
+  }, index) {
+    const {
+      y,
+      r,
+      scale,
+      maxBarSize,
+      patterns
+    } = this.asProps;
+    const [xScale] = scale;
+    const seriesIndex = this.series.findIndex((s) => s.key === x);
+    const series = this.series[seriesIndex];
+    this.offsetBars[seriesIndex] = this.offsetBars[seriesIndex] ?? [];
+    const data = series.map((s) => ({
+      ...s.data,
+      [x]: s[1],
+      [XY0]: s[0]
+    }));
+    const calcOffset = (i) => {
+      const offset = this.offsetBars.reduce((offset2, offsetBar) => offset2 - (offsetBar[i] ?? 0), 0);
+      const d = data[i];
+      const absWidth = Math.abs(xScale(d[x]) - Math.max(xScale(xScale.domain()[0]), xScale(d[XY0] ?? 0)));
+      this.offsetBars[seriesIndex][i] = Number(d[x] - (d[XY0] ?? 0)) === 0 ? 0 : absWidth >= wMin ? 0 : d[x] > 0 ? -wMin : wMin;
+      return [offset, 0];
+    };
+    return {
+      data,
+      wMin,
+      x0: XY0,
+      y,
+      r: 0,
+      groupKey: y,
+      offset: calcOffset,
+      maxBarSize,
+      color: getChartDefaultColorName(index),
+      patterns
+    };
+  }
+  render() {
+    const Element = this.Element;
+    this.series = this.getSeries();
+    this.asProps.dataHintsHandler.establishDataType("grouped-values");
+    this.offsetBars = [];
+    return /* @__PURE__ */ React.createElement(Element, {
+      "aria-hidden": true,
+      render: "g",
+      series: this.series
+    });
+  }
+}
 _defineProperty(StackBarRoot, "displayName", "StackBar");
-_defineProperty(StackBarRoot, "defaultProps", function() {
-  var stack$1 = stack();
+_defineProperty(StackBarRoot, "defaultProps", () => {
+  const stack$1 = stack();
   stack$1[DEFAULT_INSTANCE] = true;
   return {
     stack: stack$1,
     r: 2
   };
 });
-var StackBar = createElement(StackBarRoot, {
+const StackBar = createElement(StackBarRoot, {
   Bar,
   HorizontalBar
 });