@undp/data-viz 1.5.1 → 1.5.3

package/dist/BulletChart.js

@@ -1,34 +1,34 @@
-import { j as e, m as Ni } from "./index-CHPV5EwG-BPSP-7Jg.js";
-import { useRef as ji, useState as gi, useEffect as ki } from "react";
-import { s as Vi } from "./index-fwdktvAS.js";
+import { j as e, m as Vi } from "./index-CHPV5EwG-BPSP-7Jg.js";
+import { useRef as ji, useState as gi, useEffect as zi } from "react";
+import { o as ki } from "./index-DvVprvy6.js";
 import { i as Oi } from "./index-Bwrro8-q.js";
 import { X as Ti } from "./Modal-DVVwpKhP.js";
 import { s as Ci } from "./index-CeVNqhMO.js";
-import { n as zi } from "./numberFormattingFunction-14YCbkN2.js";
+import { n as Ni } from "./numberFormattingFunction-14YCbkN2.js";
 import { T as $i } from "./Tooltip-CVCGWyzw.js";
-import { c as o } from "./checkIfNullOrUndefined-DmfiKkNw.js";
+import { c } from "./checkIfNullOrUndefined-DmfiKkNw.js";
 import { s as Ai } from "./string2HTML-oFCROsus.js";
 import { X as Xi } from "./XTicksAndGridLines-Bn9u5gOM.js";
 import { Y as Yi } from "./YAxesLabels-CPGZjmZJ.js";
 import { A as Di } from "./AxisTitle-BmHLMRJZ.js";
 import { A as Li } from "./Axis-Ddg-seDi.js";
-import { a as Ei, R as _i } from "./ReferenceLine-CfAW3vKJ.js";
+import { a as Ei, R as Gi } from "./ReferenceLine-CfAW3vKJ.js";
 import { a as Ii } from "./linear-DUdu7l2G.js";
 import { b as Si } from "./band-BEjh2CHI.js";
 import { u as Ri } from "./use-in-view-yS6jzJAp.js";
-import { m as G } from "./proxy-CkpFesk1.js";
+import { m as _ } from "./proxy-CkpFesk1.js";
 import { A as Bi } from "./index-CNvov0eg.js";
 import { GraphFooter as qi } from "./GraphFooter.js";
 import { GraphHeader as Fi } from "./GraphHeader.js";
 import { Colors as vi } from "./Colors.js";
 import { E as Hi } from "./EmptyState-DdTp-Mdn.js";
 import { ColorLegend as Pi } from "./ColorLegend.js";
