@salutejs/plasma-new-hope 0.325.0-canary.1954.15210668888.0 → 0.325.0-canary.1962.15244720089.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (280) hide show
  1. package/cjs/components/Note/Note.css +35 -6
  2. package/cjs/components/Note/Note.js +17 -3
  3. package/cjs/components/Note/Note.js.map +1 -1
  4. package/cjs/components/Note/Note.styles.js +25 -2
  5. package/cjs/components/Note/Note.styles.js.map +1 -1
  6. package/cjs/components/Note/{Note.styles_178qpj9.css → Note.styles_thpfhk.css} +2 -1
  7. package/cjs/components/Note/Note.tokens.js +9 -1
  8. package/cjs/components/Note/Note.tokens.js.map +1 -1
  9. package/cjs/components/PaginationDots/PaginationDot.js +59 -0
  10. package/cjs/components/PaginationDots/PaginationDot.js.map +1 -0
  11. package/cjs/components/PaginationDots/PaginationDot_baul9c.css +2 -0
  12. package/cjs/components/PaginationDots/PaginationDots.js +34 -0
  13. package/cjs/components/PaginationDots/PaginationDots.js.map +1 -0
  14. package/cjs/components/PaginationDots/PaginationDots_fm2ha5.css +2 -0
  15. package/cjs/components/PaginationDots/SmartPaginationDots.css +5 -0
  16. package/cjs/components/PaginationDots/SmartPaginationDots.js +47 -0
  17. package/cjs/components/PaginationDots/SmartPaginationDots.js.map +1 -0
  18. package/cjs/components/PaginationDots/usePaginationDots.js +40 -0
  19. package/cjs/components/PaginationDots/usePaginationDots.js.map +1 -0
  20. package/cjs/index.css +14 -12
  21. package/cjs/index.js +6 -8
  22. package/cjs/index.js.map +1 -1
  23. package/emotion/cjs/components/Note/Note.js +17 -3
  24. package/emotion/cjs/components/Note/Note.styles.js +27 -15
  25. package/emotion/cjs/components/Note/Note.tokens.js +9 -1
  26. package/emotion/cjs/components/PaginationDots/PaginationDot.js +35 -0
  27. package/emotion/cjs/components/PaginationDots/PaginationDots.js +35 -0
  28. package/emotion/cjs/components/PaginationDots/SmartPaginationDots.js +43 -0
  29. package/emotion/cjs/components/PaginationDots/index.js +26 -0
  30. package/emotion/cjs/components/PaginationDots/usePaginationDots.js +38 -0
  31. package/emotion/cjs/examples/plasma_b2c/components/Note/Note.config.js +9 -9
  32. package/emotion/cjs/examples/plasma_b2c/components/Note/Note.stories.tsx +1 -0
  33. package/emotion/cjs/examples/plasma_web/components/Note/Note.config.js +9 -9
  34. package/emotion/cjs/examples/plasma_web/components/Note/Note.stories.tsx +1 -0
  35. package/emotion/cjs/index.js +11 -11
  36. package/emotion/es/components/Note/Note.js +18 -4
  37. package/emotion/es/components/Note/Note.styles.js +26 -14
  38. package/emotion/es/components/Note/Note.tokens.js +9 -1
  39. package/emotion/es/components/PaginationDots/PaginationDot.js +28 -0
  40. package/emotion/es/components/PaginationDots/PaginationDots.js +28 -0
  41. package/emotion/es/components/PaginationDots/SmartPaginationDots.js +36 -0
  42. package/emotion/es/components/PaginationDots/index.js +3 -0
  43. package/emotion/es/components/PaginationDots/usePaginationDots.js +32 -0
  44. package/emotion/es/examples/plasma_b2c/components/Note/Note.config.js +9 -9
  45. package/emotion/es/examples/plasma_b2c/components/Note/Note.stories.tsx +1 -0
  46. package/emotion/es/examples/plasma_web/components/Note/Note.config.js +9 -9
  47. package/emotion/es/examples/plasma_web/components/Note/Note.stories.tsx +1 -0
  48. package/emotion/es/index.js +1 -2
  49. package/es/components/Note/Note.css +35 -6
  50. package/es/components/Note/Note.js +18 -4
  51. package/es/components/Note/Note.js.map +1 -1
  52. package/es/components/Note/Note.styles.js +25 -3
  53. package/es/components/Note/Note.styles.js.map +1 -1
  54. package/es/components/Note/{Note.styles_178qpj9.css → Note.styles_thpfhk.css} +2 -1
  55. package/es/components/Note/Note.tokens.js +9 -1
  56. package/es/components/Note/Note.tokens.js.map +1 -1
  57. package/es/components/PaginationDots/PaginationDot.js +54 -0
  58. package/es/components/PaginationDots/PaginationDot.js.map +1 -0
  59. package/es/components/PaginationDots/PaginationDot_baul9c.css +2 -0
  60. package/es/components/PaginationDots/PaginationDots.js +29 -0
  61. package/es/components/PaginationDots/PaginationDots.js.map +1 -0
  62. package/es/components/PaginationDots/PaginationDots_fm2ha5.css +2 -0
  63. package/es/components/PaginationDots/SmartPaginationDots.css +5 -0
  64. package/es/components/PaginationDots/SmartPaginationDots.js +39 -0
  65. package/es/components/PaginationDots/SmartPaginationDots.js.map +1 -0
  66. package/es/components/PaginationDots/usePaginationDots.js +36 -0
  67. package/es/components/PaginationDots/usePaginationDots.js.map +1 -0
  68. package/es/index.css +14 -12
  69. package/es/index.js +3 -3
  70. package/package.json +2 -2
  71. package/styled-components/cjs/components/Note/Note.js +17 -3
  72. package/styled-components/cjs/components/Note/Note.styles.js +14 -3
  73. package/styled-components/cjs/components/Note/Note.tokens.js +9 -1
  74. package/styled-components/cjs/components/PaginationDots/PaginationDot.js +33 -0
  75. package/styled-components/cjs/components/PaginationDots/PaginationDots.js +24 -0
  76. package/styled-components/cjs/components/PaginationDots/SmartPaginationDots.js +43 -0
  77. package/styled-components/cjs/components/PaginationDots/index.js +26 -0
  78. package/styled-components/cjs/components/PaginationDots/usePaginationDots.js +38 -0
  79. package/styled-components/cjs/examples/plasma_b2c/components/Note/Note.config.js +4 -4
  80. package/styled-components/cjs/examples/plasma_b2c/components/Note/Note.stories.tsx +1 -0
  81. package/styled-components/cjs/examples/plasma_web/components/Note/Note.config.js +4 -4
  82. package/styled-components/cjs/examples/plasma_web/components/Note/Note.stories.tsx +1 -0
  83. package/styled-components/cjs/index.js +11 -11
  84. package/styled-components/es/components/Note/Note.js +18 -4
  85. package/styled-components/es/components/Note/Note.styles.js +13 -2
  86. package/styled-components/es/components/Note/Note.tokens.js +9 -1
  87. package/styled-components/es/components/PaginationDots/PaginationDot.js +26 -0
  88. package/styled-components/es/components/PaginationDots/PaginationDots.js +18 -0
  89. package/styled-components/es/components/PaginationDots/SmartPaginationDots.js +36 -0
  90. package/styled-components/es/components/PaginationDots/index.js +3 -0
  91. package/styled-components/es/components/PaginationDots/usePaginationDots.js +32 -0
  92. package/styled-components/es/examples/plasma_b2c/components/Note/Note.config.js +4 -4
  93. package/styled-components/es/examples/plasma_b2c/components/Note/Note.stories.tsx +1 -0
  94. package/styled-components/es/examples/plasma_web/components/Note/Note.config.js +4 -4
  95. package/styled-components/es/examples/plasma_web/components/Note/Note.stories.tsx +1 -0
  96. package/styled-components/es/index.js +1 -2
  97. package/types/components/Note/Note.d.ts +4 -0
  98. package/types/components/Note/Note.d.ts.map +1 -1
  99. package/types/components/Note/Note.styles.d.ts +46 -1
  100. package/types/components/Note/Note.styles.d.ts.map +1 -1
  101. package/types/components/Note/Note.tokens.d.ts +8 -0
  102. package/types/components/Note/Note.tokens.d.ts.map +1 -1
  103. package/types/components/Note/Note.types.d.ts +8 -0
  104. package/types/components/Note/Note.types.d.ts.map +1 -1
  105. package/types/components/PaginationDots/PaginationDot.d.ts +21 -0
  106. package/types/components/PaginationDots/PaginationDot.d.ts.map +1 -0
  107. package/types/components/PaginationDots/PaginationDots.d.ts +15 -0
  108. package/types/components/PaginationDots/PaginationDots.d.ts.map +1 -0
  109. package/types/components/PaginationDots/SmartPaginationDots.d.ts +15 -0
  110. package/types/components/PaginationDots/SmartPaginationDots.d.ts.map +1 -0
  111. package/types/components/PaginationDots/index.d.ts +6 -0
  112. package/types/components/PaginationDots/index.d.ts.map +1 -0
  113. package/types/components/PaginationDots/usePaginationDots.d.ts +14 -0
  114. package/types/components/PaginationDots/usePaginationDots.d.ts.map +1 -0
  115. package/types/index.d.ts +1 -2
  116. package/types/index.d.ts.map +1 -1
  117. package/cjs/components/List/List.css +0 -1
  118. package/cjs/components/List/List.js +0 -63
  119. package/cjs/components/List/List.js.map +0 -1
  120. package/cjs/components/List/List.styles.js +0 -9
  121. package/cjs/components/List/List.styles.js.map +0 -1
  122. package/cjs/components/List/List.styles_9yg2yl.css +0 -1
  123. package/cjs/components/List/List.tokens.js +0 -41
  124. package/cjs/components/List/List.tokens.js.map +0 -1
  125. package/cjs/components/List/ui/ListItem.css +0 -18
  126. package/cjs/components/List/ui/ListItem.js +0 -27
  127. package/cjs/components/List/ui/ListItem.js.map +0 -1
  128. package/cjs/components/List/ui/ListItem.styles.js +0 -28
  129. package/cjs/components/List/ui/ListItem.styles.js.map +0 -1
  130. package/cjs/components/List/ui/ListItem.styles_1eo5k14.css +0 -2
  131. package/cjs/components/List/variations/_disabled/base.js +0 -9
  132. package/cjs/components/List/variations/_disabled/base.js.map +0 -1
  133. package/cjs/components/List/variations/_disabled/base_x642ct.css +0 -1
  134. package/cjs/components/List/variations/_size/base.js +0 -9
  135. package/cjs/components/List/variations/_size/base.js.map +0 -1
  136. package/cjs/components/List/variations/_size/base_x642ct.css +0 -1
  137. package/cjs/components/List/variations/_variant/base.js +0 -9
  138. package/cjs/components/List/variations/_variant/base.js.map +0 -1
  139. package/cjs/components/List/variations/_variant/base_x642ct.css +0 -1
  140. package/cjs/components/List/variations/_view/base.js +0 -9
  141. package/cjs/components/List/variations/_view/base.js.map +0 -1
  142. package/cjs/components/List/variations/_view/base_x642ct.css +0 -1
  143. package/emotion/cjs/components/List/List.js +0 -59
  144. package/emotion/cjs/components/List/List.styles.js +0 -9
  145. package/emotion/cjs/components/List/List.tokens.js +0 -39
  146. package/emotion/cjs/components/List/List.types.js +0 -5
  147. package/emotion/cjs/components/List/index.js +0 -38
  148. package/emotion/cjs/components/List/ui/ListItem.js +0 -24
  149. package/emotion/cjs/components/List/ui/ListItem.styles.js +0 -21
  150. package/emotion/cjs/components/List/ui/ListItem.types.js +0 -5
  151. package/emotion/cjs/components/List/variations/_disabled/base.js +0 -8
  152. package/emotion/cjs/components/List/variations/_disabled/tokens.json +0 -1
  153. package/emotion/cjs/components/List/variations/_size/base.js +0 -8
  154. package/emotion/cjs/components/List/variations/_size/tokens.json +0 -1
  155. package/emotion/cjs/components/List/variations/_variant/base.js +0 -8
  156. package/emotion/cjs/components/List/variations/_variant/tokens.json +0 -1
  157. package/emotion/cjs/components/List/variations/_view/base.js +0 -8
  158. package/emotion/cjs/components/List/variations/_view/tokens.json +0 -1
  159. package/emotion/cjs/examples/plasma_b2c/components/List/List.config.js +0 -34
  160. package/emotion/cjs/examples/plasma_b2c/components/List/List.js +0 -12
  161. package/emotion/cjs/examples/plasma_b2c/components/List/List.stories.tsx +0 -60
  162. package/emotion/cjs/examples/plasma_web/components/List/List.config.js +0 -34
  163. package/emotion/cjs/examples/plasma_web/components/List/List.js +0 -12
  164. package/emotion/cjs/examples/plasma_web/components/List/List.stories.tsx +0 -60
  165. package/emotion/es/components/List/List.js +0 -50
  166. package/emotion/es/components/List/List.styles.js +0 -3
  167. package/emotion/es/components/List/List.tokens.js +0 -33
  168. package/emotion/es/components/List/List.types.js +0 -1
  169. package/emotion/es/components/List/index.js +0 -3
  170. package/emotion/es/components/List/ui/ListItem.js +0 -17
  171. package/emotion/es/components/List/ui/ListItem.styles.js +0 -14
  172. package/emotion/es/components/List/ui/ListItem.types.js +0 -1
  173. package/emotion/es/components/List/variations/_disabled/base.js +0 -2
  174. package/emotion/es/components/List/variations/_disabled/tokens.json +0 -1
  175. package/emotion/es/components/List/variations/_size/base.js +0 -2
  176. package/emotion/es/components/List/variations/_size/tokens.json +0 -1
  177. package/emotion/es/components/List/variations/_variant/base.js +0 -2
  178. package/emotion/es/components/List/variations/_variant/tokens.json +0 -1
  179. package/emotion/es/components/List/variations/_view/base.js +0 -2
  180. package/emotion/es/components/List/variations/_view/tokens.json +0 -1
  181. package/emotion/es/examples/plasma_b2c/components/List/List.config.js +0 -28
  182. package/emotion/es/examples/plasma_b2c/components/List/List.js +0 -6
  183. package/emotion/es/examples/plasma_b2c/components/List/List.stories.tsx +0 -60
  184. package/emotion/es/examples/plasma_web/components/List/List.config.js +0 -28
  185. package/emotion/es/examples/plasma_web/components/List/List.js +0 -6
  186. package/emotion/es/examples/plasma_web/components/List/List.stories.tsx +0 -60
  187. package/es/components/List/List.css +0 -1
  188. package/es/components/List/List.js +0 -54
  189. package/es/components/List/List.js.map +0 -1
  190. package/es/components/List/List.styles.js +0 -5
  191. package/es/components/List/List.styles.js.map +0 -1
  192. package/es/components/List/List.styles_9yg2yl.css +0 -1
  193. package/es/components/List/List.tokens.js +0 -36
  194. package/es/components/List/List.tokens.js.map +0 -1
  195. package/es/components/List/ui/ListItem.css +0 -18
  196. package/es/components/List/ui/ListItem.js +0 -19
  197. package/es/components/List/ui/ListItem.js.map +0 -1
  198. package/es/components/List/ui/ListItem.styles.js +0 -23
  199. package/es/components/List/ui/ListItem.styles.js.map +0 -1
  200. package/es/components/List/ui/ListItem.styles_1eo5k14.css +0 -2
  201. package/es/components/List/variations/_disabled/base.js +0 -5
  202. package/es/components/List/variations/_disabled/base.js.map +0 -1
  203. package/es/components/List/variations/_disabled/base_x642ct.css +0 -1
  204. package/es/components/List/variations/_size/base.js +0 -5
  205. package/es/components/List/variations/_size/base.js.map +0 -1
  206. package/es/components/List/variations/_size/base_x642ct.css +0 -1
  207. package/es/components/List/variations/_variant/base.js +0 -5
  208. package/es/components/List/variations/_variant/base.js.map +0 -1
  209. package/es/components/List/variations/_variant/base_x642ct.css +0 -1
  210. package/es/components/List/variations/_view/base.js +0 -5
  211. package/es/components/List/variations/_view/base.js.map +0 -1
  212. package/es/components/List/variations/_view/base_x642ct.css +0 -1
  213. package/styled-components/cjs/components/List/List.js +0 -59
  214. package/styled-components/cjs/components/List/List.styles.js +0 -9
  215. package/styled-components/cjs/components/List/List.tokens.js +0 -39
  216. package/styled-components/cjs/components/List/List.types.js +0 -5
  217. package/styled-components/cjs/components/List/index.js +0 -38
  218. package/styled-components/cjs/components/List/ui/ListItem.js +0 -24
  219. package/styled-components/cjs/components/List/ui/ListItem.styles.js +0 -19
  220. package/styled-components/cjs/components/List/ui/ListItem.types.js +0 -5
  221. package/styled-components/cjs/components/List/variations/_disabled/base.js +0 -8
  222. package/styled-components/cjs/components/List/variations/_disabled/tokens.json +0 -1
  223. package/styled-components/cjs/components/List/variations/_size/base.js +0 -8
  224. package/styled-components/cjs/components/List/variations/_size/tokens.json +0 -1
  225. package/styled-components/cjs/components/List/variations/_variant/base.js +0 -8
  226. package/styled-components/cjs/components/List/variations/_variant/tokens.json +0 -1
  227. package/styled-components/cjs/components/List/variations/_view/base.js +0 -8
  228. package/styled-components/cjs/components/List/variations/_view/tokens.json +0 -1
  229. package/styled-components/cjs/examples/plasma_b2c/components/List/List.config.js +0 -34
  230. package/styled-components/cjs/examples/plasma_b2c/components/List/List.js +0 -12
  231. package/styled-components/cjs/examples/plasma_b2c/components/List/List.stories.tsx +0 -60
  232. package/styled-components/cjs/examples/plasma_web/components/List/List.config.js +0 -34
  233. package/styled-components/cjs/examples/plasma_web/components/List/List.js +0 -12
  234. package/styled-components/cjs/examples/plasma_web/components/List/List.stories.tsx +0 -60
  235. package/styled-components/es/components/List/List.js +0 -50
  236. package/styled-components/es/components/List/List.styles.js +0 -3
  237. package/styled-components/es/components/List/List.tokens.js +0 -33
  238. package/styled-components/es/components/List/List.types.js +0 -1
  239. package/styled-components/es/components/List/index.js +0 -3
  240. package/styled-components/es/components/List/ui/ListItem.js +0 -17
  241. package/styled-components/es/components/List/ui/ListItem.styles.js +0 -12
  242. package/styled-components/es/components/List/ui/ListItem.types.js +0 -1
  243. package/styled-components/es/components/List/variations/_disabled/base.js +0 -2
  244. package/styled-components/es/components/List/variations/_disabled/tokens.json +0 -1
  245. package/styled-components/es/components/List/variations/_size/base.js +0 -2
  246. package/styled-components/es/components/List/variations/_size/tokens.json +0 -1
  247. package/styled-components/es/components/List/variations/_variant/base.js +0 -2
  248. package/styled-components/es/components/List/variations/_variant/tokens.json +0 -1
  249. package/styled-components/es/components/List/variations/_view/base.js +0 -2
  250. package/styled-components/es/components/List/variations/_view/tokens.json +0 -1
  251. package/styled-components/es/examples/plasma_b2c/components/List/List.config.js +0 -28
  252. package/styled-components/es/examples/plasma_b2c/components/List/List.js +0 -6
  253. package/styled-components/es/examples/plasma_b2c/components/List/List.stories.tsx +0 -60
  254. package/styled-components/es/examples/plasma_web/components/List/List.config.js +0 -28
  255. package/styled-components/es/examples/plasma_web/components/List/List.js +0 -6
  256. package/styled-components/es/examples/plasma_web/components/List/List.stories.tsx +0 -60
  257. package/types/components/List/List.d.ts +0 -43
  258. package/types/components/List/List.d.ts.map +0 -1
  259. package/types/components/List/List.styles.d.ts +0 -2
  260. package/types/components/List/List.styles.d.ts.map +0 -1
  261. package/types/components/List/List.tokens.d.ts +0 -34
  262. package/types/components/List/List.tokens.d.ts.map +0 -1
  263. package/types/components/List/List.types.d.ts +0 -24
  264. package/types/components/List/List.types.d.ts.map +0 -1
  265. package/types/components/List/index.d.ts +0 -5
  266. package/types/components/List/index.d.ts.map +0 -1
  267. package/types/components/List/ui/ListItem.d.ts +0 -4
  268. package/types/components/List/ui/ListItem.d.ts.map +0 -1
  269. package/types/components/List/ui/ListItem.styles.d.ts +0 -36
  270. package/types/components/List/ui/ListItem.styles.d.ts.map +0 -1
  271. package/types/components/List/ui/ListItem.types.d.ts +0 -15
  272. package/types/components/List/ui/ListItem.types.d.ts.map +0 -1
  273. package/types/components/List/variations/_disabled/base.d.ts +0 -2
  274. package/types/components/List/variations/_disabled/base.d.ts.map +0 -1
  275. package/types/components/List/variations/_size/base.d.ts +0 -2
  276. package/types/components/List/variations/_size/base.d.ts.map +0 -1
  277. package/types/components/List/variations/_variant/base.d.ts +0 -2
  278. package/types/components/List/variations/_variant/base.d.ts.map +0 -1
  279. package/types/components/List/variations/_view/base.d.ts +0 -2
  280. package/types/components/List/variations/_view/base.d.ts.map +0 -1
