@devgateway/dvz-ui-react 1.5.3 → 1.6.0

package/dist/esm/embeddable/chart/Bar.js

@@ -1,92 +1,107 @@
 import { jsx as c, jsxs as p, Fragment as pe } from "react/jsx-runtime";
-import { useState as S, useEffect as Ht, Fragment as He } from "react";
+import { useState as B, useEffect as be, Fragment as Se } from "react";
 import Wt from "./Tooltip.js";
-import { ResponsiveBar as Tt } from "@nivo/bar";
-import { injectIntl as _t } from "react-intl";
-import { useTheme as St } from "@nivo/theming";
-import { line as We } from "d3-shape";
-import Te from "./LineLayer.js";
-import be from "papaparse";
-import At from "../../layout/FlexWrapDetector.js";
-import ge from "../../utils/deviceType.js";
-const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U = "_Color", Yt = ({
-  editing: x,
-  legends: R,
-  marginLeft: Se,
-  marginTop: q,
-  marginRight: Ae,
-  marginBottom: Q,
+import { ResponsiveBar as At } from "@nivo/bar";
+import { injectIntl as Tt } from "react-intl";
+import { useTheme as _t } from "@nivo/theming";
+import { line as je } from "d3-shape";
+import Re from "./LineLayer.js";
+import ge from "papaparse";
+import St from "../../layout/FlexWrapDetector.js";
+import ve from "../../utils/deviceType.js";
+const jt = "middle", Rt = "top", U = "#66676d", Ye = "#dddddd", Yt = "none", Q = "_Color", Kt = ({
+  editing: y,
+  legends: P,
+  marginLeft: Ke,
+  marginTop: S,
+  marginRight: Pe,
+  marginBottom: j,
   options: u,
   intl: g,
   format: b,
-  colors: $,
-  groupMode: F,
-  height: je,
+  colors: H,
+  groupMode: O,
+  height: Xe,
   showLegends: G,
-  legendPosition: D,
+  legendPosition: v,
   tickRotation: E,
   offsetText: ee,
   tickColor: te,
   layout: o,
-  reverse: H,
-  offsetY: Pe,
-  csvLineLayerData: ve,
+  reverse: W,
+  offsetY: Ce,
+  csvLineLayerData: Ne,
   tooltip: ae,
   lineLayerEnabled: ne,
-  overlays: W,
+  overlays: A,
   maxValue: re,
-  valueScale: Re,
-  colorGenerator: v,
-  legendLabel: Ne,
-  overrideTickColor: Ye,
+  valueScale: qe,
+  colorGenerator: N,
+  legendLabel: Ie,
+  overrideTickColor: Ze,
   fixedMinValue: le,
   fixedMaxValue: se,
-  barPadding: Ke,
-  barLabelPosition: Ie,
-  barInnerPadding: Xe,
-  tooltipEnabled: Ce,
-  xLabelColor: w,
-  barLabelColor: Y,
-  legendCheckBack: I,
+  barPadding: Je,
+  barLabelPosition: Le,
+  barInnerPadding: Ue,
+  tooltipEnabled: Qe,
+  xLabelColor: D,
+  barLabelColor: X,
+  legendCheckBack: L,
   legendLabelBack: ie,
   legendLabelColor: ce,
-  highlightXAxisLine: Ze,
-  showTickLine: A,
-  showRightAxis: Je,
-  offsetRight: Ue,
-  offsetBottom: Le,
+  highlightXAxisLine: Ge,
+  showTickLine: R,
+  showRightAxis: et,
+  offsetRight: tt,
+  offsetBottom: ke,
   confidenceIntervals: de,
-  showGroupTotal: qe,
-  groupTotalLabel: ke,
+  showGroupTotal: at,
+  groupTotalLabel: we,
   groupTotalFormat: De,
-  groupTotalMeasure: we,
-  groupTotalOffset: z,
-  groupTotalFixedPosition: K,
-  tooltipEnableMarkdown: Qe,
-  xAxisTickValues: Ge,
-  yAxisTickValues: et,
-  mobileCustomization: tt,
-  minMaxClamp: Kt,
-  reverseLegend: at,
-  enableGridY: nt,
-  enableGridX: rt,
-  customAxisFormat: M,
-  previewMode: B,
-  showLegendsInColumns: lt = !1,
-  numberOfLegendColumns: st = 4
+  groupTotalMeasure: Fe,
+  groupTotalOffset: $,
+  groupTotalFixedPosition: C,
+  tooltipEnableMarkdown: nt,
+  xAxisTickValues: rt,
+  yAxisTickValues: lt,
+  mobileCustomization: st,
+  minMaxClamp: Pt,
+  reverseLegend: it,
+  enableGridY: ct,
+  enableGridX: dt,
+  customAxisFormat: F,
+  previewMode: z,
+  showLegendsInColumns: Xt = !1,
+  numberOfLegendColumns: Ct = 4
 }) => {
-  var $e;
-  const it = ["mobile", "tablet", "midTablet"].includes(
-    ge()
-  ), X = ["tablet", "midTablet"].includes(ge()), C = ge() === "mobile", he = 30, me = 15, m = JSON.parse(decodeURIComponent(tt)), Me = it && ((m == null ? void 0 : m.showCustomization) ?? !1), T = Me && B !== "Desktop", _ = !x && Me, ue = () => Y === "null" || Y === null || !Y ? "#000000" : Y, [L, ct] = S([]), { colorBy: j } = $, Oe = {};
-  W.forEach((e, t) => {
+  var _e;
+  const ht = ["mobile", "tablet", "midTablet"].includes(
+    ve()
+  ), q = ["tablet", "midTablet"].includes(ve()), Z = ve() === "mobile", he = 30, me = 15, m = JSON.parse(
+    decodeURIComponent(st)
+  ), Me = ht && ((m == null ? void 0 : m.showCustomization) ?? !1), T = Me && z !== "Desktop", _ = !y && Me, ue = () => X === "null" || X === null || !X ? "#000000" : X, [k, mt] = B([]), { colorBy: Y } = H, Oe = {};
+  A.forEach((e, t) => {
     Oe[t] = !0;
   });
-  const [N, dt] = S(Oe), [Fe, ht] = S(50), [Xt, mt] = S(q), [Ct, Ee] = S(0), [ut, ft] = S(Q), P = ((e, t, i, n, l) => {
+  const [I, ut] = B(Oe), [Ee, ft] = B(50), [qt, $e] = B(S), [Zt, ze] = B(0), [Ve, Be] = B(j), [He, ot] = B(!1);
+  be(() => {
+    let e, t;
+    return e = requestAnimationFrame(() => {
+      e = requestAnimationFrame(() => {
+        t = setTimeout(() => {
+          ot(!0);
+        }, 50);
+      });
+    }), () => {
+      cancelAnimationFrame(e), clearTimeout(t);
+    };
+  }, []);
+  const K = ((e, t, i, n, l) => {
     let s = [];
     return e.data && (s = t.colorBy === "index" ? e.data.map((r) => {
       let a, h = !0;
-      return i.indexOf(r[e.indexBy]) > -1 ? (h = !1, a = n) : a = r[U] ? r[U] : l.getColor(r.id, r), {
+      return i.indexOf(r[e.indexBy]) > -1 ? (h = !1, a = n) : a = r[Q] ? r[Q] : l.getColor(r.id, r), {
         enabled: h,
         color: a,
         id: r[e.indexBy],
@@ -103,30 +118,30 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
     })), s;
   })(
     u,
-    $,
-    L,
-    Rt,
-    v
-  ), ze = () => (at && P.reverse(), /* @__PURE__ */ p(pe, { children: [
-    G && P.map((e) => /* @__PURE__ */ p(
+    H,
+    k,
+    Yt,
+    N
+  ), We = () => (it && K.reverse(), /* @__PURE__ */ p(pe, { children: [
+    G && K.map((e) => /* @__PURE__ */ p(
       "div",
       {
         className: `legend item ${e.enabled ? "" : "ignore"}`,
-        onClick: () => Lt(e.id),
+        onClick: () => kt(e.id),
         children: [
-          I && /* @__PURE__ */ c(
+          L && /* @__PURE__ */ c(
             "input",
             {
               className: e.enabled ? "" : "ignore",
               type: "checkbox",
               checked: e.enabled,
               style: {
-                backgroundColor: I ? j === "values" ? te : e.color : "none",
+                backgroundColor: L ? Y === "values" ? te : e.color : "none",
                 color: "#000"
               }
             }
           ),
-          !I && /* @__PURE__ */ c(
+          !L && /* @__PURE__ */ c(
             "input",
             {
               type: "checkbox",
@@ -136,20 +151,20 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
               }
             }
           ),
-          I && /* @__PURE__ */ c(
+          L && /* @__PURE__ */ c(
             "span",
             {
               className: "checkmark-with-bg",
               style: { backgroundColor: e.color }
             }
           ),
-          !I && /* @__PURE__ */ c("span", { className: "checkmark" }),
+          !L && /* @__PURE__ */ c("span", { className: "checkmark" }),
           ie && /* @__PURE__ */ c(
             "label",
             {
               className: e.enabled ? "" : "ignore",
               style: {
-                backgroundColor: j === "values" ? te : e.color,
+                backgroundColor: Y === "values" ? te : e.color,
                 color: ce
               },
               children: e.label
@@ -168,35 +183,35 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
         ]
       }
     )),
-    j === "values" && /* @__PURE__ */ p("div", { className: "legend item", children: [
+    Y === "values" && /* @__PURE__ */ p("div", { className: "legend item", children: [
       /* @__PURE__ */ c(
         "label",
         {
           className: "range min",
           style: {
-            backgroundColor: v.getColorByValue(
-              v.minValue
+            backgroundColor: N.getColorByValue(
+              N.minValue
             ),
             color: "#fff"
           }
         }
       ),
       /* @__PURE__ */ c("label", { children: g.formatNumber(
-        b.style === "percent" ? v.minValue / 100 : v.minValue,
+        b.style === "percent" ? N.minValue / 100 : N.minValue,
         {
           ...b,
           minimumFractionDigits: 0
         }
       ) })
     ] }),
-    j === "values" && /* @__PURE__ */ p("div", { className: "legend item", children: [
+    Y === "values" && /* @__PURE__ */ p("div", { className: "legend item", children: [
       /* @__PURE__ */ c(
         "label",
         {
           className: "range max",
           style: {
-            backgroundColor: v.getColorByValue(
-              v.maxValue
+            backgroundColor: N.getColorByValue(
+              N.maxValue
             ),
             color: "#fff"
           },
@@ -204,22 +219,22 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
         }
       ),
       /* @__PURE__ */ c("label", { children: g.formatNumber(
-        b.style === "percent" ? v.maxValue / 100 : v.maxValue,
+        b.style === "percent" ? N.maxValue / 100 : N.maxValue,
         {
           ...b,
           minimumFractionDigits: 0
         }
       ) })
     ] }),
-    G && ne && W.map((e, t) => /* @__PURE__ */ p("div", { className: "legend item", onClick: () => kt(t), children: [
+    G && ne && A.map((e, t) => /* @__PURE__ */ p("div", { className: "legend item", onClick: () => wt(t), children: [
       /* @__PURE__ */ c(
         "input",
         {
-          className: I && N[t] ? "" : "ignore",
+          className: L && I[t] ? "" : "ignore",
           type: "checkbox",
-          checked: N[t],
+          checked: I[t],
           style: {
-            backgroundColor: N[t] && I === !0 ? e.lineColor : "none",
+            backgroundColor: I[t] && L === !0 ? e.lineColor : "none",
             color: "#000"
           }
         }
@@ -227,18 +242,18 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
       /* @__PURE__ */ c(
         "span",
         {
-          className: I ? "checkmark-with-bg" : "checkmark",
+          className: L ? "checkmark-with-bg" : "checkmark",
           style: {
-            backgroundColor: N[t] && I === !0 ? e.lineColor : "none"
+            backgroundColor: I[t] && L === !0 ? e.lineColor : "none"
           }
         }
       ),
       /* @__PURE__ */ c(
         "label",
         {
-          className: N[t] ? "" : "ignore",
+          className: I[t] ? "" : "ignore",
           style: {
-            backgroundColor: N[t] && ie === !0 ? e.lineColor : "none",
+            backgroundColor: I[t] && ie === !0 ? e.lineColor : "none",
             color: ce
           },
           children: e.title
@@ -246,24 +261,26 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
       )
     ] }))
   ] }));
-  Ht(() => {
+  be(() => {
     (() => {
-      const i = 5 * Math.max(P.length - 5, 0);
-      ht(i);
+      const i = 5 * Math.max(K.length - 5, 0);
+      ft(i);
     })();
-  }, [P]);
-  const ot = {
-    bottom: `-${Fe}px`
+  }, [K]), be(() => {
+    $e(S), Be(j);
+  }, [v, S, j]);
+  const yt = {
+    bottom: `-${Ee}px`
   }, xt = {
-    bottom: `-${Fe}px`,
+    bottom: `-${Ee}px`,
     gap: "0px"
     // top: "0px",
-  }, yt = (e) => fe(e, "1 0", _e, "Y"), pt = (e) => fe(e, "4 4", J, "X"), bt = (e) => fe(e, "1 0", _e, "X"), gt = (e) => {
-    const t = P.find((i) => i.id === e.value);
+  }, pt = (e) => fe(e, "1 0", Ye, "Y"), bt = (e) => fe(e, "4 4", U, "X"), gt = (e) => fe(e, "1 0", Ye, "X"), vt = (e) => {
+    const t = K.find((i) => i.id === e.value);
     return t ? t.color : "#FFFFFF";
-  }, vt = (e) => {
+  }, Nt = (e) => {
     const { yScale: t, bars: i } = e;
-    return /* @__PURE__ */ c(He, { children: i.filter((n) => n.data.value != null).map((n) => {
+    return /* @__PURE__ */ c(Se, { children: i.filter((n) => n.data.value != null).map((n) => {
       let l = n.data.indexValue;
       u.dimensionsMetadata && u.dimensionsMetadata.size > 1 && (l = n.data.id);
       const s = de.filter(
@@ -280,7 +297,7 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
               x1: n.x + n.width / 2,
               x2: n.x + n.width / 2,
               strokeWidth: 1,
-              stroke: J
+              stroke: U
             }
           ),
           /* @__PURE__ */ c(
@@ -291,7 +308,7 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
               x1: n.x + n.width / 2 - 3,
               x2: n.x + n.width / 2 + 3,
               strokeWidth: 1,
-              stroke: J
+              stroke: U
             }
           ),
           /* @__PURE__ */ c(
@@ -302,7 +319,7 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
               x1: n.x + n.width / 2 - 3,
               x2: n.x + n.width / 2 + 3,
               strokeWidth: 1,
-              stroke: J
+              stroke: U
             }
           )
         ] });
@@ -311,7 +328,7 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
   }, fe = (e, t, i, n) => {
     const { yScale: l, innerWidth: s, innerHeight: r } = e;
     let a, h;
-    return n == "X" ? (a = [0, s], h = We().x((f, V) => V === 0 ? -10 : f).y(() => l(0))) : (a = [0, r], h = We().x(() => 0).y((f) => f)), /* @__PURE__ */ c(He, { children: /* @__PURE__ */ c(
+    return n == "X" ? (a = [0, s], h = je().x((f, V) => V === 0 ? -10 : f).y(() => l(0))) : (a = [0, r], h = je().x(() => 0).y((f) => f)), /* @__PURE__ */ c(Se, { children: /* @__PURE__ */ c(
       "path",
       {
         d: h(a),
@@ -320,25 +337,25 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
         style: { pointerEvents: "none", strokeDasharray: t }
       }
     ) });
-  }, O = (e, t) => L ? ($.colorBy === "index" || $.colorBy === "id" || $.colorBy === "values") && !t ? e.filter((i) => L.indexOf(i[u.indexBy]) === -1) : e ? e.filter((i) => L.indexOf(i) === -1) : [] : e, Nt = (e) => {
-    const t = St();
+  }, M = (e, t) => k ? (H.colorBy === "index" || H.colorBy === "id" || H.colorBy === "values") && !t ? e.filter((i) => k.indexOf(i[u.indexBy]) === -1) : e ? e.filter((i) => k.indexOf(i) === -1) : [] : e, It = (e) => {
+    const t = _t();
     if (!e.value) return "";
     const i = Object.assign({}, e);
-    (_ || T) && ye.includes(String(i.value)) && (i.value = "");
+    (_ || T) && xe.includes(String(i.value)) && (i.value = "");
     let n;
-    Ye ? n = te : n = gt(e);
+    Ze ? n = te : n = vt(e);
     let l = [], s = "";
     if (T || _) {
       const a = String(i.value).split(" ");
       let h = 25;
-      x && B === "Mobile" || C && !x ? h = (m == null ? void 0 : m.mobileMaxTickLength) ?? 25 : x && B === "Tablet" || X && !x ? h = (m == null ? void 0 : m.tabletMaxTickLength) ?? 25 : window.matchMedia("(min-width: 768px) and (max-width: 1250px)").matches && !x && (h = 15), a.forEach((f) => {
+      y && z === "Mobile" || Z && !y ? h = (m == null ? void 0 : m.mobileMaxTickLength) ?? 25 : y && z === "Tablet" || q && !y ? h = (m == null ? void 0 : m.tabletMaxTickLength) ?? 25 : window.matchMedia("(min-width: 768px) and (max-width: 1250px)").matches && !y && (h = 15), a.forEach((f) => {
         s.length + String(f).length <= h ? s += (s ? " " : "") + f : (l.push(s), s = f);
       }), s && l.push(s);
     } else
       l = [i.value];
     let r = 12;
-    return C ? r = (m == null ? void 0 : m.mobileYAxisLineHeight) ?? 12 : X && (r = (m == null ? void 0 : m.tabletYAxisLineHeight) ?? 12), E > 0 && E < 180 ? /* @__PURE__ */ p("g", { transform: `translate(${e.x},${e.y + 30})`, children: [
-      A && /* @__PURE__ */ c(
+    return Z ? r = (m == null ? void 0 : m.mobileYAxisLineHeight) ?? 12 : q && (r = (m == null ? void 0 : m.tabletYAxisLineHeight) ?? 12), E > 0 && E < 180 ? /* @__PURE__ */ p("g", { transform: `translate(${e.x},${e.y + 30})`, children: [
+      R && /* @__PURE__ */ c(
         "line",
         {
           stroke: n,
@@ -356,7 +373,7 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
           dominantBaseline: "middle",
           style: {
             ...t.axis.ticks.text,
-            fill: w === "null" ? "black" : w,
+            fill: D === "null" ? "black" : D,
             fontSize: "12px",
             fontFamily: "sans-serif"
           },
@@ -365,7 +382,7 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
         a
       )) })
     ] }) : E > 180 && E < 360 ? /* @__PURE__ */ p("g", { transform: `translate(${e.x},${e.y + 30})`, children: [
-      A && /* @__PURE__ */ c(
+      R && /* @__PURE__ */ c(
         "line",
         {
           stroke: n,
@@ -383,7 +400,7 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
           dominantBaseline: "middle",
           style: {
             ...t.axis.ticks.text,
-            fill: w === "null" ? "black" : w,
+            fill: D === "null" ? "black" : D,
             fontSize: "12px",
             fontFamily: "sans-serif"
           },
@@ -392,7 +409,7 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
         h
       )) })
     ] }) : /* @__PURE__ */ p("g", { transform: `translate(${e.x},${e.y + 30})`, children: [
-      A && /* @__PURE__ */ c(
+      R && /* @__PURE__ */ c(
         "line",
         {
           stroke: n,
@@ -410,7 +427,7 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
           dominantBaseline: "middle",
           style: {
             ...t.axis.ticks.text,
-            fill: w === "null" ? "black" : w,
+            fill: D === "null" ? "black" : D,
             fontSize: "12px",
             fontFamily: "sans-serif"
           },
@@ -419,12 +436,12 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
         h
       )) })
     ] });
-  }, It = (e) => {
-    if (!e.value || (T || _) && ye.includes(String(e.value)))
+  }, Lt = (e) => {
+    if (!e.value || (T || _) && xe.includes(String(e.value)))
       return "";
     let t = e.value;
     if (o === "vertical") {
-      const a = M || b;
+      const a = F || b;
       t = g.formatNumber(
         a.style === "percent" ? t / 100 : t,
         {
@@ -433,14 +450,14 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
       );
     }
     let i = 25;
-    x && B === "Mobile" || C && !x ? i = (m == null ? void 0 : m.mobileMaxTickLength) ?? 25 : x && B === "Tablet" || X && !x ? i = (m == null ? void 0 : m.tabletMaxTickLength) ?? 25 : window.matchMedia("(min-width: 768px) and (max-width: 1250px)").matches && !x && (i = 15);
+    y && z === "Mobile" || Z && !y ? i = (m == null ? void 0 : m.mobileMaxTickLength) ?? 25 : y && z === "Tablet" || q && !y ? i = (m == null ? void 0 : m.tabletMaxTickLength) ?? 25 : window.matchMedia("(min-width: 768px) and (max-width: 1250px)").matches && !y && (i = 15);
     const n = typeof t == "string" ? t.split(" ") : [t], l = [];
     let s = "";
     n.forEach((a) => {
       s.length + String(a).length <= i ? s += (s ? " " : "") + a : (l.push(s), s = a);
     }), s && l.push(s);
     let r = 12;
-    return x && B === "Mobile" || C && !x ? r = (m == null ? void 0 : m.mobileYAxisLineHeight) ?? 12 : (x && B === "Tablet" || X && !x) && (r = (m == null ? void 0 : m.tabletYAxisLineHeight) ?? 12), /* @__PURE__ */ p("g", { transform: `translate(${e.x},${e.y})`, children: [
+    return y && z === "Mobile" || Z && !y ? r = (m == null ? void 0 : m.mobileYAxisLineHeight) ?? 12 : (y && z === "Tablet" || q && !y) && (r = (m == null ? void 0 : m.tabletYAxisLineHeight) ?? 12), /* @__PURE__ */ p("g", { transform: `translate(${e.x},${e.y})`, children: [
       /* @__PURE__ */ c("line", { x1: -5, x2: 0, y1: 0, y2: 0, stroke: "#000", strokeWidth: 1 }),
       l.map((a, h) => /* @__PURE__ */ c(
         "text",
@@ -450,7 +467,7 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
           textAnchor: "end",
           dominantBaseline: "middle",
           style: {
-            fill: w === "null" ? "black" : w,
+            fill: D === "null" ? "black" : D,
             fontSize: "12px",
             fontFamily: "sans-serif"
           },
@@ -459,17 +476,17 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
         a
       ))
     ] });
-  }, Lt = (e) => {
-    const t = L.slice();
+  }, kt = (e) => {
+    const t = k.slice();
     if (t.indexOf(e) > -1) {
       const i = t.indexOf(e);
       t.splice(i, 1);
     } else
       t.push(e);
-    ct(t);
-  }, kt = (e) => {
-    const t = Object.assign({}, N);
-    t[e] = !t[e], dt(t);
+    mt(t);
+  }, wt = (e) => {
+    const t = Object.assign({}, I);
+    t[e] = !t[e], ut(t);
   }, Dt = ({ bars: e }) => /* @__PURE__ */ c("g", { children: e.map((t) => {
     const { width: i, height: n, y: l, x: s, data: r } = t;
     if (o === "horizontal" && n <= me || o === "vertical" && i <= he)
@@ -489,20 +506,20 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
           children: `${a}`
         }
       );
-  }) }), wt = (e) => {
-    const t = u.data.filter((n) => L.indexOf(n[u.indexBy]) == -1).map((n) => n[u.indexBy]), { bars: i } = e;
+  }) }), Ft = (e) => {
+    const t = u.data.filter((n) => k.indexOf(n[u.indexBy]) == -1).map((n) => n[u.indexBy]), { bars: i } = e;
     return /* @__PURE__ */ c("g", { children: t.filter(
       (n) => i.filter((l) => l.data.indexValue == n).length > 0
     ).map((n) => {
-      var Z;
+      var J;
       const l = i.filter((d) => d.data.indexValue == n);
       let s = "right", r = 0, a = 0;
       if (o == "horizontal")
-        F === "stacked" ? (K ? r = e.innerWidth - 20 : (r = l.map((d) => d.width).reduce((d, y) => d + y), H && (r = e.innerWidth - r)), a = e.yScale(n) + l[0].height / 2) : (K ? r = e.innerWidth : (r = l.map((d) => d.width).reduce((d, y) => d > y ? d : y), H && (r = e.innerWidth - r)), a = e.yScale(n) + l.map((d) => d.height).reduce((d, y) => d + y) / 2), r = r + parseInt(z) + 5;
-      else if (s = "middle", F === "stacked")
-        r = e.xScale(n) + l[0].width / 2, K ? a = a - parseInt(z) : H ? a = parseInt(z) + l.map((d) => d.height).reduce((d, y) => d + y) + 14 : a = e.innerHeight - parseInt(z) - l.map((d) => d.height).reduce((d, y) => d + y) - 5;
-      else if (r = e.xScale(n) + l.map((d) => d.width).reduce((d, y) => d + y) / 2, H && (a = e.innerHeight), K)
-        a = a - parseInt(z);
+        O === "stacked" ? (C ? r = e.innerWidth - 20 : (r = l.map((d) => d.width).reduce((d, x) => d + x), W && (r = e.innerWidth - r)), a = e.yScale(n) + l[0].height / 2) : (C ? r = e.innerWidth : (r = l.map((d) => d.width).reduce((d, x) => d > x ? d : x), W && (r = e.innerWidth - r)), a = e.yScale(n) + l.map((d) => d.height).reduce((d, x) => d + x) / 2), r = r + parseInt($) + 5;
+      else if (s = "middle", O === "stacked")
+        r = e.xScale(n) + l[0].width / 2, C ? a = a - parseInt($) : W ? a = parseInt($) + l.map((d) => d.height).reduce((d, x) => d + x) + 14 : a = e.innerHeight - parseInt($) - l.map((d) => d.height).reduce((d, x) => d + x) - 5;
+      else if (r = e.xScale(n) + l.map((d) => d.width).reduce((d, x) => d + x) / 2, W && (a = e.innerHeight), C)
+        a = a - parseInt($);
       else {
         if (l.length % 2 == 1) {
           const d = Math.floor(l.length / 2);
@@ -514,15 +531,15 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
             l[d - 1].height
           );
         }
-        H ? a = a + 14 + parseInt(z) : a = e.innerHeight - a - parseInt(z) - 5;
+        W ? a = a + 14 + parseInt($) : a = e.innerHeight - a - parseInt($) - 5;
       }
       const h = u.data.filter(
         (d) => d[u.indexBy] === n
       )[0];
-      let f = h.parent_variables ? h.parent_variables[we] : h[we];
-      const V = j !== "index" ? (Z = L == null ? void 0 : L.map((d) => h[d])) == null ? void 0 : Z.reduce((d, y) => d + y, 0) : 0;
+      let f = h.parent_variables ? h.parent_variables[Fe] : h[Fe];
+      const V = Y !== "index" ? (J = k == null ? void 0 : k.map((d) => h[d])) == null ? void 0 : J.reduce((d, x) => d + x, 0) : 0;
       return f -= V, /* @__PURE__ */ c("text", { y: a, x: r, style: { fill: ue() }, children: /* @__PURE__ */ p("tspan", { textAnchor: s, children: [
-        ke ? ke + " " : "",
+        we ? we + " " : "",
         g.formatNumber(
           De.style === "percent" ? f / 100 : f,
           De
@@ -530,32 +547,32 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
       ] }) });
     }) });
   }, Mt = {
-    top: q,
-    right: Ae,
-    bottom: Q,
-    left: Se
+    top: S,
+    right: Pe,
+    bottom: j,
+    left: Ke
   };
   let oe;
-  ve && (oe = be.parse(ve, {
+  Ne && (oe = ge.parse(Ne, {
     header: !1,
     dynamicTyping: !0
   }), Math.max(...oe.data.map((e) => e[1])), Math.min(...oe.data.map((e) => e[1])));
-  const Be = () => {
+  const Ae = () => {
     const e = [];
     if (de && de.forEach((t) => {
       t.low && e.push(parseFloat(t.low)), t.high && e.push(parseFloat(t.high));
     }), u.data) {
-      const t = O(u.data, !1), i = O(u.keys, !0);
+      const t = M(u.data, !1), i = M(u.keys, !0);
       t.forEach((n) => {
         i.forEach((l) => {
           n[l] && e.push(n[l]);
         });
       });
     }
-    return ne && W && W.forEach((t, i) => {
-      if (N[i] !== !1)
+    return ne && A && A.forEach((t, i) => {
+      if (I[i] !== !1)
         if (t.app === "csv" && t.csvLineLayerData) {
-          const n = be.parse(t.csvLineLayerData, {
+          const n = ge.parse(t.csvLineLayerData, {
             header: !1,
             dynamicTyping: !0
           });
@@ -567,45 +584,45 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
         });
     }), e;
   }, Ot = () => {
-    const e = Be(), t = e.length > 0 ? Math.max(...e) : 0;
+    const e = Ae(), t = e.length > 0 ? Math.max(...e) : 0;
     if (re === "fixed" && se !== null && se !== "")
       return Number(se);
-    if (F === "stacked" && re !== "fixed") {
-      const i = O(u.data, !1), n = O(u.keys, !0);
+    if (O === "stacked" && re !== "fixed") {
+      const i = M(u.data, !1), n = M(u.keys, !0);
       let l = n.length > 0 ? n : u.keys;
       const s = Math.max(
-        ...i.map((r) => l.map((a) => r[a] ? r[a] : 0)).map(
-          (r) => r.length > 0 ? r.reduce((a, h) => a + h, 0) : 0
-        )
+        ...i.map((r) => l.map((a) => r[a] ? r[a] : 0)).map((r) => r.length > 0 ? r.reduce((a, h) => a + h, 0) : 0)
       );
       return Math.max(s, t) * 1.1;
     }
     return t * 1.05;
-  }, Ft = () => {
-    const e = Be(), t = e.length > 0 ? Math.min(...e) : 0;
+  }, Et = () => {
+    const e = Ae(), t = e.length > 0 ? Math.min(...e) : 0;
     return re === "fixed" && le !== null && String(le) !== "" ? Number(le) : t > 0 ? t * 0.9 : t * 1.1;
-  }, Et = Number(Ot()), zt = Number(Ft()), Bt = Math.min(0, zt), Vt = Math.max(0, Et), k = ["grid", "axes", "bars"];
-  qe && k.push(wt), k.push(yt), k.push(bt), ne && W && W.forEach((e, t) => {
-    if (N[t] == !0 || N[t] == null) {
+  }, $t = Number(Ot()), zt = Number(Et()), Vt = Math.min(0, zt), Bt = Math.max(0, $t), w = ["grid", "axes", "bars"];
+  at && w.push(Ft), w.push(pt), w.push(gt), ne && A && A.forEach((e, t) => {
+    if (I[t] == !0 || I[t] == null) {
       const { csvLineLayerData: i, lineColor: n, tooltip: l } = e;
       if (e.app == "csv") {
-        const s = be.parse(i, {
+        const s = ge.parse(i, {
           header: !1,
           dynamicTyping: !0
         });
         if (s.data && s.data.filter((r) => r[1] !== null).length > 0) {
-          s.data = s.data.filter((a) => a[1] !== null);
-          const r = Te(
+          s.data = s.data.filter(
+            (a) => a[1] !== null
+          );
+          const r = Re(
             s,
             n,
             o,
-            F,
-            O(u.keys, !0),
+            O,
+            M(u.keys, !0),
             l,
             e.title,
             ""
           );
-          k.push(r);
+          w.push(r);
         }
       } else if (e.measure[0]) {
         const s = {}, r = u.data.map((f) => [
@@ -613,61 +630,63 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
           f.variables[e.measure[0]]
         ]), a = u.metadata.measures ? u.metadata.measures.filter((f) => f.value == e.measure[0]) : [];
         s.data = r;
-        const h = Te(
+        const h = Re(
           s,
           n,
           o,
-          F,
-          O(u.keys, !0),
+          O,
+          M(u.keys, !0),
           l,
           e.title,
           a.length > 0 ? a[0].label : ""
         );
-        k.push(h);
+        w.push(h);
       }
     }
-  }), Ie === Pt && k.push(Dt), Ze && k.push(pt), k.push(vt);
-  let xe = parseInt(et);
-  const Ve = () => /* @__PURE__ */ c(pe, { children: G && Ne && /* @__PURE__ */ c("div", { className: "legend item", children: /* @__PURE__ */ c("label", { className: "legend-title", children: Ne }) }) }), ye = [];
+  }), Le === Rt && w.push(Dt), Ge && w.push(bt), w.push(Nt);
+  let ye = parseInt(lt);
+  const Te = () => /* @__PURE__ */ c(pe, { children: G && Ie && /* @__PURE__ */ c("div", { className: "legend item", children: /* @__PURE__ */ c("label", { className: "legend-title", children: Ie }) }) }), xe = [];
   if (_ || T) {
-    xe = Number.parseInt(m.yAxisTickValues);
-    const e = new Map(Object.entries((($e = m == null ? void 0 : m.labels) == null ? void 0 : $e.xAxis) ?? {}));
+    ye = Number.parseInt(m.yAxisTickValues);
+    const e = new Map(
+      Object.entries(((_e = m == null ? void 0 : m.labels) == null ? void 0 : _e.xAxis) ?? {})
+    );
     for (const [t, i] of e)
-      i || ye.push(t);
+      i || xe.push(t);
   }
-  let $t = parseInt(je + "") - ut;
-  return /* @__PURE__ */ c("div", { style: { height: $t + "px" }, className: "bar-chart", children: (u == null ? void 0 : u.data) && u.data.length > 0 && /* @__PURE__ */ p(pe, { children: [
+  let Ht = parseInt(Xe + "") - Ve;
+  return /* @__PURE__ */ c("div", { style: { height: Ht + "px" }, className: "bar-chart", children: (u == null ? void 0 : u.data) && u.data.length > 0 && /* @__PURE__ */ p(pe, { children: [
     /* @__PURE__ */ c(
-      Tt,
+      At,
       {
-        colorBy: $.colorBy,
+        colorBy: H.colorBy,
         animate: !0,
-        enableLabel: Ie == jt,
+        enableLabel: Le == jt,
         ...u,
-        maxValue: Vt,
-        minValue: Bt,
-        keys: O(u.keys, !0),
-        data: O(u.data, !1),
-        groupMode: F || "grouped",
+        maxValue: Bt,
+        minValue: Vt,
+        keys: M(u.keys, !0),
+        data: M(u.data, !1),
+        groupMode: O || "grouped",
         margin: Mt,
-        innerPadding: Xe,
-        valueScale: { type: Re, clamp: !0 },
-        colors: (e) => e && e.data[U] ? e.data[U] : v.getColor(e.id, e.data),
+        innerPadding: Ue,
+        valueScale: { type: qe, clamp: !0 },
+        colors: (e) => e && e.data[Q] ? e.data[Q] : N.getColor(e.id, e.data),
         borderColor: "#000",
-        reverse: H,
+        reverse: W,
         axisTop: null,
-        axisRight: Je ? {
-          tickSize: o == "horizontal" && A || o === "vertical" ? 5 : 0,
+        axisRight: et ? {
+          tickSize: o == "horizontal" && R || o === "vertical" ? 5 : 0,
           tickPadding: 5,
           tickRotation: 0,
-          tickValues: xe,
-          legend: R.right,
+          tickValues: ye,
+          legend: P.right,
           legendPosition: "middle",
-          legendOffset: parseInt(Ue),
+          legendOffset: parseInt(tt),
           format: (e) => {
             if (!e) return "";
             if (o == "vertical") {
-              const t = M || b;
+              const t = F || b;
               return g.formatNumber(
                 t.style === "percent" ? e / 100 : e,
                 {
@@ -679,16 +698,16 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
           }
         } : null,
         axisBottom: (T || _) && (m == null ? void 0 : m.xAxisDisabled) === !0 ? null : o === "horizontal" ? {
-          legend: R.bottom,
+          legend: P.bottom,
           legendPosition: "middle",
-          legendOffset: parseInt(Le),
+          legendOffset: parseInt(ke),
           tickPadding: 5,
           tickRotation: 0,
-          tickValues: parseInt(Ge),
+          tickValues: parseInt(rt),
           format: (e) => {
             if (!e) return "";
             if (o == "horizontal") {
-              const t = M || b;
+              const t = F || b;
               return g.formatNumber(
                 t.style === "percent" ? e / 100 : e,
                 {
@@ -699,24 +718,24 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
             return e;
           }
         } : {
-          legend: R.bottom,
+          legend: P.bottom,
           legendPosition: "middle",
-          legendOffset: parseInt(Le),
-          renderTick: Nt
+          legendOffset: parseInt(ke),
+          renderTick: It
         },
         axisLeft: {
-          tickSize: o === "horizontal" && A || o === "vertical" ? 5 : 0,
+          tickSize: o === "horizontal" && R || o === "vertical" ? 5 : 0,
           tickPadding: 5,
           tickRotation: 0,
-          tickValues: xe,
-          legend: R.left,
+          tickValues: ye,
+          legend: P.left,
           legendPosition: "middle",
-          legendOffset: Number.parseInt(Pe),
-          ...T || _ ? { renderTick: It } : {
+          legendOffset: Number.parseInt(Ce),
+          ...T || _ ? { renderTick: Lt } : {
             format: (e) => {
               if (!e) return "";
               if (o === "vertical") {
-                const t = M || b;
+                const t = F || b;
                 return g.formatNumber(
                   t.style === "percent" ? e / 100 : e,
                   {
@@ -728,32 +747,32 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
             }
           }
         },
-        enableGridY: nt,
-        enableGridX: rt,
+        enableGridY: ct,
+        enableGridX: dt,
         layout: o,
         labelSkipWidth: he,
         labelSkipHeight: me,
-        padding: Ke,
+        padding: Je,
         labelTextColor: ue(),
         label: (e) => g.formatNumber(
           b.style === "percent" && e.value ? e.value / 100 : e.value,
           b
         ),
-        layers: k,
+        layers: w,
         onMouseEnter: (e) => {
         },
         onMouseLeave: (e) => {
         },
         motionStiffness: 130,
         motionDamping: 15,
-        tooltip: (e) => Ce && ae && ae.trim().length > 0 ? /* @__PURE__ */ c(
+        tooltip: (e) => Qe && ae && ae.trim().length > 0 ? /* @__PURE__ */ c(
           Wt,
           {
             intl: g,
             format: b,
             d: e,
             tooltip: ae,
-            tooltipEnableMarkdown: Qe
+            tooltipEnableMarkdown: nt
           }
         ) : null,
         theme: {
@@ -773,40 +792,39 @@ const jt = "middle", Pt = "top", J = "#66676d", _e = "#dddddd", Rt = "none", U =
         }
       }
     ),
-    (D === "top" || D === "bottom") && /* @__PURE__ */ c(
+    (v === "top" || v === "bottom") && He && /* @__PURE__ */ c(
       "div",
       {
-        className: `legends container has-standard-12-font-size ${D}`,
+        className: `legends container has-standard-12-font-size ${v}`,
+        style: v === "bottom" ? { marginBottom: `${Ve}px` } : {},
         children: /* @__PURE__ */ p("div", { className: "legend-sections", children: [
-          /* @__PURE__ */ c("div", { className: "title-section", children: Ve() }),
+          /* @__PURE__ */ c("div", { className: "title-section", children: Te() }),
           /* @__PURE__ */ c(
-            At,
+            St,
             {
               onWrapChange: (e) => {
-                D === "top" ? (mt(q + e / 2 * 40), Ee(e)) : (ft(Q + e / 2 * 25), Ee(e));
+                v === "top" ? ($e(S + e / 2 * 40), ze(e)) : (Be(j + e / 2 * 25), ze(e));
               },
               className: "legends container has-standard-12-font-size items-section",
-              useColumns: lt,
-              numberOfLegendColumns: st,
-              children: ze()
+              children: We()
             }
           )
         ] })
       }
     ),
-    (D === "right" || D === "left") && /* @__PURE__ */ p(
+    (v === "right" || v === "left") && He && /* @__PURE__ */ p(
       "div",
       {
-        className: `legends container has-standard-12-font-size  ${D}`,
-        style: D === "right" ? ot : xt,
+        className: `legends container has-standard-12-font-size  ${v}`,
+        style: v === "right" ? yt : xt,
         children: [
-          Ve(),
-          ze()
+          Te(),
+          We()
         ]
       }
     )
   ] }) });
-}, sa = _t(Yt);
+}, ca = Tt(Kt);
 export {
-  sa as default
+  ca as default
 };