@burdenoff/fe-libs 2026.527.2 → 2026.527.4

package/dist/shared/tours/ToursContext.js

@@ -5,460 +5,170 @@ import { useActiveContext as n } from "../providers/shell/ActiveContextProvider.
 import { useAppShell as r } from "../providers/shell/AppShellContext.js";
 import { useLogger as i } from "../logger/useLogger.js";
 import "../../shared-logger.js";
-import { detectDeviceType as a } from "./types.js";
-import { isTourVisibleForContext as o } from "./routeCatalog.js";
-import { withTourProgressStatus as s } from "./progress.js";
-import { createContext as c, useCallback as l, useContext as u, useEffect as d, useMemo as f, useRef as p, useState as m } from "react";
-import { jsx as ee } from "react/jsx-runtime";
-import { gql as h } from "@apollo/client/core";
-import { useLocation as te } from "react-router-dom";
+import { isTourVisibleForContext as a } from "./routeCatalog.js";
+import { GET_TOURS_FOR_CONTEXT as o, GET_TOURS_FOR_CONTEXT_WITHOUT_PROGRESS as s } from "./toursContext/gql.js";
+import { isMyProgressFieldMissingError as c, isTeardownInvariant as l } from "./toursContext/errors.js";
+import { normalizeDeviceType as u } from "./toursContext/session.js";
+import { deriveRouteContext as d } from "./toursContext/route.js";
+import { useIdleReady as ee } from "./toursContext/useIdleReady.js";
+import { useTourMutations as te } from "./toursContext/useTourMutations.js";
+import { createContext as f, use as p, useCallback as m, useEffect as h, useMemo as g, useRef as _, useState as v } from "react";
+import { jsx as ne } from "react/jsx-runtime";
+import { useLocation as y } from "react-router-dom";
 //#region src/shared/tours/ToursContext.tsx
