impact-nova 2.5.6 → 2.5.7

package/dist/components/flows/guidance/help-center/guide-catalog.js

@@ -1,118 +1,128 @@
-import { jsx as e, jsxs as o } from "react/jsx-runtime";
-import * as f from "react";
-import { useVirtualizer as x } from "@tanstack/react-virtual";
-import { Button as g } from "../../../primitives/button/button.js";
-import { cn as u } from "../../../../lib/utils.js";
-import { GUIDE_LIST_VIRTUALIZATION_THRESHOLD as b, GUIDE_LIST_ROW_GAP as N, GUIDE_CARD_ESTIMATE_HEIGHT as v } from "./help-center.constants.js";
+import { jsx as t } from "react/jsx-runtime";
+import * as x from "react";
+import { useVirtualizer as T } from "@tanstack/react-virtual";
+import { cn as h } from "../../../../lib/utils.js";
+import { resolveGuideType as v } from "./guide-catalog-utils.js";
+import { HelpCenterGuideRow as y } from "./help-center-guide-row.js";
+import { GUIDE_LIST_VIRTUALIZATION_THRESHOLD as w, GUIDE_LIST_ROW_GAP as I, GUIDE_CARD_ESTIMATE_HEIGHT as E } from "./help-center.constants.js";
 /* empty css                */
