@mx-cartographer/experiences 9.4.32 → 9.4.34-alpha.al0

package/dist/insights-v2/components/BaseLayout.es.js

@@ -1,24 +1,24 @@
-import { useAppConfig as D, useGlobalCopyStore as L, useInsightsV2Store as O } from "../../common/context/hooks.es.js";
-import { sendBeatCta as T } from "../../common/utils/PostMessage.es.js";
-import { blocks as F, hasDrawerBlock as A } from "../mappings/blocks.es.js";
-import I from "./Footer.es.js";
-import { BeatActionsProvider as E } from "../beatActions.es.js";
-import H from "./Header.es.js";
-import { FeedbackBar as M } from "./FeedbackBar.es.js";
-import G from "./FeedbackDialog.es.js";
-import { DismissInsightDialog as R } from "./DismissInsightDialog.es.js";
-import { HiddenConfirmationCard as j } from "./HiddenConfirmationCard.es.js";
-import { ObsolesceBanner as z } from "./ObsolesceBanner.es.js";
-import { ActionBlockLayer as N } from "../actionBlocks/ActionBlockLayer.es.js";
-import { useBeatFeedbackFlow as U } from "../hooks/useBeatFeedbackFlow.es.js";
-import { observer as V } from "mobx-react-lite";
+import { useAppConfig as T, useGlobalCopyStore as F, useInsightsV2Store as A } from "../../common/context/hooks.es.js";
+import { sendBeatCta as I } from "../../common/utils/PostMessage.es.js";
+import { blocks as E, hasDrawerBlock as H } from "../mappings/blocks.es.js";
+import M from "./Footer.es.js";
+import { BeatActionsProvider as G } from "../beatActions.es.js";
+import R from "./Header.es.js";
+import { FeedbackBar as j } from "./FeedbackBar.es.js";
+import z from "./FeedbackDialog.es.js";
+import { DismissInsightDialog as N } from "./DismissInsightDialog.es.js";
+import { HiddenConfirmationCard as U } from "./HiddenConfirmationCard.es.js";
+import { ObsolesceBanner as V } from "./ObsolesceBanner.es.js";
+import { ActionBlockLayer as P } from "../actionBlocks/ActionBlockLayer.es.js";
+import { useBeatFeedbackFlow as W } from "../hooks/useBeatFeedbackFlow.es.js";
+import { observer as X } from "mobx-react-lite";
 import m from "@mui/material/Stack";
 import d from "@mui/material/Button";
