@burdenoff/microfe-tours 2026.720.1 → 2026.720.2

package/dist/tours/pages/TourBuilderPage.js

@@ -5,18 +5,19 @@ import { useToursPermissionAccess as r } from "../hooks/useToursPermissionAccess
 import { TOUR_PERMISSIONS as i } from "../../constants/permissions.js";
 import { useToursI18n as ee } from "../i18n.js";
 import { emitToursApiFailed as te } from "../telemetry.js";
-import { useTourBuilder as ne } from "../hooks/useTourBuilder.js";
-import { useEffect as a, useMemo as o, useRef as re, useState as s } from "react";
-import { PermissionGate as ie } from "@burdenoff/fe-libs/shared/components";
-import { ArrowLeft as ae, BarChart3 as c, Calendar as l, Eye as u, LayoutTemplate as oe, ListOrdered as d, Save as se, Sparkles as f } from "lucide-react";
-import { Fragment as ce, jsx as p, jsxs as m } from "react/jsx-runtime";
-import { useNavigate as le, useParams as ue } from "react-router-dom";
-import { Button as de, CTAOverflowMenu as fe, EmphasisPanel as pe, GlassCard as me, NextSteps as he, PagePurpose as ge } from "@burdenoff/fe-libs/ui";
-import { useGatewayClient as _e } from "@burdenoff/fe-libs/shared/graphql";
-import { useEventBus as ve } from "@burdenoff/fe-libs/shared/events";
+import { MarkdownEditor as ne } from "../components/MarkdownEditor.js";
+import { useTourBuilder as re } from "../hooks/useTourBuilder.js";
+import { useEffect as a, useMemo as o, useRef as ie, useState as s } from "react";
+import { PermissionGate as ae } from "@burdenoff/fe-libs/shared/components";
+import { ArrowLeft as oe, BarChart3 as c, Calendar as l, Eye as u, LayoutTemplate as se, ListOrdered as d, Save as ce, Sparkles as f } from "lucide-react";
+import { Fragment as le, jsx as p, jsxs as m } from "react/jsx-runtime";
+import { useNavigate as ue, useParams as de } from "react-router-dom";
+import { Button as fe, CTAOverflowMenu as pe, EmphasisPanel as me, GlassCard as he, NextSteps as ge, PagePurpose as _e } from "@burdenoff/fe-libs/ui";
+import { useGatewayClient as ve } from "@burdenoff/fe-libs/shared/graphql";
+import { useEventBus as ye } from "@burdenoff/fe-libs/shared/events";
 import { gql as h } from "@apollo/client/core";
 //#region src/tours/pages/TourBuilderPage.tsx
