fix: button group loading #2544
Conversation
tewarig
requested review from
chaitanyadeorukhkar,
kamleshchandnani,
anuraghazra,
snitin315 and
saurabhdaware
as code owners
🦋 Changeset detectedLatest commit: bc674f5 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 |
|
✅ PR title follows Conventional Commits specification. |
|
This pull request is automatically built and testable in CodeSandbox. To see build info of the built libraries, click here or the icon next to each commit SHA. Latest deployment of this branch, based on commit bc674f5:
|
Bundle Size ReportUpdated Components
|
| ...(variant === 'secondary' && { | ||
| 'button[role="button"]:first-child': { | ||
| borderRight: 'none', | ||
| borderTopLeftRadius: makeBorderSize(theme.border.radius.medium), | ||
| borderBottomLeftRadius: makeBorderSize(theme.border.radius.medium), | ||
| }, | ||
| 'button[role="button"]:not(:first-child):not(:last-child)': { | ||
| borderLeft: 'none', | ||
| borderRight: 'none', | ||
| }, | ||
| 'button[role="button"]:last-child': { | ||
| borderLeft: 'none', | ||
| borderTopRightRadius: makeBorderSize(theme.border.radius.medium), | ||
| borderBottomRightRadius: makeBorderSize(theme.border.radius.medium), | ||
| }, |
There was a problem hiding this comment.
How is this related to loading? 🤔
There was a problem hiding this comment.
Earlier, we added a border to the Button Group container and removed the borders from all individual buttons.
However, when we enabled the loading state for a button, it looked like this:
I think the ideal way to handle this was to modify the border-radius of the buttons. So, I refactored the Button Group code a bit and also updated how the border is handled for the secondary variant.
Description
this fixes - https://razorpay.atlassian.net/browse/DSSUP-245
Changes
Additional Information
Component Checklist