-import { ChevronRight as P } from "@mxenabled/mx-icons";
-import { Fragment as W, jsx as o, jsxs as t } from "react/jsx-runtime";
-import X from "@mui/material/Box";
-import Y from "@mui/material/Card";
-var q = {}, J = {
+import { ChevronRight as Y } from "@mxenabled/mx-icons";
+import { Fragment as q, jsx as o, jsxs as r } from "react/jsx-runtime";
+import J from "@mui/material/Box";
+import K from "@mui/material/Card";
+var Q = {}, Z = {
   position: "absolute",
   top: 0,
   left: 0,
@@ -27,29 +27,29 @@ var q = {}, J = {
   backgroundColor: "background.default",
   opacity: 0.7,
   zIndex: 1
-}, he = V(({ beat: i, beatActions: b = q, obsolete: s }) => {
-  const { openCtaDrawer: h } = O(), y = L(), { is_mobile_webview: g, clientConfig: k } = D(), e = U(i, b), r = i.insights_payload;
-  if (!r || e.cardState === "dismissed") return null;
-  const { instance_slot: v, primary_cta: n, secondary_cta: a, sub_title: _, title: C, widget_type: x } = r, { block: S } = v, p = (w, B) => {
-    A(w) ? h(i.guid, B) : T(i, {
-      isMobileWebview: g,
-      webviewScheme: k?.master?.ui_message_webview_url_scheme,
-      userGuid: i.user_guid
+}, ke = X(({ beat: i, beatActions: h = Q, obsolete: s }) => {
+  const { openCtaDrawer: y } = A(), g = F(), { is_mobile_webview: k, clientConfig: v } = T(), e = W(i, h), t = i.insights_payload;
+  if (!t || e.cardState === "dismissed") return null;
+  const { instance_slot: _, primary_cta: n, secondary_cta: a, sub_title: C, title: x, widget_type: S, guid: p, user_guid: w, dismissed_at: B } = t, { block: D } = _, u = (L, O) => {
+    H(L) ? y(p, O) : I(i, {
+      isMobileWebview: k,
+      webviewScheme: v?.master?.ui_message_webview_url_scheme,
+      userGuid: w
     });
-  }, u = F[S], f = x === "mini", l = y.insights_feed?.general, c = s?.state === "not_refreshable" && !i.dismissed_at && !!l;
-  return /* @__PURE__ */ o(E, {
+  }, f = E[D], b = S === "mini", l = g.insights_feed?.general, c = s?.state === "not_refreshable" && !B && !!l;
+  return /* @__PURE__ */ o(G, {
     value: e.wrappedActions,
-    children: /* @__PURE__ */ t(m, {
+    children: /* @__PURE__ */ r(m, {
       sx: { mb: 16 },
       children: [
-        e.cardState === "confirming" ? /* @__PURE__ */ o(j, {
+        e.cardState === "confirming" ? /* @__PURE__ */ o(U, {
           onClose: e.collapseConfirmation,
           onLeaveFeedback: e.openHideSurvey,
           onUndo: e.undoDismiss
-        }) : /* @__PURE__ */ t(W, { children: [s && l && /* @__PURE__ */ o(z, {
+        }) : /* @__PURE__ */ r(q, { children: [s && l && /* @__PURE__ */ o(V, {
           ...s,
           copy: l
-        }), /* @__PURE__ */ t(Y, {
+        }), /* @__PURE__ */ r(K, {
           inert: c,
           sx: { ...c && {
             position: "relative",
@@ -57,17 +57,17 @@ var q = {}, J = {
             pointerEvents: "none"
           } },
           children: [
-            c && /* @__PURE__ */ o(X, { sx: J }),
-            /* @__PURE__ */ o(H, {
-              isMini: f,
-              subtitle: _,
-              title: C ?? ""
+            c && /* @__PURE__ */ o(J, { sx: Z }),
+            /* @__PURE__ */ o(R, {
+              isMini: b,
+              subtitle: C,
+              title: x ?? ""
             }),
-            u && /* @__PURE__ */ o(u, {
-              beatGuid: i.guid,
-              payload: r
+            f && /* @__PURE__ */ o(f, {
+              beatGuid: p,
+              payload: t
             }),
-            /* @__PURE__ */ t(m, {
+            /* @__PURE__ */ r(m, {
               sx: {
                 gap: 6,
                 pb: 16,
@@ -76,10 +76,10 @@ var q = {}, J = {
                 pt: 12
               },
               children: [/* @__PURE__ */ o("div", {
-                dangerouslySetInnerHTML: { __html: i.html_description },
+                dangerouslySetInnerHTML: { __html: t.description.html_text },
                 style: { paddingLeft: 4 }
               }), i?.in_description_cta && /* @__PURE__ */ o(d, {
-                endIcon: /* @__PURE__ */ o(P, {}),
+                endIcon: /* @__PURE__ */ o(Y, {}),
                 onClick: () => {
                 },
                 sx: {
@@ -90,35 +90,35 @@ var q = {}, J = {
                 children: i.in_description_cta
               })]
             }),
-            !f && n?.label && /* @__PURE__ */ t(m, {
+            !b && n?.label && /* @__PURE__ */ r(m, {
               sx: {
                 gap: 8,
                 pb: 16,
                 px: 16
               },
               children: [/* @__PURE__ */ o(d, {
-                onClick: () => p(n.block, "primaryCta"),
+                onClick: () => u(n.block, "primaryCta"),
                 variant: "outlined",
                 children: n.label
               }), a?.label && /* @__PURE__ */ o(d, {
                 color: "secondary",
-                onClick: () => p(a.block, "secondaryCta"),
+                onClick: () => u(a.block, "secondaryCta"),
                 children: a.label
               })]
             }),
-            /* @__PURE__ */ o(M, {
+            /* @__PURE__ */ o(j, {
               onTellUsMore: e.openRatingSurvey,
               show: e.isFeedbackBarShown
             })
           ]
         })] }),
-        /* @__PURE__ */ o(N, { beat: i }),
-        /* @__PURE__ */ o(R, {
+        /* @__PURE__ */ o(P, { beat: i }),
+        /* @__PURE__ */ o(N, {
           isOpen: e.isDismissOpen,
           onClose: e.closeDismissDialog,
           onDismiss: e.confirmDismiss
         }),
-        e.isSurveyOpen && /* @__PURE__ */ o(G, {
+        e.isSurveyOpen && /* @__PURE__ */ o(z, {
           characterLimitLabel: e.survey.characterLimitLabel,
           closeAriaLabel: e.survey.closeAriaLabel,
           isOpen: !0,
@@ -131,13 +131,13 @@ var q = {}, J = {
           secondaryText: e.survey.backText,
           title: e.survey.title
         }),
-        e.cardState === "visible" && r.footer && /* @__PURE__ */ o(I, { footer: r.footer })
+        e.cardState === "visible" && t.footer && /* @__PURE__ */ o(M, { footer: t.footer })
       ]
     })
   });
 });
 export {
-  he as default
+  ke as default
 };
 
 //# sourceMappingURL=BaseLayout.es.js.map

package/dist/insights-v2/components/BaseLayout.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseLayout.es.js","names":[],"sources":["../../../src/insights-v2/components/BaseLayout.tsx"],"sourcesContent":["import { observer } from 'mobx-react-lite'\n\nimport Box from '@mui/material/Box'\nimport Button from '@mui/material/Button'\nimport Card from '@mui/material/Card'\nimport Stack from '@mui/material/Stack'\n\nimport { ChevronRight } from '@mxenabled/mx-icons'\n\nimport { blocks, hasDrawerBlock } from '../mappings/blocks'\n\nimport Footer from './Footer'\nimport Header from './Header'\nimport FeedbackBar from './FeedbackBar'\nimport FeedbackDialog from './FeedbackDialog'\nimport DismissInsightDialog from './DismissInsightDialog'\nimport HiddenConfirmationCard from './HiddenConfirmationCard'\nimport { ObsolesceBanner, type ObsolesceBannerState } from './ObsolesceBanner'\nimport { useAppConfig, useGlobalCopyStore, useInsightsV2Store } from '../../common'\nimport { sendBeatCta } from '../../common/utils/PostMessage'\nimport type { Beat } from '../../core'\nimport { BeatActionsProvider, type BeatActions } from '../beatActions'\nimport { ActionBlockLayer } from '../actionBlocks/ActionBlockLayer'\nimport { useBeatFeedbackFlow } from '../hooks/useBeatFeedbackFlow'\n\nexport interface ObsoleteState {\n  state: ObsolesceBannerState\n  onRefresh: () => void\n  onDismiss: () => void\n}\n\ninterface BaseLayoutProps {\n  beat: Beat\n  beatActions?: BeatActions\n  obsolete?: ObsoleteState\n}\n\nconst NO_BEAT_ACTIONS: BeatActions = {}\n\nconst OBSOLETE_OVERLAY_SX = {\n  position: 'absolute',\n  top: 0,\n  left: 0,\n  width: '100%',\n  height: '100%',\n  backgroundColor: 'background.default',\n  opacity: 0.7,\n  zIndex: 1,\n} as const\n\nconst BaseLayout = observer(\n  ({ beat, beatActions = NO_BEAT_ACTIONS, obsolete }: BaseLayoutProps) => {\n    const { openCtaDrawer } = useInsightsV2Store()\n    const copy = useGlobalCopyStore()\n    const { is_mobile_webview, clientConfig } = useAppConfig()\n    const flow = useBeatFeedbackFlow(beat, beatActions)\n\n    const insights_payload = beat.insights_payload\n\n    if (!insights_payload) return null\n    if (flow.cardState === 'dismissed') return null\n\n    const { instance_slot, primary_cta, secondary_cta, sub_title, title, widget_type } =\n      insights_payload\n    const { block } = instance_slot\n\n    // A CTA with a real drilldown `block` opens a drawer; otherwise it notifies\n    // the host app via a beat/cta post message (the \"Make a Transfer\" CTA on the\n    // Save an extra $100 beat). Mirrors Pulse's SaveAnExtra100Dollars beat.\n    const handleCtaClick = (\n      ctaBlock: string | null | undefined,\n      source: 'primaryCta' | 'secondaryCta',\n    ) => {\n      if (hasDrawerBlock(ctaBlock)) {\n        openCtaDrawer(beat.guid, source)\n      } else {\n        sendBeatCta(beat, {\n          isMobileWebview: is_mobile_webview,\n          webviewScheme: clientConfig?.master?.ui_message_webview_url_scheme,\n          userGuid: beat.user_guid,\n        })\n      }\n    }\n\n    const Block = blocks[block as keyof typeof blocks]\n\n    const isMini = widget_type === 'mini'\n    const obsoleteCopy = copy.insights_feed?.general\n    const isObsoleteDimmed =\n      obsolete?.state === 'not_refreshable' && !beat.dismissed_at && !!obsoleteCopy\n\n    return (\n      <BeatActionsProvider value={flow.wrappedActions}>\n        <Stack sx={{ mb: 16 }}>\n          {flow.cardState === 'confirming' ? (\n            <HiddenConfirmationCard\n              onClose={flow.collapseConfirmation}\n              onLeaveFeedback={flow.openHideSurvey}\n              onUndo={flow.undoDismiss}\n            />\n          ) : (\n            <>\n              {obsolete && obsoleteCopy && <ObsolesceBanner {...obsolete} copy={obsoleteCopy} />}\n              <Card\n                inert={isObsoleteDimmed}\n                sx={{\n                  ...(isObsoleteDimmed && {\n                    position: 'relative',\n                    zIndex: 2,\n                    pointerEvents: 'none',\n                  }),\n                }}\n              >\n                {isObsoleteDimmed && <Box sx={OBSOLETE_OVERLAY_SX} />}\n                <Header isMini={isMini} subtitle={sub_title} title={title ?? ''} />\n                {Block && <Block beatGuid={beat.guid} payload={insights_payload} />}\n\n                <Stack sx={{ gap: 6, pb: 16, pl: 12, pr: 16, pt: 12 }}>\n                  <div\n                    dangerouslySetInnerHTML={{\n                      __html: beat.html_description as string,\n                    }}\n                    style={{ paddingLeft: 4 }}\n                  />\n                  {beat?.in_description_cta && (\n                    <Button\n                      endIcon={<ChevronRight />}\n                      onClick={() => {}}\n                      sx={{ height: 24, p: 4, width: 'max-content' }}\n                    >\n                      {beat.in_description_cta}\n                    </Button>\n                  )}\n                </Stack>\n\n                {!isMini && primary_cta?.label && (\n                  <Stack sx={{ gap: 8, pb: 16, px: 16 }}>\n                    <Button\n                      onClick={() => handleCtaClick(primary_cta.block, 'primaryCta')}\n                      variant=\"outlined\"\n                    >\n                      {primary_cta.label}\n                    </Button>\n                    {secondary_cta?.label && (\n                      <Button\n                        color=\"secondary\"\n                        onClick={() => handleCtaClick(secondary_cta.block, 'secondaryCta')}\n                      >\n                        {secondary_cta.label}\n                      </Button>\n                    )}\n                  </Stack>\n                )}\n\n                <FeedbackBar onTellUsMore={flow.openRatingSurvey} show={flow.isFeedbackBarShown} />\n              </Card>\n            </>\n          )}\n\n          <ActionBlockLayer beat={beat} />\n\n          <DismissInsightDialog\n            isOpen={flow.isDismissOpen}\n            onClose={flow.closeDismissDialog}\n            onDismiss={flow.confirmDismiss}\n          />\n\n          {flow.isSurveyOpen && (\n            <FeedbackDialog\n              characterLimitLabel={flow.survey.characterLimitLabel}\n              closeAriaLabel={flow.survey.closeAriaLabel}\n              isOpen={true}\n              onBackClick={flow.feedbackDialogCallbacks.onBackClick}\n              onClose={flow.closeSurvey}\n              onSubmit={flow.submitSurvey}\n              onTextInputFocus={flow.feedbackDialogCallbacks.onTextInputFocus}\n              options={flow.survey.options}\n              primaryText={flow.survey.submitText}\n              secondaryText={flow.survey.backText}\n              title={flow.survey.title}\n            />\n          )}\n\n          {flow.cardState === 'visible' && insights_payload.footer && (\n            <Footer footer={insights_payload.footer} />\n          )}\n        </Stack>\n      </BeatActionsProvider>\n    )\n  },\n)\n\nexport default BaseLayout\n"],"mappings":"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"}
+{"version":3,"file":"BaseLayout.es.js","names":[],"sources":["../../../src/insights-v2/components/BaseLayout.tsx"],"sourcesContent":["import { observer } from 'mobx-react-lite'\n\nimport Box from '@mui/material/Box'\nimport Button from '@mui/material/Button'\nimport Card from '@mui/material/Card'\nimport Stack from '@mui/material/Stack'\n\nimport { ChevronRight } from '@mxenabled/mx-icons'\n\nimport { blocks, hasDrawerBlock } from '../mappings/blocks'\n\nimport Footer from './Footer'\nimport Header from './Header'\nimport FeedbackBar from './FeedbackBar'\nimport FeedbackDialog from './FeedbackDialog'\nimport DismissInsightDialog from './DismissInsightDialog'\nimport HiddenConfirmationCard from './HiddenConfirmationCard'\nimport { ObsolesceBanner, type ObsolesceBannerState } from './ObsolesceBanner'\nimport { useAppConfig, useGlobalCopyStore, useInsightsV2Store } from '../../common'\nimport { sendBeatCta } from '../../common/utils/PostMessage'\nimport type { Beat } from '../../core'\nimport { BeatActionsProvider, type BeatActions } from '../beatActions'\nimport { ActionBlockLayer } from '../actionBlocks/ActionBlockLayer'\nimport { useBeatFeedbackFlow } from '../hooks/useBeatFeedbackFlow'\n\nexport interface ObsoleteState {\n  state: ObsolesceBannerState\n  onRefresh: () => void\n  onDismiss: () => void\n}\n\ninterface BaseLayoutProps {\n  beat: Beat\n  beatActions?: BeatActions\n  obsolete?: ObsoleteState\n}\n\nconst NO_BEAT_ACTIONS: BeatActions = {}\n\nconst OBSOLETE_OVERLAY_SX = {\n  position: 'absolute',\n  top: 0,\n  left: 0,\n  width: '100%',\n  height: '100%',\n  backgroundColor: 'background.default',\n  opacity: 0.7,\n  zIndex: 1,\n} as const\n\nconst BaseLayout = observer(\n  ({ beat, beatActions = NO_BEAT_ACTIONS, obsolete }: BaseLayoutProps) => {\n    const { openCtaDrawer } = useInsightsV2Store()\n    const copy = useGlobalCopyStore()\n    const { is_mobile_webview, clientConfig } = useAppConfig()\n    const flow = useBeatFeedbackFlow(beat, beatActions)\n\n    const insights_payload = beat.insights_payload\n\n    if (!insights_payload) return null\n    if (flow.cardState === 'dismissed') return null\n\n    const {\n      instance_slot,\n      primary_cta,\n      secondary_cta,\n      sub_title,\n      title,\n      widget_type,\n      guid,\n      user_guid,\n      dismissed_at,\n    } = insights_payload\n    const { block } = instance_slot\n\n    // A CTA with a real drilldown `block` opens a drawer; otherwise it notifies\n    // the host app via a beat/cta post message (the \"Make a Transfer\" CTA on the\n    // Save an extra $100 beat). Mirrors Pulse's SaveAnExtra100Dollars beat.\n    const handleCtaClick = (\n      ctaBlock: string | null | undefined,\n      source: 'primaryCta' | 'secondaryCta',\n    ) => {\n      if (hasDrawerBlock(ctaBlock)) {\n        openCtaDrawer(guid, source)\n      } else {\n        sendBeatCta(beat, {\n          isMobileWebview: is_mobile_webview,\n          webviewScheme: clientConfig?.master?.ui_message_webview_url_scheme,\n          userGuid: user_guid,\n        })\n      }\n    }\n\n    const Block = blocks[block as keyof typeof blocks]\n\n    const isMini = widget_type === 'mini'\n    const obsoleteCopy = copy.insights_feed?.general\n    const isObsoleteDimmed =\n      obsolete?.state === 'not_refreshable' && !dismissed_at && !!obsoleteCopy\n\n    return (\n      <BeatActionsProvider value={flow.wrappedActions}>\n        <Stack sx={{ mb: 16 }}>\n          {flow.cardState === 'confirming' ? (\n            <HiddenConfirmationCard\n              onClose={flow.collapseConfirmation}\n              onLeaveFeedback={flow.openHideSurvey}\n              onUndo={flow.undoDismiss}\n            />\n          ) : (\n            <>\n              {obsolete && obsoleteCopy && <ObsolesceBanner {...obsolete} copy={obsoleteCopy} />}\n              <Card\n                inert={isObsoleteDimmed}\n                sx={{\n                  ...(isObsoleteDimmed && {\n                    position: 'relative',\n                    zIndex: 2,\n                    pointerEvents: 'none',\n                  }),\n                }}\n              >\n                {isObsoleteDimmed && <Box sx={OBSOLETE_OVERLAY_SX} />}\n                <Header isMini={isMini} subtitle={sub_title} title={title ?? ''} />\n                {Block && <Block beatGuid={guid} payload={insights_payload} />}\n\n                <Stack sx={{ gap: 6, pb: 16, pl: 12, pr: 16, pt: 12 }}>\n                  <div\n                    dangerouslySetInnerHTML={{\n                      __html: insights_payload.description.html_text,\n                    }}\n                    style={{ paddingLeft: 4 }}\n                  />\n                  {/* TODO: Migrate to insights_payload.in_description_cta once backend provides it */}\n                  {beat?.in_description_cta && (\n                    <Button\n                      endIcon={<ChevronRight />}\n                      onClick={() => {}}\n                      sx={{ height: 24, p: 4, width: 'max-content' }}\n                    >\n                      {beat.in_description_cta}\n                    </Button>\n                  )}\n                </Stack>\n\n                {!isMini && primary_cta?.label && (\n                  <Stack sx={{ gap: 8, pb: 16, px: 16 }}>\n                    <Button\n                      onClick={() => handleCtaClick(primary_cta.block, 'primaryCta')}\n                      variant=\"outlined\"\n                    >\n                      {primary_cta.label}\n                    </Button>\n                    {secondary_cta?.label && (\n                      <Button\n                        color=\"secondary\"\n                        onClick={() => handleCtaClick(secondary_cta.block, 'secondaryCta')}\n                      >\n                        {secondary_cta.label}\n                      </Button>\n                    )}\n                  </Stack>\n                )}\n\n                <FeedbackBar onTellUsMore={flow.openRatingSurvey} show={flow.isFeedbackBarShown} />\n              </Card>\n            </>\n          )}\n\n          <ActionBlockLayer beat={beat} />\n\n          <DismissInsightDialog\n            isOpen={flow.isDismissOpen}\n            onClose={flow.closeDismissDialog}\n            onDismiss={flow.confirmDismiss}\n          />\n\n          {flow.isSurveyOpen && (\n            <FeedbackDialog\n              characterLimitLabel={flow.survey.characterLimitLabel}\n              closeAriaLabel={flow.survey.closeAriaLabel}\n              isOpen={true}\n              onBackClick={flow.feedbackDialogCallbacks.onBackClick}\n              onClose={flow.closeSurvey}\n              onSubmit={flow.submitSurvey}\n              onTextInputFocus={flow.feedbackDialogCallbacks.onTextInputFocus}\n              options={flow.survey.options}\n              primaryText={flow.survey.submitText}\n              secondaryText={flow.survey.backText}\n              title={flow.survey.title}\n            />\n          )}\n\n          {flow.cardState === 'visible' && insights_payload.footer && (\n            <Footer footer={insights_payload.footer} />\n          )}\n        </Stack>\n      </BeatActionsProvider>\n    )\n  },\n)\n\nexport default BaseLayout\n"],"mappings":"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"}

package/dist/insights-v2/components/DismissInsightDialog.es.js

@@ -1,25 +1,26 @@
-import { useGlobalCopyStore as m } from "../../common/context/hooks.es.js";
-import u from "../../common/components/dialog/Dialog.es.js";
-import { useEffect as b, useState as f } from "react";
-import { observer as x } from "mobx-react-lite";
+import { useGlobalCopyStore as u } from "../../common/context/hooks.es.js";
+import f from "../../common/components/dialog/Dialog.es.js";
+import { useEffect as b, useState as x } from "react";
+import { observer as g } from "mobx-react-lite";
 import a from "@mui/material/Stack";
 import { Text as l } from "@mxenabled/mxui";
-import { jsx as r, jsxs as s } from "react/jsx-runtime";
-import g from "@mui/material/FormControlLabel";
-import h from "@mui/material/Radio";
+import { jsx as i, jsxs as s } from "react/jsx-runtime";
+import { alpha as c } from "@mui/material/styles";
+import h from "@mui/material/FormControlLabel";
+import v from "@mui/material/Radio";
 import y from "@mui/material/RadioGroup";
-var R = x(({ isOpen: i, onClose: d, onDismiss: c }) => {
-  const o = m().insights_feed?.dismiss, [t, n] = f("once");
+var _ = g(({ isOpen: t, onClose: d, onDismiss: m }) => {
+  const o = u().insights_feed?.dismiss, [e, n] = x("once");
   return b(() => {
-    i && n("once");
-  }, [i]), o ? /* @__PURE__ */ r(u, {
+    t && n("once");
+  }, [t]), o ? /* @__PURE__ */ i(f, {
     copy: {
       title: o.title,
       close_aria: o.close_aria
     },
-    isOpen: i,
+    isOpen: t,
     onClose: d,
-    onPrimaryAction: () => c(t),
+    onPrimaryAction: () => m(e),
     primaryText: o.confirm,
     secondaryText: o.cancel,
     sx: {
@@ -31,9 +32,7 @@ var R = x(({ isOpen: i, onClose: d, onDismiss: c }) => {
       "& .MuiDialog-paperScrollPaper > div:first-child .MuiIconButton-root": { my: -10 },
       "& .MuiDialog-paperScrollPaper": {
         bgcolor: "background.paper",
-        border: "1px solid",
-        borderColor: "divider",
-        boxShadow: "none"
+        borderRadius: "4px"
       },
       "&:focus-visible": {
         outline: "2px solid",
@@ -53,36 +52,39 @@ var R = x(({ isOpen: i, onClose: d, onDismiss: c }) => {
     },
     children: /* @__PURE__ */ s(a, {
       sx: { gap: 24 },
-      children: [/* @__PURE__ */ r(l, {
+      children: [/* @__PURE__ */ i(l, {
         variant: "subtitle1",
         children: o.description
-      }), /* @__PURE__ */ r(y, {
+      }), /* @__PURE__ */ i(y, {
         "aria-label": o.title,
         name: "dismiss-type",
-        onChange: (e) => n(e.target.value),
+        onChange: (r) => n(r.target.value),
         sx: {
           m: 0,
           p: 0
         },
-        value: t,
-        children: /* @__PURE__ */ r(a, {
+        value: e,
+        children: /* @__PURE__ */ i(a, {
           sx: { gap: 16 },
-          children: ["once", "always"].map((e) => /* @__PURE__ */ r(g, {
-            value: e,
-            control: /* @__PURE__ */ r(h, { inputProps: { "aria-label": o[e].headline } }),
+          children: ["once", "always"].map((r) => /* @__PURE__ */ i(h, {
+            value: r,
+            control: /* @__PURE__ */ i(v, {
+              inputProps: { "aria-label": o[r].headline },
+              sx: { "& .MuiSvgIcon-root": { color: e === r ? "inherit" : "action.active" } }
+            }),
             labelPlacement: "start",
             label: /* @__PURE__ */ s(a, {
               sx: {
                 gap: 4,
                 flexGrow: 1
               },
-              children: [/* @__PURE__ */ r(l, {
+              children: [/* @__PURE__ */ i(l, {
                 bold: !0,
                 variant: "body1",
-                children: o[e].headline
-              }), /* @__PURE__ */ r(l, {
+                children: o[r].headline
+              }), /* @__PURE__ */ i(l, {
                 variant: "subtitle2",
-                children: o[e].description
+                children: o[r].description
               })]
             }),
             sx: {
@@ -93,17 +95,17 @@ var R = x(({ isOpen: i, onClose: d, onDismiss: c }) => {
               minHeight: 72,
               px: 16,
               py: 0,
-              boxShadow: (p) => t === e ? `inset 0 0 0 2px ${p.palette.primary.main}` : `inset 0 0 0 1px ${p.palette.divider}`
+              border: (p) => e === r ? `2px solid ${c(p.palette.primary.main, 0.5)}` : `1px solid ${c(p.palette.divider, 0.5)}`
             }
-          }, e))
+          }, r))
         })
       })]
     })
   }) : null;
 });
 export {
-  R as DismissInsightDialog,
-  R as default
+  _ as DismissInsightDialog,
+  _ as default
 };
 
 //# sourceMappingURL=DismissInsightDialog.es.js.map

package/dist/insights-v2/components/DismissInsightDialog.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"DismissInsightDialog.es.js","names":[],"sources":["../../../src/insights-v2/components/DismissInsightDialog.tsx"],"sourcesContent":["import { useEffect, useState } from 'react'\n\nimport FormControlLabel from '@mui/material/FormControlLabel'\nimport Radio from '@mui/material/Radio'\nimport RadioGroup from '@mui/material/RadioGroup'\nimport Stack from '@mui/material/Stack'\n\nimport { observer } from 'mobx-react-lite'\n\nimport { Text } from '@mxenabled/mxui'\n\nimport { Dialog, useGlobalCopyStore } from '../../common'\n\nexport type DismissType = 'once' | 'always'\n\nexport interface DismissInsightDialogProps {\n  isOpen: boolean\n  onClose: () => void\n  onDismiss: (type: DismissType) => void\n}\n\n/** Confirmation dialog for hiding an insight. */\nexport const DismissInsightDialog = observer(\n  ({ isOpen, onClose, onDismiss }: DismissInsightDialogProps) => {\n    const copy = useGlobalCopyStore().insights_feed?.dismiss\n    const [selected, setSelected] = useState<DismissType>('once')\n\n    useEffect(() => {\n      if (isOpen) setSelected('once')\n    }, [isOpen])\n\n    if (!copy) return null\n\n    return (\n      <Dialog\n        copy={{ title: copy.title, close_aria: copy.close_aria }}\n        isOpen={isOpen}\n        onClose={onClose}\n        onPrimaryAction={() => onDismiss(selected)}\n        primaryText={copy.confirm}\n        secondaryText={copy.cancel}\n        sx={{\n          '& .MuiDialogContent-root': { py: 0 },\n          '& .MuiDialog-paperScrollPaper > div:first-child': { pt: 24, pb: 8 },\n          '& .MuiDialog-paperScrollPaper > div:first-child .MuiIconButton-root': { my: -10 },\n          '& .MuiDialog-paperScrollPaper': {\n            bgcolor: 'background.paper',\n            border: '1px solid',\n            borderColor: 'divider',\n            boxShadow: 'none',\n          },\n          '&:focus-visible': {\n            outline: '2px solid',\n            outlineColor: 'primary.main',\n          },\n          '& .MuiDialog-paper:focus-visible': {\n            outline: '2px solid',\n            outlineColor: 'primary.main',\n          },\n          '& .MuiButton-outlined': {\n            border: 'none',\n            '&:hover': { bgcolor: 'transparent', border: 'none' },\n          },\n        }}\n      >\n        <Stack sx={{ gap: 24 }}>\n          <Text variant=\"subtitle1\">{copy.description}</Text>\n\n          <RadioGroup\n            aria-label={copy.title}\n            name=\"dismiss-type\"\n            onChange={(e) => setSelected(e.target.value as DismissType)}\n            sx={{ m: 0, p: 0 }}\n            value={selected}\n          >\n            <Stack sx={{ gap: 16 }}>\n              {(['once', 'always'] as const).map((k) => (\n                <FormControlLabel\n                  key={k}\n                  value={k}\n                  control={<Radio inputProps={{ 'aria-label': copy[k].headline }} />}\n                  labelPlacement=\"start\"\n                  label={\n                    <Stack sx={{ gap: 4, flexGrow: 1 }}>\n                      <Text bold={true} variant=\"body1\">\n                        {copy[k].headline}\n                      </Text>\n                      <Text variant=\"subtitle2\">{copy[k].description}</Text>\n                    </Stack>\n                  }\n                  sx={{\n                    alignItems: 'center',\n                    borderRadius: '8px',\n                    justifyContent: 'space-between',\n                    m: 0,\n                    minHeight: 72,\n                    px: 16,\n                    py: 0,\n                    boxShadow: (theme) =>\n                      selected === k\n                        ? `inset 0 0 0 2px ${theme.palette.primary.main}`\n                        : `inset 0 0 0 1px ${theme.palette.divider}`,\n                  }}\n                />\n              ))}\n            </Stack>\n          </RadioGroup>\n        </Stack>\n      </Dialog>\n    )\n  },\n)\n\nexport default DismissInsightDialog\n"],"mappings":"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"}
+{"version":3,"file":"DismissInsightDialog.es.js","names":[],"sources":["../../../src/insights-v2/components/DismissInsightDialog.tsx"],"sourcesContent":["import { useEffect, useState } from 'react'\n\nimport FormControlLabel from '@mui/material/FormControlLabel'\nimport Radio from '@mui/material/Radio'\nimport RadioGroup from '@mui/material/RadioGroup'\nimport Stack from '@mui/material/Stack'\nimport { alpha } from '@mui/material/styles'\n\nimport { observer } from 'mobx-react-lite'\n\nimport { Text } from '@mxenabled/mxui'\n\nimport { Dialog, useGlobalCopyStore } from '../../common'\n\nexport type DismissType = 'once' | 'always'\n\nexport interface DismissInsightDialogProps {\n  isOpen: boolean\n  onClose: () => void\n  onDismiss: (type: DismissType) => void\n}\n\n/** Confirmation dialog for hiding an insight. */\nexport const DismissInsightDialog = observer(\n  ({ isOpen, onClose, onDismiss }: DismissInsightDialogProps) => {\n    const copy = useGlobalCopyStore().insights_feed?.dismiss\n    const [selected, setSelected] = useState<DismissType>('once')\n\n    useEffect(() => {\n      if (isOpen) setSelected('once')\n    }, [isOpen])\n\n    if (!copy) return null\n\n    return (\n      <Dialog\n        copy={{ title: copy.title, close_aria: copy.close_aria }}\n        isOpen={isOpen}\n        onClose={onClose}\n        onPrimaryAction={() => onDismiss(selected)}\n        primaryText={copy.confirm}\n        secondaryText={copy.cancel}\n        sx={{\n          '& .MuiDialogContent-root': { py: 0 },\n          '& .MuiDialog-paperScrollPaper > div:first-child': { pt: 24, pb: 8 },\n          '& .MuiDialog-paperScrollPaper > div:first-child .MuiIconButton-root': { my: -10 },\n          '& .MuiDialog-paperScrollPaper': {\n            bgcolor: 'background.paper',\n            borderRadius: '4px',\n          },\n          '&:focus-visible': {\n            outline: '2px solid',\n            outlineColor: 'primary.main',\n          },\n          '& .MuiDialog-paper:focus-visible': {\n            outline: '2px solid',\n            outlineColor: 'primary.main',\n          },\n          '& .MuiButton-outlined': {\n            border: 'none',\n            '&:hover': { bgcolor: 'transparent', border: 'none' },\n          },\n        }}\n      >\n        <Stack sx={{ gap: 24 }}>\n          <Text variant=\"subtitle1\">{copy.description}</Text>\n\n          <RadioGroup\n            aria-label={copy.title}\n            name=\"dismiss-type\"\n            onChange={(e) => setSelected(e.target.value as DismissType)}\n            sx={{ m: 0, p: 0 }}\n            value={selected}\n          >\n            <Stack sx={{ gap: 16 }}>\n              {(['once', 'always'] as const).map((k) => (\n                <FormControlLabel\n                  key={k}\n                  value={k}\n                  control={\n                    <Radio\n                      inputProps={{ 'aria-label': copy[k].headline }}\n                      sx={{\n                        '& .MuiSvgIcon-root': {\n                          color: selected === k ? 'inherit' : 'action.active',\n                        },\n                      }}\n                    />\n                  }\n                  labelPlacement=\"start\"\n                  label={\n                    <Stack sx={{ gap: 4, flexGrow: 1 }}>\n                      <Text bold={true} variant=\"body1\">\n                        {copy[k].headline}\n                      </Text>\n                      <Text variant=\"subtitle2\">{copy[k].description}</Text>\n                    </Stack>\n                  }\n                  sx={{\n                    alignItems: 'center',\n                    borderRadius: '8px',\n                    justifyContent: 'space-between',\n                    m: 0,\n                    minHeight: 72,\n                    px: 16,\n                    py: 0,\n                    border: (theme) =>\n                      selected === k\n                        ? `2px solid ${alpha(theme.palette.primary.main, 0.5)}`\n                        : `1px solid ${alpha(theme.palette.divider, 0.5)}`,\n                  }}\n                />\n              ))}\n            </Stack>\n          </RadioGroup>\n        </Stack>\n      </Dialog>\n    )\n  },\n)\n\nexport default DismissInsightDialog\n"],"mappings":"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"}

package/dist/insights-v2/components/FeedbackDialog.es.js

@@ -8,12 +8,12 @@ import E from "@mui/material/TextField";
 import L from "@mui/material/Radio";
 import G from "@mui/material/FormControl";
 import H from "@mui/material/RadioGroup";
-var K = 250, O = ({ isOpen: l, onClose: h, onSubmit: x, title: c, options: r, characterLimit: v = K, characterLimitLabel: u, secondaryText: C, primaryText: S, closeAriaLabel: y, onBackClick: k, onTextInputFocus: F }) => {
+var K = 250, O = ({ isOpen: l, onClose: h, onSubmit: x, title: s, options: r, characterLimit: v = K, characterLimitLabel: u, secondaryText: C, primaryText: S, closeAriaLabel: y, onBackClick: k, onTextInputFocus: F }) => {
   const [t, m] = b(""), [a, d] = b(""), i = p(!1), n = p(!1);
   if (w(() => {
     l && (i.current = !1, n.current = !1);
   }, [l]), r.length === 0) return null;
-  const s = t === r[r.length - 1], R = !t || s && !a.trim(), f = () => {
+  const c = t === r[r.length - 1], R = !t || c && !a.trim(), f = () => {
     m(""), d("");
   }, D = (e) => {
     if (e === "backdropClick" || e === "escapeKeyDown") return e;
@@ -28,14 +28,14 @@ var K = 250, O = ({ isOpen: l, onClose: h, onSubmit: x, title: c, options: r, ch
   };
   return /* @__PURE__ */ g(P, {
     copy: {
-      title: c,
+      title: s,
       close_aria: y
     },
     disablePrimaryButton: R,
     isOpen: l,
     onClose: M,
     onPrimaryAction: () => {
-      n.current = !0, x(t, s ? a.trim() : void 0), f();
+      n.current = !0, x(t, c ? a.trim() : void 0), f();
     },
     onSecondaryAction: T,
     primaryText: S,
@@ -59,12 +59,15 @@ var K = 250, O = ({ isOpen: l, onClose: h, onSubmit: x, title: c, options: r, ch
       }
     },
     children: [/* @__PURE__ */ o(G, { children: /* @__PURE__ */ o(H, {
-      "aria-label": c,
+      "aria-label": s,
       name: "feedback-radio-group",
       onChange: (e) => m(e.target.value),
       value: t,
       children: r.map((e) => /* @__PURE__ */ o(z, {
-        control: /* @__PURE__ */ o(L, { sx: { "& .MuiSvgIcon-root": { fontSize: 22 } } }),
+        control: /* @__PURE__ */ o(L, { sx: { "& .MuiSvgIcon-root": {
+          fontSize: 22,
+          color: "action.active"
+        } } }),
         label: e,
         sx: { "& .MuiFormControlLabel-label": {
           color: "text.primary",
@@ -72,7 +75,7 @@ var K = 250, O = ({ isOpen: l, onClose: h, onSubmit: x, title: c, options: r, ch
         } },
         value: e
       }, e))
-    }) }), s && /* @__PURE__ */ g(_, {
+    }) }), c && /* @__PURE__ */ g(_, {
       sx: {
         gap: 3,
         mt: 4

package/dist/insights-v2/components/FeedbackDialog.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"FeedbackDialog.es.js","names":[],"sources":["../../../src/insights-v2/components/FeedbackDialog.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react'\n\nimport FormControl from '@mui/material/FormControl'\nimport FormControlLabel from '@mui/material/FormControlLabel'\nimport Radio from '@mui/material/Radio'\nimport RadioGroup from '@mui/material/RadioGroup'\nimport Stack from '@mui/material/Stack'\nimport TextField from '@mui/material/TextField'\n\nimport { Text } from '@mxenabled/mxui'\n\nimport { Dialog } from '../../common'\n\nconst CHARACTER_LIMIT = 250\n\nexport type FeedbackDialogCloseReason = 'closeButton' | 'backdropClick' | 'escapeKeyDown'\n\nexport interface FeedbackDialogProps {\n  title: string\n  options: string[]\n  characterLimit?: number\n  characterLimitLabel?: string\n  isOpen: boolean\n  onSubmit: (option: string, detail?: string) => void\n  /** Called on every close; `reason` is set for user-initiated closes (X/backdrop/escape), undefined on submit/back. */\n  onClose: (reason?: FeedbackDialogCloseReason) => void\n  onBackClick?: () => void\n  onTextInputFocus?: () => void\n  secondaryText: string\n  primaryText: string\n  closeAriaLabel: string\n}\n\n/** Generic feedback survey dialog. Last option shows detail text field. */\nconst FeedbackDialog = ({\n  isOpen,\n  onClose,\n  onSubmit,\n  title,\n  options,\n  characterLimit = CHARACTER_LIMIT,\n  characterLimitLabel,\n  secondaryText,\n  primaryText,\n  closeAriaLabel,\n  onBackClick,\n  onTextInputFocus,\n}: FeedbackDialogProps) => {\n  const [selected, setSelected] = useState('')\n  const [detail, setDetail] = useState('')\n  const hasTrackedFocus = useRef(false)\n  const skipCloseAnalytics = useRef(false)\n\n  useEffect(() => {\n    if (isOpen) {\n      hasTrackedFocus.current = false\n      skipCloseAnalytics.current = false\n    }\n  }, [isOpen])\n\n  if (options.length === 0) return null\n\n  const isOther = selected === options[options.length - 1]\n  const isSubmitDisabled = !selected || (isOther && !detail.trim())\n\n  const reset = () => {\n    setSelected('')\n    setDetail('')\n  }\n\n  const resolveCloseReason = (reason?: string): FeedbackDialogCloseReason | undefined => {\n    if (reason === 'backdropClick' || reason === 'escapeKeyDown') return reason\n    if (!skipCloseAnalytics.current) return 'closeButton'\n    return undefined\n  }\n\n  const handleClose = (_event?: unknown, reason?: string) => {\n    const closeReason = resolveCloseReason(reason)\n    reset()\n    onClose(closeReason)\n  }\n\n  const handleBack = () => {\n    skipCloseAnalytics.current = true\n    onBackClick?.()\n  }\n\n  const handleTextFocus = () => {\n    if (!hasTrackedFocus.current) {\n      hasTrackedFocus.current = true\n      onTextInputFocus?.()\n    }\n  }\n\n  const handleSubmit = () => {\n    skipCloseAnalytics.current = true\n    onSubmit(selected, isOther ? detail.trim() : undefined)\n    reset()\n  }\n\n  return (\n    <Dialog\n      copy={{ title, close_aria: closeAriaLabel }}\n      disablePrimaryButton={isSubmitDisabled}\n      isOpen={isOpen}\n      onClose={handleClose}\n      onPrimaryAction={handleSubmit}\n      onSecondaryAction={handleBack}\n      primaryText={primaryText}\n      secondaryText={secondaryText}\n      sx={{\n        '& .MuiDialogContent-root': { py: 0 },\n        '& .MuiDialog-paperScrollPaper': { bgcolor: 'background.paper' },\n        '& .MuiDialog-paper': {\n          outline: 'none',\n          '&:focus-visible': { outline: '2px solid', outlineColor: 'primary.main' },\n        },\n        '& .MuiButton-outlined': {\n          border: 'none',\n          '&:hover': { bgcolor: 'transparent', border: 'none' },\n        },\n      }}\n    >\n      <FormControl>\n        <RadioGroup\n          aria-label={title}\n          name=\"feedback-radio-group\"\n          onChange={(e) => setSelected(e.target.value)}\n          value={selected}\n        >\n          {options.map((option) => (\n            <FormControlLabel\n              control={<Radio sx={{ '& .MuiSvgIcon-root': { fontSize: 22 } }} />}\n              key={option}\n              label={option}\n              sx={{\n                '& .MuiFormControlLabel-label': {\n                  color: 'text.primary',\n                  fontSize: 15,\n                },\n              }}\n              value={option}\n            />\n          ))}\n        </RadioGroup>\n      </FormControl>\n\n      {isOther && (\n        <Stack sx={{ gap: 3, mt: 4 }}>\n          <TextField\n            autoFocus\n            maxRows={4}\n            minRows={4}\n            multiline={true}\n            onChange={(e) => setDetail(e.target.value)}\n            onFocus={handleTextFocus}\n            slotProps={{ htmlInput: { maxLength: characterLimit } }}\n            value={detail}\n          />\n          {characterLimitLabel && (\n            <Text sx={{ color: 'text.secondary', fontWeight: 400 }} variant=\"subtitle2\">\n              {characterLimitLabel}\n            </Text>\n          )}\n        </Stack>\n      )}\n    </Dialog>\n  )\n}\n\nexport default FeedbackDialog\n"],"mappings":"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"}
+{"version":3,"file":"FeedbackDialog.es.js","names":[],"sources":["../../../src/insights-v2/components/FeedbackDialog.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react'\n\nimport FormControl from '@mui/material/FormControl'\nimport FormControlLabel from '@mui/material/FormControlLabel'\nimport Radio from '@mui/material/Radio'\nimport RadioGroup from '@mui/material/RadioGroup'\nimport Stack from '@mui/material/Stack'\nimport TextField from '@mui/material/TextField'\n\nimport { Text } from '@mxenabled/mxui'\n\nimport { Dialog } from '../../common'\n\nconst CHARACTER_LIMIT = 250\n\nexport type FeedbackDialogCloseReason = 'closeButton' | 'backdropClick' | 'escapeKeyDown'\n\nexport interface FeedbackDialogProps {\n  title: string\n  options: string[]\n  characterLimit?: number\n  characterLimitLabel?: string\n  isOpen: boolean\n  onSubmit: (option: string, detail?: string) => void\n  /** Called on every close; `reason` is set for user-initiated closes (X/backdrop/escape), undefined on submit/back. */\n  onClose: (reason?: FeedbackDialogCloseReason) => void\n  onBackClick?: () => void\n  onTextInputFocus?: () => void\n  secondaryText: string\n  primaryText: string\n  closeAriaLabel: string\n}\n\n/** Generic feedback survey dialog. Last option shows detail text field. */\nconst FeedbackDialog = ({\n  isOpen,\n  onClose,\n  onSubmit,\n  title,\n  options,\n  characterLimit = CHARACTER_LIMIT,\n  characterLimitLabel,\n  secondaryText,\n  primaryText,\n  closeAriaLabel,\n  onBackClick,\n  onTextInputFocus,\n}: FeedbackDialogProps) => {\n  const [selected, setSelected] = useState('')\n  const [detail, setDetail] = useState('')\n  const hasTrackedFocus = useRef(false)\n  const skipCloseAnalytics = useRef(false)\n\n  useEffect(() => {\n    if (isOpen) {\n      hasTrackedFocus.current = false\n      skipCloseAnalytics.current = false\n    }\n  }, [isOpen])\n\n  if (options.length === 0) return null\n\n  const isOther = selected === options[options.length - 1]\n  const isSubmitDisabled = !selected || (isOther && !detail.trim())\n\n  const reset = () => {\n    setSelected('')\n    setDetail('')\n  }\n\n  const resolveCloseReason = (reason?: string): FeedbackDialogCloseReason | undefined => {\n    if (reason === 'backdropClick' || reason === 'escapeKeyDown') return reason\n    if (!skipCloseAnalytics.current) return 'closeButton'\n    return undefined\n  }\n\n  const handleClose = (_event?: unknown, reason?: string) => {\n    const closeReason = resolveCloseReason(reason)\n    reset()\n    onClose(closeReason)\n  }\n\n  const handleBack = () => {\n    skipCloseAnalytics.current = true\n    onBackClick?.()\n  }\n\n  const handleTextFocus = () => {\n    if (!hasTrackedFocus.current) {\n      hasTrackedFocus.current = true\n      onTextInputFocus?.()\n    }\n  }\n\n  const handleSubmit = () => {\n    skipCloseAnalytics.current = true\n    onSubmit(selected, isOther ? detail.trim() : undefined)\n    reset()\n  }\n\n  return (\n    <Dialog\n      copy={{ title, close_aria: closeAriaLabel }}\n      disablePrimaryButton={isSubmitDisabled}\n      isOpen={isOpen}\n      onClose={handleClose}\n      onPrimaryAction={handleSubmit}\n      onSecondaryAction={handleBack}\n      primaryText={primaryText}\n      secondaryText={secondaryText}\n      sx={{\n        '& .MuiDialogContent-root': { py: 0 },\n        '& .MuiDialog-paperScrollPaper': { bgcolor: 'background.paper' },\n        '& .MuiDialog-paper': {\n          outline: 'none',\n          '&:focus-visible': {\n            outline: '2px solid',\n            outlineColor: 'primary.main',\n          },\n        },\n        '& .MuiButton-outlined': {\n          border: 'none',\n          '&:hover': { bgcolor: 'transparent', border: 'none' },\n        },\n      }}\n    >\n      <FormControl>\n        <RadioGroup\n          aria-label={title}\n          name=\"feedback-radio-group\"\n          onChange={(e) => setSelected(e.target.value)}\n          value={selected}\n        >\n          {options.map((option) => (\n            <FormControlLabel\n              control={\n                <Radio\n                  sx={{\n                    '& .MuiSvgIcon-root': {\n                      fontSize: 22,\n                      color: 'action.active',\n                    },\n                  }}\n                />\n              }\n              key={option}\n              label={option}\n              sx={{\n                '& .MuiFormControlLabel-label': {\n                  color: 'text.primary',\n                  fontSize: 15,\n                },\n              }}\n              value={option}\n            />\n          ))}\n        </RadioGroup>\n      </FormControl>\n\n      {isOther && (\n        <Stack sx={{ gap: 3, mt: 4 }}>\n          <TextField\n            autoFocus\n            maxRows={4}\n            minRows={4}\n            multiline={true}\n            onChange={(e) => setDetail(e.target.value)}\n            onFocus={handleTextFocus}\n            slotProps={{ htmlInput: { maxLength: characterLimit } }}\n            value={detail}\n          />\n          {characterLimitLabel && (\n            <Text sx={{ color: 'text.secondary', fontWeight: 400 }} variant=\"subtitle2\">\n              {characterLimitLabel}\n            </Text>\n          )}\n        </Stack>\n      )}\n    </Dialog>\n  )\n}\n\nexport default FeedbackDialog\n"],"mappings":"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"}

package/dist/insights-v2/components/InsightOptionsMenu.es.js

@@ -1,54 +1,54 @@
-import { useGlobalCopyStore as m } from "../../common/context/hooks.es.js";
-import { useBeatActions as a } from "../beatActions.es.js";
-import { OverflowMenu as p } from "./OverflowMenu.es.js";
-import { observer as f } from "mobx-react-lite";
-import { Icon as l } from "@mxenabled/mx-icons";
+import { useGlobalCopyStore as c } from "../../common/context/hooks.es.js";
+import { useBeatActions as s } from "../beatActions.es.js";
+import { OverflowMenu as f } from "./OverflowMenu.es.js";
+import { observer as m } from "mobx-react-lite";
+import { Icon as t } from "@mxenabled/mx-icons";
 import { jsx as o } from "react/jsx-runtime";
-var d = f(() => {
-  const { onMenuAction: n } = a(), e = m().insights_feed?.overflow_menu;
-  if (!n || !e) return null;
-  const { onAction: t, onOpen: i, disabled: r } = n, s = [
+var v = m(() => {
+  const { onMenuAction: i } = s(), e = c().insights_feed?.overflow_menu;
+  if (!i || !e) return null;
+  const { onAction: n, onOpen: l, disabled: r } = i, a = [
     {
       key: "helpful",
-      icon: /* @__PURE__ */ o(l, {
+      icon: /* @__PURE__ */ o(t, {
         name: "thumb_up",
         size: 24,
-        sx: { color: "text.primary" }
+        sx: { color: "action.active" }
       }),
       label: e.helpful,
-      onSelect: () => t("helpful")
+      onSelect: () => n("helpful")
     },
     {
       key: "not_helpful",
-      icon: /* @__PURE__ */ o(l, {
+      icon: /* @__PURE__ */ o(t, {
         name: "thumb_down",
         size: 24,
-        sx: { color: "text.primary" }
+        sx: { color: "action.active" }
       }),
       label: e.not_helpful,
-      onSelect: () => t("not_helpful")
+      onSelect: () => n("not_helpful")
     },
     {
       key: "hide",
-      icon: /* @__PURE__ */ o(l, {
+      icon: /* @__PURE__ */ o(t, {
         name: "visibility_off",
         size: 24,
-        sx: { color: "text.primary" }
+        sx: { color: "action.active" }
       }),
       label: e.hide,
-      onSelect: () => t("hide")
+      onSelect: () => n("hide")
     }
   ];
-  return /* @__PURE__ */ o(p, {
+  return /* @__PURE__ */ o(f, {
     ariaLabel: e.aria_label,
     disabled: r,
-    items: s,
-    onOpen: i
+    items: a,
+    onOpen: l
   });
 });
 export {
-  d as InsightOptionsMenu,
-  d as default
+  v as InsightOptionsMenu,
+  v as default
 };
 
 //# sourceMappingURL=InsightOptionsMenu.es.js.map

package/dist/insights-v2/components/InsightOptionsMenu.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"InsightOptionsMenu.es.js","names":[],"sources":["../../../src/insights-v2/components/InsightOptionsMenu.tsx"],"sourcesContent":["import { observer } from 'mobx-react-lite'\n\nimport { Icon } from '@mxenabled/mx-icons'\n\nimport { useGlobalCopyStore } from '../../common'\n\nimport { useBeatActions } from '../beatActions'\n\nimport { OverflowMenu, type OverflowMenuItem } from './OverflowMenu'\n\n/** Overflow menu for insight cards. */\nexport const InsightOptionsMenu = observer(() => {\n  const { onMenuAction } = useBeatActions()\n  const copy = useGlobalCopyStore().insights_feed?.overflow_menu\n\n  if (!onMenuAction || !copy) return null\n\n  const { onAction, onOpen, disabled } = onMenuAction\n\n  const items: OverflowMenuItem[] = [\n    {\n      key: 'helpful',\n      icon: <Icon name=\"thumb_up\" size={24} sx={{ color: 'text.primary' }} />,\n      label: copy.helpful,\n      onSelect: () => onAction('helpful'),\n    },\n    {\n      key: 'not_helpful',\n      icon: <Icon name=\"thumb_down\" size={24} sx={{ color: 'text.primary' }} />,\n      label: copy.not_helpful,\n      onSelect: () => onAction('not_helpful'),\n    },\n    {\n      key: 'hide',\n      icon: <Icon name=\"visibility_off\" size={24} sx={{ color: 'text.primary' }} />,\n      label: copy.hide,\n      onSelect: () => onAction('hide'),\n    },\n  ]\n\n  return (\n    <OverflowMenu ariaLabel={copy.aria_label} disabled={disabled} items={items} onOpen={onOpen} />\n  )\n})\n\nexport default InsightOptionsMenu\n"],"mappings":";;;;;;AAWA,IAAa,IAAqB,EAAA,MAAe;AAC/C,QAAM,EAAE,cAAA,EAAA,IAAiB,EAAe,GAClC,IAAO,EAAmB,EAAE,eAAe;AAEjD,MAAI,CAAC,KAAgB,CAAC,EAAM,QAAO;AAEnC,QAAM,EAAE,UAAA,GAAU,QAAA,GAAQ,UAAA,EAAA,IAAa,GAEjC,IAA4B;AAAA,IAChC;AAAA,MACE,KAAK;AAAA,MACL,MAAM,gBAAA,EAAC,GAAD;AAAA,QAAM,MAAK;AAAA,QAAW,MAAM;AAAA,QAAI,IAAI,EAAE,OAAO,eAAe;AAAA,MAAI,CAAA;AAAA,MACtE,OAAO,EAAK;AAAA,MACZ,UAAA,MAAgB,EAAS,SAAS;AAAA,IACpC;AAAA,IACA;AAAA,MACE,KAAK;AAAA,MACL,MAAM,gBAAA,EAAC,GAAD;AAAA,QAAM,MAAK;AAAA,QAAa,MAAM;AAAA,QAAI,IAAI,EAAE,OAAO,eAAe;AAAA,MAAI,CAAA;AAAA,MACxE,OAAO,EAAK;AAAA,MACZ,UAAA,MAAgB,EAAS,aAAa;AAAA,IACxC;AAAA,IACA;AAAA,MACE,KAAK;AAAA,MACL,MAAM,gBAAA,EAAC,GAAD;AAAA,QAAM,MAAK;AAAA,QAAiB,MAAM;AAAA,QAAI,IAAI,EAAE,OAAO,eAAe;AAAA,MAAI,CAAA;AAAA,MAC5E,OAAO,EAAK;AAAA,MACZ,UAAA,MAAgB,EAAS,MAAM;AAAA,IACjC;AAAA,EACF;AAEA,SACE,gBAAA,EAAC,GAAD;AAAA,IAAc,WAAW,EAAK;AAAA,IAAsB,UAAA;AAAA,IAAiB,OAAA;AAAA,IAAe,QAAA;AAAA,EAAS,CAAA;AAEjG,CAAC"}
+{"version":3,"file":"InsightOptionsMenu.es.js","names":[],"sources":["../../../src/insights-v2/components/InsightOptionsMenu.tsx"],"sourcesContent":["import { observer } from 'mobx-react-lite'\n\nimport { Icon } from '@mxenabled/mx-icons'\n\nimport { useGlobalCopyStore } from '../../common'\n\nimport { useBeatActions } from '../beatActions'\n\nimport { OverflowMenu, type OverflowMenuItem } from './OverflowMenu'\n\n/** Overflow menu for insight cards. */\nexport const InsightOptionsMenu = observer(() => {\n  const { onMenuAction } = useBeatActions()\n  const copy = useGlobalCopyStore().insights_feed?.overflow_menu\n\n  if (!onMenuAction || !copy) return null\n\n  const { onAction, onOpen, disabled } = onMenuAction\n\n  const items: OverflowMenuItem[] = [\n    {\n      key: 'helpful',\n      icon: <Icon name=\"thumb_up\" size={24} sx={{ color: 'action.active' }} />,\n      label: copy.helpful,\n      onSelect: () => onAction('helpful'),\n    },\n    {\n      key: 'not_helpful',\n      icon: <Icon name=\"thumb_down\" size={24} sx={{ color: 'action.active' }} />,\n      label: copy.not_helpful,\n      onSelect: () => onAction('not_helpful'),\n    },\n    {\n      key: 'hide',\n      icon: <Icon name=\"visibility_off\" size={24} sx={{ color: 'action.active' }} />,\n      label: copy.hide,\n      onSelect: () => onAction('hide'),\n    },\n  ]\n\n  return (\n    <OverflowMenu ariaLabel={copy.aria_label} disabled={disabled} items={items} onOpen={onOpen} />\n  )\n})\n\nexport default InsightOptionsMenu\n"],"mappings":";;;;;;AAWA,IAAa,IAAqB,EAAA,MAAe;AAC/C,QAAM,EAAE,cAAA,EAAA,IAAiB,EAAe,GAClC,IAAO,EAAmB,EAAE,eAAe;AAEjD,MAAI,CAAC,KAAgB,CAAC,EAAM,QAAO;AAEnC,QAAM,EAAE,UAAA,GAAU,QAAA,GAAQ,UAAA,EAAA,IAAa,GAEjC,IAA4B;AAAA,IAChC;AAAA,MACE,KAAK;AAAA,MACL,MAAM,gBAAA,EAAC,GAAD;AAAA,QAAM,MAAK;AAAA,QAAW,MAAM;AAAA,QAAI,IAAI,EAAE,OAAO,gBAAgB;AAAA,MAAI,CAAA;AAAA,MACvE,OAAO,EAAK;AAAA,MACZ,UAAA,MAAgB,EAAS,SAAS;AAAA,IACpC;AAAA,IACA;AAAA,MACE,KAAK;AAAA,MACL,MAAM,gBAAA,EAAC,GAAD;AAAA,QAAM,MAAK;AAAA,QAAa,MAAM;AAAA,QAAI,IAAI,EAAE,OAAO,gBAAgB;AAAA,MAAI,CAAA;AAAA,MACzE,OAAO,EAAK;AAAA,MACZ,UAAA,MAAgB,EAAS,aAAa;AAAA,IACxC;AAAA,IACA;AAAA,MACE,KAAK;AAAA,MACL,MAAM,gBAAA,EAAC,GAAD;AAAA,QAAM,MAAK;AAAA,QAAiB,MAAM;AAAA,QAAI,IAAI,EAAE,OAAO,gBAAgB;AAAA,MAAI,CAAA;AAAA,MAC7E,OAAO,EAAK;AAAA,MACZ,UAAA,MAAgB,EAAS,MAAM;AAAA,IACjC;AAAA,EACF;AAEA,SACE,gBAAA,EAAC,GAAD;AAAA,IAAc,WAAW,EAAK;AAAA,IAAsB,UAAA;AAAA,IAAiB,OAAA;AAAA,IAAe,QAAA;AAAA,EAAS,CAAA;AAEjG,CAAC"}