@mx-cartographer/experiences 9.4.63 → 9.4.65

package/dist/core/utils/HelpUtil.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"HelpUtil.es.js","names":[],"sources":["../../../src/core/utils/HelpUtil.ts"],"sourcesContent":["import type { HelpCategory, Profile } from '../types/Help'\nimport { CategoryList } from '../types/localization/HelpCopy'\nimport { HELP_CATEGORIES } from '../constants/Help'\n\nconst isCategoryAccessibleByProfile = (category: HelpCategory, profile: Profile): boolean => {\n  if (category.guid === 'general' || category.guid === 'insights') return true\n  if (!category.flags) return false\n  return category.flags.every((flag) => profile[flag as keyof Profile])\n}\n\nexport const HelpUtil = (profile: Profile, categoryList: CategoryList): HelpCategory[] => {\n  const accessibleCategories: HelpCategory[] = []\n\n  for (const el of HELP_CATEGORIES) {\n    const category = categoryList[el.guid as keyof CategoryList]\n    if (!category) continue\n\n    const updatedCategory = {\n      ...el,\n      title: category.label,\n      topics: el.topics.map(({ topicKey }, index) => ({\n        topicKey,\n        label: category.topics[index],\n      })),\n    }\n    if (isCategoryAccessibleByProfile(updatedCategory, profile))\n      accessibleCategories.push(updatedCategory)\n  }\n\n  return accessibleCategories\n}\n"],"mappings":";AAIA,IAAM,IAAA,CAAiC,GAAwB,MACzD,EAAS,SAAS,aAAa,EAAS,SAAS,aAAmB,KACnE,EAAS,QACP,EAAS,MAAM,MAAA,CAAO,MAAS,EAAQ,CAAA,CAAsB,IADxC,IAIjB,IAAA,CAAY,GAAkB,MAA+C;AACxF,QAAM,IAAuC,CAAC;AAE9C,aAAW,KAAM,GAAiB;AAChC,UAAM,IAAW,EAAa,EAAG,IAAA;AACjC,QAAI,CAAC,EAAU;AAEf,UAAM,IAAkB;AAAA,MACtB,GAAG;AAAA,MACH,OAAO,EAAS;AAAA,MAChB,QAAQ,EAAG,OAAO,IAAA,CAAK,EAAE,UAAA,EAAA,GAAY,OAAW;AAAA,QAC9C,UAAA;AAAA,QACA,OAAO,EAAS,OAAO,CAAA;AAAA,MACzB,EAAE;AAAA,IACJ;AACA,IAAI,EAA8B,GAAiB,CAAO,KACxD,EAAqB,KAAK,CAAe;AAAA,EAC7C;AAEA,SAAO;AACT"}
+{"version":3,"file":"HelpUtil.es.js","names":[],"sources":["../../../src/core/utils/HelpUtil.ts"],"sourcesContent":["import type { HelpCategory, Profile } from '../types/Help'\nimport { CategoryList } from '../types/localization/HelpCopy'\nimport { HELP_CATEGORIES } from '../constants/Help'\n\nconst isCategoryAccessibleByProfile = (category: HelpCategory, profile: Profile): boolean => {\n  if (category.guid === 'general' || category.guid === 'insights') return true\n  if (!category.flags) return false\n  return category.flags.every((flag) => profile[flag as keyof Profile])\n}\n\nexport const HelpUtil = (profile: Profile, categoryList: CategoryList): HelpCategory[] => {\n  const accessibleCategories: HelpCategory[] = []\n\n  for (const el of HELP_CATEGORIES) {\n    const category = categoryList[el.guid as keyof CategoryList]\n    if (!category) continue\n\n    const topicLabels = category.topics ?? {}\n    const updatedCategory = {\n      ...el,\n      title: category.label,\n      // A definition entry whose copy is missing would otherwise produce a\n      // focusable row with no name, so drop it.\n      topics: el.topics.flatMap(({ topicKey }, index) => {\n        const label = topicLabels[index]\n        return label === undefined ? [] : [{ topicKey, label }]\n      }),\n    }\n    if (isCategoryAccessibleByProfile(updatedCategory, profile))\n      accessibleCategories.push(updatedCategory)\n  }\n\n  return accessibleCategories\n}\n"],"mappings":";AAIA,IAAM,IAAA,CAAiC,GAAwB,MACzD,EAAS,SAAS,aAAa,EAAS,SAAS,aAAmB,KACnE,EAAS,QACP,EAAS,MAAM,MAAA,CAAO,MAAS,EAAQ,CAAA,CAAsB,IADxC,IAIjB,IAAA,CAAY,GAAkB,MAA+C;AACxF,QAAM,IAAuC,CAAC;AAE9C,aAAW,KAAM,GAAiB;AAChC,UAAM,IAAW,EAAa,EAAG,IAAA;AACjC,QAAI,CAAC,EAAU;AAEf,UAAM,IAAc,EAAS,UAAU,CAAC,GAClC,IAAkB;AAAA,MACtB,GAAG;AAAA,MACH,OAAO,EAAS;AAAA,MAGhB,QAAQ,EAAG,OAAO,QAAA,CAAS,EAAE,UAAA,EAAA,GAAY,MAAU;AACjD,cAAM,IAAQ,EAAY,CAAA;AAC1B,eAAO,MAAU,SAAY,CAAC,IAAI,CAAC;AAAA,UAAE,UAAA;AAAA,UAAU,OAAA;AAAA,QAAM,CAAC;AAAA,MACxD,CAAC;AAAA,IACH;AACA,IAAI,EAA8B,GAAiB,CAAO,KACxD,EAAqB,KAAK,CAAe;AAAA,EAC7C;AAEA,SAAO;AACT"}

package/dist/help/components/Help.es.js

