@mx-cartographer/insights-ui 1.4.9-alpha.mega2 → 1.4.9-alpha.mega3

package/dist/index.es.js

@@ -1,4 +1,4 @@
-import { jsx as t, jsxs as s, Fragment as M } from "react/jsx-runtime";
+import { jsx as t, jsxs as s, Fragment as w } from "react/jsx-runtime";
 import * as e from "react";
 import A, { useRef as F, useLayoutEffect as re, useMemo as G, useCallback as ne, useState as U, useEffect as Q, forwardRef as I, memo as ae } from "react";
 import oe from "@mui/material/Dialog";
@@ -6,7 +6,7 @@ import { BottomSheetTransition as de, Icon as y, P as C, Text as b, InstitutionL
 import he from "react-confetti";
 import p from "@mui/material/Box";
 import H from "@mui/material/Card";
-import { useTheme as w, styled as J, ThemeProvider as me } from "@mui/material/styles";
+import { useTheme as M, styled as J, ThemeProvider as me } from "@mui/material/styles";
 import { useInView as pe } from "react-intersection-observer";
 import ue from "@mui/material/CardHeader";
 import $ from "@mui/material/CardContent";
@@ -162,7 +162,7 @@ const Re = ({
   percentageCompleteText: r,
   progressColorOverride: o
 }) => {
-  const a = w();
+  const a = M();
   return /* @__PURE__ */ s(
     p,
     {
@@ -212,7 +212,7 @@ const Re = ({
   gradientOverride: l,
   title: n
 }) => {
-  const r = w();
+  const r = M();
   return /* @__PURE__ */ s(
     p,
     {
@@ -258,7 +258,7 @@ const Re = ({
   height: d
 }) => {
   const [c, h] = A.useState(null), m = () => {
-    const f = document.getElementsByClassName("mx-mini-insight-card")[0].clientHeight, u = document.getElementsByClassName("mx-mini-insight-card-header")[0].clientHeight + document.getElementsByClassName("mx-mini-insight-card-content-body")[0].clientHeight, E = f - u - 24;
+    const u = document.getElementsByClassName("mx-mini-insight-card")[0].clientHeight, f = document.getElementsByClassName("mx-mini-insight-card-header")[0].clientHeight + document.getElementsByClassName("mx-mini-insight-card-content-body")[0].clientHeight, E = u - f - 24;
     h(Math.floor(E / 20));
   };
   return A.useEffect(() => (m(), window.addEventListener("resize", m), () => window.removeEventListener("resize", m)), []), /* @__PURE__ */ t(
@@ -333,7 +333,7 @@ const Re = ({
       width: "100%"
     },
     children: [
-      r && /* @__PURE__ */ s(M, { children: [
+      r && /* @__PURE__ */ s(w, { children: [
         /* @__PURE__ */ t(
           "svg",
           {
@@ -348,7 +348,7 @@ const Re = ({
         ),
         /* @__PURE__ */ t(b, { id: "chartLegendLabel", sx: { fontSize: 11, fontWeight: 400 }, variant: "XSmall", children: r })
       ] }),
-      i && n && /* @__PURE__ */ s(M, { children: [
+      i && n && /* @__PURE__ */ s(w, { children: [
         /* @__PURE__ */ t(
           x,
           {
@@ -386,12 +386,12 @@ const Re = ({
   style: r,
   ...o
 }) => {
-  const a = w(), d = F(null);
+  const a = M(), d = F(null);
   re(() => {
     const m = new ResizeObserver(() => {
       if (d.current) {
-        const u = d.current.getBoundingClientRect().width / 2;
-        d.current.querySelector("text").setAttribute("transform", `translate(${u}, -8)`);
+        const f = d.current.getBoundingClientRect().width / 2;
+        d.current.querySelector("text").setAttribute("transform", `translate(${f}, -8)`);
       }
     });
     return d.current && m.observe(d.current), () => {
@@ -423,7 +423,7 @@ const Re = ({
   selectedTabIndex: a,
   onBarClick: d
 }) => {
-  const c = w(), { containerRef: h, height: m, width: f } = Ce(), u = G(() => {
+  const c = M(), { containerRef: h, height: m, width: u } = Ce(), f = G(() => {
     const g = `${l}80`;
     return a === void 0 ? [...new Array(n.length - 1).fill(g), l] : n.map((q, Z) => Z === a ? l : g);
   }, [l, n, a]), E = ne(
@@ -455,7 +455,7 @@ const Re = ({
         height: m,
         margin: { left: 16, right: 16, top: 38, bottom: 30 },
         series: v.series,
-        width: f,
+        width: u,
         xAxis: v.xAxis,
         children: [
           i?.average && /* @__PURE__ */ t(
@@ -498,7 +498,7 @@ const Re = ({
                     Ke,
                     {
                       ...le,
-                      colorRange: u,
+                      colorRange: f,
                       data: n,
                       dataIndex: q.dataIndex,
                       style: Z
@@ -558,21 +558,21 @@ const Re = ({
   rightLowerText: c,
   rightUpperText: h
 }) => {
-  const m = a ? Y : N, f = F(null), { height: u, width: E } = te(f);
+  const m = a ? Y : N, u = F(null), { height: f, width: E } = te(u);
   return /* @__PURE__ */ s(
     p,
     {
       alignItems: "center",
       display: "flex",
       justifyContent: "center",
-      ref: f,
+      ref: u,
       sx: (v) => ({
         backgroundColor: v.palette.grey[200],
         padding: 16
       }),
       width: "100%",
       children: [
-        /* @__PURE__ */ t(ee, { height: u, shouldRun: l.shouldRun, width: E }),
+        /* @__PURE__ */ t(ee, { height: f, shouldRun: l.shouldRun, width: E }),
         /* @__PURE__ */ s(
           H,
           {
@@ -619,10 +619,10 @@ const Re = ({
   size: a,
   subHeaderString: d,
   textSX: c
-}) => /* @__PURE__ */ s(M, { children: [
+}) => /* @__PURE__ */ s(w, { children: [
   o && /* @__PURE__ */ t(y, { color: l, fill: n, name: o, size: a, sx: r }),
   /* @__PURE__ */ t(b, { bold: i, sx: c, children: d })
-] }), S = 48, Je = ({ account: i, headerString: l }) => /* @__PURE__ */ s(M, { children: [
+] }), S = 48, Je = ({ account: i, headerString: l }) => /* @__PURE__ */ s(w, { children: [
   /* @__PURE__ */ t(
     ye,
     {
@@ -648,7 +648,7 @@ const Re = ({
   ),
   /* @__PURE__ */ t(C, { bold: !0, sx: { width: "100%", textAlign: "center" }, children: l })
 ] }), Te = ({ leftLowerText: i, leftUpperText: l }) => {
-  const n = w();
+  const n = M();
   return /* @__PURE__ */ s(
     H,
     {
@@ -698,7 +698,7 @@ const Re = ({
   rightLowerText: l,
   rightUpperText: n
 }) => {
-  const r = w();
+  const r = M();
   return /* @__PURE__ */ t(
     H,
     {
@@ -777,14 +777,16 @@ const Re = ({
   400: "primary.dark",
   500: "primary.darker"
 }, K = ({ divProps: i, image: l, isMini: n = !1 }) => {
-  const r = F(null);
+  const r = M();
+  console.log(r);
+  const o = F(null);
   return Q(() => {
-    if (!r.current) return;
-    const o = r.current, a = o.querySelectorAll(".Overlay");
-    ["brand100", "brand200", "brand300", "brand400", "brand500"].forEach((c) => {
-      const h = o.querySelectorAll(`.${c}`), m = c.replace("brand", "");
-      B(h, R[m]);
-    }), B(a, R[300]);
+    if (!o.current) return;
+    const a = o.current, d = a.querySelectorAll(".Overlay");
+    ["brand100", "brand200", "brand300", "brand400", "brand500"].forEach((h) => {
+      const m = a.querySelectorAll(`.${h}`), u = h.replace("brand", "");
+      B(m, R[u]);
+    }), B(d, R[300]);
   }, [R]), /* @__PURE__ */ t(
     "div",
     {
@@ -793,7 +795,7 @@ const Re = ({
         width: "100%"
       },
       ...i,
-      children: /* @__PURE__ */ t(l, { ref: r })
+      children: /* @__PURE__ */ t(l, { ref: o })
     }
   );
 }, Qe = {
@@ -869,12 +871,12 @@ const Re = ({
   title: d
 }) => {
   const [c, h] = U(null);
-  return /* @__PURE__ */ s(M, { children: [
+  return /* @__PURE__ */ s(w, { children: [
     /* @__PURE__ */ t(
       Ae,
       {
-        action: o && i ? /* @__PURE__ */ t($e, { ariaLabel: i, onClick: (u) => {
-          h(u.currentTarget), n?.();
+        action: o && i ? /* @__PURE__ */ t($e, { ariaLabel: i, onClick: (f) => {
+          h(f.currentTarget), n?.();
         } }) : null,
         subheader: a ?? null,
         sx: { alignItems: "flex-start", p: 0, mb: 16 },
@@ -886,8 +888,8 @@ const Re = ({
       {
         anchorEl: c,
         handleClose: () => h(null),
-        handleMenuItem: (u, E) => {
-          h(null), r?.(u, E);
+        handleMenuItem: (f, E) => {
+          h(null), r?.(f, E);
         },
         menuItems: l
       }
@@ -960,9 +962,9 @@ const Re = ({
   isLoading: a = !1,
   errorText: d = "",
   feedback: c
-}) => /* @__PURE__ */ s(M, { children: [
+}) => /* @__PURE__ */ s(w, { children: [
   /* @__PURE__ */ t(t1, { ...r }),
-  o ? /* @__PURE__ */ t(_e, { erroredText: d }) : /* @__PURE__ */ s(M, { children: [
+  o ? /* @__PURE__ */ t(_e, { erroredText: d }) : /* @__PURE__ */ s(w, { children: [
     /* @__PURE__ */ t(r1, { ...n, hasFooterButton: !!i, children: a ? /* @__PURE__ */ t(l1, {}) : l }),
     i && /* @__PURE__ */ t(Ye, { button: i }),
     c
@@ -1057,8 +1059,8 @@ const Re = ({
   setRefs: a
 }) => /* @__PURE__ */ t(
   ({ elementTag: c, children: h, ...m }) => {
-    const f = c;
-    return A.createElement(f, m, h);
+    const u = c;
+    return A.createElement(u, m, h);
   },
   {
     "aria-hidden": i,
@@ -1117,7 +1119,7 @@ const Re = ({
   onClose: o,
   selectedRadio: a
 }) => {
-  const d = w(), { cancelText: c, submitText: h } = i, m = J(L)({
+  const d = M(), { cancelText: c, submitText: h } = i, m = J(L)({
     backgroundColor: "transparent",
     color: d.palette.primary.light,
     fontSize: 15,
@@ -1127,7 +1129,7 @@ const Re = ({
     },
     marginTop: 12,
     width: "100%"
-  }), f = J(L)({
+  }), u = J(L)({
     backgroundColor: d.palette.action.active,
     borderRadius: 4,
     fontSize: 16,
@@ -1148,7 +1150,7 @@ const Re = ({
       },
       children: [
         /* @__PURE__ */ t(
-          f,
+          u,
           {
             className: "mx-insights-beat-feedback-submit-button",
             "data-ui-test": "submit-button",
@@ -1235,7 +1237,7 @@ const Re = ({
   const m = Se(qe)({
     height: 93,
     resize: "none"
-  }), f = Ve();
+  }), u = Ve();
   return /* @__PURE__ */ s(
     p,
     {
@@ -1253,8 +1255,8 @@ const Re = ({
             maxRows: 4,
             minRows: 4,
             name: "Feedback",
-            onChange: (u) => {
-              c(u.target.value), h(u.target.value);
+            onChange: (f) => {
+              c(f.target.value), h(f.target.value);
             },
             onClick: () => d(),
             placeholder: r,
@@ -1269,7 +1271,7 @@ const Re = ({
           C,
           {
             sx: {
-              color: i && f.palette.error.darker,
+              color: i && u.palette.error.darker,
               fontSize: 12,
               p: "0px !important"
             },
@@ -1437,8 +1439,8 @@ const Re = ({
   onClose: c,
   sendResponseAnalytics: h,
   upperDescription: m,
-  upperList: f,
-  yesButtonText: u
+  upperList: u,
+  yesButtonText: f
 }) => /* @__PURE__ */ t(
   se,
   {
@@ -1471,7 +1473,7 @@ const Re = ({
         /* @__PURE__ */ t(_, { sx: { p: "16px 24px 8px 24px", whiteSpace: "wrap" }, children: l }),
         /* @__PURE__ */ s(x, { sx: { gap: 12, px: 24 }, children: [
           /* @__PURE__ */ t(C, { color: "secondary", fontSize: 13, children: m }),
-          /* @__PURE__ */ t(P, { children: f.map((E, v) => /* @__PURE__ */ s(
+          /* @__PURE__ */ t(P, { children: u.map((E, v) => /* @__PURE__ */ s(
             j,
             {
               sx: {
@@ -1556,7 +1558,7 @@ const Re = ({
                 border: `1px solid ${E.palette.border.main}`,
                 p: "12 16"
               }),
-              children: u
+              children: f
             }
           )
         ] })
@@ -1800,8 +1802,8 @@ const Re = ({
   isMini: c,
   leftLowerText: h,
   leftUpperText: m,
-  rightLowerText: f,
-  rightUpperText: u,
+  rightLowerText: u,
+  rightUpperText: f,
   sourceAccountGuid: E
 }) => /* @__PURE__ */ t(A.Fragment, { children: d ? /* @__PURE__ */ t(
   ie,
@@ -1813,8 +1815,8 @@ const Re = ({
     isMini: c,
     leftLowerText: h,
     leftUpperText: m,
-    rightLowerText: f,
-    rightUpperText: u
+    rightLowerText: u,
+    rightUpperText: f
   }
 ) : /* @__PURE__ */ t(
   E1,