Repository navigation
chore(design): the live browser in the design system; the sidebar runs full height - #123
Merged
Merged
Conversation
…s full height BrowserPanel joins the claude.ai/design design system. BotloftProvider takes the bots' open browsers, opens them in the fake daemon before the app's store connects and paints them with the app's dev page drawer, so the panel shows tabs, the address bar, the page and the bot's cursor. The conventions now say how the app window is built: the Sidebar as the row's direct first child (wrapped, it shrank to its content in a design) and the BrowserPanel as its last.
httpsphl
enabled auto-merge
October 2, 2026 18:41
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
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.
What and why
Two things the explainer video needs, both in
.design-sync/only:Sidebarin another element, and it shrank to its content. The agent's guide and the Sidebar's contract now say how the app window is built: oneflexrow with a fixed height, the Sidebar as its direct first child, the chat column, then the browser.BrowserPaneljoins the design system.BotloftProvidertakesbrowsers(bot, url, title, tabs, the bot's last action), opens them in the fake daemon's browser and paints the page with the app's own dev page drawer, so the panel shows tabs, the address bar, the "Live" mark, the page and the bot's cursor. They open before the store connects: the fake answers the store's firstbrowser.listat once, and an earlier answer would close the panel again.Nothing under
app/orcrates/changes.How it was tested
Converter validation passes; all 25 previews render and were graded from screenshots, including the app window with Scout's browser open on a page beside its chat. The claude.ai/design project was updated against its sync anchor: BrowserPanel added, Sidebar and BotloftProvider changed, nothing to delete.
Checklist
cargo fmt,clippy -D warningsandcargo testpass (no Rust changes)pnpm checkpasses (no app changes)docs/spec.mdstill matches the code