@@ -1,48 +1,59 @@
-import { useAppConfig as h, useEvent as T, useGlobalCopyStore as q, useHelpStore as C } from "../../common/context/hooks.es.js";
-import { useScreenSize as _ } from "../../common/hooks/useScreenSize.es.js";
-import { ANALYTICS_EVENTS as R } from "../../common/constants/Analytics.es.js";
-import { HelpList as x } from "./HelpList.es.js";
-import { HelpContent as H } from "./HelpContent.es.js";
-import { RequestSupport as g } from "./requestsupport/RequestSupport.es.js";
-import u from "react";
-import { jsx as o, jsxs as b } from "react/jsx-runtime";
-import d from "@mui/material/Box";
-var j = ({ sx: i = {} }) => {
-  const { config: s } = h(), { onEvent: c } = T(), { help: e } = q(), { helpCategories: a } = C(), { isMobile: m } = _(), [f, p] = u.useState(!1), [n, r] = u.useState(null), S = (t) => {
-    c(R.HELP_CLICK_TOPIC, {
-      feature: t.category,
-      helpTopic: t.pageTitle
-    }), r(t);
-  }, l = () => p(!0);
-  return /* @__PURE__ */ b(d, {
+import { useAppConfig as _, useEvent as R, useGlobalCopyStore as d, useHelpStore as x } from "../../common/context/hooks.es.js";
+import { useScreenSize as y } from "../../common/hooks/useScreenSize.es.js";
+import { ANALYTICS_EVENTS as H } from "../../common/constants/Analytics.es.js";
+import g from "../../common/components/ErrorBoundary.es.js";
+import { HelpList as E } from "./HelpList.es.js";
+import { HelpContent as O } from "./HelpContent.es.js";
+import { RequestSupport as b } from "./requestsupport/RequestSupport.es.js";
+import p from "react";
+import { jsx as s, jsxs as I } from "react/jsx-runtime";
+import L from "@mui/material/Box";
+var V = ({ sx: a = {} }) => {
+  const { config: n } = _(), { onEvent: m } = R(), { help: t } = d(), { helpCategories: S } = x(), { isMobile: f } = y(), [h, o] = p.useState(!1), [r, l] = p.useState(null), [C, u] = p.useState(""), c = (e) => {
+    m(H.HELP_CLICK_TOPIC, {
+      feature: e.category,
+      helpTopic: e.pageTitle
+    }), l(e);
+  }, i = () => o(!0), T = (e) => {
+    u(e), o(!0);
+  }, q = () => {
+    o(!1), u("");
+  };
+  return /* @__PURE__ */ I(L, {
     sx: {
       pt: 24,
-      px: m ? 24 : 0,
-      ...i
+      px: f ? 24 : 0,
+      ...a
     },
-    children: [n ? /* @__PURE__ */ o(H, {
-      copy: e,
-      hasRequestButton: s.enable_support_requests,
-      onNavigateToList: () => r(null),
-      onRequestSupport: l,
-      topicInfo: n
-    }) : /* @__PURE__ */ o(x, {
-      buttonText: e.request_support,
-      hasRequestButton: s.enable_support_requests,
-      helpCategories: a,
-      helpContent: e.list_short_content,
-      helpTitle: e.list_title,
-      onRequestHelp: l,
-      onTopicSelect: S
-    }), /* @__PURE__ */ o(g, {
-      copy: e,
-      isOpen: f,
-      onClose: () => p(!1)
-    })]
+    children: [r ? /* @__PURE__ */ s(O, {
+      copy: t,
+      hasRequestButton: n.enable_support_requests,
+      onNavigateToList: () => l(null),
+      onOpenCase: T,
+      onRequestSupport: i,
+      topicInfo: r
+    }) : /* @__PURE__ */ s(E, {
+      buttonText: t.request_support,
+      copy: t,
+      hasRequestButton: n.enable_support_requests,
+      helpCategories: S,
+      helpContent: t.list_short_content,
+      helpTitle: t.list_title,
+      onRequestHelp: i,
+      onTopicSelect: c
+    }), /* @__PURE__ */ s(g, { children: /* @__PURE__ */ s(b, {
+      caseTopic: C,
+      copy: t,
+      isOpen: h,
+      onTopicSelect: (e) => {
+        c(e), o(!1);
+      },
+      onClose: q
+    }) })]
   });
 };
 export {
-  j as Help
+  V as Help
 };
 
 //# sourceMappingURL=Help.es.js.map

package/dist/help/components/Help.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"Help.es.js","names":[],"sources":["../../../src/help/components/Help.tsx"],"sourcesContent":["import React from 'react'\n\nimport Box from '@mui/material/Box'\n\nimport {\n  ANALYTICS_EVENTS,\n  useAppConfig,\n  useEvent,\n  useGlobalCopyStore,\n  useHelpStore,\n  useScreenSize,\n} from '../../common'\nimport { type SelectedTopic } from '../../core'\n\nimport { HelpList } from './HelpList'\nimport { HelpContent } from './HelpContent'\nimport { RequestSupport } from './requestsupport'\nimport type { SxProps } from '@mui/material/styles'\n\ninterface HelpProps {\n  sx?: SxProps\n}\n\nexport const Help = ({ sx = {} }: HelpProps) => {\n  const { config } = useAppConfig()\n  const { onEvent } = useEvent()\n  const { help: helpCopy } = useGlobalCopyStore()\n  const { helpCategories } = useHelpStore()\n  const { isMobile } = useScreenSize()\n\n  const [isRequestSupportOpen, setIsRequestSupportOpen] = React.useState(false)\n  const [selectedTopic, setSelectedTopic] = React.useState<SelectedTopic | null>(null)\n\n  const handleTopicSelect = (topic: SelectedTopic) => {\n    onEvent(ANALYTICS_EVENTS.HELP_CLICK_TOPIC, {\n      feature: topic.category,\n      helpTopic: topic.pageTitle,\n    })\n\n    setSelectedTopic(topic)\n  }\n  const handleRequestHelp = () => setIsRequestSupportOpen(true)\n\n  return (\n    <Box sx={{ pt: 24, px: isMobile ? 24 : 0, ...sx }}>\n      {!selectedTopic ? (\n        <HelpList\n          buttonText={helpCopy.request_support}\n          hasRequestButton={config.enable_support_requests}\n          helpCategories={helpCategories}\n          helpContent={helpCopy.list_short_content}\n          helpTitle={helpCopy.list_title}\n          onRequestHelp={handleRequestHelp}\n          onTopicSelect={handleTopicSelect}\n        />\n      ) : (\n        <HelpContent\n          copy={helpCopy}\n          hasRequestButton={config.enable_support_requests}\n          onNavigateToList={() => setSelectedTopic(null)}\n          onRequestSupport={handleRequestHelp}\n          topicInfo={selectedTopic}\n        />\n      )}\n      <RequestSupport\n        copy={helpCopy}\n        isOpen={isRequestSupportOpen}\n        onClose={() => setIsRequestSupportOpen(false)}\n      />\n    </Box>\n  )\n}\n"],"mappings":";;;;;;;;;AAuBA,IAAa,IAAA,CAAQ,EAAE,IAAA,IAAK,CAAC,EAAA,MAAmB;AAC9C,QAAM,EAAE,QAAA,EAAA,IAAW,EAAa,GAC1B,EAAE,SAAA,EAAA,IAAY,EAAS,GACvB,EAAE,MAAM,EAAA,IAAa,EAAmB,GACxC,EAAE,gBAAA,EAAA,IAAmB,EAAa,GAClC,EAAE,UAAA,EAAA,IAAa,EAAc,GAE7B,CAAC,GAAsB,CAAA,IAA2B,EAAM,SAAS,EAAK,GACtE,CAAC,GAAe,CAAA,IAAoB,EAAM,SAA+B,IAAI,GAE7E,IAAA,CAAqB,MAAyB;AAClD,IAAA,EAAQ,EAAiB,kBAAkB;AAAA,MACzC,SAAS,EAAM;AAAA,MACf,WAAW,EAAM;AAAA,IACnB,CAAC,GAED,EAAiB,CAAK;AAAA,EACxB,GACM,IAAA,MAA0B,EAAwB,EAAI;AAE5D,SACE,gBAAA,EAAC,GAAD;AAAA,IAAK,IAAI;AAAA,MAAE,IAAI;AAAA,MAAI,IAAI,IAAW,KAAK;AAAA,MAAG,GAAG;AAAA,IAAG;AAAA,IAAhD,UAAA,CACI,IAWA,gBAAA,EAAC,GAAD;AAAA,MACE,MAAM;AAAA,MACN,kBAAkB,EAAO;AAAA,MACzB,kBAAA,MAAwB,EAAiB,IAAI;AAAA,MAC7C,kBAAkB;AAAA,MAClB,WAAW;AAAA,IACZ,CAAA,IAhBD,gBAAA,EAAC,GAAD;AAAA,MACE,YAAY,EAAS;AAAA,MACrB,kBAAkB,EAAO;AAAA,MACT,gBAAA;AAAA,MAChB,aAAa,EAAS;AAAA,MACtB,WAAW,EAAS;AAAA,MACpB,eAAe;AAAA,MACf,eAAe;AAAA,IAChB,CAAA,GAUH,gBAAA,EAAC,GAAD;AAAA,MACE,MAAM;AAAA,MACN,QAAQ;AAAA,MACR,SAAA,MAAe,EAAwB,EAAK;AAAA,IAC7C,CAAA,CACE;AAAA;AAET"}
+{"version":3,"file":"Help.es.js","names":[],"sources":["../../../src/help/components/Help.tsx"],"sourcesContent":["import React from 'react'\n\nimport Box from '@mui/material/Box'\n\nimport {\n  ANALYTICS_EVENTS,\n  ErrorBoundary,\n  useAppConfig,\n  useEvent,\n  useGlobalCopyStore,\n  useHelpStore,\n  useScreenSize,\n} from '../../common'\nimport { type SelectedTopic } from '../../core'\n\nimport { HelpList } from './HelpList'\nimport { HelpContent } from './HelpContent'\nimport { RequestSupport } from './requestsupport'\nimport type { SxProps } from '@mui/material/styles'\n\ninterface HelpProps {\n  sx?: SxProps\n}\n\nexport const Help = ({ sx = {} }: HelpProps) => {\n  const { config } = useAppConfig()\n  const { onEvent } = useEvent()\n  const { help: helpCopy } = useGlobalCopyStore()\n  const { helpCategories } = useHelpStore()\n  const { isMobile } = useScreenSize()\n\n  const [isRequestSupportOpen, setIsRequestSupportOpen] = React.useState(false)\n  const [selectedTopic, setSelectedTopic] = React.useState<SelectedTopic | null>(null)\n  const [caseTopic, setCaseTopic] = React.useState('')\n\n  const handleTopicSelect = (topic: SelectedTopic) => {\n    onEvent(ANALYTICS_EVENTS.HELP_CLICK_TOPIC, {\n      feature: topic.category,\n      helpTopic: topic.pageTitle,\n    })\n\n    setSelectedTopic(topic)\n  }\n  const handleRequestHelp = () => setIsRequestSupportOpen(true)\n\n  const handleOpenCase = (topic: string) => {\n    setCaseTopic(topic)\n    setIsRequestSupportOpen(true)\n  }\n\n  const handleCloseRequestSupport = () => {\n    setIsRequestSupportOpen(false)\n    setCaseTopic('')\n  }\n\n  return (\n    <Box sx={{ pt: 24, px: isMobile ? 24 : 0, ...sx }}>\n      {!selectedTopic ? (\n        <HelpList\n          buttonText={helpCopy.request_support}\n          copy={helpCopy}\n          hasRequestButton={config.enable_support_requests}\n          helpCategories={helpCategories}\n          helpContent={helpCopy.list_short_content}\n          helpTitle={helpCopy.list_title}\n          onRequestHelp={handleRequestHelp}\n          onTopicSelect={handleTopicSelect}\n        />\n      ) : (\n        <HelpContent\n          copy={helpCopy}\n          hasRequestButton={config.enable_support_requests}\n          onNavigateToList={() => setSelectedTopic(null)}\n          onOpenCase={handleOpenCase}\n          onRequestSupport={handleRequestHelp}\n          topicInfo={selectedTopic}\n        />\n      )}\n      <ErrorBoundary>\n        <RequestSupport\n          caseTopic={caseTopic}\n          copy={helpCopy}\n          isOpen={isRequestSupportOpen}\n          onTopicSelect={(topic) => {\n            handleTopicSelect(topic)\n            setIsRequestSupportOpen(false)\n          }}\n          onClose={handleCloseRequestSupport}\n        />\n      </ErrorBoundary>\n    </Box>\n  )\n}\n"],"mappings":";;;;;;;;;;AAwBA,IAAa,IAAA,CAAQ,EAAE,IAAA,IAAK,CAAC,EAAA,MAAmB;AAC9C,QAAM,EAAE,QAAA,EAAA,IAAW,EAAa,GAC1B,EAAE,SAAA,EAAA,IAAY,EAAS,GACvB,EAAE,MAAM,EAAA,IAAa,EAAmB,GACxC,EAAE,gBAAA,EAAA,IAAmB,EAAa,GAClC,EAAE,UAAA,EAAA,IAAa,EAAc,GAE7B,CAAC,GAAsB,CAAA,IAA2B,EAAM,SAAS,EAAK,GACtE,CAAC,GAAe,CAAA,IAAoB,EAAM,SAA+B,IAAI,GAC7E,CAAC,GAAW,CAAA,IAAgB,EAAM,SAAS,EAAE,GAE7C,IAAA,CAAqB,MAAyB;AAClD,IAAA,EAAQ,EAAiB,kBAAkB;AAAA,MACzC,SAAS,EAAM;AAAA,MACf,WAAW,EAAM;AAAA,IACnB,CAAC,GAED,EAAiB,CAAK;AAAA,EACxB,GACM,IAAA,MAA0B,EAAwB,EAAI,GAEtD,IAAA,CAAkB,MAAkB;AACxC,IAAA,EAAa,CAAK,GAClB,EAAwB,EAAI;AAAA,EAC9B,GAEM,IAAA,MAAkC;AACtC,IAAA,EAAwB,EAAK,GAC7B,EAAa,EAAE;AAAA,EACjB;AAEA,SACE,gBAAA,EAAC,GAAD;AAAA,IAAK,IAAI;AAAA,MAAE,IAAI;AAAA,MAAI,IAAI,IAAW,KAAK;AAAA,MAAG,GAAG;AAAA,IAAG;AAAA,IAAhD,UAAA,CACI,IAYA,gBAAA,EAAC,GAAD;AAAA,MACE,MAAM;AAAA,MACN,kBAAkB,EAAO;AAAA,MACzB,kBAAA,MAAwB,EAAiB,IAAI;AAAA,MAC7C,YAAY;AAAA,MACZ,kBAAkB;AAAA,MAClB,WAAW;AAAA,IACZ,CAAA,IAlBD,gBAAA,EAAC,GAAD;AAAA,MACE,YAAY,EAAS;AAAA,MACrB,MAAM;AAAA,MACN,kBAAkB,EAAO;AAAA,MACT,gBAAA;AAAA,MAChB,aAAa,EAAS;AAAA,MACtB,WAAW,EAAS;AAAA,MACpB,eAAe;AAAA,MACf,eAAe;AAAA,IAChB,CAAA,GAWH,gBAAA,EAAC,GAAD,EAAA,UACE,gBAAA,EAAC,GAAD;AAAA,MACa,WAAA;AAAA,MACX,MAAM;AAAA,MACN,QAAQ;AAAA,MACR,eAAA,CAAgB,MAAU;AACxB,QAAA,EAAkB,CAAK,GACvB,EAAwB,EAAK;AAAA,MAC/B;AAAA,MACA,SAAS;AAAA,IACV,CAAA,EACY,CAAA,CACZ;AAAA;AAET"}

package/dist/help/components/HelpContent.es.js

@@ -1,25 +1,46 @@
-import { useGlobalCopyStore as f } from "../../common/context/hooks.es.js";
-import a from "../../common/components/ErrorBoundary.es.js";
-import { Header as u } from "./content/Header.es.js";
-import { contentSection as C } from "./content/section/index.es.js";
-import y from "react";
-import { jsx as o, jsxs as d } from "react/jsx-runtime";
-var g = ({ copy: r, hasRequestButton: e = !1, onNavigateToList: n, onRequestSupport: p, topicInfo: { category: m, pageTitle: i, topicKey: l, guid: c } }) => {
-  const { help: s } = f(), t = C[c] || null;
-  return /* @__PURE__ */ d(y.Fragment, { children: [/* @__PURE__ */ o(u, {
-    buttonCopy: r.request_support,
-    hasRequestButton: e,
-    onNavigateToList: n,
-    onRequestSupport: p,
-    title: m,
-    topicTitle: i
-  }), /* @__PURE__ */ o(a, { children: t && /* @__PURE__ */ o(t, {
-    copy: s,
-    topicKey: l
-  }) })] });
+import { useEvent as S, useGlobalCopyStore as a } from "../../common/context/hooks.es.js";
+import { ANALYTICS_EVENTS as m } from "../../common/constants/Analytics.es.js";
+import d from "../../common/components/ErrorBoundary.es.js";
+import { Header as x } from "./content/Header.es.js";
+import { contentSection as A } from "./content/section/index.es.js";
+import { SupportPrompt as I } from "./SupportPrompt.es.js";
+import i from "react";
+import { jsx as t, jsxs as c } from "react/jsx-runtime";
+import L from "@mui/material/Divider";
+var F = ({ copy: r, hasRequestButton: e = !1, onNavigateToList: s, onOpenCase: _, onRequestSupport: C, topicInfo: { category: E, pageTitle: o, topicKey: f, guid: u } }) => {
+  const { help: l } = a(), n = A[u] || null, { onEvent: p } = S();
+  return /* @__PURE__ */ c(i.Fragment, { children: [
+    /* @__PURE__ */ t(x, {
+      buttonCopy: r.request_support,
+      hasRequestButton: e,
+      onNavigateToList: s,
+      onRequestSupport: C,
+      title: E,
+      topicTitle: o
+    }),
+    /* @__PURE__ */ t(d, { children: n && /* @__PURE__ */ t(n, {
+      copy: l,
+      topicKey: f
+    }) }),
+    e && /* @__PURE__ */ c(i.Fragment, { children: [/* @__PURE__ */ t(L, { sx: { mt: 24 } }), /* @__PURE__ */ t(I, {
+      actionText: r.request_support_footer_button,
+      onAction: () => {
+        p(m.HELP_CLICK_OPEN_CASE, {
+          source: "article",
+          topic: o
+        }), _?.(o);
+      },
+      onPrompt: () => p(m.HELP_CLICK_NEED_MORE_ASSISTANCE, {
+        source: "article",
+        topic: o
+      }),
+      promptText: r.need_more_assistance,
+      sx: { py: 24 }
+    }, o)] })
+  ] });
 };
 export {
-  g as HelpContent
+  F as HelpContent
 };
 
 //# sourceMappingURL=HelpContent.es.js.map

package/dist/help/components/HelpContent.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"HelpContent.es.js","names":[],"sources":["../../../src/help/components/HelpContent.tsx"],"sourcesContent":["import React from 'react'\n\nimport { ErrorBoundary, useGlobalCopyStore } from '../../common'\nimport { type HelpContentProps } from '../../core'\n\nimport { Header } from './content'\nimport { contentSection } from './content/section'\n\nexport const HelpContent: React.FC<HelpContentProps> = ({\n  copy,\n  hasRequestButton = false,\n  onNavigateToList,\n  onRequestSupport,\n  topicInfo: { category, pageTitle, topicKey, guid },\n}) => {\n  const { help: helpCopy } = useGlobalCopyStore()\n  const ContentComponent = contentSection[guid as keyof typeof contentSection] || null\n\n  return (\n    <React.Fragment>\n      <Header\n        buttonCopy={copy.request_support}\n        hasRequestButton={hasRequestButton}\n        onNavigateToList={onNavigateToList}\n        onRequestSupport={onRequestSupport}\n        title={category}\n        topicTitle={pageTitle}\n      />\n      <ErrorBoundary>\n        {ContentComponent && <ContentComponent copy={helpCopy} topicKey={topicKey} />}\n      </ErrorBoundary>\n    </React.Fragment>\n  )\n}\n"],"mappings":";;;;;;AAQA,IAAa,IAAA,CAA2C,EACtD,MAAA,GACA,kBAAA,IAAmB,IACnB,kBAAA,GACA,kBAAA,GACA,WAAW,EAAE,UAAA,GAAU,WAAA,GAAW,UAAA,GAAU,MAAA,EAAA,EAAA,MACxC;AACJ,QAAM,EAAE,MAAM,EAAA,IAAa,EAAmB,GACxC,IAAmB,EAAe,CAAA,KAAwC;AAEhF,SACE,gBAAA,EAAC,EAAM,UAAP,EAAA,UAAA,CACE,gBAAA,EAAC,GAAD;AAAA,IACE,YAAY,EAAK;AAAA,IACC,kBAAA;AAAA,IACA,kBAAA;AAAA,IACA,kBAAA;AAAA,IAClB,OAAO;AAAA,IACP,YAAY;AAAA,EACb,CAAA,GACD,gBAAA,EAAC,GAAD,EAAA,UACG,KAAoB,gBAAA,EAAC,GAAD;AAAA,IAAkB,MAAM;AAAA,IAAoB,UAAA;AAAA,EAAW,CAAA,EAC/D,CAAA,CACD,EAAA,CAAA;AAEpB"}
+{"version":3,"file":"HelpContent.es.js","names":[],"sources":["../../../src/help/components/HelpContent.tsx"],"sourcesContent":["import React from 'react'\n\nimport Divider from '@mui/material/Divider'\n\nimport { ANALYTICS_EVENTS, ErrorBoundary, useEvent, useGlobalCopyStore } from '../../common'\nimport { type HelpContentProps } from '../../core'\n\nimport { Header } from './content'\nimport { contentSection } from './content/section'\nimport { SupportPrompt } from './SupportPrompt'\n\nexport const HelpContent: React.FC<HelpContentProps> = ({\n  copy,\n  hasRequestButton = false,\n  onNavigateToList,\n  onOpenCase,\n  onRequestSupport,\n  topicInfo: { category, pageTitle, topicKey, guid },\n}) => {\n  const { help: helpCopy } = useGlobalCopyStore()\n  const ContentComponent = contentSection[guid as keyof typeof contentSection] || null\n  const { onEvent } = useEvent()\n\n  return (\n    <React.Fragment>\n      <Header\n        buttonCopy={copy.request_support}\n        hasRequestButton={hasRequestButton}\n        onNavigateToList={onNavigateToList}\n        onRequestSupport={onRequestSupport}\n        title={category}\n        topicTitle={pageTitle}\n      />\n      <ErrorBoundary>\n        {ContentComponent && <ContentComponent copy={helpCopy} topicKey={topicKey} />}\n      </ErrorBoundary>\n      {hasRequestButton && (\n        <React.Fragment>\n          <Divider sx={{ mt: 24 }} />\n          <SupportPrompt\n            actionText={copy.request_support_footer_button}\n            key={pageTitle}\n            onAction={() => {\n              onEvent(ANALYTICS_EVENTS.HELP_CLICK_OPEN_CASE, {\n                source: 'article',\n                topic: pageTitle,\n              })\n\n              onOpenCase?.(pageTitle)\n            }}\n            onPrompt={() =>\n              onEvent(ANALYTICS_EVENTS.HELP_CLICK_NEED_MORE_ASSISTANCE, {\n                source: 'article',\n                topic: pageTitle,\n              })\n            }\n            promptText={copy.need_more_assistance}\n            sx={{ py: 24 }}\n          />\n        </React.Fragment>\n      )}\n    </React.Fragment>\n  )\n}\n"],"mappings":";;;;;;;;;AAWA,IAAa,IAAA,CAA2C,EACtD,MAAA,GACA,kBAAA,IAAmB,IACnB,kBAAA,GACA,YAAA,GACA,kBAAA,GACA,WAAW,EAAE,UAAA,GAAU,WAAA,GAAW,UAAA,GAAU,MAAA,EAAA,EAAA,MACxC;AACJ,QAAM,EAAE,MAAM,EAAA,IAAa,EAAmB,GACxC,IAAmB,EAAe,CAAA,KAAwC,MAC1E,EAAE,SAAA,EAAA,IAAY,EAAS;AAE7B,SACE,gBAAA,EAAC,EAAM,UAAP,EAAA,UAAA;AAAA,IACE,gBAAA,EAAC,GAAD;AAAA,MACE,YAAY,EAAK;AAAA,MACC,kBAAA;AAAA,MACA,kBAAA;AAAA,MACA,kBAAA;AAAA,MAClB,OAAO;AAAA,MACP,YAAY;AAAA,IACb,CAAA;AAAA,IACD,gBAAA,EAAC,GAAD,EAAA,UACG,KAAoB,gBAAA,EAAC,GAAD;AAAA,MAAkB,MAAM;AAAA,MAAoB,UAAA;AAAA,IAAW,CAAA,EAC/D,CAAA;AAAA,IACd,KACC,gBAAA,EAAC,EAAM,UAAP,EAAA,UAAA,CACE,gBAAA,EAAC,GAAD,EAAS,IAAI,EAAE,IAAI,GAAG,EAAI,CAAA,GAC1B,gBAAA,EAAC,GAAD;AAAA,MACE,YAAY,EAAK;AAAA,MAEjB,UAAA,MAAgB;AACd,QAAA,EAAQ,EAAiB,sBAAsB;AAAA,UAC7C,QAAQ;AAAA,UACR,OAAO;AAAA,QACT,CAAC,GAED,IAAa,CAAS;AAAA,MACxB;AAAA,MACA,UAAA,MACE,EAAQ,EAAiB,iCAAiC;AAAA,QACxD,QAAQ;AAAA,QACR,OAAO;AAAA,MACT,CAAC;AAAA,MAEH,YAAY,EAAK;AAAA,MACjB,IAAI,EAAE,IAAI,GAAG;AAAA,IACd,GAjBM,CAiBN,CACa,EAAA,CAAA;AAAA,EAEJ,EAAA,CAAA;AAEpB"}

package/dist/help/components/HelpList.d.ts

@@ -1,7 +1,8 @@
 import { default as React } from 'react';
-import { HelpCategory, SelectedTopic } from '../../core';
+import { HelpCategory, HelpCopy, SelectedTopic } from '../../core';
 export interface HelpListProps {
     buttonText: string;
+    copy: HelpCopy;
     hasRequestButton?: boolean;
     helpCategories: HelpCategory[];
     helpContent: string;

package/dist/help/components/HelpList.es.js

@@ -1,139 +1,182 @@
-import { useEvent as S } from "../../common/context/hooks.es.js";
-import { ANALYTICS_EVENTS as h } from "../../common/constants/Analytics.es.js";
-import _, { useState as T } from "react";
+import { useEvent as B } from "../../common/context/hooks.es.js";
+import { ANALYTICS_EVENTS as m } from "../../common/constants/Analytics.es.js";
+import _, { useState as H } from "react";
 import o from "@mui/material/Stack";
-import { H3 as k, Icon as B, P as D, Text as u } from "@mxenabled/mxui";
-import H from "@mui/material/Button";
-import { ExpandMore as j } from "@mxenabled/mx-icons";
+import { H3 as U, Icon as j, P as E, Text as l } from "@mxenabled/mxui";
+import y from "@mui/material/Button";
+import { ExpandMore as w } from "@mxenabled/mx-icons";
 import { jsx as r, jsxs as e } from "react/jsx-runtime";
-import w from "@mui/material/Divider";
+import v from "@mui/material/Divider";
 import M from "@mui/material/List";
 import N from "@mui/material/ListItemButton";
-import G from "@mui/material/Grid";
-import O from "@mui/material/Accordion";
-import U from "@mui/material/AccordionDetails";
-import z from "@mui/material/AccordionSummary";
-var ir = ({ buttonText: c, hasRequestButton: f = !1, helpCategories: n = [], helpContent: g, helpTitle: b, onRequestHelp: E, onTopicSelect: v }) => {
-  const [y, R] = T(null), m = Math.ceil(n.length / 2), { onEvent: l } = S();
-  return /* @__PURE__ */ e(_.Fragment, { children: [/* @__PURE__ */ e(G, {
-    container: !0,
-    sx: {
-      alignItems: "center",
-      justifyContent: "space-between",
-      mb: 24
-    },
-    children: [/* @__PURE__ */ e(o, { children: [/* @__PURE__ */ r(k, { children: b }), /* @__PURE__ */ r(D, {
-      variant: "body1",
-      children: g
-    })] }), f && /* @__PURE__ */ r(o, {
-      sx: { pt: {
-        xs: 12,
-        md: 0
-      } },
-      children: /* @__PURE__ */ r(H, {
-        "aria-label": c,
-        onClick: () => {
-          l(h.HELP_CLICK_REQUEST_SUPPORT, {}), E();
-        },
-        variant: "contained",
-        children: c
-      })
-    })]
-  }), /* @__PURE__ */ r(o, {
-    sx: {
-      flexDirection: {
-        xs: "column",
-        md: "row"
+import O from "@mui/material/Grid";
+import W from "@mui/material/Accordion";
+import F from "@mui/material/AccordionDetails";
+import G from "@mui/material/AccordionSummary";
+var ir = ({ buttonText: i, copy: p, hasRequestButton: x = !1, helpCategories: a = [], helpContent: P, helpTitle: C, onRequestHelp: h, onTopicSelect: I }) => {
+  const [L, A] = H(null), f = Math.ceil(a.length / 2), { onEvent: c } = B();
+  return /* @__PURE__ */ e(_.Fragment, { children: [
+    /* @__PURE__ */ e(O, {
+      container: !0,
+      sx: {
+        alignItems: "center",
+        justifyContent: "space-between",
+        mb: 24
       },
-      gap: 12
-    },
-    children: [0, 1].map((d) => {
-      const s = d === 0 ? 0 : m, I = d === 0 ? m : n.length, L = n.slice(s, I);
-      return /* @__PURE__ */ r(o, {
-        sx: {
-          flex: 1,
-          gap: 12,
-          maxWidth: { md: "calc(50% - 6px)" }
+      children: [/* @__PURE__ */ e(o, { children: [/* @__PURE__ */ r(U, { children: C }), /* @__PURE__ */ r(E, {
+        variant: "body1",
+        children: P
+      })] }), x && /* @__PURE__ */ r(o, {
+        sx: { pt: {
+          xs: 12,
+          md: 0
+        } },
+        children: /* @__PURE__ */ r(y, {
+          "aria-label": i,
+          onClick: () => {
+            c(m.HELP_CLICK_REQUEST_SUPPORT, { source: "header" }), h();
+          },
+          variant: "contained",
+          children: i
+        })
+      })]
+    }),
+    /* @__PURE__ */ r(o, {
+      sx: {
+        flexDirection: {
+          xs: "column",
+          md: "row"
         },
-        children: L.map(({ guid: p, icon: P, topics: A, title: a }, C) => {
-          const x = C + s;
-          return /* @__PURE__ */ e(O, {
-            disableGutters: !0,
-            expanded: x === y,
-            onChange: (t, i) => {
-              l(h.HELP_EXPAND_TOPIC, { feature: a }), R(i ? x : null);
-            },
-            sx: (t) => ({
-              border: `1px solid ${t.palette.neutral?.light}`,
-              borderRadius: "8px !important",
-              "&:before": { opacity: 0 },
-              "& .MuiAccordion-region": {
-                bgcolor: "background.default",
-                borderBottomLeftRadius: 8,
-                borderBottomRightRadius: 8
-              }
-            }),
-            children: [
-              /* @__PURE__ */ r(z, {
-                expandIcon: /* @__PURE__ */ r(j, { sx: { color: "text.primary" } }),
-                sx: {
-                  height: 64,
-                  p: "14px 24px"
-                },
-                children: /* @__PURE__ */ e(o, {
+        gap: 12
+      },
+      children: [0, 1].map((d) => {
+        const g = d === 0 ? 0 : f, R = d === 0 ? f : a.length, S = a.slice(g, R);
+        return /* @__PURE__ */ r(o, {
+          sx: {
+            flex: 1,
+            gap: 12,
+            maxWidth: { md: "calc(50% - 6px)" }
+          },
+          children: S.map(({ guid: u, icon: T, topics: k, title: s }, D) => {
+            const b = D + g;
+            return /* @__PURE__ */ e(W, {
+              disableGutters: !0,
+              expanded: b === L,
+              onChange: (t, n) => {
+                c(m.HELP_EXPAND_TOPIC, { feature: s }), A(n ? b : null);
+              },
+              sx: (t) => ({
+                border: `1px solid ${t.palette.neutral?.light}`,
+                borderRadius: "8px !important",
+                "&:before": { opacity: 0 },
+                "& .MuiAccordion-region": {
+                  bgcolor: "background.default",
+                  borderBottomLeftRadius: 8,
+                  borderBottomRightRadius: 8
+                }
+              }),
+              children: [
+                /* @__PURE__ */ r(G, {
+                  expandIcon: /* @__PURE__ */ r(w, { sx: { color: "text.primary" } }),
                   sx: {
-                    alignItems: "center",
-                    flexDirection: "row",
-                    gap: 12
+                    height: 64,
+                    p: "14px 24px"
                   },
-                  children: [/* @__PURE__ */ r(B, {
-                    name: P,
-                    size: 24
-                  }), /* @__PURE__ */ r(u, {
-                    variant: "body1",
-                    children: a
-                  })]
-                })
-              }),
-              /* @__PURE__ */ r(w, {}),
-              /* @__PURE__ */ r(U, {
-                sx: {
-                  ml: 56,
-                  p: 0
-                },
-                children: /* @__PURE__ */ r(M, {
-                  disablePadding: !0,
-                  children: A.map(({ label: t, topicKey: i }) => /* @__PURE__ */ r(N, {
-                    "aria-label": t,
-                    divider: !0,
-                    onClick: () => v({
-                      guid: p,
-                      category: a,
-                      pageTitle: t,
-                      topicKey: i
-                    }),
+                  children: /* @__PURE__ */ e(o, {
                     sx: {
-                      pl: "6px !important",
-                      borderColor: "neutral.light",
-                      "&:last-child": {
-                        border: "none !important",
-                        borderBottomRightRadius: 7
-                      }
+                      alignItems: "center",
+                      flexDirection: "row",
+                      gap: 12
                     },
-                    children: /* @__PURE__ */ r(u, {
-                      color: "text.secondary",
-                      variant: "body2",
-                      children: t
-                    })
-                  }, i))
+                    children: [/* @__PURE__ */ r(j, {
+                      name: T,
+                      size: 24
+                    }), /* @__PURE__ */ r(l, {
+                      variant: "body1",
+                      children: s
+                    })]
+                  })
+                }),
+                /* @__PURE__ */ r(v, {}),
+                /* @__PURE__ */ r(F, {
+                  sx: {
+                    ml: 56,
+                    p: 0
+                  },
+                  children: /* @__PURE__ */ r(M, {
+                    disablePadding: !0,
+                    children: k.map(({ label: t, topicKey: n }) => /* @__PURE__ */ r(N, {
+                      "aria-label": t,
+                      divider: !0,
+                      onClick: () => I({
+                        guid: u,
+                        category: s,
+                        pageTitle: t,
+                        topicKey: n
+                      }),
+                      sx: {
+                        pl: "6px !important",
+                        borderColor: "neutral.light",
+                        "&:last-child": {
+                          border: "none !important",
+                          borderBottomRightRadius: 7
+                        }
+                      },
+                      children: /* @__PURE__ */ r(l, {
+                        color: "text.secondary",
+                        variant: "body2",
+                        children: t
+                      })
+                    }, n))
+                  })
                 })
-              })
-            ]
-          }, p);
+              ]
+            }, u);
+          })
+        }, d);
+      })
+    }),
+    x && /* @__PURE__ */ e(_.Fragment, { children: [/* @__PURE__ */ r(v, { sx: { my: 24 } }), /* @__PURE__ */ e(o, {
+      "aria-labelledby": "help-need-more-assistance",
+      component: "section",
+      sx: {
+        alignItems: "center",
+        gap: 5,
+        pb: 24
+      },
+      children: [
+        /* @__PURE__ */ r(E, {
+          color: "text.primary",
+          id: "help-need-more-assistance",
+          sx: {
+            fontWeight: 600,
+            textAlign: "center"
+          },
+          children: p.need_more_assistance
+        }),
+        /* @__PURE__ */ r(l, {
+          color: "text.secondary",
+          sx: {
+            fontWeight: 400,
+            textAlign: "center"
+          },
+          variant: "subtitle2",
+          children: p.need_more_assistance_short_content
+        }),
+        /* @__PURE__ */ r(y, {
+          onClick: () => {
+            c(m.HELP_CLICK_REQUEST_SUPPORT, { source: "footer" }), h();
+          },
+          sx: {
+            mt: 16,
+            px: 16
+          },
+          variant: "text",
+          children: i
         })
-      }, d);
-    })
-  })] });
+      ]
+    })] })
+  ] });
 };
 export {
   ir as HelpList

package/dist/help/components/HelpList.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"HelpList.es.js","names":[],"sources":["../../../src/help/components/HelpList.tsx"],"sourcesContent":["import React, { useState } from 'react'\n\nimport Accordion from '@mui/material/Accordion'\nimport AccordionDetails from '@mui/material/AccordionDetails'\nimport AccordionSummary from '@mui/material/AccordionSummary'\nimport Button from '@mui/material/Button'\nimport Divider from '@mui/material/Divider'\nimport Grid from '@mui/material/Grid'\nimport List from '@mui/material/List'\nimport ListItemButton from '@mui/material/ListItemButton'\nimport Stack from '@mui/material/Stack'\n\nimport { H3, Icon, P, Text } from '@mxenabled/mxui'\nimport { ExpandMore } from '@mxenabled/mx-icons'\n\nimport { ANALYTICS_EVENTS, useEvent } from '../../common'\nimport { type HelpCategory, type SelectedTopic } from '../../core'\n\nexport interface HelpListProps {\n  buttonText: string\n  hasRequestButton?: boolean\n  helpCategories: HelpCategory[]\n  helpContent: string\n  helpTitle: string\n  onRequestHelp: () => void\n  onTopicSelect: (topic: SelectedTopic) => void\n}\n\nexport const HelpList: React.FC<HelpListProps> = ({\n  buttonText,\n  hasRequestButton = false,\n  helpCategories = [],\n  helpContent,\n  helpTitle,\n  onRequestHelp,\n  onTopicSelect,\n}) => {\n  const [expanded, setExpanded] = useState<number | null>(null)\n  const midpoint = Math.ceil(helpCategories.length / 2)\n\n  const { onEvent } = useEvent()\n\n  return (\n    <React.Fragment>\n      <Grid\n        container={true}\n        sx={{\n          alignItems: 'center',\n          justifyContent: 'space-between',\n          mb: 24,\n        }}\n      >\n        <Stack>\n          <H3>{helpTitle}</H3>\n          <P variant=\"body1\">{helpContent}</P>\n        </Stack>\n        {hasRequestButton && (\n          <Stack\n            sx={{\n              pt: {\n                xs: 12,\n                md: 0,\n              },\n            }}\n          >\n            <Button\n              aria-label={buttonText}\n              onClick={() => {\n                onEvent(ANALYTICS_EVENTS.HELP_CLICK_REQUEST_SUPPORT, {})\n\n                onRequestHelp()\n              }}\n              variant=\"contained\"\n            >\n              {buttonText}\n            </Button>\n          </Stack>\n        )}\n      </Grid>\n\n      <Stack sx={{ flexDirection: { xs: 'column', md: 'row' }, gap: 12 }}>\n        {[0, 1].map((half) => {\n          const start = half === 0 ? 0 : midpoint\n          const end = half === 0 ? midpoint : helpCategories.length\n          const items = helpCategories.slice(start, end)\n\n          return (\n            <Stack key={half} sx={{ flex: 1, gap: 12, maxWidth: { md: 'calc(50% - 6px)' } }}>\n              {items.map(({ guid, icon, topics, title }, i) => {\n                const key = i + start\n                return (\n                  <Accordion\n                    disableGutters={true}\n                    expanded={key === expanded}\n                    key={guid}\n                    onChange={(_, isExpanded) => {\n                      onEvent(ANALYTICS_EVENTS.HELP_EXPAND_TOPIC, { feature: title })\n\n                      setExpanded(isExpanded ? key : null)\n                    }}\n                    sx={(theme) => ({\n                      border: `1px solid ${theme.palette.neutral?.light}`,\n                      borderRadius: '8px !important',\n                      '&:before': {\n                        opacity: 0,\n                      },\n                      '& .MuiAccordion-region': {\n                        bgcolor: 'background.default',\n                        borderBottomLeftRadius: 8,\n                        borderBottomRightRadius: 8,\n                      },\n                    })}\n                  >\n                    <AccordionSummary\n                      expandIcon={<ExpandMore sx={{ color: 'text.primary' }} />}\n                      sx={{ height: 64, p: '14px 24px' }}\n                    >\n                      <Stack sx={{ alignItems: 'center', flexDirection: 'row', gap: 12 }}>\n                        <Icon name={icon} size={24} />\n                        <Text variant=\"body1\">{title}</Text>\n                      </Stack>\n                    </AccordionSummary>\n                    <Divider />\n                    <AccordionDetails\n                      sx={{\n                        ml: 56,\n                        p: 0,\n                      }}\n                    >\n                      <List disablePadding={true}>\n                        {topics.map(({ label, topicKey }) => (\n                          <ListItemButton\n                            aria-label={label}\n                            divider={true}\n                            key={topicKey}\n                            onClick={() =>\n                              onTopicSelect({ guid, category: title, pageTitle: label, topicKey })\n                            }\n                            sx={{\n                              pl: '6px !important',\n                              borderColor: 'neutral.light',\n                              '&:last-child': {\n                                border: 'none !important',\n                                borderBottomRightRadius: 7,\n                              },\n                            }}\n                          >\n                            <Text color=\"text.secondary\" variant=\"body2\">\n                              {label}\n                            </Text>\n                          </ListItemButton>\n                        ))}\n                      </List>\n                    </AccordionDetails>\n                  </Accordion>\n                )\n              })}\n            </Stack>\n          )\n        })}\n      </Stack>\n    </React.Fragment>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"HelpList.es.js","names":[],"sources":["../../../src/help/components/HelpList.tsx"],"sourcesContent":["import React, { useState } from 'react'\n\nimport Accordion from '@mui/material/Accordion'\nimport AccordionDetails from '@mui/material/AccordionDetails'\nimport AccordionSummary from '@mui/material/AccordionSummary'\nimport Button from '@mui/material/Button'\nimport Divider from '@mui/material/Divider'\nimport Grid from '@mui/material/Grid'\nimport List from '@mui/material/List'\nimport ListItemButton from '@mui/material/ListItemButton'\nimport Stack from '@mui/material/Stack'\n\nimport { H3, Icon, P, Text } from '@mxenabled/mxui'\nimport { ExpandMore } from '@mxenabled/mx-icons'\n\nimport { ANALYTICS_EVENTS, useEvent } from '../../common'\nimport type { HelpCategory, HelpCopy, SelectedTopic } from '../../core'\n\nexport interface HelpListProps {\n  buttonText: string\n  copy: HelpCopy\n  hasRequestButton?: boolean\n  helpCategories: HelpCategory[]\n  helpContent: string\n  helpTitle: string\n  onRequestHelp: () => void\n  onTopicSelect: (topic: SelectedTopic) => void\n}\n\nexport const HelpList: React.FC<HelpListProps> = ({\n  buttonText,\n  copy,\n  hasRequestButton = false,\n  helpCategories = [],\n  helpContent,\n  helpTitle,\n  onRequestHelp,\n  onTopicSelect,\n}) => {\n  const [expanded, setExpanded] = useState<number | null>(null)\n  const midpoint = Math.ceil(helpCategories.length / 2)\n\n  const { onEvent } = useEvent()\n\n  return (\n    <React.Fragment>\n      <Grid\n        container={true}\n        sx={{\n          alignItems: 'center',\n          justifyContent: 'space-between',\n          mb: 24,\n        }}\n      >\n        <Stack>\n          <H3>{helpTitle}</H3>\n          <P variant=\"body1\">{helpContent}</P>\n        </Stack>\n        {hasRequestButton && (\n          <Stack\n            sx={{\n              pt: {\n                xs: 12,\n                md: 0,\n              },\n            }}\n          >\n            <Button\n              aria-label={buttonText}\n              onClick={() => {\n                onEvent(ANALYTICS_EVENTS.HELP_CLICK_REQUEST_SUPPORT, { source: 'header' })\n\n                onRequestHelp()\n              }}\n              variant=\"contained\"\n            >\n              {buttonText}\n            </Button>\n          </Stack>\n        )}\n      </Grid>\n\n      <Stack sx={{ flexDirection: { xs: 'column', md: 'row' }, gap: 12 }}>\n        {[0, 1].map((half) => {\n          const start = half === 0 ? 0 : midpoint\n          const end = half === 0 ? midpoint : helpCategories.length\n          const items = helpCategories.slice(start, end)\n\n          return (\n            <Stack key={half} sx={{ flex: 1, gap: 12, maxWidth: { md: 'calc(50% - 6px)' } }}>\n              {items.map(({ guid, icon, topics, title }, i) => {\n                const key = i + start\n                return (\n                  <Accordion\n                    disableGutters={true}\n                    expanded={key === expanded}\n                    key={guid}\n                    onChange={(_, isExpanded) => {\n                      onEvent(ANALYTICS_EVENTS.HELP_EXPAND_TOPIC, { feature: title })\n\n                      setExpanded(isExpanded ? key : null)\n                    }}\n                    sx={(theme) => ({\n                      border: `1px solid ${theme.palette.neutral?.light}`,\n                      borderRadius: '8px !important',\n                      '&:before': {\n                        opacity: 0,\n                      },\n                      '& .MuiAccordion-region': {\n                        bgcolor: 'background.default',\n                        borderBottomLeftRadius: 8,\n                        borderBottomRightRadius: 8,\n                      },\n                    })}\n                  >\n                    <AccordionSummary\n                      expandIcon={<ExpandMore sx={{ color: 'text.primary' }} />}\n                      sx={{ height: 64, p: '14px 24px' }}\n                    >\n                      <Stack sx={{ alignItems: 'center', flexDirection: 'row', gap: 12 }}>\n                        <Icon name={icon} size={24} />\n                        <Text variant=\"body1\">{title}</Text>\n                      </Stack>\n                    </AccordionSummary>\n                    <Divider />\n                    <AccordionDetails\n                      sx={{\n                        ml: 56,\n                        p: 0,\n                      }}\n                    >\n                      <List disablePadding={true}>\n                        {topics.map(({ label, topicKey }) => (\n                          <ListItemButton\n                            aria-label={label}\n                            divider={true}\n                            key={topicKey}\n                            onClick={() =>\n                              onTopicSelect({ guid, category: title, pageTitle: label, topicKey })\n                            }\n                            sx={{\n                              pl: '6px !important',\n                              borderColor: 'neutral.light',\n                              '&:last-child': {\n                                border: 'none !important',\n                                borderBottomRightRadius: 7,\n                              },\n                            }}\n                          >\n                            <Text color=\"text.secondary\" variant=\"body2\">\n                              {label}\n                            </Text>\n                          </ListItemButton>\n                        ))}\n                      </List>\n                    </AccordionDetails>\n                  </Accordion>\n                )\n              })}\n            </Stack>\n          )\n        })}\n      </Stack>\n\n      {hasRequestButton && (\n        <React.Fragment>\n          <Divider sx={{ my: 24 }} />\n          <Stack\n            aria-labelledby=\"help-need-more-assistance\"\n            component=\"section\"\n            sx={{ alignItems: 'center', gap: 5, pb: 24 }}\n          >\n            <P\n              color=\"text.primary\"\n              id=\"help-need-more-assistance\"\n              sx={{ fontWeight: 600, textAlign: 'center' }}\n            >\n              {copy.need_more_assistance}\n            </P>\n            <Text\n              color=\"text.secondary\"\n              sx={{ fontWeight: 400, textAlign: 'center' }}\n              variant=\"subtitle2\"\n            >\n              {copy.need_more_assistance_short_content}\n            </Text>\n            <Button\n              // Shares its visible label with the header button; the containing\n              // region, named by this footer's localized heading, tells the two\n              // apart for screen readers without appending English copy.\n              onClick={() => {\n                onEvent(ANALYTICS_EVENTS.HELP_CLICK_REQUEST_SUPPORT, { source: 'footer' })\n\n                onRequestHelp()\n              }}\n              // Match the header button's horizontal padding; MUI's text variant\n              // defaults to a narrower inset that looks cramped on hover.\n              sx={{ mt: 16, px: 16 }}\n              variant=\"text\"\n            >\n              {buttonText}\n            </Button>\n          </Stack>\n        </React.Fragment>\n      )}\n    </React.Fragment>\n  )\n}\n"],"mappings":"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"}

package/dist/help/components/SupportPrompt.d.ts

@@ -0,0 +1,10 @@
+import { default as React } from 'react';
+import { SxProps } from '@mui/material/styles';
+export interface SupportPromptProps {
+    actionText: string;
+    onAction: () => void;
+    onPrompt: () => void;
+    promptText: string;
+    sx?: SxProps;
+}
+export declare const SupportPrompt: React.FC<SupportPromptProps>;