impact-nova 2.2.8 → 2.3.0

package/dist/components/flows/guidance/guidance-provider.js

@@ -0,0 +1,58 @@
+import { jsx as n, jsxs as l } from "react/jsx-runtime";
+import * as i from "react";
+import { useSyncExternalStore as g } from "react";
+import { createGuidanceEngine as d, GuidanceContext as m } from "./guidance-context.js";
+import { GuidanceDebugPanel as f, GuidanceErrorBoundary as G } from "./guidance-error-boundary.js";
+import { GuidanceLayer as b } from "./guidance-layer.js";
+import { registerRendererPlugins as x } from "./renderers/renderer-registry.js";
+function p({
+  children: s,
+  ...t
+}) {
+  const [r] = i.useState(() => d(t));
+  i.useEffect(() => {
+    x();
+    for (const e of t.plugins ?? [])
+      e.evaluate && r.triggers.register(e), e.resolve && r.resolver.registerAdapter(e);
+  }, [r, t.plugins]);
+  const o = i.useMemo(
+    () => ({
+      engine: r,
+      debug: t.debug ?? !1,
+      locale: t.locale ?? "en",
+      registerGuide: (e, c) => {
+        r.registerGuide(e, c);
+      },
+      unregisterGuide: (e) => {
+        r.unregisterGuide(e);
+      },
+      unregisterRouteScope: (e) => {
+        r.unregisterRouteScope(e);
+      }
+    }),
+    [r, t.debug, t.locale]
+  ), u = g(
+    (e) => r.subscribe(e),
+    () => r.state.status,
+    () => "idle"
+  ), a = u === "active" || u === "blocked" || u === "evaluating";
+  return /* @__PURE__ */ n(m.Provider, { value: o, children: /* @__PURE__ */ l("div", { "data-component": "guidance", className: "contents", children: [
+    s,
+    t.debug ? /* @__PURE__ */ n(f, {}) : null,
+    a ? /* @__PURE__ */ n(
+      G,
+      {
+        onError: (e) => {
+          r.reportError({
+            code: "render_error",
+            message: e.message
+          });
+        },
+        children: /* @__PURE__ */ n(b, {})
+      }
+    ) : null
+  ] }) });
+}
+export {
+  p as GuidanceProvider
+};

package/dist/components/flows/guidance/guidance-target.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+export interface GuidanceTargetProps {
+    targetId: string;
+    scope?: string;
+    children: React.ReactNode;
+}
+export declare function GuidanceTarget({ targetId, scope, children, }: GuidanceTargetProps): React.ReactElement;

package/dist/components/flows/guidance/guidance-target.js

@@ -0,0 +1,27 @@
+import { jsx as u } from "react/jsx-runtime";
+import * as i from "react";
+import { useGuidanceContext as c } from "./guidance-context.js";
+function m({
+  targetId: e,
+  scope: t,
+  children: o
+}) {
+  const { engine: n } = c(), r = i.useRef(null);
+  return i.useEffect(() => {
+    const a = r.current;
+    if (a)
+      return n.targets.register(e, a, t);
+  }, [n, e, t]), /* @__PURE__ */ u(
+    "span",
+    {
+      ref: r,
+      "data-guidance-target": e,
+      "data-component": "guidance-target",
+      className: "inline-flex",
+      children: o
+    }
+  );
+}
+export {
+  m as GuidanceTarget
+};

package/dist/components/flows/guidance/guidance.types.d.ts

@@ -0,0 +1 @@
+export type { GuidanceContextValue, GuidanceProviderProps, } from './guidance-context';

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

@@ -0,0 +1,7 @@
+import { GuideManifest } from '../../../../lib/guidance';
+export interface FilterHelpCenterGuidesOptions {
+    categoryValue: string;
+    searchQuery: string;
+    allCategoryValue?: string;
+}
+export declare function filterHelpCenterGuides(guides: GuideManifest[], options: FilterHelpCenterGuidesOptions): GuideManifest[];

package/dist/components/flows/guidance/help-center/filter-help-center-guides.js

@@ -0,0 +1,11 @@
+import { HELP_CENTER_ALL_CATEGORY_VALUE as u } from "./help-center.constants.js";
+function y(o, e) {
+  const l = e.allCategoryValue ?? u, r = e.categoryValue === l ? null : e.categoryValue, t = e.searchQuery.trim().toLowerCase();
+  return o.filter((a) => {
+    const c = a.metadata.category ?? "general", s = !r || c === r, n = !t || a.metadata.title?.toLowerCase().includes(t) || a.metadata.description?.toLowerCase().includes(t) || a.id.toLowerCase().includes(t);
+    return s && n;
+  });
+}
+export {
+  y as filterHelpCenterGuides
+};

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

