@razorpay/blade 8.6.1 → 8.8.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 (28) hide show
  1. package/build/components/index.d.ts +186 -76
  2. package/build/components/index.native.d.ts +157 -76
  3. package/build/components/index.native.js +20 -14
  4. package/build/components/index.native.js.map +1 -1
  5. package/build/components/index.web.js +4442 -1603
  6. package/build/components/index.web.js.map +1 -1
  7. package/build/css/bankingThemeDarkDesktop.css +2 -2
  8. package/build/css/bankingThemeDarkMobile.css +2 -2
  9. package/build/css/bankingThemeLightDesktop.css +2 -2
  10. package/build/css/bankingThemeLightMobile.css +2 -2
  11. package/build/css/paymentThemeDarkDesktop.css +2 -2
  12. package/build/css/paymentThemeDarkMobile.css +2 -2
  13. package/build/css/paymentThemeLightDesktop.css +2 -2
  14. package/build/css/paymentThemeLightMobile.css +2 -2
  15. package/build/tokens/index.d.ts +11 -4
  16. package/build/tokens/index.native.d.ts +11 -4
  17. package/build/tokens/index.native.js +5 -5
  18. package/build/tokens/index.native.js.map +1 -1
  19. package/build/tokens/index.web.js +30 -15
  20. package/build/tokens/index.web.js.map +1 -1
  21. package/build/utils/index.d.ts +10 -0
  22. package/build/utils/index.native.d.ts +10 -0
  23. package/build/utils/index.native.js +1 -1
  24. package/build/utils/index.native.js.map +1 -1
  25. package/build/utils/index.web.js +10 -0
  26. package/build/utils/index.web.js.map +1 -1
  27. package/codemods/migrate-typography/transformers/migrate-typography.ts +0 -0
  28. package/package.json +3 -2
package/build/css/bankingThemeDarkDesktop.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Thu, 01 Jun 2023 08:36:14 GMT
3
+ * Generated on Wed, 07 Jun 2023 13:01:31 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -50,7 +50,7 @@
50
50
  --colors-surface-action-icon-active-high-contrast: hsla(0, 0%, 99%, 1);
51
51
  --colors-surface-action-icon-disabled-low-contrast: hsla(230, 23%, 29%, 1);
52
52
  --colors-surface-action-icon-disabled-high-contrast: hsla(233, 11%, 84%, 0.18);
53
- --colors-overlay-background: hsla(231, 11%, 76%, 0.18);
53
+ --colors-overlay-background: hsla(231, 11%, 12%, 0.72);
54
54
  --colors-brand-primary-300: hsla(218, 89%, 51%, 0.18);
55
55
  --colors-brand-primary-400: hsla(218, 89%, 51%, 0.32);
56
56
  --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, 01 Jun 2023 08:36:14 GMT
3
+ * Generated on Wed, 07 Jun 2023 13:01:31 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -50,7 +50,7 @@
50
50
  --colors-surface-action-icon-active-high-contrast: hsla(0, 0%, 99%, 1);
51
51
  --colors-surface-action-icon-disabled-low-contrast: hsla(230, 23%, 29%, 1);
52
52
  --colors-surface-action-icon-disabled-high-contrast: hsla(233, 11%, 84%, 0.18);
53
- --colors-overlay-background: hsla(231, 11%, 76%, 0.18);
53
+ --colors-overlay-background: hsla(231, 11%, 12%, 0.72);
54
54
  --colors-brand-primary-300: hsla(218, 89%, 51%, 0.18);
55
55
  --colors-brand-primary-400: hsla(218, 89%, 51%, 0.32);
56
56
  --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, 01 Jun 2023 08:36:14 GMT
3
+ * Generated on Wed, 07 Jun 2023 13:01:31 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -50,7 +50,7 @@
50
50
  --colors-surface-action-icon-active-high-contrast: hsla(0, 0%, 100%, 1);
51
51
  --colors-surface-action-icon-disabled-low-contrast: hsla(226, 19%, 89%, 1);
52
52
  --colors-surface-action-icon-disabled-high-contrast: hsla(226, 15%, 54%, 0.18);
