@devgateway/dvz-ui-react 1.6.20 → 1.7.1

package/dist/esm/embeddable/big-filter/BigNumberItem.js

@@ -0,0 +1,107 @@
+import { jsxs as $, jsx as a } from "react/jsx-runtime";
+import "react";
+import { Grid as j } from "semantic-ui-react";
+function E(t) {
+  if (typeof t == "boolean") return t;
+  if (typeof t != "string") return !!t;
+  switch (t.trim().toLowerCase()) {
+    case "true":
+    case "yes":
+    case "1":
+    case "on":
+      return !0;
+    case "false":
+    case "no":
+    case "0":
+    case "off":
+      return !1;
+    default:
+      return !1;
+  }
+}
+const q = (t) => {
+  const {
+    isDisabled: n,
+    // 1. ADDED: New prop to check if we are locked
+    child: r,
+    selectedKey: u,
+    appliedFilters: p,
+    dimension1: I,
+    dimension2: d,
+    app: v,
+    group: A,
+    parent: O,
+    blockName: G,
+    hasParentFilters: K,
+    onSetFilter: P,
+    onUnSetFilter: R,
+    intl: g,
+    numberFontSize: b,
+    labelFontSize: f,
+    backgroundColor: h,
+    numberColor: y,
+    labelColor: x,
+    unselectedBackgroundColor: C,
+    unselectedNumberColor: F,
+    unselectedLabelColor: S,
+    formatObject: i,
+    decode: o,
+    getLabel: m,
+    idx: N
+  } = t, l = p.indexOf(r.value) > -1, k = r[u], w = () => {
+    n || t.handleClick && t.handleClick();
+  }, D = (e) => ({
+    cursor: n ? "not-allowed" : "pointer",
+    // 3. UPDATED: Change cursor
+    color: o(e ? y : F),
+    fontSize: b + "px",
+    textAlign: "center",
+    paddingTop: "3%",
+    paddingLeft: "1%",
+    paddingRight: "1%",
+    paddingBottom: "0px",
+    margin: "0px"
+  }), z = (e) => ({
+    cursor: n ? "not-allowed" : "pointer",
+    // 3. UPDATED: Change cursor
+    color: o(e ? x : S),
+    fontSize: f + "px",
+    textAlign: "center",
+    padding: "0px",
+    margin: "0px"
+  }), B = (e) => ({
+    border: "1px solid #EEE",
+    backgroundColor: o(e ? h : C),
+    opacity: n ? 0.4 : 1,
+    // 4. ADDED: Dim the card to 40% if disabled
+    cursor: n ? "not-allowed" : "pointer"
+    // 4. ADDED: Change cursor on the whole cell
+  }), L = (e) => {
+    const s = {
+      style: i.style === "compacted" ? "decimal" : i.style,
+      notation: i.style === "compacted" ? "compact" : "standard",
+      currency: i.currency,
+      minimumFractionDigits: parseInt(i.minimumFractionDigits),
+      maximumFractionDigits: parseInt(i.maximumFractionDigits)
+    };
+    return g.formatNumber(e, { ...s });
+  };
+  let c = !1;
+  return d !== "none" && (c = r && r.children ? r.children.map((e) => E(e.value)).reduce((e, s) => e && s, !0) : !1), /* @__PURE__ */ $(
+    j.Column,
+    {
+      className: `big filter item ${l ? "selected" : "unselected"} ${c ? `highlighted ${d}` : ""} ${n ? "disabled" : ""}`,
+      onClick: w,
+      style: B(l),
+      children: [
+        /* @__PURE__ */ a("p", { style: D(l), className: "big-number", children: L(k) }),
+        c && /* @__PURE__ */ a("p", { children: /* @__PURE__ */ a("div", { className: "highlighted-pill", children: "Zoonotic" }) }),
+        /* @__PURE__ */ a("p", { style: z(l), className: "big-number-label", children: m ? m(r.value) : r.label || r.value })
+      ]
+    },
+    N
+  );
+};
+export {
+  q as BigNumberItem
+};