@@ -0,0 +1,3 @@
+import { GuideCatalogProps } from './help-center.types';
+import * as React from 'react';
+export declare function GuideCatalog({ guides, onLaunchGuide, replayLabel, emptyStateMessage, getStepCountLabel, className, }: GuideCatalogProps): React.ReactElement;

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

@@ -0,0 +1,118 @@
+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";
+/* empty css                */
+function R({
+  guides: t,
+  onLaunchGuide: r,
+  replayLabel: n = "Replay",
+  emptyStateMessage: i = "No guides match your search.",
+  getStepCountLabel: d = (a) => `${a} steps`,
+  className: m
+}) {
+  const a = f.useRef(null), p = t.length >= b, c = x({
+    count: p ? t.length : 0,
+    getScrollElement: () => a.current,
+    estimateSize: () => v,
+    gap: N,
+    overscan: 5
+  });
+  return t.length ? /* @__PURE__ */ e(
+    "div",
+    {
+      ref: a,
+      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: p ? /* @__PURE__ */ e(
+        "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(
+              "div",
+              {
+                ref: c.measureElement,
+                "data-index": l.index,
+                className: "absolute left-0 top-0 w-full",
+                style: { transform: `translateY(${l.start}px)` },
+                children: /* @__PURE__ */ e(
+                  h,
+                  {
+                    guide: s,
+                    onLaunchGuide: r,
+                    replayLabel: n,
+                    getStepCountLabel: d
+                  }
+                )
+              },
+              s.id
+            ) : null;
+          })
+        }
+      ) : /* @__PURE__ */ e(
+        "ul",
+        {
+          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))
+        }
+      )
+    }
+  ) : /* @__PURE__ */ e(
+    "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 })
+    }
+  );
+}
+function h({
+  guide: t,
+  onLaunchGuide: r,
+  replayLabel: n,
+  getStepCountLabel: i
+}) {
+  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
+      }
+    )
+  ] }) });
+}
+export {
+  R as GuideCatalog
+};

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

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

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

@@ -0,0 +1,43 @@
+import { jsxs as n, 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 { 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({
+  title: o,
+  children: a,
+  className: i
+}) {
+  const { t: r } = p(), t = o ?? r("helpCenter.title");
+  return /* @__PURE__ */ n(
+    "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]",
+        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__ */ e(c, { asChild: !0, children: /* @__PURE__ */ e(
+            l,
+            {
+              variant: "secondary",
+              size: "icon",
+              "aria-label": r("aria.close"),
+              "data-component": "guidance-help-center-close",
+              children: /* @__PURE__ */ e(m, { className: "!h-3 !w-3" })
+            }
+          ) })
+        ] })
+      ]
+    }
+  );
+}
+export {
+  C as HelpCenterHeader
+};

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

@@ -0,0 +1,5 @@
+export declare const HELP_CENTER_ALL_CATEGORY_VALUE = "all";
+export declare const GUIDE_CARD_ESTIMATE_HEIGHT = 72;
+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

@@ -0,0 +1,7 @@
+const _ = "all", E = 72, I = 8, T = 12;
+export {
+  E as GUIDE_CARD_ESTIMATE_HEIGHT,
+  I as GUIDE_LIST_ROW_GAP,
+  T as GUIDE_LIST_VIRTUALIZATION_THRESHOLD,
+  _ as HELP_CENTER_ALL_CATEGORY_VALUE
+};

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

@@ -0,0 +1,10 @@
+import { HelpCenterBodyProps, HelpCenterCategoryTabsProps, HelpCenterContentProps, HelpCenterFooterProps, HelpCenterProps } 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 { HelpCenterHeader } from './help-center-header';
+export { GuideCatalog } from './guide-catalog';
+export type { GuideCatalogProps } from './help-center.types';

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

