@undp/data-viz 1.4.12 → 1.4.14

package/dist/ParetoChart.js

@@ -1,227 +1,228 @@
-import { j as t, m as R } from "./index-CHPV5EwG-BPSP-7Jg.js";
-import { useRef as di, useState as B, useEffect as wi } from "react";
-import { i as fi } from "./index-27yTRcko.js";
-import { X as ji } from "./Modal-DVVwpKhP.js";
-import { n as ni } from "./numberFormattingFunction-14YCbkN2.js";
-import { T as Ai } from "./Tooltip-DyM5snqx.js";
-import { s as Mi } from "./string2HTML-CWHGfz_d.js";
-import { c as hi } from "./checkIfNullOrUndefined-DmfiKkNw.js";
-import { A as ui } from "./Axis-Ddg-seDi.js";
-import { A as gi } from "./AxisTitle-BmHLMRJZ.js";
-import { X as Ni } from "./XAxesLabels-CaV2q-6H.js";
-import { b as ki } from "./band-BEjh2CHI.js";
-import { a as yi } from "./linear-DUdu7l2G.js";
-import { l as $i, c as Ci } from "./line-CPfhohvF.js";
-import { c as Ii, s as Li, a as Ti, m as Si } from "./step-BrDul-H4.js";
-import { u as Vi } from "./use-in-view-yS6jzJAp.js";
+import { j as t, m as _ } from "./index-CHPV5EwG-BPSP-7Jg.js";
+import { useRef as fi, useState as W, useEffect as ji } from "react";
+import { i as gi } from "./index-27yTRcko.js";
+import { X as Ai } from "./Modal-DVVwpKhP.js";
+import { n as oi } from "./numberFormattingFunction-14YCbkN2.js";
+import { T as Mi } from "./Tooltip-DyM5snqx.js";
+import { s as Ni } from "./string2HTML-CWHGfz_d.js";
+import { c as di } from "./checkIfNullOrUndefined-DmfiKkNw.js";
+import { A as pi } from "./Axis-Ddg-seDi.js";
+import { A as yi } from "./AxisTitle-BmHLMRJZ.js";
+import { X as ki } from "./XAxesLabels-CaV2q-6H.js";
+import { b as Ci } from "./band-BEjh2CHI.js";
+import { a as bi } from "./linear-DUdu7l2G.js";
+import { l as $i, c as Li } from "./line-CPfhohvF.js";
+import { c as Ii, s as Si, a as Ti, m as Vi } from "./step-BrDul-H4.js";
+import { u as Oi } from "./use-in-view-yS6jzJAp.js";
 import { m as D } from "./proxy-CkpFesk1.js";
