@ledgerhq/lumen-ui-react-visualization 0.1.19 → 0.1.21

package/dist/lib/Components/CartesianChart/utils.d.ts

@@ -1,29 +1,6 @@
 import { ChartInset } from '../../utils/types';
 import { CartesianChartProps } from './types';
-export declare const DEFAULT_HEIGHT = 160;
-/**
- * Internal buffer added around the drawing area so SVG content (labels, points,
- * ticks) drawn at the edges is not clipped. The SVG canvas is enlarged by this
- * buffer on every side and shifted back by {@link OVERFLOW_OFFSET} so
- * the chart's layout footprint (and the drawing area) stays exactly the
- * consumer-provided width/height.
- */
-export declare const OVERFLOW_BUFFER: ChartInset;
-/**
- * Top/left offset applied to the (enlarged) SVG so its drawing area aligns with
- * the container's top-left. The extra width/height added to the SVG overflows
- * symmetrically on every side via `overflow: visible`.
- *
- * Uses `position: relative` rather than negative margins: a negative
- * `margin-top` would collapse through the container (which has no border,
- * padding, or block-formatting context), shifting the whole container instead
- * of offsetting the SVG inside it.
- */
-export declare const OVERFLOW_OFFSET: {
-    position: "relative";
-    top: number;
-    left: number;
-};
+export declare const DEFAULT_HEIGHT = 240;
 export declare const ZERO_PADDING: ChartInset;
 export declare const resolveInset: (inset: CartesianChartProps["inset"]) => ChartInset;
 export declare const resolveAxisPadding: (padding: CartesianChartProps["axisPadding"]) => ChartInset;

package/dist/lib/Components/CartesianChart/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/CartesianChart/utils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAEnD,eAAO,MAAM,cAAc,MAAM,CAAC;AAElC;;;;;;GAMG;AACH,eAAO,MAAM,eAAe,EAAE,UAK7B,CAAC;AACF;;;;;;;;;GASG;AACH,eAAO,MAAM,eAAe;;;;CAI3B,CAAC;AACF,eAAO,MAAM,YAAY,EAAE,UAK1B,CAAC;AAEF,eAAO,MAAM,YAAY,GACvB,OAAO,mBAAmB,CAAC,OAAO,CAAC,KAClC,UAqBF,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAC7B,SAAS,mBAAmB,CAAC,aAAa,CAAC,KAC1C,UAQF,CAAC"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/CartesianChart/utils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAEnD,eAAO,MAAM,cAAc,MAAM,CAAC;AAElC,eAAO,MAAM,YAAY,EAAE,UAK1B,CAAC;AAEF,eAAO,MAAM,YAAY,GACvB,OAAO,mBAAmB,CAAC,OAAO,CAAC,KAClC,UAqBF,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAC7B,SAAS,mBAAmB,CAAC,aAAa,CAAC,KAC1C,UAQF,CAAC"}

package/dist/lib/Components/CartesianChart/utils.js

