clearotron 0.3.0-beta.3 → 0.3.0-beta.4

package/portal-ui/dist/assets/{index-C1gpdkyH.js → index-DWYCsOCJ.js}

@@ -10764,7 +10764,33 @@ var api = {
 				...asString(r["sub"]) ? { sub: asString(r["sub"]) } : {},
 				...asString(r["verifiedOn"]) ? { verifiedOn: asString(r["verifiedOn"]) } : {},
 				...asString(r["by"]) ? { by: asString(r["by"]) } : {},
-				steps: asArray(r["steps"]).filter((x) => typeof x === "string" && x !== ""),
+				steps: asArray(r["steps"]).flatMap((x) => {
+					const s = asRecord(x);
+					const text = asString(s["text"]);
+					if (!text) return [];
+					const hint = asString(s["hint"]);
+					const c = s["copy"] == null ? null : asRecord(s["copy"]);
+					let copy;
+					if (c) {
+						const kind = asString(c["kind"]);
+						if (kind === "block" && asString(c["text"])) copy = {
+							kind,
+							text: asString(c["text"])
+						};
+						else if (kind === "secret" && asString(c["label"]) && asString(c["template"]) && asString(c["slot"]) && asString(c["template"]).includes(asString(c["slot"]))) copy = {
+							kind,
+							label: asString(c["label"]),
+							template: asString(c["template"]),
+							slot: asString(c["slot"])
+						};
+						else return [];
+					}
+					return [{
+						text,
+						...hint ? { hint } : {},
+						...copy ? { copy } : {}
+					}];
+				}),
 				launch: (() => {
 					const u = asString(asRecord(r["launch"])["url"]);
 					return u && /^https:\/\//.test(u) ? { url: u } : null;
@@ -11149,6 +11175,7 @@ var PATHS = {
 	bookmark: "M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2Z",
 	sliders: "M4 21v-7M4 10V3M12 21v-9M12 8V3M20 21v-5M20 12V3M1 14h6M9 8h6M17 16h6",
 	server: "M20 2H4a2 2 0 0 0-2 2v4a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2ZM20 14H4a2 2 0 0 0-2 2v4a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-4a2 2 0 0 0-2-2ZM6 6h.01M6 18h.01",
+	laptop: "M20 16V7a2 2 0 0 0-2-2H6a2 2 0 0 0-2 2v9m16 0H4m16 0 1.28 2.55a1 1 0 0 1-.9 1.45H3.62a1 1 0 0 1-.9-1.45L4 16",
 	menu: "M3 12h18M3 6h18M3 18h18",
 	x: "M18 6 6 18M6 6l12 12",
 	chevron: "m9 18 6-6-6-6",
@@ -11156,6 +11183,7 @@ var PATHS = {
 	"chevron-right": "m9 18 6-6-6-6",
 	"grip-vertical": "M9 5h.01M15 5h.01M9 12h.01M15 12h.01M9 19h.01M15 19h.01",
 	"arrow-right": "M5 12h14M13 6l6 6-6 6",
+	"arrow-left": "M19 12H5M11 18l-6-6 6-6",
 	trash: "M3 6h18M8 6V4h8v2M19 6l-1 14H6L5 6M10 11v6M14 11v6",
 	search: "M11 19a8 8 0 1 0 0-16 8 8 0 0 0 0 16ZM21 21l-4.3-4.3",
 	eye: "M2 12s4-7 10-7 10 7 10 7-4 7-10 7-10-7-10-7ZM12 15a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z",
@@ -11487,6 +11515,157 @@ function accessSentence(input) {
 	return limits.length ? `${first} They ${limits.join(", and ")}.` : first;
 }
 //#endregion
+//#region src/shell/permissions.ts
+function canManage(who) {
+	return who.permissions.manage;
+}
+function canRun(who) {
+	return who.permissions.run;
+}
+function seesEverything(who) {
+	return who.allAccounts === true;
+}
+//#endregion
+//#region src/shell/CompanyPicker.tsx
+function CompanyCard({ row, onPick }) {
+	return (0, import_jsx_runtime.jsxs)("button", {
+		type: "button",
+		className: row.generic ? "entry-card pick-generic" : "entry-card",
+		onClick: onPick,
+		style: {
+			flexDirection: "row",
+			alignItems: "center",
+			gap: 16,
+			padding: "15px 17px"
+		},
+		children: [(0, import_jsx_runtime.jsxs)("span", {
+			style: {
+				minWidth: 0,
+				flex: 1,
+				textAlign: "left"
+			},
+			children: [(0, import_jsx_runtime.jsxs)("span", {
+				className: "entry-title",
+				style: {
+					display: "block",
+					marginBottom: 2
+				},
+				children: [row.name, row.generic ? (0, import_jsx_runtime.jsx)("span", {
+					className: "pill",
+					style: {
+						marginLeft: 8,
+						verticalAlign: "middle",
+						background: "transparent",
+						borderColor: "var(--accent-ink)",
+						color: "var(--text-accent)"
+					},
+					children: "Default"
+				}) : null]
+			}), (0, import_jsx_runtime.jsx)("span", {
+				className: "entry-body",
+				style: {
+					display: "block",
+					overflow: "hidden",
+					textOverflow: "ellipsis",
+					whiteSpace: "nowrap"
+				},
+				children: row.line
+			})]
+		}), (0, import_jsx_runtime.jsx)("span", {
+			"aria-hidden": "true",
+			style: {
+				flex: "none",
+				color: "var(--text-faint)",
+				display: "inline-flex"
+			},
+			children: (0, import_jsx_runtime.jsx)(Icon, {
+				name: "arrow-right",
+				size: 17
+			})
+		})]
+	});
+}
+function CompanyPicker({ eyebrow, heading, line, keys, orgOf, organisations, companyName, factsFor, onPick, onAdd }) {
+	const { headings, groups } = pickerGroups(keys, orgOf, organisations, companyName, factsFor);
+	return (0, import_jsx_runtime.jsxs)("div", {
+		className: "screen",
+		children: [(0, import_jsx_runtime.jsx)("div", {
+			className: "eyebrow",
+			children: eyebrow
+		}), (0, import_jsx_runtime.jsxs)("div", {
+			className: "measure",
+			children: [(0, import_jsx_runtime.jsxs)("div", {
+				style: {
+					display: "flex",
+					alignItems: "flex-end",
+					gap: 20,
+					margin: "4px 0 18px"
+				},
+				children: [(0, import_jsx_runtime.jsxs)("div", {
+					style: { flex: 1 },
+					children: [(0, import_jsx_runtime.jsx)("h1", {
+						style: {
+							fontSize: 27,
+							margin: "0 0 4px",
+							color: "var(--text-strong)"
+						},
+						children: heading
+					}), (0, import_jsx_runtime.jsx)("p", {
+						style: {
+							margin: 0,
+							color: "var(--text-muted)",
+							fontSize: 14.5
+						},
+						children: line
+					})]
+				}), onAdd ? (0, import_jsx_runtime.jsx)("button", {
+					type: "button",
+					className: "start-pill",
+					onClick: onAdd,
+					style: {
+						flex: "none",
+						borderColor: "var(--accent-ink)",
+						color: "var(--text-accent)",
+						fontWeight: 700
+					},
+					children: "+ New company"
+				}) : null]
+			}), groups.map((g, i) => (0, import_jsx_runtime.jsxs)("div", { children: [headings && g.org ? (0, import_jsx_runtime.jsx)("div", {
+				className: "eyebrow",
+				style: { margin: i === 0 ? "0 0 8px" : "16px 0 8px" },
+				"data-anon": "mark",
+				children: g.org.name
+			}) : null, (0, import_jsx_runtime.jsx)("div", {
+				style: {
+					display: "flex",
+					flexDirection: "column",
+					gap: 10,
+					marginTop: !headings && i > 0 ? 10 : 0
+				},
+				children: g.rows.map((r) => (0, import_jsx_runtime.jsx)(CompanyCard, {
+					row: r,
+					onPick: () => onPick(r.key)
+				}, r.key))
+			})] }, g.org?.key ?? ""))]
+		})]
+	});
+}
+function CompanyGate({ ctx, eyebrow, heading, line }) {
+	return (0, import_jsx_runtime.jsx)(CompanyPicker, {
+		eyebrow,
+		heading,
+		line,
+		keys: ctx.ownerKeys,
+		orgOf: ctx.orgOf,
+		organisations: ctx.organisations,
+		companyName: ctx.ownerName,
+		factsFor: ctx.factsFor,
+		onPick: (key) => ctx.setOwner(key),
+		onAdd: canManage(ctx.me) ? () => ctx.go(NEW_COMPANY_PATH) : void 0
+	});
+}
+var NEW_COMPANY_PATH = "/portal/brand/new";
+//#endregion
 //#region src/shell/AppShell.tsx
 var MOBILE = "(max-width: 899px)";
 function useIsMobile() {
@@ -11741,7 +11920,8 @@ function AppShell({ render }) {
 								}), (0, import_jsx_runtime.jsx)(BrandOwnerSwitcher, {
 									grouped,
 									value: ownerInView,
-									onChange: setOwnerGuarded
+									onChange: setOwnerGuarded,
+									onAdd: canManage(me) ? () => go(NEW_COMPANY_PATH) : void 0
 								})]
 							}), (0, import_jsx_runtime.jsx)(NavList, {
 								entries: groups.owner,
@@ -11909,14 +12089,15 @@ function AppShell({ render }) {
 		]
 	});
 }
-function BrandOwnerSwitcher({ grouped, value, onChange }) {
+var NEW_COMPANY_OPTION = ":new-company";
+function BrandOwnerSwitcher({ grouped, value, onChange, onAdd }) {
 	const option = (r) => (0, import_jsx_runtime.jsx)("option", {
 		value: r.key,
 		children: switcherLabel(r)
 	}, r.key);
 	return (0, import_jsx_runtime.jsxs)("select", {
 		value: value ?? "",
-		onChange: (e) => onChange(e.target.value || null),
+		onChange: (e) => e.target.value === NEW_COMPANY_OPTION ? onAdd?.() : onChange(e.target.value || null),
 		"aria-label": "Company",
 		style: {
 			width: "100%",
@@ -11929,13 +12110,21 @@ function BrandOwnerSwitcher({ grouped, value, onChange }) {
 			fontWeight: 700,
 			color: "var(--text-strong)"
 		},
-		children: [(0, import_jsx_runtime.jsx)("option", {
-			value: "",
-			children: ALL_OWNERS
-		}), grouped.groups.map((g) => grouped.headings && g.org ? (0, import_jsx_runtime.jsx)("optgroup", {
-			label: g.org.name,
-			children: g.rows.map(option)
-		}, g.org.key) : g.rows.map(option))]
+		children: [
+			(0, import_jsx_runtime.jsx)("option", {
+				value: "",
+				children: ALL_OWNERS
+			}),
+			grouped.groups.map((g) => grouped.headings && g.org ? (0, import_jsx_runtime.jsx)("optgroup", {
+				label: g.org.name,
+				children: g.rows.map(option)
+			}, g.org.key) : g.rows.map(option)),
+			onAdd ? (0, import_jsx_runtime.jsx)("option", {
+				value: NEW_COMPANY_OPTION,
+				"data-action": "new-company",
+				children: "+ New company"
+			}) : null
+		]
 	});
 }
 var initials = (email) => {
@@ -12252,17 +12441,6 @@ function moveBefore(order, id, over) {
 	return next;
 }
 //#endregion
-//#region src/shell/permissions.ts
-function canManage(who) {
-	return who.permissions.manage;
-}
-function canRun(who) {
-	return who.permissions.run;
-}
-function seesEverything(who) {
-	return who.allAccounts === true;
-}
-//#endregion
 //#region src/screens/Home.tsx
 var TERMINAL$1 = new Set([
 	"delivered",
@@ -15944,146 +16122,6 @@ function unsavedChanges({ current, empty, saved, submitted }) {
 	return current !== saved;
 }
 //#endregion
-//#region src/shell/CompanyPicker.tsx
-function CompanyCard({ row, onPick }) {
-	return (0, import_jsx_runtime.jsxs)("button", {
-		type: "button",
-		className: row.generic ? "entry-card pick-generic" : "entry-card",
-		onClick: onPick,
-		style: {
-			flexDirection: "row",
-			alignItems: "center",
-			gap: 16,
-			padding: "15px 17px"
-		},
-		children: [(0, import_jsx_runtime.jsxs)("span", {
-			style: {
-				minWidth: 0,
-				flex: 1,
-				textAlign: "left"
-			},
-			children: [(0, import_jsx_runtime.jsxs)("span", {
-				className: "entry-title",
-				style: {
-					display: "block",
-					marginBottom: 2
-				},
-				children: [row.name, row.generic ? (0, import_jsx_runtime.jsx)("span", {
-					className: "pill",
-					style: {
-						marginLeft: 8,
-						verticalAlign: "middle",
-						background: "transparent",
-						borderColor: "var(--accent-ink)",
-						color: "var(--text-accent)"
-					},
-					children: "Default"
-				}) : null]
-			}), (0, import_jsx_runtime.jsx)("span", {
-				className: "entry-body",
-				style: {
-					display: "block",
-					overflow: "hidden",
-					textOverflow: "ellipsis",
-					whiteSpace: "nowrap"
-				},
-				children: row.line
-			})]
-		}), (0, import_jsx_runtime.jsx)("span", {
-			"aria-hidden": "true",
-			style: {
-				flex: "none",
-				color: "var(--text-faint)",
-				display: "inline-flex"
-			},
-			children: (0, import_jsx_runtime.jsx)(Icon, {
-				name: "arrow-right",
-				size: 17
-			})
-		})]
-	});
-}
-function CompanyPicker({ eyebrow, heading, line, keys, orgOf, organisations, companyName, factsFor, onPick, onAdd }) {
-	const { headings, groups } = pickerGroups(keys, orgOf, organisations, companyName, factsFor);
-	return (0, import_jsx_runtime.jsxs)("div", {
-		className: "screen",
-		children: [(0, import_jsx_runtime.jsx)("div", {
-			className: "eyebrow",
-			children: eyebrow
-		}), (0, import_jsx_runtime.jsxs)("div", {
-			className: "measure",
-			children: [(0, import_jsx_runtime.jsxs)("div", {
-				style: {
-					display: "flex",
-					alignItems: "flex-end",
-					gap: 20,
-					margin: "4px 0 18px"
-				},
-				children: [(0, import_jsx_runtime.jsxs)("div", {
-					style: { flex: 1 },
-					children: [(0, import_jsx_runtime.jsx)("h1", {
-						style: {
-							fontSize: 27,
-							margin: "0 0 4px",
-							color: "var(--text-strong)"
-						},
-						children: heading
-					}), (0, import_jsx_runtime.jsx)("p", {
-						style: {
-							margin: 0,
-							color: "var(--text-muted)",
-							fontSize: 14.5
-						},
-						children: line
-					})]
-				}), onAdd ? (0, import_jsx_runtime.jsx)("button", {
-					type: "button",
-					className: "start-pill",
-					onClick: onAdd,
-					style: {
-						flex: "none",
-						borderColor: "var(--accent-ink)",
-						color: "var(--text-accent)",
-						fontWeight: 700
-					},
-					children: "+ New company"
-				}) : null]
-			}), groups.map((g, i) => (0, import_jsx_runtime.jsxs)("div", { children: [headings && g.org ? (0, import_jsx_runtime.jsx)("div", {
-				className: "eyebrow",
-				style: { margin: i === 0 ? "0 0 8px" : "16px 0 8px" },
-				"data-anon": "mark",
-				children: g.org.name
-			}) : null, (0, import_jsx_runtime.jsx)("div", {
-				style: {
-					display: "flex",
-					flexDirection: "column",
-					gap: 10,
-					marginTop: !headings && i > 0 ? 10 : 0
-				},
-				children: g.rows.map((r) => (0, import_jsx_runtime.jsx)(CompanyCard, {
-					row: r,
-					onPick: () => onPick(r.key)
-				}, r.key))
-			})] }, g.org?.key ?? ""))]
-		})]
-	});
-}
-function CompanyGate({ ctx, eyebrow, heading, line }) {
-	return (0, import_jsx_runtime.jsx)(CompanyPicker, {
-		eyebrow,
-		heading,
-		line,
-		keys: ctx.ownerKeys,
-		orgOf: ctx.orgOf,
-		organisations: ctx.organisations,
-		companyName: ctx.ownerName,
-		factsFor: ctx.factsFor,
-		onPick: (key) => ctx.setOwner(key),
-		onAdd: canManage(ctx.me) ? () => ctx.go(NEW_COMPANY_PATH) : void 0
-	});
-}
-var NEW_COMPANY_PATH = "/portal/brand/new";
-//#endregion
 //#region src/contract/companyCreated.ts
 var pending = null;
 function handOff(created) {
@@ -20031,19 +20069,19 @@ var WHAT_YOU_CAN_DO = [
 	"Ask what-if: why a finding was rated as it was, what changes if the goods narrow"
 ];
 var COPIED_MS = 2600;
+var PLACES = ["disk", "public-http"];
 var WHERE = {
-	disk: "On this computer",
-	"public-http": "Somewhere else"
-};
-var EITHER = "either";
-var placesOf = (offers) => {
-	const named = [...new Set(offers.map((o) => o.route ?? "public-http"))].filter((r) => r !== EITHER);
-	return named.length ? named : offers.length ? ["disk"] : [];
-};
-var servesPlace = (o, place) => {
-	const r = o.route ?? "public-http";
-	return r === place || r === EITHER;
+	disk: {
+		label: "Clearotron is installed on this machine (laptop/desktop)",
+		icon: "laptop"
+	},
+	"public-http": {
+		label: "Clearotron is running elsewhere (e.g. Cloud/Server)",
+		icon: "server"
+	}
 };
+var HELP_URL = "https://github.com/CordilleraSarl/clearotron/blob/main/mcp-server/CONNECT.md";
+var HELP_LINK_TEXT = "GitHub MCP Connector Documentation";
 async function copy(text) {
 	try {
 		await navigator.clipboard.writeText(text);
@@ -20053,77 +20091,121 @@ async function copy(text) {
 	}
 }
 var mask = (key) => key.length > 3 ? `${key.slice(0, 3)}••••` : "••••";
-var pasteLine = (offer) => offer.pasteAs ?? `Paste it into ${offer.name}`;
-function Destination({ offer, selected, copied, onPick }) {
-	return (0, import_jsx_runtime.jsxs)("button", {
-		type: "button",
-		className: "ai-dest",
-		"data-id": offer.id,
-		"data-selected": selected ? "" : void 0,
-		"data-copied": copied ? "" : void 0,
-		"aria-pressed": selected,
-		onClick: onPick,
-		children: [(0, import_jsx_runtime.jsxs)("span", {
-			className: "ai-dest-name",
-			children: [offer.name, offer.sub ? (0, import_jsx_runtime.jsx)("span", {
-				className: "ai-dest-sub",
-				children: offer.sub
-			}) : null]
-		}), (0, import_jsx_runtime.jsxs)("span", {
-			className: "ai-dest-say",
-			children: [(0, import_jsx_runtime.jsx)("span", {
-				className: "ai-dest-idle",
-				children: pasteLine(offer)
-			}), (0, import_jsx_runtime.jsx)("span", {
-				className: "ai-dest-done",
-				children: "✓ Copied"
-			})]
-		})]
-	});
-}
-function Panel({ offer, landed }) {
+var fill = (c, value) => c.template.split(c.slot).join(value);
+function Marked({ text }) {
+	const parts = text.split(/(\*\*[^*]+\*\*|`[^`]+`)/g).filter((p) => p !== "");
+	return (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: parts.map((p, n) => p.length > 4 && p.startsWith("**") && p.endsWith("**") ? (0, import_jsx_runtime.jsx)("b", { children: p.slice(2, -2) }, n) : p.length > 2 && p.startsWith("`") && p.endsWith("`") ? (0, import_jsx_runtime.jsx)("code", {
+		className: "ai-code",
+		children: p.slice(1, -1)
+	}, n) : (0, import_jsx_runtime.jsx)("span", { children: p }, n)) });
+}
+var AT_REST = {
+	copiedAt: null,
+	landedAt: null,
+	landed: null,
+	revealedAt: null,
+	revealed: null
+};
+function StepsPanel({ offer, measuring = false, state = AT_REST, onBlock, onSecret }) {
 	return (0, import_jsx_runtime.jsxs)("div", {
-		className: "ai-panel",
-		"data-for": offer.id,
+		className: "steps-panel",
+		"data-for": measuring ? void 0 : offer.id,
 		children: [
+			(0, import_jsx_runtime.jsx)("div", {
+				className: "eyebrow",
+				children: "Steps for"
+			}),
 			(0, import_jsx_runtime.jsx)("h3", {
-				className: "ai-panel-head",
-				children: pasteLine(offer)
+				className: "steps-name",
+				children: offer.name
 			}),
-			landed ? (0, import_jsx_runtime.jsxs)("p", {
-				className: "ai-panel-landed",
-				children: ["On your clipboard now: ", (0, import_jsx_runtime.jsx)("code", {
-					className: "mono",
-					children: landed
-				})]
-			}) : null,
-			offer.steps.length ? (0, import_jsx_runtime.jsx)("ol", {
-				className: "ai-panel-steps",
-				children: offer.steps.map((line) => (0, import_jsx_runtime.jsx)("li", { children: line }, line))
-			}) : null,
-			offer.verifiedOn ? (0, import_jsx_runtime.jsxs)("p", {
-				className: "ai-panel-stamp",
-				children: [
-					"✓ Checked ",
-					offer.verifiedOn,
-					" — these are the taps this app actually has today."
-				]
-			}) : (0, import_jsx_runtime.jsx)("p", {
-				className: "ai-panel-stamp ai-panel-stamp-none",
-				children: "These steps name no button we have not opened ourselves. Your app may word them differently."
+			(0, import_jsx_runtime.jsx)("ol", {
+				className: "steps",
+				children: offer.steps.map((s, i) => {
+					const c = s.copy;
+					const flashed = !measuring && state.copiedAt === i;
+					const landed = measuring && c?.kind === "secret" ? fill(c, mask("")) : state.landedAt === i ? state.landed : null;
+					return (0, import_jsx_runtime.jsx)("li", { children: (0, import_jsx_runtime.jsxs)("div", { children: [
+						(0, import_jsx_runtime.jsx)("div", {
+							className: "step-text",
+							children: (0, import_jsx_runtime.jsx)(Marked, { text: s.text })
+						}),
+						c?.kind === "block" ? (0, import_jsx_runtime.jsxs)("div", {
+							className: "codeblock",
+							children: [(0, import_jsx_runtime.jsx)("pre", { children: c.text }), (0, import_jsx_runtime.jsx)("button", {
+								type: "button",
+								className: `btn-ghost${flashed ? " is-copied" : ""}`,
+								"data-step": i,
+								tabIndex: measuring ? -1 : void 0,
+								onClick: () => onBlock?.(i, c.text),
+								children: flashed ? "✓ Copied" : "Copy"
+							})]
+						}) : null,
+						c?.kind === "secret" ? (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+							(0, import_jsx_runtime.jsx)("div", {
+								className: "secret-btn",
+								children: (0, import_jsx_runtime.jsx)("button", {
+									type: "button",
+									className: `btn-primary${flashed ? " is-copied" : ""}`,
+									"data-step": i,
+									tabIndex: measuring ? -1 : void 0,
+									onClick: () => onSecret?.(i, c),
+									children: flashed ? (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [(0, import_jsx_runtime.jsx)(Icon, {
+										name: "check",
+										size: 15
+									}), "Copied"] }) : landed ? "Copy again" : c.label
+								})
+							}),
+							landed ? (0, import_jsx_runtime.jsxs)("div", {
+								className: "landed",
+								children: [(0, import_jsx_runtime.jsx)("div", {
+									className: "landed-label",
+									children: "On your clipboard now"
+								}), landed.split("\n").map((line, n) => (0, import_jsx_runtime.jsx)("div", {
+									className: "mono",
+									children: line
+								}, n))]
+							}) : null,
+							!measuring && state.revealedAt === i && state.revealed ? (0, import_jsx_runtime.jsxs)("div", {
+								className: "landed",
+								children: [(0, import_jsx_runtime.jsx)("p", {
+									className: "ai-said",
+									children: "Your browser would not let us copy it. Copy this by hand — it is yours, and it will not be shown again."
+								}), (0, import_jsx_runtime.jsx)("pre", {
+									className: "ai-pre",
+									children: state.revealed
+								})]
+							}) : null
+						] }) : null,
+						s.hint ? (0, import_jsx_runtime.jsx)("div", {
+							className: "step-hint",
+							children: (0, import_jsx_runtime.jsx)(Marked, { text: s.hint })
+						}) : null
+					] }) }, i);
+				})
 			})
 		]
 	});
 }
+function NotOnline() {
+	return (0, import_jsx_runtime.jsxs)("div", {
+		className: "notice ai-none",
+		children: [(0, import_jsx_runtime.jsx)("strong", { children: "Not available on this installation yet" }), (0, import_jsx_runtime.jsx)("p", { children: "Your AI app reaches Clearotron over the internet, and this installation isn’t on the internet yet. Whoever installed it can put it online — it takes about a minute and needs no account." })]
+	});
+}
 function UseYourAI({ ctx }) {
 	const [access, setAccess] = (0, import_react.useState)(null);
-	const [route, setRoute] = (0, import_react.useState)(null);
+	const [place, setPlace] = (0, import_react.useState)(null);
 	const [picked, setPicked] = (0, import_react.useState)(null);
+	const [copiedAt, setCopiedAt] = (0, import_react.useState)(null);
+	const [landedAt, setLandedAt] = (0, import_react.useState)(null);
 	const [landed, setLanded] = (0, import_react.useState)(null);
-	const [copiedId, setCopiedId] = (0, import_react.useState)(null);
 	const [failed, setFailed] = (0, import_react.useState)(null);
+	const [revealedAt, setRevealedAt] = (0, import_react.useState)(null);
 	const [revealed, setRevealed] = (0, import_react.useState)(null);
+	const [slotHeight, setSlotHeight] = (0, import_react.useState)(0);
 	const timer = (0, import_react.useRef)(null);
+	const probe = (0, import_react.useRef)(null);
 	(0, import_react.useEffect)(() => {
 		api.mcpAccess().then((r) => {
 			if (r.kind === "ok") setAccess(r.value);
@@ -20133,43 +20215,66 @@ function UseYourAI({ ctx }) {
 		if (timer.current) window.clearTimeout(timer.current);
 	}, []);
 	const served = (access?.offers ?? []).filter((o) => o.served);
-	const routes = placesOf(served);
-	const active = route ?? (routes.includes("disk") ? "disk" : routes[0] ?? null);
-	const here = served.filter((o) => active !== null && servesPlace(o, active));
+	const routes = PLACES.filter((p) => served.some((o) => o.route === p));
+	const asks = routes.includes("disk");
+	const active = asks ? place : routes[0] ?? null;
+	const here = served.filter((o) => active !== null && o.route === active);
 	const chosen = here.find((o) => o.id === picked) ?? null;
-	const press = async (offer) => {
-		setPicked(offer.id);
+	(0, import_react.useLayoutEffect)(() => {
+		const el = probe.current;
+		if (!el) return;
+		const measure = () => setSlotHeight(Math.max(0, ...[...el.children].map((c) => c.offsetHeight)));
+		measure();
+		const seen = new ResizeObserver(measure);
+		seen.observe(el);
+		return () => seen.disconnect();
+	}, [active, here.length]);
+	const settle = () => {
+		setCopiedAt(null);
+		setLandedAt(null);
+		setLanded(null);
+		setRevealedAt(null);
+		setRevealed(null);
+		setFailed(null);
+	};
+	const flash = (i) => {
+		setCopiedAt(i);
+		if (timer.current) window.clearTimeout(timer.current);
+		timer.current = window.setTimeout(() => setCopiedAt(null), COPIED_MS);
+	};
+	const copyBlock = async (i, text) => {
+		setFailed(null);
+		if (!await copy(text)) {
+			setFailed("Your browser would not let us copy it. Select the text above and copy it by hand.");
+			return;
+		}
+		flash(i);
+	};
+	const press = async (i, c) => {
 		setFailed(null);
+		setRevealedAt(null);
 		setRevealed(null);
-		setLanded(null);
-		if (offer.command) {
-			if (!await copy(offer.command)) {
-				setFailed("Your browser would not let us copy it. The steps below still apply.");
-				return;
-			}
-			setLanded(offer.command);
-		} else {
-			const r = await api.connectKey();
-			if (r.kind !== "ok") {
-				setFailed("We could not set this up just now. Try again, or ask us.");
-				return;
-			}
-			if (!await copy(`${r.value.address}\n${r.value.key}`)) {
-				setRevealed({
-					address: r.value.address,
-					key: r.value.key
-				});
-				return;
-			}
-			setLanded(`${r.value.address}  ${mask(r.value.key)}`);
+		const r = await api.connectKey();
+		if (r.kind !== "ok") {
+			setFailed("We could not set this up just now. Try again, or ask us.");
+			return;
 		}
-		setCopiedId(offer.id);
-		if (timer.current) window.clearTimeout(timer.current);
-		timer.current = window.setTimeout(() => setCopiedId(null), COPIED_MS);
+		if (!await copy(fill(c, r.value.key))) {
+			setRevealedAt(i);
+			setRevealed(fill(c, r.value.key));
+			return;
+		}
+		setLandedAt(i);
+		setLanded(fill(c, mask(r.value.key)));
+		flash(i);
 	};
 	return (0, import_jsx_runtime.jsxs)("div", {
 		className: "screen ai-screen",
 		children: [
+			(0, import_jsx_runtime.jsx)("div", {
+				className: "eyebrow",
+				children: "Use your own AI"
+			}),
 			(0, import_jsx_runtime.jsx)("h1", {
 				className: "ai-title",
 				children: "Use your own AI"
@@ -20179,136 +20284,156 @@ function UseYourAI({ ctx }) {
 				children: "Run and interrogate clearances from the assistant you already use — by voice, by email, or just by asking."
 			}),
 			(0, import_jsx_runtime.jsxs)("section", {
-				className: "ai-can",
+				className: "ctx-card ai-can",
 				children: [
 					(0, import_jsx_runtime.jsx)("h2", { children: "What you can do" }),
-					(0, import_jsx_runtime.jsx)("ul", { children: WHAT_YOU_CAN_DO.map((line) => (0, import_jsx_runtime.jsx)("li", { children: line }, line)) }),
+					(0, import_jsx_runtime.jsx)("ul", {
+						className: "ai-can-list",
+						children: WHAT_YOU_CAN_DO.map((line) => (0, import_jsx_runtime.jsxs)("li", { children: [(0, import_jsx_runtime.jsx)(Icon, {
+							name: "check",
+							size: 15
+						}), line] }, line))
+					}),
 					(0, import_jsx_runtime.jsxs)("p", {
 						className: "ai-can-foot",
 						children: [
-							"Every report also has an ",
+							"Use the ",
 							(0, import_jsx_runtime.jsx)("strong", { children: "Ask AI" }),
-							" button that jumps straight to that run.",
-							" ",
-							(0, import_jsx_runtime.jsx)("strong", { children: "What you set up here reaches your own clearances and nothing else." })
+							" button on a report."
 						]
 					})
 				]
 			}),
-			(0, import_jsx_runtime.jsx)("h2", {
-				className: "ai-connect-head",
-				children: "Connect it"
-			}),
-			!served.length ? (0, import_jsx_runtime.jsxs)("p", {
-				className: "ai-none",
-				children: [(0, import_jsx_runtime.jsx)("strong", { children: "Not available on this installation yet." }), " Your assistants reach this service over the internet, and this installation is not on the internet. Whoever installed it can put it online — it takes about a minute and needs no account."]
-			}) : (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
-				routes.length > 1 ? (0, import_jsx_runtime.jsxs)("div", {
-					className: "ai-where",
-					children: [
-						(0, import_jsx_runtime.jsx)("h3", {
-							className: "ai-where-q",
-							children: "Where does your assistant run?"
-						}),
-						(0, import_jsx_runtime.jsx)("div", {
-							className: "ai-seg",
-							role: "group",
-							"aria-label": "Where does your assistant run?",
-							children: routes.map((r) => (0, import_jsx_runtime.jsx)("button", {
-								type: "button",
-								className: "ai-seg-btn",
-								"data-on": r === active ? "" : void 0,
-								"aria-pressed": r === active,
-								onClick: () => {
-									setRoute(r);
-									setPicked(null);
-									setLanded(null);
-									setRevealed(null);
-									setFailed(null);
-								},
-								children: WHERE[r] ?? WHERE["public-http"]
-							}, r))
-						}),
-						(0, import_jsx_runtime.jsx)("p", {
-							className: "ai-where-sub",
-							children: "Pick your assistant. We copy the one line it needs — nothing to sign up for, nothing opened up."
-						})
-					]
-				}) : (0, import_jsx_runtime.jsx)("p", {
-					className: "ai-where-sub",
-					children: "Pick where you will paste it. One press copies everything your assistant needs."
-				}),
-				(0, import_jsx_runtime.jsx)("div", {
-					className: "ai-dests",
-					children: here.map((o) => (0, import_jsx_runtime.jsx)(Destination, {
-						offer: o,
-						selected: o.id === picked,
-						copied: o.id === copiedId,
-						onPick: () => void press(o)
-					}, o.id))
-				}),
-				(0, import_jsx_runtime.jsxs)("div", {
-					className: "ai-slot",
-					"aria-live": "polite",
-					children: [failed ? (0, import_jsx_runtime.jsx)("p", {
-						className: "ai-said",
-						children: failed
-					}) : null, revealed ? (0, import_jsx_runtime.jsxs)("div", {
-						className: "ai-panel",
-						children: [(0, import_jsx_runtime.jsxs)("p", {
-							className: "ai-said",
-							children: [
-								"Your browser would not let us copy it. Paste these two lines into",
-								" ",
-								chosen?.name ?? "your assistant",
-								" — they are yours, and they will not be shown again."
-							]
-						}), (0, import_jsx_runtime.jsxs)("pre", {
-							className: "ai-pre",
+			(0, import_jsx_runtime.jsxs)("section", {
+				className: "ai-connect",
+				children: [(0, import_jsx_runtime.jsx)("h2", {
+					className: "ai-connect-head",
+					children: "Connect it"
+				}), !served.length ? (0, import_jsx_runtime.jsx)(NotOnline, {}) : (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [asks ? (0, import_jsx_runtime.jsx)("div", {
+					className: "where-grid",
+					role: "group",
+					"aria-label": "Where Clearotron is running",
+					children: PLACES.map((p) => (0, import_jsx_runtime.jsxs)("button", {
+						type: "button",
+						className: "where-card",
+						"data-place": p,
+						"aria-pressed": p === active,
+						onClick: () => {
+							if (p !== active) {
+								setPlace(p);
+								setPicked(null);
+								settle();
+							}
+						},
+						children: [
+							(0, import_jsx_runtime.jsx)("span", {
+								className: p === active ? "radio radio-on" : "radio",
+								"aria-hidden": "true"
+							}),
+							(0, import_jsx_runtime.jsx)(Icon, {
+								name: WHERE[p].icon,
+								size: 19
+							}),
+							WHERE[p].label
+						]
+					}, p))
+				}) : null, active === null ? null : !here.length ? (0, import_jsx_runtime.jsx)(NotOnline, {}) : (0, import_jsx_runtime.jsxs)("div", {
+					className: "ai-connect-grid",
+					children: [(0, import_jsx_runtime.jsxs)("div", { children: [(0, import_jsx_runtime.jsx)("h3", {
+						className: "section-title",
+						children: "Select AI app"
+					}), (0, import_jsx_runtime.jsx)("div", {
+						className: "ai-apps",
+						children: here.map((o) => (0, import_jsx_runtime.jsxs)("button", {
+							type: "button",
+							className: `pick-row ai-app${o.id === picked ? " pick-row-on" : ""}`,
+							"data-id": o.id,
+							"aria-pressed": o.id === picked,
+							onClick: () => {
+								if (o.id !== picked) {
+									setPicked(o.id);
+									settle();
+								}
+							},
 							children: [
-								revealed.address,
-								"\n",
-								revealed.key
+								(0, import_jsx_runtime.jsx)("span", {
+									className: o.id === picked ? "radio radio-on" : "radio",
+									"aria-hidden": "true"
+								}),
+								(0, import_jsx_runtime.jsxs)("span", {
+									className: "ai-app-label",
+									children: [(0, import_jsx_runtime.jsx)("span", {
+										className: "ai-app-name",
+										children: o.name
+									}), o.sub ? (0, import_jsx_runtime.jsx)("span", {
+										className: "ai-app-sub",
+										children: o.sub
+									}) : null]
+								}),
+								(0, import_jsx_runtime.jsx)("span", {
+									className: "ai-app-go",
+									children: (0, import_jsx_runtime.jsx)(Icon, {
+										name: "chevron",
+										size: 16
+									})
+								})
 							]
-						})]
-					}) : chosen ? (0, import_jsx_runtime.jsx)(Panel, {
-						offer: chosen,
-						landed
-					}) : (0, import_jsx_runtime.jsx)("p", {
-						className: "ai-slot-empty",
-						children: "Pick your assistant and we will copy what it needs, then show you exactly where it goes."
+						}, o.id))
+					})] }), (0, import_jsx_runtime.jsxs)("div", {
+						className: "ai-slot",
+						"aria-live": "polite",
+						style: slotHeight ? { minHeight: slotHeight } : void 0,
+						children: [
+							chosen ? (0, import_jsx_runtime.jsx)(StepsPanel, {
+								offer: chosen,
+								state: {
+									copiedAt,
+									landedAt,
+									landed,
+									revealedAt,
+									revealed
+								},
+								onBlock: (i, text) => void copyBlock(i, text),
+								onSecret: (i, c) => void press(i, c)
+							}) : (0, import_jsx_runtime.jsx)("div", {
+								className: "steps-panel steps-panel-empty",
+								children: (0, import_jsx_runtime.jsxs)("span", {
+									className: "steps-empty",
+									children: [(0, import_jsx_runtime.jsx)(Icon, {
+										name: "arrow-left",
+										size: 16
+									}), "Select AI to see instructions"]
+								})
+							}),
+							failed ? (0, import_jsx_runtime.jsx)("p", {
+								className: "ai-said ai-failed",
+								children: failed
+							}) : null,
+							(0, import_jsx_runtime.jsx)("div", {
+								className: "ai-probe",
+								ref: probe,
+								"aria-hidden": "true",
+								children: here.map((o) => (0, import_jsx_runtime.jsx)(StepsPanel, {
+									offer: o,
+									measuring: true
+								}, o.id))
+							})
+						]
 					})]
-				})
-			] }),
-			(0, import_jsx_runtime.jsxs)("details", {
-				className: "ai-help",
-				children: [(0, import_jsx_runtime.jsx)("summary", { children: "Not connecting, or want to set it up yourself?" }), (0, import_jsx_runtime.jsxs)("div", {
-					className: "ai-help-body",
-					children: [
-						(0, import_jsx_runtime.jsxs)("p", { children: [
-							"Press the button for your assistant and it will tell you the next thing to do — usually three taps inside that app’s own settings. If your assistant is not listed, pick",
-							(0, import_jsx_runtime.jsx)("strong", { children: " Another agent" }),
-							": it will give you both of the things any assistant can take."
-						] }),
-						(0, import_jsx_runtime.jsxs)("p", { children: [
-							"Once it is connected, you do not have to learn anything new. Ask it in your own words —",
-							(0, import_jsx_runtime.jsx)("em", { children: " “start a knockout for our new drinks name across the US”" }),
-							", or",
-							(0, import_jsx_runtime.jsx)("em", { children: " “why did you rate that one high?”" }),
-							" — and it will do the same work you would do on these screens."
-						] }),
-						(0, import_jsx_runtime.jsx)("p", { children: "If a press does not finish, the most common reason is that your assistant runs somewhere this service cannot be reached from. The team who set this up can tell you in a sentence." }),
-						(0, import_jsx_runtime.jsxs)("p", {
-							className: "ai-help-doc",
-							children: [(0, import_jsx_runtime.jsx)("a", {
-								href: "/portal/connect-help",
-								target: "_blank",
-								rel: "noreferrer",
-								children: "The full technical instructions"
-							}), " — written for an engineer, or for an assistant reading on your behalf."]
-						})
-					]
-				})]
+				})] })]
+			}),
+			(0, import_jsx_runtime.jsxs)("div", {
+				className: "notice quiet ai-help",
+				children: [
+					(0, import_jsx_runtime.jsx)("strong", { children: "If it doesn’t connect" }),
+					(0, import_jsx_runtime.jsx)("p", { children: "Point your AI at the full technical setup instructions to diagnose." }),
+					(0, import_jsx_runtime.jsx)("p", { children: (0, import_jsx_runtime.jsxs)("a", {
+						href: HELP_URL,
+						target: "_blank",
+						rel: "noreferrer",
+						children: [HELP_LINK_TEXT, " ↗"]
+					}) })
+				]
 			})
 		]
 	});