pmx-canvas 0.4.2 → 0.4.4

package/src/client/theme/surface-theme.css

@@ -218,32 +218,32 @@
 }
 
 :root[data-theme="ember"] {
-  /* ── Core palette (ember · charcoal + vivid warm orange) ─── */
-  --c-bg: #0E0E11;
-  --c-panel: #17181D;
-  --c-panel-soft: #121317;
-  --c-line: #2A2C34;
-  --c-text: #ECEDF0;
-  --c-text-soft: #C9CCD4;
-  --c-muted: #8E939F;
-  --c-dim: #5F646E;
-  --c-accent: #FF5C2E;
+  /* ── Core palette (ember · neutral charcoal + vivid orange-red) ─── */
+  --c-bg: #0B0B0C;
+  --c-panel: #161618;
+  --c-panel-soft: #101012;
+  --c-line: #29292C;
+  --c-text: #EDEBE6;
+  --c-text-soft: #CBC9C2;
+  --c-muted: #96948D;
+  --c-dim: #66655F;
+  --c-accent: #F34E1C;
   --c-ok: #4CC38A;
   --c-warn: #F5B944;
   --c-warn-alt: #FFB300;
   --c-danger: #F0566A;
   --c-purple: #A78BFA;
 
-  --color-bg: #0E0E11;
-  --color-panel: #17181D;
-  --color-surface: #121317;
-  --color-border: #2A2C34;
-  --color-text: #ECEDF0;
-  --color-text-primary: #ECEDF0;
-  --color-text-secondary: #C9CCD4;
-  --color-text-muted: #8E939F;
-  --color-text-dim: #5F646E;
-  --color-accent: #FF5C2E;
+  --color-bg: #0B0B0C;
+  --color-panel: #161618;
+  --color-surface: #101012;
+  --color-border: #29292C;
+  --color-text: #EDEBE6;
+  --color-text-primary: #EDEBE6;
+  --color-text-secondary: #CBC9C2;
+  --color-text-muted: #96948D;
+  --color-text-dim: #66655F;
+  --color-accent: #F34E1C;
   --color-success: #4CC38A;
   --color-warning: #F5B944;
   --color-danger: #F0566A;
@@ -281,6 +281,38 @@
   --color-danger: #E57373;
 }
 
+:root[data-theme="volt"] {
+  /* ── Core palette (volt · green-tinted charcoal + coral) ── */
+  --c-bg: #0B0D0B;
+  --c-panel: #171A17;
+  --c-panel-soft: #111311;
+  --c-line: #272A27;
+  --c-text: #F6FFF5;
+  --c-text-soft: #CBD3CA;
+  --c-muted: #9CA49C;
+  --c-dim: #626962;
+  --c-accent: #F34E3F;
+  --c-ok: #52C880;
+  --c-warn: #E4C465;
+  --c-warn-alt: #FFB300;
+  --c-danger: #D67670;
+  --c-purple: #BC8FB4;
+
+  --color-bg: #0B0D0B;
+  --color-panel: #171A17;
+  --color-surface: #111311;
+  --color-border: #272A27;
+  --color-text: #F6FFF5;
+  --color-text-primary: #F6FFF5;
+  --color-text-secondary: #CBD3CA;
+  --color-text-muted: #9CA49C;
+  --color-text-dim: #626962;
+  --color-accent: #F34E3F;
+  --color-success: #52C880;
+  --color-warning: #E4C465;
+  --color-danger: #D67670;
+}
+
 html,
 body {
   margin: 0;

package/src/server/operations/ops/canvas-wire.ts

@@ -10,7 +10,8 @@ import { z } from 'zod';
 import { normalizeCanvasTheme } from '../../canvas-db.js';
 import { applyCanvasNodeUpdates } from '../../canvas-operations.js';
 import { canvasState } from '../../canvas-state.js';
-import { defineOperation, type Operation } from '../types.js';
+import { CANVAS_THEMES, isCanvasTheme } from '../../../shared/themes.js';
+import { defineOperation, OperationError, type Operation } from '../types.js';
 
 const emptyShape = {};
 const emptySchema = z.looseObject(emptyShape);
@@ -32,7 +33,7 @@ const themeSetShape = {
     .unknown()
     .optional()
     .describe(
-      'Theme name from the canvas theme registry (e.g. dark, light, high-contrast, midnight, sepia, arctic, ember, forest)',
+      'Theme name from the canvas theme registry (e.g. dark, light, high-contrast, midnight, sepia, arctic, ember, forest, volt)',
     ),
 };
 const themeSetSchema = z.looseObject(themeSetShape);
@@ -47,6 +48,13 @@ const themeSetOperation = defineOperation<z.infer<typeof themeSetSchema>, Record
     path: '/api/canvas/theme',
   },
   handler: (input, ctx) => {
+    // Reject unknown names instead of silently keeping the prior theme
+    // (0.4.2 report: the soft-accept made typos look like successes).
+    if (input.theme !== undefined && !isCanvasTheme(input.theme)) {
+      throw new OperationError(
+        `Unknown theme ${JSON.stringify(input.theme)}. Valid themes: ${CANVAS_THEMES.join(', ')}.`,
+      );
+    }
     const theme = normalizeCanvasTheme(input.theme, canvasState.theme);
     const next = canvasState.setTheme(theme);
     ctx.emit('theme-changed', { theme: next });

package/src/server/server.ts

@@ -977,12 +977,23 @@ function canvasSpaHtml(): string {
           : 'PMX Canvas hit a browser error while loading.';
         actions.hidden = false;
       });
