@undp/data-viz 1.5.6 → 1.5.8

package/dist/LineChartWithConfidenceInterval.js

@@ -5,12 +5,12 @@ import { l as Wt, a as Ft } from "./simple-statistics-flVzqVtt.js";
 import { o as Ht } from "./index-DvVprvy6.js";
 import { n as lt } from "./numberFormattingFunction-14YCbkN2.js";
 import { T as Yt } from "./Tooltip-CVCGWyzw.js";
-import { c as v } from "./checkIfNullOrUndefined-DmfiKkNw.js";
+import { c as j } from "./checkIfNullOrUndefined-DmfiKkNw.js";
 import { C as Pt, g as Et, A as Xt } from "./customArea-B-dWU0zZ.js";
 import { A as Gt } from "./AxisTitle-BmHLMRJZ.js";
 import { A as Bt } from "./Axis-Ddg-seDi.js";
 import { R as zt } from "./ReferenceLine-CfAW3vKJ.js";
-import { R as Ut } from "./RegressionLine-mH7UKOPi.js";
+import { R as Ut } from "./RegressionLine-C2--oMQq.js";
 import { Y as qt } from "./YTicksAndGridLines-B6ah7CRf.js";
 import { H as Jt } from "./index-DKCxu1Gh.js";
 import { t as Kt } from "./time-BzJP5SPC.js";
@@ -27,22 +27,22 @@ import { GraphFooter as li } from "./GraphFooter.js";
 import { GraphHeader as ci } from "./GraphHeader.js";
 import { Colors as ct } from "./Colors.js";
 import { ColorLegend as mi } from "./ColorLegend.js";