-function R({
-  guides: t,
+function z({
+  guides: e,
   onLaunchGuide: r,
-  replayLabel: n = "Replay",
-  emptyStateMessage: i = "No guides match your search.",
-  getStepCountLabel: d = (a) => `${a} steps`,
-  className: m
+  replayLabel: i = "Replay",
+  getLaunchLabel: c,
+  getGuideTypeLabel: d,
+  emptyStateMessage: s = "No guides match your search.",
+  scrollable: a = !0,
+  className: o
 }) {
-  const a = f.useRef(null), p = t.length >= b, c = x({
-    count: p ? t.length : 0,
-    getScrollElement: () => a.current,
-    estimateSize: () => v,
-    gap: N,
+  const l = x.useRef(null), p = a && e.length >= w, m = T({
+    count: p ? e.length : 0,
+    getScrollElement: () => l.current,
+    estimateSize: () => E,
+    gap: I,
     overscan: 5
   });
-  return t.length ? /* @__PURE__ */ e(
+  if (!e.length)
+    return /* @__PURE__ */ t(
+      "div",
+      {
+        className: h(
+          a ? "guidance-help-center-scroll min-h-0 flex-1 overflow-y-auto px-4 pb-4 pt-2" : "px-0 pb-0 pt-0",
+          o
+        ),
+        "data-component": "guidance-help-center-scroll",
+        children: /* @__PURE__ */ t("p", { className: "py-6 text-center text-sm text-content-secondary", children: s })
+      }
+    );
+  const f = e.map((n) => /* @__PURE__ */ t(
+    g,
+    {
+      guide: n,
+      onLaunchGuide: r,
+      replayLabel: i,
+      getLaunchLabel: c,
+      getGuideTypeLabel: d
+    },
+    n.id
+  ));
+  return a ? /* @__PURE__ */ t(
     "div",
     {
-      ref: a,
-      className: u(
-        "guidance-help-center-scroll min-h-0 flex-1 overflow-y-auto px-4 pb-3 pt-3",
-        m
+      ref: l,
+      className: h(
+        "guidance-help-center-scroll min-h-0 flex-1 overflow-y-auto px-4 pb-4 pt-2",
+        o
       ),
       "data-component": "guidance-help-center-scroll",
-      children: p ? /* @__PURE__ */ e(
+      children: p ? /* @__PURE__ */ t(
         "div",
         {
           className: "relative w-full",
           "data-component": "guidance-guide-catalog",
-          style: { height: c.getTotalSize() },
-          children: c.getVirtualItems().map((l) => {
-            const s = t[l.index];
-            return s ? /* @__PURE__ */ e(
+          style: { height: m.getTotalSize() },
+          children: m.getVirtualItems().map((n) => {
+            const u = e[n.index];
+            return u ? /* @__PURE__ */ t(
               "div",
               {
-                ref: c.measureElement,
-                "data-index": l.index,
+                ref: m.measureElement,
+                "data-index": n.index,
                 className: "absolute left-0 top-0 w-full",
-                style: { transform: `translateY(${l.start}px)` },
-                children: /* @__PURE__ */ e(
-                  h,
+                style: { transform: `translateY(${n.start}px)` },
+                children: /* @__PURE__ */ t(
+                  g,
                   {
-                    guide: s,
+                    guide: u,
                     onLaunchGuide: r,
-                    replayLabel: n,
-                    getStepCountLabel: d
+                    replayLabel: i,
+                    getLaunchLabel: c,
+                    getGuideTypeLabel: d
                   }
                 )
               },
-              s.id
+              u.id
             ) : null;
           })
         }
-      ) : /* @__PURE__ */ e(
-        "ul",
+      ) : /* @__PURE__ */ t(
+        "div",
         {
           className: "flex flex-col gap-2",
           "data-component": "guidance-guide-catalog",
-          children: t.map((l) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
-            h,
-            {
-              guide: l,
-              onLaunchGuide: r,
-              replayLabel: n,
-              getStepCountLabel: d
-            }
-          ) }, l.id))
+          children: f
         }
       )
     }
-  ) : /* @__PURE__ */ e(
+  ) : /* @__PURE__ */ t("div", { className: o, "data-component": "guidance-guide-catalog-embedded", children: /* @__PURE__ */ t(
     "div",
     {
-      className: u(
-        "guidance-help-center-scroll min-h-0 flex-1 overflow-y-auto px-4 pb-3 pt-3",
-        m
-      ),
-      "data-component": "guidance-help-center-scroll",
-      children: /* @__PURE__ */ e("p", { className: "rounded-lg border border-dashed border-border-subtle px-4 py-8 text-center text-sm text-content-secondary", children: i })
+      className: "flex flex-col gap-2",
+      "data-component": "guidance-guide-catalog",
+      children: f
     }
-  );
+  ) });
 }
-function h({
-  guide: t,
+function g({
+  guide: e,
   onLaunchGuide: r,
-  replayLabel: n,
-  getStepCountLabel: i
+  replayLabel: i,
+  getLaunchLabel: c,
+  getGuideTypeLabel: d
 }) {
-  return /* @__PURE__ */ e("article", { className: "rounded-lg border border-border-subtle bg-canvas-elevated px-3 py-2.5", children: /* @__PURE__ */ o("div", { className: "flex items-start justify-between gap-3", children: [
-    /* @__PURE__ */ o("div", { className: "min-w-0 flex-1", children: [
-      /* @__PURE__ */ o("div", { className: "flex min-w-0 items-center gap-2", children: [
-        /* @__PURE__ */ e("h3", { className: "truncate text-sm font-semibold text-content-primary", children: t.metadata.title ?? t.id }),
-        /* @__PURE__ */ e("span", { className: "shrink-0 rounded-full bg-brand-tint px-2 py-0.5 text-[11px] font-medium leading-none text-brand", children: i(t.steps.length) })
-      ] }),
-      t.metadata.description ? /* @__PURE__ */ e("p", { className: "mt-1 line-clamp-2 text-xs leading-relaxed text-content-secondary", children: t.metadata.description }) : null
-    ] }),
-    /* @__PURE__ */ e(
-      g,
-      {
-        variant: "outline",
-        size: "sm",
-        className: "shrink-0",
-        onClick: () => r(t.id),
-        children: n
-      }
-    )
-  ] }) });
+  const s = e.metadata.title ?? e.id, a = c?.(e) ?? i, o = d?.(e), l = v(e), p = o && l !== "whats-new" && !s.toLowerCase().includes(o.toLowerCase());
+  return /* @__PURE__ */ t(
+    y,
+    {
+      title: s,
+      description: e.metadata.description,
+      typeLabel: p ? o : void 0,
+      launchLabel: a,
+      guideType: l,
+      onLaunch: () => r(e.id)
+    }
+  );
 }
 export {
-  R as GuideCatalog
+  z as GuideCatalog
 };

package/dist/components/flows/guidance/help-center/help-center-guide-labels.d.ts

@@ -0,0 +1,6 @@
+import { GuideManifest } from '../../../../lib/guidance';
+type HelpCenterTranslate = (key: string, params?: Record<string, string | number>) => string;
+export declare function getHelpCenterGuideTypeLabel(guide: GuideManifest, translate: HelpCenterTranslate): string;
+export declare function getHelpCenterGuideLaunchLabel(guide: GuideManifest, translate: HelpCenterTranslate): string;
+export declare function getHelpCenterGuideStepCountLabel(guide: GuideManifest, stepCount: number, translate: HelpCenterTranslate): string;
+export {};

package/dist/components/flows/guidance/help-center/help-center-guide-labels.js

@@ -0,0 +1,33 @@
+import { resolveGuideType as u } from "./guide-catalog-utils.js";
+function h(t, e) {
+  switch (u(t)) {
+    case "whats-new":
+      return e("helpCenter.guideTypeWhatsNew");
+    case "how-to":
+      return e("helpCenter.guideTypeHowTo");
+    case "tip":
+      return e("helpCenter.guideTypeTip");
+    default:
+      return e("helpCenter.guideTypeTour");
+  }
+}
+function p(t, e) {
+  switch (u(t)) {
+    case "whats-new":
+      return e("helpCenter.launchWhatsNew");
+    case "how-to":
+      return e("helpCenter.launchHowTo");
+    case "tip":
+      return e("helpCenter.launchTip");
+    default:
+      return e("helpCenter.launchTour");
+  }
+}
+function o(t, e, n) {
+  return u(t) === "whats-new" ? n("helpCenter.highlightCount", { count: e }) : n("helpCenter.stepCount", { count: e });
+}
+export {
+  p as getHelpCenterGuideLaunchLabel,
+  o as getHelpCenterGuideStepCountLabel,
+  h as getHelpCenterGuideTypeLabel
+};

package/dist/components/flows/guidance/help-center/help-center-guide-row.d.ts

@@ -0,0 +1,12 @@
+import { GuideType } from '../../../../lib/guidance';
+import * as React from 'react';
+export interface HelpCenterGuideRowProps {
+    title: string;
+    description?: string;
+    typeLabel?: string;
+    launchLabel: string;
+    guideType?: GuideType;
+    onLaunch: () => void;
+    className?: string;
+}
+export declare function HelpCenterGuideRow({ title, description, typeLabel, launchLabel, guideType, onLaunch, className, }: HelpCenterGuideRowProps): React.ReactElement;

package/dist/components/flows/guidance/help-center/help-center-guide-row.js

@@ -0,0 +1,57 @@
+import { jsxs as n, jsx as e } from "react/jsx-runtime";
+import "react";
+import { Badge as c } from "../../../data-display/badge/badge.js";
+import { cn as m } from "../../../../lib/utils.js";
+import { ChevronRight as d } from "impact-nova-icons";
+import { renderHelpCenterGuideTypeIcon as u } from "./renderHelpCenterGuideTypeIcon.js";
+function v({
+  title: r,
+  description: t,
+  typeLabel: s,
+  launchLabel: a,
+  guideType: i = "tour",
+  onLaunch: l,
+  className: o
+}) {
+  return /* @__PURE__ */ n(
+    "button",
+    {
+      type: "button",
+      className: m(
+        "flex w-full items-center gap-3 rounded-lg border border-border-subtle bg-canvas-elevated px-3 py-3 text-left transition-colors",
+        "hover:bg-canvas-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-brand",
+        o
+      ),
+      onClick: l,
+      "aria-label": `${a}: ${r}`,
+      children: [
+        /* @__PURE__ */ e(
+          "span",
+          {
+            className: "flex h-9 w-9 shrink-0 items-center justify-center text-content-secondary",
+            "aria-hidden": "true",
+            children: u(i, { size: 22 })
+          }
+        ),
+        /* @__PURE__ */ n("span", { className: "min-w-0 flex-1", children: [
+          /* @__PURE__ */ n("span", { className: "flex flex-wrap items-center gap-x-2 gap-y-1", children: [
+            /* @__PURE__ */ e("span", { className: "text-sm font-semibold leading-snug text-content", children: r }),
+            s ? /* @__PURE__ */ e(c, { variant: "subtle", color: "neutral", size: "sm", shape: "square", children: s }) : null
+          ] }),
+          t ? /* @__PURE__ */ e("span", { className: "mt-1 block line-clamp-2 text-sm leading-relaxed text-content-secondary", children: t }) : null
+        ] }),
+        /* @__PURE__ */ e(
+          d,
+          {
+            size: 16,
+            className: "shrink-0 text-content-tertiary",
+            "aria-hidden": "true"
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  v as HelpCenterGuideRow
+};

package/dist/components/flows/guidance/help-center/help-center-guide-type-icons.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+export interface HelpCenterGuideTypeIconProps {
+    size?: number;
+    className?: string;
+}
+export declare function GuidedTourGuideIcon({ size, className, }: HelpCenterGuideTypeIconProps): React.ReactElement;
+export declare function WhatsNewGuideIcon({ size, className, }: HelpCenterGuideTypeIconProps): React.ReactElement;
+export declare function HowToGuideIcon({ size, className, }: HelpCenterGuideTypeIconProps): React.ReactElement;
+export declare function TipGuideIcon({ size, className, }: HelpCenterGuideTypeIconProps): React.ReactElement;

package/dist/components/flows/guidance/help-center/help-center-guide-type-icons.js

@@ -0,0 +1,114 @@
+import { jsxs as n, jsx as r } from "react/jsx-runtime";
+import "react";
+import { cn as c } from "../../../../lib/utils.js";
+import l from "./assets/whats-new-guide-icon.svg.js";
+function t({
+  size: o = 20,
+  viewBox: e,
+  className: i,
+  children: u
+}) {
+  return /* @__PURE__ */ r(
+    "svg",
+    {
+      width: o,
+      height: o,
+      viewBox: e,
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      className: c("shrink-0", i),
+      "aria-hidden": "true",
+      children: u
+    }
+  );
+}
+function p({
+  size: o,
+  className: e
+}) {
+  return /* @__PURE__ */ n(t, { size: o, viewBox: "0 0 24 24", className: e, children: [
+    /* @__PURE__ */ r("circle", { cx: "12", cy: "12", r: "9.5", stroke: "currentColor" }),
+    /* @__PURE__ */ r("circle", { cx: "12", cy: "12", r: "7.5", stroke: "currentColor" }),
+    /* @__PURE__ */ r("path", { d: "M4.5 12H6.5", stroke: "currentColor", strokeLinecap: "round" }),
+    /* @__PURE__ */ r("path", { d: "M17.5 12H19.5", stroke: "currentColor", strokeLinecap: "round" }),
+    /* @__PURE__ */ r("path", { d: "M12 4.5V6.5", stroke: "currentColor", strokeLinecap: "round" }),
+    /* @__PURE__ */ r("path", { d: "M12 17.5V19.5", stroke: "currentColor", strokeLinecap: "round" }),
+    /* @__PURE__ */ r(
+      "path",
+      {
+        d: "M8.54333 8.60832L10.492 13.4801C10.4971 13.4928 10.5072 13.5029 10.5199 13.508L15.3917 15.4567C15.4325 15.473 15.473 15.4325 15.4567 15.3917L13.508 10.5199C13.5029 10.5072 13.4928 10.4971 13.4801 10.492L8.60832 8.54333C8.56751 8.527 8.527 8.56751 8.54333 8.60832Z",
+        stroke: "currentColor",
+        strokeLinecap: "round"
+      }
+    ),
+    /* @__PURE__ */ r("path", { d: "M13 11L11 13", stroke: "currentColor", strokeLinecap: "round" })
+  ] });
+}
+function k({
+  size: o = 20,
+  className: e
+}) {
+  return /* @__PURE__ */ r(
+    "img",
+    {
+      src: l,
+      width: o,
+      height: o,
+      alt: "",
+      className: c("shrink-0", e),
+      "aria-hidden": "true"
+    }
+  );
+}
+function C({
+  size: o,
+  className: e
+}) {
+  return /* @__PURE__ */ r(t, { size: o, viewBox: "0 0 32 32", className: e, children: /* @__PURE__ */ r(
+    "path",
+    {
+      d: "M28.25 2c-0-0.69-0.56-1.25-1.25-1.25h-4.964c-0.020-0.001-0.037-0.012-0.058-0.012h-7.957c-0.021 0-0.038 0.011-0.058 0.012h-6.763c-0.028-0.001-0.061-0.001-0.093-0.001-1.817 0-3.297 1.443-3.357 3.246l-0 0.005v24.389c0.114 1.606 1.445 2.867 3.070 2.867 0.063 0 0.126-0.002 0.188-0.006l-0.009 0h20c0.69 0 1.25-0.56 1.25-1.25s-0.56-1.25-1.25-1.25v0h-19.8c-0.024 0.002-0.051 0.004-0.079 0.004-0.441 0-0.807-0.325-0.871-0.749l-0.001-0.005v-1.223c0-0.090 0.266-0.361 0.746-0.361l20.004 0.057c0 0 0 0 0.001 0 0.515 0 0.956-0.311 1.148-0.756l0.003-0.008 0.007-0.034c0.056-0.132 0.089-0.286 0.092-0.447v-0.001l-0-0.002 0-0.002zM25.75 23.969l-14.5-0.041v-20.678h1.521v9.948c0 0.69 0.56 1.25 1.25 1.25 0.301 0 0.577-0.107 0.793-0.284l-0.002 0.002 3.195-2.614 3.189 2.552c0.212 0.171 0.484 0.274 0.781 0.274 0.691 0 1.25-0.56 1.25-1.25v0-9.877h2.521zM20.729 3.25v7.276l-1.947-1.559c-0.212-0.171-0.484-0.274-0.781-0.274-0.301 0-0.578 0.107-0.794 0.284l0.002-0.002-1.938 1.585v-7.312zM6.25 24v-20c0.064-0.429 0.43-0.754 0.871-0.754 0.028 0 0.055 0.001 0.082 0.004l-0.003-0h1.55v20.671l-1.75-0.005c-0.267 0.002-0.525 0.033-0.774 0.089l0.024-0.005z",
+      fill: "currentColor"
+    }
+  ) });
+}
+function v({
+  size: o,
+  className: e
+}) {
+  return /* @__PURE__ */ n(t, { size: o, viewBox: "0 0 24 24", className: e, children: [
+    /* @__PURE__ */ r(
+      "path",
+      {
+        d: "M9 18H15",
+        stroke: "currentColor",
+        strokeWidth: "1.5",
+        strokeLinecap: "round"
+      }
+    ),
+    /* @__PURE__ */ r(
+      "path",
+      {
+        d: "M10 21H14",
+        stroke: "currentColor",
+        strokeWidth: "1.5",
+        strokeLinecap: "round"
+      }
+    ),
+    /* @__PURE__ */ r(
+      "path",
+      {
+        d: "M12 3C8.68629 3 6 5.68629 6 9C6 10.6569 6.67157 12.1569 7.75736 13.2426C8.54301 14.0283 9 15.0609 9 16.2V17H15V16.2C15 15.0609 15.457 14.0283 16.2426 13.2426C17.3284 12.1569 18 10.6569 18 9C18 5.68629 15.3137 3 12 3Z",
+        stroke: "currentColor",
+        strokeWidth: "1.5",
+        strokeLinejoin: "round"
+      }
+    )
+  ] });
+}
+export {
+  p as GuidedTourGuideIcon,
+  C as HowToGuideIcon,
+  v as TipGuideIcon,
+  k as WhatsNewGuideIcon
+};

package/dist/components/flows/guidance/help-center/help-center-header.d.ts

@@ -1,3 +1,3 @@
 import { HelpCenterHeaderProps } from './help-center.types';
 import * as React from 'react';
-export declare function HelpCenterHeader({ title, children, className, }: HelpCenterHeaderProps): React.ReactElement;
+export declare function HelpCenterHeader({ title, subtitle, children, className, }: HelpCenterHeaderProps): React.ReactElement;

package/dist/components/flows/guidance/help-center/help-center-header.js

@@ -1,34 +1,38 @@
-import { jsxs as n, jsx as e } from "react/jsx-runtime";
+import { jsxs as r, jsx as e } from "react/jsx-runtime";
 import "react";
-import { SheetTitle as s, SheetClose as c } from "../../../feedback/sheet/sheet.js";
-import { Button as l } from "../../../primitives/button/button.js";
+import { SheetTitle as l, SheetClose as c } from "../../../feedback/sheet/sheet.js";
+import { Button as d } from "../../../primitives/button/button.js";
 import { Cross as m } from "impact-nova-icons";
 import { useImpactNovaI18n as p } from "../../../../i18n/use-impact-nova-i18n.js";
-import { cn as d } from "../../../../lib/utils.js";
-function C({
+import { cn as h } from "../../../../lib/utils.js";
+function y({
   title: o,
-  children: a,
+  subtitle: n,
+  children: s,
   className: i
 }) {
-  const { t: r } = p(), t = o ?? r("helpCenter.title");
-  return /* @__PURE__ */ n(
+  const { t: a } = p(), t = o ?? a("helpCenter.title");
+  return /* @__PURE__ */ r(
     "div",
     {
       "data-component": "guidance-help-center-header",
-      className: d(
-        "flex shrink-0 items-center justify-between gap-3 border-b bg-canvas-elevated px-4 py-[9px]",
+      className: h(
+        "relative z-10 flex shrink-0 items-center justify-between gap-3 border-b border-border-subtle bg-canvas-elevated px-4 py-3 shadow-sm",
         i
       ),
       children: [
-        typeof t == "string" ? /* @__PURE__ */ e(s, { className: "shrink-0 text-lg font-bold text-content", children: t }) : t,
-        /* @__PURE__ */ n("div", { className: "flex items-center gap-2", children: [
-          a,
+        /* @__PURE__ */ r("div", { className: "min-w-0 flex-1", children: [
+          typeof t == "string" ? /* @__PURE__ */ e(l, { className: "text-lg font-bold text-content", children: t }) : t,
+          n ? /* @__PURE__ */ e("p", { className: "mt-0.5 text-xs leading-snug text-content-secondary", children: n }) : null
+        ] }),
+        /* @__PURE__ */ r("div", { className: "flex shrink-0 items-center gap-2", children: [
+          s,
           /* @__PURE__ */ e(c, { asChild: !0, children: /* @__PURE__ */ e(
-            l,
+            d,
             {
               variant: "secondary",
               size: "icon",
-              "aria-label": r("aria.close"),
+              "aria-label": a("aria.close"),
               "data-component": "guidance-help-center-close",
               children: /* @__PURE__ */ e(m, { className: "!h-3 !w-3" })
             }
@@ -39,5 +43,5 @@ function C({
   );
 }
 export {
-  C as HelpCenterHeader
+  y as HelpCenterHeader
 };

package/dist/components/flows/guidance/help-center/help-center.constants.d.ts

@@ -1,5 +1,5 @@
 export declare const HELP_CENTER_ALL_CATEGORY_VALUE = "all";
-export declare const GUIDE_CARD_ESTIMATE_HEIGHT = 72;
+export declare const GUIDE_CARD_ESTIMATE_HEIGHT = 88;
 export declare const GUIDE_LIST_ROW_GAP = 8;
 /** Below this count, a simple list is rendered instead of windowing. */
 export declare const GUIDE_LIST_VIRTUALIZATION_THRESHOLD = 12;

package/dist/components/flows/guidance/help-center/help-center.constants.js

@@ -1,4 +1,4 @@
-const _ = "all", E = 72, I = 8, T = 12;
+const _ = "all", E = 88, I = 8, T = 12;
 export {
   E as GUIDE_CARD_ESTIMATE_HEIGHT,
   I as GUIDE_LIST_ROW_GAP,

package/dist/components/flows/guidance/help-center/help-center.d.ts

@@ -1,10 +1,12 @@
-import { HelpCenterBodyProps, HelpCenterCategoryTabsProps, HelpCenterContentProps, HelpCenterFooterProps, HelpCenterProps } from './help-center.types';
+import { HelpCenterBodyProps, HelpCenterCategoryTabsProps, HelpCenterContentProps, HelpCenterFooterProps, HelpCenterProps, HelpCenterSupportFooterProps } from './help-center.types';
 import * as React from 'react';
 export declare function HelpCenter({ open, onOpenChange, children, className, }: HelpCenterProps): React.ReactElement;
 export declare function HelpCenterContent({ children, className, }: HelpCenterContentProps): React.ReactElement;
 export declare function HelpCenterCategoryTabs({ categories, allCategoryLabel, className, }: HelpCenterCategoryTabsProps): React.ReactElement;
 export declare function HelpCenterBody({ children, className, }: HelpCenterBodyProps): React.ReactElement;
 export declare function HelpCenterFooter({ children, className, }: HelpCenterFooterProps): React.ReactElement;
+export declare function HelpCenterSupportFooter({ ticketUrl, ticketLabel, message, }: HelpCenterSupportFooterProps): React.ReactElement;
 export { HelpCenterHeader } from './help-center-header';
 export { GuideCatalog } from './guide-catalog';
+export { GuideCatalogSection } from './guide-catalog-section';
 export type { GuideCatalogProps } from './help-center.types';