-import { A as Oi } from "./index-CNvov0eg.js";
-import { GraphFooter as Pi } from "./GraphFooter.js";
-import { GraphHeader as Di } from "./GraphHeader.js";
-import { ColorLegend as Yi } from "./ColorLegend.js";
-import { Colors as oi } from "./Colors.js";
-import { E as Hi } from "./EmptyState-DdTp-Mdn.js";
-function Xi(li) {
+import { A as Pi } from "./index-CNvov0eg.js";
+import { GraphFooter as Di } from "./GraphFooter.js";
+import { GraphHeader as Yi } from "./GraphHeader.js";
+import { ColorLegend as Hi } from "./ColorLegend.js";
+import { Colors as ci } from "./Colors.js";
+import { E as Xi } from "./EmptyState-DdTp-Mdn.js";
+function Ei(mi) {
   const {
-    data: L,
-    width: A,
+    data: S,
+    width: N,
     height: Y,
     barColor: p,
-    lineColor: u,
-    axisTitles: s,
-    sameAxes: y,
-    rightMargin: z,
-    leftMargin: _,
-    topMargin: q,
-    bottomMargin: ci,
+    lineColor: x,
+    axisTitles: a,
+    sameAxes: b,
+    rightMargin: q,
+    leftMargin: U,
+    topMargin: J,
+    bottomMargin: xi,
     tooltip: v,
-    showValues: U,
+    showValues: K,
     onSeriesMouseOver: H,
-    barPadding: mi,
-    truncateBy: J,
-    showLabels: K,
-    onSeriesMouseClick: b,
-    resetSelectionOnDoubleClick: Q,
-    detailsOnClick: d,
-    noOfTicks: Z,
-    lineSuffix: ii,
-    barSuffix: F,
-    linePrefix: G,
-    barPrefix: ti,
+    barPadding: hi,
+    truncateBy: Q,
+    showLabels: Z,
+    onSeriesMouseClick: w,
+    resetSelectionOnDoubleClick: ii,
+    detailsOnClick: h,
+    noOfTicks: ti,
+    lineSuffix: ei,
+    barSuffix: B,
+    linePrefix: F,
+    barPrefix: ai,
     curveType: X,
-    styles: o,
-    classNames: l,
-    animate: r,
+    styles: n,
+    classNames: o,
+    animate: l,
     precision: E,
     customLayers: T,
-    naLabel: M
-  } = li, ei = di(null), N = Vi(ei, {
-    once: r.once,
-    amount: r.amount
-  }), xi = X === "linear" ? Ci : X === "step" ? Ii : X === "stepAfter" ? Li : X === "stepBefore" ? Ti : Si, [ai, k] = B(void 0), [$, S] = B(void 0), [si, C] = B(void 0), [ri, x] = B(void 0), n = {
-    top: q,
-    bottom: ci,
-    left: _ + 50,
-    right: z + 65
-  }, h = A - n.left - n.right, f = Y - n.top - n.bottom, a = L.map((i, j) => ({ ...i, id: `${j}` })), c = ki().domain(a.map((i) => `${i.id}`)).range([0, h]).paddingInner(mi), w = Math.min(...a.map((i) => i.bar).filter((i) => i != null)) !== 1 / 0 ? Math.min(...a.map((i) => i.bar).filter((i) => i != null)) > 0 ? 0 : Math.min(...a.map((i) => i.bar).filter((i) => i != null)) : 0, W = Math.min(...a.map((i) => i.line).filter((i) => i != null)) !== 1 / 0 ? Math.min(...a.map((i) => i.line).filter((i) => i != null)) > 0 ? 0 : Math.min(...a.map((i) => i.line).filter((i) => i != null)) : 0, V = Math.max(...a.map((i) => i.bar).filter((i) => i != null)) !== 1 / 0 ? Math.max(...a.map((i) => i.bar).filter((i) => i != null)) : 0, O = Math.max(...a.map((i) => i.line).filter((i) => i != null)) !== 1 / 0 ? Math.max(...a.map((i) => i.line).filter((i) => i != null)) : 0, I = w < W ? w : W, P = V > O ? V : O, e = yi().domain([
-    y ? I : w,
-    y ? P > 0 ? P : 0 : V > 0 ? V : 0
-  ]).range([f, 0]).nice(), m = yi().domain([
-    y ? I : W,
-    y ? P > 0 ? P : 0 : O > 0 ? O : 0
-  ]).range([f, 0]).nice(), pi = $i().defined((i) => !hi(i.line)).x((i) => c(`${i.id}`) + c.bandwidth() / 2).y((i) => m(i.line)).curve(xi), vi = e.ticks(Z), bi = m.ticks(Z);
+    naLabel: k,
+    showAxisLabels: si
+  } = mi, ri = fi(null), C = Oi(ri, {
+    once: l.once,
+    amount: l.amount
+  }), ui = X === "linear" ? Li : X === "step" ? Ii : X === "stepAfter" ? Si : X === "stepBefore" ? Ti : Vi, [li, $] = W(void 0), [L, V] = W(void 0), [ni, I] = W(void 0), [j, m] = W(void 0), u = {
+    top: J,
+    bottom: xi,
+    left: U + 50,
+    right: q + 65
+  }, d = N - u.left - u.right, f = Y - u.top - u.bottom, s = S.map((i, M) => ({ ...i, id: `${M}` })), c = Ci().domain(s.map((i) => `${i.id}`)).range([0, d]).paddingInner(hi), G = Math.min(...s.map((i) => i.bar).filter((i) => i != null)) !== 1 / 0 ? Math.min(...s.map((i) => i.bar).filter((i) => i != null)) > 0 ? 0 : Math.min(...s.map((i) => i.bar).filter((i) => i != null)) : 0, A = Math.min(...s.map((i) => i.line).filter((i) => i != null)) !== 1 / 0 ? Math.min(...s.map((i) => i.line).filter((i) => i != null)) > 0 ? 0 : Math.min(...s.map((i) => i.line).filter((i) => i != null)) : 0, O = Math.max(...s.map((i) => i.bar).filter((i) => i != null)) !== 1 / 0 ? Math.max(...s.map((i) => i.bar).filter((i) => i != null)) : 0, P = Math.max(...s.map((i) => i.line).filter((i) => i != null)) !== 1 / 0 ? Math.max(...s.map((i) => i.line).filter((i) => i != null)) : 0, R = G < A ? G : A, y = O > P ? O : P, r = bi().domain([
+    b ? R : G,
+    b ? y > 0 ? y : 0 : O > 0 ? O : 0
+  ]).range([f, 0]).nice(), e = bi().domain([
+    b ? R : A,
+    b ? y > 0 ? y : 0 : P > 0 ? P : 0
+  ]).range([f, 0]).nice(), z = $i().defined((i) => !di(i.line)).x((i) => c(`${i.id}`) + c.bandwidth() / 2).y((i) => e(i.line)).curve(ui), vi = r.ticks(ti), wi = e.ticks(ti);
   return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
     /* @__PURE__ */ t.jsx(
       D.svg,
       {
-        width: `${A}px`,
+        width: `${N}px`,
         height: `${Y}px`,
-        viewBox: `0 0 ${A} ${Y}`,
+        viewBox: `0 0 ${N} ${Y}`,
         direction: "ltr",
-        ref: ei,
-        children: /* @__PURE__ */ t.jsxs("g", { transform: `translate(${n.left},${n.top})`, children: [
+        ref: ri,
+        children: /* @__PURE__ */ t.jsxs("g", { transform: `translate(${u.left},${u.top})`, children: [
           /* @__PURE__ */ t.jsxs("g", { children: [
-            vi.map((i, j) => /* @__PURE__ */ t.jsxs("g", { children: [
+            vi.map((i, M) => /* @__PURE__ */ t.jsxs("g", { children: [
               /* @__PURE__ */ t.jsx(
                 "line",
                 {
-                  y1: e(i),
-                  y2: e(i),
+                  y1: r(i),
+                  y2: r(i),
                   x1: -15,
                   x2: -20,
                   style: {
                     stroke: p,
                     strokeWidth: 1,
-                    ...o?.yAxis?.gridLines || {}
+                    ...n?.yAxis?.gridLines || {}
                   },
-                  className: l?.yAxis?.gridLines
+                  className: o?.yAxis?.gridLines
                 }
               ),
               /* @__PURE__ */ t.jsx(
                 "text",
                 {
                   x: -25,
-                  y: e(i),
+                  y: r(i),
                   dy: "0.33em",
-                  className: R("text-xs", l?.yAxis?.labels),
+                  className: _("text-xs", o?.yAxis?.labels),
                   style: {
                     textAnchor: "end",
                     fill: p,
-                    ...o?.yAxis?.labels || {}
+                    ...n?.yAxis?.labels || {}
                   },
-                  children: ni(i, M, E, ti, F)
+                  children: oi(i, k, E, ai, B)
                 }
               )
-            ] }, j)),
+            ] }, M)),
             /* @__PURE__ */ t.jsx(
-              ui,
+              pi,
               {
                 y1: 0,
                 y2: f,
                 x1: -15,
                 x2: -15,
-                classNames: { axis: l?.xAxis?.axis },
-                styles: { axis: { stroke: p, ...o?.xAxis?.axis || {} } }
+                classNames: { axis: o?.xAxis?.axis },
+                styles: { axis: { stroke: p, ...n?.xAxis?.axis || {} } }
               }
             ),
-            /* @__PURE__ */ t.jsx(
-              gi,
+            si ? /* @__PURE__ */ t.jsx(
+              yi,
               {
-                x: 10 - n.left,
+                x: 10 - u.left,
                 y: f / 2,
-                style: { fill: p, ...o?.yAxis?.title || {} },
-                className: l?.yAxis?.title,
-                text: s[0].length > 100 ? `${s[0].substring(0, 100)}...` : s[0],
+                style: { fill: p, ...n?.yAxis?.title || {} },
+                className: o?.yAxis?.title,
+                text: a[0].length > 100 ? `${a[0].substring(0, 100)}...` : a[0],
                 rotate90: !0
               }
-            )
+            ) : null
           ] }),
           /* @__PURE__ */ t.jsxs("g", { children: [
-            bi.map((i, j) => /* @__PURE__ */ t.jsxs("g", { children: [
+            wi.map((i, M) => /* @__PURE__ */ t.jsxs("g", { children: [
               /* @__PURE__ */ t.jsx(
                 "line",
                 {
-                  y1: m(i),
-                  y2: m(i),
-                  x1: h + 15,
-                  x2: h + 20,
+                  y1: e(i),
+                  y2: e(i),
+                  x1: d + 15,
+                  x2: d + 20,
                   style: {
-                    stroke: u,
+                    stroke: x,
                     strokeWidth: 1,
-                    ...o?.yAxis?.gridLines || {}
+                    ...n?.yAxis?.gridLines || {}
                   },
-                  className: l?.yAxis?.gridLines
+                  className: o?.yAxis?.gridLines
                 }
               ),
               /* @__PURE__ */ t.jsx(
                 "text",
                 {
-                  x: h + 25,
-                  y: m(i),
+                  x: d + 25,
+                  y: e(i),
                   dy: "0.33em",
                   dx: -2,
                   style: {
                     textAnchor: "start",
-                    fill: u,
-                    ...o?.yAxis?.labels || {}
+                    fill: x,
+                    ...n?.yAxis?.labels || {}
                   },
-                  className: R("text-xs", l?.yAxis?.labels),
-                  children: ni(i, M, E, G, ii)
+                  className: _("text-xs", o?.yAxis?.labels),
+                  children: oi(i, k, E, F, ei)
                 }
               )
-            ] }, j)),
+            ] }, M)),
             /* @__PURE__ */ t.jsx(
-              ui,
+              pi,
               {
                 y1: 0,
                 y2: f,
-                x1: h + 15,
-                x2: h + 15,
-                classNames: { axis: l?.xAxis?.axis },
-                styles: { axis: { stroke: u, ...o?.xAxis?.axis || {} } }
+                x1: d + 15,
+                x2: d + 15,
+                classNames: { axis: o?.xAxis?.axis },
+                styles: { axis: { stroke: x, ...n?.xAxis?.axis || {} } }
               }
             ),
-            /* @__PURE__ */ t.jsx(
-              gi,
+            si ? /* @__PURE__ */ t.jsx(
+              yi,
               {
-                x: h + n.right - 15,
+                x: d + u.right - 15,
                 y: f / 2,
-                style: { fill: u, ...o?.yAxis?.title || {} },
-                className: l?.yAxis?.title,
-                text: s[1].length > 100 ? `${s[1].substring(0, 100)}...` : s[1],
+                style: { fill: x, ...n?.yAxis?.title || {} },
+                className: o?.yAxis?.title,
+                text: a[1].length > 100 ? `${a[1].substring(0, 100)}...` : a[1],
                 rotate90: !0
               }
-            )
+            ) : null
           ] }),
           /* @__PURE__ */ t.jsx(
-            ui,
+            pi,
             {
-              y1: y ? e(0) : f,
-              y2: y ? e(0) : f,
+              y1: b ? r(0) : f,
+              y2: b ? r(0) : f,
               x1: -15,
-              x2: h + 15,
-              classNames: { axis: l?.xAxis?.axis },
-              styles: { axis: o?.xAxis?.axis }
+              x2: d + 15,
+              classNames: { axis: o?.xAxis?.axis },
+              styles: { axis: n?.xAxis?.axis }
             }
           ),
           T.filter((i) => i.position === "before").map((i) => i.layer),
-          /* @__PURE__ */ t.jsxs(Oi, { children: [
-            a.map((i, j) => /* @__PURE__ */ t.jsxs(
+          /* @__PURE__ */ t.jsxs(Pi, { children: [
+            s.map((i, M) => /* @__PURE__ */ t.jsxs(
               D.g,
               {
                 className: "undp-viz-g-with-hover",
                 opacity: 0.85,
                 onMouseEnter: (g) => {
-                  k(i), x(g.clientY), C(g.clientX), H?.(i);
+                  $(i), m(g.clientY), I(g.clientX), H?.(i);
                 },
                 onClick: () => {
-                  (b || d) && (fi($, i) && Q ? (S(void 0), b?.(void 0)) : (S(i), b?.(i)));
+                  (w || h) && (gi(L, i) && ii ? (V(void 0), w?.(void 0)) : (V(i), w?.(i)));
                 },
                 onMouseMove: (g) => {
-                  k(i), x(g.clientY), C(g.clientX);
+                  $(i), m(g.clientY), I(g.clientX);
                 },
                 onMouseLeave: () => {
-                  k(void 0), C(void 0), x(void 0), H?.(void 0);
+                  $(void 0), I(void 0), m(void 0), H?.(void 0);
                 },
                 children: [
                   /* @__PURE__ */ t.jsx(
@@ -229,75 +230,75 @@ function Xi(li) {
                     {
                       variants: {
                         initial: {
-                          attrY: e(0),
+                          attrY: r(0),
                           height: 0,
                           opacity: 1
                         },
                         whileInView: {
-                          attrY: i.bar ? i.bar > 0 ? e(i.bar) : e(0) : 0,
-                          height: i.bar ? Math.abs(e(i.bar) - e(0)) : 0,
+                          attrY: i.bar ? i.bar > 0 ? r(i.bar) : r(0) : 0,
+                          height: i.bar ? Math.abs(r(i.bar) - r(0)) : 0,
                           opacity: 1,
-                          transition: { duration: r.duration }
+                          transition: { duration: l.duration }
                         }
                       },
                       initial: "initial",
-                      animate: N ? "whileInView" : "initial",
+                      animate: C ? "whileInView" : "initial",
                       exit: {
-                        attrY: e(0),
+                        attrY: r(0),
                         height: 0,
                         opacity: 0,
-                        transition: { duration: r.duration }
+                        transition: { duration: l.duration }
                       },
-                      x: c(`${j}`),
+                      x: c(`${M}`),
                       width: c.bandwidth(),
                       style: { fill: p }
                     }
                   ),
-                  U && !hi(i.bar) ? /* @__PURE__ */ t.jsx(
+                  K && !di(i.bar) ? /* @__PURE__ */ t.jsx(
                     D.text,
                     {
                       x: c(`${i.id}`) + c.bandwidth() / 2,
                       exit: {
-                        attrY: e(0),
+                        attrY: r(0),
                         opacity: 0,
-                        transition: { duration: r.duration }
+                        transition: { duration: l.duration }
                       },
                       variants: {
                         initial: {
-                          attrY: e(0),
+                          attrY: r(0),
                           opacity: 0
                         },
                         whileInView: {
-                          attrY: e(i.bar || 0),
+                          attrY: r(i.bar || 0),
                           opacity: 1,
-                          transition: { duration: r.duration }
+                          transition: { duration: l.duration }
                         }
                       },
                       initial: "initial",
-                      animate: N ? "whileInView" : "initial",
+                      animate: C ? "whileInView" : "initial",
                       style: {
                         fill: p,
                         textAnchor: "middle",
-                        ...o?.graphObjectValues || {}
+                        ...n?.graphObjectValues || {}
                       },
-                      className: R("graph-value text-sm", l?.graphObjectValues),
+                      className: _("graph-value text-sm", o?.graphObjectValues),
                       dy: i.bar ? i.bar >= 0 ? "-5px" : "1em" : "-5px",
-                      children: ni(i.bar, M, E, ti, F)
+                      children: oi(i.bar, k, E, ai, B)
                     }
                   ) : null,
-                  K ? /* @__PURE__ */ t.jsx(
-                    Ni,
+                  Z ? /* @__PURE__ */ t.jsx(
+                    ki,
                     {
-                      value: `${i.label}`.length < J ? `${i.label}` : `${`${i.label}`.substring(0, J)}...`,
+                      value: `${i.label}`.length < Q ? `${i.label}` : `${`${i.label}`.substring(0, Q)}...`,
                       y: f + 5,
                       x: c(`${i.id}`),
                       width: c.bandwidth(),
-                      height: n.bottom,
-                      style: o?.xAxis?.labels,
-                      className: l?.xAxis?.labels,
+                      height: u.bottom,
+                      style: n?.xAxis?.labels,
+                      className: o?.xAxis?.labels,
                       alignment: "top",
-                      animate: r,
-                      isInView: N
+                      animate: l,
+                      isInView: C
                     }
                   ) : null
                 ]
@@ -309,253 +310,256 @@ function Xi(li) {
               {
                 exit: {
                   opacity: 0,
-                  transition: { duration: r.duration }
+                  transition: { duration: l.duration }
                 },
                 variants: {
                   initial: {
-                    d: pi(a.map((i) => ({ ...i, line: 0 }))),
+                    d: z(s.map((i) => ({ ...i, line: 0 }))),
                     opacity: 0
                   },
                   whileInView: {
-                    d: pi(a),
+                    d: z(s),
                     opacity: 1,
-                    transition: { duration: r.duration }
+                    transition: { duration: l.duration }
                   }
                 },
                 initial: "initial",
-                animate: N ? "whileInView" : "initial",
+                animate: C ? "whileInView" : "initial",
                 style: {
-                  stroke: u,
+                  stroke: x,
                   fill: "none",
                   strokeWidth: 2
                 }
               }
             ),
-            a.map((i, j) => /* @__PURE__ */ t.jsx("g", { children: hi(i.line) ? null : /* @__PURE__ */ t.jsxs(
+            s.map((i, M) => /* @__PURE__ */ t.jsx("g", { children: di(i.line) ? null : /* @__PURE__ */ t.jsxs(
               "g",
               {
                 onMouseEnter: (g) => {
-                  k(i), x(g.clientY), C(g.clientX), H?.(i);
+                  $(i), m(g.clientY), I(g.clientX), H?.(i);
                 },
                 onClick: () => {
-                  (b || d) && (fi($, i) && Q ? (S(void 0), b?.(void 0)) : (S(i), b?.(i)));
+                  (w || h) && (gi(L, i) && ii ? (V(void 0), w?.(void 0)) : (V(i), w?.(i)));
                 },
                 onMouseMove: (g) => {
-                  k(i), x(g.clientY), C(g.clientX);
+                  $(i), m(g.clientY), I(g.clientX);
                 },
                 onMouseLeave: () => {
-                  k(void 0), C(void 0), x(void 0), H?.(void 0);
+                  $(void 0), I(void 0), m(void 0), H?.(void 0);
                 },
                 children: [
                   /* @__PURE__ */ t.jsx(
                     D.circle,
                     {
                       exit: {
-                        cy: m(0),
+                        cy: e(0),
                         opacity: 0,
-                        transition: { duration: r.duration }
+                        transition: { duration: l.duration }
                       },
                       variants: {
                         initial: {
-                          cy: m(0),
+                          cy: e(0),
                           opacity: 0
                         },
                         whileInView: {
-                          cy: m(i.line),
+                          cy: e(i.line),
                           opacity: 1,
-                          transition: { duration: r.duration }
+                          transition: { duration: l.duration }
                         }
                       },
                       initial: "initial",
-                      animate: N ? "whileInView" : "initial",
+                      animate: C ? "whileInView" : "initial",
                       cx: c(i.id) + c.bandwidth() / 2,
-                      r: h / a.length < 5 ? 0 : h / a.length < 20 ? 2 : 4,
-                      style: { fill: u }
+                      r: d / s.length < 5 ? 0 : d / s.length < 20 ? 2 : 4,
+                      style: { fill: x }
                     }
                   ),
-                  U ? /* @__PURE__ */ t.jsx(
+                  K ? /* @__PURE__ */ t.jsx(
                     D.text,
                     {
                       x: c(`${i.id}`) + c.bandwidth() / 2,
                       exit: {
-                        y: m(0),
+                        y: e(0),
                         opacity: 0,
-                        transition: { duration: r.duration }
+                        transition: { duration: l.duration }
                       },
                       style: {
-                        fill: u,
+                        fill: x,
                         textAnchor: "middle",
-                        ...o?.graphObjectValues || {}
+                        ...n?.graphObjectValues || {}
                       },
                       variants: {
                         initial: {
-                          y: m(0),
+                          y: e(0),
                           opacity: 0
                         },
                         whileInView: {
-                          y: m(i.line),
+                          y: e(i.line),
                           opacity: 1,
-                          transition: { duration: r.duration }
+                          transition: { duration: l.duration }
                         }
                       },
                       initial: "initial",
-                      animate: N ? "whileInView" : "initial",
-                      className: R("graph-value text-sm", l?.graphObjectValues),
+                      animate: C ? "whileInView" : "initial",
+                      className: _("graph-value text-sm", o?.graphObjectValues),
                       dy: "-5px",
-                      children: ni(
+                      children: oi(
                         i.line,
-                        M,
+                        k,
                         E,
-                        G,
-                        ii
+                        F,
+                        ei
                       )
                     }
                   ) : null
                 ]
               }
-            ) }, j))
+            ) }, M))
           ] }),
           T.filter((i) => i.position === "after").map((i) => i.layer)
         ] })
       }
     ),
-    ai && v && si && ri ? /* @__PURE__ */ t.jsx(
-      Ai,
+    li && v && ni && j ? /* @__PURE__ */ t.jsx(
+      Mi,
       {
-        data: ai,
+        data: li,
         body: v,
-        xPos: si,
-        yPos: ri,
-        backgroundStyle: o?.tooltip,
-        className: l?.tooltip
+        xPos: ni,
+        yPos: j,
+        backgroundStyle: n?.tooltip,
+        className: o?.tooltip
       }
     ) : null,
-    d && $ !== void 0 ? /* @__PURE__ */ t.jsx(
-      ji,
+    h && L !== void 0 ? /* @__PURE__ */ t.jsx(
+      Ai,
       {
-        open: $ !== void 0,
+        open: L !== void 0,
         onClose: () => {
-          S(void 0);
+          V(void 0);
         },
         children: /* @__PURE__ */ t.jsx(
           "div",
           {
             className: "graph-modal-content m-0",
-            dangerouslySetInnerHTML: typeof d == "string" ? { __html: Mi(d, $) } : void 0,
-            children: typeof d == "function" ? d($) : null
+            dangerouslySetInnerHTML: typeof h == "string" ? { __html: Ni(h, L) } : void 0,
+            children: typeof h == "function" ? h(L) : null
           }
         )
       }
     ) : null
   ] });
 }
-function ct(li) {
+function mt(mi) {
   const {
-    data: L,
-    graphTitle: A,
+    data: S,
+    graphTitle: N,
     sources: Y,
     graphDescription: p,
-    height: u,
-    width: s,
-    footNote: y,
-    padding: z,
-    lineColor: _ = oi.light.categoricalColors.colors[1],
-    barColor: q = oi.light.categoricalColors.colors[0],
-    sameAxes: ci = !1,
+    height: x,
+    width: a,
+    footNote: b,
+    padding: q,
+    lineColor: U = ci.light.categoricalColors.colors[1],
+    barColor: J = ci.light.categoricalColors.colors[0],
+    sameAxes: xi = !1,
     backgroundColor: v = !1,
-    leftMargin: U = 80,
+    leftMargin: K = 80,
     rightMargin: H = 80,
-    topMargin: mi = 20,
-    bottomMargin: J = 25,
-    lineAxisTitle: K = "Line chart",
-    barAxisTitle: b = "Bar graph",
-    tooltip: Q,
-    relativeHeight: d,
-    onSeriesMouseOver: Z,
-    graphID: ii,
-    graphDownload: F = !1,
-    dataDownload: G = !1,
-    barPadding: ti = 0.25,
+    topMargin: hi = 20,
+    bottomMargin: Q = 25,
+    lineAxisTitle: Z = "Line chart",
+    barAxisTitle: w = "Bar graph",
+    tooltip: ii,
+    relativeHeight: h,
+    onSeriesMouseOver: ti,
+    graphID: ei,
+    graphDownload: B = !1,
+    dataDownload: F = !1,
+    barPadding: ai = 0.25,
     truncateBy: X = 999,
-    showLabels: o = !0,
-    onSeriesMouseClick: l,
-    language: r = "en",
+    showLabels: n = !0,
+    onSeriesMouseClick: o,
+    language: l = "en",
     colorLegendTitle: E,
     minHeight: T = 0,
-    theme: M = "light",
-    ariaLabel: ei,
-    resetSelectionOnDoubleClick: N = !0,
-    detailsOnClick: xi,
-    showValues: ai = !0,
-    noOfTicks: k = 5,
+    theme: k = "light",
+    ariaLabel: si,
+    resetSelectionOnDoubleClick: ri = !0,
+    detailsOnClick: C,
+    showValues: ui = !0,
+    noOfTicks: li = 5,
     lineSuffix: $ = "",
-    barSuffix: S = "",
-    linePrefix: si = "",
-    barPrefix: C = "",
-    curveType: ri = "curve",
-    styles: x,
-    classNames: n,
-    animate: h = !1,
-    precision: f = 2,
-    customLayers: a = [],
-    naLabel: c = "NA"
-  } = li, [w, W] = B(0), [V, O] = B(0), I = di(null), P = di(null);
-  return wi(() => {
-    const e = new ResizeObserver((m) => {
-      W(s || m[0].target.clientWidth || 620), O(u || m[0].target.clientHeight || 480);
+    barSuffix: L = "",
+    linePrefix: V = "",
+    barPrefix: ni = "",
+    curveType: I = "curve",
+    styles: j,
+    classNames: m,
+    animate: u = !1,
+    precision: d = 2,
+    customLayers: f = [],
+    naLabel: s = "NA",
+    showColorScale: c = !0,
+    showAxisLabels: G = !0
+  } = mi, [A, O] = W(0), [P, R] = W(0), y = fi(null), r = fi(null);
+  return ji(() => {
+    const e = new ResizeObserver((z) => {
+      O(a || z[0].target.clientWidth || 620), R(x || z[0].target.clientHeight || 480);
     });
-    return I.current && (O(I.current.clientHeight || 480), W(I.current.clientWidth || 620), s || e.observe(I.current)), () => e.disconnect();
-  }, [s, u]), /* @__PURE__ */ t.jsx(
+    return y.current && (R(y.current.clientHeight || 480), O(y.current.clientWidth || 620), a || e.observe(y.current)), () => e.disconnect();
+  }, [a, x]), /* @__PURE__ */ t.jsx(
     "div",
     {
-      className: `${M || "light"} flex  ${s ? "w-fit grow-0" : "w-full grow"}`,
-      dir: r === "he" || r === "ar" ? "rtl" : void 0,
+      className: `${k || "light"} flex  ${a ? "w-fit grow-0" : "w-full grow"}`,
+      dir: l === "he" || l === "ar" ? "rtl" : void 0,
       children: /* @__PURE__ */ t.jsx(
         "div",
         {
-          className: R(
-            `${v ? v === !0 ? "bg-primary-gray-200 dark:bg-primary-gray-650 " : "" : "bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${r || "en"}`,
-            n?.graphContainer
+          className: _(
+            `${v ? v === !0 ? "bg-primary-gray-200 dark:bg-primary-gray-650 " : "" : "bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${l || "en"}`,
+            a ? "w-fit" : "w-full",
+            m?.graphContainer
           ),
           style: {
-            ...x?.graphContainer || {},
+            ...j?.graphContainer || {},
             ...v && v !== !0 ? { backgroundColor: v } : {}
           },
-          id: ii,
-          ref: P,
-          "aria-label": ei || `${A ? `The graph shows ${A}. ` : ""}This is a pareto chart that shows a variable as bars and another as line chart.${p ? ` ${p}` : ""}`,
+          id: ei,
+          ref: r,
+          "aria-label": si || `${N ? `The graph shows ${N}. ` : ""}This is a pareto chart that shows a variable as bars and another as line chart.${p ? ` ${p}` : ""}`,
           children: /* @__PURE__ */ t.jsx(
             "div",
             {
               className: "flex grow",
-              style: { padding: v ? z || "1rem" : z || 0 },
+              style: { padding: v ? q || "1rem" : q || 0 },
               children: /* @__PURE__ */ t.jsxs("div", { className: "flex flex-col w-full gap-4 grow justify-between", children: [
-                A || p || F || G ? /* @__PURE__ */ t.jsx(
-                  Di,
+                N || p || B || F ? /* @__PURE__ */ t.jsx(
+                  Yi,
                   {
                     styles: {
-                      title: x?.title,
-                      description: x?.description
+                      title: j?.title,
+                      description: j?.description
                     },
                     classNames: {
-                      title: n?.title,
-                      description: n?.description
+                      title: m?.title,
+                      description: m?.description
                     },
-                    graphTitle: A,
+                    graphTitle: N,
                     graphDescription: p,
-                    width: s,
-                    graphDownload: F ? P.current : void 0,
-                    dataDownload: G ? L.map((e) => e.data).filter((e) => e !== void 0).length > 0 ? L.map((e) => e.data).filter((e) => e !== void 0) : L.filter((e) => e !== void 0) : null
+                    width: a,
+                    graphDownload: B ? r.current : void 0,
+                    dataDownload: F ? S.map((e) => e.data).filter((e) => e !== void 0).length > 0 ? S.map((e) => e.data).filter((e) => e !== void 0) : S.filter((e) => e !== void 0) : null
                   }
                 ) : null,
-                /* @__PURE__ */ t.jsx("div", { className: "grow flex flex-col justify-center gap-3 w-full", children: L.length === 0 ? /* @__PURE__ */ t.jsx(Hi, {}) : /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-                  /* @__PURE__ */ t.jsx(
-                    Yi,
+                /* @__PURE__ */ t.jsx("div", { className: "grow flex flex-col justify-center gap-3 w-full", children: S.length === 0 ? /* @__PURE__ */ t.jsx(Xi, {}) : /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+                  c ? null : /* @__PURE__ */ t.jsx(
+                    Hi,
                     {
-                      colorDomain: [b, K],
+                      colorDomain: [w, Z],
                       colors: [
-                        q || oi[M].categoricalColors.colors[0],
-                        _ || oi[M].categoricalColors.colors[1]
+                        J || ci[k].categoricalColors.colors[0],
+                        U || ci[k].categoricalColors.colors[1]
                       ],
                       colorLegendTitle: E,
                       showNAColor: !1
@@ -565,62 +569,63 @@ function ct(li) {
                     "div",
                     {
                       className: "flex flex-col grow justify-center leading-0",
-                      ref: I,
+                      ref: y,
                       "aria-label": "Graph area",
-                      children: (s || w) && (u || V) ? /* @__PURE__ */ t.jsx(
-                        Xi,
+                      children: (a || A) && (x || P) ? /* @__PURE__ */ t.jsx(
+                        Ei,
                         {
-                          data: L,
-                          sameAxes: ci,
-                          lineColor: _,
-                          barColor: q,
-                          width: s || w,
+                          data: S,
+                          sameAxes: xi,
+                          lineColor: U,
+                          barColor: J,
+                          width: a || A,
                           height: Math.max(
                             T,
-                            u || (d ? T ? (s || w) * d > T ? (s || w) * d : T : (s || w) * d : V)
+                            x || (h ? T ? (a || A) * h > T ? (a || A) * h : T : (a || A) * h : P)
                           ),
                           truncateBy: X,
-                          leftMargin: U,
+                          leftMargin: K,
                           rightMargin: H,
-                          topMargin: mi,
-                          bottomMargin: J,
-                          axisTitles: [b, K],
-                          tooltip: Q,
-                          onSeriesMouseOver: Z,
-                          barPadding: ti,
-                          showLabels: o,
-                          onSeriesMouseClick: l,
-                          resetSelectionOnDoubleClick: N,
-                          detailsOnClick: xi,
-                          noOfTicks: k,
+                          topMargin: hi,
+                          bottomMargin: Q,
+                          axisTitles: [w, Z],
+                          tooltip: ii,
+                          onSeriesMouseOver: ti,
+                          barPadding: ai,
+                          showLabels: n,
+                          onSeriesMouseClick: o,
+                          resetSelectionOnDoubleClick: ri,
+                          detailsOnClick: C,
+                          noOfTicks: li,
                           lineSuffix: $,
-                          barSuffix: S,
-                          linePrefix: si,
-                          barPrefix: C,
-                          curveType: ri,
-                          showValues: ai,
-                          styles: x,
-                          classNames: n,
-                          animate: h === !0 ? { duration: 0.5, once: !0, amount: 0.5 } : h || { duration: 0, once: !0, amount: 0 },
-                          precision: f,
-                          customLayers: a,
-                          naLabel: c
+                          barSuffix: L,
+                          linePrefix: V,
+                          barPrefix: ni,
+                          curveType: I,
+                          showValues: ui,
+                          styles: j,
+                          classNames: m,
+                          animate: u === !0 ? { duration: 0.5, once: !0, amount: 0.5 } : u || { duration: 0, once: !0, amount: 0 },
+                          precision: d,
+                          customLayers: f,
+                          naLabel: s,
+                          showAxisLabels: G
                         }
                       ) : null
                     }
                   )
                 ] }) }),
-                Y || y ? /* @__PURE__ */ t.jsx(
-                  Pi,
+                Y || b ? /* @__PURE__ */ t.jsx(
+                  Di,
                   {
-                    styles: { footnote: x?.footnote, source: x?.source },
+                    styles: { footnote: j?.footnote, source: j?.source },
                     classNames: {
-                      footnote: n?.footnote,
-                      source: n?.source
+                      footnote: m?.footnote,
+                      source: m?.source
                     },
                     sources: Y,
-                    footNote: y,
-                    width: s
+                    footNote: b,
+                    width: a
                   }
                 ) : null
               ] })
@@ -632,6 +637,6 @@ function ct(li) {
   );
 }
 export {
-  ct as ParetoChart
+  mt as ParetoChart
 };
 //# sourceMappingURL=ParetoChart.js.map