package/dist/esm/embeddable/big-filter/DataProvider.js

@@ -0,0 +1,53 @@
+import { jsx as f } from "react/jsx-runtime";
+import u from "react";
+import { connect as h } from "react-redux";
+import { injectIntl as D } from "react-intl";
+import "semantic-ui-react";
+import { DataContext as S } from "../data/DataContext.js";
+import { getData as I, setData as J } from "../reducers/data.js";
+class v extends u.Component {
+  constructor(t) {
+    super(t), this.debounces = [];
+  }
+  componentDidMount() {
+    const { app: t, useAncestor: e, parent: s, source: r, store: a, params: i, csv: d, group: n, editing: l, waitForFilters: p = !1 } = this.props;
+    this.props.onLoadData({ app: t, source: r, store: a, params: i, group: n });
+  }
+  componentDidUpdate(t, e, s) {
+    const { app: r, filters: a, useAncestor: i, parent: d, source: n, store: l, params: p, csv: c, group: g, editing: x } = this.props;
+    (a != t.filters || JSON.stringify(p) != JSON.stringify(t.params) || r != t.app || JSON.stringify(t.source) != JSON.stringify(n) || c != t.csv) && this.props.onLoadData({ app: r, source: n, store: l, params: p, group: g });
+  }
+  componentWillUnmount() {
+  }
+  render() {
+    const { data: t, style: e, loading: s, time: r, error: a, editing: i } = this.props;
+    return /* @__PURE__ */ f(S.Provider, { value: t, children: this.props.children });
+  }
+}
+const m = (o, t, e) => {
+  const s = [t], r = o.getIn(["data", "filters-settings", e]) ? o.getIn(["data", "filters-settings", e]).toJS() : null;
+  if (r) {
+    const a = r[t];
+    a && a.parent && s.push(...m(o, a.parent, e));
+  }
+  return s;
+}, y = (o, t) => {
+  const { store: e, readGroup: s, app: r, blockName: a, params: i, parent: d } = t;
+  let n = { ...i };
+  return d && m(o, d, r).forEach((p) => {
+    const c = o.getIn(["data", "filters", r, p]);
+    c && c.size > 0 && (n = { ...n, ...c.toJS() });
+  }), {
+    params: n,
+    data: o.getIn(["data", ...e, "data"]),
+    filters: o.getIn(["data", "filters", r, s]),
+    error: o.getIn(["data", ...e, "error"]),
+    loading: o.getIn(["data", ...e, "loading"])
+  };
+}, N = {
+  onSetData: J,
+  onLoadData: I
+}, w = h(y, N)(D(v));
+export {
+  w as default
+};

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

