@reticlehq/init 3.2.0 → 3.4.0

package/dist/patch/vite-owning-config.js

@@ -15,10 +15,39 @@
  * Half-editing somebody's build config is worse than a documented manual step.
  */
 import { ReticleDir } from '@reticlehq/core';
+import { parseMajor } from '../detect/detect.js';
 import { blockAfter } from './brace-scan.js';
 import { PatchKind } from './patch-kind.js';
+/** The first Vite whose dep optimizer is rolldown — the same line the Vite plugin draws. */
+const ROLLDOWN_OPTIMIZER_MAJOR = 7;
+function writesEsbuildTarget(config) {
+    const major = config.viteMajor;
+    return undefined === major || null === major || major < ROLLDOWN_OPTIMIZER_MAJOR;
+}
+/** The optimizer target, in each of the two shapes this file writes it. */
+const ESBUILD_TARGET = "esbuildOptions: { target: 'es2022' }";
+const ESBUILD_TARGET_INNER = `\n      ${ESBUILD_TARGET},`;
+const ESBUILD_TARGET_WHOLE = `, ${ESBUILD_TARGET}`;
+/**
+ * A config an older `init` patched, with the esbuild target taken back out on a rolldown Vite.
+ *
+ * Only our own literal, in the exact shapes we wrote it — an `esbuildOptions` the app set itself is
+ * theirs, and is left to Vite's deprecation notice to talk about.
+ */
+function withoutStaleEsbuildTarget(source, config) {
+    if (writesEsbuildTarget(config) || !source.includes(ESBUILD_TARGET))
+        return null;
+    const out = source.replace(ESBUILD_TARGET_INNER, '').replace(ESBUILD_TARGET_WHOLE, '');
+    return out === source ? null : out;
+}
 /** Present in a patched config AND in a hand-followed recipe — so both count as already wired. */