53
- --colors-overlay-background: hsla(226, 15%, 54%, 0.32);
53
+ --colors-overlay-background: hsla(214, 15%, 18%, 0.64);
54
54
  --colors-brand-primary-300: hsla(218, 89%, 51%, 0.09);
55
55
  --colors-brand-primary-400: hsla(218, 89%, 51%, 0.18);
56
56
  --colors-brand-primary-500: hsla(213, 89%, 56%, 1);
package/build/css/bankingThemeLightMobile.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Thu, 01 Jun 2023 08:36:14 GMT
3
+ * Generated on Wed, 07 Jun 2023 13:01:31 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -50,7 +50,7 @@
50
50
  --colors-surface-action-icon-active-high-contrast: hsla(0, 0%, 100%, 1);
51
51
  --colors-surface-action-icon-disabled-low-contrast: hsla(226, 19%, 89%, 1);
52
52
  --colors-surface-action-icon-disabled-high-contrast: hsla(226, 15%, 54%, 0.18);
53
- --colors-overlay-background: hsla(226, 15%, 54%, 0.32);
53
+ --colors-overlay-background: hsla(214, 15%, 18%, 0.64);
54
54
  --colors-brand-primary-300: hsla(218, 89%, 51%, 0.09);
55
55
  --colors-brand-primary-400: hsla(218, 89%, 51%, 0.18);
56
56
  --colors-brand-primary-500: hsla(213, 89%, 56%, 1);
package/build/css/paymentThemeDarkDesktop.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Thu, 01 Jun 2023 08:36:14 GMT
3
+ * Generated on Wed, 07 Jun 2023 13:01:31 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -50,7 +50,7 @@
50
50
  --colors-surface-action-icon-active-high-contrast: hsla(0, 0%, 99%, 1);
51
51
  --colors-surface-action-icon-disabled-low-contrast: hsla(220, 23%, 29%, 1);
52
52
  --colors-surface-action-icon-disabled-high-contrast: hsla(220, 11%, 84%, 0.18);
53
- --colors-overlay-background: hsla(217, 11%, 76%, 0.18);
53
+ --colors-overlay-background: hsla(231, 11%, 12%, 0.72);
54
54
  --colors-brand-primary-300: hsla(218, 89%, 51%, 0.18);
55
55
  --colors-brand-primary-400: hsla(218, 89%, 51%, 0.32);
56
56
  --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, 01 Jun 2023 08:36:14 GMT
3
+ * Generated on Wed, 07 Jun 2023 13:01:31 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -50,7 +50,7 @@
50
50
  --colors-surface-action-icon-active-high-contrast: hsla(0, 0%, 99%, 1);
51
51
  --colors-surface-action-icon-disabled-low-contrast: hsla(220, 23%, 29%, 1);
52
52
  --colors-surface-action-icon-disabled-high-contrast: hsla(220, 11%, 84%, 0.18);
53
- --colors-overlay-background: hsla(217, 11%, 76%, 0.18);
53
+ --colors-overlay-background: hsla(231, 11%, 12%, 0.72);
54
54
  --colors-brand-primary-300: hsla(218, 89%, 51%, 0.18);
55
55
  --colors-brand-primary-400: hsla(218, 89%, 51%, 0.32);
56
56
  --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, 01 Jun 2023 08:36:14 GMT
3
+ * Generated on Wed, 07 Jun 2023 13:01:31 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -50,7 +50,7 @@
50
50
  --colors-surface-action-icon-active-high-contrast: hsla(0, 0%, 100%, 1);
51
51
  --colors-surface-action-icon-disabled-low-contrast: hsla(216, 19%, 89%, 1);
52
52
  --colors-surface-action-icon-disabled-high-contrast: hsla(216, 15%, 54%, 0.18);
53
- --colors-overlay-background: hsla(216, 15%, 54%, 0.32);
53
+ --colors-overlay-background: hsla(214, 15%, 18%, 0.64);
54
54
  --colors-brand-primary-300: hsla(218, 89%, 51%, 0.09);
55
55
  --colors-brand-primary-400: hsla(218, 89%, 51%, 0.18);
56
56
  --colors-brand-primary-500: hsla(213, 89%, 56%, 1);
