@transferwise/components 0.0.0-experimental-810e6ed → 0.0.0-experimental-97a6be6

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 (15) hide show
  1. package/build/i18n/uk.json +0 -2
  2. package/build/i18n/uk.json.js +0 -2
  3. package/build/i18n/uk.json.js.map +1 -1
  4. package/build/i18n/uk.json.mjs +0 -2
  5. package/build/i18n/uk.json.mjs.map +1 -1
  6. package/build/main.css +2 -4
  7. package/build/styles/listItem/ListItem.css +2 -4
  8. package/build/styles/listItem/ListItem.grid.css +2 -4
  9. package/build/styles/main.css +2 -4
  10. package/package.json +3 -3
  11. package/src/i18n/uk.json +0 -2
  12. package/src/listItem/ListItem.css +2 -4
  13. package/src/listItem/ListItem.grid.css +2 -4
  14. package/src/listItem/ListItem.grid.less +242 -235
  15. package/src/main.css +2 -4
package/build/i18n/uk.json CHANGED
@@ -16,8 +16,6 @@
16
16
  "neptune.DateLookup.selected": "вибрано",
17
17
  "neptune.DateLookup.twentyYears": "20 років",
18
18
  "neptune.DateLookup.year": "рік",
19
- "neptune.Expander.collapseAriaLabel": "Згорнути",
20
- "neptune.Expander.expandAriaLabel": "Розгорнути",
21
19
  "neptune.ExpressiveMoneyInput.currency.search.placeholder": "Вкажіть валюту / країну",
22
20
  "neptune.ExpressiveMoneyInput.currency.select.currency": "Виберіть валюту",
23
21
  "neptune.FlowNavigation.back": "назад до попереднього кроку",
