feat(blade-svelte): add primary variant to Alert component#3417
Open
rzp-slash[bot] wants to merge 1 commit into
Open
feat(blade-svelte): add primary variant to Alert component#3417rzp-slash[bot] wants to merge 1 commit into
rzp-slash[bot] wants to merge 1 commit into
Conversation
|
Contributor
|
✅ PR title follows Conventional Commits specification. |
Collaborator
🛡️ Coverage ReportSummaryFull Coverage Details |
|
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 64699e7:
|
Co-authored-by: rohankokane-dev <rohan.kokane@razorpay.com>
rzp-slash
Bot
force-pushed
the
feat/alert-primary-variant
branch
from
2376b2f to
64699e7
Compare
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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
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.
Summary
Adds a
primaryvariant (color) to the Alert component inblade-svelteandblade-core.Changes
blade-core/src/styles/Alert/alert.ts: Added'primary'toAlertColortype; addedprimarykey to the CVA color variant; updatedgetAlertIconColorTokento returninteractive.icon.primary.normalfor primary color with subtle emphasis (instead of the non-existentfeedback.icon.primary.intense).blade-core/src/styles/Alert/alert.module.css: Added compound CSS rules for.color-primary.emphasis-subtleand.color-primary.emphasis-intense.blade-svelte/src/components/Alert/types.ts: Added'primary'to theAlertColortype.blade-svelte/src/components/Alert/Alert.svelte: Addedprimaryto theintentIconMap(usesInfoIcon).blade-svelte/src/components/Alert/Alert.stories.svelte: Added'primary'to the color control options; added two new stories — Primary and Primary Intense.Design Reference
Design spec was provided via screenshot. The primary variant follows the same pattern as other feedback colors:
subtle--interactive-background-primary-fadedintense--interactive-background-primary-defaultNo accent border — the primary variant uses the same clean rounded-rectangle container as other colors.
Design Assumptions (items not shown in the spec)
InfoIconinteractive.icon.primary.normalfeedback.icon.primary.*tokensurface.icon.staticWhite.normalgetAlertTextColorTokenreturns white for intense, dark gray for subtle — both are correct for primary backgroundsrole="status"