feat(create-rezi): add starship template and register scaffold

Author: RtlZeroMemory

packages/create-rezi/src/__tests__/scaffold.test.ts

@@ -29,10 +29,21 @@ test("normalizeTemplateName accepts friendly aliases", () => {
   assert.equal(normalizeTemplateName("mini"), "minimal");
   assert.equal(normalizeTemplateName("basic"), "minimal");
   assert.equal(normalizeTemplateName("utility"), "minimal");
+  assert.equal(normalizeTemplateName("starship"), "starship");
+  assert.equal(normalizeTemplateName("ship"), "starship");
+  assert.equal(normalizeTemplateName("bridge"), "starship");
+  assert.equal(normalizeTemplateName("command"), "starship");
 });
 
 test("template keys match template directories and include highlights", async () => {
-  const expectedKeys = ["dashboard", "stress-test", "cli-tool", "animation-lab", "minimal"];
+  const expectedKeys = [
+    "dashboard",
+    "stress-test",
+    "cli-tool",
+    "animation-lab",
+    "minimal",
+    "starship",
+  ];
   const keys = TEMPLATE_DEFINITIONS.map((template) => template.key);
   assert.equal(keys.join(","), expectedKeys.join(","));
 

packages/create-rezi/src/index.ts

@@ -88,7 +88,7 @@ function printHelp(): void {
   stdout.write("  bun create rezi my-app\n\n");
   stdout.write("Options:\n");
   stdout.write(
-    "  --template, -t <name>       dashboard | stress-test | cli-tool | animation-lab | minimal\n",
+    "  --template, -t <name>       dashboard | stress-test | cli-tool | animation-lab | minimal | starship\n",
   );
   stdout.write("  --no-install                Skip dependency install\n");
   stdout.write("  --pm <npm|pnpm|yarn|bun>    Choose a package manager\n");

packages/create-rezi/src/scaffold.ts

@@ -2,7 +2,13 @@ import { mkdir, readFile, readdir, stat, writeFile } from "node:fs/promises";
 import { basename, join, resolve } from "node:path";
 import { fileURLToPath } from "node:url";
 
-export type TemplateKey = "dashboard" | "stress-test" | "cli-tool" | "animation-lab" | "minimal";
+export type TemplateKey =
+  | "dashboard"
+  | "stress-test"
+  | "cli-tool"
+  | "animation-lab"
+  | "minimal"
+  | "starship";
 
 export type TemplateDefinition = {
   key: TemplateKey;
@@ -77,6 +83,20 @@ export const TEMPLATE_DEFINITIONS: readonly TemplateDefinition[] = [
     ],
     dir: "minimal",
   },
+  {
+    key: "starship",
+    label: "Starship Command Console",
+    description:
+      "Multi-deck command console showcasing routing, animation, charts, forms, and the full widget catalog",
+    safetyTag: "safe-default",
+    safetyNote:
+      "Feature-rich showcase template with moderate CPU usage from animation hooks and live telemetry.",
+    highlights: [
+      "six-screen bridge with routing, animated gauges, live telemetry charts, and crew management",
+      "command palette, modal dialogs, toast notifications, forms, split panes, canvas, and theme cycling with keybinding modes",
+    ],
+    dir: "starship",
+  },
 ] as const;
 
 const TEMPLATE_BY_KEY = new Map(TEMPLATE_DEFINITIONS.map((template) => [template.key, template]));
@@ -98,6 +118,10 @@ TEMPLATE_ALIASES.set("motion", "animation-lab");
 TEMPLATE_ALIASES.set("mini", "minimal");
 TEMPLATE_ALIASES.set("basic", "minimal");
 TEMPLATE_ALIASES.set("utility", "minimal");
+TEMPLATE_ALIASES.set("starship", "starship");
+TEMPLATE_ALIASES.set("ship", "starship");
+TEMPLATE_ALIASES.set("bridge", "starship");
+TEMPLATE_ALIASES.set("command", "starship");
 
 const PACKAGE_NAME_RE = /^(?:@[a-z0-9-~][a-z0-9-._~]*\/)?[a-z0-9-~][a-z0-9-._~]*$/;
 

packages/create-rezi/templates/starship/.gitignore

@@ -0,0 +1,2 @@
+node_modules
+dist

packages/create-rezi/templates/starship/README.md

@@ -0,0 +1,112 @@
+# __APP_NAME__
+
+Scaffolded with `create-rezi` using the **__TEMPLATE_LABEL__** template.
+
+## Concept
+
+`__APP_NAME__` is a multi-deck starship operations console. It demonstrates routed application architecture, deterministic telemetry simulation, rich widgets, layered overlays, and declarative animation hooks in a cohesive, production-like TUI.
+
+## Decks
+
+- `bridge`: Command overview with animated schematic, gauges, sparkline/line chart telemetry, and system health lanes.
+- `engineering`: Split-pane reactor/diagnostics deck with tree navigation, accordion diagnostics, heatmap, and animated subsystem bring-up.
+- `crew`: Manifest deck with searchable/sortable table, master-detail, assignment editor form, and pagination.
+- `comms`: Channel tabs, logs console, rich text inspection, emergency callouts, and modal hail composer.
+- `cargo`: High-volume cargo analytics with bar/scatter charts, virtualized manifest, sorting/filter controls, and priority editor.
+- `settings`: Full settings form, validation callouts, theme preview, keybinding reference, and reset confirmation dialog.
+
+## Keybindings
+
+### Global
+
+| Key | Command |
+|---|---|
+| `q`, `ctrl+c` | Quit |
+| `1-6` | Navigate decks (`bridge` → `settings`) |
+| `tab`, `shift+tab` | Next/previous deck |
+| `t` | Cycle theme |
+| `ctrl+p` | Toggle command palette |
+| `?` | Toggle help modal |
+| `space` | Pause/resume simulation |
+| `g`, `y`, `r` | Set alert level (green/yellow/red) |
+
+### Bridge
+
+| Key | Command |
+|---|---|
+| `a` | Toggle autopilot |
+| `r` | Toggle red alert |
+| `s` | Scan |
+
+### Engineering
+
+| Key | Command |
+|---|---|
+| `b` | Toggle boost |
+| `d` | Toggle diagnostics |
+
+### Crew
+
+| Key | Command |
+|---|---|
+| `n` | New assignment |
+| `e` | Edit selected crew member |
+| `/` | Focus/search crew workflow |
+
+### Comms
+
+| Key | Command |
+|---|---|
+| `h` | Open hail dialog |
+| `enter` | Acknowledge next unacked message |
+| `n`, `p` | Next/previous channel |
+| `/` | Search messages |
+
+### Cargo / Settings
+
+| Key | Command |
+|---|---|
+| `n`, `c`, `q`, `p` (Cargo) | Sort by name/category/quantity/priority |
+| `ctrl+r` (Settings) | Open reset confirmation |
+| `ctrl+s` (Settings) | Save snapshot |
+
+## Feature Showcase
+
+- **Routing + shell:** `createNodeApp({ routes })`, `routerBreadcrumb()`, `routerTabs()`, route-aware key command dispatch.
+- **Layouts:** `ui.appShell`, `ui.page`, `ui.panel`, `ui.card`, `ui.grid`, `ui.masterDetail`, `ui.splitPane`, `ui.center`.
+- **Data + forms:** `ui.table`, `ui.tree`, `ui.virtualList`, `ui.form`, `ui.field`, `ui.actions`, `ui.select`, `ui.radioGroup`, `ui.slider`.
+- **Visualization:** `ui.canvas` (braille), `ui.gauge`, `ui.progress`, `ui.sparkline`, `ui.lineChart`, `ui.barChart`, `ui.scatter`, `ui.heatmap`.
+- **Overlays:** `ui.layers`, `ui.layer`, `ui.modal`, `ui.dialog`, `ui.toastContainer`, `ui.commandPalette`.
+- **Composition hooks:** `defineWidget`, `useTransition`, `useSpring`, `useSequence`, `useStagger`, `useInterval`, `useAsync`.
+- **Render helpers:** `show`, `when`, `match`, `maybe`, `each`, `eachInline`.
+
+## File Layout
+
+- `src/types.ts`: readonly state, domain entities, actions.
+- `src/theme.ts`: starship theme catalog and display styles.
+- `src/helpers/simulation.ts`: deterministic seed generators + toast events.
+- `src/helpers/formatters.ts`: UI format and badge helpers.
+- `src/helpers/state.ts`: reducer, selectors, simulation evolution.
+- `src/helpers/keybindings.ts`: route-aware key resolution.
+- `src/screens/`: shared shell + six route screens.
+- `src/main.ts`: app bootstrap, routing, keybindings, timers, lifecycle.
+- `src/__tests__/`: reducer, keybinding, and render coverage.
+
+## Quickstart
+
+```bash
+npm install
+npm run start
+```
+
+## Dev (HSR)
+
+```bash
+npm run dev
+```
+
+## Tests
+
+```bash
+npm test
+```

packages/create-rezi/templates/starship/package.json

@@ -0,0 +1,25 @@
+{
+  "name": "__PACKAGE_NAME__",
+  "version": "0.1.0",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "start": "tsx src/main.ts",
+    "dev": "tsx src/main.ts --hsr",
+    "build": "tsc --pretty false",
+    "typecheck": "tsc --noEmit",
+    "test": "tsx --test src/__tests__"
+  },
+  "dependencies": {
+    "@rezi-ui/core": "^0.1.0-alpha.17",
+    "@rezi-ui/node": "^0.1.0-alpha.17"
+  },
+  "devDependencies": {
+    "@types/node": "^22.13.1",
+    "tsx": "^4.20.0",
+    "typescript": "^5.6.3"
+  },
+  "engines": {
+    "node": ">=18"
+  }
+}

packages/create-rezi/templates/starship/src/__tests__/keybindings.test.ts

@@ -0,0 +1,30 @@
+import assert from "node:assert/strict";
+import test from "node:test";
+import { resolveStarshipCommand } from "../helpers/keybindings.js";
+
+test("global keys resolve correctly", () => {
+  assert.equal(resolveStarshipCommand("q"), "quit");
+  assert.equal(resolveStarshipCommand("ctrl+c"), "quit");
+  assert.equal(resolveStarshipCommand("1"), "go-bridge");
+  assert.equal(resolveStarshipCommand("2"), "go-engineering");
+  assert.equal(resolveStarshipCommand("3"), "go-crew");
+  assert.equal(resolveStarshipCommand("4"), "go-comms");
+  assert.equal(resolveStarshipCommand("5"), "go-cargo");
+  assert.equal(resolveStarshipCommand("6"), "go-settings");
+  assert.equal(resolveStarshipCommand("t"), "cycle-theme");
+  assert.equal(resolveStarshipCommand("?"), "toggle-help");
+  assert.equal(resolveStarshipCommand("ctrl+p"), "toggle-command-palette");
+});
+
+test("route-specific keys resolve on matching routes", () => {
+  assert.equal(resolveStarshipCommand("a", "bridge"), "toggle-autopilot");
+  assert.equal(resolveStarshipCommand("b", "engineering"), "engineering-boost");
+  assert.equal(resolveStarshipCommand("n", "crew"), "crew-new-assignment");
+  assert.equal(resolveStarshipCommand("h", "comms"), "comms-hail");
+  assert.equal(resolveStarshipCommand("enter", "comms"), "comms-acknowledge");
+});
+
+test("unknown keys return undefined", () => {
+  assert.equal(resolveStarshipCommand("z"), undefined);
+  assert.equal(resolveStarshipCommand("ctrl+alt+9"), undefined);
+});

packages/create-rezi/templates/starship/src/__tests__/reducer.test.ts

@@ -0,0 +1,109 @@
+import assert from "node:assert/strict";
+import test from "node:test";
+import {
+  createInitialState,
+  reduceStarshipState,
+  sortedCargo,
+  visibleCrew,
+} from "../helpers/state.js";
+
+test("tick advances telemetry deterministically", () => {
+  const initial = createInitialState(1_000);
+  const nextA = reduceStarshipState(initial, { type: "tick", nowMs: 1_800 });
+  const nextB = reduceStarshipState(initial, { type: "tick", nowMs: 1_800 });
+
+  assert.deepEqual(nextA.telemetry, nextB.telemetry);
+  assert.equal(nextA.tick, 1);
+  assert.equal(nextA.telemetryHistory.length, 60);
+});
+
+test("toggle-pause toggles state", () => {
+  const initial = createInitialState(0);
+  const paused = reduceStarshipState(initial, { type: "toggle-pause" });
+  const resumed = reduceStarshipState(paused, { type: "toggle-pause" });
+  assert.equal(paused.paused, true);
+  assert.equal(resumed.paused, false);
+});
+
+test("toggle-red-alert cycles alert level", () => {
+  const initial = createInitialState(0);
+  const red = reduceStarshipState(initial, { type: "toggle-red-alert" });
+  const yellow = reduceStarshipState(red, { type: "toggle-red-alert" });
+  assert.equal(red.alertLevel, "red");
+  assert.equal(yellow.alertLevel, "yellow");
+});
+
+test("crew selection and search filtering", () => {
+  const initial = createInitialState(0);
+  const member = initial.crew[5];
+  assert.ok(member);
+
+  const selected = reduceStarshipState(initial, { type: "select-crew", crewId: member.id });
+  assert.equal(selected.selectedCrewId, member.id);
+
+  const searched = reduceStarshipState(selected, {
+    type: "set-crew-search",
+    query: member.name.split(" ")[0] ?? "",
+  });
+  const visible = visibleCrew(searched);
+  assert.ok(visible.some((entry) => entry.id === member.id));
+});
+
+test("subsystem tree expansion toggles", () => {
+  const initial = createInitialState(0);
+  const target = "warp-core";
+  const opened = reduceStarshipState(initial, { type: "toggle-subsystem", subsystemId: target });
+  assert.equal(opened.expandedSubsystemIds.includes(target), true);
+
+  const closed = reduceStarshipState(opened, { type: "toggle-subsystem", subsystemId: target });
+  assert.equal(closed.expandedSubsystemIds.includes(target), false);
+});
+
+test("comms channel switching and message acknowledgment", () => {
+  const initial = createInitialState(0);
+  const switched = reduceStarshipState(initial, { type: "switch-channel", channel: "emergency" });
+  assert.equal(switched.activeChannel, "emergency");
+
+  const first = switched.messages[0];
+  assert.ok(first);
+  const acknowledged = reduceStarshipState(switched, {
+    type: "acknowledge-message",
+    messageId: first.id,
+  });
+  assert.equal(acknowledged.messages.find((item) => item.id === first.id)?.acknowledged, true);
+});
+
+test("cargo sorting updates ordering", () => {
+  const initial = createInitialState(0);
+  const sortedByName = reduceStarshipState(initial, { type: "set-cargo-sort", sortBy: "name" });
+  const sorted = sortedCargo(sortedByName);
+  assert.ok(sorted.length > 5);
+  assert.equal(sorted[0]!.name.localeCompare(sorted[1]!.name) <= 0, true);
+});
+
+test("settings name can be validated by reducer result", () => {
+  const initial = createInitialState(0);
+  const invalid = reduceStarshipState(initial, { type: "set-ship-name", name: "" });
+  assert.equal(invalid.shipName.trim().length, 0);
+
+  const valid = reduceStarshipState(invalid, { type: "set-ship-name", name: "USS Atlas" });
+  assert.equal(valid.shipName, "USS Atlas");
+});
+
+test("toast add and dismiss", () => {
+  const initial = createInitialState(0);
+  const withToast = reduceStarshipState(initial, {
+    type: "add-toast",
+    toast: {
+      id: "toast-1",
+      message: "Hello",
+      level: "info",
+      timestamp: 0,
+      durationMs: 1000,
+    },
+  });
+  assert.equal(withToast.toasts.length, 1);
+
+  const dismissed = reduceStarshipState(withToast, { type: "dismiss-toast", toastId: "toast-1" });
+  assert.equal(dismissed.toasts.length, 0);
+});