feat(editor): command and event console, rename the protocol feature

Adds an opt-in journal to the engine event system. set_journal_enabled
turns it on, emit_event and the command dispatch record into it, and
drain_journal takes what accumulated. A shipping build leaves it off and
pays no record keeping cost.

The editor turns it on and surfaces it as a command and event console,
opened from View, Toggle command console. The top half is a live log of
the participant cycle, every command applied and every event published,
tagged by cycle and colored apart. The bottom half is a builder that
constructs a participant command and submits it through push_command, the
same path a script takes, so the panel both watches the cycle and drives
it by hand. New protocol messages carry the log and the submitted command.

Also renames the nightshade-api editor-protocol feature to protocol and
editor-protocol-agent to protocol-agent. The feature is the whole editor
wire format, not tied to the editor as its only consumer, so it is named
for what it is. The scripting and editor agent docs are updated.

Author: matthewjberger

apps/editor/Cargo.toml

@@ -13,14 +13,14 @@ edition = "2024"
 [features]
 # The external agent relay (page <-> MCP bridge websocket). Off by default so a
 # deployed build never opens a localhost socket; enable for agent development.
-agent = ["nightshade-api/editor-protocol-agent"]
+agent = ["nightshade-api/protocol-agent"]
 
 [dependencies]
 nightshade = { path = "../../crates/nightshade", features = [
     "networking",
 ] }
 nightshade-api = { path = "../../crates/nightshade-api", default-features = false, features = [
-    "editor-protocol",
+    "protocol",
 ] }
 leptos = { version = "0.7", features = ["csr"] }
 postcard = { version = "1", features = ["alloc"] }

apps/editor/desktop/Cargo.toml

