@semcore/d3-chart 3.60.0 → 3.60.1

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

@@ -0,0 +1,240 @@
+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 _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 createComponent, { sstyled as sstyled$1, assignProps, Component } from "@semcore/core";
+import React from "react";
+import { Box, Flex } from "@semcore/flex-box";
+import Checkbox from "@semcore/checkbox";
+import { Text } from "@semcore/typography";
+import { StaticShapes } from "./LegendItem.type.mjs";
+import resolveColorEnhance from "@semcore/utils/lib/enhances/resolveColorEnhance";
+import uniqueIDEnhancement from "@semcore/utils/lib/uniqueID";
+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 = (
+  /*__reshadow_css_start__*/
+  (sstyled.insert(
+    /*__inner_css_start__*/
+    '.___SLegendItem_1u2d7_gg_{min-width:0;align-items:flex-start}@media (hover:hover){.___SLegendItem_1u2d7_gg_:hover{cursor:pointer}.___SLegendItem_1u2d7_gg_.__disabled_1u2d7_gg_:hover{cursor:default}}.___SPointShape_1u2d7_gg_.__color_1u2d7_gg_{background-color:var(--color_1u2d7);margin-right:8px;flex-shrink:0}.___SPointShape_1u2d7_gg_._shape_Circle_1u2d7_gg_._size_l_1u2d7_gg_{width:16px;height:16px;border-radius:8px;margin-top:4px}.___SPointShape_1u2d7_gg_._shape_Circle_1u2d7_gg_._size_m_1u2d7_gg_{width:12px;height:12px;border-radius:6px;margin-top:4px}.___SPointShape_1u2d7_gg_._shape_Line_1u2d7_gg_._size_l_1u2d7_gg_{width:16px;height:4px;border-radius:3px;margin-top:9px}.___SPointShape_1u2d7_gg_._shape_Line_1u2d7_gg_._size_m_1u2d7_gg_{width:12px;height:4px;border-radius:3px;margin-top:8px}.___SPointShape_1u2d7_gg_._shape_Square_1u2d7_gg_._size_l_1u2d7_gg_{width:16px;height:16px;border-radius:2px;margin-top:4px}.___SPointShape_1u2d7_gg_._shape_Square_1u2d7_gg_._size_m_1u2d7_gg_{width:12px;height:12px;border-radius:2px;margin-top:4px}.___SPointShape_1u2d7_gg_._shape_Pattern_1u2d7_gg_{background-color:transparent;margin-right:4px}.___SIcon_1u2d7_gg_{line-height:0;margin-right:4px}.___SIcon_1u2d7_gg_._size_l_1u2d7_gg_{margin-top:4px}.___SIcon_1u2d7_gg_._size_m_1u2d7_gg_{margin-top:2px}.___SLabel_1u2d7_gg_{min-width:0}.___SAdditionalLabel_1u2d7_gg_._size_l_1u2d7_gg_,.___SCount_1u2d7_gg_._size_l_1u2d7_gg_,.___SLabel_1u2d7_gg_._size_l_1u2d7_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}.___SAdditionalLabel_1u2d7_gg_._size_m_1u2d7_gg_,.___SCount_1u2d7_gg_._size_m_1u2d7_gg_,.___SLabel_1u2d7_gg_._size_m_1u2d7_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%)}.___SAdditionalLabel_1u2d7_gg_,.___SCount_1u2d7_gg_{margin-left:4px}.___SAdditionalLabel_1u2d7_gg_{white-space:nowrap;display:flex;align-items:flex-start}.___SAdditionalLabel_1u2d7_gg_::before{content:"";display:inline-block;background-color:var(--intergalactic-text-secondary, #6c6e79);height:4px;width:4px;border-radius:2px;margin-right:4px}.___SAdditionalLabel_1u2d7_gg_._size_l_1u2d7_gg_::before{margin-top:10px}.___SAdditionalLabel_1u2d7_gg_._size_m_1u2d7_gg_::before{margin-top:8px}.___SPatternSymbol_1u2d7_gg_{transform:scale(.8)}',
+    /*__inner_css_end__*/
+    "1u2d7_gg_"
+  ), /*__reshadow_css_end__*/
+  {
+    "__SLegendItem": "___SLegendItem_1u2d7_gg_",
+    "_disabled": "__disabled_1u2d7_gg_",
+    "__SPointShape": "___SPointShape_1u2d7_gg_",
+    "_color": "__color_1u2d7_gg_",
+    "--color": "--color_1u2d7",
+    "_shape_Circle": "_shape_Circle_1u2d7_gg_",
+    "_size_l": "_size_l_1u2d7_gg_",
+    "_size_m": "_size_m_1u2d7_gg_",
+    "_shape_Line": "_shape_Line_1u2d7_gg_",
+    "_shape_Square": "_shape_Square_1u2d7_gg_",
+    "_shape_Pattern": "_shape_Pattern_1u2d7_gg_",
+    "__SIcon": "___SIcon_1u2d7_gg_",
+    "__SLabel": "___SLabel_1u2d7_gg_",
+    "__SAdditionalLabel": "___SAdditionalLabel_1u2d7_gg_",
+    "__SCount": "___SCount_1u2d7_gg_",
+    "__SPatternSymbol": "___SPatternSymbol_1u2d7_gg_"
+  })
+);
+var enhance = [resolveColorEnhance(), uniqueIDEnhancement()];
+var LegendItemRoot = /* @__PURE__ */ function(_Component) {
+  _inherits(LegendItemRoot2, _Component);
+  var _super = _createSuper(LegendItemRoot2);
+  function LegendItemRoot2() {
+    _classCallCheck(this, LegendItemRoot2);
+    return _super.apply(this, arguments);
+  }
+  _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;
+      return {
+        label,
+        shape,
+        checked,
+        color: resolveColor(color),
+        patternKey: color,
+        patterns,
+        size,
+        onChange: function onChange(value) {
+          onChangeLegendItem(id, value);
+        },
+        "aria-labelledby": shape === "Checkbox" ? this.getUniqueID() : null
+      };
+    }
+  }, {
+    key: "getIconProps",
+    value: function getIconProps() {
+      var props = this.asProps;
+      return _objectSpread(_objectSpread({}, props), {}, {
+        children: props.icon
+      });
+    }
+  }, {
+    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;
+      return _objectSpread(_objectSpread({}, props), {}, {
+        children: additionalInfo && "label" in additionalInfo ? "".concat(additionalInfo.label) : void 0
+      });
+    }
+  }, {
+    key: "getCountProps",
+    value: function getCountProps() {
+      var props = this.asProps;
+      var additionalInfo = props.additionalInfo;
+      return _objectSpread(_objectSpread({}, props), {}, {
+        children: additionalInfo && "count" in additionalInfo ? "(".concat(additionalInfo.count, ")") : void 0
+      });
+    }
+  }, {
+    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);
+      return _ref7 = sstyled$1(styles), /* @__PURE__ */ React.createElement(SLegendItem, _ref7.cn("SLegendItem", _objectSpread({}, assignProps({
+        "disabled": disabled,
+        "__excludeProps": ["id"]
+      }, _ref))), /* @__PURE__ */ React.createElement(Children, _ref7.cn("Children", {})));
+    }
+  }]);
+  return LegendItemRoot2;
+}(Component);
+_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))
+  };
+});
+function Shape(props) {
+  var _ref2 = arguments[0], _ref10;
+  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;
+  if (hasChildren) {
+    return /* @__PURE__ */ React.createElement(Children, null);
+  }
+  if (shape === "Pattern") {
+    var _ref8;
+    return _ref8 = sstyled$1(styles), /* @__PURE__ */ React.createElement(Box, _ref8.cn("Box", {
+      "mr": 1
+    }), /* @__PURE__ */ React.createElement(SPatternSymbol, _ref8.cn("SPatternSymbol", {
+      "color": color,
+      "patternKey": patternKey,
+      "aria-hidden": true
+    })));
+  }
+  if (shape === "Checkbox") {
+    var _ref9;
+    return _ref9 = sstyled$1(styles), /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Checkbox, _ref9.cn("Checkbox", {
+      "size": size,
+      "checked": checked,
+      "theme": checked ? color : void 0,
+      "onChange": onChange,
+      "aria-labelledby": props["aria-labelledby"]
+    })), patterns && /* @__PURE__ */ React.createElement(Box, _ref9.cn("Box", {
+      "mt": "2px",
+      "mr": 1
+    }), /* @__PURE__ */ React.createElement(SPatternSymbol, _ref9.cn("SPatternSymbol", {
+      "color": color,
+      "patternKey": patternKey,
+      "aria-hidden": true
+    }))));
+  }
+  return _ref10 = sstyled$1(styles), /* @__PURE__ */ React.createElement(SPointShape, _ref10.cn("SPointShape", _objectSpread({}, assignProps({}, _ref2))), /* @__PURE__ */ React.createElement(Children, _ref10.cn("Children", {})));
+}
+function Icon(_ref15) {
+  var _ref3 = arguments[0], _ref11;
+  var styles = _ref15.styles, hasChildren = _ref15.children, Children = _ref15.Children;
+  var SIcon = Box;
+  if (!hasChildren) {
+    return null;
+  }
+  return _ref11 = sstyled$1(styles), /* @__PURE__ */ React.createElement(SIcon, _ref11.cn("SIcon", _objectSpread({}, assignProps({
+    "tag": "span"
+  }, _ref3))), /* @__PURE__ */ React.createElement(Children, _ref11.cn("Children", {})));
+}
+Icon.displayName = "Icon";
+function Label(_ref16) {
+  var _ref4 = arguments[0], _ref12;
+  var styles = _ref16.styles, hasChildren = _ref16.children, Children = _ref16.Children;
+  var SLabel = Text;
+  if (!hasChildren) {
+    return null;
+  }
+  return _ref12 = sstyled$1(styles), /* @__PURE__ */ React.createElement(SLabel, _ref12.cn("SLabel", _objectSpread({}, assignProps({
+    "use": "primary"
+  }, _ref4))), /* @__PURE__ */ React.createElement(Children, _ref12.cn("Children", {})));
+}
+Label.displayName = "Label";
+function AdditionalLabel(_ref17) {
+  var _ref5 = arguments[0], _ref13;
+  var styles = _ref17.styles, hasChildren = _ref17.children, Children = _ref17.Children;
+  var SAdditionalLabel = Text;
+  if (!hasChildren) {
+    return null;
+  }
+  return _ref13 = sstyled$1(styles), /* @__PURE__ */ React.createElement(SAdditionalLabel, _ref13.cn("SAdditionalLabel", _objectSpread({}, assignProps({
+    "use": "secondary"
+  }, _ref5))), /* @__PURE__ */ React.createElement(Children, _ref13.cn("Children", {})));
+}
+AdditionalLabel.displayName = "AdditionalLabel";
+function Count(_ref18) {
+  var _ref6 = arguments[0], _ref14;
+  var styles = _ref18.styles, hasChildren = _ref18.children, Children = _ref18.Children;
+  var SCount = Text;
+  if (!hasChildren) {
+    return null;
+  }
+  return _ref14 = sstyled$1(styles), /* @__PURE__ */ React.createElement(SCount, _ref14.cn("SCount", _objectSpread({}, assignProps({
+    "use": "secondary"
+  }, _ref6))), /* @__PURE__ */ React.createElement(Children, _ref14.cn("Children", {})));
+}
+Count.displayName = "Count";
+var LegendItemComponent = createComponent(LegendItemRoot, {
+  Shape,
+  Icon,
+  Label,
+  AdditionalLabel,
+  Count
+});
+export {
+  LegendItemComponent
+};

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

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

