merge main 07094d9 into feat/voice-outlines

build/application-html.js

@@ -1,40 +0,0 @@
-import { readFileSync } from 'node:fs';
-
-export const APPLICATION_TEMPLATES = Object.freeze([
-  'scene-chrome',
-  'cockpit',
-  'display-controls',
-  'command-dock',
-  'layer-panels',
-  'context',
-  'welcome',
-  'provider-settings',
-  'hud-loading',
-]);
-const allowed = new Set(APPLICATION_TEMPLATES);
-
-/** Expand only known component templates; markers cannot name filesystem paths. */
-export function expandApplicationHtml(html) {
-  return html.replace(
-    /^[ \t]*<!-- gev:template ([^\s]+) -->\r?\n?/gm,
-    (_, name) => {
-      if (!allowed.has(name))
-        throw new Error(`Unknown application template: ${name}`);
-      return readFileSync(
-        new URL(`../src/ui/templates/${name}.html`, import.meta.url),
-        'utf8',
-      );
-    },
-  );
-}
-
-/** Assemble static application markup before Vite processes scripts and assets. */
-export function applicationHtmlPlugin() {
-  return {
-    name: 'application-component-templates',
-    transformIndexHtml: {
-      order: 'pre',
-      handler: expandApplicationHtml,
-    },
-  };
-}

build/registerVue.js

@@ -0,0 +1,5 @@
+import { register } from 'node:module';
+
+// Lets Node import single-file components: `node --import=<this file>`.
+// Hosts reach it as `<core package>/build/register-vue`.
+register('./vueLoader.js', import.meta.url);

build/vite.js

@@ -1,6 +1,7 @@
 import { fileURLToPath } from 'node:url';
-import { applicationHtmlPlugin } from './application-html.js';
 import cesium from 'vite-plugin-cesium';
+import vue from '@vitejs/plugin-vue';
+import { VUE_PLUGIN_OPTIONS } from './vueOptions.js';
 import { DEFAULT_ALLOWED_HOSTS, hostCheckPlugin } from './allowedHosts.js';
 import { embedFramingPlugin } from './embed-framing.js';
 import { panelBuildPlugin } from './panel.js';
@@ -179,7 +180,8 @@ export function createBrowserViteConfig({
       // Next, so no provider route answers a Host the server does not allow.
       hostCheckPlugin(),
       cesium(),
-      applicationHtmlPlugin(),
+      // Application views are Vue single-file components.
+      vue(VUE_PLUGIN_OPTIONS),
       ...plugins,
       embedFramingPlugin(),
       panelBuildPlugin(),
@@ -233,6 +235,12 @@ export function createBrowserViteConfig({
     // framing + CSP hardening (one constant, no drift).
     preview: { headers: BROWSER_HEADERS },
     define: {
+      // vue-i18n holds the locale and catalogs; Core formats the messages
+      // (src/ui/i18n.js), so the build drops vue-i18n's message compiler.
+      __VUE_I18N_FULL_INSTALL__: 'false',
+      __VUE_I18N_LEGACY_API__: 'false',
+      __INTLIFY_PROD_DEVTOOLS__: 'false',
+      __INTLIFY_DROP_MESSAGE_COMPILER__: 'true',
       'import.meta.env.GOOGLE_MAPS_API_KEY': JSON.stringify(googleApiKey),
       'import.meta.env.CESIUM_ION_TOKEN': JSON.stringify(cesiumToken),
       // Only expose a validated URL or the explicit disabled sentinel.

build/vueLoader.js

@@ -0,0 +1,53 @@
+import { readFile } from 'node:fs/promises';
+import { fileURLToPath } from 'node:url';
+import { compileScript, compileTemplate, parse } from 'vue/compiler-sfc';
+import { VUE_TEMPLATE_OPTIONS } from './vueOptions.js';
+
+/**
+ * Compile a single-file component to an ES module for Node, so unit tests (the
+ * application's and a host's) can import components without a bundler.
+ * Styles are dropped: tests read the global stylesheet separately.
+ */
+export function compileVueModule(source, filename) {
+  // The template is parsed with the SFC; parse it as the browser build does.
+  const { descriptor, errors } = parse(source, {
+    filename,
+    templateParseOptions: VUE_TEMPLATE_OPTIONS.compilerOptions,
+  });
+  if (errors.length) throw errors[0];
+  const id = filename;
+  if (descriptor.scriptSetup) {
+    return compileScript(descriptor, {
+      id,
+      inlineTemplate: true,
+      templateOptions: VUE_TEMPLATE_OPTIONS,
+    }).content;
+  }
+  const script = descriptor.script
+    ? compileScript(descriptor, { id, genDefaultAs: '__sfc__' }).content
+    : 'const __sfc__ = {};';
+  let template = '';
+  if (descriptor.template) {
+    const compiled = compileTemplate({
+      source: descriptor.template.content,
+      filename,
+      id,
+      ...VUE_TEMPLATE_OPTIONS,
+    });
+    if (compiled.errors.length) throw compiled.errors[0];
+    template = compiled.code;
+  }
+  return `${script}\n${template}\nif (typeof render === 'function') __sfc__.render = render;\nexport default __sfc__;\n`;
+}
+
+/** Node module hook: load `.vue` files as compiled modules. */
+export async function load(url, context, nextLoad) {
+  if (!url.endsWith('.vue')) return nextLoad(url, context);
+  const filename = fileURLToPath(url);
+  const source = await readFile(filename, 'utf8');
+  return {
+    format: 'module',
+    source: compileVueModule(source, filename),
+    shortCircuit: true,
+  };
+}

build/vueOptions.js

@@ -0,0 +1,16 @@
+/**
+ * Template options shared by the browser build, the boundary check and the
+ * unit-test loader. Whitespace between nodes is kept (as a single space) so
+ * an application view renders as its static markup did; Prettier formats
+ * single-file components with strict whitespace sensitivity to match. Asset
+ * URLs such as `/pin.svg` stay literal instead of becoming module imports.
+ */
+export const VUE_TEMPLATE_OPTIONS = Object.freeze({
+  compilerOptions: Object.freeze({ whitespace: 'preserve' }),
+  transformAssetUrls: false,
+});
+
+/** `@vitejs/plugin-vue` options for application builds. */
+export const VUE_PLUGIN_OPTIONS = Object.freeze({
+  template: VUE_TEMPLATE_OPTIONS,
+});