@myrialabs/clopen 0.2.1 → 0.2.2

package/backend/{lib/auth → auth}/auth-service.ts

@@ -4,9 +4,9 @@
  * Core authentication logic: user creation, session management, invite handling.
  */
 
-import { authQueries, settingsQueries } from '$backend/lib/database/queries';
+import { authQueries, settingsQueries } from '$backend/database/queries';
 import { generateSessionToken, generatePAT, generateInviteToken, hashToken, getTokenType } from './tokens';
-import { generateColorFromString, getInitials } from '$backend/lib/user/helpers';
+import { generateColorFromString, getInitials } from '$backend/utils/user-helpers';
 import { debug } from '$shared/utils/logger';
 
 /** Default session lifetime in days */

package/backend/{lib/chat → chat}/stream-manager.ts

@@ -1097,7 +1097,7 @@ class StreamManager extends EventEmitter {
 			// Update checkpoint_tree_state when saving a new checkpoint (real user message)
 			if (message.type === 'user') {
 				try {
-					const { isCheckpointMessage, buildCheckpointTree, getCheckpointPathToRoot } = await import('../../lib/snapshot/helpers');
+					const { isCheckpointMessage, buildCheckpointTree, getCheckpointPathToRoot } = await import('../snapshot/helpers');
 					const { checkpointQueries } = await import('../database/queries');
 
 					// Check if this new message is a checkpoint

package/backend/{lib/engine → engine}/adapters/claude/environment.ts

@@ -12,7 +12,7 @@ import { join } from 'path';
 import { isWindows, findGitBash } from '../../../terminal/shell-utils.js';
 import { engineQueries } from '../../../database/queries';
 import { debug } from '$shared/utils/logger';
-import { getCleanSpawnEnv } from '../../../shared/env';
+import { getCleanSpawnEnv } from '../../../utils/env';
 
 let _ready = false;
 let _initPromise: Promise<void> | null = null;

package/backend/{lib/engine → engine}/adapters/opencode/message-converter.ts

@@ -141,7 +141,7 @@ const TOOL_NAME_MAP: Record<string, string> = {
 
 /** Map Open Code tool name to Claude Code tool name for UI rendering */
 export function mapToolName(openCodeToolName: string): string {
-	// Check if this is a custom MCP tool (resolves via single source in backend/lib/mcp)
+	// Check if this is a custom MCP tool (resolves via single source in backend/mcp)
 	const mcpName = resolveOpenCodeToolName(openCodeToolName);
 	if (mcpName) return mcpName;
 

package/backend/{lib/files → files}/file-watcher.ts

@@ -12,7 +12,7 @@
 import { watch, type FSWatcher, existsSync } from 'node:fs';
 import { stat } from 'node:fs/promises';
 import { join, relative, normalize, sep } from 'node:path';
-import { ws } from '$backend/lib/utils/ws';
+import { ws } from '$backend/utils/ws';
 import { debug } from '$shared/utils/logger';
 import type { FileChange } from '$shared/types/filesystem';
 

package/backend/{lib/git → git}/git-executor.ts

@@ -4,7 +4,7 @@
  */
 
 import { debug } from '$shared/utils/logger';
-import { getCleanSpawnEnv } from '../shared/env';
+import { getCleanSpawnEnv } from '../utils/env';
 
 export interface GitExecResult {
 	stdout: string;

package/backend/index.ts

@@ -9,7 +9,7 @@ if (typeof globalThis.Bun === 'undefined') {
 }
 
 // MUST be first import — cleans process.env before any other module reads it
-import { SERVER_ENV } from './lib/shared/env';
+import { SERVER_ENV } from './utils/env';
 
 import { Elysia } from 'elysia';
 import { corsMiddleware } from './middleware/cors';
@@ -17,10 +17,10 @@ import { errorHandlerMiddleware } from './middleware/error-handler';
 import { loggerMiddleware } from './middleware/logger';
 
 // Database initialization
-import { initializeDatabase, closeDatabase } from './lib/database';
-import { disposeAllEngines } from './lib/engine';
+import { initializeDatabase, closeDatabase } from './database';
+import { disposeAllEngines } from './engine';
 import { debug } from '$shared/utils/logger';
-import { findAvailablePort } from './lib/shared/port-utils';
+import { findAvailablePort } from './utils/port-utils';
 import { networkInterfaces } from 'os';
 import { resolve } from 'node:path';
 import { statSync } from 'node:fs';
@@ -29,11 +29,11 @@ import { statSync } from 'node:fs';
 import { wsRouter } from './ws';
 
 // MCP remote server for Open Code custom tools
-import { handleMcpRequest, closeMcpServer } from './lib/mcp/remote-server';
+import { handleMcpRequest, closeMcpServer } from './mcp/remote-server';
 
 // Auth middleware
-import { checkRouteAccess } from './lib/auth/permissions';
-import { ws as wsServer } from './lib/utils/ws';
+import { checkRouteAccess } from './auth/permissions';
+import { ws as wsServer } from './utils/ws';
 
 // Register auth gate on WebSocket router — blocks unauthenticated/unauthorized access
 wsRouter.setAuthMiddleware(async (conn, action) => {

package/backend/{lib/mcp → mcp}/README.md

@@ -19,13 +19,13 @@ Custom MCP (Model Context Protocol) tools for adding specialized functionality t
 ## Overview
 
 **What is Custom MCP Tools?**
-System for adding custom tools to AI engines with type-safe TypeScript definitions. Tools are defined once using `defineServer()` and automatically available to both Claude Code (in-process) and Open Code (stdio subprocess).
+System for adding custom tools to AI engines with type-safe TypeScript definitions. Tools are defined once using `defineServer()` and automatically available to both Claude Code (in-process) and Open Code (remote HTTP MCP server).
 
 **Features:**
 - Single source of truth — define tools once, use in both engines
 - In-process execution for Claude Code via `createSdkMcpServer`
-- Stdio subprocess for Open Code via `@modelcontextprotocol/sdk`
-- WebSocket bridge for tool handlers that need in-process access
+- Remote HTTP MCP server for Open Code via `createRemoteMcpServer`
+- Both engines execute handlers in-process (no subprocess, no bridge)
 - Type-safe with TypeScript
 - Auto metadata extraction and registration
 - Configuration-based enable/disable
@@ -91,7 +91,7 @@ import weather from './weather';
 import calculator from './calculator';
 import { buildServerRegistries } from './helper';
 
-const allServers = [
+export const allServers = [
   weather,
   calculator, // Simply add your server here!
   // Add more servers...
@@ -131,27 +131,25 @@ Tool available to Claude as: `mcp__calculator__calculate`
 ## Architecture
 
 ```
-backend/lib/mcp/
-├── types.ts           # TypeScript type definitions (auto-inferred from metadata)
-├── config.ts          # User configuration (enabled, tools) + auto-merge with registry
-│                      #   + resolveOpenCodeToolName() & getOpenCodeMcpConfig()
-├── index.ts           # Main export point
-├── stdio-server.ts    # Standalone MCP stdio server for Open Code (subprocess)
-├── servers/           # Server implementations (single source of truth)
-│   ├── index.ts      # Auto-build registries from server array
-│   ├── helper.ts     # defineServer & buildServerRegistries functions
-│   ├── weather/      # Example: Weather service
-│   │   ├── index.ts  # Server definition using defineServer
+backend/mcp/
+├── types.ts            # TypeScript type definitions (auto-inferred from metadata)
+├── config.ts           # User configuration (enabled, tools) + auto-merge with registry
+│                       #   + resolveOpenCodeToolName() & getOpenCodeMcpConfig()
+├── index.ts            # Main export point
+├── remote-server.ts    # Remote HTTP MCP server for Open Code (Streamable HTTP transport)
+├── project-context.ts  # Project context service for MCP tool handlers
+├── servers/            # Server implementations (single source of truth)
+│   ├── index.ts       # Auto-build registries from server array + export allServers
+│   ├── helper.ts      # defineServer, buildServerRegistries & createRemoteMcpServer
+│   ├── weather/       # Example: Weather service
+│   │   ├── index.ts   # Server definition using defineServer
 │   │   └── get-temperature.ts  # Tool handler implementation
 │   └── browser-automation/  # Example: Browser automation service
-│       ├── index.ts  # Server definition
-│       ├── session.ts  # Session management handlers
-│       ├── navigation.ts  # Navigation handlers
-│       └── ...       # Other tool handlers
-└── README.md         # This file
-
-backend/ws/mcp/          # WebSocket bridge route (lives in ws/ per convention)
-└── index.ts              # WS .http() route for stdio server → main server
+│       ├── index.ts   # Server definition
+│       ├── actions.ts # Browser action handlers
+│       ├── browser.ts # Browser instance management
+│       └── inspection.ts  # Page inspection handlers
+└── README.md          # This file
 ```
 
 ### Server Organization
@@ -205,29 +203,27 @@ servers/browser-automation/
 6. UI displays result (CustomMcpTool.svelte)
 ```
 
-**Open Code (stdio subprocess + WS bridge):**
+**Open Code (remote HTTP MCP server):**
 ```
 1. Server Definition (servers/weather/index.ts)
    └─> Same defineServer() — single source of truth
         ↓
-2. Open Code engine (opencode/stream.ts)
-   └─> Uses getOpenCodeMcpConfig() → spawns stdio-server.ts
+2. Remote MCP server (remote-server.ts)
+   └─> createRemoteMcpServer() registers tools from allServers
+   └─> Mounted at /mcp on the main Elysia server
         ↓
-3. stdio-server.ts (subprocess)
-   └─> Reads serverMetadata for tool schemas/descriptions
-   └─> Registers tools via @modelcontextprotocol/sdk
+3. Open Code engine (opencode/stream.ts)
+   └─> Uses getOpenCodeMcpConfig() → { type: 'remote', url: '/mcp' }
         ↓
-4. Open Code calls a tool → stdio-server receives JSON-RPC
+4. Open Code connects via Streamable HTTP transport
+   └─> Sends JSON-RPC tool calls to /mcp endpoint
         ↓
-5. stdio-server proxies via WSClient.http('mcp:execute', ...)
-        ↓
-6. WS bridge route (backend/ws/mcp/)
-   └─> Looks up handler from serverMetadata.toolDefs
+5. remote-server.ts handles the request
    └─> Executes handler in-process (same context as main server)
         ↓
-7. Response flows back: bridge → WSClient → stdio → Open Code
+6. Response flows back: HTTP → Open Code
         ↓
-8. UI displays result (CustomMcpTool.svelte)
+7. UI displays result (CustomMcpTool.svelte)
 ```
 
 ### Key Components
@@ -235,23 +231,25 @@ servers/browser-automation/
 **`defineServer`**
 Helper function to define MCP server with automatic metadata extraction.
 Stores both Claude SDK server instance AND raw tool definitions (`toolDefs`)
-for reuse by other transports (stdio server, bridge).
+for reuse by both engines.
 
 **`buildServerRegistries`**
 Function to build server registries from server array.
 
+**`createRemoteMcpServer`**
+Creates a `McpServer` instance (from `@modelcontextprotocol/sdk`) with tools
+registered from the same `RawToolDef` definitions used by Claude Code.
+Handlers execute directly in-process — no subprocess, no bridge.
+
 **`mcpServers`**
 Final configuration combining user config with server instances.
 
-**`stdio-server.ts`**
-Standalone MCP stdio server subprocess spawned by Open Code. Reads tool
-definitions from `serverMetadata` and proxies all calls to the main server
-via `WSClient.http()`. Uses `@modelcontextprotocol/sdk` for MCP protocol.
-
-**`backend/ws/mcp/`**
-WebSocket `.http()` route that receives tool calls from the stdio server
-and executes handlers in-process. Lives in `backend/ws/` per the WS
-module convention (see `backend/ws/README.md`).
+**`remote-server.ts`**
+Remote HTTP MCP server mounted at `/mcp` on the main Elysia server.
+Uses `WebStandardStreamableHTTPServerTransport` for the MCP protocol.
+Open Code connects to it via `type: 'remote'` config. Each session gets
+its own transport and `McpServer` instance. Handles session lifecycle
+(create, route, close) and graceful shutdown.
 
 ---
 
@@ -449,14 +447,14 @@ import type {
   McpServerConfigWithInstance,  // Config + instance structure
   ParsedMcpToolName,    // Parsed tool name components
   McpServerStatus       // Server status from SDK
-} from '$backend/lib/mcp';
+} from '$backend/mcp';
 ```
 
 #### Main Configuration
 
 **`mcpServers`** - Final merged configuration:
 ```typescript
-import { mcpServers } from '$backend/lib/mcp';
+import { mcpServers } from '$backend/mcp';
 
 // Access server configuration
 const weatherConfig = mcpServers["weather-service"];
@@ -471,7 +469,7 @@ const weatherConfig = mcpServers["weather-service"];
 
 **`serverMetadata`** - Metadata for type inference:
 ```typescript
-import { serverMetadata } from '$backend/lib/mcp/servers';
+import { serverMetadata } from '$backend/mcp/servers';
 
 // Access metadata
 const weatherMeta = serverMetadata["weather-service"];
@@ -480,7 +478,7 @@ const weatherMeta = serverMetadata["weather-service"];
 
 **`serverRegistry`** - Server instances:
 ```typescript
-import { serverRegistry } from '$backend/lib/mcp/servers';
+import { serverRegistry } from '$backend/mcp/servers';
 
 // Access server instance
 const weatherServer = serverRegistry["weather-service"];
@@ -492,7 +490,7 @@ const weatherServer = serverRegistry["weather-service"];
 Returns all enabled MCP servers for use with Claude SDK.
 
 ```typescript
-import { getEnabledMcpServers } from '$backend/lib/mcp';
+import { getEnabledMcpServers } from '$backend/mcp';
 
 const servers = getEnabledMcpServers();
 // Returns: Record<string, McpServerConfig>
@@ -502,7 +500,7 @@ const servers = getEnabledMcpServers();
 Returns array of allowed tool names (formatted for Claude SDK).
 
 ```typescript
-import { getAllowedMcpTools } from '$backend/lib/mcp';
+import { getAllowedMcpTools } from '$backend/mcp';
 
 const tools = getAllowedMcpTools();
 // Returns: ["mcp__weather-service__get_temperature", ...]
@@ -512,7 +510,7 @@ const tools = getAllowedMcpTools();
 Parse MCP tool name into components.
 
 ```typescript
-import { parseMcpToolName } from '$backend/lib/mcp';
+import { parseMcpToolName } from '$backend/mcp';
 
 const parsed = parseMcpToolName("mcp__weather-service__get_temperature");
 // Returns: { server: "weather-service", tool: "get_temperature", fullName: "..." }
@@ -522,27 +520,27 @@ const parsed = parseMcpToolName("mcp__weather-service__get_temperature");
 Check if a tool name is a custom MCP tool.
 
 ```typescript
-import { isMcpTool } from '$backend/lib/mcp';
+import { isMcpTool } from '$backend/mcp';
 
 isMcpTool("mcp__weather-service__get_temperature");  // true
 isMcpTool("Bash");  // false
 ```
 
 #### `getOpenCodeMcpConfig()`
-Returns MCP configuration for Open Code engine (spawns stdio subprocess).
+Returns MCP configuration for Open Code engine (remote HTTP MCP server).
 
 ```typescript
-import { getOpenCodeMcpConfig } from '$backend/lib/mcp';
+import { getOpenCodeMcpConfig } from '$backend/mcp';
 
 const mcpConfig = getOpenCodeMcpConfig();
-// Returns: { 'clopen-mcp': { type: 'local', command: ['bun', 'run', '...'], ... } }
+// Returns: { 'clopen-mcp': { type: 'remote', url: 'http://localhost:9151/mcp', ... } }
 ```
 
 #### `resolveOpenCodeToolName(toolName)`
 Resolve an Open Code tool name to `mcp__server__tool` format (single source of truth).
 
 ```typescript
-import { resolveOpenCodeToolName } from '$backend/lib/mcp';
+import { resolveOpenCodeToolName } from '$backend/mcp';
 
 resolveOpenCodeToolName("clopen-mcp_get_temperature");
 // Returns: "mcp__weather-service__get_temperature"
@@ -565,7 +563,7 @@ import {
   getEnabledServerNames,
   getEnabledToolsForServer,
   getMcpStats
-} from '$backend/lib/mcp';
+} from '$backend/mcp';
 
 // Get server configuration (includes instance)
 const config = getServerConfig("weather-service");
@@ -1084,38 +1082,30 @@ schema: {
 
 ### How It Works
 
-Open Code uses a **stdio subprocess** pattern for MCP tools. The integration has three parts:
-
-1. **`stdio-server.ts`** — Standalone Bun subprocess that Open Code spawns. It registers tools from `serverMetadata` using `@modelcontextprotocol/sdk` and communicates with Open Code via stdin/stdout (JSON-RPC 2.0).
-
-2. **`WSClient` bridge** — The stdio server uses `WSClient` from `shared/utils/ws-client.ts` to connect to the main Clopen server via WebSocket. Tool calls are proxied using the standard `.http()` request-response pattern.
-
-3. **`backend/ws/mcp-bridge/`** — WS `.http()` route that receives bridge requests and executes tool handlers in-process. This is necessary because handlers like browser-automation need access to Puppeteer instances managed by the main server.
+Open Code connects to a **remote HTTP MCP server** running in the main Clopen process. Tool handlers execute directly in-process — no subprocess, no bridge. This is architecturally identical to how Claude Code uses in-process MCP servers.
 
-### Why a Bridge?
+1. **`remote-server.ts`** — HTTP MCP server mounted at `/mcp` on the main Elysia server. Uses `WebStandardStreamableHTTPServerTransport` from `@modelcontextprotocol/sdk` for the Streamable HTTP transport protocol.
 
-Tool handlers often need in-process access to resources managed by the main server (browser instances, project context, database connections). The stdio subprocess runs in a separate process and cannot access these directly. The WS bridge pattern solves this by:
+2. **`createRemoteMcpServer()`** — Factory in `servers/helper.ts` that creates a `McpServer` instance with tools registered from the same `RawToolDef` definitions used by Claude Code. Each MCP session gets its own server instance.
 
-- Keeping tool **definitions** (schema, description) in the subprocess for MCP protocol
-- Proxying tool **execution** to the main server where handlers run in-process
-- Using the standard WSClient protocol (same as frontend), not custom WebSocket code
+3. **`getOpenCodeMcpConfig()`** — Returns `{ type: 'remote', url: 'http://localhost:<port>/mcp' }` so Open Code connects directly to the main server.
 
 ### Adding Open Code Support to New Tools
 
 No extra work needed! When you add a new tool via `defineServer()`, it's automatically available to both engines:
 
 - **Claude Code**: Uses the in-process `createSdkMcpServer` instance
-- **Open Code**: `stdio-server.ts` reads from `serverMetadata` and `mcpServers` — the same registries
+- **Open Code**: `remote-server.ts` uses `createRemoteMcpServer()` with the same `allServers` and `mcpServersConfig`
 
 ### File Locations
 
 | File | Location | Purpose |
 |------|----------|---------|
-| Tool definitions | `backend/lib/mcp/servers/` | Single source of truth |
-| Stdio server | `backend/lib/mcp/stdio-server.ts` | Subprocess for Open Code |
-| WS bridge route | `backend/ws/mcp/index.ts` | Bridge handler (in ws/) |
-| Open Code config | `backend/lib/mcp/config.ts` | `getOpenCodeMcpConfig()` |
-| Tool name resolver | `backend/lib/mcp/config.ts` | `resolveOpenCodeToolName()` |
+| Tool definitions | `backend/mcp/servers/` | Single source of truth |
+| Remote MCP server | `backend/mcp/remote-server.ts` | HTTP server for Open Code |
+| Server factory | `backend/mcp/servers/helper.ts` | `createRemoteMcpServer()` |
+| Open Code config | `backend/mcp/config.ts` | `getOpenCodeMcpConfig()` |
+| Tool name resolver | `backend/mcp/config.ts` | `resolveOpenCodeToolName()` |
 
 ---
 
@@ -1125,7 +1115,7 @@ No extra work needed! When you add a new tool via `defineServer()`, it's automat
 - [Custom Tools](https://platform.claude.com/docs/en/agent-sdk/custom-tools.md)
 - [MCP in the SDK](https://platform.claude.com/docs/en/agent-sdk/mcp.md)
 - [MCP SDK (@modelcontextprotocol/sdk)](https://github.com/modelcontextprotocol/typescript-sdk)
-- [WebSocket API Documentation](../../../backend/ws/README.md)
+- [WebSocket API Documentation](../ws/README.md)
 - [Zod Documentation](https://zod.dev/)
 
 ---
@@ -1137,7 +1127,6 @@ For questions or issues:
 2. Review example implementations in `./servers/`
 3. Check console logs for error messages
 4. Review Claude Agent SDK documentation
-5. For WS bridge issues, see `backend/ws/README.md`
 
 ---
 

package/backend/{lib/mcp → mcp}/config.ts

@@ -10,7 +10,7 @@ import type { McpRemoteConfig } from '@opencode-ai/sdk';
 import type { ServerConfig, ParsedMcpToolName, ServerName } from './types';
 import { serverRegistry, serverFactories } from './servers';
 import { debug } from '$shared/utils/logger';
-import { SERVER_ENV } from '../shared/env';
+import { SERVER_ENV } from '../utils/env';
 
 /**
  * User-defined MCP Servers Configuration

package/backend/{lib/mcp → mcp}/servers/browser-automation/actions.ts

@@ -2,10 +2,10 @@
  * Browser Action Handlers
  */
 
-import { browserPreviewServiceManager, type BrowserPreviewService } from "$backend/lib/preview";
-import type { BrowserAutonomousAction } from "$backend/lib/preview/browser/types";
-import { browserMcpControl } from "$backend/lib/preview";
-import { projectContextService } from "$backend/lib/mcp/project-context";
+import { browserPreviewServiceManager, type BrowserPreviewService } from "$backend/preview";
+import type { BrowserAutonomousAction } from "$backend/preview/browser/types";
+import { browserMcpControl } from "$backend/preview";
+import { projectContextService } from "$backend/mcp/project-context";
 import { getActiveTabSession } from "./browser";
 import { debug } from "$shared/utils/logger";
 

package/backend/{lib/mcp → mcp}/servers/browser-automation/browser.ts

@@ -10,10 +10,10 @@
  * All operations work on the active tab automatically.
  */
 
-import { ws } from "$backend/lib/utils/ws";
+import { ws } from "$backend/utils/ws";
 import { debug } from "$shared/utils/logger";
-import { browserMcpControl, browserPreviewServiceManager, type BrowserPreviewService } from "$backend/lib/preview";
-import { projectContextService } from "$backend/lib/mcp/project-context";
+import { browserMcpControl, browserPreviewServiceManager, type BrowserPreviewService } from "$backend/preview";
+import { projectContextService } from "$backend/mcp/project-context";
 
 /**
  * Get BrowserPreviewService for current MCP execution context

package/backend/{lib/mcp → mcp}/servers/browser-automation/inspection.ts

@@ -2,9 +2,9 @@
  * Page Inspection Handlers
  */
 
-import { browserPreviewServiceManager, type BrowserPreviewService } from "$backend/lib/preview";
-import { browserMcpControl } from "$backend/lib/preview";
-import { projectContextService } from "$backend/lib/mcp/project-context";
+import { browserPreviewServiceManager, type BrowserPreviewService } from "$backend/preview";
+import { browserMcpControl } from "$backend/preview";
+import { projectContextService } from "$backend/mcp/project-context";
 import { getActiveTabSession } from "./browser";
 import { debug } from "$shared/utils/logger";
 

package/backend/middleware/cors.ts

@@ -1,5 +1,5 @@
 import { cors } from '@elysiajs/cors';
-import { SERVER_ENV } from '../lib/shared/env';
+import { SERVER_ENV } from '../utils/env';
 
 /**
  * CORS Middleware Configuration

package/backend/middleware/error-handler.ts

@@ -1,5 +1,5 @@
 import type { Elysia } from 'elysia';
-import { SERVER_ENV } from '../lib/shared/env';
+import { SERVER_ENV } from '../utils/env';
 
 /**
  * Global Error Handler Middleware

package/backend/{lib/preview → preview}/browser/browser-preview-service.ts

@@ -8,7 +8,7 @@ import { BrowserVideoCapture } from './browser-video-capture.js';
 import { BrowserDialogHandler } from './browser-dialog-handler.js';
 import { BrowserNativeUIHandler } from './browser-native-ui-handler.js';
 import { browserMcpControl } from './browser-mcp-control.js';
-import { ws } from '$backend/lib/utils/ws';
+import { ws } from '$backend/utils/ws';
 import { debug } from '$shared/utils/logger';
 import type {
 	BrowserTab,

package/backend/{lib/preview → preview}/browser/browser-tab-manager.ts

@@ -1,6 +1,6 @@
 import type { Browser, BrowserContext, Page } from 'puppeteer';
 import { EventEmitter } from 'events';
-import { getViewportDimensions } from '$frontend/lib/constants/preview.js';
+import { getViewportDimensions } from '$frontend/utils/preview-constants.js';
 import type { BrowserTab, BrowserTabInfo, DeviceSize, Rotation } from './types';
 import { DEFAULT_STREAMING_CONFIG } from './types';
 import { browserPool } from './browser-pool';

package/backend/{lib/preview → preview}/browser/types.ts

@@ -1,5 +1,5 @@
 import type { Browser, BrowserContext, Page } from 'puppeteer';
-import type { DeviceSize, Rotation } from '$frontend/lib/constants/preview.js';
+import type { DeviceSize, Rotation } from '$frontend/utils/preview-constants.js';
 
 // Re-export types from preview config
 export type { DeviceSize, Rotation };