package/lib/esm/component/ChartLegend/LegendItem/legend-item.shadow.css

@@ -0,0 +1,129 @@
+SLegendItem {
+  min-width: 0;
+  align-items: flex-start;
+}
+
+SLegendItem:hover {
+  cursor: pointer;
+}
+
+SLegendItem[disabled]:hover {
+  cursor: default;
+}
+
+SPointShape[color] {
+  background-color: var(--color);
+  margin-right: 8px;
+  flex-shrink: 0;
+}
+
+SPointShape[shape='Circle'][size='l'] {
+  width: 16px;
+  height: 16px;
+  border-radius: 8px;
+  margin-top: 4px;
+}
+
+SPointShape[shape='Circle'][size='m'] {
+  width: 12px;
+  height: 12px;
+  border-radius: 6px;
+  margin-top: 4px;
+}
+
+SPointShape[shape='Line'][size='l'] {
+  width: 16px;
+  height: 4px;
+  border-radius: 3px;
+  margin-top: 9px;
+}
+
+SPointShape[shape='Line'][size='m'] {
+  width: 12px;
+  height: 4px;
+  border-radius: 3px;
+  margin-top: 8px;
+}
+
+SPointShape[shape='Square'][size='l'] {
+  width: 16px;
+  height: 16px;
+  border-radius: 2px;
+  margin-top: 4px;
+}
+
+SPointShape[shape='Square'][size='m'] {
+  width: 12px;
+  height: 12px;
+  border-radius: 2px;
+  margin-top: 4px;
+}
+
+SPointShape[shape='Pattern'] {
+  background-color: transparent;
+  margin-right: 4px;
+}
+
+SIcon {
+  line-height: 0;
+  margin-right: 4px;
+}
+
+SIcon[size='l'] {
+  margin-top: 4px;
+}
+
+SIcon[size='m'] {
+  margin-top: 2px;
+}
+
+SLabel {
+  min-width: 0;
+}
+
+SLabel[size='l'],
+SAdditionalLabel[size='l'],
+SCount[size='l'] {
+  font-size: var(--intergalactic-fs-300, 16px);
+  line-height: var(--intergalactic-lh-300, 150%);
+}
+
+SLabel[size='m'],
+SAdditionalLabel[size='m'],
+SCount[size='m'] {
+  font-size: var(--intergalactic-fs-200, 14px);
+  line-height: var(--intergalactic-lh-200, 142%);
+}
+
+SAdditionalLabel,
+SCount {
+  margin-left: 4px;
+}
+
+SAdditionalLabel {
+  white-space: nowrap;
+  display: flex;
+  align-items: flex-start;
+}
+
+SAdditionalLabel::before {
+  content: '';
+  display: inline-block;
+  background-color: var(--intergalactic-text-secondary, #6c6e79);
+  height: 4px;
+  width: 4px;
+  border-radius: 2px;
+  margin-right: 4px;
+}
+
+SAdditionalLabel[size='l']::before {
+  margin-top: 10px;
+}
+
+SAdditionalLabel[size='m']::before {
+  margin-top: 8px;
+}
+
+SPatternSymbol {
+  transform: scale(0.8);
+}

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

@@ -0,0 +1,90 @@
+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 _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 createComponent, { sstyled as sstyled$1, assignProps } from "@semcore/core";
+import React from "react";
+import { Box } from "@semcore/flex-box";
+import { LegendItemComponent } from "../LegendItem/LegendItem.mjs";
+import { BaseLegend } from "../BaseLegend.mjs";
+/*!__reshadow-styles__:"./legend-table.shadow.css"*/
+var style = (
+  /*__reshadow_css_start__*/
+  (sstyled.insert(
+    /*__inner_css_start__*/
+    '.___SLegendTable_1viv3_gg_.__columns-count_1viv3_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_1viv3_gg_._size_l_1viv3_gg_{font-size:var(--intergalactic-fs-300, 16px);text-align:right}.___SColumnItem_1viv3_gg_._size_m_1viv3_gg_{font-size:var(--intergalactic-fs-200, 14px);text-align:right}',
+    /*__inner_css_end__*/
+    "1viv3_gg_"
+  ), /*__reshadow_css_end__*/
+  {
+    "__SLegendTable": "___SLegendTable_1viv3_gg_",
+    "_columns-count": "__columns-count_1viv3_gg_",
+    "__SColumnItem": "___SColumnItem_1viv3_gg_",
+    "_size_l": "_size_l_1viv3_gg_",
+    "_size_m": "_size_m_1viv3_gg_"
+  })
+);
+var LegendTableRoot = /* @__PURE__ */ function(_BaseLegend) {
+  _inherits(LegendTableRoot2, _BaseLegend);
+  var _super = _createSuper(LegendTableRoot2);
+  function LegendTableRoot2() {
+    _classCallCheck(this, LegendTableRoot2);
+    return _super.apply(this, arguments);
+  }
+  _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$1(styles), /* @__PURE__ */ React.createElement(SLegendTable, _ref3.cn("SLegendTable", _objectSpread({}, 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;
+        return /* @__PURE__ */ React.createElement(React.Fragment, {
+          key: id
+        }, /* @__PURE__ */ React.createElement(Children, null), columns.map(function(item, index2) {
+          return /* @__PURE__ */ React.createElement(React.Fragment, {
+            key: "".concat(id, "__").concat(index2)
+          }, /* @__PURE__ */ React.createElement(LegendTable.Column, {
+            index: index2,
+            size,
+            styles
+          }, item));
+        }));
+      }));
+    }
+  }]);
+  return LegendTableRoot2;
+}(BaseLegend);
+_defineProperty(LegendTableRoot, "displayName", "LegendTable");
+_defineProperty(LegendTableRoot, "style", style);
+_defineProperty(LegendTableRoot, "defaultProps", function() {
+  return {
+    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$1(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", {})));
+}
+var LegendTable = createComponent(LegendTableRoot, {
+  LegendItem: LegendItemComponent,
+  Column: ColumnComponent
+});
+export {
+  LegendTable
+};

package/lib/esm/component/ChartLegend/LegendTable/legend-table.shadow.css

@@ -0,0 +1,19 @@
+SLegendTable[columns-count] {
+  font-variant-numeric: tabular-nums;
+  display: grid;
+  grid-template-columns: auto 0.2fr;
+  align-items: center;
+  height: fit-content;
+  grid-column-gap: 16px;
+  grid-row-gap: 8px;
+}
+
+SColumnItem[size='l'] {
+  font-size: var(--intergalactic-fs-300, 16px);
+  text-align: right;
+}
+
+SColumnItem[size='m'] {
+  font-size: var(--intergalactic-fs-200, 14px);
+  text-align: right;
+}

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

@@ -0,0 +1,5 @@
+import { LegendFlex } from "./LegendFlex/LegendFlex.mjs";
+export {
+  LegendFlex as ChartLegend,
+  LegendFlex as default
+};

package/lib/esm/component/Cigarette/Cigarette.mjs

@@ -0,0 +1,139 @@
+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 _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 { sstyled, Component } from "@semcore/core";
+import uniqueIDEnhancement from "@semcore/utils/lib/uniqueID";
+import createElement from "../../createElement.mjs";
+import { roundedPath } from "../../utils.mjs";
+import { PatternFill } from "../../Pattern.mjs";
+import { callAllEventHandlers } from "@semcore/utils/lib/assignProps";
+var CigaretteBarRoot = /* @__PURE__ */ function(_Component) {
+  _inherits(CigaretteBarRoot2, _Component);
+  var _super = _createSuper(CigaretteBarRoot2);
+  function CigaretteBarRoot2() {
+    var _this;
+    _classCallCheck(this, CigaretteBarRoot2);
+    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), "refElement", /* @__PURE__ */ React.createRef());
+    _defineProperty(_assertThisInitialized(_this), "handleMouseMove", function() {
+      _this.handlers.hovered(true);
+      _this.setCursor("pointer");
+    });
+    _defineProperty(_assertThisInitialized(_this), "handleMouseLeave", function() {
+      _this.handlers.hovered(false);
+      _this.setCursor("auto");
+    });
+    _defineProperty(_assertThisInitialized(_this), "handleClick", function(e) {
+      var _this$asProps = _this.asProps, onClick = _this$asProps.onClick, dataKey = _this$asProps.dataKey;
+      if (onClick && e.currentTarget.tagName === "path") {
+        e.stopPropagation();
+        onClick(dataKey, e);
+        return false;
+      }
+    });
+    _defineProperty(_assertThisInitialized(_this), "setCursor", function(value) {
+      var onClick = _this.asProps.onClick;
+      if (onClick) {
+        var _this$refElement$curr;
+        (_this$refElement$curr = _this.refElement.current) === null || _this$refElement$curr === void 0 ? void 0 : _this$refElement$curr.style.setProperty("cursor", value);
+      }
+    });
+    return _this;
+  }
+  _createClass(CigaretteBarRoot2, [{
+    key: "uncontrolledProps",
+    value: function uncontrolledProps() {
+      return {
+        hovered: false
+      };
+    }
+  }, {
+    key: "getRect",
+    value: function getRect() {
+      var _this$asProps2 = this.asProps, x = _this$asProps2.x, y = _this$asProps2.y, width = _this$asProps2.width, height = _this$asProps2.height, radius = _this$asProps2.r, direction = _this$asProps2.direction, index = _this$asProps2.index, hovered = _this$asProps2.hovered;
+      var xV = x;
+      var yV = y;
+      var widthV = width;
+      var heightV = height;
+      if (hovered && direction === "horizontal") {
+        yV = yV - 2;
+        heightV = heightV + 4;
+      }
+      if (hovered && direction === "vertical") {
+        xV = xV - 2;
+        widthV = widthV + 4;
+      }
+      if (radius) {
+        if (direction === "horizontal") {
+          if (index === 0) {
+            return roundedPath(xV, yV, widthV, heightV, radius, true, false, true, false);
+          } else {
+            return roundedPath(xV, yV, widthV, heightV, radius, false, true, false, true);
+          }
+        } else {
+          if (index === 0) {
+            return roundedPath(xV, yV, widthV, heightV, radius, true, true, false, false);
+          } else {
+            return roundedPath(xV, yV, widthV, heightV, radius, false, false, true, true);
+          }
+        }
+      }
+      return roundedPath(xV, yV, widthV, heightV, radius);
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _ref;
+      var SBar = this.Element;
+      var _this$asProps3 = this.asProps, styles = _this$asProps3.styles, color = _this$asProps3.color, data = _this$asProps3.data, dataKey = _this$asProps3.dataKey, index = _this$asProps3.index, hide = _this$asProps3.hide, uid = _this$asProps3.uid, duration = _this$asProps3.duration, onMouseMove = _this$asProps3.onMouseMove, onMouseLeave = _this$asProps3.onMouseLeave, transparent = _this$asProps3.transparent, resolveColor = _this$asProps3.resolveColor, patterns = _this$asProps3.patterns;
+      var dSvg = this.getRect();
+      return /* @__PURE__ */ React.createElement(React.Fragment, {
+        key: "horizontal-bar-".concat(index)
+      }, (_ref = sstyled(styles), /* @__PURE__ */ React.createElement(SBar, _ref.cn("SBar", {
+        "ref": this.refElement,
+        "aria-hidden": true,
+        "render": "path",
+        "clipPath": "url(#".concat(uid, ")"),
+        "__excludeProps": ["data", "scale", "value", "offset"],
+        "childrenPosition": "above",
+        "value": data[dataKey],
+        "index": index,
+        "hide": hide,
+        "fill": resolveColor(color),
+        "pattern": patterns ? "url(#".concat(uid, "-").concat(index, "-pattern)") : void 0,
+        "transparent": transparent,
+        "d": dSvg,
+        "use:duration": "".concat(duration, "ms"),
+        "onMouseMove": callAllEventHandlers(onMouseMove, this.handleMouseMove),
+        "onMouseLeave": callAllEventHandlers(onMouseLeave, this.handleMouseLeave),
+        "use:onClick": this.handleClick
+      }))), patterns && /* @__PURE__ */ React.createElement(PatternFill, _ref.cn("PatternFill", {
+        "id": "".concat(uid, "-").concat(index, "-pattern"),
+        "patternKey": color,
+        "color": resolveColor(color),
+        "patterns": patterns
+      })));
+    }
+  }]);
+  return CigaretteBarRoot2;
+}(Component);
+_defineProperty(CigaretteBarRoot, "displayName", "Cigarette.BarItem");
+_defineProperty(CigaretteBarRoot, "enhance", [uniqueIDEnhancement()]);
+_defineProperty(CigaretteBarRoot, "style", {});
+_defineProperty(CigaretteBarRoot, "defaultProps", {
+  offset: [0, 0],
+  duration: 500,
+  direction: "horizontal",
+  defaultHovered: false
+});
+const Cigarette = createElement(CigaretteBarRoot);
+export {
+  Cigarette as default
+};