@burdenoff/fe-libs 2026.527.2 → 2026.527.4

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

@@ -0,0 +1,68 @@
+import { TourListItemMobile as e } from "./TourListItemMobile.js";
+import { forwardRef as t } from "react";
+import { HelpCircle as n, Sparkles as r, X as i } from "lucide-react";
+import { Fragment as a, jsx as o, jsxs as s } from "react/jsx-runtime";
+//#region src/shared/tours/tourTrigger/MobileTourSheet.tsx
+var c = t(function({ loading: t, tours: c, onClose: l, onStartTour: u }, d) {
+	return /* @__PURE__ */ s(a, { children: [/* @__PURE__ */ o("div", {
+		className: "fixed inset-0 bg-black/50 z-[100] animate-in fade-in duration-200",
+		onClick: l
+	}), /* @__PURE__ */ s("div", {
+		ref: d,
+		className: "fixed inset-x-0 bottom-0 z-[101] bg-bg-surface rounded-t-2xl shadow-xl animate-in slide-in-from-bottom duration-300 max-h-[80vh] flex flex-col",
+		children: [
+			/* @__PURE__ */ o("div", {
+				className: "flex justify-center pt-3 pb-2",
+				children: /* @__PURE__ */ o("div", { className: "w-10 h-1 bg-border-default rounded-full" })
+			}),
+			/* @__PURE__ */ s("div", {
+				className: "flex items-center justify-between px-4 pb-3 border-b border-border-subtle",
+				children: [/* @__PURE__ */ s("div", {
+					className: "flex items-center gap-2",
+					children: [/* @__PURE__ */ o(r, { className: "size-5 text-action-primary-bg" }), /* @__PURE__ */ o("h2", {
+						className: "text-lg font-semibold text-text-primary",
+						children: "Product Tours"
+					})]
+				}), /* @__PURE__ */ o("button", {
+					type: "button",
+					onClick: l,
+					className: "p-2 hover:bg-action-ghost-bg-hover rounded-full",
+					"aria-label": "Close",
+					children: /* @__PURE__ */ o(i, { className: "size-5" })
+				})]
+			}),
+			/* @__PURE__ */ o("div", {
+				className: "flex-1 overflow-y-auto p-4",
+				children: t ? /* @__PURE__ */ o("div", {
+					className: "flex items-center justify-center py-8",
+					children: /* @__PURE__ */ o("div", { className: "animate-spin rounded-full size-6 border-2 border-action-primary-bg border-t-transparent" })
+				}) : c.length > 0 ? /* @__PURE__ */ s("div", {
+					className: "space-y-3",
+					children: [/* @__PURE__ */ o("p", {
+						className: "text-sm text-text-secondary mb-4",
+						children: "Take a guided tour. Current-page tours are shown first."
+					}), c.map((t) => /* @__PURE__ */ o(e, {
+						tour: t,
+						onStart: u
+					}, t.id))]
+				}) : /* @__PURE__ */ s("div", {
+					className: "text-center py-8",
+					children: [
+						/* @__PURE__ */ o(n, { className: "size-12 mx-auto text-text-tertiary mb-3" }),
+						/* @__PURE__ */ o("p", {
+							className: "text-text-secondary",
+							children: "No tours available for this page"
+						}),
+						/* @__PURE__ */ o("p", {
+							className: "text-sm text-text-tertiary mt-1",
+							children: "Check back later or explore other pages"
+						})
+					]
+				})
+			}),
+			/* @__PURE__ */ o("div", { className: "h-safe-area-inset-bottom" })
+		]
+	})] });
+});
+//#endregion
+export { c as MobileTourSheet };

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

