@undp/data-viz 1.5.6 → 1.5.8

package/dist/DifferenceLineChart.js

@@ -1,6 +1,6 @@
 import { j as e, m as G } from "./index-CHPV5EwG-BPSP-7Jg.js";
 import { useRef as ut, useState as W, useEffect as Dt } from "react";
-import { p as d, f as Ht } from "./parse-DlCRUFh_.js";
+import { p as u, f as Ht } from "./parse-DlCRUFh_.js";
 import { o as Rt } from "./index-DvVprvy6.js";
 import { n as Ct } from "./numberFormattingFunction-14YCbkN2.js";
 import { T as Ft } from "./Tooltip-CVCGWyzw.js";
@@ -21,7 +21,7 @@ import { s as ei } from "./select-DKy99ogv.js";
 import { a as ai } from "./init-BhZylTFx.js";
 import { p as ni } from "./pointer-CWRWOsrb.js";
 import { u as oi } from "./use-in-view-yS6jzJAp.js";
-import { m as f } from "./proxy-CkpFesk1.js";
+import { m as g } from "./proxy-CkpFesk1.js";
 import { GraphFooter as ri } from "./GraphFooter.js";
 import { GraphHeader as si } from "./GraphHeader.js";
 import { ColorLegend as li } from "./ColorLegend.js";