@@ -0,0 +1,95 @@
+import { jsx as n, jsxs as s } from "react/jsx-runtime";
+import "react";
+import { Sheet as m, SheetContent as d, SheetDescription as h, SheetBody as f, SheetFooter as u } from "../../../feedback/sheet/sheet.js";
+import { TabsList as x, TabsTrigger as c } from "../../../primitives/tabs/tabs.js";
+import { useImpactNovaI18n as p } from "../../../../i18n/use-impact-nova-i18n.js";
+import { cn as r } from "../../../../lib/utils.js";
+import { HELP_CENTER_ALL_CATEGORY_VALUE as v } from "./help-center.constants.js";
+function L({
+  open: e,
+  onOpenChange: t,
+  children: l,
+  className: o
+}) {
+  const { t: a } = p();
+  return /* @__PURE__ */ n(m, { open: e, onOpenChange: t, children: /* @__PURE__ */ s(
+    d,
+    {
+      "data-component": "guidance-help-center",
+      side: "right",
+      className: r(
+        "w-full max-w-xl overflow-hidden sm:max-w-2xl",
+        o
+      ),
+      children: [
+        /* @__PURE__ */ n(h, { className: "sr-only", children: a("helpCenter.description") }),
+        l
+      ]
+    }
+  ) });
+}
+function T({
+  children: e,
+  className: t
+}) {
+  return /* @__PURE__ */ n(
+    "div",
+    {
+      "data-component": "guidance-help-center-content",
+      className: r("flex h-full min-h-0 flex-col bg-canvas-elevated", t),
+      children: e
+    }
+  );
+}
+function E({
+  categories: e,
+  allCategoryLabel: t,
+  className: l
+}) {
+  const { t: o } = p(), a = t ?? o("helpCenter.allCategory");
+  return /* @__PURE__ */ n(
+    "div",
+    {
+      "data-component": "guidance-help-center-toolbar",
+      className: r(
+        "guidance-help-center-toolbar relative z-10 shrink-0 bg-canvas-elevated px-4 pb-3 pt-3",
+        l
+      ),
+      children: /* @__PURE__ */ s(x, { className: "h-auto w-full max-w-full flex-nowrap justify-start gap-1 overflow-x-auto p-1", children: [
+        /* @__PURE__ */ n(c, { value: v, children: a }),
+        e.map((i) => /* @__PURE__ */ n(c, { value: i.id, children: i.label }, i.id))
+      ] })
+    }
+  );
+}
+function S({
+  children: e,
+  className: t
+}) {
+  return /* @__PURE__ */ n(
+    f,
+    {
+      className: r("flex min-h-0 flex-1 flex-col overflow-hidden p-0", t),
+      children: e
+    }
+  );
+}
+function j({
+  children: e,
+  className: t
+}) {
+  return /* @__PURE__ */ n(
+    u,
+    {
+      className: r("shrink-0 justify-start border-t px-4 py-2.5", t),
+      children: e
+    }
+  );
+}
+export {
+  L as HelpCenter,
+  S as HelpCenterBody,
+  E as HelpCenterCategoryTabs,
+  T as HelpCenterContent,
+  j as HelpCenterFooter
+};

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

@@ -0,0 +1,10 @@
+import { GuideManifest } from '../../../../lib/guidance';
+import * as React from 'react';
+export declare const helpCenterDemoGuideManifests: GuideManifest[];
+export interface HelpCenterComposedProps {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    supportTicketUrl?: string;
+    supportTicketLabel?: string;
+}
+export declare function HelpCenterComposed({ open, onOpenChange, supportTicketUrl, supportTicketLabel, }: HelpCenterComposedProps): React.ReactElement;

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

@@ -0,0 +1,39 @@
+import { GuideManifest } from '../../../../lib/guidance';
+import { HelpCenterCategory } from '../hooks/use-help-center';
+import type * as React from 'react';
+export interface HelpCenterProps {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    children: React.ReactNode;
+    className?: string;
+}
+export interface HelpCenterContentProps {
+    children: React.ReactNode;
+    className?: string;
+}
+export interface HelpCenterHeaderProps {
+    title?: React.ReactNode;
+    children?: React.ReactNode;
+    className?: string;
+}
+export interface HelpCenterCategoryTabsProps {
+    categories: HelpCenterCategory[];
+    allCategoryLabel?: string;
+    className?: string;
+}
+export interface HelpCenterBodyProps {
+    children: React.ReactNode;
+    className?: string;
+}
+export interface HelpCenterFooterProps {
+    children?: React.ReactNode;
+    className?: string;
+}
+export interface GuideCatalogProps {
+    guides: GuideManifest[];
+    onLaunchGuide: (guideId: string) => void;
+    replayLabel?: string;
+    emptyStateMessage?: string;
+    getStepCountLabel?: (stepCount: number) => string;
+    className?: string;
+}

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

