@razorpay/blade 10.15.3 → 10.17.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.
Files changed (30) hide show
  1. package/build/components/index.d.ts +432 -2
  2. package/build/components/index.development.web.js +2674 -1967
  3. package/build/components/index.development.web.js.map +1 -1
  4. package/build/components/index.native.d.ts +111 -2
  5. package/build/components/index.native.js +373 -354
  6. package/build/components/index.native.js.map +1 -1
  7. package/build/components/index.production.web.js +2653 -1966
  8. package/build/components/index.production.web.js.map +1 -1
  9. package/build/css/bankingThemeDarkDesktop.css +2 -3
  10. package/build/css/bankingThemeDarkMobile.css +2 -3
  11. package/build/css/bankingThemeLightDesktop.css +3 -4
  12. package/build/css/bankingThemeLightMobile.css +3 -4
  13. package/build/css/paymentThemeDarkDesktop.css +3 -4
  14. package/build/css/paymentThemeDarkMobile.css +3 -4
  15. package/build/css/paymentThemeLightDesktop.css +3 -4
  16. package/build/css/paymentThemeLightMobile.css +3 -4
  17. package/build/tokens/index.d.ts +0 -1
  18. package/build/tokens/index.development.web.js +7 -19
  19. package/build/tokens/index.development.web.js.map +1 -1
  20. package/build/tokens/index.native.d.ts +0 -1
  21. package/build/tokens/index.native.js +3 -3
  22. package/build/tokens/index.native.js.map +1 -1
  23. package/build/tokens/index.production.web.js +7 -19
  24. package/build/tokens/index.production.web.js.map +1 -1
  25. package/build/utils/index.d.ts +1 -2
  26. package/build/utils/index.development.web.js.map +1 -1
  27. package/build/utils/index.native.d.ts +1 -2
  28. package/build/utils/index.native.js.map +1 -1
  29. package/build/utils/index.production.web.js.map +1 -1
  30. package/package.json +31 -20
package/build/css/bankingThemeDarkDesktop.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Thu, 26 Oct 2023 11:24:32 GMT
3
+ * Generated on Tue, 31 Oct 2023 10:57:34 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -52,10 +52,9 @@
52
52
  --colors-surface-action-icon-active-high-contrast: hsla(0, 0%, 99%, 1);
53
53
  --colors-surface-action-icon-disabled-low-contrast: hsla(233, 11%, 84%, 0.18);
54
54
  --colors-surface-action-icon-disabled-high-contrast: hsla(233, 11%, 84%, 0.18);
55
- --colors-surface-overlay-background-400: hsla(0, 0, 0, 0);
55
+ --colors-surface-overlay-background-400: hsla(230, 16%, 37%, 0.64);
56
56
  --colors-surface-overlay-background-800: hsla(231, 11%, 12%, 0.72);
57
57
  --colors-surface-popup-background: hsla(231, 35%, 22%, 1);
58
- --colors-overlay-background: hsla(231, 11%, 12%, 0.72);
59
58
  --colors-brand-primary-300: hsla(218, 89%, 51%, 0.18);
60
59
  --colors-brand-primary-400: hsla(218, 89%, 51%, 0.32);
61
60
  --colors-brand-primary-500: hsla(213, 91%, 66%, 1);
package/build/css/bankingThemeDarkMobile.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Thu, 26 Oct 2023 11:24:32 GMT
3
+ * Generated on Tue, 31 Oct 2023 10:57:34 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -52,10 +52,9 @@
52
52
  --colors-surface-action-icon-active-high-contrast: hsla(0, 0%, 99%, 1);
53
53
  --colors-surface-action-icon-disabled-low-contrast: hsla(233, 11%, 84%, 0.18);
54
54
  --colors-surface-action-icon-disabled-high-contrast: hsla(233, 11%, 84%, 0.18);
55
- --colors-surface-overlay-background-400: hsla(0, 0, 0, 0);
55
+ --colors-surface-overlay-background-400: hsla(230, 16%, 37%, 0.64);
56
56
  --colors-surface-overlay-background-800: hsla(231, 11%, 12%, 0.72);
57
57
  --colors-surface-popup-background: hsla(231, 35%, 22%, 1);
58
- --colors-overlay-background: hsla(231, 11%, 12%, 0.72);
59
58
  --colors-brand-primary-300: hsla(218, 89%, 51%, 0.18);
60
59
  --colors-brand-primary-400: hsla(218, 89%, 51%, 0.32);
61
60
  --colors-brand-primary-500: hsla(213, 91%, 66%, 1);