-import { X as Gi } from "./XAxesLabels-CaV2q-6H.js";
+import { X as _i } from "./XAxesLabels-CaV2q-6H.js";
 import { Y as Ui } from "./YTicksAndGridLines-B6ah7CRf.js";
 function Ji(wi) {
   const {
     data: r,
-    barColor: b,
+    barColor: y,
     suffix: U,
     prefix: J,
     barPadding: K,
@@ -39,75 +39,75 @@ function Ji(wi) {
     width: Z,
     height: ii,
     rightMargin: bi,
-    topMargin: N,
+    topMargin: z,
     bottomMargin: ti,
-    showLabels: h,
-    tooltip: B,
+    showLabels: o,
+    tooltip: R,
     onSeriesMouseOver: T,
-    refValues: D,
+    refValues: A,
     highlightedDataPoints: g,
-    maxValue: q,
-    minValue: w,
-    onSeriesMouseClick: F,
+    maxValue: B,
+    minValue: b,
+    onSeriesMouseClick: q,
     labelOrder: ei,
-    rtl: H,
-    maxBarThickness: L,
+    rtl: F,
+    maxBarThickness: D,
     minBarThickness: di,
-    resetSelectionOnDoubleClick: I,
+    resetSelectionOnDoubleClick: L,
     detailsOnClick: $,
     barAxisTitle: ai,
-    valueColor: si,
-    noOfTicks: z,
+    valueColor: ni,
+    noOfTicks: k,
     styles: x,
     classNames: C,
     targetStyle: li,
-    targetColor: P,
-    qualitativeRangeColors: W,
-    measureBarWidthFactor: c,
-    animate: n,
-    dimmedOpacity: k,
-    precision: X,
+    targetColor: H,
+    qualitativeRangeColors: I,
+    measureBarWidthFactor: h,
+    animate: s,
+    dimmedOpacity: j,
+    precision: P,
     customLayers: S,
-    naLabel: A
-  } = wi, f = ji(null), m = Ri(f, {
-    once: n.once,
-    amount: n.amount
-  }), [ni, Y] = gi(void 0), [j, E] = gi(void 0), [oi, V] = gi(void 0), [p, y] = gi(void 0), u = {
-    top: ai ? N + 25 : N,
+    naLabel: W
+  } = wi, p = ji(null), m = Ri(p, {
+    once: s.once,
+    amount: s.amount
+  }), [si, X] = gi(void 0), [V, Y] = gi(void 0), [oi, N] = gi(void 0), [f, w] = gi(void 0), u = {
+    top: ai ? z + 25 : z,
     bottom: ti,
     left: yi,
     right: bi
-  }, R = Z - u.left - u.right, O = ii - u.top - u.bottom, hi = Math.max(...r.filter((i) => !o(i.size)).map((i) => i.size)) < 0 ? 0 : Math.max(...r.filter((i) => !o(i.size)).map((i) => i.size)), _ = Math.max(...r.filter((i) => !o(i.target)).map((i) => i.target)) < 0 ? 0 : Math.max(
-    ...r.filter((i) => !o(i.target)).map((i) => i.target)
+  }, E = Z - u.left - u.right, O = ii - u.top - u.bottom, hi = Math.max(...r.filter((i) => !c(i.size)).map((i) => i.size)) < 0 ? 0 : Math.max(...r.filter((i) => !c(i.size)).map((i) => i.size)), G = Math.max(...r.filter((i) => !c(i.target)).map((i) => i.target)) < 0 ? 0 : Math.max(
+    ...r.filter((i) => !c(i.target)).map((i) => i.target)
   ), ci = Math.max(
-    ...r.map((i) => Ci((i.qualitativeRange || []).filter((s) => !o(s))) || 0)
-  ), xi = o(q) ? Math.max(...[hi, _, ci].filter(Number.isFinite)) < 0 ? 0 : Math.max(
-    ...[hi, _, ci].filter(Number.isFinite)
-  ) : q, ui = Math.min(...r.filter((i) => !o(i.size)).map((i) => i.size)) >= 0 ? 0 : Math.min(...r.filter((i) => !o(i.size)).map((i) => i.size)), M = Math.min(...r.filter((i) => !o(i.target)).map((i) => i.target)) >= 0 ? 0 : Math.min(
-    ...r.filter((i) => !o(i.target)).map((i) => i.target)
-  ), a = o(w) ? Math.min(...[ui, M].filter(Number.isFinite)) >= 0 ? 0 : Math.min(...[ui, M].filter(Number.isFinite)) : w, fi = r.map((i, s) => ({
+    ...r.map((i) => Ci((i.qualitativeRange || []).filter((n) => !c(n))) || 0)
+  ), xi = c(B) ? Math.max(...[hi, G, ci].filter(Number.isFinite)) < 0 ? 0 : Math.max(
+    ...[hi, G, ci].filter(Number.isFinite)
+  ) : B, ui = Math.min(...r.filter((i) => !c(i.size)).map((i) => i.size)) >= 0 ? 0 : Math.min(...r.filter((i) => !c(i.size)).map((i) => i.size)), M = Math.min(...r.filter((i) => !c(i.target)).map((i) => i.target)) >= 0 ? 0 : Math.min(
+    ...r.filter((i) => !c(i.target)).map((i) => i.target)
+  ), a = c(b) ? Math.min(...[ui, M].filter(Number.isFinite)) >= 0 ? 0 : Math.min(...[ui, M].filter(Number.isFinite)) : b, fi = r.map((i, n) => ({
     ...i,
-    id: ei ? `${i.label}` : `${s}`
-  })), l = Ii().domain([a, xi]).range([0, R]).nice(), v = ei || fi.map((i) => `${i.id}`), d = Si().domain(v).range([
+    id: ei ? `${i.label}` : `${n}`
+  })), l = Ii().domain([a, xi]).range([0, E]).nice(), v = ei || fi.map((i) => `${i.id}`), d = Si().domain(v).range([
     0,
-    di ? Math.max(O, di * v.length) : L ? Math.min(O, L * v.length) : O
-  ]).paddingInner(K), t = l.ticks(z);
+    di ? Math.max(O, di * v.length) : D ? Math.min(O, D * v.length) : O
+  ]).paddingInner(K), t = l.ticks(k);
   return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
     /* @__PURE__ */ e.jsx(
-      G.svg,
+      _.svg,
       {
         width: `${Z}px`,
         height: `${ii}px`,
         viewBox: `0 0 ${Z} ${ii}`,
         direction: "ltr",
-        ref: f,
+        ref: p,
         children: /* @__PURE__ */ e.jsxs("g", { transform: `translate(${u.left},${u.top})`, children: [
           Q ? /* @__PURE__ */ e.jsx(
             Xi,
             {
               values: t.filter((i) => i !== 0),
               x: t.filter((i) => i !== 0).map((i) => l(i)),
-              y1: 0 - N,
+              y1: 0 - z,
               y2: O + u.bottom,
               styles: {
                 gridLines: x?.xAxis?.gridLines,
@@ -121,13 +121,13 @@ function Ji(wi) {
               prefix: J,
               labelType: "secondary",
               showGridLines: !0,
-              precision: X
+              precision: P
             }
           ) : null,
           /* @__PURE__ */ e.jsx(
             Di,
             {
-              x: R / 2,
+              x: E / 2,
               y: 0 - u.top + 15,
               style: x?.xAxis?.title,
               className: C?.xAxis?.title,
@@ -148,52 +148,52 @@ function Ji(wi) {
           S.filter((i) => i.position === "before").map((i) => i.layer),
           /* @__PURE__ */ e.jsxs(Bi, { children: [
             fi.map(
-              (i) => o(d(i.id)) ? null : /* @__PURE__ */ e.jsxs(
-                G.g,
+              (i) => c(d(i.id)) ? null : /* @__PURE__ */ e.jsxs(
+                _.g,
                 {
                   className: "undp-viz-g-with-hover",
-                  onMouseEnter: (s) => {
-                    Y(i), y(s.clientY), V(s.clientX), T?.(i);
+                  onMouseEnter: (n) => {
+                    X(i), w(n.clientY), N(n.clientX), T?.(i);
                   },
                   onClick: () => {
-                    (F || $) && (Oi(j, i) && I ? (E(void 0), F?.(void 0)) : (E(i), F?.(i)));
+                    (q || $) && (Oi(V, i) && L ? (Y(void 0), q?.(void 0)) : (Y(i), q?.(i)));
                   },
-                  onMouseMove: (s) => {
-                    Y(i), y(s.clientY), V(s.clientX);
+                  onMouseMove: (n) => {
+                    X(i), w(n.clientY), N(n.clientX);
                   },
                   onMouseLeave: () => {
-                    Y(void 0), V(void 0), y(void 0), T?.(void 0);
+                    X(void 0), N(void 0), w(void 0), T?.(void 0);
                   },
-                  exit: { opacity: 0, transition: { duration: n.duration } },
+                  exit: { opacity: 0, transition: { duration: s.duration } },
                   variants: {
                     initial: {
                       x: 0,
                       y: d(`${i.id}`),
-                      opacity: g.length !== 0 ? g.indexOf(i.label) !== -1 ? 0.85 : k : 0.85
+                      opacity: g.length !== 0 ? g.indexOf(i.label) !== -1 ? 0.85 : j : 0.85
                     },
                     whileInView: {
                       x: 0,
                       y: d(`${i.id}`),
-                      opacity: g.length !== 0 ? g.indexOf(i.label) !== -1 ? 0.85 : k : 0.85,
-                      transition: { duration: n.duration }
+                      opacity: g.length !== 0 ? g.indexOf(i.label) !== -1 ? 0.85 : j : 0.85,
+                      transition: { duration: s.duration }
                     }
                   },
                   initial: "initial",
                   animate: m ? "whileInView" : "initial",
                   children: [
-                    i.qualitativeRange ? i.qualitativeRange.map((s, pi) => /* @__PURE__ */ e.jsx(
-                      G.rect,
+                    i.qualitativeRange ? i.qualitativeRange.map((n, pi) => /* @__PURE__ */ e.jsx(
+                      _.rect,
                       {
                         exit: {
                           width: 0,
                           x: l(0),
-                          transition: { duration: n.duration }
+                          transition: { duration: s.duration }
                         },
                         variants: {
                           initial: {
                             x: l(0),
                             width: 0,
-                            fill: W[pi]
+                            fill: I[pi]
                           },
                           whileInView: {
                             x: l(
@@ -203,9 +203,9 @@ function Ji(wi) {
                                 )
                               )
                             ),
-                            width: l(s),
-                            fill: W[pi],
-                            transition: { duration: n.duration }
+                            width: l(n),
+                            fill: I[pi],
+                            transition: { duration: s.duration }
                           }
                         },
                         initial: "initial",
@@ -216,18 +216,18 @@ function Ji(wi) {
                       pi
                     )) : null,
                     i.target && li === "background" ? /* @__PURE__ */ e.jsx(
-                      G.rect,
+                      _.rect,
                       {
                         y: 0,
                         x: i.target >= 0 ? l(0) : l(i.target),
                         height: d.bandwidth(),
                         style: {
-                          fill: P
+                          fill: H
                         },
                         exit: {
                           width: 0,
                           x: l(0),
-                          transition: { duration: n.duration }
+                          transition: { duration: s.duration }
                         },
                         variants: {
                           initial: {
@@ -237,7 +237,7 @@ function Ji(wi) {
                           whileInView: {
                             x: i.target >= 0 ? l(0) : l(i.target),
                             width: i.target >= 0 ? l(i.target) - l(0) : l(0) - l(i.target),
-                            transition: { duration: n.duration }
+                            transition: { duration: s.duration }
                           }
                         },
                         initial: "initial",
@@ -245,17 +245,17 @@ function Ji(wi) {
                       }
                     ) : null,
                     i.size ? /* @__PURE__ */ e.jsx(
-                      G.rect,
+                      _.rect,
                       {
-                        y: d.bandwidth() * ((1 - c) / 2),
+                        y: d.bandwidth() * ((1 - h) / 2),
                         style: {
-                          fill: b
+                          fill: y
                         },
-                        height: d.bandwidth() * c,
+                        height: d.bandwidth() * h,
                         exit: {
                           width: 0,
                           x: l(0),
-                          transition: { duration: n.duration }
+                          transition: { duration: s.duration }
                         },
                         variants: {
                           initial: {
@@ -265,7 +265,7 @@ function Ji(wi) {
                           whileInView: {
                             x: i.size >= 0 ? l(0) : l(i.size),
                             width: i.size >= 0 ? l(i.size) - l(0) : l(0) - l(i.size),
-                            transition: { duration: n.duration }
+                            transition: { duration: s.duration }
                           }
                         },
                         initial: "initial",
@@ -273,18 +273,18 @@ function Ji(wi) {
                       }
                     ) : null,
                     i.target && li === "line" ? /* @__PURE__ */ e.jsx(
-                      G.rect,
+                      _.rect,
                       {
                         y: 0,
                         height: d.bandwidth(),
                         style: {
-                          fill: P
+                          fill: H
                         },
                         width: 2,
                         exit: {
                           opacity: 0,
                           x: l(0),
-                          transition: { duration: n.duration }
+                          transition: { duration: s.duration }
                         },
                         variants: {
                           initial: {
@@ -294,14 +294,14 @@ function Ji(wi) {
                           whileInView: {
                             x: l(i.target) - 1,
                             opacity: 1,
-                            transition: { duration: n.duration }
+                            transition: { duration: s.duration }
                           }
                         },
                         initial: "initial",
                         animate: m ? "whileInView" : "initial"
                       }
                     ) : null,
-                    h ? /* @__PURE__ */ e.jsx(
+                    o ? /* @__PURE__ */ e.jsx(
                       Yi,
                       {
                         value: `${i.label}`.length < mi ? `${i.label}` : `${`${i.label}`.substring(0, mi)}...`,
@@ -312,27 +312,27 @@ function Ji(wi) {
                         alignment: i.size && i.size < 0 ? "left" : "right",
                         style: x?.yAxis?.labels,
                         className: C?.yAxis?.labels,
-                        animate: n,
+                        animate: s,
                         isInView: m
                       }
                     ) : null,
                     ri ? /* @__PURE__ */ e.jsx(
-                      G.text,
+                      _.text,
                       {
                         y: d.bandwidth() / 2,
                         style: {
-                          ...si ? { fill: si } : { fill: b },
+                          ...ni ? { fill: ni } : { fill: y },
                           textAnchor: i.size && i.size < 0 ? "end" : "start",
                           ...x?.graphObjectValues || {}
                         },
-                        className: Ni(
+                        className: Vi(
                           "graph-value text-sm",
-                          !si && b.length > 1 ? " fill-primary-gray-600 dark:fill-primary-gray-300" : "",
+                          !ni && y.length > 1 ? " fill-primary-gray-600 dark:fill-primary-gray-300" : "",
                           C?.graphObjectValues
                         ),
                         dx: i.size && i.size < 0 ? -5 : 5,
                         dy: "0.33em",
-                        exit: { opacity: 0, transition: { duration: n.duration } },
+                        exit: { opacity: 0, transition: { duration: s.duration } },
                         variants: {
                           initial: {
                             x: l(0),
@@ -341,12 +341,12 @@ function Ji(wi) {
                           whileInView: {
                             x: i.size ? l(i.size) : l(0),
                             opacity: 1,
-                            transition: { duration: n.duration }
+                            transition: { duration: s.duration }
                           }
                         },
                         initial: "initial",
                         animate: m ? "whileInView" : "initial",
-                        children: zi(i.size, A, X, J, U)
+                        children: Ni(i.size, W, P, J, U)
                       }
                     ) : null
                   ]
@@ -354,7 +354,7 @@ function Ji(wi) {
                 i.label
               )
             ),
-            D ? /* @__PURE__ */ e.jsx(e.Fragment, { children: D.map((i, s) => /* @__PURE__ */ e.jsx(
+            A ? /* @__PURE__ */ e.jsx(e.Fragment, { children: A.map((i, n) => /* @__PURE__ */ e.jsx(
               Ei,
               {
                 text: i.text,
@@ -362,43 +362,43 @@ function Ji(wi) {
                 x: l(i.value),
                 y1: 0 - u.top,
                 y2: O + u.bottom,
-                textSide: l(i.value) > R * 0.75 || H ? "left" : "right",
+                textSide: l(i.value) > E * 0.75 || F ? "left" : "right",
                 classNames: i.classNames,
                 styles: i.styles,
-                animate: n,
+                animate: s,
                 isInView: m
               },
-              s
+              n
             )) }) : null
           ] }),
           S.filter((i) => i.position === "after").map((i) => i.layer)
         ] })
       }
     ),
-    ni && B && oi && p ? /* @__PURE__ */ e.jsx(
+    si && R && oi && f ? /* @__PURE__ */ e.jsx(
       $i,
       {
-        data: ni,
-        body: B,
+        data: si,
+        body: R,
         xPos: oi,
-        yPos: p,
+        yPos: f,
         backgroundStyle: x?.tooltip,
         className: C?.tooltip
       }
     ) : null,
-    $ && j !== void 0 ? /* @__PURE__ */ e.jsx(
+    $ && V !== void 0 ? /* @__PURE__ */ e.jsx(
       Ti,
       {
-        open: j !== void 0,
+        open: V !== void 0,
         onClose: () => {
-          E(void 0);
+          Y(void 0);
         },
         children: /* @__PURE__ */ e.jsx(
           "div",
           {
             className: "graph-modal-content m-0",
-            dangerouslySetInnerHTML: typeof $ == "string" ? { __html: Ai($, j) } : void 0,
-            children: typeof $ == "function" ? $(j) : null
+            dangerouslySetInnerHTML: typeof $ == "string" ? { __html: Ai($, V) } : void 0,
+            children: typeof $ == "function" ? $(V) : null
           }
         )
       }
@@ -408,7 +408,7 @@ function Ji(wi) {
 function Ki(wi) {
   const {
     data: r,
-    graphTitle: b,
+    graphTitle: y,
     barColor: U = vi.primaryColors["blue-600"],
     suffix: J = "",
     sources: K,
@@ -419,112 +419,112 @@ function Ki(wi) {
     showTicks: Z = !0,
     leftMargin: ii = 100,
     rightMargin: bi = 40,
-    truncateBy: N = 999,
+    truncateBy: z = 999,
     height: ti,
-    width: h,
-    footNote: B,
+    width: o,
+    footNote: R,
     colorDomain: T,
-    colorLegendTitle: D,
+    colorLegendTitle: A,
     highlightedDataPoints: g = [],
-    padding: q,
-    backgroundColor: w = !1,
-    topMargin: F = 25,
+    padding: B,
+    backgroundColor: b = !1,
+    topMargin: q = 25,
     bottomMargin: ei = 10,
-    showLabels: H = !0,
-    relativeHeight: L,
+    showLabels: F = !0,
+    relativeHeight: D,
     tooltip: di,
-    onSeriesMouseOver: I,
+    onSeriesMouseOver: L,
     refValues: $,
     showColorScale: ai = !0,
-    graphID: si,
-    maxValue: z,
+    graphID: ni,
+    maxValue: k,
     minValue: x,
     onSeriesMouseClick: C,
     graphDownload: li = !1,
-    dataDownload: P = !1,
-    sortData: W,
-    labelOrder: c,
-    language: n = "en",
-    minHeight: k = 0,
-    theme: X = "light",
+    dataDownload: H = !1,
+    sortData: I,
+    labelOrder: h,
+    language: s = "en",
+    minHeight: j = 0,
+    theme: P = "light",
     maxBarThickness: S,
-    maxNumberOfBars: A,
-    minBarThickness: f,
+    maxNumberOfBars: W,
+    minBarThickness: p,
     ariaLabel: m,
-    resetSelectionOnDoubleClick: ni = !0,
-    detailsOnClick: Y,
-    barAxisTitle: j,
-    noOfTicks: E = 5,
+    resetSelectionOnDoubleClick: si = !0,
+    detailsOnClick: X,
+    barAxisTitle: V,
+    noOfTicks: Y = 5,
     valueColor: oi,
-    styles: V,
-    classNames: p,
-    filterNA: y = !0,
+    styles: N,
+    classNames: f,
+    filterNA: w = !0,
     targetStyle: u = "line",
-    targetColor: R = vi.light.grays["gray-700"],
+    targetColor: E = vi.light.grays["gray-700"],
     qualitativeRangeColors: O,
     measureBarWidthFactor: hi = 0.4,
-    animate: _ = !1,
+    animate: G = !1,
     dimmedOpacity: ci = 0.3,
     precision: xi = 2,
     customLayers: ui = [],
     naLabel: M = "NA"
   } = wi, [a, fi] = gi(0), [l, v] = gi(0), d = ji(null), t = ji(null);
-  return ki(() => {
-    const i = new ResizeObserver((s) => {
-      fi(h || s[0].target.clientWidth || 620), v(ti || s[0].target.clientHeight || 480);
+  return zi(() => {
+    const i = new ResizeObserver((n) => {
+      fi(o || n[0].target.clientWidth || 620), v(ti || n[0].target.clientHeight || 480);
     });
-    return d.current && (v(d.current.clientHeight || 480), fi(d.current.clientWidth || 620), h || i.observe(d.current)), () => i.disconnect();
-  }, [h, ti]), /* @__PURE__ */ e.jsx(
+    return d.current && (v(d.current.clientHeight || 480), fi(d.current.clientWidth || 620), o || i.observe(d.current)), () => i.disconnect();
+  }, [o, ti]), /* @__PURE__ */ e.jsx(
     "div",
     {
-      className: `${X || "light"} flex ${h ? "w-fit grow-0" : "w-full grow"}`,
-      dir: n === "he" || n === "ar" ? "rtl" : void 0,
+      className: `${P || "light"} flex ${o ? "w-fit grow-0" : "w-full grow"}`,
+      dir: s === "he" || s === "ar" ? "rtl" : void 0,
       children: /* @__PURE__ */ e.jsx(
         "div",
         {
-          className: Ni(
-            `${w ? w === !0 ? "bg-primary-gray-200 dark:bg-primary-gray-650 " : "" : "bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${n || "en"}`,
-            h ? "w-fit" : "w-full",
-            p?.graphContainer
+          className: Vi(
+            `${b ? b === !0 ? "bg-primary-gray-200 dark:bg-primary-gray-650 " : "" : "bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${s || "en"}`,
+            o ? "w-fit" : "w-full",
+            f?.graphContainer
           ),
           style: {
-            ...V?.graphContainer || {},
-            ...w && w !== !0 ? { backgroundColor: w } : {}
+            ...N?.graphContainer || {},
+            ...b && b !== !0 ? { backgroundColor: b } : {}
           },
-          id: si,
+          id: ni,
           ref: t,
-          "aria-label": m || `${b ? `The graph shows ${b}. ` : ""}This is a bar chart. ${Q ? ` ${Q}` : ""}`,
+          "aria-label": m || `${y ? `The graph shows ${y}. ` : ""}This is a bar chart. ${Q ? ` ${Q}` : ""}`,
           children: /* @__PURE__ */ e.jsx(
             "div",
             {
               className: "flex grow",
-              style: { padding: w ? q || "1rem" : q || 0 },
+              style: { padding: b ? B || "1rem" : B || 0 },
               children: /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col w-full gap-4 grow justify-between", children: [
-                b || Q || li || P ? /* @__PURE__ */ e.jsx(
+                y || Q || li || H ? /* @__PURE__ */ e.jsx(
                   Fi,
                   {
                     styles: {
-                      title: V?.title,
-                      description: V?.description
+                      title: N?.title,
+                      description: N?.description
                     },
                     classNames: {
-                      title: p?.title,
-                      description: p?.description
+                      title: f?.title,
+                      description: f?.description
                     },
-                    graphTitle: b,
+                    graphTitle: y,
                     graphDescription: Q,
-                    width: h,
+                    width: o,
                     graphDownload: li ? t.current : void 0,
-                    dataDownload: P ? r.map((i) => i.data).filter((i) => i !== void 0).length > 0 ? r.map((i) => i.data).filter((i) => i !== void 0) : r.filter((i) => i !== void 0) : null
+                    dataDownload: H ? r.map((i) => i.data).filter((i) => i !== void 0).length > 0 ? r.map((i) => i.data).filter((i) => i !== void 0) : r.filter((i) => i !== void 0) : null
                   }
                 ) : null,
                 /* @__PURE__ */ e.jsx("div", { className: "grow flex flex-col justify-center gap-3 w-full", children: r.length === 0 ? /* @__PURE__ */ e.jsx(Hi, {}) : /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
                   ai && r.filter((i) => i.qualitativeRange).length !== 0 && T ? /* @__PURE__ */ e.jsx(
                     Pi,
                     {
-                      width: h,
-                      colorLegendTitle: D,
-                      colors: O || vi[X].sequentialColors.positiveColorsx10,
+                      width: o,
+                      colorLegendTitle: A,
+                      colors: O || vi[P].sequentialColors.positiveColorsx10,
                       colorDomain: T,
                       showNAColor: !1
                     }
@@ -535,24 +535,22 @@ function Ki(wi) {
                       className: "flex grow flex-col justify-center w-full leading-0",
                       ref: d,
                       "aria-label": "Graph area",
-                      children: (h || a) && (ti || l) ? /* @__PURE__ */ e.jsx(
+                      children: (o || a) && (ti || l) ? /* @__PURE__ */ e.jsx(
                         Ji,
                         {
-                          data: W === "asc" ? Vi(
-                            r.filter((i) => y ? !o(i.size) : i),
-                            (i) => i.size
-                          ).filter((i, s) => A ? s < A : !0) : W === "desc" ? Vi(
-                            r.filter(
-                              (i) => y ? !o(i.size) : i
-                            ),
-                            (i) => i.size
-                          ).reverse().filter((i, s) => A ? s < A : !0) : r.filter((i) => y ? !o(i.size) : i).filter((i, s) => A ? s < A : !0),
+                          data: I ? ki(
+                            r.filter((i) => w ? !c(i.size) : i),
+                            [
+                              (i) => i.size === void 0 ? I === "asc" ? -1 / 0 : 1 / 0 : i.size
+                            ],
+                            [I]
+                          ).filter((i, n) => W ? n < W : !0) : r.filter((i) => w ? !c(i.size) : i).filter((i, n) => W ? n < W : !0),
                           barColor: U,
-                          targetColor: R,
-                          width: h || a,
+                          targetColor: E,
+                          width: o || a,
                           height: Math.max(
-                            k,
-                            ti || (L ? k ? (h || a) * L > k ? (h || a) * L : k : (h || a) * L : l)
+                            j,
+                            ti || (D ? j ? (o || a) * D > j ? (o || a) * D : j : (o || a) * D : l)
                           ),
                           suffix: J,
                           prefix: ri,
@@ -561,32 +559,32 @@ function Ki(wi) {
                           showTicks: Z,
                           leftMargin: ii,
                           rightMargin: bi,
-                          topMargin: F,
+                          topMargin: q,
                           bottomMargin: ei,
-                          truncateBy: N,
-                          showLabels: H,
+                          truncateBy: z,
+                          showLabels: F,
                           tooltip: di,
-                          onSeriesMouseOver: I,
+                          onSeriesMouseOver: L,
                           refValues: $,
-                          maxValue: z,
+                          maxValue: k,
                           minValue: x,
                           highlightedDataPoints: g,
                           onSeriesMouseClick: C,
-                          labelOrder: c,
-                          rtl: n === "he" || n === "ar",
+                          labelOrder: h,
+                          rtl: s === "he" || s === "ar",
                           maxBarThickness: S,
-                          minBarThickness: f,
-                          resetSelectionOnDoubleClick: ni,
-                          detailsOnClick: Y,
-                          barAxisTitle: j,
-                          noOfTicks: E,
+                          minBarThickness: p,
+                          resetSelectionOnDoubleClick: si,
+                          detailsOnClick: X,
+                          barAxisTitle: V,
+                          noOfTicks: Y,
                           valueColor: oi,
-                          classNames: p,
-                          styles: V,
+                          classNames: f,
+                          styles: N,
                           targetStyle: u,
-                          qualitativeRangeColors: O || vi[X].sequentialColors.positiveColorsx10,
+                          qualitativeRangeColors: O || vi[P].sequentialColors.positiveColorsx10,
                           measureBarWidthFactor: hi,
-                          animate: _ === !0 ? { duration: 0.5, once: !0, amount: 0.5 } : _ || { duration: 0, once: !0, amount: 0 },
+                          animate: G === !0 ? { duration: 0.5, once: !0, amount: 0.5 } : G || { duration: 0, once: !0, amount: 0 },
                           dimmedOpacity: ci,
                           precision: xi,
                           customLayers: ui,
@@ -596,16 +594,16 @@ function Ki(wi) {
                     }
                   )
                 ] }) }),
-                K || B ? /* @__PURE__ */ e.jsx(
+                K || R ? /* @__PURE__ */ e.jsx(
                   qi,
                   {
                     sources: K,
-                    footNote: B,
-                    width: h,
-                    styles: { footnote: V?.footnote, source: V?.source },
+                    footNote: R,
+                    width: o,
+                    styles: { footnote: N?.footnote, source: N?.source },
                     classNames: {
-                      footnote: p?.footnote,
-                      source: p?.source
+                      footnote: f?.footnote,
+                      source: f?.source
                     }
                   }
                 ) : null
@@ -620,7 +618,7 @@ function Ki(wi) {
 function Qi(wi) {
   const {
     data: r,
-    width: b,
+    width: y,
     height: U,
     barColor: J,
     suffix: K,
@@ -631,82 +629,82 @@ function Qi(wi) {
     showTicks: Z,
     truncateBy: ii,
     rightMargin: bi,
-    topMargin: N,
+    topMargin: z,
     bottomMargin: ti,
-    leftMargin: h,
-    tooltip: B,
+    leftMargin: o,
+    tooltip: R,
     onSeriesMouseOver: T,
-    refValues: D,
+    refValues: A,
     maxValue: g,
-    minValue: q,
-    highlightedDataPoints: w,
-    onSeriesMouseClick: F,
+    minValue: B,
+    highlightedDataPoints: b,
+    onSeriesMouseClick: q,
     labelOrder: ei,
-    maxBarThickness: H,
-    minBarThickness: L,
+    maxBarThickness: F,
+    minBarThickness: D,
     resetSelectionOnDoubleClick: di,
-    detailsOnClick: I,
+    detailsOnClick: L,
     barAxisTitle: $,
     valueColor: ai,
-    noOfTicks: si,
-    styles: z,
+    noOfTicks: ni,
+    styles: k,
     classNames: x,
     targetStyle: C,
     targetColor: li,
-    qualitativeRangeColors: P,
-    measureBarWidthFactor: W,
-    animate: c,
-    dimmedOpacity: n,
-    precision: k,
-    customLayers: X,
+    qualitativeRangeColors: H,
+    measureBarWidthFactor: I,
+    animate: h,
+    dimmedOpacity: s,
+    precision: j,
+    customLayers: P,
     naLabel: S
-  } = wi, A = ji(null), f = Ri(A, {
-    once: c.once,
-    amount: c.amount
+  } = wi, W = ji(null), p = Ri(W, {
+    once: h.once,
+    amount: h.amount
   }), m = {
-    top: N,
+    top: z,
     bottom: ti,
-    left: $ ? h + 30 : h,
+    left: $ ? o + 30 : o,
     right: bi
-  }, [ni, Y] = gi(void 0), [j, E] = gi(void 0), [oi, V] = gi(void 0), [p, y] = gi(void 0), u = b - m.left - m.right, R = U - m.top - m.bottom, O = Math.max(...r.filter((t) => !o(t.size)).map((t) => t.size)) < 0 ? 0 : Math.max(...r.filter((t) => !o(t.size)).map((t) => t.size)), hi = Math.max(...r.filter((t) => !o(t.target)).map((t) => t.target)) < 0 ? 0 : Math.max(...r.filter((t) => !o(t.size)).map((t) => t.target)), _ = Math.max(
-    ...r.map((t) => Ci((t.qualitativeRange || []).filter((i) => !o(i))) || 0)
-  ), ci = o(g) ? Math.max(...[O, hi, _].filter(Number.isFinite)) < 0 ? 0 : Math.max(
-    ...[O, hi, _].filter(Number.isFinite)
-  ) : g, xi = Math.min(...r.filter((t) => !o(t.size)).map((t) => t.size)) >= 0 ? 0 : Math.min(...r.filter((t) => !o(t.size)).map((t) => t.size)), ui = Math.min(...r.filter((t) => !o(t.target)).map((t) => t.target)) >= 0 ? 0 : Math.min(
-    ...r.filter((t) => !o(t.target)).map((t) => t.target)
-  ), M = o(q) ? Math.min(...[xi, ui].filter(Number.isFinite)) >= 0 ? 0 : Math.min(...[xi, ui].filter(Number.isFinite)) : q, a = Ii().domain([M, ci]).range([R, 0]).nice(), fi = r.map((t, i) => ({
+  }, [si, X] = gi(void 0), [V, Y] = gi(void 0), [oi, N] = gi(void 0), [f, w] = gi(void 0), u = y - m.left - m.right, E = U - m.top - m.bottom, O = Math.max(...r.filter((t) => !c(t.size)).map((t) => t.size)) < 0 ? 0 : Math.max(...r.filter((t) => !c(t.size)).map((t) => t.size)), hi = Math.max(...r.filter((t) => !c(t.target)).map((t) => t.target)) < 0 ? 0 : Math.max(...r.filter((t) => !c(t.size)).map((t) => t.target)), G = Math.max(
+    ...r.map((t) => Ci((t.qualitativeRange || []).filter((i) => !c(i))) || 0)
+  ), ci = c(g) ? Math.max(...[O, hi, G].filter(Number.isFinite)) < 0 ? 0 : Math.max(
+    ...[O, hi, G].filter(Number.isFinite)
+  ) : g, xi = Math.min(...r.filter((t) => !c(t.size)).map((t) => t.size)) >= 0 ? 0 : Math.min(...r.filter((t) => !c(t.size)).map((t) => t.size)), ui = Math.min(...r.filter((t) => !c(t.target)).map((t) => t.target)) >= 0 ? 0 : Math.min(
+    ...r.filter((t) => !c(t.target)).map((t) => t.target)
+  ), M = c(B) ? Math.min(...[xi, ui].filter(Number.isFinite)) >= 0 ? 0 : Math.min(...[xi, ui].filter(Number.isFinite)) : B, a = Ii().domain([M, ci]).range([E, 0]).nice(), fi = r.map((t, i) => ({
     ...t,
     id: ei ? `${t.label}` : `${i}`
   })), l = ei || fi.map((t) => `${t.id}`), v = Si().domain(l).range([
     0,
-    L ? Math.max(u, L * l.length) : H ? Math.min(u, H * l.length) : u
-  ]).paddingInner(Q), d = a.ticks(si);
+    D ? Math.max(u, D * l.length) : F ? Math.min(u, F * l.length) : u
+  ]).paddingInner(Q), d = a.ticks(ni);
   return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
     /* @__PURE__ */ e.jsx(
-      G.svg,
+      _.svg,
       {
-        width: `${b}px`,
+        width: `${y}px`,
         height: `${U}px`,
-        viewBox: `0 0 ${b} ${U}`,
+        viewBox: `0 0 ${y} ${U}`,
         direction: "ltr",
-        ref: A,
+        ref: W,
         children: /* @__PURE__ */ e.jsxs("g", { transform: `translate(${m.left},${m.top})`, children: [
           /* @__PURE__ */ e.jsx(
             Li,
             {
               y1: a(M < 0 ? 0 : M),
               y2: a(M < 0 ? 0 : M),
-              x1: 0 - h,
+              x1: 0 - o,
               x2: u + m.right,
-              label: zi(
+              label: Ni(
                 M < 0 ? 0 : M,
                 S,
-                k,
+                j,
                 ri,
                 K
               ),
               labelPos: {
-                x: 0 - h,
+                x: 0 - o,
                 dx: 0,
                 dy: ci < 0 ? "1em" : -5,
                 y: a(M < 0 ? 0 : M)
@@ -715,7 +713,7 @@ function Qi(wi) {
                 axis: x?.xAxis?.axis,
                 label: x?.yAxis?.labels
               },
-              styles: { axis: z?.xAxis?.axis, label: z?.yAxis?.labels }
+              styles: { axis: k?.xAxis?.axis, label: k?.yAxis?.labels }
             }
           ),
           Z ? /* @__PURE__ */ e.jsx(
@@ -723,11 +721,11 @@ function Qi(wi) {
             {
               values: d.filter((t) => t !== 0),
               y: d.filter((t) => t !== 0).map((t) => a(t)),
-              x1: 0 - h,
+              x1: 0 - o,
               x2: u + m.right,
               styles: {
-                gridLines: z?.yAxis?.gridLines,
-                labels: z?.yAxis?.labels
+                gridLines: k?.yAxis?.gridLines,
+                labels: k?.yAxis?.labels
               },
               classNames: {
                 gridLines: x?.yAxis?.gridLines,
@@ -738,83 +736,83 @@ function Qi(wi) {
               labelType: "secondary",
               showGridLines: !0,
               labelPos: "vertical",
-              precision: k
+              precision: j
             }
           ) : null,
           /* @__PURE__ */ e.jsx(
             Di,
             {
-              x: 0 - h - 15,
-              y: R / 2,
-              style: z?.yAxis?.title,
+              x: 0 - o - 15,
+              y: E / 2,
+              style: k?.yAxis?.title,
               className: x?.yAxis?.title,
               text: $,
               rotate90: !0
             }
           ),
-          X.filter((t) => t.position === "before").map((t) => t.layer),
+          P.filter((t) => t.position === "before").map((t) => t.layer),
           /* @__PURE__ */ e.jsxs(Bi, { children: [
             fi.map(
-              (t) => o(v(t.id)) ? null : /* @__PURE__ */ e.jsxs(
-                G.g,
+              (t) => c(v(t.id)) ? null : /* @__PURE__ */ e.jsxs(
+                _.g,
                 {
                   className: "undp-viz-g-with-hover",
                   onMouseEnter: (i) => {
-                    Y(t), y(i.clientY), V(i.clientX), T?.(t);
+                    X(t), w(i.clientY), N(i.clientX), T?.(t);
                   },
                   onClick: () => {
-                    (F || I) && (Oi(j, t) && di ? (E(void 0), F?.(void 0)) : (E(t), F?.(t)));
+                    (q || L) && (Oi(V, t) && di ? (Y(void 0), q?.(void 0)) : (Y(t), q?.(t)));
                   },
                   onMouseMove: (i) => {
-                    Y(t), y(i.clientY), V(i.clientX);
+                    X(t), w(i.clientY), N(i.clientX);
                   },
                   onMouseLeave: () => {
-                    Y(void 0), V(void 0), y(void 0), T?.(void 0);
+                    X(void 0), N(void 0), w(void 0), T?.(void 0);
                   },
-                  exit: { opacity: 0, transition: { duration: c.duration } },
+                  exit: { opacity: 0, transition: { duration: h.duration } },
                   variants: {
                     initial: {
                       x: v(`${t.id}`),
                       y: 0,
-                      opacity: w.length !== 0 ? w.indexOf(t.label) !== -1 ? 0.85 : n : 0.85
+                      opacity: b.length !== 0 ? b.indexOf(t.label) !== -1 ? 0.85 : s : 0.85
                     },
                     whileInView: {
                       x: v(`${t.id}`),
                       y: 0,
-                      opacity: w.length !== 0 ? w.indexOf(t.label) !== -1 ? 0.85 : n : 0.85,
-                      transition: { duration: c.duration }
+                      opacity: b.length !== 0 ? b.indexOf(t.label) !== -1 ? 0.85 : s : 0.85,
+                      transition: { duration: h.duration }
                     }
                   },
                   initial: "initial",
-                  animate: f ? "whileInView" : "initial",
+                  animate: p ? "whileInView" : "initial",
                   children: [
-                    t.qualitativeRange ? t.qualitativeRange.map((i, s) => /* @__PURE__ */ e.jsx(
-                      G.rect,
+                    t.qualitativeRange ? t.qualitativeRange.map((i, n) => /* @__PURE__ */ e.jsx(
+                      _.rect,
                       {
                         x: 0,
                         exit: {
                           height: 0,
                           y: a(0),
-                          transition: { duration: c.duration }
+                          transition: { duration: h.duration }
                         },
                         variants: {
                           initial: {
                             height: 0,
                             y: a(0),
-                            fill: P[s]
+                            fill: H[n]
                           },
                           whileInView: {
                             height: Math.abs(
                               a(
                                 Ci(
                                   t.qualitativeRange.filter(
-                                    (pi, Mi) => Mi <= s && pi
+                                    (pi, Mi) => Mi <= n && pi
                                   )
                                 )
                               ) - a(
                                 Ci(
                                   t.qualitativeRange.filter(
-                                    (pi, Mi) => Mi < s && pi
+                                    (pi, Mi) => Mi < n && pi
                                   )
                                 )
                               )
@@ -822,22 +820,22 @@ function Qi(wi) {
                             y: a(
                               Ci(
                                 t.qualitativeRange.filter(
-                                  (pi, Mi) => Mi <= s && pi
+                                  (pi, Mi) => Mi <= n && pi
                                 )
                               )
                             ),
-                            fill: P[s],
-                            transition: { duration: c.duration }
+                            fill: H[n],
+                            transition: { duration: h.duration }
                           }
                         },
                         initial: "initial",
-                        animate: f ? "whileInView" : "initial",
+                        animate: p ? "whileInView" : "initial",
                         width: v.bandwidth()
                       },
-                      s
+                      n
                     )) : null,
                     t.target && C === "background" ? /* @__PURE__ */ e.jsx(
-                      G.rect,
+                      _.rect,
                       {
                         x: 0,
                         width: v.bandwidth(),
@@ -847,7 +845,7 @@ function Qi(wi) {
                         exit: {
                           height: 0,
                           y: a(0),
-                          transition: { duration: c.duration }
+                          transition: { duration: h.duration }
                         },
                         variants: {
                           initial: {
@@ -857,25 +855,25 @@ function Qi(wi) {
                           whileInView: {
                             height: Math.abs(a(t.target) - a(0)),
                             y: t.target > 0 ? a(t.target) : a(0),
-                            transition: { duration: c.duration }
+                            transition: { duration: h.duration }
                           }
                         },
                         initial: "initial",
-                        animate: f ? "whileInView" : "initial"
+                        animate: p ? "whileInView" : "initial"
                       }
                     ) : null,
                     t.size ? /* @__PURE__ */ e.jsx(
-                      G.rect,
+                      _.rect,
                       {
-                        x: v.bandwidth() * ((1 - W) / 2),
-                        width: v.bandwidth() * W,
+                        x: v.bandwidth() * ((1 - I) / 2),
+                        width: v.bandwidth() * I,
                         style: {
                           fill: J
                         },
                         exit: {
                           height: 0,
                           y: a(0),
-                          transition: { duration: c.duration }
+                          transition: { duration: h.duration }
                         },
                         variants: {
                           initial: {
@@ -885,15 +883,15 @@ function Qi(wi) {
                           whileInView: {
                             height: Math.abs(a(t.size) - a(0)),
                             y: t.size > 0 ? a(t.size) : a(0),
-                            transition: { duration: c.duration }
+                            transition: { duration: h.duration }
                           }
                         },
                         initial: "initial",
-                        animate: f ? "whileInView" : "initial"
+                        animate: p ? "whileInView" : "initial"
                       }
                     ) : null,
                     t.target && C === "line" ? /* @__PURE__ */ e.jsx(
-                      G.rect,
+                      _.rect,
                       {
                         x: 0,
                         width: v.bandwidth(),
@@ -903,7 +901,7 @@ function Qi(wi) {
                         exit: {
                           y: a(0),
                           opacity: 0,
-                          transition: { duration: c.duration }
+                          transition: { duration: h.duration }
                         },
                         variants: {
                           initial: {
@@ -913,45 +911,45 @@ function Qi(wi) {
                           whileInView: {
                             y: a(t.target) - 1,
                             opacity: 1,
-                            transition: { duration: c.duration }
+                            transition: { duration: h.duration }
                           }
                         },
                         initial: "initial",
-                        animate: f ? "whileInView" : "initial",
+                        animate: p ? "whileInView" : "initial",
                         height: 2
                       }
                     ) : null,
                     yi ? /* @__PURE__ */ e.jsx(
-                      Gi,
+                      _i,
                       {
                         value: `${t.label}`.length < ii ? `${t.label}` : `${`${t.label}`.substring(0, ii)}...`,
                         y: (t.size || 0) < 0 ? 0 : a(0) + 5,
                         x: 0,
                         width: v.bandwidth(),
                         height: (t.size || 0) < 0 ? a(0) - 5 : m.bottom,
-                        style: z?.xAxis?.labels,
+                        style: k?.xAxis?.labels,
                         className: x?.xAxis?.labels,
                         alignment: (t.size || 0) < 0 ? "bottom" : "top",
-                        animate: c,
-                        isInView: f
+                        animate: h,
+                        isInView: p
                       }
                     ) : null,
                     mi ? /* @__PURE__ */ e.jsx(
-                      G.text,
+                      _.text,
                       {
                         x: v.bandwidth() / 2,
                         style: {
                           ...ai ? { fill: ai } : { fill: J },
                           textAnchor: "middle",
-                          ...z?.graphObjectValues || {}
+                          ...k?.graphObjectValues || {}
                         },
-                        className: Ni(
+                        className: Vi(
                           "graph-value text-sm",
                           !ai && J.length > 1 ? " fill-primary-gray-600 dark:fill-primary-gray-300" : "",
                           x?.graphObjectValues
                         ),
                         dy: t.size ? t.size >= 0 ? "-5px" : "1em" : "-5px",
-                        exit: { opacity: 0, transition: { duration: c.duration } },
+                        exit: { opacity: 0, transition: { duration: h.duration } },
                         variants: {
                           initial: {
                             y: a(0),
@@ -960,12 +958,12 @@ function Qi(wi) {
                           whileInView: {
                             y: a(t.size || 0),
                             opacity: 1,
-                            transition: { duration: c.duration }
+                            transition: { duration: h.duration }
                           }
                         },
                         initial: "initial",
-                        animate: f ? "whileInView" : "initial",
-                        children: zi(t.size, S, k, ri, K)
+                        animate: p ? "whileInView" : "initial",
+                        children: Ni(t.size, S, j, ri, K)
                       }
                     ) : null
                   ]
@@ -973,50 +971,50 @@ function Qi(wi) {
                 t.label
               )
             ),
-            D ? /* @__PURE__ */ e.jsx(e.Fragment, { children: D.map((t, i) => /* @__PURE__ */ e.jsx(
-              _i,
+            A ? /* @__PURE__ */ e.jsx(e.Fragment, { children: A.map((t, i) => /* @__PURE__ */ e.jsx(
+              Gi,
               {
                 text: t.text,
                 color: t.color,
                 y: a(t.value),
-                x1: 0 - h,
+                x1: 0 - o,
                 x2: u + m.right,
                 classNames: t.classNames,
                 styles: t.styles,
-                animate: c,
-                isInView: f
+                animate: h,
+                isInView: p
               },
               i
             )) }) : null
           ] }),
-          X.filter((t) => t.position === "after").map((t) => t.layer)
+          P.filter((t) => t.position === "after").map((t) => t.layer)
         ] })
       }
     ),
-    ni && B && oi && p ? /* @__PURE__ */ e.jsx(
+    si && R && oi && f ? /* @__PURE__ */ e.jsx(
       $i,
       {
-        data: ni,
-        body: B,
+        data: si,
+        body: R,
         xPos: oi,
-        yPos: p,
-        backgroundStyle: z?.tooltip,
+        yPos: f,
+        backgroundStyle: k?.tooltip,
         className: x?.tooltip
       }
     ) : null,
-    I && j !== void 0 ? /* @__PURE__ */ e.jsx(
+    L && V !== void 0 ? /* @__PURE__ */ e.jsx(
       Ti,
       {
-        open: j !== void 0,
+        open: V !== void 0,
         onClose: () => {
-          E(void 0);
+          Y(void 0);
         },
         children: /* @__PURE__ */ e.jsx(
           "div",
           {
             className: "graph-modal-content m-0",
-            dangerouslySetInnerHTML: typeof I == "string" ? { __html: Ai(I, j) } : void 0,
-            children: typeof I == "function" ? I(j) : null
+            dangerouslySetInnerHTML: typeof L == "string" ? { __html: Ai(L, V) } : void 0,
+            children: typeof L == "function" ? L(V) : null
           }
         )
       }
@@ -1026,7 +1024,7 @@ function Qi(wi) {
 function Zi(wi) {
   const {
     data: r,
-    graphTitle: b,
+    graphTitle: y,
     barColor: U = vi.primaryColors["blue-600"],
     barPadding: J = 0.25,
     showTicks: K = !0,
@@ -1037,113 +1035,113 @@ function Zi(wi) {
     truncateBy: Z = 999,
     showLabels: ii = !0,
     showValues: bi = !0,
-    backgroundColor: N = !1,
+    backgroundColor: z = !1,
     suffix: ti = "",
-    prefix: h = "",
-    sources: B,
+    prefix: o = "",
+    sources: R,
     graphDescription: T,
-    height: D,
+    height: A,
     width: g,
-    footNote: q,
-    colorDomain: w,
-    colorLegendTitle: F,
+    footNote: B,
+    colorDomain: b,
+    colorLegendTitle: q,
     padding: ei,
-    relativeHeight: H,
-    tooltip: L,
+    relativeHeight: F,
+    tooltip: D,
     onSeriesMouseOver: di,
-    refValues: I,
+    refValues: L,
     showColorScale: $ = !0,
     graphID: ai,
-    maxValue: si,
-    minValue: z,
+    maxValue: ni,
+    minValue: k,
     highlightedDataPoints: x = [],
     qualitativeRangeColors: C,
     onSeriesMouseClick: li,
-    graphDownload: P = !1,
-    dataDownload: W = !1,
-    language: c = "en",
-    theme: n = "light",
-    sortData: k,
-    labelOrder: X,
+    graphDownload: H = !1,
+    dataDownload: I = !1,
+    language: h = "en",
+    theme: s = "light",
+    sortData: j,
+    labelOrder: P,
     minHeight: S = 0,
-    maxBarThickness: A,
-    maxNumberOfBars: f,
+    maxBarThickness: W,
+    maxNumberOfBars: p,
     minBarThickness: m,
-    ariaLabel: ni,
-    resetSelectionOnDoubleClick: Y = !0,
-    detailsOnClick: j,
-    barAxisTitle: E,
+    ariaLabel: si,
+    resetSelectionOnDoubleClick: X = !0,
+    detailsOnClick: V,
+    barAxisTitle: Y,
     noOfTicks: oi = 5,
-    valueColor: V,
-    styles: p,
-    classNames: y,
+    valueColor: N,
+    styles: f,
+    classNames: w,
     targetColor: u = vi.light.grays["gray-700"],
-    filterNA: R = !0,
+    filterNA: E = !0,
     targetStyle: O = "line",
     measureBarWidthFactor: hi = 0.4,
-    animate: _ = !1,
+    animate: G = !1,
     dimmedOpacity: ci = 0.3,
     precision: xi = 2,
     customLayers: ui = [],
     naLabel: M = "NA"
   } = wi, [a, fi] = gi(0), [l, v] = gi(0), d = ji(null), t = ji(null);
-  return ki(() => {
-    const i = new ResizeObserver((s) => {
-      fi(g || s[0].target.clientWidth || 620), v(D || s[0].target.clientHeight || 480);
+  return zi(() => {
+    const i = new ResizeObserver((n) => {
+      fi(g || n[0].target.clientWidth || 620), v(A || n[0].target.clientHeight || 480);
     });
     return d.current && (v(d.current.clientHeight || 480), fi(d.current.clientWidth || 620), g || i.observe(d.current)), () => i.disconnect();
-  }, [g, D]), /* @__PURE__ */ e.jsx(
+  }, [g, A]), /* @__PURE__ */ e.jsx(
     "div",
     {
-      className: `${n || "light"} flex  ${g ? "w-fit grow-0" : "w-full grow"}`,
-      dir: c === "he" || c === "ar" ? "rtl" : void 0,
+      className: `${s || "light"} flex  ${g ? "w-fit grow-0" : "w-full grow"}`,
+      dir: h === "he" || h === "ar" ? "rtl" : void 0,
       children: /* @__PURE__ */ e.jsx(
         "div",
         {
-          className: Ni(
-            `${N ? N === !0 ? "bg-primary-gray-200 dark:bg-primary-gray-650 " : "" : "bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${c || "en"}`,
+          className: Vi(
+            `${z ? z === !0 ? "bg-primary-gray-200 dark:bg-primary-gray-650 " : "" : "bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${h || "en"}`,
             g ? "w-fit" : "w-full",
-            y?.graphContainer
+            w?.graphContainer
           ),
           style: {
-            ...p?.graphContainer || {},
-            ...N && N !== !0 ? { backgroundColor: N } : {}
+            ...f?.graphContainer || {},
+            ...z && z !== !0 ? { backgroundColor: z } : {}
           },
           id: ai,
           ref: t,
-          "aria-label": ni || `${b ? `The graph shows ${b}. ` : ""}This is a grouped bar chart. ${T ? ` ${T}` : ""}`,
+          "aria-label": si || `${y ? `The graph shows ${y}. ` : ""}This is a grouped bar chart. ${T ? ` ${T}` : ""}`,
           children: /* @__PURE__ */ e.jsx(
             "div",
             {
               className: "flex grow",
-              style: { padding: N ? ei || "1rem" : ei || 0 },
+              style: { padding: z ? ei || "1rem" : ei || 0 },
               children: /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col w-full gap-4 grow justify-between", children: [
-                b || T || P || W ? /* @__PURE__ */ e.jsx(
+                y || T || H || I ? /* @__PURE__ */ e.jsx(
                   Fi,
                   {
                     styles: {
-                      title: p?.title,
-                      description: p?.description
+                      title: f?.title,
+                      description: f?.description
                     },
                     classNames: {
-                      title: y?.title,
-                      description: y?.description
+                      title: w?.title,
+                      description: w?.description
                     },
-                    graphTitle: b,
+                    graphTitle: y,
                     graphDescription: T,
                     width: g,
-                    graphDownload: P ? t.current : void 0,
-                    dataDownload: W ? r.map((i) => i.data).filter((i) => i !== void 0).length > 0 ? r.map((i) => i.data).filter((i) => i !== void 0) : r.filter((i) => i !== void 0) : null
+                    graphDownload: H ? t.current : void 0,
+                    dataDownload: I ? r.map((i) => i.data).filter((i) => i !== void 0).length > 0 ? r.map((i) => i.data).filter((i) => i !== void 0) : r.filter((i) => i !== void 0) : null
                   }
                 ) : null,
                 /* @__PURE__ */ e.jsx("div", { className: "grow flex flex-col justify-center gap-3 w-full", children: r.length === 0 ? /* @__PURE__ */ e.jsx(Hi, {}) : /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-                  $ && r.filter((i) => i.qualitativeRange).length !== 0 && w ? /* @__PURE__ */ e.jsx(
+                  $ && r.filter((i) => i.qualitativeRange).length !== 0 && b ? /* @__PURE__ */ e.jsx(
                     Pi,
                     {
                       width: g,
-                      colorLegendTitle: F,
-                      colors: C || vi[n].sequentialColors.positiveColorsx10,
-                      colorDomain: w,
+                      colorLegendTitle: q,
+                      colors: C || vi[s].sequentialColors.positiveColorsx10,
+                      colorDomain: b,
                       showNAColor: !1
                     }
                   ) : null,
@@ -1153,28 +1151,26 @@ function Zi(wi) {
                       className: "flex grow flex-col justify-center w-full leading-0",
                       ref: d,
                       "aria-label": "Graph area",
-                      children: (g || a) && (D || l) ? /* @__PURE__ */ e.jsx(
+                      children: (g || a) && (A || l) ? /* @__PURE__ */ e.jsx(
                         Qi,
                         {
-                          data: k === "asc" ? Vi(
-                            r.filter((i) => R ? !o(i.size) : i),
-                            (i) => i.size
-                          ).filter((i, s) => f ? s < f : !0) : k === "desc" ? Vi(
-                            r.filter(
-                              (i) => R ? !o(i.size) : i
-                            ),
-                            (i) => i.size
-                          ).reverse().filter((i, s) => f ? s < f : !0) : r.filter((i) => R ? !o(i.size) : i).filter((i, s) => f ? s < f : !0),
+                          data: j ? ki(
+                            r.filter((i) => E ? !c(i.size) : i),
+                            [
+                              (i) => i.size === void 0 ? j === "asc" ? -1 / 0 : 1 / 0 : i.size
+                            ],
+                            [j]
+                          ).filter((i, n) => p ? n < p : !0) : r.filter((i) => E ? !c(i.size) : i).filter((i, n) => p ? n < p : !0),
                           barColor: U,
                           targetColor: u,
                           width: g || a,
-                          refValues: I,
+                          refValues: L,
                           height: Math.max(
                             S,
-                            D || (H ? S ? (g || a) * H > S ? (g || a) * H : S : (g || a) * H : l)
+                            A || (F ? S ? (g || a) * F > S ? (g || a) * F : S : (g || a) * F : l)
                           ),
                           suffix: ti,
-                          prefix: h,
+                          prefix: o,
                           barPadding: J,
                           showLabels: ii,
                           showValues: bi,
@@ -1182,29 +1178,29 @@ function Zi(wi) {
                           truncateBy: Z,
                           leftMargin: ri,
                           rightMargin: Q,
-                          qualitativeRangeColors: C || vi[n].sequentialColors.positiveColorsx10,
+                          qualitativeRangeColors: C || vi[s].sequentialColors.positiveColorsx10,
                           topMargin: yi,
                           bottomMargin: mi,
-                          tooltip: L,
+                          tooltip: D,
                           onSeriesMouseOver: di,
-                          maxValue: si,
-                          minValue: z,
+                          maxValue: ni,
+                          minValue: k,
                           highlightedDataPoints: x,
                           onSeriesMouseClick: li,
-                          labelOrder: X,
-                          maxBarThickness: A,
+                          labelOrder: P,
+                          maxBarThickness: W,
                           minBarThickness: m,
-                          resetSelectionOnDoubleClick: Y,
-                          detailsOnClick: j,
-                          barAxisTitle: E,
+                          resetSelectionOnDoubleClick: X,
+                          detailsOnClick: V,
+                          barAxisTitle: Y,
                           noOfTicks: oi,
-                          valueColor: V,
-                          styles: p,
-                          classNames: y,
+                          valueColor: N,
+                          styles: f,
+                          classNames: w,
                           targetStyle: O,
                           dimmedOpacity: ci,
                           measureBarWidthFactor: hi,
-                          animate: _ === !0 ? { duration: 0.5, once: !0, amount: 0.5 } : _ || { duration: 0, once: !0, amount: 0 },
+                          animate: G === !0 ? { duration: 0.5, once: !0, amount: 0.5 } : G || { duration: 0, once: !0, amount: 0 },
                           precision: xi,
                           customLayers: ui,
                           naLabel: M
@@ -1213,16 +1209,16 @@ function Zi(wi) {
                     }
                   )
                 ] }) }),
-                B || q ? /* @__PURE__ */ e.jsx(
+                R || B ? /* @__PURE__ */ e.jsx(
                   qi,
                   {
-                    styles: { footnote: p?.footnote, source: p?.source },
+                    styles: { footnote: f?.footnote, source: f?.source },
                     classNames: {
-                      footnote: y?.footnote,
-                      source: y?.source
+                      footnote: w?.footnote,
+                      source: w?.source
                     },
-                    sources: B,
-                    footNote: q,
+                    sources: R,
+                    footNote: B,
                     width: g
                   }
                 ) : null
@@ -1237,7 +1233,7 @@ function Zi(wi) {
 function zt(wi) {
   const {
     data: r,
-    graphTitle: b,
+    graphTitle: y,
     barColor: U,
     barPadding: J,
     showTicks: K,
@@ -1248,61 +1244,61 @@ function zt(wi) {
     truncateBy: Z,
     showLabels: ii,
     showValues: bi,
-    backgroundColor: N,
+    backgroundColor: z,
     suffix: ti,
-    prefix: h,
-    sources: B,
+    prefix: o,
+    sources: R,
     graphDescription: T,
-    height: D,
+    height: A,
     width: g,
-    footNote: q,
-    colorDomain: w,
-    colorLegendTitle: F,
+    footNote: B,
+    colorDomain: b,
+    colorLegendTitle: q,
     padding: ei,
-    relativeHeight: H,
-    tooltip: L,
+    relativeHeight: F,
+    tooltip: D,
     onSeriesMouseOver: di,
-    refValues: I,
+    refValues: L,
     showColorScale: $,
     graphID: ai,
-    maxValue: si,
-    minValue: z,
+    maxValue: ni,
+    minValue: k,
     highlightedDataPoints: x,
     onSeriesMouseClick: C,
     graphDownload: li,
-    dataDownload: P,
-    language: W,
-    theme: c,
-    sortData: n,
-    labelOrder: k,
-    minHeight: X,
+    dataDownload: H,
+    language: I,
+    theme: h,
+    sortData: s,
+    labelOrder: j,
+    minHeight: P,
     maxBarThickness: S,
-    maxNumberOfBars: A,
-    minBarThickness: f,
+    maxNumberOfBars: W,
+    minBarThickness: p,
     ariaLabel: m,
-    resetSelectionOnDoubleClick: ni,
-    detailsOnClick: Y,
-    barAxisTitle: j,
-    noOfTicks: E,
+    resetSelectionOnDoubleClick: si,
+    detailsOnClick: X,
+    barAxisTitle: V,
+    noOfTicks: Y,
     valueColor: oi,
-    orientation: V = "vertical",
-    styles: p,
-    classNames: y,
+    orientation: N = "vertical",
+    styles: f,
+    classNames: w,
     filterNA: u,
-    targetStyle: R,
+    targetStyle: E,
     targetColor: O,
     qualitativeRangeColors: hi,
-    measureBarWidthFactor: _,
+    measureBarWidthFactor: G,
     animate: ci,
     dimmedOpacity: xi,
     precision: ui,
     naLabel: M
   } = wi;
-  return V === "vertical" ? /* @__PURE__ */ e.jsx(
+  return N === "vertical" ? /* @__PURE__ */ e.jsx(
     Zi,
     {
       data: r,
-      graphTitle: b,
+      graphTitle: y,
       barColor: U,
       barPadding: J,
       showTicks: K,
@@ -1313,49 +1309,49 @@ function zt(wi) {
       truncateBy: Z,
       showLabels: ii,
       showValues: bi,
-      backgroundColor: N,
+      backgroundColor: z,
       suffix: ti,
-      prefix: h,
-      sources: B,
+      prefix: o,
+      sources: R,
       graphDescription: T,
-      height: D,
+      height: A,
       width: g,
-      footNote: q,
-      colorDomain: w,
-      colorLegendTitle: F,
+      footNote: B,
+      colorDomain: b,
+      colorLegendTitle: q,
       padding: ei,
-      relativeHeight: H,
-      tooltip: L,
+      relativeHeight: F,
+      tooltip: D,
       onSeriesMouseOver: di,
-      refValues: I,
+      refValues: L,
       showColorScale: $,
       graphID: ai,
-      maxValue: si,
-      minValue: z,
+      maxValue: ni,
+      minValue: k,
       highlightedDataPoints: x,
       onSeriesMouseClick: C,
       graphDownload: li,
-      dataDownload: P,
-      language: W,
-      theme: c,
-      sortData: n,
-      labelOrder: k,
-      minHeight: X,
+      dataDownload: H,
+      language: I,
+      theme: h,
+      sortData: s,
+      labelOrder: j,
+      minHeight: P,
       maxBarThickness: S,
-      maxNumberOfBars: A,
-      minBarThickness: f,
+      maxNumberOfBars: W,
+      minBarThickness: p,
       ariaLabel: m,
-      resetSelectionOnDoubleClick: ni,
-      styles: p,
-      detailsOnClick: Y,
-      barAxisTitle: j,
-      noOfTicks: E,
+      resetSelectionOnDoubleClick: si,
+      styles: f,
+      detailsOnClick: X,
+      barAxisTitle: V,
+      noOfTicks: Y,
       valueColor: oi,
-      classNames: y,
+      classNames: w,
       filterNA: u,
-      targetStyle: R,
+      targetStyle: E,
       targetColor: O,
-      measureBarWidthFactor: _,
+      measureBarWidthFactor: G,
       qualitativeRangeColors: hi,
       animate: ci,
       dimmedOpacity: xi,
@@ -1366,7 +1362,7 @@ function zt(wi) {
     Ki,
     {
       data: r,
-      graphTitle: b,
+      graphTitle: y,
       barColor: U,
       barPadding: J,
       showTicks: K,
@@ -1377,49 +1373,49 @@ function zt(wi) {
       truncateBy: Z,
       showLabels: ii,
       showValues: bi,
-      backgroundColor: N,
+      backgroundColor: z,
       suffix: ti,
-      prefix: h,
-      sources: B,
+      prefix: o,
+      sources: R,
       graphDescription: T,
-      height: D,
+      height: A,
       width: g,
-      footNote: q,
-      colorDomain: w,
-      colorLegendTitle: F,
+      footNote: B,
+      colorDomain: b,
+      colorLegendTitle: q,
       padding: ei,
-      relativeHeight: H,
-      tooltip: L,
+      relativeHeight: F,
+      tooltip: D,
       onSeriesMouseOver: di,
-      refValues: I,
+      refValues: L,
       showColorScale: $,
       graphID: ai,
-      maxValue: si,
-      minValue: z,
+      maxValue: ni,
+      minValue: k,
       highlightedDataPoints: x,
       onSeriesMouseClick: C,
       graphDownload: li,
-      dataDownload: P,
-      language: W,
-      theme: c,
-      sortData: n,
-      labelOrder: k,
-      minHeight: X,
+      dataDownload: H,
+      language: I,
+      theme: h,
+      sortData: s,
+      labelOrder: j,
+      minHeight: P,
       maxBarThickness: S,
-      maxNumberOfBars: A,
-      minBarThickness: f,
+      maxNumberOfBars: W,
+      minBarThickness: p,
       ariaLabel: m,
-      resetSelectionOnDoubleClick: ni,
-      styles: p,
-      detailsOnClick: Y,
-      barAxisTitle: j,
-      noOfTicks: E,
+      resetSelectionOnDoubleClick: si,
+      styles: f,
+      detailsOnClick: X,
+      barAxisTitle: V,
+      noOfTicks: Y,
       valueColor: oi,
-      classNames: y,
+      classNames: w,
       filterNA: u,
-      targetStyle: R,
+      targetStyle: E,
       targetColor: O,
-      measureBarWidthFactor: _,
+      measureBarWidthFactor: G,
       qualitativeRangeColors: hi,
       animate: ci,
       dimmedOpacity: xi,