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

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

@@ -1,165 +1,174 @@
-import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-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, Component } from "@semcore/core";
+import { createComponent, Component, sstyled, assignProps } from "@semcore/core";
+import { Flex, Box } from "@semcore/base-components";
 import Checkbox from "@semcore/checkbox";
 import resolveColorEnhance from "@semcore/core/lib/utils/enhances/resolveColorEnhance";
 import uniqueIDEnhancement from "@semcore/core/lib/utils/uniqueID";
-import { Flex, Box } from "@semcore/flex-box";
 import { Text } from "@semcore/typography";
 import React from "react";
 import { StaticShapes } from "./LegendItem.type.mjs";
 import { PatternSymbol } from "../../../Pattern.mjs";
 import { getChartDefaultColorName } from "../../../utils.mjs";
-var _excluded = ["id", "checked", "color", "onChangeLegendItem", "shape"];
 /*!__reshadow-styles__:"./legend-item.shadow.css"*/
-var style = (
+const style = (
   /*__reshadow_css_start__*/
   (sstyled.insert(
     /*__inner_css_start__*/
-    '.___SLegendItem_g4xlu_gg_{min-width:0;align-items:flex-start}@media (hover:hover){.___SLegendItem_g4xlu_gg_:hover{cursor:pointer}.___SLegendItem_g4xlu_gg_.__disabled_g4xlu_gg_:hover{cursor:default}}.___SPointShape_g4xlu_gg_.__color_g4xlu_gg_{background-color:var(--color_g4xlu);margin-right:8px;flex-shrink:0}.___SPointShape_g4xlu_gg_._shape_Circle_g4xlu_gg_._size_l_g4xlu_gg_{width:16px;height:16px;border-radius:8px;margin-top:4px}.___SPointShape_g4xlu_gg_._shape_Circle_g4xlu_gg_._size_m_g4xlu_gg_{width:12px;height:12px;border-radius:6px;margin-top:4px}.___SPointShape_g4xlu_gg_._shape_Line_g4xlu_gg_._size_l_g4xlu_gg_{width:16px;height:4px;border-radius:3px;margin-top:9px}.___SPointShape_g4xlu_gg_._shape_Line_g4xlu_gg_._size_m_g4xlu_gg_{width:12px;height:4px;border-radius:3px;margin-top:8px}.___SPointShape_g4xlu_gg_._shape_Square_g4xlu_gg_._size_l_g4xlu_gg_{width:16px;height:16px;border-radius:2px;margin-top:4px}.___SPointShape_g4xlu_gg_._shape_Square_g4xlu_gg_._size_m_g4xlu_gg_{width:12px;height:12px;border-radius:2px;margin-top:4px}.___SPointShape_g4xlu_gg_._shape_Pattern_g4xlu_gg_{background-color:transparent;margin-right:4px}.___SIcon_g4xlu_gg_{line-height:0;margin-right:4px}.___SIcon_g4xlu_gg_._size_l_g4xlu_gg_{margin-top:4px}.___SIcon_g4xlu_gg_._size_m_g4xlu_gg_{margin-top:2px}.___SLabel_g4xlu_gg_{min-width:0}.___SAdditionalLabel_g4xlu_gg_._size_l_g4xlu_gg_,.___SCount_g4xlu_gg_._size_l_g4xlu_gg_,.___SLabel_g4xlu_gg_._size_l_g4xlu_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}.___SAdditionalLabel_g4xlu_gg_._size_m_g4xlu_gg_,.___SCount_g4xlu_gg_._size_m_g4xlu_gg_,.___SLabel_g4xlu_gg_._size_m_g4xlu_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%)}.___SAdditionalLabel_g4xlu_gg_,.___SCount_g4xlu_gg_{margin-left:4px}.___SAdditionalLabel_g4xlu_gg_{white-space:nowrap;display:flex;align-items:flex-start}.___SAdditionalLabel_g4xlu_gg_::before{content:"";display:inline-block;background-color:var(--intergalactic-text-secondary, #6c6e79);height:4px;width:4px;border-radius:2px;margin-right:4px}.___SAdditionalLabel_g4xlu_gg_._size_l_g4xlu_gg_::before{margin-top:10px}.___SAdditionalLabel_g4xlu_gg_._size_m_g4xlu_gg_::before{margin-top:8px}.___SPatternSymbol_g4xlu_gg_{transform:scale(.8)}',
+    '.___SLegendItem_30ip2_gg_{min-width:0;align-items:flex-start}@media (hover:hover){.___SLegendItem_30ip2_gg_:hover{cursor:pointer}.___SLegendItem_30ip2_gg_.__disabled_30ip2_gg_:hover{cursor:default}}.___SPointShape_30ip2_gg_.__color_30ip2_gg_{background-color:var(--color_30ip2);margin-right:8px;flex-shrink:0}.___SPointShape_30ip2_gg_._shape_Circle_30ip2_gg_._size_l_30ip2_gg_{width:16px;height:16px;border-radius:8px;margin-top:4px}.___SPointShape_30ip2_gg_._shape_Circle_30ip2_gg_._size_m_30ip2_gg_{width:12px;height:12px;border-radius:6px;margin-top:4px}.___SPointShape_30ip2_gg_._shape_Line_30ip2_gg_._size_l_30ip2_gg_{width:16px;height:4px;border-radius:3px;margin-top:9px}.___SPointShape_30ip2_gg_._shape_Line_30ip2_gg_._size_m_30ip2_gg_{width:12px;height:4px;border-radius:3px;margin-top:8px}.___SPointShape_30ip2_gg_._shape_Square_30ip2_gg_._size_l_30ip2_gg_{width:16px;height:16px;border-radius:2px;margin-top:4px}.___SPointShape_30ip2_gg_._shape_Square_30ip2_gg_._size_m_30ip2_gg_{width:12px;height:12px;border-radius:2px;margin-top:4px}.___SPointShape_30ip2_gg_._shape_Pattern_30ip2_gg_{background-color:transparent;margin-right:4px}.___SIcon_30ip2_gg_{line-height:0;margin-right:4px}.___SIcon_30ip2_gg_._size_l_30ip2_gg_{margin-top:4px}.___SIcon_30ip2_gg_._size_m_30ip2_gg_{margin-top:2px}.___SLabel_30ip2_gg_{min-width:0}.___SAdditionalLabel_30ip2_gg_._size_l_30ip2_gg_,.___SCount_30ip2_gg_._size_l_30ip2_gg_,.___SLabel_30ip2_gg_._size_l_30ip2_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}.___SAdditionalLabel_30ip2_gg_._size_m_30ip2_gg_,.___SCount_30ip2_gg_._size_m_30ip2_gg_,.___SLabel_30ip2_gg_._size_m_30ip2_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%)}.___SAdditionalLabel_30ip2_gg_,.___SCount_30ip2_gg_{margin-left:4px}.___SAdditionalLabel_30ip2_gg_{white-space:nowrap;display:flex;align-items:flex-start}.___SAdditionalLabel_30ip2_gg_::before{content:"";display:inline-block;background-color:var(--intergalactic-text-secondary, #6c6e79);height:4px;width:4px;border-radius:2px;margin-right:4px}.___SAdditionalLabel_30ip2_gg_._size_l_30ip2_gg_::before{margin-top:10px}.___SAdditionalLabel_30ip2_gg_._size_m_30ip2_gg_::before{margin-top:8px}.___SPatternSymbol_30ip2_gg_{transform:scale(.8)}',
     /*__inner_css_end__*/
-    "g4xlu_gg_"
+    "30ip2_gg_"
   ), /*__reshadow_css_end__*/
   {
-    "__SLegendItem": "___SLegendItem_g4xlu_gg_",
-    "_disabled": "__disabled_g4xlu_gg_",
-    "__SPointShape": "___SPointShape_g4xlu_gg_",
-    "_color": "__color_g4xlu_gg_",
-    "--color": "--color_g4xlu",
-    "_shape_Circle": "_shape_Circle_g4xlu_gg_",
-    "_size_l": "_size_l_g4xlu_gg_",
-    "_size_m": "_size_m_g4xlu_gg_",
-    "_shape_Line": "_shape_Line_g4xlu_gg_",
-    "_shape_Square": "_shape_Square_g4xlu_gg_",
-    "_shape_Pattern": "_shape_Pattern_g4xlu_gg_",
-    "__SIcon": "___SIcon_g4xlu_gg_",
-    "__SLabel": "___SLabel_g4xlu_gg_",
-    "__SAdditionalLabel": "___SAdditionalLabel_g4xlu_gg_",
-    "__SCount": "___SCount_g4xlu_gg_",
-    "__SPatternSymbol": "___SPatternSymbol_g4xlu_gg_"
+    "__SLegendItem": "___SLegendItem_30ip2_gg_",
+    "_disabled": "__disabled_30ip2_gg_",
+    "__SPointShape": "___SPointShape_30ip2_gg_",
+    "_color": "__color_30ip2_gg_",
+    "--color": "--color_30ip2",
+    "_shape_Circle": "_shape_Circle_30ip2_gg_",
+    "_size_l": "_size_l_30ip2_gg_",
+    "_size_m": "_size_m_30ip2_gg_",
+    "_shape_Line": "_shape_Line_30ip2_gg_",
+    "_shape_Square": "_shape_Square_30ip2_gg_",
+    "_shape_Pattern": "_shape_Pattern_30ip2_gg_",
+    "__SIcon": "___SIcon_30ip2_gg_",
+    "__SLabel": "___SLabel_30ip2_gg_",
+    "__SAdditionalLabel": "___SAdditionalLabel_30ip2_gg_",
+    "__SCount": "___SCount_30ip2_gg_",
+    "__SPatternSymbol": "___SPatternSymbol_30ip2_gg_"
   })
 );
-var enhance = [resolveColorEnhance(), uniqueIDEnhancement()];
-var LegendItemRoot = /* @__PURE__ */ (function(_Component) {
-  function LegendItemRoot2() {
-    _classCallCheck(this, LegendItemRoot2);
-    return _callSuper(this, LegendItemRoot2, arguments);
+const enhance = [resolveColorEnhance(), uniqueIDEnhancement()];
+class LegendItemRoot extends Component {
+  getUniqueID() {
+    const {
+      uid
+    } = this.asProps;
+    return `chart-legend-item-${uid}`;
   }
-  _inherits(LegendItemRoot2, _Component);
-  return _createClass(LegendItemRoot2, [{
-    key: "getUniqueID",
-    value: function getUniqueID() {
-      var uid = this.asProps.uid;
-      return "chart-legend-item-".concat(uid);
-    }
-  }, {
-    key: "getShapeProps",
-    value: function getShapeProps() {
-      var _this$asProps = this.asProps, checked = _this$asProps.checked, color = _this$asProps.color, shape = _this$asProps.shape, label = _this$asProps.label, id = _this$asProps.id, size = _this$asProps.size, resolveColor = _this$asProps.resolveColor, patterns = _this$asProps.patterns, onChangeLegendItem = _this$asProps.onChangeLegendItem, onFocusLegendItem = _this$asProps.onFocusLegendItem, onBlurLegendItem = _this$asProps.onBlurLegendItem;
-      return {
-        label,
-        shape,
-        checked,
-        "color": resolveColor(color),
-        "patternKey": color,
-        patterns,
-        size,
-        "onChange": function onChange(value) {
-          onChangeLegendItem(id, value);
-        },
-        "onFocus": function onFocus() {
-          return onFocusLegendItem(id);
-        },
-        "onBlur": function onBlur() {
-          return onBlurLegendItem(id);
-        },
-        "aria-labelledby": shape === "Checkbox" ? this.getUniqueID() : null
-      };
-    }
-  }, {
-    key: "getIconProps",
-    value: function getIconProps() {
-      var props = this.asProps;
-      return _objectSpread(_objectSpread({}, props), {}, {
-        children: props.icon,
-        onClick: function onClick() {
-          return props.onChangeLegendItem(props.id, !props.checked);
-        }
-      });
-    }
-  }, {
-    key: "getLabelProps",
-    value: function getLabelProps() {
-      var _this$asProps2 = this.asProps, id = _this$asProps2.id, checked = _this$asProps2.checked;
-      _this$asProps2.color;
-      var onChangeLegendItem = _this$asProps2.onChangeLegendItem;
-      _this$asProps2.shape;
-      var props = _objectWithoutProperties(_this$asProps2, _excluded);
-      return _objectSpread(_objectSpread({}, props), {}, {
-        id: this.getUniqueID(),
-        checked,
-        onClick: function onClick() {
-          return onChangeLegendItem(id, !checked);
-        },
-        children: props.label
-      });
-    }
-  }, {
-    key: "getAdditionalLabelProps",
-    value: function getAdditionalLabelProps() {
-      var props = this.asProps;
-      var additionalInfo = props.additionalInfo, onChangeLegendItem = props.onChangeLegendItem, id = props.id, checked = props.checked;
-      return _objectSpread(_objectSpread({}, props), {}, {
-        children: additionalInfo && "label" in additionalInfo ? "".concat(additionalInfo.label) : void 0,
-        onClick: function onClick() {
-          return onChangeLegendItem(id, !checked);
-        }
-      });
-    }
-  }, {
-    key: "getCountProps",
-    value: function getCountProps() {
-      var props = this.asProps;
-      var additionalInfo = props.additionalInfo, onChangeLegendItem = props.onChangeLegendItem, id = props.id, checked = props.checked;
-      return _objectSpread(_objectSpread({}, props), {}, {
-        children: additionalInfo && "count" in additionalInfo ? "(".concat(additionalInfo.count, ")") : void 0,
-        onClick: function onClick() {
-          return onChangeLegendItem(id, !checked);
-        }
-      });
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _ref = this.asProps, _ref7;
-      var SLegendItem = Flex;
-      var _this$asProps3 = this.asProps, styles = _this$asProps3.styles, Children = _this$asProps3.Children, shape = _this$asProps3.shape;
-      var disabled = StaticShapes.includes(shape) || shape === void 0;
-      return _ref7 = sstyled(styles), /* @__PURE__ */ React.createElement(SLegendItem, _ref7.cn("SLegendItem", _objectSpread({}, assignProps({
+  getShapeProps() {
+    const {
+      checked,
+      color,
+      shape,
+      label,
+      id,
+      size,
+      resolveColor,
+      patterns,
+      onChangeLegendItem,
+      onFocusLegendItem,
+      onBlurLegendItem
+    } = this.asProps;
+    return {
+      label,
+      shape,
+      checked,
+      "color": resolveColor(color),
+      "patternKey": color,
+      patterns,
+      size,
+      "onChange": (value) => {
+        onChangeLegendItem(id, value);
+      },
+      "onFocus": () => onFocusLegendItem(id),
+      "onBlur": () => onBlurLegendItem(id),
+      "aria-labelledby": shape === "Checkbox" ? this.getUniqueID() : null
+    };
+  }
+  getIconProps() {
+    const props = this.asProps;
+    return {
+      ...props,
+      children: props.icon,
+      onClick: () => props.onChangeLegendItem(props.id, !props.checked)
+    };
+  }
+  getLabelProps() {
+    const {
+      id,
+      checked,
+      color: _color,
+      onChangeLegendItem,
+      shape: _shape,
+      ...props
+    } = this.asProps;
+    return {
+      ...props,
+      id: this.getUniqueID(),
+      checked,
+      onClick: () => onChangeLegendItem(id, !checked),
+      children: props.label
+    };
+  }
+  getAdditionalLabelProps() {
+    const props = this.asProps;
+    const {
+      additionalInfo,
+      onChangeLegendItem,
+      id,
+      checked
+    } = props;
+    return {
+      ...props,
+      children: additionalInfo && "label" in additionalInfo ? `${additionalInfo.label}` : void 0,
+      onClick: () => onChangeLegendItem(id, !checked)
+    };
+  }
+  getCountProps() {
+    const props = this.asProps;
+    const {
+      additionalInfo,
+      onChangeLegendItem,
+      id,
+      checked
+    } = props;
+    return {
+      ...props,
+      children: additionalInfo && "count" in additionalInfo ? `(${additionalInfo.count})` : void 0,
+      onClick: () => onChangeLegendItem(id, !checked)
+    };
+  }
+  render() {
+    var _ref = this.asProps, _ref7;
+    const SLegendItem = Flex;
+    const {
+      styles,
+      Children,
+      shape
+    } = this.asProps;
+    const disabled = StaticShapes.includes(shape) || shape === void 0;
+    return _ref7 = sstyled(styles), /* @__PURE__ */ React.createElement(SLegendItem, _ref7.cn("SLegendItem", {
+      ...assignProps({
         "disabled": disabled,
         "__excludeProps": ["id"]
-      }, _ref))), /* @__PURE__ */ React.createElement(Children, _ref7.cn("Children", {})));
-    }
-  }]);
-})(Component);
+      }, _ref)
+    }), /* @__PURE__ */ React.createElement(Children, _ref7.cn("Children", {})));
+  }
+}
 _defineProperty(LegendItemRoot, "displayName", "LegendItem");
 _defineProperty(LegendItemRoot, "style", style);
 _defineProperty(LegendItemRoot, "enhance", enhance);
-_defineProperty(LegendItemRoot, "defaultProps", function() {
-  return {
-    children: /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(LegendItemComponent.Shape, null), /* @__PURE__ */ React.createElement(LegendItemComponent.Icon, null), /* @__PURE__ */ React.createElement(LegendItemComponent.Label, null), /* @__PURE__ */ React.createElement(LegendItemComponent.AdditionalLabel, null), /* @__PURE__ */ React.createElement(LegendItemComponent.Count, null))
-  };
-});
+_defineProperty(LegendItemRoot, "defaultProps", () => ({
+  children: /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(LegendItemComponent.Shape, null), /* @__PURE__ */ React.createElement(LegendItemComponent.Icon, null), /* @__PURE__ */ React.createElement(LegendItemComponent.Label, null), /* @__PURE__ */ React.createElement(LegendItemComponent.AdditionalLabel, null), /* @__PURE__ */ React.createElement(LegendItemComponent.Count, null))
+}));
 function Shape(props) {
   var _ref2 = arguments[0], _ref0;
-  var SPointShape = Box;
-  var SPatternSymbol = PatternSymbol;
-  var styles = props.styles, size = props.size, shape = props.shape, checked = props.checked, color = props.color, _props$patternKey = props.patternKey, patternKey = _props$patternKey === void 0 ? getChartDefaultColorName(0) : _props$patternKey, Children = props.Children, hasChildren = props.children, patterns = props.patterns, onChange = props.onChange, onFocus = props.onFocus, onBlur = props.onBlur;
+  const SPointShape = Box;
+  const SPatternSymbol = PatternSymbol;
+  const {
+    styles,
+    size,
+    shape,
+    checked,
+    color,
+    patternKey = getChartDefaultColorName(0),
+    Children,
+    children: hasChildren,
+    patterns,
+    onChange,
+    onFocus,
+    onBlur
+  } = props;
   if (hasChildren) {
     return /* @__PURE__ */ React.createElement(Children, null);
   }
@@ -186,66 +195,86 @@ function Shape(props) {
     })), patterns && /* @__PURE__ */ React.createElement(Box, _ref9.cn("Box", {
       "mt": "2px",
       "mr": 1,
-      "onClick": function onClick() {
-        return onChange(!checked);
-      }
+      "onClick": () => onChange(!checked)
     }), /* @__PURE__ */ React.createElement(SPatternSymbol, _ref9.cn("SPatternSymbol", {
       "color": color,
       "patternKey": patternKey,
       "aria-hidden": true
     }))));
   }
