Rebuild NavButton, add MenuTriggerButton - #92
Draft
librowski wants to merge 2 commits into
Draft
Conversation
librowski
force-pushed
the
ds2-nav-button
branch
from
August 21, 2026 10:22
a4e2bd2 to
ce365d1
Compare
NavButton takes size, styleVariant and explicit icon slots, so the label/icon/icon+label subtypes and the shared children-shape guards are gone - nothing imports them any more, so they are deleted too. The selected state and the mouse-down state are now separate: selection survives hover and pointer-down overrides it, each on its own token, which is what the design defines and what the token export ships. Seven sizes carry the design's boxes, padding, gap, radius and icon boxes; nav labels keep the regular weight. MenuTriggerButton composes NavButton and maps its open state onto selection. SegmentPicker keeps its public API and translates to the new slots internally.
SegmentPicker accepted an icon, a label, or a mix of both as children; the slot rewrite only handled the single-element form, so mixed content lost its icon treatment. Children are normalised into slots again, the selected segment reports its state to assistive technology, and clicking it no longer emits a change it used to swallow. NavButton's props became a union: a label button with optional icons, or an icon button that requires its icon. Neither form can now be written so that it renders nothing. The visual treatment prop is called variant, matching the other components. The language selector lets the button own its label typography instead of composing a retired global class, and the two style modules the rebuild orphaned are gone.
librowski
force-pushed
the
ds2-nav-button
branch
from
August 21, 2026 11:51
ce365d1 to
7948a91
Compare
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
1 participant
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.
Rebuilds
NavButtonon the same shape as the newButtonand addsMenuTriggerButton.API —
size,styleVariantand explicitprefixIcon/suffixIconslots. The label/icon/icon+label subtypes are gone, and with them the shared children-shape guards: nothing imports them any more, soguards.tsand its spec are deleted.Selected is not pressed — this is the point of the layer. Selection (
isSelected) survives hover, and pointer-down overrides it; each state draws its own token, exactly as the design defines and as the token export ships (nav-button-bg-primary-{default,hover,pressed,active,focus,disabled}).Sizes — seven steps from the design set: boxes 48/42/36/32/28/24/20, icon-only padding 12/11/9/7/6/6/4, gap 8 (6 for the two smallest), radius 8/8/6/4/4/4/4, icon boxes 24/20/18/18/16/12/12. Nav labels keep the regular weight, unlike the emphasized button labels.
styleVariant: 'plain'is the design's "no background" treatment — transparent by default, still lit on the other states.MenuTriggerButton — new, composes NavButton and maps
isOpenonto selection.SegmentPicker keeps its public API: it consumed NavButton's subcomponent prop types, and now translates its own long-form sizes and shapes to the new slots internally.
Verified at the tip of the stack (so this covers the four layers below it): ui/sdk lint + typecheck,
build:ui,build:lib, stylelint, all test suites, docs build (211 pages), demo build.