@@ -0,0 +1,36 @@
+import { TourStatusChip as e } from "./TourStatusChip.js";
+import { ChevronRight as t } from "lucide-react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region src/shared/tours/tourTrigger/TourListItemDesktop.tsx
+function i({ tour: i, onStart: a }) {
+	return /* @__PURE__ */ n("button", {
+		type: "button",
+		onClick: () => a(i),
+		className: "w-full p-3 hover:bg-action-ghost-bg-hover rounded-md transition-colors text-left group",
+		children: /* @__PURE__ */ r("div", {
+			className: "flex items-center justify-between",
+			children: [/* @__PURE__ */ r("div", {
+				className: "flex-1 min-w-0",
+				children: [
+					/* @__PURE__ */ r("div", {
+						className: "flex items-center gap-2 min-w-0",
+						children: [/* @__PURE__ */ n("h4", {
+							className: "min-w-0 flex-1 font-medium text-text-primary text-sm truncate",
+							children: i.name
+						}), /* @__PURE__ */ n(e, { status: i.myProgress?.status })]
+					}),
+					i.description && /* @__PURE__ */ n("p", {
+						className: "text-xs text-text-secondary mt-0.5 line-clamp-1",
+						children: i.description
+					}),
+					/* @__PURE__ */ n("div", {
+						className: "flex items-center gap-2 mt-1 text-xs text-text-tertiary",
+						children: /* @__PURE__ */ r("span", { children: [i.steps?.length || 0, " steps"] })
+					})
+				]
+			}), /* @__PURE__ */ n(t, { className: "size-4 text-text-tertiary group-hover:text-action-primary-bg group-hover:translate-x-0.5 transition-all" })]
+		})
+	});
+}
+//#endregion
+export { i as TourListItemDesktop };

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

@@ -0,0 +1,47 @@
+import { TourStatusChip as e } from "./TourStatusChip.js";
+import { Play as t } from "lucide-react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region src/shared/tours/tourTrigger/TourListItemMobile.tsx
+function i({ tour: i, onStart: a }) {
+	return /* @__PURE__ */ n("button", {
+		type: "button",
+		onClick: () => a(i),
+		className: "w-full p-4 bg-bg-muted hover:bg-action-ghost-bg-hover rounded-xl transition-colors text-left group",
+		children: /* @__PURE__ */ r("div", {
+			className: "flex items-center justify-between",
+			children: [/* @__PURE__ */ r("div", {
+				className: "flex-1 min-w-0",
+				children: [
+					/* @__PURE__ */ r("div", {
+						className: "flex items-center gap-2 min-w-0",
+						children: [/* @__PURE__ */ n("h3", {
+							className: "min-w-0 flex-1 font-medium text-text-primary truncate",
+							children: i.name
+						}), /* @__PURE__ */ n(e, { status: i.myProgress?.status })]
+					}),
+					i.description && /* @__PURE__ */ n("p", {
+						className: "text-sm text-text-secondary mt-1 line-clamp-2",
+						children: i.description
+					}),
+					/* @__PURE__ */ r("div", {
+						className: "flex items-center gap-3 mt-2 text-xs text-text-tertiary",
+						children: [
+							/* @__PURE__ */ r("span", { children: [i.steps?.length || 0, " steps"] }),
+							/* @__PURE__ */ n("span", { children: "•" }),
+							/* @__PURE__ */ r("span", { children: [
+								"~",
+								Math.ceil((i.steps?.length || 0) * .5),
+								" min"
+							] })
+						]
+					})
+				]
+			}), /* @__PURE__ */ n("div", {
+				className: "ml-3 p-2 bg-action-primary-bg rounded-full text-action-primary-text group-hover:scale-110 transition-transform",
+				children: /* @__PURE__ */ n(t, { className: "size-4" })
+			})]
+		})
+	});
+}
+//#endregion
+export { i as TourListItemMobile };

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