package/build/css/paymentThemeLightMobile.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Thu, 01 Jun 2023 08:36:14 GMT
3
+ * Generated on Wed, 07 Jun 2023 13:01:31 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -50,7 +50,7 @@
50
50
  --colors-surface-action-icon-active-high-contrast: hsla(0, 0%, 100%, 1);
51
51
  --colors-surface-action-icon-disabled-low-contrast: hsla(216, 19%, 89%, 1);
52
52
  --colors-surface-action-icon-disabled-high-contrast: hsla(216, 15%, 54%, 0.18);
53
- --colors-overlay-background: hsla(216, 15%, 54%, 0.32);
53
+ --colors-overlay-background: hsla(214, 15%, 18%, 0.64);
54
54
  --colors-brand-primary-300: hsla(218, 89%, 51%, 0.09);
55
55
  --colors-brand-primary-400: hsla(218, 89%, 51%, 0.18);
56
56
  --colors-brand-primary-500: hsla(213, 89%, 56%, 1);
package/build/tokens/index.d.ts CHANGED
@@ -137,6 +137,7 @@ declare type ColorNeutralScale = Readonly<{
137
137
  a300: string;
138
138
  a400: string;
139
139
  a500: string;
140
+ a1100: string;
140
141
  }>;
141
142
  declare type Color = Readonly<{
142
143
  chromatic: {
@@ -168,13 +169,13 @@ declare type Opacity = Readonly<{
168
169
  2: number;
169
170
  /**3: 0.32 */
170
171
  3: number;
171
- /**4: 1.0 */
172
+ /**4: 0.48 */
172
173
  4: number;
173
- /**5: 1.0 */
174
+ /**5: 0.56 */
174
175
  5: number;
175
- /**6: 1.0 */
176
+ /**6: 0.64 */
176
177
  6: number;
177
- /**7: 1.0 */
178
+ /**7: 0.72 */
178
179
  7: number;
179
180
  /**8: 1.0 */
180
181
  8: number;
@@ -1024,8 +1025,14 @@ declare const size: {
1024
1025
  readonly 120: 120;
1025
1026
  /** 300 px */
1026
1027
  readonly 300: 300;
1028
+ /** 400 px */
1029
+ readonly 400: 400;
1027
1030
  /** 584 px */
1028
1031
  readonly 584: 584;
1032
+ /** 760 px */
1033
+ readonly 760: 760;
1034
+ /** 1024 px */
1035
+ readonly 1024: 1024;
1029
1036
  };
1030
1037
  declare type Size = typeof size;
1031
1038
 
package/build/tokens/index.native.d.ts CHANGED
@@ -137,6 +137,7 @@ declare type ColorNeutralScale = Readonly<{
137
137
  a300: string;
138
138
  a400: string;
139
139
  a500: string;
140
+ a1100: string;
140
141
  }>;
141
142
  declare type Color = Readonly<{
142
143
  chromatic: {
@@ -168,13 +169,13 @@ declare type Opacity = Readonly<{
168
169
  2: number;
169
170
  /**3: 0.32 */
170
171
  3: number;
171
- /**4: 1.0 */
172
+ /**4: 0.48 */
172
173
  4: number;
173
- /**5: 1.0 */
174
+ /**5: 0.56 */
174
175
  5: number;
175
- /**6: 1.0 */
176
+ /**6: 0.64 */
176
177
  6: number;
177
- /**7: 1.0 */
178
+ /**7: 0.72 */
178
179
  7: number;
179
180
  /**8: 1.0 */
180
181
  8: number;
@@ -1024,8 +1025,14 @@ declare const size: {
1024
1025
  readonly 120: 120;
1025
1026
  /** 300 px */
1026
1027
  readonly 300: 300;
1028
+ /** 400 px */
1029
+ readonly 400: 400;
1027
1030
  /** 584 px */
1028
1031
  readonly 584: 584;
1032
+ /** 760 px */
1033
+ readonly 760: 760;
1034
+ /** 1024 px */
1035
+ readonly 1024: 1024;
1029
1036
  };
1030
1037
  declare type Size = typeof size;
1031
1038