@razorpay/blade 10.15.0 → 10.15.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/components/index.development.web.js +11 -10
- package/build/components/index.development.web.js.map +1 -1
- package/build/components/index.native.js +2 -2
- package/build/components/index.native.js.map +1 -1
- package/build/components/index.production.web.js +11 -10
- package/build/components/index.production.web.js.map +1 -1
- package/build/css/bankingThemeDarkDesktop.css +1 -1
- package/build/css/bankingThemeDarkMobile.css +1 -1
- package/build/css/bankingThemeLightDesktop.css +1 -1
- package/build/css/bankingThemeLightMobile.css +1 -1
- package/build/css/paymentThemeDarkDesktop.css +1 -1
- package/build/css/paymentThemeDarkMobile.css +1 -1
- package/build/css/paymentThemeLightDesktop.css +1 -1
- package/build/css/paymentThemeLightMobile.css +1 -1
- package/package.json +1 -1
|
@@ -16206,15 +16206,15 @@ var MAX_WIDTH$2 = size[584];
|
|
|
16206
16206
|
var getCommonStyles = function getCommonStyles(props) {
|
|
16207
16207
|
var theme = props.theme,
|
|
16208
16208
|
contrastType = props.contrastType,
|
|
16209
|
-
|
|
16209
|
+
color = props.color,
|
|
16210
16210
|
isFullWidth = props.isFullWidth,
|
|
16211
16211
|
isDesktop = props.isDesktop;
|
|
16212
16212
|
var feedbackColors = theme.colors.feedback;
|
|
16213
16213
|
return {
|
|
16214
|
-
background: feedbackColors.background[
|
|
16214
|
+
background: feedbackColors.background[color][contrastType],
|
|
16215
16215
|
padding: isFullWidth ? "".concat(makeSpace(theme.spacing[4]), " ").concat(makeSpace(theme.spacing[5])) : "".concat(makeSpace(theme.spacing[3]), " ").concat(makeSpace(theme.spacing[3]), " ").concat(makeSpace(theme.spacing[4]), " ").concat(makeSpace(theme.spacing[3])),
|
|
16216
16216
|
borderRadius: makeBorderSize(isFullWidth ? theme.border.radius.none : theme.border.radius.medium),
|
|
16217
|
-
borderColor: feedbackColors.border[
|
|
16217
|
+
borderColor: feedbackColors.border[color][contrastType],
|
|
16218
16218
|
borderWidth: makeBorderSize(isFullWidth ? theme.border.width.none : theme.border.width.thin),
|
|
16219
16219
|
borderStyle: 'solid',
|
|
16220
16220
|
display: 'flex',
|
|
@@ -17497,7 +17497,8 @@ var Alert = function Alert(_ref) {
|
|
|
17497
17497
|
var contrastType = "".concat(contrast, "Contrast");
|
|
17498
17498
|
var iconSize = isFullWidth ? 'large' : 'medium';
|
|
17499
17499
|
var textSize = isFullWidth ? 'medium' : 'small';
|
|
17500
|
-
var
|
|
17500
|
+
var alertColor = color !== null && color !== void 0 ? color : intent;
|
|
17501
|
+
var Icon = intentIconMap[alertColor];
|
|
17501
17502
|
var iconOffset = 'spacing.1';
|
|
17502
17503
|
|
|
17503
17504
|
// certain special cases below needs special care for near perfect alignment
|
|
@@ -17522,7 +17523,7 @@ var Alert = function Alert(_ref) {
|
|
|
17522
17523
|
marginTop: iconOffset,
|
|
17523
17524
|
display: "flex",
|
|
17524
17525
|
children: /*#__PURE__*/jsx(Icon, {
|
|
17525
|
-
color: "feedback.icon.".concat(
|
|
17526
|
+
color: "feedback.icon.".concat(alertColor, ".").concat(contrastType),
|
|
17526
17527
|
size: iconSize
|
|
17527
17528
|
})
|
|
17528
17529
|
});
|
|
@@ -17555,7 +17556,7 @@ var Alert = function Alert(_ref) {
|
|
|
17555
17556
|
children: /*#__PURE__*/jsx(BaseButton, {
|
|
17556
17557
|
size: textSize,
|
|
17557
17558
|
onClick: actions.primary.onClick,
|
|
17558
|
-
color:
|
|
17559
|
+
color: alertColor,
|
|
17559
17560
|
variant: contrast === 'high' ? 'primary' : 'secondary',
|
|
17560
17561
|
children: actions.primary.text
|
|
17561
17562
|
})
|
|
@@ -17580,7 +17581,7 @@ var Alert = function Alert(_ref) {
|
|
|
17580
17581
|
display: isReactNative$3 ? castNativeType('flex') : castWebType('inline-flex'),
|
|
17581
17582
|
children: /*#__PURE__*/jsx(BaseLink, _objectSpread$1j(_objectSpread$1j({
|
|
17582
17583
|
size: textSize,
|
|
17583
|
-
color: contrast === 'high' ? 'white' :
|
|
17584
|
+
color: contrast === 'high' ? 'white' : alertColor
|
|
17584
17585
|
}, secondaryActionParams), {}, {
|
|
17585
17586
|
children: actions.secondary.text
|
|
17586
17587
|
}))
|
|
@@ -17616,8 +17617,8 @@ var Alert = function Alert(_ref) {
|
|
|
17616
17617
|
}) : null;
|
|
17617
17618
|
var a11yProps = makeAccessible(_objectSpread$1j({
|
|
17618
17619
|
// React Native doesn't has status as role
|
|
17619
|
-
role: isReactNative$3 ||
|
|
17620
|
-
},
|
|
17620
|
+
role: isReactNative$3 || alertColor === 'negative' || alertColor === 'notice' ? 'alert' : 'status'
|
|
17621
|
+
}, alertColor === 'notice' && {
|
|
17621
17622
|
liveRegion: 'polite'
|
|
17622
17623
|
}));
|
|
17623
17624
|
if (!isVisible) {
|
|
@@ -17628,7 +17629,7 @@ var Alert = function Alert(_ref) {
|
|
|
17628
17629
|
testID: testID
|
|
17629
17630
|
})), getStyledProps(styledProps)), {}, {
|
|
17630
17631
|
children: /*#__PURE__*/jsxs(StyledAlert, {
|
|
17631
|
-
|
|
17632
|
+
color: alertColor,
|
|
17632
17633
|
contrastType: contrastType,
|
|
17633
17634
|
isFullWidth: isFullWidth,
|
|
17634
17635
|
isDesktop: isDesktop,
|