-var ye = 250, be = h`
+var be = 250, xe = h`
   mutation SeedVibeControlsUserTours {
     seedVibeControlsUserTours {
       productId
@@ -33,7 +34,7 @@ var ye = 250, be = h`
       }
     }
   }
-`, xe = h`
+`, Se = h`
   mutation SeedBuildmyiqUserTours {
     seedBuildmyiqUserTours {
       productId
@@ -51,7 +52,7 @@ var ye = 250, be = h`
     }
   }
 `;
-function Se(e) {
+function Ce(e) {
 	if (!e || typeof e != "object") return null;
 	let t = e, n = t.error;
 	if (n instanceof Error) return n.message;
@@ -665,7 +666,7 @@ function v(e) {
 	let t = _(e);
 	return t ? g.filter((e) => e.productId === t) : [];
 }
-function Ce(e) {
+function we(e) {
 	let t = /* @__PURE__ */ new Map();
 	for (let n of v(e)) (!t.get(n.moduleId) || n.isModuleHome) && t.set(n.moduleId, {
 		moduleId: n.moduleId,
@@ -674,7 +675,7 @@ function Ce(e) {
 	});
 	return [...t.values()];
 }
-function we(e, t) {
+function Te(e, t) {
 	let n = _(t);
 	return n ? v(e).flatMap((e) => e.moduleId === n ? [{
 		pageId: e.pageId,
@@ -683,9 +684,9 @@ function we(e, t) {
 	}] : []) : [];
 }
 function y() {
-	let { tr: h } = ee(), { tourId: g } = ue(), _ = le(), v = e(), { basePath: y = "/" } = v, b = ve(), x = _e("global"), { hasPermission: S, isLoading: C } = r(), w = !g || g === "new", T = S(i.TOUR_CREATE), E = S(i.TOUR_UPDATE), Te = S(i.TOUR_TEMPLATE_CREATE), D = w ? T : E, O = T && E, k = T && E, { tour: A, loadTour: j, createTour: Ee, updateTour: De, saving: M, validationErrors: N, error: Oe } = ne(g), { saveAsTemplate: ke } = n(), { data: Ae, loading: P } = t({
+	let { tr: h } = ee(), { tourId: g } = de(), _ = ue(), v = e(), { basePath: y = "/" } = v, b = ye(), x = ve("global"), { hasPermission: S, isLoading: C } = r(), w = !g || g === "new", T = S(i.TOUR_CREATE), E = S(i.TOUR_UPDATE), Ee = S(i.TOUR_TEMPLATE_CREATE), D = w ? T : E, O = T && E, k = T && E, { tour: A, loadTour: j, createTour: De, updateTour: Oe, saving: M, validationErrors: N, error: ke } = re(g), { saveAsTemplate: Ae } = n(), { data: je, loading: P } = t({
 		variables: {
-			limit: ye,
+			limit: be,
 			offset: 0
 		},
 		fetchPolicy: "cache-and-network",
@@ -703,7 +704,7 @@ function y() {
 		displayOrder: 1,
 		startDate: "",
 		endDate: ""
-	}), [L, R] = s(!1), [z, B] = s(!1), [V, H] = s(!1), [je, Me] = s(!1), [U, Ne] = s(null), [Pe, Fe] = s(null), [Ie, Le] = s(!1), [W, Re] = s(null), [ze, Be] = s(null), G = re(!1), K = o(() => [...Ae?.platformProducts.items ?? []].sort((e, t) => e.name.localeCompare(t.name)), [Ae]), q = o(() => new Set(K.map((e) => e.slug)), [K]), J = o(() => Ce(F.productId), [F.productId]), Y = o(() => new Set(J.map((e) => e.moduleId)), [J]), X = o(() => we(F.productId, F.moduleId), [F.moduleId, F.productId]), Z = o(() => new Set(X.map((e) => e.pageId)), [X]);
+	}), [L, R] = s(!1), [z, B] = s(!1), [V, H] = s(!1), [Me, Ne] = s(!1), [U, Pe] = s(null), [Fe, Ie] = s(null), [Le, Re] = s(!1), [W, ze] = s(null), [Be, Ve] = s(null), G = ie(!1), K = o(() => [...je?.platformProducts.items ?? []].sort((e, t) => e.name.localeCompare(t.name)), [je]), q = o(() => new Set(K.map((e) => e.slug)), [K]), J = o(() => we(F.productId), [F.productId]), Y = o(() => new Set(J.map((e) => e.moduleId)), [J]), X = o(() => Te(F.productId, F.moduleId), [F.moduleId, F.productId]), Z = o(() => new Set(X.map((e) => e.pageId)), [X]);
 	a(() => {
 		G.current || !C && D && g && g !== "new" && j(g);
 	}, [
@@ -747,26 +748,26 @@ function y() {
 		Z,
 		X.length
 	]);
-	let Ve = !!(F.productId && !L && !q.has(F.productId)), He = !!(F.moduleId && !z && !Y.has(F.moduleId)), Ue = !!(F.pageId && !V && !Z.has(F.pageId)), We = async (e) => {
+	let He = !!(F.productId && !L && !q.has(F.productId)), Ue = !!(F.moduleId && !z && !Y.has(F.moduleId)), We = !!(F.pageId && !V && !Z.has(F.pageId)), Ge = async (e) => {
 		e.preventDefault();
 		try {
-			g && g !== "new" ? await De(g, F) : await Ee(F);
+			g && g !== "new" ? await Oe(g, F) : await De(F);
 		} catch {
 			te(b, "tour.save", v);
 		}
-	}, Ge = () => {
+	}, Q = () => {
 		_(`${y}/list`);
-	}, Q = (e) => {
+	}, Ke = (e) => {
 		if (!e) return "";
 		let t = new Date(e);
 		return Number.isNaN(t.getTime()) ? "" : (/* @__PURE__ */ new Date(t.getTime() - t.getTimezoneOffset() * 6e4)).toISOString().slice(0, 16);
-	}, Ke = async () => {
+	}, qe = async () => {
 		if (!g || g === "new") return;
 		let e = `${F.name || A?.name || "Tour"} Template`, t = window.prompt("Template name", e);
 		if (!t) return;
 		let n = window.prompt("Template category (ONBOARDING, FEATURE_ANNOUNCEMENT, HELP, CUSTOM)", "ONBOARDING") || "ONBOARDING";
 		try {
-			await ke(g, {
+			await Ae(g, {
 				name: t,
 				description: F.description,
 				category: n,
@@ -775,18 +776,18 @@ function y() {
 		} catch {
 			te(b, "template.save", v);
 		}
-	}, qe = async () => {
+	}, Je = async () => {
 		if (window.confirm(h("tourBuilder.seedVibeControls.confirm"))) {
-			Me(!0), Ne(null), Fe(null);
+			Ne(!0), Pe(null), Ie(null);
 			try {
-				let e = await x.mutate({ mutation: be }), t = Se(e);
+				let e = await x.mutate({ mutation: xe }), t = Ce(e);
 				if (t) throw Error(t);
 				let n = e.data?.seedVibeControlsUserTours;
 				if (!n) throw Error("Seed mutation returned no result.");
-				Ne(n);
+				Pe(n);
 			} catch (e) {
 				let t = e instanceof Error ? e.message : h("tourBuilder.seedVibeControls.error");
-				Fe(t), b.emit("tours.api.failed", {
+				Ie(t), b.emit("tours.api.failed", {
 					route: "/tours",
 					operation: "tour.seed_vibecontrols_user_tours",
 					errorMessage: t,
@@ -794,21 +795,21 @@ function y() {
 					workspaceId: v.workspaceId
 				}, { component: "microfe-tours" });
 			} finally {
-				Me(!1);
+				Ne(!1);
 			}
 		}
-	}, Je = async () => {
+	}, Ye = async () => {
 		if (window.confirm(h("tourBuilder.seedBuildmyiq.confirm"))) {
-			Le(!0), Re(null), Be(null);
+			Re(!0), ze(null), Ve(null);
 			try {
-				let e = await x.mutate({ mutation: xe }), t = Se(e);
+				let e = await x.mutate({ mutation: Se }), t = Ce(e);
 				if (t) throw Error(t);
 				let n = e.data?.seedBuildmyiqUserTours;
 				if (!n) throw Error("Seed mutation returned no result.");
-				Re(n);
+				ze(n);
 			} catch (e) {
 				let t = e instanceof Error ? e.message : h("tourBuilder.seedBuildmyiq.error");
-				Be(t), b.emit("tours.api.failed", {
+				Ve(t), b.emit("tours.api.failed", {
 					route: "/tours",
 					operation: "tour.seed_buildmyiq_user_tours",
 					errorMessage: t,
@@ -816,10 +817,10 @@ function y() {
 					workspaceId: v.workspaceId
 				}, { component: "microfe-tours" });
 			} finally {
-				Le(!1);
+				Re(!1);
 			}
 		}
-	}, Ye = g && g !== "new" ? [
+	}, Xe = g && g !== "new" ? [
 		{
 			label: A?.steps && A.steps.length > 0 ? `${h("tourBuilder.editSteps")} (${A.steps.length})` : h("tourBuilder.editSteps"),
 			onSelect: () => _(`${y}/${g}/steps`),
@@ -840,10 +841,10 @@ function y() {
 			onSelect: () => _(`${y}/${g}/schedule`),
 			icon: /* @__PURE__ */ p(l, { size: 16 })
 		},
-		...Te ? [{
+		...Ee ? [{
 			label: "Save as Template",
-			onSelect: () => void Ke(),
-			icon: /* @__PURE__ */ p(oe, { size: 16 })
+			onSelect: () => void qe(),
+			icon: /* @__PURE__ */ p(se, { size: 16 })
 		}] : []
 	] : [], $ = g && g !== "new" && E ? [
 		{
@@ -888,10 +889,10 @@ function y() {
 				className: "flex items-center gap-4",
 				children: [/* @__PURE__ */ p("button", {
 					type: "button",
-					onClick: Ge,
+					onClick: Q,
 					className: "p-2 hover:bg-accent rounded-md",
 					"aria-label": h("tourBuilder.goBack"),
-					children: /* @__PURE__ */ p(ae, { size: 20 })
+					children: /* @__PURE__ */ p(oe, { size: 20 })
 				}), /* @__PURE__ */ m("div", {
 					className: "flex-1",
 					children: [/* @__PURE__ */ p("h1", {
@@ -903,13 +904,13 @@ function y() {
 					})]
 				})]
 			}),
-			/* @__PURE__ */ p(ge, { children: h("tourBuilder.purpose") }),
-			$.length > 0 ? /* @__PURE__ */ p(he, {
+			/* @__PURE__ */ p(_e, { children: h("tourBuilder.purpose") }),
+			$.length > 0 ? /* @__PURE__ */ p(ge, {
 				storageKey: "tours-builder",
 				title: h("tourBuilder.nextStepsTitle"),
 				steps: $
 			}) : null,
-			w ? /* @__PURE__ */ m(ce, { children: [/* @__PURE__ */ m(pe, {
+			w ? /* @__PURE__ */ m(le, { children: [/* @__PURE__ */ m(me, {
 				className: "p-4 sm:p-6",
 				children: [
 					/* @__PURE__ */ m("div", {
@@ -925,19 +926,19 @@ function y() {
 							})]
 						}), /* @__PURE__ */ m("button", {
 							type: "button",
-							onClick: () => void qe(),
-							disabled: je || !O,
+							onClick: () => void Je(),
+							disabled: Me || !O,
 							className: "inline-flex min-h-11 items-center justify-center gap-2 rounded-md border border-border-subtle bg-secondary px-4 py-2 text-sm font-medium text-secondary-foreground hover:bg-secondary/80 disabled:cursor-not-allowed disabled:opacity-50",
-							children: [/* @__PURE__ */ p(f, { size: 18 }), h(je ? "tourBuilder.seedVibeControls.loading" : "tourBuilder.seedVibeControls.button")]
+							children: [/* @__PURE__ */ p(f, { size: 18 }), h(Me ? "tourBuilder.seedVibeControls.loading" : "tourBuilder.seedVibeControls.button")]
 						})]
 					}),
 					O ? null : /* @__PURE__ */ p("p", {
 						className: "mt-3 text-sm text-text-secondary",
 						children: h("tourBuilder.seedVibeControls.permissionHint")
 					}),
-					Pe ? /* @__PURE__ */ p("p", {
+					Fe ? /* @__PURE__ */ p("p", {
 						className: "mt-3 text-sm text-status-error-text",
-						children: Pe
+						children: Fe
 					}) : null,
 					U ? /* @__PURE__ */ p("div", {
 						className: "mt-3 rounded-md border border-border-seam bg-bg-surface p-3 text-sm text-text-secondary",
@@ -950,7 +951,7 @@ function y() {
 						})
 					}) : null
 				]
-			}), /* @__PURE__ */ m(pe, {
+			}), /* @__PURE__ */ m(me, {
 				className: "p-4 sm:p-6",
 				children: [
 					/* @__PURE__ */ m("div", {
@@ -966,19 +967,19 @@ function y() {
 							})]
 						}), /* @__PURE__ */ m("button", {
 							type: "button",
-							onClick: () => void Je(),
-							disabled: Ie || !k,
+							onClick: () => void Ye(),
+							disabled: Le || !k,
 							className: "inline-flex min-h-11 items-center justify-center gap-2 rounded-md border border-border-subtle bg-secondary px-4 py-2 text-sm font-medium text-secondary-foreground hover:bg-secondary/80 disabled:cursor-not-allowed disabled:opacity-50",
-							children: [/* @__PURE__ */ p(f, { size: 18 }), h(Ie ? "tourBuilder.seedBuildmyiq.loading" : "tourBuilder.seedBuildmyiq.button")]
+							children: [/* @__PURE__ */ p(f, { size: 18 }), h(Le ? "tourBuilder.seedBuildmyiq.loading" : "tourBuilder.seedBuildmyiq.button")]
 						})]
 					}),
 					k ? null : /* @__PURE__ */ p("p", {
 						className: "mt-3 text-sm text-text-secondary",
 						children: h("tourBuilder.seedBuildmyiq.permissionHint")
 					}),
-					ze ? /* @__PURE__ */ p("p", {
+					Be ? /* @__PURE__ */ p("p", {
 						className: "mt-3 text-sm text-status-error-text",
-						children: ze
+						children: Be
 					}) : null,
 					W ? /* @__PURE__ */ p("div", {
 						className: "mt-3 rounded-md border border-border-seam bg-bg-surface p-3 text-sm text-text-secondary",
@@ -993,10 +994,10 @@ function y() {
 				]
 			})] }) : null,
 			/* @__PURE__ */ m("form", {
-				onSubmit: We,
+				onSubmit: Ge,
 				className: "space-y-6",
 				children: [
-					/* @__PURE__ */ m(me, {
+					/* @__PURE__ */ m(he, {
 						treatment: "plain",
 						className: "p-4 sm:p-6 border-border-seam",
 						children: [/* @__PURE__ */ p("h2", {
@@ -1021,21 +1022,17 @@ function y() {
 									required: !0,
 									"aria-label": h("tourBuilder.labelName")
 								})] }),
-								/* @__PURE__ */ m("div", { children: [/* @__PURE__ */ p("label", {
-									className: "block text-sm font-medium mb-2",
-									htmlFor: "tour-description",
-									children: h("tourBuilder.labelDescription")
-								}), /* @__PURE__ */ p("textarea", {
+								/* @__PURE__ */ p(ne, {
 									id: "tour-description",
+									label: h("tourBuilder.labelDescription"),
 									value: F.description || "",
 									onChange: (e) => I({
 										...F,
-										description: e.target.value
+										description: e
 									}),
-									rows: 3,
-									className: "w-full px-3 py-2 border border-border-subtle rounded-md bg-bg-surface text-text-primary",
+									rows: 4,
 									"aria-label": h("tourBuilder.labelDescription")
-								})] }),
+								}),
 								/* @__PURE__ */ m("div", { children: [
 									/* @__PURE__ */ p("label", {
 										className: "block text-sm font-medium mb-2",
@@ -1083,7 +1080,7 @@ function y() {
 													")"
 												]
 											}, e.id)),
-											Ve ? /* @__PURE__ */ m("option", {
+											He ? /* @__PURE__ */ m("option", {
 												value: F.productId,
 												children: ["Current: ", F.productId]
 											}) : null,
@@ -1152,7 +1149,7 @@ function y() {
 														")"
 													]
 												}, e.moduleId)),
-												He ? /* @__PURE__ */ m("option", {
+												Ue ? /* @__PURE__ */ m("option", {
 													value: F.moduleId,
 													children: ["Current: ", F.moduleId]
 												}) : null,
@@ -1214,7 +1211,7 @@ function y() {
 														")"
 													]
 												}, e.pageId)),
-												Ue ? /* @__PURE__ */ m("option", {
+												We ? /* @__PURE__ */ m("option", {
 													value: F.pageId,
 													children: ["Current: ", F.pageId]
 												}) : null,
@@ -1257,7 +1254,7 @@ function y() {
 							]
 						})]
 					}),
-					/* @__PURE__ */ m(me, {
+					/* @__PURE__ */ m(he, {
 						treatment: "plain",
 						className: "p-4 sm:p-6 border-border-seam",
 						children: [/* @__PURE__ */ p("h2", {
@@ -1331,7 +1328,7 @@ function y() {
 									}), /* @__PURE__ */ p("input", {
 										id: "tour-start-date",
 										type: "datetime-local",
-										value: Q(F.startDate),
+										value: Ke(F.startDate),
 										onChange: (e) => I({
 											...F,
 											startDate: e.target.value ? new Date(e.target.value).toISOString() : void 0
@@ -1345,7 +1342,7 @@ function y() {
 									}), /* @__PURE__ */ p("input", {
 										id: "tour-end-date",
 										type: "datetime-local",
-										value: Q(F.endDate),
+										value: Ke(F.endDate),
 										onChange: (e) => I({
 											...F,
 											endDate: e.target.value ? new Date(e.target.value).toISOString() : void 0
@@ -1357,14 +1354,14 @@ function y() {
 							]
 						})]
 					}),
-					Oe && /* @__PURE__ */ m("div", {
+					ke && /* @__PURE__ */ m("div", {
 						className: "border border-status-error-border rounded-md p-4 bg-status-error-bg/10",
 						children: [/* @__PURE__ */ p("h3", {
 							className: "font-semibold text-status-error-text mb-2",
 							children: h("tourBuilder.errorTitle")
 						}), /* @__PURE__ */ p("p", {
 							className: "text-sm text-status-error-text",
-							children: Oe.message
+							children: ke.message
 						})]
 					}),
 					N.length > 0 && /* @__PURE__ */ m("div", {
@@ -1382,15 +1379,15 @@ function y() {
 					}),
 					/* @__PURE__ */ m("div", {
 						className: "flex flex-wrap items-center gap-3",
-						children: [/* @__PURE__ */ p(ie, {
+						children: [/* @__PURE__ */ p(ae, {
 							permission: w ? i.TOUR_CREATE : i.TOUR_UPDATE,
-							children: /* @__PURE__ */ m(de, {
+							children: /* @__PURE__ */ m(fe, {
 								type: "submit",
 								disabled: M || !D,
 								className: "flex-1 min-w-[200px] min-h-[44px]",
-								children: [/* @__PURE__ */ p(se, { size: 20 }), h(M ? "tourBuilder.saving" : g && g !== "new" ? "tourBuilder.updateTour" : "tourBuilder.createAndAddSteps")]
+								children: [/* @__PURE__ */ p(ce, { size: 20 }), h(M ? "tourBuilder.saving" : g && g !== "new" ? "tourBuilder.updateTour" : "tourBuilder.createAndAddSteps")]
 							})
-						}), g && g !== "new" && Ye.length > 0 && /* @__PURE__ */ p(fe, { actions: Ye })]
+						}), g && g !== "new" && Xe.length > 0 && /* @__PURE__ */ p(pe, { actions: Xe })]
 					})
 				]
 			})
@@ -1407,7 +1404,7 @@ function y() {
 				children: h(w ? "tourBuilder.createAccessDeniedMessage" : "tourBuilder.updateAccessDeniedMessage")
 			})] }), /* @__PURE__ */ p("button", {
 				type: "button",
-				onClick: Ge,
+				onClick: Q,
 				className: "inline-flex items-center justify-center rounded-md border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-accent",
 				children: h("tourBuilder.goBack")
 			})]