@@ -0,0 +1,6 @@
+export { HelpCenter, HelpCenterContent, HelpCenterHeader, HelpCenterCategoryTabs, HelpCenterBody, HelpCenterFooter, GuideCatalog, } from './help-center/help-center';
+export { filterHelpCenterGuides } from './help-center/filter-help-center-guides';
+export { HELP_CENTER_ALL_CATEGORY_VALUE } from './help-center/help-center.constants';
+export { useHelpCenter, formatHelpCenterCategoryLabel } from './hooks/use-help-center';
+export type { HelpCenterProps, HelpCenterContentProps, HelpCenterHeaderProps, HelpCenterCategoryTabsProps, HelpCenterBodyProps, HelpCenterFooterProps, GuideCatalogProps, } from './help-center/help-center.types';
+export type { HelpCenterCategory } from './hooks/use-help-center';

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

@@ -0,0 +1,19 @@
+import { HelpCenter as t, HelpCenterBody as o, HelpCenterCategoryTabs as p, HelpCenterContent as C, HelpCenterFooter as l } from "./help-center/help-center.js";
+import { filterHelpCenterGuides as H } from "./help-center/filter-help-center-guides.js";
+import { HELP_CENTER_ALL_CATEGORY_VALUE as f } from "./help-center/help-center.constants.js";
+import { formatHelpCenterCategoryLabel as x, useHelpCenter as E } from "./hooks/use-help-center.js";
+import { GuideCatalog as d } from "./help-center/guide-catalog.js";
+import { HelpCenterHeader as g } from "./help-center/help-center-header.js";
+export {
+  d as GuideCatalog,
+  f as HELP_CENTER_ALL_CATEGORY_VALUE,
+  t as HelpCenter,
+  o as HelpCenterBody,
+  p as HelpCenterCategoryTabs,
+  C as HelpCenterContent,
+  l as HelpCenterFooter,
+  g as HelpCenterHeader,
+  H as filterHelpCenterGuides,
+  x as formatHelpCenterCategoryLabel,
+  E as useHelpCenter
+};

package/dist/components/flows/guidance/hooks/use-guidance.d.ts

@@ -0,0 +1,19 @@
+import { GuideManifest } from '../../../../lib/guidance';
+export declare function useGuidance(): {
+    status: import('../../../../lib/guidance').GuidanceSessionStatus;
+    activeGuide: GuideManifest | undefined;
+    queue: number | null | undefined;
+    start: (guideId: string) => Promise<void>;
+    dismiss: (mode?: "session" | "forever" | "snoozed") => Promise<void>;
+    snooze: (guideId?: string) => Promise<void>;
+    replay: (guideId: string) => Promise<void>;
+    emit: (eventName: string) => void;
+    grantConsent: () => void;
+    preview: (guideId: string) => Promise<void>;
+};
+export declare function useGuideManifest(manifests: GuideManifest[], routeScope: string): void;
+export declare function useGuidanceEvents(): {
+    onGuideStart: (handler: (guideId: string) => void) => import('../../../../lib/guidance').Unsubscribe;
+    onGuideEnd: (handler: (guideId: string, reason?: string) => void) => import('../../../../lib/guidance').Unsubscribe;
+    onStepChange: (handler: (guideId: string, stepId: string) => void) => import('../../../../lib/guidance').Unsubscribe;
+};

package/dist/components/flows/guidance/hooks/use-guidance.js

@@ -0,0 +1,50 @@
+import * as r from "react";
+import { useSyncExternalStore as a } from "react";
+import { useGuidanceContext as o } from "../guidance-context.js";
+function g() {
+  const { engine: t } = o(), n = a(
+    (e) => t.subscribe(e),
+    () => t.state,
+    () => ({ status: "idle" })
+  ), s = n.guideId ? t.registry.get(n.guideId) : void 0;
+  return {
+    status: n.status,
+    activeGuide: s,
+    queue: n.status === "queued" ? n.position : null,
+    start: (e) => t.start(e, { manual: !0 }),
+    dismiss: (e) => t.dismiss(e),
+    snooze: (e) => t.snooze(e),
+    replay: (e) => t.replay(e),
+    emit: (e) => t.emitCustomEvent(e),
+    grantConsent: () => t.grantConsent(),
+    preview: (e) => t.replay(e)
+  };
+}
+function m(t, n) {
+  const { registerGuide: s, unregisterRouteScope: e } = o(), u = t.map((i) => `${i.id}@${i.version}`).join("|");
+  r.useEffect(() => {
+    for (const i of t)
+      s(i, n);
+    return () => {
+      e(n);
+    };
+  }, [n, u, s, e]);
+}
+function f() {
+  const { engine: t } = o();
+  return {
+    onGuideStart: (n) => t.on("guideStart", ({ guideId: s }) => n(s)),
+    onGuideEnd: (n) => t.on(
+      "guideEnd",
+      ({ guideId: s, reason: e }) => n(s, e)
+    ),
+    onStepChange: (n) => t.on("stepChange", ({ guideId: s, stepId: e }) => {
+      e && n(s, e);
+    })
+  };
+}
+export {
+  g as useGuidance,
+  f as useGuidanceEvents,
+  m as useGuideManifest
+};

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

