@burdenoff/microfe-tours 2026.519.1 → 2026.523.2

package/dist/tours/pages/TourBuilderPage.js

@@ -3,15 +3,51 @@ import { useGetPlatformProductsForToursQuery as t } from "../../generated/global
 import { useTourLifecycle as n } from "../hooks/useTourLifecycle.js";
 import { useToursPermissionAccess as r } from "../hooks/useToursPermissionAccess.js";
 import { TOUR_PERMISSIONS as i } from "../../constants/permissions.js";
-import { useToursI18n as a } from "../i18n.js";
-import { useTourBuilder as o } from "../hooks/useTourBuilder.js";
-import { useEffect as s, useMemo as c, useRef as l, useState as u } from "react";
-import { PermissionGate as d } from "@burdenoff/fe-libs/shared/components";
-import { ArrowLeft as f, BarChart3 as p, Calendar as ee, Eye as te, LayoutTemplate as ne, ListOrdered as m, Save as h } from "lucide-react";
-import { Fragment as g, jsx as _, jsxs as v } from "react/jsx-runtime";
-import { useNavigate as re, useParams as ie } from "react-router-dom";
+import { useToursI18n as ee } from "../i18n.js";
+import { emitToursApiFailed as a } from "../telemetry.js";
+import { useTourBuilder as te } from "../hooks/useTourBuilder.js";
+import { useEffect as o, useMemo as s, useRef as ne, useState as c } from "react";
+import { PermissionGate as l } from "@burdenoff/fe-libs/shared/components";
+import { ArrowLeft as re, BarChart3 as ie, Calendar as ae, Eye as oe, LayoutTemplate as se, ListOrdered as ce, Save as le, Sparkles as ue } from "lucide-react";
+import { Fragment as de, jsx as u, jsxs as d } from "react/jsx-runtime";
+import { useNavigate as fe, useParams as pe } from "react-router-dom";
+import { useGatewayClient as f } from "@burdenoff/fe-libs/shared/graphql";
+import { useEventBus as me } from "@burdenoff/fe-libs/shared/events";
+import { gql as p } from "@apollo/client/core";
 //#region src/tours/pages/TourBuilderPage.tsx
