aws-amplify / aws-amplify/amplify-ui

Easily Add Badge To Upper Right of Button

Open
#1,848 1 comment 0 reactions 0 assignees View on GitHub
feature-request Primitive React
Dominant language
TypeScript
Stars
1.1k
Forks
347
Avg merge
18h 29m
Merged PRs (30d)
9

Description

### On which framework/platform would you like to see this feature implemented?

React

### Which UI component is this feature-request for?

Other

### Please describe your feature-request in detail.

Similar to MUI Badge (https://mui.com/material-ui/react-badge/), I'd like to be able to add a Badge to the top of a button indicating the number of notifications. There is currently no easy way to do this with Amplify UI I'm aware of.

### Please describe a solution you'd like.

There could be a prop on `Button` which accepts a Badge putting it on upper right hand corner of button. Location could be configurable.

### We love contributors! Is this something you'd be interested in working on?

- [ ] 👋 I may be able to implement this feature request.
- [ ] ⚠️ This feature might incur a breaking change.

Contributor guide

Open the contributing guide

Research direction

Start at the Amplify UI Button component and review how existing UI components are composed, then compare the requested behavior with the MUI Badge reference. Define how a Badge prop and configurable position should work on a Button, and verify that the notification count appears at the button’s upper-right corner without disrupting existing button behavior.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Feature
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.