-      setTimeout(function () {
+      var showNotBooted = function () {
         if (!bootstrap || !copy || !actions) return;
         if (bootstrap.classList.contains('ready')) return;
         copy.textContent = 'PMX Canvas did not finish booting. Reload the canvas or restart the server.';
         actions.hidden = false;
-      }, 4000);
+      };
+      var bootDeadline = setTimeout(showNotBooted, 4000);
+      // The client dispatches this when the SSE watchdog falls back to the
+      // polling transport mid-boot (buffering proxies): restart the deadline
+      // instead of alarming while the fallback is already recovering.
+      window.addEventListener('pmx-canvas-boot-extend', function () {
+        if (!bootstrap || bootstrap.classList.contains('ready')) return;
+        clearTimeout(bootDeadline);
+        if (copy) copy.textContent = 'Live stream blocked by a proxy — switching to polling...';
+        if (actions) actions.hidden = true;
+        bootDeadline = setTimeout(showNotBooted, 8000);
+      });
     })();
   </script>
   ${

package/src/shared/themes.ts

@@ -19,6 +19,7 @@ export const CANVAS_THEMES = [
   'arctic',
   'ember',
   'forest',
+  'volt',
 ] as const;
 
 export type CanvasThemeName = (typeof CANVAS_THEMES)[number];
@@ -48,8 +49,9 @@ export const CANVAS_THEME_META: Record<CanvasThemeName, CanvasThemeMeta> = {
   midnight: { label: 'Midnight', scheme: 'dark', swatchBg: '#0A0D1C', swatchAccent: '#8B96FF' },
   sepia: { label: 'Sepia', scheme: 'light', swatchBg: '#F2E7D5', swatchAccent: '#B4632C' },
   arctic: { label: 'Arctic', scheme: 'dark', swatchBg: '#20242E', swatchAccent: '#7FC8DE' },
-  ember: { label: 'Ember', scheme: 'dark', swatchBg: '#0E0E11', swatchAccent: '#FF5C2E' },
+  ember: { label: 'Ember', scheme: 'dark', swatchBg: '#0B0B0C', swatchAccent: '#F34E1C' },
   forest: { label: 'Forest', scheme: 'dark', swatchBg: '#0C1712', swatchAccent: '#5CCF8F' },
+  volt: { label: 'Volt', scheme: 'dark', swatchBg: '#0B0D0B', swatchAccent: '#F34E3F' },
 };
 
 /** Collapse a theme to the dark/light scheme embedded dark|light-only viewers understand. */