@@ -0,0 +1,130 @@
+import { jsx as a, jsxs as F } from "react/jsx-runtime";
+import { useRef as Z } from "react";
+import { Container as K } from "semantic-ui-react";
+import { connect as Q } from "react-redux";
+import W from "../data/DataConsumer.js";
+import { unsetFilter as X, setFilter as Y } from "../reducers/data.js";
+import { parse as k } from "../utils/parseUtils.js";
+import _ from "./DataProvider.js";
+import ee from "./BigNumberGroup.js";
+const te = (r) => {
+  const {
+    editing: d = !1,
+    unique: o,
+    intl: u,
+    "data-csv": m = "",
+    "data-dimension1": e = "none",
+    "data-dimension2": l = "none",
+    "data-dvz-proxy-dataset-id": c,
+    "data-no-data-message": b = "No data matches your selection",
+    "data-view-mode": v = "info",
+    "data-height": n,
+    "data-app": t,
+    "data-measures": f = "{}",
+    "data-group": S,
+    "data-parent": i,
+    "data-block-name": s,
+    "data-filters": P = "[]",
+    "data-number-font-size": w = 20,
+    "data-label-font-size": z = 20,
+    "data-unselected-number-color": I = "#000000",
+    "data-unselected-label-color": A = "#000000",
+    "data-unselected-background-color": B = "#fdfdfdff",
+    "data-number-color": N = "#000000",
+    "data-label-color": y = "#000000",
+    "data-background-color": D = "#ffffffff",
+    "data-label": j = "",
+    "data-wait-for-filters": G = "false",
+    "data-n-columns": M = 4,
+    "data-sort": J = "alpha",
+    "data-order": E = "asc",
+    "data-show-zero-values": U = "false",
+    hasParentFilters: $,
+    effectiveFilter: q,
+    appliedFilters: H,
+    parentAppliedFilters: L,
+    onSetFilter: O,
+    onUnSetFilter: R
+  } = r, T = Z(null), V = d ? n - 80 : n - 40, x = { dvzProxyDatasetId: c }, h = k(P) || {};
+  h && h.forEach && h.forEach((p) => {
+    p.value != null && p.value.filter((C) => C != null && C.toString().trim() != "").length > 0 && (x[p.param] = p.value);
+  });
+  const g = [];
+  return e != "none" && g.push(e), l != "none" && g.push(l), /* @__PURE__ */ a("div", { ref: T, children: /* @__PURE__ */ F(K, { fluid: !0, style: { padding: "0px", margin: "0px", height: `${n}px` }, children: [
+    (!t || t === "csv") && /* @__PURE__ */ F("p", { children: [
+      /* @__PURE__ */ a("h2", { children: "Big Filter:" }),
+      /* @__PURE__ */ a("h4", { children: "Please select an API! " })
+    ] }),
+    t !== "csv" && e == "none" && /* @__PURE__ */ F("p", { children: [
+      /* @__PURE__ */ a("h2", { children: "Big Filter:" }),
+      /* @__PURE__ */ a("h4", { children: "Please select dimension! " })
+    ] }),
+    t && e != "none" && /* @__PURE__ */ a(
+      _,
+      {
+        style: { height: `${V}px` },
+        blockName: s,
+        params: x,
+        app: t,
+        useAncestor: !0,
+        parent: i,
+        editing: d,
+        waitForFilters: G === "true",
+        store: [t, o],
+        source: g.join("/"),
+        children: /* @__PURE__ */ a(W, { noDataMessage: /* @__PURE__ */ a("h1", { children: "No data" }), children: /* @__PURE__ */ a(
+          ee,
+          {
+            nColumns: M,
+            parent: i,
+            sort: J,
+            order: E,
+            showZeroValues: U,
+            onSetFilter: O,
+            onUnSetFilter: R,
+            appliedFilters: H,
+            height: n,
+            intl: u,
+            app: t,
+            group: S,
+            blockName: s,
+            measures: k(f),
+            label: j,
+            numberFontSize: w,
+            labelFontSize: z,
+            numberColor: N,
+            labelColor: y,
+            backgroundColor: D,
+            unselectedNumberColor: I,
+            unselectedLabelColor: A,
+            unselectedBackgroundColor: B,
+            hasParentFilters: $,
+            effectiveFilter: q,
+            parentAppliedFilters: L,
+            dimension1: e,
+            dimension2: l
+          }
+        ) })
+      }
+    )
+  ] }) });
+}, ae = (r, d) => {
+  const { "data-app": o, "data-group": u, "data-block-name": m, "data-parent": e, "data-dimension1": l } = d, c = u, b = e || m + Math.random(0, 1), v = m, n = r.getIn(["data", "filters", o, v]), t = e != "" && e != null, f = r.getIn(["data", "filters", o, c]) ? r.getIn(["data", "filters", o, c]).toJS() : {};
+  let i = (t ? r.getIn(["data", "filters", o, b]) : null) ? Object.values(r.getIn(["data", "filters", o, e]).toJS())[0] : [], s = n ? n.toJS()[l] : [];
+  return {
+    hasParentFilters: t,
+    //util flag
+    effectiveFilter: f,
+    //all filter toghether
+    parentAppliedFilters: i || [],
+    //parent applied filter
+    appliedFilters: s || []
+    //self applied filters
+  };
+}, re = {
+  onSetFilter: Y,
+  onUnSetFilter: X
+}, me = Q(ae, re)(te);
+export {
+  me as default
+};

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

