@transferwise/components 0.0.0-experimental-751dc12 → 0.0.0-experimental-4341b9c

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 (318) hide show
  1. package/build/button/Button.js +0 -1
  2. package/build/button/Button.js.map +1 -1
  3. package/build/button/Button.mjs +0 -1
  4. package/build/button/Button.mjs.map +1 -1
  5. package/build/common/RadioButton/RadioButton.js +2 -5
  6. package/build/common/RadioButton/RadioButton.js.map +1 -1
  7. package/build/common/RadioButton/RadioButton.mjs +2 -5
  8. package/build/common/RadioButton/RadioButton.mjs.map +1 -1
  9. package/build/common/initials.js +4 -1
  10. package/build/common/initials.js.map +1 -1
  11. package/build/common/initials.mjs +4 -1
  12. package/build/common/initials.mjs.map +1 -1
  13. package/build/i18n/de.json +2 -0
  14. package/build/i18n/de.json.js +2 -0
  15. package/build/i18n/de.json.js.map +1 -1
  16. package/build/i18n/de.json.mjs +2 -0
  17. package/build/i18n/de.json.mjs.map +1 -1
  18. package/build/i18n/fr.json +2 -0
  19. package/build/i18n/fr.json.js +2 -0
  20. package/build/i18n/fr.json.js.map +1 -1
  21. package/build/i18n/fr.json.mjs +2 -0
  22. package/build/i18n/fr.json.mjs.map +1 -1
  23. package/build/i18n/hu.json +2 -0
  24. package/build/i18n/hu.json.js +2 -0
  25. package/build/i18n/hu.json.js.map +1 -1
  26. package/build/i18n/hu.json.mjs +2 -0
  27. package/build/i18n/hu.json.mjs.map +1 -1
  28. package/build/i18n/it.json +2 -0
  29. package/build/i18n/it.json.js +2 -0
  30. package/build/i18n/it.json.js.map +1 -1
  31. package/build/i18n/it.json.mjs +2 -0
  32. package/build/i18n/it.json.mjs.map +1 -1
  33. package/build/i18n/ja.json +2 -0
  34. package/build/i18n/ja.json.js +2 -0
  35. package/build/i18n/ja.json.js.map +1 -1
  36. package/build/i18n/ja.json.mjs +2 -0
  37. package/build/i18n/ja.json.mjs.map +1 -1
  38. package/build/i18n/pl.json +2 -0
  39. package/build/i18n/pl.json.js +2 -0
  40. package/build/i18n/pl.json.js.map +1 -1
  41. package/build/i18n/pl.json.mjs +2 -0
  42. package/build/i18n/pl.json.mjs.map +1 -1
  43. package/build/i18n/pt.json +2 -0
  44. package/build/i18n/pt.json.js +2 -0
  45. package/build/i18n/pt.json.js.map +1 -1
  46. package/build/i18n/pt.json.mjs +2 -0
  47. package/build/i18n/pt.json.mjs.map +1 -1
  48. package/build/i18n/ro.json +2 -0
  49. package/build/i18n/ro.json.js +2 -0
  50. package/build/i18n/ro.json.js.map +1 -1
  51. package/build/i18n/ro.json.mjs +2 -0
  52. package/build/i18n/ro.json.mjs.map +1 -1
  53. package/build/i18n/ru.json +2 -0
  54. package/build/i18n/ru.json.js +2 -0
  55. package/build/i18n/ru.json.js.map +1 -1
  56. package/build/i18n/ru.json.mjs +2 -0
  57. package/build/i18n/ru.json.mjs.map +1 -1
  58. package/build/i18n/tr.json +2 -0
  59. package/build/i18n/tr.json.js +2 -0
  60. package/build/i18n/tr.json.js.map +1 -1
  61. package/build/i18n/tr.json.mjs +2 -0
  62. package/build/i18n/tr.json.mjs.map +1 -1
  63. package/build/i18n/zh-CN.json +2 -0
  64. package/build/i18n/zh-CN.json.js +2 -0
  65. package/build/i18n/zh-CN.json.js.map +1 -1
  66. package/build/i18n/zh-CN.json.mjs +2 -0
  67. package/build/i18n/zh-CN.json.mjs.map +1 -1
  68. package/build/i18n/zh-HK.json +2 -0
  69. package/build/i18n/zh-HK.json.js +2 -0
  70. package/build/i18n/zh-HK.json.js.map +1 -1
  71. package/build/i18n/zh-HK.json.mjs +2 -0
  72. package/build/i18n/zh-HK.json.mjs.map +1 -1
  73. package/build/iconButton/IconButton.js.map +1 -1
  74. package/build/iconButton/IconButton.mjs.map +1 -1
  75. package/build/image/Image.js.map +1 -1
  76. package/build/image/Image.mjs.map +1 -1
  77. package/build/index.js +0 -2
  78. package/build/index.js.map +1 -1
  79. package/build/index.mjs +0 -1
  80. package/build/index.mjs.map +1 -1
  81. package/build/main.css +0 -709
  82. package/build/styles/main.css +0 -709
  83. package/build/switch/Switch.js +0 -2
  84. package/build/switch/Switch.js.map +1 -1
  85. package/build/switch/Switch.mjs +0 -2
  86. package/build/switch/Switch.mjs.map +1 -1
  87. package/build/types/button/Button.d.ts.map +1 -1
  88. package/build/types/button/Button.types.d.ts +1 -1
  89. package/build/types/button/Button.types.d.ts.map +1 -1
  90. package/build/types/button/index.d.ts +1 -1
  91. package/build/types/button/index.d.ts.map +1 -1
  92. package/build/types/common/RadioButton/RadioButton.d.ts +1 -3
  93. package/build/types/common/RadioButton/RadioButton.d.ts.map +1 -1
  94. package/build/types/common/initials.d.ts.map +1 -1
  95. package/build/types/iconButton/IconButton.d.ts +2 -2
  96. package/build/types/iconButton/IconButton.d.ts.map +1 -1
  97. package/build/types/image/Image.d.ts +0 -3
  98. package/build/types/image/Image.d.ts.map +1 -1
  99. package/build/types/image/index.d.ts +0 -1
  100. package/build/types/image/index.d.ts.map +1 -1
  101. package/build/types/index.d.ts +0 -2
  102. package/build/types/index.d.ts.map +1 -1
  103. package/build/types/switch/Switch.d.ts +0 -2
  104. package/build/types/switch/Switch.d.ts.map +1 -1
  105. package/package.json +1 -1
  106. package/src/button/Button.spec.tsx +0 -18
  107. package/src/button/Button.tsx +1 -5
  108. package/src/button/Button.types.ts +1 -1
  109. package/src/button/index.ts +1 -1
  110. package/src/checkboxButton/CheckboxButton.story.tsx +4 -4
  111. package/src/common/RadioButton/RadioButton.tsx +1 -6
  112. package/src/common/initials.spec.tsx +13 -0
  113. package/src/common/initials.ts +5 -0
  114. package/src/i18n/de.json +2 -0
  115. package/src/i18n/fr.json +2 -0
  116. package/src/i18n/hu.json +2 -0
  117. package/src/i18n/it.json +2 -0
  118. package/src/i18n/ja.json +2 -0
  119. package/src/i18n/pl.json +2 -0
  120. package/src/i18n/pt.json +2 -0
  121. package/src/i18n/ro.json +2 -0
  122. package/src/i18n/ru.json +2 -0
  123. package/src/i18n/tr.json +2 -0
  124. package/src/i18n/zh-CN.json +2 -0
  125. package/src/i18n/zh-HK.json +2 -0
  126. package/src/iconButton/IconButton.story.tsx +1 -1
  127. package/src/iconButton/IconButton.tsx +1 -1
  128. package/src/image/Image.tsx +0 -3
  129. package/src/image/index.ts +0 -1
  130. package/src/index.ts +0 -2
  131. package/src/main.css +0 -709
  132. package/src/main.less +0 -1
  133. package/src/switch/Switch.tsx +0 -4
  134. package/src/test-utils/Parameters.d.ts +77 -0
  135. package/build/listItem/AdditionalInfo/ListItemAdditionalInfo.js +0 -56
  136. package/build/listItem/AdditionalInfo/ListItemAdditionalInfo.js.map +0 -1
  137. package/build/listItem/AdditionalInfo/ListItemAdditionalInfo.mjs +0 -54
  138. package/build/listItem/AdditionalInfo/ListItemAdditionalInfo.mjs.map +0 -1
  139. package/build/listItem/AvatarLayout/ListItemAvatarLayout.js +0 -23
  140. package/build/listItem/AvatarLayout/ListItemAvatarLayout.js.map +0 -1
  141. package/build/listItem/AvatarLayout/ListItemAvatarLayout.mjs +0 -21
  142. package/build/listItem/AvatarLayout/ListItemAvatarLayout.mjs.map +0 -1
  143. package/build/listItem/AvatarView/ListItemAvatarView.js +0 -23
  144. package/build/listItem/AvatarView/ListItemAvatarView.js.map +0 -1
  145. package/build/listItem/AvatarView/ListItemAvatarView.mjs +0 -21
  146. package/build/listItem/AvatarView/ListItemAvatarView.mjs.map +0 -1
  147. package/build/listItem/Button/ListItemButton.js +0 -43
  148. package/build/listItem/Button/ListItemButton.js.map +0 -1
  149. package/build/listItem/Button/ListItemButton.mjs +0 -41
  150. package/build/listItem/Button/ListItemButton.mjs.map +0 -1
  151. package/build/listItem/Checkbox/ListItemCheckbox.js +0 -30
  152. package/build/listItem/Checkbox/ListItemCheckbox.js.map +0 -1
  153. package/build/listItem/Checkbox/ListItemCheckbox.mjs +0 -28
  154. package/build/listItem/Checkbox/ListItemCheckbox.mjs.map +0 -1
  155. package/build/listItem/IconButton/ListItemIconButton.js +0 -42
  156. package/build/listItem/IconButton/ListItemIconButton.js.map +0 -1
  157. package/build/listItem/IconButton/ListItemIconButton.mjs +0 -40
  158. package/build/listItem/IconButton/ListItemIconButton.mjs.map +0 -1
  159. package/build/listItem/Image/ListItemImage.js +0 -31
  160. package/build/listItem/Image/ListItemImage.js.map +0 -1
  161. package/build/listItem/Image/ListItemImage.mjs +0 -29
  162. package/build/listItem/Image/ListItemImage.mjs.map +0 -1
  163. package/build/listItem/ListItem.js +0 -308
  164. package/build/listItem/ListItem.js.map +0 -1
  165. package/build/listItem/ListItem.mjs +0 -303
  166. package/build/listItem/ListItem.mjs.map +0 -1
  167. package/build/listItem/ListItemContext.js +0 -8
  168. package/build/listItem/ListItemContext.js.map +0 -1
  169. package/build/listItem/ListItemContext.mjs +0 -6
  170. package/build/listItem/ListItemContext.mjs.map +0 -1
  171. package/build/listItem/Navigation/ListItemNavigation.js +0 -45
  172. package/build/listItem/Navigation/ListItemNavigation.js.map +0 -1
  173. package/build/listItem/Navigation/ListItemNavigation.mjs +0 -43
  174. package/build/listItem/Navigation/ListItemNavigation.mjs.map +0 -1
  175. package/build/listItem/Prompt/ListItemPrompt.js +0 -59
  176. package/build/listItem/Prompt/ListItemPrompt.js.map +0 -1
  177. package/build/listItem/Prompt/ListItemPrompt.mjs +0 -54
  178. package/build/listItem/Prompt/ListItemPrompt.mjs.map +0 -1
  179. package/build/listItem/Radio/ListItemRadio.js +0 -30
  180. package/build/listItem/Radio/ListItemRadio.js.map +0 -1
  181. package/build/listItem/Radio/ListItemRadio.mjs +0 -28
  182. package/build/listItem/Radio/ListItemRadio.mjs.map +0 -1
  183. package/build/listItem/Switch/ListItemSwitch.js +0 -30
  184. package/build/listItem/Switch/ListItemSwitch.js.map +0 -1
  185. package/build/listItem/Switch/ListItemSwitch.mjs +0 -28
  186. package/build/listItem/Switch/ListItemSwitch.mjs.map +0 -1
  187. package/build/listItem/_stories/images/landscape.svg +0 -1
  188. package/build/listItem/_stories/images/portrait.svg +0 -1
  189. package/build/listItem/useListItemControl.js +0 -22
  190. package/build/listItem/useListItemControl.js.map +0 -1
  191. package/build/listItem/useListItemControl.mjs +0 -20
  192. package/build/listItem/useListItemControl.mjs.map +0 -1
  193. package/build/listItem/useListItemMedia.js +0 -21
  194. package/build/listItem/useListItemMedia.js.map +0 -1
  195. package/build/listItem/useListItemMedia.mjs +0 -19
  196. package/build/listItem/useListItemMedia.mjs.map +0 -1
  197. package/build/styles/listItem/ListItem.css +0 -709
  198. package/build/styles/listItem/ListItem.grid.css +0 -368
  199. package/build/types/listItem/AdditionalInfo/ListItemAdditionalInfo.d.ts +0 -15
  200. package/build/types/listItem/AdditionalInfo/ListItemAdditionalInfo.d.ts.map +0 -1
  201. package/build/types/listItem/AdditionalInfo/index.d.ts +0 -3
  202. package/build/types/listItem/AdditionalInfo/index.d.ts.map +0 -1
  203. package/build/types/listItem/AvatarLayout/ListItemAvatarLayout.d.ts +0 -18
  204. package/build/types/listItem/AvatarLayout/ListItemAvatarLayout.d.ts.map +0 -1
  205. package/build/types/listItem/AvatarLayout/index.d.ts +0 -3
  206. package/build/types/listItem/AvatarLayout/index.d.ts.map +0 -1
  207. package/build/types/listItem/AvatarView/ListItemAvatarView.d.ts +0 -16
  208. package/build/types/listItem/AvatarView/ListItemAvatarView.d.ts.map +0 -1
  209. package/build/types/listItem/AvatarView/index.d.ts +0 -3
  210. package/build/types/listItem/AvatarView/index.d.ts.map +0 -1
  211. package/build/types/listItem/Button/ListItemButton.d.ts +0 -20
  212. package/build/types/listItem/Button/ListItemButton.d.ts.map +0 -1
  213. package/build/types/listItem/Button/index.d.ts +0 -3
  214. package/build/types/listItem/Button/index.d.ts.map +0 -1
  215. package/build/types/listItem/Checkbox/ListItemCheckbox.d.ts +0 -14
  216. package/build/types/listItem/Checkbox/ListItemCheckbox.d.ts.map +0 -1
  217. package/build/types/listItem/Checkbox/index.d.ts +0 -3
  218. package/build/types/listItem/Checkbox/index.d.ts.map +0 -1
  219. package/build/types/listItem/IconButton/ListItemIconButton.d.ts +0 -18
  220. package/build/types/listItem/IconButton/ListItemIconButton.d.ts.map +0 -1
  221. package/build/types/listItem/IconButton/index.d.ts +0 -3
  222. package/build/types/listItem/IconButton/index.d.ts.map +0 -1
  223. package/build/types/listItem/Image/ListItemImage.d.ts +0 -25
  224. package/build/types/listItem/Image/ListItemImage.d.ts.map +0 -1
  225. package/build/types/listItem/Image/index.d.ts +0 -3
  226. package/build/types/listItem/Image/index.d.ts.map +0 -1
  227. package/build/types/listItem/ListItem.d.ts +0 -113
  228. package/build/types/listItem/ListItem.d.ts.map +0 -1
  229. package/build/types/listItem/ListItemContext.d.ts +0 -22
  230. package/build/types/listItem/ListItemContext.d.ts.map +0 -1
  231. package/build/types/listItem/Navigation/ListItemNavigation.d.ts +0 -15
  232. package/build/types/listItem/Navigation/ListItemNavigation.d.ts.map +0 -1
  233. package/build/types/listItem/Navigation/index.d.ts +0 -3
  234. package/build/types/listItem/Navigation/index.d.ts.map +0 -1
  235. package/build/types/listItem/Prompt/ListItemPrompt.d.ts +0 -16
  236. package/build/types/listItem/Prompt/ListItemPrompt.d.ts.map +0 -1
  237. package/build/types/listItem/Prompt/index.d.ts +0 -3
  238. package/build/types/listItem/Prompt/index.d.ts.map +0 -1
  239. package/build/types/listItem/Radio/ListItemRadio.d.ts +0 -14
  240. package/build/types/listItem/Radio/ListItemRadio.d.ts.map +0 -1
  241. package/build/types/listItem/Radio/index.d.ts +0 -3
  242. package/build/types/listItem/Radio/index.d.ts.map +0 -1
  243. package/build/types/listItem/Switch/ListItemSwitch.d.ts +0 -14
  244. package/build/types/listItem/Switch/ListItemSwitch.d.ts.map +0 -1
  245. package/build/types/listItem/Switch/index.d.ts +0 -3
  246. package/build/types/listItem/Switch/index.d.ts.map +0 -1
  247. package/build/types/listItem/_stories/subcomponents.d.ts +0 -18
  248. package/build/types/listItem/_stories/subcomponents.d.ts.map +0 -1
  249. package/build/types/listItem/index.d.ts +0 -14
  250. package/build/types/listItem/index.d.ts.map +0 -1
  251. package/build/types/listItem/test-utils.d.ts +0 -7
  252. package/build/types/listItem/test-utils.d.ts.map +0 -1
  253. package/build/types/listItem/useListItemControl.d.ts +0 -5
  254. package/build/types/listItem/useListItemControl.d.ts.map +0 -1
  255. package/build/types/listItem/useListItemMedia.d.ts +0 -6
  256. package/build/types/listItem/useListItemMedia.d.ts.map +0 -1
  257. package/src/listItem/AdditionalInfo/ListItemAdditionalInfo.spec.tsx +0 -56
  258. package/src/listItem/AdditionalInfo/ListItemAdditionalInfo.story.tsx +0 -145
  259. package/src/listItem/AdditionalInfo/ListItemAdditionalInfo.tsx +0 -36
  260. package/src/listItem/AdditionalInfo/index.ts +0 -2
  261. package/src/listItem/AvatarLayout/ListItemAvatarLayout.spec.tsx +0 -59
  262. package/src/listItem/AvatarLayout/ListItemAvatarLayout.story.tsx +0 -118
  263. package/src/listItem/AvatarLayout/ListItemAvatarLayout.tsx +0 -27
  264. package/src/listItem/AvatarLayout/index.ts +0 -2
  265. package/src/listItem/AvatarView/ListItemAvatarView.spec.tsx +0 -75
  266. package/src/listItem/AvatarView/ListItemAvatarView.story.tsx +0 -318
  267. package/src/listItem/AvatarView/ListItemAvatarView.tsx +0 -27
  268. package/src/listItem/AvatarView/index.ts +0 -2
  269. package/src/listItem/Button/ListItemButton.spec.tsx +0 -68
  270. package/src/listItem/Button/ListItemButton.story.tsx +0 -408
  271. package/src/listItem/Button/ListItemButton.tsx +0 -56
  272. package/src/listItem/Button/index.ts +0 -2
  273. package/src/listItem/Checkbox/ListItemCheckbox.spec.tsx +0 -82
  274. package/src/listItem/Checkbox/ListItemCheckbox.story.tsx +0 -107
  275. package/src/listItem/Checkbox/ListItemCheckbox.tsx +0 -33
  276. package/src/listItem/Checkbox/index.ts +0 -2
  277. package/src/listItem/IconButton/ListItemIconButton.spec.tsx +0 -119
  278. package/src/listItem/IconButton/ListItemIconButton.story.tsx +0 -236
  279. package/src/listItem/IconButton/ListItemIconButton.tsx +0 -56
  280. package/src/listItem/IconButton/index.ts +0 -2
  281. package/src/listItem/Image/ListItemImage.spec.tsx +0 -30
  282. package/src/listItem/Image/ListItemImage.story.tsx +0 -56
  283. package/src/listItem/Image/ListItemImage.tsx +0 -48
  284. package/src/listItem/Image/index.ts +0 -2
  285. package/src/listItem/ListItem.css +0 -709
  286. package/src/listItem/ListItem.grid.css +0 -368
  287. package/src/listItem/ListItem.grid.less +0 -620
  288. package/src/listItem/ListItem.less +0 -346
  289. package/src/listItem/ListItem.spec.tsx +0 -1496
  290. package/src/listItem/ListItem.tsx +0 -441
  291. package/src/listItem/ListItemContext.tsx +0 -27
  292. package/src/listItem/Navigation/ListItemNavigation.spec.tsx +0 -59
  293. package/src/listItem/Navigation/ListItemNavigation.story.tsx +0 -106
  294. package/src/listItem/Navigation/ListItemNavigation.tsx +0 -40
  295. package/src/listItem/Navigation/index.ts +0 -2
  296. package/src/listItem/Prompt/ListItemPrompt.spec.tsx +0 -36
  297. package/src/listItem/Prompt/ListItemPrompt.story.tsx +0 -201
  298. package/src/listItem/Prompt/ListItemPrompt.tsx +0 -32
  299. package/src/listItem/Prompt/index.ts +0 -2
  300. package/src/listItem/Radio/ListItemRadio.spec.tsx +0 -66
  301. package/src/listItem/Radio/ListItemRadio.story.tsx +0 -98
  302. package/src/listItem/Radio/ListItemRadio.tsx +0 -33
  303. package/src/listItem/Radio/index.ts +0 -2
  304. package/src/listItem/Switch/ListItemSwitch.spec.tsx +0 -47
  305. package/src/listItem/Switch/ListItemSwitch.story.tsx +0 -69
  306. package/src/listItem/Switch/ListItemSwitch.tsx +0 -33
  307. package/src/listItem/Switch/index.ts +0 -2
  308. package/src/listItem/_stories/ListItem.focus.test.story.tsx +0 -250
  309. package/src/listItem/_stories/ListItem.layout.test.story.tsx +0 -338
  310. package/src/listItem/_stories/ListItem.story.tsx +0 -670
  311. package/src/listItem/_stories/ListItem.variants.test.story.tsx +0 -271
  312. package/src/listItem/_stories/images/landscape.svg +0 -1
  313. package/src/listItem/_stories/images/portrait.svg +0 -1
  314. package/src/listItem/_stories/subcomponents.tsx +0 -139
  315. package/src/listItem/index.ts +0 -14
  316. package/src/listItem/test-utils.tsx +0 -33
  317. package/src/listItem/useListItemControl.tsx +0 -18
  318. package/src/listItem/useListItemMedia.tsx +0 -13