package/build/css/bankingThemeLightDesktop.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Thu, 26 Oct 2023 11:24:32 GMT
3
+ * Generated on Tue, 31 Oct 2023 10:57:34 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -52,10 +52,9 @@
52
52
  --colors-surface-action-icon-active-high-contrast: hsla(0, 0%, 100%, 1);
53
53
  --colors-surface-action-icon-disabled-low-contrast: hsla(226, 15%, 54%, 0.18);
54
54
  --colors-surface-action-icon-disabled-high-contrast: hsla(226, 15%, 54%, 0.18);
55
- --colors-surface-overlay-background-400: hsla(0, 0, 0, 0);
55
+ --colors-surface-overlay-background-400: hsla(225, 18%, 69%, 0.64);
56
56
  --colors-surface-overlay-background-800: hsla(214, 15%, 18%, 0.64);
57
- --colors-surface-popup-background: hsla(226, 15%, 54%, 1);
58
- --colors-overlay-background: hsla(214, 15%, 18%, 0.64);
57
+ --colors-surface-popup-background: hsla(0, 0%, 100%, 1);
59
58
  --colors-brand-primary-300: hsla(218, 89%, 51%, 0.09);
60
59
  --colors-brand-primary-400: hsla(218, 89%, 51%, 0.18);
61
60
  --colors-brand-primary-500: hsla(218, 89%, 51%, 1);
package/build/css/bankingThemeLightMobile.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Thu, 26 Oct 2023 11:24:32 GMT
3
+ * Generated on Tue, 31 Oct 2023 10:57:34 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -52,10 +52,9 @@
52
52
  --colors-surface-action-icon-active-high-contrast: hsla(0, 0%, 100%, 1);
53
53
  --colors-surface-action-icon-disabled-low-contrast: hsla(226, 15%, 54%, 0.18);
54
54
  --colors-surface-action-icon-disabled-high-contrast: hsla(226, 15%, 54%, 0.18);
55
- --colors-surface-overlay-background-400: hsla(0, 0, 0, 0);
55
+ --colors-surface-overlay-background-400: hsla(225, 18%, 69%, 0.64);
56
56
  --colors-surface-overlay-background-800: hsla(214, 15%, 18%, 0.64);
57
- --colors-surface-popup-background: hsla(226, 15%, 54%, 1);
58
- --colors-overlay-background: hsla(214, 15%, 18%, 0.64);
57
+ --colors-surface-popup-background: hsla(0, 0%, 100%, 1);
59
58
  --colors-brand-primary-300: hsla(218, 89%, 51%, 0.09);
60
59
  --colors-brand-primary-400: hsla(218, 89%, 51%, 0.18);
61
60
  --colors-brand-primary-500: hsla(218, 89%, 51%, 1);
package/build/css/paymentThemeDarkDesktop.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Thu, 26 Oct 2023 11:24:32 GMT
3
+ * Generated on Tue, 31 Oct 2023 10:57:34 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -52,10 +52,9 @@
52
52
  --colors-surface-action-icon-active-high-contrast: hsla(0, 0%, 99%, 1);
53
53
  --colors-surface-action-icon-disabled-low-contrast: hsla(220, 11%, 84%, 0.18);
54
54
  --colors-surface-action-icon-disabled-high-contrast: hsla(220, 11%, 84%, 0.18);
55
- --colors-surface-overlay-background-400: hsla(0, 0, 0, 0);
55
+ --colors-surface-overlay-background-400: hsla(221, 16%, 37%, 0.64);
56
56
  --colors-surface-overlay-background-800: hsla(231, 11%, 12%, 0.72);
57
- --colors-surface-popup-background: hsla(218, 11%, 84%, 1);
58
- --colors-overlay-background: hsla(231, 11%, 12%, 0.72);
57
+ --colors-surface-popup-background: hsla(220, 35%, 22%, 1);
59
58
  --colors-brand-primary-300: hsla(218, 89%, 51%, 0.18);
60
59
  --colors-brand-primary-400: hsla(218, 89%, 51%, 0.32);
61
60
  --colors-brand-primary-500: hsla(213, 91%, 66%, 1);
package/build/css/paymentThemeDarkMobile.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Thu, 26 Oct 2023 11:24:32 GMT
3
+ * Generated on Tue, 31 Oct 2023 10:57:34 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -52,10 +52,9 @@
52
52
  --colors-surface-action-icon-active-high-contrast: hsla(0, 0%, 99%, 1);