package/build/i18n/uk.json.js CHANGED
@@ -20,8 +20,6 @@ var uk = {
20
20
  "neptune.DateLookup.selected": "вибрано",
21
21
  "neptune.DateLookup.twentyYears": "20 років",
22
22
  "neptune.DateLookup.year": "рік",
23
- "neptune.Expander.collapseAriaLabel": "Згорнути",
24
- "neptune.Expander.expandAriaLabel": "Розгорнути",
25
23
  "neptune.ExpressiveMoneyInput.currency.search.placeholder": "Вкажіть валюту / країну",
26
24
  "neptune.ExpressiveMoneyInput.currency.select.currency": "Виберіть валюту",
27
25
  "neptune.FlowNavigation.back": "назад до попереднього кроку",
package/build/i18n/uk.json.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"uk.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"uk.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/i18n/uk.json.mjs CHANGED
@@ -16,8 +16,6 @@ var uk = {
16
16
  "neptune.DateLookup.selected": "вибрано",
17
17
  "neptune.DateLookup.twentyYears": "20 років",
18
18
  "neptune.DateLookup.year": "рік",
19
- "neptune.Expander.collapseAriaLabel": "Згорнути",
20
- "neptune.Expander.expandAriaLabel": "Розгорнути",
21
19
  "neptune.ExpressiveMoneyInput.currency.search.placeholder": "Вкажіть валюту / країну",
22
20
  "neptune.ExpressiveMoneyInput.currency.select.currency": "Виберіть валюту",
23
21
  "neptune.FlowNavigation.back": "назад до попереднього кроку",
package/build/i18n/uk.json.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"uk.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"uk.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/main.css CHANGED
@@ -29481,8 +29481,8 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
29481
29481
  gap: var(--size-4) var(--size-12);
29482
29482
  }
29483
29483
 
29484
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-hasPrompt:not( :has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt,
29485
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-hasPrompt:not( :has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt {
29484
+ .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-hasPrompt:not(:has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt,
29485
+ .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-hasPrompt:not(:has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt {
29486
29486
  margin-top: -2px;
29487
29487
  }
29488
29488
 
@@ -29490,8 +29490,6 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
29490
29490
  .wds-list-item-gridWrapper .wds-list-item-control-wrapper {
29491
29491
  height: var(--wds-list-item-control-wrapper-height);
29492
29492
  align-content: center;
29493
- display: grid;
29494
- align-items: center;
29495
29493
  }
29496
29494
  .wds-list-item-gridWrapper .wds-list-item-media-image {
29497
29495
  -o-object-position: center;
package/build/styles/listItem/ListItem.css CHANGED
@@ -5,16 +5,14 @@
5
5
  gap: 4px 12px;
6
6
  gap: var(--size-4) var(--size-12);
7
7
  }
8
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-hasPrompt:not( :has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt,
9
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-hasPrompt:not( :has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt {
8
+ .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-hasPrompt:not(:has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt,
9
+ .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-hasPrompt:not(:has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt {
10
10
  margin-top: -2px;
11
11
  }
12
12
  @container (width > 308px) {
13
13
  .wds-list-item-gridWrapper .wds-list-item-control-wrapper {
14
14
  height: var(--wds-list-item-control-wrapper-height);
15
15
  align-content: center;
16
- display: grid;
17
- align-items: center;
18
16
  }
19
17
  .wds-list-item-gridWrapper .wds-list-item-media-image {
20
18
  -o-object-position: center;
package/build/styles/listItem/ListItem.grid.css CHANGED
@@ -5,16 +5,14 @@
5
5
  gap: 4px 12px;
6
6
  gap: var(--size-4) var(--size-12);
7
7
  }
8
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-hasPrompt:not( :has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt,
9
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-hasPrompt:not( :has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt {
8
+ .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-hasPrompt:not(:has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt,
9
+ .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-hasPrompt:not(:has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt {
10
10
  margin-top: -2px;
11
11
  }
12
12
  @container (width > 308px) {
13
13
  .wds-list-item-gridWrapper .wds-list-item-control-wrapper {
14
14
  height: var(--wds-list-item-control-wrapper-height);
15
15
  align-content: center;
16
- display: grid;
17
- align-items: center;
18
16
  }
19
17
  .wds-list-item-gridWrapper .wds-list-item-media-image {
20
18
  -o-object-position: center;
package/build/styles/main.css CHANGED
@@ -29481,8 +29481,8 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
29481
29481
  gap: var(--size-4) var(--size-12);
29482
29482
  }
29483
29483
 
29484
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-hasPrompt:not( :has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt,
29485
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-hasPrompt:not( :has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt {
29484
+ .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-hasPrompt:not(:has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt,
29485
+ .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-hasPrompt:not(:has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt {
29486
29486
  margin-top: -2px;
29487
29487
  }
29488
29488
 
@@ -29490,8 +29490,6 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
29490
29490
  .wds-list-item-gridWrapper .wds-list-item-control-wrapper {
29491
29491
  height: var(--wds-list-item-control-wrapper-height);
29492
29492
  align-content: center;
29493
- display: grid;
29494
- align-items: center;
29495
29493
  }
29496
29494
  .wds-list-item-gridWrapper .wds-list-item-media-image {
29497
29495
  -o-object-position: center;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@transferwise/components",
3
- "version": "0.0.0-experimental-810e6ed",
3
+ "version": "0.0.0-experimental-97a6be6",
4
4
  "description": "Neptune React components",
5
5
  "license": "Apache-2.0",
6
6
  "repository": {
@@ -92,8 +92,8 @@
92
92
  "storybook-addon-test-codegen": "^3.0.1",
93
93
  "@transferwise/less-config": "3.1.2",
94
94
  "@transferwise/neptune-css": "14.27.1",
95
- "@wise/components-theming": "1.10.2",
96
- "@wise/wds-configs": "0.0.0"
95
+ "@wise/wds-configs": "0.0.0",
96
+ "@wise/components-theming": "1.10.2"
97
97
  },
98
98
  "peerDependencies": {
99
99
  "@transferwise/icons": "^3 || ^4",
package/src/i18n/uk.json CHANGED
@@ -16,8 +16,6 @@
16
16
  "neptune.DateLookup.selected": "вибрано",
17
17
  "neptune.DateLookup.twentyYears": "20 років",
18
18
  "neptune.DateLookup.year": "рік",
19
- "neptune.Expander.collapseAriaLabel": "Згорнути",
20
- "neptune.Expander.expandAriaLabel": "Розгорнути",
21
19
  "neptune.ExpressiveMoneyInput.currency.search.placeholder": "Вкажіть валюту / країну",
22
20
  "neptune.ExpressiveMoneyInput.currency.select.currency": "Виберіть валюту",
23
21
  "neptune.FlowNavigation.back": "назад до попереднього кроку",
package/src/listItem/ListItem.css CHANGED
@@ -5,16 +5,14 @@
5
5
  gap: 4px 12px;
6
6
  gap: var(--size-4) var(--size-12);
7
7
  }
8
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-hasPrompt:not( :has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt,
9
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-hasPrompt:not( :has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt {
8
+ .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-hasPrompt:not(:has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt,
9
+ .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-hasPrompt:not(:has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt {
10
10
  margin-top: -2px;
11
11
  }
12
12
  @container (width > 308px) {
13
13
  .wds-list-item-gridWrapper .wds-list-item-control-wrapper {
14
14
  height: var(--wds-list-item-control-wrapper-height);
15
15
  align-content: center;
16
- display: grid;
17
- align-items: center;
18
16
  }
19
17
  .wds-list-item-gridWrapper .wds-list-item-media-image {
20
18
  -o-object-position: center;
package/src/listItem/ListItem.grid.css CHANGED
@@ -5,16 +5,14 @@
5
5
  gap: 4px 12px;
6
6
  gap: var(--size-4) var(--size-12);
7
7
  }
8
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-hasPrompt:not( :has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt,
9
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-hasPrompt:not( :has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt {
8
+ .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-hasPrompt:not(:has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt,
9
+ .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-hasPrompt:not(:has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt {
10
10
  margin-top: -2px;
11
11
  }
12
12
  @container (width > 308px) {
13
13
  .wds-list-item-gridWrapper .wds-list-item-control-wrapper {
14
14
  height: var(--wds-list-item-control-wrapper-height);
15
15
  align-content: center;
16
- display: grid;
17
- align-items: center;
18
16
  }
19
17
  .wds-list-item-gridWrapper .wds-list-item-media-image {
20
18
  -o-object-position: center;
package/src/listItem/ListItem.grid.less CHANGED
@@ -7,9 +7,7 @@
7
7
 
8
8
  &.wds-list-item-hasMedia-hasControl,
9
9
  &.wds-list-item-hasMedia-noControl {
10
- &.wds-list-item-noInfo-hasPrompt:not(
11
- :has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)
12
- ) {
10
+ &.wds-list-item-noInfo-hasPrompt:not(:has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) {
13
11
  .wds-list-item-prompt {
14
12
  margin-top: -2px;
15
13
  }
@@ -20,11 +18,9 @@
20
18
  .wds-list-item-control-wrapper {
21
19
  height: var(--wds-list-item-control-wrapper-height);
22
20
  align-content: center;
23
- display: grid;
24
- align-items: center;
25
21
  }
26
22
 
27
- .wds-list-item-media-image {
23
+ .wds-list-item-media-image{
28
24
  object-position: center;
29
25
  }
30
26
 
@@ -33,31 +29,32 @@
33
29
  grid-template-columns: auto 1fr auto;
34
30
  grid-template-rows: auto auto auto;
35
31
  grid-template-areas:
36
- "media body control"
37
- ". info ."
38
- ". prompt prompt";
32
+ "media body control"
33
+ ". info ."
34
+ ". prompt prompt";
39
35
  }
40
36
 
41
37
  &.wds-list-item-hasInfo-noPrompt {
42
38
  grid-template-columns: auto 1fr auto;
43
39
  grid-template-rows: auto auto;
44
40
  grid-template-areas:
45
- "media body control"
46
- ". info .";
41
+ "media body control"
42
+ ". info ."
47
43
  }
48
44
 
49
45
  &.wds-list-item-noInfo-hasPrompt {
50
46
  grid-template-columns: auto 1fr auto;
51
47
  grid-template-rows: auto auto;
52
48
  grid-template-areas:
53
- "media body control"
54
- ". prompt prompt";
49
+ "media body control"
50
+ ". prompt prompt";
55
51
  }
56
52
 
57
53
  &.wds-list-item-noInfo-noPrompt {
58
54
  grid-template-columns: auto 1fr auto;
59
55
  grid-template-rows: auto;
60
- grid-template-areas: "media body control";
56
+ grid-template-areas:
57
+ "media body control"
61
58
  }
62
59
  }
63
60
 
@@ -66,31 +63,32 @@
66
63
  grid-template-columns: auto 1fr;
67
64
  grid-template-rows: auto auto;
68
65
  grid-template-areas:
69
- "media body"
70
- ". info"
71
- ". prompt";
66
+ "media body"
67
+ ". info"
68
+ ". prompt";
72
69
  }
73
70
 
74
71
  &.wds-list-item-hasInfo-noPrompt {
75
72
  grid-template-columns: auto 1fr;
76
73
  grid-template-rows: auto auto auto;
77
74
  grid-template-areas:
78
- "media body"
79
- ". info";
75
+ "media body"
76
+ ". info"
80
77
  }
81
78
 
82
79
  &.wds-list-item-noInfo-hasPrompt {
83
80
  grid-template-columns: auto 1fr;
84
81
  grid-template-rows: auto auto;
85
82
  grid-template-areas:
86
- "media body"
87
- ". prompt";
83
+ "media body"
84
+ ". prompt";
88
85
  }
89
86
 
90
87
  &.wds-list-item-noInfo-noPrompt {
91
88
  grid-template-columns: auto 1fr;
92
89
  grid-template-rows: auto;
93
- grid-template-areas: "media body";
90
+ grid-template-areas:
91
+ "media body"
94
92
  }
95
93
  }
96
94
 
@@ -103,31 +101,32 @@
103
101
  grid-template-columns: 1fr auto;
104
102
  grid-template-rows: auto auto auto;
105
103
  grid-template-areas:
106
- "body control"
107
- "info ."
108
- "prompt prompt";
104
+ "body control"
105
+ "info ."
106
+ "prompt prompt";
109
107
  }
110
108
 
111
109
  &.wds-list-item-hasInfo-noPrompt {
112
110
  grid-template-columns: 1fr auto;
113
111
  grid-template-rows: auto auto;
114
112
  grid-template-areas:
115
- "body control"
116
- "info .";
113
+ "body control"
114
+ "info ."
117
115
  }
118
116
 
119
117
  &.wds-list-item-noInfo-hasPrompt {
120
118
  grid-template-columns: 1fr auto;
121
119
  grid-template-rows: auto auto;
122
120
  grid-template-areas:
123
- "body control"
124
- "prompt prompt";
121
+ "body control"
122
+ "prompt prompt";
125
123
  }
126
124
 
127
125
  &.wds-list-item-noInfo-noPrompt {
128
126
  grid-template-columns: 1fr auto;
129
127
  grid-template-rows: auto;
130
- grid-template-areas: "body control";
128
+ grid-template-areas:
129
+ "body control"
131
130
  }
132
131
  }
133
132
 
@@ -140,31 +139,32 @@
140
139
  grid-template-columns: 1fr;
141
140
  grid-template-rows: auto auto auto;
142
141
  grid-template-areas:
143
- "body"
144
- "info"
145
- "prompt";
142
+ "body"
143
+ "info"
144
+ "prompt";
146
145
  }
147
146
 
148
147
  &.wds-list-item-hasInfo-noPrompt {
149
148
  grid-template-columns: 1fr;
150
149
  grid-template-rows: auto auto;
151
150
  grid-template-areas:
152
- "body"
153
- "info";
151
+ "body"
152
+ "info"
154
153
  }
155
154
 
156
155
  &.wds-list-item-noInfo-hasPrompt {
157
156
  grid-template-columns: 1fr;
158
157
  grid-template-rows: auto auto;
159
158
  grid-template-areas:
160
- "body"
161
- "prompt";
159
+ "body"
160
+ "prompt";
162
161
  }
163
162
 
164
163
  &.wds-list-item-noInfo-noPrompt {
165
164
  grid-template-columns: 1fr;
166
165
  grid-template-rows: auto;
167
- grid-template-areas: "body";
166
+ grid-template-areas:
167
+ "body"
168
168
  }
169
169
  }
170
170
  }
@@ -172,7 +172,7 @@
172
172
  // LESS struggles with ranged container queries so
173
173
  // we need to escape the interpolated expression.
174
174
  @container (~"@{wds-list-item-cq-min} < width <= @{wds-list-item-cq-max}") {
175
- .wds-list-item-media-image {
175
+ .wds-list-item-media-image{
176
176
  object-position: bottom left;
177
177
  }
178
178
 
@@ -185,72 +185,72 @@
185
185
  grid-template-columns: 1fr auto;
186
186
  grid-template-rows: auto auto auto auto;
187
187
  grid-template-areas:
188
- "media media"
189
- "body control"
190
- "info control"
191
- "prompt prompt";
188
+ "media media"
189
+ "body control"
190
+ "info control"
191
+ "prompt prompt";
192
192
 
193
- &:has(.wds-list-item-button-control) {
194
- grid-template-columns: 1fr;
195
- grid-template-areas:
196
- "media"
197
- "body"
198
- "info"
199
- "prompt"
200
- "control";
201
- }
193
+ &:has(.wds-list-item-button-control) {
194
+ grid-template-columns: 1fr;
195
+ grid-template-areas:
196
+ "media"
197
+ "body"
198
+ "info"
199
+ "prompt"
200
+ "control";
201
+ }
202
202
  }
203
203
 
204
204
  &.wds-list-item-hasInfo-noPrompt {
205
205
  grid-template-columns: 1fr auto;
206
206
  grid-template-rows: auto auto auto;
207
207
  grid-template-areas:
208
- "media media"
209
- "body control"
210
- "info control";
208
+ "media media"
209
+ "body control"
210
+ "info control";
211
211
 
212
- &:has(.wds-list-item-button-control) {
213
- grid-template-columns: 1fr;
214
- grid-template-areas:
215
- "media"
216
- "body"
217
- "info"
218
- "control";
219
- }
212
+ &:has(.wds-list-item-button-control) {
213
+ grid-template-columns: 1fr;
214
+ grid-template-areas:
215
+ "media"
216
+ "body"
217
+ "info"
218
+ "control";
219
+ }
220
220
  }
221
221
 
222
222
  &.wds-list-item-noInfo-hasPrompt {
223
223
  grid-template-columns: 1fr auto;
224
224
  grid-template-rows: auto auto auto;
225
225
  grid-template-areas:
226
- "media media"
227
- "body control"
228
- "prompt prompt";
226
+ "media media"
227
+ "body control"
228
+ "prompt prompt";
229
229
 
230
- &:has(.wds-list-item-button-control) {
231
- grid-template-columns: 1fr;
232
- grid-template-areas:
233
- "media"
234
- "body"
235
- "prompt"
236
- "control";
237
- }
230
+ &:has(.wds-list-item-button-control) {
231
+ grid-template-columns: 1fr;
232
+ grid-template-areas:
233
+ "media"
234
+ "body"
235
+ "prompt"
236
+ "control";
237
+ }
238
238
  }
239
239
 
240
240
  &.wds-list-item-noInfo-noPrompt {
241
241
  grid-template-columns: 1fr auto;
242
242
  grid-template-rows: auto auto;
243
243
  grid-template-areas:
244
- "media media"
245
- "body control";
244
+ "media media"
245
+ "body control";
246
246
 
247
- &:has(.wds-list-item-button-control) {
248
- grid-template-columns: 1fr;
249
- grid-template-areas:
250
- "media"
251
- "body"
252
- "control";
253
- }
247
+ &:has(.wds-list-item-button-control) {
248
+ grid-template-columns: 1fr;
249
+ grid-template-areas:
250
+ "media"
251
+ "body"
252
+ "control";
253
+ }
254
254
  }
255
255
  }
256
256
 
@@ -259,19 +259,19 @@
259
259
  grid-template-columns: auto auto;
260
260
  grid-template-rows: auto auto auto auto;
261
261
  grid-template-areas:
262
- "media media"
263
- "body body"
264
- "info info"
265
- "prompt prompt";
262
+ "media media"
263
+ "body body"
264
+ "info info"
265
+ "prompt prompt";
266
266
  }
267
267
 
268
268
  &.wds-list-item-hasInfo-noPrompt {
269
269
  grid-template-columns: auto 1fr;
270
270
  grid-template-rows: auto auto auto;
271
271
  grid-template-areas:
272
- "media media"
273
- "body body"
274
- "info info";
272
+ "media media"
273
+ "body body"
274
+ "info info";
275
275
  }
276
276
 
277
277
  &.wds-list-item-noInfo-hasPrompt {
@@ -279,17 +279,17 @@
279
279
  grid-template-rows: auto auto auto;
280
280
 
281
281
  grid-template-areas:
282
- "media media"
283
- "body body"
284
- "prompt prompt";
282
+ "media media"
283
+ "body body"
284
+ "prompt prompt";
285
285
  }
286
286
 
287
287
  &.wds-list-item-noInfo-noPrompt {
288
288
  grid-template-columns: 1fr;
289
289
  grid-template-rows: auto auto;
290
290
  grid-template-areas:
291
- "media"
292
- "body";
291
+ "media"
292
+ "body"
293
293
  }
294
294
  }
295
295
 
@@ -302,63 +302,64 @@
302
302
  grid-template-columns: 1fr auto;
303
303
  grid-template-rows: auto auto auto;
304
304
  grid-template-areas:
305
- "body control"
306
- "info control"
307
- "prompt prompt";
305
+ "body control"
306
+ "info control"
307
+ "prompt prompt";
308
308
 
309
- &:has(.wds-list-item-button-control) {
310
- grid-template-columns: 1fr;
311
- grid-template-areas:
312
- "body"
313
- "info"
314
- "prompt"
315
- "control";
316
- }
309
+ &:has(.wds-list-item-button-control) {
310
+ grid-template-columns: 1fr;
311
+ grid-template-areas:
312
+ "body"
313
+ "info"
314
+ "prompt"
315
+ "control";
316
+ }
317
317
  }
318
318
 
319
319
  &.wds-list-item-hasInfo-noPrompt {
320
320
  grid-template-columns: 1fr auto;
321
321
  grid-template-rows: auto auto;
322
322
  grid-template-areas:
323
- "body control"
324
- "info control";
323
+ "body control"
324
+ "info control";
325
325
 
326
- &:has(.wds-list-item-button-control) {
327
- grid-template-columns: 1fr;
328
- grid-template-areas:
329
- "body"
330
- "info"
331
- "control";
332
- }
326
+ &:has(.wds-list-item-button-control) {
327
+ grid-template-columns: 1fr;
328
+ grid-template-areas:
329
+ "body"
330
+ "info"
331
+ "control";
332
+ }
333
333
  }
334
334
 
335
335
  &.wds-list-item-noInfo-hasPrompt {
336
336
  grid-template-columns: 1fr auto;
337
337
  grid-template-rows: auto auto;
338
338
  grid-template-areas:
339
- "body control"
340
- "prompt prompt";
339
+ "body control"
340
+ "prompt prompt";
341
341
 
342
- &:has(.wds-list-item-button-control) {
343
- grid-template-columns: 1fr;
344
- grid-template-areas:
345
- "body"
346
- "prompt"
347
- "control";
348
- }
342
+ &:has(.wds-list-item-button-control) {
343
+ grid-template-columns: 1fr;
344
+ grid-template-areas:
345
+ "body"
346
+ "prompt"
347
+ "control";
348
+ }
349
349
  }
350
350
 
351
351
  &.wds-list-item-noInfo-noPrompt {
352
352
  grid-template-columns: 1fr auto;
353
353
  grid-template-rows: auto;
354
- grid-template-areas: "body control";
354
+ grid-template-areas:
355
+ "body control";
355
356
 
356
- &:has(.wds-list-item-button-control) {
357
- grid-template-columns: 1fr;
358
- grid-template-areas:
359
- "body"
360
- "control";
361
- }
357
+ &:has(.wds-list-item-button-control) {
358
+ grid-template-columns: 1fr;
359
+ grid-template-areas:
360
+ "body"
361
+ "control";
362
+ }
362
363
  }
363
364
  }
364
365
 
@@ -371,35 +372,36 @@
371
372
  grid-template-columns: 1fr;
372
373
  grid-template-rows: auto auto auto;
373
374
  grid-template-areas:
374
- "body"
375
- "info"
376
- "prompt";
375
+ "body"
376
+ "info"
377
+ "prompt";
377
378
  }
378
379
 
379
380
  &.wds-list-item-hasInfo-noPrompt {
380
381
  grid-template-columns: 1fr;
381
382
  grid-template-rows: auto auto;
382
383
  grid-template-areas:
383
- "body"
384
- "info";
384
+ "body"
385
+ "info"
385
386
  }
386
387
 
387
388
  &.wds-list-item-noInfo-hasPrompt {
388
389
  grid-template-columns: 1fr;
389
390
  grid-template-rows: auto auto;
390
391
  grid-template-areas:
391
- "body"
392
- "prompt";
392
+ "body"
393
+ "prompt";
393
394
  }
394
395
 
395
396
  &.wds-list-item-noInfo-noPrompt {
396
397
  grid-template-columns: 1fr;
397
398
  grid-template-rows: auto;
398
- grid-template-areas: "body";
399
+ grid-template-areas:
400
+ "body"
399
401
  }
400
402
  }
401
403
 
402
- .wds-list-item-button-control--hasPrompt {
404
+ .wds-list-item-button-control--hasPrompt{
403
405
  margin-top: var(--size-4);
404
406
  }
405
407
  }
@@ -413,64 +415,65 @@
413
415
  grid-template-columns: 1fr auto;
414
416
  grid-template-rows: auto auto auto;
415
417
  grid-template-areas:
416
- "body control"
417
- "info control"
418
- "prompt prompt";
418
+ "body control"
419
+ "info control"
420
+ "prompt prompt";
419
421
 
420
- &:has(.wds-list-item-button-control) {
421
- grid-template-columns: 1fr;
422
- grid-template-rows: auto;
423
- grid-template-areas:
424
- "body"
425
- "info"
426
- "prompt"
427
- "control";
428
- }
422
+ &:has(.wds-list-item-button-control) {
423
+ grid-template-columns: 1fr;
424
+ grid-template-rows: auto;
425
+ grid-template-areas:
426
+ "body"
427
+ "info"
428
+ "prompt"
429
+ "control";
430
+ }
429
431
  }
430
432
 
431
433
  &.wds-list-item-hasInfo-noPrompt {
432
434
  grid-template-columns: 1fr auto;
433
435
  grid-template-rows: auto auto;
434
436
  grid-template-areas:
435
- "body control"
436
- "info control";
437
+ "body control"
438
+ "info control";
437
439
 
438
- &:has(.wds-list-item-button-control) {
439
- grid-template-columns: 1fr;
440
- grid-template-areas:
441
- "body"
442
- "info"
443
- "control";
444
- }
440
+ &:has(.wds-list-item-button-control) {
441
+ grid-template-columns: 1fr;
442
+ grid-template-areas:
443
+ "body"
444
+ "info"
445
+ "control";
446
+ }
445
447
  }
446
448
 
447
449
  &.wds-list-item-noInfo-hasPrompt {
448
450
  grid-template-columns: 1fr auto;
449
451
  grid-template-rows: auto auto;
450
452
  grid-template-areas:
451
- "body control"
452
- "prompt prompt";
453
+ "body control"
454
+ "prompt prompt";
453
455
 
454
- &:has(.wds-list-item-button-control) {
455
- grid-template-columns: 1fr;
456
- grid-template-areas:
457
- "body"
458
- "prompt"
459
- "control";
460
- }
456
+ &:has(.wds-list-item-button-control) {
457
+ grid-template-columns: 1fr;
458
+ grid-template-areas:
459
+ "body"
460
+ "prompt"
461
+ "control";
462
+ }
461
463
  }
462
464
 
463
465
  &.wds-list-item-noInfo-noPrompt {
464
466
  grid-template-columns: 1fr auto;
465
467
  grid-template-rows: auto;
466
- grid-template-areas: "body control";
468
+ grid-template-areas:
469
+ "body control";
467
470
 
468
- &:has(.wds-list-item-button-control) {
469
- grid-template-columns: 1fr;
470
- grid-template-areas:
471
- "body"
472
- "control";
473
- }
471
+ &:has(.wds-list-item-button-control) {
472
+ grid-template-columns: 1fr;
473
+ grid-template-areas:
474
+ "body"
475
+ "control";
476
+ }
474
477
  }
475
478
  }
476
479
 
@@ -479,31 +482,32 @@
479
482
  grid-template-columns: 1fr;
480
483
  grid-template-rows: auto auto auto;
481
484
  grid-template-areas:
482
- "body"
483
- "info"
484
- "prompt";
485
+ "body"
486
+ "info"
487
+ "prompt";
485
488
  }
486
489
 
487
490
  &.wds-list-item-hasInfo-noPrompt {
488
491
  grid-template-columns: 1fr;
489
492
  grid-template-rows: auto auto;
490
493
  grid-template-areas:
491
- "body"
492
- "info";
494
+ "body"
495
+ "info"
493
496
  }
494
497
 
495
498
  &.wds-list-item-noInfo-hasPrompt {
496
499
  grid-template-columns: 1fr;
497
500
  grid-template-rows: auto auto;
498
501
  grid-template-areas:
499
- "body"
500
- "prompt";
502
+ "body"
503
+ "prompt";
501
504
  }
502
505
 
503
506
  &.wds-list-item-noInfo-noPrompt {
504
507
  grid-template-columns: 1fr;
505
508
  grid-template-rows: auto;
506
- grid-template-areas: "body";
509
+ grid-template-areas:
510
+ "body"
507
511
  }
508
512
  }
509
513
 
@@ -516,67 +520,69 @@
516
520
  grid-template-columns: 1fr auto;
517
521
  grid-template-rows: auto auto auto;
518
522
  grid-template-areas:
519
- "body control"
520
- "info control"
521
- "prompt prompt";
523
+ "body control"
524
+ "info control"
525
+ "prompt prompt";
522
526
 
523
- &:has(.wds-list-item-button-control) {
524
- grid-template-columns: 1fr;
525
- grid-template-rows: auto;
526
- grid-template-areas:
527
- "body"
528
- "info"
529
- "prompt"
530
- "control";
531
- }
527
+
528
+ &:has(.wds-list-item-button-control) {
529
+ grid-template-columns: 1fr;
530
+ grid-template-rows: auto;
531
+ grid-template-areas:
532
+ "body"
533
+ "info"
534
+ "prompt"
535
+ "control";
536
+ }
532
537
  }
533
538
 
534
539
  &.wds-list-item-hasInfo-noPrompt {
535
540
  grid-template-columns: 1fr auto;
536
541
  grid-template-rows: auto auto;
537
542
  grid-template-areas:
538
- "body control"
539
- "info control";
543
+ "body control"
544
+ "info control";
540
545
 
541
- &:has(.wds-list-item-button-control) {
542
- grid-template-columns: 1fr;
543
- grid-template-rows: auto;
544
- grid-template-areas:
545
- "body"
546
- "info"
547
- "control";
548
- }
546
+ &:has(.wds-list-item-button-control) {
547
+ grid-template-columns: 1fr;
548
+ grid-template-rows: auto;
549
+ grid-template-areas:
550
+ "body"
551
+ "info"
552
+ "control";
553
+ }
549
554
  }
550
555
 
551
556
  &.wds-list-item-noInfo-hasPrompt {
552
557
  grid-template-columns: 1fr auto;
553
558
  grid-template-rows: auto auto;
554
559
  grid-template-areas:
555
- "body control"
556
- "prompt prompt";
560
+ "body control"
561
+ "prompt prompt";
557
562
 
558
- &:has(.wds-list-item-button-control) {
559
- grid-template-columns: 1fr;
560
- grid-template-rows: auto;
561
- grid-template-areas:
562
- "body"
563
- "prompt"
564
- "control";
565
- }
563
+ &:has(.wds-list-item-button-control) {
564
+ grid-template-columns: 1fr;
565
+ grid-template-rows: auto;
566
+ grid-template-areas:
567
+ "body"
568
+ "prompt"
569
+ "control";
570
+ }
566
571
  }
567
572
 
568
573
  &.wds-list-item-noInfo-noPrompt {
569
574
  grid-template-columns: 1fr auto;
570
575
  grid-template-rows: auto;
571
- grid-template-areas: "body control";
576
+ grid-template-areas:
577
+ "body control";
572
578
 
573
- &:has(.wds-list-item-button-control) {
574
- grid-template-columns: 1fr;
575
- grid-template-rows: auto;
576
- grid-template-areas:
577
- "body"
578
- "control";
579
- }
579
+ &:has(.wds-list-item-button-control) {
580
+ grid-template-columns: 1fr;
581
+ grid-template-rows: auto;
582
+ grid-template-areas:
583
+ "body"
584
+ "control";
585
+ }
580
586
  }
581
587
  }
582
588
 
@@ -589,37 +595,38 @@
589
595
  grid-template-columns: 1fr;
590
596
  grid-template-rows: auto auto auto;
591
597
  grid-template-areas:
592
- "body"
593
- "info"
594
- "prompt";
598
+ "body"
599
+ "info"
600
+ "prompt";
595
601
  }
596
602
 
597
603
  &.wds-list-item-hasInfo-noPrompt {
598
604
  grid-template-columns: 1fr;
599
605
  grid-template-rows: auto auto;
600
606
  grid-template-areas:
601
- "body"
602
- "info";
607
+ "body"
608
+ "info"
603
609
  }
604
610
 
605
611
  &.wds-list-item-noInfo-hasPrompt {
606
612
  grid-template-columns: 1fr;
607
613
  grid-template-rows: auto auto;
608
614
  grid-template-areas:
609
- "body"
610
- "prompt";
615
+ "body"
616
+ "prompt";
611
617
  }
612
618
 
613
619
  &.wds-list-item-noInfo-noPrompt {
614
620
  grid-template-columns: 1fr;
615
621
  grid-template-rows: auto;
616
- grid-template-areas: "body";
622
+ grid-template-areas:
623
+ "body"
617
624
  }
618
625
  }
619
626
 
620
627
  .wds-list-item-media {
621
628
  display: none;
622
- }
629
+ }
623
630
 
624
631
  .wds-list-item-body {
625
632
  grid-area: body;
@@ -633,7 +640,7 @@
633
640
  }
634
641
  }
635
642
 
636
- .wds-list-item-button-control--hasPrompt {
643
+ .wds-list-item-button-control--hasPrompt{
637
644
  margin-top: var(--size-4);
638
645
  }
639
646
  }
package/src/main.css CHANGED
@@ -29481,8 +29481,8 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
29481
29481
  gap: var(--size-4) var(--size-12);
29482
29482
  }
29483
29483
 
29484
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-hasPrompt:not( :has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt,
29485
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-hasPrompt:not( :has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt {
29484
+ .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-hasPrompt:not(:has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt,
29485
+ .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-hasPrompt:not(:has(.wds-list-item-subtitle-value, .wds-list-item-subtitle)) .wds-list-item-prompt {
29486
29486
  margin-top: -2px;
29487
29487
  }
29488
29488
 
@@ -29490,8 +29490,6 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
29490
29490
  .wds-list-item-gridWrapper .wds-list-item-control-wrapper {
29491
29491
  height: var(--wds-list-item-control-wrapper-height);
29492
29492
  align-content: center;
29493
- display: grid;
29494
- align-items: center;
29495
29493
  }
29496
29494
  .wds-list-item-gridWrapper .wds-list-item-media-image {
29497
29495
  -o-object-position: center;