leglas 0.3.0 → 0.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -14,6 +14,12 @@
14
14
  <a href="LICENSE"><img src="https://img.shields.io/npm/l/leglas" alt="license"></a>
15
15
  </p>
16
16
 
17
+ <p align="center">
18
+ <img src="https://raw.githubusercontent.com/FredAmartey/leglas/pr-assets/rail-single.jpg" width="900" alt="The Leglas interface: a rail of three design directions on the left, and the selected one running as the real app filling the rest of the window" />
19
+ </p>
20
+
21
+ <p align="center"><i>Every direction in the rail, the selected one running as your actual app. Arrow keys flip between them.</i></p>
22
+
17
23
  Code is becoming the source of truth. Features go from prompt to
18
24
  working code in minutes, and mockups/design files eventually lag behind the product and drift out of sync. The
19
25
  fastest teams already design in the medium they ship. Leglas is built
@@ -39,6 +45,12 @@ and sessions that clean up after themselves.
39
45
 
40
46
  ## What you can do with Leglas
41
47
 
48
+ <p align="center">
49
+ <img src="https://raw.githubusercontent.com/FredAmartey/leglas/pr-assets/compare-artboards.jpg" width="900" alt="The Leglas interface: a rail of three design directions on the left, and two of them running side by side as the real app, each labelled with its name." />
50
+ </p>
51
+
52
+ <p align="center"><i>Two directions for the same page, running side by side as the actual app.</i></p>
53
+
42
54
  - Pick any two variations for side-by-side comparison when it gets hard to choose.
43
55
  - Name each direction, drag to reorder and organise your variants, set aside the ones that
44
56
  don't feel right. Your actions on every idea survive a long exploration.
@@ -51,12 +63,23 @@ and sessions that clean up after themselves.
51
63
  the spread, your agent supplies the taste.
52
64
  - Ask for changes without leaving the comparison: describe what you
53
65
  want on the direction you're looking at, and Leglas turns it into a
54
- precise request for your agent, file path included. Leave
55
- `npx leglas watch --run "claude -p {prompt}"` running in another terminal
56
- and your agent picks each request up as you send it. In Claude Code,
57
- the Leglas MCP server can also push each request straight into your
58
- open session as a channel event (channels are a research preview:
59
- start Claude Code with `--dangerously-load-development-channels
66
+ precise request for your agent, file path included. The composer
67
+ carries its own agent picker, the way every chat you already use
68
+ carries a model picker: the CLIs found on your machine (Claude Code,
69
+ Codex, Cursor) are one click away next to the send button, each asked
70
+ for its login status so a signed-out CLI says so before a run instead
71
+ of failing one. Not on that list? Type the command that runs your
72
+ agent once, in the same menu, and Leglas hands it each request; or
73
+ connect an agent Leglas can't spawn (an IDE panel, an MCP host) with
74
+ the copy-paste MCP wiring behind "Connect another agent". Each run
75
+ reports in a card above the field: who is working, what file they
76
+ are touching, how long it has been, a stop button while it runs and
77
+ retry when it fails. Your agent, your subscription, no keys.
78
+ Prefer a terminal? `npx leglas watch` is the same loop with the
79
+ agent's own output scrolling by. In Claude Code, the Leglas MCP
80
+ server can also push each request straight into your open session as
81
+ a channel event (channels are a research preview: start Claude Code
82
+ with `--dangerously-load-development-channels
60
83
  server:<your leglas server name>`).
61
84
  - Keep the winner with one command. Leglas moves it into your source
62
85
  tree and clears the exploration away.
@@ -154,6 +177,23 @@ directly above the field. Your agent drains the queue with `npx leglas requests
154
177
  it with `--clear`. Leglas runs no model of its own; your agent already
155
178
  knows your conventions and your taste.
156
179
 
180
+ The line under the field is the whole status: whether anything is
181
+ listening, what you have queued, and when it has been picked up.
182
+
183
+ <p align="center">
184
+ <img src="https://raw.githubusercontent.com/FredAmartey/leglas/pr-assets/field-idle.png" width="290" alt="The change field reading: Enter queues it for npx leglas requests" />
185
+ <img src="https://raw.githubusercontent.com/FredAmartey/leglas/pr-assets/field-queued.png" width="290" alt="The change field reading: one change queued for your agent" />
186
+ <img src="https://raw.githubusercontent.com/FredAmartey/leglas/pr-assets/field-pickedup.png" width="290" alt="The change field reading: Your agent is on it" />
187
+ </p>
188
+
189
+ <p align="center"><i>Nothing waiting, then a request queued, then an agent that has taken it.</i></p>
190
+
191
+ Pick an agent once and the same line shows it working: which file it is
192
+ editing, a cancel if you change your mind, a retry when a run goes
193
+ wrong. `npx leglas watch` in another terminal is the same loop with the
194
+ agent's own output in view, and it needs no flag once an agent has been
195
+ picked in the interface.
196
+
157
197
  ### MCP server
158
198
 
159
199
  For agent hosts that cannot run shell commands, `leglas-mcp` exposes the
@@ -255,6 +295,15 @@ what you want for the last two directions in contention: press `C`, or
255
295
  hover a direction and press its compare button, and it becomes the right
256
296
  pane while the active direction holds the left.
257
297
 
298
+ A split does not hand each side half the room. An app given half the room
299
+ crosses its own breakpoints and draws a different design, so you would be
300
+ choosing between two narrow renderings of directions meant for the wide
301
+ one. Instead each side is drawn at the width it had on its own and scaled
302
+ to fit, keeping the same proportions, so nothing reflows and flipping and
303
+ splitting agree about what the design is. Each pane says the width it is
304
+ drawn at and the scale it is shown at. If you want the narrow rendering,
305
+ that is what the tools popover's "Scale each side to fit" switch is for.
306
+
258
307
  Arrows move between directions, `1` to `9` jump straight to one, `R` asks
259
308
  for a change to the one you are on, `Cmd K` (`Ctrl K` elsewhere) searches
260
309
  and `B` collapses the rail. Press `?` for the whole keymap.