impact-nova 2.2.8 → 2.2.9

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;

package/dist/components/flows/guidance/hooks/useGuidanceOverlayGeometry.js

@@ -0,0 +1,30 @@
+import * as c from "react";
+import { beginTourScrollSnapshot as m, needsGuidanceTargetScroll as l, scrollGuidanceTargetIntoView as f, getVisibleTargetRect as v } from "../renderers/guidance-renderer-shared.js";
+import { hasRunningAnimations as p } from "../utils/motion-settle.js";
+function T(e, u) {
+  const [d, s] = c.useState(null);
+  return c.useEffect(() => {
+    if (!e) {
+      s(null);
+      return;
+    }
+    let i = !1, o = 0;
+    const r = () => {
+      i || s(v(e));
+    }, t = () => {
+      r(), !i && p(e) && (o = requestAnimationFrame(t));
+    };
+    m(e), l(e) && f(e), r(), o = requestAnimationFrame(t);
+    const a = new ResizeObserver(r);
+    a.observe(e);
+    const n = () => {
+      r();
+    };
+    return window.addEventListener("resize", n), document.addEventListener("scroll", n, !0), () => {
+      i = !0, cancelAnimationFrame(o), a.disconnect(), window.removeEventListener("resize", n), document.removeEventListener("scroll", n, !0);
+    };
+  }, [u, e]), d;
+}
+export {
+  T as useGuidanceOverlayGeometry
+};

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

@@ -0,0 +1,18 @@
+export { GuidanceProvider } from './guidance-provider';
+export { GuidanceContext, useGuidanceContext, createGuidanceEngine, } from './guidance-context';
+export type { GuidanceProviderProps, GuidanceContextValue } from './guidance-context';
+export { GuidanceTarget } from './guidance-target';
+export { useGuidanceTarget } from './use-guidance-target';
+export type { GuidanceTargetProps } from './guidance-target';
+export { GuidanceLayer } from './guidance-layer';
+export { GuidanceErrorBoundary, GuidanceDebugPanel } from './guidance-error-boundary';
+export { useGuidance, useGuideManifest, useGuidanceEvents } from './hooks/use-guidance';
+export { useHelpCenter, formatHelpCenterCategoryLabel } from './hooks/use-help-center';
+export type { HelpCenterCategory } from './hooks/use-help-center';
+export { HelpCenter, HelpCenterContent, HelpCenterHeader, HelpCenterCategoryTabs, HelpCenterBody, HelpCenterFooter, GuideCatalog, filterHelpCenterGuides, HELP_CENTER_ALL_CATEGORY_VALUE, } from './help-center';
+export type { HelpCenterProps, HelpCenterContentProps, HelpCenterHeaderProps, HelpCenterCategoryTabsProps, HelpCenterBodyProps, HelpCenterFooterProps, GuideCatalogProps, } from './help-center';
+export { createAgGridTargetAdapter, createAgGridReadyTriggerPlugin, emitAgGridReady, } from './adapters/ag-grid-adapter';
+export type { AgGridTargetConfig } from './adapters/ag-grid-adapter';
+export { createDialogOpenedTriggerPlugin, getOverlayScopeRoot, } from './adapters/overlay-adapter';
+export { registerRenderer, getRenderer } from './renderers/renderer-registry';
+export type { GuideManifest, Step, StepContent, TriggerExpression, GuidanceSessionState, GuidancePlugin, GuidanceStorageAdapter, GuidanceAnalyticsAdapter, RendererProps, RenderInstruction, } from '../../../lib/guidance';

package/dist/components/flows/guidance/index.js

@@ -0,0 +1,48 @@
+import { GuidanceProvider as t } from "./guidance-provider.js";
+import { GuidanceContext as a, createGuidanceEngine as n, useGuidanceContext as i } from "./guidance-context.js";
+import { GuidanceTarget as d } from "./guidance-target.js";
+import { useGuidanceTarget as g } from "./use-guidance-target.js";
+import { GuidanceLayer as m } from "./guidance-layer.js";
+import { GuidanceDebugPanel as G, GuidanceErrorBoundary as l } from "./guidance-error-boundary.js";
+import { useGuidance as c, useGuidanceEvents as s, useGuideManifest as H } from "./hooks/use-guidance.js";
+import { formatHelpCenterCategoryLabel as E, useHelpCenter as T } from "./hooks/use-help-center.js";
+import { HelpCenter as R, HelpCenterBody as L, HelpCenterCategoryTabs as P, HelpCenterContent as _, HelpCenterFooter as b } from "./help-center/help-center.js";
+import { filterHelpCenterGuides as O } from "./help-center/filter-help-center-guides.js";
+import { HELP_CENTER_ALL_CATEGORY_VALUE as D } from "./help-center/help-center.constants.js";
+import { createAgGridReadyTriggerPlugin as M, createAgGridTargetAdapter as N, emitAgGridReady as S } from "./adapters/ag-grid-adapter.js";
+import { createDialogOpenedTriggerPlugin as V, getOverlayScopeRoot as Y } from "./adapters/overlay-adapter.js";
+import { getRenderer as j, registerRenderer as k } from "./renderers/renderer-registry.js";
+import { GuideCatalog as w } from "./help-center/guide-catalog.js";
+import { HelpCenterHeader as I } from "./help-center/help-center-header.js";
+export {
+  a as GuidanceContext,
+  G as GuidanceDebugPanel,
+  l as GuidanceErrorBoundary,
+  m as GuidanceLayer,
+  t as GuidanceProvider,
+  d as GuidanceTarget,
+  w as GuideCatalog,
+  D as HELP_CENTER_ALL_CATEGORY_VALUE,
+  R as HelpCenter,
+  L as HelpCenterBody,
+  P as HelpCenterCategoryTabs,
+  _ as HelpCenterContent,
+  b as HelpCenterFooter,
+  I as HelpCenterHeader,
+  M as createAgGridReadyTriggerPlugin,
+  N as createAgGridTargetAdapter,
+  V as createDialogOpenedTriggerPlugin,
+  n as createGuidanceEngine,
+  S as emitAgGridReady,
+  O as filterHelpCenterGuides,
+  E as formatHelpCenterCategoryLabel,
+  Y as getOverlayScopeRoot,
+  j as getRenderer,
+  k as registerRenderer,
+  c as useGuidance,
+  i as useGuidanceContext,
+  s as useGuidanceEvents,
+  g as useGuidanceTarget,
+  H as useGuideManifest,
+  T as useHelpCenter
+};

