@devgateway/dvz-ui-react 1.6.1 → 1.6.2

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

@@ -1,88 +1,89 @@
-import { jsx as a, jsxs as p, Fragment as L } from "react/jsx-runtime";
-import { useState as l, useEffect as $ } from "react";
-import { injectIntl as me } from "react-intl";
-import { ResponsivePie as pe } from "@nivo/pie";
-import ue, { formatContent as he } from "./Tooltip.js";
+import { jsx as r, jsxs as p, Fragment as L } from "react/jsx-runtime";
+import { useState as l, useEffect as M } from "react";
+import { injectIntl as pe } from "react-intl";
+import { ResponsivePie as ue } from "@nivo/pie";
+import fe, { formatContent as ge } from "./Tooltip.js";
 import "@nivo/colors";
 import "d3";
-import { v4 as fe } from "uuid";
-import ge from "../../layout/FlexWrapDetector.js";
-const be = ({
-  legends: Le,
+import { v4 as he } from "uuid";
+import be from "../../layout/FlexWrapDetector.js";
+import Le from "../../utils/deviceType.js";
+const $ = Le() === "mobile", xe = ({
+  legends: ke,
   marginLeft: j,
   marginTop: x,
   marginRight: w,
   marginBottom: k,
   options: u,
-  intl: h,
-  format: f,
-  colors: xe,
-  groupMode: ke,
+  intl: f,
+  format: g,
+  colors: ve,
+  groupMode: Ce,
   tooltipEnabled: B,
   height: I,
   showLegends: v,
-  legendPosition: r,
-  tickRotation: ve,
-  tickColor: Ce,
-  tooltip: i,
-  startAngle: M,
-  endAngle: z,
+  legendPosition: a,
+  tickRotation: ye,
+  tickColor: Ne,
+  tooltip: s,
+  startAngle: z,
+  endAngle: O,
   legendLabel: C,
   legendCheckBack: y,
-  legendLabelBack: O,
-  legendLabelColor: V,
-  centerLabel: R,
-  showArcLabels: H,
-  showArcLinkLabels: E,
-  slicePadding: X,
+  legendLabelBack: V,
+  legendLabelColor: R,
+  centerLabel: H,
+  showArcLabels: E,
+  showArcLinkLabels: X,
+  slicePadding: Y,
   colorGenerator: N,
-  centerLabelFontWeight: Y,
-  centerLabelFontSize: q,
-  centerLabelXOffset: J,
-  centerLabelYOffset: K,
-  tooltipEnableMarkdown: Q,
-  reverseLegend: U,
-  showPercentage: Z
+  centerLabelFontWeight: q,
+  centerLabelFontSize: J,
+  centerLabelXOffset: K,
+  centerLabelYOffset: Q,
+  tooltipEnableMarkdown: U,
+  reverseLegend: Z,
+  showPercentage: _
 }) => {
-  const [c, _] = l([]), [G, P] = l(i), [o, ee] = l(u), [S, te] = l(50), [A, ae] = l(x), [ye, T] = l(0), [W, re] = l(k), d = o.data.sort((e, t) => e.position && t.position ? e.position - t.position : 0).map((e, t) => ({
+  const [c, G] = l([]), [P, ee] = l(s), [o, te] = l(u), [S, re] = l(50), [T, ae] = l(x), [Se, A] = l(0), [D, ne] = l(k), d = o.data.sort((e, t) => e.position && t.position ? e.position - t.position : 0).map((e, t) => ({
     color: N.getColor(e.id, e),
     id: e.id,
     label: e.label
   }));
-  $(() => {
-    P(i), ee({
+  M(() => {
+    ee(s), te({
       ...u,
-      id: fe()
+      id: he()
     });
-  }, [i, u]), $(() => {
+  }, [s, u]), M(() => {
     (() => {
       const n = 5 * Math.max(d.length - 5, 0);
-      te(n);
+      re(n);
     })();
   }, [d]);
-  const ne = {
+  const oe = {
     bottom: `-${S}px`
-  }, oe = {
+  }, le = {
     bottom: `-${S}px`,
     gap: "0px"
-  }, le = (e) => {
+  }, ie = (e) => {
     const t = c.slice();
     if (t.indexOf(e) > -1) {
       const n = t.indexOf(e);
       t.splice(n, 1);
     } else
       t.push(e);
-    _(t);
+    G(t);
   }, se = (e) => c ? e.filter((t) => c.indexOf(t.id) === -1) : e;
   if (!o || !o.data)
     return null;
-  const ie = {
-    top: A,
+  const ce = {
+    top: T,
     right: w,
-    bottom: W,
+    bottom: D,
     left: j
-  }, D = () => /* @__PURE__ */ a(L, { children: v && C && /* @__PURE__ */ a("div", { className: "legend item", children: /* @__PURE__ */ a("label", { className: "legend-title", children: C }) }) }), F = () => (U && d.reverse(), /* @__PURE__ */ a(L, { children: v && d.map((e) => /* @__PURE__ */ p("div", { className: "legend item", onClick: () => le(e.id), children: [
-    /* @__PURE__ */ a(
+  }, W = () => /* @__PURE__ */ r(L, { children: v && C && /* @__PURE__ */ r("div", { className: "legend item", children: /* @__PURE__ */ r("label", { className: "legend-title", children: C }) }) }), F = () => (Z && d.reverse(), /* @__PURE__ */ r(L, { children: v && d.map((e) => /* @__PURE__ */ p("div", { className: "legend item", onClick: () => ie(e.id), children: [
+    /* @__PURE__ */ r(
       "input",
       {
         className: "ignore",
@@ -90,7 +91,7 @@ const be = ({
         checked: c.length == 0 || !c.includes(e.id)
       }
     ),
-    /* @__PURE__ */ a(
+    /* @__PURE__ */ r(
       "span",
       {
         className: y ? "checkmark-with-bg" : "checkmark",
@@ -99,80 +100,80 @@ const be = ({
         }
       }
     ),
-    /* @__PURE__ */ a(
+    /* @__PURE__ */ r(
       "label",
       {
         style: {
-          backgroundColor: O == !0 ? e.color : "transparent",
-          color: V
+          backgroundColor: V == !0 ? e.color : "transparent",
+          color: R
         },
         children: e.label
       }
     )
-  ] })) })), ce = (e) => {
-    const { centerX: t, centerY: n } = e, s = R.split(/[\r\n]/g);
+  ] })) })), de = (e) => {
+    const { centerX: t, centerY: n } = e, i = H.split(/[\r\n]/g);
     let m = 0;
     return e.dataWithArc && (m = e.dataWithArc.reduce(
-      function(g, b) {
-        return g + b.value;
+      function(h, b) {
+        return h + b.value;
       },
       0
-    )), /* @__PURE__ */ a(
+    )), /* @__PURE__ */ r(
       "text",
       {
         x: t,
         y: n,
         textAnchor: "start",
         dominantBaseline: "central",
-        children: s.map((g, b) => /* @__PURE__ */ a(
+        children: i.map((h, b) => /* @__PURE__ */ r(
           "tspan",
           {
-            x: t + parseInt(J),
-            y: n + parseInt(K) + b * 20,
+            x: t + parseInt(K),
+            y: n + parseInt(Q) + b * 20,
             style: {
-              fontSize: q + "px",
-              fontWeight: Y,
+              fontSize: J + "px",
+              fontWeight: q,
               fill: "#000"
             },
-            children: he(g, { totalValue: m }, h)
+            children: ge(h, { totalValue: m }, f)
           }
         ))
       }
     );
-  }, de = (e, t) => {
+  }, me = (e, t) => {
     if (t) {
-      const n = e.reduce((s, m) => s + m.value, 0);
-      return e.map((s) => ({
-        ...s,
-        value: s.value / n * 100
+      const n = e.reduce((i, m) => i + m.value, 0);
+      return e.map((i) => ({
+        ...i,
+        value: i.value / n * 100
       }));
     }
     return e;
   };
-  return /* @__PURE__ */ a("div", { style: { height: I }, className: "pie-chart", children: o && o.data && o.data.length > 0 && /* @__PURE__ */ p(L, { children: [
-    /* @__PURE__ */ a(
-      pe,
+  return /* @__PURE__ */ r("div", { style: { height: I }, className: "pie-chart", children: o && o.data && o.data.length > 0 && /* @__PURE__ */ p(L, { children: [
+    /* @__PURE__ */ r(
+      ue,
       {
-        data: se(de(o.data, Z)),
-        margin: ie,
-        startAngle: M,
-        endAngle: z,
+        data: se(me(o.data, _)),
+        margin: ce,
+        startAngle: z,
+        endAngle: O,
         sortByValue: !0,
         innerRadius: 0.7,
-        padAngle: X,
+        padAngle: Y,
         cornerRadius: 3,
         colors: (e) => N.getColor(e.id, e.data),
         borderWidth: 1,
         borderColor: { from: "color", modifiers: [["brighter", "2"]] },
-        enableArcLabels: H,
-        enableArcLinkLabels: E,
+        enableArcLabels: E,
+        enableArcLinkLabels: X,
         arcLabelsTextColor: "#333333",
         arcLinkLabelsSkipAngle: 5,
         arcLabelsSkipAngle: 15,
         sliceLabelsSkipAngle: 20,
-        arcLabel: (e) => h.formatNumber(
-          f.style === "percent" ? e.value / 100 : e.value,
-          f
+        arcLabel: (e) => f.formatNumber(
+          g.style === "percent" ? e.value / 100 : e.value,
+          g
         ),
         radialLabelsSkipAngle: 20,
         radialLabelsTextColor: "#333333",
@@ -187,7 +188,7 @@ const be = ({
           "arcs",
           "arcLabels",
           "legends",
-          ce
+          de
         ],
         animate: !0,
         motionStiffness: 90,
@@ -199,32 +200,32 @@ const be = ({
             const t = e.datum.arc.angleDeg / 360 * 100;
             e.datum.data.variables.valuePercent = t, e.datum.data.variables.category = e.datum.id;
           }
-          return B && i && i.trim().length > 0 ? /* @__PURE__ */ a(
-            ue,
+          return B && s && s.trim().length > 0 ? /* @__PURE__ */ r(
+            fe,
             {
-              intl: h,
-              format: f,
+              intl: f,
+              format: g,
               d: e,
-              tooltip: G,
-              tooltipEnableMarkdown: Q
+              tooltip: P,
+              tooltipEnableMarkdown: U
             }
           ) : null;
         }
       },
       o.id
     ),
-    (r === "top" || r === "bottom") && /* @__PURE__ */ a(
+    (a === "top" || a === "bottom") && /* @__PURE__ */ r(
       "div",
       {
-        className: `legends container has-standard-12-font-size ${r}`,
-        style: r === "top" ? { marginTop: `${A}px` } : r === "bottom" ? { marginBottom: `${W}px` } : {},
+        className: `legends container has-standard-12-font-size ${a}`,
+        style: a === "top" ? { marginTop: $ && `${T}px` } : a === "bottom" ? { marginBottom: `${D}px` } : {},
         children: /* @__PURE__ */ p("div", { className: "legend-sections", children: [
-          /* @__PURE__ */ a("div", { className: "title-section", children: D() }),
-          /* @__PURE__ */ a(
-            ge,
+          /* @__PURE__ */ r("div", { className: "title-section", children: W() }),
+          /* @__PURE__ */ r(
+            be,
             {
               onWrapChange: (e) => {
-                r === "top" ? (ae(x + e / 2 * 40), T(e)) : (re(k + e / 2 * 25), T(e));
+                a === "top" && $ ? (ae(x + e / 2 * 40), A(e)) : (ne(k + e / 2 * 25), A(e));
               },
               className: "legends container has-standard-12-font-size items-section",
               children: F()
@@ -233,19 +234,19 @@ const be = ({
         ] })
       }
     ),
-    (r === "right" || r === "left") && /* @__PURE__ */ p(
+    (a === "right" || a === "left") && /* @__PURE__ */ p(
       "div",
       {
-        className: `legends container has-standard-12-font-size  ${r}`,
-        style: r === "right" ? ne : oe,
+        className: `legends container has-standard-12-font-size  ${a}`,
+        style: a === "right" ? oe : le,
         children: [
-          D(),
+          W(),
           F()
         ]
       }
     )
   ] }) });
-}, we = me(be);
+}, Ie = pe(xe);
 export {
-  we as default
+  Ie as default
 };

package/dist/esm/layout/Header.js

@@ -180,7 +180,7 @@ const W = (r, s) => {
             {
               className: "brand logo small",
               size: "small",
-              src: "/TCDI-Icon-small_02.png"
+              src: "/wp-media/TCDI-Icon-small_02.png"
             }
           )
         ] }) }),