Control radius: the size-invariant ramp member (D56) - #59
Merged
Conversation
D54-D55 (e851be0) moved control height, gap, padding, icon inset and font onto the shared --psi-control-* family. Radius was the one geometry property left behind: all six control border-radius declarations still bind rungs directly, so a customer wanting sharper controls must fork component CSS. Adds one size-invariant key to the existing family. Radius does NOT join the size ramp: border-radius sits on each component's base rule, never in the .size{n} blocks, and all four sizes resolve to radius-8 — making it per-size would encode variation that doesn't exist and cost the theme console its single dial. Checkbox and Tooltip cap themselves via min() so a sharp theme squares them without a soft theme over-rounding small objects. Tag and Switch stay pill. Rendered no-op by construction — zero VR diff is the acceptance signal. Renumbered from D54 after a numbering collision with e851be0; density, which an earlier draft deferred, shipped there. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Four tasks: family key, five component aliases, six CSS rebinds, guidance + changeset. Plan records the two existing control-tokens assertions that break on the new key (the size|space|text rung regex and the 28-token count) and fixes both in the task that causes them. Guidance entry added beyond the spec: guidance.json is a published artifact and D54-D55 established a geometry block, so an undiscoverable token would be a regression for agents. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
…s (D56) Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Six border-radius declarations move off raw rungs onto the per-component tokens that alias --psi-control-radius. Tag and Switch keep --psi-radius-full. Defaults are unchanged: computed values verified in chromium against the built Storybook - button/iconbutton/input/select 8px, checkbox 4px, tooltip 6px. The min() caps behave as designed: at --psi-control-radius 0px the checkbox tracks to 0px, at 20px it holds at 4px. VR is deferred to CI: the committed baselines are ubuntu-latest renders and neither macOS nor the jammy image reproduces them (156/180 diffs on stories with no controls). Plan step corrected accordingly. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Three documentation errors, no mechanism change:
1. The changeset told consumers to override --psi-{component}-radius. That
pattern is wrong for Checkbox, whose token is --psi-checkbox-box-radius —
an agent following the text would synthesize --psi-checkbox-radius and get
silence. All five tokens are now named explicitly.
2. "A sharp theme squares them" was false on-scale. radiusScale is [4,6,8,12]
with no rung below radius-4, so min(control, radius-4) evaluates to 4px at
every on-scale value; Checkbox only moves at an off-scale value like 0px.
Tooltip's radius-6 ceiling does track, down to radius-4.
3. The changeset asserted "the VR suite reports zero diff pixels". It has not
run — CI gates it. Reworded to claim no visible change by construction.
Guidance also now records that Psi has two radius dials (--psi-control-radius,
--psi-surface-radius) and that --psi-card-radius sits on neither.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
|
Bugbot is not enabled for your account, so this pull request was not reviewed. Enable Bugbot in the Cursor dashboard to get automatic reviews on future PRs. |
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
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.
Completes the
--psi-control-*family that D54–D55 (#58) introduced. That decision moved control height, gap, padding and font onto a shared per-size, token-only family; radius was the one geometry property left binding raw rungs, so a customer wanting sharper controls had to fork component CSS.What changed
One size-invariant key on the family — radius does not ride the size ramp, because
border-radiussits on each component's base rule rather than in its.size{n}blocks, and all four sizes resolve toradius-8:Six
border-radiusdeclarations rebind. Tag and Switch keep--psi-radius-full— pill-ness is component identity, not theme expression.A theme now retunes control shape in one line, which
Palette+SlotMapcould not express:Rendered no-op
Every default resolves to its current value. Verified in chromium against the built Storybook: control/button/input/select
8px, checkbox4px, tooltip6px— identical to the literals they replace. Themin()caps behave as designed live (--psi-control-radius: 0px→ checkbox0px;20px→ checkbox holds4px).pnpm vrcould not be run locally and CI'svrjob is the acceptance criterion. Baselines are ubuntu-latest renders: macOS fails all 180 on the platform suffix, andplaywright:v1.61.1-jammyproduced 156/180 diffs on stories containing no controls at all (font-stack drift), so neither is a valid oracle. Ifvrreports any diff, this is not ready.Local gates:
pnpm build,pnpm test(60 files, 529 tests),pnpm lintall pass.Reviewer notes
--psi-control-radiusdeliberately never appears in component CSS — the stylelint boundary excludes it, so all indirection lives in the token layer, matching how--psi-surface-radiusalready works for Dialog/Panel/Menu.radiusScaleis[4,6,8,12]with no rung belowradius-4. It only bites off-scale (e.g.0px). Tooltip'sradius-6ceiling does track, down toradius-4. This is recorded accurately in the changeset and guidance after a final-review correction.--psi-card-radiussits on neither dial and strands atradius-8when a theme retunes controls.Spec:
docs/superpowers/specs/2026-07-31-control-radius-design.mdPlan:
docs/superpowers/plans/2026-07-31-control-radius.md🤖 Generated with Claude Code