@razorpay/blade 3.8.0 → 5.0.0
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/CHANGELOG.md +62 -0
- package/build/components/index.d.ts +3 -3
- package/build/components/index.native.d.ts +4 -4
- package/build/components/index.native.js +13 -13
- package/build/components/index.native.js.map +1 -1
- package/build/components/index.web.js +147 -121
- package/build/components/index.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
|
@@ -2541,9 +2541,9 @@ var Symbol = _Symbol;
|
|
|
2541
2541
|
var symbolProto = Symbol ? Symbol.prototype : undefined;
|
|
2542
2542
|
symbolProto ? symbolProto.valueOf : undefined;
|
|
2543
2543
|
|
|
2544
|
-
function ownKeys$
|
|
2544
|
+
function ownKeys$z(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
2545
2545
|
|
|
2546
|
-
function _objectSpread$
|
|
2546
|
+
function _objectSpread$z(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$z(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$z(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
2547
2547
|
|
|
2548
2548
|
var accessibilityValue = {
|
|
2549
2549
|
valueMax: 'aria-valuemax',
|
|
@@ -2560,7 +2560,7 @@ var accessibilityState = {
|
|
|
2560
2560
|
}; // TODO:
|
|
2561
2561
|
// accessibilityViewIsModal
|
|
2562
2562
|
|
|
2563
|
-
var accessibilityMap = _objectSpread$
|
|
2563
|
+
var accessibilityMap = _objectSpread$z(_objectSpread$z(_objectSpread$z({}, accessibilityState), accessibilityValue), {}, {
|
|
2564
2564
|
activeDescendant: 'aria-activedescendant',
|
|
2565
2565
|
atomic: 'aria-atomic',
|
|
2566
2566
|
autoComplete: 'aria-autocomplete',
|
|
@@ -3469,9 +3469,9 @@ var fontFamily = {
|
|
|
3469
3469
|
code: 'monospace'
|
|
3470
3470
|
};
|
|
3471
3471
|
|
|
3472
|
-
function ownKeys$
|
|
3472
|
+
function ownKeys$y(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
3473
3473
|
|
|
3474
|
-
function _objectSpread$
|
|
3474
|
+
function _objectSpread$y(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$y(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$y(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
3475
3475
|
var fontWeight = {
|
|
3476
3476
|
regular: 400,
|
|
3477
3477
|
bold: 700
|
|
@@ -3479,7 +3479,7 @@ var fontWeight = {
|
|
|
3479
3479
|
({
|
|
3480
3480
|
onDesktop: {
|
|
3481
3481
|
fonts: {
|
|
3482
|
-
family: _objectSpread$
|
|
3482
|
+
family: _objectSpread$y({}, fontFamily),
|
|
3483
3483
|
size: {
|
|
3484
3484
|
10: 9,
|
|
3485
3485
|
25: 10,
|
|
@@ -3496,7 +3496,7 @@ var fontWeight = {
|
|
|
3496
3496
|
900: 36,
|
|
3497
3497
|
1000: 40
|
|
3498
3498
|
},
|
|
3499
|
-
weight: _objectSpread$
|
|
3499
|
+
weight: _objectSpread$y({}, fontWeight)
|
|
3500
3500
|
},
|
|
3501
3501
|
lineHeights: {
|
|
3502
3502
|
s: 16,
|
|
@@ -3513,7 +3513,7 @@ var fontWeight = {
|
|
|
3513
3513
|
},
|
|
3514
3514
|
onMobile: {
|
|
3515
3515
|
fonts: {
|
|
3516
|
-
family: _objectSpread$
|
|
3516
|
+
family: _objectSpread$y({}, fontFamily),
|
|
3517
3517
|
size: {
|
|
3518
3518
|
10: 10,
|
|
3519
3519
|
25: 11,
|
|
@@ -3530,7 +3530,7 @@ var fontWeight = {
|
|
|
3530
3530
|
900: 29,
|
|
3531
3531
|
1000: 29
|
|
3532
3532
|
},
|
|
3533
|
-
weight: _objectSpread$
|
|
3533
|
+
weight: _objectSpread$y({}, fontWeight)
|
|
3534
3534
|
},
|
|
3535
3535
|
lineHeights: {
|
|
3536
3536
|
s: 16,
|
|
@@ -3617,7 +3617,7 @@ var getCommonStyles = function getCommonStyles(props) {
|
|
|
3617
3617
|
var feedbackColors = theme.colors.feedback;
|
|
3618
3618
|
return {
|
|
3619
3619
|
background: feedbackColors.background[intent][contrastType],
|
|
3620
|
-
padding: "".concat(makeSpace(theme.spacing[4]), " ").concat(makeSpace(theme.spacing[5])),
|
|
3620
|
+
padding: isBorderless ? "".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])),
|
|
3621
3621
|
borderRadius: makeBorderSize(isBorderless ? theme.border.radius.none : theme.border.radius.medium),
|
|
3622
3622
|
borderColor: feedbackColors.border[intent][contrastType],
|
|
3623
3623
|
borderWidth: makeBorderSize(isBorderless ? theme.border.width.none : theme.border.width.thin),
|
|
@@ -3705,9 +3705,9 @@ var Rect = function Rect(_ref) {
|
|
|
3705
3705
|
});
|
|
3706
3706
|
};
|
|
3707
3707
|
|
|
3708
|
-
function ownKeys$
|
|
3708
|
+
function ownKeys$x(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
3709
3709
|
|
|
3710
|
-
function _objectSpread$
|
|
3710
|
+
function _objectSpread$x(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$x(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$x(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
3711
3711
|
|
|
3712
3712
|
var Svg = function Svg(_ref) {
|
|
3713
3713
|
var children = _ref.children,
|
|
@@ -3715,7 +3715,7 @@ var Svg = function Svg(_ref) {
|
|
|
3715
3715
|
viewBox = _ref.viewBox,
|
|
3716
3716
|
width = _ref.width,
|
|
3717
3717
|
fill = _ref.fill;
|
|
3718
|
-
return /*#__PURE__*/jsx("svg", _objectSpread$
|
|
3718
|
+
return /*#__PURE__*/jsx("svg", _objectSpread$x(_objectSpread$x({}, makeAccessible({
|
|
3719
3719
|
hidden: true
|
|
3720
3720
|
})), {}, {
|
|
3721
3721
|
height: height,
|
|
@@ -3750,9 +3750,9 @@ var useTheme = function useTheme() {
|
|
|
3750
3750
|
return themeContext;
|
|
3751
3751
|
};
|
|
3752
3752
|
|
|
3753
|
-
function ownKeys$
|
|
3753
|
+
function ownKeys$w(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
3754
3754
|
|
|
3755
|
-
function _objectSpread$
|
|
3755
|
+
function _objectSpread$w(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$w(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$w(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
3756
3756
|
|
|
3757
3757
|
var BladeProvider = function BladeProvider(_ref) {
|
|
3758
3758
|
var themeTokens = _ref.themeTokens,
|
|
@@ -3779,9 +3779,9 @@ var BladeProvider = function BladeProvider(_ref) {
|
|
|
3779
3779
|
var onColorMode = "on".concat(toTitleCase(colorScheme));
|
|
3780
3780
|
var onDeviceType = "on".concat(toTitleCase(matchedDeviceType));
|
|
3781
3781
|
|
|
3782
|
-
var theme = _objectSpread$
|
|
3782
|
+
var theme = _objectSpread$w(_objectSpread$w({}, themeTokens), {}, {
|
|
3783
3783
|
colors: themeTokens.colors[onColorMode],
|
|
3784
|
-
shadows: _objectSpread$
|
|
3784
|
+
shadows: _objectSpread$w(_objectSpread$w({}, themeTokens.shadows), {}, {
|
|
3785
3785
|
color: themeTokens.shadows.color[onColorMode]
|
|
3786
3786
|
}),
|
|
3787
3787
|
typography: themeTokens.typography[onDeviceType]
|
|
@@ -3802,7 +3802,7 @@ var BladeProvider = function BladeProvider(_ref) {
|
|
|
3802
3802
|
});
|
|
3803
3803
|
};
|
|
3804
3804
|
|
|
3805
|
-
var iconSize = {
|
|
3805
|
+
var iconSize$1 = {
|
|
3806
3806
|
xsmall: 8,
|
|
3807
3807
|
small: 12,
|
|
3808
3808
|
medium: 16,
|
|
@@ -3818,8 +3818,8 @@ function useIconProps(_ref) {
|
|
|
3818
3818
|
var _useTheme = useTheme(),
|
|
3819
3819
|
theme = _useTheme.theme;
|
|
3820
3820
|
|
|
3821
|
-
var height = makeSize(iconSize[size]);
|
|
3822
|
-
var width = makeSize(iconSize[size]);
|
|
3821
|
+
var height = makeSize(iconSize$1[size]);
|
|
3822
|
+
var width = makeSize(iconSize$1[size]);
|
|
3823
3823
|
var iconColor = color === 'currentColor' ? 'currentColor' : get_1(theme.colors, color, '');
|
|
3824
3824
|
return {
|
|
3825
3825
|
height: height,
|
|
@@ -4822,9 +4822,9 @@ var ExternalLinkIcon = function ExternalLinkIcon(_ref) {
|
|
|
4822
4822
|
});
|
|
4823
4823
|
};
|
|
4824
4824
|
|
|
4825
|
-
function ownKeys$
|
|
4825
|
+
function ownKeys$v(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
4826
4826
|
|
|
4827
|
-
function _objectSpread$
|
|
4827
|
+
function _objectSpread$v(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$v(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$v(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
4828
4828
|
var StyledButton = /*#__PURE__*/styled.button.withConfig({
|
|
4829
4829
|
displayName: "StyledIconButtonweb__StyledButton",
|
|
4830
4830
|
componentId: "sc-1f4cg7d-0"
|
|
@@ -4867,7 +4867,7 @@ var StyledIconButton = function StyledIconButton(_ref) {
|
|
|
4867
4867
|
size = _ref.size,
|
|
4868
4868
|
contrast = _ref.contrast,
|
|
4869
4869
|
accessibilityLabel = _ref.accessibilityLabel;
|
|
4870
|
-
return /*#__PURE__*/jsx(StyledButton, _objectSpread$
|
|
4870
|
+
return /*#__PURE__*/jsx(StyledButton, _objectSpread$v(_objectSpread$v({
|
|
4871
4871
|
onClick: onClick,
|
|
4872
4872
|
contrast: contrast,
|
|
4873
4873
|
type: "button"
|
|
@@ -5061,10 +5061,10 @@ var getBaseTextStyles = function getBaseTextStyles(_ref) {
|
|
|
5061
5061
|
|
|
5062
5062
|
var _excluded$3 = ["color", "fontFamily", "fontSize", "fontWeight", "fontStyle", "textDecorationLine", "lineHeight", "textAlign"];
|
|
5063
5063
|
|
|
5064
|
-
function ownKeys$
|
|
5064
|
+
function ownKeys$u(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
5065
5065
|
|
|
5066
|
-
function _objectSpread$
|
|
5067
|
-
var StyledBaseText
|
|
5066
|
+
function _objectSpread$u(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$u(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$u(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
5067
|
+
var StyledBaseText = /*#__PURE__*/styled.div.withConfig({
|
|
5068
5068
|
displayName: "BaseTextweb__StyledBaseText",
|
|
5069
5069
|
componentId: "sc-1ob51ew-0"
|
|
5070
5070
|
})(function (_ref) {
|
|
@@ -5107,7 +5107,7 @@ var BaseText = function BaseText(_ref2) {
|
|
|
5107
5107
|
style = _ref2.style,
|
|
5108
5108
|
_ref2$accessibilityPr = _ref2.accessibilityProps,
|
|
5109
5109
|
accessibilityProps = _ref2$accessibilityPr === void 0 ? {} : _ref2$accessibilityPr;
|
|
5110
|
-
return /*#__PURE__*/jsx(StyledBaseText
|
|
5110
|
+
return /*#__PURE__*/jsx(StyledBaseText, _objectSpread$u(_objectSpread$u({
|
|
5111
5111
|
color: color,
|
|
5112
5112
|
fontFamily: fontFamily,
|
|
5113
5113
|
fontSize: fontSize,
|
|
@@ -5126,9 +5126,9 @@ var BaseText = function BaseText(_ref2) {
|
|
|
5126
5126
|
}));
|
|
5127
5127
|
};
|
|
5128
5128
|
|
|
5129
|
-
function ownKeys$
|
|
5129
|
+
function ownKeys$t(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
5130
5130
|
|
|
5131
|
-
function _objectSpread$
|
|
5131
|
+
function _objectSpread$t(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$t(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$t(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
5132
5132
|
|
|
5133
5133
|
var getProps$3 = function getProps(_ref) {
|
|
5134
5134
|
var size = _ref.size,
|
|
@@ -5178,14 +5178,14 @@ var Title = function Title(_ref2) {
|
|
|
5178
5178
|
type: type,
|
|
5179
5179
|
contrast: contrast
|
|
5180
5180
|
});
|
|
5181
|
-
return /*#__PURE__*/jsx(BaseText, _objectSpread$
|
|
5181
|
+
return /*#__PURE__*/jsx(BaseText, _objectSpread$t(_objectSpread$t({}, props), {}, {
|
|
5182
5182
|
children: children
|
|
5183
5183
|
}));
|
|
5184
5184
|
};
|
|
5185
5185
|
|
|
5186
|
-
function ownKeys$
|
|
5186
|
+
function ownKeys$s(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
5187
5187
|
|
|
5188
|
-
function _objectSpread$
|
|
5188
|
+
function _objectSpread$s(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$s(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$s(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
5189
5189
|
|
|
5190
5190
|
var getProps$2 = function getProps(_ref) {
|
|
5191
5191
|
var variant = _ref.variant,
|
|
@@ -5256,14 +5256,14 @@ var Heading = function Heading(_ref2) {
|
|
|
5256
5256
|
weight: weight,
|
|
5257
5257
|
contrast: contrast
|
|
5258
5258
|
});
|
|
5259
|
-
return /*#__PURE__*/jsx(BaseText, _objectSpread$
|
|
5259
|
+
return /*#__PURE__*/jsx(BaseText, _objectSpread$s(_objectSpread$s({}, props), {}, {
|
|
5260
5260
|
children: children
|
|
5261
5261
|
}));
|
|
5262
5262
|
};
|
|
5263
5263
|
|
|
5264
|
-
function ownKeys$
|
|
5264
|
+
function ownKeys$r(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
5265
5265
|
|
|
5266
|
-
function _objectSpread$
|
|
5266
|
+
function _objectSpread$r(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$r(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$r(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
5267
5267
|
|
|
5268
5268
|
var getTextProps = function getTextProps(_ref) {
|
|
5269
5269
|
var variant = _ref.variant,
|
|
@@ -5289,10 +5289,6 @@ var getTextProps = function getTextProps(_ref) {
|
|
|
5289
5289
|
props.lineHeight = 's';
|
|
5290
5290
|
}
|
|
5291
5291
|
} else if (variant === 'caption') {
|
|
5292
|
-
if (weight === 'bold') {
|
|
5293
|
-
throw new Error("[Blade: Text]: weight cannot be 'bold' when variant is 'caption'");
|
|
5294
|
-
}
|
|
5295
|
-
|
|
5296
5292
|
if (size === 'small') {
|
|
5297
5293
|
throw new Error("[Blade: Text]: size cannot be 'small' when variant is 'caption'");
|
|
5298
5294
|
}
|
|
@@ -5343,7 +5339,7 @@ var Text = function Text(_ref3) {
|
|
|
5343
5339
|
children = _ref3.children,
|
|
5344
5340
|
color = _ref3.color;
|
|
5345
5341
|
|
|
5346
|
-
var props = _objectSpread$
|
|
5342
|
+
var props = _objectSpread$r(_objectSpread$r({
|
|
5347
5343
|
truncateAfterLines: truncateAfterLines
|
|
5348
5344
|
}, getTextProps({
|
|
5349
5345
|
variant: variant,
|
|
@@ -5355,7 +5351,7 @@ var Text = function Text(_ref3) {
|
|
|
5355
5351
|
color: color
|
|
5356
5352
|
} : {});
|
|
5357
5353
|
|
|
5358
|
-
return /*#__PURE__*/jsx(StyledText, _objectSpread$
|
|
5354
|
+
return /*#__PURE__*/jsx(StyledText, _objectSpread$r(_objectSpread$r({}, props), {}, {
|
|
5359
5355
|
children: children
|
|
5360
5356
|
}));
|
|
5361
5357
|
};
|
|
@@ -5460,16 +5456,16 @@ var getBaseButtonStyles = function getBaseButtonStyles(_ref) {
|
|
|
5460
5456
|
};
|
|
5461
5457
|
};
|
|
5462
5458
|
|
|
5463
|
-
function ownKeys$
|
|
5459
|
+
function ownKeys$q(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
5464
5460
|
|
|
5465
|
-
function _objectSpread$
|
|
5461
|
+
function _objectSpread$q(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$q(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$q(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
5466
5462
|
var StyledBaseButton = /*#__PURE__*/styled.button.attrs(function (props) {
|
|
5467
|
-
return _objectSpread$
|
|
5463
|
+
return _objectSpread$q({}, props.accessibilityProps);
|
|
5468
5464
|
}).withConfig({
|
|
5469
5465
|
displayName: "StyledBaseButtonweb__StyledBaseButton",
|
|
5470
5466
|
componentId: "sc-26bt38-0"
|
|
5471
5467
|
})(function (props) {
|
|
5472
|
-
return _objectSpread$
|
|
5468
|
+
return _objectSpread$q(_objectSpread$q({}, getBaseButtonStyles(props)), {}, {
|
|
5473
5469
|
transitionProperty: 'background-color, border-color, box-shadow',
|
|
5474
5470
|
transitionTimingFunction: get_1(props.theme.motion, props.motionEasing),
|
|
5475
5471
|
transitionDuration: castWebType(makeMotionTime(get_1(props.theme.motion, props.motionDuration))),
|
|
@@ -5512,7 +5508,7 @@ var typography = {
|
|
|
5512
5508
|
large: 'm'
|
|
5513
5509
|
}
|
|
5514
5510
|
};
|
|
5515
|
-
var minHeight
|
|
5511
|
+
var minHeight = {
|
|
5516
5512
|
xsmall: 28,
|
|
5517
5513
|
small: 32,
|
|
5518
5514
|
medium: 36,
|
|
@@ -5766,9 +5762,9 @@ var SpinningBox = /*#__PURE__*/styled(Box).withConfig({
|
|
|
5766
5762
|
return css(["width:max-content;display:inline-flex;animation:", " ", " ", " infinite;"], rotate, makeMotionTime(get_1(theme.motion, motion.duration)), get_1(theme.motion, motion.easing));
|
|
5767
5763
|
});
|
|
5768
5764
|
|
|
5769
|
-
function ownKeys$
|
|
5765
|
+
function ownKeys$p(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
5770
5766
|
|
|
5771
|
-
function _objectSpread$
|
|
5767
|
+
function _objectSpread$p(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$p(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$p(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
5772
5768
|
|
|
5773
5769
|
var getColor = function getColor(_ref) {
|
|
5774
5770
|
var contrast = _ref.contrast,
|
|
@@ -5800,7 +5796,7 @@ var BaseSpinner = function BaseSpinner(_ref2) {
|
|
|
5800
5796
|
|
|
5801
5797
|
return /*#__PURE__*/jsx(Box, {
|
|
5802
5798
|
display: "flex",
|
|
5803
|
-
children: /*#__PURE__*/jsxs(Box, _objectSpread$
|
|
5799
|
+
children: /*#__PURE__*/jsxs(Box, _objectSpread$p(_objectSpread$p({
|
|
5804
5800
|
display: "flex",
|
|
5805
5801
|
alignItems: "center",
|
|
5806
5802
|
flexDirection: labelPosition === 'right' ? 'row' : 'column'
|
|
@@ -5833,9 +5829,9 @@ var BaseSpinner = function BaseSpinner(_ref2) {
|
|
|
5833
5829
|
});
|
|
5834
5830
|
};
|
|
5835
5831
|
|
|
5836
|
-
function ownKeys$
|
|
5832
|
+
function ownKeys$o(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
5837
5833
|
|
|
5838
|
-
function _objectSpread$
|
|
5834
|
+
function _objectSpread$o(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$o(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$o(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
5839
5835
|
|
|
5840
5836
|
var getColorToken$1 = function getColorToken(_ref) {
|
|
5841
5837
|
var property = _ref.property,
|
|
@@ -5868,7 +5864,7 @@ var getProps$1 = function getProps(_ref2) {
|
|
|
5868
5864
|
spinnerSize: buttonSizeToSpinnerSizeMap[size],
|
|
5869
5865
|
fontSize: buttonTypographyTokens.fonts.size[size],
|
|
5870
5866
|
lineHeight: buttonTypographyTokens.lineHeights[size],
|
|
5871
|
-
minHeight: makeSize(minHeight
|
|
5867
|
+
minHeight: makeSize(minHeight[size]),
|
|
5872
5868
|
iconPadding: hasIcon && children !== null && children !== void 0 && children.trim() ? "spacing.".concat(textPadding[size]) : undefined,
|
|
5873
5869
|
iconColor: getColorToken$1({
|
|
5874
5870
|
property: 'icon',
|
|
@@ -6080,7 +6076,7 @@ var BaseButton = function BaseButton(_ref4) {
|
|
|
6080
6076
|
motionEasing = _getProps.motionEasing;
|
|
6081
6077
|
|
|
6082
6078
|
return /*#__PURE__*/jsxs(StyledBaseButton, {
|
|
6083
|
-
accessibilityProps: _objectSpread$
|
|
6079
|
+
accessibilityProps: _objectSpread$o({}, makeAccessible({
|
|
6084
6080
|
role: 'button',
|
|
6085
6081
|
label: accessibilityLabel
|
|
6086
6082
|
})),
|
|
@@ -6171,16 +6167,16 @@ var getStyledLinkStyles = function getStyledLinkStyles(_ref) {
|
|
|
6171
6167
|
};
|
|
6172
6168
|
};
|
|
6173
6169
|
|
|
6174
|
-
function ownKeys$
|
|
6170
|
+
function ownKeys$n(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
6175
6171
|
|
|
6176
|
-
function _objectSpread$
|
|
6172
|
+
function _objectSpread$n(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$n(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$n(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
6177
6173
|
var StyledLink$1 = /*#__PURE__*/styled.button.attrs(function (props) {
|
|
6178
|
-
return _objectSpread$
|
|
6174
|
+
return _objectSpread$n({}, props.accessibilityProps);
|
|
6179
6175
|
}).withConfig({
|
|
6180
6176
|
displayName: "StyledBaseLinkweb__StyledLink",
|
|
6181
6177
|
componentId: "sc-1yj1z8h-0"
|
|
6182
6178
|
})(function (props) {
|
|
6183
|
-
return _objectSpread$
|
|
6179
|
+
return _objectSpread$n(_objectSpread$n({}, getStyledLinkStyles(props)), {}, {
|
|
6184
6180
|
display: 'inline-block',
|
|
6185
6181
|
borderRadius: makeBorderSize(props.theme.border.radius.small),
|
|
6186
6182
|
transitionProperty: 'box-shadow',
|
|
@@ -6237,9 +6233,9 @@ var useInteraction = function useInteraction() {
|
|
|
6237
6233
|
|
|
6238
6234
|
var _excluded$2 = ["currentInteraction", "setCurrentInteraction"];
|
|
6239
6235
|
|
|
6240
|
-
function ownKeys$
|
|
6236
|
+
function ownKeys$m(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
6241
6237
|
|
|
6242
|
-
function _objectSpread$
|
|
6238
|
+
function _objectSpread$m(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$m(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$m(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
6243
6239
|
|
|
6244
6240
|
var getColorToken = function getColorToken(_ref) {
|
|
6245
6241
|
var variant = _ref.variant,
|
|
@@ -6393,8 +6389,8 @@ var BaseLink = function BaseLink(_ref3) {
|
|
|
6393
6389
|
}
|
|
6394
6390
|
};
|
|
6395
6391
|
|
|
6396
|
-
return /*#__PURE__*/jsx(StyledLink$1, _objectSpread$
|
|
6397
|
-
accessibilityProps: _objectSpread$
|
|
6392
|
+
return /*#__PURE__*/jsx(StyledLink$1, _objectSpread$m(_objectSpread$m({}, syntheticEvents), {}, {
|
|
6393
|
+
accessibilityProps: _objectSpread$m({}, makeAccessible({
|
|
6398
6394
|
role: role,
|
|
6399
6395
|
label: accessibilityLabel,
|
|
6400
6396
|
disabled: disabled
|
|
@@ -6448,9 +6444,9 @@ var BaseLink = function BaseLink(_ref3) {
|
|
|
6448
6444
|
}));
|
|
6449
6445
|
};
|
|
6450
6446
|
|
|
6451
|
-
function ownKeys$
|
|
6447
|
+
function ownKeys$l(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
6452
6448
|
|
|
6453
|
-
function _objectSpread$
|
|
6449
|
+
function _objectSpread$l(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$l(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$l(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
6454
6450
|
var isReactNative$3 = getPlatformType() === 'react-native'; // Need extra wrappers on React Native only for alignment
|
|
6455
6451
|
|
|
6456
6452
|
var SecondaryActionWrapper = isReactNative$3 ? Box : Fragment;
|
|
@@ -6458,7 +6454,8 @@ var CloseButtonWrapper = isReactNative$3 ? Box : Fragment;
|
|
|
6458
6454
|
var intentIconMap = {
|
|
6459
6455
|
positive: CheckCircleIcon,
|
|
6460
6456
|
negative: AlertTriangleIcon,
|
|
6461
|
-
information:
|
|
6457
|
+
information: InfoIcon,
|
|
6458
|
+
neutral: InfoIcon,
|
|
6462
6459
|
notice: AlertTriangleIcon$1
|
|
6463
6460
|
};
|
|
6464
6461
|
|
|
@@ -6473,7 +6470,7 @@ var Alert = function Alert(_ref) {
|
|
|
6473
6470
|
_ref$isFullWidth = _ref.isFullWidth,
|
|
6474
6471
|
isFullWidth = _ref$isFullWidth === void 0 ? false : _ref$isFullWidth,
|
|
6475
6472
|
_ref$intent = _ref.intent,
|
|
6476
|
-
intent = _ref$intent === void 0 ? '
|
|
6473
|
+
intent = _ref$intent === void 0 ? 'neutral' : _ref$intent,
|
|
6477
6474
|
_ref$isBorderless = _ref.isBorderless,
|
|
6478
6475
|
isBorderless = _ref$isBorderless === void 0 ? false : _ref$isBorderless,
|
|
6479
6476
|
actions = _ref.actions;
|
|
@@ -6488,31 +6485,46 @@ var Alert = function Alert(_ref) {
|
|
|
6488
6485
|
setIsVisible = _useState2[1];
|
|
6489
6486
|
|
|
6490
6487
|
var contrastType = "".concat(contrast, "Contrast");
|
|
6488
|
+
var iconSize = isBorderless ? 'large' : 'medium';
|
|
6489
|
+
var textSize = isBorderless ? 'medium' : 'small';
|
|
6491
6490
|
var Icon = intentIconMap[intent];
|
|
6492
6491
|
|
|
6493
|
-
var icon = /*#__PURE__*/jsx(
|
|
6494
|
-
|
|
6495
|
-
|
|
6492
|
+
var icon = /*#__PURE__*/jsx(Box, {
|
|
6493
|
+
marginTop: "spacing.1",
|
|
6494
|
+
display: "flex",
|
|
6495
|
+
children: /*#__PURE__*/jsx(Icon, {
|
|
6496
|
+
color: "feedback.icon.".concat(intent, ".").concat(contrastType),
|
|
6497
|
+
size: iconSize
|
|
6498
|
+
})
|
|
6496
6499
|
});
|
|
6497
6500
|
|
|
6498
6501
|
var _title = title ? /*#__PURE__*/jsx(Box, {
|
|
6499
6502
|
marginBottom: "spacing.2",
|
|
6500
|
-
children: /*#__PURE__*/jsx(Heading, {
|
|
6503
|
+
children: isBorderless ? /*#__PURE__*/jsx(Heading, {
|
|
6501
6504
|
size: "small",
|
|
6502
6505
|
contrast: contrast,
|
|
6503
6506
|
children: title
|
|
6507
|
+
}) : /*#__PURE__*/jsx(Text, {
|
|
6508
|
+
weight: "bold",
|
|
6509
|
+
contrast: contrast,
|
|
6510
|
+
children: title
|
|
6504
6511
|
})
|
|
6505
6512
|
}) : null;
|
|
6506
6513
|
|
|
6507
|
-
var _description = /*#__PURE__*/jsx(
|
|
6508
|
-
|
|
6509
|
-
children:
|
|
6514
|
+
var _description = /*#__PURE__*/jsx(Box, {
|
|
6515
|
+
marginTop: title || isReactNative$3 ? 'spacing.0' : 'spacing.1',
|
|
6516
|
+
children: /*#__PURE__*/jsx(Text, {
|
|
6517
|
+
size: textSize,
|
|
6518
|
+
contrast: contrast,
|
|
6519
|
+
children: description
|
|
6520
|
+
})
|
|
6510
6521
|
});
|
|
6511
6522
|
|
|
6512
6523
|
var primaryAction = actions !== null && actions !== void 0 && actions.primary ? /*#__PURE__*/jsx(Box, {
|
|
6513
6524
|
marginRight: "spacing.5",
|
|
6514
6525
|
display: isReactNative$3 ? 'flex' : 'inline-flex',
|
|
6515
6526
|
children: /*#__PURE__*/jsx(BaseButton, {
|
|
6527
|
+
size: textSize,
|
|
6516
6528
|
onClick: actions.primary.onClick,
|
|
6517
6529
|
intent: intent,
|
|
6518
6530
|
contrast: contrast,
|
|
@@ -6536,7 +6548,8 @@ var Alert = function Alert(_ref) {
|
|
|
6536
6548
|
}
|
|
6537
6549
|
|
|
6538
6550
|
var secondaryAction = actions !== null && actions !== void 0 && actions.secondary ? /*#__PURE__*/jsx(SecondaryActionWrapper, {
|
|
6539
|
-
children: /*#__PURE__*/jsx(BaseLink, _objectSpread$
|
|
6551
|
+
children: /*#__PURE__*/jsx(BaseLink, _objectSpread$l(_objectSpread$l({
|
|
6552
|
+
size: textSize,
|
|
6540
6553
|
contrast: contrast,
|
|
6541
6554
|
intent: intent
|
|
6542
6555
|
}, secondaryActionParams), {}, {
|
|
@@ -6564,11 +6577,11 @@ var Alert = function Alert(_ref) {
|
|
|
6564
6577
|
accessibilityLabel: "Dismiss alert",
|
|
6565
6578
|
onClick: onClickDismiss,
|
|
6566
6579
|
contrast: contrast,
|
|
6567
|
-
size:
|
|
6580
|
+
size: iconSize,
|
|
6568
6581
|
icon: CloseIcon
|
|
6569
6582
|
})
|
|
6570
6583
|
}) : null;
|
|
6571
|
-
var a11yProps = makeAccessible(_objectSpread$
|
|
6584
|
+
var a11yProps = makeAccessible(_objectSpread$l({
|
|
6572
6585
|
// React Native doesn't has status as role
|
|
6573
6586
|
role: isReactNative$3 || intent === 'negative' || intent === 'notice' ? 'alert' : 'status'
|
|
6574
6587
|
}, intent === 'notice' && {
|
|
@@ -6579,7 +6592,7 @@ var Alert = function Alert(_ref) {
|
|
|
6579
6592
|
return null;
|
|
6580
6593
|
}
|
|
6581
6594
|
|
|
6582
|
-
return /*#__PURE__*/jsxs(StyledAlert, _objectSpread$
|
|
6595
|
+
return /*#__PURE__*/jsxs(StyledAlert, _objectSpread$l(_objectSpread$l({
|
|
6583
6596
|
intent: intent,
|
|
6584
6597
|
contrastType: contrastType,
|
|
6585
6598
|
isFullWidth: isFullWidth,
|
|
@@ -6587,16 +6600,32 @@ var Alert = function Alert(_ref) {
|
|
|
6587
6600
|
}, a11yProps), {}, {
|
|
6588
6601
|
children: [icon, /*#__PURE__*/jsxs(Box, {
|
|
6589
6602
|
flex: 1,
|
|
6590
|
-
paddingLeft:
|
|
6603
|
+
paddingLeft: isBorderless ? 'spacing.4' : 'spacing.3',
|
|
6591
6604
|
paddingRight: "spacing.2",
|
|
6592
6605
|
children: [_title, _description, _actions]
|
|
6593
6606
|
}), closeButton]
|
|
6594
6607
|
}));
|
|
6595
6608
|
};
|
|
6596
6609
|
|
|
6597
|
-
var
|
|
6598
|
-
small:
|
|
6599
|
-
medium:
|
|
6610
|
+
var verticalPadding$1 = {
|
|
6611
|
+
small: 'spacing.0',
|
|
6612
|
+
medium: 'spacing.1',
|
|
6613
|
+
large: 'spacing.2'
|
|
6614
|
+
};
|
|
6615
|
+
var horizontalPadding$1 = {
|
|
6616
|
+
small: 'spacing.3',
|
|
6617
|
+
medium: 'spacing.3',
|
|
6618
|
+
large: 'spacing.4'
|
|
6619
|
+
};
|
|
6620
|
+
var iconPadding = {
|
|
6621
|
+
small: 'spacing.1',
|
|
6622
|
+
medium: 'spacing.2',
|
|
6623
|
+
large: 'spacing.2'
|
|
6624
|
+
};
|
|
6625
|
+
var iconSize = {
|
|
6626
|
+
small: 'xsmall',
|
|
6627
|
+
medium: 'small',
|
|
6628
|
+
large: 'small'
|
|
6600
6629
|
};
|
|
6601
6630
|
var maxWidth$1 = {
|
|
6602
6631
|
onMobile: 100,
|
|
@@ -6605,12 +6634,10 @@ var maxWidth$1 = {
|
|
|
6605
6634
|
|
|
6606
6635
|
var getStyledBadgeStyles = function getStyledBadgeStyles(_ref) {
|
|
6607
6636
|
var theme = _ref.theme,
|
|
6608
|
-
size = _ref.size,
|
|
6609
6637
|
platform = _ref.platform,
|
|
6610
6638
|
backgroundColor = _ref.backgroundColor;
|
|
6611
6639
|
return {
|
|
6612
6640
|
backgroundColor: get_1(theme.colors, backgroundColor),
|
|
6613
|
-
minHeight: makeSize(minHeight[size]),
|
|
6614
6641
|
borderRadius: makeBorderSize(theme.border.radius.max),
|
|
6615
6642
|
maxWidth: makeSize(maxWidth$1[platform]),
|
|
6616
6643
|
display: 'flex',
|
|
@@ -6618,18 +6645,22 @@ var getStyledBadgeStyles = function getStyledBadgeStyles(_ref) {
|
|
|
6618
6645
|
};
|
|
6619
6646
|
};
|
|
6620
6647
|
|
|
6621
|
-
function ownKeys$
|
|
6648
|
+
function ownKeys$k(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
6622
6649
|
|
|
6623
|
-
function _objectSpread$
|
|
6650
|
+
function _objectSpread$k(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$k(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$k(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
6624
6651
|
var StyledBadge = /*#__PURE__*/styled.div.withConfig({
|
|
6625
6652
|
displayName: "StyledBadgeweb__StyledBadge",
|
|
6626
6653
|
componentId: "sc-1svn4tv-0"
|
|
6627
6654
|
})(function (props) {
|
|
6628
|
-
return _objectSpread$
|
|
6655
|
+
return _objectSpread$k(_objectSpread$k({}, getStyledBadgeStyles(props)), {}, {
|
|
6629
6656
|
width: 'fit-content'
|
|
6630
6657
|
});
|
|
6631
6658
|
});
|
|
6632
6659
|
|
|
6660
|
+
function ownKeys$j(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
6661
|
+
|
|
6662
|
+
function _objectSpread$j(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$j(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$j(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
6663
|
+
|
|
6633
6664
|
var isFeedbackVariant = function isFeedbackVariant(variant) {
|
|
6634
6665
|
var feedbackVariants = ['information', 'negative', 'neutral', 'notice', 'positive'];
|
|
6635
6666
|
return feedbackVariants.includes(variant);
|
|
@@ -6657,21 +6688,6 @@ var getColorProps$1 = function getColorProps(_ref) {
|
|
|
6657
6688
|
return props;
|
|
6658
6689
|
};
|
|
6659
6690
|
|
|
6660
|
-
var StyledBaseText = /*#__PURE__*/styled(BaseText).withConfig({
|
|
6661
|
-
displayName: "Badge__StyledBaseText",
|
|
6662
|
-
componentId: "sc-1iizgt0-0"
|
|
6663
|
-
})(function () {
|
|
6664
|
-
if (getPlatformType() !== 'react-native') {
|
|
6665
|
-
return {
|
|
6666
|
-
whiteSpace: 'nowrap',
|
|
6667
|
-
overflow: 'hidden',
|
|
6668
|
-
textOverflow: 'ellipsis'
|
|
6669
|
-
};
|
|
6670
|
-
}
|
|
6671
|
-
|
|
6672
|
-
return {};
|
|
6673
|
-
});
|
|
6674
|
-
|
|
6675
6691
|
var Badge = function Badge(_ref2) {
|
|
6676
6692
|
var children = _ref2.children,
|
|
6677
6693
|
_ref2$contrast = _ref2.contrast,
|
|
@@ -6704,30 +6720,34 @@ var Badge = function Badge(_ref2) {
|
|
|
6704
6720
|
size: size,
|
|
6705
6721
|
platform: platform,
|
|
6706
6722
|
children: /*#__PURE__*/jsxs(Box, {
|
|
6707
|
-
paddingRight:
|
|
6708
|
-
paddingLeft:
|
|
6723
|
+
paddingRight: horizontalPadding$1[size],
|
|
6724
|
+
paddingLeft: horizontalPadding$1[size],
|
|
6725
|
+
paddingTop: verticalPadding$1[size],
|
|
6726
|
+
paddingBottom: verticalPadding$1[size],
|
|
6709
6727
|
display: "flex",
|
|
6710
|
-
flex: 1,
|
|
6711
6728
|
flexDirection: "row",
|
|
6712
6729
|
justifyContent: "center",
|
|
6713
6730
|
alignItems: "center",
|
|
6714
6731
|
overflow: "hidden",
|
|
6715
6732
|
children: [Icon ? /*#__PURE__*/jsx(Box, {
|
|
6716
|
-
paddingRight: Boolean(Icon) ?
|
|
6733
|
+
paddingRight: Boolean(Icon) ? iconPadding[size] : 'spacing.0',
|
|
6717
6734
|
display: "flex",
|
|
6718
6735
|
children: /*#__PURE__*/jsx(Icon, {
|
|
6719
6736
|
color: iconColor,
|
|
6720
|
-
size:
|
|
6737
|
+
size: iconSize[size]
|
|
6721
6738
|
})
|
|
6722
|
-
}) : null, /*#__PURE__*/jsx(
|
|
6723
|
-
|
|
6724
|
-
|
|
6725
|
-
|
|
6726
|
-
|
|
6727
|
-
|
|
6739
|
+
}) : null, /*#__PURE__*/jsx(Text, _objectSpread$j(_objectSpread$j({}, size === 'small' ? {
|
|
6740
|
+
variant: 'caption'
|
|
6741
|
+
} : {
|
|
6742
|
+
variant: 'body',
|
|
6743
|
+
size: 'small'
|
|
6744
|
+
}), {}, {
|
|
6745
|
+
type: "normal",
|
|
6746
|
+
weight: fontWeight,
|
|
6728
6747
|
truncateAfterLines: 1,
|
|
6748
|
+
color: textColor,
|
|
6729
6749
|
children: children
|
|
6730
|
-
})]
|
|
6750
|
+
}))]
|
|
6731
6751
|
})
|
|
6732
6752
|
});
|
|
6733
6753
|
};
|
|
@@ -7676,9 +7696,9 @@ var variants = {
|
|
|
7676
7696
|
var getHoverStyles = function getHoverStyles(_ref) {
|
|
7677
7697
|
var theme = _ref.theme,
|
|
7678
7698
|
isDisabled = _ref.isDisabled,
|
|
7679
|
-
|
|
7699
|
+
hasError = _ref.hasError,
|
|
7680
7700
|
isChecked = _ref.isChecked;
|
|
7681
|
-
if (isDisabled ||
|
|
7701
|
+
if (isDisabled || hasError) return {};
|
|
7682
7702
|
var checked = isChecked ? 'checked' : 'unchecked';
|
|
7683
7703
|
var backgroundColor = variants["default"].background[checked];
|
|
7684
7704
|
var borderColor = variants["default"].border[checked];
|
|
@@ -7697,7 +7717,7 @@ var StyledInput = /*#__PURE__*/styled.input.withConfig({
|
|
|
7697
7717
|
var theme = _ref2.theme,
|
|
7698
7718
|
isChecked = _ref2.isChecked,
|
|
7699
7719
|
isDisabled = _ref2.isDisabled,
|
|
7700
|
-
|
|
7720
|
+
hasError = _ref2.hasError;
|
|
7701
7721
|
return _objectSpread$d(_objectSpread$d({}, screenReaderStyles), {}, {
|
|
7702
7722
|
'&:focus + div': {
|
|
7703
7723
|
// TODO: Replace with focus outline token
|
|
@@ -7708,7 +7728,7 @@ var StyledInput = /*#__PURE__*/styled.input.withConfig({
|
|
|
7708
7728
|
theme: theme,
|
|
7709
7729
|
isChecked: isChecked,
|
|
7710
7730
|
isDisabled: isDisabled,
|
|
7711
|
-
|
|
7731
|
+
hasError: hasError
|
|
7712
7732
|
}))
|
|
7713
7733
|
});
|
|
7714
7734
|
});
|
|
@@ -7717,11 +7737,11 @@ var SelectorInput = function SelectorInput(_ref3) {
|
|
|
7717
7737
|
var inputProps = _ref3.inputProps,
|
|
7718
7738
|
isChecked = _ref3.isChecked,
|
|
7719
7739
|
isDisabled = _ref3.isDisabled,
|
|
7720
|
-
|
|
7740
|
+
hasError = _ref3.hasError;
|
|
7721
7741
|
return /*#__PURE__*/jsx(StyledInput, _objectSpread$d({
|
|
7722
7742
|
isChecked: isChecked,
|
|
7723
7743
|
isDisabled: isDisabled,
|
|
7724
|
-
|
|
7744
|
+
hasError: hasError
|
|
7725
7745
|
}, inputProps));
|
|
7726
7746
|
};
|
|
7727
7747
|
|
|
@@ -7830,7 +7850,7 @@ var Checkbox = function Checkbox(_ref) {
|
|
|
7830
7850
|
children: [/*#__PURE__*/jsx(SelectorInput, {
|
|
7831
7851
|
isChecked: state.isChecked || Boolean(isIndeterminate),
|
|
7832
7852
|
isDisabled: _isDisabled,
|
|
7833
|
-
|
|
7853
|
+
hasError: _hasError,
|
|
7834
7854
|
inputProps: inputProps
|
|
7835
7855
|
}), /*#__PURE__*/jsx(CheckboxIcon, {
|
|
7836
7856
|
size: _size,
|
|
@@ -8997,6 +9017,13 @@ var getKeyboardAndAutocompleteProps = function getKeyboardAndAutocompleteProps(_
|
|
|
8997
9017
|
keyboardAndAutocompleteProps.type = 'text';
|
|
8998
9018
|
}
|
|
8999
9019
|
|
|
9020
|
+
if (type === 'search') {
|
|
9021
|
+
/* when input type:search is provided at that time browser adds a weird close button which collides with our clear button and then we have 2 clear buttons
|
|
9022
|
+
* source: https://github.com/razorpay/blade/issues/857#issue-1457367160
|
|
9023
|
+
*/
|
|
9024
|
+
keyboardAndAutocompleteProps.type = 'text';
|
|
9025
|
+
}
|
|
9026
|
+
|
|
9000
9027
|
return keyboardAndAutocompleteProps;
|
|
9001
9028
|
}; // need to do this to tell TS to infer type as TextInput of React Native and make it believe that `ref.current.clear()` exists
|
|
9002
9029
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
@@ -10297,8 +10324,7 @@ var Radio = function Radio(_ref) {
|
|
|
10297
10324
|
children: [/*#__PURE__*/jsx(SelectorInput, {
|
|
10298
10325
|
isChecked: state.isChecked,
|
|
10299
10326
|
isDisabled: _isDisabled,
|
|
10300
|
-
|
|
10301
|
-
,
|
|
10327
|
+
hasError: hasError,
|
|
10302
10328
|
inputProps: inputProps
|
|
10303
10329
|
}), /*#__PURE__*/jsx(RadioIcon, {
|
|
10304
10330
|
size: _size,
|