@deneb-ui/cli 2.0.28 → 2.0.30

package/src/tools/local-template-lab.cjs

@@ -1,687 +1,17 @@
 #!/usr/bin/env node
-
-const crypto = require('node:crypto');
-const fs = require('node:fs');
-const http = require('node:http');
-const path = require('node:path');
-const { spawn } = require('node:child_process');
-
-const DEFAULT_API_PORT = 4174;
-const DEFAULT_PREVIEW_PORT = 4173;
-const MAX_LOG_LENGTH = 96 * 1024;
-const LOOPBACK_HOST = '127.0.0.1';
-const LOCAL_PREVIEW_ROUTE = '/__fivora_local_preview';
-const FALLBACK_LOCAL_VISUAL_BRIDGE_SCRIPT = String.raw`
-(() => {
-  const PREVIOUS_BRAND = ['market', 'place'].join('');
-  const PREVIOUS_BRIDGE_KEY = '__' + PREVIOUS_BRAND.toUpperCase() + '_LOCAL_VISUAL_BRIDGE__';
-  const PREVIOUS_PREVIEW_PREFIX = PREVIOUS_BRAND.toUpperCase() + '_PREVIEW_';
-  const previousPreviewMessage = (suffix) => PREVIOUS_PREVIEW_PREFIX + suffix;
-  if (window.__FIVORA_LOCAL_VISUAL_BRIDGE__ || window[PREVIOUS_BRIDGE_KEY]) return;
-  window.__FIVORA_LOCAL_VISUAL_BRIDGE__ = true;
-  window[PREVIOUS_BRIDGE_KEY] = true;
-
-  const EDIT_MODE_MESSAGE = 'FIVORA_PREVIEW_EDIT_MODE';
-  const LEGACY_EDIT_MODE_MESSAGE = previousPreviewMessage('EDIT_MODE');
-  const CLICK_MESSAGE = 'FIVORA_PREVIEW_ELEMENT_CLICKED';
-  const LEGACY_CLICK_MESSAGE = previousPreviewMessage('ELEMENT_CLICKED');
-  const READY_MESSAGE = 'FIVORA_PREVIEW_READY';
-  const LEGACY_READY_MESSAGE = previousPreviewMessage('READY');
-  const FIELD_ATTRIBUTE = 'data-preview-field-path';
-  const LIST_ATTRIBUTE = 'data-preview-list-path';
-  const ITEM_ATTRIBUTE = 'data-preview-item-path';
-  const ACTIVE_ATTRIBUTE = 'data-fivora-local-edit-target';
-  const SELECTED_ATTRIBUTE = 'data-fivora-local-selected-target';
-  const LEGACY_ACTIVE_ATTRIBUTE = 'data-' + PREVIOUS_BRAND + '-local-edit-target';
-  const LEGACY_SELECTED_ATTRIBUTE = 'data-' + PREVIOUS_BRAND + '-local-selected-target';
-  const EDITABLE_SELECTOR =
-    '[data-preview-field-path], [data-preview-list-path], [data-preview-item-path]';
-  // The local lab is edit-first when embedded. The portal can still switch the
-  // preview back to normal navigation mode with EDIT_MODE_MESSAGE.
-  let editMode = window.parent !== window;
-  let descriptors = new Map();
-  let activeTarget = null;
-  let selectedTarget = null;
-  let parentOrigin = '*';
-
-  const style = document.createElement('style');
-  style.setAttribute('data-fivora-local-visual-bridge', '');
-  style.setAttribute('data-' + PREVIOUS_BRAND + '-local-visual-bridge', '');
-  style.textContent = [
-    '[' + ACTIVE_ATTRIBUTE + '], [' + LEGACY_ACTIVE_ATTRIBUTE + '] {',
-    '  outline: 2px solid #06b6d4 !important;',
-    '  outline-offset: 3px !important;',
-    '  cursor: pointer !important;',
-    '  box-shadow: 0 0 0 5px rgba(6, 182, 212, 0.16) !important;',
-    '}',
-    '[' + SELECTED_ATTRIBUTE + '], [' + LEGACY_SELECTED_ATTRIBUTE + '] {',
-    '  outline: 2px dashed #06b6d4 !important;',
-    '  outline-offset: 3px !important;',
-    '  box-shadow: 0 0 0 5px rgba(6, 182, 212, 0.18) !important;',
-    '}',
-    'html[data-fivora-local-edit-mode="true"] [data-preview-field-path],',
-    'html[data-fivora-local-edit-mode="true"] [data-preview-list-path],',
-    'html[data-fivora-local-edit-mode="true"] [data-preview-item-path],',
-    'html[data-fivora-local-edit-mode="true"] [data-preview-field-path],',
-    'html[data-fivora-local-edit-mode="true"] [data-preview-list-path],',
-    'html[data-fivora-local-edit-mode="true"] [data-preview-item-path] {',
-    '  cursor: pointer !important;',
-    '}',
-  ].join('\n');
-  document.head.appendChild(style);
-  document.documentElement.setAttribute(
-    'data-fivora-local-edit-mode',
-    String(editMode),
-  );
-  document.documentElement.setAttribute(
-    'data-fivora-local-edit-mode',
-    String(editMode),
-  );
-
-  function rememberParentOrigin(event) {
-    if (event.source !== window.parent) return false;
-    if (parentOrigin === '*' && event.origin && event.origin !== 'null') {
-      parentOrigin = event.origin;
-    }
-    return parentOrigin === '*' || event.origin === parentOrigin;
-  }
-
-  function post(payload) {
-    window.parent.postMessage(payload, parentOrigin);
-  }
-
-  function clearActiveTarget() {
-    if (activeTarget) {
-      activeTarget.removeAttribute(ACTIVE_ATTRIBUTE);
-      activeTarget.removeAttribute(LEGACY_ACTIVE_ATTRIBUTE);
-    }
-    activeTarget = null;
-  }
-
-  function selectTarget(target) {
-    if (selectedTarget && selectedTarget !== target) {
-      selectedTarget.removeAttribute(SELECTED_ATTRIBUTE);
-      selectedTarget.removeAttribute(LEGACY_SELECTED_ATTRIBUTE);
-    }
-    selectedTarget = target;
-    selectedTarget.setAttribute(SELECTED_ATTRIBUTE, 'true');
-    selectedTarget.setAttribute(LEGACY_SELECTED_ATTRIBUTE, 'true');
-  }
-
-  function clearSelectedTarget() {
-    if (selectedTarget) {
-      selectedTarget.removeAttribute(SELECTED_ATTRIBUTE);
-      selectedTarget.removeAttribute(LEGACY_SELECTED_ATTRIBUTE);
-    }
-    selectedTarget = null;
-  }
-
-  function findEditableTarget(rawTarget) {
-    if (!(rawTarget instanceof Element)) return null;
-    return rawTarget.closest(EDITABLE_SELECTOR);
-  }
-
-  function fieldValue(target, fieldPath) {
-    const descriptor = descriptors.get(fieldPath);
-    if (descriptor && ['string', 'number', 'boolean'].includes(typeof descriptor.value)) {
-      return descriptor.value;
-    }
-    if (target instanceof HTMLImageElement) return target.currentSrc || target.src || '';
-    return (target.textContent || '').trim();
-  }
-
-  function onPointerOver(event) {
-    if (!editMode) return;
-    const target = findEditableTarget(event.target);
-    if (!target || target === activeTarget) return;
-    clearActiveTarget();
-    activeTarget = target;
-    activeTarget.setAttribute(ACTIVE_ATTRIBUTE, 'true');
-  }
-
-  function onPointerOut(event) {
-    if (!editMode || !activeTarget) return;
-    const next = event.relatedTarget;
-    if (next instanceof Node && activeTarget.contains(next)) return;
-    clearActiveTarget();
-  }
-
-  function findRelatedFields(target, fieldPath, itemPath) {
-    const related = [];
-    const seen = new Set(fieldPath ? [fieldPath] : []);
-    const prefix =
-      itemPath ||
-      (fieldPath && fieldPath.replace(/(\[\d+\])?\.\w+$/, '').replace(/\[\d+\]$/, ''));
-    if (prefix) {
-      for (const [path, descriptor] of descriptors) {
-        if (
-          path !== fieldPath &&
-          !seen.has(path) &&
-          (path.startsWith(prefix + '.') || path.startsWith(prefix + '[')) &&
-          descriptor?.kind !== 'collection'
-        ) {
-          seen.add(path);
-          related.push({
-            path,
-            label: descriptor.label || path.split('.').pop() || 'Content',
-            type: descriptor.type || 'text',
-          });
-        }
-      }
-    }
-    let current = target instanceof Element ? target : null;
-    let depth = 0;
-    while (current && current !== document.body && depth < 3) {
-      const candidatePath = current.getAttribute(FIELD_ATTRIBUTE);
-      if (
-        candidatePath &&
-        candidatePath !== fieldPath &&
-        !seen.has(candidatePath)
-      ) {
-        const descriptor = descriptors.get(candidatePath);
-        if (descriptor?.kind !== 'collection') {
-          seen.add(candidatePath);
-          related.push({
-            path: candidatePath,
-            label: descriptor?.label || candidatePath.split('.').pop() || 'Content',
-            type: descriptor?.type || 'text',
-          });
-        }
-      }
-      current = current.parentElement;
-      depth += 1;
-    }
-    return related;
-  }
-
-  function onClick(event) {
-    if (!editMode) return;
-    const target = findEditableTarget(event.target);
-    if (!target) return;
-    event.preventDefault();
-    event.stopPropagation();
-    event.stopImmediatePropagation();
-    selectTarget(target);
-
-    const fieldTarget = target.closest('[' + FIELD_ATTRIBUTE + ']');
-    const listTarget = target.closest('[' + LIST_ATTRIBUTE + ']');
-    const itemTarget = target.closest('[' + ITEM_ATTRIBUTE + ']');
-    const fieldPath = fieldTarget?.getAttribute(FIELD_ATTRIBUTE) || null;
-    const listPath = listTarget?.getAttribute(LIST_ATTRIBUTE) || null;
-    const itemPath = itemTarget?.getAttribute(ITEM_ATTRIBUTE) || null;
-    const descriptor = fieldPath ? descriptors.get(fieldPath) : null;
-    const rect = target.getBoundingClientRect();
-    const itemIndexMatch = itemPath?.match(/\[(\d+)\](?!.*\[\d+\])/);
-
-    const clickPayload = {
-      type: CLICK_MESSAGE,
-      fieldPath,
-      fieldValue: fieldPath ? fieldValue(fieldTarget || target, fieldPath) : '',
-      elementTag: target.tagName.toLowerCase(),
-      isImage:
-        target instanceof HTMLImageElement || descriptor?.type === 'image',
-      boundingRect: {
-        top: rect.top,
-        left: rect.left,
-        width: rect.width,
-        height: rect.height,
-      },
-      collectionPath: listPath,
-      listPath,
-      itemPath,
-      itemIndex: itemIndexMatch ? Number(itemIndexMatch[1]) : null,
-      descriptorKind: fieldPath ? 'field' : listPath ? 'collection' : null,
-      relatedFields: findRelatedFields(target, fieldPath, itemPath),
-    };
-    post(clickPayload);
-    post({ ...clickPayload, type: LEGACY_CLICK_MESSAGE });
-  }
-
-  window.addEventListener('message', (event) => {
-    if (!rememberParentOrigin(event) || !event.data || typeof event.data !== 'object') {
-      return;
-    }
-    if (event.data.type !== EDIT_MODE_MESSAGE && event.data.type !== LEGACY_EDIT_MODE_MESSAGE) return;
-    editMode = event.data.editMode === true;
-    descriptors = new Map(
-      Array.isArray(event.data.fields)
-        ? event.data.fields
-            .filter((field) => field && typeof field.path === 'string')
-            .map((field) => [field.path, field])
-        : [],
-    );
-    document.documentElement.setAttribute(
-      'data-fivora-local-edit-mode',
-      String(editMode),
-    );
-    document.documentElement.setAttribute(
-      'data-fivora-local-edit-mode',
-      String(editMode),
-    );
-    if (!editMode) {
-      clearActiveTarget();
-      clearSelectedTarget();
-    }
-  });
-
-  document.addEventListener('mouseover', onPointerOver, true);
-  document.addEventListener('mouseout', onPointerOut, true);
-  document.addEventListener('click', onClick, true);
-  post({ type: READY_MESSAGE, pathname: window.location.pathname });
-  post({ type: LEGACY_READY_MESSAGE, pathname: window.location.pathname });
-})();
-`;
-
-let LOCAL_VISUAL_BRIDGE_SCRIPT = FALLBACK_LOCAL_VISUAL_BRIDGE_SCRIPT;
-try {
-  const productionBridge = require('./template-preview-focus-bridge.cjs');
-  if (typeof productionBridge === 'string' && productionBridge.trim()) {
-    LOCAL_VISUAL_BRIDGE_SCRIPT = productionBridge;
-  }
-} catch {
-  // Source checkouts can run before the generated production bridge exists.
-  // The package build always creates it; retain a compact fallback for safety.
-}
-
-function fail(message) {
-  process.stderr.write(`Local Template Lab: ${message}\n`);
-  process.exit(1);
-}
-
-try {
-  // Validate the generated iframe program as well as this outer runner file.
-  new Function(LOCAL_VISUAL_BRIDGE_SCRIPT);
-} catch (error) {
-  fail(`Visual editor bridge is invalid: ${error.message}`);
-}
-
-function parsePort(value, flag, fallback) {
-  if (value === undefined) return fallback;
-  const port = Number(value);
-  if (!Number.isInteger(port) || port < 1024 || port > 65535) {
-    fail(`${flag} must be a port between 1024 and 65535.`);
-  }
-  return port;
-}
-
-function parseArguments(argv) {
-  const args = [...argv];
-  let templatePath = '';
-  let apiPort;
-  let previewPort;
-  let skipInstall = false;
-
-  for (let index = 0; index < args.length; index += 1) {
-    const arg = args[index];
-    if (arg === '--api-port') {
-      apiPort = args[index + 1];
-      index += 1;
-    } else if (arg.startsWith('--api-port=')) {
-      apiPort = arg.slice('--api-port='.length);
-    } else if (arg === '--preview-port') {
-      previewPort = args[index + 1];
-      index += 1;
-    } else if (arg.startsWith('--preview-port=')) {
-      previewPort = arg.slice('--preview-port='.length);
-    } else if (arg === '--skip-install') {
-      skipInstall = true;
-    } else if (arg === '--help' || arg === '-h') {
-      process.stdout.write(
-        [
-          'Fivora Local Template Lab',
-          '',
-          'Usage:',
-          '  npm run lab -- <template-directory> [options]',
-          '',
-          'Options:',
-          '  --api-port <port>      Loopback controller port (default: 4174)',
-          '  --preview-port <port>  Template dev-server port (default: 4173)',
-          '  --skip-install         Do not install missing local dependencies',
-          '',
-        ].join('\n'),
-      );
-      process.exit(0);
-    } else if (arg.startsWith('-')) {
-      fail(`Unknown option: ${arg}`);
-    } else if (!templatePath) {
-      templatePath = arg;
-    } else {
-      fail(`Unexpected argument: ${arg}`);
-    }
-  }
-
-  if (!templatePath) {
-    fail('A template directory is required. Run with --help for usage.');
-  }
-
-  return {
-    templatePath: path.resolve(templatePath),
-    apiPort: parsePort(apiPort, '--api-port', DEFAULT_API_PORT),
-    previewPort: parsePort(
-      previewPort,
-      '--preview-port',
-      DEFAULT_PREVIEW_PORT,
-    ),
-    skipInstall,
-  };
-}
-
-function readJson(filePath, label) {
-  try {
-    return JSON.parse(fs.readFileSync(filePath, 'utf8'));
-  } catch (error) {
-    fail(
-      `${label} is missing or invalid at ${filePath}: ${
-        error instanceof Error ? error.message : 'unknown error'
-      }`,
-    );
-  }
-}
-
-const options = parseArguments(process.argv.slice(2));
-if (!fs.existsSync(options.templatePath)) {
-  fail(`Template directory does not exist: ${options.templatePath}`);
-}
-if (!fs.statSync(options.templatePath).isDirectory()) {
-  fail(`Template path must be a directory: ${options.templatePath}`);
-}
-
-const manifestFile = [
-  'fivora-template.json',
-  'fivora-template.json',
-].find((name) => fs.existsSync(path.join(options.templatePath, name))) || 'fivora-template.json';
-
-const manifestPath = path.join(options.templatePath, manifestFile);
-const packagePath = path.join(options.templatePath, 'package.json');
-const manifest = readJson(manifestPath, 'Template manifest');
-const packageJson = readJson(packagePath, 'package.json');
-
-if (manifest.framework !== 'nextjs-static-export') {
-  fail('Template manifest framework must be "nextjs-static-export".');
-}
-if (!packageJson.scripts || typeof packageJson.scripts.dev !== 'string') {
-  fail('Template package.json must define a dev script for live preview.');
-}
-if (typeof manifest.siteDataFile !== 'string' || !manifest.siteDataFile.trim()) {
-  fail('Template manifest siteDataFile is required.');
-}
-
-const siteDataPath = path.resolve(
-  options.templatePath,
-  manifest.siteDataFile.trim(),
-);
-const relativeSiteDataPath = path.relative(options.templatePath, siteDataPath);
-if (
-  relativeSiteDataPath.startsWith('..') ||
-  path.isAbsolute(relativeSiteDataPath)
-) {
-  fail('Template manifest siteDataFile must stay inside the template directory.');
-}
-
-const controllerToken = crypto.randomBytes(24).toString('base64url');
-const apiUrl = `http://${LOOPBACK_HOST}:${options.apiPort}`;
-const sourcePreviewUrl = `http://${LOOPBACK_HOST}:${options.previewPort}`;
-const previewUrl = `${apiUrl}${LOCAL_PREVIEW_ROUTE}`;
-const validatorPath = path.join(
-  __dirname,
-  'deneb-template-validator.cjs',
-);
-
-let shuttingDown = false;
-let devProcess = null;
-let validationProcess = null;
-let readinessTimer = null;
-let devRestartTimer = null;
-let devRestartAttempts = 0;
-const MAX_DEV_RESTART_ATTEMPTS = 5;
-let devLog = '';
-let validationLog = '';
-
-const state = {
-  protocolVersion: 2,
-  connected: true,
-  templateName:
-    typeof manifest.name === 'string' && manifest.name.trim()
-      ? manifest.name.trim()
-      : typeof packageJson.name === 'string'
-        ? packageJson.name
-        : path.basename(options.templatePath),
-  templatePath: options.templatePath,
-  previewUrl,
-  apiUrl,
-  devStatus: 'starting',
-  devError: null,
-  startedAt: new Date().toISOString(),
-  validation: {
-    status: 'idle',
-    startedAt: null,
-    completedAt: null,
-    exitCode: null,
-  },
-};
-
-function appendLog(target, chunk) {
-  const text = chunk.toString();
-  if (target === 'dev') {
-    devLog = `${devLog}${text}`.slice(-MAX_LOG_LENGTH);
-  } else {
-    validationLog = `${validationLog}${text}`.slice(-MAX_LOG_LENGTH);
-  }
-  process.stdout.write(text);
-}
-
-function statusPayload() {
-  return {
-    ...state,
-    devLog,
-    validationLog,
-  };
-}
-
-function setCorsHeaders(request, response) {
-  const origin = request.headers.origin;
-  if (origin && /^(https?:\/\/|null$)/.test(origin)) {
-    response.setHeader('Access-Control-Allow-Origin', origin);
-    response.setHeader('Vary', 'Origin');
-  }
-  response.setHeader(
-    'Access-Control-Allow-Headers',
-    'Authorization, Content-Type',
-  );
-  response.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS');
-  response.setHeader('Access-Control-Allow-Private-Network', 'true');
-  response.setHeader('Cache-Control', 'no-store');
-  response.setHeader('X-Content-Type-Options', 'nosniff');
-}
-
-function sendJson(response, statusCode, payload) {
-  const body = JSON.stringify(payload);
-  response.statusCode = statusCode;
-  response.setHeader('Content-Type', 'application/json; charset=utf-8');
-  response.setHeader('Content-Length', Buffer.byteLength(body));
-  response.end(body);
-}
-
-function isAuthorized(request) {
-  return request.headers.authorization === `Bearer ${controllerToken}`;
-}
-
-function readSiteData() {
-  try {
-    return JSON.parse(fs.readFileSync(siteDataPath, 'utf8'));
-  } catch (error) {
-    throw new Error(
-      `Unable to read ${manifest.siteDataFile}: ${
-        error instanceof Error ? error.message : 'unknown error'
-      }`,
-    );
-  }
-}
-
-function startValidation() {
-  if (validationProcess) return false;
-
-  validationLog = '';
-  state.validation = {
-    status: 'running',
-    startedAt: new Date().toISOString(),
-    completedAt: null,
-    exitCode: null,
-  };
-
-  validationProcess = spawn(
-    process.execPath,
-    [validatorPath, 'validate', options.templatePath],
-    {
-      cwd: __dirname,
-      env: process.env,
-      stdio: ['ignore', 'pipe', 'pipe'],
-    },
-  );
-  validationProcess.stdout.on('data', (chunk) => appendLog('validation', chunk));
-  validationProcess.stderr.on('data', (chunk) => appendLog('validation', chunk));
-  validationProcess.on('error', (error) => {
-    appendLog('validation', `\nUnable to start validation: ${error.message}\n`);
-  });
-  validationProcess.on('close', (code) => {
-    state.validation = {
-      ...state.validation,
-      status: code === 0 ? 'passed' : 'failed',
-      completedAt: new Date().toISOString(),
-      exitCode: code,
-    };
-    validationProcess = null;
-  });
-  return true;
-}
-
-function probePreview() {
-  if (shuttingDown || state.devStatus === 'ready') return;
-  const request = http.get(sourcePreviewUrl, (response) => {
-    response.resume();
-    if (response.statusCode && response.statusCode < 500) {
-      state.devStatus = 'ready';
-      state.devError = null;
-      devRestartAttempts = 0;
-      process.stdout.write(`\nLive preview ready: ${previewUrl}\n`);
-      return;
-    }
-    readinessTimer = setTimeout(probePreview, 600);
-  });
-  request.setTimeout(900, () => request.destroy());
-  request.on('error', () => {
-    readinessTimer = setTimeout(probePreview, 600);
-  });
-}
-
-function scheduleDevRestart(reason) {
-  if (shuttingDown || devRestartTimer) return;
-  if (devRestartAttempts >= MAX_DEV_RESTART_ATTEMPTS) {
-    state.devStatus = 'failed';
-    state.devError = reason;
-    return;
-  }
-  devRestartAttempts += 1;
-  state.devStatus = 'starting';
-  state.devError = null;
-  appendLog(
-    'dev',
-    `\nPreview server stopped during navigation (${reason}). Restarting (${devRestartAttempts}/${MAX_DEV_RESTART_ATTEMPTS})...\n`,
-  );
-  devRestartTimer = setTimeout(() => {
-    devRestartTimer = null;
-    startPreview();
-  }, 900);
-}
-
-function runInstallThenPreview() {
-  const nodeModulesPath = path.join(options.templatePath, 'node_modules');
-  if (!options.skipInstall && !fs.existsSync(nodeModulesPath)) {
-    state.devStatus = 'installing';
-    const installCommand =
-      typeof manifest.installCommand === 'string' && manifest.installCommand.trim()
-        ? manifest.installCommand.trim()
-        : 'npm install';
-    appendLog('dev', `Installing local dependencies with: ${installCommand}\n`);
-    const install = spawn(installCommand, {
-      cwd: options.templatePath,
-      env: process.env,
-      shell: true,
-      stdio: ['ignore', 'pipe', 'pipe'],
-    });
-    devProcess = install;
-    install.stdout.on('data', (chunk) => appendLog('dev', chunk));
-    install.stderr.on('data', (chunk) => appendLog('dev', chunk));
-    install.on('error', (error) => {
-      state.devStatus = 'failed';
-      state.devError = error.message;
-      devProcess = null;
-    });
-    install.on('close', (code) => {
-      devProcess = null;
-      if (code !== 0) {
-        state.devStatus = 'failed';
-        state.devError = `Dependency installation exited with code ${code}.`;
-        return;
-      }
-      startPreview();
-    });
-    return;
-  }
-
-  startPreview();
-}
-
-function startPreview() {
-  state.devStatus = 'starting';
-  state.devError = null;
-  appendLog(
-    'dev',
-    `Starting template source server on ${sourcePreviewUrl}. Source edits will hot reload.\n`,
-  );
-  const npmCmd = process.platform === 'win32' ? 'npm.cmd' : 'npm';
-  devProcess = spawn(
-    npmCmd,
-    [
-      'run',
-      'dev',
-      '--',
-      '--hostname',
-      LOOPBACK_HOST,
-      '--port',
-      String(options.previewPort),
-    ],
-    {
-      cwd: options.templatePath,
-      env: {
-        ...process.env,
-        NEXT_PUBLIC_SITE_BASE_PATH: '',
-      },
-      shell: process.platform === 'win32',
-      stdio: ['ignore', 'pipe', 'pipe'],
-    },
-  );
-  devProcess.stdout.on('data', (chunk) => appendLog('dev', chunk));
-  devProcess.stderr.on('data', (chunk) => appendLog('dev', chunk));
-  devProcess.on('error', (error) => {
-    state.devStatus = 'failed';
-    state.devError = error.message;
-    devProcess = null;
-  });
-  devProcess.on('close', (code, signal) => {
-    devProcess = null;
-    if (!shuttingDown) {
-      const reason = signal
-        ? `signal ${signal}`
-        : `exit code ${code}`;
-      scheduleDevRestart(reason);
-    }
-  });
-  probePreview();
-}
-
-function previewShellHtml() {
-  return `<!doctype html>
+const Q=require("node:crypto"),_=require("node:fs"),I=require("node:http"),f=require("node:path"),{spawn:D}=require("node:child_process"),Z=4174,q=4173,F=96*1024,v="127.0.0.1",U="/__fivora_local_preview",ee=`(()=>{const p=["market","place"].join(""),R="__"+p.toUpperCase()+"_LOCAL_VISUAL_BRIDGE__",y=p.toUpperCase()+"_PREVIEW_",h=t=>y+t;if(window.__FIVORA_LOCAL_VISUAL_BRIDGE__||window[R])return;window.__FIVORA_LOCAL_VISUAL_BRIDGE__=!0,window[R]=!0;const O="FIVORA_PREVIEW_EDIT_MODE",V=h("EDIT_MODE"),x="FIVORA_PREVIEW_ELEMENT_CLICKED",P=h("ELEMENT_CLICKED"),G="FIVORA_PREVIEW_READY",U=h("READY"),T="data-preview-field-path",L="data-preview-list-path",v="data-preview-item-path",w="data-fivora-local-edit-target",A="data-fivora-local-selected-target",C="data-"+p+"-local-edit-target",_="data-"+p+"-local-selected-target",B="[data-preview-field-path], [data-preview-list-path], [data-preview-item-path]";let r=window.parent!==window,E=new Map,l=null,i=null,m="*";const g=document.createElement("style");g.setAttribute("data-fivora-local-visual-bridge",""),g.setAttribute("data-"+p+"-local-visual-bridge",""),g.textContent=["["+w+"], ["+C+"] {","  outline: 2px solid #06b6d4 !important;","  outline-offset: 3px !important;","  cursor: pointer !important;","  box-shadow: 0 0 0 5px rgba(6, 182, 212, 0.16) !important;","}","["+A+"], ["+_+"] {","  outline: 2px dashed #06b6d4 !important;","  outline-offset: 3px !important;","  box-shadow: 0 0 0 5px rgba(6, 182, 212, 0.18) !important;","}",'html[data-fivora-local-edit-mode="true"] [data-preview-field-path],','html[data-fivora-local-edit-mode="true"] [data-preview-list-path],','html[data-fivora-local-edit-mode="true"] [data-preview-item-path],','html[data-fivora-local-edit-mode="true"] [data-preview-field-path],','html[data-fivora-local-edit-mode="true"] [data-preview-list-path],','html[data-fivora-local-edit-mode="true"] [data-preview-item-path] {',"  cursor: pointer !important;","}"].join(\`
+\`),document.head.appendChild(g),document.documentElement.setAttribute("data-fivora-local-edit-mode",String(r)),document.documentElement.setAttribute("data-fivora-local-edit-mode",String(r));function Y(t){return t.source!==window.parent?!1:(m==="*"&&t.origin&&t.origin!=="null"&&(m=t.origin),m==="*"||t.origin===m)}function I(t){window.parent.postMessage(t,m)}function b(){l&&(l.removeAttribute(w),l.removeAttribute(C)),l=null}function F(t){i&&i!==t&&(i.removeAttribute(A),i.removeAttribute(_)),i=t,i.setAttribute(A,"true"),i.setAttribute(_,"true")}function W(){i&&(i.removeAttribute(A),i.removeAttribute(_)),i=null}function S(t){return t instanceof Element?t.closest(B):null}function k(t,e){const c=E.get(e);return c&&["string","number","boolean"].includes(typeof c.value)?c.value:t instanceof HTMLImageElement?t.currentSrc||t.src||"":(t.textContent||"").trim()}function K(t){if(!r)return;const e=S(t.target);!e||e===l||(b(),l=e,l.setAttribute(w,"true"))}function N(t){if(!r||!l)return;const e=t.relatedTarget;e instanceof Node&&l.contains(e)||b()}function j(t,e,c){const f=[],s=new Set(e?[e]:[]),n=c||e&&e.replace(/(\\[\\d+\\])?\\.\\w+$/,"").replace(/\\[\\d+\\]$/,"");if(n)for(const[a,o]of E)a!==e&&!s.has(a)&&(a.startsWith(n+".")||a.startsWith(n+"["))&&o?.kind!=="collection"&&(s.add(a),f.push({path:a,label:o.label||a.split(".").pop()||"Content",type:o.type||"text"}));let d=t instanceof Element?t:null,u=0;for(;d&&d!==document.body&&u<3;){const a=d.getAttribute(T);if(a&&a!==e&&!s.has(a)){const o=E.get(a);o?.kind!=="collection"&&(s.add(a),f.push({path:a,label:o?.label||a.split(".").pop()||"Content",type:o?.type||"text"}))}d=d.parentElement,u+=1}return f}function H(t){if(!r)return;const e=S(t.target);if(!e)return;t.preventDefault(),t.stopPropagation(),t.stopImmediatePropagation(),F(e);const c=e.closest("["+T+"]"),f=e.closest("["+L+"]"),s=e.closest("["+v+"]"),n=c?.getAttribute(T)||null,d=f?.getAttribute(L)||null,u=s?.getAttribute(v)||null,a=n?E.get(n):null,o=e.getBoundingClientRect(),D=u?.match(/\\[(\\d+)\\](?!.*\\[\\d+\\])/),M={type:x,fieldPath:n,fieldValue:n?k(c||e,n):"",elementTag:e.tagName.toLowerCase(),isImage:e instanceof HTMLImageElement||a?.type==="image",boundingRect:{top:o.top,left:o.left,width:o.width,height:o.height},collectionPath:d,listPath:d,itemPath:u,itemIndex:D?Number(D[1]):null,descriptorKind:n?"field":d?"collection":null,relatedFields:j(e,n,u)};I(M),I({...M,type:P})}window.addEventListener("message",t=>{!Y(t)||!t.data||typeof t.data!="object"||t.data.type!==O&&t.data.type!==V||(r=t.data.editMode===!0,E=new Map(Array.isArray(t.data.fields)?t.data.fields.filter(e=>e&&typeof e.path=="string").map(e=>[e.path,e]):[]),document.documentElement.setAttribute("data-fivora-local-edit-mode",String(r)),document.documentElement.setAttribute("data-fivora-local-edit-mode",String(r)),r||(b(),W()))}),document.addEventListener("mouseover",K,!0),document.addEventListener("mouseout",N,!0),document.addEventListener("click",H,!0),I({type:G,pathname:window.location.pathname}),I({type:U,pathname:window.location.pathname})})();`;let w=ee;try{const e=require("./template-preview-focus-bridge.cjs");typeof e=="string"&&e.trim()&&(w=e)}catch{}const te=`var __name = typeof __name === "function" ? __name : ((target, value) => (typeof Object.defineProperty === "function" ? Object.defineProperty(target, "name", { value, configurable: true }) : target));
+`;w.includes("__name")&&!w.includes("var __name")&&(w=`${te}${w}`);function p(e){process.stderr.write(`Local Template Lab: ${e}
+`),process.exit(1)}try{new Function(w)}catch(e){p(`Visual editor bridge is invalid: ${e.message}`)}function W(e,t,a){if(e===void 0)return a;const n=Number(e);return(!Number.isInteger(n)||n<1024||n>65535)&&p(`${t} must be a port between 1024 and 65535.`),n}function ae(e){const t=[...e];let a="",n,r,s=!1;for(let m=0;m<t.length;m+=1){const d=t[m];d==="--api-port"?(n=t[m+1],m+=1):d.startsWith("--api-port=")?n=d.slice(11):d==="--preview-port"?(r=t[m+1],m+=1):d.startsWith("--preview-port=")?r=d.slice(15):d==="--skip-install"?s=!0:d==="--help"||d==="-h"?(process.stdout.write(["Fivora Local Template Lab","","Usage:","  npm run lab -- <template-directory> [options]","","Options:","  --api-port <port>      Loopback controller port (default: 4174)","  --preview-port <port>  Template dev-server port (default: 4173)","  --skip-install         Do not install missing local dependencies",""].join(`
+`)),process.exit(0)):d.startsWith("-")?p(`Unknown option: ${d}`):a?p(`Unexpected argument: ${d}`):a=d}return a||p("A template directory is required. Run with --help for usage."),{templatePath:f.resolve(a),apiPort:W(n,"--api-port",Z),previewPort:W(r,"--preview-port",q),skipInstall:s}}function B(e,t){try{return JSON.parse(_.readFileSync(e,"utf8"))}catch(a){p(`${t} is missing or invalid at ${e}: ${a instanceof Error?a.message:"unknown error"}`)}}const i=ae(process.argv.slice(2));_.existsSync(i.templatePath)||p(`Template directory does not exist: ${i.templatePath}`),_.statSync(i.templatePath).isDirectory()||p(`Template path must be a directory: ${i.templatePath}`);const ne=["fivora-template.json","fivora-template.json"].find(e=>_.existsSync(f.join(i.templatePath,e)))||"fivora-template.json",re=f.join(i.templatePath,ne),ie=f.join(i.templatePath,"package.json"),c=B(re,"Template manifest"),T=B(ie,"package.json");c.framework!=="nextjs-static-export"&&p('Template manifest framework must be "nextjs-static-export".'),(!T.scripts||typeof T.scripts.dev!="string")&&p("Template package.json must define a dev script for live preview."),(typeof c.siteDataFile!="string"||!c.siteDataFile.trim())&&p("Template manifest siteDataFile is required.");const N=f.resolve(i.templatePath,c.siteDataFile.trim()),j=f.relative(i.templatePath,N);(j.startsWith("..")||f.isAbsolute(j))&&p("Template manifest siteDataFile must stay inside the template directory.");const H=Q.randomBytes(24).toString("base64url"),y=`http://${v}:${i.apiPort}`,G=`http://${v}:${i.previewPort}`,$=`${y}${U}`,oe=f.join(__dirname,"deneb-template-validator.cjs");let P=!1,u=null,h=null,b=null,A=null,R=0;const k=5;let x="",C="";const o={protocolVersion:2,connected:!0,templateName:typeof c.name=="string"&&c.name.trim()?c.name.trim():typeof T.name=="string"?T.name:f.basename(i.templatePath),templatePath:i.templatePath,previewUrl:$,apiUrl:y,devStatus:"starting",devError:null,startedAt:new Date().toISOString(),validation:{status:"idle",startedAt:null,completedAt:null,exitCode:null}};function l(e,t){const a=t.toString();e==="dev"?x=`${x}${a}`.slice(-F):C=`${C}${a}`.slice(-F),process.stdout.write(a)}function Y(){return{...o,devLog:x,validationLog:C}}function se(e,t){const a=e.headers.origin;a&&/^(https?:\/\/|null$)/.test(a)&&(t.setHeader("Access-Control-Allow-Origin",a),t.setHeader("Vary","Origin")),t.setHeader("Access-Control-Allow-Headers","Authorization, Content-Type"),t.setHeader("Access-Control-Allow-Methods","GET, POST, OPTIONS"),t.setHeader("Access-Control-Allow-Private-Network","true"),t.setHeader("Cache-Control","no-store"),t.setHeader("X-Content-Type-Options","nosniff")}function g(e,t,a){const n=JSON.stringify(a);e.statusCode=t,e.setHeader("Content-Type","application/json; charset=utf-8"),e.setHeader("Content-Length",Buffer.byteLength(n)),e.end(n)}function le(e){return e.headers.authorization===`Bearer ${H}`}function de(){try{return JSON.parse(_.readFileSync(N,"utf8"))}catch(e){throw new Error(`Unable to read ${c.siteDataFile}: ${e instanceof Error?e.message:"unknown error"}`)}}function pe(){return h?!1:(C="",o.validation={status:"running",startedAt:new Date().toISOString(),completedAt:null,exitCode:null},h=D(process.execPath,[oe,"validate",i.templatePath],{cwd:__dirname,env:process.env,stdio:["ignore","pipe","pipe"]}),h.stdout.on("data",e=>l("validation",e)),h.stderr.on("data",e=>l("validation",e)),h.on("error",e=>{l("validation",`
+Unable to start validation: ${e.message}
+`)}),h.on("close",e=>{o.validation={...o.validation,status:e===0?"passed":"failed",completedAt:new Date().toISOString(),exitCode:e},h=null}),!0)}function V(){if(P||o.devStatus==="ready")return;const e=I.get(G,t=>{if(t.resume(),t.statusCode&&t.statusCode<500){o.devStatus="ready",o.devError=null,R=0,process.stdout.write(`
+Live preview ready: ${$}
+`);return}b=setTimeout(V,600)});e.setTimeout(900,()=>e.destroy()),e.on("error",()=>{b=setTimeout(V,600)})}function ce(e){if(!(P||A)){if(R>=k){o.devStatus="failed",o.devError=e;return}R+=1,o.devStatus="starting",o.devError=null,l("dev",`
+Preview server stopped during navigation (${e}). Restarting (${R}/${k})...
+`),A=setTimeout(()=>{A=null,M()},900)}}function ue(){const e=f.join(i.templatePath,"node_modules");if(!i.skipInstall&&!_.existsSync(e)){o.devStatus="installing";const t=typeof c.installCommand=="string"&&c.installCommand.trim()?c.installCommand.trim():"npm install";l("dev",`Installing local dependencies with: ${t}
+`);const a=D(t,{cwd:i.templatePath,env:process.env,shell:!0,stdio:["ignore","pipe","pipe"]});u=a,a.stdout.on("data",n=>l("dev",n)),a.stderr.on("data",n=>l("dev",n)),a.on("error",n=>{o.devStatus="failed",o.devError=n.message,u=null}),a.on("close",n=>{if(u=null,n!==0){o.devStatus="failed",o.devError=`Dependency installation exited with code ${n}.`;return}M()});return}M()}function M(){o.devStatus="starting",o.devError=null,l("dev",`Starting template source server on ${G}. Source edits will hot reload.
+`);const e=process.platform==="win32"?"npm.cmd":"npm";u=D(e,["run","dev","--","--hostname",v,"--port",String(i.previewPort)],{cwd:i.templatePath,env:{...process.env,NEXT_PUBLIC_SITE_BASE_PATH:""},shell:process.platform==="win32",stdio:["ignore","pipe","pipe"]}),u.stdout.on("data",t=>l("dev",t)),u.stderr.on("data",t=>l("dev",t)),u.on("error",t=>{o.devStatus="failed",o.devError=t.message,u=null}),u.on("close",(t,a)=>{if(u=null,!P){const n=a?`signal ${a}`:`exit code ${t}`;ce(n)}}),V()}function me(){return`<!doctype html>
 <html lang="en">
 <head>
   <meta charset="utf-8">
@@ -699,7 +29,7 @@ function previewShellHtml() {
   <iframe id="template-preview" title="Local template preview"></iframe>
   <script>
     (() => {
-      const BRIDGE_SOURCE = ${JSON.stringify(LOCAL_VISUAL_BRIDGE_SCRIPT)};
+      const BRIDGE_SOURCE = ${JSON.stringify(w)};
       const preview = document.getElementById('template-preview');
       const errorBox = document.getElementById('bridge-error');
       const PREVIOUS_PREVIEW_PREFIX = ['MARKET', 'PLACE'].join('') + '_PREVIEW_';
@@ -724,15 +54,19 @@ function previewShellHtml() {
             portalOrigin = event.origin;
           }
           if (portalOrigin !== '*' && event.origin !== portalOrigin) return;
-          if (event.data.type === 'FIVORA_PREVIEW_EDIT_MODE' ||
+          if (event.data.type === 'FIVORA_PREVIEW_STYLE_PATCH') {
+            const key = 'STYLE_PATCH:' + (event.data.fieldPath || event.data.targetPath || 'default');
+            savedMessages.set(key, event.data);
+          } else if (event.data.type === 'FIVORA_PREVIEW_EDIT_MODE' ||
               event.data.type === previousPreviewMessage('EDIT_MODE') ||
               event.data.type === 'FIVORA_PREVIEW_SITE_DATA' ||
               event.data.type === previousPreviewMessage('SITE_DATA') ||
               event.data.type === 'FIVORA_PREVIEW_FOCUS_PAGE' ||
-              event.data.type === previousPreviewMessage('FOCUS_PAGE')) {
+              event.data.type === previousPreviewMessage('FOCUS_PAGE') ||
+              event.data.type === 'FIVORA_PREVIEW_CONTENT_PATCH') {
             savedMessages.set(event.data.type, event.data);
           }
-          if (childReady && (String(event.data.type || '').startsWith('FIVORA_PREVIEW_') || String(event.data.type || '').startsWith(PREVIOUS_PREVIEW_PREFIX))) {
+          if (String(event.data.type || '').startsWith('FIVORA_PREVIEW_') || String(event.data.type || '').startsWith(PREVIOUS_PREVIEW_PREFIX)) {
             sendToChild(event.data);
           }
           return;
@@ -760,7 +94,8 @@ function previewShellHtml() {
         try {
           const script = preview.contentDocument.createElement('script');
           script.setAttribute('data-fivora-local-visual-bridge', '');
-          script.textContent = BRIDGE_SOURCE;
+          const NAME_SHIM = "var __name = typeof __name === 'function' ? __name : ((target, value) => (typeof Object.defineProperty === 'function' ? Object.defineProperty(target, 'name', { value, configurable: true }) : target)); ";
+          script.textContent = (BRIDGE_SOURCE.includes('__name') && !BRIDGE_SOURCE.includes('var __name') ? NAME_SHIM : '') + BRIDGE_SOURCE;
           preview.contentDocument.head.appendChild(script);
           preview.contentWindow.__FIVORA_LOCAL_VISUAL_BRIDGE_ATTACHED__ = true;
           script.remove();
@@ -783,247 +118,25 @@ function previewShellHtml() {
 
       preview.src = '/';
     })();
-  </script>
+  <\/script>
 </body>
-</html>`;
-}
-
-function ignoreAbortedStreamError(error) {
-  if (!error || typeof error !== 'object') return false;
-  const code = 'code' in error ? String(error.code) : '';
-  return (
-    code === 'ECONNRESET' ||
-    code === 'ECONNABORTED' ||
-    code === 'EPIPE' ||
-    code === 'ERR_STREAM_DESTROYED'
-  );
-}
-
-function proxyPreviewRequest(request, response) {
-  const headers = { ...request.headers };
-  headers.host = `${LOOPBACK_HOST}:${options.previewPort}`;
-  delete headers['accept-encoding'];
-  delete headers.authorization;
-
-  const upstream = http.request(
-    {
-      hostname: LOOPBACK_HOST,
-      port: options.previewPort,
-      method: request.method,
-      path: request.url,
-      headers,
-    },
-    (upstreamResponse) => {
-      response.writeHead(
-        upstreamResponse.statusCode || 502,
-        upstreamResponse.statusMessage,
-        upstreamResponse.headers,
-      );
-      upstreamResponse.on('error', (error) => {
-        if (!ignoreAbortedStreamError(error)) {
-          appendLog('dev', `\nPreview proxy upstream error: ${error.message}\n`);
-        }
-        if (!response.writableEnded) response.destroy();
-      });
-      response.on('error', (error) => {
-        if (!ignoreAbortedStreamError(error)) {
-          appendLog('dev', `\nPreview proxy response error: ${error.message}\n`);
-        }
-        upstreamResponse.destroy();
-      });
-      upstreamResponse.pipe(response);
-    },
-  );
-  upstream.on('error', (error) => {
-    if (!ignoreAbortedStreamError(error)) {
-      appendLog('dev', `\nPreview proxy request error: ${error.message}\n`);
-    }
-    if (!response.headersSent) {
-      sendJson(response, 502, {
-        message: `Local preview is not ready: ${error.message}`,
-      });
-    } else if (!response.writableEnded) {
-      response.destroy();
-    }
-  });
-  request.on('error', (error) => {
-    if (!ignoreAbortedStreamError(error)) {
-      appendLog('dev', `\nPreview proxy client error: ${error.message}\n`);
-    }
-    upstream.destroy();
-  });
-  request.pipe(upstream);
-}
-
-const server = http.createServer((request, response) => {
-  const url = new URL(request.url || '/', apiUrl);
-  if (request.method === 'GET' && url.pathname === LOCAL_PREVIEW_ROUTE) {
-    const html = previewShellHtml();
-    response.writeHead(200, {
-      'Cache-Control': 'no-store',
-      'Content-Length': Buffer.byteLength(html),
-      'Content-Type': 'text/html; charset=utf-8',
-    });
-    response.end(html);
-    return;
-  }
-  if (!url.pathname.startsWith('/api/')) {
-    proxyPreviewRequest(request, response);
-    return;
-  }
-
-  setCorsHeaders(request, response);
-  if (request.method === 'OPTIONS') {
-    response.statusCode = 204;
-    response.end();
-    return;
-  }
-
-  if (!isAuthorized(request)) {
-    sendJson(response, 401, { message: 'Invalid Local Template Lab token.' });
-    return;
-  }
-
-  if (request.method === 'GET' && url.pathname === '/api/status') {
-    sendJson(response, 200, statusPayload());
-    return;
-  }
-
-  if (request.method === 'GET' && url.pathname === '/api/site-data') {
-    try {
-      sendJson(response, 200, {
-        manifest,
-        siteData: readSiteData(),
-        siteDataFile: manifest.siteDataFile,
-      });
-    } catch (error) {
-      sendJson(response, 500, {
-        message: error instanceof Error ? error.message : 'Unable to read site data.',
-      });
-    }
-    return;
-  }
-
-  if (request.method === 'POST' && url.pathname === '/api/validate') {
-    if (!startValidation()) {
-      sendJson(response, 409, { message: 'Validation is already running.' });
-      return;
-    }
-    sendJson(response, 202, statusPayload());
-    return;
-  }
-
-  sendJson(response, 404, { message: 'Local Template Lab endpoint not found.' });
-});
-
-function pipeProxySockets(clientSocket, upstreamSocket) {
-  const closeBoth = () => {
-    if (!clientSocket.destroyed) clientSocket.destroy();
-    if (!upstreamSocket.destroyed) upstreamSocket.destroy();
-  };
-  const onSocketError = (error) => {
-    if (!ignoreAbortedStreamError(error)) {
-      appendLog('dev', `\nPreview proxy socket error: ${error.message}\n`);
-    }
-    closeBoth();
-  };
-  clientSocket.on('error', onSocketError);
-  upstreamSocket.on('error', onSocketError);
-  clientSocket.on('close', () => {
-    if (!upstreamSocket.destroyed) upstreamSocket.end();
-  });
-  upstreamSocket.on('close', () => {
-    if (!clientSocket.destroyed) clientSocket.end();
-  });
-  upstreamSocket.pipe(clientSocket);
-  clientSocket.pipe(upstreamSocket);
-}
-
-server.on('upgrade', (request, socket, head) => {
-  if (request.url?.startsWith('/api/')) {
-    socket.destroy();
-    return;
-  }
-  socket.on('error', (error) => {
-    if (!ignoreAbortedStreamError(error)) {
-      appendLog('dev', `\nPreview proxy upgrade client error: ${error.message}\n`);
-    }
-  });
-  const headers = { ...request.headers };
-  headers.host = `${LOOPBACK_HOST}:${options.previewPort}`;
-  const upstreamRequest = http.request({
-    hostname: LOOPBACK_HOST,
-    port: options.previewPort,
-    method: request.method,
-    path: request.url,
-    headers,
-  });
-  upstreamRequest.on('upgrade', (upstreamResponse, upstreamSocket, upstreamHead) => {
-    const responseHeaders = Object.entries(upstreamResponse.headers)
-      .flatMap(([name, value]) => {
-        const values = Array.isArray(value) ? value : [value];
-        return values
-          .filter((entry) => entry !== undefined)
-          .map((entry) => `${name}: ${entry}`);
-      })
-      .join('\r\n');
-    socket.write(
-      `HTTP/1.1 ${upstreamResponse.statusCode || 101} ${upstreamResponse.statusMessage || 'Switching Protocols'}\r\n${responseHeaders}\r\n\r\n`,
-    );
-    if (head.length) upstreamSocket.write(head);
-    if (upstreamHead.length) socket.write(upstreamHead);
-    pipeProxySockets(socket, upstreamSocket);
-  });
-  upstreamRequest.on('error', (error) => {
-    if (!ignoreAbortedStreamError(error)) {
-      appendLog('dev', `\nPreview proxy upgrade upstream error: ${error.message}\n`);
-    }
-    if (!socket.destroyed) socket.destroy();
-  });
-  upstreamRequest.end();
-});
-
-function stopChild(child) {
-  if (!child || child.killed) return;
-  child.kill('SIGTERM');
-}
-
-function shutdown() {
-  if (shuttingDown) return;
-  shuttingDown = true;
-  if (readinessTimer) clearTimeout(readinessTimer);
-  if (devRestartTimer) clearTimeout(devRestartTimer);
-  stopChild(validationProcess);
-  stopChild(devProcess);
-  server.close(() => process.exit(0));
-  setTimeout(() => process.exit(0), 1500).unref();
-}
-
-server.on('error', (error) => {
-  fail(
-    `Unable to start loopback controller at ${apiUrl}: ${
-      error instanceof Error ? error.message : 'unknown error'
-    }`,
-  );
-});
-
-server.listen(options.apiPort, LOOPBACK_HOST, () => {
-  process.stdout.write(
-    [
-      '',
-      'Fivora Local Template Lab is running.',
-      `Template: ${state.templateName}`,
-      `Controller URL: ${apiUrl}`,
-      `Connection token: ${controllerToken}`,
-      `Preview URL: ${previewUrl}`,
-      '',
-      'Paste the controller URL and connection token into Developer Portal > Local Test Lab.',
-      'Press Ctrl+C to stop. No template files are uploaded by this process.',
-      '',
-    ].join('\n'),
-  );
-  runInstallThenPreview();
-});
-
-process.on('SIGINT', shutdown);
-process.on('SIGTERM', shutdown);
+</html>`}function E(e){if(!e||typeof e!="object")return!1;const t="code"in e?String(e.code):"";return t==="ECONNRESET"||t==="ECONNABORTED"||t==="EPIPE"||t==="ERR_STREAM_DESTROYED"}function fe(e,t){const a={...e.headers};a.host=`${v}:${i.previewPort}`,delete a["accept-encoding"],delete a.authorization;const n=I.request({hostname:v,port:i.previewPort,method:e.method,path:e.url,headers:a},r=>{t.writeHead(r.statusCode||502,r.statusMessage,r.headers),r.on("error",s=>{E(s)||l("dev",`
+Preview proxy upstream error: ${s.message}
+`),t.writableEnded||t.destroy()}),t.on("error",s=>{E(s)||l("dev",`
+Preview proxy response error: ${s.message}
+`),r.destroy()}),r.pipe(t)});n.on("error",r=>{E(r)||l("dev",`
+Preview proxy request error: ${r.message}
+`),t.headersSent?t.writableEnded||t.destroy():g(t,502,{message:`Local preview is not ready: ${r.message}`})}),e.on("error",r=>{E(r)||l("dev",`
+Preview proxy client error: ${r.message}
+`),n.destroy()}),e.pipe(n)}const S=I.createServer((e,t)=>{const a=new URL(e.url||"/",y);if(e.method==="GET"&&a.pathname===U){const n=me();t.writeHead(200,{"Cache-Control":"no-store","Content-Length":Buffer.byteLength(n),"Content-Type":"text/html; charset=utf-8"}),t.end(n);return}if(!a.pathname.startsWith("/api/")){fe(e,t);return}if(se(e,t),e.method==="OPTIONS"){t.statusCode=204,t.end();return}if(!le(e)){g(t,401,{message:"Invalid Local Template Lab token."});return}if(e.method==="GET"&&a.pathname==="/api/status"){g(t,200,Y());return}if(e.method==="GET"&&a.pathname==="/api/site-data"){try{g(t,200,{manifest:c,siteData:de(),siteDataFile:c.siteDataFile})}catch(n){g(t,500,{message:n instanceof Error?n.message:"Unable to read site data."})}return}if(e.method==="POST"&&a.pathname==="/api/validate"){if(!pe()){g(t,409,{message:"Validation is already running."});return}g(t,202,Y());return}g(t,404,{message:"Local Template Lab endpoint not found."})});function ve(e,t){const a=()=>{e.destroyed||e.destroy(),t.destroyed||t.destroy()},n=r=>{E(r)||l("dev",`
+Preview proxy socket error: ${r.message}
+`),a()};e.on("error",n),t.on("error",n),e.on("close",()=>{t.destroyed||t.end()}),t.on("close",()=>{e.destroyed||e.end()}),t.pipe(e),e.pipe(t)}S.on("upgrade",(e,t,a)=>{if(e.url?.startsWith("/api/")){t.destroy();return}t.on("error",s=>{E(s)||l("dev",`
+Preview proxy upgrade client error: ${s.message}
+`)});const n={...e.headers};n.host=`${v}:${i.previewPort}`;const r=I.request({hostname:v,port:i.previewPort,method:e.method,path:e.url,headers:n});r.on("upgrade",(s,m,d)=>{const J=Object.entries(s.headers).flatMap(([z,O])=>(Array.isArray(O)?O:[O]).filter(L=>L!==void 0).map(L=>`${z}: ${L}`)).join(`\r
+`);t.write(`HTTP/1.1 ${s.statusCode||101} ${s.statusMessage||"Switching Protocols"}\r
+${J}\r
+\r
+`),a.length&&m.write(a),d.length&&t.write(d),ve(t,m)}),r.on("error",s=>{E(s)||l("dev",`
+Preview proxy upgrade upstream error: ${s.message}
+`),t.destroyed||t.destroy()}),r.end()});function K(e){!e||e.killed||e.kill("SIGTERM")}function X(){P||(P=!0,b&&clearTimeout(b),A&&clearTimeout(A),K(h),K(u),S.close(()=>process.exit(0)),setTimeout(()=>process.exit(0),1500).unref())}S.on("error",e=>{p(`Unable to start loopback controller at ${y}: ${e instanceof Error?e.message:"unknown error"}`)}),S.listen(i.apiPort,v,()=>{process.stdout.write(["","Fivora Local Template Lab is running.",`Template: ${o.templateName}`,`Controller URL: ${y}`,`Connection token: ${H}`,`Preview URL: ${$}`,"","Paste the controller URL and connection token into Developer Portal > Local Test Lab.","Press Ctrl+C to stop. No template files are uploaded by this process.",""].join(`
+`)),ue()}),process.on("SIGINT",X),process.on("SIGTERM",X);