package/src/main.css CHANGED
@@ -2633,715 +2633,6 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
2633
2633
  border-radius: 9999px !important;
2634
2634
  border-radius: var(--radius-full) !important;
2635
2635
  }
2636
- .wds-list-item-gridWrapper {
2637
- display: grid;
2638
- grid-gap: 4px 16px;
2639
- grid-gap: var(--size-4) var(--size-16);
2640
- gap: 4px 16px;
2641
- gap: var(--size-4) var(--size-16);
2642
- }
2643
- @container (min-width: 375px) {
2644
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-hasInfo-hasPrompt {
2645
- grid-template-columns: auto 1fr auto;
2646
- grid-template-rows: auto auto auto;
2647
- grid-template-areas: "media body control" ". info ." ". prompt prompt";
2648
- }
2649
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-hasInfo-noPrompt {
2650
- grid-template-columns: auto 1fr auto;
2651
- grid-template-rows: auto auto;
2652
- grid-template-areas: "media body control" ". info .";
2653
- }
2654
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-hasPrompt {
2655
- grid-template-columns: auto 1fr auto;
2656
- grid-template-rows: auto auto;
2657
- grid-template-areas: "media body control" ". prompt prompt";
2658
- }
2659
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-noPrompt {
2660
- grid-template-columns: auto 1fr auto;
2661
- grid-template-rows: auto;
2662
- grid-template-areas: "media body control";
2663
- }
2664
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-hasInfo-hasPrompt {
2665
- grid-template-columns: auto 1fr;
2666
- grid-template-rows: auto auto;
2667
- grid-template-areas: "media body" ". info" ". prompt";
2668
- }
2669
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-hasInfo-noPrompt {
2670
- grid-template-columns: auto 1fr;
2671
- grid-template-rows: auto auto auto;
2672
- grid-template-areas: "media body" ". info";
2673
- }
2674
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-hasPrompt {
2675
- grid-template-columns: auto 1fr;
2676
- grid-template-rows: auto auto;
2677
- grid-template-areas: "media body" ". prompt";
2678
- }
2679
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-noPrompt {
2680
- grid-template-columns: auto 1fr;
2681
- grid-template-rows: auto;
2682
- grid-template-areas: "media body";
2683
- }
2684
- .wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl .wds-list-item-prompt {
2685
- grid-column: 1 / -1;
2686
- }
2687
- .wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-hasInfo-hasPrompt {
2688
- grid-template-columns: 1fr auto;
2689
- grid-template-rows: auto auto auto;
2690
- grid-template-areas: "body control" "info ." "prompt prompt";
2691
- }
2692
- .wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-hasInfo-noPrompt {
2693
- grid-template-columns: 1fr auto;
2694
- grid-template-rows: auto auto;
2695
- grid-template-areas: "body control" "info .";
2696
- }
2697
- .wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-noInfo-hasPrompt {
2698
- grid-template-columns: 1fr auto;
2699
- grid-template-rows: auto auto;
2700
- grid-template-areas: "body control" "prompt prompt";
2701
- }
2702
- .wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-noInfo-noPrompt {
2703
- grid-template-columns: 1fr auto;
2704
- grid-template-rows: auto;
2705
- grid-template-areas: "body control";
2706
- }
2707
- .wds-list-item-gridWrapper.wds-list-item-noMedia-noControl .wds-list-item-prompt {
2708
- grid-column: 1 / -1;
2709
- }
2710
- .wds-list-item-gridWrapper.wds-list-item-noMedia-noControl.wds-list-item-hasInfo-hasPrompt {
2711
- grid-template-columns: 1fr;
2712
- grid-template-rows: auto auto auto;
2713
- grid-template-areas: "body" "info" "prompt";
2714
- }
2715
- .wds-list-item-gridWrapper.wds-list-item-noMedia-noControl.wds-list-item-hasInfo-noPrompt {
2716
- grid-template-columns: 1fr;
2717
- grid-template-rows: auto auto;
2718
- grid-template-areas: "body" "info";
2719
- }
2720
- .wds-list-item-gridWrapper.wds-list-item-noMedia-noControl.wds-list-item-noInfo-hasPrompt {
2721
- grid-template-columns: 1fr;
2722
- grid-template-rows: auto auto;
2723
- grid-template-areas: "body" "prompt";
2724
- }
2725
- .wds-list-item-gridWrapper.wds-list-item-noMedia-noControl.wds-list-item-noInfo-noPrompt {
2726
- grid-template-columns: 1fr;
2727
- grid-template-rows: auto;
2728
- grid-template-areas: "body";
2729
- }
2730
- }
2731
- @container (min-width: 297px) and (max-width: 375px) {
2732
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl .wds-list-item-media {
2733
- margin-bottom: 12px;
2734
- margin-bottom: var(--size-12);
2735
- }
2736
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl .wds-list-item-media .wds-list-item-media-image {
2737
- height: auto;
2738
- }
2739
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-hasInfo-hasPrompt {
2740
- grid-template-columns: 1fr auto;
2741
- grid-template-rows: auto auto auto auto;
2742
- grid-template-areas: "media media" "body control" "info control" "prompt prompt";
2743
- }
2744
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-hasInfo-hasPrompt:has(.wds-list-item-button-control) {
2745
- grid-template-columns: 1fr;
2746
- grid-template-areas: "media" "body" "info" "prompt" "control";
2747
- }
2748
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-hasInfo-noPrompt {
2749
- grid-template-columns: 1fr auto;
2750
- grid-template-rows: auto auto auto;
2751
- grid-template-areas: "media media" "body control" "info control";
2752
- }
2753
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-hasInfo-noPrompt:has(.wds-list-item-button-control) {
2754
- grid-template-columns: 1fr;
2755
- grid-template-areas: "media" "body" "info" "control";
2756
- }
2757
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-hasPrompt {
2758
- grid-template-columns: 1fr auto;
2759
- grid-template-rows: auto auto auto;
2760
- grid-template-areas: "media media" "body control" "prompt prompt";
2761
- }
2762
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-hasPrompt:has(.wds-list-item-button-control) {
2763
- grid-template-columns: 1fr;
2764
- grid-template-areas: "media" "body" "prompt" "control";
2765
- }
2766
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-noPrompt {
2767
- grid-template-columns: 1fr auto;
2768
- grid-template-rows: auto auto;
2769
- grid-template-areas: "media media" "body control";
2770
- }
2771
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-noPrompt:has(.wds-list-item-button-control) {
2772
- grid-template-columns: 1fr;
2773
- grid-template-areas: "media" "body" "control";
2774
- }
2775
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl .wds-list-item-media {
2776
- margin-bottom: 16px;
2777
- margin-bottom: var(--size-16);
2778
- }
2779
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl .wds-list-item-media .wds-list-item-media-image {
2780
- height: auto;
2781
- }
2782
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-hasInfo-hasPrompt {
2783
- grid-template-columns: auto auto;
2784
- grid-template-rows: auto auto auto auto;
2785
- grid-template-areas: "media media" "body body" "info info" "prompt prompt";
2786
- }
2787
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-hasInfo-noPrompt {
2788
- grid-template-columns: auto 1fr;
2789
- grid-template-rows: auto auto auto;
2790
- grid-template-areas: "media media" "body body" "info info";
2791
- }
2792
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-hasPrompt {
2793
- grid-template-columns: auto 1fr;
2794
- grid-template-rows: auto auto auto;
2795
- grid-template-areas: "media media" "body body" "prompt prompt";
2796
- }
2797
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-noPrompt {
2798
- grid-template-columns: 1fr;
2799
- grid-template-rows: auto auto;
2800
- grid-template-areas: "media" "body";
2801
- }
2802
- .wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl .wds-list-item-prompt {
2803
- grid-column: 1 / -1;
2804
- }
2805
- .wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-hasInfo-hasPrompt {
2806
- grid-template-columns: 1fr auto;
2807
- grid-template-rows: auto auto auto;
2808
- grid-template-areas: "body control" "info control" "prompt prompt";
2809
- }
2810
- .wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-hasInfo-hasPrompt:has(.wds-list-item-button-control) {
2811
- grid-template-columns: 1fr;
2812
- grid-template-areas: "body" "info" "prompt" "control";
2813
- }
2814
- .wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-hasInfo-noPrompt {
2815
- grid-template-columns: 1fr auto;
2816
- grid-template-rows: auto auto;
2817
- grid-template-areas: "body control" "info control";
2818
- }
2819
- .wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-hasInfo-noPrompt:has(.wds-list-item-button-control) {
2820
- grid-template-columns: 1fr;
2821
- grid-template-areas: "body" "info" "control";
2822
- }
2823
- .wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-noInfo-hasPrompt {
2824
- grid-template-columns: 1fr auto;
2825
- grid-template-rows: auto auto;
2826
- grid-template-areas: "body control" "prompt prompt";
2827
- }
2828
- .wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-noInfo-hasPrompt:has(.wds-list-item-button-control) {
2829
- grid-template-columns: 1fr;
2830
- grid-template-areas: "body" "prompt" "control";
2831
- }
2832
- .wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-noInfo-noPrompt {
2833
- grid-template-columns: 1fr auto;
2834
- grid-template-rows: auto;
2835
- grid-template-areas: "body control";
2836
- }
2837
- .wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-noInfo-noPrompt:has(.wds-list-item-button-control) {
2838
- grid-template-columns: 1fr;
2839
- grid-template-areas: "body" "control";
2840
- }
2841
- .wds-list-item-gridWrapper.wds-list-item-noMedia-noControl .wds-list-item-prompt {
2842
- grid-column: 1 / -1;
2843
- }
2844
- .wds-list-item-gridWrapper.wds-list-item-noMedia-noControl.wds-list-item-hasInfo-hasPrompt {
2845
- grid-template-columns: 1fr;
2846
- grid-template-rows: auto auto auto;
2847
- grid-template-areas: "body" "info" "prompt";
2848
- }
2849
- .wds-list-item-gridWrapper.wds-list-item-noMedia-noControl.wds-list-item-hasInfo-noPrompt {
2850
- grid-template-columns: 1fr;
2851
- grid-template-rows: auto auto;
2852
- grid-template-areas: "body" "info";
2853
- }
2854
- .wds-list-item-gridWrapper.wds-list-item-noMedia-noControl.wds-list-item-noInfo-hasPrompt {
2855
- grid-template-columns: 1fr;
2856
- grid-template-rows: auto auto;
2857
- grid-template-areas: "body" "prompt";
2858
- }
2859
- .wds-list-item-gridWrapper.wds-list-item-noMedia-noControl.wds-list-item-noInfo-noPrompt {
2860
- grid-template-columns: 1fr;
2861
- grid-template-rows: auto;
2862
- grid-template-areas: "body";
2863
- }
2864
- }
2865
- @container (max-width: 297px) {
2866
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-hasInfo-hasPrompt {
2867
- grid-template-columns: auto 1fr;
2868
- grid-template-rows: auto auto auto;
2869
- grid-template-areas: "body control" "info control" "prompt prompt";
2870
- }
2871
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-hasInfo-hasPrompt:has(.wds-list-item-button-control) {
2872
- grid-template-columns: 1fr;
2873
- grid-template-rows: auto;
2874
- grid-template-areas: "body" "info" "prompt" "control";
2875
- }
2876
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-hasInfo-noPrompt {
2877
- grid-template-columns: auto 1fr;
2878
- grid-template-rows: auto auto;
2879
- grid-template-areas: "body control" "info control";
2880
- }
2881
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-hasInfo-noPrompt:has(.wds-list-item-button-control) {
2882
- grid-template-columns: 1fr;
2883
- grid-template-areas: "body" "info" "control";
2884
- }
2885
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-hasPrompt {
2886
- grid-template-columns: auto 1fr;
2887
- grid-template-rows: auto auto;
2888
- grid-template-areas: "body control" "prompt prompt";
2889
- }
2890
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-hasPrompt:has(.wds-list-item-button-control) {
2891
- grid-template-columns: 1fr;
2892
- grid-template-areas: "body" "prompt" "control";
2893
- }
2894
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-noPrompt {
2895
- grid-template-columns: auto 1fr;
2896
- grid-template-rows: auto;
2897
- grid-template-areas: "body control";
2898
- }
2899
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-noPrompt:has(.wds-list-item-button-control) {
2900
- grid-template-columns: 1fr;
2901
- grid-template-areas: "body" "control";
2902
- }
2903
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-hasInfo-hasPrompt {
2904
- grid-template-columns: auto;
2905
- grid-template-rows: auto auto;
2906
- grid-template-areas: "body" "info" "prompt";
2907
- }
2908
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-hasInfo-noPrompt {
2909
- grid-template-columns: auto;
2910
- grid-template-rows: auto auto auto;
2911
- grid-template-areas: "body" "info";
2912
- }
2913
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-hasPrompt {
2914
- grid-template-columns: auto;
2915
- grid-template-rows: auto auto;
2916
- grid-template-areas: "body" "prompt";
2917
- }
2918
- .wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-noPrompt {
2919
- grid-template-columns: 1fr;
2920
- grid-template-rows: auto;
2921
- grid-template-areas: "body";
2922
- }
2923
- .wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl .wds-list-item-prompt {
2924
- grid-column: 1 / -1;
2925
- }
2926
- .wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-hasInfo-hasPrompt {
2927
- grid-template-columns: 1fr auto;
2928
- grid-template-rows: auto auto auto;
2929
- grid-template-areas: "body control" "info control" "prompt prompt";
2930
- }
2931
- .wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-hasInfo-hasPrompt:has(.wds-list-item-button-control) {
2932
- grid-template-columns: 1fr;
2933
- grid-template-rows: auto;
2934
- grid-template-areas: "body" "info" "prompt" "control";
2935
- }
2936
- .wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-hasInfo-noPrompt {
2937
- grid-template-columns: 1fr auto;
2938
- grid-template-rows: auto auto;
2939
- grid-template-areas: "body control" "info control";
2940
- }
2941
- .wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-hasInfo-noPrompt:has(.wds-list-item-button-control) {
2942
- grid-template-columns: 1fr;
2943
- grid-template-rows: auto;
2944
- grid-template-areas: "body" "info" "control";
2945
- }
2946
- .wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-noInfo-hasPrompt {
2947
- grid-template-columns: 1fr auto;
2948
- grid-template-rows: auto auto;
2949
- grid-template-areas: "body control" "prompt prompt";
2950
- }
2951
- .wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-noInfo-hasPrompt:has(.wds-list-item-button-control) {
2952
- grid-template-columns: 1fr;
2953
- grid-template-rows: auto;
2954
- grid-template-areas: "body" "prompt" "control";
2955
- }
2956
- .wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-noInfo-noPrompt {
2957
- grid-template-columns: 1fr auto;
2958
- grid-template-rows: auto;
2959
- grid-template-areas: "body control";
2960
- }
2961
- .wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-noInfo-noPrompt:has(.wds-list-item-button-control) {
2962
- grid-template-columns: 1fr;
2963
- grid-template-rows: auto;
2964
- grid-template-areas: "body" "control";
2965
- }
2966
- .wds-list-item-gridWrapper.wds-list-item-noMedia-noControl .wds-list-item-prompt {
2967
- grid-column: 1 / -1;
2968
- }
2969
- .wds-list-item-gridWrapper.wds-list-item-noMedia-noControl.wds-list-item-hasInfo-hasPrompt {
2970
- grid-template-columns: 1fr;
2971
- grid-template-rows: auto auto auto;
2972
- grid-template-areas: "body" "info" "prompt";
2973
- }
2974
- .wds-list-item-gridWrapper.wds-list-item-noMedia-noControl.wds-list-item-hasInfo-noPrompt {
2975
- grid-template-columns: 1fr;
2976
- grid-template-rows: auto auto;
2977
- grid-template-areas: "body" "info";
2978
- }
2979
- .wds-list-item-gridWrapper.wds-list-item-noMedia-noControl.wds-list-item-noInfo-hasPrompt {
2980
- grid-template-columns: 1fr;
2981
- grid-template-rows: auto auto;
2982
- grid-template-areas: "body" "prompt";
2983
- }
2984
- .wds-list-item-gridWrapper.wds-list-item-noMedia-noControl.wds-list-item-noInfo-noPrompt {
2985
- grid-template-columns: 1fr;
2986
- grid-template-rows: auto;
2987
- grid-template-areas: "body";
2988
- }
2989
- .wds-list-item-gridWrapper .wds-list-item-media {
2990
- display: none;
2991
- }
2992
- .wds-list-item-gridWrapper .wds-list-item-body {
2993
- grid-area: body;
2994
- display: grid;
2995
- grid-template-columns: 1fr;
2996
- justify-items: start;
2997
- grid-gap: 0;
2998
- gap: 0;
2999
- }
3000
- .wds-list-item-gridWrapper .wds-list-item-body .wds-list-item-value {
3001
- text-align: left;
3002
- }
3003
- }
3004
- .wds-list-item {
3005
- list-style: none;
3006
- width: 100%;
3007
- border-radius: 16px;
3008
- border-radius: var(--radius-medium);
3009
- background-color: #ffffff;
3010
- background-color: var(--color-background-screen);
3011
- position: relative;
3012
- padding: 12px;
3013
- padding: var(--size-12);
3014
- container-type: inline-size;
3015
- }
3016
- .wds-list-item + .wds-list-item-spotlight,
3017
- .wds-list-item-spotlight + .wds-list-item {
3018
- margin-top: 16px;
3019
- margin-top: var(--size-16);
3020
- }
3021
- .wds-list-item:focus-within {
3022
- z-index: 1;
3023
- }
3024
- .wds-list-item-view {
3025
- display: grid;
3026
- grid-column: 1 / -1;
3027
- grid-row: 1 / -1;
3028
- grid-template-columns: subgrid;
3029
- grid-template-rows: subgrid;
3030
- }
3031
- .wds-list-item-view.fullyInteractive {
3032
- margin-bottom: 0;
3033
- }
3034
- .wds-list-item-view.fullyInteractive:before {
3035
- content: '';
3036
- position: absolute;
3037
- inset: 0;
3038
- }
3039
- .wds-list-item a {
3040
- text-underline-offset: calc(4px / 2);
3041
- text-underline-offset: calc(var(--size-4) / 2);
3042
- }
3043
- .wds-list-item-interactive .wds-list-item-control:focus-visible,
3044
- .wds-list-item-interactive .np-checkbox-button:has(input[type="checkbox"]:focus-visible) .tw-checkbox-button {
3045
- outline: none;
3046
- }
3047
- .wds-list-item-interactive:has(.wds-list-item-control:focus-visible),
3048
- .wds-list-item-interactive:has(input[type="checkbox"]:focus-visible) {
3049
- outline: var(--ring-outline-color) solid var(--ring-outline-width);
3050
- outline-offset: var(--ring-outline-offset);
3051
- outline-offset: -1px;
3052
- }
3053
- .wds-list-item-interactive .wds-list-item-additional-info {
3054
- --ring-outline-offset: 0;
3055
- }
3056
- .wds-list-item-interactive a.wds-list-item-control,
3057
- .wds-list-item-interactive a.wds-list-item-control:hover,
3058
- .wds-list-item-interactive a.wds-list-item-control:focus {
3059
- -webkit-text-decoration: none;
3060
- text-decoration: none;
3061
- }
3062
- .wds-list-item-interactive a.wds-list-item-control:has(.wds-list-item-control_pseudo-element) {
3063
- position: relative;
3064
- z-index: 1;
3065
- }
3066
- .wds-list-item-interactive a.wds-list-item-control.wds-list-item-control_pseudo-element:before {
3067
- content: '';
3068
- position: absolute;
3069
- inset: 0;
3070
- }
3071
- .wds-list-item-interactive:not(.disabled):not(:disabled):hover {
3072
- background-color: var(--color-background-screen-hover);
3073
- }
3074
- .wds-list-item-interactive:not(.disabled):not(:disabled):hover .wds-list-item-control-wrapper .wds-Button {
3075
- background-color: var(--Button-background-hover);
3076
- color: var(--Button-color-hover);
3077
- transition: none;
3078
- }
3079
- .wds-list-item-interactive:not(.disabled):not(:disabled):active {
3080
- background-color: var(--color-background-screen-active);
3081
- }
3082
- .wds-list-item-interactive .wds-list-item-button-control .wds-Button {
3083
- transition: none;
3084
- }
3085
- .wds-list-item-interactive:has(.wds-list-item-prompt:hover a, .wds-list-item-prompt:hover button):hover {
3086
- background-color: transparent;
3087
- background-color: initial;
3088
- }
3089
- .wds-list-item-media {
3090
- grid-area: media;
3091
- display: flex;
3092
- align-items: start;
3093
- }
3094
- .wds-list-item-media-image-wrapper {
3095
- width: var(--wds-list-item-media-size);
3096
- height: var(--wds-list-item-media-size);
3097
- display: flex;
3098
- align-items: center;
3099
- justify-content: center;
3100
- }
3101
- .wds-list-item-media-image {
3102
- width: 100%;
3103
- height: 100%;
3104
- -o-object-fit: contain;
3105
- object-fit: contain;
3106
- }
3107
- .wds-list-item-body {
3108
- grid-area: body;
3109
- align-items: center;
3110
- width: 100%;
3111
- display: grid;
3112
- grid-template-columns: 1fr max-content;
3113
- grid-template-columns: var(--wds-list-item-body-left, 1fr) var(--wds-list-item-body-right, max-content);
3114
- grid-gap: 16px;
3115
- grid-gap: var(--size-16);
3116
- gap: 16px;
3117
- gap: var(--size-16);
3118
- word-break: break-word;
3119
- }
3120
- .wds-list-item-title {
3121
- color: #37517e;
3122
- color: var(--color-content-primary);
3123
- }
3124
- .wds-list-item-value {
3125
- text-align: right;
3126
- }
3127
- .wds-list-item-body-center {
3128
- display: flex;
3129
- flex-direction: row;
3130
- align-items: center;
3131
- }
3132
- .wds-list-item-additional-info {
3133
- grid-area: info;
3134
- color: #768e9c;
3135
- color: var(--color-content-tertiary);
3136
- margin-top: calc(4px * -1);
3137
- margin-top: calc(var(--size-4) * -1);
3138
- }
3139
- .wds-list-item-control-wrapper {
3140
- grid-area: control;
3141
- align-content: center;
3142
- height: var(--wds-list-item-control-wrapper-height);
3143
- }
3144
- .wds-list-item-navigation .tw-icon-chevron-right {
3145
- color: #c9cbce;
3146
- color: var(--color-interactive-secondary);
3147
- }
3148
- .wds-list-item-control {
3149
- flex: 0 0 auto;
3150
- }
3151
- .wds-list-item.disabled {
3152
- filter: none;
3153
- opacity: 1;
3154
- }
3155
- .wds-list-item.disabled label {
3156
- cursor: not-allowed;
3157
- }
3158
- .wds-list-item.disabled .tw-icon-backslash-circle {
3159
- color: #768e9c;
3160
- color: var(--color-content-tertiary);
3161
- }
3162
- .wds-list-item-spotlight-active {
3163
- background-color: rgba(134,167,189,0.10196);
3164
- background-color: var(--color-background-neutral);
3165
- }
3166
- .wds-list-item-spotlight-active:not(.disabled):not(:disabled):hover {
3167
- background-color: var(--color-background-neutral-hover);
3168
- }
3169
- .wds-list-item-spotlight-active:not(.disabled):not(:disabled):active {
3170
- background-color: var(--color-background-neutral-active);
3171
- }
3172
- .wds-list-item-spotlight-inactive {
3173
- background-color: rgba(134, 167, 189, 0.025);
3174
- border: 1px dashed rgba(0,0,0,0.10196);
3175
- border: 1px dashed var(--color-border-neutral);
3176
- }
3177
- @supports (color: color-mix(in lch, red, blue)) {
3178
- .wds-list-item-spotlight-inactive {
3179
- background-color: color-mix(in srgb, var(--color-background-neutral) 25%, transparent);
3180
- }
3181
- }
3182
- .wds-list-item-spotlight-inactive:not(.disabled):not(:disabled):hover {
3183
- background-color: color-mix(in srgb, var(--color-background-neutral-hover) 25%, transparent);
3184
- }
3185
- .wds-list-item-spotlight-inactive:not(.disabled):not(:disabled):active {
3186
- background-color: color-mix(in srgb, var(--color-background-neutral-active) 25%, transparent);
3187
- }
3188
- .wds-list-item-prompt {
3189
- grid-area: prompt;
3190
- display: inline-flex;
3191
- justify-self: start;
3192
- text-align: left;
3193
- padding-top: calc(8px / 2);
3194
- padding-top: calc(var(--padding-x-small) / 2);
3195
- padding-bottom: calc(8px / 2);
3196
- padding-bottom: calc(var(--padding-x-small) / 2);
3197
- padding-left: calc(8px - 1px);
3198
- padding-left: calc(var(--padding-x-small) - 1px);
3199
- padding-right: 8px;
3200
- padding-right: var(--padding-x-small);
3201
- border-radius: 10px;
3202
- border-radius: var(--radius-small);
3203
- word-break: break-word;
3204
- word-wrap: break-word;
3205
- }
3206
- .wds-list-item-prompt:has(a),
3207
- .wds-list-item-prompt:has(button) {
3208
- position: relative;
3209
- z-index: 1;
3210
- }
3211
- .wds-list-item-prompt a,
3212
- .wds-list-item-prompt button {
3213
- text-underline-offset: calc(4px / 2);
3214
- text-underline-offset: calc(var(--size-4) / 2);
3215
- }
3216
- .wds-list-item-prompt a:first-of-type:before,
3217
- .wds-list-item-prompt button:first-of-type:before {
3218
- content: '';
3219
- position: absolute;
3220
- inset: 0;
3221
- }
3222
- .wds-list-item-prompt.np-prompt-icon {
3223
- padding-left: calc(8px - 1px);
3224
- padding-left: calc(var(--padding-x-small) - 1px);
3225
- padding-right: 8px;
3226
- padding-right: var(--padding-x-small);
3227
- display: inline-flex;
3228
- align-items: center;
3229
- gap: 4px;
3230
- gap: var(--size-4);
3231
- }
3232
- .wds-list-item-prompt .np-prompt-icon {
3233
- padding-right: calc(12px / 2);
3234
- padding-right: calc(var(--size-12) / 2);
3235
- padding-top: calc(4px - 1px);
3236
- padding-top: calc(var(--size-4) - 1px);
3237
- padding-bottom: calc(4px - 1px);
3238
- padding-bottom: calc(var(--size-4) - 1px);
3239
- }
3240
- .wds-list-item-prompt .np-prompt-icon .tw-icon-tags,
3241
- .wds-list-item-prompt .np-prompt-icon .tw-icon-confetti {
3242
- color: var(--color-sentiment-positive-primary);
3243
- }
3244
- .wds-list-item-prompt.negative {
3245
- background-color: var(--color-sentiment-negative-secondary);
3246
- color: var(--color-sentiment-negative-primary);
3247
- }
3248
- .wds-list-item-prompt.negative a,
3249
- .wds-list-item-prompt.negative button {
3250
- color: var(--color-sentiment-negative-primary);
3251
- }
3252
- .wds-list-item-prompt.negative a:hover,
3253
- .wds-list-item-prompt.negative button:hover {
3254
- color: var(--color-sentiment-negative-primary-hover);
3255
- }
3256
- .wds-list-item-prompt.negative a:active,
3257
- .wds-list-item-prompt.negative button:active {
3258
- color: var(--color-sentiment-negative-primary-active);
3259
- }
3260
- .wds-list-item-prompt.wds-list-item-prompt.negative:has(a, button):hover {
3261
- background-color: var(--color-sentiment-negative-secondary-hover);
3262
- }
3263
- .wds-list-item-prompt.wds-list-item-prompt.negative:has(a, button):active {
3264
- background-color: var(--color-sentiment-negative-secondary-active);
3265
- }
3266
- .wds-list-item-prompt.positive,
3267
- .wds-list-item-prompt.discount,
3268
- .wds-list-item-prompt.savings {
3269
- background-color: var(--color-sentiment-positive-secondary);
3270
- color: var(--color-sentiment-positive-primary);
3271
- }
3272
- .wds-list-item-prompt.positive a,
3273
- .wds-list-item-prompt.discount a,
3274
- .wds-list-item-prompt.savings a,
3275
- .wds-list-item-prompt.positive button,
3276
- .wds-list-item-prompt.discount button,
3277
- .wds-list-item-prompt.savings button {
3278
- color: var(--color-sentiment-positive-primary);
3279
- }
3280
- .wds-list-item-prompt.positive a:hover,
3281
- .wds-list-item-prompt.discount a:hover,
3282
- .wds-list-item-prompt.savings a:hover,
3283
- .wds-list-item-prompt.positive button:hover,
3284
- .wds-list-item-prompt.discount button:hover,
3285
- .wds-list-item-prompt.savings button:hover {
3286
- color: var(--color-sentiment-positive-primary-hover);
3287
- }
3288
- .wds-list-item-prompt.positive a:active,
3289
- .wds-list-item-prompt.discount a:active,
3290
- .wds-list-item-prompt.savings a:active,
3291
- .wds-list-item-prompt.positive button:active,
3292
- .wds-list-item-prompt.discount button:active,
3293
- .wds-list-item-prompt.savings button:active {
3294
- color: var(--color-sentiment-positive-primary-active);
3295
- }
3296
- .wds-list-item-prompt.wds-list-item-prompt.positive:has(a, button):hover,
3297
- .wds-list-item-prompt.wds-list-item-prompt.discount:has(a, button):hover,
3298
- .wds-list-item-prompt.wds-list-item-prompt.savings:has(a, button):hover {
3299
- background-color: var(--color-sentiment-positive-secondary-hover);
3300
- }
3301
- .wds-list-item-prompt.wds-list-item-prompt.positive:has(a, button):active,
3302
- .wds-list-item-prompt.wds-list-item-prompt.discount:has(a, button):active,
3303
- .wds-list-item-prompt.wds-list-item-prompt.savings:has(a, button):active {
3304
- background-color: var(--color-sentiment-positive-secondary-active);
3305
- }
3306
- .wds-list-item-prompt.neutral {
3307
- background-color: rgba(134,167,189,0.10196);
3308
- background-color: var(--color-background-neutral);
3309
- color: #37517e;
3310
- color: var(--color-content-primary);
3311
- }
3312
- .wds-list-item-prompt.neutral a,
3313
- .wds-list-item-prompt.neutral button {
3314
- color: #37517e;
3315
- color: var(--color-content-primary);
3316
- }
3317
- .wds-list-item-prompt.wds-list-item-prompt.neutral:has(a, button):hover {
3318
- background-color: var(--color-background-neutral-hover);
3319
- }
3320
- .wds-list-item-prompt.wds-list-item-prompt.neutral:has(a, button):active {
3321
- background-color: var(--color-background-neutral-active);
3322
- }
3323
- .wds-list-item-prompt.warning {
3324
- background-color: var(--color-sentiment-warning-secondary);
3325
- color: var(--color-sentiment-warning-content);
3326
- }
3327
- .wds-list-item-prompt.warning a,
3328
- .wds-list-item-prompt.warning button {
3329
- color: var(--color-sentiment-warning-content);
3330
- }
3331
- .wds-list-item-prompt.warning a:hover,
3332
- .wds-list-item-prompt.warning button:hover {
3333
- color: var(--color-sentiment-warning-content-hover);
3334
- }
3335
- .wds-list-item-prompt.warning a:active,
3336
- .wds-list-item-prompt.warning button:active {
3337
- color: var(--color-sentiment-warning-content-active);
3338
- }
3339
- .wds-list-item-prompt.wds-list-item-prompt.warning:has(a, button):hover {
3340
- background-color: color-mix(in srgb, var(--color-sentiment-warning-secondary) 92%, var(--color-sentiment-warning-primary));
3341
- }
3342
- .wds-list-item-prompt.wds-list-item-prompt.warning:has(a, button):active {
3343
- background-color: color-mix(in srgb, var(--color-sentiment-warning-secondary) 84%, var(--color-sentiment-warning-primary));
3344
- }
3345
2636
  .np-field-control {
3346
2637
  margin-top: 4px;
3347
2638
  margin-top: var(--size-4);