53
53
  --colors-surface-action-icon-disabled-low-contrast: hsla(220, 11%, 84%, 0.18);
54
54
  --colors-surface-action-icon-disabled-high-contrast: hsla(220, 11%, 84%, 0.18);
55
- --colors-surface-overlay-background-400: hsla(0, 0, 0, 0);
55
+ --colors-surface-overlay-background-400: hsla(221, 16%, 37%, 0.64);
56
56
  --colors-surface-overlay-background-800: hsla(231, 11%, 12%, 0.72);
57
- --colors-surface-popup-background: hsla(218, 11%, 84%, 1);
58
- --colors-overlay-background: hsla(231, 11%, 12%, 0.72);
57
+ --colors-surface-popup-background: hsla(220, 35%, 22%, 1);
59
58
  --colors-brand-primary-300: hsla(218, 89%, 51%, 0.18);
60
59
  --colors-brand-primary-400: hsla(218, 89%, 51%, 0.32);
61
60
  --colors-brand-primary-500: hsla(213, 91%, 66%, 1);
package/build/css/paymentThemeLightDesktop.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Thu, 26 Oct 2023 11:24:32 GMT
3
+ * Generated on Tue, 31 Oct 2023 10:57:34 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -52,10 +52,9 @@
52
52
  --colors-surface-action-icon-active-high-contrast: hsla(0, 0%, 100%, 1);
53
53
  --colors-surface-action-icon-disabled-low-contrast: hsla(216, 15%, 54%, 0.18);
54
54
  --colors-surface-action-icon-disabled-high-contrast: hsla(216, 15%, 54%, 0.18);
55
- --colors-surface-overlay-background-400: hsla(0, 0, 0, 0);
55
+ --colors-surface-overlay-background-400: hsla(214, 18%, 69%, 0.64);
56
56
  --colors-surface-overlay-background-800: hsla(214, 15%, 18%, 0.64);
57
- --colors-surface-popup-background: hsla(220, 30%, 96%, 1);
58
- --colors-overlay-background: hsla(214, 15%, 18%, 0.64);
57
+ --colors-surface-popup-background: hsla(0, 0%, 100%, 1);
59
58
  --colors-brand-primary-300: hsla(218, 89%, 51%, 0.09);
60
59
  --colors-brand-primary-400: hsla(218, 89%, 51%, 0.18);
61
60
  --colors-brand-primary-500: hsla(218, 89%, 51%, 1);
package/build/css/paymentThemeLightMobile.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Thu, 26 Oct 2023 11:24:32 GMT
3
+ * Generated on Tue, 31 Oct 2023 10:57:34 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -52,10 +52,9 @@
52
52
  --colors-surface-action-icon-active-high-contrast: hsla(0, 0%, 100%, 1);
53
53
  --colors-surface-action-icon-disabled-low-contrast: hsla(216, 15%, 54%, 0.18);
54
54
  --colors-surface-action-icon-disabled-high-contrast: hsla(216, 15%, 54%, 0.18);
55
- --colors-surface-overlay-background-400: hsla(0, 0, 0, 0);
55
+ --colors-surface-overlay-background-400: hsla(214, 18%, 69%, 0.64);
56
56
  --colors-surface-overlay-background-800: hsla(214, 15%, 18%, 0.64);
57
- --colors-surface-popup-background: hsla(220, 30%, 96%, 1);
58
- --colors-overlay-background: hsla(214, 15%, 18%, 0.64);
57
+ --colors-surface-popup-background: hsla(0, 0%, 100%, 1);
59
58
  --colors-brand-primary-300: hsla(218, 89%, 51%, 0.09);
60
59
  --colors-brand-primary-400: hsla(218, 89%, 51%, 0.18);
61
60
  --colors-brand-primary-500: hsla(218, 89%, 51%, 1);
package/build/tokens/index.d.ts CHANGED
@@ -519,7 +519,6 @@ declare type Colors = {
519
519
  overlay: Record<'background', Record<400 | 800, string>>;
520
520
  popup: Record<'background', string>;
521
521
  };