-const CONFIG_MARKER = '__RETICLE_TOKEN__';
+const DEFINE_TOKEN_MARKER = '__RETICLE_TOKEN__';
+function usesDefineToken(config) {
+    return config.defineToken !== false;
+}
+function alreadyMarker(config) {
+    return config.alreadyMarker ?? DEFINE_TOKEN_MARKER;
+}
 /**
  * The SDK, declared so Vite pre-bundles it BEFORE the first page load.
  *
@@ -82,30 +111,36 @@ import { join } from 'node:path';
  * cosmetic: Astro's default down-levels the modern SDK bundle and dies on a destructuring transform.
  */
 function viteKeys(config) {
-    return [
+    const keys = [
         { key: 'build', inner: `\n      target: 'es2022',` },
         {
             key: 'optimizeDeps',
-            inner: `\n      include: [${sdkInclude(config)}],\n      esbuildOptions: { target: 'es2022' },`,
-        },
-        {
-            key: 'define',
-            inner: `\n      __RETICLE_TOKEN__: JSON.stringify(reticleToken()),\n      __RETICLE_ROOT__: JSON.stringify(process.cwd()),`,
+            inner: `\n      include: [${sdkInclude(config)}],${writesEsbuildTarget(config) ? ESBUILD_TARGET_INNER : ''}`,
         },
         // Merged in first, so a `server: { port }` the app already set keeps its port. An app that
         // already sets `server.watch` itself is the one shape this loses to — the inner `watch` key would
         // be duplicated and the app's would win — which is the same nested-merge ceiling `build` has.
         { key: 'server', inner: `\n      watch: { ignored: [${WATCH_IGNORE_LITERAL}] },` },
     ];
+    if (usesDefineToken(config)) {
+        keys.splice(2, 0, {
+            key: 'define',
+            inner: `\n      __RETICLE_TOKEN__: JSON.stringify(reticleToken()),\n      __RETICLE_ROOT__: JSON.stringify(process.cwd()),`,
+        });
+    }
+    return keys;
 }
 /** Whole-key form, for a `vite:` block that does not have the key at all. */
 function wholeKeys(config) {
-    return {
+    const keys = {
         build: `\n    build: { target: 'es2022' },`,
-        optimizeDeps: `\n    optimizeDeps: { include: [${sdkInclude(config)}], esbuildOptions: { target: 'es2022' } },`,
-        define: `\n    define: {\n      __RETICLE_TOKEN__: JSON.stringify(reticleToken()),\n      __RETICLE_ROOT__: JSON.stringify(process.cwd()),\n    },`,
+        optimizeDeps: `\n    optimizeDeps: { include: [${sdkInclude(config)}]${writesEsbuildTarget(config) ? ESBUILD_TARGET_WHOLE : ''} },`,
         server: `\n    server: { watch: { ignored: [${WATCH_IGNORE_LITERAL}] } },`,
     };
+    if (usesDefineToken(config)) {
+        keys.define = `\n    define: {\n      __RETICLE_TOKEN__: JSON.stringify(reticleToken()),\n      __RETICLE_ROOT__: JSON.stringify(process.cwd()),\n    },`;
+    }
+    return keys;
 }
 /**
  * Add our keys to an existing `vite: { ... }` block, merging into any the app already set.
@@ -160,20 +195,39 @@ function withoutInclude(inner, config) {
  * that ran `init`.
  */
 function viteBlock(config) {
-    return `  vite: {
-    build: { target: 'es2022' },
-    optimizeDeps: { include: [${sdkInclude(config)}], esbuildOptions: { target: 'es2022' } },
-    define: {
+    const marker = usesDefineToken(config) ? '' : `    /* ${alreadyMarker(config)} */\n`;
+    const define = usesDefineToken(config)
+        ? `    define: {
       __RETICLE_TOKEN__: JSON.stringify(reticleToken()),
       __RETICLE_ROOT__: JSON.stringify(process.cwd()),
     },
-    server: { watch: { ignored: [${WATCH_IGNORE_LITERAL}] } },
+`
+        : '';
+    return `  vite: {
+${marker}    build: { target: 'es2022' },
+    optimizeDeps: { include: [${sdkInclude(config)}]${writesEsbuildTarget(config) ? ESBUILD_TARGET_WHOLE : ''} },
+${define}    server: { watch: { ignored: [${WATCH_IGNORE_LITERAL}] } },
   },
 `;
 }
+function withHelper(source, config) {
+    if (!usesDefineToken(config)) {
+        return source.endsWith('\n') ? source : `${source}\n`;
+    }
+    return `${HELPER_IMPORTS}${source.trimStart()}\n${HELPER}`.trimEnd() + '\n';
+}
+function withOwningMarker(source, config, braceAt) {
+    if (usesDefineToken(config) || source.includes(alreadyMarker(config)))
+        return source;
+    return insertAt(source, braceAt, `\n    /* ${alreadyMarker(config)} */`);
+}
 export function patchViteOwningConfig(source, config) {
-    if (source.includes(CONFIG_MARKER))
-        return { kind: PatchKind.ALREADY };
+    if (source.includes(alreadyMarker(config))) {
+        const cleaned = withoutStaleEsbuildTarget(source, config);
+        return null === cleaned
+            ? { kind: PatchKind.ALREADY }
+            : { kind: PatchKind.APPLY, code: cleaned };
+    }
     // A `vite: { ... }` block is an object literal, so our keys can go straight after the brace and
     // whatever is already in there is untouched. Refusing outright was the only genuine install defect
     // left in the gate: the config bailed while the LAYOUT patch applied anyway, leaving an app with a
@@ -186,7 +240,7 @@ export function patchViteOwningConfig(source, config) {
         if (merged !== null) {
             return {
                 kind: PatchKind.APPLY,
-                code: `${HELPER_IMPORTS}${merged.trimStart()}\n${HELPER}`.trimEnd() + '\n',
+                code: withHelper(withOwningMarker(merged, config, at), config),
             };
         }
         return {
@@ -214,6 +268,37 @@ export function patchViteOwningConfig(source, config) {
     const withBlock = `${source.slice(0, at)}\n${viteBlock(config)}${source.slice(at)}`;
     return {
         kind: PatchKind.APPLY,
-        code: `${HELPER_IMPORTS}${withBlock.trimStart()}\n${HELPER}`.trimEnd() + '\n',
+        code: withHelper(withBlock, config),
     };
 }
+const HOISTED_VITE = 'node_modules/vite/package.json';
+const PNPM_STORE = 'node_modules/.pnpm';
+/** A pnpm store entry for vite itself: `vite@8.0.16` or `vite@7.1.2_@types+node@24…`. */
+const PNPM_VITE_ENTRY = /^vite@(\d+)\./;
+export function installedViteMajor(io, pkg) {
+    const hoisted = io.readFile(HOISTED_VITE);
+    if (null !== hoisted) {
+        try {
+            const parsed = JSON.parse(hoisted);
+            const version = 'object' === typeof parsed && null !== parsed
+                ? parsed.version
+                : undefined;
+            const major = 'string' === typeof version ? parseMajor(version) : undefined;
+            if (major !== undefined)
+                return major;
+        }
+        catch {
+            // Unreadable manifest: fall through to the store and the declared range.
+        }
+    }
+    // ponytail: several copies can sit in the store and the newest is taken; resolving the framework's
+    // own `vite` through its dependency chain is the upgrade if a stale newer copy ever misleads this.
+    const stored = io
+        .listDirs(PNPM_STORE)
+        .map((name) => PNPM_VITE_ENTRY.exec(name)?.[1])
+        .filter((major) => major !== undefined)
+        .map(Number);
+    if (stored.length > 0)
+        return Math.max(...stored);
+    return parseMajor(pkg.dependencies?.['vite'] ?? pkg.devDependencies?.['vite']) ?? null;
+}

package/dist/plan/connect-steps.d.ts

@@ -27,15 +27,22 @@ export declare const StepTitle: {
     readonly NUXT_RESTART: "Restart the Nuxt dev server";
     readonly CONNECT_SNIPPET_REACT_ROUTER: "Connect snippet (React Router)";
     readonly CONNECT_SNIPPET_TANSTACK_START: "Connect snippet (TanStack Start)";
+    readonly TANSTACK_START_CONNECT_COMPONENT: "ReticleConnect component (TanStack Start)";
+    readonly CONNECT_SNIPPET_REMIX: "Connect snippet (Remix)";
+    readonly CONNECT_SNIPPET_ANGULAR: "Connect snippet (Angular)";
+    readonly ANGULAR_TOKEN_PROXY: "Angular dev-server token route";
+    readonly ANGULAR_SERVE_CONFIG: "Angular serve target (proxyConfig)";
+    readonly ANGULAR_SETUP_GATED: "Angular setup verified, drive unverified";
     readonly ELECTRON_VITE_PLUGIN: "Vite plugin (electron-vite renderer)";
     readonly ELECTRON_PRELOAD: "Electron preload (IPC shim)";
     readonly ELECTRON_CAPTURE: "Electron capture (screenshots)";
     readonly TANSTACK_START_UNVERIFIED: "TanStack Start is UNVERIFIED";
-    readonly SVELTEKIT_UNVERIFIED: "SvelteKit is UNVERIFIED";
+    readonly SVELTEKIT_SETUP_GATED: "SvelteKit setup verified, drive unverified";
     readonly CLIENT_HOOK: "Reticle client hook";
     readonly CONNECT_SNIPPET_ASTRO: "Connect snippet (Astro)";
-    readonly ASTRO_CONFIG: "Astro config (token + build target)";
-    readonly ASTRO_ENV_DTS: "Astro env types (Vite defines)";
+    readonly ASTRO_RETICLE_DEV: "Astro ReticleDev module";
+    readonly ASTRO_CONFIG: "Astro config (build target)";
+    readonly ASTRO_ENV_DTS: "Astro env types (window token)";
     readonly CSP: "Content-Security-Policy";
     readonly CONNECT_SNIPPET: "Connect snippet";
 };

package/dist/plan/connect-steps.js

@@ -28,15 +28,22 @@ export const StepTitle = {
     NUXT_RESTART: 'Restart the Nuxt dev server',
     CONNECT_SNIPPET_REACT_ROUTER: 'Connect snippet (React Router)',
     CONNECT_SNIPPET_TANSTACK_START: 'Connect snippet (TanStack Start)',
+    TANSTACK_START_CONNECT_COMPONENT: 'ReticleConnect component (TanStack Start)',
+    CONNECT_SNIPPET_REMIX: 'Connect snippet (Remix)',
+    CONNECT_SNIPPET_ANGULAR: 'Connect snippet (Angular)',
+    ANGULAR_TOKEN_PROXY: 'Angular dev-server token route',
+    ANGULAR_SERVE_CONFIG: 'Angular serve target (proxyConfig)',
+    ANGULAR_SETUP_GATED: 'Angular setup verified, drive unverified',
     ELECTRON_VITE_PLUGIN: 'Vite plugin (electron-vite renderer)',
     ELECTRON_PRELOAD: 'Electron preload (IPC shim)',
     ELECTRON_CAPTURE: 'Electron capture (screenshots)',
     TANSTACK_START_UNVERIFIED: 'TanStack Start is UNVERIFIED',
-    SVELTEKIT_UNVERIFIED: 'SvelteKit is UNVERIFIED',
+    SVELTEKIT_SETUP_GATED: 'SvelteKit setup verified, drive unverified',
     CLIENT_HOOK: 'Reticle client hook',
     CONNECT_SNIPPET_ASTRO: 'Connect snippet (Astro)',
-    ASTRO_CONFIG: 'Astro config (token + build target)',
-    ASTRO_ENV_DTS: 'Astro env types (Vite defines)',
+    ASTRO_RETICLE_DEV: 'Astro ReticleDev module',
+    ASTRO_CONFIG: 'Astro config (build target)',
+    ASTRO_ENV_DTS: 'Astro env types (window token)',
     CSP: CSP_STEP_TITLE,
     CONNECT_SNIPPET: 'Connect snippet',
 };
@@ -54,6 +61,7 @@ export const CONNECT_STEP_TITLES = new Set([
     StepTitle.CONNECT_SNIPPET,
     StepTitle.CONNECT_SNIPPET_CRA,
     StepTitle.CONNECT_SNIPPET_ASTRO,
+    StepTitle.ASTRO_RETICLE_DEV,
     StepTitle.CONNECT_SNIPPET_NUXT,
     // The config is the other half of the Nuxt connect, not a nicety: it is the only thing in a Nuxt
     // app that can inline the pairing token, and the bridge refuses a connect without one even on
@@ -61,6 +69,14 @@ export const CONNECT_STEP_TITLES = new Set([
     StepTitle.NUXT_CONFIG,
     StepTitle.CONNECT_SNIPPET_REACT_ROUTER,
     StepTitle.CONNECT_SNIPPET_TANSTACK_START,
+    // The component and the line that renders it are two steps, for the reason Next's are.
+    StepTitle.TANSTACK_START_CONNECT_COMPONENT,
+    StepTitle.CONNECT_SNIPPET_REMIX,
+    StepTitle.CONNECT_SNIPPET_ANGULAR,
+    // Both halves of how an Angular page gets its pairing token. Without the route the connect is
+    // refused on the token, and without the serve-target entry `ng serve` never mounts the route.
+    StepTitle.ANGULAR_TOKEN_PROXY,
+    StepTitle.ANGULAR_SERVE_CONFIG,
     StepTitle.CLIENT_HOOK,
     StepTitle.CONNECT_MODULE,
     StepTitle.RETICLE_DEV_COMPONENT,
@@ -85,6 +101,9 @@ export const CONNECT_STEP_TITLES = new Set([
     // electron-vite's connect IS the renderer plugin. Without it the SDK never injects, and the
     // preload/capture steps are not enough to produce a session.
     StepTitle.ELECTRON_VITE_PLUGIN,
+    // A policy that refuses the bridge WebSocket is a guaranteed non-connection on EVERY framework, so
+    // a ⚠ on it (a policy init could not edit) must fail init rather than read as advice.
+    StepTitle.CSP,
 ]);
 /** True when this step is what makes the app dial the daemon. */
 export function isConnectStep(title) {

package/dist/plan/framework-adapter.d.ts

@@ -18,17 +18,13 @@
  *
  * `framework-adapter.test.ts` asserts the seam between the two halves.
  */
-import { Framework } from '../detect/detect.js';
+import { Framework, UiLibrary } from '../detect/detect.js';
 import { StepTitle } from './connect-steps.js';
 import type { PlanInput, Step } from './plan-types.js';
 export declare const RETICLE_REACT_KIT = "@reticlehq/react";
 /** The framework-neutral sensor, for stacks the React adapter has nothing to attach to. */
 export declare const RETICLE_BROWSER_SDK = "@reticlehq/browser";
-export declare const RETICLE_VITE_PLUGIN = "@reticlehq/vite-plugin";
-export declare const RETICLE_NEXT_PLUGIN = "@reticlehq/next";
-/** The Electron main/preload helper — what makes IPC and screenshots exist at all. */
-export declare const RETICLE_ELECTRON = "@reticlehq/electron";
-export interface FrameworkAdapter {
+interface FrameworkAdapter {
     /**
      * The dev dependencies `init` installs, given the kit the UI-library check chose
      * (`@reticlehq/react` or the neutral sensor). A framework that knows its own renderer ignores the
@@ -57,6 +53,8 @@ export interface FrameworkAdapter {
      */
     readonly carriesOwnUnverifiedNote: boolean;
 }
+/** Whether the install gate scaffolds this stack — see INSTALL_GATE_STACKS. */
+export declare function installGated(framework: Framework, uiLibrary: UiLibrary): boolean;
 export declare const FRAMEWORK_ADAPTERS: Record<Framework, FrameworkAdapter>;
 /**
  * The per-framework half of the plan, looked up rather than switched.
@@ -67,3 +65,4 @@ export declare const FRAMEWORK_ADAPTERS: Record<Framework, FrameworkAdapter>;
  * for the packages, the connect-step titles and the unverified-note flag in the same edit.
  */
 export declare function frameworkSteps(input: PlanInput): Step[];
+export {};

package/dist/plan/framework-adapter.js

@@ -18,10 +18,40 @@
  *
  * `framework-adapter.test.ts` asserts the seam between the two halves.
  */
-import { Framework } from '../detect/detect.js';
+import { Framework, UiLibrary } from '../detect/detect.js';
 import { StepTitle } from './connect-steps.js';
-import { VITE_PLUGIN_DETAIL, astroSteps, craSteps, htmlSteps, nextSteps, nuxtSteps, reactRouterSteps, svelteKitSteps, tanstackStartSteps, viteSteps, } from './plan-framework.js';
-import { electronViteSteps } from './plan-electron-vite.js';
+import { astroSteps, craSteps, htmlSteps, nextSteps, nuxtSteps, reactRouterSteps, svelteKitSteps, tanstackStartSteps, } from './plan-framework.js';
+import { VITE_PLUGIN_DETAIL, viteSteps } from './plan-vite.js';
+import { electronForgeSteps, electronViteSteps } from './plan-electron-vite.js';
+import { angularSteps } from './plan-angular.js';
+import { REMIX_CLASSIC_MANUAL, remixEntryFile } from '../patch/remix.js';
+import { StepStatus } from './plan-types.js';
+/** Where the classic Remix compiler's ⚠ points: the file that says which compiler this is. */
+const REMIX_CLASSIC_TARGET = 'remix.config.js';
+/**
+ * Remix v2: React Router framework mode's steps, with Remix's own default entry and title.
+ *
+ * No Vite config is the classic compiler — `vitePlugin` is the only way Remix runs on Vite, and it
+ * lives in that file — and wiring the entry there would import a module nothing serves.
+ */
+function remixSteps(input) {
+    if (null === input.viteConfig) {
+        return [
+            {
+                title: StepTitle.CONNECT_SNIPPET_REMIX,
+                target: REMIX_CLASSIC_TARGET,
+                status: StepStatus.MANUAL,
+                detail: REMIX_CLASSIC_MANUAL,
+            },
+        ];
+    }
+    return [
+        ...reactRouterSteps(input, StepTitle.CONNECT_SNIPPET_REMIX, remixEntryFile),
+        // The plugin stamps file:line, and it is also what serves the `/@reticle-connect` module the
+        // entry imports.
+        ...viteSteps(input, VITE_PLUGIN_DETAIL.REACT_ROUTER),
+    ];
+}
 // An app dev installs exactly the audience-scoped browser-side dependencies — never the retired
 // `@reticlehq/core` umbrella (which dragged the Node MCP server + ws into every app). The kit is the
 // framework adapter (it re-exports the browser sensor), paired with that framework's dev-only build
@@ -29,10 +59,33 @@ import { electronViteSteps } from './plan-electron-vite.js';
 export const RETICLE_REACT_KIT = '@reticlehq/react';
 /** The framework-neutral sensor, for stacks the React adapter has nothing to attach to. */
 export const RETICLE_BROWSER_SDK = '@reticlehq/browser';
-export const RETICLE_VITE_PLUGIN = '@reticlehq/vite-plugin';
-export const RETICLE_NEXT_PLUGIN = '@reticlehq/next';
+const RETICLE_VITE_PLUGIN = '@reticlehq/vite-plugin';
+const RETICLE_NEXT_PLUGIN = '@reticlehq/next';
 /** The Electron main/preload helper — what makes IPC and screenshots exist at all. */
-export const RETICLE_ELECTRON = '@reticlehq/electron';
+const RETICLE_ELECTRON = '@reticlehq/electron';
+/**
+ * The stacks the install gate scaffolds from scratch on every change (`SCAFFOLDS` in
+ * `apps/e2e/install-gate.mjs`), as framework → the UI libraries its scaffolds render.
+ *
+ * The one place `init` says which setups are PROVEN. Nuxt was labelled "vue is UNVERIFIED" while the
+ * gate scaffolded it on every change, because nothing here knew the gate existed. Add a scaffold
+ * there, add its stack here. Only the setup is proven: no gate drives these apps to a verdict.
+ */
+const INSTALL_GATE_STACKS = {
+    [Framework.VITE]: [UiLibrary.REACT, UiLibrary.VUE, UiLibrary.UNKNOWN],
+    [Framework.NEXT]: [UiLibrary.REACT],
+    [Framework.NUXT]: [UiLibrary.VUE],
+    [Framework.REACT_ROUTER]: [UiLibrary.REACT],
+    [Framework.REMIX]: [UiLibrary.REACT],
+    [Framework.ASTRO]: [UiLibrary.UNKNOWN],
+    [Framework.SVELTEKIT]: [UiLibrary.SVELTE],
+    [Framework.CRA]: [UiLibrary.REACT],
+    [Framework.ANGULAR]: [UiLibrary.UNKNOWN],
+};
+/** Whether the install gate scaffolds this stack — see INSTALL_GATE_STACKS. */
+export function installGated(framework, uiLibrary) {
+    return INSTALL_GATE_STACKS[framework]?.includes(uiLibrary) ?? false;
+}
 export const FRAMEWORK_ADAPTERS = {
     [Framework.NEXT]: {
         // Next is React by construction, so the detection cannot disagree in a way worth honouring.
@@ -72,7 +125,9 @@ export const FRAMEWORK_ADAPTERS = {
         packages: (kit) => [kit, RETICLE_VITE_PLUGIN],
         // The Vite plugin too, for the reason SvelteKit gets it: React Router framework mode IS a Vite
         // app, and the plugin is what stamps data-reticle-source. Without it the app connects and every
-        // verdict comes back with no file:line.
+        // verdict comes back with no file:line. Injection stays ON, unlike SvelteKit and Start: the
+        // client entry imports `/@reticle-connect`, which the plugin serves only while inject is on, and
+        // that module is what loads the dev module here.
         steps: (input) => [
             ...reactRouterSteps(input),
             ...viteSteps(input, VITE_PLUGIN_DETAIL.REACT_ROUTER),
@@ -86,16 +141,22 @@ export const FRAMEWORK_ADAPTERS = {
         // The Vite plugin as well as the client hook. `init` already INSTALLS @reticlehq/vite-plugin for
         // SvelteKit and then never wired it into the config, so it sat in package.json doing nothing —
         // which is why a SvelteKit app connected fine and every verdict had no file:line.
-        steps: (input) => [...svelteKitSteps(input), ...viteSteps(input, VITE_PLUGIN_DETAIL.SVELTEKIT)],
+        // `inject: false` because the client hook connects; the plugin's injection never fires here, and
+        // left on it only warns ten seconds into every page load that the app will never connect.
+        steps: (input) => [
+            ...svelteKitSteps(input),
+            ...viteSteps(input, VITE_PLUGIN_DETAIL.SVELTEKIT, false),
+        ],
         connectStepTitles: [StepTitle.CLIENT_HOOK, StepTitle.VITE_PLUGIN],
         carriesOwnUnverifiedNote: true,
     },
     [Framework.ASTRO]: {
         // Astro owns its own Vite instance and renders its own HTML, so there is no config for the
-        // plugin to attach to — the kit alone, connected from a page <script> (see astroManual).
+        // plugin to attach to — the kit alone, connected from a local module the page imports
+        // (see astroManual).
         packages: (kit) => [kit],
         steps: astroSteps,
-        connectStepTitles: [StepTitle.CONNECT_SNIPPET_ASTRO],
+        connectStepTitles: [StepTitle.CONNECT_SNIPPET_ASTRO, StepTitle.ASTRO_RETICLE_DEV],
         carriesOwnUnverifiedNote: false,
     },
     [Framework.ELECTRON_VITE]: {
@@ -108,6 +169,35 @@ export const FRAMEWORK_ADAPTERS = {
         connectStepTitles: [StepTitle.ELECTRON_VITE_PLUGIN],
         carriesOwnUnverifiedNote: false,
     },
+    [Framework.ELECTRON_FORGE]: {
+        // electron-vite's three packages, with the kit the UI-library check chose: Forge's Vite template
+        // renders no React, and `@reticlehq/react` carries `react` in its peer dependencies.
+        packages: (kit) => [kit, RETICLE_VITE_PLUGIN, RETICLE_ELECTRON],
+        steps: electronForgeSteps,
+        // The renderer config's plugin IS the connect, as under electron-vite.
+        connectStepTitles: [StepTitle.VITE_PLUGIN],
+        carriesOwnUnverifiedNote: false,
+    },
+    [Framework.REMIX]: {
+        // React Router framework mode's packages, for the reason its steps are that mode's: the same
+        // framework under its previous name.
+        packages: (kit) => [kit, RETICLE_VITE_PLUGIN],
+        steps: remixSteps,
+        connectStepTitles: [StepTitle.CONNECT_SNIPPET_REMIX, StepTitle.VITE_PLUGIN],
+        carriesOwnUnverifiedNote: false,
+    },
+    [Framework.ANGULAR]: {
+        // The sensor alone. There is no build plugin for the Angular CLI to load, and the React kit is
+        // what used to be installed here, with `react` beside it.
+        packages: () => [RETICLE_BROWSER_SDK],
+        steps: angularSteps,
+        connectStepTitles: [
+            StepTitle.CONNECT_SNIPPET_ANGULAR,
+            StepTitle.ANGULAR_TOKEN_PROXY,
+            StepTitle.ANGULAR_SERVE_CONFIG,
+        ],
+        carriesOwnUnverifiedNote: true,
+    },
     [Framework.TANSTACK_START]: {
         // Start IS a Vite app, so the plugin still stamps `data-reticle-source` — only the connect
         // injection is inapplicable, and that is the plan's business (`inject: false`).
@@ -116,7 +206,11 @@ export const FRAMEWORK_ADAPTERS = {
             ...tanstackStartSteps(input),
             ...viteSteps(input, VITE_PLUGIN_DETAIL.TANSTACK_START, false),
         ],
-        connectStepTitles: [StepTitle.CONNECT_SNIPPET_TANSTACK_START, StepTitle.VITE_PLUGIN],
+        connectStepTitles: [
+            StepTitle.CONNECT_SNIPPET_TANSTACK_START,
+            StepTitle.TANSTACK_START_CONNECT_COMPONENT,
+            StepTitle.VITE_PLUGIN,
+        ],
         // The Start recipe carries its own UNVERIFIED line; a second generic notice would argue with it.
         carriesOwnUnverifiedNote: true,
     },

package/dist/plan/notices.js

@@ -11,7 +11,7 @@
 import { CONTAINERISED_TITLE, containerisedDevServerNote } from '../diagnose/containerised-dev-server.js';
 import { mcpWindowsNote } from '../register/mcp.js';
 import { unverifiedUiLibraryNote, WEBGL_CANVAS_LIMIT_NOTE } from '../patch/snippets.js';
-import { FRAMEWORK_ADAPTERS } from './framework-adapter.js';
+import { FRAMEWORK_ADAPTERS, installGated } from './framework-adapter.js';
 import { NodePlatform } from '../detect/platform.js';
 import { UiLibrary } from '../detect/detect.js';
 // `Step` and `PlanInput` are TYPES, so importing them back from `plan.ts` is erased at build
@@ -64,12 +64,13 @@ export function uiLibraryStep(input) {
         return [];
     if (lib === UiLibrary.UNKNOWN)
         return [];
+    const gated = installGated(input.detection.framework, lib);
     return [
         {
-            title: `${lib} is UNVERIFIED`,
+            title: gated ? `${lib} setup verified, drive unverified` : `${lib} is UNVERIFIED`,
             target: 'package.json',
             status: StepStatus.NOTICE,
-            detail: unverifiedUiLibraryNote(lib),
+            detail: unverifiedUiLibraryNote(lib, gated),
         },
     ];
 }

package/dist/plan/plan-angular.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Angular CLI: the dev-only connect in the browser entry, and the dev-server route that hands it
+ * the pairing token. See `patch/angular.ts` for why the token takes that route and no other.
+ */
+import { type PlanInput, type Step } from './plan-types.js';
+export declare function angularSteps(input: PlanInput): Step[];

package/dist/plan/plan-angular.js

@@ -0,0 +1,89 @@
+/**
+ * Angular CLI: the dev-only connect in the browser entry, and the dev-server route that hands it
+ * the pairing token. See `patch/angular.ts` for why the token takes that route and no other.
+ */
+import { ANGULAR_DEFAULT_ENTRY, ANGULAR_PROXY_PATH, ANGULAR_TOKEN_PATH, angularProxyFile, patchAngularJson, patchAngularMain, } from '../patch/angular.js';
+import { PatchKind } from '../patch/patch-kind.js';
+import { ANGULAR_WORKSPACE_FILE } from '../detect/detect.js';
+import { StepTitle } from './connect-steps.js';
+import { patchStep } from './plan-framework.js';
+import { alreadyOrMovedPort, retargetPort } from './port-steps.js';
+import { StepStatus } from './plan-types.js';
+const ANGULAR_SETUP_GATED_NOTE = 'The install gate scaffolds an Angular app (Angular 21, no SSR) on every release and requires a ' +
+    'session, and this wiring was proven by hand on Angular 22 with and without SSR; nothing yet ' +
+    'drives an Angular app to a verdict on each change. DOM, network, console and state ' +
+    'tools work here; component identity does not (that is the React adapter). If no session ' +
+    'appears, please open an issue.';
+const ENTRY_DETAIL = 'connect from the browser entry, dev-only (`ngDevMode`), through a dynamic import the ' +
+    'production build drops';
+const PROXY_DETAIL = 'the `ng serve`-only module that hands the page this machine’s pairing token, read from ' +
+    '~/.reticle at request time — never written into the project';
+const SERVE_DETAIL = `point the serve target's proxyConfig at ${ANGULAR_PROXY_PATH} (\`ng build\` never reads it)`;
+/** The full recipe, for when the entry is not a file `init` can see. */
+function entryManual(input, entryPath) {
+    const recipe = patchAngularMain('', input.options.port, input.options.projectId);
+    const code = recipe.kind === PatchKind.APPLY ? recipe.code : '';
+    return `Add this to your browser entry (${entryPath}):\n\n${code}`;
+}
+function proxyStep(input) {
+    const existing = input.angularProxySource ?? null;
+    if (null !== existing && existing.includes(ANGULAR_TOKEN_PATH)) {
+        return {
+            title: StepTitle.ANGULAR_TOKEN_PROXY,
+            target: ANGULAR_PROXY_PATH,
+            status: StepStatus.ALREADY,
+            detail: 'already there',
+        };
+    }
+    return {
+        title: StepTitle.ANGULAR_TOKEN_PROXY,
+        target: ANGULAR_PROXY_PATH,
+        status: StepStatus.APPLY,
+        detail: PROXY_DETAIL,
+        write: { path: ANGULAR_PROXY_PATH, content: angularProxyFile(), expect: [ANGULAR_TOKEN_PATH] },
+    };
+}
+function serveStep(input) {
+    const workspace = input.angularWorkspace ?? null;
+    const manual = `In ${ANGULAR_WORKSPACE_FILE}, set the serve target's "options.proxyConfig" to "${ANGULAR_PROXY_PATH}".`;
+    if (null === workspace) {
+        return {
+            title: StepTitle.ANGULAR_SERVE_CONFIG,
+            target: ANGULAR_WORKSPACE_FILE,
+            status: StepStatus.MANUAL,
+            detail: manual,
+        };
+    }
+    return patchStep(StepTitle.ANGULAR_SERVE_CONFIG, workspace.path, patchAngularJson(workspace.source), SERVE_DETAIL, manual);
+}
+function entryStep(input) {
+    const entry = input.angularEntry ?? null;
+    if (null === entry) {
+        return {
+            title: StepTitle.CONNECT_SNIPPET_ANGULAR,
+            target: ANGULAR_DEFAULT_ENTRY,
+            status: StepStatus.MANUAL,
+            detail: entryManual(input, ANGULAR_DEFAULT_ENTRY),
+        };
+    }
+    // "already wired" read the entry without reading the port baked into its connect, so a re-run
+    // with a new `--port` left the page dialling the old daemon.
+    const patch = patchAngularMain(entry.source, input.options.port, input.options.projectId);
+    // An entry the previous version wired is rewritten in place (its guard), so a re-run that ALSO
+    // moves the port has to move it in the rewritten code — the ALREADY path below never sees it.
+    const moved = PatchKind.APPLY === patch.kind ? retargetPort(patch.code, input.options.port) : null;
+    return alreadyOrMovedPort(patchStep(StepTitle.CONNECT_SNIPPET_ANGULAR, entry.path, null === moved ? patch : { kind: PatchKind.APPLY, code: moved.code }, ENTRY_DETAIL, entryManual(input, entry.path)), entry.source, input.options.port);
+}
+export function angularSteps(input) {
+    return [
+        {
+            title: StepTitle.ANGULAR_SETUP_GATED,
+            target: ANGULAR_WORKSPACE_FILE,
+            status: StepStatus.NOTICE,
+            detail: ANGULAR_SETUP_GATED_NOTE,
+        },
+        entryStep(input),
+        proxyStep(input),
+        serveStep(input),
+    ];
+}

package/dist/plan/plan-electron-vite.d.ts

@@ -1,8 +1,10 @@
 /**
- * The plan's electron-vite half: the renderer plugin, capabilities, and the two Electron steps.
+ * The plan's Electron half: the renderer plugin, capabilities, and the two Electron steps — for
+ * electron-vite and for Electron Forge's Vite template, which differ only in where the renderer's
+ * Vite config lives.
  *
- * Its own module because this is the only framework whose wiring reaches outside the renderer, into
- * a preload and a main process the web frameworks have no equivalent of.
+ * Its own module because these are the only frameworks whose wiring reaches outside the renderer,
+ * into a preload and a main process the web frameworks have no equivalent of.
  */
 import { type PlanInput, type Step } from './plan-types.js';
 /**
@@ -13,3 +15,4 @@ import { type PlanInput, type Step } from './plan-types.js';
  * manual recipe the way Astro's config+layout pair does.
  */
 export declare function electronViteSteps(input: PlanInput): Step[];
+export declare function electronForgeSteps(input: PlanInput): Step[];