@burdenoff/microfe-tours 2026.720.1 → 2026.731.1

package/dist/tours/components/MarkdownEditor.js

@@ -0,0 +1,144 @@
+import { useCallback as e, useRef as t, useState as n } from "react";
+import { Markdown as r } from "@burdenoff/fe-libs/shared/components";
+import { Bold as i, Code as a, Italic as o, Link as s, List as c } from "lucide-react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+//#region src/tours/components/MarkdownEditor.tsx
+function d({ title: e, onClick: t, children: n }) {
+	return /* @__PURE__ */ l("button", {
+		type: "button",
+		onClick: t,
+		title: e,
+		"aria-label": e,
+		className: "p-2 min-h-[36px] min-w-[36px] rounded-md border border-border-subtle hover:bg-accent text-text-secondary",
+		children: n
+	});
+}
+function f(e, t, n = t) {
+	let r = e.selectionStart, i = e.selectionEnd, a = e.value, o = a.slice(r, i), s = `${t}${o}${n}`, c = a.slice(0, r) + s + a.slice(i);
+	return requestAnimationFrame(() => {
+		e.focus();
+		let n = r + t.length + o.length;
+		e.setSelectionRange(n, n);
+	}), c;
+}
+function p(e, t) {
+	let n = e.selectionStart, r = e.value, i = r.lastIndexOf("\n", n - 1) + 1, a = r.slice(0, i), o = r.slice(i);
+	return requestAnimationFrame(() => {
+		e.focus();
+		let n = i + t.length;
+		e.setSelectionRange(n, n);
+	}), `${a}${t}${o}`;
+}
+function m({ id: m, value: h, onChange: g, label: _, placeholder: v, rows: y = 6, required: b, disabled: x, "aria-label": S }) {
+	let C = t(null), [w, T] = n("write"), E = e(() => {
+		let e = C.current;
+		e && g(f(e, "**"));
+	}, [g]), D = e(() => {
+		let e = C.current;
+		e && g(f(e, "_"));
+	}, [g]), O = e(() => {
+		let e = C.current;
+		if (!e) return;
+		let t = e.selectionStart, n = e.selectionEnd, r = h.slice(t, n) || "link text", i = `[${r}](url)`, a = h.slice(0, t) + i + h.slice(n);
+		requestAnimationFrame(() => {
+			e.focus();
+			let n = t + r.length + 3, i = n + 3;
+			e.setSelectionRange(n, i);
+		}), g(a);
+	}, [g, h]), k = e(() => {
+		let e = C.current;
+		e && g(f(e, "`"));
+	}, [g]), A = e(() => {
+		let e = C.current;
+		e && g(p(e, "- "));
+	}, [g]);
+	return /* @__PURE__ */ u("div", {
+		className: "space-y-2",
+		children: [_ && /* @__PURE__ */ u("label", {
+			htmlFor: m,
+			className: "block text-sm font-medium",
+			children: [_, b && /* @__PURE__ */ l("span", {
+				className: "text-status-error-text ml-1",
+				children: "*"
+			})]
+		}), /* @__PURE__ */ u("div", {
+			className: "border border-border-subtle rounded-md bg-bg-surface overflow-hidden",
+			children: [/* @__PURE__ */ u("div", {
+				className: "flex items-center justify-between border-b border-border-subtle px-2 py-1",
+				children: [/* @__PURE__ */ u("div", {
+					className: "flex items-center gap-1",
+					children: [
+						/* @__PURE__ */ l(d, {
+							title: "Bold",
+							onClick: E,
+							children: /* @__PURE__ */ l(i, { size: 16 })
+						}),
+						/* @__PURE__ */ l(d, {
+							title: "Italic",
+							onClick: D,
+							children: /* @__PURE__ */ l(o, { size: 16 })
+						}),
+						/* @__PURE__ */ l(d, {
+							title: "Link",
+							onClick: O,
+							children: /* @__PURE__ */ l(s, { size: 16 })
+						}),
+						/* @__PURE__ */ l(d, {
+							title: "Inline code",
+							onClick: k,
+							children: /* @__PURE__ */ l(a, { size: 16 })
+						}),
+						/* @__PURE__ */ l(d, {
+							title: "Bullet list",
+							onClick: A,
+							children: /* @__PURE__ */ l(c, { size: 16 })
+						})
+					]
+				}), /* @__PURE__ */ u("div", {
+					className: "flex items-center gap-1",
+					role: "tablist",
+					"aria-label": "Markdown editor tabs",
+					children: [/* @__PURE__ */ l("button", {
+						type: "button",
+						role: "tab",
+						"aria-selected": w === "write",
+						onClick: () => T("write"),
+						className: `px-3 py-1.5 text-sm rounded-md ${w === "write" ? "bg-action-primary-bg text-action-primary-text" : "hover:bg-accent text-text-secondary"}`,
+						children: "Write"
+					}), /* @__PURE__ */ l("button", {
+						type: "button",
+						role: "tab",
+						"aria-selected": w === "preview",
+						onClick: () => T("preview"),
+						className: `px-3 py-1.5 text-sm rounded-md ${w === "preview" ? "bg-action-primary-bg text-action-primary-text" : "hover:bg-accent text-text-secondary"}`,
+						children: "Preview"
+					})]
+				})]
+			}), /* @__PURE__ */ u("div", {
+				className: "relative",
+				children: [/* @__PURE__ */ l("textarea", {
+					ref: C,
+					id: m,
+					value: h,
+					onChange: (e) => g(e.target.value),
+					rows: y,
+					disabled: x,
+					required: b,
+					placeholder: v,
+					"aria-label": S ?? _,
+					className: `w-full px-3 py-2 bg-bg-surface text-text-primary text-sm sm:text-base resize-y min-h-[120px] focus:outline-none ${w === "write" ? "block" : "hidden"}`
+				}), w === "preview" && /* @__PURE__ */ l("div", {
+					className: "w-full px-3 py-2 min-h-[120px] max-h-[24rem] overflow-y-auto text-sm sm:text-base",
+					children: h ? /* @__PURE__ */ l(r, { children: h }) : /* @__PURE__ */ l("p", {
+						className: "text-text-secondary italic",
+						children: "Nothing to preview"
+					})
+				})]
+			})]
+		})]
+	});
+}
+//#endregion
+export { m as MarkdownEditor };
+
+//# sourceMappingURL=MarkdownEditor.js.map