@@ -18,7 +18,7 @@ default = ["agent", "networking"]
 # View menu toggle or the --mcp flag.
 agent = [
     "dep:nightshade-api",
-    "nightshade-api/editor-protocol-agent",
+    "nightshade-api/protocol-agent",
     "dep:enum2schema",
     "dep:tokio",
     "dep:tokio-tungstenite",

apps/editor/public/styles.css

@@ -1417,3 +1417,181 @@ input[type="range"] {
   background: var(--accent);
   color: var(--bg);
 }
+
+/* Command and event console */
+.console {
+  position: fixed;
+  right: 332px;
+  bottom: 30px;
+  width: 440px;
+  max-height: 52vh;
+  z-index: 40;
+  border: 1px solid var(--panel-border);
+  border-radius: 12px;
+  background: color-mix(in srgb, var(--panel) 92%, transparent);
+  backdrop-filter: blur(12px);
+  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.45);
+  transition: opacity 0.16s ease, transform 0.16s ease;
+}
+
+.console.closed {
+  opacity: 0;
+  transform: translateY(8px);
+  pointer-events: none;
+}
+
+.console-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 10px 14px;
+  border-bottom: 1px solid var(--panel-border);
+}
+
+.console-title {
+  font-size: 12px;
+  font-weight: 600;
+  letter-spacing: 0.04em;
+  text-transform: uppercase;
+  color: var(--text);
+  opacity: 0.7;
+}
+
+.console-clear {
+  font-size: 11px;
+  padding: 3px 10px;
+  border-radius: 6px;
+  border: 1px solid var(--panel-border);
+  background: transparent;
+  color: var(--text);
+  cursor: pointer;
+}
+
+.console-clear:hover {
+  border-color: var(--accent);
+  color: var(--accent);
+}
+
+.console-log {
+  flex: 1;
+  overflow-y: auto;
+  padding: 8px;
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+  font-family: ui-monospace, "Cascadia Code", "SF Mono", Menlo, monospace;
+  font-size: 11.5px;
+  min-height: 120px;
+  max-height: 32vh;
+}
+
+.console-row {
+  display: grid;
+  grid-template-columns: 38px 30px auto 1fr;
+  align-items: baseline;
+  gap: 8px;
+  padding: 3px 8px;
+  border-radius: 6px;
+  border-left: 2px solid transparent;
+}
+
+.console-row:hover {
+  background: color-mix(in srgb, var(--text) 6%, transparent);
+}
+
+.console-command {
+  border-left-color: #60a5fa;
+}
+
+.console-event {
+  border-left-color: var(--accent);
+}
+
+.console-cycle {
+  color: var(--text);
+  opacity: 0.4;
+  text-align: right;
+}
+
+.console-tag {
+  font-size: 9.5px;
+  text-transform: uppercase;
+  letter-spacing: 0.06em;
+  font-weight: 700;
+}
+
+.console-command .console-tag {
+  color: #60a5fa;
+}
+
+.console-event .console-tag {
+  color: var(--accent);
+}
+
+.console-label {
+  color: var(--text);
+  font-weight: 600;
+  white-space: nowrap;
+}
+
+.console-detail {
+  color: var(--text);
+  opacity: 0.6;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.console-builder {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  padding: 12px 14px;
+  border-top: 1px solid var(--panel-border);
+}
+
+.console-row-fields {
+  display: flex;
+  gap: 8px;
+}
+
+.console-row-fields.hidden {
+  display: none;
+}
+
+.console-select,
+.console-input {
+  flex: 1;
+  min-width: 0;
+  padding: 7px 10px;
+  font-size: 12px;
+  border-radius: 7px;
+  border: 1px solid var(--panel-border);
+  background: var(--bg);
+  color: var(--text);
+}
+
+.console-entity {
+  max-width: 120px;
+}
+
+.console-select:focus,
+.console-input:focus {
+  outline: none;
+  border-color: var(--accent);
+}
+
+.console-submit {
+  padding: 9px 12px;
+  font-size: 12px;
+  font-weight: 600;
+  border-radius: 8px;
+  border: 1px solid var(--accent);
+  background: var(--accent);
+  color: var(--bg);
+  cursor: pointer;
+}
+
+.console-submit:hover {
+  filter: brightness(1.08);
+}

apps/editor/src/app.rs

@@ -6,6 +6,7 @@ use nightshade_api::editor::protocol::ClientMessage;
 use crate::bridge::{Bridge, send};
 use crate::components::browsers::BrowserOverlay;
 use crate::components::command_palette::CommandPalette;
+use crate::components::console::Console;
 use crate::components::inspector::Inspector;
 use crate::components::left_panel::LeftPanel;
 use crate::components::loader::Loader;
@@ -148,6 +149,7 @@ pub fn App() -> impl IntoView {
             <LeftPanel bridge state />
             <Viewport bridge state />
             <Inspector bridge state />
+            <Console bridge state />
             <StatusBar state />
             <NavGizmo bridge state />
             <BrowserOverlay bridge state />

apps/editor/src/bridge.rs

@@ -52,6 +52,15 @@ pub fn connect(offscreen: OffscreenCanvas, width: f32, height: f32, state: Edito
             WorkerMessage::Camera { right, up, forward } => {
                 state.camera_basis.set([right, up, forward]);
             }
+            WorkerMessage::CommandLog { entries } => {
+                state.command_log.update(|log| {
+                    log.extend(entries);
+                    let overflow = log.len().saturating_sub(500);
+                    if overflow > 0 {
+                        log.drain(0..overflow);
+                    }
+                });
+            }
             WorkerMessage::Scene { rows } => state.scene.set(rows),
             WorkerMessage::Cameras { entries } => state.cameras.set(entries),
             WorkerMessage::Selected { detail } => {

apps/editor/src/components.rs

@@ -2,6 +2,7 @@ pub mod browsers;
 #[cfg(feature = "agent")]
 pub mod chat;
 pub mod command_palette;
+pub mod console;
 pub mod fields;
 pub mod inspector;
 pub mod left_panel;