@@ -1,136 +1,188 @@
-import { jsx as o, jsxs as E } from "react/jsx-runtime";
-import { useRef as V, useState as T, useEffect as O } 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 a, jsxs as x } from "react/jsx-runtime";
+import { useRef as H, useState as O, useEffect as J } from "react";
+import { Container as K } from "semantic-ui-react";
+import $ from "../data/DataProvider.js";
+import Q from "../data/DataConsumer.js";
 import "@devgateway/wp-react-lib";
-import { connect as $ } from "react-redux";
-import { useSpring as k, animated as B } from "@react-spring/web";
-const G = (l) => {
+import { connect as W } from "react-redux";
+import { useSpring as X, animated as Y } from "@react-spring/web";
+const Z = (r) => {
   const {
-    editing: n = !1,
-    unique: c,
+    editing: e = !1,
+    unique: n,
     intl: t,
-    childContent: a,
-    "data-csv": f = "",
-    "data-dvz-proxy-dataset-id": g,
-    "data-no-data-message": P = "No data matches your selection",
-    "data-view-mode": y = "info",
-    "data-height": m,
-    "data-app": d,
-    "data-measures": F = "{}",
-    "data-format": b = "{}",
-    "data-group": s,
-    "data-filters": u = "[]",
-    "data-number-font-size": r = 20,
-    "data-label-font-size": v = 20,
-    "data-number-color": D = "#000000",
-    "data-label-color": S = "#000000",
-    "data-label": C = "",
-    "data-wait-for-filters": z = "false",
-    "data-no-data-text": I = "-"
-  } = l, h = t.locale, x = V(null), p = (e) => n ? e : decodeURIComponent(e), N = (e) => {
+    childContent: u,
+    "data-csv": D = "",
+    "data-dimension1": p = "none",
+    "data-dvz-proxy-dataset-id": v,
+    "data-no-data-message": F = "No data matches your selection",
+    "data-view-mode": z = "info",
+    "data-height": b,
+    "data-app": o,
+    "data-measures": l = "{}",
+    "data-format": S = "{}",
+    "data-group": f,
+    "data-filters": g = "[]",
+    "data-number-font-size": h = 20,
+    "data-label-font-size": i = 20,
+    "data-number-color": c = "#000000",
+    "data-label-color": d = "#000000",
+    "data-label": y = "",
+    "data-group-label": P = "",
+    "data-group-label-color": R = "",
+    "data-group-label-font-size": T = "",
+    "data-wait-for-filters": U = "false",
+    "data-no-data-text": A = "-"
+  } = r, E = t.locale, V = H(null), q = (s) => e ? s : decodeURIComponent(s), N = (s) => {
     try {
-      return JSON.parse(p(e));
+      return JSON.parse(q(s));
     } catch {
-      console.error("error parsing value:" + e);
+      console.error("error parsing value:" + s);
     }
     return null;
-  }, i = N(b), U = i ? {
-    style: i.style === "compacted" ? "decimal" : i.style,
-    notation: i.style === "compacted" ? "compact" : "standard",
-    currency: i.currency,
-    minimumFractionDigits: parseInt(i.minimumFractionDigits),
-    maximumFractionDigits: parseInt(i.maximumFractionDigits)
+  }, C = N(l), m = C && C[o] ? C[o].format : null;
+  console.log(m);
+  const B = m ? {
+    style: m.style === "compacted" ? "decimal" : m.style,
+    notation: m.style === "compacted" ? "compact" : "standard",
+    currency: m.currency,
+    minimumFractionDigits: parseInt(m.minimumFractionDigits),
+    maximumFractionDigits: parseInt(m.maximumFractionDigits)
   } : {
     notation: "standard",
     currency: "USD",
     minimumFractionDigits: 2,
     maximumFractionDigits: 2
-  }, [W, X] = T(y), A = n ? m - 80 : m - 40, j = {}, w = N(u) || {};
-  w && w.forEach && w.forEach((e) => {
-    e.value != null && e.value.filter((M) => M != null && M.toString().trim() != "").length > 0 && (j[e.param] = e.value);
-  }), g && (j.dvzProxyDatasetId = g);
-  const R = [];
-  return /* @__PURE__ */ o("div", { ref: x, children: /* @__PURE__ */ o(q, { className: "chart container big-number-container", style: { height: m + "px" }, fluid: !0, children: /* @__PURE__ */ o(
-    H,
+  }, [te, ae] = O(z), G = e ? b - 80 : b - 40, L = {}, j = N(g) || {};
+  j && j.forEach && j.forEach((s) => {
+    s.value != null && s.value.filter((M) => M != null && M.toString().trim() != "").length > 0 && (L[s.param] = s.value);
+  }), v && (L.dvzProxyDatasetId = v);
+  const w = [];
+  return p != "none" && w.push(p), /* @__PURE__ */ a("div", { ref: V, children: /* @__PURE__ */ a(K, { className: "chart container big-number-container", style: { height: b + "px" }, fluid: !0, children: o && o != "none" && /* @__PURE__ */ a(
+    $,
     {
-      style: { height: `${A}px` },
-      params: j,
-      app: d,
-      group: s,
-      csv: f,
-      editing: n,
-      waitForFilters: z === "true",
-      store: [d, c, ...R],
-      source: R.join("/"),
-      children: /* @__PURE__ */ o(J, { children: /* @__PURE__ */ o(
-        K,
+      style: { height: `${G}px` },
+      params: L,
+      app: o,
+      group: f,
+      source: w.join("/"),
+      csv: D,
+      editing: e,
+      waitForFilters: U === "true",
+      store: [o, n, ...w],
+      children: /* @__PURE__ */ a(Q, { children: /* @__PURE__ */ a(
+        _,
         {
-          locale: h,
+          dimension: p,
+          locale: E,
           intl: t,
-          app: d,
-          format: U,
-          measure: N(F)[0] || null,
-          label: C,
-          numberFontSize: r,
-          numberColor: D,
-          labelFontSize: v,
-          labelColor: S,
-          noDataText: I
+          app: o,
+          format: B,
+          measures: N(l),
+          label: y,
+          numberFontSize: h,
+          numberColor: c,
+          labelFontSize: i,
+          labelColor: d,
+          noDataText: A,
+          groupLabel: P,
+          groupLabelColor: R,
+          groupLabelFontSize: T
         }
       ) })
     }
   ) }) });
-}, K = (l) => {
-  var h, x;
+}, _ = (r) => {
   const {
-    app: n,
-    measure: c,
+    app: e,
+    measures: n,
     data: t,
-    format: a,
-    label: f,
-    numberColor: g,
-    numberFontSize: P,
-    labelColor: y,
-    labelFontSize: m,
-    noDataText: d = "-",
-    intl: F
-  } = l;
-  let b = c, s = t;
-  n === "csv" && ((h = t == null ? void 0 : t.meta) != null && h.fields) && ((x = t == null ? void 0 : t.data) != null && x.length) && (b = t.meta.fields[0], s = t.data[0]);
-  const u = (s == null ? void 0 : s[b]) ?? null, r = u ? (a == null ? void 0 : a.style) === "percent" ? u / 100 : u : null, [v, D] = T(r);
-  O(() => {
-    r != null && D(r);
-  }, [r]);
-  const { number: S } = k({
+    format: u,
+    label: D,
+    numberColor: p,
+    numberFontSize: v,
+    dimension: F,
+    labelColor: z,
+    labelFontSize: b,
+    noDataText: o = "-",
+    intl: l,
+    groupLabel: S,
+    groupLabelColor: f,
+    groupLabelFontSize: g
+  } = r, h = n && n[e] ? Object.keys(n[e]).filter((i) => n[e][i].selected) : [];
+  if (F != "none") {
+    const i = t.metadata.types.filter((c) => c.dimension === F)[0];
+    return t.children.map((c) => {
+      const d = i.items.filter((y) => y.code == c.value)[0].value;
+      return /* @__PURE__ */ x("div", { className: "big-number-group", style: { display: "flex", flexDirection: "column" }, children: [
+        /* @__PURE__ */ x(
+          "span",
+          {
+            className: "big-number-title",
+            style: { color: f, fontSize: g + "px" },
+            children: [
+              /* @__PURE__ */ a("span", { className: "dimension-text", children: d }),
+              /* @__PURE__ */ x("span", { className: "group-text", children: [
+                " ",
+                S
+              ] })
+            ]
+          }
+        ),
+        /* @__PURE__ */ a("div", { className: "big-number-row", style: { display: "flex", flexDirection: "row" }, children: h.map((y) => /* @__PURE__ */ a("div", { className: "big-number-parent", children: /* @__PURE__ */ a(
+          I,
+          {
+            showDimensionLabel: !0,
+            metadata: i,
+            dataItem: c,
+            measureField: y,
+            measure: n[e][y],
+            ...r
+          }
+        ) })) })
+      ] });
+    });
+  } else
+    return /* @__PURE__ */ x("div", { children: [
+      /* @__PURE__ */ x("span", { style: { color: f, fontSize: g + "px" }, children: [
+        " ",
+        S
+      ] }),
+      h.map((i) => /* @__PURE__ */ a(I, { dataItem: t, measureField: i, measure: n[e][i], ...r }))
+    ] });
+}, I = ({ dataItem: r, format: e, measureField: n, measure: t, numberColor: u, numberFontSize: D, labelColor: p, labelFontSize: v, noDataText: F, label: z, intl: b }) => {
+  const o = (r == null ? void 0 : r[n]) ?? null, l = o ? (e == null ? void 0 : e.style) === "percent" ? o / 100 : o : null, [S, f] = O(l);
+  J(() => {
+    l != null && f(l);
+  }, [l]);
+  const { number: g } = X({
     from: { number: 0 },
-    to: { number: v ?? 0 },
+    to: { number: S ?? 0 },
     // reset: true,
     config: {
       mass: 1,
       tension: 120,
       friction: 30
     }
-  }), C = {
-    color: decodeURIComponent(g),
-    fontSize: P + "px",
+  }), h = {
+    color: decodeURIComponent(u),
+    fontSize: D + "px",
     textAlign: "center"
-  }, z = {
-    color: decodeURIComponent(y),
-    fontSize: m + "px",
+  }, i = {
+    color: decodeURIComponent(p),
+    fontSize: v + "px",
     textAlign: "center"
-  }, I = (p) => F.formatNumber(p, { ...a });
-  return /* @__PURE__ */ E("div", { children: [
-    /* @__PURE__ */ o("div", { style: C, className: "big-number", children: r === null ? d : /* @__PURE__ */ o(B.span, { children: S.to((p) => I(p)) }) }),
-    f && /* @__PURE__ */ o("div", { style: z, className: "big-number-label", children: f })
+  }, c = (d) => b.formatNumber(d, { ...e });
+  return /* @__PURE__ */ x("div", { className: "big-number", children: [
+    /* @__PURE__ */ a("div", { style: h, className: "big-number-value", children: l === null ? F : /* @__PURE__ */ a(Y.span, { children: g.to((d) => c(d)) }) }),
+    (t == null ? void 0 : t.customLabel) && /* @__PURE__ */ a("div", { style: i, className: "big-number-label", children: t.customLabel })
   ] });
-}, L = (l, n) => {
-  const { "data-app": c, "data-group": t } = n, a = l.getIn(["data", "measures", c, t]);
-  return a ? {
-    injectedMeasures: a
+}, k = (r, e) => {
+  const { "data-app": n, "data-group": t } = e, u = r.getIn(["data", "measures", n, t]);
+  return u ? {
+    injectedMeasures: u
   } : {};
-}, Q = {}, nt = $(L, Q)(G);
+}, ee = {}, de = W(k, ee)(Z);
 export {
-  nt as default
+  de as default
 };