@transferwise/components 0.0.0-experimental-e5216db → 0.0.0-experimental-dd51021

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 (13) hide show
  1. package/build/index.js +1 -1
  2. package/build/index.js.map +1 -1
  3. package/build/index.mjs +1 -1
  4. package/build/index.mjs.map +1 -1
  5. package/build/main.css +7 -3
  6. package/build/styles/inputs/SelectInput.css +7 -3
  7. package/build/styles/main.css +7 -3
  8. package/build/types/inputs/_BottomSheet.d.ts.map +1 -1
  9. package/package.json +1 -1
  10. package/src/inputs/SelectInput.css +7 -3
  11. package/src/inputs/_BottomSheet.less +6 -3
  12. package/src/inputs/_BottomSheet.tsx +1 -0
  13. package/src/main.css +7 -3
package/build/main.css CHANGED
@@ -2468,12 +2468,17 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
2468
2468
  padding: var(--size-16);
2469
2469
  }
2470
2470
  .np-bottom-sheet-v2-content-inner {
2471
- display: flex;
2472
- flex-direction: column;
2471
+ display: grid;
2472
+ grid-template-rows: 1fr;
2473
+ grid-row-gap: 8px;
2474
+ grid-row-gap: var(--size-8);
2473
2475
  row-gap: 8px;
2474
2476
  row-gap: var(--size-8);
2475
2477
  overflow: auto;
2476
2478
  }
2479
+ .np-bottom-sheet-v2-content-inner--has-title {
2480
+ grid-template-rows: auto 1fr;
2481
+ }
2477
2482
  .np-bottom-sheet-v2-content-inner--padding-md {
2478
2483
  padding: 16px;
2479
2484
  padding: var(--size-16);
@@ -2484,7 +2489,6 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
2484
2489
  color: var(--color-content-primary);
2485
2490
  }
2486
2491
  .np-bottom-sheet-v2-body {
2487
- overflow: auto;
2488
2492
  color: #5d7079;
2489
2493
  color: var(--color-content-secondary);
2490
2494
  }
package/build/styles/inputs/SelectInput.css CHANGED
@@ -70,12 +70,17 @@
70
70
  padding: var(--size-16);
71
71
  }
72
72
  .np-bottom-sheet-v2-content-inner {
73
- display: flex;
74
- flex-direction: column;
73
+ display: grid;
74
+ grid-template-rows: 1fr;
75
+ grid-row-gap: 8px;
76
+ grid-row-gap: var(--size-8);
75
77
  row-gap: 8px;
76
78
  row-gap: var(--size-8);
77
79
  overflow: auto;
78
80
  }
81
+ .np-bottom-sheet-v2-content-inner--has-title {
82
+ grid-template-rows: auto 1fr;
83
+ }
79
84
  .np-bottom-sheet-v2-content-inner--padding-md {
80
85
  padding: 16px;
81
86
  padding: var(--size-16);
@@ -86,7 +91,6 @@
86
91
  color: var(--color-content-primary);
87
92
  }
88
93
  .np-bottom-sheet-v2-body {
89
- overflow: auto;
90
94
  color: #5d7079;
91
95
  color: var(--color-content-secondary);
92
96
  }
package/build/styles/main.css CHANGED
@@ -2468,12 +2468,17 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
2468
2468
  padding: var(--size-16);
2469
2469
  }
2470
2470
  .np-bottom-sheet-v2-content-inner {
2471
- display: flex;
2472
- flex-direction: column;
2471
+ display: grid;
2472
+ grid-template-rows: 1fr;
2473
+ grid-row-gap: 8px;
2474
+ grid-row-gap: var(--size-8);
2473
2475
  row-gap: 8px;
2474
2476
  row-gap: var(--size-8);
2475
2477
  overflow: auto;
2476
2478
  }
2479
+ .np-bottom-sheet-v2-content-inner--has-title {
2480
+ grid-template-rows: auto 1fr;
2481
+ }
2477
2482
  .np-bottom-sheet-v2-content-inner--padding-md {
2478
2483
  padding: 16px;
2479
2484
  padding: var(--size-16);
@@ -2484,7 +2489,6 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
2484
2489
  color: var(--color-content-primary);
2485
2490
  }
2486
2491
  .np-bottom-sheet-v2-body {
2487
- overflow: auto;
2488
2492
  color: #5d7079;
2489
2493
  color: var(--color-content-secondary);
2490
2494
  }