@@ -0,0 +1,24 @@
+import { GuideManifest } from '../../../../lib/guidance';
+import * as React from 'react';
+export interface HelpCenterCategory {
+    id: string;
+    label: string;
+}
+export declare function formatHelpCenterCategoryLabel(categoryId: string): string;
+export declare function useHelpCenter(options?: {
+    enabled?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    getCategoryLabel?: (categoryId: string) => string;
+}): {
+    isOpen: boolean;
+    open: () => void;
+    close: () => void;
+    guides: GuideManifest[];
+    allGuides: GuideManifest[];
+    categories: HelpCenterCategory[];
+    searchQuery: string;
+    search: (query: string) => void;
+    selectedCategory: string | null;
+    setSelectedCategory: React.Dispatch<React.SetStateAction<string | null>>;
+    launchGuide: (guideId: string) => void;
+};

package/dist/components/flows/guidance/hooks/use-help-center.js

@@ -0,0 +1,67 @@
+import * as e from "react";
+import { useSyncExternalStore as E } from "react";
+import { useGuidanceContext as G } from "../guidance-context.js";
+import { filterHelpCenterGuides as M } from "../help-center/filter-help-center-guides.js";
+import { HELP_CENTER_ALL_CATEGORY_VALUE as O } from "../help-center/help-center.constants.js";
+function _(o) {
+  return o.split(/[-_]/).map((r) => r.charAt(0).toUpperCase() + r.slice(1)).join(" ");
+}
+function x(o) {
+  const r = o?.enabled ?? !0, i = o?.onOpenChange, g = o?.getCategoryLabel ?? _, { engine: s } = G(), [y, p] = e.useState(!1), [c, C] = e.useState(""), [l, d] = e.useState(
+    null
+  ), f = E(
+    (t) => r ? s.registry.subscribe(t) : () => {
+    },
+    () => r ? s.registry.getVersion() : 0,
+    () => 0
+  ), a = e.useMemo(
+    () => r ? s.registry.getAll() : [],
+    // ponytail: guideRegistryVersion is the registry publish signal for useSyncExternalStore
+    // eslint-disable-next-line react-hooks/exhaustive-deps -- intentional invalidation key
+    [r, s, f]
+  ), m = e.useMemo(() => {
+    const t = /* @__PURE__ */ new Map();
+    for (const u of a) {
+      const n = u.metadata.category ?? "general";
+      t.set(n, g(n));
+    }
+    return Array.from(t.entries()).map(([u, n]) => ({
+      id: u,
+      label: n
+    }));
+  }, [a, g]), b = e.useMemo(
+    () => M(a, {
+      categoryValue: l ?? O,
+      searchQuery: c
+    }),
+    [a, c, l]
+  ), h = e.useCallback(() => {
+    p(!0);
+  }, []), L = e.useCallback(() => {
+    p(!1);
+  }, []), S = e.useCallback((t) => {
+    C(t);
+  }, []), A = e.useCallback(
+    (t) => {
+      i?.(!1), s.replay(t);
+    },
+    [s, i]
+  );
+  return {
+    isOpen: y,
+    open: h,
+    close: L,
+    guides: b,
+    allGuides: a,
+    categories: m,
+    searchQuery: c,
+    search: S,
+    selectedCategory: l,
+    setSelectedCategory: d,
+    launchGuide: A
+  };
+}
+export {
+  _ as formatHelpCenterCategoryLabel,
+  x as useHelpCenter
+};

package/dist/components/flows/guidance/hooks/useGuidanceOverlayGeometry.d.ts

@@ -0,0 +1,2 @@
+import { HighlightRect } from '../renderers/guidance-renderer-shared';
+export declare function useGuidanceOverlayGeometry(targetElement: HTMLElement | null | undefined, stepId: string): HighlightRect | null;