-  return _ref0 = sstyled(styles), /* @__PURE__ */ React.createElement(SPointShape, _ref0.cn("SPointShape", _objectSpread({}, assignProps({}, _ref2))), /* @__PURE__ */ React.createElement(Children, _ref0.cn("Children", {})));
+  return _ref0 = sstyled(styles), /* @__PURE__ */ React.createElement(SPointShape, _ref0.cn("SPointShape", {
+    ...assignProps({}, _ref2)
+  }), /* @__PURE__ */ React.createElement(Children, _ref0.cn("Children", {})));
 }
-function Icon(_ref13) {
+function Icon({
+  styles,
+  children: hasChildren,
+  Children
+}) {
   var _ref3 = arguments[0], _ref1;
-  var styles = _ref13.styles, hasChildren = _ref13.children, Children = _ref13.Children;
-  var SIcon = Box;
+  const SIcon = Box;
   if (!hasChildren) {
     return null;
   }
-  return _ref1 = sstyled(styles), /* @__PURE__ */ React.createElement(SIcon, _ref1.cn("SIcon", _objectSpread({}, assignProps({
-    "tag": "span"
-  }, _ref3))), /* @__PURE__ */ React.createElement(Children, _ref1.cn("Children", {})));
+  return _ref1 = sstyled(styles), /* @__PURE__ */ React.createElement(SIcon, _ref1.cn("SIcon", {
+    ...assignProps({
+      "tag": "span"
+    }, _ref3)
+  }), /* @__PURE__ */ React.createElement(Children, _ref1.cn("Children", {})));
 }
 Icon.displayName = "Icon";
-function Label(_ref14) {
+function Label({
+  styles,
+  children: hasChildren,
+  Children
+}) {
   var _ref4 = arguments[0], _ref10;
-  var styles = _ref14.styles, hasChildren = _ref14.children, Children = _ref14.Children;
-  var SLabel = Text;
+  const SLabel = Text;
   if (!hasChildren) {
     return null;
   }
-  return _ref10 = sstyled(styles), /* @__PURE__ */ React.createElement(SLabel, _ref10.cn("SLabel", _objectSpread({}, assignProps({
-    "use": "primary"
-  }, _ref4))), /* @__PURE__ */ React.createElement(Children, _ref10.cn("Children", {})));
+  return _ref10 = sstyled(styles), /* @__PURE__ */ React.createElement(SLabel, _ref10.cn("SLabel", {
+    ...assignProps({
+      "use": "primary"
+    }, _ref4)
+  }), /* @__PURE__ */ React.createElement(Children, _ref10.cn("Children", {})));
 }
 Label.displayName = "Label";
-function AdditionalLabel(_ref15) {
+function AdditionalLabel({
+  styles,
+  children: hasChildren,
+  Children
+}) {
   var _ref5 = arguments[0], _ref11;
-  var styles = _ref15.styles, hasChildren = _ref15.children, Children = _ref15.Children;
-  var SAdditionalLabel = Text;
+  const SAdditionalLabel = Text;
   if (!hasChildren) {
     return null;
   }
-  return _ref11 = sstyled(styles), /* @__PURE__ */ React.createElement(SAdditionalLabel, _ref11.cn("SAdditionalLabel", _objectSpread({}, assignProps({
-    "use": "secondary"
-  }, _ref5))), /* @__PURE__ */ React.createElement(Children, _ref11.cn("Children", {})));
+  return _ref11 = sstyled(styles), /* @__PURE__ */ React.createElement(SAdditionalLabel, _ref11.cn("SAdditionalLabel", {
+    ...assignProps({
+      "use": "secondary"
+    }, _ref5)
+  }), /* @__PURE__ */ React.createElement(Children, _ref11.cn("Children", {})));
 }
 AdditionalLabel.displayName = "AdditionalLabel";
-function Count(_ref16) {
+function Count({
+  styles,
+  children: hasChildren,
+  Children
+}) {
   var _ref6 = arguments[0], _ref12;
-  var styles = _ref16.styles, hasChildren = _ref16.children, Children = _ref16.Children;
-  var SCount = Text;
+  const SCount = Text;
   if (!hasChildren) {
     return null;
   }
-  return _ref12 = sstyled(styles), /* @__PURE__ */ React.createElement(SCount, _ref12.cn("SCount", _objectSpread({}, assignProps({
-    "use": "secondary"
-  }, _ref6))), /* @__PURE__ */ React.createElement(Children, _ref12.cn("Children", {})));
+  return _ref12 = sstyled(styles), /* @__PURE__ */ React.createElement(SCount, _ref12.cn("SCount", {
+    ...assignProps({
+      "use": "secondary"
+    }, _ref6)
+  }), /* @__PURE__ */ React.createElement(Children, _ref12.cn("Children", {})));
 }
 Count.displayName = "Count";
-var LegendItemComponent = createComponent(LegendItemRoot, {
+const LegendItemComponent = createComponent(LegendItemRoot, {
   Shape,
   Icon,
   Label,

package/lib/esm/component/ChartLegend/LegendItem/LegendItem.type.mjs

@@ -1,4 +1,4 @@
-var StaticShapes = ["Circle", "Line", "Square", "Pattern"];
+const StaticShapes = ["Circle", "Line", "Square", "Pattern"];
 export {
   StaticShapes
 };

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

@@ -1,84 +1,86 @@
-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 { Box } from "@semcore/flex-box";
+import { Box } from "@semcore/base-components";
 import React from "react";
 import { BaseLegend } from "../BaseLegend.mjs";
 import { LegendItemComponent } from "../LegendItem/LegendItem.mjs";
 /*!__reshadow-styles__:"./legend-table.shadow.css"*/
-var style = (
+const style = (
   /*__reshadow_css_start__*/
   (sstyled.insert(
     /*__inner_css_start__*/
-    '.___SLegendTable_12151_gg_.__columns-count_12151_gg_{font-feature-settings:"tnum";font-variant-numeric:tabular-nums;display:grid;grid-template-columns:auto .2fr;align-items:center;height:-moz-fit-content;height:fit-content;grid-column-gap:16px;grid-row-gap:8px}.___SColumnItem_12151_gg_._size_l_12151_gg_{font-size:var(--intergalactic-fs-300, 16px);text-align:right}.___SColumnItem_12151_gg_._size_m_12151_gg_{font-size:var(--intergalactic-fs-200, 14px);text-align:right}',
+    '.___SLegendTable_1jxzo_gg_.__columns-count_1jxzo_gg_{font-feature-settings:"tnum";font-variant-numeric:tabular-nums;display:grid;grid-template-columns:auto .2fr;align-items:center;height:-moz-fit-content;height:fit-content;grid-column-gap:16px;grid-row-gap:8px}.___SColumnItem_1jxzo_gg_._size_l_1jxzo_gg_{font-size:var(--intergalactic-fs-300, 16px);text-align:right}.___SColumnItem_1jxzo_gg_._size_m_1jxzo_gg_{font-size:var(--intergalactic-fs-200, 14px);text-align:right}',
     /*__inner_css_end__*/
-    "12151_gg_"
+    "1jxzo_gg_"
   ), /*__reshadow_css_end__*/
   {
-    "__SLegendTable": "___SLegendTable_12151_gg_",
-    "_columns-count": "__columns-count_12151_gg_",
-    "__SColumnItem": "___SColumnItem_12151_gg_",
-    "_size_l": "_size_l_12151_gg_",
-    "_size_m": "_size_m_12151_gg_"
+    "__SLegendTable": "___SLegendTable_1jxzo_gg_",
+    "_columns-count": "__columns-count_1jxzo_gg_",
+    "__SColumnItem": "___SColumnItem_1jxzo_gg_",
+    "_size_l": "_size_l_1jxzo_gg_",
+    "_size_m": "_size_m_1jxzo_gg_"
   })
 );
-var LegendTableRoot = /* @__PURE__ */ (function(_BaseLegend) {
-  function LegendTableRoot2() {
-    _classCallCheck(this, LegendTableRoot2);
-    return _callSuper(this, LegendTableRoot2, arguments);
-  }
-  _inherits(LegendTableRoot2, _BaseLegend);
-  return _createClass(LegendTableRoot2, [{
-    key: "render",
-    value: function render() {
-      var _ref = this.asProps, _ref3, _items$;
-      var SLegendTable = Box;
-      var _this$asProps = this.asProps, styles = _this$asProps.styles, Children = _this$asProps.Children, _this$asProps$size = _this$asProps.size, size = _this$asProps$size === void 0 ? "m" : _this$asProps$size, items = _this$asProps.items;
-      var columnsCount = (_items$ = items[0]) === null || _items$ === void 0 ? void 0 : _items$.columns.length;
-      return _ref3 = sstyled(styles), /* @__PURE__ */ React.createElement(SLegendTable, _ref3.cn("SLegendTable", _objectSpread({}, assignProps({
+class LegendTableRoot extends BaseLegend {
+  render() {
+    var _a;
+    var _ref = this.asProps, _ref3;
+    const SLegendTable = Box;
+    const {
+      styles,
+      Children,
+      size = "m",
+      items
+    } = this.asProps;
+    const columnsCount = (_a = items[0]) == null ? void 0 : _a.columns.length;
+    return _ref3 = sstyled(styles), /* @__PURE__ */ React.createElement(SLegendTable, _ref3.cn("SLegendTable", {
+      ...assignProps({
         "columns-count": columnsCount + 1,
         "role": "group"
-      }, _ref))), items.map(function(_ref5, _index) {
-        var id = _ref5.id, _ref5$columns = _ref5.columns, columns = _ref5$columns === void 0 ? [] : _ref5$columns;
+      }, _ref)
+    }), items.map(({
+      id,
+      columns = []
+    }, _index) => {
+      return /* @__PURE__ */ React.createElement(React.Fragment, {
+        key: id
+      }, /* @__PURE__ */ React.createElement(Children, null), columns.map((item, index) => {
         return /* @__PURE__ */ React.createElement(React.Fragment, {
-          key: id
-        }, /* @__PURE__ */ React.createElement(Children, null), columns.map(function(item, index) {
-          return /* @__PURE__ */ React.createElement(React.Fragment, {
-            key: "".concat(id, "__").concat(index)
-          }, /* @__PURE__ */ React.createElement(LegendTable.Column, {
-            index,
-            size,
-            styles
-          }, item));
-        }));
+          key: `${id}__${index}`
+        }, /* @__PURE__ */ React.createElement(LegendTable.Column, {
+          index,
+          size,
+          styles
+        }, item));
       }));
-    }
-  }]);
-})(BaseLegend);
+    }));
+  }
+}
 _defineProperty(LegendTableRoot, "displayName", "LegendTable");
 _defineProperty(LegendTableRoot, "style", style);
-_defineProperty(LegendTableRoot, "defaultProps", function() {
-  return {
-    children: /* @__PURE__ */ React.createElement(LegendTable.LegendItem, null)
-  };
-});
+_defineProperty(LegendTableRoot, "defaultProps", () => ({
+  children: /* @__PURE__ */ React.createElement(LegendTable.LegendItem, null)
+}));
 function ColumnComponent(props) {
   var _ref2 = arguments[0], _ref4;
-  var SColumnItem = Box;
-  var styles = props.styles, index = props.index, size = props.size, Children = props.Children;
-  return _ref4 = sstyled(styles), /* @__PURE__ */ React.createElement(SColumnItem, _ref4.cn("SColumnItem", _objectSpread({}, assignProps({
-    "style": {
-      gridColumnStart: "".concat(index + 2),
-      gridColumnEnd: "".concat(index + 3)
-    },
-    "size": size
-  }, _ref2))), /* @__PURE__ */ React.createElement(Children, _ref4.cn("Children", {})));
+  const SColumnItem = Box;
+  const {
+    styles,
+    index,
+    size,
+    Children
+  } = props;
+  return _ref4 = sstyled(styles), /* @__PURE__ */ React.createElement(SColumnItem, _ref4.cn("SColumnItem", {
+    ...assignProps({
+      "style": {
+        gridColumnStart: `${index + 2}`,
+        gridColumnEnd: `${index + 3}`
+      },
+      "size": size
+    }, _ref2)
+  }), /* @__PURE__ */ React.createElement(Children, _ref4.cn("Children", {})));
 }
-var LegendTable = createComponent(LegendTableRoot, {
+const LegendTable = createComponent(LegendTableRoot, {
   LegendItem: LegendItemComponent,
   Column: ColumnComponent
 });