@hybridcore/ui 1.6.0 → 1.6.2

package/dist/components/charts/heatmap/index.js

@@ -1,10 +1,11 @@
-import { jsx as t } from "react/jsx-runtime";
-import { useHeatmapLogic as a } from "./logic.js";
-import { HeatmapRoot as p } from "./styled.js";
-function d(o) {
-  const { chartId: r, ownerState: e, sx: i, other: m } = a(o);
-  return /* @__PURE__ */ t(p, { ownerState: e, sx: i, ...m, children: /* @__PURE__ */ t("div", { id: r, style: { width: "100%", height: "100%" } }) });
-}
+import { jsx as r } from "react/jsx-runtime";
+import { ChartError as p } from "../_common/chart-error.js";
+import { useHeatmapLogic as s } from "./logic.js";
+import { HeatmapRoot as h } from "./styled.js";
+const g = (o) => {
+  const { chartId: e, ownerState: m, sx: a, error: t, other: i } = s(o);
+  return /* @__PURE__ */ r(h, { ownerState: m, sx: a, ...i, children: t ? /* @__PURE__ */ r(p, { message: t }) : /* @__PURE__ */ r("div", { id: e, style: { width: "100%", height: "100%" } }) });
+};
 export {
-  d as Heatmap
+  g as Heatmap
 };

package/dist/components/charts/heatmap/logic.js