-import { E as yi } from "./EmptyState-DdTp-Mdn.js";
-function xi(yt) {
+import { E as xi } from "./EmptyState-DdTp-Mdn.js";
+function hi(xt) {
   const {
     data: V,
-    width: C,
+    width: b,
     height: W,
-    lineColor: k,
-    suffix: L,
-    prefix: f,
+    lineColor: L,
+    suffix: D,
+    prefix: w,
     dateFormat: s,
-    highlightAreaSettings: x,
+    highlightAreaSettings: h,
     showValues: z,
-    noOfXTicks: xt,
-    rightMargin: ht,
-    leftMargin: j,
-    topMargin: b,
+    noOfXTicks: ht,
+    rightMargin: yt,
+    leftMargin: M,
+    topMargin: A,
     bottomMargin: U,
     tooltip: q,
     onSeriesMouseOver: F,
@@ -56,27 +56,27 @@ function xi(yt) {
     annotations: pt,
     customHighlightAreaSettings: gt,
     regressionLine: H,
-    showIntervalDots: dt,
-    showIntervalValues: ft,
+    showIntervalDots: ft,
+    showIntervalValues: dt,
     intervalLineStrokeWidth: Y,
-    intervalLineColors: A,
+    intervalLineColors: p,
     intervalAreaColor: wt,
     intervalAreaOpacity: vt,
     yAxisTitle: _,
     noOfYTicks: jt,
     minDate: P,
     maxDate: E,
-    curveType: D,
+    curveType: N,
     styles: c,
     classNames: m,
-    precision: N,
+    precision: I,
     customLayers: tt
-  } = yt, it = mt(null), l = si(it, {
+  } = xt, it = mt(null), l = si(it, {
     once: n.once,
     amount: n.amount
-  }), [y, Mt] = R(!1);
+  }), [x, Mt] = R(!1);
   Vt(() => {
-    if (l && !y) {
+    if (l && !x) {
       const t = setTimeout(
         () => {
           Mt(!0);
@@ -85,23 +85,23 @@ function xi(yt) {
       );
       return () => clearTimeout(t);
     }
-  }, [l, y, n.duration]);
-  const S = D === "linear" ? Zt : D === "step" ? _t : D === "stepAfter" ? ti : D === "stepBefore" ? ii : ei, [I, et] = R(void 0), [at, nt] = R(void 0), [X, G] = R(void 0), p = {
-    top: b,
+  }, [l, x, n.duration]);
+  const S = N === "linear" ? Zt : N === "step" ? _t : N === "stepAfter" ? ti : N === "stepBefore" ? ii : ei, [k, et] = R(void 0), [at, nt] = R(void 0), [X, G] = R(void 0), g = {
+    top: A,
     bottom: U,
-    left: _ ? j + 30 : j,
-    right: ht
-  }, M = mt(null), a = Ht(
-    V.filter((t) => !v(t.y)).map((t) => ({
+    left: _ ? M + 30 : M,
+    right: yt
+  }, C = mt(null), a = Ht(
+    V.filter((t) => !j(t.y)).map((t) => ({
       date: u(`${t.date}`, s, /* @__PURE__ */ new Date()),
       y: t.y,
-      yMin: v(t.yMin) ? t.y : t.yMin,
-      yMax: v(t.yMax) ? t.y : t.yMax,
+      yMin: j(t.yMin) ? t.y : t.yMin,
+      yMax: j(t.yMax) ? t.y : t.yMax,
       data: t.data
     })),
     ["date"],
     ["asc"]
-  ), Ct = x.map((t) => ({
+  ), Ct = h.map((t) => ({
     ...t,
     coordinates: [
       t.coordinates[0] === null ? null : u(`${t.coordinates[0]}`, s, /* @__PURE__ */ new Date()),
@@ -110,12 +110,12 @@ function xi(yt) {
   })), bt = gt.map((t) => ({
     ...t,
     coordinates: t.coordinates.map(
-      (g, O) => O % 2 === 0 ? u(`${g}`, s, /* @__PURE__ */ new Date()) : g
+      (f, O) => O % 2 === 0 ? u(`${f}`, s, /* @__PURE__ */ new Date()) : f
     )
-  })), r = C - p.left - p.right, w = W - p.top - p.bottom, ot = P ? u(`${P}`, s, /* @__PURE__ */ new Date()) : a[0].date, rt = E ? u(`${E}`, s, /* @__PURE__ */ new Date()) : a[a.length - 1].date, h = v(K) ? Math.min(...a.map((t) => Math.min(t.y, t.yMax, t.yMin))) ? Math.min(...a.map((t) => Math.min(t.y, t.yMax, t.yMin))) > 0 ? 0 : Math.min(...a.map((t) => Math.min(t.y, t.yMax, t.yMin))) : 0 : K, T = Math.max(...a.map((t) => Math.max(t.y, t.yMax, t.yMin))) ? Math.max(...a.map((t) => Math.max(t.y, t.yMax, t.yMin))) : 0, e = Kt().domain([ot, rt]).range([0, r]), o = Qt().domain([
-    h,
-    v(Q) ? T > 0 ? T : 0 : Q
-  ]).range([w, 0]).nice(), Lt = Ot().x((t) => e(t.date)).y((t) => o(t.y)).curve(S), Dt = Ot().x((t) => e(t.date)).y((t) => o(t.yMin)).curve(S), Nt = Ot().x((t) => e(t.date)).y((t) => o(t.yMax)).curve(S), It = ai().x((t) => e(t.date)).y0((t) => o(t.yMin)).y1((t) => o(t.yMax)).curve(S), kt = o.ticks(jt), St = e.ticks(xt);
+  })), r = b - g.left - g.right, v = W - g.top - g.bottom, ot = P ? u(`${P}`, s, /* @__PURE__ */ new Date()) : a[0].date, rt = E ? u(`${E}`, s, /* @__PURE__ */ new Date()) : a[a.length - 1].date, y = j(K) ? Math.min(...a.map((t) => Math.min(t.y, t.yMax, t.yMin))) ? Math.min(...a.map((t) => Math.min(t.y, t.yMax, t.yMin))) > 0 ? 0 : Math.min(...a.map((t) => Math.min(t.y, t.yMax, t.yMin))) : 0 : K, T = Math.max(...a.map((t) => Math.max(t.y, t.yMax, t.yMin))) ? Math.max(...a.map((t) => Math.max(t.y, t.yMax, t.yMin))) : 0, e = Kt().domain([ot, rt]).range([0, r]), o = Qt().domain([
+    y,
+    j(Q) ? T > 0 ? T : 0 : Q
+  ]).range([v, 0]).nice(), Lt = Ot().x((t) => e(t.date)).y((t) => o(t.y)).curve(S), Dt = Ot().x((t) => e(t.date)).y((t) => o(t.yMin)).curve(S), Nt = Ot().x((t) => e(t.date)).y((t) => o(t.yMax)).curve(S), It = ai().x((t) => e(t.date)).y0((t) => o(t.yMin)).y1((t) => o(t.yMax)).curve(S), kt = o.ticks(jt), St = e.ticks(ht);
   Vt(() => {
     const t = (O) => {
       const st = a[oi(
@@ -124,30 +124,30 @@ function xi(yt) {
         0
       )];
       et(st || a[a.length - 1]), F?.(st || a[a.length - 1]), G(O.clientY), nt(O.clientX);
-    }, g = () => {
+    }, f = () => {
       et(void 0), nt(void 0), G(void 0), F?.(void 0);
     };
-    ni(M.current).on("mousemove", t).on("mouseout", g);
+    ni(C.current).on("mousemove", t).on("mouseout", f);
   }, [e, a, F]);
   const Tt = Wt(
-    a.filter((t) => !v(t.date) && !v(t.y)).map((t) => [e(t.date), o(t.y)])
+    a.filter((t) => !j(t.date) && !j(t.y)).map((t) => [e(t.date), o(t.y)])
   ), $t = Ft(Tt);
   return /* @__PURE__ */ i.jsxs(i.Fragment, { children: [
     /* @__PURE__ */ i.jsx(
       d.svg,
       {
-        width: `${C}px`,
+        width: `${b}px`,
         height: `${W}px`,
-        viewBox: `0 0 ${C} ${W}`,
+        viewBox: `0 0 ${b} ${W}`,
         direction: "ltr",
         ref: it,
-        children: /* @__PURE__ */ i.jsxs("g", { transform: `translate(${p.left},${p.top})`, children: [
+        children: /* @__PURE__ */ i.jsxs("g", { transform: `translate(${g.left},${g.top})`, children: [
           /* @__PURE__ */ i.jsx(
             Jt,
             {
               areaSettings: Ct,
               width: r,
-              height: w,
+              height: v,
               scale: e,
               animate: n,
               isInView: l
@@ -169,8 +169,8 @@ function xi(yt) {
               {
                 values: kt.filter((t) => t !== 0),
                 y: kt.filter((t) => t !== 0).map((t) => o(t)),
-                x1: 0 - j,
-                x2: r + p.right,
+                x1: 0 - M,
+                x2: r + g.right,
                 styles: {
                   gridLines: c?.yAxis?.gridLines,
                   labels: c?.yAxis?.labels
@@ -179,31 +179,31 @@ function xi(yt) {
                   gridLines: m?.yAxis?.gridLines,
                   labels: m?.yAxis?.labels
                 },
-                suffix: L,
-                prefix: f,
+                suffix: D,
+                prefix: w,
                 labelType: "secondary",
                 showGridLines: !0,
                 labelPos: "vertical",
-                precision: N
+                precision: I
               }
             ),
             /* @__PURE__ */ i.jsx(
               Bt,
               {
-                y1: o(h < 0 ? 0 : h),
-                y2: o(h < 0 ? 0 : h),
-                x1: 0 - j,
-                x2: r + p.right,
+                y1: o(y < 0 ? 0 : y),
+                y2: o(y < 0 ? 0 : y),
+                x1: 0 - M,
+                x2: r + g.right,
                 label: lt(
-                  h < 0 ? 0 : h,
+                  y < 0 ? 0 : y,
                   "NA",
-                  N,
-                  f,
-                  L
+                  I,
+                  w,
+                  D
                 ),
                 labelPos: {
-                  x: 0 - j,
-                  y: o(h < 0 ? 0 : h),
+                  x: 0 - M,
+                  y: o(y < 0 ? 0 : y),
                   dx: 0,
                   dy: T < 0 ? "1em" : -5
                 },
@@ -220,8 +220,8 @@ function xi(yt) {
             /* @__PURE__ */ i.jsx(
               Gt,
               {
-                x: 0 - j + 15,
-                y: w / 2,
+                x: 0 - M + 15,
+                y: v / 2,
                 style: c?.yAxis?.title,
                 className: m?.yAxis?.title,
                 text: _,
@@ -229,17 +229,17 @@ function xi(yt) {
               }
             )
           ] }),
-          /* @__PURE__ */ i.jsx("g", { children: St.map((t, g) => /* @__PURE__ */ i.jsx("g", { children: /* @__PURE__ */ i.jsx(
+          /* @__PURE__ */ i.jsx("g", { children: St.map((t, f) => /* @__PURE__ */ i.jsx("g", { children: /* @__PURE__ */ i.jsx(
             "text",
             {
-              y: w,
+              y: v,
               x: e(t),
               style: { textAnchor: "middle" },
               className: "fill-primary-gray-700 dark:fill-primary-gray-300 xs:max-[360px]:hidden text-[9px] md:text-[10px] lg:text-xs",
               dy: 15,
               children: Rt(t, s)
             }
-          ) }, g)) }),
+          ) }, f)) }),
           tt.filter((t) => t.position === "before").map((t) => t.layer),
           /* @__PURE__ */ i.jsx(
             d.path,
@@ -265,7 +265,7 @@ function xi(yt) {
               d.path,
               {
                 style: {
-                  stroke: A[0],
+                  stroke: p[0],
                   fill: "none",
                   strokeWidth: Y
                 },
@@ -291,7 +291,7 @@ function xi(yt) {
               d.path,
               {
                 style: {
-                  stroke: A[1],
+                  stroke: p[1],
                   fill: "none",
                   strokeWidth: Y
                 },
@@ -318,7 +318,7 @@ function xi(yt) {
             d.path,
             {
               style: {
-                stroke: k,
+                stroke: L,
                 fill: "none",
                 strokeWidth: ut
               },
@@ -340,13 +340,13 @@ function xi(yt) {
               animate: l ? "whileInView" : "initial"
             }
           ),
-          I ? /* @__PURE__ */ i.jsx(
+          k ? /* @__PURE__ */ i.jsx(
             "line",
             {
               y1: 0,
-              y2: w,
-              x1: e(I.date),
-              x2: e(I.date),
+              y2: v,
+              x1: e(k.date),
+              x2: e(k.date),
               className: B(
                 "undp-tick-line stroke-primary-gray-700 dark:stroke-primary-gray-100",
                 m?.mouseOverLine
@@ -354,20 +354,20 @@ function xi(yt) {
               style: c?.mouseOverLine
             }
           ) : null,
-          /* @__PURE__ */ i.jsx("g", { children: a.map((t, g) => /* @__PURE__ */ i.jsx(d.g, { children: v(t.y) ? null : /* @__PURE__ */ i.jsxs(i.Fragment, { children: [
+          /* @__PURE__ */ i.jsx("g", { children: a.map((t, f) => /* @__PURE__ */ i.jsx(d.g, { children: j(t.y) ? null : /* @__PURE__ */ i.jsxs(i.Fragment, { children: [
             $ ? /* @__PURE__ */ i.jsx(
               d.circle,
               {
                 r: r / a.length < 5 ? 0 : r / a.length < 20 ? 2 : 4,
-                style: { fill: k },
+                style: { fill: L },
                 exit: { opacity: 0, transition: { duration: n.duration } },
                 variants: {
                   initial: { opacity: 0, cx: e(t.date), cy: o(t.y) },
                   whileInView: {
                     opacity: 1,
                     transition: {
-                      duration: y ? n.duration : 0.5,
-                      delay: y ? 0 : n.duration
+                      duration: x ? n.duration : 0.5,
+                      delay: x ? 0 : n.duration
                     },
                     cx: e(t.date),
                     cy: o(t.y)
@@ -377,23 +377,28 @@ function xi(yt) {
                 animate: l ? "whileInView" : "initial"
               }
             ) : null,
-            dt ? /* @__PURE__ */ i.jsxs(i.Fragment, { children: [
+            ft ? /* @__PURE__ */ i.jsxs(i.Fragment, { children: [
               /* @__PURE__ */ i.jsx(
                 d.circle,
                 {
                   r: r / a.length < 5 ? 0 : r / a.length < 20 ? 2 : 4,
-                  style: { fill: A[0] },
                   exit: { opacity: 0, transition: { duration: n.duration } },
                   variants: {
-                    initial: { opacity: 0, cx: e(t.date), cy: o(t.yMin) },
+                    initial: {
+                      opacity: 0,
+                      fill: p[0],
+                      cx: e(t.date),
+                      cy: o(t.yMin)
+                    },
                     whileInView: {
                       opacity: 1,
                       transition: {
-                        duration: y ? n.duration : 0.5,
-                        delay: y ? 0 : n.duration
+                        duration: x ? n.duration : 0.5,
+                        delay: x ? 0 : n.duration
                       },
                       cx: e(t.date),
-                      cy: o(t.yMin)
+                      cy: o(t.yMin),
+                      fill: p[0]
                     }
                   },
                   initial: "initial",
@@ -404,15 +409,20 @@ function xi(yt) {
                 d.circle,
                 {
                   r: r / a.length < 5 ? 0 : r / a.length < 20 ? 2 : 4,
-                  style: { fill: A[1] },
                   exit: { opacity: 0, transition: { duration: n.duration } },
                   variants: {
-                    initial: { opacity: 0, cx: e(t.date), cy: o(t.yMax) },
+                    initial: {
+                      opacity: 0,
+                      fill: p[1],
+                      cx: e(t.date),
+                      cy: o(t.yMax)
+                    },
                     whileInView: {
                       opacity: 1,
+                      fill: p[1],
                       transition: {
-                        duration: y ? n.duration : 0.5,
-                        delay: y ? 0 : n.duration
+                        duration: x ? n.duration : 0.5,
+                        delay: x ? 0 : n.duration
                       },
                       cx: e(t.date),
                       cy: o(t.yMax)
@@ -428,7 +438,6 @@ function xi(yt) {
               {
                 dy: -8,
                 style: {
-                  fill: k,
                   textAnchor: "middle",
                   ...c?.graphObjectValues || {}
                 },
@@ -438,49 +447,55 @@ function xi(yt) {
                 ),
                 exit: { opacity: 0, transition: { duration: n.duration } },
                 variants: {
-                  initial: { opacity: 0, x: e(t.date), y: o(t.y) },
+                  initial: { opacity: 0, fill: L, x: e(t.date), y: o(t.y) },
                   whileInView: {
                     opacity: 1,
                     x: e(t.date),
+                    fill: L,
                     y: o(t.y),
                     transition: {
-                      duration: y ? n.duration : 0.5,
-                      delay: y ? 0 : n.duration
+                      duration: x ? n.duration : 0.5,
+                      delay: x ? 0 : n.duration
                     }
                   }
                 },
                 initial: "initial",
                 animate: l ? "whileInView" : "initial",
-                children: lt(t.y, "NA", N, f, L)
+                children: lt(t.y, "NA", I, w, D)
               }
             ) : null,
-            ft ? /* @__PURE__ */ i.jsxs(i.Fragment, { children: [
+            dt ? /* @__PURE__ */ i.jsxs(i.Fragment, { children: [
               /* @__PURE__ */ i.jsx(
                 d.text,
                 {
                   dy: "1em",
                   style: {
-                    fill: A[0],
                     textAnchor: "middle",
                     ...c?.graphObjectValues || {}
                   },
                   className: B("text-xs font-bold", m?.graphObjectValues),
                   exit: { opacity: 0, transition: { duration: n.duration } },
                   variants: {
-                    initial: { opacity: 0, x: e(t.date), y: o(t.yMin) },
+                    initial: {
+                      opacity: 0,
+                      fill: p[0],
+                      x: e(t.date),
+                      y: o(t.yMin)
+                    },
                     whileInView: {
                       opacity: 1,
                       x: e(t.date),
                       y: o(t.yMin),
+                      fill: p[0],
                       transition: {
-                        duration: y ? n.duration : 0.5,
-                        delay: y ? 0 : n.duration
+                        duration: x ? n.duration : 0.5,
+                        delay: x ? 0 : n.duration
                       }
                     }
                   },
                   initial: "initial",
                   animate: l ? "whileInView" : "initial",
-                  children: lt(t.yMin, "NA", N, f, L)
+                  children: lt(t.yMin, "NA", I, w, D)
                 }
               ),
               /* @__PURE__ */ i.jsx(
@@ -488,47 +503,52 @@ function xi(yt) {
                 {
                   dy: -8,
                   style: {
-                    fill: A[1],
                     textAnchor: "middle",
                     ...c?.graphObjectValues || {}
                   },
                   className: B("text-xs font-bold", m?.graphObjectValues),
                   exit: { opacity: 0, transition: { duration: n.duration } },
                   variants: {
-                    initial: { opacity: 0, x: e(t.date), y: o(t.yMax) },
+                    initial: {
+                      opacity: 0,
+                      fill: p[1],
+                      x: e(t.date),
+                      y: o(t.yMax)
+                    },
                     whileInView: {
                       opacity: 1,
+                      fill: p[1],
                       x: e(t.date),
                       y: o(t.yMax),
                       transition: {
-                        duration: y ? n.duration : 0.5,
-                        delay: y ? 0 : n.duration
+                        duration: x ? n.duration : 0.5,
+                        delay: x ? 0 : n.duration
                       }
                     }
                   },
                   initial: "initial",
                   animate: l ? "whileInView" : "initial",
-                  children: lt(t.yMax, "NA", N, f, L)
+                  children: lt(t.yMax, "NA", I, w, D)
                 }
               )
             ] }) : null
-          ] }) }, g)) }),
-          J ? /* @__PURE__ */ i.jsx(i.Fragment, { children: J.map((t, g) => /* @__PURE__ */ i.jsx(
+          ] }) }, f)) }),
+          J ? /* @__PURE__ */ i.jsx(i.Fragment, { children: J.map((t, f) => /* @__PURE__ */ i.jsx(
             zt,
             {
               text: t.text,
               color: t.color,
               y: o(t.value),
-              x1: 0 - j,
-              x2: r + p.right,
+              x1: 0 - M,
+              x2: r + g.right,
               classNames: t.classNames,
               styles: t.styles,
               animate: n,
               isInView: l
             },
-            g
+            f
           )) }) : null,
-          /* @__PURE__ */ i.jsx("g", { children: pt.map((t, g) => {
+          /* @__PURE__ */ i.jsx("g", { children: pt.map((t, f) => {
             const O = Et(
               {
                 x: t.xCoordinate ? e(u(`${t.xCoordinate}`, s, /* @__PURE__ */ new Date())) + (t.xOffset || 0) : 0 + (t.xOffset || 0),
@@ -538,7 +558,7 @@ function xi(yt) {
                 x: t.xCoordinate ? e(u(`${t.xCoordinate}`, s, /* @__PURE__ */ new Date())) : 0,
                 y: t.yCoordinate ? o(t.yCoordinate) : 0
               },
-              v(t.connectorRadius) ? 3.5 : t.connectorRadius
+              j(t.connectorRadius) ? 3.5 : t.connectorRadius
             ), st = t.showConnector ? {
               y1: O.y,
               x1: O.x,
@@ -546,12 +566,12 @@ function xi(yt) {
               x2: t.xCoordinate ? e(u(`${t.xCoordinate}`, s, /* @__PURE__ */ new Date())) + (t.xOffset || 0) : 0 + (t.xOffset || 0),
               cy: t.yCoordinate ? o(t.yCoordinate) : 0,
               cx: t.xCoordinate ? e(u(`${t.xCoordinate}`, s, /* @__PURE__ */ new Date())) : 0,
-              circleRadius: v(t.connectorRadius) ? 3.5 : t.connectorRadius,
+              circleRadius: j(t.connectorRadius) ? 3.5 : t.connectorRadius,
               strokeWidth: t.showConnector === !0 ? 2 : Math.min(t.showConnector || 0, 1)
             } : void 0, At = {
               y: t.yCoordinate ? o(t.yCoordinate) + (t.yOffset || 0) - 8 : 0 + (t.yOffset || 0) - 8,
               x: Z ? 0 : t.xCoordinate ? e(u(`${t.xCoordinate}`, s, /* @__PURE__ */ new Date())) + (t.xOffset || 0) : 0 + (t.xOffset || 0),
-              width: Z ? t.xCoordinate ? e(u(`${t.xCoordinate}`, s, /* @__PURE__ */ new Date())) + (t.xOffset || 0) : 0 + (t.xOffset || 0) : r + p.right - (t.xCoordinate ? e(u(`${t.xCoordinate}`, s, /* @__PURE__ */ new Date())) + (t.xOffset || 0) : 0 + (t.xOffset || 0)),
+              width: Z ? t.xCoordinate ? e(u(`${t.xCoordinate}`, s, /* @__PURE__ */ new Date())) + (t.xOffset || 0) : 0 + (t.xOffset || 0) : r + g.right - (t.xCoordinate ? e(u(`${t.xCoordinate}`, s, /* @__PURE__ */ new Date())) + (t.xOffset || 0) : 0 + (t.xOffset || 0)),
               maxWidth: t.maxWidth,
               fontWeight: t.fontWeight,
               align: t.align
@@ -568,7 +588,7 @@ function xi(yt) {
                 animate: n,
                 isInView: l
               },
-              g
+              f
             );
           }) }),
           /* @__PURE__ */ i.jsx("g", { children: H ? /* @__PURE__ */ i.jsx(
@@ -578,7 +598,7 @@ function xi(yt) {
               x2: r,
               y1: $t(0),
               y2: $t(r),
-              graphHeight: w,
+              graphHeight: v,
               graphWidth: r,
               className: m?.regLine,
               style: c?.regLine,
@@ -591,22 +611,22 @@ function xi(yt) {
           /* @__PURE__ */ i.jsx(
             "rect",
             {
-              ref: M,
+              ref: C,
               style: {
                 fill: "none",
                 pointerEvents: "all"
               },
               width: r,
-              height: w
+              height: v
             }
           )
         ] })
       }
     ),
-    I && q && at && X ? /* @__PURE__ */ i.jsx(
+    k && q && at && X ? /* @__PURE__ */ i.jsx(
       Yt,
       {
-        data: I,
+        data: k,
         body: q,
         xPos: at,
         yPos: X,
@@ -616,21 +636,21 @@ function xi(yt) {
     ) : null
   ] });
 }
-function Xi(yt) {
+function Xi(xt) {
   const {
     data: V,
-    graphTitle: C,
+    graphTitle: b,
     suffix: W = "",
-    sources: k,
-    prefix: L = "",
-    graphDescription: f,
+    sources: L,
+    prefix: D = "",
+    graphDescription: w,
     height: s,
-    width: x,
+    width: h,
     footNote: z,
-    noOfXTicks: xt = 10,
-    dateFormat: ht = "yyyy",
-    showValues: j = !1,
-    backgroundColor: b = !1,
+    noOfXTicks: ht = 10,
+    dateFormat: yt = "yyyy",
+    showValues: M = !1,
+    backgroundColor: A = !1,
     padding: U,
     lineColor: q,
     leftMargin: F = 30,
@@ -644,92 +664,92 @@ function Xi(yt) {
     onSeriesMouseOver: pt,
     graphID: gt,
     minValue: H,
-    maxValue: dt,
-    regressionLine: ft = !1,
+    maxValue: ft,
+    regressionLine: dt = !1,
     showIntervalDots: Y = !1,
-    showIntervalValues: A = !1,
+    showIntervalValues: p = !1,
     intervalLineStrokeWidth: wt = 0,
     intervalLineColors: vt = [ct.light.grays["gray-500"], ct.light.grays["gray-500"]],
     intervalAreaColor: _ = ct.primaryColors["blue-100"],
     intervalAreaOpacity: jt = 0.4,
     graphDownload: P = !1,
     dataDownload: E = !1,
-    animate: D = !1,
+    animate: N = !1,
     language: c = "en",
     minHeight: m = 0,
-    strokeWidth: N = 2,
+    strokeWidth: I = 2,
     showDots: tt = !0,
     annotations: it = [],
     customHighlightAreaSettings: l = [],
-    theme: y = "light",
+    theme: x = "light",
     ariaLabel: Mt,
     yAxisTitle: S,
-    noOfYTicks: I = 5,
+    noOfYTicks: k = 5,
     minDate: et,
     maxDate: at,
     colorLegendTitle: nt,
     colorLegendColors: X,
     colorLegendDomain: G,
-    curveType: p = "curve",
-    styles: M,
+    curveType: g = "curve",
+    styles: C,
     classNames: a,
     precision: Ct = 2,
     customLayers: bt = []
-  } = yt, [r, w] = R(0), [ot, rt] = R(0), h = mt(null), T = mt(null);
+  } = xt, [r, v] = R(0), [ot, rt] = R(0), y = mt(null), T = mt(null);
   return Vt(() => {
     const e = new ResizeObserver((o) => {
-      w(x || o[0].target.clientWidth || 620), rt(s || o[0].target.clientHeight || 480);
+      v(h || o[0].target.clientWidth || 620), rt(s || o[0].target.clientHeight || 480);
     });
-    return h.current && (rt(h.current.clientHeight || 480), w(h.current.clientWidth || 620), x || e.observe(h.current)), () => e.disconnect();
-  }, [x, s]), /* @__PURE__ */ i.jsx(
+    return y.current && (rt(y.current.clientHeight || 480), v(y.current.clientWidth || 620), h || e.observe(y.current)), () => e.disconnect();
+  }, [h, s]), /* @__PURE__ */ i.jsx(
     "div",
     {
-      className: `${y || "light"} flex  ${x ? "w-fit grow-0" : "w-full grow"}`,
+      className: `${x || "light"} flex  ${h ? "w-fit grow-0" : "w-full grow"}`,
       dir: c === "he" || c === "ar" ? "rtl" : void 0,
       children: /* @__PURE__ */ i.jsx(
         "div",
         {
           className: B(
-            `${b ? b === !0 ? "bg-primary-gray-200 dark:bg-primary-gray-650 " : "" : "bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${c || "en"}`,
-            x ? "w-fit" : "w-full",
+            `${A ? A === !0 ? "bg-primary-gray-200 dark:bg-primary-gray-650 " : "" : "bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${c || "en"}`,
+            h ? "w-fit" : "w-full",
             a?.graphContainer
           ),
           style: {
-            ...M?.graphContainer || {},
-            ...b && b !== !0 ? { backgroundColor: b } : {}
+            ...C?.graphContainer || {},
+            ...A && A !== !0 ? { backgroundColor: A } : {}
           },
           id: gt,
           ref: T,
-          "aria-label": Mt || `${C ? `The graph shows ${C}. ` : ""}This is a line chart that highlights the difference between two datasets over time.${f ? ` ${f}` : ""}`,
+          "aria-label": Mt || `${b ? `The graph shows ${b}. ` : ""}This is a line chart that highlights the difference between two datasets over time.${w ? ` ${w}` : ""}`,
           children: /* @__PURE__ */ i.jsx(
             "div",
             {
               className: "flex grow",
-              style: { padding: b ? U || "1rem" : U || 0 },
+              style: { padding: A ? U || "1rem" : U || 0 },
               children: /* @__PURE__ */ i.jsxs("div", { className: "flex flex-col w-full gap-4 grow justify-between", children: [
-                C || f || P || E ? /* @__PURE__ */ i.jsx(
+                b || w || P || E ? /* @__PURE__ */ i.jsx(
                   ci,
                   {
                     styles: {
-                      title: M?.title,
-                      description: M?.description
+                      title: C?.title,
+                      description: C?.description
                     },
                     classNames: {
                       title: a?.title,
                       description: a?.description
                     },
-                    graphTitle: C,
-                    graphDescription: f,
-                    width: x,
+                    graphTitle: b,
+                    graphDescription: w,
+                    width: h,
                     graphDownload: P ? T.current : void 0,
                     dataDownload: E ? V.map((e) => e.data).filter((e) => e !== void 0).length > 0 ? V.map((e) => e.data).filter((e) => e !== void 0) : V.filter((e) => e !== void 0) : null
                   }
                 ) : null,
-                /* @__PURE__ */ i.jsx("div", { className: "grow flex flex-col justify-center gap-3 w-full", children: V.length === 0 ? /* @__PURE__ */ i.jsx(yi, {}) : /* @__PURE__ */ i.jsxs(i.Fragment, { children: [
+                /* @__PURE__ */ i.jsx("div", { className: "grow flex flex-col justify-center gap-3 w-full", children: V.length === 0 ? /* @__PURE__ */ i.jsx(xi, {}) : /* @__PURE__ */ i.jsxs(i.Fragment, { children: [
                   X && G ? /* @__PURE__ */ i.jsx(
                     mi,
                     {
-                      width: x,
+                      width: h,
                       colorLegendTitle: nt,
                       colors: X,
                       colorDomain: G,
@@ -740,23 +760,23 @@ function Xi(yt) {
                     "div",
                     {
                       className: "flex flex-col grow justify-center leading-0",
-                      ref: h,
+                      ref: y,
                       "aria-label": "Graph area",
-                      children: (x || r) && (s || ot) ? /* @__PURE__ */ i.jsx(
-                        xi,
+                      children: (h || r) && (s || ot) ? /* @__PURE__ */ i.jsx(
+                        hi,
                         {
                           data: V,
                           lineColor: q || ct.primaryColors["blue-600"],
-                          width: x || r,
+                          width: h || r,
                           height: Math.max(
                             m,
-                            s || ($ ? m ? (x || r) * $ > m ? (x || r) * $ : m : (x || r) * $ : ot)
+                            s || ($ ? m ? (h || r) * $ > m ? (h || r) * $ : m : (h || r) * $ : ot)
                           ),
                           suffix: W,
-                          prefix: L,
-                          dateFormat: ht,
-                          showValues: j,
-                          noOfXTicks: xt,
+                          prefix: D,
+                          dateFormat: yt,
+                          showValues: M,
+                          noOfXTicks: ht,
                           leftMargin: F,
                           rightMargin: J,
                           topMargin: K,
@@ -766,26 +786,26 @@ function Xi(yt) {
                           onSeriesMouseOver: pt,
                           refValues: Z,
                           minValue: H,
-                          maxValue: dt,
-                          animate: D === !0 ? { duration: 0.5, once: !0, amount: 0.5 } : D || { duration: 0, once: !0, amount: 0 },
+                          maxValue: ft,
+                          animate: N === !0 ? { duration: 0.5, once: !0, amount: 0.5 } : N || { duration: 0, once: !0, amount: 0 },
                           rtl: c === "he" || c === "ar",
-                          strokeWidth: N,
+                          strokeWidth: I,
                           showDots: tt,
                           annotations: it,
                           customHighlightAreaSettings: l,
-                          regressionLine: ft,
+                          regressionLine: dt,
                           showIntervalDots: Y,
-                          showIntervalValues: A,
+                          showIntervalValues: p,
                           intervalLineStrokeWidth: wt,
                           intervalLineColors: vt,
                           intervalAreaColor: _,
                           intervalAreaOpacity: jt,
                           yAxisTitle: S,
-                          noOfYTicks: I,
+                          noOfYTicks: k,
                           minDate: et,
                           maxDate: at,
-                          curveType: p,
-                          styles: M,
+                          curveType: g,
+                          styles: C,
                           classNames: a,
                           precision: Ct,
                           customLayers: bt
@@ -794,17 +814,17 @@ function Xi(yt) {
                     }
                   )
                 ] }) }),
-                k || z ? /* @__PURE__ */ i.jsx(
+                L || z ? /* @__PURE__ */ i.jsx(
                   li,
                   {
-                    styles: { footnote: M?.footnote, source: M?.source },
+                    styles: { footnote: C?.footnote, source: C?.source },
                     classNames: {
                       footnote: a?.footnote,
                       source: a?.source
                     },
-                    sources: k,
+                    sources: L,
                     footNote: z,
-                    width: x
+                    width: h
                   }
                 ) : null
               ] })