package/dist/components/flows/guidance/renderers/announcement-renderer.d.ts

@@ -0,0 +1,3 @@
+import { RendererProps } from '../../../../lib/guidance';
+import * as React from 'react';
+export declare function AnnouncementRenderer({ instruction, onNext, onSkip, onDismiss, }: RendererProps): React.ReactElement;

package/dist/components/flows/guidance/renderers/announcement-renderer.js

@@ -0,0 +1,40 @@
+import { jsx as o } from "react/jsx-runtime";
+import "react";
+import { Dialog as d, DialogContent as l } from "../../../feedback/dialog/dialog.js";
+import { GuidanceStepPanel as m } from "./guidance-card-shared.js";
+function b({
+  instruction: e,
+  onNext: n,
+  onSkip: a,
+  onDismiss: t
+}) {
+  const p = e.stepIndex + 1 >= e.totalSteps;
+  return /* @__PURE__ */ o(d, { open: !0, onOpenChange: (r) => !r && t(), children: /* @__PURE__ */ o(
+    l,
+    {
+      "data-component": "guidance-announcement",
+      hideClose: !0,
+      className: "max-w-[400px] gap-0 overflow-hidden p-0 sm:rounded-2xl sm:shadow-elevation-floating",
+      "aria-describedby": void 0,
+      children: /* @__PURE__ */ o(
+        m,
+        {
+          title: e.content.title,
+          body: e.content.body,
+          optionalFooter: e.content.footer,
+          stepIndex: e.stepIndex,
+          totalSteps: e.totalSteps,
+          skippable: e.skippable,
+          primaryActionLabel: p ? "Done" : "Next",
+          onSkip: a,
+          onDismiss: t,
+          onPrimaryAction: n,
+          showPrimaryAction: !0
+        }
+      )
+    }
+  ) });
+}
+export {
+  b as AnnouncementRenderer
+};

package/dist/components/flows/guidance/renderers/coach-mark-renderer.d.ts

@@ -0,0 +1,2 @@
+import { RendererProps } from '../../../../lib/guidance';
+export declare function CoachMarkRenderer(props: RendererProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/flows/guidance/renderers/coach-mark-renderer.js

@@ -0,0 +1,14 @@
+import { jsx as o } from "react/jsx-runtime";
+import { GuidanceTourOverlay as e } from "./guidance-tour-overlay.js";
+function c(r) {
+  return /* @__PURE__ */ o(
+    e,
+    {
+      ...r,
+      overlayComponent: "guidance-coach-mark"
+    }
+  );
+}
+export {
+  c as CoachMarkRenderer
+};

package/dist/components/flows/guidance/renderers/guidance-card-shared.d.ts

@@ -0,0 +1,42 @@
+import * as React from 'react';
+export declare function GuidanceCardCloseButton({ onClose, closeAriaLabel, className, }: {
+    onClose: () => void;
+    closeAriaLabel: string;
+    className?: string;
+}): React.ReactElement;
+export declare function GuidanceStepProgress({ activeStepIndex, totalSteps, }: {
+    activeStepIndex: number;
+    totalSteps: number;
+}): React.ReactElement | null;
+export declare function GuidanceStepProgressDots({ activeStepIndex, totalSteps, }: {
+    activeStepIndex: number;
+    totalSteps: number;
+}): React.ReactElement;
+export interface GuidanceTourNavFooterProps {
+    activeStepIndex: number;
+    totalSteps: number;
+    skippable: boolean;
+    primaryActionLabel: string;
+    onSkip: () => void;
+    onPrimaryAction: () => void;
+    showPrimaryAction: boolean;
+    footerHint?: string | null;
+}
+export declare function GuidanceTourNavFooter({ activeStepIndex, totalSteps, skippable, primaryActionLabel, onSkip, onPrimaryAction, showPrimaryAction, footerHint, }: GuidanceTourNavFooterProps): React.ReactElement;
+export interface GuidanceStepPanelProps {
+    title: string;
+    body: string;
+    optionalFooter?: string;
+    stepIndex: number;
+    totalSteps: number;
+    skippable: boolean;
+    primaryActionLabel: string;
+    onSkip: () => void;
+    onDismiss: () => void;
+    onPrimaryAction: () => void;
+    showPrimaryAction: boolean;
+    footerHint?: string | null;
+    titleId?: string;
+    bodyId?: string;
+}
+export declare function GuidanceStepPanel({ title, body, optionalFooter, stepIndex, totalSteps, skippable, primaryActionLabel, onSkip, onDismiss, onPrimaryAction, showPrimaryAction, footerHint, titleId, bodyId, }: GuidanceStepPanelProps): React.ReactElement;