@@ -1,59 +0,0 @@
1
- "use strict";
2
-
3
- function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.listRoot = exports.listConfig = void 0;
8
- var _react = /*#__PURE__*/_interopRequireWildcard(/*#__PURE__*/require("react"));
9
- var _utils = /*#__PURE__*/require("../../utils");
10
- var _List = /*#__PURE__*/require("./List.styles");
11
- var _List2 = /*#__PURE__*/require("./List.tokens");
12
- var _base = /*#__PURE__*/require("./variations/_variant/base");
13
- var _base2 = /*#__PURE__*/require("./variations/_view/base");
14
- var _base3 = /*#__PURE__*/require("./variations/_size/base");
15
- var _base4 = /*#__PURE__*/require("./variations/_disabled/base");
16
- function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
17
- function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
18
- var listRoot = exports.listRoot = function listRoot(Root) {
19
- return /*#__PURE__*/(0, _react.forwardRef)(function (_ref, outerRootRef) {
20
- var size = _ref.size,
21
- view = _ref.view,
22
- variant = _ref.variant,
23
- disabled = _ref.disabled,
24
- className = _ref.className,
25
- children = _ref.children;
26
- return /*#__PURE__*/_react["default"].createElement(Root, {
27
- ref: outerRootRef,
28
- size: size,
29
- view: view,
30
- variant: variant,
31
- disabled: disabled,
32
- className: (0, _utils.cx)(_List2.classes.listRoot, className)
33
- }, children);
34
- });
35
- };
36
- var listConfig = exports.listConfig = {
37
- name: 'List',
38
- tag: 'ul',
39
- layout: listRoot,
40
- base: _List.base,
41
- variations: {
42
- view: {
43
- css: _base2.base
44
- },
45
- size: {
46
- css: _base3.base
47
- },
48
- variant: {
49
- css: _base.base
50
- },
51
- disabled: {
52
- css: _base4.base
53
- }
54
- },
55
- defaults: {
56
- view: 'default',
57
- size: 'm'
58
- }
59
- };
@@ -1,9 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.base = void 0;
7
- var _styledComponents = /*#__PURE__*/require("styled-components");
8
- var _List = /*#__PURE__*/require("./List.tokens");
9
- var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["display:flex;flex-direction:column;gap:var(", ");align-items:stretch;height:auto;width:100%;list-style-type:none;padding:0;margin:0;"], _List.tokens.listGap);
@@ -1,39 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.tokens = exports.classes = void 0;
7
- var classes = exports.classes = {
8
- listRoot: 'list-root',
9
- listItem: 'list-item',
10
- filledStretching: 'list-stretching-filled',
11
- fixedStretching: 'list-stretching-fixed'
12
- };
13
- var tokens = exports.tokens = {
14
- listGap: '--plasma-list-gap',
15
- listWidth: '--plasma-list-width',
16
- listItemBackground: '--plasma-list-item-background',
17
- listItemBackgroundHover: '--plasma-list-item-background-hover',
18
- listItemBorderRadius: '--plasma-list-item-border-radius',
19
- listItemPaddingLeft: '--plasma-list-item-padding-left',
20
- listItemPaddingRight: '--plasma-list-item-padding-right',
21
- listItemPaddingTop: '--plasma-list-item-padding-top',
22
- listItemPaddingBottom: '--plasma-list-item-padding-bottom',
23
- listItemBorderColor: '--plasma-list-item-border-color',
24
- listItemBorderColorHover: '--plasma-list-item-border-color-hover',
25
- listItemBorderWidth: '--plasma-list-item-border-width',
26
- listItemIconLeftColor: '--plasma-list-item-color-icon-left',
27
- listItemIconRightColor: '--plasma-list-item-color-icon-right',
28
- listItemGap: '--plasma-list-item-gap',
29
- listItemVariantDifference: '--plasma-list-item-variant-difference',
30
- listItemColor: '--plasma-list-item-color',
31
- listItemColorHover: '--plasma-list-item-color-hover',
32
- listItemFontFamily: '--plasma-list-item-font-family',
33
- listItemFontSize: '--plasma-list-item-font-size',
34
- listItemFontStyle: '--plasma-list-item-font-style',
35
- listItemFontWeight: '--plasma-list-item-font-weight',
36
- listItemLetterSpacing: '--plasma-list-item-letter-spacing',
37
- listItemLineHeight: '--plasma-list-item-line-height',
38
- listDisabledOpacity: '--plasma-list-disabled-opacity'
39
- };
@@ -1,5 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
@@ -1,38 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- Object.defineProperty(exports, "ListItem", {
7
- enumerable: true,
8
- get: function get() {
9
- return _ListItem.ListItem;
10
- }
11
- });
12
- Object.defineProperty(exports, "listClasses", {
13
- enumerable: true,
14
- get: function get() {
15
- return _List2.classes;
16
- }
17
- });
18
- Object.defineProperty(exports, "listConfig", {
19
- enumerable: true,
20
- get: function get() {
21
- return _List.listConfig;
22
- }
23
- });
24
- Object.defineProperty(exports, "listRoot", {
25
- enumerable: true,
26
- get: function get() {
27
- return _List.listRoot;
28
- }
29
- });
30
- Object.defineProperty(exports, "listTokens", {
31
- enumerable: true,
32
- get: function get() {
33
- return _List2.tokens;
34
- }
35
- });
36
- var _List = /*#__PURE__*/require("./List");
37
- var _ListItem = /*#__PURE__*/require("./ui/ListItem");
38
- var _List2 = /*#__PURE__*/require("./List.tokens");
@@ -1,24 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.ListItem = void 0;
7
- var _react = /*#__PURE__*/_interopRequireDefault(/*#__PURE__*/require("react"));
8
- var _ListItem = /*#__PURE__*/require("./ListItem.styles");
9
- var _excluded = ["children", "contentRight", "disabled"];
10
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
11
- function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
12
- function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
13
- function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
14
- var ListItem = exports.ListItem = function ListItem(_ref) {
15
- var children = _ref.children,
16
- contentRight = _ref.contentRight,
17
- disabled = _ref.disabled,
18
- rest = _objectWithoutProperties(_ref, _excluded);
19
- return /*#__PURE__*/_react["default"].createElement(_ListItem.StyledListItem, _extends({
20
- disabled: disabled
21
- }, rest), /*#__PURE__*/_react["default"].createElement(_ListItem.CellItem, {
22
- contentRight: contentRight
23
- }, children));
24
- };
@@ -1,19 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.StyledListItem = exports.CellItem = void 0;
7
- var _styledComponents = /*#__PURE__*/_interopRequireDefault(/*#__PURE__*/require("styled-components"));
8
- var _List = /*#__PURE__*/require("../List.tokens");
9
- var _Cell = /*#__PURE__*/require("../../Cell");
10
- var _engines = /*#__PURE__*/require("../../../engines");
11
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
12
- var mergedCellConfig = /*#__PURE__*/(0, _engines.mergeConfig)(_Cell.cellConfig);
13
- var Cell = /*#__PURE__*/(0, _engines.component)(mergedCellConfig);
14
- var CellItem = exports.CellItem = /*#__PURE__*/(0, _styledComponents["default"])(Cell).withConfig({
15
- componentId: "plasma-new-hope__sc-1roh0z4-0"
16
- })(["", ":100%;", ":0rem;", ":0rem;", ":0rem;", ":0rem;", ":0rem;", ":var(", ");", ":var(", ");", ":transparent;"], _Cell.cellTokens.cellWidth, _Cell.cellTokens.cellPadding, _Cell.cellTokens.cellPaddingLeftContent, _Cell.cellTokens.cellPaddingContent, _Cell.cellTokens.cellPaddingRightContent, _Cell.cellTokens.cellTextboxGap, _Cell.cellTokens.cellGap, _List.tokens.listItemGap, _Cell.cellTokens.cellColor, _List.tokens.listItemColor, _Cell.cellTokens.cellBackgroundColor);
17
- var StyledListItem = exports.StyledListItem = /*#__PURE__*/_styledComponents["default"].li.withConfig({
18
- componentId: "plasma-new-hope__sc-1roh0z4-1"
19
- })(["padding:calc(var(", ") - var(", ")) var(", ") calc(var(", ") - var(", ")) var(", ");border-radius:var(", ");background:var(", ");border:var(", ") solid var(", ");box-sizing:border-box;display:flex;justify-content:space-between;align-items:center;color:var(", ");font-size:var(", ");font-weight:var(", ");font-family:var(", ");font-style:var(", ");line-height:var(", ");letter-spacing:var(", ");&:hover{background:var(", ");border-color:var(", ");color:var(", ");}&[disabled]{cursor:not-allowed;opacity:var(", ");}"], _List.tokens.listItemPaddingTop, _List.tokens.listItemVariantDifference, _List.tokens.listItemPaddingRight, _List.tokens.listItemPaddingBottom, _List.tokens.listItemVariantDifference, _List.tokens.listItemPaddingLeft, _List.tokens.listItemBorderRadius, _List.tokens.listItemBackground, _List.tokens.listItemBorderWidth, _List.tokens.listItemBorderColor, _List.tokens.listItemColor, _List.tokens.listItemFontSize, _List.tokens.listItemFontWeight, _List.tokens.listItemFontFamily, _List.tokens.listItemFontStyle, _List.tokens.listItemLineHeight, _List.tokens.listItemLetterSpacing, _List.tokens.listItemBackgroundHover, _List.tokens.listItemBorderColorHover, _List.tokens.listItemColorHover, _List.tokens.listDisabledOpacity);
@@ -1,5 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
@@ -1,8 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.base = void 0;
7
- var _styledComponents = /*#__PURE__*/require("styled-components");
8
- var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)([""]);
@@ -1,8 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.base = void 0;
7
- var _styledComponents = /*#__PURE__*/require("styled-components");
8
- var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)([""]);
@@ -1,8 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.base = void 0;
7
- var _styledComponents = /*#__PURE__*/require("styled-components");
8
- var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)([""]);
@@ -1,8 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.base = void 0;
7
- var _styledComponents = /*#__PURE__*/require("styled-components");
8
- var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)([""]);
@@ -1,34 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.config = void 0;
7
- var _styledComponents = /*#__PURE__*/require("styled-components");
8
- var _List = /*#__PURE__*/require("../../../../components/List");
9
- var config = exports.config = {
10
- defaults: {
11
- view: 'default',
12
- size: 's',
13
- variant: 'normal'
14
- },
15
- variations: {
16
- view: {
17
- "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-primary);", ":transparent;", ":var(--surface-transparent-secondary);", ":transparent;", ":transparent;"], _List.listTokens.listItemColor, _List.listTokens.listItemColorHover, _List.listTokens.listItemBackground, _List.listTokens.listItemBackgroundHover, _List.listTokens.listItemBorderColor, _List.listTokens.listItemBorderColorHover)
18
- },
19
- size: {
20
- xs: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.5rem;", ":0.5rem;", ":0.5rem;", ":0.5rem;", ":0.5rem;", ":0rem;", ":0.375rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);"], _List.listTokens.listItemPaddingTop, _List.listTokens.listItemPaddingLeft, _List.listTokens.listItemPaddingRight, _List.listTokens.listItemPaddingBottom, _List.listTokens.listItemBorderRadius, _List.listTokens.listItemBorderWidth, _List.listTokens.listItemGap, _List.listTokens.listItemFontFamily, _List.listTokens.listItemFontSize, _List.listTokens.listItemFontStyle, _List.listTokens.listItemFontWeight, _List.listTokens.listItemLetterSpacing, _List.listTokens.listItemLineHeight),
21
- s: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.689rem;", ":0.75rem;", ":0.75rem;", ":0.689rem;", ":0.625rem;", ":0rem;", ":0.375rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);"], _List.listTokens.listItemPaddingTop, _List.listTokens.listItemPaddingLeft, _List.listTokens.listItemPaddingRight, _List.listTokens.listItemPaddingBottom, _List.listTokens.listItemBorderRadius, _List.listTokens.listItemBorderWidth, _List.listTokens.listItemGap, _List.listTokens.listItemFontFamily, _List.listTokens.listItemFontSize, _List.listTokens.listItemFontStyle, _List.listTokens.listItemFontWeight, _List.listTokens.listItemLetterSpacing, _List.listTokens.listItemLineHeight),
22
- m: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.75rem;", ":0.875rem;", ":0.875rem;", ":0.75rem;", ":0.75rem;", ":0rem;", ":0.5rem;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);"], _List.listTokens.listItemPaddingTop, _List.listTokens.listItemPaddingLeft, _List.listTokens.listItemPaddingRight, _List.listTokens.listItemPaddingBottom, _List.listTokens.listItemBorderRadius, _List.listTokens.listItemBorderWidth, _List.listTokens.listItemGap, _List.listTokens.listItemFontFamily, _List.listTokens.listItemFontSize, _List.listTokens.listItemFontStyle, _List.listTokens.listItemFontWeight, _List.listTokens.listItemLetterSpacing, _List.listTokens.listItemLineHeight),
23
- l: /*#__PURE__*/(0, _styledComponents.css)(["", ":1rem;", ":1rem;", ":1rem;", ":1rem;", ":0.875rem;", ":0rem;", ":0.5rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);"], _List.listTokens.listItemPaddingTop, _List.listTokens.listItemPaddingLeft, _List.listTokens.listItemPaddingRight, _List.listTokens.listItemPaddingBottom, _List.listTokens.listItemBorderRadius, _List.listTokens.listItemBorderWidth, _List.listTokens.listItemGap, _List.listTokens.listItemFontFamily, _List.listTokens.listItemFontSize, _List.listTokens.listItemFontStyle, _List.listTokens.listItemFontWeight, _List.listTokens.listItemLetterSpacing, _List.listTokens.listItemLineHeight),
24
- xl: /*#__PURE__*/(0, _styledComponents.css)(["", ":1.3125rem;", ":1.125rem;", ":1.125rem;", ":1.3125rem;", ":1rem;", ":0rem;", ":0.5rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);"], _List.listTokens.listItemPaddingTop, _List.listTokens.listItemPaddingLeft, _List.listTokens.listItemPaddingRight, _List.listTokens.listItemPaddingBottom, _List.listTokens.listItemBorderRadius, _List.listTokens.listItemBorderWidth, _List.listTokens.listItemGap, _List.listTokens.listItemFontFamily, _List.listTokens.listItemFontSize, _List.listTokens.listItemFontStyle, _List.listTokens.listItemFontWeight, _List.listTokens.listItemLetterSpacing, _List.listTokens.listItemLineHeight)
25
- },
26
- variant: {
27
- normal: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.4;", ":0rem;"], _List.listTokens.listDisabledOpacity, _List.listTokens.listItemVariantDifference),
28
- tight: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.25rem;", ":0.4;"], _List.listTokens.listItemVariantDifference, _List.listTokens.listDisabledOpacity)
29
- },
30
- disabled: {
31
- "true": /*#__PURE__*/(0, _styledComponents.css)(["", ":red;"], _List.listTokens.listItemBackground)
32
- }
33
- }
34
- };
@@ -1,12 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.ListItem = exports.List = void 0;
7
- var _List = /*#__PURE__*/require("../../../../components/List");
8
- var _engines = /*#__PURE__*/require("../../../../engines");
9
- var _List2 = /*#__PURE__*/require("./List.config");
10
- var mergedConfig = /*#__PURE__*/(0, _engines.mergeConfig)(_List.listConfig, _List2.config);
11
- var List = exports.List = /*#__PURE__*/(0, _engines.component)(mergedConfig);
12
- var ListItem = exports.ListItem = _List.ListItem;
@@ -1,60 +0,0 @@
1
- import React from 'react';
2
- import type { Meta } from '@storybook/react';
3
- import styled from 'styled-components';
4
-
5
- import { IconChevronLeft } from '../../../../components/_Icon';
6
- import { WithTheme } from '../../../_helpers';
7
-
8
- import { List, ListItem } from './List';
9
-
10
- const ChevronRight = styled(IconChevronLeft)`
11
- transform: rotate(180deg);
12
- `;
13
-
14
- const meta: Meta<typeof List> = {
15
- title: 'b2c/Data Display/List',
16
- component: List,
17
- decorators: [WithTheme],
18
- argTypes: {
19
- size: {
20
- options: ['xl', 'l', 'm', 's', 'xs'],
21
- control: {
22
- type: 'select',
23
- },
24
- },
25
- view: {
26
- options: ['default'],
27
- control: {
28
- type: 'select',
29
- },
30
- },
31
- variant: {
32
- options: ['normal', 'tight'],
33
- control: {
34
- type: 'select',
35
- },
36
- },
37
- },
38
- };
39
-
40
- export default meta;
41
-
42
- export const Default: Story = {
43
- args: {
44
- view: 'default',
45
- size: 'm',
46
- variant: 'normal',
47
- },
48
- render: ({ view, size, ...rest }: StoryProps) => {
49
- return (
50
- <List view={view} size={size} {...rest}>
51
- <ListItem contentRight={<ChevronRight color="inherit" size="xs" />}>Test Item 1</ListItem>
52
- <ListItem contentRight={<ChevronRight color="inherit" size="xs" />}>Test Item 2</ListItem>
53
- <ListItem contentRight={<ChevronRight color="inherit" size="xs" />} disabled>
54
- Test Item 3
55
- </ListItem>
56
- <ListItem contentRight={<ChevronRight color="inherit" size="xs" />}>Test Item 4</ListItem>
57
- </List>
58
- );
59
- },
60
- };
@@ -1,34 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.config = void 0;
7
- var _styledComponents = /*#__PURE__*/require("styled-components");
8
- var _List = /*#__PURE__*/require("../../../../components/List");
9
- var config = exports.config = {
10
- defaults: {
11
- view: 'default',
12
- size: 's',
13
- variant: 'normal'
14
- },
15
- variations: {
16
- view: {
17
- "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--text-primary);", ":transparent;", ":var(--surface-transparent-secondary);", ":transparent;", ":transparent;"], _List.listTokens.listItemColor, _List.listTokens.listItemColorHover, _List.listTokens.listItemBackground, _List.listTokens.listItemBackgroundHover, _List.listTokens.listItemBorderColor, _List.listTokens.listItemBorderColorHover)
18
- },
19
- size: {
20
- xs: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.5rem;", ":0.5rem;", ":0.5rem;", ":0.5rem;", ":0.5rem;", ":0rem;", ":0.375rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);"], _List.listTokens.listItemPaddingTop, _List.listTokens.listItemPaddingLeft, _List.listTokens.listItemPaddingRight, _List.listTokens.listItemPaddingBottom, _List.listTokens.listItemBorderRadius, _List.listTokens.listItemBorderWidth, _List.listTokens.listItemGap, _List.listTokens.listItemFontFamily, _List.listTokens.listItemFontSize, _List.listTokens.listItemFontStyle, _List.listTokens.listItemFontWeight, _List.listTokens.listItemLetterSpacing, _List.listTokens.listItemLineHeight),
21
- s: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.689rem;", ":0.75rem;", ":0.75rem;", ":0.689rem;", ":0.625rem;", ":0rem;", ":0.375rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);"], _List.listTokens.listItemPaddingTop, _List.listTokens.listItemPaddingLeft, _List.listTokens.listItemPaddingRight, _List.listTokens.listItemPaddingBottom, _List.listTokens.listItemBorderRadius, _List.listTokens.listItemBorderWidth, _List.listTokens.listItemGap, _List.listTokens.listItemFontFamily, _List.listTokens.listItemFontSize, _List.listTokens.listItemFontStyle, _List.listTokens.listItemFontWeight, _List.listTokens.listItemLetterSpacing, _List.listTokens.listItemLineHeight),
22
- m: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.75rem;", ":0.875rem;", ":0.875rem;", ":0.75rem;", ":0.75rem;", ":0rem;", ":0.5rem;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);"], _List.listTokens.listItemPaddingTop, _List.listTokens.listItemPaddingLeft, _List.listTokens.listItemPaddingRight, _List.listTokens.listItemPaddingBottom, _List.listTokens.listItemBorderRadius, _List.listTokens.listItemBorderWidth, _List.listTokens.listItemGap, _List.listTokens.listItemFontFamily, _List.listTokens.listItemFontSize, _List.listTokens.listItemFontStyle, _List.listTokens.listItemFontWeight, _List.listTokens.listItemLetterSpacing, _List.listTokens.listItemLineHeight),
23
- l: /*#__PURE__*/(0, _styledComponents.css)(["", ":1rem;", ":1rem;", ":1rem;", ":1rem;", ":0.875rem;", ":0rem;", ":0.5rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);"], _List.listTokens.listItemPaddingTop, _List.listTokens.listItemPaddingLeft, _List.listTokens.listItemPaddingRight, _List.listTokens.listItemPaddingBottom, _List.listTokens.listItemBorderRadius, _List.listTokens.listItemBorderWidth, _List.listTokens.listItemGap, _List.listTokens.listItemFontFamily, _List.listTokens.listItemFontSize, _List.listTokens.listItemFontStyle, _List.listTokens.listItemFontWeight, _List.listTokens.listItemLetterSpacing, _List.listTokens.listItemLineHeight),
24
- xl: /*#__PURE__*/(0, _styledComponents.css)(["", ":1.3125rem;", ":1.125rem;", ":1.125rem;", ":1.3125rem;", ":1rem;", ":0rem;", ":0.5rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);"], _List.listTokens.listItemPaddingTop, _List.listTokens.listItemPaddingLeft, _List.listTokens.listItemPaddingRight, _List.listTokens.listItemPaddingBottom, _List.listTokens.listItemBorderRadius, _List.listTokens.listItemBorderWidth, _List.listTokens.listItemGap, _List.listTokens.listItemFontFamily, _List.listTokens.listItemFontSize, _List.listTokens.listItemFontStyle, _List.listTokens.listItemFontWeight, _List.listTokens.listItemLetterSpacing, _List.listTokens.listItemLineHeight)
25
- },
26
- variant: {
27
- normal: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.4;", ":0rem;"], _List.listTokens.listDisabledOpacity, _List.listTokens.listItemVariantDifference),
28
- tight: /*#__PURE__*/(0, _styledComponents.css)(["", ":0.25rem;", ":0.4;"], _List.listTokens.listItemVariantDifference, _List.listTokens.listDisabledOpacity)
29
- },
30
- disabled: {
31
- "true": /*#__PURE__*/(0, _styledComponents.css)(["", ":red;"], _List.listTokens.listItemBackground)
32
- }
33
- }
34
- };
@@ -1,12 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.ListItem = exports.List = void 0;
7
- var _List = /*#__PURE__*/require("../../../../components/List");
8
- var _engines = /*#__PURE__*/require("../../../../engines");
9
- var _List2 = /*#__PURE__*/require("./List.config");
10
- var mergedConfig = /*#__PURE__*/(0, _engines.mergeConfig)(_List.listConfig, _List2.config);
11
- var List = exports.List = /*#__PURE__*/(0, _engines.component)(mergedConfig);
12
- var ListItem = exports.ListItem = _List.ListItem;
@@ -1,60 +0,0 @@
1
- import React from 'react';
2
- import type { Meta } from '@storybook/react';
3
- import styled from 'styled-components';
4
-
5
- import { IconChevronLeft } from '../../../../components/_Icon';
6
- import { WithTheme } from '../../../_helpers';
7
-
8
- import { List, ListItem } from './List';
9
-
10
- const ChevronRight = styled(IconChevronLeft)`
11
- transform: rotate(180deg);
12
- `;
13
-
14
- const meta: Meta<typeof List> = {
15
- title: 'web/Data Display/List',
16
- component: List,
17
- decorators: [WithTheme],
18
- argTypes: {
19
- size: {
20
- options: ['xl', 'l', 'm', 's', 'xs'],
21
- control: {
22
- type: 'select',
23
- },
24
- },
25
- view: {
26
- options: ['default'],
27
- control: {
28
- type: 'select',
29
- },
30
- },
31
- variant: {
32
- options: ['normal', 'tight'],
33
- control: {
34
- type: 'select',
35
- },
36
- },
37
- },
38
- };
39
-
40
- export default meta;
41
-
42
- export const Default: Story = {
43
- args: {
44
- view: 'default',
45
- size: 'm',
46
- variant: 'normal',
47
- },
48
- render: ({ view, size, ...rest }: StoryProps) => {
49
- return (
50
- <List view={view} size={size} {...rest}>
51
- <ListItem contentRight={<ChevronRight color="inherit" size="xs" />}>Test Item 1</ListItem>
52
- <ListItem contentRight={<ChevronRight color="inherit" size="xs" />}>Test Item 2</ListItem>
53
- <ListItem contentRight={<ChevronRight color="inherit" size="xs" />} disabled>
54
- Test Item 3
55
- </ListItem>
56
- <ListItem contentRight={<ChevronRight color="inherit" size="xs" />}>Test Item 4</ListItem>
57
- </List>
58
- );
59
- },
60
- };
@@ -1,50 +0,0 @@
1
- import React, { forwardRef } from 'react';
2
- import { cx } from "../../utils";
3
- import { base } from "./List.styles";
4
- import { classes } from "./List.tokens";
5
- import { base as variantCSS } from "./variations/_variant/base";
6
- import { base as viewCSS } from "./variations/_view/base";
7
- import { base as sizeCSS } from "./variations/_size/base";
8
- import { base as disabledCSS } from "./variations/_disabled/base";
9
- export var listRoot = function listRoot(Root) {
10
- return /*#__PURE__*/forwardRef(function (_ref, outerRootRef) {
11
- var size = _ref.size,
12
- view = _ref.view,
13
- variant = _ref.variant,
14
- disabled = _ref.disabled,
15
- className = _ref.className,
16
- children = _ref.children;
17
- return /*#__PURE__*/React.createElement(Root, {
18
- ref: outerRootRef,
19
- size: size,
20
- view: view,
21
- variant: variant,
22
- disabled: disabled,
23
- className: cx(classes.listRoot, className)
24
- }, children);
25
- });
26
- };
27
- export var listConfig = {
28
- name: 'List',
29
- tag: 'ul',
30
- layout: listRoot,
31
- base: base,
32
- variations: {
33
- view: {
34
- css: viewCSS
35
- },
36
- size: {
37
- css: sizeCSS
38
- },
39
- variant: {
40
- css: variantCSS
41
- },
42
- disabled: {
43
- css: disabledCSS
44
- }
45
- },
46
- defaults: {
47
- view: 'default',
48
- size: 'm'
49
- }
50
- };
@@ -1,3 +0,0 @@
1
- import { css } from 'styled-components';
2
- import { tokens } from "./List.tokens";
3
- export var base = /*#__PURE__*/css(["display:flex;flex-direction:column;gap:var(", ");align-items:stretch;height:auto;width:100%;list-style-type:none;padding:0;margin:0;"], tokens.listGap);
@@ -1,33 +0,0 @@
1
- export var classes = {
2
- listRoot: 'list-root',
3
- listItem: 'list-item',
4
- filledStretching: 'list-stretching-filled',
5
- fixedStretching: 'list-stretching-fixed'
6
- };
7
- export var tokens = {
8
- listGap: '--plasma-list-gap',
9
- listWidth: '--plasma-list-width',
10
- listItemBackground: '--plasma-list-item-background',
11
- listItemBackgroundHover: '--plasma-list-item-background-hover',
12
- listItemBorderRadius: '--plasma-list-item-border-radius',
13
- listItemPaddingLeft: '--plasma-list-item-padding-left',
14
- listItemPaddingRight: '--plasma-list-item-padding-right',
15
- listItemPaddingTop: '--plasma-list-item-padding-top',
16
- listItemPaddingBottom: '--plasma-list-item-padding-bottom',
17
- listItemBorderColor: '--plasma-list-item-border-color',
18
- listItemBorderColorHover: '--plasma-list-item-border-color-hover',
19
- listItemBorderWidth: '--plasma-list-item-border-width',
20
- listItemIconLeftColor: '--plasma-list-item-color-icon-left',
21
- listItemIconRightColor: '--plasma-list-item-color-icon-right',
22
- listItemGap: '--plasma-list-item-gap',
23
- listItemVariantDifference: '--plasma-list-item-variant-difference',
24
- listItemColor: '--plasma-list-item-color',
25
- listItemColorHover: '--plasma-list-item-color-hover',
26
- listItemFontFamily: '--plasma-list-item-font-family',
27
- listItemFontSize: '--plasma-list-item-font-size',
28
- listItemFontStyle: '--plasma-list-item-font-style',
29
- listItemFontWeight: '--plasma-list-item-font-weight',
30
- listItemLetterSpacing: '--plasma-list-item-letter-spacing',
31
- listItemLineHeight: '--plasma-list-item-line-height',
32
- listDisabledOpacity: '--plasma-list-disabled-opacity'
33
- };
@@ -1 +0,0 @@
1
- export {};
@@ -1,3 +0,0 @@
1
- export { listRoot, listConfig } from "./List";
2
- export { ListItem } from "./ui/ListItem";
3
- export { tokens as listTokens, classes as listClasses } from "./List.tokens";
@@ -1,17 +0,0 @@
1
- var _excluded = ["children", "contentRight", "disabled"];
2
- function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
3
- function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
4
- function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
5
- import React from 'react';
6
- import { StyledListItem, CellItem } from "./ListItem.styles";
7
- export var ListItem = function ListItem(_ref) {
8
- var children = _ref.children,
9
- contentRight = _ref.contentRight,
10
- disabled = _ref.disabled,
11
- rest = _objectWithoutProperties(_ref, _excluded);
12
- return /*#__PURE__*/React.createElement(StyledListItem, _extends({
13
- disabled: disabled
14
- }, rest), /*#__PURE__*/React.createElement(CellItem, {
15
- contentRight: contentRight
16
- }, children));
17
- };
@@ -1,12 +0,0 @@
1
- import styled from 'styled-components';
2
- import { tokens } from "../List.tokens";
3
- import { cellConfig, cellTokens } from "../../Cell";
4
- import { component, mergeConfig } from "../../../engines";
5
- var mergedCellConfig = /*#__PURE__*/mergeConfig(cellConfig);
6
- var Cell = /*#__PURE__*/component(mergedCellConfig);
7
- export var CellItem = /*#__PURE__*/styled(Cell).withConfig({
8
- componentId: "plasma-new-hope__sc-1roh0z4-0"
9
- })(["", ":100%;", ":0rem;", ":0rem;", ":0rem;", ":0rem;", ":0rem;", ":var(", ");", ":var(", ");", ":transparent;"], cellTokens.cellWidth, cellTokens.cellPadding, cellTokens.cellPaddingLeftContent, cellTokens.cellPaddingContent, cellTokens.cellPaddingRightContent, cellTokens.cellTextboxGap, cellTokens.cellGap, tokens.listItemGap, cellTokens.cellColor, tokens.listItemColor, cellTokens.cellBackgroundColor);
10
- export var StyledListItem = /*#__PURE__*/styled.li.withConfig({
11
- componentId: "plasma-new-hope__sc-1roh0z4-1"
12
- })(["padding:calc(var(", ") - var(", ")) var(", ") calc(var(", ") - var(", ")) var(", ");border-radius:var(", ");background:var(", ");border:var(", ") solid var(", ");box-sizing:border-box;display:flex;justify-content:space-between;align-items:center;color:var(", ");font-size:var(", ");font-weight:var(", ");font-family:var(", ");font-style:var(", ");line-height:var(", ");letter-spacing:var(", ");&:hover{background:var(", ");border-color:var(", ");color:var(", ");}&[disabled]{cursor:not-allowed;opacity:var(", ");}"], tokens.listItemPaddingTop, tokens.listItemVariantDifference, tokens.listItemPaddingRight, tokens.listItemPaddingBottom, tokens.listItemVariantDifference, tokens.listItemPaddingLeft, tokens.listItemBorderRadius, tokens.listItemBackground, tokens.listItemBorderWidth, tokens.listItemBorderColor, tokens.listItemColor, tokens.listItemFontSize, tokens.listItemFontWeight, tokens.listItemFontFamily, tokens.listItemFontStyle, tokens.listItemLineHeight, tokens.listItemLetterSpacing, tokens.listItemBackgroundHover, tokens.listItemBorderColorHover, tokens.listItemColorHover, tokens.listDisabledOpacity);