Skip to content

Conversation

crisbeto
Copy link
Member

Adds support for the tonal button appearance from the spec. It can be enabled by setting matButton="tonal" on the button.

Fixes #28809.

@crisbeto crisbeto added the target: major This PR is targeted for the next major release label Mar 17, 2025
@crisbeto crisbeto requested a review from a team as a code owner March 17, 2025 13:02
@crisbeto crisbeto requested review from mmalerba and wagnermaciel and removed request for a team March 17, 2025 13:02
@angular-robot angular-robot bot added detected: feature PR contains a feature commit area: material/button labels Mar 17, 2025
@crisbeto crisbeto requested a review from andrewseguin March 17, 2025 13:03
@crisbeto crisbeto added the dev-app preview When applied, previews of the dev-app are deployed to Firebase label Mar 17, 2025
Copy link

github-actions bot commented Mar 17, 2025

Deployed dev-app for 5693a07 to: https://ng-dev-previews-comp--pr-angular-components-30638-dev-8rktwxmd.web.app

Note: As new commits are pushed to this pull request, this link is updated after the preview is rebuilt.

@eneajaho
Copy link
Contributor

Looks like density is not being applied.

CleanShot 2025-03-17 at 20 06 37

@crisbeto crisbeto force-pushed the 28809/tonal-button branch from 266d614 to 072ad1d Compare March 17, 2025 19:15
@crisbeto
Copy link
Member Author

oops, good catch. I've pushed a fix.

Adds support for the tonal button appearance from the spec. It can be enabled by setting `matButton="tonal"` on the button.

Fixes angular#28809.
@crisbeto crisbeto force-pushed the 28809/tonal-button branch from 072ad1d to 5693a07 Compare March 18, 2025 07:41
@crisbeto crisbeto removed the request for review from wagnermaciel March 18, 2025 07:41
@crisbeto crisbeto added the action: merge The PR is ready for merge by the caretaker label Mar 18, 2025
@crisbeto crisbeto merged commit fb81ab4 into angular:main Mar 18, 2025
20 of 22 checks passed
@JWess
Copy link

JWess commented Mar 18, 2025

Why does it use matButton="tonal" instead of mat-tonal-button, a la mat-stroked-button, mat-raised-button, and mat-flat-button?

@mjamin
Copy link

mjamin commented Mar 18, 2025

Looks like an oversight not to include 'tonal' in the selectors and _inferAppearance?

@JWess
Copy link

JWess commented Mar 26, 2025

@crisbeto Any word on the two questions above?

@crisbeto
Copy link
Member Author

I intentionally didn't include an attribute selector for the tonal button, because long-term we want to switch to the matButton input. It has the advantage of being type-checked and supporting dynamic changes of the appearance.

@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Apr 26, 2025
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
action: merge The PR is ready for merge by the caretaker area: material/button detected: feature PR contains a feature commit dev-app preview When applied, previews of the dev-app are deployed to Firebase target: major This PR is targeted for the next major release
Projects
None yet
Development

Successfully merging this pull request may close these issues.

feat(button): add support for filled tonal button same as in M3 spec
7 participants