522
- overlay: Record<'background', string>;
523
522
  action: {
524
523
  background: Omit<ActionVariants, 'link'>;
525
524
  border: Omit<ActionVariants, 'link'>;
package/build/tokens/index.development.web.js CHANGED
@@ -189,7 +189,7 @@ var colors$2 = {
189
189
  a300: "hsla(214, 21%, 94%, ".concat(opacity[1], ")"),
190
190
  a400: "hsla(214, 21%, 94%, ".concat(opacity[2], ")"),
191
191
  a500: "hsla(214, 21%, 94%, ".concat(opacity[3], ")"),
192
- a1100: "hsla(0, 0, 0, ".concat(opacity[0], ")")
192
+ a1100: "hsla(214, 18%, 69%, ".concat(opacity[6], ")")
193
193
  },
194
194
  blueGrayDark: {
195
195
  0: "hsla(0, 0%, 99%, ".concat(opacity[9], ")"),
@@ -214,7 +214,7 @@ var colors$2 = {
214
214
  a300: "hsla(217, 11%, 76%, ".concat(opacity[1], ")"),
215
215
  a400: "hsla(217, 11%, 76%, ".concat(opacity[2], ")"),
216
216
  a500: "hsla(217, 11%, 76%, ".concat(opacity[3], ")"),
217
- a1100: "hsla(0, 0, 0, ".concat(opacity[0], ")")
217
+ a1100: "hsla(221, 16%, 37%, ".concat(opacity[6], ")")
218
218
  },
219
219
  navyGrayLight: {
220
220
  0: "hsla(0, 0%, 100%, ".concat(opacity[9], ")"),
@@ -239,7 +239,7 @@ var colors$2 = {
239
239
  a300: "hsla(223, 21%, 94%, ".concat(opacity[1], ")"),
240
240
  a400: "hsla(223, 21%, 94%, ".concat(opacity[2], ")"),
241
241
  a500: "hsla(223, 21%, 94%, ".concat(opacity[3], ")"),
242
- a1100: "hsla(0, 0, 0, ".concat(opacity[0], ")")
242
+ a1100: "hsla(225, 18%, 69%, ".concat(opacity[6], ")")
243
243
  },
244
244
  navyGrayDark: {
245
245
  0: "hsla(0, 0%, 99%, ".concat(opacity[9], ")"),
@@ -264,7 +264,7 @@ var colors$2 = {
264
264
  a300: "hsla(231, 11%, 76%, ".concat(opacity[1], ")"),
265
265
  a400: "hsla(231, 11%, 76%, ".concat(opacity[2], ")"),
266
266
  a500: "hsla(231, 11%, 76%, ".concat(opacity[3], ")"),
267
- a1100: "hsla(0, 0, 0, ".concat(opacity[0], ")")
267
+ a1100: "hsla(230, 16%, 37%, ".concat(opacity[6], ")")
268
268
  },
269
269
  ashGrayLight: {
270
270
  0: "hsla(0, 0%, 100%, ".concat(opacity[9], ")"),
@@ -677,12 +677,9 @@ var colors$1 = {
677
677
  }
678
678
  },
679
679
  popup: {
680
- background: colors$2.neutral.blueGrayLight[100]
680
+ background: colors$2.neutral.blueGrayLight[0]
681
681
  }
682
682
  },
683
- overlay: {
684
- background: colors$2.neutral.ashGrayLight.a1100
685
- },
686
683
  brand: {
687
684
  primary: {
688
685
  300: colors$2.chromatic.azure.a50,
@@ -2211,12 +2208,9 @@ var colors$1 = {
2211
2208
  }
2212
2209
  },
2213
2210
  popup: {
2214
- background: colors$2.neutral.blueGrayDark[100]
2211
+ background: colors$2.neutral.blueGrayDark[700]
2215
2212
  }
2216
2213
  },
2217
- overlay: {
2218
- background: colors$2.neutral.ashGrayDark.a1100
2219
- },
2220
2214
  brand: {
2221
2215
  primary: {
2222
2216
  300: colors$2.chromatic.azure.a100,
@@ -3758,12 +3752,9 @@ var colors = {
3758
3752
  }
3759
3753
  },
3760
3754
  popup: {
3761
- background: colors$2.neutral.navyGrayLight[700]
3755
+ background: colors$2.neutral.navyGrayLight[0]
3762
3756
  }
3763
3757
  },
3764
- overlay: {
3765
- background: colors$2.neutral.ashGrayLight.a1100
3766
- },
3767
3758
  brand: {
3768
3759
  primary: {
3769
3760
  300: colors$2.chromatic.azure.a50,
@@ -5295,9 +5286,6 @@ var colors = {
5295
5286
  background: colors$2.neutral.navyGrayDark[700]
5296
5287
  }
5297
5288
  },
5298
- overlay: {
5299
- background: colors$2.neutral.ashGrayDark.a1100
5300
- },
5301
5289
  brand: {
5302
5290
  primary: {
5303
5291
  300: colors$2.chromatic.azure.a100,