@@ -0,0 +1,30 @@
+import { jsx as e } from "react/jsx-runtime";
+//#region src/shared/tours/tourTrigger/TourStatusChip.tsx
+var t = "bg-bg-muted text-text-tertiary", n = {
+	COMPLETED: {
+		label: "Completed",
+		className: "bg-status-success-bg-subtle text-status-success-text"
+	},
+	IN_PROGRESS: {
+		label: "In progress",
+		className: "bg-status-info-bg-subtle text-status-info-text"
+	},
+	SKIPPED: {
+		label: "Skipped",
+		className: t
+	},
+	DISMISSED: {
+		label: "Dismissed",
+		className: t
+	}
+};
+function r({ status: t }) {
+	if (!t) return null;
+	let r = n[t];
+	return r ? /* @__PURE__ */ e("span", {
+		className: `shrink-0 inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium ${r.className}`,
+		children: r.label
+	}) : null;
+}
+//#endregion
+export { r as TourStatusChip };

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

@@ -0,0 +1,22 @@
+import { forwardRef as e } from "react";
+import { HelpCircle as t } from "lucide-react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region src/shared/tours/tourTrigger/TourTriggerButton.tsx
+var i = e(function({ isOpen: e, hasTours: i, onClick: a }, o) {
+	return /* @__PURE__ */ r("button", {
+		ref: o,
+		onClick: a,
+		className: `
+          relative p-2 rounded-button transition-colors
+          ${e ? "bg-action-ghost-bg-hover" : "hover:bg-action-ghost-bg-hover"}
+          ${i ? "text-text-primary" : "text-text-tertiary"}
+        `,
+		"aria-label": "Help & Tours",
+		"aria-expanded": e,
+		"aria-haspopup": "true",
+		title: "Help & Tours",
+		children: [/* @__PURE__ */ n(t, { className: "size-5" }), i && /* @__PURE__ */ n("span", { className: "absolute top-1 right-1 size-2 bg-action-primary-bg rounded-full" })]
+	});
+});
+//#endregion
+export { i as TourTriggerButton };

package/dist/shared/tours/toursContext/errors.js