@@ -1,41 +1,30 @@
-const l = 160, r = {
-  top: 25,
-  right: 25,
-  bottom: 25,
-  left: 25
-}, f = {
-  position: "relative",
-  top: -25,
-  left: -25
-}, e = {
+const e = 240, r = {
   top: 0,
   right: 0,
   bottom: 0,
   left: 0
-}, m = (t) => {
+}, l = (t) => {
   let o;
-  return t === void 0 ? o = e : typeof t == "number" ? o = { top: t, right: t, bottom: t, left: t } : o = {
+  return t === void 0 ? o = r : typeof t == "number" ? o = { top: t, right: t, bottom: t, left: t } : o = {
     top: t.top ?? 0,
     right: t.right ?? 0,
     bottom: t.bottom ?? 0,
     left: t.left ?? 0
   }, {
-    top: o.top + r.top,
-    right: o.right + r.right,
-    bottom: o.bottom + r.bottom,
-    left: o.left + r.left
+    top: o.top,
+    right: o.right,
+    bottom: o.bottom,
+    left: o.left
   };
-}, b = (t) => t === void 0 ? e : {
+}, f = (t) => t === void 0 ? r : {
   top: t.top ?? 0,
   right: t.right ?? 0,
   bottom: t.bottom ?? 0,
   left: t.left ?? 0
 };
 export {
-  l as DEFAULT_HEIGHT,
-  r as OVERFLOW_BUFFER,
-  f as OVERFLOW_OFFSET,
-  e as ZERO_PADDING,
-  b as resolveAxisPadding,
-  m as resolveInset
+  e as DEFAULT_HEIGHT,
+  r as ZERO_PADDING,
+  f as resolveAxisPadding,
+  l as resolveInset
 };

package/dist/lib/Components/Line/Line.d.ts

@@ -1,3 +1,3 @@
 import { LineProps } from './types';
-export declare function Line({ seriesId, stroke, showArea, areaType: _areaType, curve, }: LineProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function Line({ seriesId, stroke, showArea, areaType: _areaType, curve, connectNulls, }: LineProps): import("react/jsx-runtime").JSX.Element | null;
 //# sourceMappingURL=Line.d.ts.map

package/dist/lib/Components/Line/Line.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Line.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Line/Line.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAGzC,wBAAgB,IAAI,CAAC,EACnB,QAAQ,EACR,MAAM,EACN,QAAgB,EAChB,QAAQ,EAAE,SAAsB,EAChC,KAAK,GACN,EAAE,SAAS,kDAgFX"}
+{"version":3,"file":"Line.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Line/Line.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAGzC,wBAAgB,IAAI,CAAC,EACnB,QAAQ,EACR,MAAM,EACN,QAAgB,EAChB,QAAQ,EAAE,SAAsB,EAChC,KAAK,EACL,YAAY,GACb,EAAE,SAAS,kDAwFX"}

package/dist/lib/Components/Line/Line.js

@@ -1,34 +1,41 @@
-import { jsxs as d, jsx as o, Fragment as I } from "react/jsx-runtime";
-import { useId as T, useMemo as c } from "react";
-import { isNumericScale as k } from "../../utils/scales/scales.js";
-import { LINE_DEFAULT_STROKE_COLOR as y, LINE_AREA_GRADIENT_OPACITY as A, LINE_STROKE_WIDTH as O } from "./constants.js";
-import { toScaledPoints as P, buildLinePath as R, buildAreaPath as v } from "./utils.js";
-import { useCartesianChartContext as N } from "../CartesianChart/context/cartesianChartContext.js";
-import { useRevealClip as D } from "../CartesianChart/RevealClip/context.js";
-function Y({
+import { jsxs as c, jsx as o, Fragment as T } from "react/jsx-runtime";
+import { useId as k, useMemo as d } from "react";
+import { isNumericScale as y } from "../../utils/scales/scales.js";
+import { LINE_DEFAULT_STROKE_COLOR as A, LINE_AREA_GRADIENT_OPACITY as N, LINE_STROKE_WIDTH as O } from "./constants.js";
+import { toScaledPoints as v, buildLinePath as R, buildAreaPath as D } from "./utils.js";
+import { useCartesianChartContext as j } from "../CartesianChart/context/cartesianChartContext.js";
+import { usePathReveal as b } from "../CartesianChart/RevealAnimation/context.js";
+function U({
   seriesId: g,
-  stroke: h,
-  showArea: n = !1,
-  areaType: j = "gradient",
-  curve: C
+  stroke: C,
+  showArea: s = !1,
+  areaType: F = "gradient",
+  curve: x,
+  connectNulls: L
 }) {
-  const { getXScale: x, getYScale: L, getXAxisConfig: S, drawingArea: s, seriesMap: _ } = N(), E = D(), l = x(), r = L(), p = S(), f = T(), e = _.get(g), a = (h ?? e?.stroke) || y, i = C ?? e?.curve, t = c(
-    () => e?.data && l && r && k(r) ? P(e.data, l, r, p?.data) : null,
-    [e, l, r, p]
-  ), u = c(
-    () => t ? R(t, i) : null,
-    [t, i]
-  ), m = c(
-    () => n && t && s ? v(t, s, i) : null,
-    [n, t, s, i]
+  const { getXScale: S, getYScale: _, getXAxisConfig: E, drawingArea: i, seriesMap: I } = j(), P = b(), l = S(), n = _(), p = E(), u = k(), t = I.get(g), r = (C ?? t?.stroke) || A, a = x ?? t?.curve, f = L ?? t?.connectNulls ?? !1, e = d(
+    () => t?.data && l && n && y(n) ? v(
+      t.data,
+      l,
+      n,
+      p?.data,
+      f
+    ) : null,
+    [t, l, n, p, f]
+  ), m = d(
+    () => e ? R(e, a) : null,
+    [e, a]
+  ), h = d(
+    () => s && e && i ? D(e, i, a) : null,
+    [s, e, i, a]
   );
-  return u ? /* @__PURE__ */ d("g", { clipPath: E, children: [
-    n && m && a && /* @__PURE__ */ d(I, { children: [
-      /* @__PURE__ */ o("defs", { children: /* @__PURE__ */ d(
+  return m ? /* @__PURE__ */ c("g", { clipPath: P, children: [
+    s && h && r && /* @__PURE__ */ c(T, { children: [
+      /* @__PURE__ */ o("defs", { children: /* @__PURE__ */ c(
         "linearGradient",
         {
           "data-testid": "line-gradient",
-          id: f,
+          id: u,
           x1: "0",
           y1: "0",
           x2: "0",
@@ -38,11 +45,11 @@ function Y({
               "stop",
               {
                 offset: "0%",
-                stopColor: a,
-                stopOpacity: A
+                stopColor: r,
+                stopOpacity: N
               }
             ),
-            /* @__PURE__ */ o("stop", { offset: "100%", stopColor: a, stopOpacity: 0 })
+            /* @__PURE__ */ o("stop", { offset: "100%", stopColor: r, stopOpacity: 0 })
           ]
         }
       ) }),
@@ -50,8 +57,8 @@ function Y({
         "path",
         {
           "data-testid": "line-area",
-          d: m,
-          fill: `url(#${f})`,
+          d: h,
+          fill: `url(#${u})`,
           stroke: "none"
         }
       )
@@ -60,9 +67,9 @@ function Y({
       "path",
       {
         "data-testid": "line-path",
-        d: u,
+        d: m,
         fill: "none",
-        stroke: a,
+        stroke: r,
         strokeWidth: O,
         strokeLinecap: "round",
         strokeLinejoin: "round"
@@ -71,5 +78,5 @@ function Y({
   ] }) : null;
 }
 export {
-  Y as Line
+  U as Line
 };

package/dist/lib/Components/Line/types.d.ts

@@ -28,5 +28,12 @@ export type LineProps = {
      * @default 'bump'
      */
     curve?: CurveType;
+    /**
+     * When true, skips null values and draws a continuous line across gaps.
+     * When false, null values create gaps in the line.
+     * When omitted, falls back to the `connectNulls` defined on the series.
+     * @default false
+     */
+    connectNulls?: boolean;
 };
 //# sourceMappingURL=types.d.ts.map

package/dist/lib/Components/Line/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Line/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAEnD,YAAY,EAAE,SAAS,EAAE,CAAC;AAE1B,MAAM,MAAM,SAAS,GAAG;IACtB;;;OAGG;IACH,QAAQ,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,UAAU,CAAC;IACtB;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Line/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAEnD,YAAY,EAAE,SAAS,EAAE,CAAC;AAE1B,MAAM,MAAM,SAAS,GAAG;IACtB;;;OAGG;IACH,QAAQ,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,UAAU,CAAC;IACtB;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;;OAKG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,CAAC"}

package/dist/lib/Components/Line/utils.d.ts

@@ -1,7 +1,7 @@
 import { ChartScaleFunction, CurveType, DrawingArea, NumericScale } from '../../utils/types';
-type Point = [x: number, y: number];
+type Point = [x: number, y: number | null];
 /**
- * Project series data into scaled [x, y] pixel coordinates, skipping nulls.
+ * Project series data into scaled [x, y] pixel coordinates.
  *
  * When `xData` contains numeric values, those values are fed into the scale
  * instead of the array index so the points honour a numeric X domain.
@@ -9,8 +9,13 @@ type Point = [x: number, y: number];
  * When `xData` is provided, iteration is capped at `xData.length` so a series
  * with more points than the axis has labels does not overflow past the right
  * edge of the chart. The axis is treated as authoritative for the X domain.
+ *
+ * Null values (and other non-finite numbers) are handled according to `connectNulls`:
+ * - `false` (default): kept as `[x, null]` holes so the line/area break into
+ *   gaps via the generators' `.defined()` check.
+ * - `true`: skipped entirely so the line is drawn continuously across gaps.
  */
-export declare const toScaledPoints: (data: (number | null)[], xScale: ChartScaleFunction, yScale: NumericScale, xData?: readonly (string | number)[]) => Point[] | null;
+export declare const toScaledPoints: (data: (number | null)[], xScale: ChartScaleFunction, yScale: NumericScale, xData?: readonly (string | number)[], connectNulls?: boolean) => Point[] | null;
 /**
  * Build the SVG `d` attribute for the line stroke.
  */

package/dist/lib/Components/Line/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Line/utils.ts"],"names":[],"mappings":"AAeA,OAAO,KAAK,EACV,kBAAkB,EAClB,SAAS,EACT,WAAW,EACX,YAAY,EACb,MAAM,mBAAmB,CAAC;AAE3B,KAAK,KAAK,GAAG,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,CAAC,CAAC;AAoBpC;;;;;;;;;GASG;AACH,eAAO,MAAM,cAAc,GACzB,MAAM,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE,EACvB,QAAQ,kBAAkB,EAC1B,QAAQ,YAAY,EACpB,QAAQ,SAAS,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,KACnC,KAAK,EAAE,GAAG,IAoBZ,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,aAAa,GACxB,QAAQ,KAAK,EAAE,EACf,QAAQ,SAAS,KAChB,MAAM,GAAG,IAOX,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,aAAa,GACxB,QAAQ,KAAK,EAAE,EACf,aAAa,WAAW,EACxB,QAAQ,SAAS,KAChB,MAAM,GAAG,IAUX,CAAC"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/Line/utils.ts"],"names":[],"mappings":"AAeA,OAAO,KAAK,EACV,kBAAkB,EAClB,SAAS,EACT,WAAW,EACX,YAAY,EACb,MAAM,mBAAmB,CAAC;AAE3B,KAAK,KAAK,GAAG,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC,CAAC;AAoB3C;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,cAAc,GACzB,MAAM,CAAC,MAAM,GAAG,IAAI,CAAC,EAAE,EACvB,QAAQ,kBAAkB,EAC1B,QAAQ,YAAY,EACpB,QAAQ,SAAS,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,EACpC,sBAAoB,KACnB,KAAK,EAAE,GAAG,IA4BZ,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,aAAa,GACxB,QAAQ,KAAK,EAAE,EACf,QAAQ,SAAS,KAChB,MAAM,GAAG,IAQX,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,aAAa,GACxB,QAAQ,KAAK,EAAE,EACf,aAAa,WAAW,EACxB,QAAQ,SAAS,KAChB,MAAM,GAAG,IAWX,CAAC"}

package/dist/lib/Components/Line/utils.js

@@ -1,35 +1,40 @@
-import { isFiniteNumber as b } from "../../utils/numbers.js";
-import { isCategoricalScale as y } from "../../utils/scales/scales.js";
-import v from "../../../node_modules/d3-shape/src/line.js";
-import g, { stepBefore as C, stepAfter as A } from "../../../node_modules/d3-shape/src/curve/step.js";
-import E from "../../../node_modules/d3-shape/src/curve/natural.js";
-import { monotoneX as F } from "../../../node_modules/d3-shape/src/curve/monotone.js";
+import { isFiniteNumber as y } from "../../utils/numbers.js";
+import { isCategoricalScale as d } from "../../utils/scales/scales.js";
+import C from "../../../node_modules/d3-shape/src/line.js";
+import g, { stepBefore as F, stepAfter as a } from "../../../node_modules/d3-shape/src/curve/step.js";
+import A from "../../../node_modules/d3-shape/src/curve/natural.js";
+import { monotoneX as E } from "../../../node_modules/d3-shape/src/curve/monotone.js";
 import B from "../../../node_modules/d3-shape/src/curve/linear.js";
 import { bumpX as L } from "../../../node_modules/d3-shape/src/curve/bump.js";
 import P from "../../../node_modules/d3-shape/src/area.js";
-const p = {
+const f = {
   bump: L,
   linear: B,
-  monotone: F,
-  natural: E,
+  monotone: E,
+  natural: A,
   step: g,
-  stepAfter: A,
-  stepBefore: C
-}, s = "bump", c = (t = s) => p[t] ?? p[s], _ = (t, o, r, e) => {
-  const n = [], l = e ? Math.min(t.length, e.length) : t.length;
-  for (let i = 0; i < l; i++) {
-    const m = t[i];
-    if (!b(m)) continue;
-    const u = e && typeof e[i] == "number" ? e[i] : i, f = y(o) ? (o(u) ?? 0) + o.bandwidth() / 2 : o(u), h = r(m);
-    n.push([f, h]);
+  stepAfter: a,
+  stepBefore: F
+}, h = "bump", b = (t = h) => f[t] ?? f[h], O = (t, e, o, n, r = !1) => {
+  const u = [], v = n ? Math.min(t.length, n.length) : t.length;
+  let m = 0;
+  for (let i = 0; i < v; i++) {
+    const l = t[i], s = y(l);
+    if (!s && r) continue;
+    const p = n && typeof n[i] == "number" ? n[i] : i, c = d(e) ? (e(p) ?? 0) + e.bandwidth() / 2 : e(p);
+    if (!s) {
+      u.push([c, null]);
+      continue;
+    }
+    u.push([c, o(l)]), m++;
   }
-  return n.length >= 2 ? n : null;
-}, M = (t, o) => v().x((r) => r[0]).y((r) => r[1]).curve(c(o))(t) ?? null, O = (t, o, r) => {
-  const e = o.y + o.height;
-  return P().x((n) => n[0]).y0(e).y1((n) => n[1]).curve(c(r))(t) ?? null;
+  return m >= 2 ? u : null;
+}, S = (t, e) => C().defined((o) => o[1] !== null).x((o) => o[0]).y((o) => o[1]).curve(b(e))(t) ?? null, j = (t, e, o) => {
+  const n = e.y + e.height;
+  return P().defined((r) => r[1] !== null).x((r) => r[0]).y0(n).y1((r) => r[1]).curve(b(o))(t) ?? null;
 };
 export {
-  O as buildAreaPath,
-  M as buildLinePath,
-  _ as toScaledPoints
+  j as buildAreaPath,
+  S as buildLinePath,
+  O as toScaledPoints
 };

package/dist/lib/Components/LineChart/LineChart.d.ts

@@ -1,3 +1,3 @@
 import { LineChartProps } from './types';
-export declare function LineChart({ series, showArea, areaType, showXAxis, showYAxis, xAxis, yAxis, width, height, inset, enableScrubbing, onScrubberPositionChange, animate, magnetRadius, loading, emptyLabel, children, }: Readonly<LineChartProps>): import("react/jsx-runtime").JSX.Element;
+export declare function LineChart({ series, showArea, areaType, connectNulls, showXAxis, showYAxis, xAxis, yAxis, width, height, inset, enableScrubbing, onScrubberPositionChange, animate, magnetRadius, loading, emptyLabel, children, }: Readonly<LineChartProps>): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=LineChart.d.ts.map

package/dist/lib/Components/LineChart/LineChart.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LineChart.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/LineChart/LineChart.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAGV,cAAc,EACf,MAAM,SAAS,CAAC;AAiFjB,wBAAgB,SAAS,CAAC,EACxB,MAAM,EACN,QAAgB,EAChB,QAAqB,EACrB,SAAiB,EACjB,SAAiB,EACjB,KAAK,EACL,KAAK,EACL,KAAc,EACd,MAAY,EACZ,KAAK,EACL,eAAe,EACf,wBAAwB,EACxB,OAAO,EACP,YAAY,EACZ,OAAe,EACf,UAAsB,EACtB,QAAQ,GACT,EAAE,QAAQ,CAAC,cAAc,CAAC,2CA+E1B"}
+{"version":3,"file":"LineChart.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/LineChart/LineChart.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAGV,cAAc,EAEf,MAAM,SAAS,CAAC;AA0FjB,wBAAgB,SAAS,CAAC,EACxB,MAAM,EACN,QAAgB,EAChB,QAAqB,EACrB,YAAY,EACZ,SAAiB,EACjB,SAAiB,EACjB,KAAK,EACL,KAAK,EACL,KAAc,EACd,MAAY,EACZ,KAAK,EACL,eAAe,EACf,wBAAwB,EACxB,OAAO,EACP,YAAY,EACZ,OAAe,EACf,UAAsB,EACtB,QAAQ,GACT,EAAE,QAAQ,CAAC,cAAc,CAAC,2CAgF1B"}

package/dist/lib/Components/LineChart/LineChart.js

@@ -1,144 +1,156 @@
-import { jsx as i, jsxs as P, Fragment as h } from "react/jsx-runtime";
-import { useMemo as F } from "react";
-import { ChartEmptyLabel as I } from "../CartesianChart/ChartEmptyLabel/ChartEmptyLabel.js";
-import { useShimmerAnimation as M } from "../CartesianChart/hooks/useShimmerAnimation.js";
-import { computeAxisPadding as N, canRenderLine as R, getChartDisplayState as W } from "./utils.js";
-import { defaultXAxisProps as y, defaultYAxisProps as f } from "../Axis/Axis.constants.js";
-import { CartesianChart as q } from "../CartesianChart/CartesianChart.js";
-import { LineChartEmptyState as z } from "./LineChartEmptyState/LineChartEmptyState.js";
-import { XAxis as G } from "../Axis/XAxis/XAxis.js";
-import { YAxis as H } from "../Axis/YAxis/YAxis.js";
-import { Line as J } from "../Line/Line.js";
-const A = ({
+import { jsx as i, jsxs as A, Fragment as g } from "react/jsx-runtime";
+import { useMemo as I } from "react";
+import { ChartEmptyLabel as M } from "../CartesianChart/ChartEmptyLabel/ChartEmptyLabel.js";
+import { useShimmerAnimation as R } from "../CartesianChart/hooks/useShimmerAnimation.js";
+import { computeAxisPadding as V, canRenderLine as W, getChartDisplayState as q } from "./utils.js";
+import { defaultXAxisProps as P, defaultYAxisProps as h } from "../Axis/Axis.constants.js";
+import { CartesianChart as z } from "../CartesianChart/CartesianChart.js";
+import { LineChartEmptyState as G } from "./LineChartEmptyState/LineChartEmptyState.js";
+import { XAxis as H } from "../Axis/XAxis/XAxis.js";
+import { YAxis as J } from "../Axis/YAxis/YAxis.js";
+import { Line as K } from "../Line/Line.js";
+import { cssVar as N } from "../../../libs/design-core/dist/lib/cssVar/cssVar.js";
+const k = ({
   series: o,
-  showArea: n,
-  areaType: r
-}) => /* @__PURE__ */ i(h, { children: o.map((t) => /* @__PURE__ */ i(
-  J,
+  showArea: r,
+  areaType: a,
+  connectNulls: s,
+  stroke: n
+}) => /* @__PURE__ */ i(g, { children: o.map((t) => /* @__PURE__ */ i(
+  K,
   {
     seriesId: t.id,
-    stroke: t.stroke,
-    showArea: n,
-    areaType: r
+    stroke: n ?? t.stroke,
+    showArea: r,
+    areaType: a,
+    connectNulls: s
   },
   t.id
-)) }), K = ({
+)) }), O = ({
   series: o,
-  showArea: n,
-  areaType: r
+  showArea: r,
+  areaType: a,
+  connectNulls: s
 }) => {
-  const { animationStyle: t, keyframe: a } = M();
-  return /* @__PURE__ */ P(h, { children: [
-    /* @__PURE__ */ i("style", { children: a }),
-    /* @__PURE__ */ i("g", { style: { animation: t }, children: /* @__PURE__ */ i(
-      A,
+  const { animationStyle: n, keyframe: t } = R();
+  return /* @__PURE__ */ A(g, { children: [
+    /* @__PURE__ */ i("style", { children: t }),
+    /* @__PURE__ */ i("g", { style: { animation: n }, children: /* @__PURE__ */ i(
+      k,
       {
         series: o,
-        showArea: n,
-        areaType: r
+        showArea: r,
+        areaType: a,
+        connectNulls: s,
+        stroke: N("var(--border-muted-subtle)")
       }
     ) })
   ] });
-}, O = ({
+}, Q = ({
   series: o,
-  showArea: n,
-  areaType: r,
-  showXAxis: t,
-  showYAxis: a,
-  xAxisConfig: m,
-  yAxisConfig: s,
-  isTransitionLoading: p,
-  children: c
-}) => /* @__PURE__ */ P(h, { children: [
-  t && /* @__PURE__ */ i(G, { ...m }),
-  a && /* @__PURE__ */ i(H, { ...s }),
-  p ? /* @__PURE__ */ i(
-    K,
+  showArea: r,
+  areaType: a,
+  connectNulls: s,
+  showXAxis: n,
+  showYAxis: t,
+  xAxisConfig: d,
+  yAxisConfig: e,
+  isTransitionLoading: c,
+  children: f
+}) => /* @__PURE__ */ A(g, { children: [
+  n && /* @__PURE__ */ i(H, { ...d }),
+  t && /* @__PURE__ */ i(J, { ...e }),
+  c ? /* @__PURE__ */ i(
+    O,
     {
       series: o,
-      showArea: n,
-      areaType: r
+      showArea: r,
+      areaType: a,
+      connectNulls: s
     }
   ) : /* @__PURE__ */ i(
-    A,
+    k,
     {
       series: o,
-      showArea: n,
-      areaType: r
+      showArea: r,
+      areaType: a,
+      connectNulls: s
     }
   ),
-  c
+  f
 ] });
-function ri({
+function ei({
   series: o,
-  showArea: n = !1,
-  areaType: r = "gradient",
-  showXAxis: t = !1,
-  showYAxis: a = !1,
-  xAxis: m,
-  yAxis: s,
-  width: p = "100%",
-  height: c = 240,
+  showArea: r = !1,
+  areaType: a = "gradient",
+  connectNulls: s,
+  showXAxis: n = !1,
+  showYAxis: t = !1,
+  xAxis: d,
+  yAxis: e,
+  width: c = "100%",
+  height: f = 240,
   inset: S,
-  enableScrubbing: k,
-  onScrubberPositionChange: j,
-  animate: v,
+  enableScrubbing: b,
+  onScrubberPositionChange: v,
+  animate: j,
   magnetRadius: D,
-  loading: g = !1,
-  emptyLabel: u = "No data",
+  loading: u = !1,
+  emptyLabel: C = "No data",
   children: E
 }) {
-  const d = {
-    ...y,
-    ...m,
-    position: m?.position ?? y.position
+  const p = {
+    ...P,
+    ...d,
+    position: d?.position ?? P.position
   }, l = {
-    ...f,
-    ...s,
-    position: s?.position ?? f.position,
-    width: s?.width ?? f.width
-  }, C = d.position, L = l.position, x = l.width, T = F(
-    () => N({
-      showXAxis: t,
-      showYAxis: a,
-      xAxisPosition: C,
-      yAxisPosition: L,
-      yAxisWidth: x
+    ...h,
+    ...e,
+    position: e?.position ?? h.position,
+    width: e?.width ?? h.width
+  }, L = p.position, x = l.position, y = l.width, T = I(
+    () => V({
+      showXAxis: n,
+      showYAxis: t,
+      xAxisPosition: L,
+      yAxisPosition: x,
+      yAxisWidth: y
     }),
-    [t, a, C, L, x]
-  ), b = R(o, d.data), { status: e, ariaLabel: B } = W({
-    loading: g,
-    hasData: b,
-    emptyLabel: u
+    [n, t, L, x, y]
+  ), B = W(o, p.data), { status: m, ariaLabel: F } = q({
+    loading: u,
+    hasData: B,
+    emptyLabel: C
   });
   return /* @__PURE__ */ i(
-    q,
+    z,
     {
       series: o ?? [],
-      xAxis: d,
+      xAxis: p,
       yAxis: l,
-      width: p,
-      height: c,
+      width: c,
+      height: f,
       inset: S,
       axisPadding: T,
-      enableScrubbing: k,
-      onScrubberPositionChange: j,
-      animate: v,
+      enableScrubbing: b,
+      onScrubberPositionChange: v,
+      animate: j,
       magnetRadius: D,
-      ariaLabel: B,
-      ariaBusy: g,
-      overlay: e === "empty" ? /* @__PURE__ */ i(I, { children: u }) : void 0,
-      children: e === "initial-loading" || e === "empty" ? /* @__PURE__ */ i(z, { loading: e === "initial-loading" }) : /* @__PURE__ */ i(
-        O,
+      ariaLabel: F,
+      ariaBusy: u,
+      overlay: m === "empty" ? /* @__PURE__ */ i(M, { children: C }) : void 0,
+      children: m === "initial-loading" || m === "empty" ? /* @__PURE__ */ i(G, { loading: m === "initial-loading" }) : /* @__PURE__ */ i(
+        Q,
         {
           series: o ?? [],
-          showArea: n,
-          areaType: r,
-          showXAxis: t,
-          showYAxis: a,
-          xAxisConfig: d,
+          showArea: r,
+          areaType: a,
+          connectNulls: s,
+          showXAxis: n,
+          showYAxis: t,
+          xAxisConfig: p,
           yAxisConfig: l,
-          isTransitionLoading: e === "transition-loading",
+          isTransitionLoading: m === "transition-loading",
           children: E
         }
       )
@@ -146,5 +158,5 @@ function ri({
   );
 }
 export {
-  ri as LineChart
+  ei as LineChart
 };