@semcore/mini-chart 0.29.1 → 16.0.0-prerelease.4

package/lib/esm/component/score/Line.mjs

@@ -4,101 +4,100 @@ import R from "@babel/runtime/helpers/esm/createClass";
 import X from "@babel/runtime/helpers/esm/inherits";
 import j from "@babel/runtime/helpers/esm/createSuper";
 import S from "@babel/runtime/helpers/esm/defineProperty";
-import { sstyled as z } from "@semcore/utils/lib/core/index";
-import F, { sstyled as d, assignProps as G, Component as M } from "@semcore/core";
+import { sstyled as m, createComponent as z, assignProps as G, Component as F } from "@semcore/core";
 import e from "react";
-import { Box as g, Flex as q } from "@semcore/flex-box";
-import H from "@semcore/utils/lib/enhances/resolveColorEnhance";
-var J = (
+import { Box as g, Flex as M } from "@semcore/flex-box";
+import q from "@semcore/core/lib/utils/enhances/resolveColorEnhance";
+var H = (
   /*__reshadow_css_start__*/
-  (z.insert(
+  (m.insert(
     /*__inner_css_start__*/
-    "@keyframes pulse_1b7u0{0%,to{opacity:1}50%{opacity:.4}}@keyframes move-line_1b7u0{0%{transform:translateX(0)}to{transform:translateX(100%)}}.___SDonutContainer_1b7u0_gg_.__loading_1b7u0_gg_,.___SLineGauge_1b7u0_gg_.__loading_1b7u0_gg_,.___STrendBar_1b7u0_gg_.__loading_1b7u0_gg_,.___STrendLine_1b7u0_gg_.__loading_1b7u0_gg_{animation-name:pulse_1b7u0;animation-iteration-count:infinite;animation-timing-function:ease-in-out;animation-duration:1.6s;will-change:opacity}.___SLineGauge_1b7u0_gg_{height:8px;background-color:var(--base-bg-color_1b7u0, var(--intergalactic-chart-grid-bar-chart-base-bg, #e0e1e9));border-radius:var(--intergalactic-chart-rounded, 2px);overflow:hidden;position:relative}.___SLineValue_1b7u0_gg_{height:8px;border-radius:var(--intergalactic-chart-rounded, 2px)0 0 var(--intergalactic-chart-rounded, 2px)}.___SLineValue_1b7u0_gg_.__percent_1b7u0_gg_{width:var(--percent_1b7u0)}.___SLineSegmentItem_1b7u0_gg_.__color_1b7u0_gg_,.___SLineValue_1b7u0_gg_.__color_1b7u0_gg_{background-color:var(--color_1b7u0, var(--intergalactic-chart-palette-order-1, #2bb3ff))}.___SLineGauge_1b7u0_gg_.__segments_1b7u0_gg_{border-radius:var(--intergalactic-progress-bar-rounded, 6px)}.___SAnimationLine_1b7u0_gg_,.___SLineGaugeSegment_1b7u0_gg_{position:absolute;top:0;left:0;right:0;bottom:0}.___SLineSegmentItem_1b7u0_gg_:last-child{margin-right:0;border-right:none}.___SLineSegmentItem_1b7u0_gg_{height:8px;background:0 0;border-right-color:var(--intergalactic-chart-grid-border, #ffffff);border-right-style:solid;border-right-width:1px;box-sizing:content-box}.___SAnimationLine_1b7u0_gg_{background-color:var(--intergalactic-chart-grid-bar-chart-base-bg, #e0e1e9);transition:all var(--intergalactic-duration-extra-slow, 500) ease-in-out;animation-name:move-line_1b7u0;animation-duration:.5s;animation-timing-function:ease-in-out;animation-fill-mode:forwards}",
-    "1b7u0_gg_"
+    "@keyframes pulse_2vm7d{0%,to{opacity:1}50%{opacity:.4}}@keyframes move-line_2vm7d{0%{transform:translateX(0)}to{transform:translateX(100%)}}.___SDonutContainer_2vm7d_gg_.__loading_2vm7d_gg_,.___SLineGauge_2vm7d_gg_.__loading_2vm7d_gg_,.___STrendBar_2vm7d_gg_.__loading_2vm7d_gg_,.___STrendLine_2vm7d_gg_.__loading_2vm7d_gg_{animation-name:pulse_2vm7d;animation-iteration-count:infinite;animation-timing-function:ease-in-out;animation-duration:1.6s;will-change:opacity}.___SLineGauge_2vm7d_gg_{height:8px;background-color:var(--base-bg-color_2vm7d, var(--intergalactic-chart-grid-bar-chart-base-bg, #e0e1e9));border-radius:var(--intergalactic-chart-rounded, 2px);overflow:hidden;position:relative}.___SLineValue_2vm7d_gg_{height:8px;border-radius:var(--intergalactic-chart-rounded, 2px)0 0 var(--intergalactic-chart-rounded, 2px)}.___SLineValue_2vm7d_gg_.__percent_2vm7d_gg_{width:var(--percent_2vm7d)}.___SLineSegmentItem_2vm7d_gg_.__color_2vm7d_gg_,.___SLineValue_2vm7d_gg_.__color_2vm7d_gg_{background-color:var(--color_2vm7d, var(--intergalactic-chart-palette-order-1, #2bb3ff))}.___SLineGauge_2vm7d_gg_.__segments_2vm7d_gg_{border-radius:var(--intergalactic-progress-bar-rounded, 6px)}.___SAnimationLine_2vm7d_gg_,.___SLineGaugeSegment_2vm7d_gg_{position:absolute;top:0;left:0;right:0;bottom:0}.___SLineSegmentItem_2vm7d_gg_:last-child{margin-right:0;border-right:none}.___SLineSegmentItem_2vm7d_gg_{height:8px;background:0 0;border-right-color:var(--intergalactic-chart-grid-border, #ffffff);border-right-style:solid;border-right-width:1px;box-sizing:content-box}.___SAnimationLine_2vm7d_gg_{background-color:var(--intergalactic-chart-grid-bar-chart-base-bg, #e0e1e9);transition:all var(--intergalactic-duration-extra-slow, 500) ease-in-out;animation-name:move-line_2vm7d;animation-duration:.5s;animation-timing-function:ease-in-out;animation-fill-mode:forwards}",
+    "2vm7d_gg_"
   ), {
-    __SLineGauge: "___SLineGauge_1b7u0_gg_",
-    _loading: "__loading_1b7u0_gg_",
-    __SDonutContainer: "___SDonutContainer_1b7u0_gg_",
-    __STrendLine: "___STrendLine_1b7u0_gg_",
-    __STrendBar: "___STrendBar_1b7u0_gg_",
-    "@pulse": "pulse_1b7u0",
-    "--base-bg-color": "--base-bg-color_1b7u0",
-    __SLineValue: "___SLineValue_1b7u0_gg_",
-    _percent: "__percent_1b7u0_gg_",
-    "--percent": "--percent_1b7u0",
-    _color: "__color_1b7u0_gg_",
-    __SLineSegmentItem: "___SLineSegmentItem_1b7u0_gg_",
-    "--color": "--color_1b7u0",
-    _segments: "__segments_1b7u0_gg_",
-    __SLineGaugeSegment: "___SLineGaugeSegment_1b7u0_gg_",
-    __SAnimationLine: "___SAnimationLine_1b7u0_gg_",
-    "@move-line": "move-line_1b7u0"
+    __SLineGauge: "___SLineGauge_2vm7d_gg_",
+    _loading: "__loading_2vm7d_gg_",
+    __SDonutContainer: "___SDonutContainer_2vm7d_gg_",
+    __STrendLine: "___STrendLine_2vm7d_gg_",
+    __STrendBar: "___STrendBar_2vm7d_gg_",
+    "@pulse": "pulse_2vm7d",
+    "--base-bg-color": "--base-bg-color_2vm7d",
+    __SLineValue: "___SLineValue_2vm7d_gg_",
+    _percent: "__percent_2vm7d_gg_",
+    "--percent": "--percent_2vm7d",
+    _color: "__color_2vm7d_gg_",
+    __SLineSegmentItem: "___SLineSegmentItem_2vm7d_gg_",
+    "--color": "--color_2vm7d",
+    _segments: "__segments_2vm7d_gg_",
+    __SLineGaugeSegment: "___SLineGaugeSegment_2vm7d_gg_",
+    __SAnimationLine: "___SAnimationLine_2vm7d_gg_",
+    "@move-line": "move-line_2vm7d"
   })
 ), l = /* @__PURE__ */ function(p) {
-  X(n, p);
-  var v = j(n);
-  function n() {
-    return N(this, n), v.apply(this, arguments);
+  X(r, p);
+  var h = j(r);
+  function r() {
+    return N(this, r), h.apply(this, arguments);
   }
-  return R(n, [{
+  return R(r, [{
     key: "getSegmentProps",
     value: function(t) {
-      var _ = this.asProps, c = _.children, L = _.resolveColor, a = 0;
+      var _ = this.asProps, c = _.children, f = _.resolveColor, a = 0;
       e.Children.forEach(c, function(s) {
         /* @__PURE__ */ e.isValidElement(s) && (a = a + s.props.value);
       });
-      var u = a > 0 ? 100 * t.value / a : 0;
+      var d = a > 0 ? 100 * t.value / a : 0;
       return {
-        w: "".concat(u, "%"),
-        "use:color": L(t.color)
+        w: "".concat(d, "%"),
+        "use:color": f(t.color)
       };
     }
   }, {
     key: "render",
     value: function() {
-      var t = this.asProps, _, c = g, L = g, a = g, u = q, s = g, r = this.asProps, f = r.value, y = r.styles, E = r.color, P = E === void 0 ? "chart-palette-order-1" : E, k = r.baseBgColor, m = r.resolveColor, B = r.loading, T = r.children, $ = r.Children, w = r.animate;
+      var t = this.asProps, _, c = g, f = g, a = g, d = M, s = g, n = this.asProps, b = n.value, y = n.styles, E = n.color, P = E === void 0 ? "chart-palette-order-1" : E, k = n.baseBgColor, v = n.resolveColor, B = n.loading, T = n.children, $ = n.Children, w = n.animate;
       if (T !== void 0) {
         var i;
-        return i = d(y), /* @__PURE__ */ e.createElement(c, i.cn("SLineGauge", x({}, G({
+        return i = m(y), /* @__PURE__ */ e.createElement(c, i.cn("SLineGauge", x({}, G({
           segments: !0,
-          "base-bg-color": m(k)
-        }, t))), /* @__PURE__ */ e.createElement(u, i.cn("SLineGaugeSegment", {}), /* @__PURE__ */ e.createElement($, i.cn("Children", {}))), w && /* @__PURE__ */ e.createElement(a, i.cn("SAnimationLine", {})));
+          "base-bg-color": v(k)
+        }, t))), /* @__PURE__ */ e.createElement(d, i.cn("SLineGaugeSegment", {}), /* @__PURE__ */ e.createElement($, i.cn("Children", {}))), w && /* @__PURE__ */ e.createElement(a, i.cn("SAnimationLine", {})));
       }
       var o = this.asProps.segments, C = [];
       if (o)
-        for (var b = 0; b < o; b++) {
+        for (var u = 0; u < o; u++) {
           var I, D = "calc((100% - ".concat(o - 1, "px) / ").concat(o, ")");
-          C.push((I = d(y), /* @__PURE__ */ e.createElement(s, I.cn("SLineSegmentItem", {
-            key: b,
-            color: b < f ? m(P) : void 0,
+          C.push((I = m(y), /* @__PURE__ */ e.createElement(s, I.cn("SLineSegmentItem", {
+            key: u,
+            color: u < b ? v(P) : void 0,
             w: D
           }))));
         }
-      var V = "".concat(f, "%");
-      return o && (V = "".concat(f / o * 100, "%")), _ = d(y), /* @__PURE__ */ e.createElement(c, _.cn("SLineGauge", x({}, G({
-        "base-bg-color": m(k)
-      }, t))), !B && /* @__PURE__ */ e.createElement(L, _.cn("SLineValue", {
+      var V = "".concat(b, "%");
+      return o && (V = "".concat(b / o * 100, "%")), _ = m(y), /* @__PURE__ */ e.createElement(c, _.cn("SLineGauge", x({}, G({
+        "base-bg-color": v(k)
+      }, t))), !B && /* @__PURE__ */ e.createElement(f, _.cn("SLineValue", {
         w: V,
-        color: m(P)
-      })), !!C.length && /* @__PURE__ */ e.createElement(u, _.cn("SLineGaugeSegment", {}), C), w && /* @__PURE__ */ e.createElement(a, _.cn("SAnimationLine", {})));
+        color: v(P)
+      })), !!C.length && /* @__PURE__ */ e.createElement(d, _.cn("SLineGaugeSegment", {}), C), w && /* @__PURE__ */ e.createElement(a, _.cn("SAnimationLine", {})));
     }
-  }]), n;
-}(M);
-S(l, "enhance", [H()]);
+  }]), r;
+}(F);
+S(l, "enhance", [q()]);
 S(l, "displayName", "ScoreLine");
-S(l, "style", J);
+S(l, "style", H);
 S(l, "defaultProps", {
   animate: !0
 });
 function A(p) {
-  var v = arguments[0], n, h = p.styles, t = g;
-  return n = d(h), /* @__PURE__ */ e.createElement(t, n.cn("SLineSegmentItem", x({}, G({}, v))));
+  var h = arguments[0], r, L = p.styles, t = g;
+  return r = m(L), /* @__PURE__ */ e.createElement(t, r.cn("SLineSegmentItem", x({}, G({}, h))));
 }
 A.displayName = "Segment";
-var K = F(l, {
+var J = z(l, {
   Segment: A
 });
-K.displayName = "MiniChart.ScoreLine";
+J.displayName = "MiniChart.ScoreLine";
 export {
-  K as ScoreLine
+  J as ScoreLine
 };

package/lib/esm/component/trend/Bar.mjs

@@ -1,33 +1,32 @@
 import w from "@babel/runtime/helpers/esm/toConsumableArray";
-import h from "@babel/runtime/helpers/esm/objectSpread2";
+import f from "@babel/runtime/helpers/esm/objectSpread2";
 import L from "@babel/runtime/helpers/esm/classCallCheck";
 import A from "@babel/runtime/helpers/esm/createClass";
 import D from "@babel/runtime/helpers/esm/inherits";
 import E from "@babel/runtime/helpers/esm/createSuper";
 import l from "@babel/runtime/helpers/esm/defineProperty";
-import { sstyled as R } from "@semcore/utils/lib/core/index";
-import v, { assignProps as y, sstyled as G } from "@semcore/core";
+import { sstyled as v, createComponent as y, assignProps as j } from "@semcore/core";
 import _ from "react";
-import N from "@semcore/utils/lib/enhances/resolveColorEnhance";
-import { Trend as $ } from "./Trend.mjs";
-import { Box as M } from "@semcore/flex-box";
-import { extractAriaProps as W } from "@semcore/utils/lib/ariaProps";
-var j = (
+import R from "@semcore/core/lib/utils/enhances/resolveColorEnhance";
+import { Trend as G } from "./Trend.mjs";
+import { Box as N } from "@semcore/flex-box";
+import { extractAriaProps as M } from "@semcore/core/lib/utils/ariaProps";
+var W = (
   /*__reshadow_css_start__*/
-  (R.insert(
+  (v.insert(
     /*__inner_css_start__*/
-    "@keyframes pulse_18ffn{0%,to{opacity:1}50%{opacity:.4}}.___SDonutContainer_18ffn_gg_.__loading_18ffn_gg_,.___SLineGauge_18ffn_gg_.__loading_18ffn_gg_,.___STrendBar_18ffn_gg_.__loading_18ffn_gg_,.___STrendLine_18ffn_gg_.__loading_18ffn_gg_{animation-name:pulse_18ffn;animation-iteration-count:infinite;animation-timing-function:ease-in-out;animation-duration:1.6s;will-change:opacity}",
-    "18ffn_gg_"
+    "@keyframes pulse_7jer1{0%,to{opacity:1}50%{opacity:.4}}.___SDonutContainer_7jer1_gg_.__loading_7jer1_gg_,.___SLineGauge_7jer1_gg_.__loading_7jer1_gg_,.___STrendBar_7jer1_gg_.__loading_7jer1_gg_,.___STrendLine_7jer1_gg_.__loading_7jer1_gg_{animation-name:pulse_7jer1;animation-iteration-count:infinite;animation-timing-function:ease-in-out;animation-duration:1.6s;will-change:opacity}",
+    "7jer1_gg_"
   ), {
-    __SLineGauge: "___SLineGauge_18ffn_gg_",
-    _loading: "__loading_18ffn_gg_",
-    __SDonutContainer: "___SDonutContainer_18ffn_gg_",
-    __STrendLine: "___STrendLine_18ffn_gg_",
-    __STrendBar: "___STrendBar_18ffn_gg_",
-    "@pulse": "pulse_18ffn"
+    __SLineGauge: "___SLineGauge_7jer1_gg_",
+    _loading: "__loading_7jer1_gg_",
+    __SDonutContainer: "___SDonutContainer_7jer1_gg_",
+    __STrendLine: "___STrendLine_7jer1_gg_",
+    __STrendBar: "___STrendBar_7jer1_gg_",
+    "@pulse": "pulse_7jer1"
   })
-), o = /* @__PURE__ */ function(g) {
-  D(e, g);
+), o = /* @__PURE__ */ function(u) {
+  D(e, u);
   var s = E(e);
   function e() {
     return L(this, e), s.apply(this, arguments);
@@ -48,51 +47,51 @@ var j = (
   }, {
     key: "data",
     get: function() {
-      var i = this.asProps, r = i.data, t = i.loading;
+      var n = this.asProps, r = n.data, t = n.loading;
       return t ? this.defaultData : r;
     }
   }, {
     key: "render",
     value: function() {
-      var i = this.asProps, r, t = this, S = M, a = this.asProps, T = a.styles, u = a.resolveColor, C = a.isHistogram, B = a.animate, x = a.loading, f = this.defaultWidth / this.data.length, p = W(this.asProps), H = p.__excludeProps, k = p.extractedAriaProps;
-      return r = G(T), /* @__PURE__ */ _.createElement(S, r.cn("STrendBar", h({}, y({
+      var n = this.asProps, r, t = this, S = N, a = this.asProps, T = a.styles, p = a.resolveColor, C = a.isHistogram, B = a.animate, x = a.loading, g = this.defaultWidth / this.data.length, c = M(this.asProps), H = c.__excludeProps, k = c.extractedAriaProps;
+      return r = v(T), /* @__PURE__ */ _.createElement(S, r.cn("STrendBar", f({}, j({
         ref: this.containerRef,
         __excludeProps: ["data"].concat(w(H))
-      }, i))), /* @__PURE__ */ _.createElement("svg", r.cn("svg", h({
+      }, n))), /* @__PURE__ */ _.createElement("svg", r.cn("svg", f({
         width: "100%",
         height: "100%",
         viewBox: "0 0 ".concat(this.svgWidth, " ").concat(this.svgHeight),
         role: "img"
-      }, k)), this.data.map(function(n, m) {
-        var c = u("chart-palette-order-other-data");
-        return n.color && (c = u(n.color)), /* @__PURE__ */ _.createElement("rect", {
+      }, k)), this.data.map(function(i, m) {
+        var h = p("chart-palette-order-other-data");
+        return i.color && (h = p(i.color)), /* @__PURE__ */ _.createElement("rect", {
           key: m,
-          x: f * m,
-          y: t.defaultHeight - n.value,
-          width: C ? f : f * 0.8,
-          height: n.value,
-          fill: c
+          x: g * m,
+          y: t.defaultHeight - i.value,
+          width: C ? g : g * 0.8,
+          height: i.value,
+          fill: h
         }, B && !x && /* @__PURE__ */ _.createElement("animate", {
           attributeName: "y",
-          values: "".concat(t.defaultHeight, ";").concat(t.defaultHeight - n.value),
+          values: "".concat(t.defaultHeight, ";").concat(t.defaultHeight - i.value),
           dur: "500ms"
         }));
       })));
     }
   }]), e;
-}($);
-l(o, "enhance", [N()]);
-l(o, "style", j);
+}(G);
+l(o, "enhance", [R()]);
+l(o, "style", W);
 l(o, "defaultProps", {
   animate: !0
 });
-var P = v(o);
+var P = y(o);
 P.displayName = "MiniChart.TrendBar";
-var ee = v(o, {}, {
+var b = y(o, {}, {
   enhancements: [function() {
     return {
       wrapperProps: function(s) {
-        return y(s, {
+        return j(s, {
           isHistogram: !0
         });
       }
@@ -102,5 +101,5 @@ var ee = v(o, {}, {
 P.displayName = "MiniChart.TrendHistogram";
 export {
   P as TrendBar,
-  ee as TrendHistogram
+  b as TrendHistogram
 };

package/lib/esm/component/trend/Line.mjs

@@ -4,34 +4,33 @@ import E from "@babel/runtime/helpers/esm/classCallCheck";
 import R from "@babel/runtime/helpers/esm/createClass";
 import H from "@babel/runtime/helpers/esm/inherits";
 import W from "@babel/runtime/helpers/esm/createSuper";
-import h from "@babel/runtime/helpers/esm/defineProperty";
-import { sstyled as $ } from "@semcore/utils/lib/core/index";
-import C, { assignProps as S, sstyled as b } from "@semcore/core";
+import g from "@babel/runtime/helpers/esm/defineProperty";
+import { sstyled as j, createComponent as C, assignProps as S } from "@semcore/core";
 import i from "react";
-import D from "@semcore/utils/lib/enhances/resolveColorEnhance";
-import B from "@semcore/utils/lib/uniqueID";
-import { Trend as j } from "./Trend.mjs";
-import { Box as G } from "@semcore/flex-box";
-import { extractAriaProps as N } from "@semcore/utils/lib/ariaProps";
-var M = (
+import $ from "@semcore/core/lib/utils/enhances/resolveColorEnhance";
+import b from "@semcore/core/lib/utils/uniqueID";
+import { Trend as D } from "./Trend.mjs";
+import { Box as B } from "@semcore/flex-box";
+import { extractAriaProps as G } from "@semcore/core/lib/utils/ariaProps";
+var N = (
   /*__reshadow_css_start__*/
-  ($.insert(
+  (j.insert(
     /*__inner_css_start__*/
-    "@keyframes pulse_18ffn{0%,to{opacity:1}50%{opacity:.4}}.___SDonutContainer_18ffn_gg_.__loading_18ffn_gg_,.___SLineGauge_18ffn_gg_.__loading_18ffn_gg_,.___STrendBar_18ffn_gg_.__loading_18ffn_gg_,.___STrendLine_18ffn_gg_.__loading_18ffn_gg_{animation-name:pulse_18ffn;animation-iteration-count:infinite;animation-timing-function:ease-in-out;animation-duration:1.6s;will-change:opacity}",
-    "18ffn_gg_"
+    "@keyframes pulse_7jer1{0%,to{opacity:1}50%{opacity:.4}}.___SDonutContainer_7jer1_gg_.__loading_7jer1_gg_,.___SLineGauge_7jer1_gg_.__loading_7jer1_gg_,.___STrendBar_7jer1_gg_.__loading_7jer1_gg_,.___STrendLine_7jer1_gg_.__loading_7jer1_gg_{animation-name:pulse_7jer1;animation-iteration-count:infinite;animation-timing-function:ease-in-out;animation-duration:1.6s;will-change:opacity}",
+    "7jer1_gg_"
   ), {
-    __SLineGauge: "___SLineGauge_18ffn_gg_",
-    _loading: "__loading_18ffn_gg_",
-    __SDonutContainer: "___SDonutContainer_18ffn_gg_",
-    __STrendLine: "___STrendLine_18ffn_gg_",
-    __STrendBar: "___STrendBar_18ffn_gg_",
-    "@pulse": "pulse_18ffn"
+    __SLineGauge: "___SLineGauge_7jer1_gg_",
+    _loading: "__loading_7jer1_gg_",
+    __SDonutContainer: "___SDonutContainer_7jer1_gg_",
+    __STrendLine: "___STrendLine_7jer1_gg_",
+    __STrendBar: "___STrendBar_7jer1_gg_",
+    "@pulse": "pulse_7jer1"
   })
-), l = /* @__PURE__ */ function(g) {
-  H(s, g);
-  var f = W(s);
+), l = /* @__PURE__ */ function(u) {
+  H(s, u);
+  var d = W(s);
   function s() {
-    return E(this, s), f.apply(this, arguments);
+    return E(this, s), d.apply(this, arguments);
   }
   return R(s, [{
     key: "defaultData",
@@ -47,8 +46,8 @@ var M = (
   }, {
     key: "data",
     get: function() {
-      var e = this.asProps, t = e.data, a = e.loading;
-      return a ? this.defaultData : t;
+      var e = this.asProps, t = e.data, o = e.loading;
+      return o ? this.defaultData : t;
     }
   }, {
     key: "svgWidth",
@@ -63,16 +62,16 @@ var M = (
   }, {
     key: "color",
     get: function() {
-      var e = this.asProps, t = e.resolveColor, a = e.color, r = a === void 0 ? "chart-palette-order-1" : a, o = e.loading;
-      return t(o ? "skeleton-bg" : r);
+      var e = this.asProps, t = e.resolveColor, o = e.color, r = o === void 0 ? "chart-palette-order-1" : o, n = e.loading;
+      return t(n ? "skeleton-bg" : r);
     }
   }, {
     key: "render",
     value: function() {
-      for (var e = this.asProps, t, a = G, r = this.asProps, o = r.uid, k = r.withArea, T = r.animate, u = r.lastPointColor, p = r.resolveColor, m = r.loading, x = r.styles, d = [], _ = this.data.length, P = this.defaultWidth / (_ - 1), c = 0; c < _; c++)
-        d.push("".concat(P * c, ",").concat(this.defaultHeight - this.data[c]));
-      var v = N(this.asProps), L = v.__excludeProps, w = v.extractedAriaProps;
-      return t = b(x), /* @__PURE__ */ i.createElement(a, t.cn("STrendLine", y({}, S({
+      for (var e = this.asProps, t, o = B, r = this.asProps, n = r.uid, k = r.withArea, T = r.animate, p = r.lastPointColor, m = r.resolveColor, f = r.loading, x = r.styles, h = [], _ = this.data.length, P = this.defaultWidth / (_ - 1), c = 0; c < _; c++)
+        h.push("".concat(P * c, ",").concat(this.defaultHeight - this.data[c]));
+      var v = G(this.asProps), L = v.__excludeProps, w = v.extractedAriaProps;
+      return t = j(x), /* @__PURE__ */ i.createElement(o, t.cn("STrendLine", y({}, S({
         ref: this.containerRef,
         __excludeProps: ["data"].concat(A(L))
       }, e))), /* @__PURE__ */ i.createElement("svg", t.cn("svg", y({
@@ -81,26 +80,26 @@ var M = (
         viewBox: "0 0 ".concat(this.svgWidth, " ").concat(this.svgHeight),
         role: "img"
       }, w)), /* @__PURE__ */ i.createElement("polyline", t.cn("polyline", {
-        points: d.join(" "),
+        points: h.join(" "),
         stroke: this.color,
         strokeWidth: "4",
         fill: "none",
-        clipPath: "url(#".concat(o, ")")
+        clipPath: "url(#".concat(n, ")")
       })), k && /* @__PURE__ */ i.createElement("polyline", t.cn("polyline", {
-        points: "0,".concat(this.defaultHeight, " ").concat(d.join(" "), " ").concat(this.defaultWidth, ",").concat(this.defaultHeight),
+        points: "0,".concat(this.defaultHeight, " ").concat(h.join(" "), " ").concat(this.defaultWidth, ",").concat(this.defaultHeight),
         fill: this.color,
         fillOpacity: 0.2,
-        clipPath: "url(#".concat(o, ")")
-      })), u && !m && /* @__PURE__ */ i.createElement("circle", t.cn("circle", {
+        clipPath: "url(#".concat(n, ")")
+      })), p && !f && /* @__PURE__ */ i.createElement("circle", t.cn("circle", {
         cx: P * (_ - 1),
         cy: this.defaultHeight - this.data[_ - 1],
         r: this.lastPointRadius,
-        fill: p(u),
-        stroke: p("chart-grid-border"),
+        fill: m(p),
+        stroke: m("chart-grid-border"),
         strokeWidth: 4,
-        clipPath: "url(#".concat(o, ")")
-      })), T && !m && /* @__PURE__ */ i.createElement("clipPath", t.cn("clipPath", {
-        id: o
+        clipPath: "url(#".concat(n, ")")
+      })), T && !f && /* @__PURE__ */ i.createElement("clipPath", t.cn("clipPath", {
+        id: n
       }), /* @__PURE__ */ i.createElement("rect", t.cn("rect", {
         x: "0",
         y: "0",
@@ -114,27 +113,27 @@ var M = (
       }))))));
     }
   }]), s;
-}(j);
-h(l, "enhance", [D(), B()]);
-h(l, "style", M);
-h(l, "defaultProps", {
+}(D);
+g(l, "enhance", [$(), b()]);
+g(l, "style", N);
+g(l, "defaultProps", {
   animate: !0
 });
-var q = C(l);
-q.displayName = "MiniChart.TrendLine";
-var I = C(l, {}, {
+var M = C(l);
+M.displayName = "MiniChart.TrendLine";
+var q = C(l, {}, {
   enhancements: [function() {
     return {
-      wrapperProps: function(f) {
-        return S(f, {
+      wrapperProps: function(d) {
+        return S(d, {
           withArea: !0
         });
       }
     };
   }]
 });
-I.displayName = "MiniChart.TrendArea";
+q.displayName = "MiniChart.TrendArea";
 export {
-  I as TrendArea,
-  q as TrendLine
+  q as TrendArea,
+  M as TrendLine
 };

package/lib/types/component/score/Donut.d.ts

@@ -1,6 +1,6 @@
 import { ComponentType } from '@semcore/core';
 import { BoxProps } from '@semcore/flex-box';
-import resolveColorEnhance from '@semcore/utils/lib/enhances/resolveColorEnhance';
+import resolveColorEnhance from '@semcore/core/lib/utils/enhances/resolveColorEnhance';
 import { CommonScoreProps } from './Score';
 export type ScoreDonutProps = BoxProps & CommonScoreProps;
 type Enhances = {

package/lib/types/component/score/Line.types.d.ts

@@ -1,8 +1,8 @@
-import { Intergalactic, ComponentType } from '@semcore/utils/lib/core';
+import { Intergalactic, ComponentType } from '@semcore/core';
 import { CommonScoreProps } from './Score';
 import React from 'react';
 import { BoxProps, Box } from '@semcore/flex-box';
-import resolveColorEnhance from '@semcore/utils/lib/enhances/resolveColorEnhance';
+import resolveColorEnhance from '@semcore/core/lib/utils/enhances/resolveColorEnhance';
 type Enumerate<N extends number, Acc extends number[] = []> = Acc['length'] extends N ? Acc[number] : Enumerate<N, [...Acc, Acc['length']]>;
 type Range<F extends number, T extends number> = Exclude<Enumerate<T>, Enumerate<F>>;
 export type SegmentColor = `chart-palette-order-${Range<1, 24>}`;

package/lib/types/component/trend/Bar.d.ts

@@ -1,5 +1,5 @@
 import { ComponentType } from '@semcore/core';
-import resolveColorEnhance from '@semcore/utils/lib/enhances/resolveColorEnhance';
+import resolveColorEnhance from '@semcore/core/lib/utils/enhances/resolveColorEnhance';
 import { CommonTrendProps } from './Trend';
 type BarItem = {
     /**

package/lib/types/component/trend/Line.d.ts

@@ -1,5 +1,5 @@
 import { ComponentType } from '@semcore/core';
-import resolveColorEnhance from '@semcore/utils/lib/enhances/resolveColorEnhance';
+import resolveColorEnhance from '@semcore/core/lib/utils/enhances/resolveColorEnhance';
 import { CommonTrendProps } from './Trend';
 export type TrendLineProps = CommonTrendProps & {
     /**

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@semcore/mini-chart",
   "description": "Semrush MiniChart Component",
-  "version": "0.29.1",
+  "version": "16.0.0-prerelease.4",
   "main": "lib/cjs/index.js",
   "module": "lib/es6/index.js",
   "typings": "lib/types/index.d.ts",
@@ -13,14 +13,9 @@
     "import": "./lib/esm/index.mjs",
     "types": "./lib/types/index.d.ts"
   },
-  "dependencies": {
-    "@semcore/flex-box": "5.41.1",
-    "@semcore/utils": "4.48.1"
-  },
   "peerDependencies": {
-    "@semcore/core": "^2.17.5",
-    "react": "16.8 - 18",
-    "react-dom": "16.8 - 18"
+    "@semcore/base-components": "^16.0.0-prerelease.4",
+    "@semcore/flex-box": "^16.0.0-prerelease.4"
   },
   "repository": {
     "type": "git",