package/build/types/inputs/_BottomSheet.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"_BottomSheet.d.ts","sourceRoot":"","sources":["../../../src/inputs/_BottomSheet.tsx"],"names":[],"mappings":"AAmBA,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,OAAO,CAAC;IACd,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE;QACrB,GAAG,EAAE,KAAK,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;QAChC,mBAAmB,EAAE,CAAC,mBAAmB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,KAAK;YACvE,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;SACxB,CAAC;KACH,KAAK,KAAK,CAAC,SAAS,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAC7D,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAED,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,aAAa,EACb,KAAK,EACL,eAAe,EACf,OAAc,EACd,QAAQ,EACR,OAAO,EACP,UAAU,GACX,EAAE,gBAAgB,+BA4FlB"}
1
+ {"version":3,"file":"_BottomSheet.d.ts","sourceRoot":"","sources":["../../../src/inputs/_BottomSheet.tsx"],"names":[],"mappings":"AAmBA,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,OAAO,CAAC;IACd,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE;QACrB,GAAG,EAAE,KAAK,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;QAChC,mBAAmB,EAAE,CAAC,mBAAmB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,KAAK;YACvE,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;SACxB,CAAC;KACH,KAAK,KAAK,CAAC,SAAS,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE,KAAK,CAAC,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAC7D,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAED,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,aAAa,EACb,KAAK,EACL,eAAe,EACf,OAAc,EACd,QAAQ,EACR,OAAO,EACP,UAAU,GACX,EAAE,gBAAgB,+BA6FlB"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@transferwise/components",
3
- "version": "0.0.0-experimental-e5216db",
3
+ "version": "0.0.0-experimental-dd51021",
4
4
  "description": "Neptune React components",
5
5
  "license": "Apache-2.0",
6
6
  "repository": {
package/src/inputs/SelectInput.css CHANGED
@@ -70,12 +70,17 @@
70
70
  padding: var(--size-16);
71
71
  }
72
72
  .np-bottom-sheet-v2-content-inner {
73
- display: flex;
74
- flex-direction: column;
73
+ display: grid;
74
+ grid-template-rows: 1fr;
75
+ grid-row-gap: 8px;
76
+ grid-row-gap: var(--size-8);
75
77
  row-gap: 8px;
76
78
  row-gap: var(--size-8);
77
79
  overflow: auto;
78
80
  }
81
+ .np-bottom-sheet-v2-content-inner--has-title {
82
+ grid-template-rows: auto 1fr;
83
+ }
79
84
  .np-bottom-sheet-v2-content-inner--padding-md {
80
85
  padding: 16px;
81
86
  padding: var(--size-16);
@@ -86,7 +91,6 @@
86
91
  color: var(--color-content-primary);
87
92
  }
88
93
  .np-bottom-sheet-v2-body {
89
- overflow: auto;
90
94
  color: #5d7079;
91
95
  color: var(--color-content-secondary);
92
96
  }
package/src/inputs/_BottomSheet.less CHANGED
@@ -69,11 +69,15 @@
69
69
  }
70
70
 
71
71
  .np-bottom-sheet-v2-content-inner {
72
- display: flex;
73
- flex-direction: column;
72
+ display: grid;
73
+ grid-template-rows: 1fr;
74
74
  row-gap: var(--size-8);
75
75
  overflow: auto;
76
76
 
77
+ &--has-title {
78
+ grid-template-rows: auto 1fr;
79
+ }
80
+
77
81
  &--padding-md {
78
82
  padding: var(--size-16);
79
83
  padding-top: 0px;
@@ -85,6 +89,5 @@
85
89
  }
86
90
 
87
91
  .np-bottom-sheet-v2-body {
88
- overflow: auto;
89
92
  color: var(--color-content-secondary);
90
93
  }
package/src/inputs/_BottomSheet.tsx CHANGED
@@ -114,6 +114,7 @@ export function BottomSheet({
114
114
  <div
115
115
  className={classNames(
116
116
  'np-bottom-sheet-v2-content-inner',
117
+ title && 'np-bottom-sheet-v2-content-inner--has-title',
117
118
  padding === 'md' && 'np-bottom-sheet-v2-content-inner--padding-md',
118
119
  )}
119
120
  >
package/src/main.css CHANGED
@@ -2468,12 +2468,17 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
2468
2468
  padding: var(--size-16);
2469
2469
  }
2470
2470
  .np-bottom-sheet-v2-content-inner {
2471
- display: flex;
2472
- flex-direction: column;
2471
+ display: grid;
2472
+ grid-template-rows: 1fr;
2473
+ grid-row-gap: 8px;
2474
+ grid-row-gap: var(--size-8);
2473
2475
  row-gap: 8px;
2474
2476
  row-gap: var(--size-8);
2475
2477
  overflow: auto;
2476
2478
  }
2479
+ .np-bottom-sheet-v2-content-inner--has-title {
2480
+ grid-template-rows: auto 1fr;
2481
+ }
2477
2482
  .np-bottom-sheet-v2-content-inner--padding-md {
2478
2483
  padding: 16px;
2479
2484
  padding: var(--size-16);
@@ -2484,7 +2489,6 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
2484
2489
  color: var(--color-content-primary);
2485
2490
  }
2486
2491
  .np-bottom-sheet-v2-body {
2487
- overflow: auto;
2488
2492
  color: #5d7079;
2489
2493
  color: var(--color-content-secondary);
2490
2494
  }