package/dist/tours/components/MarkdownEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MarkdownEditor.js","names":[],"sources":["../../../src/tours/components/MarkdownEditor.tsx"],"sourcesContent":["import { useCallback, useRef, useState } from 'react';\nimport { Bold, Italic, Link, Code, List } from 'lucide-react';\nimport { Markdown } from '@burdenoff/fe-libs/shared/components';\n\nexport interface MarkdownEditorProps {\n  id?: string;\n  value: string;\n  onChange: (value: string) => void;\n  label?: string;\n  placeholder?: string;\n  rows?: number;\n  required?: boolean;\n  disabled?: boolean;\n  'aria-label'?: string;\n}\n\ninterface ToolbarButtonProps {\n  title: string;\n  onClick: () => void;\n  children: React.ReactNode;\n}\n\nfunction ToolbarButton({ title, onClick, children }: ToolbarButtonProps) {\n  return (\n    <button\n      type=\"button\"\n      onClick={onClick}\n      title={title}\n      aria-label={title}\n      className=\"p-2 min-h-[36px] min-w-[36px] rounded-md border border-border-subtle hover:bg-accent text-text-secondary\"\n    >\n      {children}\n    </button>\n  );\n}\n\nfunction wrapSelection(\n  textarea: HTMLTextAreaElement,\n  prefix: string,\n  suffix: string = prefix\n): string {\n  const start = textarea.selectionStart;\n  const end = textarea.selectionEnd;\n  const value = textarea.value;\n  const selected = value.slice(start, end);\n  const replacement = `${prefix}${selected}${suffix}`;\n  const newValue = value.slice(0, start) + replacement + value.slice(end);\n\n  // Defer cursor positioning so React state flush does not reset it.\n  requestAnimationFrame(() => {\n    textarea.focus();\n    const newCursor = start + prefix.length + selected.length;\n    textarea.setSelectionRange(newCursor, newCursor);\n  });\n\n  return newValue;\n}\n\nfunction insertAtLineStart(textarea: HTMLTextAreaElement, marker: string): string {\n  const start = textarea.selectionStart;\n  const value = textarea.value;\n  const lineStart = value.lastIndexOf('\\n', start - 1) + 1;\n  const before = value.slice(0, lineStart);\n  const after = value.slice(lineStart);\n\n  requestAnimationFrame(() => {\n    textarea.focus();\n    const newCursor = lineStart + marker.length;\n    textarea.setSelectionRange(newCursor, newCursor);\n  });\n\n  return `${before}${marker}${after}`;\n}\n\nexport function MarkdownEditor({\n  id,\n  value,\n  onChange,\n  label,\n  placeholder,\n  rows = 6,\n  required,\n  disabled,\n  'aria-label': ariaLabel,\n}: MarkdownEditorProps) {\n  const textareaRef = useRef<HTMLTextAreaElement>(null);\n  const [activeTab, setActiveTab] = useState<'write' | 'preview'>('write');\n\n  const handleBold = useCallback(() => {\n    const textarea = textareaRef.current;\n    if (!textarea) return;\n    onChange(wrapSelection(textarea, '**'));\n  }, [onChange]);\n\n  const handleItalic = useCallback(() => {\n    const textarea = textareaRef.current;\n    if (!textarea) return;\n    onChange(wrapSelection(textarea, '_'));\n  }, [onChange]);\n\n  const handleLink = useCallback(() => {\n    const textarea = textareaRef.current;\n    if (!textarea) return;\n    const start = textarea.selectionStart;\n    const end = textarea.selectionEnd;\n    const selected = value.slice(start, end) || 'link text';\n    const replacement = `[${selected}](url)`;\n    const newValue = value.slice(0, start) + replacement + value.slice(end);\n\n    requestAnimationFrame(() => {\n      textarea.focus();\n      const linkStart = start + selected.length + 3;\n      const linkEnd = linkStart + 3;\n      textarea.setSelectionRange(linkStart, linkEnd);\n    });\n\n    onChange(newValue);\n  }, [onChange, value]);\n\n  const handleCode = useCallback(() => {\n    const textarea = textareaRef.current;\n    if (!textarea) return;\n    onChange(wrapSelection(textarea, '`'));\n  }, [onChange]);\n\n  const handleList = useCallback(() => {\n    const textarea = textareaRef.current;\n    if (!textarea) return;\n    onChange(insertAtLineStart(textarea, '- '));\n  }, [onChange]);\n\n  return (\n    <div className=\"space-y-2\">\n      {label && (\n        <label htmlFor={id} className=\"block text-sm font-medium\">\n          {label}\n          {required && <span className=\"text-status-error-text ml-1\">*</span>}\n        </label>\n      )}\n\n      <div className=\"border border-border-subtle rounded-md bg-bg-surface overflow-hidden\">\n        <div className=\"flex items-center justify-between border-b border-border-subtle px-2 py-1\">\n          <div className=\"flex items-center gap-1\">\n            <ToolbarButton title=\"Bold\" onClick={handleBold}>\n              <Bold size={16} />\n            </ToolbarButton>\n            <ToolbarButton title=\"Italic\" onClick={handleItalic}>\n              <Italic size={16} />\n            </ToolbarButton>\n            <ToolbarButton title=\"Link\" onClick={handleLink}>\n              <Link size={16} />\n            </ToolbarButton>\n            <ToolbarButton title=\"Inline code\" onClick={handleCode}>\n              <Code size={16} />\n            </ToolbarButton>\n            <ToolbarButton title=\"Bullet list\" onClick={handleList}>\n              <List size={16} />\n            </ToolbarButton>\n          </div>\n\n          <div className=\"flex items-center gap-1\" role=\"tablist\" aria-label=\"Markdown editor tabs\">\n            <button\n              type=\"button\"\n              role=\"tab\"\n              aria-selected={activeTab === 'write'}\n              onClick={() => setActiveTab('write')}\n              className={`px-3 py-1.5 text-sm rounded-md ${\n                activeTab === 'write'\n                  ? 'bg-action-primary-bg text-action-primary-text'\n                  : 'hover:bg-accent text-text-secondary'\n              }`}\n            >\n              Write\n            </button>\n            <button\n              type=\"button\"\n              role=\"tab\"\n              aria-selected={activeTab === 'preview'}\n              onClick={() => setActiveTab('preview')}\n              className={`px-3 py-1.5 text-sm rounded-md ${\n                activeTab === 'preview'\n                  ? 'bg-action-primary-bg text-action-primary-text'\n                  : 'hover:bg-accent text-text-secondary'\n              }`}\n            >\n              Preview\n            </button>\n          </div>\n        </div>\n\n        <div className=\"relative\">\n          <textarea\n            ref={textareaRef}\n            id={id}\n            value={value}\n            onChange={(e) => onChange(e.target.value)}\n            rows={rows}\n            disabled={disabled}\n            required={required}\n            placeholder={placeholder}\n            aria-label={ariaLabel ?? label}\n            className={`w-full px-3 py-2 bg-bg-surface text-text-primary text-sm sm:text-base resize-y min-h-[120px] focus:outline-none ${\n              activeTab === 'write' ? 'block' : 'hidden'\n            }`}\n          />\n          {activeTab === 'preview' && (\n            <div className=\"w-full px-3 py-2 min-h-[120px] max-h-[24rem] overflow-y-auto text-sm sm:text-base\">\n              {value ? (\n                <Markdown>{value}</Markdown>\n              ) : (\n                <p className=\"text-text-secondary italic\">Nothing to preview</p>\n              )}\n            </div>\n          )}\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;AAsBA,SAAS,EAAc,EAAE,UAAO,YAAS,eAAgC;AACvE,QACE,kBAAC,UAAD;EACE,MAAK;EACI;EACF;EACP,cAAY;EACZ,WAAU;EAET;EACM,CAAA;;AAIb,SAAS,EACP,GACA,GACA,IAAiB,GACT;CACR,IAAM,IAAQ,EAAS,gBACjB,IAAM,EAAS,cACf,IAAQ,EAAS,OACjB,IAAW,EAAM,MAAM,GAAO,EAAI,EAClC,IAAc,GAAG,IAAS,IAAW,KACrC,IAAW,EAAM,MAAM,GAAG,EAAM,GAAG,IAAc,EAAM,MAAM,EAAI;AASvE,QANA,4BAA4B;AAC1B,IAAS,OAAO;EAChB,IAAM,IAAY,IAAQ,EAAO,SAAS,EAAS;AACnD,IAAS,kBAAkB,GAAW,EAAU;GAChD,EAEK;;AAGT,SAAS,EAAkB,GAA+B,GAAwB;CAChF,IAAM,IAAQ,EAAS,gBACjB,IAAQ,EAAS,OACjB,IAAY,EAAM,YAAY,MAAM,IAAQ,EAAE,GAAG,GACjD,IAAS,EAAM,MAAM,GAAG,EAAU,EAClC,IAAQ,EAAM,MAAM,EAAU;AAQpC,QANA,4BAA4B;AAC1B,IAAS,OAAO;EAChB,IAAM,IAAY,IAAY,EAAO;AACrC,IAAS,kBAAkB,GAAW,EAAU;GAChD,EAEK,GAAG,IAAS,IAAS;;AAG9B,SAAgB,EAAe,EAC7B,OACA,UACA,aACA,UACA,gBACA,UAAO,GACP,aACA,aACA,cAAc,KACQ;CACtB,IAAM,IAAc,EAA4B,KAAK,EAC/C,CAAC,GAAW,KAAgB,EAA8B,QAAQ,EAElE,IAAa,QAAkB;EACnC,IAAM,IAAW,EAAY;AACxB,OACL,EAAS,EAAc,GAAU,KAAK,CAAC;IACtC,CAAC,EAAS,CAAC,EAER,IAAe,QAAkB;EACrC,IAAM,IAAW,EAAY;AACxB,OACL,EAAS,EAAc,GAAU,IAAI,CAAC;IACrC,CAAC,EAAS,CAAC,EAER,IAAa,QAAkB;EACnC,IAAM,IAAW,EAAY;AAC7B,MAAI,CAAC,EAAU;EACf,IAAM,IAAQ,EAAS,gBACjB,IAAM,EAAS,cACf,IAAW,EAAM,MAAM,GAAO,EAAI,IAAI,aACtC,IAAc,IAAI,EAAS,SAC3B,IAAW,EAAM,MAAM,GAAG,EAAM,GAAG,IAAc,EAAM,MAAM,EAAI;AASvE,EAPA,4BAA4B;AAC1B,KAAS,OAAO;GAChB,IAAM,IAAY,IAAQ,EAAS,SAAS,GACtC,IAAU,IAAY;AAC5B,KAAS,kBAAkB,GAAW,EAAQ;IAC9C,EAEF,EAAS,EAAS;IACjB,CAAC,GAAU,EAAM,CAAC,EAEf,IAAa,QAAkB;EACnC,IAAM,IAAW,EAAY;AACxB,OACL,EAAS,EAAc,GAAU,IAAI,CAAC;IACrC,CAAC,EAAS,CAAC,EAER,IAAa,QAAkB;EACnC,IAAM,IAAW,EAAY;AACxB,OACL,EAAS,EAAkB,GAAU,KAAK,CAAC;IAC1C,CAAC,EAAS,CAAC;AAEd,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CACG,KACC,kBAAC,SAAD;GAAO,SAAS;GAAI,WAAU;aAA9B,CACG,GACA,KAAY,kBAAC,QAAD;IAAM,WAAU;cAA8B;IAAQ,CAAA,CAC7D;MAGV,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,OAAD;KAAK,WAAU;eAAf;MACE,kBAAC,GAAD;OAAe,OAAM;OAAO,SAAS;iBACnC,kBAAC,GAAD,EAAM,MAAM,IAAM,CAAA;OACJ,CAAA;MAChB,kBAAC,GAAD;OAAe,OAAM;OAAS,SAAS;iBACrC,kBAAC,GAAD,EAAQ,MAAM,IAAM,CAAA;OACN,CAAA;MAChB,kBAAC,GAAD;OAAe,OAAM;OAAO,SAAS;iBACnC,kBAAC,GAAD,EAAM,MAAM,IAAM,CAAA;OACJ,CAAA;MAChB,kBAAC,GAAD;OAAe,OAAM;OAAc,SAAS;iBAC1C,kBAAC,GAAD,EAAM,MAAM,IAAM,CAAA;OACJ,CAAA;MAChB,kBAAC,GAAD;OAAe,OAAM;OAAc,SAAS;iBAC1C,kBAAC,GAAD,EAAM,MAAM,IAAM,CAAA;OACJ,CAAA;MACZ;QAEN,kBAAC,OAAD;KAAK,WAAU;KAA0B,MAAK;KAAU,cAAW;eAAnE,CACE,kBAAC,UAAD;MACE,MAAK;MACL,MAAK;MACL,iBAAe,MAAc;MAC7B,eAAe,EAAa,QAAQ;MACpC,WAAW,kCACT,MAAc,UACV,kDACA;gBAEP;MAEQ,CAAA,EACT,kBAAC,UAAD;MACE,MAAK;MACL,MAAK;MACL,iBAAe,MAAc;MAC7B,eAAe,EAAa,UAAU;MACtC,WAAW,kCACT,MAAc,YACV,kDACA;gBAEP;MAEQ,CAAA,CACL;OACF;OAEN,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,YAAD;KACE,KAAK;KACD;KACG;KACP,WAAW,MAAM,EAAS,EAAE,OAAO,MAAM;KACnC;KACI;KACA;KACG;KACb,cAAY,KAAa;KACzB,WAAW,mHACT,MAAc,UAAU,UAAU;KAEpC,CAAA,EACD,MAAc,aACb,kBAAC,OAAD;KAAK,WAAU;eACZ,IACC,kBAAC,GAAD,EAAA,UAAW,GAAiB,CAAA,GAE5B,kBAAC,KAAD;MAAG,WAAU;gBAA6B;MAAsB,CAAA;KAE9D,CAAA,CAEJ;MACF;KACF"}

package/dist/tours/pages/MyToursPage.js

@@ -2,94 +2,97 @@ import { useToursContext as e } from "../providers/ToursProvider.js";
 import { useGetToursForContextQuery as t } from "../../generated/global-operations.js";
 import { useToursI18n as n } from "../i18n.js";
 import { useEffect as r, useRef as i } from "react";
-import { CheckCircle2 as a, Circle as o, MinusCircle as s, Play as c } from "lucide-react";
-import { jsx as l, jsxs as u } from "react/jsx-runtime";
-import { useSearchParams as d } from "react-router-dom";
-import { EmphasisPanel as f, GlassCard as p, GradientText as m, IllustratedEmptyState as h, PagePurpose as g } from "@burdenoff/fe-libs/ui";
-import { useEventBus as _ } from "@burdenoff/fe-libs/shared/events";
+import { Markdown as a } from "@burdenoff/fe-libs/shared/components";
+import { CheckCircle2 as o, Circle as s, MinusCircle as c, Play as l } from "lucide-react";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+import { useSearchParams as f } from "react-router-dom";
+import { EmphasisPanel as p, GlassCard as m, GradientText as h, IllustratedEmptyState as g, PagePurpose as _ } from "@burdenoff/fe-libs/ui";
+import { useEventBus as v } from "@burdenoff/fe-libs/shared/events";
 //#region src/tours/pages/MyToursPage.tsx
-var v = /^[a-zA-Z0-9_-]+$/, y = /^[a-zA-Z0-9_\-/]+$/;
-function b(e, t) {
-	return e && v.test(e) ? e : t;
-}
+var y = /^[a-zA-Z0-9_-]+$/, b = /^[a-zA-Z0-9_\-/]+$/;
 function x(e, t) {
 	return e && y.test(e) ? e : t;
 }
-function S() {
-	let { tr: a } = n(), { productId: o, moduleId: s, pageId: c, workspaceId: v } = e(), [y] = d(), S = _(), w = i(!1);
+function S(e, t) {
+	return e && b.test(e) ? e : t;
+}
+function C() {
+	let { tr: o } = n(), { productId: s, moduleId: c, pageId: l, workspaceId: y } = e(), [b] = f(), C = v(), T = i(!1);
 	r(() => {
-		w.current || (w.current = !0, S.emit("tours.page.viewed", {
+		T.current || (T.current = !0, C.emit("tours.page.viewed", {
 			page: "/tours",
-			productId: o,
-			moduleId: s,
-			pageId: c,
-			workspaceId: v
+			productId: s,
+			moduleId: c,
+			pageId: l,
+			workspaceId: y
 		}));
 	}, [
-		S,
-		o,
+		C,
 		s,
 		c,
-		v
+		l,
+		y
 	]);
-	let T = b(o, void 0) ?? b(y.get("productId"), void 0), E = b(s, void 0) ?? b(y.get("moduleId"), void 0), D = x(c, void 0) ?? x(y.get("pageId"), void 0), { data: O, loading: k } = t({
-		variables: T ? { context: {
-			productId: T,
-			moduleId: E,
-			pageId: D
+	let E = x(s, void 0) ?? x(b.get("productId"), void 0), D = x(c, void 0) ?? x(b.get("moduleId"), void 0), O = S(l, void 0) ?? S(b.get("pageId"), void 0), { data: k, loading: A } = t({
+		variables: E ? { context: {
+			productId: E,
+			moduleId: D,
+			pageId: O
 		} } : void 0,
-		skip: !T,
+		skip: !E,
 		fetchPolicy: "cache-and-network"
-	}), A = O?.toursForContext ?? [], j = k, M = A.find((e) => e.myProgress?.status === "IN_PROGRESS") ?? A.find((e) => !e.myProgress?.status || e.myProgress.status !== "COMPLETED" && e.myProgress.status !== "SKIPPED" && e.myProgress.status !== "DISMISSED"), N = A.filter((e) => e.id !== M?.id);
-	return /* @__PURE__ */ u("div", {
+	}), j = k?.toursForContext ?? [], M = A, N = j.find((e) => e.myProgress?.status === "IN_PROGRESS") ?? j.find((e) => !e.myProgress?.status || e.myProgress.status !== "COMPLETED" && e.myProgress.status !== "SKIPPED" && e.myProgress.status !== "DISMISSED"), P = j.filter((e) => e.id !== N?.id);
+	return /* @__PURE__ */ d("div", {
 		className: "space-y-4 sm:space-y-6 p-3 sm:p-6",
 		children: [
-			/* @__PURE__ */ u("div", { children: [/* @__PURE__ */ l("h1", {
+			/* @__PURE__ */ d("div", { children: [/* @__PURE__ */ u("h1", {
 				className: "text-xl sm:text-2xl font-bold text-text-primary",
-				children: /* @__PURE__ */ l(m, { children: a("myTours.title") })
-			}), /* @__PURE__ */ l("p", {
+				children: /* @__PURE__ */ u(h, { children: o("myTours.title") })
+			}), /* @__PURE__ */ u("p", {
 				className: "text-sm sm:text-base text-text-secondary",
-				children: a("myTours.subtitle")
+				children: o("myTours.subtitle")
 			})] }),
-			/* @__PURE__ */ l(g, { children: a("myTours.purpose") }),
-			j && A.length === 0 ? /* @__PURE__ */ l("output", {
+			/* @__PURE__ */ u(_, { children: o("myTours.purpose") }),
+			M && j.length === 0 ? /* @__PURE__ */ u("output", {
 				className: "text-sm text-text-secondary",
-				children: a("myTours.loading")
-			}) : A.length === 0 ? /* @__PURE__ */ l(h, {
+				children: o("myTours.loading")
+			}) : j.length === 0 ? /* @__PURE__ */ u(g, {
 				illustration: "empty-generic",
-				title: a("myTours.empty")
-			}) : /* @__PURE__ */ u("div", {
+				title: o("myTours.empty")
+			}) : /* @__PURE__ */ d("div", {
 				className: "space-y-4 sm:space-y-6",
-				children: [M ? /* @__PURE__ */ u(f, {
+				children: [N ? /* @__PURE__ */ d(p, {
 					className: "p-4 sm:p-5",
-					children: [/* @__PURE__ */ u("div", {
+					children: [/* @__PURE__ */ d("div", {
 						className: "flex items-start justify-between gap-3",
-						children: [/* @__PURE__ */ l("h2", {
+						children: [/* @__PURE__ */ u("h2", {
 							className: "text-lg font-semibold text-text-primary line-clamp-2",
-							children: M.name
-						}), /* @__PURE__ */ l(C, {
-							status: M.myProgress?.status,
-							tr: a
+							children: N.name
+						}), /* @__PURE__ */ u(w, {
+							status: N.myProgress?.status,
+							tr: o
 						})]
-					}), M.description ? /* @__PURE__ */ l("p", {
+					}), N.description ? /* @__PURE__ */ u(a, {
+						inline: !0,
 						className: "mt-2 text-sm text-text-secondary line-clamp-3",
-						children: M.description
+						children: N.description
 					}) : null]
-				}) : null, N.length > 0 ? /* @__PURE__ */ l("ul", {
+				}) : null, P.length > 0 ? /* @__PURE__ */ u("ul", {
 					className: "grid gap-3 grid-cols-1 sm:grid-cols-2 lg:grid-cols-3",
-					children: N.map((e) => /* @__PURE__ */ l("li", { children: /* @__PURE__ */ u(p, {
+					children: P.map((e) => /* @__PURE__ */ u("li", { children: /* @__PURE__ */ d(m, {
 						treatment: "plain",
 						className: "h-full p-4 flex flex-col gap-2 border-border-seam shadow-[var(--shadow-pop)]",
-						children: [/* @__PURE__ */ u("div", {
+						children: [/* @__PURE__ */ d("div", {
 							className: "flex items-start justify-between gap-2",
-							children: [/* @__PURE__ */ l("h2", {
+							children: [/* @__PURE__ */ u("h2", {
 								className: "font-semibold text-text-primary line-clamp-2",
 								children: e.name
-							}), /* @__PURE__ */ l(C, {
+							}), /* @__PURE__ */ u(w, {
 								status: e.myProgress?.status,
-								tr: a
+								tr: o
 							})]
-						}), e.description ? /* @__PURE__ */ l("p", {
+						}), e.description ? /* @__PURE__ */ u(a, {
+							inline: !0,
 							className: "text-sm text-text-secondary line-clamp-3",
 							children: e.description
 						}) : null]
@@ -99,28 +102,28 @@ function S() {
 		]
 	});
 }
-function C({ status: e, tr: t }) {
+function w({ status: e, tr: t }) {
 	switch (e) {
-		case "COMPLETED": return /* @__PURE__ */ u("span", {
+		case "COMPLETED": return /* @__PURE__ */ d("span", {
 			className: "inline-flex items-center gap-1 text-xs text-success",
-			children: [/* @__PURE__ */ l(a, { size: 14 }), t("myTours.status.completed")]
+			children: [/* @__PURE__ */ u(o, { size: 14 }), t("myTours.status.completed")]
 		});
-		case "IN_PROGRESS": return /* @__PURE__ */ u("span", {
+		case "IN_PROGRESS": return /* @__PURE__ */ d("span", {
 			className: "inline-flex items-center gap-1 text-xs text-warning motion-safe:animate-vc-glow-pulse",
-			children: [/* @__PURE__ */ l(c, { size: 14 }), t("myTours.status.inProgress")]
+			children: [/* @__PURE__ */ u(l, { size: 14 }), t("myTours.status.inProgress")]
 		});
 		case "SKIPPED":
-		case "DISMISSED": return /* @__PURE__ */ u("span", {
+		case "DISMISSED": return /* @__PURE__ */ d("span", {
 			className: "inline-flex items-center gap-1 text-xs text-text-secondary",
-			children: [/* @__PURE__ */ l(s, { size: 14 }), t("myTours.status.skipped")]
+			children: [/* @__PURE__ */ u(c, { size: 14 }), t("myTours.status.skipped")]
 		});
-		default: return /* @__PURE__ */ u("span", {
+		default: return /* @__PURE__ */ d("span", {
 			className: "inline-flex items-center gap-1 text-xs text-text-secondary",
-			children: [/* @__PURE__ */ l(o, { size: 14 }), t("myTours.status.notStarted")]
+			children: [/* @__PURE__ */ u(s, { size: 14 }), t("myTours.status.notStarted")]
 		});
 	}
 }
 //#endregion
-export { S as MyToursPage };
+export { C as MyToursPage };
 
 //# sourceMappingURL=MyToursPage.js.map

package/dist/tours/pages/MyToursPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"MyToursPage.js","names":[],"sources":["../../../src/tours/pages/MyToursPage.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport { useSearchParams } from 'react-router-dom';\nimport { CheckCircle2, Circle, MinusCircle, Play } from 'lucide-react';\nimport {\n  useGetToursForContextQuery,\n  type GetToursForContextQuery,\n} from '../../generated/global-operations';\nimport { useToursContext } from '../providers/ToursProvider';\nimport { useToursI18n, type ToursTranslationKey } from '../i18n';\nimport { useEventBus } from '@burdenoff/fe-libs/shared/events';\nimport {\n  EmphasisPanel,\n  GlassCard,\n  GradientText,\n  IllustratedEmptyState,\n  PagePurpose,\n} from '@burdenoff/fe-libs/ui';\n\ntype TourSummary = GetToursForContextQuery['toursForContext'][number];\n\n// Plain slug validator for productId and moduleId.\nconst SLUG_PATTERN = /^[a-zA-Z0-9_-]+$/;\n\n// pageId is documented with path-style values like \"settings/team\" per\n// ToursRootProps — tighten to URL-safe characters only, but permit `/`.\nconst PAGE_PATH_PATTERN = /^[a-zA-Z0-9_\\-/]+$/;\n\nfunction safeSlug<T extends string | undefined>(\n  raw: string | null | undefined,\n  fallback: T\n): string | T {\n  if (raw && SLUG_PATTERN.test(raw)) return raw;\n  return fallback;\n}\n\nfunction safePageId<T extends string | undefined>(\n  raw: string | null | undefined,\n  fallback: T\n): string | T {\n  if (raw && PAGE_PATH_PATTERN.test(raw)) return raw;\n  return fallback;\n}\n\n/**\n * MyToursPage — user-facing browse for available tours.\n *\n * Lists tours returned by `toursForContext` (filtered to the current\n * product/module/page surface) and decorates each with the requesting\n * user's `TourUserProgress` status (Completed / In progress / Skipped /\n * Not started). Read-only — tours are actually played via the SDK overlay,\n * not via mutations on this page.\n */\nexport function MyToursPage() {\n  const { tr } = useToursI18n();\n  const {\n    productId: shellProductId,\n    moduleId: shellModuleId,\n    pageId: shellPageId,\n    workspaceId,\n  } = useToursContext();\n  const [searchParams] = useSearchParams();\n  const eventBus = useEventBus();\n\n  // Emit page view event exactly once per mount. A ref guard keeps the effect\n  // semantically mount-only while satisfying exhaustive-deps with the real\n  // dependency list, so we don't have to disable the lint rule.\n  const pageViewedRef = useRef(false);\n  useEffect(() => {\n    if (pageViewedRef.current) return;\n    pageViewedRef.current = true;\n    eventBus.emit('tours.page.viewed', {\n      page: '/tours',\n      productId: shellProductId,\n      moduleId: shellModuleId,\n      pageId: shellPageId,\n      workspaceId,\n    });\n  }, [eventBus, shellProductId, shellModuleId, shellPageId, workspaceId]);\n\n  // Preferred source is the shell's productId prop (the host app knows\n  // which product it is — \"workspaces\", \"vibecontrols\", \"bigconsole\", etc.).\n  // Fall back to a query-param override for deep-link scenarios, but only\n  // after passing a plain-slug validator so we never forward arbitrary\n  // strings into the GraphQL variables. No hardcoded product default —\n  // if neither source provides one, skip the query entirely so non-\n  // workspaces integrations don't get workspaces tours.\n  const productId =\n    safeSlug(shellProductId, undefined) ?? safeSlug(searchParams.get('productId'), undefined);\n  const moduleId =\n    safeSlug(shellModuleId, undefined) ?? safeSlug(searchParams.get('moduleId'), undefined);\n  const pageId =\n    safePageId(shellPageId, undefined) ?? safePageId(searchParams.get('pageId'), undefined);\n\n  const { data: toursData, loading: toursLoading } = useGetToursForContextQuery({\n    variables: productId ? { context: { productId, moduleId, pageId } } : undefined,\n    skip: !productId,\n    fetchPolicy: 'cache-and-network',\n  });\n\n  const tours = toursData?.toursForContext ?? [];\n  const isLoading = toursLoading;\n\n  // Surface a single, clearly-emphasised \"pick up where you left off / start\n  // here\" tour: prefer one already in progress, then the first not-yet-started\n  // tour, so a new user always has one obvious next walkthrough to take.\n  const featuredTour =\n    tours.find((tour: TourSummary) => tour.myProgress?.status === 'IN_PROGRESS') ??\n    tours.find(\n      (tour: TourSummary) =>\n        !tour.myProgress?.status ||\n        (tour.myProgress.status !== 'COMPLETED' &&\n          tour.myProgress.status !== 'SKIPPED' &&\n          tour.myProgress.status !== 'DISMISSED')\n    );\n  const restTours = tours.filter((tour: TourSummary) => tour.id !== featuredTour?.id);\n\n  return (\n    <div className=\"space-y-4 sm:space-y-6 p-3 sm:p-6\">\n      <div>\n        <h1 className=\"text-xl sm:text-2xl font-bold text-text-primary\">\n          <GradientText>{tr('myTours.title')}</GradientText>\n        </h1>\n        <p className=\"text-sm sm:text-base text-text-secondary\">{tr('myTours.subtitle')}</p>\n      </div>\n\n      <PagePurpose>{tr('myTours.purpose')}</PagePurpose>\n\n      {isLoading && tours.length === 0 ? (\n        <output className=\"text-sm text-text-secondary\">{tr('myTours.loading')}</output>\n      ) : tours.length === 0 ? (\n        <IllustratedEmptyState illustration=\"empty-generic\" title={tr('myTours.empty')} />\n      ) : (\n        <div className=\"space-y-4 sm:space-y-6\">\n          {/* Featured \"start here\" tour — the single emphasis zone on this page. */}\n          {featuredTour ? (\n            <EmphasisPanel className=\"p-4 sm:p-5\">\n              <div className=\"flex items-start justify-between gap-3\">\n                <h2 className=\"text-lg font-semibold text-text-primary line-clamp-2\">\n                  {featuredTour.name}\n                </h2>\n                <ProgressBadge status={featuredTour.myProgress?.status} tr={tr} />\n              </div>\n              {featuredTour.description ? (\n                <p className=\"mt-2 text-sm text-text-secondary line-clamp-3\">\n                  {featuredTour.description}\n                </p>\n              ) : null}\n            </EmphasisPanel>\n          ) : null}\n\n          {restTours.length > 0 ? (\n            <ul className=\"grid gap-3 grid-cols-1 sm:grid-cols-2 lg:grid-cols-3\">\n              {restTours.map((tour: TourSummary) => (\n                <li key={tour.id}>\n                  <GlassCard\n                    treatment=\"plain\"\n                    className=\"h-full p-4 flex flex-col gap-2 border-border-seam shadow-[var(--shadow-pop)]\"\n                  >\n                    <div className=\"flex items-start justify-between gap-2\">\n                      <h2 className=\"font-semibold text-text-primary line-clamp-2\">{tour.name}</h2>\n                      <ProgressBadge status={tour.myProgress?.status} tr={tr} />\n                    </div>\n                    {tour.description ? (\n                      <p className=\"text-sm text-text-secondary line-clamp-3\">{tour.description}</p>\n                    ) : null}\n                  </GlassCard>\n                </li>\n              ))}\n            </ul>\n          ) : null}\n        </div>\n      )}\n    </div>\n  );\n}\n\nfunction ProgressBadge({\n  status,\n  tr,\n}: {\n  status: string | undefined;\n  tr: (key: ToursTranslationKey) => string;\n}) {\n  switch (status) {\n    case 'COMPLETED':\n      return (\n        <span className=\"inline-flex items-center gap-1 text-xs text-success\">\n          <CheckCircle2 size={14} />\n          {tr('myTours.status.completed')}\n        </span>\n      );\n    case 'IN_PROGRESS':\n      return (\n        <span className=\"inline-flex items-center gap-1 text-xs text-warning motion-safe:animate-vc-glow-pulse\">\n          <Play size={14} />\n          {tr('myTours.status.inProgress')}\n        </span>\n      );\n    case 'SKIPPED':\n    case 'DISMISSED':\n      return (\n        <span className=\"inline-flex items-center gap-1 text-xs text-text-secondary\">\n          <MinusCircle size={14} />\n          {tr('myTours.status.skipped')}\n        </span>\n      );\n    default:\n      return (\n        <span className=\"inline-flex items-center gap-1 text-xs text-text-secondary\">\n          <Circle size={14} />\n          {tr('myTours.status.notStarted')}\n        </span>\n      );\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"MyToursPage.js","names":[],"sources":["../../../src/tours/pages/MyToursPage.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport { useSearchParams } from 'react-router-dom';\nimport { CheckCircle2, Circle, MinusCircle, Play } from 'lucide-react';\nimport {\n  useGetToursForContextQuery,\n  type GetToursForContextQuery,\n} from '../../generated/global-operations';\nimport { useToursContext } from '../providers/ToursProvider';\nimport { useToursI18n, type ToursTranslationKey } from '../i18n';\nimport { Markdown } from '@burdenoff/fe-libs/shared/components';\nimport { useEventBus } from '@burdenoff/fe-libs/shared/events';\nimport {\n  EmphasisPanel,\n  GlassCard,\n  GradientText,\n  IllustratedEmptyState,\n  PagePurpose,\n} from '@burdenoff/fe-libs/ui';\n\ntype TourSummary = GetToursForContextQuery['toursForContext'][number];\n\n// Plain slug validator for productId and moduleId.\nconst SLUG_PATTERN = /^[a-zA-Z0-9_-]+$/;\n\n// pageId is documented with path-style values like \"settings/team\" per\n// ToursRootProps — tighten to URL-safe characters only, but permit `/`.\nconst PAGE_PATH_PATTERN = /^[a-zA-Z0-9_\\-/]+$/;\n\nfunction safeSlug<T extends string | undefined>(\n  raw: string | null | undefined,\n  fallback: T\n): string | T {\n  if (raw && SLUG_PATTERN.test(raw)) return raw;\n  return fallback;\n}\n\nfunction safePageId<T extends string | undefined>(\n  raw: string | null | undefined,\n  fallback: T\n): string | T {\n  if (raw && PAGE_PATH_PATTERN.test(raw)) return raw;\n  return fallback;\n}\n\n/**\n * MyToursPage — user-facing browse for available tours.\n *\n * Lists tours returned by `toursForContext` (filtered to the current\n * product/module/page surface) and decorates each with the requesting\n * user's `TourUserProgress` status (Completed / In progress / Skipped /\n * Not started). Read-only — tours are actually played via the SDK overlay,\n * not via mutations on this page.\n */\nexport function MyToursPage() {\n  const { tr } = useToursI18n();\n  const {\n    productId: shellProductId,\n    moduleId: shellModuleId,\n    pageId: shellPageId,\n    workspaceId,\n  } = useToursContext();\n  const [searchParams] = useSearchParams();\n  const eventBus = useEventBus();\n\n  // Emit page view event exactly once per mount. A ref guard keeps the effect\n  // semantically mount-only while satisfying exhaustive-deps with the real\n  // dependency list, so we don't have to disable the lint rule.\n  const pageViewedRef = useRef(false);\n  useEffect(() => {\n    if (pageViewedRef.current) return;\n    pageViewedRef.current = true;\n    eventBus.emit('tours.page.viewed', {\n      page: '/tours',\n      productId: shellProductId,\n      moduleId: shellModuleId,\n      pageId: shellPageId,\n      workspaceId,\n    });\n  }, [eventBus, shellProductId, shellModuleId, shellPageId, workspaceId]);\n\n  // Preferred source is the shell's productId prop (the host app knows\n  // which product it is — \"workspaces\", \"vibecontrols\", \"bigconsole\", etc.).\n  // Fall back to a query-param override for deep-link scenarios, but only\n  // after passing a plain-slug validator so we never forward arbitrary\n  // strings into the GraphQL variables. No hardcoded product default —\n  // if neither source provides one, skip the query entirely so non-\n  // workspaces integrations don't get workspaces tours.\n  const productId =\n    safeSlug(shellProductId, undefined) ?? safeSlug(searchParams.get('productId'), undefined);\n  const moduleId =\n    safeSlug(shellModuleId, undefined) ?? safeSlug(searchParams.get('moduleId'), undefined);\n  const pageId =\n    safePageId(shellPageId, undefined) ?? safePageId(searchParams.get('pageId'), undefined);\n\n  const { data: toursData, loading: toursLoading } = useGetToursForContextQuery({\n    variables: productId ? { context: { productId, moduleId, pageId } } : undefined,\n    skip: !productId,\n    fetchPolicy: 'cache-and-network',\n  });\n\n  const tours = toursData?.toursForContext ?? [];\n  const isLoading = toursLoading;\n\n  // Surface a single, clearly-emphasised \"pick up where you left off / start\n  // here\" tour: prefer one already in progress, then the first not-yet-started\n  // tour, so a new user always has one obvious next walkthrough to take.\n  const featuredTour =\n    tours.find((tour: TourSummary) => tour.myProgress?.status === 'IN_PROGRESS') ??\n    tours.find(\n      (tour: TourSummary) =>\n        !tour.myProgress?.status ||\n        (tour.myProgress.status !== 'COMPLETED' &&\n          tour.myProgress.status !== 'SKIPPED' &&\n          tour.myProgress.status !== 'DISMISSED')\n    );\n  const restTours = tours.filter((tour: TourSummary) => tour.id !== featuredTour?.id);\n\n  return (\n    <div className=\"space-y-4 sm:space-y-6 p-3 sm:p-6\">\n      <div>\n        <h1 className=\"text-xl sm:text-2xl font-bold text-text-primary\">\n          <GradientText>{tr('myTours.title')}</GradientText>\n        </h1>\n        <p className=\"text-sm sm:text-base text-text-secondary\">{tr('myTours.subtitle')}</p>\n      </div>\n\n      <PagePurpose>{tr('myTours.purpose')}</PagePurpose>\n\n      {isLoading && tours.length === 0 ? (\n        <output className=\"text-sm text-text-secondary\">{tr('myTours.loading')}</output>\n      ) : tours.length === 0 ? (\n        <IllustratedEmptyState illustration=\"empty-generic\" title={tr('myTours.empty')} />\n      ) : (\n        <div className=\"space-y-4 sm:space-y-6\">\n          {/* Featured \"start here\" tour — the single emphasis zone on this page. */}\n          {featuredTour ? (\n            <EmphasisPanel className=\"p-4 sm:p-5\">\n              <div className=\"flex items-start justify-between gap-3\">\n                <h2 className=\"text-lg font-semibold text-text-primary line-clamp-2\">\n                  {featuredTour.name}\n                </h2>\n                <ProgressBadge status={featuredTour.myProgress?.status} tr={tr} />\n              </div>\n              {featuredTour.description ? (\n                <Markdown inline className=\"mt-2 text-sm text-text-secondary line-clamp-3\">\n                  {featuredTour.description}\n                </Markdown>\n              ) : null}\n            </EmphasisPanel>\n          ) : null}\n\n          {restTours.length > 0 ? (\n            <ul className=\"grid gap-3 grid-cols-1 sm:grid-cols-2 lg:grid-cols-3\">\n              {restTours.map((tour: TourSummary) => (\n                <li key={tour.id}>\n                  <GlassCard\n                    treatment=\"plain\"\n                    className=\"h-full p-4 flex flex-col gap-2 border-border-seam shadow-[var(--shadow-pop)]\"\n                  >\n                    <div className=\"flex items-start justify-between gap-2\">\n                      <h2 className=\"font-semibold text-text-primary line-clamp-2\">{tour.name}</h2>\n                      <ProgressBadge status={tour.myProgress?.status} tr={tr} />\n                    </div>\n                    {tour.description ? (\n                      <Markdown inline className=\"text-sm text-text-secondary line-clamp-3\">\n                        {tour.description}\n                      </Markdown>\n                    ) : null}\n                  </GlassCard>\n                </li>\n              ))}\n            </ul>\n          ) : null}\n        </div>\n      )}\n    </div>\n  );\n}\n\nfunction ProgressBadge({\n  status,\n  tr,\n}: {\n  status: string | undefined;\n  tr: (key: ToursTranslationKey) => string;\n}) {\n  switch (status) {\n    case 'COMPLETED':\n      return (\n        <span className=\"inline-flex items-center gap-1 text-xs text-success\">\n          <CheckCircle2 size={14} />\n          {tr('myTours.status.completed')}\n        </span>\n      );\n    case 'IN_PROGRESS':\n      return (\n        <span className=\"inline-flex items-center gap-1 text-xs text-warning motion-safe:animate-vc-glow-pulse\">\n          <Play size={14} />\n          {tr('myTours.status.inProgress')}\n        </span>\n      );\n    case 'SKIPPED':\n    case 'DISMISSED':\n      return (\n        <span className=\"inline-flex items-center gap-1 text-xs text-text-secondary\">\n          <MinusCircle size={14} />\n          {tr('myTours.status.skipped')}\n        </span>\n      );\n    default:\n      return (\n        <span className=\"inline-flex items-center gap-1 text-xs text-text-secondary\">\n          <Circle size={14} />\n          {tr('myTours.status.notStarted')}\n        </span>\n      );\n  }\n}\n"],"mappings":"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"}