@@ -33,11 +33,11 @@ function hi(pt) {
     data: N,
     width: D,
     height: Y,
-    lineColors: g,
+    lineColors: l,
     suffix: L,
     prefix: w,
     dateFormat: r,
-    showValues: l,
+    showValues: c,
     noOfXTicks: J,
     rightMargin: ft,
     leftMargin: j,
@@ -64,16 +64,16 @@ function hi(pt) {
     minDate: et,
     maxDate: at,
     curveType: F,
-    styles: x,
-    classNames: y,
+    styles: y,
+    classNames: d,
     precision: T,
     customLayers: nt
   } = pt, ot = ut(null), s = oi(ot, {
     once: a.once,
     amount: a.amount
-  }), [c, vt] = W(!1);
+  }), [m, vt] = W(!1);
   Dt(() => {
-    if (s && !c) {
+    if (s && !m) {
       const t = setTimeout(
         () => {
           vt(!0);
@@ -82,8 +82,8 @@ function hi(pt) {
       );
       return () => clearTimeout(t);
     }
-  }, [s, c, a.duration]);
-  const M = F === "linear" ? Qt : F === "step" ? Zt : F === "stepAfter" ? _t : F === "stepBefore" ? ti : ii, [S, rt] = W(void 0), [st, lt] = W(void 0), [A, C] = W(void 0), u = {
+  }, [s, m, a.duration]);
+  const M = F === "linear" ? Qt : F === "step" ? Zt : F === "stepAfter" ? _t : F === "stepBefore" ? ti : ii, [S, rt] = W(void 0), [st, lt] = W(void 0), [A, C] = W(void 0), p = {
     top: gt,
     bottom: K,
     left: U ? j + 30 : j,
@@ -91,25 +91,25 @@ function hi(pt) {
   }, ct = ut(null), i = Rt(
     N.map((t) => ({
       ...t,
-      date: d(`${t.date}`, r, /* @__PURE__ */ new Date())
+      date: u(`${t.date}`, r, /* @__PURE__ */ new Date())
     })),
     ["date"],
     ["asc"]
   ), mt = V.map((t) => ({
     ...t,
     coordinates: [
-      t.coordinates[0] === null ? null : d(`${t.coordinates[0]}`, r, /* @__PURE__ */ new Date()),
-      t.coordinates[1] === null ? null : d(`${t.coordinates[1]}`, r, /* @__PURE__ */ new Date())
+      t.coordinates[0] === null ? null : u(`${t.coordinates[0]}`, r, /* @__PURE__ */ new Date()),
+      t.coordinates[1] === null ? null : u(`${t.coordinates[1]}`, r, /* @__PURE__ */ new Date())
     ]
   })), ht = R.map((t) => ({
     ...t,
     coordinates: t.coordinates.map(
-      (v, $) => $ % 2 === 0 ? d(`${v}`, r, /* @__PURE__ */ new Date()) : v
+      (v, $) => $ % 2 === 0 ? u(`${v}`, r, /* @__PURE__ */ new Date()) : v
     )
-  })), m = D - u.left - u.right, p = Y - u.top - u.bottom, xt = et ? d(`${et}`, r, /* @__PURE__ */ new Date()) : i[0].date, h = at ? d(`${at}`, r, /* @__PURE__ */ new Date()) : i[i.length - 1].date, q = Math.min(...i.map((t) => t.y1)) !== 1 / 0 ? Math.min(...i.map((t) => t.y1)) > 0 ? 0 : Math.min(...i.map((t) => t.y1)) : 0, Vt = Math.min(...i.map((t) => t.y2)) !== 1 / 0 ? Math.min(...i.map((t) => t.y2)) > 0 ? 0 : Math.min(...i.map((t) => t.y2)) : 0, $t = Math.max(...i.map((t) => t.y1)) !== 1 / 0 ? Math.max(...i.map((t) => t.y1)) : 0, Nt = Math.max(...i.map((t) => t.y2)) !== 1 / 0 ? Math.max(...i.map((t) => t.y2)) : 0, O = P(I) ? q < Vt ? q : Vt : I, jt = $t > Nt ? $t : Nt, n = Jt().domain([xt, h]).range([0, m]), o = Kt().domain([
+  })), h = D - p.left - p.right, f = Y - p.top - p.bottom, xt = et ? u(`${et}`, r, /* @__PURE__ */ new Date()) : i[0].date, x = at ? u(`${at}`, r, /* @__PURE__ */ new Date()) : i[i.length - 1].date, q = Math.min(...i.map((t) => t.y1)) !== 1 / 0 ? Math.min(...i.map((t) => t.y1)) > 0 ? 0 : Math.min(...i.map((t) => t.y1)) : 0, Vt = Math.min(...i.map((t) => t.y2)) !== 1 / 0 ? Math.min(...i.map((t) => t.y2)) > 0 ? 0 : Math.min(...i.map((t) => t.y2)) : 0, $t = Math.max(...i.map((t) => t.y1)) !== 1 / 0 ? Math.max(...i.map((t) => t.y1)) : 0, Nt = Math.max(...i.map((t) => t.y2)) !== 1 / 0 ? Math.max(...i.map((t) => t.y2)) : 0, O = P(I) ? q < Vt ? q : Vt : I, jt = $t > Nt ? $t : Nt, n = Jt().domain([xt, x]).range([0, h]), o = Kt().domain([
     P(I) ? O : I,
     P(z) ? jt > 0 ? jt : 0 : z
-  ]).range([p, 0]).nice(), bt = Mt().x((t) => n(t.date)).y((t) => o(t.y1)).curve(M), Lt = Mt().x((t) => n(t.date)).y((t) => o(t.y2)).curve(M), It = Ot().x((t) => n(t.date)).y1((t) => o(t.y1)).y0((t) => o(t.y2)).curve(M), St = Ot().x((t) => n(t.date)).y1((t) => o(t.y1)).y0(0).curve(M), Pt = Ot().x((t) => n(t.date)).y1((t) => o(t.y2)).y0(0).curve(M), kt = o.ticks(it), Tt = n.ticks(J);
+  ]).range([f, 0]).nice(), bt = Mt().x((t) => n(t.date)).y((t) => o(t.y1)).curve(M), Lt = Mt().x((t) => n(t.date)).y((t) => o(t.y2)).curve(M), It = Ot().x((t) => n(t.date)).y1((t) => o(t.y1)).y0((t) => o(t.y2)).curve(M), St = Ot().x((t) => n(t.date)).y1((t) => o(t.y1)).y0(0).curve(M), Pt = Ot().x((t) => n(t.date)).y1((t) => o(t.y2)).y0(0).curve(M), kt = o.ticks(it), Tt = n.ticks(J);
   return Dt(() => {
     const t = ($) => {
       const yt = i[ai(
@@ -124,14 +124,14 @@ function hi(pt) {
     ei(ct.current).on("mousemove", t).on("mouseout", v);
   }, [n, i, E]), /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
     /* @__PURE__ */ e.jsx(
-      f.svg,
+      g.svg,
       {
         width: `${D}px`,
         height: `${Y}px`,
         viewBox: `0 0 ${D} ${Y}`,
         direction: "ltr",
         ref: ot,
-        children: /* @__PURE__ */ e.jsxs("g", { transform: `translate(${u.left},${u.top})`, children: [
+        children: /* @__PURE__ */ e.jsxs("g", { transform: `translate(${p.left},${p.top})`, children: [
           /* @__PURE__ */ e.jsx("clipPath", { id: `above${b}`, children: /* @__PURE__ */ e.jsx(
             "path",
             {
@@ -150,8 +150,8 @@ function hi(pt) {
             qt,
             {
               areaSettings: mt,
-              width: m,
-              height: p,
+              width: h,
+              height: f,
               scale: n,
               animate: a,
               isInView: s
@@ -174,15 +174,15 @@ function hi(pt) {
                 values: kt.filter((t) => t !== 0),
                 y: kt.filter((t) => t !== 0).map((t) => o(t)),
                 x1: 0 - j,
-                x2: m + u.right,
+                x2: h + p.right,
                 styles: {
-                  gridLines: x?.yAxis?.gridLines,
-                  labels: x?.yAxis?.labels
-                },
-                classNames: {
                   gridLines: y?.yAxis?.gridLines,
                   labels: y?.yAxis?.labels
                 },
+                classNames: {
+                  gridLines: d?.yAxis?.gridLines,
+                  labels: d?.yAxis?.labels
+                },
                 suffix: L,
                 prefix: w,
                 labelType: "secondary",
@@ -197,7 +197,7 @@ function hi(pt) {
                 y1: o(O < 0 ? 0 : O),
                 y2: o(O < 0 ? 0 : O),
                 x1: 0 - j,
-                x2: m + u.right,
+                x2: h + p.right,
                 label: Ct(
                   O < 0 ? 0 : O,
                   "NA",
@@ -212,12 +212,12 @@ function hi(pt) {
                   dy: jt < 0 ? "1rem" : -5
                 },
                 classNames: {
-                  axis: y?.xAxis?.axis,
-                  label: y?.yAxis?.labels
+                  axis: d?.xAxis?.axis,
+                  label: d?.yAxis?.labels
                 },
                 styles: {
-                  axis: x?.xAxis?.axis,
-                  label: x?.yAxis?.labels
+                  axis: y?.xAxis?.axis,
+                  label: y?.yAxis?.labels
                 }
               }
             ),
@@ -225,9 +225,9 @@ function hi(pt) {
               Xt,
               {
                 x: 0 - j - 15,
-                y: p / 2,
-                style: x?.yAxis?.title,
-                className: y?.yAxis?.title,
+                y: f / 2,
+                style: y?.yAxis?.title,
+                className: d?.yAxis?.title,
                 text: U,
                 rotate90: !0
               }
@@ -239,16 +239,16 @@ function hi(pt) {
               values: Tt.map((t) => Ht(t, r)),
               x: Tt.map((t) => n(t)),
               y1: 0,
-              y2: p,
+              y2: f,
               styles: {
-                gridLines: x?.xAxis?.gridLines,
-                labels: x?.xAxis?.labels
+                gridLines: y?.xAxis?.gridLines,
+                labels: y?.xAxis?.labels
               },
               classNames: {
-                gridLines: G("opacity-0", y?.xAxis?.gridLines),
+                gridLines: G("opacity-0", d?.xAxis?.gridLines),
                 labels: G(
                   "fill-primary-gray-700 dark:fill-primary-gray-300 xs:max-[360px]:hidden text-[9px] md:text-[10px] lg:text-xs",
-                  y?.xAxis?.labels
+                  d?.xAxis?.labels
                 )
               },
               suffix: L,
@@ -261,7 +261,7 @@ function hi(pt) {
           nt.filter((t) => t.position === "before").map((t) => t.layer),
           /* @__PURE__ */ e.jsxs("g", { children: [
             /* @__PURE__ */ e.jsx(
-              f.path,
+              g.path,
               {
                 clipPath: `url(#below${b})`,
                 d: It(i) || "",
@@ -276,7 +276,7 @@ function hi(pt) {
               }
             ),
             /* @__PURE__ */ e.jsx(
-              f.path,
+              g.path,
               {
                 clipPath: `url(#above${b})`,
                 d: It(i) || "",
@@ -293,12 +293,12 @@ function hi(pt) {
           ] }),
           /* @__PURE__ */ e.jsxs("g", { children: [
             /* @__PURE__ */ e.jsx(
-              f.path,
+              g.path,
               {
                 d: bt(i) || "",
                 style: {
                   fill: "none",
-                  stroke: g[0],
+                  stroke: l[0],
                   strokeWidth: _
                 },
                 exit: { opacity: 0, transition: { duration: a.duration } },
@@ -316,11 +316,11 @@ function hi(pt) {
               }
             ),
             /* @__PURE__ */ e.jsx(
-              f.path,
+              g.path,
               {
                 style: {
                   fill: "none",
-                  stroke: g[1],
+                  stroke: l[1],
                   strokeWidth: _
                 },
                 exit: { opacity: 0, transition: { duration: a.duration } },
@@ -339,9 +339,8 @@ function hi(pt) {
             ),
             wt ? null : /* @__PURE__ */ e.jsxs("g", { children: [
               /* @__PURE__ */ e.jsx(
-                f.text,
+                g.text,
                 {
-                  style: { fill: g[0] },
                   className: "text-xs",
                   dx: 5,
                   dy: 4,
@@ -350,15 +349,17 @@ function hi(pt) {
                     initial: {
                       opacity: 0,
                       x: n(i[i.length - 1].date),
-                      y: o(i[i.length - 1].y1)
+                      y: o(i[i.length - 1].y1),
+                      fill: l[0]
                     },
                     whileInView: {
                       opacity: 1,
                       x: n(i[i.length - 1].date),
                       y: o(i[i.length - 1].y1),
+                      fill: l[0],
                       transition: {
-                        duration: c ? a.duration : 0.5,
-                        delay: c ? 0 : a.duration
+                        duration: m ? a.duration : 0.5,
+                        delay: m ? 0 : a.duration
                       }
                     }
                   },
@@ -369,9 +370,8 @@ function hi(pt) {
                 H[0]
               ),
               /* @__PURE__ */ e.jsx(
-                f.text,
+                g.text,
                 {
-                  style: { fill: g[1] },
                   className: "text-xs",
                   dx: 5,
                   dy: 4,
@@ -380,15 +380,17 @@ function hi(pt) {
                     initial: {
                       opacity: 0,
                       x: n(i[i.length - 1].date),
-                      y: o(i[i.length - 1].y2)
+                      y: o(i[i.length - 1].y2),
+                      fill: l[1]
                     },
                     whileInView: {
                       opacity: 1,
                       x: n(i[i.length - 1].date),
                       y: o(i[i.length - 1].y2),
+                      fill: l[1],
                       transition: {
-                        duration: c ? a.duration : 0.5,
-                        delay: c ? 0 : a.duration
+                        duration: m ? a.duration : 0.5,
+                        delay: m ? 0 : a.duration
                       }
                     }
                   },
@@ -403,28 +405,28 @@ function hi(pt) {
               "line",
               {
                 y1: 0,
-                y2: p,
+                y2: f,
                 x1: n(S.date),
                 x2: n(S.date),
                 className: G(
                   "undp-tick-line stroke-primary-gray-700 dark:stroke-primary-gray-100",
-                  y?.mouseOverLine
+                  d?.mouseOverLine
                 ),
-                style: x?.mouseOverLine
+                style: y?.mouseOverLine
               }
             ) : null,
-            i.map((t, v) => /* @__PURE__ */ e.jsxs(f.g, { children: [
+            i.map((t, v) => /* @__PURE__ */ e.jsxs(g.g, { children: [
               P(t.y1) ? null : /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
                 tt ? /* @__PURE__ */ e.jsx(
-                  f.circle,
+                  g.circle,
                   {
-                    r: m / i.length < 5 ? 0 : m / i.length < 20 ? 2 : 4,
-                    style: { fill: g[0] },
+                    r: h / i.length < 5 ? 0 : h / i.length < 20 ? 2 : 4,
                     exit: { opacity: 0, transition: { duration: a.duration } },
                     variants: {
-                      initial: { opacity: 0, cx: n(t.date), cy: o(t.y1) },
+                      initial: { opacity: 0, cx: n(t.date), cy: o(t.y1), fill: l[0] },
                       whileInView: {
                         opacity: 1,
+                        fill: l[0],
                         transition: { duration: 0.5, delay: a.duration },
                         cx: n(t.date),
                         cy: o(t.y1)
@@ -434,29 +436,29 @@ function hi(pt) {
                     animate: s ? "whileInView" : "initial"
                   }
                 ) : null,
-                l ? /* @__PURE__ */ e.jsx(
-                  f.text,
+                c ? /* @__PURE__ */ e.jsx(
+                  g.text,
                   {
                     dy: t.y2 < t.y1 ? -8 : "1em",
                     style: {
-                      fill: g[0],
                       textAnchor: "middle",
-                      ...x?.graphObjectValues || {}
+                      ...y?.graphObjectValues || {}
                     },
                     className: G(
                       "graph-value graph-value-line-1 text-xs font-bold",
-                      y?.graphObjectValues
+                      d?.graphObjectValues
                     ),
                     exit: { opacity: 0, transition: { duration: a.duration } },
                     variants: {
-                      initial: { opacity: 0, x: n(t.date), y: o(t.y1) },
+                      initial: { opacity: 0, x: n(t.date), y: o(t.y1), fill: l[0] },
                       whileInView: {
                         opacity: 1,
+                        fill: l[0],
                         x: n(t.date),
                         y: o(t.y1),
                         transition: {
-                          duration: c ? a.duration : 0.5,
-                          delay: c ? 0 : a.duration
+                          duration: m ? a.duration : 0.5,
+                          delay: m ? 0 : a.duration
                         }
                       }
                     },
@@ -468,18 +470,18 @@ function hi(pt) {
               ] }),
               P(t.y2) ? null : /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
                 tt ? /* @__PURE__ */ e.jsx(
-                  f.circle,
+                  g.circle,
                   {
-                    r: m / i.length < 5 ? 0 : m / i.length < 20 ? 2 : 4,
-                    style: { fill: g[1] },
+                    r: h / i.length < 5 ? 0 : h / i.length < 20 ? 2 : 4,
                     exit: { opacity: 0, transition: { duration: a.duration } },
                     variants: {
-                      initial: { opacity: 0, cx: n(t.date), cy: o(t.y2) },
+                      initial: { opacity: 0, cx: n(t.date), cy: o(t.y2), fill: l[1] },
                       whileInView: {
                         opacity: 1,
+                        fill: l[1],
                         transition: {
-                          duration: c ? a.duration : 0.5,
-                          delay: c ? 0 : a.duration
+                          duration: m ? a.duration : 0.5,
+                          delay: m ? 0 : a.duration
                         },
                         cx: n(t.date),
                         cy: o(t.y2)
@@ -489,29 +491,29 @@ function hi(pt) {
                     animate: s ? "whileInView" : "initial"
                   }
                 ) : null,
-                l ? /* @__PURE__ */ e.jsx(
-                  f.text,
+                c ? /* @__PURE__ */ e.jsx(
+                  g.text,
                   {
                     dy: t.y2 > t.y1 ? -8 : "1em",
                     style: {
-                      fill: g[1],
                       textAnchor: "middle",
-                      ...x?.graphObjectValues || {}
+                      ...y?.graphObjectValues || {}
                     },
                     className: G(
                       "graph-value graph-value-line-2 text-xs font-bold",
-                      y?.graphObjectValues
+                      d?.graphObjectValues
                     ),
                     exit: { opacity: 0, transition: { duration: a.duration } },
                     variants: {
-                      initial: { opacity: 0, x: n(t.date), y: o(t.y2) },
+                      initial: { opacity: 0, x: n(t.date), y: o(t.y2), fill: l[1] },
                       whileInView: {
                         opacity: 1,
                         x: n(t.date),
                         y: o(t.y2),
+                        fill: l[1],
                         transition: {
-                          duration: c ? a.duration : 0.5,
-                          delay: c ? 0 : a.duration
+                          duration: m ? a.duration : 0.5,
+                          delay: m ? 0 : a.duration
                         }
                       }
                     },
@@ -530,7 +532,7 @@ function hi(pt) {
               color: t.color,
               y: o(t.value),
               x1: 0 - j,
-              x2: m + u.right,
+              x2: h + p.right,
               classNames: t.classNames,
               styles: t.styles,
               animate: a,
@@ -541,11 +543,11 @@ function hi(pt) {
           /* @__PURE__ */ e.jsx("g", { children: k.map((t, v) => {
             const $ = Wt(
               {
-                x: t.xCoordinate ? n(d(`${t.xCoordinate}`, r, /* @__PURE__ */ new Date())) + (t.xOffset || 0) : 0 + (t.xOffset || 0),
+                x: t.xCoordinate ? n(u(`${t.xCoordinate}`, r, /* @__PURE__ */ new Date())) + (t.xOffset || 0) : 0 + (t.xOffset || 0),
                 y: t.yCoordinate ? o(t.yCoordinate) + (t.yOffset || 0) - 8 : 0 + (t.yOffset || 0) - 8
               },
               {
-                x: t.xCoordinate ? n(d(`${t.xCoordinate}`, r, /* @__PURE__ */ new Date())) : 0,
+                x: t.xCoordinate ? n(u(`${t.xCoordinate}`, r, /* @__PURE__ */ new Date())) : 0,
                 y: t.yCoordinate ? o(t.yCoordinate) : 0
               },
               P(t.connectorRadius) ? 3.5 : t.connectorRadius
@@ -553,15 +555,15 @@ function hi(pt) {
               y1: $.y,
               x1: $.x,
               y2: t.yCoordinate ? o(t.yCoordinate) + (t.yOffset || 0) : 0 + (t.yOffset || 0),
-              x2: t.xCoordinate ? n(d(`${t.xCoordinate}`, r, /* @__PURE__ */ new Date())) + (t.xOffset || 0) : 0 + (t.xOffset || 0),
+              x2: t.xCoordinate ? n(u(`${t.xCoordinate}`, r, /* @__PURE__ */ new Date())) + (t.xOffset || 0) : 0 + (t.xOffset || 0),
               cy: t.yCoordinate ? o(t.yCoordinate) : 0,
-              cx: t.xCoordinate ? n(d(`${t.xCoordinate}`, r, /* @__PURE__ */ new Date())) : 0,
+              cx: t.xCoordinate ? n(u(`${t.xCoordinate}`, r, /* @__PURE__ */ new Date())) : 0,
               circleRadius: P(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: Q ? 0 : t.xCoordinate ? n(d(`${t.xCoordinate}`, r, /* @__PURE__ */ new Date())) + (t.xOffset || 0) : 0 + (t.xOffset || 0),
-              width: Q ? t.xCoordinate ? n(d(`${t.xCoordinate}`, r, /* @__PURE__ */ new Date())) + (t.xOffset || 0) : 0 + (t.xOffset || 0) : m + u.right - (t.xCoordinate ? n(d(`${t.xCoordinate}`, r, /* @__PURE__ */ new Date())) + (t.xOffset || 0) : 0 + (t.xOffset || 0)),
+              x: Q ? 0 : t.xCoordinate ? n(u(`${t.xCoordinate}`, r, /* @__PURE__ */ new Date())) + (t.xOffset || 0) : 0 + (t.xOffset || 0),
+              width: Q ? t.xCoordinate ? n(u(`${t.xCoordinate}`, r, /* @__PURE__ */ new Date())) + (t.xOffset || 0) : 0 + (t.xOffset || 0) : h + p.right - (t.xCoordinate ? n(u(`${t.xCoordinate}`, r, /* @__PURE__ */ new Date())) + (t.xOffset || 0) : 0 + (t.xOffset || 0)),
               maxWidth: t.maxWidth,
               fontWeight: t.fontWeight,
               align: t.align
@@ -590,8 +592,8 @@ function hi(pt) {
                 fill: "none",
                 pointerEvents: "all"
               },
-              width: m,
-              height: p
+              width: h,
+              height: f
             }
           )
         ] })
@@ -604,8 +606,8 @@ function hi(pt) {
         body: X,
         xPos: st,
         yPos: A,
-        backgroundStyle: x?.tooltip,
-        className: y?.tooltip
+        backgroundStyle: y?.tooltip,
+        className: d?.tooltip
       }
     ) : null
   ] });
@@ -615,11 +617,11 @@ function Yi(pt) {
     data: N,
     graphTitle: D,
     suffix: Y = "",
-    sources: g,
+    sources: l,
     prefix: L = "",
     graphDescription: w,
     height: r,
-    width: l,
+    width: c,
     footNote: J,
     noOfXTicks: ft = 10,
     dateFormat: j = "yyyy",
@@ -649,13 +651,13 @@ function Yi(pt) {
     colorLegendTitle: et,
     diffAreaColors: at = [dt.alerts.red, dt.alerts.darkGreen],
     strokeWidth: F = 2,
-    showDots: x = !0,
-    refValues: y = [],
+    showDots: y = !0,
+    refValues: d = [],
     minValue: T,
     maxValue: nt,
     annotations: ot = [],
     customHighlightAreaSettings: s = [],
-    theme: c = "light",
+    theme: m = "light",
     ariaLabel: vt,
     yAxisTitle: M,
     noOfYTicks: S = 5,
@@ -664,25 +666,25 @@ function Yi(pt) {
     curveType: lt = "curve",
     styles: A,
     classNames: C,
-    precision: u = 2,
+    precision: p = 2,
     customLayers: ct = []
-  } = pt, [i, mt] = W(0), [ht, m] = W(0), p = ut(null), xt = ut(null);
+  } = pt, [i, mt] = W(0), [ht, h] = W(0), f = ut(null), xt = ut(null);
   return Dt(() => {
-    const h = new ResizeObserver((q) => {
-      mt(l || q[0].target.clientWidth || 620), m(r || q[0].target.clientHeight || 480);
+    const x = new ResizeObserver((q) => {
+      mt(c || q[0].target.clientWidth || 620), h(r || q[0].target.clientHeight || 480);
     });
-    return p.current && (m(p.current.clientHeight || 480), mt(p.current.clientWidth || 620), l || h.observe(p.current)), () => h.disconnect();
-  }, [l, r]), /* @__PURE__ */ e.jsx(
+    return f.current && (h(f.current.clientHeight || 480), mt(f.current.clientWidth || 620), c || x.observe(f.current)), () => x.disconnect();
+  }, [c, r]), /* @__PURE__ */ e.jsx(
     "div",
     {
-      className: `${c || "light"} flex  ${l ? "w-fit grow-0" : "w-full grow"}`,
+      className: `${m || "light"} flex  ${c ? "w-fit grow-0" : "w-full grow"}`,
       dir: k === "he" || k === "ar" ? "rtl" : void 0,
       children: /* @__PURE__ */ e.jsx(
         "div",
         {
           className: G(
             `${V ? V === !0 ? "bg-primary-gray-200 dark:bg-primary-gray-650 " : "" : "bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${k || "en"}`,
-            l ? "w-fit" : "w-full",
+            c ? "w-fit" : "w-full",
             C?.graphContainer
           ),
           style: {
@@ -711,9 +713,9 @@ function Yi(pt) {
                     },
                     graphTitle: D,
                     graphDescription: w,
-                    width: l,
+                    width: c,
                     graphDownload: B ? xt.current : void 0,
-                    dataDownload: I ? N.map((h) => h.data).filter((h) => h !== void 0).length > 0 ? N.map((h) => h.data).filter((h) => h !== void 0) : N.filter((h) => h !== void 0) : null
+                    dataDownload: I ? N.map((x) => x.data).filter((x) => x !== void 0).length > 0 ? N.map((x) => x.data).filter((x) => x !== void 0) : N.filter((x) => x !== void 0) : null
                   }
                 ) : null,
                 /* @__PURE__ */ e.jsx("div", { className: "grow flex flex-col justify-center gap-3 w-full", children: N.length === 0 ? /* @__PURE__ */ e.jsx(mi, {}) : /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
@@ -730,18 +732,18 @@ function Yi(pt) {
                     "div",
                     {
                       className: "flex flex-col grow justify-center leading-0",
-                      ref: p,
+                      ref: f,
                       "aria-label": "Graph area",
-                      children: (l || i) && (r || ht) ? /* @__PURE__ */ e.jsx(
+                      children: (c || i) && (r || ht) ? /* @__PURE__ */ e.jsx(
                         hi,
                         {
                           data: N,
                           lineColors: X,
                           colorDomain: U,
-                          width: l || i,
+                          width: c || i,
                           height: Math.max(
                             R,
-                            r || (b ? R ? (l || i) * b > R ? (l || i) * b : R : (l || i) * b : ht)
+                            r || (b ? R ? (c || i) * b > R ? (c || i) * b : R : (c || i) * b : ht)
                           ),
                           suffix: Y,
                           prefix: L,
@@ -761,8 +763,8 @@ function Yi(pt) {
                           diffAreaColors: at,
                           idSuffix: ci(8),
                           strokeWidth: F,
-                          showDots: x,
-                          refValues: y,
+                          showDots: y,
+                          refValues: d,
                           minValue: T,
                           maxValue: nt,
                           annotations: ot,
@@ -774,14 +776,14 @@ function Yi(pt) {
                           curveType: lt,
                           styles: A,
                           classNames: C,
-                          precision: u,
+                          precision: p,
                           customLayers: ct
                         }
                       ) : null
                     }
                   )
                 ] }) }),
-                g || J ? /* @__PURE__ */ e.jsx(
+                l || J ? /* @__PURE__ */ e.jsx(
                   ri,
                   {
                     styles: { footnote: A?.footnote, source: A?.source },
@@ -789,9 +791,9 @@ function Yi(pt) {
                       footnote: C?.footnote,
                       source: C?.source
                     },
-                    sources: g,
+                    sources: l,
                     footNote: J,
-                    width: l
+                    width: c
                   }
                 ) : null
               ] })