rivet-design 0.28.1 → 0.28.2

package/dist/cli/commands/open.js

@@ -70,6 +70,7 @@ const SERVER_START_TIMEOUT_ENV = 'RIVET_SERVER_START_TIMEOUT_MS';
 const LOCK_WAIT_TIMEOUT_ENV = 'RIVET_LOCK_WAIT_TIMEOUT_MS';
 const OPEN_RETRY_DELAY_MS = 1_000;
 const APP_HEALTH_TIMEOUT_MS = 10_000;
+const APP_HEALTH_TIMEOUT_ENV = 'RIVET_APP_HEALTH_TIMEOUT_MS';
 const RETRY_OPEN_RECOVERY = {
     isRecoverable: true,
     nextAction: { action: 'retry', delayMs: OPEN_RETRY_DELAY_MS },
@@ -247,6 +248,7 @@ const ensureProjectRuntime = async (context, io, dependencies = {}) => {
     const env = dependencies.env ?? process.env;
     const serverStartTimeoutMs = timeoutFromEnv(env, SERVER_START_TIMEOUT_ENV, DEFAULT_SERVER_START_TIMEOUT_MS);
     const lockWaitTimeoutMs = timeoutFromEnv(env, LOCK_WAIT_TIMEOUT_ENV, DEFAULT_LOCK_WAIT_TIMEOUT_MS);
+    const appHealthTimeoutMs = timeoutFromEnv(env, APP_HEALTH_TIMEOUT_ENV, Math.min(serverStartTimeoutMs, APP_HEALTH_TIMEOUT_MS));
     const validation = await (0, exports.validateProjectOpen)({
         context,
         io,
@@ -292,7 +294,7 @@ const ensureProjectRuntime = async (context, io, dependencies = {}) => {
                 }, RETRY_OPEN_RECOVERY);
             }
             if (replacement.outcome === 'attach') {
-                const readinessError = await verifyRuntimeReadiness(existing, Math.min(serverStartTimeoutMs, APP_HEALTH_TIMEOUT_MS));
+                const readinessError = await verifyRuntimeReadiness(existing, appHealthTimeoutMs);
                 if (!readinessError) {
                     return finishProjectOpen(await openedData(existing, true), io);
                 }
@@ -346,7 +348,7 @@ const ensureProjectRuntime = async (context, io, dependencies = {}) => {
                 ...(0, serverVersion_1.versionEnvelopeFields)(attached.handshake),
             });
         }
-        const readinessError = await verifyRuntimeReadiness(attached, Math.min(serverStartTimeoutMs, APP_HEALTH_TIMEOUT_MS));
+        const readinessError = await verifyRuntimeReadiness(attached, appHealthTimeoutMs);
         if (readinessError)
             return readinessError;
         const data = await openedData(attached, false);

package/dist/cli/commands/serve.js

@@ -200,6 +200,7 @@ const handleServe = async (args, io) => {
                     previewPort,
                     agentApplyMode: 'external',
                     rivetPort,
+                    resolveProjectName: (targetPath) => library.registry.findByPath(targetPath)?.name,
                     resolveLibraryOrigin: () => {
                         const hub = hubDiscovery.read();
                         return hub?.port && (0, pid_1.isPidAlive)(hub.pid)

package/dist/jest.globalSetup.d.ts

@@ -0,0 +1,3 @@
+declare const ensureRivetPageShells: () => void;
+export default ensureRivetPageShells;
+//# sourceMappingURL=jest.globalSetup.d.ts.map

package/dist/jest.globalSetup.js

@@ -0,0 +1,19 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const fs_1 = __importDefault(require("fs"));
+const path_1 = __importDefault(require("path"));
+const rivetPage_1 = require("./utils/rivetPage");
+const ensureRivetPageShells = () => {
+    fs_1.default.mkdirSync(rivetPage_1.RIVET_PAGE_SHELL_DIRECTORY, { recursive: true });
+    for (const shellFile of rivetPage_1.RIVET_PAGE_SHELL_FILES) {
+        const builtShell = path_1.default.join(rivetPage_1.RIVET_PAGE_SHELL_DIRECTORY, shellFile);
+        if (!fs_1.default.existsSync(builtShell)) {
+            fs_1.default.copyFileSync(path_1.default.join(__dirname, 'ui', shellFile), builtShell);
+        }
+    }
+};
+exports.default = ensureRivetPageShells;
+//# sourceMappingURL=jest.globalSetup.js.map

package/dist/proxy-middleware/proxy-config.d.ts

@@ -14,7 +14,6 @@ export declare const resolveTargetAddressedPreview: (args: {
     resolveVariantPreviewPort?: ResolveVariantPreviewPort;
 }) => TargetAddressedPreview | null;
 export declare const markPreviewBridgeDocumentUncacheable: (proxyRes: IncomingMessage) => void;
-export declare const buildPreviewHoldingPage: () => string;
 export declare const createUserDevServerProxy: (userPort: number, userHost?: string, options?: {
     isPreviewBridgeEnabled?: boolean;
     expectedPreviewParentOrigin?: string;

package/dist/proxy-middleware/proxy-config.js

@@ -1,9 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.createUserDevServerProxy = exports.buildPreviewHoldingPage = exports.markPreviewBridgeDocumentUncacheable = exports.resolveTargetAddressedPreview = void 0;
+exports.createUserDevServerProxy = exports.markPreviewBridgeDocumentUncacheable = exports.resolveTargetAddressedPreview = void 0;
 const http_proxy_middleware_1 = require("http-proxy-middleware");
 const crypto_1 = require("crypto");
 const logger_1 = require("../utils/logger");
+const rivetPage_1 = require("../utils/rivetPage");
 const htmlDocument_1 = require("../utils/htmlDocument");
 const preview_connections_1 = require("./preview-connections");
 const preview_bridge_1 = require("./preview-bridge");
@@ -74,36 +75,6 @@ const markPreviewBridgeDocumentUncacheable = (proxyRes) => {
     proxyRes.headers['cache-control'] = 'no-cache, no-store';
 };
 exports.markPreviewBridgeDocumentUncacheable = markPreviewBridgeDocumentUncacheable;
-const buildPreviewHoldingPage = () => `<!doctype html>
-<html lang="en">
-<head>
-<meta charset="utf-8" />
-<meta name="viewport" content="width=device-width, initial-scale=1" />
-<title>Preview — waiting for dev server</title>
-<style>
-  html, body { height: 100%; margin: 0; }
-  body {
-    display: flex; align-items: center; justify-content: center;
-    background: #0f0f10; color: #a1a1aa;
-    font: 14px/1.5 ui-sans-serif, system-ui, -apple-system, sans-serif;
-  }
-  .wrap { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 24px; text-align: center; }
-  .spinner {
-    width: 22px; height: 22px; border: 2px solid #2a2a2e; border-top-color: #a1a1aa;
-    border-radius: 50%; animation: rivet-preview-spin 0.8s linear infinite;
-  }
-  @keyframes rivet-preview-spin { to { transform: rotate(360deg); } }
-  @media (prefers-reduced-motion: reduce) { .spinner { animation: none; } }
-</style>
-</head>
-<body>
-  <div class="wrap">
-    <div class="spinner" aria-hidden="true"></div>
-    <div>Waiting for the preview dev server…</div>
-  </div>
-</body>
-</html>`;
-exports.buildPreviewHoldingPage = buildPreviewHoldingPage;
 const createUserDevServerProxy = (userPort, userHost = 'localhost', options = {}) => {
     let variantTarget = null;
     const requestTargets = new WeakMap();
@@ -311,9 +282,10 @@ const createUserDevServerProxy = (userPort, userHost = 'localhost', options = {}
             if ('writeHead' in res && !res.headersSent) {
                 if (isPreviewBridgeEnabled && (0, preview_bridge_1.isHtmlDocumentRequest)(req)) {
                     log.debug(`Serving preview holding page — no upstream yet (userPort=${userPort}).`);
-                    const body = (0, preview_bridge_1.injectPreviewBridge)((0, exports.buildPreviewHoldingPage)(), {
-                        expectedParentOrigin: options.expectedPreviewParentOrigin,
-                    });
+                    const body = (0, preview_bridge_1.injectPreviewBridge)((0, rivetPage_1.renderRivetPage)({
+                        page: { kind: 'preview-waiting' },
+                        head: { title: 'Preview — waiting for dev server' },
+                    }), { expectedParentOrigin: options.expectedPreviewParentOrigin });
                     res.writeHead(200, {
                         'Content-Type': 'text/html; charset=utf-8',
                         'Cache-Control': 'no-cache, no-store',

package/dist/routes/agentVariants.js

@@ -23,6 +23,7 @@ const express_1 = require("express");
 const v3_1 = require("zod/v3");
 const api_responses_1 = require("../types/api-responses");
 const logger_1 = require("../utils/logger");
+const rivetPage_1 = require("../utils/rivetPage");
 const agent_variants_1 = require("../agent-variants");
 const changeBatchClassification_1 = require("../mcp/changeBatchClassification");
 const createAgentVariantsOrchestrator_1 = require("../services/createAgentVariantsOrchestrator");
@@ -167,22 +168,6 @@ const HISTORY_STATUSES = new Set([
 ]);
 const VARIANT_SHARE_TITLE_FALLBACK = 'Prototype';
 const CANVAS_SHARE_TITLE_FALLBACK = 'Prototype canvas';
-const escapeHtml = (value) => value.replace(/[&<>"']/g, (char) => {
-    switch (char) {
-        case '&':
-            return '&amp;';
-        case '<':
-            return '&lt;';
-        case '>':
-            return '&gt;';
-        case '"':
-            return '&quot;';
-        case "'":
-            return '&#39;';
-        default:
-            return char;
-    }
-});
 const getVariantShareTitle = (manifest) => {
     const title = [manifest.label, manifest.brief, manifest.sessionPrompt].find((candidate) => candidate.trim().length > 0);
     return (0, PrototypeDeployService_1.normalizePrototypeShareTitle)(title) ?? VARIANT_SHARE_TITLE_FALLBACK;
@@ -190,165 +175,27 @@ const getVariantShareTitle = (manifest) => {
 const getCanvasShareTitle = (sessionPrompt) => {
     return ((0, PrototypeDeployService_1.normalizePrototypeShareTitle)(sessionPrompt) ?? CANVAS_SHARE_TITLE_FALLBACK);
 };
-const CANVAS_IFRAME_SANDBOX = 'allow-scripts allow-forms allow-popups';
 const RIVET_SOCIAL_IMAGE_URL = 'https://rivet.design/images/rivet-social.png';
 const RIVET_DEFAULT_SHARE_DESCRIPTION = 'Built with Rivet — the visual editor for design';
 const UNSUPPORTED_PROTOTYPE_DEPLOY_MESSAGE = "This prototype can't be deployed — only buildable app directions or static previews are supported.";
-const buildCanvasShareHtml = (args) => {
-    const prompt = args.sessionPrompt.trim();
-    const variantCards = args.variants
-        .map((variant, index) => {
-        const label = variant.label.trim() || `Direction ${index + 1}`;
-        const brief = variant.brief.trim();
-        return `<article class="variant-card">
-  <header>
-    <div>
-      <p class="eyebrow">Direction ${index + 1}</p>
-      <h2>${escapeHtml(label)}</h2>
-    </div>
-    <a href="${escapeHtml(variant.shareUrl)}" target="_blank" rel="noreferrer">Open</a>
-  </header>
-  ${brief ? `<p class="brief">${escapeHtml(brief)}</p>` : ''}
-  <iframe title="${escapeHtml(label)}" src="${escapeHtml(variant.shareUrl)}" loading="lazy" sandbox="${CANVAS_IFRAME_SANDBOX}"></iframe>
-</article>`;
-    })
-        .join('\n');
-    const canvasTitle = `Rivet Canvas — ${args.variants.length} directions`;
-    const escapedTitle = escapeHtml(canvasTitle);
-    const escapedDesc = escapeHtml(RIVET_DEFAULT_SHARE_DESCRIPTION);
-    return `<!doctype html>
-<html lang="en">
-<head>
-  <meta charset="utf-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <title>${escapedTitle}</title>
-  <meta name="description" content="${escapedDesc}" />
-  <meta property="og:type" content="website" />
-  <meta property="og:title" content="${escapedTitle}" />
-  <meta property="og:description" content="${escapedDesc}" />
-  <meta property="og:image" content="${RIVET_SOCIAL_IMAGE_URL}" />
-  <meta name="twitter:card" content="summary_large_image" />
-  <meta name="twitter:title" content="${escapedTitle}" />
-  <meta name="twitter:description" content="${escapedDesc}" />
-  <meta name="twitter:image" content="${RIVET_SOCIAL_IMAGE_URL}" />
-  <style>
-    :root {
-      color-scheme: light;
-      --bg: #f6f4ef;
-      --card: #ffffff;
-      --ink: #161615;
-      --muted: #6f6a60;
-      --border: #ded8cc;
-      --accent: #ff5a1f;
-    }
-    * { box-sizing: border-box; }
-    body {
-      margin: 0;
-      background: var(--bg);
-      color: var(--ink);
-      font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
-    }
-    main {
-      width: min(1440px, calc(100vw - 32px));
-      margin: 0 auto;
-      padding: 32px 0 48px;
-    }
-    .hero {
-      display: flex;
-      align-items: flex-end;
-      justify-content: space-between;
-      gap: 24px;
-      margin-bottom: 24px;
-    }
-    h1 {
-      margin: 0;
-      font-size: clamp(32px, 5vw, 64px);
-      letter-spacing: -0.06em;
-      line-height: 0.95;
-    }
-    .prompt {
-      max-width: 720px;
-      color: var(--muted);
-      font-size: 15px;
-      line-height: 1.5;
-    }
-    .grid {
-      display: grid;
-      grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));
-      gap: 18px;
-    }
-    .variant-card {
-      overflow: hidden;
-      border: 1px solid var(--border);
-      border-radius: 18px;
-      background: var(--card);
-      box-shadow: 0 20px 60px rgba(22, 22, 21, 0.08);
-    }
-    .variant-card header {
-      display: flex;
-      align-items: flex-start;
-      justify-content: space-between;
-      gap: 16px;
-      padding: 18px 18px 0;
-    }
-    .eyebrow {
-      margin: 0 0 6px;
-      color: var(--accent);
-      font-size: 11px;
-      font-weight: 700;
-      letter-spacing: 0.12em;
-      text-transform: uppercase;
-    }
-    h2 {
-      margin: 0;
-      font-size: 20px;
-      letter-spacing: -0.03em;
-    }
-    a {
-      color: var(--ink);
-      font-size: 13px;
-      font-weight: 700;
-      text-decoration: none;
-      border-bottom: 1px solid currentColor;
-    }
-    .brief {
-      margin: 10px 18px 16px;
-      color: var(--muted);
-      font-size: 13px;
-      line-height: 1.45;
-    }
-    iframe {
-      display: block;
-      width: 100%;
-      height: 720px;
-      border: 0;
-      border-top: 1px solid var(--border);
-      background: white;
-    }
-    @media (max-width: 640px) {
-      main { width: min(100vw - 20px, 1440px); padding-top: 20px; }
-      .hero { display: block; }
-      .grid { grid-template-columns: 1fr; }
-      iframe { height: 560px; }
-    }
-  </style>
-</head>
-<body>
-  <main>
-    <section class="hero">
-      <div>
-        <p class="eyebrow">Rivet Canvas</p>
-        <h1>${args.variants.length} directions</h1>
-      </div>
-      ${prompt ? `<p class="prompt">${escapeHtml(prompt)}</p>` : ''}
-    </section>
-    <section class="grid">
-${variantCards}
-    </section>
-  </main>
-</body>
-</html>`;
-};
+const buildCanvasSharePage = (args) => (0, rivetPage_1.renderRivetPage)({
+    page: {
+        kind: 'canvas-share',
+        prompt: args.sessionPrompt.trim(),
+        directions: args.variants.map((variant, index) => ({
+            label: variant.label.trim() || `Direction ${index + 1}`,
+            brief: variant.brief.trim(),
+            shareUrl: variant.shareUrl,
+        })),
+    },
+    head: {
+        title: `Rivet Canvas — ${args.variants.length} directions`,
+        shareCard: {
+            description: RIVET_DEFAULT_SHARE_DESCRIPTION,
+            imageUrl: RIVET_SOCIAL_IMAGE_URL,
+        },
+    },
+});
 const generatedProjectWorkspaceRoot = (projectPath) => {
     const normalized = path_1.default.normalize(projectPath);
     const segments = normalized.split(path_1.default.sep);
@@ -1811,7 +1658,7 @@ const createAgentVariantsRouter = (orchestrator, bridge, telemetry, variantHisto
                 }
                 deployedVariants.push(deployed.variant);
             }
-            const html = buildCanvasShareHtml({
+            const html = buildCanvasSharePage({
                 sessionPrompt,
                 variants: deployedVariants,
             });

package/dist/routes/static.js

@@ -42,7 +42,7 @@ const path_1 = __importDefault(require("path"));
 const fs_1 = __importDefault(require("fs"));
 const logger_1 = require("../utils/logger");
 const preview_bridge_1 = require("../proxy-middleware/preview-bridge");
-const emptyStatePage_1 = require("./emptyStatePage");
+const rivetPage_1 = require("../utils/rivetPage");
 const log = (0, logger_1.createLogger)('StaticRoutes');
 const createStaticRoutes = (staticService, _projectPath, options = {}) => {
     const router = (0, express_1.Router)();
@@ -62,7 +62,13 @@ const createStaticRoutes = (staticService, _projectPath, options = {}) => {
         res.sendFile(entryFileName, { root: basePath });
     };
     const sendEmptyState = (res) => {
-        res.status(200).type('html').send((0, emptyStatePage_1.renderEmptyState)());
+        res
+            .status(200)
+            .type('html')
+            .send((0, rivetPage_1.renderRivetPage)({
+            page: { kind: 'empty-project' },
+            head: { title: 'Empty project' },
+        }));
     };
     router.get('/static', (_req, res) => {
         const entryPath = path_1.default.join(basePath, entryFileName);

package/dist/server.d.ts

@@ -7,7 +7,6 @@ import type { VariantRunService } from './services/VariantRunService';
 import type { VariantsRuntime } from './services/VariantsRuntime';
 export declare const INACTIVE_VARIANTS_EVENT_HEARTBEAT_MS = 30000;
 export declare const RIVET_CORS_ALLOWED_HEADERS: string[];
-export declare const DIST_UI_PATH: string;
 type RivetUiBootstrap = {
     agentApplyMode: 'embedded' | 'external' | null;
     queueAccessToken: string | null;
@@ -58,6 +57,7 @@ export type ServerOptions = Omit<CLIOptions, 'help' | 'version' | 'debug'> & {
     userHost?: string;
     beforeShutdown?: () => Promise<void>;
     resolveLibraryOrigin?: () => string | undefined;
+    resolveProjectName?: (projectPath: string) => string | undefined;
     createLibraryViewUrl?: (view: 'projects' | 'references') => Promise<string | null>;
 };
 export type ServerHandle = {

package/dist/server.js

@@ -36,7 +36,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.startServer = exports.runServerShutdownTasks = exports.isRivetCorsOriginAllowed = exports.isRivetUiStaticAssetPath = exports.isEmbeddedAgentUiHost = exports.resolveEmbeddedAgentUiOrigin = exports.resolveRivetListenHost = exports.sendInactiveVariantsEventStream = exports.readRivetUiIndexHtml = exports.injectRivetUiBootstrap = exports.DIST_UI_PATH = exports.RIVET_CORS_ALLOWED_HEADERS = exports.INACTIVE_VARIANTS_EVENT_HEARTBEAT_MS = void 0;
+exports.startServer = exports.runServerShutdownTasks = exports.isRivetCorsOriginAllowed = exports.isRivetUiStaticAssetPath = exports.isEmbeddedAgentUiHost = exports.resolveEmbeddedAgentUiOrigin = exports.resolveRivetListenHost = exports.sendInactiveVariantsEventStream = exports.readRivetUiIndexHtml = exports.injectRivetUiBootstrap = exports.RIVET_CORS_ALLOWED_HEADERS = exports.INACTIVE_VARIANTS_EVENT_HEARTBEAT_MS = void 0;
 const editorSession_1 = require("./cli/editorSession");
 const editorAccess_1 = require("./routes/editorAccess");
 const editorAccess_2 = require("./utils/editorAccess");
@@ -77,6 +77,8 @@ const VariantHistoryService_1 = require("./services/VariantHistoryService");
 const RequestAuthContext_1 = require("./services/RequestAuthContext");
 const middleware_1 = require("./routes/library/middleware");
 const errorMessage_1 = require("./utils/errorMessage");
+const scriptJson_1 = require("./utils/scriptJson");
+const uiDistPath_1 = require("./utils/uiDistPath");
 const pluginContext_1 = require("./hosts/pluginContext");
 const log = (0, index_core_1.createLogger)('RivetServer');
 const QUEUE_ACCESS_TOKEN_BYTES = 32;
@@ -93,36 +95,21 @@ exports.RIVET_CORS_ALLOWED_HEADERS = [
     'x-rivet-queue-token',
     editorAccess_2.EDITOR_ACCESS_TOKEN_HEADER,
 ];
-const resolveUiPath = () => {
-    const bundledPath = path_1.default.join(__dirname, 'ui/dist');
-    const devPath = path_1.default.join(__dirname, '../src/ui/dist');
-    if (fs_1.default.existsSync(bundledPath)) {
-        log.debug(`Using bundled UI path: ${bundledPath}`);
-        return bundledPath;
-    }
-    log.debug(`Using development UI path: ${devPath}`);
-    return devPath;
-};
-exports.DIST_UI_PATH = resolveUiPath();
 const NO_USER_DEV_SERVER_PORT = 0;
 const setNoStoreHeaders = (res) => {
     res.setHeader('Cache-Control', 'no-store, no-cache, must-revalidate, proxy-revalidate');
     res.setHeader('Pragma', 'no-cache');
     res.setHeader('Expires', '0');
 };
-const escapeScriptJson = (value) => JSON.stringify(value)
-    .replace(/</g, '\\u003c')
-    .replace(/\u2028/g, '\\u2028')
-    .replace(/\u2029/g, '\\u2029');
 const injectRivetUiBootstrap = (html, bootstrap) => {
-    const script = `<script id="${RIVET_BOOTSTRAP_SCRIPT_ID}">window.__RIVET_BOOTSTRAP__=${escapeScriptJson(bootstrap)};</script>`;
+    const script = `<script id="${RIVET_BOOTSTRAP_SCRIPT_ID}">window.__RIVET_BOOTSTRAP__=${(0, scriptJson_1.escapeScriptJson)(bootstrap)};</script>`;
     if (html.includes('</head>')) {
         return html.replace('</head>', `${script}</head>`);
     }
     return `${script}${html}`;
 };
 exports.injectRivetUiBootstrap = injectRivetUiBootstrap;
-const readRivetUiIndexHtml = () => fs_1.default.readFileSync(path_1.default.join(exports.DIST_UI_PATH, RIVET_UI_INDEX_FILENAME), 'utf8');
+const readRivetUiIndexHtml = () => fs_1.default.readFileSync(path_1.default.join(uiDistPath_1.DIST_UI_PATH, RIVET_UI_INDEX_FILENAME), 'utf8');
 exports.readRivetUiIndexHtml = readRivetUiIndexHtml;
 const sendInactiveVariantsEventStream = (req, res) => {
     res.set({
@@ -366,15 +353,15 @@ const startServer = async (options) => {
         const serve = express_1.default.static(directory, uiStaticOptions);
         return (req, res, next) => isPreviewRequest(req) ? next() : serve(req, res, next);
     };
-    app.use('/assets', serveEditorAssets(path_1.default.join(exports.DIST_UI_PATH, 'assets')));
-    app.use('/rivet/assets', serveEditorAssets(path_1.default.join(exports.DIST_UI_PATH, 'assets')));
-    app.use('/fonts', serveEditorAssets(path_1.default.join(exports.DIST_UI_PATH, 'fonts')));
-    app.use('/rivet/fonts', serveEditorAssets(path_1.default.join(exports.DIST_UI_PATH, 'fonts')));
+    app.use('/assets', serveEditorAssets(path_1.default.join(uiDistPath_1.DIST_UI_PATH, 'assets')));
+    app.use('/rivet/assets', serveEditorAssets(path_1.default.join(uiDistPath_1.DIST_UI_PATH, 'assets')));
+    app.use('/fonts', serveEditorAssets(path_1.default.join(uiDistPath_1.DIST_UI_PATH, 'fonts')));
+    app.use('/rivet/fonts', serveEditorAssets(path_1.default.join(uiDistPath_1.DIST_UI_PATH, 'fonts')));
     app.get('/favicon.ico', (_req, res) => {
-        res.sendFile('favicon.ico', { root: exports.DIST_UI_PATH });
+        res.sendFile('favicon.ico', { root: uiDistPath_1.DIST_UI_PATH });
     });
     app.get('/rivet/favicon.ico', (_req, res) => {
-        res.sendFile('favicon.ico', { root: exports.DIST_UI_PATH });
+        res.sendFile('favicon.ico', { root: uiDistPath_1.DIST_UI_PATH });
     });
     app.get(/^\/rivet\/library(?:\/.*)?$/, (req, res) => {
         const resolvedLibraryOrigin = options.resolveLibraryOrigin?.();
@@ -391,7 +378,7 @@ const startServer = async (options) => {
         }
         sendRivetUiIndex(req, res);
     });
-    log.info(`Serving UI assets from: ${exports.DIST_UI_PATH}`);
+    log.info(`Serving UI assets from: ${uiDistPath_1.DIST_UI_PATH}`);
     if (framework === 'static' && !hasUserDevServer) {
         app.get('/', (req, res, next) => {
             if (isPreviewRequest(req)) {
@@ -511,6 +498,7 @@ const startServer = async (options) => {
                 ? (agentApplyMode ?? 'external')
                 : null,
             projectPath: livePath,
+            projectName: options.resolveProjectName?.(livePath) ?? path_1.default.basename(livePath),
             projectId: options.projectId ?? null,
             libraryOrigin: options.resolveLibraryOrigin?.() ?? null,
         });

package/dist/services/AuthService.js

@@ -36,6 +36,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.AuthService = exports.validateAccessToken = void 0;
 const zod_1 = require("zod");
 const logger_1 = require("../utils/logger");
+const rivetPage_1 = require("../utils/rivetPage");
+const rivet_page_types_1 = require("../types/rivet-page-types");
 const ConfigManager_1 = require("./ConfigManager");
 const http_1 = require("http");
 const accessTokenRefresh_1 = require("./accessTokenRefresh");
@@ -46,7 +48,6 @@ const proxy_1 = require("../config/proxy");
 const log = (0, logger_1.createLogger)('AuthService');
 const LOOPBACK_HOST = '127.0.0.1';
 const LOOPBACK_PORT = 0;
-const CALLBACK_COMPLETE_PATH = '/complete';
 const OAUTH_CALLBACK_TIMEOUT_MS = 120_000;
 const MAX_CALLBACK_BODY_BYTES = 64 * 1024;
 const PROFILE_FETCH_TIMEOUT_MS = 10_000;
@@ -101,64 +102,6 @@ const readRequestBody = (request) => {
         request.on('error', reject);
     });
 };
-const getLoopbackCallbackHtml = () => {
-    return `<!doctype html>
-<html>
-  <head>
-    <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <title>Rivet authentication</title>
-    <style>
-      body {
-        margin: 0;
-        min-height: 100vh;
-        display: grid;
-        place-items: center;
-        font-family: system-ui, sans-serif;
-        background: #0b0b0f;
-        color: #fff;
-      }
-      main {
-        max-width: 420px;
-        padding: 32px;
-        text-align: center;
-      }
-    </style>
-  </head>
-  <body>
-    <main>
-      <h1>Finishing Rivet sign in...</h1>
-      <p>You can return to your editor after this page completes.</p>
-    </main>
-    <script>
-      const params = new URLSearchParams(window.location.search);
-      const hash = new URLSearchParams(window.location.hash.slice(1));
-      if (window.location.hash) {
-        window.history.replaceState(
-          null,
-          document.title,
-          window.location.pathname + window.location.search
-        );
-      }
-      fetch('/complete', {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({
-          sessionId: params.get('session'),
-          accessToken: hash.get('access_token'),
-          refreshToken: hash.get('refresh_token')
-        })
-      }).then((response) => {
-        document.querySelector('h1').textContent = response.ok
-          ? 'Rivet sign in complete'
-          : 'Rivet sign in failed';
-      }).catch(() => {
-        document.querySelector('h1').textContent = 'Rivet sign in failed';
-      });
-    </script>
-  </body>
-</html>`;
-};
 const validateAccessToken = async (proxyUrl, accessToken) => {
     const response = await fetch(`${proxyUrl.replace(/\/$/, '')}/api/user/profile`, {
         method: 'GET',
@@ -204,11 +147,14 @@ const createLoopbackOAuthCallback = async () => {
     const server = (0, http_1.createServer)((request, response) => {
         const url = new URL(request.url ?? '/', `http://${LOOPBACK_HOST}`);
         if (request.method === 'GET') {
-            sendTextResponse(response, 200, getLoopbackCallbackHtml());
+            sendTextResponse(response, 200, (0, rivetPage_1.renderRivetPage)({
+                page: { kind: 'sign-in-callback' },
+                head: { title: 'Rivet authentication' },
+            }));
             return;
         }
         if (request.method !== 'POST' ||
-            url.pathname !== CALLBACK_COMPLETE_PATH) {
+            url.pathname !== rivet_page_types_1.SIGN_IN_CALLBACK_COMPLETE_PATH) {
             sendTextResponse(response, 404, 'Not found');
             return;
         }

package/dist/services/templates/viteReactTs.js

@@ -200,7 +200,7 @@ textarea {
 
 .eyebrow {
   margin: 0 0 16px;
-  color: #ff3300;
+  color: #e54b2c;
   font-size: 13px;
   font-weight: 700;
   letter-spacing: 0;

package/dist/types/rivet-page-types.d.ts

@@ -0,0 +1,48 @@
+export declare const RIVET_PAGE_DATA_ELEMENT_ID = "rivet-page";
+export declare const SIGN_IN_CALLBACK_COMPLETE_PATH = "/complete";
+export type CanvasShareDirection = {
+    label: string;
+    brief: string;
+    shareUrl: string;
+};
+export type SharedShellRivetPage = {
+    kind: 'preview-waiting';
+} | {
+    kind: 'sign-in-callback';
+} | {
+    kind: 'canvas-share';
+    prompt: string;
+    directions: CanvasShareDirection[];
+};
+export type RivetPage = {
+    kind: 'empty-project';
+} | SharedShellRivetPage;
+export type ConnectResultMessage = {
+    type: 'rivet:connect-result';
+    provider: string;
+    status: 'connected' | 'error';
+    message?: string;
+};
+export type ConnectResultClosePolicy = 'always' | 'after-notifying-opener';
+export type HostedRivetPage = {
+    kind: 'google-sign-in';
+    initiator: string;
+    providerAuthUrl: string;
+} | {
+    kind: 'sign-in-link-expired';
+} | {
+    kind: 'connect-result';
+    result: ConnectResultMessage;
+    notice: string;
+    closePolicy: ConnectResultClosePolicy;
+};
+export type RivetPageShareCard = {
+    description: string;
+    imageUrl: string;
+};
+export type RivetPageHead = {
+    title: string;
+    shareCard?: RivetPageShareCard;
+    robots?: 'noindex';
+};
+//# sourceMappingURL=rivet-page-types.d.ts.map

package/dist/types/rivet-page-types.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SIGN_IN_CALLBACK_COMPLETE_PATH = exports.RIVET_PAGE_DATA_ELEMENT_ID = void 0;
+exports.RIVET_PAGE_DATA_ELEMENT_ID = 'rivet-page';
+exports.SIGN_IN_CALLBACK_COMPLETE_PATH = '/complete';
+//# sourceMappingURL=rivet-page-types.js.map