dsh-webui-studio 0.1.0 → 0.2.0

package/lib/host/drafts.d.ts

@@ -1,6 +1,6 @@
 import type { StudioCreateDraftInput, StudioDraftRecord } from '../contracts.js';
 export interface StudioCommandRunner {
-    run(command: string, args: string[], cwd?: string, onOutput?: (chunk: string) => void, signal?: AbortSignal): Promise<void>;
+    run(command: string, args: string[], cwd?: string, onOutput?: (chunk: string) => void, signal?: AbortSignal, env?: NodeJS.ProcessEnv): Promise<void>;
 }
 export declare const studioCommands: StudioCommandRunner;
 export declare class StudioDraftRegistry {

package/lib/host/drafts.js

@@ -5,9 +5,9 @@ import { basename, dirname, isAbsolute, join, relative, resolve, sep } from 'nod
 const PACKAGE_NAME = /^(?:@[a-z0-9._~-]+\/)?[a-z0-9._~-]+$/;
 const COMMAND_OUTPUT_LIMIT = 2 * 1024 * 1024;
 export const studioCommands = {
-    run(command, args, cwd, onOutput, signal) {
+    run(command, args, cwd, onOutput, signal, env) {
         return new Promise((resolve, reject) => {
-            const child = spawn(command, args, { cwd, stdio: ['ignore', 'pipe', 'pipe'], signal });
+            const child = spawn(command, args, { cwd, env, stdio: ['ignore', 'pipe', 'pipe'], signal });
             let output = '';
             const read = (chunk) => {
                 const text = chunk.toString();
@@ -32,18 +32,41 @@ function templateManifest(name) {
         version: '0.1.0',
         private: true,
         type: 'module',
-        packageManager: 'npm@10.0.0',
+        packageManager: 'pnpm@10.34.5',
         exports: { '.': './lib/index.js', './client': './lib/client.js', './package.json': './package.json' },
-        scripts: { build: 'node --check lib/index.js && node --check lib/client.js' },
-        dsh: { client: { platform: 'web' }, harmony: { patches: [] } },
+        scripts: { build: 'npm run build:client && npm run build:host', 'build:client': 'tsdown --config-loader unrun', 'build:host': 'tsc -p tsconfig.host.json' },
+        dsh: { client: { immediately: true, inject: ['@deepseek-ai/dsh-client-runtime'], platform: 'web' }, harmony: { patches: [] } },
+        dependencies: { 'dsh-harmony-react': '^0.3.0' },
+        peerDependencies: { '@deepseek-ai/dsh-client-runtime': '0.1.0-rc.7', react: '^18.3.1' },
+        devDependencies: {
+            '@deepseek-ai/dsh-client-runtime': '0.1.0-rc.7', '@tsdown/css': '0.22.14', '@types/react': '~18.3.1', react: '^18.3.1',
+            tsdown: '0.22.14', typescript: '^6.0.3', unrun: '0.3.1',
+        },
     }, null, 2)}\n`;
 }
-function templateClient(name) {
-    return `window.__ModuleLoader__.load({
+function templateClient() {
+    return `import type { ClientContext } from '@deepseek-ai/dsh-client-runtime/client'
+
+export function apply(_ctx: ClientContext): void {}
+`;
+}
+function templateTsdown(name) {
+    return `import { defineConfig } from 'tsdown'
+
+const moduleHeader = \`window.__ModuleLoader__.load({
   id: ${JSON.stringify(name)},
-  factory: () => ({
-    apply() {},
-  }),
+  factory: (require) => {
+    const module = { exports: {} };
+    const exports = module.exports;\`
+const moduleFooter = \`return module.exports;
+  },
+});\`
+
+export default defineConfig({
+  entry: { client: 'src/client.tsx' }, tsconfig: 'tsconfig.client.json', format: 'cjs', platform: 'browser', target: 'es2023',
+  deps: { alwaysBundle: ['dsh-harmony-react/studio'], neverBundle: ['react', 'react/jsx-runtime'], onlyBundle: ['dsh-harmony-react'] },
+  outDir: 'lib', clean: true, fixedExtension: false, outExtensions: () => ({ js: '.js' }), hash: false, sourcemap: true, dts: false,
+  banner: { js: moduleHeader }, footer: { js: moduleFooter },
 })
 `;
 }
@@ -196,11 +219,38 @@ async function validateDestinationDirectory(input, studioRoot) {
     }
     return target;
 }
+async function validateProfileDirectory(mode, input) {
+    if (mode === 'main-home') {
+        if (input !== undefined)
+            throw new Error('Only custom Draft profiles can specify a profile folder');
+        return undefined;
+    }
+    if (typeof input !== 'string' || input.trim() === '')
+        throw new Error('Custom profile folder is required');
+    if (!isAbsolute(input.trim()))
+        throw new Error('Custom profile folder must be an absolute path');
+    try {
+        const directory = await realpath(input.trim());
+        if (!(await lstat(directory)).isDirectory())
+            throw new Error('Custom profile path must be a directory');
+        const manifest = JSON.parse(await readFile(join(directory, 'package.json'), 'utf8'));
+        if (typeof manifest !== 'object' || manifest === null || Array.isArray(manifest))
+            throw new Error('package.json must contain an object');
+        return directory;
+    }
+    catch (error) {
+        throw new Error(`Custom profile folder must contain a readable package.json: ${error instanceof Error ? error.message : String(error)}`);
+    }
+}
 async function initializeRepository(root, name, commands) {
-    await mkdir(join(root, 'lib'), { recursive: true });
+    await mkdir(join(root, 'src'), { recursive: true });
     await writeFile(join(root, 'package.json'), templateManifest(name));
-    await writeFile(join(root, 'lib/index.js'), 'export const name = "draft-host"\nexport function apply() {}\n');
-    await writeFile(join(root, 'lib/client.js'), templateClient(name));
+    await writeFile(join(root, 'src/index.ts'), `export const name = ${JSON.stringify(name)}\nexport function apply(): void {}\n`);
+    await writeFile(join(root, 'src/client.tsx'), templateClient());
+    await writeFile(join(root, 'tsdown.config.ts'), templateTsdown(name));
+    await writeFile(join(root, 'tsconfig.client.json'), `${JSON.stringify({ compilerOptions: { target: 'ES2023', module: 'ESNext', moduleResolution: 'Bundler', jsx: 'react-jsx', strict: true, noUncheckedIndexedAccess: true, skipLibCheck: true, types: ['react'] }, include: ['src/client.tsx', 'src/**/*.js'] }, null, 2)}\n`);
+    await writeFile(join(root, 'tsconfig.host.json'), `${JSON.stringify({ compilerOptions: { target: 'ES2023', module: 'NodeNext', moduleResolution: 'NodeNext', strict: true, declaration: true, outDir: 'lib', rootDir: 'src', skipLibCheck: true }, include: ['src/index.ts'] }, null, 2)}\n`);
+    await writeFile(join(root, '.gitignore'), 'lib/\nnode_modules/\n');
     await writeFile(join(root, 'README.md'), `# ${name}\n\nCreated by dsh-webui-studio.\n`);
     await commands.run('git', ['init', '--initial-branch=main'], root);
     await commands.run('git', ['add', '.'], root);
@@ -241,8 +291,7 @@ export class StudioDraftRegistry {
         return JSON.parse(await readFile(join(this.recordsDir, `${id}.json`), 'utf8'));
     }
     async create(input) {
-        if (input.profileMode === 'custom')
-            throw new Error('Custom Draft profiles are not implemented yet');
+        const profileDirectory = await validateProfileDirectory(input.profileMode, input.profileDirectory);
         const id = randomUUID();
         const repositoryDir = join(this.repositoriesDir, id);
         const worktreeDir = join(this.worktreesDir, id);
@@ -309,6 +358,7 @@ export class StudioDraftRegistry {
                 root,
                 runtimeHome,
                 profileMode: input.profileMode,
+                ...(profileDirectory === undefined ? {} : { profileDirectory }),
                 createdAt: new Date().toISOString(),
             };
             await writeFile(join(this.recordsDir, `${id}.json`), `${JSON.stringify(record, null, 2)}\n`, { flag: 'wx' });

package/lib/host/element-source.d.ts

@@ -0,0 +1,9 @@
+import type { StudioElementSnapshot } from '../contracts.js';
+import type { StudioElementStyleSource } from '../contracts.js';
+export declare function saveElementsDefaults(root: string, elements: readonly StudioElementSnapshot[]): Promise<{
+    files: string[];
+}>;
+export declare function readElementsStyles(root: string, elements: readonly StudioElementSnapshot[]): Promise<StudioElementStyleSource[]>;
+export declare function saveElementsSource(root: string, elements: readonly StudioElementSnapshot[], styles: readonly StudioElementStyleSource[]): Promise<{
+    files: string[];
+}>;

package/lib/host/element-source.js

@@ -0,0 +1,295 @@
+import { createHash } from 'node:crypto';
+import { unlink } from 'node:fs/promises';
+import { basename, dirname, extname, join, posix } from 'node:path';
+import ts from 'typescript';
+import { readProjectFile, writeProjectFile } from './project-files.js';
+import { flattenVariableTree } from '../variable-tree.js';
+import { compileElementStyleSelector } from '../bridge/element-style-selector.js';
+function count(source, needle) {
+    let matches = 0;
+    let offset = source.indexOf(needle);
+    while (offset !== -1) {
+        matches += 1;
+        offset = source.indexOf(needle, offset + needle.length);
+    }
+    return matches;
+}
+function quoteString(value, current, id) {
+    const quote = current[0];
+    if (quote !== "'" && quote !== '"') {
+        throw new Error(`Element variable ${id} default is not a quoted string literal`);
+    }
+    const stringLiteral = quote === "'" ? /^'(?:\\.|[^'\\\r\n])*'$/ : /^"(?:\\.|[^"\\\r\n])*"$/;
+    if (!stringLiteral.test(current))
+        throw new Error(`Element variable ${id} default is not a complete string literal`);
+    if (quote === '"')
+        return JSON.stringify(value);
+    return `'${value.replaceAll('\\', '\\\\').replaceAll("'", "\\'")}'`;
+}
+function serializeDefault(definition, value, current) {
+    const expression = current.trim();
+    if (definition.control === 'number') {
+        if (typeof value !== 'number' || !Number.isFinite(value))
+            throw new Error(`Element variable ${definition.id} must be a finite number`);
+        if (!/^[+-]?(?:\d+(?:\.\d*)?|\.\d+)(?:e[+-]?\d+)?$/i.test(expression)) {
+            throw new Error(`Element variable ${definition.id} default is not a number literal`);
+        }
+        return String(value);
+    }
+    if (definition.control === 'boolean') {
+        if (typeof value !== 'boolean')
+            throw new Error(`Element variable ${definition.id} must be boolean`);
+        if (expression !== 'true' && expression !== 'false') {
+            throw new Error(`Element variable ${definition.id} default is not a boolean literal`);
+        }
+        return String(value);
+    }
+    if (typeof value !== 'string')
+        throw new Error(`Element variable ${definition.id} must be a string`);
+    return quoteString(value, expression, definition.id);
+}
+function replacementsForFile(source, variables) {
+    const replacements = [];
+    for (const { definition, value } of variables) {
+        const anchor = definition.defaultSource;
+        if (anchor === undefined)
+            continue;
+        const start = source.indexOf(anchor.before);
+        if (start === -1 || count(source, anchor.before) !== 1) {
+            throw new Error(`Element variable ${definition.id} default source prefix is not unique`);
+        }
+        const valueStart = start + anchor.before.length;
+        const end = source.indexOf(anchor.after, valueStart);
+        if (end === -1)
+            throw new Error(`Element variable ${definition.id} default source suffix was not found`);
+        const between = source.slice(valueStart, end);
+        const leading = between.match(/^\s*/)?.[0].length ?? 0;
+        const trailing = between.match(/\s*$/)?.[0].length ?? 0;
+        const literalStart = valueStart + leading;
+        const literalEnd = end - trailing;
+        const current = source.slice(literalStart, literalEnd);
+        if (current === '')
+            throw new Error(`Element variable ${definition.id} default source value is empty`);
+        replacements.push({
+            start: literalStart,
+            end: literalEnd,
+            value: serializeDefault(definition, value, current),
+            id: definition.id,
+        });
+    }
+    replacements.sort((left, right) => left.start - right.start);
+    for (let index = 1; index < replacements.length; index += 1) {
+        if (replacements[index - 1].end > replacements[index].start) {
+            throw new Error(`Element variable default source anchors overlap (${replacements[index - 1].id}, ${replacements[index].id})`);
+        }
+    }
+    return replacements;
+}
+export async function saveElementsDefaults(root, elements) {
+    const grouped = new Map();
+    for (const element of elements) {
+        for (const definition of flattenVariableTree(element.element.variables ?? [])) {
+            if (definition.defaultSource === undefined)
+                continue;
+            const variable = { definition, value: element.values[definition.id] };
+            const list = grouped.get(definition.defaultSource.file);
+            if (list === undefined)
+                grouped.set(definition.defaultSource.file, [variable]);
+            else
+                list.push(variable);
+        }
+    }
+    if (grouped.size === 0)
+        throw new Error('This Draft has no source-backed Element defaults');
+    const updates = [];
+    for (const [file, fileVariables] of grouped) {
+        const source = await readProjectFile(root, file);
+        const replacements = replacementsForFile(source, fileVariables);
+        let content = source;
+        for (const replacement of [...replacements].reverse()) {
+            content = `${content.slice(0, replacement.start)}${replacement.value}${content.slice(replacement.end)}`;
+        }
+        updates.push({ file, original: source, content });
+    }
+    const written = [];
+    try {
+        for (const update of updates) {
+            await writeProjectFile(root, update.file, update.content);
+            written.push(update);
+        }
+    }
+    catch (error) {
+        const rollbackErrors = [];
+        for (const update of written.reverse()) {
+            try {
+                await writeProjectFile(root, update.file, update.original);
+            }
+            catch (rollbackError) {
+                rollbackErrors.push(rollbackError);
+            }
+        }
+        if (rollbackErrors.length > 0)
+            throw new AggregateError([error, ...rollbackErrors], 'Element default save rollback failed');
+        throw error;
+    }
+    return { files: updates.map(update => update.file) };
+}
+const STYLE_HEADER = '/* dsh-webui-studio:element-styles ';
+function styleFile(sourceFile, owner, elementId) {
+    const extension = extname(sourceFile);
+    const stem = basename(sourceFile, extension);
+    const hash = createHash('sha256').update(`${owner}\0${elementId}`).digest('hex').slice(0, 10);
+    return posix.join(dirname(sourceFile).split('\\').join('/'), `${stem}.dsh-studio-${hash}.css`);
+}
+function cssString(value) {
+    return JSON.stringify(value).replaceAll('</', '<\\/');
+}
+function validateRules(rules) {
+    const selectors = new Set();
+    for (const rule of rules) {
+        compileElementStyleSelector(rule.selector, '[data-dsh-studio-root]');
+        if (selectors.has(rule.selector))
+            throw new Error(`Element CSS selector ${JSON.stringify(rule.selector)} is duplicated`);
+        selectors.add(rule.selector);
+        const properties = new Set();
+        for (const declaration of rule.declarations) {
+            if (!/^(?:--)?[a-zA-Z][a-zA-Z0-9-]*$/.test(declaration.property) || declaration.value.trim() === ''
+                || /[{}]/.test(declaration.value)) {
+                throw new Error(`Element CSS declaration ${JSON.stringify(declaration.property)} is invalid`);
+            }
+            if (properties.has(declaration.property))
+                throw new Error(`Element CSS property ${JSON.stringify(declaration.property)} is duplicated`);
+            properties.add(declaration.property);
+        }
+    }
+}
+function serializedStyles(element, rules) {
+    validateRules(rules);
+    const metadata = Buffer.from(JSON.stringify(rules), 'utf8').toString('base64url');
+    const boundary = element.element.boundary;
+    const root = `[data-ui-surface=${cssString(boundary.surfaceId)}][data-ui-surface-path=${cssString(JSON.stringify(boundary.path))}]`;
+    const blocks = rules.flatMap(rule => rule.declarations.length === 0 ? [] : [
+        `${compileElementStyleSelector(rule.selector, root)} {\n${rule.declarations.map(item => `  ${item.property}: ${item.value};`).join('\n')}\n}`,
+    ]);
+    return `${STYLE_HEADER}${metadata} */\n${blocks.join('\n\n')}${blocks.length === 0 ? '' : '\n'}`;
+}
+function styleImport(sourceFile, generatedFile) {
+    let relative = posix.relative(posix.dirname(sourceFile), generatedFile);
+    if (!relative.startsWith('.'))
+        relative = `./${relative}`;
+    return `import ${JSON.stringify(relative)}`;
+}
+function insertStyleImport(source, declaration, file) {
+    if (source.split(/\r?\n/).some(line => line.trim().replace(/;$/, '') === declaration))
+        return source;
+    const sourceFile = ts.createSourceFile(file, source, ts.ScriptTarget.Latest, true);
+    let offset = 0;
+    for (const statement of sourceFile.statements) {
+        const directive = ts.isExpressionStatement(statement) && ts.isStringLiteral(statement.expression);
+        if (!directive && !ts.isImportDeclaration(statement) && !ts.isImportEqualsDeclaration(statement))
+            break;
+        offset = statement.end;
+    }
+    if (offset === 0)
+        return `${declaration}\n${source}`;
+    return `${source.slice(0, offset)}\n${declaration}${source.slice(offset)}`;
+}
+async function readOptionalProjectFile(root, file) {
+    try {
+        return await readProjectFile(root, file);
+    }
+    catch (error) {
+        if (error.code === 'ENOENT')
+            return undefined;
+        throw error;
+    }
+}
+export async function readElementsStyles(root, elements) {
+    return Promise.all(elements.map(async (element) => {
+        const file = styleFile(element.element.source.file, element.owner, element.element.id);
+        const source = await readOptionalProjectFile(root, file);
+        if (source === undefined || !source.startsWith(STYLE_HEADER))
+            return { elementId: element.element.id, rules: [] };
+        const end = source.indexOf(' */', STYLE_HEADER.length);
+        if (end === -1)
+            throw new Error(`Element style metadata in ${file} is incomplete`);
+        try {
+            const parsed = JSON.parse(Buffer.from(source.slice(STYLE_HEADER.length, end), 'base64url').toString('utf8'));
+            validateRules(parsed);
+            return { elementId: element.element.id, rules: parsed };
+        }
+        catch (error) {
+            throw new Error(`Element style metadata in ${file} is invalid: ${error instanceof Error ? error.message : String(error)}`);
+        }
+    }));
+}
+export async function saveElementsSource(root, elements, styles) {
+    const styleByElement = new Map(styles.map(item => [item.elementId, item.rules]));
+    if (styleByElement.size !== styles.length)
+        throw new Error('Element style sources contain duplicate element ids');
+    const known = new Set(elements.map(item => item.element.id));
+    for (const id of styleByElement.keys())
+        if (!known.has(id))
+            throw new Error(`Element ${JSON.stringify(id)} is not registered by this Draft`);
+    const updates = new Map();
+    const defaultGroups = new Map();
+    for (const element of elements) {
+        for (const definition of flattenVariableTree(element.element.variables ?? [])) {
+            if (definition.defaultSource === undefined)
+                continue;
+            const list = defaultGroups.get(definition.defaultSource.file) ?? [];
+            list.push({ definition, value: element.values[definition.id] });
+            defaultGroups.set(definition.defaultSource.file, list);
+        }
+    }
+    for (const [file, variables] of defaultGroups) {
+        const original = await readProjectFile(root, file);
+        let content = original;
+        for (const replacement of [...replacementsForFile(original, variables)].reverse()) {
+            content = `${content.slice(0, replacement.start)}${replacement.value}${content.slice(replacement.end)}`;
+        }
+        updates.set(file, { original, content });
+    }
+    for (const element of elements) {
+        const rules = styleByElement.get(element.element.id);
+        if (rules === undefined)
+            continue;
+        const generatedFile = styleFile(element.element.source.file, element.owner, element.element.id);
+        const generatedOriginal = await readOptionalProjectFile(root, generatedFile);
+        updates.set(generatedFile, { ...(generatedOriginal === undefined ? {} : { original: generatedOriginal }), content: serializedStyles(element, rules) });
+        const sourceFile = element.element.source.file;
+        const existing = updates.get(sourceFile);
+        const original = existing?.original ?? await readProjectFile(root, sourceFile);
+        let content = existing?.content ?? original;
+        const declaration = styleImport(sourceFile, generatedFile);
+        content = insertStyleImport(content, declaration, sourceFile);
+        updates.set(sourceFile, { original, content });
+    }
+    if (updates.size === 0)
+        throw new Error('This Draft has no source-backed Element changes');
+    const written = [];
+    try {
+        for (const entry of updates) {
+            await writeProjectFile(root, entry[0], entry[1].content);
+            written.push(entry);
+        }
+    }
+    catch (error) {
+        const rollbackErrors = [];
+        for (const [file, update] of written.reverse()) {
+            try {
+                if (update.original === undefined)
+                    await unlink(join(root, file));
+                else
+                    await writeProjectFile(root, file, update.original);
+            }
+            catch (rollbackError) {
+                rollbackErrors.push(rollbackError);
+            }
+        }
+        if (rollbackErrors.length > 0)
+            throw new AggregateError([error, ...rollbackErrors], 'Element source save rollback failed');
+        throw error;
+    }
+    return { files: [...updates.keys()] };
+}

package/lib/host/mcp.d.ts

@@ -0,0 +1,4 @@
+import type { WebRoute } from '@deepseek-ai/dsh-host-webserver';
+import type { StudioBackend } from './backend.js';
+export declare const STUDIO_MCP_PATH = "/studio/mcp";
+export declare function createStudioMcpRoute(backend: StudioBackend): WebRoute;

package/lib/host/mcp.js

@@ -0,0 +1,97 @@
+import { McpServer } from '@modelcontextprotocol/sdk/server/mcp.js';
+import { StreamableHTTPServerTransport } from '@modelcontextprotocol/sdk/server/streamableHttp.js';
+import * as z from 'zod/v4';
+import { STUDIO_PATH } from '../contracts.js';
+import { isTrustedStudioRequest } from './routes.js';
+export const STUDIO_MCP_PATH = `${STUDIO_PATH}/mcp`;
+const readOnlyAnnotations = {
+    readOnlyHint: true,
+    destructiveHint: false,
+    idempotentHint: true,
+    openWorldHint: false,
+};
+function result(value) {
+    return { content: [{ type: 'text', text: JSON.stringify(value, null, 2) }] };
+}
+function createServer(backend) {
+    const server = new McpServer({ name: 'dsh-webui-studio', version: '0.2.0' });
+    server.registerTool('studio_get_context', {
+        description: 'Get one bounded read-only context bundle for the current DSH WebUI instance: live selection, Harmony profile, Preview status, and related Harmony targets.',
+        annotations: readOnlyAnnotations,
+    }, async () => result(await backend.currentContext()));
+    server.registerTool('studio_get_selection', {
+        description: 'Get the DOM element currently selected in Studio, including its safe React owner summary and source candidate.',
+        annotations: readOnlyAnnotations,
+    }, async () => result({ selection: backend.currentPreviewStatus().selection ?? null }));
+    server.registerTool('studio_get_harmony_profile', {
+        description: 'Read the current WebUI Harmony profile, including installed plugins, provider and Patch order, disabled providers, compatibility findings, and revision.',
+        annotations: readOnlyAnnotations,
+    }, async () => result(await backend.currentHarmonyProfile()));
+    server.registerTool('studio_inspect_harmony_target', {
+        description: 'Inspect the current Harmony original, ordered Patch steps, and final source for an optional target package and file.',
+        inputSchema: {
+            package: z.string().min(1).optional().describe('Optional target npm package.'),
+            file: z.string().min(1).optional().describe('Optional package-relative target file.'),
+        },
+        annotations: readOnlyAnnotations,
+    }, async (input) => result(await backend.currentHarmonyInspect(input)));
+    server.registerTool('studio_read_dependency_source', {
+        description: 'Read one UTF-8 source file from a dependency installed in the current WebUI profile. Use package-relative paths obtained from Studio evidence.',
+        inputSchema: {
+            package: z.string().min(1).describe('Installed npm package name.'),
+            file: z.string().min(1).describe('Package-relative source path.'),
+        },
+        annotations: readOnlyAnnotations,
+    }, async (input) => result({
+        ...input,
+        content: await backend.currentReadDependencySource(input),
+    }));
+    server.registerTool('studio_preview_status', {
+        description: 'Read the current DSH WebUI project state and latest Studio Preview connection, graph, mode, and selection status.',
+        annotations: readOnlyAnnotations,
+    }, async () => result({ project: backend.currentProjectState(), preview: backend.currentPreviewStatus() }));
+    return server;
+}
+function sendProtocolError(response, status, message) {
+    response.writeHead(status, { 'content-type': 'application/json; charset=utf-8' });
+    response.end(JSON.stringify({ jsonrpc: '2.0', error: { code: -32000, message }, id: null }));
+}
+async function handleMcpRequest(backend, request, response) {
+    if (!isTrustedStudioRequest(request)) {
+        sendProtocolError(response, 403, 'Studio MCP is available from the local machine only.');
+        return;
+    }
+    if (new URL(request.url ?? '/', 'http://localhost').pathname !== STUDIO_MCP_PATH) {
+        sendProtocolError(response, 404, 'Not found.');
+        return;
+    }
+    if (request.method !== 'POST') {
+        sendProtocolError(response, 405, 'Method not allowed.');
+        return;
+    }
+    const server = createServer(backend);
+    const transport = new StreamableHTTPServerTransport({
+        sessionIdGenerator: undefined,
+        enableJsonResponse: true,
+    });
+    const close = () => { void server.close(); };
+    response.once('close', close);
+    try {
+        await server.connect(transport);
+        await transport.handleRequest(request, response);
+    }
+    catch (error) {
+        response.off('close', close);
+        await server.close();
+        if (!response.headersSent) {
+            sendProtocolError(response, 500, error instanceof Error ? error.message : String(error));
+        }
+    }
+}
+export function createStudioMcpRoute(backend) {
+    return {
+        kind: 'exact',
+        path: STUDIO_MCP_PATH,
+        handler: (request, response) => handleMcpRequest(backend, request, response),
+    };
+}

package/lib/host/preview-draft.d.ts

@@ -0,0 +1,22 @@
+import type { Context } from '@deepseek-ai/cordis';
+import type { StudioHarmonyService, StudioProjectState, StudioRuntimePluginEntry } from '../contracts.js';
+import { type StudioCommandRunner } from './drafts.js';
+export declare class StudioPreviewDraft {
+    private readonly ctx;
+    private readonly harmony;
+    private readonly commands;
+    private readonly name;
+    private readonly root;
+    private entryId?;
+    private createdEntry;
+    private project?;
+    constructor(ctx: Context, harmony: StudioHarmonyService, root: string, commands?: StudioCommandRunner);
+    open(): Promise<this>;
+    snapshot(): StudioProjectState;
+    runtimePlugins(): StudioRuntimePluginEntry[];
+    activate(graphRev: string): StudioProjectState;
+    applyBuild(): Promise<StudioProjectState>;
+    close(): Promise<void>;
+    private waitForClientEntry;
+    private reload;
+}