TextOnly
Action without decorative iconography.
Product UI Kit
Product Action Buttons
CoastKey ProductButton wrapper with source-backed Primary / Secondary / Outline / Ghost / Destructive variants, S/M/L/XL height ladder, TextOnly / LeadingIcon / TrailingIcon / LeadingAndTrailingIcon / IconOnly / CircleIconOnly compositions, ProductButtonGroup action clusters, ProductShareButton, and disclosure trigger anatomy. Filter chips, toggle/favorite actions, and grouped switchers live on their own Product UI Kit routes.
ProductButton
Content hug and fixed action scale
Text buttons: intrinsic width
Size S
Size M
Size L
Size XL
Icon buttons: fixed control scale
primary
secondary
outline
ghost
destructive
ProductButton
Icon composition contract
LeadingIcon
The leading glyph identifies the action domain.
TrailingIcon
The trailing glyph communicates progression.
LeadingAndTrailingIcon
Domain on the left, disclosure on the right.
IconOnly
A fixed action shell always has an accessible label.
CircleIconOnly
Circle is reserved for prominent compact actions.
Links / text navigation
Button and link boundary
ProductButton
Use for an immediate in-context action.
ProductButtonGroup
Grouped action buttons
Grouped utility actions
Primary decision pair
ProductShareButton
Share action button
ProductShareButton / sizes
Non-toggle overlay action with a consumer-provided icon slot.
ProductShareButton / states
Compact / 24
Standard / M / 32
Large / XL / 48
ProductButton
Text button: variants and visual states
rest
hover
pressed
focus
invalid
disabled
ProductButton
Text and icon button: variants and sizes
ProductButton
Icon button: variants and visual states
rest
hover
pressed
focus
invalid
disabled
Disclosure trigger
Disclosure trigger area
Collapsed
Expanded
aria-expanded describes the disclosure state. It is not a substitute for a regular button visual state.