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

package/lib/esm/component/Chart/VennChart.mjs

@@ -1,7 +1,3 @@
-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 { createComponent } from "@semcore/core";
 import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
@@ -11,118 +7,109 @@ import React from "react";
 import Venn from "../../Venn.mjs";
 import { AbstractChart } from "./AbstractChart.mjs";
 import { localizedMessages } from "../../translations/__intergalactic-dynamic-locales.mjs";
-var VennChartComponent = /* @__PURE__ */ (function(_AbstractChart) {
-  function VennChartComponent2() {
-    _classCallCheck(this, VennChartComponent2);
-    return _callSuper(this, VennChartComponent2, arguments);
+class VennChartComponent extends AbstractChart {
+  get xScale() {
+    const {
+      xScale
+    } = this.asProps;
+    if (xScale) {
+      return xScale;
+    }
+    return scaleLinear();
   }
-  _inherits(VennChartComponent2, _AbstractChart);
-  return _createClass(VennChartComponent2, [{
-    key: "xScale",
-    get: function get() {
-      var xScale = this.asProps.xScale;
-      if (xScale) {
-        return xScale;
-      }
-      return scaleLinear();
+  get yScale() {
+    const {
+      yScale
+    } = this.asProps;
+    if (yScale) {
+      return yScale;
     }
-  }, {
-    key: "yScale",
-    get: function get() {
-      var yScale = this.asProps.yScale;
-      if (yScale) {
-        return yScale;
+    return scaleLinear();
+  }
+  get dataKeys() {
+    const {
+      data
+    } = this.props;
+    const legendKeys = Object.keys(data).filter((item) => {
+      const isIntersection = /\//.test(item);
+      return !isIntersection;
+    });
+    return legendKeys;
+  }
+  defaultLegendProps() {
+    return {
+      legendType: "Table"
+    };
+  }
+  renderChart() {
+    const {
+      data,
+      onClickVennItem
+    } = this.asProps;
+    const {
+      dataDefinitions,
+      highlightedLine
+    } = this.state;
+    const checkedLegendItems = dataDefinitions.filter((item) => item.checked);
+    const checkedLegendItemsMap = checkedLegendItems.reduce((result, item) => {
+      result[item.id] = item;
+      return result;
+    }, {});
+    const intersections = Object.keys(data).reduce((result, dataKey) => {
+      const isIntersection = /\//.test(dataKey);
+      if (isIntersection) {
+        result.push(dataKey);
       }
-      return scaleLinear();
-    }
-  }, {
-    key: "dataKeys",
-    get: function get() {
-      var data = this.props.data;
-      var legendKeys = Object.keys(data).filter(function(item) {
-        var isIntersection = /\//.test(item);
-        return !isIntersection;
-      });
-      return legendKeys;
-    }
-  }, {
-    key: "defaultLegendProps",
-    value: function defaultLegendProps() {
-      return {
-        legendType: "Table"
-      };
-    }
-  }, {
-    key: "renderChart",
-    value: function renderChart() {
-      var _this$asProps = this.asProps, data = _this$asProps.data, onClickVennItem = _this$asProps.onClickVennItem;
-      var _this$state = this.state, dataDefinitions = _this$state.dataDefinitions, highlightedLine = _this$state.highlightedLine;
-      var checkedLegendItems = dataDefinitions.filter(function(item) {
-        return item.checked;
+      return result;
+    }, []);
+    return /* @__PURE__ */ React.createElement(Venn, {
+      onClick: onClickVennItem
+    }, checkedLegendItems.map((item, index) => {
+      return /* @__PURE__ */ React.createElement(Venn.Circle, {
+        key: item.id,
+        dataKey: item.id,
+        name: item.label,
+        color: item.color,
+        transparent: highlightedLine !== -1 && highlightedLine !== index
       });
-      var checkedLegendItemsMap = checkedLegendItems.reduce(function(result, item) {
-        result[item.id] = item;
-        return result;
-      }, {});
-      var intersections = Object.keys(data).reduce(function(result, dataKey) {
-        var isIntersection = /\//.test(dataKey);
-        if (isIntersection) {
-          result.push(dataKey);
-        }
-        return result;
-      }, []);
-      return /* @__PURE__ */ React.createElement(Venn, {
-        onClick: onClickVennItem
-      }, checkedLegendItems.map(function(item, index) {
-        return /* @__PURE__ */ React.createElement(Venn.Circle, {
-          key: item.id,
-          dataKey: item.id,
-          name: item.label,
-          color: item.color,
-          transparent: highlightedLine !== -1 && highlightedLine !== index
-        });
-      }), intersections.map(function(intersectionKey) {
-        var intersectionKeys = intersectionKey.split("/");
-        var hasDisabledItems = intersectionKeys.some(function(key) {
-          return checkedLegendItemsMap[key] === void 0;
-        });
-        if (hasDisabledItems) {
-          return null;
-        }
-        var name = intersectionKeys.map(function(id) {
-          var _dataDefinitions$find;
-          return ((_dataDefinitions$find = dataDefinitions.find(function(legendItem) {
-            return legendItem.id === id;
-          })) === null || _dataDefinitions$find === void 0 ? void 0 : _dataDefinitions$find.label) || "";
-        }).join(" & ");
-        return /* @__PURE__ */ React.createElement(Venn.Intersection, {
-          key: intersectionKey,
-          dataKey: intersectionKey,
-          name
-        });
-      }));
-    }
-  }, {
-    key: "renderTooltip",
-    value: function renderTooltip() {
-      return /* @__PURE__ */ React.createElement(Venn.Tooltip, null, function(_ref) {
-        var name = _ref.name, dataKey = _ref.dataKey, data = _ref.data;
-        return {
-          children: /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Venn.Tooltip.Title, null, name), /* @__PURE__ */ React.createElement(Text, {
-            bold: true
-          }, data[dataKey]))
-        };
+    }), intersections.map((intersectionKey) => {
+      const intersectionKeys = intersectionKey.split("/");
+      const hasDisabledItems = intersectionKeys.some((key) => {
+        return checkedLegendItemsMap[key] === void 0;
       });
-    }
-  }, {
-    key: "getLegendAriaLabel",
-    value: function getLegendAriaLabel() {
-      return this.asProps.getI18nText("legendForChart", {
-        chartType: "Venn"
+      if (hasDisabledItems) {
+        return null;
+      }
+      const name = intersectionKeys.map((id) => {
+        var _a;
+        return ((_a = dataDefinitions.find((legendItem) => legendItem.id === id)) == null ? void 0 : _a.label) || "";
+      }).join(" & ");
+      return /* @__PURE__ */ React.createElement(Venn.Intersection, {
+        key: intersectionKey,
+        dataKey: intersectionKey,
+        name
       });
-    }
-  }]);
-})(AbstractChart);
+    }));
+  }
+  renderTooltip() {
+    return /* @__PURE__ */ React.createElement(Venn.Tooltip, null, ({
+      name,
+      dataKey,
+      data
+    }) => {
+      return {
+        children: /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Venn.Tooltip.Title, null, name), /* @__PURE__ */ React.createElement(Text, {
+          bold: true
+        }, data[dataKey]))
+      };
+    });
+  }
+  getLegendAriaLabel() {
+    return this.asProps.getI18nText("legendForChart", {
+      chartType: "Venn"
+    });
+  }
+}
 _defineProperty(VennChartComponent, "displayName", "Chart.Venn");
 _defineProperty(VennChartComponent, "defaultProps", {
   direction: "row-reverse",
@@ -131,7 +118,7 @@ _defineProperty(VennChartComponent, "defaultProps", {
   marginX: 0
 });
 _defineProperty(VennChartComponent, "enhance", [i18nEnhance(localizedMessages)]);
-var VennChart = createComponent(VennChartComponent);
+const VennChart = createComponent(VennChartComponent);
 export {
   VennChart
 };

package/lib/esm/component/ChartLegend/BaseLegend.mjs

@@ -1,114 +1,92 @@
-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 _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import { Component } from "@semcore/core";
 import { makeDataHintsHandlers } from "../../a11y/hints.mjs";
-var BaseLegend = /* @__PURE__ */ (function(_Component) {
-  function BaseLegend2() {
-    var _this;
-    _classCallCheck(this, BaseLegend2);
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    _this = _callSuper(this, BaseLegend2, [].concat(args));
-    _defineProperty(_this, "onChangeLegendItem", function(shape) {
-      return function(id, checked) {
-        var _this$props$onChangeV, _this$props;
-        if (shape !== "Checkbox") return;
-        (_this$props$onChangeV = (_this$props = _this.props).onChangeVisibleItem) === null || _this$props$onChangeV === void 0 || _this$props$onChangeV.call(_this$props, id, checked);
-        if (checked) {
-          var _this$props$onMouseEn, _this$props2;
-          (_this$props$onMouseEn = (_this$props2 = _this.props).onMouseEnterItem) === null || _this$props$onMouseEn === void 0 || _this$props$onMouseEn.call(_this$props2, id);
-        } else {
-          var _this$props$onMouseLe, _this$props3;
-          (_this$props$onMouseLe = (_this$props3 = _this.props).onMouseLeaveItem) === null || _this$props$onMouseLe === void 0 || _this$props$onMouseLe.call(_this$props3, id);
-        }
-      };
+class BaseLegend extends Component {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "onChangeLegendItem", (shape) => (id, checked) => {
+      var _a, _b, _c, _d, _e, _f;
+      if (shape !== "Checkbox") return;
+      (_b = (_a = this.props).onChangeVisibleItem) == null ? void 0 : _b.call(_a, id, checked);
+      if (checked) {
+        (_d = (_c = this.props).onMouseEnterItem) == null ? void 0 : _d.call(_c, id);
+      } else {
+        (_f = (_e = this.props).onMouseLeaveItem) == null ? void 0 : _f.call(_e, id);
+      }
     });
-    _defineProperty(_this, "onFocusLegendItem", function(checked) {
-      return function(id) {
-        var _this$props$onMouseEn2, _this$props5;
-        if (!checked) {
-          var _this$props$onMouseLe2, _this$props4;
-          return (_this$props$onMouseLe2 = (_this$props4 = _this.props).onMouseLeaveItem) === null || _this$props$onMouseLe2 === void 0 ? void 0 : _this$props$onMouseLe2.call(_this$props4, id);
-        }
-        (_this$props$onMouseEn2 = (_this$props5 = _this.props).onMouseEnterItem) === null || _this$props$onMouseEn2 === void 0 || _this$props$onMouseEn2.call(_this$props5, id);
-      };
+    _defineProperty(this, "onFocusLegendItem", (checked) => (id) => {
+      var _a, _b, _c, _d;
+      if (!checked) {
+        return (_b = (_a = this.props).onMouseLeaveItem) == null ? void 0 : _b.call(_a, id);
+      }
+      (_d = (_c = this.props).onMouseEnterItem) == null ? void 0 : _d.call(_c, id);
     });
-    _defineProperty(_this, "onBlurLegendItem", function(id) {
-      var _this$props$onMouseLe3, _this$props6;
-      (_this$props$onMouseLe3 = (_this$props6 = _this.props).onMouseLeaveItem) === null || _this$props$onMouseLe3 === void 0 || _this$props$onMouseLe3.call(_this$props6, id);
+    _defineProperty(this, "onBlurLegendItem", (id) => {
+      var _a, _b;
+      (_b = (_a = this.props).onMouseLeaveItem) == null ? void 0 : _b.call(_a, id);
     });
-    _defineProperty(_this, "bindOnMouseEnterItem", function(id) {
-      return function(e) {
-        var _this$props$onMouseEn3, _this$props7;
-        (_this$props$onMouseEn3 = (_this$props7 = _this.props).onMouseEnterItem) === null || _this$props$onMouseEn3 === void 0 || _this$props$onMouseEn3.call(_this$props7, id, e);
+    _defineProperty(this, "bindOnMouseEnterItem", (id) => {
+      return (e) => {
+        var _a, _b;
+        (_b = (_a = this.props).onMouseEnterItem) == null ? void 0 : _b.call(_a, id, e);
       };
     });
-    _defineProperty(_this, "bindOnMouseLeaveItem", function(id) {
-      return function(e) {
-        var _this$props$onMouseLe4, _this$props8;
-        (_this$props$onMouseLe4 = (_this$props8 = _this.props).onMouseLeaveItem) === null || _this$props$onMouseLe4 === void 0 || _this$props$onMouseLe4.call(_this$props8, id, e);
+    _defineProperty(this, "bindOnMouseLeaveItem", (id) => {
+      return (e) => {
+        var _a, _b;
+        (_b = (_a = this.props).onMouseLeaveItem) == null ? void 0 : _b.call(_a, id, e);
       };
     });
-    return _this;
   }
-  _inherits(BaseLegend2, _Component);
-  return _createClass(BaseLegend2, [{
-    key: "componentDidMount",
-    value: function componentDidMount() {
+  componentDidMount() {
+    this.setHints();
+  }
+  componentDidUpdate(prevProps) {
+    if (prevProps.items !== this.props.items || prevProps.dataHints !== this.props.dataHints) {
       this.setHints();
     }
-  }, {
-    key: "componentDidUpdate",
-    value: function componentDidUpdate(prevProps) {
-      if (prevProps.items !== this.props.items || prevProps.dataHints !== this.props.dataHints) {
-        this.setHints();
-      }
-    }
-  }, {
-    key: "setHints",
-    value: function setHints() {
-      var _this$asProps = this.asProps, items = _this$asProps.items, dataHints = _this$asProps.dataHints;
-      var dataHintsHandler = dataHints ? makeDataHintsHandlers(dataHints) : void 0;
-      items.forEach(function(legendItem) {
-        dataHintsHandler === null || dataHintsHandler === void 0 || dataHintsHandler.labelKey("value", legendItem.id, legendItem.label);
-      });
-    }
-  }, {
-    key: "getItem",
-    value: function getItem(index) {
-      var line = this.asProps.items[index];
-      if (line === void 0) {
-        throw new Error('No index "'.concat(index, '" in lines'));
-      }
-      return line;
-    }
-  }, {
-    key: "getLegendItemProps",
-    value: function getLegendItemProps(_, index) {
-      var _this$asProps2 = this.asProps, _this$asProps2$shape = _this$asProps2.shape, shape = _this$asProps2$shape === void 0 ? "Checkbox" : _this$asProps2$shape, _this$asProps2$size = _this$asProps2.size, size = _this$asProps2$size === void 0 ? "m" : _this$asProps2$size, patterns = _this$asProps2.patterns;
-      var line = this.getItem(index);
-      return _objectSpread(_objectSpread({}, line), {}, {
-        shape,
-        size,
-        onFocusLegendItem: this.onFocusLegendItem(line.checked),
-        onBlurLegendItem: this.onBlurLegendItem,
-        onChangeLegendItem: this.onChangeLegendItem(shape),
-        onMouseEnter: line.checked ? this.bindOnMouseEnterItem(line.id) : void 0,
-        onMouseLeave: this.bindOnMouseLeaveItem(line.id),
-        style: {
-          gridRowStart: "".concat(index + 1),
-          gridRowEnd: "".concat(index + 2)
-        },
-        patterns
-      });
+  }
+  setHints() {
+    const {
+      items,
+      dataHints
+    } = this.asProps;
+    const dataHintsHandler = dataHints ? makeDataHintsHandlers(dataHints) : void 0;
+    items.forEach((legendItem) => {
+      dataHintsHandler == null ? void 0 : dataHintsHandler.labelKey("value", legendItem.id, legendItem.label);
+    });
+  }
+  getItem(index) {
+    const line = this.asProps.items[index];
+    if (line === void 0) {
+      throw new Error(`No index "${index}" in lines`);
     }
-  }]);
-})(Component);
+    return line;
+  }
+  getLegendItemProps(_, index) {
+    const {
+      shape = "Checkbox",
+      size = "m",
+      patterns
+    } = this.asProps;
+    const line = this.getItem(index);
+    return {
+      ...line,
+      shape,
+      size,
+      onFocusLegendItem: this.onFocusLegendItem(line.checked),
+      onBlurLegendItem: this.onBlurLegendItem,
+      onChangeLegendItem: this.onChangeLegendItem(shape),
+      onMouseEnter: line.checked ? this.bindOnMouseEnterItem(line.id) : void 0,
+      onMouseLeave: this.bindOnMouseLeaveItem(line.id),
+      style: {
+        gridRowStart: `${index + 1}`,
+        gridRowEnd: `${index + 2}`
+      },
+      patterns
+    };
+  }
+}
 export {
   BaseLegend
 };

package/lib/esm/component/ChartLegend/LegendFlex/LegendFlex.mjs

@@ -1,81 +1,80 @@
-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 _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import { createComponent, sstyled, assignProps } from "@semcore/core";
+import { Flex } from "@semcore/base-components";
 import Checkbox from "@semcore/checkbox";
 import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
 import Divider from "@semcore/divider";
-import { Flex } from "@semcore/flex-box";
 import React from "react";
 import { localizedMessages } from "../../../translations/__intergalactic-dynamic-locales.mjs";
 import { BaseLegend } from "../BaseLegend.mjs";
 import { LegendItemComponent } from "../LegendItem/LegendItem.mjs";
 /*!__reshadow-styles__:"./legend-flex.shadow.css"*/
-var style = (
+const style = (
   /*__reshadow_css_start__*/
   (sstyled.insert(
     /*__inner_css_start__*/
-    ".___SLegendFlex_qzq5k_gg_._direction_row_qzq5k_gg_{align-items:flex-start;align-content:flex-start;flex-wrap:wrap;gap:8px 16px}.___SLegendFlex_qzq5k_gg_._direction_column_qzq5k_gg_{align-items:flex-start;flex-wrap:wrap;gap:8px}",
+    ".___SLegendFlex_ftcim_gg_._direction_row_ftcim_gg_{align-items:flex-start;align-content:flex-start;flex-wrap:wrap;gap:8px 16px}.___SLegendFlex_ftcim_gg_._direction_column_ftcim_gg_{align-items:flex-start;flex-wrap:wrap;gap:8px}",
     /*__inner_css_end__*/
-    "qzq5k_gg_"
+    "ftcim_gg_"
   ), /*__reshadow_css_end__*/
   {
-    "__SLegendFlex": "___SLegendFlex_qzq5k_gg_",
-    "_direction_row": "_direction_row_qzq5k_gg_",
-    "_direction_column": "_direction_column_qzq5k_gg_"
+    "__SLegendFlex": "___SLegendFlex_ftcim_gg_",
+    "_direction_row": "_direction_row_ftcim_gg_",
+    "_direction_column": "_direction_column_ftcim_gg_"
   })
 );
-var LegendFlexRoot = /* @__PURE__ */ (function(_BaseLegend) {
-  function LegendFlexRoot2() {
-    _classCallCheck(this, LegendFlexRoot2);
-    return _callSuper(this, LegendFlexRoot2, arguments);
+class LegendFlexRoot extends BaseLegend {
+  renderTrend() {
+    const {
+      onTrendIsVisibleChange,
+      trendIsVisible,
+      trendLabel,
+      size,
+      getI18nText
+    } = this.asProps;
+    return /* @__PURE__ */ React.createElement(Checkbox, {
+      checked: trendIsVisible,
+      onChange: onTrendIsVisibleChange,
+      theme: "gray-400",
+      label: trendLabel ?? getI18nText("trend"),
+      size
+    });
   }
-  _inherits(LegendFlexRoot2, _BaseLegend);
-  return _createClass(LegendFlexRoot2, [{
-    key: "renderTrend",
-    value: function renderTrend() {
-      var _ref3 = this.asProps, onTrendIsVisibleChange = _ref3.onTrendIsVisibleChange, trendIsVisible = _ref3.trendIsVisible, trendLabel = _ref3.trendLabel, size = _ref3.size, getI18nText = _ref3.getI18nText;
-      return /* @__PURE__ */ React.createElement(Checkbox, {
-        checked: trendIsVisible,
-        onChange: onTrendIsVisibleChange,
-        theme: "gray-400",
-        label: trendLabel !== null && trendLabel !== void 0 ? trendLabel : getI18nText("trend"),
-        size
-      });
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _ref = this.asProps, _ref2;
-      var SLegendFlex = Flex;
-      var _this$asProps = this.asProps, styles = _this$asProps.styles, Children = _this$asProps.Children, direction = _this$asProps.direction, withTrend = _this$asProps.withTrend, suffix = _this$asProps.suffix, items = _this$asProps.items;
-      var orientation = direction === "row" ? "vertical" : "horizontal";
-      return _ref2 = sstyled(styles), /* @__PURE__ */ React.createElement(SLegendFlex, _ref2.cn("SLegendFlex", _objectSpread({}, assignProps({
+  render() {
+    var _ref = this.asProps, _ref2;
+    const SLegendFlex = Flex;
+    const {
+      styles,
+      Children,
+      direction,
+      withTrend,
+      suffix,
+      items
+    } = this.asProps;
+    const orientation = direction === "row" ? "vertical" : "horizontal";
+    return _ref2 = sstyled(styles), /* @__PURE__ */ React.createElement(SLegendFlex, _ref2.cn("SLegendFlex", {
+      ...assignProps({
         "role": "group"
-      }, _ref))), items.map(function(_ref4) {
-        var id = _ref4.id;
-        return /* @__PURE__ */ React.createElement(Children, {
-          key: id
-        });
-      }), (withTrend || suffix) && /* @__PURE__ */ React.createElement(Divider, _ref2.cn("Divider", {
-        "orientation": orientation
-      })), withTrend && this.renderTrend(), suffix ? suffix : null);
-    }
-  }]);
-})(BaseLegend);
+      }, _ref)
+    }), items.map(({
+      id
+    }) => {
+      return /* @__PURE__ */ React.createElement(Children, {
+        key: id
+      });
+    }), (withTrend || suffix) && /* @__PURE__ */ React.createElement(Divider, _ref2.cn("Divider", {
+      "orientation": orientation
+    })), withTrend && this.renderTrend(), suffix ? suffix : null);
+  }
+}
 _defineProperty(LegendFlexRoot, "displayName", "LegendFlex");
 _defineProperty(LegendFlexRoot, "style", style);
 _defineProperty(LegendFlexRoot, "enhance", [i18nEnhance(localizedMessages)]);
-_defineProperty(LegendFlexRoot, "defaultProps", function() {
-  return {
-    direction: "row",
-    children: /* @__PURE__ */ React.createElement(LegendFlex.LegendItem, null)
-  };
-});
-var LegendFlex = createComponent(LegendFlexRoot, {
+_defineProperty(LegendFlexRoot, "defaultProps", () => ({
+  direction: "row",
+  children: /* @__PURE__ */ React.createElement(LegendFlex.LegendItem, null)
+}));
+const LegendFlex = createComponent(LegendFlexRoot, {
   LegendItem: LegendItemComponent
 });
 export {