Approach B: relative placement + align/distribute/autosize/tidy verbs#28
Open
molefrog wants to merge 1 commit into
Conversation
…e verbs The agent laid out diagrams by guessing absolute coordinates — overlaps, overflowing labels, crooked spacing. This keeps the imperative model but removes the arithmetic: - `add text|rect|note` gain relative placement (--below/--above/--left-of/ --right-of + --gap + --align) as an alternative to --at. The op carries a `place` intent; the executor resolves it against the anchor's real bounds (server/scratchpad-arrange.ts: shapeBounds, with text estimated via the canvas-font metrics). Arrows can't anchor. - `add rect --size` is now optional: omitted with --text, the rect is sized by fitRectToLabel so the label can never overflow; without text it falls back to a 160×96 node box. - New arrangement verbs, all headless-store ops: `align` (edge/center to an anchor, one axis only), `distribute` (exact --gap repack, or equalize with endpoints fixed), `autosize` (re-fit labeled rects in place), and `tidy` (grid snap + pull near-aligned left edges / centers / top edges onto one shared grid line). Arrows are always skipped — bound arrows follow. - Tests in server/test/scratchpad-arrange.test.ts (placement math, label fit, align/distribute/autosize/tidy, browser-loadable snapshots), docs and the workspace skill teach the workflow: anchor once, place relatively, never compute coordinates, finish with align/distribute/tidy. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01A4d4g5CV89L1AanPrEYp7p
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
The bet
The agent's topology instincts are fine — it needs a designer's hand tools instead of a calculator. Keeps the imperative model (so it works for annotating the user's own sketches too), removes the arithmetic.
Stacked on #26 (text-metrics foundation). Sibling approaches: A (ELK auto-layout), C (see + lint).
What it does
No coordinate ever computed by the agent; rects auto-size to their labels (no
--sizeneeded), so overflow can't happen on create.How
add rect|note|text:--below/--above/--left-of/--right-of <id>,--gap(default 48),--align start|center|end(cross-axis). Resolved server-side in the executor against the live store (placefield on add ops;x/ynow optional).add rectwithout--sizefits the label viafitRectToLabel(260px wrap target); unlabeled default 160×96.server/scratchpad-arrange.ts—shapeBoundswithout a DOM (geo/image props, note 200×200+growY, text estimated with font metrics), plus the four verbs:align <ids…> --edge left|right|top|bottom|center-x|center-y [--to <id>]distribute <ids…> --axis x|y [--gap N](exact-gap repack, or endpoint-fixed equalize; spatial order, like design tools)autosize <ids…>— re-fit labeled rectstidy [--grid N]— grid snap + deterministic near-alignment clustering (10px tolerance, grid-rounded cluster means, center pass respects the edge pass)--size→ finish withalign/distribute/tidy.Tests
19 new tests (placement math on all four sides, auto-size fit, align/distribute/autosize/tidy behavior, binding survival, error cases), every block asserting browser-loadability. Full suite 338 green; lint/format clean.
Trade-offs
Multi-step: the scenario takes ~12 commands vs. one
diagramcall on approach A — but it's the only approach that helps mid-edit and around user-drawn shapes. Composable with A and C.🤖 Generated with Claude Code
https://claude.ai/code/session_01A4d4g5CV89L1AanPrEYp7p
Generated by Claude Code