Add default CloseButton label #3393
Open
Conversation
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
🦋 Changeset detectedLatest commit: 910a15d The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Contributor
|
Size Change: -573 B (-0.08%) Total Size: 752 kB
ℹ️ View Unchanged
|
sirineJ
force-pushed
the
close-button-label
branch
from
6a6f8a1 to
c6e3a62
Compare
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## main #3393 +/- ##
==========================================
- Coverage 93.89% 93.89% -0.01%
==========================================
Files 195 195
Lines 4406 4403 -3
Branches 1708 1706 -2
==========================================
- Hits 4137 4134 -3
Misses 244 244
Partials 25 25
🚀 New features to boost your workflow:
|
connor-baer
reviewed
Dec 8, 2025
Comment on lines
+33
to
+34
| render(<CloseButton ref={ref}>Close</CloseButton>); | ||
| const button = screen.getByRole('button', { name: 'Close' }); |
Member
There was a problem hiding this comment.
Shall we clean up the AccessibilityError for the missing clearLabel as well?
| * Important for accessibility. | ||
| */ | ||
| removeButtonLabel: string; | ||
| removeButtonLabel?: string; |
Member
There was a problem hiding this comment.
This prop should remain required unless we add default translations, since "Close" is appropriate as a label here.
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.
Addresses DSYS-XXXX
Purpose
This PR centralizes the translation for the “Close” label required by the CloseButton component by moving it directly into the component. Many components across our apps (including several in CUI) previously duplicated this translation, requiring each consumer to provide its own label. This would reduce effort required from developers to provide the label and reduce overall bundle size.
Approach and changes
added translations under CloseButton/translations
removed translations for the close button from the Dialog component
made the label optional for components that use the CloseButton component:
Some form components, such as the SearchInput and the AutocompleteInput, use the CloseButton for clearing text inputs. These have their own translations as the purpose of the button is different (clearing vs closing) and are not concerned with this change.
For some components, the appearance of the CloseButton is not longer conditioned by the presence of the close label, but only by the presence of the button's callback (CardHeader, NotificationBanner, NotificationInline, Tag, SidePanel)
Definition of done