@@ -0,0 +1,18 @@
+//#region src/shared/tours/toursContext/errors.ts
+function e(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 t = [
+	"The client has been stopped",
+	"QueryManager stopped",
+	"This Apollo Client has been destroyed",
+	"aborted"
+];
+function n(e) {
+	if (!(e instanceof Error)) return !1;
+	let n = e.message;
+	return e.name === "InvariantError" || n.startsWith("Invariant Violation") ? t.some((e) => n.includes(e)) : !1;
+}
+//#endregion
+export { e as isMyProgressFieldMissingError, n as isTeardownInvariant };

package/dist/shared/tours/toursContext/gql.js

@@ -0,0 +1,152 @@
+import { gql as e } from "@apollo/client/core";
+//#region src/shared/tours/toursContext/gql.ts
+var t = e`
+  fragment ToursCoreFields on Tour {
+    id
+    context {
+      workspaceId
+    }
+    name
+    slug
+    description
+    productId
+    moduleId
+    pageId
+    status
+    isActive
+    triggerType
+    triggerConfig
+    mobileConfig
+    tabletConfig
+    desktopConfig
+    priority
+    displayOrder
+  }
+`, n = e`
+  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
+        }
+      }
+    }
+  }
+`, r = e`
+  ${t}
+  ${n}
+  query GetToursForContext($context: TourContextInput!) {
+    toursForContext(context: $context) {
+      ...ToursCoreFields
+      myProgress {
+        id
+        status
+      }
+      ...ToursStepFields
+    }
+  }
+`, i = e`
+  ${t}
+  ${n}
+  query GetToursForContextFallback($context: TourContextInput!) {
+    toursForContext(context: $context) {
+      ...ToursCoreFields
+      ...ToursStepFields
+    }
+  }
+`, a = e`
+  mutation StartTour($tourId: ID!, $userId: ID!, $deviceType: DeviceType) {
+    startTour(tourId: $tourId, userId: $userId, deviceType: $deviceType) {
+      id
+      tourId
+      userId
+      status
+      currentStepId
+      completedSteps
+      startedAt
+      completedAt
+      lastViewedAt
+    }
+  }
+`, o = e`
+  mutation CompleteTour($tourId: ID!, $userId: ID!) {
+    completeTour(tourId: $tourId, userId: $userId) {
+      id
+      tourId
+      userId
+      status
+      currentStepId
+      completedSteps
+      startedAt
+      completedAt
+      lastViewedAt
+    }
+  }
+`, s = e`
+  mutation SkipTour($tourId: ID!, $userId: ID!) {
+    skipTour(tourId: $tourId, userId: $userId) {
+      id
+      tourId
+      userId
+      status
+      currentStepId
+      completedSteps
+      startedAt
+      completedAt
+      lastViewedAt
+    }
+  }
+`, c = e`
+  mutation CompleteStep($tourId: ID!, $stepId: ID!, $userId: ID!) {
+    completeStep(tourId: $tourId, stepId: $stepId, userId: $userId) {
+      id
+      tourId
+      userId
+      status
+      currentStepId
+      completedSteps
+      startedAt
+      completedAt
+      lastViewedAt
+    }
+  }
+`, l = e`
+  mutation TrackTourEvent($input: RecordTourAnalyticsInput!) {
+    trackTourEvent(input: $input) {
+      id
+      tourId
+      eventType
+      stepId
+      stepOrder
+      timestamp
+    }
+  }
+`;
+//#endregion
+export { c as COMPLETE_STEP, o as COMPLETE_TOUR, r as GET_TOURS_FOR_CONTEXT, i as GET_TOURS_FOR_CONTEXT_WITHOUT_PROGRESS, s as SKIP_TOUR, a as START_TOUR, l as TRACK_TOUR_EVENT };

package/dist/shared/tours/toursContext/route.js

@@ -0,0 +1,20 @@
+//#region src/shared/tours/toursContext/route.ts
+function e(e, t) {
+	let n = e.split("/").filter(Boolean);
+	return n.length === 0 ? t : n[0];
+}
+function t(t, n, r, i) {
+	let a = t.split("/").filter(Boolean), o = i ? i(t) : e(t, r);
+	return a.length === 0 ? {
+		moduleId: n,
+		pageId: o
+	} : a[0] === n ? {
+		moduleId: n,
+		pageId: a[1] ?? r
+	} : {
+		moduleId: a[0],
+		pageId: o
+	};
+}
+//#endregion
+export { t as deriveRouteContext };

package/dist/shared/tours/toursContext/session.js

@@ -0,0 +1,19 @@
+import { detectDeviceType as e } from "../types.js";
+//#region src/shared/tours/toursContext/session.ts
+function t() {
+	let t = e();
+	return t === "mobile" ? "MOBILE" : t === "tablet" ? "TABLET" : "DESKTOP";
+}
+function n() {
+	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)}`;
+	}
+}
+//#endregion
+export { n as getOrCreateTourSessionId, t as normalizeDeviceType };

package/dist/shared/tours/toursContext/useIdleReady.js

@@ -0,0 +1,18 @@
+import { useEffect as e, useState as t } from "react";
+//#region src/shared/tours/toursContext/useIdleReady.ts
+function n() {
+	let [n, r] = t(!1);
+	return e(() => {
+		let e = () => r(!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);
+	}, []), n;
+}
+//#endregion
+export { n as useIdleReady };

package/dist/shared/tours/toursContext/useTourMutations.js

@@ -0,0 +1,118 @@
+import { withTourProgressStatus as e } from "../progress.js";
+import { COMPLETE_STEP as t, COMPLETE_TOUR as n, SKIP_TOUR as r, START_TOUR as i, TRACK_TOUR_EVENT as a } from "./gql.js";
+import { getOrCreateTourSessionId as o, normalizeDeviceType as s } from "./session.js";
+import { useCallback as c } from "react";
+//#region src/shared/tours/toursContext/useTourMutations.ts
+function l({ globalClient: l, userId: u, productSlug: d, moduleId: f, pageId: p, workspaceId: m, setAllTours: h, allToursRef: g, progressMutationVersionRef: _, latestProgressMutationByTourRef: v }) {
+	return {
+		trackProgress: c(async (t, a, o) => {
+			if (!l || !u) return;
+			let c = a === "started" ? "IN_PROGRESS" : a === "completed" ? "COMPLETED" : "SKIPPED", d = g.current.find((e) => e.id === t)?.myProgress, f = _.current + 1;
+			_.current = f, v.current.set(t, f), h((n) => {
+				let r = e(n, t, c);
+				return g.current = r, r;
+			});
+			try {
+				if (a === "started") {
+					await l.mutate({
+						mutation: i,
+						variables: {
+							tourId: t,
+							userId: u,
+							deviceType: s()
+						}
+					});
+					return;
+				}
+				if (a === "completed") {
+					await l.mutate({
+						mutation: n,
+						variables: {
+							tourId: t,
+							userId: u
+						}
+					});
+					return;
+				}
+				await l.mutate({
+					mutation: r,
+					variables: {
+						tourId: t,
+						userId: u
+					}
+				});
+			} catch {
+				if (v.current.get(t) !== f) return;
+				h((e) => {
+					let n = e.map((e) => e.id === t ? {
+						...e,
+						myProgress: d
+					} : e);
+					return g.current = n, n;
+				});
+			} finally {
+				v.current.get(t) === f && v.current.delete(t);
+			}
+		}, [
+			l,
+			u,
+			h,
+			g,
+			_,
+			v
+		]),
+		recordStepCompletion: c(async (e, n) => {
+			if (!(!l || !u || !n)) try {
+				await l.mutate({
+					mutation: t,
+					variables: {
+						tourId: e,
+						stepId: n,
+						userId: u
+					}
+				});
+			} catch {}
+		}, [l, u]),
+		trackEvent: c(async (e, t, n) => {
+			if (!(!l || !u)) try {
+				await l.mutate({
+					mutation: a,
+					variables: { input: {
+						tourId: t,
+						userId: u,
+						sessionId: o(),
+						eventType: e,
+						stepId: n?.stepId,
+						stepOrder: n?.stepOrder,
+						productId: d,
+						moduleId: f,
+						pageId: p,
+						deviceType: s(),
+						userAgent: typeof navigator < "u" ? navigator.userAgent : void 0,
+						duration: n?.duration,
+						metadata: n?.metadata,
+						context: m ? {
+							workspaceId: m,
+							productId: d,
+							moduleId: f,
+							pageId: p
+						} : {
+							productId: d,
+							moduleId: f,
+							pageId: p
+						}
+					} }
+				});
+			} catch {}
+		}, [
+			l,
+			f,
+			p,
+			d,
+			u,
+			m
+		])
+	};
+}
+//#endregion
+export { l as useTourMutations };

package/dist/shared-events.js

@@ -5,7 +5,7 @@ import { BackendAuditSink as r } from "./shared/events/sinks/BackendAuditSink.js
 import { RybbitSink as i } from "./shared/events/sinks/RybbitSink.js";
 import { OtelBrowserSink as a } from "./shared/events/sinks/OtelBrowserSink.js";
 import "./shared/events/sinks/index.js";
-import { createContext as o, useCallback as s, useContext as c, useEffect as l, useMemo as u } from "react";
+import { createContext as o, use as s, useCallback as c, useEffect as l, useMemo as u } from "react";
 import { jsx as d } from "react/jsx-runtime";
 //#region src/shared/events/index.tsx
 var f = o({
@@ -122,7 +122,7 @@ function v({ appName: e, appVersion: t = "0.0.0", appEnv: n = "dev", sourceMfe:
 	};
 }
 function y() {
-	return c(f);
+	return s(f);
 }
 function b(e, t) {
 	let n = y();
@@ -134,7 +134,7 @@ function b(e, t) {
 }
 function x(e, t) {
 	let n = y();
-	return s((r) => n.emit(e, r, t), [
+	return c((r) => n.emit(e, r, t), [
 		n,
 		e,
 		t

package/dist/shared-hooks.js

@@ -28,7 +28,7 @@ import { useHasAnimated as J } from "./shared/hooks/useHasAnimated.js";
 import { useReferralAttribution as Y } from "./shared/hooks/useReferralAttribution.js";
 import { useRecordProductVisit as X } from "./shared/hooks/useRecordProductVisit.js";
 import { QUOTA_EXHAUSTED_EVENT as Z, dispatchQuotaExhausted as Q, useQuotaErrorToast as ne } from "./shared/hooks/useQuotaErrorToast.js";
-import re, { useContext as ie } from "react";
+import re, { use as ie } from "react";
 //#region src/shared/hooks/index.ts
 var $ = re.createContext(null);
 function ae() {

package/dist/storage/SaveToFilesButton.js

@@ -19,7 +19,7 @@ function p({ source: p, defaultFolderPath: m, onDownload: h, onSaved: g, label:
 			onClick: () => void h(),
 			"data-testid": `${y}-download`,
 			className: "rounded-r-none",
-			children: [/* @__PURE__ */ u(s, { className: "mr-1.5 h-3.5 w-3.5" }), _]
+			children: [/* @__PURE__ */ u(s, { className: "mr-1.5 size-3.5" }), _]
 		}), /* @__PURE__ */ d(t, { children: [/* @__PURE__ */ u(i, {
 			asChild: !0,
 			children: /* @__PURE__ */ u(e, {
@@ -36,11 +36,11 @@ function p({ source: p, defaultFolderPath: m, onDownload: h, onSaved: g, label:
 			children: [/* @__PURE__ */ d(r, {
 				onSelect: () => void h(),
 				"data-testid": `${y}-menu-download`,
-				children: [/* @__PURE__ */ u(s, { className: "mr-2 h-3.5 w-3.5" }), "Download"]
+				children: [/* @__PURE__ */ u(s, { className: "mr-2 size-3.5" }), "Download"]
 			}), /* @__PURE__ */ d(r, {
 				onSelect: () => S(!0),
 				"data-testid": `${y}-menu-save`,
-				children: [/* @__PURE__ */ u(c, { className: "mr-2 h-3.5 w-3.5" }), "Save to Files…"]
+				children: [/* @__PURE__ */ u(c, { className: "mr-2 size-3.5" }), "Save to Files…"]
 			})]
 		})] })]
 	}), /* @__PURE__ */ u(a, {

package/dist/storage/SaveToFilesDialog.js

@@ -79,7 +79,7 @@ function g({ open: g, onOpenChange: _, source: v, defaultFolderPath: y, filename
 					} catch {}
 				},
 				"data-testid": "save-to-files-save",
-				children: T ? /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m(l, { className: "mr-2 h-3 w-3" }), "Saving…"] }) : "Save"
+				children: T ? /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m(l, { className: "mr-2 size-3" }), "Saving…"] }) : "Save"
 			})] })
 		] })
 	});

package/dist/tag/TagBadge.js

@@ -35,7 +35,7 @@ function u({ label: u, icon: d, color: f, description: p, removable: m = !1, onC
 				},
 				className: "flex-shrink-0 ml-0.5 rounded-full p-0.5 hover:bg-black/10 dark:hover:bg-white/10 transition-colors",
 				"aria-label": `Remove ${u}`,
-				children: /* @__PURE__ */ s(o, { className: "h-3 w-3" })
+				children: /* @__PURE__ */ s(o, { className: "size-3" })
 			})
 		]
 	});