[doodlewind]

Evan saw the laptop's XP Start panel in Japanese on studio.pocket.nexus with its places column (マイ ドキュメント ▸, マイ コンピュータ, 設定 ▸, ヘルプ, 実行...) running about 30 px past the panel's frame: the header and the bottom strip ended at the frame, the column's background and labels went on; 「マイ ドキュメント」 ran into its arrow and 「マイ コンピュータ」 was cut by the frame.

Cause. The XP panel had a fixed width (startW 304: programs column 172, places column 130). The places column is flex-1, so a row wider than 130 px widened the column past the frame, which does not clip. A label is not measured before its glyphs exist: PocketJS's runtime glyphs flush before measureText, and the measured widths match the drawn ones. The Japanese row 「マイ ドキュメント ▸」 needs 161 px. The English row "My Documents ▸" needs 140 px, so the English panel was 10 px short as well; its last 10 px were the row's right padding and did not show.

Change.

• wm.ts startLayout takes each row's natural width and a maximum. A column the theme draws at startLeftW / startW grows to its widest row (Classic and Aqua: the one column beside the rail), up to the screen's width; past it the places column gives back its growth first. The rows' rectangles, the footer strip and the frame all come from that one layout, so paint and hit testing agree.
• theme.ts: two metrics a row's width is made of, startRowInset (padding, icon slot and gap) and startArrowW (arrow and gap), per theme; a test holds them to the classes.
• chrome.tsx: the XP panel's programs column takes its width from the layout; a label wider than its row (only past the maximum) is cut with "..." by fitLabel, which desktopLabelText now uses too.
• app.tsx: the row width is the label measured in the face it is drawn in (XP's pinned rows are bold), plus the inset and the arrow.
• programs.tsx aboutGeo: the About dialog grows by a line step (24 px) for each body line past four, so a product's longer About (Pocket Studio's Japanese one has five lines) keeps the OK button inside the window.

Tests (shells/desktop/test/system-ui.test.ts): XP grows to its widest row and keeps 304 when rows fit; the footer and places rows end at the frame; the cap gives back the places column first and never goes under the theme's width; a one-column launcher grows beside its rail; fitLabel; aboutGeo; the metrics mirror the classes.

Checked in Pocket Studio's laptop (dev page, headless Chrome, all three themes, Japanese and English): the Start panel in each theme; XP's All Programs, Settings and My Documents flyouts; Notepad's menu bar and File menu; Minesweeper; the Shut Down dialog; About in each theme and language; the four Studio apps. The XP panel is now 334 px in Japanese and 314 px in English. Classic and Aqua already fit and keep their widths. bun run check passes (assets, typecheck, every shell's tests).

A task-button change (titles cut with "...") was tried and reverted in this branch: with the product's "Pocket Desktop:" prefix every button read "Pocket Desktop:...".

🤖 Generated with Claude Code