@devgateway/dvz-ui-react 1.0.6 → 1.1.0

package/dist/esm/embeddable/big-number/index.js

@@ -1,121 +1,129 @@
-import { jsx as n, jsxs as A } from "react/jsx-runtime";
+import { jsx as o, jsxs as T } from "react/jsx-runtime";
 import { useRef as E, useState as O } from "react";
 import { Container as q } from "semantic-ui-react";
-import w from "../data/DataProvider.js";
-import H from "../data/DataConsumer.js";
+import H from "../data/DataProvider.js";
+import J from "../data/DataConsumer.js";
 import "@devgateway/wp-react-lib";
-import { connect as J } from "react-redux";
-const T = (l) => {
+import { connect as $ } from "react-redux";
+const k = (l) => {
   const {
     editing: a = !1,
     unique: c,
     intl: e,
-    childContent: i,
-    "data-csv": u = "",
-    "data-dvz-proxy-dataset-id": p,
-    "data-no-data-message": S = "No data matches your selection",
-    "data-view-mode": b = "info",
+    childContent: n,
+    "data-csv": f = "",
+    "data-dvz-proxy-dataset-id": b,
+    "data-no-data-message": z = "No data matches your selection",
+    "data-view-mode": g = "info",
     "data-height": m,
     "data-app": d,
-    "data-measures": s = "{}",
-    "data-format": r = "{}",
-    "data-group": f,
-    "data-filters": g = "[]",
-    "data-number-font-size": h = 20,
-    "data-label-font-size": C = 20,
-    "data-number-color": y = "#000000",
-    "data-label-color": I = "#000000",
-    "data-label": j = ""
-  } = l, N = e.locale, M = E(null), P = (t) => a ? t : decodeURIComponent(t), x = (t) => {
+    "data-measures": h = "{}",
+    "data-format": u = "{}",
+    "data-group": i,
+    "data-filters": p = "[]",
+    "data-number-font-size": x = 20,
+    "data-label-font-size": y = 20,
+    "data-number-color": s = "#000000",
+    "data-label-color": F = "#000000",
+    "data-label": j = "",
+    "data-wait-for-filters": N = "false",
+    "data-no-data-text": M = "-"
+  } = l, w = e.locale, P = E(null), R = (t) => a ? t : decodeURIComponent(t), D = (t) => {
     try {
-      return JSON.parse(P(t));
+      return JSON.parse(R(t));
     } catch {
       console.error("error parsing value:" + t);
     }
     return null;
-  }, o = x(r), R = o ? {
-    style: o.style === "compacted" ? "decimal" : o.style,
-    notation: o.style === "compacted" ? "compact" : "standard",
-    currency: o.currency,
-    minimumFractionDigits: parseInt(o.minimumFractionDigits),
-    maximumFractionDigits: parseInt(o.maximumFractionDigits)
+  }, r = D(u), U = r ? {
+    style: r.style === "compacted" ? "decimal" : r.style,
+    notation: r.style === "compacted" ? "compact" : "standard",
+    currency: r.currency,
+    minimumFractionDigits: parseInt(r.minimumFractionDigits),
+    maximumFractionDigits: parseInt(r.maximumFractionDigits)
   } : {
     notation: "standard",
     currency: "USD",
     minimumFractionDigits: 2,
     maximumFractionDigits: 2
-  }, [G, K] = O(b), U = a ? m - 80 : m - 40, v = {}, D = x(g) || {};
-  D && D.forEach && D.forEach((t) => {
-    t.value != null && t.value.filter((F) => F != null && F.toString().trim() != "").length > 0 && (v[t.param] = t.value);
-  }), p && (v.dvzProxyDatasetId = p);
-  const z = [];
-  return /* @__PURE__ */ n("div", { ref: M, children: /* @__PURE__ */ n(q, { className: "chart container big-number-container", style: { height: m + "px" }, fluid: !0, children: /* @__PURE__ */ n(
-    w,
+  }, [L, Q] = O(g), A = a ? m - 80 : m - 40, v = {}, S = D(p) || {};
+  S && S.forEach && S.forEach((t) => {
+    t.value != null && t.value.filter((C) => C != null && C.toString().trim() != "").length > 0 && (v[t.param] = t.value);
+  }), b && (v.dvzProxyDatasetId = b);
+  const I = [];
+  return /* @__PURE__ */ o("div", { ref: P, children: /* @__PURE__ */ o(q, { className: "chart container big-number-container", style: { height: m + "px" }, fluid: !0, children: /* @__PURE__ */ o(
+    H,
     {
-      style: { height: `${U}px` },
+      style: { height: `${A}px` },
       params: v,
       app: d,
-      group: f,
-      csv: u,
+      group: i,
+      csv: f,
       editing: a,
-      store: [d, c, ...z],
-      source: z.join("/"),
-      children: /* @__PURE__ */ n(H, { children: /* @__PURE__ */ n(
-        $,
+      waitForFilters: N === "true",
+      store: [d, c, ...I],
+      source: I.join("/"),
+      children: /* @__PURE__ */ o(J, { children: /* @__PURE__ */ o(
+        B,
         {
-          locale: N,
+          locale: w,
           intl: e,
           app: d,
-          format: R,
-          measure: x(s)[0] || null,
+          format: U,
+          measure: D(h)[0] || null,
           label: j,
-          numberFontSize: h,
-          numberColor: y,
-          labelFontSize: C,
-          labelColor: I
+          numberFontSize: x,
+          numberColor: s,
+          labelFontSize: y,
+          labelColor: F,
+          noDataText: M
         }
       ) })
     }
   ) }) });
-}, $ = (l) => {
+}, B = (l) => {
   const {
     app: a,
     measure: c,
     data: e,
-    format: i,
-    label: u,
-    numberColor: p,
-    numberFontSize: S,
-    labelColor: b,
+    format: n,
+    label: f,
+    numberColor: b,
+    numberFontSize: z,
+    labelColor: g,
     labelFontSize: m,
-    intl: d
+    noDataText: d,
+    intl: h
   } = l;
-  let s = c, r = e;
+  let u = c, i = e;
   if (a == "csv") {
-    const { data: C, meta: { fields: y } } = e;
-    s = y[0], r = e.data[0];
+    const { data: s, meta: { fields: F } } = e;
+    u = F[0], i = e.data[0];
   }
-  let f = "";
-  r && r[s] && (f = d.formatNumber(i.style === "percent" ? r[s] / 100 : r[s], { ...i }));
-  const g = {
-    color: decodeURIComponent(p),
-    fontSize: S + "px",
-    textAlign: "center"
-  }, h = {
+  let p = "";
+  if (i) {
+    let s = i[u] ? i[u] : 0;
+    s ? p = h.formatNumber(n.style === "percent" ? s / 100 : s, { ...n }) : p = d;
+  }
+  const x = {
     color: decodeURIComponent(b),
+    fontSize: z + "px",
+    textAlign: "center"
+  }, y = {
+    color: decodeURIComponent(g),
     fontSize: m + "px",
     textAlign: "center"
   };
-  return /* @__PURE__ */ A("div", { children: [
-    /* @__PURE__ */ n("div", { style: g, className: "big-number", children: f }),
-    u && /* @__PURE__ */ n("div", { style: h, className: "big-number-label", children: u })
+  return /* @__PURE__ */ T("div", { children: [
+    /* @__PURE__ */ o("div", { style: x, className: "big-number", children: p }),
+    f && /* @__PURE__ */ o("div", { style: y, className: "big-number-label", children: f })
   ] });
-}, k = (l, a) => {
-  const { "data-app": c, "data-group": e } = a, i = l.getIn(["data", "measures", c, e]);
-  return i ? {
-    injectedMeasures: i
+}, G = (l, a) => {
+  const { "data-app": c, "data-group": e } = a, n = l.getIn(["data", "measures", c, e]);
+  return n ? {
+    injectedMeasures: n
   } : {};
-}, B = {}, _ = J(k, B)(T);
+}, K = {}, et = $(G, K)(k);
 export {
-  _ as default
+  et as default
 };

package/dist/esm/embeddable/big-number-trend/index.js

@@ -1,42 +1,45 @@
-import { jsx as r, jsxs as U } from "react/jsx-runtime";
-import { useRef as O, useState as V } from "react";
-import { Container as q } from "semantic-ui-react";
-import H from "../data/DataProvider.js";
-import J from "../data/DataConsumer.js";
+import { jsx as o, jsxs as A } from "react/jsx-runtime";
+import { useRef as V, useState as q } from "react";
+import { Container as H } from "semantic-ui-react";
+import J from "../data/DataProvider.js";
+import $ from "../data/DataConsumer.js";
 import "@devgateway/wp-react-lib";
-import { connect as T } from "react-redux";
-import { alphaSort as $ } from "../utils/common.js";
-const k = (d) => {
+import { connect as k } from "react-redux";
+import { alphaSort as B } from "../utils/common.js";
+import G from "string-template";
+const K = (f) => {
   const {
-    editing: s = !1,
-    unique: u,
-    intl: l,
-    childContent: n,
-    "data-csv": y = "",
-    "data-dvz-proxy-dataset-id": v,
-    "data-no-data-message": x = "No data matches your selection",
-    "data-view-mode": z = "info",
-    "data-height": p,
-    "data-app": g,
-    "data-measures": D = "{}",
-    "data-format": h = "{}",
-    "data-group": e,
-    "data-filters": F = "[]",
-    "data-text-color": o = "#000000",
-    "data-big-number-font-size": f = 20,
-    "data-label-font-size": m = 20,
-    "data-percent-font-size": N = 20,
-    "data-label": c = "",
-    "data-dimension1": b,
-    "data-show-percentage-change": S = "false"
-  } = d, I = l.locale, j = O(null), C = (a) => s ? a : decodeURIComponent(a), i = (a) => {
+    editing: c = !1,
+    unique: g,
+    intl: u,
+    childContent: h,
+    "data-csv": m = "",
+    "data-dvz-proxy-dataset-id": b,
+    "data-no-data-message": T = "No data matches your selection",
+    "data-view-mode": v = "info",
+    "data-height": F,
+    "data-app": x,
+    "data-measures": C = "{}",
+    "data-format": z = "{}",
+    "data-group": y,
+    "data-filters": N = "[]",
+    "data-text-color": e = "#000000",
+    "data-big-number-font-size": i = 20,
+    "data-label-font-size": a = 20,
+    "data-percent-font-size": d = 20,
+    "data-label": p = "",
+    "data-dimension1": r,
+    "data-show-percentage-change": S = "false",
+    "data-wait-for-filters": D = "false",
+    "data-no-data-text": w = "-"
+  } = f, I = u.locale, j = V(null), s = (n) => c ? n : decodeURIComponent(n), l = (n) => {
     try {
-      return JSON.parse(C(a));
+      return JSON.parse(s(n));
     } catch {
-      console.error("error parsing value:" + a);
+      console.error("error parsing value:" + n);
     }
     return null;
-  }, t = i(h), A = t ? {
+  }, t = l(z), E = t ? {
     style: t.style === "compacted" ? "decimal" : t.style,
     notation: t.style === "compacted" ? "compact" : "standard",
     currency: t.currency,
@@ -47,84 +50,101 @@ const k = (d) => {
     currency: "USD",
     minimumFractionDigits: 2,
     maximumFractionDigits: 2
-  }, [L, Q] = V(z), E = s ? p - 80 : p - 40, w = {}, P = i(F) || {};
-  P && P.forEach && P.forEach((a) => {
-    a.value != null && a.value.filter((R) => R != null && R.toString().trim() != "").length > 0 && (w[a.param] = a.value);
-  }), v && (w.dvzProxyDatasetId = v);
-  const M = [];
-  return b != "none" && M.push(b), /* @__PURE__ */ r("div", { ref: j, children: /* @__PURE__ */ r(q, { className: "chart container big-number-trend-container", style: { height: p + "px" }, fluid: !0, children: /* @__PURE__ */ r(
-    H,
+  }, [X, Y] = q(v), O = c ? F - 80 : F - 40, P = {}, M = l(N) || {};
+  M && M.forEach && M.forEach((n) => {
+    n.value != null && n.value.filter((U) => U != null && U.toString().trim() != "").length > 0 && (P[n.param] = n.value);
+  }), b && (P.dvzProxyDatasetId = b);
+  const R = [];
+  return r != "none" && R.push(r), /* @__PURE__ */ o("div", { ref: j, children: /* @__PURE__ */ o(H, { className: "chart container big-number-trend-container", style: { height: F + "px" }, fluid: !0, children: /* @__PURE__ */ o(
+    J,
     {
-      style: { height: `${E}px` },
-      params: w,
-      app: g,
-      group: e,
-      csv: y,
-      editing: s,
-      store: [g, u, ...M],
-      source: M.join("/"),
-      children: /* @__PURE__ */ r(J, { children: /* @__PURE__ */ r(
-        B,
+      style: { height: `${O}px` },
+      params: P,
+      app: x,
+      group: y,
+      csv: m,
+      editing: c,
+      waitForFilters: D === "true",
+      store: [x, g, ...R],
+      source: R.join("/"),
+      children: /* @__PURE__ */ o($, { children: /* @__PURE__ */ o(
+        L,
         {
-          editing: s,
+          editing: c,
           locale: I,
-          intl: l,
-          app: g,
-          format: A,
-          measure: i(D)[0] || null,
-          label: c,
-          bigNumberFontSize: f,
-          textColor: o,
-          labelFontSize: m,
-          percentFontSize: N,
-          showPercentageChange: S == "true" || S == !0
+          intl: u,
+          app: x,
+          format: E,
+          dimension1: r,
+          measure: l(C)[0] || null,
+          label: p,
+          bigNumberFontSize: i,
+          textColor: e,
+          labelFontSize: a,
+          percentFontSize: d,
+          showPercentageChange: S == "true" || S == !0,
+          noDataText: w
         }
       ) })
     }
   ) }) });
-}, B = (d) => {
-  const { editing: s, app: u, measure: l, data: n, format: y, label: v, textColor: x, bigNumberFontSize: z, percentFontSize: p, labelFontSize: g, showPercentageChange: D, intl: h } = d;
-  let e = [], F, o;
-  if (u == "csv") {
-    const { data: C, meta: { fields: i } } = n;
-    F = i[0], o = i[1], e = n.data.map((t) => ({
-      value: t[F],
-      [o]: t[o]
+}, L = (f) => {
+  const {
+    editing: c,
+    app: g,
+    measure: u,
+    dimension1: h,
+    data: m,
+    format: b,
+    label: T,
+    textColor: v,
+    bigNumberFontSize: F,
+    percentFontSize: x,
+    labelFontSize: C,
+    showPercentageChange: z,
+    intl: y,
+    noDataText: N
+  } = f;
+  let e = [], i, a;
+  if (g == "csv") {
+    const { data: s, meta: { fields: l } } = m;
+    i = l[0], a = l[1], e = m.data.map((t) => ({
+      value: t[i],
+      [a]: t[a],
+      [i]: t[i]
     }));
   } else
-    e = !n.children || n.children.length == 0 ? [] : n.children, o = l;
-  if (e.length == 0)
-    return null;
-  e = e.sort((C, i) => $(!1, h.locale, C.value, i.value));
-  let f = e[e.length - 1][o], m;
-  e.length > 1 && (m = e[e.length - 2][o]);
-  const N = h.formatNumber(y.style === "percent" ? f / 100 : f, { ...y });
-  let c, b;
-  m && (c = (f - m) / m, b = h.formatNumber(c, { style: "percent", minimumFractionDigits: 2, maximumFractionDigits: 2 }));
-  const S = {
-    color: decodeURIComponent(x),
-    fontSize: z + "px"
+    e = !m.children || m.children.length == 0 ? [] : m.children, a = u, i = h, e = e.map((s) => ({
+      value: s.value,
+      [a]: s[a],
+      [i]: s.value
+    }));
+  let d = null, p = null, r, S, D;
+  e.length > 0 && (e = e.sort((s, l) => B(!1, y.locale, s.value, l.value)), d = e[e.length - 1][a], e.length > 1 && (p = e[e.length - 2][a]), D = y.formatNumber(b.style === "percent" ? d / 100 : d, { ...b }), p && (r = (d - p) / p, S = y.formatNumber(r, { style: "percent", minimumFractionDigits: 2, maximumFractionDigits: 2 }))), d == null && (D = N);
+  const w = {
+    color: decodeURIComponent(v),
+    fontSize: F + "px"
   }, I = {
-    color: decodeURIComponent(x),
-    fontSize: p + "px"
+    color: decodeURIComponent(v),
+    fontSize: x + "px"
   }, j = {
-    color: decodeURIComponent(x),
-    fontSize: g + "px"
+    color: decodeURIComponent(v),
+    fontSize: C + "px"
   };
-  return /* @__PURE__ */ U("div", { className: "trend", children: [
-    /* @__PURE__ */ r("div", { className: "label", style: j, children: v }),
-    /* @__PURE__ */ U("div", { className: "number-and-icon", children: [
-      /* @__PURE__ */ r("span", { className: "number", style: S, children: N }),
-      c && /* @__PURE__ */ r("img", { src: c > 0 ? "/trend-up.svg" : "/trend-down.svg", alt: "Arrow", className: "icon" })
+  return /* @__PURE__ */ A("div", { className: "trend", children: [
+    /* @__PURE__ */ o("div", { className: "label", style: j, children: G(T, e[e.length - 1]) }),
+    /* @__PURE__ */ A("div", { className: "number-and-icon", children: [
+      /* @__PURE__ */ o("span", { className: "number", style: w, children: D }),
+      r && /* @__PURE__ */ o("img", { src: r > 0 ? "/trend-up.svg" : "/trend-down.svg", alt: "Arrow", className: "icon" })
     ] }),
-    D && c && /* @__PURE__ */ r("div", { className: "percentage", style: I, children: b })
+    z && r && /* @__PURE__ */ o("div", { className: "percentage", style: I, children: S })
   ] });
-}, G = (d, s) => {
-  const { "data-app": u, "data-group": l } = s, n = d.getIn(["data", "measures", u, l]);
-  return n ? {
-    injectedMeasures: n
+}, Q = (f, c) => {
+  const { "data-app": g, "data-group": u } = c, h = f.getIn(["data", "measures", g, u]);
+  return h ? {
+    injectedMeasures: h
   } : {};
-}, K = {}, ne = T(G, K)(k);
+}, W = {}, se = k(Q, W)(K);
 export {
-  ne as default
+  se as default
 };