-var g = h`
-  fragment ToursCoreFields on Tour {
-    id
-    context {
-      workspaceId
-    }
-    name
-    slug
-    description
-    productId
-    moduleId
-    pageId
-    status
-    isActive
-    triggerType
-    triggerConfig
-    mobileConfig
-    tabletConfig
-    desktopConfig
-    priority
-    displayOrder
-  }
-`, _ = h`
-  fragment ToursStepFields on Tour {
-    steps {
-      id
-      tourId
-      title
-      content
-      stepOrder
-      targetSelector
-      placement
-      targetSelectorMobile
-      targetSelectorTablet
-      targetSelectorDesktop
-      customData
-      actions
-      requireInteraction
-      waitForSelector
-      waitForEvent
-      waitForTimeout
-      skipConditions
-      media {
-        id
-        position
-        mediaId
-        media {
-          id
-          name
-          type
-          cdnUrl
-          mimeType
-          altText
-          caption
-        }
-      }
-    }
-  }
-`, v = h`
-  ${g}
-  ${_}
-  query GetToursForContext($context: TourContextInput!) {
-    toursForContext(context: $context) {
-      ...ToursCoreFields
-      myProgress {
-        id
-        status
-      }
-      ...ToursStepFields
-    }
-  }
-`, y = h`
-  ${g}
-  ${_}
-  query GetToursForContextFallback($context: TourContextInput!) {
-    toursForContext(context: $context) {
-      ...ToursCoreFields
-      ...ToursStepFields
-    }
-  }
-`;
-function b(e) {
-	let t = e instanceof Error || typeof e == "object" && e && "message" in e && typeof e.message == "string" ? e.message : "";
-	return t.includes("myProgress") ? t.includes("Cannot query field") || t.includes("Unknown field") : !1;
-}
-var ne = h`
-  mutation StartTour($tourId: ID!, $userId: ID!, $deviceType: DeviceType) {
-    startTour(tourId: $tourId, userId: $userId, deviceType: $deviceType) {
-      id
-      tourId
-      userId
-      status
-      currentStepId
-      completedSteps
-      startedAt
-      completedAt
-      lastViewedAt
-    }
-  }
-`, re = h`
-  mutation CompleteTour($tourId: ID!, $userId: ID!) {
-    completeTour(tourId: $tourId, userId: $userId) {
-      id
-      tourId
-      userId
-      status
-      currentStepId
-      completedSteps
-      startedAt
-      completedAt
-      lastViewedAt
-    }
-  }
-`, ie = h`
-  mutation SkipTour($tourId: ID!, $userId: ID!) {
-    skipTour(tourId: $tourId, userId: $userId) {
-      id
-      tourId
-      userId
-      status
-      currentStepId
-      completedSteps
-      startedAt
-      completedAt
-      lastViewedAt
-    }
-  }
-`, ae = h`
-  mutation CompleteStep($tourId: ID!, $stepId: ID!, $userId: ID!) {
-    completeStep(tourId: $tourId, stepId: $stepId, userId: $userId) {
-      id
-      tourId
-      userId
-      status
-      currentStepId
-      completedSteps
-      startedAt
-      completedAt
-      lastViewedAt
-    }
-  }
-`, oe = h`
-  mutation TrackTourEvent($input: RecordTourAnalyticsInput!) {
-    trackTourEvent(input: $input) {
-      id
-      tourId
-      eventType
-      stepId
-      stepOrder
-      timestamp
-    }
-  }
-`, x = [
-	"The client has been stopped",
-	"QueryManager stopped",
-	"This Apollo Client has been destroyed",
-	"aborted"
-];
-function se(e) {
-	if (!(e instanceof Error)) return !1;
-	let t = e.message;
-	return e.name === "InvariantError" || t.startsWith("Invariant Violation") ? x.some((e) => t.includes(e)) : !1;
-}
-function S(e, t) {
-	let n = e.split("/").filter(Boolean);
-	return n.length === 0 ? t : n[0];
-}
-function C() {
-	let e = a();
-	return e === "mobile" ? "MOBILE" : e === "tablet" ? "TABLET" : "DESKTOP";
-}
-function ce() {
-	let e = "bf-tour-session-id";
-	try {
-		let t = sessionStorage.getItem(e);
-		if (t) return t;
-		let n = typeof crypto < "u" && typeof crypto.randomUUID == "function" ? crypto.randomUUID() : `tour-session-${Date.now()}-${Math.random().toString(36).slice(2)}`;
-		return sessionStorage.setItem(e, n), n;
-	} catch {
-		return `tour-session-${Date.now()}-${Math.random().toString(36).slice(2)}`;
-	}
-}
-function le(e, t, n, r) {
-	let i = e.split("/").filter(Boolean), a = r ? r(e) : S(e, n);
-	return i.length === 0 ? {
-		moduleId: t,
-		pageId: a
-	} : i[0] === t ? {
-		moduleId: t,
-		pageId: i[1] ?? n
-	} : {
-		moduleId: i[0],
-		pageId: a
-	};
-}
-var w = c(null);
-function T({ children: a, defaultPageId: c = "home", getPageIdFromPath: u, disabled: h = !1 }) {
-	let g = te(), _ = e("global"), { workspaceId: x } = n(), { user: S } = t(), { productSlug: T } = r(), E = i("ToursContext"), D = x ?? void 0, O = h || g.pathname.startsWith("/devportal"), { moduleId: k, pageId: A } = f(() => le(g.pathname, T, c, u), [
-		c,
-		u,
-		g.pathname,
-		T
-	]), [j, M] = m([]), [N, P] = m(!1), [F, I] = m(null), [L, ue] = m(!1);
-	d(() => {
-		let e = () => ue(!0);
-		if (typeof window < "u" && "requestIdleCallback" in window) {
-			let t = window.requestIdleCallback(e, { timeout: 2e3 });
-			return () => {
-				window.cancelIdleCallback?.(t);
-			};
-		}
-		let t = setTimeout(e, 500);
-		return () => clearTimeout(t);
-	}, []);
-	let R = p([]), z = p(0), B = p(/* @__PURE__ */ new Map()), V = p(void 0), H = p(!1), U = p(!0), W = p(0), G = p(!0);
-	d(() => (U.current = !0, () => {
+var b = f(null);
+function x({ children: f, defaultPageId: p = "home", getPageIdFromPath: x, disabled: S = !1 }) {
+	let C = y(), w = e("global"), { workspaceId: T } = n(), { user: E } = t(), { productSlug: D } = r(), O = i("ToursContext"), k = T ?? void 0, A = S || C.pathname.startsWith("/devportal"), { moduleId: j, pageId: M } = g(() => d(C.pathname, D, p, x), [
+		p,
+		x,
+		C.pathname,
+		D
+	]), [N, P] = v([]), [F, I] = v(!1), [L, R] = v(null), z = ee(), B = _([]), re = _(0), ie = _(/* @__PURE__ */ new Map()), V = _(void 0), H = _(!1), U = _(!0), W = _(0), G = _(!0);
+	h(() => (U.current = !0, () => {
 		U.current = !1;
 	}), []);
-	let K = l(async (e = !1) => {
-		if (!L && !e) return;
-		if (O) {
-			U.current && (M([]), P(!1), I(null));
+	let K = m(async (e = !1) => {
+		if (!z && !e) return;
+		if (A) {
+			U.current && (P([]), I(!1), R(null));
 			return;
 		}
-		if (!_) return;
-		let t = E.child("fetch", {
-			productSlug: T,
-			workspaceId: D,
-			moduleId: k,
-			pageId: A
-		}), n = C(), r = [
-			T,
-			k ?? "",
-			A ?? "",
+		if (!w) return;
+		let t = O.child("fetch", {
+			productSlug: D,
+			workspaceId: k,
+			moduleId: j,
+			pageId: M
+		}), n = u(), r = [
 			D,
+			j ?? "",
+			M ?? "",
+			k,
 			n,
-			S?.id ?? "anonymous"
+			E?.id ?? "anonymous"
 		].join("::");
 		if (!e && H.current && V.current === r) return;
-		U.current && (P(!0), I(null));
+		U.current && (I(!0), R(null));
 		let i = ++W.current;
 		try {
 			let e = { context: {
-				productId: T,
-				moduleId: k,
-				pageId: A,
-				workspaceId: D,
+				productId: D,
+				moduleId: j,
+				pageId: M,
+				workspaceId: k,
 				deviceType: n
-			} }, a = "network-only", o, s = G.current ? v : y;
+			} }, a = "network-only", l, u = G.current ? o : s;
 			try {
-				o = await _.query({
-					query: s,
+				l = await w.query({
+					query: u,
 					variables: e,
 					fetchPolicy: a,
 					errorPolicy: "none"
 				});
-				let n = o.errors;
-				s === v && n?.some((e) => b(e)) && (G.current = !1, t.warn("[ToursContext] Gateway returned a Tour.myProgress validation error — falling back to query without progress chips until the backend field is published."), o = await _.query({
-					query: y,
+				let n = l.errors;
+				u === o && n?.some((e) => c(e)) && (G.current = !1, t.warn("[ToursContext] Gateway returned a Tour.myProgress validation error — falling back to query without progress chips until the backend field is published."), l = await w.query({
+					query: s,
 					variables: e,
 					fetchPolicy: a,
 					errorPolicy: "none"
 				}));
 			} catch (n) {
-				if (s === v && b(n)) G.current = !1, t.warn("[ToursContext] Gateway does not expose Tour.myProgress yet — falling back to query without progress chips until the backend field is published."), o = await _.query({
-					query: y,
+				if (u === o && c(n)) G.current = !1, t.warn("[ToursContext] Gateway does not expose Tour.myProgress yet — falling back to query without progress chips until the backend field is published."), l = await w.query({
+					query: s,
 					variables: e,
 					fetchPolicy: a,
 					errorPolicy: "none"
 				});
 				else throw n;
 			}
-			let c = (o.data?.toursForContext ?? []).filter((e, t, n) => n.findIndex((t) => t.id === e.id) === t);
-			U.current && i === W.current && (M(c), V.current = r, H.current = !0);
+			let d = (l.data?.toursForContext ?? []).filter((e, t, n) => n.findIndex((t) => t.id === e.id) === t);
+			U.current && i === W.current && (P(d), V.current = r, H.current = !0);
 		} catch (e) {
-			if (!U.current || i !== W.current || se(e)) return;
+			if (!U.current || i !== W.current || l(e)) return;
 			let n = e instanceof Error ? e : /* @__PURE__ */ Error("Failed to fetch tours");
-			t.error("Failed to fetch tours for context", n), I(n), M([]);
+			t.error("Failed to fetch tours for context", n), R(n), P([]);
 		} finally {
-			U.current && i === W.current && P(!1);
+			U.current && i === W.current && I(!1);
 		}
 	}, [
-		L,
-		O,
-		_,
-		E,
-		k,
+		z,
 		A,
-		T,
+		w,
+		O,
+		j,
+		M,
 		D,
-		S?.id
-	]), q = p(S?.id);
-	d(() => {
-		q.current !== S?.id && (q.current = S?.id, H.current = !1, V.current = void 0, U.current && M([]));
-	}, [S?.id]), d(() => {
+		k,
+		E?.id
+	]), q = _(E?.id);
+	h(() => {
+		q.current !== E?.id && (q.current = E?.id, H.current = !1, V.current = void 0, U.current && P([]));
+	}, [E?.id]), h(() => {
 		K();
-	}, [K]), d(() => {
-		R.current = j;
-	}, [j]);
-	let J = l(() => {
+	}, [K]), h(() => {
+		B.current = N;
+	}, [N]);
+	let J = m(() => {
 		K(!0);
-	}, [K]), Y = f(() => j.filter((e) => e.isActive && e.steps?.length > 0 && o(e, {
-		productId: T,
-		moduleId: k,
-		pageId: A
+	}, [K]), Y = g(() => N.filter((e) => e.isActive && e.steps?.length > 0 && a(e, {
+		productId: D,
+		moduleId: j,
+		pageId: M
 	})).sort((e, t) => (t.priority ?? 0) - (e.priority ?? 0)), [
+		N,
 		j,
-		k,
-		A,
-		T
-	]), X = f(() => L ? Y.find((e) => e.triggerType === "AUTO_FIRST_VISIT" || e.triggerType === "AUTO_ALWAYS") ?? null : null, [Y, L]), Z = l(async (e, t, n) => {
-		if (!_ || !S?.id) return;
-		let r = t === "started" ? "IN_PROGRESS" : t === "completed" ? "COMPLETED" : "SKIPPED", i = R.current.find((t) => t.id === e)?.myProgress, a = z.current + 1;
-		z.current = a, B.current.set(e, a), M((t) => {
-			let n = s(t, e, r);
-			return R.current = n, n;
-		});
-		try {
-			if (t === "started") {
-				await _.mutate({
-					mutation: ne,
-					variables: {
-						tourId: e,
-						userId: S.id,
-						deviceType: C()
-					}
-				});
-				return;
-			}
-			if (t === "completed") {
-				await _.mutate({
-					mutation: re,
-					variables: {
-						tourId: e,
-						userId: S.id
-					}
-				});
-				return;
-			}
-			await _.mutate({
-				mutation: ie,
-				variables: {
-					tourId: e,
-					userId: S.id
-				}
-			});
-		} catch {
-			if (B.current.get(e) !== a) return;
-			M((t) => {
-				let n = t.map((t) => t.id === e ? {
-					...t,
-					myProgress: i
-				} : t);
-				return R.current = n, n;
-			});
-		} finally {
-			B.current.get(e) === a && B.current.delete(e);
-		}
-	}, [_, S?.id]), Q = l(async (e, t) => {
-		if (!(!_ || !S?.id || !t)) try {
-			await _.mutate({
-				mutation: ae,
-				variables: {
-					tourId: e,
-					stepId: t,
-					userId: S.id
-				}
-			});
-		} catch {}
-	}, [_, S?.id]), $ = l(async (e, t, n) => {
-		if (!(!_ || !S?.id)) try {
-			await _.mutate({
-				mutation: oe,
-				variables: { input: {
-					tourId: t,
-					userId: S.id,
-					sessionId: ce(),
-					eventType: e,
-					stepId: n?.stepId,
-					stepOrder: n?.stepOrder,
-					productId: T,
-					moduleId: k,
-					pageId: A,
-					deviceType: C(),
-					userAgent: typeof navigator < "u" ? navigator.userAgent : void 0,
-					duration: n?.duration,
-					metadata: n?.metadata,
-					context: D ? {
-						workspaceId: D,
-						productId: T,
-						moduleId: k,
-						pageId: A
-					} : {
-						productId: T,
-						moduleId: k,
-						pageId: A
-					}
-				} }
-			});
-		} catch {}
-	}, [
-		_,
-		k,
-		A,
-		T,
-		S?.id,
+		M,
 		D
-	]), de = f(() => ({
-		tours: j,
+	]), X = g(() => z ? Y.find((e) => e.triggerType === "AUTO_FIRST_VISIT" || e.triggerType === "AUTO_ALWAYS") ?? null : null, [Y, z]), { trackProgress: Z, recordStepCompletion: Q, trackEvent: $ } = te({
+		globalClient: w,
+		userId: E?.id,
+		productSlug: D,
+		moduleId: j,
+		pageId: M,
+		workspaceId: k,
+		setAllTours: P,
+		allToursRef: B,
+		progressMutationVersionRef: re,
+		latestProgressMutationByTourRef: ie
+	}), ae = g(() => ({
+		tours: N,
 		pageTours: Y,
-		loading: N,
-		error: F,
+		loading: F,
+		error: L,
 		refetch: J,
 		trackProgress: Z,
 		recordStepCompletion: Q,
 		trackEvent: $,
 		autoStartTour: X,
-		productId: T,
-		moduleId: k,
-		pageId: A
+		productId: D,
+		moduleId: j,
+		pageId: M
 	}), [
-		j,
+		N,
 		X,
+		L,
 		F,
-		N,
-		k,
-		A,
+		j,
+		M,
 		Y,
-		T,
+		D,
 		Q,
 		J,
 		$,
 		Z
 	]);
-	return /* @__PURE__ */ ee(w.Provider, {
-		value: de,
-		children: a
+	return /* @__PURE__ */ ne(b.Provider, {
+		value: ae,
+		children: f
 	});
 }
-function E() {
-	let e = u(w);
+function S() {
+	let e = p(b);
 	if (!e) throw Error("useToursContext must be used within a ToursProvider");
 	return e;
 }
-function D() {
-	return u(w) || {
+function C() {
+	return p(b) || {
 		tours: [],
 		pageTours: [],
 		loading: !1,
@@ -473,8 +183,8 @@ function D() {
 		pageId: void 0
 	};
 }
-function O() {
-	let e = E();
+function w() {
+	let e = S();
 	return {
 		tours: e.pageTours,
 		loading: e.loading,
@@ -483,8 +193,8 @@ function O() {
 		trackProgress: e.trackProgress
 	};
 }
-function k() {
-	return E().autoStartTour;
+function T() {
+	return S().autoStartTour;
 }
 //#endregion
-export { T as ToursProvider, k as useAutoStartTour, D as useSafeToursContext, O as useTours, E as useToursContext };
+export { x as ToursProvider, T as useAutoStartTour, C as useSafeToursContext, w as useTours, S as useToursContext };

package/dist/shared/tours/tourTrigger/DesktopTourDropdown.js

@@ -0,0 +1,48 @@
+import { TourListItemDesktop as e } from "./TourListItemDesktop.js";
+import { forwardRef as t } from "react";
+import { Sparkles as n } from "lucide-react";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/shared/tours/tourTrigger/DesktopTourDropdown.tsx
+var a = t(function({ loading: t, tours: a, onStartTour: o }, s) {
+	return /* @__PURE__ */ i("div", {
+		ref: s,
+		className: "absolute right-0 top-full mt-2 w-80 bg-bg-surface rounded-lg shadow-xl border border-border-subtle z-50 animate-in fade-in slide-in-from-top-2 duration-200",
+		children: [
+			/* @__PURE__ */ i("div", {
+				className: "flex items-center gap-2 px-4 py-3 border-b border-border-subtle",
+				children: [/* @__PURE__ */ r(n, { className: "size-4 text-action-primary-bg" }), /* @__PURE__ */ r("h3", {
+					className: "font-medium text-text-primary",
+					children: "Product Tours"
+				})]
+			}),
+			/* @__PURE__ */ r("div", {
+				className: "max-h-80 overflow-y-auto",
+				children: t ? /* @__PURE__ */ r("div", {
+					className: "flex items-center justify-center py-6",
+					children: /* @__PURE__ */ r("div", { className: "animate-spin rounded-full size-5 border-2 border-action-primary-bg border-t-transparent" })
+				}) : a.length > 0 ? /* @__PURE__ */ r("div", {
+					className: "p-2",
+					children: a.map((t) => /* @__PURE__ */ r(e, {
+						tour: t,
+						onStart: o
+					}, t.id))
+				}) : /* @__PURE__ */ r("div", {
+					className: "text-center py-6 px-4",
+					children: /* @__PURE__ */ r("p", {
+						className: "text-sm text-text-secondary",
+						children: "No tours available for this page"
+					})
+				})
+			}),
+			a.length > 0 && /* @__PURE__ */ r("div", {
+				className: "px-4 py-2 border-t border-border-subtle bg-bg-muted/50 rounded-b-lg",
+				children: /* @__PURE__ */ r("p", {
+					className: "text-xs text-text-tertiary text-center",
+					children: "Click a tour to start the guided walkthrough"
+				})
+			})
+		]
+	});
+});
+//#endregion
+export { a as DesktopTourDropdown };