@@ -1,16 +1,16 @@
-import { m as Q, s as Z, C as D, L as $, k as ee, l as te, T as J, R as re, A as ae } from "../../../AnimatedTheme-jnasw6rT.js";
-import { useThemeProps as ie, useTheme as se } from "@mui/material";
-import oe from "dayjs";
-import Y from "lodash";
-import { useId as ne, useRef as le, useEffect as ce } from "react";
-import { colorSetFromPalette as ue } from "../_common/utils.js";
-import { E as K, e as he, f as G, u as F, m as W, b as p, p as H, c as O } from "../../../ColorSet-C7vpNXhM.js";
-import { X as de } from "../../../AxisRenderer-DTyLLA6c.js";
-import { A as me, a as pe } from "../../../AxisRendererY-C_ItLPNV.js";
-import { C as X } from "../../../CategoryAxis-CwnfaGc8.js";
-import { R as fe } from "../../../RoundedRectangle-CWLi2PXn.js";
-import { C as ge } from "../../../ColumnSeries-CjgdJ2QL.js";
-class T extends K {
+import { m as Z, s as ee, C as F, L as W, k as te, l as re, T as K, R as ae, A as ie } from "../../../AnimatedTheme-jnasw6rT.js";
+import { useThemeProps as se, useTheme as oe } from "@mui/material";
+import ne from "dayjs";
+import O from "lodash";
+import { useId as le, useRef as ce, useEffect as ue } from "react";
+import { colorSetFromPalette as he } from "../_common/utils.js";
+import { E as Q, e as de, f as H, u as P, m as J, b as f, p as B, c as D } from "../../../ColorSet-C7vpNXhM.js";
+import { X as me } from "../../../AxisRenderer-DTyLLA6c.js";
+import { A as pe, a as fe } from "../../../AxisRendererY-C_ItLPNV.js";
+import { C as G } from "../../../CategoryAxis-CwnfaGc8.js";
+import { R as ge } from "../../../RoundedRectangle-CWLi2PXn.js";
+import { C as be } from "../../../ColumnSeries-CjgdJ2QL.js";
+class T extends Q {
   _afterNew() {
     super._afterNewApplyThemes();
   }
@@ -33,12 +33,12 @@ class T extends K {
     const s = this.get("target");
     if (s) {
       let e = s.globalBounds();
-      const r = i.toLocal({ x: e.left, y: e.top }), l = i.toLocal({ x: e.right, y: e.top }), o = i.toLocal({ x: e.right, y: e.bottom }), a = i.toLocal({ x: e.left, y: e.bottom });
+      const r = i.toLocal({ x: e.left, y: e.top }), n = i.toLocal({ x: e.right, y: e.top }), o = i.toLocal({ x: e.right, y: e.bottom }), a = i.toLocal({ x: e.left, y: e.bottom });
       return {
-        left: Math.min(r.x, l.x, o.x, a.x),
-        top: Math.min(r.y, l.y, o.y, a.y),
-        right: Math.max(r.x, l.x, o.x, a.x),
-        bottom: Math.max(r.y, l.y, o.y, a.y)
+        left: Math.min(r.x, n.x, o.x, a.x),
+        top: Math.min(r.y, n.y, o.y, a.y),
+        right: Math.max(r.x, n.x, o.x, a.x),
+        bottom: Math.max(r.y, n.y, o.y, a.y)
       };
     }
     return i._display.getLocalBounds();
@@ -54,83 +54,83 @@ Object.defineProperty(T, "classNames", {
   enumerable: !0,
   configurable: !0,
   writable: !0,
-  value: K.classNames.concat([T.className])
+  value: Q.classNames.concat([T.className])
 });
-class P extends T {
+class V extends T {
   /**
    * @ignore
    */
   getFill(i) {
     const s = this.get("rotation", 0);
-    let e = this.getBounds(i), r = e.left || 0, l = e.right || 0, o = e.top || 0, a = e.bottom || 0, m = Q(s), f = Z(s), c = m * (l - r), u = f * (a - o);
-    c == 0 && (c = 1), u == 0 && (u = 1);
-    let h = Math.max(c, u);
-    const g = this._root._renderer.createLinearGradient(r, o, r + h * m, o + h * f), A = this.get("stops");
-    if (A) {
-      let C = 0;
-      he(A, (t) => {
-        let d = t.offset;
-        G(d) || (d = C / (A.length - 1));
-        let v = t.opacity;
-        G(v) || (v = 1);
-        let n = t.color;
-        if (n) {
-          const w = t.lighten;
-          w && (n = F.lighten(n, w));
-          const b = t.brighten;
-          b && (n = F.brighten(n, b)), g.addColorStop(d, "rgba(" + n.r + "," + n.g + "," + n.b + "," + v + ")");
+    let e = this.getBounds(i), r = e.left || 0, n = e.right || 0, o = e.top || 0, a = e.bottom || 0, p = Z(s), g = ee(s), l = p * (n - r), c = g * (a - o);
+    l == 0 && (l = 1), c == 0 && (c = 1);
+    let u = Math.max(l, c);
+    const b = this._root._renderer.createLinearGradient(r, o, r + u * p, o + u * g), v = this.get("stops");
+    if (v) {
+      let N = 0;
+      de(v, (y) => {
+        let t = y.offset;
+        H(t) || (t = N / (v.length - 1));
+        let h = y.opacity;
+        H(h) || (h = 1);
+        let m = y.color;
+        if (m) {
+          const d = y.lighten;
+          d && (m = P.lighten(m, d));
+          const C = y.brighten;
+          C && (m = P.brighten(m, C)), b.addColorStop(t, "rgba(" + m.r + "," + m.g + "," + m.b + "," + h + ")");
         }
-        C++;
+        N++;
       });
     }
-    return g;
+    return b;
   }
 }
-Object.defineProperty(P, "className", {
+Object.defineProperty(V, "className", {
   enumerable: !0,
   configurable: !0,
   writable: !0,
   value: "LinearGradient"
 });
-Object.defineProperty(P, "classNames", {
+Object.defineProperty(V, "classNames", {
   enumerable: !0,
   configurable: !0,
   writable: !0,
-  value: T.classNames.concat([P.className])
+  value: T.classNames.concat([V.className])
 });
-class V extends D {
+class j extends F {
   constructor() {
     super(...arguments), Object.defineProperty(this, "labelContainer", {
       enumerable: !0,
       configurable: !0,
       writable: !0,
-      value: this.children.push(D.new(this._root, {}))
+      value: this.children.push(F.new(this._root, {}))
     }), Object.defineProperty(this, "markerContainer", {
       enumerable: !0,
       configurable: !0,
       writable: !0,
-      value: this.children.push(D.new(this._root, {}))
+      value: this.children.push(F.new(this._root, {}))
     }), Object.defineProperty(this, "startLabel", {
       enumerable: !0,
       configurable: !0,
       writable: !0,
-      value: this.labelContainer.children.push($.new(this._root, { themeTags: ["start"] }))
+      value: this.labelContainer.children.push(W.new(this._root, { themeTags: ["start"] }))
     }), Object.defineProperty(this, "endLabel", {
       enumerable: !0,
       configurable: !0,
       writable: !0,
-      value: this.labelContainer.children.push($.new(this._root, { themeTags: ["end"] }))
+      value: this.labelContainer.children.push(W.new(this._root, { themeTags: ["end"] }))
     }), Object.defineProperty(this, "markers", {
       enumerable: !0,
       configurable: !0,
       writable: !0,
-      value: this.addDisposer(new ee(te.new({}), () => fe._new(this._root, {
-        themeTags: W(this.markers.template.get("themeTags", []), [this.get("orientation"), "heatlegend", "marker"])
+      value: this.addDisposer(new te(re.new({}), () => ge._new(this._root, {
+        themeTags: J(this.markers.template.get("themeTags", []), [this.get("orientation"), "heatlegend", "marker"])
       }, [this.markers.template])))
     });
   }
   _afterNew() {
-    this._settings.themeTags = W(this._settings.themeTags, ["heatlegend", this._settings.orientation]), super._afterNew(), this.set("tooltip", J.new(this._root, {
+    this._settings.themeTags = J(this._settings.themeTags, ["heatlegend", this._settings.orientation]), super._afterNew(), this.set("tooltip", K.new(this._root, {
       themeTags: ["heatlegend"]
     }));
   }
@@ -152,98 +152,92 @@ class V extends D {
    */
   showValue(i, s, e) {
     const r = this.getTooltip();
-    if (r && G(i)) {
-      const l = this.get("startValue", 0), o = this.get("endValue", 1);
-      let a = (i - l) / (o - l);
+    if (r && H(i)) {
+      const n = this.get("startValue", 0), o = this.get("endValue", 1);
+      let a = (i - n) / (o - n);
       (a == 1 / 0 || a == -1 / 0 || isNaN(a)) && (a = 0.5);
-      const m = this.get("startColor"), f = this.get("endColor");
-      s || (s = this.getNumberFormatter().format(i)), e || (e = F.interpolate(a, m, f)), r.label.set("text", s);
-      let c;
-      this.get("orientation") == "vertical" ? c = this.markerContainer.toGlobal({ x: 0, y: this.innerHeight() * (1 - a) }) : c = this.markerContainer.toGlobal({ x: this.innerWidth() * a, y: 0 });
-      let u = r.get("background");
-      u && u.set("fill", e), r.set("pointTo", c), r.show();
+      const p = this.get("startColor"), g = this.get("endColor");
+      s || (s = this.getNumberFormatter().format(i)), e || (e = P.interpolate(a, p, g)), r.label.set("text", s);
+      let l;
+      this.get("orientation") == "vertical" ? l = this.markerContainer.toGlobal({ x: 0, y: this.innerHeight() * (1 - a) }) : l = this.markerContainer.toGlobal({ x: this.innerWidth() * a, y: 0 });
+      let c = r.get("background");
+      c && c.set("fill", e), r.set("pointTo", l), r.show();
     }
   }
   _prepareChildren() {
     super._prepareChildren();
-    const i = this.labelContainer, s = this.get("orientation"), e = this.startLabel, r = this.endLabel, l = this.getTooltip();
-    if (this.isDirty("orientation") && (s == "vertical" ? (this.markerContainer.setAll({ layout: this._root.verticalLayout, height: p }), this.set("layout", this._root.horizontalLayout), e.setAll({ y: p, x: void 0, centerY: p, centerX: p }), r.setAll({ y: 0, x: void 0, centerY: 0, centerX: p }), i.setAll({ height: p, width: void 0 }), l && l.set("pointerOrientation", "horizontal")) : (this.markerContainer.setAll({ layout: this._root.horizontalLayout, width: p }), this.set("layout", this._root.verticalLayout), e.setAll({ x: 0, y: void 0, centerX: 0, centerY: 0 }), r.setAll({ x: p, y: void 0, centerX: p, centerY: 0 }), i.setAll({ width: p, height: void 0 }), l && l.set("pointerOrientation", "vertical"))), this.isDirty("stepCount")) {
-      const o = this.get("stepCount", 1), a = this.get("startColor"), m = this.get("endColor"), f = this.get("startOpacity", 1), c = this.get("endOpacity", 1);
+    const i = this.labelContainer, s = this.get("orientation"), e = this.startLabel, r = this.endLabel, n = this.getTooltip();
+    if (this.isDirty("orientation") && (s == "vertical" ? (this.markerContainer.setAll({ layout: this._root.verticalLayout, height: f }), this.set("layout", this._root.horizontalLayout), e.setAll({ y: f, x: void 0, centerY: f, centerX: f }), r.setAll({ y: 0, x: void 0, centerY: 0, centerX: f }), i.setAll({ height: f, width: void 0 }), n && n.set("pointerOrientation", "horizontal")) : (this.markerContainer.setAll({ layout: this._root.horizontalLayout, width: f }), this.set("layout", this._root.verticalLayout), e.setAll({ x: 0, y: void 0, centerX: 0, centerY: 0 }), r.setAll({ x: f, y: void 0, centerX: f, centerY: 0 }), i.setAll({ width: f, height: void 0 }), n && n.set("pointerOrientation", "vertical"))), this.isDirty("stepCount")) {
+      const o = this.get("stepCount", 1), a = this.get("startColor"), p = this.get("endColor"), g = this.get("startOpacity", 1), l = this.get("endOpacity", 1);
       if (this.markerContainer.children.clear(), o > 1)
-        for (let u = 0; u < o; u++) {
-          const h = this.makeMarker();
-          s == "vertical" ? this.markerContainer.children.moveValue(h, 0) : this.markerContainer.children.push(h), a && m && h.setAll({
-            fill: F.interpolate(u / o, a, m),
-            fillOpacity: H(u / o * 100).interpolate(f, c)
+        for (let c = 0; c < o; c++) {
+          const u = this.makeMarker();
+          s == "vertical" ? this.markerContainer.children.moveValue(u, 0) : this.markerContainer.children.push(u), a && p && u.setAll({
+            fill: P.interpolate(c / o, a, p),
+            fillOpacity: B(c / o * 100).interpolate(g, l)
           });
         }
       else if (o == 1) {
-        const u = this.makeMarker();
-        this.markerContainer.children.push(u);
-        const h = P.new(this._root, {
+        const c = this.makeMarker();
+        this.markerContainer.children.push(c);
+        const u = V.new(this._root, {
           stops: [{
             color: a,
-            opacity: f
+            opacity: g
           }, {
-            color: m,
-            opacity: c
+            color: p,
+            opacity: l
           }]
         });
         if (s == "vertical") {
-          h.set("rotation", 90);
-          let g = h.get("stops");
-          g && g.reverse();
+          u.set("rotation", 90);
+          let b = u.get("stops");
+          b && b.reverse();
         } else
-          h.set("rotation", 0);
-        a && m && u.set("fillGradient", h);
+          u.set("rotation", 0);
+        a && p && c.set("fillGradient", u);
       }
     }
     (this.isDirty("startText") || this.isDirty("startValue")) && e.set("text", this.get("startText", this.getNumberFormatter().format(this.get("startValue", 0)))), (this.isDirty("endText") || this.isDirty("endValue")) && r.set("text", this.get("endText", this.getNumberFormatter().format(this.get("endValue", 1))));
   }
 }
-Object.defineProperty(V, "className", {
+Object.defineProperty(j, "className", {
   enumerable: !0,
   configurable: !0,
   writable: !0,
   value: "HeatLegend"
 });
-Object.defineProperty(V, "classNames", {
+Object.defineProperty(j, "classNames", {
   enumerable: !0,
   configurable: !0,
   writable: !0,
-  value: D.classNames.concat([V.className])
+  value: F.classNames.concat([j.className])
 });
-const Ye = (L) => {
-  const i = ie({ props: L, name: "HCHeatmap" }), {
+const Oe = (L) => {
+  const i = se({ props: L, name: "HCHeatmap" }), {
     dimensions: s,
     values: e,
     data: r,
-    initDelay: l = 0,
+    initDelay: n = 0,
     baseInterval: o,
     colors: a,
-    sx: m,
-    ...f
-  } = i, c = se(), h = `hc-heatmap-${ne().replace(/:/g, "")}`, g = le(null);
-  ce(() => {
-    let C;
-    return C = setTimeout(() => {
-      var I, E;
-      if (s.length < 2) {
-        console.error("Heatmap requires at least 2 dimensions");
-        return;
-      }
-      if (e.length < 1) {
-        console.error("Heatmap requires at least 1 value");
-        return;
-      }
-      const t = re.new(h);
-      g.current = t, t.setThemes([ae.new(t)]), t.interfaceColors.setAll({
-        text: O(c.palette.text.primary),
-        grid: O(c.palette.divider),
-        stroke: O(c.palette.divider)
+    sx: p,
+    ...g
+  } = i, l = oe(), u = `hc-heatmap-${le().replace(/:/g, "")}`, b = ce(null);
+  let v = null;
+  s.length < 2 ? v = "Heatmap requires at least 2 dimensions" : e.length < 1 && (v = "Heatmap requires at least 1 value"), ue(() => {
+    if (v) return;
+    let y;
+    return y = setTimeout(() => {
+      var E, S;
+      const t = ae.new(u);
+      b.current = t, t.setThemes([ie.new(t)]), t.interfaceColors.setAll({
+        text: D(l.palette.text.primary),
+        grid: D(l.palette.divider),
+        stroke: D(l.palette.divider)
       });
-      const d = t.container.children.push(
-        de.new(t, {
+      const h = t.container.children.push(
+        me.new(t, {
           panX: !1,
           panY: !1,
           wheelX: "none",
@@ -251,111 +245,111 @@ const Ye = (L) => {
           layout: t.verticalLayout
         })
       );
-      d.set("colors", ue(t, a));
-      const v = me.new(t, {
+      h.set("colors", he(t, a));
+      const m = pe.new(t, {
         visible: !1,
         minGridDistance: 30
       });
-      v.grid.template.set("visible", !1);
-      const n = s[0];
-      let w, b = r;
-      if (n.type === "date") {
-        const y = (o == null ? void 0 : o.timeUnit) || "day";
-        let k = "DD/MM/YYYY";
-        y === "month" ? k = "MM YYYY" : y === "year" && (k = "YYYY"), w = d.xAxes.push(
-          X.new(t, {
-            categoryField: n.value,
-            renderer: v
+      m.grid.template.set("visible", !1);
+      const d = s[0];
+      let C, k = r;
+      if (d.type === "date") {
+        const x = (o == null ? void 0 : o.timeUnit) || "day";
+        let A = "DD/MM/YYYY";
+        x === "month" ? A = "MM YYYY" : x === "year" && (A = "YYYY"), C = h.xAxes.push(
+          G.new(t, {
+            categoryField: d.value,
+            renderer: m
           })
-        ), b = Y.orderBy(r, [n.value]), b = b.map((_) => ({
+        ), k = O.orderBy(r, [d.value]), k = k.map((_) => ({
           ..._,
-          [n.value]: oe(_[n.value]).format(k)
+          [d.value]: ne(_[d.value]).format(A)
         }));
       } else
-        w = d.xAxes.push(
-          X.new(t, {
-            categoryField: n.value,
-            renderer: v,
-            tooltip: J.new(t, {})
+        C = h.xAxes.push(
+          G.new(t, {
+            categoryField: d.value,
+            renderer: m,
+            tooltip: K.new(t, {})
           })
         );
-      const B = Y.uniqBy(b, n.value);
-      if (w.data.setAll(B), e.length === 1 && s.length > 1) {
-        const y = s[1].value, k = pe.new(t, {
+      const I = O.uniqBy(k, d.value);
+      if (C.data.setAll(I), e.length === 1 && s.length > 1) {
+        const x = s[1].value, A = fe.new(t, {
           visible: !1,
           minGridDistance: 20,
           inversed: !0
         });
-        k.grid.template.set("visible", !1);
-        const _ = d.yAxes.push(
-          X.new(t, {
+        A.grid.template.set("visible", !1);
+        const _ = h.yAxes.push(
+          G.new(t, {
             maxDeviation: 0,
-            renderer: k,
-            categoryField: y
+            renderer: A,
+            categoryField: x
           })
-        ), S = t.interfaceColors.get("background"), j = d.bottomAxesContainer.children.push(
-          V.new(t, {
+        ), q = t.interfaceColors.get("background"), M = h.bottomAxesContainer.children.push(
+          j.new(t, {
             orientation: "horizontal",
-            startColor: S,
-            endColor: (I = d.get("colors")) == null ? void 0 : I.getIndex(0),
+            startColor: q,
+            endColor: (E = h.get("colors")) == null ? void 0 : E.getIndex(0),
             startOpacity: 1,
             endOpacity: 1
           })
-        ), x = d.series.push(
-          ge.new(t, {
+        ), w = h.series.push(
+          be.new(t, {
             calculateAggregates: !0,
-            stroke: O(16777215),
+            stroke: D(16777215),
             clustered: !1,
-            xAxis: w,
+            xAxis: C,
             yAxis: _,
-            categoryXField: n.value,
-            categoryYField: y,
+            categoryXField: d.value,
+            categoryYField: x,
             valueField: e[0].dataFieldName
           })
         );
-        x.columns.template.setAll({
+        w.columns.template.setAll({
           tooltipText: "{categoryY}, {categoryX}: {value}",
           strokeOpacity: 1,
           strokeWidth: 2,
-          width: H(100),
-          height: H(100)
-        }), x.columns.template.events.on("pointerover", function(R) {
-          const N = R.target.dataItem;
-          N && j.showValue(N.get(y, 0));
-        }), x.events.on("datavalidated", function() {
-          j.set("startValue", x.getPrivate("valueLow")), j.set("endValue", x.getPrivate("valueHigh"));
-        }), x.set("heatRules", [
+          width: B(100),
+          height: B(100)
+        }), w.columns.template.events.on("pointerover", function(X) {
+          const Y = X.target.dataItem;
+          Y && M.showValue(Y.get(x, 0));
+        }), w.events.on("datavalidated", function() {
+          M.set("startValue", w.getPrivate("valueLow")), M.set("endValue", w.getPrivate("valueHigh"));
+        }), w.set("heatRules", [
           {
-            target: x.columns.template,
-            min: S,
-            max: (E = d.get("colors")) == null ? void 0 : E.getIndex(0),
+            target: w.columns.template,
+            min: q,
+            max: (S = h.get("colors")) == null ? void 0 : S.getIndex(0),
             dataField: "value",
             key: "fill"
           }
         ]);
-        const q = Y.uniqBy(b, y), M = [];
-        B.forEach((R) => {
-          q.forEach((N) => {
-            const z = {
-              [n.value]: R[n.value],
-              [y]: N[y]
-            }, U = Y.find(b, z);
-            U === void 0 ? M.push({
-              ...z,
+        const z = O.uniqBy(k, x), R = [];
+        I.forEach((X) => {
+          z.forEach((Y) => {
+            const U = {
+              [d.value]: X[d.value],
+              [x]: Y[x]
+            }, $ = O.find(k, U);
+            $ === void 0 ? R.push({
+              ...U,
               [e[0].dataFieldName]: 0
-            }) : M.push(U);
+            }) : R.push($);
           });
-        }), _.data.setAll(q), x.data.setAll(M);
+        }), _.data.setAll(z), w.data.setAll(R);
       }
-      d.appear(1e3, 100);
-    }, l), () => {
+      h.appear(1e3, 100);
+    }, n), () => {
       var t;
-      C && clearTimeout(C), (t = g.current) == null || t.dispose(), g.current = null;
+      y && clearTimeout(y), (t = b.current) == null || t.dispose(), b.current = null;
     };
-  }, [r, s, e, c.palette.mode, a]);
-  const A = { ...i };
-  return { chartId: h, ownerState: A, sx: m, other: f };
+  }, [r, s, e, l.palette.mode, a]);
+  const N = { ...i };
+  return { chartId: u, ownerState: N, sx: p, error: v, other: g };
 };
 export {
-  Ye as useHeatmapLogic
+  Oe as useHeatmapLogic
 };

package/dist/components/charts/highlighting-line-data/index.js

@@ -1,7 +1,7 @@
 import { jsxs as d, jsx as e } from "react/jsx-runtime";
 import { useHighlightLineChartLogic as g } from "./logic.js";
 import { HighlightLineChartRoot as c } from "./styled.js";
-function u(i) {
+const x = (i) => {
   const {
     chartDivRef: n,
     seriesData: o,
@@ -55,7 +55,7 @@ function u(i) {
       }
     )
   ] });
-}
+};
 export {
-  u as HighlightLineChart
+  x as HighlightLineChart
 };

package/dist/components/charts/line/index.js

@@ -1,10 +1,11 @@
-import { jsx as t } from "react/jsx-runtime";
-import { useLineChartLogic as n } from "./logic.js";
-import { LineChartRoot as m } from "./styled.js";
-function s(r) {
-  const { chartId: o, ownerState: i, sx: e, other: h } = n(r);
-  return /* @__PURE__ */ t(m, { ownerState: i, sx: e, ...h, children: /* @__PURE__ */ t("div", { id: o, style: { width: "100%", height: "100%" } }) });
-}
+import { jsx as r } from "react/jsx-runtime";
+import { ChartError as n } from "../_common/chart-error.js";
+import { useLineChartLogic as s } from "./logic.js";
+import { LineChartRoot as a } from "./styled.js";
+const C = (o) => {
+  const { chartId: e, ownerState: i, sx: h, error: t, other: m } = s(o);
+  return /* @__PURE__ */ r(a, { ownerState: i, sx: h, ...m, children: t ? /* @__PURE__ */ r(n, { message: t }) : /* @__PURE__ */ r("div", { id: e, style: { width: "100%", height: "100%" } }) });
+};
 export {
-  s as LineChart
+  C as LineChart
 };