feat(gatorwalk-factory): studio Design mode: the engine in the page, a lane layout, and Copy reference (swamp-club #2807) #402

Merged

seth merged 3 commits from cue/2807-gatorwalk-factory-studio into main 2026-10-01 12:16:19 +00:00

Conversation 0 Commits 3 Files changed 37 +6030 -508

seth commented 2026-10-01 02:21:59 +00:00

Owner

Copy link

Closes swamp-club #2807.

The studio's Design mode: one factory definition on one screen, with gatorwalk's own schema check and graph analysis re-run in the browser whenever the file changes. The page never edits. The agent writes the file, and Copy reference hands the agent a one-line pointer to a stage, exit, gate or finding.

What's in it

• The engine in the page. studio/src/model.ts reads the text with @std/yaml, as validate does, then runs DefinitionSchema, analyzeDefinition and designView, imported by relative path. The yaml package maps document paths to source lines. zod's jitless is set first, so the server's no-eval CSP isn't tripped.
• Lane layout (layout.ts, ported from the prototype): rows are tracker statuses, columns follow flow order, and every edge gets its own track, port and entry point. Tests on every example definition check that no edges overlap, no edge passes through a tile, and the output is deterministic.
• Inspector: handoff, products, exits with gates, conditions and descriptions, and ticket entries. Findings with trace walks across the graph. A read-only source view, whole file or one stage, with path underlines.
• Selection by identity: it survives the agent inserting stages, exits or gates above it. Gates are identified by type plus their natural key, with no new name field.
• Changed marks per browser (localStorage), kept until the stage is selected, plus a "Mark all seen" button.
• Keyboard: the graph is one tab stop (an ARIA tree with a roving focus). Arrows move between stages, Enter steps into a stage's exits, Enter on an exit follows it to the next stage, → steps into the exit's gates, Esc steps back out, and c copies a reference (only when focus is in the graph, findings or inspector, per WCAG 2.2 SC 2.1.4). Plus reduced motion and phone width.
• Build: the digest now covers the engine modules the page bundles (ENGINE_INPUTS, checked against deno info at build time and by a static import walk in the unit tests), plus deno.json and deno.lock. A change to one of those engine modules now needs deno task build:studio in the same PR. The page is split into three generated modules, each under 800 KB; the script is 670 KB.
• Tests: studio/ joins the unit test command, with --allow-env=LOG_TOKENS,LOG_STREAM only, the two variables the yaml package reads (in both deno.json and verification/checks.yaml). The acceptance test adds a plan → implement exit to swamp-club-swamp-extensions.yaml and expects ambiguous-exit and product-missing-on-path, plan marked changed, and a reference line naming the file, path and code.
• Docs: README, DESIGN.md ("Design mode", the digest changes, a decision-log entry), and the skill's driving.md (how to read a pasted reference line).

Verified

• The manual pass with Seth: the three examples render, the live acceptance edit works, plus keyboard navigation and Copy reference. Headless Chromium measurements: scrolling, phone width at 375px, reduced motion, and that exit names fit beside their pips.
• verify-build 13/14 (codegen idempotency skipped) and verify-reviews 3/3 pass on 906cddd. The attestation is posted.
• Two earlier review rounds each found a medium bug, both fixed here: a followed finding kept its old path, and arrow keys on the tabs threw before moving focus.
• main gained #2711 after verification. A local merge with it passes integration/extension/skill_test.ts (12/12).

Five low review findings remain (a stale-page Copy reference, the Findings count after a failed reload, a followed finding's trace, a string-named import in the test-time walk, and inspector display joining). They're for a follow-up issue.

🤖 Generated with Claude Code

Closes swamp-club #2807. The studio's **Design mode**: one factory definition on one screen, with gatorwalk's own schema check and graph analysis re-run in the browser whenever the file changes. The page never edits. The agent writes the file, and **Copy reference** hands the agent a one-line pointer to a stage, exit, gate or finding. ## What's in it - **The engine in the page.** `studio/src/model.ts` reads the text with `@std/yaml`, as `validate` does, then runs `DefinitionSchema`, `analyzeDefinition` and `designView`, imported by relative path. The `yaml` package maps document paths to source lines. zod's `jitless` is set first, so the server's no-eval CSP isn't tripped. - **Lane layout** (`layout.ts`, ported from the prototype): rows are tracker statuses, columns follow flow order, and every edge gets its own track, port and entry point. Tests on every example definition check that no edges overlap, no edge passes through a tile, and the output is deterministic. - **Inspector**: handoff, products, exits with gates, conditions and descriptions, and ticket entries. **Findings** with trace walks across the graph. A read-only **source** view, whole file or one stage, with path underlines. - **Selection by identity**: it survives the agent inserting stages, exits or gates above it. Gates are identified by type plus their natural key, with no new `name` field. - **Changed marks** per browser (`localStorage`), kept until the stage is selected, plus a "Mark all seen" button. - **Keyboard**: the graph is one tab stop (an ARIA tree with a roving focus). Arrows move between stages, Enter steps into a stage's exits, Enter on an exit follows it to the next stage, → steps into the exit's gates, Esc steps back out, and `c` copies a reference (only when focus is in the graph, findings or inspector, per WCAG 2.2 SC 2.1.4). Plus reduced motion and phone width. - **Build**: the digest now covers the engine modules the page bundles (`ENGINE_INPUTS`, checked against `deno info` at build time and by a static import walk in the unit tests), plus `deno.json` and `deno.lock`. A change to one of those engine modules now needs `deno task build:studio` in the same PR. The page is split into three generated modules, each under 800 KB; the script is 670 KB. - **Tests**: `studio/` joins the unit test command, with `--allow-env=LOG_TOKENS,LOG_STREAM` only, the two variables the `yaml` package reads (in both `deno.json` and `verification/checks.yaml`). The acceptance test adds a plan → implement exit to `swamp-club-swamp-extensions.yaml` and expects `ambiguous-exit` and `product-missing-on-path`, `plan` marked changed, and a reference line naming the file, path and code. - **Docs**: README, DESIGN.md ("Design mode", the digest changes, a decision-log entry), and the skill's `driving.md` (how to read a pasted reference line). ## Verified - The manual pass with Seth: the three examples render, the live acceptance edit works, plus keyboard navigation and Copy reference. Headless Chromium measurements: scrolling, phone width at 375px, reduced motion, and that exit names fit beside their pips. - `verify-build` 13/14 (codegen idempotency skipped) and `verify-reviews` 3/3 pass on `906cddd`. The attestation is posted. - Two earlier review rounds each found a medium bug, both fixed here: a followed finding kept its old path, and arrow keys on the tabs threw before moving focus. - `main` gained #2711 after verification. A local merge with it passes `integration/extension/skill_test.ts` (12/12). Five low review findings remain (a stale-page Copy reference, the Findings count after a failed reload, a followed finding's trace, a string-named import in the test-time walk, and inspector display joining). They're for a follow-up issue. 🤖 Generated with [Claude Code](https://claude.com/claude-code)

seth added 3 commits 2026-10-01 02:21:59 +00:00

feat(gatorwalk-factory): studio Design mode: the engine in the page, a lane layout, and Copy reference (swamp-club #2807) ... 298569dc7a

The studio's Design mode shows one factory definition on one screen and
re-runs gatorwalk's own schema check and graph analysis in the browser
whenever the file changes. It never edits: the agent writes the file, and
Copy reference hands the agent a one-line pointer to a stage, exit, gate
or finding.

- The page (Preact with signals) imports the engine by relative path.
  model.ts reads the text as validate does and maps document paths to
  source lines with the yaml package.
- A pure lane layout, ported from the prototype: rows are tracker
  statuses, columns follow flow order, and each edge has its own track,
  port and entry point. The tests check no overlaps on every example.
- Inspector, findings with trace walks, and a read-only source view with
  path underlines. Selection is held by identity, so it survives an agent
  inserting stages or exits above it. Stages changed since you last
  looked are marked per browser.
- Keyboard: the graph is one tab stop with a roving focus. Enter steps
  into exits, Enter on an exit follows it, and c copies a reference.
  WCAG 2.2 AA, reduced motion, phone width.
- The build's digest now covers the engine modules the page bundles
  (ENGINE_INPUTS) and deno.json/deno.lock. The page is split into three
  generated modules to stay under the registry's file limit.
- The unit tests include studio/, and may read LOG_TOKENS and LOG_STREAM
  only (the yaml package reads them).

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>

fix(gatorwalk-factory): studio review findings: a followed finding takes its new path, and a failed check shows (swamp-club #2807) ... 0d71b86206

From the verification reviews of the Design mode commit:

- A selected finding is followed to its current form after a reload, so
  its path moves with the file and the inspector and source stay on it.
- An error from the analysis after a reload is shown as a source error,
  and the graph keeps the last good version, marked stale, as it now does
  when the file cannot be read.
- build.ts says the import walk sees static imports only; the build's
  deno info check covers dynamic ones.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>

fix(gatorwalk-factory): studio review findings: arrow keys move focus between tabs, and sturdier loading (swamp-club #2807) ... 906cddd300

From the verification reviews of 0d71b8620:

- Arrow keys on the panel tabs move focus to the new tab. The handler
  read event.currentTarget inside requestAnimationFrame, after the
  browser had reset it to null, so it threw before focusing.
- The live-reload stream opens before the first load, so a file saved
  during that load is not missed. A malformed event is ignored.
- getJson reports the HTTP status when an error answer is not JSON.
- Of two findings worded alike, the selection keeps the one at its path.
- The import walk matches only import and export-from statements at the
  start of a line, so a comment mentioning "import" cannot swallow a real
  import. It has a test of its own.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>

seth merged commit bbda76665c into main 2026-10-01 12:16:19 +00:00

seth deleted branch cue/2807-gatorwalk-factory-studio 2026-10-01 12:16:19 +00:00

seth referenced this pull request from a commit 2026-10-01 12:16:21 +00:00

feat(gatorwalk-factory): studio Design mode: the engine in the page, a lane layout, and Copy reference (swamp-club #2807) (#402)

Sign in to join this conversation.

Reviewers

No reviewers

Labels

Clear labels

No items

No labels

Milestone

Clear milestone

No items

No milestone

Assignees

Clear assignees

No assignees

1 participant

Notifications

Subscribe

Due date

The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set

Reference

swamp-club/swamp-extensions!402

No description provided.