-var y = 250, b = [
+var he = 250, ge = p`
+  mutation SeedVibeControlsUserTours {
+    seedVibeControlsUserTours {
+      productId
+      workspaceId
+      createdCount
+      updatedCount
+      totalCount
+      tours {
+        tourId
+        slug
+        name
+        action
+        stepCount
+      }
+    }
+  }
+`;
+function _e(e) {
+	if (!e || typeof e != "object") return null;
+	let t = e, n = t.error;
+	if (n instanceof Error) return n.message;
+	let r = t.errors;
+	if (!Array.isArray(r) || r.length === 0) return null;
+	let i = r.map((e) => {
+		if (e instanceof Error) return e.message;
+		if (!e || typeof e != "object") return null;
+		let t = e.message;
+		return typeof t == "string" ? t : null;
+	}).filter((e) => !!e);
+	return i.length > 0 ? i.join("; ") : "Seed mutation returned errors.";
+}
+var m = [
 	{
 		productId: "vibecontrols",
 		moduleId: "dashboard",
@@ -167,40 +203,115 @@ var y = 250, b = [
 		pageLabel: "Sandbox",
 		path: "/sandbox",
 		isModuleHome: !0
+	},
+	{
+		productId: "vibecontrols",
+		moduleId: "support",
+		moduleLabel: "Support",
+		pageId: "tickets",
+		pageLabel: "Tickets",
+		path: "/support/tickets",
+		isModuleHome: !0
+	},
+	{
+		productId: "vibecontrols",
+		moduleId: "support",
+		moduleLabel: "Support",
+		pageId: "knowledge-base",
+		pageLabel: "Knowledge Base",
+		path: "/support/kb"
+	},
+	{
+		productId: "vibecontrols",
+		moduleId: "notifications",
+		moduleLabel: "Notifications",
+		pageId: "center",
+		pageLabel: "Notification Center",
+		path: "/notifications/center",
+		isModuleHome: !0
+	},
+	{
+		productId: "vibecontrols",
+		moduleId: "notifications",
+		moduleLabel: "Notifications",
+		pageId: "history",
+		pageLabel: "History",
+		path: "/notifications/history"
+	},
+	{
+		productId: "vibecontrols",
+		moduleId: "notifications",
+		moduleLabel: "Notifications",
+		pageId: "preferences",
+		pageLabel: "Preferences",
+		path: "/notifications/preferences"
+	},
+	{
+		productId: "vibecontrols",
+		moduleId: "conversations",
+		moduleLabel: "Conversations",
+		pageId: "home",
+		pageLabel: "All Conversations",
+		path: "/conversations",
+		isModuleHome: !0
+	},
+	{
+		productId: "vibecontrols",
+		moduleId: "conversations",
+		moduleLabel: "Conversations",
+		pageId: "list",
+		pageLabel: "Conversation List",
+		path: "/conversations/list"
+	},
+	{
+		productId: "vibecontrols",
+		moduleId: "conversations",
+		moduleLabel: "Conversations",
+		pageId: "new",
+		pageLabel: "New Conversation",
+		path: "/conversations/new"
+	},
+	{
+		productId: "vibecontrols",
+		moduleId: "conversations",
+		moduleLabel: "Conversations",
+		pageId: "settings",
+		pageLabel: "Settings",
+		path: "/conversations/settings"
 	}
 ];
-function x(e) {
+function h(e) {
 	return e?.trim() || void 0;
 }
-function S(e) {
-	let t = x(e);
-	return t ? b.filter((e) => e.productId === t) : [];
+function g(e) {
+	let t = h(e);
+	return t ? m.filter((e) => e.productId === t) : [];
 }
-function C(e) {
+function ve(e) {
 	let t = /* @__PURE__ */ new Map();
-	for (let n of S(e)) (!t.get(n.moduleId) || n.isModuleHome) && t.set(n.moduleId, {
+	for (let n of g(e)) (!t.get(n.moduleId) || n.isModuleHome) && t.set(n.moduleId, {
 		moduleId: n.moduleId,
 		label: n.moduleLabel,
 		path: n.path
 	});
 	return [...t.values()];
 }
-function w(e, t) {
-	let n = x(t);
-	return n ? S(e).filter((e) => e.moduleId === n).map((e) => ({
+function ye(e, t) {
+	let n = h(t);
+	return n ? g(e).filter((e) => e.moduleId === n).map((e) => ({
 		pageId: e.pageId,
 		label: e.pageLabel,
 		path: e.path
 	})) : [];
 }
-function T() {
-	let { tr: b } = a(), { tourId: x } = ie(), S = re(), { basePath: T = "/" } = e(), { hasPermission: E } = r(), D = !x || x === "new", O = E(i.TOUR_CREATE), ae = E(i.TOUR_UPDATE), oe = E(i.TOUR_TEMPLATE_CREATE), se = D ? O : ae, { tour: k, loadTour: A, createTour: ce, updateTour: j, saving: M, validationErrors: N, error: P } = o(x), { saveAsTemplate: F } = n(), { data: I, loading: L } = t({
+function _() {
+	let { tr: p } = ee(), { tourId: m } = pe(), h = fe(), g = e(), { basePath: _ = "/" } = g, v = me(), be = f("global"), { hasPermission: y } = r(), b = !m || m === "new", x = y(i.TOUR_CREATE), S = y(i.TOUR_UPDATE), xe = y(i.TOUR_TEMPLATE_CREATE), Se = b ? x : S, C = x && S, { tour: w, loadTour: T, createTour: Ce, updateTour: we, saving: E, validationErrors: D, error: O } = te(m), { saveAsTemplate: k } = n(), { data: A, loading: j } = t({
 		variables: {
-			limit: y,
+			limit: he,
 			offset: 0
 		},
 		fetchPolicy: "cache-and-network"
-	}), [R, z] = u({
+	}), [M, N] = c({
 		name: "",
 		description: "",
 		productId: "",
@@ -213,525 +324,592 @@ function T() {
 		displayOrder: 1,
 		startDate: "",
 		endDate: ""
-	}), [B, V] = u(!1), [H, U] = u(!1), [W, G] = u(!1), K = l(!1), q = c(() => [...I?.platformProducts.items ?? []].sort((e, t) => e.name.localeCompare(t.name)), [I]), J = c(() => new Set(q.map((e) => e.slug)), [q]), Y = c(() => C(R.productId), [R.productId]), X = c(() => new Set(Y.map((e) => e.moduleId)), [Y]), Z = c(() => w(R.productId, R.moduleId), [R.moduleId, R.productId]), Q = c(() => new Set(Z.map((e) => e.pageId)), [Z]);
-	s(() => {
-		x && x !== "new" && (K.current = !1, A(x));
-	}, [x, A]), s(() => {
-		k && !K.current && (z(k), K.current = !0);
-	}, [k]), s(() => {
-		if (!R.productId || L) {
-			V(!1);
+	}), [P, F] = c(!1), [I, L] = c(!1), [R, z] = c(!1), [B, V] = c(!1), [H, U] = c(null), [W, G] = c(null), K = ne(!1), q = s(() => [...A?.platformProducts.items ?? []].sort((e, t) => e.name.localeCompare(t.name)), [A]), J = s(() => new Set(q.map((e) => e.slug)), [q]), Y = s(() => ve(M.productId), [M.productId]), X = s(() => new Set(Y.map((e) => e.moduleId)), [Y]), Z = s(() => ye(M.productId, M.moduleId), [M.moduleId, M.productId]), Q = s(() => new Set(Z.map((e) => e.pageId)), [Z]);
+	o(() => {
+		m && m !== "new" && (K.current = !1, T(m));
+	}, [m, T]), o(() => {
+		w && !K.current && (N(w), K.current = !0);
+	}, [w]), o(() => {
+		if (!M.productId || j) {
+			F(!1);
 			return;
 		}
-		V(q.length > 0 && !J.has(R.productId));
+		F(q.length > 0 && !J.has(M.productId));
 	}, [
-		R.productId,
+		M.productId,
 		J,
 		q.length,
-		L
-	]), s(() => {
-		if (!R.productId || !R.moduleId) {
-			U(!1);
+		j
+	]), o(() => {
+		if (!M.productId || !M.moduleId) {
+			L(!1);
 			return;
 		}
-		U(Y.length === 0 || !X.has(R.moduleId));
+		L(Y.length === 0 || !X.has(M.moduleId));
 	}, [
-		R.moduleId,
-		R.productId,
+		M.moduleId,
+		M.productId,
 		X,
 		Y.length
-	]), s(() => {
-		if (!R.productId || !R.pageId) {
-			G(!1);
+	]), o(() => {
+		if (!M.productId || !M.pageId) {
+			z(!1);
 			return;
 		}
-		G(Z.length === 0 || !Q.has(R.pageId));
+		z(Z.length === 0 || !Q.has(M.pageId));
 	}, [
-		R.pageId,
-		R.productId,
+		M.pageId,
+		M.productId,
 		Q,
 		Z.length
 	]);
-	let le = !!(R.productId && !B && !J.has(R.productId)), ue = !!(R.moduleId && !H && !X.has(R.moduleId)), de = !!(R.pageId && !W && !Q.has(R.pageId)), fe = async (e) => {
+	let Te = !!(M.productId && !P && !J.has(M.productId)), Ee = !!(M.moduleId && !I && !X.has(M.moduleId)), De = !!(M.pageId && !R && !Q.has(M.pageId)), Oe = async (e) => {
 		e.preventDefault();
 		try {
-			x && x !== "new" ? await j(x, R) : await ce(R);
-		} catch (e) {
-			console.error("Failed to save tour:", e);
+			m && m !== "new" ? await we(m, M) : await Ce(M);
+		} catch {
+			a(v, "tour.save", g);
 		}
-	}, pe = () => {
-		S(`${T}/list`);
+	}, ke = () => {
+		h(`${_}/list`);
 	}, $ = (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);
+	}, Ae = async () => {
+		if (!m || m === "new") return;
+		let e = `${M.name || w?.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 k(m, {
+				name: t,
+				description: M.description,
+				category: n,
+				isPublic: !1
+			}), h(`${_}/templates`);
+		} catch {
+			a(v, "template.save", g);
+		}
+	}, je = async () => {
+		if (window.confirm(p("tourBuilder.seedVibeControls.confirm"))) {
+			V(!0), U(null), G(null);
+			try {
+				let e = await be.mutate({ mutation: ge }), t = _e(e);
+				if (t) throw Error(t);
+				let n = e.data?.seedVibeControlsUserTours;
+				if (!n) throw Error("Seed mutation returned no result.");
+				U(n);
+			} catch (e) {
+				let t = e instanceof Error ? e.message : p("tourBuilder.seedVibeControls.error");
+				G(t), v.emit("tours.api.failed", {
+					route: "/tours",
+					operation: "tour.seed_vibecontrols_user_tours",
+					errorMessage: t,
+					productId: g.productId,
+					workspaceId: g.workspaceId
+				}, { component: "microfe-tours" });
+			} finally {
+				V(!1);
+			}
+		}
 	};
-	return /* @__PURE__ */ v("div", {
+	return /* @__PURE__ */ d("div", {
 		className: "space-y-4 sm:space-y-6 p-3 sm:p-6 max-w-4xl mx-auto",
-		children: [/* @__PURE__ */ v("div", {
-			className: "flex items-center gap-4",
-			children: [/* @__PURE__ */ _("button", {
-				onClick: pe,
-				className: "p-2 hover:bg-accent rounded-md",
-				"aria-label": b("tourBuilder.goBack"),
-				children: /* @__PURE__ */ _(f, { size: 20 })
-			}), /* @__PURE__ */ v("div", {
-				className: "flex-1",
-				children: [/* @__PURE__ */ _("h1", {
-					className: "text-xl sm:text-2xl font-bold text-foreground",
-					children: b(x && x !== "new" ? "tourBuilder.titleEdit" : "tourBuilder.titleCreate")
-				}), /* @__PURE__ */ _("p", {
-					className: "text-sm text-muted-foreground",
-					children: b("tourBuilder.subtitle")
+		children: [
+			/* @__PURE__ */ d("div", {
+				className: "flex items-center gap-4",
+				children: [/* @__PURE__ */ u("button", {
+					onClick: ke,
+					className: "p-2 hover:bg-accent rounded-md",
+					"aria-label": p("tourBuilder.goBack"),
+					children: /* @__PURE__ */ u(re, { size: 20 })
+				}), /* @__PURE__ */ d("div", {
+					className: "flex-1",
+					children: [/* @__PURE__ */ u("h1", {
+						className: "text-xl sm:text-2xl font-bold text-foreground",
+						children: p(m && m !== "new" ? "tourBuilder.titleEdit" : "tourBuilder.titleCreate")
+					}), /* @__PURE__ */ u("p", {
+						className: "text-sm text-muted-foreground",
+						children: p("tourBuilder.subtitle")
+					})]
 				})]
-			})]
-		}), /* @__PURE__ */ v("form", {
-			onSubmit: fe,
-			className: "space-y-6",
-			children: [
-				/* @__PURE__ */ v("div", {
-					className: "border border-border rounded-md p-4 sm:p-6 bg-card",
-					children: [/* @__PURE__ */ _("h2", {
-						className: "text-lg font-semibold mb-4",
-						children: b("tourBuilder.sectionBasicInfo")
-					}), /* @__PURE__ */ v("div", {
-						className: "space-y-4",
-						children: [
-							/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
-								className: "block text-sm font-medium mb-2",
-								htmlFor: "tour-name",
-								children: b("tourBuilder.labelName")
-							}), /* @__PURE__ */ _("input", {
-								id: "tour-name",
-								type: "text",
-								value: R.name || "",
-								onChange: (e) => z({
-									...R,
-									name: e.target.value
-								}),
-								className: "w-full px-3 py-2 border border-border rounded-md bg-background text-foreground",
-								required: !0
-							})] }),
-							/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
-								className: "block text-sm font-medium mb-2",
-								htmlFor: "tour-description",
-								children: b("tourBuilder.labelDescription")
-							}), /* @__PURE__ */ _("textarea", {
-								id: "tour-description",
-								value: R.description || "",
-								onChange: (e) => z({
-									...R,
-									description: e.target.value
-								}),
-								rows: 3,
-								className: "w-full px-3 py-2 border border-border rounded-md bg-background text-foreground"
-							})] }),
-							/* @__PURE__ */ v("div", { children: [
-								/* @__PURE__ */ _("label", {
+			}),
+			b ? /* @__PURE__ */ d("div", {
+				className: "rounded-md border border-border bg-card p-4 sm:p-6",
+				children: [
+					/* @__PURE__ */ d("div", {
+						className: "flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between",
+						children: [/* @__PURE__ */ d("div", {
+							className: "space-y-1",
+							children: [/* @__PURE__ */ u("h2", {
+								className: "text-lg font-semibold text-foreground",
+								children: p("tourBuilder.seedVibeControls.title")
+							}), /* @__PURE__ */ u("p", {
+								className: "text-sm text-muted-foreground",
+								children: p("tourBuilder.seedVibeControls.description")
+							})]
+						}), /* @__PURE__ */ d("button", {
+							type: "button",
+							onClick: () => void je(),
+							disabled: B || !C,
+							className: "inline-flex min-h-11 items-center justify-center gap-2 rounded-md border border-border 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__ */ u(ue, { size: 18 }), p(B ? "tourBuilder.seedVibeControls.loading" : "tourBuilder.seedVibeControls.button")]
+						})]
+					}),
+					C ? null : /* @__PURE__ */ u("p", {
+						className: "mt-3 text-sm text-muted-foreground",
+						children: p("tourBuilder.seedVibeControls.permissionHint")
+					}),
+					W ? /* @__PURE__ */ u("p", {
+						className: "mt-3 text-sm text-destructive",
+						children: W
+					}) : null,
+					H ? /* @__PURE__ */ u("div", {
+						className: "mt-3 rounded-md border border-border bg-background p-3 text-sm text-muted-foreground",
+						children: p("tourBuilder.seedVibeControls.result", {
+							totalCount: H.totalCount,
+							productId: H.productId,
+							workspaceId: H.workspaceId,
+							createdCount: H.createdCount,
+							updatedCount: H.updatedCount
+						})
+					}) : null
+				]
+			}) : null,
+			/* @__PURE__ */ d("form", {
+				onSubmit: Oe,
+				className: "space-y-6",
+				children: [
+					/* @__PURE__ */ d("div", {
+						className: "border border-border rounded-md p-4 sm:p-6 bg-card",
+						children: [/* @__PURE__ */ u("h2", {
+							className: "text-lg font-semibold mb-4",
+							children: p("tourBuilder.sectionBasicInfo")
+						}), /* @__PURE__ */ d("div", {
+							className: "space-y-4",
+							children: [
+								/* @__PURE__ */ d("div", { children: [/* @__PURE__ */ u("label", {
 									className: "block text-sm font-medium mb-2",
-									htmlFor: "product-id",
-									children: b("tourBuilder.labelProductId")
-								}),
-								/* @__PURE__ */ v("select", {
-									id: "product-id",
-									value: B ? "__custom__" : R.productId || "",
-									onChange: (e) => {
-										if (e.target.value === "__custom__") {
-											V(!0), z({
-												...R,
-												productId: "",
-												moduleId: void 0,
-												pageId: void 0
-											});
-											return;
-										}
-										V(!1), U(!1), G(!1), z({
-											...R,
-											productId: e.target.value,
-											moduleId: void 0,
-											pageId: void 0
-										});
-									},
-									className: "w-full px-3 py-2 border border-border rounded-md bg-background text-foreground",
-									required: !0,
-									children: [
-										/* @__PURE__ */ _("option", {
-											value: "",
-											children: "Select product"
-										}),
-										L ? /* @__PURE__ */ _("option", {
-											disabled: !0,
-											children: "Loading products..."
-										}) : null,
-										q.map((e) => /* @__PURE__ */ v("option", {
-											value: e.slug,
-											children: [
-												e.name,
-												" (",
-												e.slug,
-												")"
-											]
-										}, e.id)),
-										le ? /* @__PURE__ */ v("option", {
-											value: R.productId,
-											children: ["Current: ", R.productId]
-										}) : null,
-										/* @__PURE__ */ _("option", {
-											value: "__custom__",
-											children: "Custom product slug"
-										})
-									]
-								}),
-								B ? /* @__PURE__ */ _("input", {
-									id: "product-id-custom",
+									htmlFor: "tour-name",
+									children: p("tourBuilder.labelName")
+								}), /* @__PURE__ */ u("input", {
+									id: "tour-name",
 									type: "text",
-									value: R.productId || "",
-									onChange: (e) => z({
-										...R,
-										productId: e.target.value,
-										moduleId: void 0,
-										pageId: void 0
+									value: M.name || "",
+									onChange: (e) => N({
+										...M,
+										name: e.target.value
 									}),
-									className: "mt-2 w-full px-3 py-2 border border-border rounded-md bg-background text-foreground",
-									placeholder: "vibecontrols",
+									className: "w-full px-3 py-2 border border-border rounded-md bg-background text-foreground",
 									required: !0
-								}) : null
-							] }),
-							/* @__PURE__ */ v("div", {
-								className: "grid grid-cols-1 gap-4 sm:grid-cols-2",
-								children: [/* @__PURE__ */ v("div", { children: [
-									/* @__PURE__ */ _("label", {
+								})] }),
+								/* @__PURE__ */ d("div", { children: [/* @__PURE__ */ u("label", {
+									className: "block text-sm font-medium mb-2",
+									htmlFor: "tour-description",
+									children: p("tourBuilder.labelDescription")
+								}), /* @__PURE__ */ u("textarea", {
+									id: "tour-description",
+									value: M.description || "",
+									onChange: (e) => N({
+										...M,
+										description: e.target.value
+									}),
+									rows: 3,
+									className: "w-full px-3 py-2 border border-border rounded-md bg-background text-foreground"
+								})] }),
+								/* @__PURE__ */ d("div", { children: [
+									/* @__PURE__ */ u("label", {
 										className: "block text-sm font-medium mb-2",
-										htmlFor: "module-id",
-										children: "Module ID"
+										htmlFor: "product-id",
+										children: p("tourBuilder.labelProductId")
 									}),
-									/* @__PURE__ */ v("select", {
-										id: "module-id",
-										value: H ? "__custom__" : R.moduleId || "",
+									/* @__PURE__ */ d("select", {
+										id: "product-id",
+										value: P ? "__custom__" : M.productId || "",
 										onChange: (e) => {
 											if (e.target.value === "__custom__") {
-												U(!0), z({
-													...R,
-													moduleId: "",
+												F(!0), N({
+													...M,
+													productId: "",
+													moduleId: void 0,
 													pageId: void 0
 												});
 												return;
 											}
-											U(!1), G(!1), z({
-												...R,
-												moduleId: e.target.value || void 0,
+											F(!1), L(!1), z(!1), N({
+												...M,
+												productId: e.target.value,
+												moduleId: void 0,
 												pageId: void 0
 											});
 										},
 										className: "w-full px-3 py-2 border border-border rounded-md bg-background text-foreground",
-										disabled: !R.productId,
+										required: !0,
 										children: [
-											/* @__PURE__ */ _("option", {
+											/* @__PURE__ */ u("option", {
 												value: "",
-												children: "All modules"
+												children: "Select product"
 											}),
-											Y.map((e) => /* @__PURE__ */ v("option", {
-												value: e.moduleId,
+											j ? /* @__PURE__ */ u("option", {
+												disabled: !0,
+												children: "Loading products..."
+											}) : null,
+											q.map((e) => /* @__PURE__ */ d("option", {
+												value: e.slug,
 												children: [
-													e.label,
+													e.name,
 													" (",
-													e.moduleId,
+													e.slug,
 													")"
 												]
-											}, e.moduleId)),
-											ue ? /* @__PURE__ */ v("option", {
-												value: R.moduleId,
-												children: ["Current: ", R.moduleId]
+											}, e.id)),
+											Te ? /* @__PURE__ */ d("option", {
+												value: M.productId,
+												children: ["Current: ", M.productId]
 											}) : null,
-											/* @__PURE__ */ _("option", {
+											/* @__PURE__ */ u("option", {
 												value: "__custom__",
-												children: "Custom module ID"
+												children: "Custom product slug"
 											})
 										]
 									}),
-									H ? /* @__PURE__ */ _("input", {
-										id: "module-id-custom",
+									P ? /* @__PURE__ */ u("input", {
+										id: "product-id-custom",
 										type: "text",
-										value: R.moduleId || "",
-										onChange: (e) => z({
-											...R,
-											moduleId: e.target.value || void 0,
+										value: M.productId || "",
+										onChange: (e) => N({
+											...M,
+											productId: e.target.value,
+											moduleId: void 0,
 											pageId: void 0
 										}),
 										className: "mt-2 w-full px-3 py-2 border border-border rounded-md bg-background text-foreground",
-										placeholder: "vibecontrols"
+										placeholder: "vibecontrols",
+										required: !0
 									}) : null
-								] }), /* @__PURE__ */ v("div", { children: [
-									/* @__PURE__ */ _("label", {
-										className: "block text-sm font-medium mb-2",
-										htmlFor: "page-id",
-										children: "Page ID"
-									}),
-									/* @__PURE__ */ v("select", {
-										id: "page-id",
-										value: W ? "__custom__" : R.pageId || "",
-										onChange: (e) => {
-											if (e.target.value === "__custom__") {
-												G(!0), z({
-													...R,
-													pageId: ""
+								] }),
+								/* @__PURE__ */ d("div", {
+									className: "grid grid-cols-1 gap-4 sm:grid-cols-2",
+									children: [/* @__PURE__ */ d("div", { children: [
+										/* @__PURE__ */ u("label", {
+											className: "block text-sm font-medium mb-2",
+											htmlFor: "module-id",
+											children: "Module ID"
+										}),
+										/* @__PURE__ */ d("select", {
+											id: "module-id",
+											value: I ? "__custom__" : M.moduleId || "",
+											onChange: (e) => {
+												if (e.target.value === "__custom__") {
+													L(!0), N({
+														...M,
+														moduleId: "",
+														pageId: void 0
+													});
+													return;
+												}
+												L(!1), z(!1), N({
+													...M,
+													moduleId: e.target.value || void 0,
+													pageId: void 0
 												});
-												return;
-											}
-											G(!1), z({
-												...R,
-												pageId: e.target.value || void 0
-											});
-										},
-										className: "w-full px-3 py-2 border border-border rounded-md bg-background text-foreground",
-										disabled: !R.productId,
-										children: [
-											/* @__PURE__ */ _("option", {
-												value: "",
-												children: "All pages"
+											},
+											className: "w-full px-3 py-2 border border-border rounded-md bg-background text-foreground",
+											disabled: !M.productId,
+											children: [
+												/* @__PURE__ */ u("option", {
+													value: "",
+													children: "All modules"
+												}),
+												Y.map((e) => /* @__PURE__ */ d("option", {
+													value: e.moduleId,
+													children: [
+														e.label,
+														" (",
+														e.moduleId,
+														")"
+													]
+												}, e.moduleId)),
+												Ee ? /* @__PURE__ */ d("option", {
+													value: M.moduleId,
+													children: ["Current: ", M.moduleId]
+												}) : null,
+												/* @__PURE__ */ u("option", {
+													value: "__custom__",
+													children: "Custom module ID"
+												})
+											]
+										}),
+										I ? /* @__PURE__ */ u("input", {
+											id: "module-id-custom",
+											type: "text",
+											value: M.moduleId || "",
+											onChange: (e) => N({
+												...M,
+												moduleId: e.target.value || void 0,
+												pageId: void 0
 											}),
-											Z.map((e) => /* @__PURE__ */ v("option", {
-												value: e.pageId,
-												children: [
-													e.label,
-													" (",
-													e.pageId,
-													")"
-												]
-											}, e.pageId)),
-											de ? /* @__PURE__ */ v("option", {
-												value: R.pageId,
-												children: ["Current: ", R.pageId]
-											}) : null,
-											/* @__PURE__ */ _("option", {
-												value: "__custom__",
-												children: "Custom page ID"
-											})
-										]
-									}),
-									W ? /* @__PURE__ */ _("input", {
-										id: "page-id-custom",
-										type: "text",
-										value: R.pageId || "",
-										onChange: (e) => z({
-											...R,
-											pageId: e.target.value || void 0
+											className: "mt-2 w-full px-3 py-2 border border-border rounded-md bg-background text-foreground",
+											placeholder: "vibecontrols"
+										}) : null
+									] }), /* @__PURE__ */ d("div", { children: [
+										/* @__PURE__ */ u("label", {
+											className: "block text-sm font-medium mb-2",
+											htmlFor: "page-id",
+											children: "Page ID"
 										}),
-										className: "mt-2 w-full px-3 py-2 border border-border rounded-md bg-background text-foreground",
-										placeholder: "agents"
-									}) : null
-								] })]
-							}),
-							/* @__PURE__ */ v("label", {
-								className: "flex items-center gap-3 cursor-pointer",
-								children: [/* @__PURE__ */ _("input", {
-									type: "checkbox",
-									checked: R.isActive ?? !0,
-									onChange: (e) => z({
-										...R,
-										isActive: e.target.checked
-									}),
-									className: "w-4 h-4 rounded"
-								}), /* @__PURE__ */ _("span", {
-									className: "text-sm font-medium",
-									children: "Active"
-								})]
-							})
-						]
-					})]
-				}),
-				/* @__PURE__ */ v("div", {
-					className: "border border-border rounded-md p-4 sm:p-6 bg-card",
-					children: [/* @__PURE__ */ _("h2", {
-						className: "text-lg font-semibold mb-4",
-						children: b("tourBuilder.sectionTriggerSettings")
-					}), /* @__PURE__ */ v("div", {
-						className: "space-y-4",
-						children: [
-							/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
-								className: "block text-sm font-medium mb-2",
-								htmlFor: "trigger-type",
-								children: b("tourBuilder.labelTriggerType")
-							}), /* @__PURE__ */ v("select", {
-								id: "trigger-type",
-								value: R.triggerType || "MANUAL",
-								onChange: (e) => z({
-									...R,
-									triggerType: e.target.value
+										/* @__PURE__ */ d("select", {
+											id: "page-id",
+											value: R ? "__custom__" : M.pageId || "",
+											onChange: (e) => {
+												if (e.target.value === "__custom__") {
+													z(!0), N({
+														...M,
+														pageId: ""
+													});
+													return;
+												}
+												z(!1), N({
+													...M,
+													pageId: e.target.value || void 0
+												});
+											},
+											className: "w-full px-3 py-2 border border-border rounded-md bg-background text-foreground",
+											disabled: !M.productId,
+											children: [
+												/* @__PURE__ */ u("option", {
+													value: "",
+													children: "All pages"
+												}),
+												Z.map((e) => /* @__PURE__ */ d("option", {
+													value: e.pageId,
+													children: [
+														e.label,
+														" (",
+														e.pageId,
+														")"
+													]
+												}, e.pageId)),
+												De ? /* @__PURE__ */ d("option", {
+													value: M.pageId,
+													children: ["Current: ", M.pageId]
+												}) : null,
+												/* @__PURE__ */ u("option", {
+													value: "__custom__",
+													children: "Custom page ID"
+												})
+											]
+										}),
+										R ? /* @__PURE__ */ u("input", {
+											id: "page-id-custom",
+											type: "text",
+											value: M.pageId || "",
+											onChange: (e) => N({
+												...M,
+												pageId: e.target.value || void 0
+											}),
+											className: "mt-2 w-full px-3 py-2 border border-border rounded-md bg-background text-foreground",
+											placeholder: "agents"
+										}) : null
+									] })]
 								}),
-								className: "w-full px-3 py-2 border border-border rounded-md bg-background text-foreground",
-								children: [
-									/* @__PURE__ */ _("option", {
-										value: "MANUAL",
-										children: b("tourBuilder.triggerManual")
-									}),
-									/* @__PURE__ */ _("option", {
-										value: "AUTO_FIRST_VISIT",
-										children: b("tourBuilder.triggerAutoFirstVisit")
-									}),
-									/* @__PURE__ */ _("option", {
-										value: "AUTO_ALWAYS",
-										children: b("tourBuilder.triggerAutoAlways")
-									}),
-									/* @__PURE__ */ _("option", {
-										value: "ON_EVENT",
-										children: b("tourBuilder.triggerOnEvent")
-									}),
-									/* @__PURE__ */ _("option", {
-										value: "SCHEDULED",
-										children: b("tourBuilder.triggerScheduled")
-									})
-								]
-							})] }),
-							/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
-								className: "block text-sm font-medium mb-2",
-								htmlFor: "priority",
-								children: b("tourBuilder.labelPriority")
-							}), /* @__PURE__ */ _("input", {
-								id: "priority",
-								type: "number",
-								min: "1",
-								max: "100",
-								value: R.priority || 50,
-								onChange: (e) => {
-									let t = Number.parseInt(e.target.value, 10) || 50;
-									z({
-										...R,
-										priority: t
-									});
-								},
-								className: "w-full px-3 py-2 border border-border rounded-md bg-background text-foreground"
-							})] }),
-							/* @__PURE__ */ v("div", {
-								className: "grid grid-cols-1 gap-4 sm:grid-cols-2",
-								children: [/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
+								/* @__PURE__ */ d("label", {
+									className: "flex items-center gap-3 cursor-pointer",
+									children: [/* @__PURE__ */ u("input", {
+										type: "checkbox",
+										checked: M.isActive ?? !0,
+										onChange: (e) => N({
+											...M,
+											isActive: e.target.checked
+										}),
+										className: "w-4 h-4 rounded"
+									}), /* @__PURE__ */ u("span", {
+										className: "text-sm font-medium",
+										children: "Active"
+									})]
+								})
+							]
+						})]
+					}),
+					/* @__PURE__ */ d("div", {
+						className: "border border-border rounded-md p-4 sm:p-6 bg-card",
+						children: [/* @__PURE__ */ u("h2", {
+							className: "text-lg font-semibold mb-4",
+							children: p("tourBuilder.sectionTriggerSettings")
+						}), /* @__PURE__ */ d("div", {
+							className: "space-y-4",
+							children: [
+								/* @__PURE__ */ d("div", { children: [/* @__PURE__ */ u("label", {
 									className: "block text-sm font-medium mb-2",
-									htmlFor: "tour-start-date",
-									children: "Start Date"
-								}), /* @__PURE__ */ _("input", {
-									id: "tour-start-date",
-									type: "datetime-local",
-									value: $(R.startDate),
-									onChange: (e) => z({
-										...R,
-										startDate: e.target.value ? new Date(e.target.value).toISOString() : void 0
+									htmlFor: "trigger-type",
+									children: p("tourBuilder.labelTriggerType")
+								}), /* @__PURE__ */ d("select", {
+									id: "trigger-type",
+									value: M.triggerType || "MANUAL",
+									onChange: (e) => N({
+										...M,
+										triggerType: e.target.value
 									}),
-									className: "w-full px-3 py-2 border border-border rounded-md bg-background text-foreground"
-								})] }), /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
+									className: "w-full px-3 py-2 border border-border rounded-md bg-background text-foreground",
+									children: [
+										/* @__PURE__ */ u("option", {
+											value: "MANUAL",
+											children: p("tourBuilder.triggerManual")
+										}),
+										/* @__PURE__ */ u("option", {
+											value: "AUTO_FIRST_VISIT",
+											children: p("tourBuilder.triggerAutoFirstVisit")
+										}),
+										/* @__PURE__ */ u("option", {
+											value: "AUTO_ALWAYS",
+											children: p("tourBuilder.triggerAutoAlways")
+										}),
+										/* @__PURE__ */ u("option", {
+											value: "ON_EVENT",
+											children: p("tourBuilder.triggerOnEvent")
+										}),
+										/* @__PURE__ */ u("option", {
+											value: "SCHEDULED",
+											children: p("tourBuilder.triggerScheduled")
+										})
+									]
+								})] }),
+								/* @__PURE__ */ d("div", { children: [/* @__PURE__ */ u("label", {
 									className: "block text-sm font-medium mb-2",
-									htmlFor: "tour-end-date",
-									children: "End Date"
-								}), /* @__PURE__ */ _("input", {
-									id: "tour-end-date",
-									type: "datetime-local",
-									value: $(R.endDate),
-									onChange: (e) => z({
-										...R,
-										endDate: e.target.value ? new Date(e.target.value).toISOString() : void 0
-									}),
+									htmlFor: "priority",
+									children: p("tourBuilder.labelPriority")
+								}), /* @__PURE__ */ u("input", {
+									id: "priority",
+									type: "number",
+									min: "1",
+									max: "100",
+									value: M.priority || 50,
+									onChange: (e) => {
+										let t = Number.parseInt(e.target.value, 10) || 50;
+										N({
+											...M,
+											priority: t
+										});
+									},
 									className: "w-full px-3 py-2 border border-border rounded-md bg-background text-foreground"
-								})] })]
-							})
-						]
-					})]
-				}),
-				P && /* @__PURE__ */ v("div", {
-					className: "border border-destructive rounded-md p-4 bg-destructive/10",
-					children: [/* @__PURE__ */ _("h3", {
-						className: "font-semibold text-destructive mb-2",
-						children: b("tourBuilder.errorTitle")
-					}), /* @__PURE__ */ _("p", {
-						className: "text-sm text-destructive",
-						children: P.message
-					})]
-				}),
-				N.length > 0 && /* @__PURE__ */ v("div", {
-					className: "border border-destructive rounded-md p-4 bg-destructive/10",
-					children: [/* @__PURE__ */ _("h3", {
-						className: "font-semibold text-destructive mb-2",
-						children: b("tourBuilder.validationErrorsTitle")
-					}), /* @__PURE__ */ _("ul", {
-						className: "list-disc list-inside space-y-1",
-						children: N.map((e, t) => /* @__PURE__ */ _("li", {
-							className: "text-sm text-destructive",
-							children: e.message
-						}, t))
-					})]
-				}),
-				/* @__PURE__ */ v("div", {
-					className: "flex flex-wrap gap-3",
-					children: [/* @__PURE__ */ _(d, {
-						permission: D ? i.TOUR_CREATE : i.TOUR_UPDATE,
-						children: /* @__PURE__ */ v("button", {
-							type: "submit",
-							disabled: M || !se,
-							className: "flex-1 min-w-[200px] px-4 py-2 bg-primary text-primary-foreground rounded-md hover:bg-primary/90 disabled:opacity-50 flex items-center justify-center gap-2",
-							children: [/* @__PURE__ */ _(h, { size: 20 }), b(M ? "tourBuilder.saving" : x && x !== "new" ? "tourBuilder.updateTour" : "tourBuilder.createAndAddSteps")]
-						})
-					}), x && x !== "new" && /* @__PURE__ */ v(g, { children: [
-						/* @__PURE__ */ v("button", {
-							type: "button",
-							onClick: () => S(`${T}/${x}/steps`),
-							className: "px-4 py-2 bg-secondary text-secondary-foreground rounded-md hover:bg-secondary/80 flex items-center gap-2",
-							children: [
-								/* @__PURE__ */ _(m, { size: 20 }),
-								b("tourBuilder.editSteps"),
-								k?.steps && k.steps.length > 0 && /* @__PURE__ */ _("span", {
-									className: "ml-1 px-2 py-0.5 text-xs bg-primary/20 rounded-full",
-									children: k.steps.length
+								})] }),
+								/* @__PURE__ */ d("div", {
+									className: "grid grid-cols-1 gap-4 sm:grid-cols-2",
+									children: [/* @__PURE__ */ d("div", { children: [/* @__PURE__ */ u("label", {
+										className: "block text-sm font-medium mb-2",
+										htmlFor: "tour-start-date",
+										children: "Start Date"
+									}), /* @__PURE__ */ u("input", {
+										id: "tour-start-date",
+										type: "datetime-local",
+										value: $(M.startDate),
+										onChange: (e) => N({
+											...M,
+											startDate: e.target.value ? new Date(e.target.value).toISOString() : void 0
+										}),
+										className: "w-full px-3 py-2 border border-border rounded-md bg-background text-foreground"
+									})] }), /* @__PURE__ */ d("div", { children: [/* @__PURE__ */ u("label", {
+										className: "block text-sm font-medium mb-2",
+										htmlFor: "tour-end-date",
+										children: "End Date"
+									}), /* @__PURE__ */ u("input", {
+										id: "tour-end-date",
+										type: "datetime-local",
+										value: $(M.endDate),
+										onChange: (e) => N({
+											...M,
+											endDate: e.target.value ? new Date(e.target.value).toISOString() : void 0
+										}),
+										className: "w-full px-3 py-2 border border-border rounded-md bg-background text-foreground"
+									})] })]
 								})
 							]
-						}),
-						/* @__PURE__ */ v("button", {
-							type: "button",
-							onClick: () => S(`${T}/${x}/preview`),
-							className: "px-4 py-2 border border-border rounded-md hover:bg-accent flex items-center gap-2",
-							children: [/* @__PURE__ */ _(te, { size: 20 }), b("tourBuilder.preview")]
-						}),
-						/* @__PURE__ */ v("button", {
-							type: "button",
-							onClick: () => S(`${T}/${x}/analytics`),
-							className: "px-4 py-2 border border-border rounded-md hover:bg-accent flex items-center gap-2",
-							children: [/* @__PURE__ */ _(p, { size: 20 }), b("tourBuilder.analytics")]
-						}),
-						/* @__PURE__ */ v("button", {
-							type: "button",
-							onClick: () => S(`${T}/${x}/schedule`),
-							className: "px-4 py-2 border border-border rounded-md hover:bg-accent flex items-center gap-2",
-							children: [/* @__PURE__ */ _(ee, { size: 20 }), "Schedule"]
-						}),
-						/* @__PURE__ */ _(d, {
-							permission: i.TOUR_TEMPLATE_CREATE,
-							children: /* @__PURE__ */ v("button", {
+						})]
+					}),
+					O && /* @__PURE__ */ d("div", {
+						className: "border border-destructive rounded-md p-4 bg-destructive/10",
+						children: [/* @__PURE__ */ u("h3", {
+							className: "font-semibold text-destructive mb-2",
+							children: p("tourBuilder.errorTitle")
+						}), /* @__PURE__ */ u("p", {
+							className: "text-sm text-destructive",
+							children: O.message
+						})]
+					}),
+					D.length > 0 && /* @__PURE__ */ d("div", {
+						className: "border border-destructive rounded-md p-4 bg-destructive/10",
+						children: [/* @__PURE__ */ u("h3", {
+							className: "font-semibold text-destructive mb-2",
+							children: p("tourBuilder.validationErrorsTitle")
+						}), /* @__PURE__ */ u("ul", {
+							className: "list-disc list-inside space-y-1",
+							children: D.map((e, t) => /* @__PURE__ */ u("li", {
+								className: "text-sm text-destructive",
+								children: e.message
+							}, t))
+						})]
+					}),
+					/* @__PURE__ */ d("div", {
+						className: "flex flex-wrap gap-3",
+						children: [/* @__PURE__ */ u(l, {
+							permission: b ? i.TOUR_CREATE : i.TOUR_UPDATE,
+							children: /* @__PURE__ */ d("button", {
+								type: "submit",
+								disabled: E || !Se,
+								className: "flex-1 min-w-[200px] px-4 py-2 bg-primary text-primary-foreground rounded-md hover:bg-primary/90 disabled:opacity-50 flex items-center justify-center gap-2",
+								children: [/* @__PURE__ */ u(le, { size: 20 }), p(E ? "tourBuilder.saving" : m && m !== "new" ? "tourBuilder.updateTour" : "tourBuilder.createAndAddSteps")]
+							})
+						}), m && m !== "new" && /* @__PURE__ */ d(de, { children: [
+							/* @__PURE__ */ d("button", {
+								type: "button",
+								onClick: () => h(`${_}/${m}/steps`),
+								className: "px-4 py-2 bg-secondary text-secondary-foreground rounded-md hover:bg-secondary/80 flex items-center gap-2",
+								children: [
+									/* @__PURE__ */ u(ce, { size: 20 }),
+									p("tourBuilder.editSteps"),
+									w?.steps && w.steps.length > 0 && /* @__PURE__ */ u("span", {
+										className: "ml-1 px-2 py-0.5 text-xs bg-primary/20 rounded-full",
+										children: w.steps.length
+									})
+								]
+							}),
+							/* @__PURE__ */ d("button", {
+								type: "button",
+								onClick: () => h(`${_}/${m}/preview`),
+								className: "px-4 py-2 border border-border rounded-md hover:bg-accent flex items-center gap-2",
+								children: [/* @__PURE__ */ u(oe, { size: 20 }), p("tourBuilder.preview")]
+							}),
+							/* @__PURE__ */ d("button", {
 								type: "button",
-								onClick: async () => {
-									if (!x || x === "new") return;
-									let e = `${R.name || k?.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 F(x, {
-											name: t,
-											description: R.description,
-											category: n,
-											isPublic: !1
-										}), S(`${T}/templates`);
-									} catch (e) {
-										console.error("Failed to save template:", e);
-									}
-								},
-								disabled: !oe,
-								className: "px-4 py-2 border border-border rounded-md hover:bg-accent flex items-center gap-2 disabled:opacity-50",
-								children: [/* @__PURE__ */ _(ne, { size: 20 }), "Save as Template"]
+								onClick: () => h(`${_}/${m}/analytics`),
+								className: "px-4 py-2 border border-border rounded-md hover:bg-accent flex items-center gap-2",
+								children: [/* @__PURE__ */ u(ie, { size: 20 }), p("tourBuilder.analytics")]
+							}),
+							/* @__PURE__ */ d("button", {
+								type: "button",
+								onClick: () => h(`${_}/${m}/schedule`),
+								className: "px-4 py-2 border border-border rounded-md hover:bg-accent flex items-center gap-2",
+								children: [/* @__PURE__ */ u(ae, { size: 20 }), "Schedule"]
+							}),
+							/* @__PURE__ */ u(l, {
+								permission: i.TOUR_TEMPLATE_CREATE,
+								children: /* @__PURE__ */ d("button", {
+									type: "button",
+									onClick: Ae,
+									disabled: !xe,
+									className: "px-4 py-2 border border-border rounded-md hover:bg-accent flex items-center gap-2 disabled:opacity-50",
+									children: [/* @__PURE__ */ u(se, { size: 20 }), "Save as Template"]
+								})
 							})
-						})
-					] })]
-				})
-			]
-		})]
+						] })]
+					})
+				]
+			})
+		]
 	});
 }
 //#endregion
-export { T as TourBuilderPage };
+export { _ as TourBuilderPage };
 
 //# sourceMappingURL=TourBuilderPage.js.map