@salutejs/plasma-new-hope 0.161.1-canary.1471.11182853822.0 → 0.162.0-canary.1392.11210877000.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (334) hide show
  1. package/cjs/components/Breadcrumbs/Breadcrumbs.styles.js +2 -2
  2. package/cjs/components/Breadcrumbs/Breadcrumbs.styles.js.map +1 -1
  3. package/cjs/components/Calendar/ui/CalendarHeader/CalendarHeader.js +5 -5
  4. package/cjs/components/Calendar/ui/CalendarHeader/CalendarHeader.js.map +1 -1
  5. package/cjs/components/Segment/tokens.js +14 -1
  6. package/cjs/components/Segment/tokens.js.map +1 -1
  7. package/cjs/components/Segment/ui/SegmentGroup/SegmentGroup.css +8 -9
  8. package/cjs/components/Segment/ui/SegmentGroup/SegmentGroup.js +68 -112
  9. package/cjs/components/Segment/ui/SegmentGroup/SegmentGroup.js.map +1 -1
  10. package/cjs/components/Segment/ui/SegmentGroup/SegmentGroup.styles.js +1 -7
  11. package/cjs/components/Segment/ui/SegmentGroup/SegmentGroup.styles.js.map +1 -1
  12. package/cjs/components/Segment/ui/SegmentGroup/SegmentGroup.styles_klze6h.css +3 -0
  13. package/cjs/components/Segment/ui/SegmentGroup/variations/_filledBackgound/base.js +1 -1
  14. package/cjs/components/Segment/ui/SegmentGroup/variations/_filledBackgound/base.js.map +1 -1
  15. package/cjs/components/Segment/ui/SegmentGroup/variations/_filledBackgound/base_a7w5s0.css +1 -0
  16. package/cjs/components/Segment/ui/SegmentGroup/variations/_orientation/base.js +9 -0
  17. package/cjs/components/Segment/ui/SegmentGroup/variations/_orientation/base.js.map +1 -0
  18. package/cjs/components/Segment/ui/SegmentGroup/variations/_orientation/base_1ejecy9.css +1 -0
  19. package/cjs/components/Segment/ui/SegmentGroup/variations/_pilled/base.js +1 -1
  20. package/cjs/components/Segment/ui/SegmentGroup/variations/_pilled/base.js.map +1 -1
  21. package/cjs/components/Segment/ui/SegmentGroup/variations/_pilled/base_pxl3nb.css +1 -0
  22. package/cjs/components/Segment/ui/SegmentGroup/variations/_size/base.js +1 -1
  23. package/cjs/components/Segment/ui/SegmentGroup/variations/_size/base.js.map +1 -1
  24. package/cjs/components/Segment/ui/SegmentGroup/variations/_size/base_18cpjsq.css +1 -0
  25. package/cjs/components/Segment/ui/SegmentItem/SegmentItem.css +6 -4
  26. package/cjs/components/Segment/ui/SegmentItem/SegmentItem.js +17 -7
  27. package/cjs/components/Segment/ui/SegmentItem/SegmentItem.js.map +1 -1
  28. package/cjs/components/Segment/ui/SegmentItem/SegmentItem.styles.js +30 -1
  29. package/cjs/components/Segment/ui/SegmentItem/SegmentItem.styles.js.map +1 -1
  30. package/cjs/components/Segment/ui/SegmentItem/SegmentItem.styles_1ir79py.css +4 -0
  31. package/cjs/components/Segment/ui/SegmentItem/variations/_pilled/base.js +1 -1
  32. package/cjs/components/Segment/ui/SegmentItem/variations/_pilled/base.js.map +1 -1
  33. package/cjs/components/Segment/ui/SegmentItem/variations/_pilled/{base_15s0fel.css → base_omc5u1.css} +1 -1
  34. package/cjs/components/Segment/ui/SegmentItem/variations/_view/base.js +1 -1
  35. package/cjs/components/Segment/ui/SegmentItem/variations/_view/base.js.map +1 -1
  36. package/cjs/components/Segment/ui/SegmentItem/variations/_view/base_dettiq.css +1 -0
  37. package/cjs/components/Tabs/ui/Tabs/Tabs.js +6 -6
  38. package/cjs/components/Tabs/ui/Tabs/Tabs.js.map +1 -1
  39. package/cjs/components/TextArea/TextArea.styles.js +5 -5
  40. package/cjs/components/TextArea/TextArea.styles.js.map +1 -1
  41. package/cjs/components/TextArea/{TextArea.styles_es0miz.css → TextArea.styles_1kzzs11.css} +1 -1
  42. package/cjs/components/TextArea/TextArea.tokens.js +0 -8
  43. package/cjs/components/TextArea/TextArea.tokens.js.map +1 -1
  44. package/cjs/components/_Icon/Icon.assets/{DisclosureLeft.js → DisclosureLeftCentered.js} +3 -3
  45. package/cjs/components/_Icon/Icon.assets/DisclosureLeftCentered.js.map +1 -0
  46. package/cjs/components/_Icon/Icon.assets/DisclosureRight.js +3 -4
  47. package/cjs/components/_Icon/Icon.assets/DisclosureRight.js.map +1 -1
  48. package/cjs/components/_Icon/Icons/{IconDisclosureLeft.js → IconDisclosureLeftCentered.js} +5 -5
  49. package/cjs/components/_Icon/Icons/IconDisclosureLeftCentered.js.map +1 -0
  50. package/cjs/index.css +25 -22
  51. package/emotion/cjs/components/Breadcrumbs/Breadcrumbs.styles.js +4 -4
  52. package/emotion/cjs/components/Calendar/ui/CalendarHeader/CalendarHeader.js +2 -2
  53. package/emotion/cjs/components/Segment/README.md +61 -0
  54. package/emotion/cjs/components/Segment/tokens.js +14 -1
  55. package/emotion/cjs/components/Segment/ui/SegmentGroup/SegmentGroup.js +66 -115
  56. package/emotion/cjs/components/Segment/ui/SegmentGroup/SegmentGroup.styles.js +15 -33
  57. package/emotion/cjs/components/Segment/ui/SegmentGroup/variations/_filledBackgound/base.js +1 -1
  58. package/emotion/cjs/components/Segment/ui/SegmentGroup/variations/_orientation/base.js +10 -0
  59. package/emotion/cjs/components/Segment/ui/SegmentGroup/variations/_orientation/tokens.json +1 -0
  60. package/emotion/cjs/components/Segment/ui/SegmentGroup/variations/_pilled/base.js +1 -1
  61. package/emotion/cjs/components/Segment/ui/SegmentGroup/variations/_size/base.js +1 -1
  62. package/emotion/cjs/components/Segment/ui/SegmentItem/SegmentItem.js +17 -7
  63. package/emotion/cjs/components/Segment/ui/SegmentItem/SegmentItem.styles.js +21 -7
  64. package/emotion/cjs/components/Segment/ui/SegmentItem/variations/_pilled/base.js +1 -1
  65. package/emotion/cjs/components/Segment/ui/SegmentItem/variations/_view/base.js +2 -1
  66. package/emotion/cjs/components/Tabs/ui/Tabs/Tabs.js +4 -4
  67. package/emotion/cjs/components/TextArea/TextArea.styles.js +11 -11
  68. package/emotion/cjs/components/TextArea/TextArea.tokens.js +0 -8
  69. package/emotion/cjs/components/_Icon/Icon.assets/DisclosureDown.js +21 -0
  70. package/emotion/cjs/components/_Icon/Icon.assets/DisclosureLeft.js +3 -4
  71. package/emotion/cjs/components/_Icon/Icon.assets/DisclosureLeftCentered.js +22 -0
  72. package/emotion/cjs/components/_Icon/Icon.assets/DisclosureRight.js +3 -4
  73. package/emotion/cjs/components/_Icon/Icon.assets/DisclosureUp.js +21 -0
  74. package/emotion/cjs/components/_Icon/Icons/IconDisclosureDown.js +22 -0
  75. package/emotion/cjs/components/_Icon/Icons/IconDisclosureLeftCentered.js +22 -0
  76. package/emotion/cjs/components/_Icon/Icons/IconDisclosureUp.js +22 -0
  77. package/emotion/cjs/components/_Icon/index.js +21 -0
  78. package/emotion/cjs/examples/plasma_b2c/components/Editable/Editable.stories.tsx +2 -2
  79. package/emotion/cjs/examples/plasma_b2c/components/Notification/Notification.stories.tsx +6 -3
  80. package/emotion/cjs/examples/plasma_b2c/components/Segment/Segment.stories.tsx +118 -42
  81. package/emotion/cjs/examples/plasma_b2c/components/Segment/SegmentGroup.config.js +13 -10
  82. package/emotion/cjs/examples/plasma_b2c/components/Segment/SegmentItem.config.js +9 -9
  83. package/emotion/cjs/examples/plasma_b2c/components/TextArea/TextArea.config.js +10 -10
  84. package/emotion/cjs/examples/plasma_b2c/components/Tooltip/Tooltip.stories.tsx +2 -2
  85. package/emotion/cjs/examples/plasma_web/components/Editable/Editable.stories.tsx +2 -2
  86. package/emotion/cjs/examples/plasma_web/components/Notification/Notification.stories.tsx +6 -3
  87. package/emotion/cjs/examples/plasma_web/components/Segment/Segment.stories.tsx +119 -42
  88. package/emotion/cjs/examples/plasma_web/components/Segment/SegmentGroup.config.js +15 -9
  89. package/emotion/cjs/examples/plasma_web/components/Segment/SegmentItem.config.js +9 -9
  90. package/emotion/cjs/examples/plasma_web/components/TextArea/TextArea.config.js +10 -10
  91. package/emotion/cjs/examples/plasma_web/components/Tooltip/Tooltip.stories.tsx +2 -2
  92. package/emotion/es/components/Breadcrumbs/Breadcrumbs.styles.js +5 -5
  93. package/emotion/es/components/Calendar/ui/CalendarHeader/CalendarHeader.js +3 -3
  94. package/emotion/es/components/Segment/README.md +61 -0
  95. package/emotion/es/components/Segment/tokens.js +14 -1
  96. package/emotion/es/components/Segment/ui/SegmentGroup/SegmentGroup.js +69 -118
  97. package/emotion/es/components/Segment/ui/SegmentGroup/SegmentGroup.styles.js +14 -32
  98. package/emotion/es/components/Segment/ui/SegmentGroup/variations/_filledBackgound/base.js +1 -1
  99. package/emotion/es/components/Segment/ui/SegmentGroup/variations/_orientation/base.js +4 -0
  100. package/emotion/es/components/Segment/ui/SegmentGroup/variations/_orientation/tokens.json +1 -0
  101. package/emotion/es/components/Segment/ui/SegmentGroup/variations/_pilled/base.js +1 -1
  102. package/emotion/es/components/Segment/ui/SegmentGroup/variations/_size/base.js +1 -1
  103. package/emotion/es/components/Segment/ui/SegmentItem/SegmentItem.js +18 -8
  104. package/emotion/es/components/Segment/ui/SegmentItem/SegmentItem.styles.js +21 -7
  105. package/emotion/es/components/Segment/ui/SegmentItem/variations/_pilled/base.js +1 -1
  106. package/emotion/es/components/Segment/ui/SegmentItem/variations/_view/base.js +2 -1
  107. package/emotion/es/components/Tabs/ui/Tabs/Tabs.js +5 -5
  108. package/emotion/es/components/TextArea/TextArea.styles.js +11 -11
  109. package/emotion/es/components/TextArea/TextArea.tokens.js +0 -8
  110. package/emotion/es/components/_Icon/Icon.assets/DisclosureDown.js +14 -0
  111. package/emotion/es/components/_Icon/Icon.assets/DisclosureLeft.js +3 -4
  112. package/emotion/es/components/_Icon/Icon.assets/DisclosureLeftCentered.js +15 -0
  113. package/emotion/es/components/_Icon/Icon.assets/DisclosureRight.js +3 -4
  114. package/emotion/es/components/_Icon/Icon.assets/DisclosureUp.js +14 -0
  115. package/emotion/es/components/_Icon/Icons/IconDisclosureDown.js +15 -0
  116. package/emotion/es/components/_Icon/Icons/IconDisclosureLeftCentered.js +15 -0
  117. package/emotion/es/components/_Icon/Icons/IconDisclosureUp.js +15 -0
  118. package/emotion/es/components/_Icon/index.js +3 -0
  119. package/emotion/es/examples/plasma_b2c/components/Editable/Editable.stories.tsx +2 -2
  120. package/emotion/es/examples/plasma_b2c/components/Notification/Notification.stories.tsx +6 -3
  121. package/emotion/es/examples/plasma_b2c/components/Segment/Segment.stories.tsx +118 -42
  122. package/emotion/es/examples/plasma_b2c/components/Segment/SegmentGroup.config.js +13 -10
  123. package/emotion/es/examples/plasma_b2c/components/Segment/SegmentItem.config.js +9 -9
  124. package/emotion/es/examples/plasma_b2c/components/TextArea/TextArea.config.js +10 -10
  125. package/emotion/es/examples/plasma_b2c/components/Tooltip/Tooltip.stories.tsx +2 -2
  126. package/emotion/es/examples/plasma_web/components/Editable/Editable.stories.tsx +2 -2
  127. package/emotion/es/examples/plasma_web/components/Notification/Notification.stories.tsx +6 -3
  128. package/emotion/es/examples/plasma_web/components/Segment/Segment.stories.tsx +119 -42
  129. package/emotion/es/examples/plasma_web/components/Segment/SegmentGroup.config.js +15 -9
  130. package/emotion/es/examples/plasma_web/components/Segment/SegmentItem.config.js +9 -9
  131. package/emotion/es/examples/plasma_web/components/TextArea/TextArea.config.js +10 -10
  132. package/emotion/es/examples/plasma_web/components/Tooltip/Tooltip.stories.tsx +2 -2
  133. package/es/components/Breadcrumbs/Breadcrumbs.styles.js +2 -2
  134. package/es/components/Breadcrumbs/Breadcrumbs.styles.js.map +1 -1
  135. package/es/components/Calendar/ui/CalendarHeader/CalendarHeader.js +5 -5
  136. package/es/components/Calendar/ui/CalendarHeader/CalendarHeader.js.map +1 -1
  137. package/es/components/Segment/tokens.js +14 -1
  138. package/es/components/Segment/tokens.js.map +1 -1
  139. package/es/components/Segment/ui/SegmentGroup/SegmentGroup.css +8 -9
  140. package/es/components/Segment/ui/SegmentGroup/SegmentGroup.js +73 -118
  141. package/es/components/Segment/ui/SegmentGroup/SegmentGroup.js.map +1 -1
  142. package/es/components/Segment/ui/SegmentGroup/SegmentGroup.styles.js +2 -7
  143. package/es/components/Segment/ui/SegmentGroup/SegmentGroup.styles.js.map +1 -1
  144. package/es/components/Segment/ui/SegmentGroup/SegmentGroup.styles_klze6h.css +3 -0
  145. package/es/components/Segment/ui/SegmentGroup/variations/_filledBackgound/base.js +1 -1
  146. package/es/components/Segment/ui/SegmentGroup/variations/_filledBackgound/base.js.map +1 -1
  147. package/es/components/Segment/ui/SegmentGroup/variations/_filledBackgound/base_a7w5s0.css +1 -0
  148. package/es/components/Segment/ui/SegmentGroup/variations/_orientation/base.js +5 -0
  149. package/es/components/Segment/ui/SegmentGroup/variations/_orientation/base.js.map +1 -0
  150. package/es/components/Segment/ui/SegmentGroup/variations/_orientation/base_1ejecy9.css +1 -0
  151. package/es/components/Segment/ui/SegmentGroup/variations/_pilled/base.js +1 -1
  152. package/es/components/Segment/ui/SegmentGroup/variations/_pilled/base.js.map +1 -1
  153. package/es/components/Segment/ui/SegmentGroup/variations/_pilled/base_pxl3nb.css +1 -0
  154. package/es/components/Segment/ui/SegmentGroup/variations/_size/base.js +1 -1
  155. package/es/components/Segment/ui/SegmentGroup/variations/_size/base.js.map +1 -1
  156. package/es/components/Segment/ui/SegmentGroup/variations/_size/base_18cpjsq.css +1 -0
  157. package/es/components/Segment/ui/SegmentItem/SegmentItem.css +6 -4
  158. package/es/components/Segment/ui/SegmentItem/SegmentItem.js +18 -8
  159. package/es/components/Segment/ui/SegmentItem/SegmentItem.js.map +1 -1
  160. package/es/components/Segment/ui/SegmentItem/SegmentItem.styles.js +29 -2
  161. package/es/components/Segment/ui/SegmentItem/SegmentItem.styles.js.map +1 -1
  162. package/es/components/Segment/ui/SegmentItem/SegmentItem.styles_1ir79py.css +4 -0
  163. package/es/components/Segment/ui/SegmentItem/variations/_pilled/base.js +1 -1
  164. package/es/components/Segment/ui/SegmentItem/variations/_pilled/base.js.map +1 -1
  165. package/es/components/Segment/ui/SegmentItem/variations/_pilled/{base_15s0fel.css → base_omc5u1.css} +1 -1
  166. package/es/components/Segment/ui/SegmentItem/variations/_view/base.js +1 -1
  167. package/es/components/Segment/ui/SegmentItem/variations/_view/base.js.map +1 -1
  168. package/es/components/Segment/ui/SegmentItem/variations/_view/base_dettiq.css +1 -0
  169. package/es/components/Tabs/ui/Tabs/Tabs.js +6 -6
  170. package/es/components/Tabs/ui/Tabs/Tabs.js.map +1 -1
  171. package/es/components/TextArea/TextArea.styles.js +5 -5
  172. package/es/components/TextArea/TextArea.styles.js.map +1 -1
  173. package/es/components/TextArea/{TextArea.styles_es0miz.css → TextArea.styles_1kzzs11.css} +1 -1
  174. package/es/components/TextArea/TextArea.tokens.js +0 -8
  175. package/es/components/TextArea/TextArea.tokens.js.map +1 -1
  176. package/es/components/_Icon/Icon.assets/{DisclosureLeft.js → DisclosureLeftCentered.js} +3 -3
  177. package/es/components/_Icon/Icon.assets/DisclosureLeftCentered.js.map +1 -0
  178. package/es/components/_Icon/Icon.assets/DisclosureRight.js +3 -4
  179. package/es/components/_Icon/Icon.assets/DisclosureRight.js.map +1 -1
  180. package/es/components/_Icon/Icons/{IconDisclosureLeft.js → IconDisclosureLeftCentered.js} +5 -5
  181. package/es/components/_Icon/Icons/IconDisclosureLeftCentered.js.map +1 -0
  182. package/es/index.css +25 -22
  183. package/package.json +2 -2
  184. package/styled-components/cjs/components/Breadcrumbs/Breadcrumbs.styles.js +1 -1
  185. package/styled-components/cjs/components/Calendar/ui/CalendarHeader/CalendarHeader.js +2 -2
  186. package/styled-components/cjs/components/Segment/README.md +61 -0
  187. package/styled-components/cjs/components/Segment/tokens.js +14 -1
  188. package/styled-components/cjs/components/Segment/ui/SegmentGroup/SegmentGroup.js +66 -115
  189. package/styled-components/cjs/components/Segment/ui/SegmentGroup/SegmentGroup.styles.js +4 -13
  190. package/styled-components/cjs/components/Segment/ui/SegmentGroup/variations/_filledBackgound/base.js +1 -1
  191. package/styled-components/cjs/components/Segment/ui/SegmentGroup/variations/_orientation/base.js +10 -0
  192. package/styled-components/cjs/components/Segment/ui/SegmentGroup/variations/_orientation/tokens.json +1 -0
  193. package/styled-components/cjs/components/Segment/ui/SegmentGroup/variations/_pilled/base.js +1 -1
  194. package/styled-components/cjs/components/Segment/ui/SegmentGroup/variations/_size/base.js +1 -1
  195. package/styled-components/cjs/components/Segment/ui/SegmentItem/SegmentItem.js +17 -7
  196. package/styled-components/cjs/components/Segment/ui/SegmentItem/SegmentItem.styles.js +17 -5
  197. package/styled-components/cjs/components/Segment/ui/SegmentItem/variations/_pilled/base.js +1 -1
  198. package/styled-components/cjs/components/Segment/ui/SegmentItem/variations/_view/base.js +2 -1
  199. package/styled-components/cjs/components/Tabs/ui/Tabs/Tabs.js +4 -4
  200. package/styled-components/cjs/components/TextArea/TextArea.styles.js +2 -2
  201. package/styled-components/cjs/components/TextArea/TextArea.tokens.js +0 -8
  202. package/styled-components/cjs/components/_Icon/Icon.assets/DisclosureDown.js +21 -0
  203. package/styled-components/cjs/components/_Icon/Icon.assets/DisclosureLeft.js +3 -4
  204. package/styled-components/cjs/components/_Icon/Icon.assets/DisclosureLeftCentered.js +22 -0
  205. package/styled-components/cjs/components/_Icon/Icon.assets/DisclosureRight.js +3 -4
  206. package/styled-components/cjs/components/_Icon/Icon.assets/DisclosureUp.js +21 -0
  207. package/styled-components/cjs/components/_Icon/Icons/IconDisclosureDown.js +22 -0
  208. package/styled-components/cjs/components/_Icon/Icons/IconDisclosureLeftCentered.js +22 -0
  209. package/styled-components/cjs/components/_Icon/Icons/IconDisclosureUp.js +22 -0
  210. package/styled-components/cjs/components/_Icon/index.js +21 -0
  211. package/styled-components/cjs/examples/plasma_b2c/components/Editable/Editable.stories.tsx +2 -2
  212. package/styled-components/cjs/examples/plasma_b2c/components/Notification/Notification.stories.tsx +6 -3
  213. package/styled-components/cjs/examples/plasma_b2c/components/Segment/Segment.stories.tsx +118 -42
  214. package/styled-components/cjs/examples/plasma_b2c/components/Segment/SegmentGroup.config.js +10 -7
  215. package/styled-components/cjs/examples/plasma_b2c/components/Segment/SegmentItem.config.js +8 -8
  216. package/styled-components/cjs/examples/plasma_b2c/components/TextArea/TextArea.config.js +8 -8
  217. package/styled-components/cjs/examples/plasma_b2c/components/Tooltip/Tooltip.stories.tsx +2 -2
  218. package/styled-components/cjs/examples/plasma_web/components/Editable/Editable.stories.tsx +2 -2
  219. package/styled-components/cjs/examples/plasma_web/components/Notification/Notification.stories.tsx +6 -3
  220. package/styled-components/cjs/examples/plasma_web/components/Segment/Segment.stories.tsx +119 -42
  221. package/styled-components/cjs/examples/plasma_web/components/Segment/SegmentGroup.config.js +13 -7
  222. package/styled-components/cjs/examples/plasma_web/components/Segment/SegmentItem.config.js +8 -8
  223. package/styled-components/cjs/examples/plasma_web/components/TextArea/TextArea.config.js +8 -8
  224. package/styled-components/cjs/examples/plasma_web/components/Tooltip/Tooltip.stories.tsx +2 -2
  225. package/styled-components/es/components/Breadcrumbs/Breadcrumbs.styles.js +2 -2
  226. package/styled-components/es/components/Calendar/ui/CalendarHeader/CalendarHeader.js +3 -3
  227. package/styled-components/es/components/Segment/README.md +61 -0
  228. package/styled-components/es/components/Segment/tokens.js +14 -1
  229. package/styled-components/es/components/Segment/ui/SegmentGroup/SegmentGroup.js +69 -118
  230. package/styled-components/es/components/Segment/ui/SegmentGroup/SegmentGroup.styles.js +3 -12
  231. package/styled-components/es/components/Segment/ui/SegmentGroup/variations/_filledBackgound/base.js +1 -1
  232. package/styled-components/es/components/Segment/ui/SegmentGroup/variations/_orientation/base.js +4 -0
  233. package/styled-components/es/components/Segment/ui/SegmentGroup/variations/_orientation/tokens.json +1 -0
  234. package/styled-components/es/components/Segment/ui/SegmentGroup/variations/_pilled/base.js +1 -1
  235. package/styled-components/es/components/Segment/ui/SegmentGroup/variations/_size/base.js +1 -1
  236. package/styled-components/es/components/Segment/ui/SegmentItem/SegmentItem.js +18 -8
  237. package/styled-components/es/components/Segment/ui/SegmentItem/SegmentItem.styles.js +17 -5
  238. package/styled-components/es/components/Segment/ui/SegmentItem/variations/_pilled/base.js +1 -1
  239. package/styled-components/es/components/Segment/ui/SegmentItem/variations/_view/base.js +2 -1
  240. package/styled-components/es/components/Tabs/ui/Tabs/Tabs.js +5 -5
  241. package/styled-components/es/components/TextArea/TextArea.styles.js +2 -2
  242. package/styled-components/es/components/TextArea/TextArea.tokens.js +0 -8
  243. package/styled-components/es/components/_Icon/Icon.assets/DisclosureDown.js +14 -0
  244. package/styled-components/es/components/_Icon/Icon.assets/DisclosureLeft.js +3 -4
  245. package/styled-components/es/components/_Icon/Icon.assets/DisclosureLeftCentered.js +15 -0
  246. package/styled-components/es/components/_Icon/Icon.assets/DisclosureRight.js +3 -4
  247. package/styled-components/es/components/_Icon/Icon.assets/DisclosureUp.js +14 -0
  248. package/styled-components/es/components/_Icon/Icons/IconDisclosureDown.js +15 -0
  249. package/styled-components/es/components/_Icon/Icons/IconDisclosureLeftCentered.js +15 -0
  250. package/styled-components/es/components/_Icon/Icons/IconDisclosureUp.js +15 -0
  251. package/styled-components/es/components/_Icon/index.js +3 -0
  252. package/styled-components/es/examples/plasma_b2c/components/Editable/Editable.stories.tsx +2 -2
  253. package/styled-components/es/examples/plasma_b2c/components/Notification/Notification.stories.tsx +6 -3
  254. package/styled-components/es/examples/plasma_b2c/components/Segment/Segment.stories.tsx +118 -42
  255. package/styled-components/es/examples/plasma_b2c/components/Segment/SegmentGroup.config.js +10 -7
  256. package/styled-components/es/examples/plasma_b2c/components/Segment/SegmentItem.config.js +8 -8
  257. package/styled-components/es/examples/plasma_b2c/components/TextArea/TextArea.config.js +8 -8
  258. package/styled-components/es/examples/plasma_b2c/components/Tooltip/Tooltip.stories.tsx +2 -2
  259. package/styled-components/es/examples/plasma_web/components/Editable/Editable.stories.tsx +2 -2
  260. package/styled-components/es/examples/plasma_web/components/Notification/Notification.stories.tsx +6 -3
  261. package/styled-components/es/examples/plasma_web/components/Segment/Segment.stories.tsx +119 -42
  262. package/styled-components/es/examples/plasma_web/components/Segment/SegmentGroup.config.js +13 -7
  263. package/styled-components/es/examples/plasma_web/components/Segment/SegmentItem.config.js +8 -8
  264. package/styled-components/es/examples/plasma_web/components/TextArea/TextArea.config.js +8 -8
  265. package/styled-components/es/examples/plasma_web/components/Tooltip/Tooltip.stories.tsx +2 -2
  266. package/types/components/Segment/tokens.d.ts +13 -0
  267. package/types/components/Segment/tokens.d.ts.map +1 -1
  268. package/types/components/Segment/ui/SegmentGroup/SegmentGroup.d.ts +10 -1
  269. package/types/components/Segment/ui/SegmentGroup/SegmentGroup.d.ts.map +1 -1
  270. package/types/components/Segment/ui/SegmentGroup/SegmentGroup.styles.d.ts +0 -1
  271. package/types/components/Segment/ui/SegmentGroup/SegmentGroup.styles.d.ts.map +1 -1
  272. package/types/components/Segment/ui/SegmentGroup/SegmentGroup.types.d.ts +19 -1
  273. package/types/components/Segment/ui/SegmentGroup/SegmentGroup.types.d.ts.map +1 -1
  274. package/types/components/Segment/ui/SegmentGroup/variations/_filledBackgound/base.d.ts.map +1 -1
  275. package/types/components/Segment/ui/SegmentGroup/variations/_orientation/base.d.ts +2 -0
  276. package/types/components/Segment/ui/SegmentGroup/variations/_orientation/base.d.ts.map +1 -0
  277. package/types/components/Segment/ui/SegmentGroup/variations/_pilled/base.d.ts.map +1 -1
  278. package/types/components/Segment/ui/SegmentGroup/variations/_size/base.d.ts.map +1 -1
  279. package/types/components/Segment/ui/SegmentItem/SegmentItem.d.ts +8 -2
  280. package/types/components/Segment/ui/SegmentItem/SegmentItem.d.ts.map +1 -1
  281. package/types/components/Segment/ui/SegmentItem/SegmentItem.styles.d.ts +7 -1
  282. package/types/components/Segment/ui/SegmentItem/SegmentItem.styles.d.ts.map +1 -1
  283. package/types/components/Segment/ui/SegmentItem/SegmentItem.types.d.ts +14 -1
  284. package/types/components/Segment/ui/SegmentItem/SegmentItem.types.d.ts.map +1 -1
  285. package/types/components/Segment/ui/SegmentItem/variations/_pilled/base.d.ts.map +1 -1
  286. package/types/components/Segment/ui/SegmentItem/variations/_view/base.d.ts.map +1 -1
  287. package/types/components/Tabs/ui/Tabs/Tabs.d.ts.map +1 -1
  288. package/types/components/TextArea/TextArea.styles.d.ts.map +1 -1
  289. package/types/components/TextArea/TextArea.tokens.d.ts +0 -8
  290. package/types/components/TextArea/TextArea.tokens.d.ts.map +1 -1
  291. package/types/components/_Icon/Icon.assets/DisclosureDown.d.ts +4 -0
  292. package/types/components/_Icon/Icon.assets/DisclosureDown.d.ts.map +1 -0
  293. package/types/components/_Icon/Icon.assets/DisclosureLeft.d.ts.map +1 -1
  294. package/types/components/_Icon/Icon.assets/DisclosureLeftCentered.d.ts +4 -0
  295. package/types/components/_Icon/Icon.assets/DisclosureLeftCentered.d.ts.map +1 -0
  296. package/types/components/_Icon/Icon.assets/DisclosureRight.d.ts.map +1 -1
  297. package/types/components/_Icon/Icon.assets/DisclosureUp.d.ts +4 -0
  298. package/types/components/_Icon/Icon.assets/DisclosureUp.d.ts.map +1 -0
  299. package/types/components/_Icon/Icons/IconDisclosureDown.d.ts +4 -0
  300. package/types/components/_Icon/Icons/IconDisclosureDown.d.ts.map +1 -0
  301. package/types/components/_Icon/Icons/IconDisclosureLeftCentered.d.ts +4 -0
  302. package/types/components/_Icon/Icons/IconDisclosureLeftCentered.d.ts.map +1 -0
  303. package/types/components/_Icon/Icons/IconDisclosureUp.d.ts +4 -0
  304. package/types/components/_Icon/Icons/IconDisclosureUp.d.ts.map +1 -0
  305. package/types/components/_Icon/index.d.ts +3 -0
  306. package/types/components/_Icon/index.d.ts.map +1 -1
  307. package/types/examples/plasma_b2c/components/Segment/Segment.d.ts +10 -1
  308. package/types/examples/plasma_b2c/components/Segment/Segment.d.ts.map +1 -1
  309. package/types/examples/plasma_b2c/components/Segment/SegmentGroup.config.d.ts +3 -0
  310. package/types/examples/plasma_b2c/components/Segment/SegmentGroup.config.d.ts.map +1 -1
  311. package/types/examples/plasma_b2c/components/Segment/SegmentItem.config.d.ts.map +1 -1
  312. package/types/examples/plasma_b2c/components/TextArea/TextArea.config.d.ts.map +1 -1
  313. package/types/examples/plasma_web/components/Segment/Segment.d.ts +13 -1
  314. package/types/examples/plasma_web/components/Segment/Segment.d.ts.map +1 -1
  315. package/types/examples/plasma_web/components/Segment/SegmentGroup.config.d.ts +6 -0
  316. package/types/examples/plasma_web/components/Segment/SegmentGroup.config.d.ts.map +1 -1
  317. package/types/examples/plasma_web/components/Segment/SegmentItem.config.d.ts.map +1 -1
  318. package/types/examples/plasma_web/components/TextArea/TextArea.config.d.ts.map +1 -1
  319. package/cjs/components/Segment/ui/SegmentGroup/SegmentGroup.styles_m9i9p0.css +0 -4
  320. package/cjs/components/Segment/ui/SegmentGroup/variations/_filledBackgound/base_escgtx.css +0 -1
  321. package/cjs/components/Segment/ui/SegmentGroup/variations/_pilled/base_fqbatz.css +0 -1
  322. package/cjs/components/Segment/ui/SegmentGroup/variations/_size/base_m358nl.css +0 -1
  323. package/cjs/components/Segment/ui/SegmentItem/SegmentItem.styles_18h1p52.css +0 -2
  324. package/cjs/components/Segment/ui/SegmentItem/variations/_view/base_1m1u2ys.css +0 -1
  325. package/cjs/components/_Icon/Icon.assets/DisclosureLeft.js.map +0 -1
  326. package/cjs/components/_Icon/Icons/IconDisclosureLeft.js.map +0 -1
  327. package/es/components/Segment/ui/SegmentGroup/SegmentGroup.styles_m9i9p0.css +0 -4
  328. package/es/components/Segment/ui/SegmentGroup/variations/_filledBackgound/base_escgtx.css +0 -1
  329. package/es/components/Segment/ui/SegmentGroup/variations/_pilled/base_fqbatz.css +0 -1
  330. package/es/components/Segment/ui/SegmentGroup/variations/_size/base_m358nl.css +0 -1
  331. package/es/components/Segment/ui/SegmentItem/SegmentItem.styles_18h1p52.css +0 -2
  332. package/es/components/Segment/ui/SegmentItem/variations/_view/base_1m1u2ys.css +0 -1
  333. package/es/components/_Icon/Icon.assets/DisclosureLeft.js.map +0 -1
  334. package/es/components/_Icon/Icons/IconDisclosureLeft.js.map +0 -1
@@ -13,16 +13,16 @@ var config = exports.config = {
13
13
  },
14
14
  variations: {
15
15
  size: {
16
- xs: /*#__PURE__*/(0, _styledComponents.css)(["", ":100%;", ":7.312rem;", ":0.625rem;", ":0.5rem;", ":0.5rem;", ":0.5625rem;", ":0.625rem;", ":2.125rem;", ":1.5rem;", ":0.563rem;", ":0.563rem;", ":0.625rem;", ":0.25rem;", ":0.25rem;", ":0rem;", ":0rem;", ":0rem;", ":0.375rem;", ":0.563rem;", ":0.5rem;", ":1rem;", ":0.375rem;", ":0.25rem;", ":var(--plasma-typo-body-xxs-font-family);", ":var(--plasma-typo-body-xxs-font-size);", ":var(--plasma-typo-body-xxs-font-style);", ":var(--plasma-typo-body-xxs-font-weight);", ":var(--plasma-typo-body-xxs-letter-spacing);", ":var(--plasma-typo-body-xxs-line-height);", ":0rem;", ":0rem;", ":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);", ":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);", ":0.375rem;", ":0.375rem;", ":0 0 0 0;", ":0.25rem auto auto -0.625rem;", ":0 0 auto auto;", ":0.125rem -0.675rem auto auto;", ":0.813rem auto auto -0.625rem;", ":0.813rem -0.625rem auto auto;", ":0.313rem;", ":0.125rem;"], _TextArea.textAreaTokens.inputWidth, _TextArea.textAreaTokens.inputHeight, _TextArea.textAreaTokens.inputMinHeight, _TextArea.textAreaTokens.borderRadius, _TextArea.textAreaTokens.borderRadiusWithHelpers, _TextArea.textAreaTokens.inputPaddingTop, _TextArea.textAreaTokens.inputPaddingRight, _TextArea.textAreaTokens.inputPaddingRightWithRightContent, _TextArea.textAreaTokens.clearInputPaddingRightWithRightContent, _TextArea.textAreaTokens.inputPaddingBottom, _TextArea.textAreaTokens.inputPaddingBottomWithHelpers, _TextArea.textAreaTokens.inputPaddingLeft, _TextArea.textAreaTokens.helpersPaddingTop, _TextArea.textAreaTokens.clearHelpersPaddingTop, _TextArea.textAreaTokens.helpersPaddingRight, _TextArea.textAreaTokens.helpersPaddingBottom, _TextArea.textAreaTokens.helpersPaddingLeft, _TextArea.textAreaTokens.helpersOffset, _TextArea.textAreaTokens.rightContentTop, _TextArea.textAreaTokens.rightContentRight, _TextArea.textAreaTokens.rightContentHeight, _TextArea.textAreaTokens.labelMarginBottom, _TextArea.textAreaTokens.clearLabelMarginBottom, _TextArea.textAreaTokens.labelInnerFontFamily, _TextArea.textAreaTokens.labelInnerFontSize, _TextArea.textAreaTokens.labelInnerFontStyle, _TextArea.textAreaTokens.labelInnerFontWeight, _TextArea.textAreaTokens.labelInnerLetterSpacing, _TextArea.textAreaTokens.labelInnerLineHeight, _TextArea.textAreaTokens.labelInnerTop, _TextArea.textAreaTokens.labelInnerMarginBottom, _TextArea.textAreaTokens.inputFontFamily, _TextArea.textAreaTokens.inputFontSize, _TextArea.textAreaTokens.inputFontStyle, _TextArea.textAreaTokens.inputFontWeight, _TextArea.textAreaTokens.inputLetterSpacing, _TextArea.textAreaTokens.inputLineHeight, _TextArea.textAreaTokens.helpersFontFamily, _TextArea.textAreaTokens.helpersFontSize, _TextArea.textAreaTokens.helpersFontStyle, _TextArea.textAreaTokens.helpersFontWeight, _TextArea.textAreaTokens.helpersLetterSpacing, _TextArea.textAreaTokens.helpersLineHeight, _TextArea.textAreaTokens.indicatorSizeInner, _TextArea.textAreaTokens.indicatorSizeOuter, _TextArea.textAreaTokens.indicatorLabelPlacementInner, _TextArea.textAreaTokens.indicatorLabelPlacementOuter, _TextArea.textAreaTokens.indicatorLabelPlacementInnerRight, _TextArea.textAreaTokens.indicatorLabelPlacementOuterRight, _TextArea.textAreaTokens.clearIndicatorLabelPlacementInner, _TextArea.textAreaTokens.clearIndicatorLabelPlacementInnerRight, _TextArea.textAreaTokens.scrollbarWidth, _TextArea.textAreaTokens.scrollbarBorderWidth),
17
- s: /*#__PURE__*/(0, _styledComponents.css)(["", ":100%;", ":7.187rem;", ":0.625rem;", ":0.625rem;", ":0.625rem;", ":0.6875rem;", ":0.875rem;", ":3.125rem;", ":2rem;", ":0.75rem;", ":0.75rem;", ":0.875rem;", ":0.25rem;", ":0.25rem;", ":0rem;", ":0rem;", ":0rem;", ":0.375rem;", ":0.688rem;", ":0.75rem;", ":1.25rem;", ":0.5rem;", ":0.25rem;", ":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);", ":0.375rem;", ":0.125rem;", ":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);", ":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);", ":0.375rem;", ":0.375rem;", ":0 0 0 0;", ":0.375rem auto auto -0.675rem;", ":0 0 auto auto;", ":0.25rem -0.625rem auto auto;", ":1.063rem auto auto -0.75rem;", ":1.063rem -0.75rem auto auto;", ":0.313rem;", ":0.125rem;"], _TextArea.textAreaTokens.inputWidth, _TextArea.textAreaTokens.inputHeight, _TextArea.textAreaTokens.inputMinHeight, _TextArea.textAreaTokens.borderRadius, _TextArea.textAreaTokens.borderRadiusWithHelpers, _TextArea.textAreaTokens.inputPaddingTop, _TextArea.textAreaTokens.inputPaddingRight, _TextArea.textAreaTokens.inputPaddingRightWithRightContent, _TextArea.textAreaTokens.clearInputPaddingRightWithRightContent, _TextArea.textAreaTokens.inputPaddingBottom, _TextArea.textAreaTokens.inputPaddingBottomWithHelpers, _TextArea.textAreaTokens.inputPaddingLeft, _TextArea.textAreaTokens.helpersPaddingTop, _TextArea.textAreaTokens.clearHelpersPaddingTop, _TextArea.textAreaTokens.helpersPaddingRight, _TextArea.textAreaTokens.helpersPaddingBottom, _TextArea.textAreaTokens.helpersPaddingLeft, _TextArea.textAreaTokens.helpersOffset, _TextArea.textAreaTokens.rightContentTop, _TextArea.textAreaTokens.rightContentRight, _TextArea.textAreaTokens.rightContentHeight, _TextArea.textAreaTokens.labelMarginBottom, _TextArea.textAreaTokens.clearLabelMarginBottom, _TextArea.textAreaTokens.labelInnerFontFamily, _TextArea.textAreaTokens.labelInnerFontSize, _TextArea.textAreaTokens.labelInnerFontStyle, _TextArea.textAreaTokens.labelInnerFontWeight, _TextArea.textAreaTokens.labelInnerLetterSpacing, _TextArea.textAreaTokens.labelInnerLineHeight, _TextArea.textAreaTokens.labelInnerTop, _TextArea.textAreaTokens.labelInnerMarginBottom, _TextArea.textAreaTokens.inputFontFamily, _TextArea.textAreaTokens.inputFontSize, _TextArea.textAreaTokens.inputFontStyle, _TextArea.textAreaTokens.inputFontWeight, _TextArea.textAreaTokens.inputLetterSpacing, _TextArea.textAreaTokens.inputLineHeight, _TextArea.textAreaTokens.helpersFontFamily, _TextArea.textAreaTokens.helpersFontSize, _TextArea.textAreaTokens.helpersFontStyle, _TextArea.textAreaTokens.helpersFontWeight, _TextArea.textAreaTokens.helpersLetterSpacing, _TextArea.textAreaTokens.helpersLineHeight, _TextArea.textAreaTokens.indicatorSizeInner, _TextArea.textAreaTokens.indicatorSizeOuter, _TextArea.textAreaTokens.indicatorLabelPlacementInner, _TextArea.textAreaTokens.indicatorLabelPlacementOuter, _TextArea.textAreaTokens.indicatorLabelPlacementInnerRight, _TextArea.textAreaTokens.indicatorLabelPlacementOuterRight, _TextArea.textAreaTokens.clearIndicatorLabelPlacementInner, _TextArea.textAreaTokens.clearIndicatorLabelPlacementInnerRight, _TextArea.textAreaTokens.scrollbarWidth, _TextArea.textAreaTokens.scrollbarBorderWidth),
18
- m: /*#__PURE__*/(0, _styledComponents.css)(["", ":100%;", ":7rem;", ":1.125rem;", ":0.75rem;", ":0.75rem;", ":0.875rem;", ":1rem;", ":3.375rem;", ":2.125rem;", ":0.75rem;", ":0.75rem;", ":1rem;", ":0.25rem;", ":0.25rem;", ":0rem;", ":0rem;", ":0rem;", ":0.375rem;", ":0.875rem;", ":0.875rem;", ":1.25rem;", ":0.625rem;", ":0.25rem;", ":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);", ":0.375rem;", ":0.125rem;", ":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);", ":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);", ":0.5rem;", ":0.375rem;", ":0 0 0 0;", ":0.4375rem auto auto -0.675rem;", ":0 0 auto auto;", ":0.1875rem -0.625rem auto auto;", ":1.25rem auto auto -0.875rem;", ":1.25rem -0.875rem auto auto;", ":0.313rem;", ":0.125rem;"], _TextArea.textAreaTokens.inputWidth, _TextArea.textAreaTokens.inputHeight, _TextArea.textAreaTokens.inputMinHeight, _TextArea.textAreaTokens.borderRadius, _TextArea.textAreaTokens.borderRadiusWithHelpers, _TextArea.textAreaTokens.inputPaddingTop, _TextArea.textAreaTokens.inputPaddingRight, _TextArea.textAreaTokens.inputPaddingRightWithRightContent, _TextArea.textAreaTokens.clearInputPaddingRightWithRightContent, _TextArea.textAreaTokens.inputPaddingBottom, _TextArea.textAreaTokens.inputPaddingBottomWithHelpers, _TextArea.textAreaTokens.inputPaddingLeft, _TextArea.textAreaTokens.helpersPaddingTop, _TextArea.textAreaTokens.clearHelpersPaddingTop, _TextArea.textAreaTokens.helpersPaddingRight, _TextArea.textAreaTokens.helpersPaddingBottom, _TextArea.textAreaTokens.helpersPaddingLeft, _TextArea.textAreaTokens.helpersOffset, _TextArea.textAreaTokens.rightContentTop, _TextArea.textAreaTokens.rightContentRight, _TextArea.textAreaTokens.rightContentHeight, _TextArea.textAreaTokens.labelMarginBottom, _TextArea.textAreaTokens.clearLabelMarginBottom, _TextArea.textAreaTokens.labelInnerFontFamily, _TextArea.textAreaTokens.labelInnerFontSize, _TextArea.textAreaTokens.labelInnerFontStyle, _TextArea.textAreaTokens.labelInnerFontWeight, _TextArea.textAreaTokens.labelInnerLetterSpacing, _TextArea.textAreaTokens.labelInnerLineHeight, _TextArea.textAreaTokens.labelInnerTop, _TextArea.textAreaTokens.labelInnerMarginBottom, _TextArea.textAreaTokens.inputFontFamily, _TextArea.textAreaTokens.inputFontSize, _TextArea.textAreaTokens.inputFontStyle, _TextArea.textAreaTokens.inputFontWeight, _TextArea.textAreaTokens.inputLetterSpacing, _TextArea.textAreaTokens.inputLineHeight, _TextArea.textAreaTokens.helpersFontFamily, _TextArea.textAreaTokens.helpersFontSize, _TextArea.textAreaTokens.helpersFontStyle, _TextArea.textAreaTokens.helpersFontWeight, _TextArea.textAreaTokens.helpersLetterSpacing, _TextArea.textAreaTokens.helpersLineHeight, _TextArea.textAreaTokens.indicatorSizeInner, _TextArea.textAreaTokens.indicatorSizeOuter, _TextArea.textAreaTokens.indicatorLabelPlacementInner, _TextArea.textAreaTokens.indicatorLabelPlacementOuter, _TextArea.textAreaTokens.indicatorLabelPlacementInnerRight, _TextArea.textAreaTokens.indicatorLabelPlacementOuterRight, _TextArea.textAreaTokens.clearIndicatorLabelPlacementInner, _TextArea.textAreaTokens.clearIndicatorLabelPlacementInnerRight, _TextArea.textAreaTokens.scrollbarWidth, _TextArea.textAreaTokens.scrollbarBorderWidth),
19
- l: /*#__PURE__*/(0, _styledComponents.css)(["", ":100%;", ":6.812rem;", ":1.625rem;", ":0.875rem;", ":0.875rem;", ":1rem;", ":1.125rem;", ":3.625rem;", ":2.25rem;", ":0.75rem;", ":0.75rem;", ":1.125rem;", ":0.25rem;", ":0.25rem;", ":0rem;", ":0rem;", ":0rem;", ":0.375rem;", ":1.063rem;", ":1rem;", ":1.25rem;", ":0.75rem;", ":0.25rem;", ":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);", ":0.5625rem;", ":0.125rem;", ":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);", ":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);", ":0.5rem;", ":0.375rem;", ":0 0 0 0;", ":0.5rem auto auto -0.675rem;", ":0 0 auto auto;", ":0.25rem -0.625rem auto auto;", ":1.5rem auto auto -0.875rem;", ":1.5rem -0.875rem auto auto;", ":0.313rem;", ":0.125rem;"], _TextArea.textAreaTokens.inputWidth, _TextArea.textAreaTokens.inputHeight, _TextArea.textAreaTokens.inputMinHeight, _TextArea.textAreaTokens.borderRadius, _TextArea.textAreaTokens.borderRadiusWithHelpers, _TextArea.textAreaTokens.inputPaddingTop, _TextArea.textAreaTokens.inputPaddingRight, _TextArea.textAreaTokens.inputPaddingRightWithRightContent, _TextArea.textAreaTokens.clearInputPaddingRightWithRightContent, _TextArea.textAreaTokens.inputPaddingBottom, _TextArea.textAreaTokens.inputPaddingBottomWithHelpers, _TextArea.textAreaTokens.inputPaddingLeft, _TextArea.textAreaTokens.helpersPaddingTop, _TextArea.textAreaTokens.clearHelpersPaddingTop, _TextArea.textAreaTokens.helpersPaddingRight, _TextArea.textAreaTokens.helpersPaddingBottom, _TextArea.textAreaTokens.helpersPaddingLeft, _TextArea.textAreaTokens.helpersOffset, _TextArea.textAreaTokens.rightContentTop, _TextArea.textAreaTokens.rightContentRight, _TextArea.textAreaTokens.rightContentHeight, _TextArea.textAreaTokens.labelMarginBottom, _TextArea.textAreaTokens.clearLabelMarginBottom, _TextArea.textAreaTokens.labelInnerFontFamily, _TextArea.textAreaTokens.labelInnerFontSize, _TextArea.textAreaTokens.labelInnerFontStyle, _TextArea.textAreaTokens.labelInnerFontWeight, _TextArea.textAreaTokens.labelInnerLetterSpacing, _TextArea.textAreaTokens.labelInnerLineHeight, _TextArea.textAreaTokens.labelInnerTop, _TextArea.textAreaTokens.labelInnerMarginBottom, _TextArea.textAreaTokens.inputFontFamily, _TextArea.textAreaTokens.inputFontSize, _TextArea.textAreaTokens.inputFontStyle, _TextArea.textAreaTokens.inputFontWeight, _TextArea.textAreaTokens.inputLetterSpacing, _TextArea.textAreaTokens.inputLineHeight, _TextArea.textAreaTokens.helpersFontFamily, _TextArea.textAreaTokens.helpersFontSize, _TextArea.textAreaTokens.helpersFontStyle, _TextArea.textAreaTokens.helpersFontWeight, _TextArea.textAreaTokens.helpersLetterSpacing, _TextArea.textAreaTokens.helpersLineHeight, _TextArea.textAreaTokens.indicatorSizeInner, _TextArea.textAreaTokens.indicatorSizeOuter, _TextArea.textAreaTokens.indicatorLabelPlacementInner, _TextArea.textAreaTokens.indicatorLabelPlacementOuter, _TextArea.textAreaTokens.indicatorLabelPlacementInnerRight, _TextArea.textAreaTokens.indicatorLabelPlacementOuterRight, _TextArea.textAreaTokens.clearIndicatorLabelPlacementInner, _TextArea.textAreaTokens.clearIndicatorLabelPlacementInnerRight, _TextArea.textAreaTokens.scrollbarWidth, _TextArea.textAreaTokens.scrollbarBorderWidth)
16
+ xs: /*#__PURE__*/(0, _styledComponents.css)(["", ":100%;", ":7.312rem;", ":0.625rem;", ":0.5rem;", ":0.5rem;", ":0.5625rem;", ":0.625rem;", ":2.125rem;", ":1.5rem;", ":0.563rem;", ":0.563rem;", ":0.625rem;", ":0.25rem;", ":0.25rem;", ":0rem;", ":0rem;", ":0rem;", ":0.375rem;", ":0.563rem;", ":0.5rem;", ":1rem;", ":0.375rem;", ":0.25rem;", ":var(--plasma-typo-body-xxs-font-family);", ":var(--plasma-typo-body-xxs-font-size);", ":var(--plasma-typo-body-xxs-font-style);", ":var(--plasma-typo-body-xxs-font-weight);", ":var(--plasma-typo-body-xxs-letter-spacing);", ":var(--plasma-typo-body-xxs-line-height);", ":0rem;", ":0rem;", ":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);", ":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);", ":0.375rem;", ":0.375rem;", ":0 0 0 0;", ":0.25rem auto auto -0.625rem;", ":0 0 auto auto;", ":0.125rem -0.675rem auto auto;", ":0.813rem auto auto -0.625rem;", ":0.813rem -0.625rem auto auto;"], _TextArea.textAreaTokens.inputWidth, _TextArea.textAreaTokens.inputHeight, _TextArea.textAreaTokens.inputMinHeight, _TextArea.textAreaTokens.borderRadius, _TextArea.textAreaTokens.borderRadiusWithHelpers, _TextArea.textAreaTokens.inputPaddingTop, _TextArea.textAreaTokens.inputPaddingRight, _TextArea.textAreaTokens.inputPaddingRightWithRightContent, _TextArea.textAreaTokens.clearInputPaddingRightWithRightContent, _TextArea.textAreaTokens.inputPaddingBottom, _TextArea.textAreaTokens.inputPaddingBottomWithHelpers, _TextArea.textAreaTokens.inputPaddingLeft, _TextArea.textAreaTokens.helpersPaddingTop, _TextArea.textAreaTokens.clearHelpersPaddingTop, _TextArea.textAreaTokens.helpersPaddingRight, _TextArea.textAreaTokens.helpersPaddingBottom, _TextArea.textAreaTokens.helpersPaddingLeft, _TextArea.textAreaTokens.helpersOffset, _TextArea.textAreaTokens.rightContentTop, _TextArea.textAreaTokens.rightContentRight, _TextArea.textAreaTokens.rightContentHeight, _TextArea.textAreaTokens.labelMarginBottom, _TextArea.textAreaTokens.clearLabelMarginBottom, _TextArea.textAreaTokens.labelInnerFontFamily, _TextArea.textAreaTokens.labelInnerFontSize, _TextArea.textAreaTokens.labelInnerFontStyle, _TextArea.textAreaTokens.labelInnerFontWeight, _TextArea.textAreaTokens.labelInnerLetterSpacing, _TextArea.textAreaTokens.labelInnerLineHeight, _TextArea.textAreaTokens.labelInnerTop, _TextArea.textAreaTokens.labelInnerMarginBottom, _TextArea.textAreaTokens.inputFontFamily, _TextArea.textAreaTokens.inputFontSize, _TextArea.textAreaTokens.inputFontStyle, _TextArea.textAreaTokens.inputFontWeight, _TextArea.textAreaTokens.inputLetterSpacing, _TextArea.textAreaTokens.inputLineHeight, _TextArea.textAreaTokens.helpersFontFamily, _TextArea.textAreaTokens.helpersFontSize, _TextArea.textAreaTokens.helpersFontStyle, _TextArea.textAreaTokens.helpersFontWeight, _TextArea.textAreaTokens.helpersLetterSpacing, _TextArea.textAreaTokens.helpersLineHeight, _TextArea.textAreaTokens.indicatorSizeInner, _TextArea.textAreaTokens.indicatorSizeOuter, _TextArea.textAreaTokens.indicatorLabelPlacementInner, _TextArea.textAreaTokens.indicatorLabelPlacementOuter, _TextArea.textAreaTokens.indicatorLabelPlacementInnerRight, _TextArea.textAreaTokens.indicatorLabelPlacementOuterRight, _TextArea.textAreaTokens.clearIndicatorLabelPlacementInner, _TextArea.textAreaTokens.clearIndicatorLabelPlacementInnerRight),
17
+ s: /*#__PURE__*/(0, _styledComponents.css)(["", ":100%;", ":7.187rem;", ":0.625rem;", ":0.625rem;", ":0.625rem;", ":0.6875rem;", ":0.875rem;", ":3.125rem;", ":2rem;", ":0.75rem;", ":0.75rem;", ":0.875rem;", ":0.25rem;", ":0.25rem;", ":0rem;", ":0rem;", ":0rem;", ":0.375rem;", ":0.688rem;", ":0.75rem;", ":1.25rem;", ":0.5rem;", ":0.25rem;", ":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);", ":0.375rem;", ":0.125rem;", ":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);", ":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);", ":0.375rem;", ":0.375rem;", ":0 0 0 0;", ":0.375rem auto auto -0.675rem;", ":0 0 auto auto;", ":0.25rem -0.625rem auto auto;", ":1.063rem auto auto -0.75rem;", ":1.063rem -0.75rem auto auto;"], _TextArea.textAreaTokens.inputWidth, _TextArea.textAreaTokens.inputHeight, _TextArea.textAreaTokens.inputMinHeight, _TextArea.textAreaTokens.borderRadius, _TextArea.textAreaTokens.borderRadiusWithHelpers, _TextArea.textAreaTokens.inputPaddingTop, _TextArea.textAreaTokens.inputPaddingRight, _TextArea.textAreaTokens.inputPaddingRightWithRightContent, _TextArea.textAreaTokens.clearInputPaddingRightWithRightContent, _TextArea.textAreaTokens.inputPaddingBottom, _TextArea.textAreaTokens.inputPaddingBottomWithHelpers, _TextArea.textAreaTokens.inputPaddingLeft, _TextArea.textAreaTokens.helpersPaddingTop, _TextArea.textAreaTokens.clearHelpersPaddingTop, _TextArea.textAreaTokens.helpersPaddingRight, _TextArea.textAreaTokens.helpersPaddingBottom, _TextArea.textAreaTokens.helpersPaddingLeft, _TextArea.textAreaTokens.helpersOffset, _TextArea.textAreaTokens.rightContentTop, _TextArea.textAreaTokens.rightContentRight, _TextArea.textAreaTokens.rightContentHeight, _TextArea.textAreaTokens.labelMarginBottom, _TextArea.textAreaTokens.clearLabelMarginBottom, _TextArea.textAreaTokens.labelInnerFontFamily, _TextArea.textAreaTokens.labelInnerFontSize, _TextArea.textAreaTokens.labelInnerFontStyle, _TextArea.textAreaTokens.labelInnerFontWeight, _TextArea.textAreaTokens.labelInnerLetterSpacing, _TextArea.textAreaTokens.labelInnerLineHeight, _TextArea.textAreaTokens.labelInnerTop, _TextArea.textAreaTokens.labelInnerMarginBottom, _TextArea.textAreaTokens.inputFontFamily, _TextArea.textAreaTokens.inputFontSize, _TextArea.textAreaTokens.inputFontStyle, _TextArea.textAreaTokens.inputFontWeight, _TextArea.textAreaTokens.inputLetterSpacing, _TextArea.textAreaTokens.inputLineHeight, _TextArea.textAreaTokens.helpersFontFamily, _TextArea.textAreaTokens.helpersFontSize, _TextArea.textAreaTokens.helpersFontStyle, _TextArea.textAreaTokens.helpersFontWeight, _TextArea.textAreaTokens.helpersLetterSpacing, _TextArea.textAreaTokens.helpersLineHeight, _TextArea.textAreaTokens.indicatorSizeInner, _TextArea.textAreaTokens.indicatorSizeOuter, _TextArea.textAreaTokens.indicatorLabelPlacementInner, _TextArea.textAreaTokens.indicatorLabelPlacementOuter, _TextArea.textAreaTokens.indicatorLabelPlacementInnerRight, _TextArea.textAreaTokens.indicatorLabelPlacementOuterRight, _TextArea.textAreaTokens.clearIndicatorLabelPlacementInner, _TextArea.textAreaTokens.clearIndicatorLabelPlacementInnerRight),
18
+ m: /*#__PURE__*/(0, _styledComponents.css)(["", ":100%;", ":7rem;", ":1.125rem;", ":0.75rem;", ":0.75rem;", ":0.875rem;", ":1rem;", ":3.375rem;", ":2.125rem;", ":0.75rem;", ":0.75rem;", ":1rem;", ":0.25rem;", ":0.25rem;", ":0rem;", ":0rem;", ":0rem;", ":0.375rem;", ":0.875rem;", ":0.875rem;", ":1.25rem;", ":0.625rem;", ":0.25rem;", ":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);", ":0.375rem;", ":0.125rem;", ":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);", ":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);", ":0.5rem;", ":0.375rem;", ":0 0 0 0;", ":0.4375rem auto auto -0.675rem;", ":0 0 auto auto;", ":0.1875rem -0.625rem auto auto;", ":1.25rem auto auto -0.875rem;", ":1.25rem -0.875rem auto auto;"], _TextArea.textAreaTokens.inputWidth, _TextArea.textAreaTokens.inputHeight, _TextArea.textAreaTokens.inputMinHeight, _TextArea.textAreaTokens.borderRadius, _TextArea.textAreaTokens.borderRadiusWithHelpers, _TextArea.textAreaTokens.inputPaddingTop, _TextArea.textAreaTokens.inputPaddingRight, _TextArea.textAreaTokens.inputPaddingRightWithRightContent, _TextArea.textAreaTokens.clearInputPaddingRightWithRightContent, _TextArea.textAreaTokens.inputPaddingBottom, _TextArea.textAreaTokens.inputPaddingBottomWithHelpers, _TextArea.textAreaTokens.inputPaddingLeft, _TextArea.textAreaTokens.helpersPaddingTop, _TextArea.textAreaTokens.clearHelpersPaddingTop, _TextArea.textAreaTokens.helpersPaddingRight, _TextArea.textAreaTokens.helpersPaddingBottom, _TextArea.textAreaTokens.helpersPaddingLeft, _TextArea.textAreaTokens.helpersOffset, _TextArea.textAreaTokens.rightContentTop, _TextArea.textAreaTokens.rightContentRight, _TextArea.textAreaTokens.rightContentHeight, _TextArea.textAreaTokens.labelMarginBottom, _TextArea.textAreaTokens.clearLabelMarginBottom, _TextArea.textAreaTokens.labelInnerFontFamily, _TextArea.textAreaTokens.labelInnerFontSize, _TextArea.textAreaTokens.labelInnerFontStyle, _TextArea.textAreaTokens.labelInnerFontWeight, _TextArea.textAreaTokens.labelInnerLetterSpacing, _TextArea.textAreaTokens.labelInnerLineHeight, _TextArea.textAreaTokens.labelInnerTop, _TextArea.textAreaTokens.labelInnerMarginBottom, _TextArea.textAreaTokens.inputFontFamily, _TextArea.textAreaTokens.inputFontSize, _TextArea.textAreaTokens.inputFontStyle, _TextArea.textAreaTokens.inputFontWeight, _TextArea.textAreaTokens.inputLetterSpacing, _TextArea.textAreaTokens.inputLineHeight, _TextArea.textAreaTokens.helpersFontFamily, _TextArea.textAreaTokens.helpersFontSize, _TextArea.textAreaTokens.helpersFontStyle, _TextArea.textAreaTokens.helpersFontWeight, _TextArea.textAreaTokens.helpersLetterSpacing, _TextArea.textAreaTokens.helpersLineHeight, _TextArea.textAreaTokens.indicatorSizeInner, _TextArea.textAreaTokens.indicatorSizeOuter, _TextArea.textAreaTokens.indicatorLabelPlacementInner, _TextArea.textAreaTokens.indicatorLabelPlacementOuter, _TextArea.textAreaTokens.indicatorLabelPlacementInnerRight, _TextArea.textAreaTokens.indicatorLabelPlacementOuterRight, _TextArea.textAreaTokens.clearIndicatorLabelPlacementInner, _TextArea.textAreaTokens.clearIndicatorLabelPlacementInnerRight),
19
+ l: /*#__PURE__*/(0, _styledComponents.css)(["", ":100%;", ":6.812rem;", ":1.625rem;", ":0.875rem;", ":0.875rem;", ":1rem;", ":1.125rem;", ":3.625rem;", ":2.25rem;", ":0.75rem;", ":0.75rem;", ":1.125rem;", ":0.25rem;", ":0.25rem;", ":0rem;", ":0rem;", ":0rem;", ":0.375rem;", ":1.063rem;", ":1rem;", ":1.25rem;", ":0.75rem;", ":0.25rem;", ":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);", ":0.5625rem;", ":0.125rem;", ":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);", ":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);", ":0.5rem;", ":0.375rem;", ":0 0 0 0;", ":0.5rem auto auto -0.675rem;", ":0 0 auto auto;", ":0.25rem -0.625rem auto auto;", ":1.5rem auto auto -0.875rem;", ":1.5rem -0.875rem auto auto;"], _TextArea.textAreaTokens.inputWidth, _TextArea.textAreaTokens.inputHeight, _TextArea.textAreaTokens.inputMinHeight, _TextArea.textAreaTokens.borderRadius, _TextArea.textAreaTokens.borderRadiusWithHelpers, _TextArea.textAreaTokens.inputPaddingTop, _TextArea.textAreaTokens.inputPaddingRight, _TextArea.textAreaTokens.inputPaddingRightWithRightContent, _TextArea.textAreaTokens.clearInputPaddingRightWithRightContent, _TextArea.textAreaTokens.inputPaddingBottom, _TextArea.textAreaTokens.inputPaddingBottomWithHelpers, _TextArea.textAreaTokens.inputPaddingLeft, _TextArea.textAreaTokens.helpersPaddingTop, _TextArea.textAreaTokens.clearHelpersPaddingTop, _TextArea.textAreaTokens.helpersPaddingRight, _TextArea.textAreaTokens.helpersPaddingBottom, _TextArea.textAreaTokens.helpersPaddingLeft, _TextArea.textAreaTokens.helpersOffset, _TextArea.textAreaTokens.rightContentTop, _TextArea.textAreaTokens.rightContentRight, _TextArea.textAreaTokens.rightContentHeight, _TextArea.textAreaTokens.labelMarginBottom, _TextArea.textAreaTokens.clearLabelMarginBottom, _TextArea.textAreaTokens.labelInnerFontFamily, _TextArea.textAreaTokens.labelInnerFontSize, _TextArea.textAreaTokens.labelInnerFontStyle, _TextArea.textAreaTokens.labelInnerFontWeight, _TextArea.textAreaTokens.labelInnerLetterSpacing, _TextArea.textAreaTokens.labelInnerLineHeight, _TextArea.textAreaTokens.labelInnerTop, _TextArea.textAreaTokens.labelInnerMarginBottom, _TextArea.textAreaTokens.inputFontFamily, _TextArea.textAreaTokens.inputFontSize, _TextArea.textAreaTokens.inputFontStyle, _TextArea.textAreaTokens.inputFontWeight, _TextArea.textAreaTokens.inputLetterSpacing, _TextArea.textAreaTokens.inputLineHeight, _TextArea.textAreaTokens.helpersFontFamily, _TextArea.textAreaTokens.helpersFontSize, _TextArea.textAreaTokens.helpersFontStyle, _TextArea.textAreaTokens.helpersFontWeight, _TextArea.textAreaTokens.helpersLetterSpacing, _TextArea.textAreaTokens.helpersLineHeight, _TextArea.textAreaTokens.indicatorSizeInner, _TextArea.textAreaTokens.indicatorSizeOuter, _TextArea.textAreaTokens.indicatorLabelPlacementInner, _TextArea.textAreaTokens.indicatorLabelPlacementOuter, _TextArea.textAreaTokens.indicatorLabelPlacementInnerRight, _TextArea.textAreaTokens.indicatorLabelPlacementOuterRight, _TextArea.textAreaTokens.clearIndicatorLabelPlacementInner, _TextArea.textAreaTokens.clearIndicatorLabelPlacementInnerRight)
20
20
  },
21
21
  view: {
22
- "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-tertiary);", ":var(--text-tertiary-hover);", ":var(--text-tertiary-hover);", ":var(--text-accent);", ":var(--text-primary);", ":var(--text-primary);", ":var(--text-primary);", ":var(--text-accent);", ":var(--text-secondary);", ":var(--text-tertiary);", ":var(--text-secondary);", ":var(--text-tertiary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--surface-negative);", ":var(--text-tertiary);", ":var(--surface-transparent-tertiary);", ":var(--surface-transparent-tertiary-hover);", ":var(--surface-transparent-tertiary-active);", ":var(--surface-transparent-primary);", ":var(--surface-transparent-primary-active);", ":var(--surface-transparent-primary-hover);", ":var(--surface-transparent-tertiary);", ":var(--text-secondary);", ":var(--surface-accent);"], _TextArea.textAreaTokens.inputBorderColor, _TextArea.textAreaTokens.inputBorderColorHover, _TextArea.textAreaTokens.inputBorderColorActive, _TextArea.textAreaTokens.inputBorderColorFocus, _TextArea.textAreaTokens.inputColor, _TextArea.textAreaTokens.clearInputColor, _TextArea.textAreaTokens.inputColorFocus, _TextArea.textAreaTokens.inputCaretColor, _TextArea.textAreaTokens.placeholderColor, _TextArea.textAreaTokens.placeholderColorFocus, _TextArea.textAreaTokens.clearPlaceholderColor, _TextArea.textAreaTokens.clearPlaceholderColorFocus, _TextArea.textAreaTokens.leftHelperColor, _TextArea.textAreaTokens.rightHelperColor, _TextArea.textAreaTokens.indicatorColor, _TextArea.textAreaTokens.optionalColor, _TextArea.textAreaTokens.scrollbarThumbBackgroundColor, _TextArea.textAreaTokens.scrollbarThumbBackgroundColorHover, _TextArea.textAreaTokens.scrollbarThumbBackgroundColorActive, _TextArea.textAreaTokens.scrollbarTrackBackgroundColor, _TextArea.textAreaTokens.scrollbarTrackBackgroundColorActive, _TextArea.textAreaTokens.scrollbarTrackBackgroundColorHover, _TextArea.textAreaTokens.dividerColor, _TextArea.textAreaTokens.dividerColorHover, _TextArea.textAreaTokens.dividerColorFocus),
23
- positive: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-positive);", ":var(--text-positive-hover);", ":var(--text-positive-hover);", ":var(--text-positive);", ":var(--text-primary);", ":var(--text-positive);", ":var(--text-positive);", ":var(--text-positive);", ":var(--text-primary);", ":var(--text-positive);", ":var(--text-secondary);", ":var(--text-tertiary);", ":var(--text-positive);", ":var(--text-secondary);", ":var(--surface-negative);", ":var(--text-tertiary);", ":var(--surface-transparent-tertiary);", ":var(--surface-transparent-tertiary-hover);", ":var(--surface-transparent-tertiary-active);", ":var(--surface-transparent-primary);", ":var(--surface-transparent-primary-active);", ":var(--surface-transparent-primary-hover);", ":var(--surface-positive);", ":var(--surface-positive);", ":var(--surface-accent);"], _TextArea.textAreaTokens.inputBorderColor, _TextArea.textAreaTokens.inputBorderColorHover, _TextArea.textAreaTokens.inputBorderColorActive, _TextArea.textAreaTokens.inputBorderColorFocus, _TextArea.textAreaTokens.inputColor, _TextArea.textAreaTokens.clearInputColor, _TextArea.textAreaTokens.clearPlaceholderColor, _TextArea.textAreaTokens.clearPlaceholderColorFocus, _TextArea.textAreaTokens.inputColorFocus, _TextArea.textAreaTokens.inputCaretColor, _TextArea.textAreaTokens.placeholderColor, _TextArea.textAreaTokens.placeholderColorFocus, _TextArea.textAreaTokens.leftHelperColor, _TextArea.textAreaTokens.rightHelperColor, _TextArea.textAreaTokens.indicatorColor, _TextArea.textAreaTokens.optionalColor, _TextArea.textAreaTokens.scrollbarThumbBackgroundColor, _TextArea.textAreaTokens.scrollbarThumbBackgroundColorHover, _TextArea.textAreaTokens.scrollbarThumbBackgroundColorActive, _TextArea.textAreaTokens.scrollbarTrackBackgroundColor, _TextArea.textAreaTokens.scrollbarTrackBackgroundColorActive, _TextArea.textAreaTokens.scrollbarTrackBackgroundColorHover, _TextArea.textAreaTokens.dividerColor, _TextArea.textAreaTokens.dividerColorHover, _TextArea.textAreaTokens.dividerColorFocus),
24
- warning: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-warning);", ":var(--text-warning-hover);", ":var(--text-warning-hover);", ":var(--text-warning);", ":var(--text-primary);", ":var(--text-warning);", ":var(--text-warning);", ":var(--text-warning);", ":var(--text-primary);", ":var(--text-warning);", ":var(--text-secondary);", ":var(--text-tertiary);", ":var(--text-warning);", ":var(--text-secondary);", ":var(--surface-negative);", ":var(--text-tertiary);", ":var(--surface-transparent-tertiary);", ":var(--surface-transparent-tertiary-hover);", ":var(--surface-transparent-tertiary-active);", ":var(--surface-transparent-primary);", ":var(--surface-transparent-primary-active);", ":var(--surface-transparent-primary-hover);", ":var(--surface-warning);", ":var(--surface-warning);", ":var(--surface-accent);"], _TextArea.textAreaTokens.inputBorderColor, _TextArea.textAreaTokens.inputBorderColorHover, _TextArea.textAreaTokens.inputBorderColorActive, _TextArea.textAreaTokens.inputBorderColorFocus, _TextArea.textAreaTokens.inputColor, _TextArea.textAreaTokens.clearInputColor, _TextArea.textAreaTokens.clearPlaceholderColor, _TextArea.textAreaTokens.clearPlaceholderColorFocus, _TextArea.textAreaTokens.inputColorFocus, _TextArea.textAreaTokens.inputCaretColor, _TextArea.textAreaTokens.placeholderColor, _TextArea.textAreaTokens.placeholderColorFocus, _TextArea.textAreaTokens.leftHelperColor, _TextArea.textAreaTokens.rightHelperColor, _TextArea.textAreaTokens.indicatorColor, _TextArea.textAreaTokens.optionalColor, _TextArea.textAreaTokens.scrollbarThumbBackgroundColor, _TextArea.textAreaTokens.scrollbarThumbBackgroundColorHover, _TextArea.textAreaTokens.scrollbarThumbBackgroundColorActive, _TextArea.textAreaTokens.scrollbarTrackBackgroundColor, _TextArea.textAreaTokens.scrollbarTrackBackgroundColorActive, _TextArea.textAreaTokens.scrollbarTrackBackgroundColorHover, _TextArea.textAreaTokens.dividerColor, _TextArea.textAreaTokens.dividerColorHover, _TextArea.textAreaTokens.dividerColorFocus),
25
- negative: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-negative);", ":var(--text-negative-hover);", ":var(--text-negative-hover);", ":var(--text-negative);", ":var(--text-primary);", ":var(--text-negative);", ":var(--text-negative);", ":var(--text-negative);", ":var(--text-primary);", ":var(--text-negative);", ":var(--text-secondary);", ":var(--text-tertiary);", ":var(--text-negative);", ":var(--text-secondary);", ":var(--surface-negative);", ":var(--text-tertiary);", ":var(--surface-transparent-tertiary);", ":var(--surface-transparent-tertiary-hover);", ":var(--surface-transparent-tertiary-active);", ":var(--surface-transparent-primary);", ":var(--surface-transparent-primary-active);", ":var(--surface-transparent-primary-hover);", ":var(--surface-negative);", ":var(--surface-negative);", ":var(--surface-accent);"], _TextArea.textAreaTokens.inputBorderColor, _TextArea.textAreaTokens.inputBorderColorHover, _TextArea.textAreaTokens.inputBorderColorActive, _TextArea.textAreaTokens.inputBorderColorFocus, _TextArea.textAreaTokens.inputColor, _TextArea.textAreaTokens.clearInputColor, _TextArea.textAreaTokens.clearPlaceholderColor, _TextArea.textAreaTokens.clearPlaceholderColorFocus, _TextArea.textAreaTokens.inputColorFocus, _TextArea.textAreaTokens.inputCaretColor, _TextArea.textAreaTokens.placeholderColor, _TextArea.textAreaTokens.placeholderColorFocus, _TextArea.textAreaTokens.leftHelperColor, _TextArea.textAreaTokens.rightHelperColor, _TextArea.textAreaTokens.indicatorColor, _TextArea.textAreaTokens.optionalColor, _TextArea.textAreaTokens.scrollbarThumbBackgroundColor, _TextArea.textAreaTokens.scrollbarThumbBackgroundColorHover, _TextArea.textAreaTokens.scrollbarThumbBackgroundColorActive, _TextArea.textAreaTokens.scrollbarTrackBackgroundColor, _TextArea.textAreaTokens.scrollbarTrackBackgroundColorActive, _TextArea.textAreaTokens.scrollbarTrackBackgroundColorHover, _TextArea.textAreaTokens.dividerColor, _TextArea.textAreaTokens.dividerColorHover, _TextArea.textAreaTokens.dividerColorFocus)
22
+ "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-tertiary);", ":var(--text-tertiary-hover);", ":var(--text-tertiary-hover);", ":var(--text-accent);", ":var(--text-primary);", ":var(--text-primary);", ":var(--text-primary);", ":var(--text-accent);", ":var(--text-secondary);", ":var(--text-tertiary);", ":var(--text-secondary);", ":var(--text-tertiary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--surface-negative);", ":var(--text-tertiary);", ":var(--surface-transparent-tertiary);", ":var(--text-secondary);", ":var(--surface-accent);"], _TextArea.textAreaTokens.inputBorderColor, _TextArea.textAreaTokens.inputBorderColorHover, _TextArea.textAreaTokens.inputBorderColorActive, _TextArea.textAreaTokens.inputBorderColorFocus, _TextArea.textAreaTokens.inputColor, _TextArea.textAreaTokens.clearInputColor, _TextArea.textAreaTokens.inputColorFocus, _TextArea.textAreaTokens.inputCaretColor, _TextArea.textAreaTokens.placeholderColor, _TextArea.textAreaTokens.placeholderColorFocus, _TextArea.textAreaTokens.clearPlaceholderColor, _TextArea.textAreaTokens.clearPlaceholderColorFocus, _TextArea.textAreaTokens.leftHelperColor, _TextArea.textAreaTokens.rightHelperColor, _TextArea.textAreaTokens.indicatorColor, _TextArea.textAreaTokens.optionalColor, _TextArea.textAreaTokens.dividerColor, _TextArea.textAreaTokens.dividerColorHover, _TextArea.textAreaTokens.dividerColorFocus),
23
+ positive: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-positive);", ":var(--text-positive-hover);", ":var(--text-positive-hover);", ":var(--text-positive);", ":var(--text-primary);", ":var(--text-positive);", ":var(--text-positive);", ":var(--text-positive);", ":var(--text-primary);", ":var(--text-positive);", ":var(--text-secondary);", ":var(--text-tertiary);", ":var(--text-positive);", ":var(--text-secondary);", ":var(--surface-negative);", ":var(--text-tertiary);", ":var(--surface-positive);", ":var(--surface-positive);", ":var(--surface-accent);"], _TextArea.textAreaTokens.inputBorderColor, _TextArea.textAreaTokens.inputBorderColorHover, _TextArea.textAreaTokens.inputBorderColorActive, _TextArea.textAreaTokens.inputBorderColorFocus, _TextArea.textAreaTokens.inputColor, _TextArea.textAreaTokens.clearInputColor, _TextArea.textAreaTokens.clearPlaceholderColor, _TextArea.textAreaTokens.clearPlaceholderColorFocus, _TextArea.textAreaTokens.inputColorFocus, _TextArea.textAreaTokens.inputCaretColor, _TextArea.textAreaTokens.placeholderColor, _TextArea.textAreaTokens.placeholderColorFocus, _TextArea.textAreaTokens.leftHelperColor, _TextArea.textAreaTokens.rightHelperColor, _TextArea.textAreaTokens.indicatorColor, _TextArea.textAreaTokens.optionalColor, _TextArea.textAreaTokens.dividerColor, _TextArea.textAreaTokens.dividerColorHover, _TextArea.textAreaTokens.dividerColorFocus),
24
+ warning: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-warning);", ":var(--text-warning-hover);", ":var(--text-warning-hover);", ":var(--text-warning);", ":var(--text-primary);", ":var(--text-warning);", ":var(--text-warning);", ":var(--text-warning);", ":var(--text-primary);", ":var(--text-warning);", ":var(--text-secondary);", ":var(--text-tertiary);", ":var(--text-warning);", ":var(--text-secondary);", ":var(--surface-negative);", ":var(--text-tertiary);", ":var(--surface-warning);", ":var(--surface-warning);", ":var(--surface-accent);"], _TextArea.textAreaTokens.inputBorderColor, _TextArea.textAreaTokens.inputBorderColorHover, _TextArea.textAreaTokens.inputBorderColorActive, _TextArea.textAreaTokens.inputBorderColorFocus, _TextArea.textAreaTokens.inputColor, _TextArea.textAreaTokens.clearInputColor, _TextArea.textAreaTokens.clearPlaceholderColor, _TextArea.textAreaTokens.clearPlaceholderColorFocus, _TextArea.textAreaTokens.inputColorFocus, _TextArea.textAreaTokens.inputCaretColor, _TextArea.textAreaTokens.placeholderColor, _TextArea.textAreaTokens.placeholderColorFocus, _TextArea.textAreaTokens.leftHelperColor, _TextArea.textAreaTokens.rightHelperColor, _TextArea.textAreaTokens.indicatorColor, _TextArea.textAreaTokens.optionalColor, _TextArea.textAreaTokens.dividerColor, _TextArea.textAreaTokens.dividerColorHover, _TextArea.textAreaTokens.dividerColorFocus),
25
+ negative: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-negative);", ":var(--text-negative-hover);", ":var(--text-negative-hover);", ":var(--text-negative);", ":var(--text-primary);", ":var(--text-negative);", ":var(--text-negative);", ":var(--text-negative);", ":var(--text-primary);", ":var(--text-negative);", ":var(--text-secondary);", ":var(--text-tertiary);", ":var(--text-negative);", ":var(--text-secondary);", ":var(--surface-negative);", ":var(--text-tertiary);", ":var(--surface-negative);", ":var(--surface-negative);", ":var(--surface-accent);"], _TextArea.textAreaTokens.inputBorderColor, _TextArea.textAreaTokens.inputBorderColorHover, _TextArea.textAreaTokens.inputBorderColorActive, _TextArea.textAreaTokens.inputBorderColorFocus, _TextArea.textAreaTokens.inputColor, _TextArea.textAreaTokens.clearInputColor, _TextArea.textAreaTokens.clearPlaceholderColor, _TextArea.textAreaTokens.clearPlaceholderColorFocus, _TextArea.textAreaTokens.inputColorFocus, _TextArea.textAreaTokens.inputCaretColor, _TextArea.textAreaTokens.placeholderColor, _TextArea.textAreaTokens.placeholderColorFocus, _TextArea.textAreaTokens.leftHelperColor, _TextArea.textAreaTokens.rightHelperColor, _TextArea.textAreaTokens.indicatorColor, _TextArea.textAreaTokens.optionalColor, _TextArea.textAreaTokens.dividerColor, _TextArea.textAreaTokens.dividerColorHover, _TextArea.textAreaTokens.dividerColorFocus)
26
26
  },
27
27
  clear: {
28
28
  "true": /*#__PURE__*/(0, _styledComponents.css)([""])
@@ -5,7 +5,7 @@ import type { StoryObj, Meta } from '@storybook/react';
5
5
  import { WithTheme } from '../../../_helpers';
6
6
  import { Button } from '../Button/Button';
7
7
  import { PopoverPlacement } from '../Popover/Popover';
8
- import { IconDisclosureRight } from '../../../../components/_Icon';
8
+ import { IconDisclosureRightCentered } from '../../../../components/_Icon';
9
9
 
10
10
  import { Tooltip } from './Tooltip';
11
11
  import type { TooltipProps } from './Tooltip';
@@ -166,7 +166,7 @@ const StoryLive = (args: TooltipProps) => {
166
166
  aria-describedby="example-tooltip-firstname"
167
167
  />
168
168
  }
169
- contentLeft={<IconDisclosureRight size="xs" />}
169
+ contentLeft={<IconDisclosureRightCentered size="xs" />}
170
170
  {...args}
171
171
  id="example-tooltip-firstname"
172
172
  text={text}
@@ -2,7 +2,7 @@ import styled from 'styled-components';
2
2
  import { css } from 'styled-components';
3
3
  import { linkConfig } from '../Link';
4
4
  import { component, mergeConfig } from '../../engines';
5
- import { IconDisclosureRight } from '../_Icon';
5
+ import { IconDisclosureRightCentered } from '../_Icon';
6
6
  import { addFocus } from '../../mixins';
7
7
  import { tokens } from './Breadcrumbs.tokens';
8
8
  var mergedLinkConfig = /*#__PURE__*/mergeConfig(linkConfig);
@@ -19,6 +19,6 @@ export var StyledLink = /*#__PURE__*/styled(Link).withConfig({
19
19
  outlineColor: /*#__PURE__*/"var(".concat(tokens.breadcrumbsFocusOutlineColor, ")")
20
20
  }));
21
21
  export var base = /*#__PURE__*/css(["display:flex;flex-direction:row;align-items:center;gap:var(", ");color:var(", ");font-family:var(", ");font-size:var(", ");font-weight:var(", ");font-style:var(", ");letter-spacing:var(", ");line-height:var(", ");"], tokens.breadcrumbsGap, tokens.breadcrumbsColor, tokens.breadcrumbsFontFamily, tokens.breadcrumbsFontSize, tokens.breadcrumbsFontWeight, tokens.breadcrumbsFontStyle, tokens.breadcrumbsLetterSpacing, tokens.breadcrumbsLineHeight);
22
- export var Separator = /*#__PURE__*/styled(IconDisclosureRight).withConfig({
22
+ export var Separator = /*#__PURE__*/styled(IconDisclosureRightCentered).withConfig({
23
23
  componentId: "plasma-new-hope__sc-4bjoev-1"
24
24
  })(["color:var(", ");opacity:var(", ");"], tokens.breadcrumbsColor, tokens.breadcrumbsOpacity);
@@ -1,5 +1,5 @@
1
1
  import React, { useCallback, useMemo } from 'react';
2
- import { IconDisclosureDownFill, IconDisclosureLeft, IconDisclosureRight } from '../../../_Icon';
2
+ import { IconDisclosureDownFill, IconDisclosureLeftCentered, IconDisclosureRightCentered } from '../../../_Icon';
3
3
  import { CalendarState } from '../../store/types';
4
4
  import { getCalendarType, MONTH_NAMES, YEAR_RENDER_COUNT } from '../../utils';
5
5
  import { classes } from '../../Calendar.tokens';
@@ -63,7 +63,7 @@ export var CalendarHeader = function CalendarHeader(_ref) {
63
63
  onClick: function onClick() {
64
64
  return onPrev();
65
65
  }
66
- }, /*#__PURE__*/React.createElement(IconDisclosureLeft, {
66
+ }, /*#__PURE__*/React.createElement(IconDisclosureLeftCentered, {
67
67
  color: "inherit",
68
68
  size: size === 'xs' ? 'xs' : 's'
69
69
  }));
@@ -74,7 +74,7 @@ export var CalendarHeader = function CalendarHeader(_ref) {
74
74
  onClick: function onClick() {
75
75
  return onNext();
76
76
  }
77
- }, /*#__PURE__*/React.createElement(IconDisclosureRight, {
77
+ }, /*#__PURE__*/React.createElement(IconDisclosureRightCentered, {
78
78
  color: "inherit",
79
79
  size: size === 'xs' ? 'xs' : 's'
80
80
  }));
@@ -0,0 +1,61 @@
1
+ https://mui.com/material-ui/api/select/
2
+
3
+ Segment
4
+
5
+ SegmentGroup
6
+ variations/
7
+ SegmentGroup.tsx
8
+ SegmentGroup.styles.ts
9
+ SegmentGroup.types.ts
10
+
11
+ SegmentItem
12
+ variations/
13
+ SegmentItem.tsx
14
+ SegmentItem.styles.ts
15
+ SegmentItem.types.ts
16
+
17
+ ```ts
18
+ type SegmentValue = string | number;
19
+
20
+ interface SegmentItem {
21
+ value: SegmentValue;
22
+ label?: string;
23
+ }
24
+
25
+ interface SegmentGroup {
26
+ defaultValue?: SegmentValue | SegmentValue[];
27
+ value?: SegmentValue | SegmentValue[];
28
+ items: SegmentItem[];
29
+ customItem?: ({ item, selected, vertical }: { item: SegmentItem; selected: boolean; vertical: boolean }) => void;
30
+ onChange?: ({ item, selected }: { item: SegmentItem; selected: boolean }) => void;
31
+ view?: 'clear' | 'filled';
32
+ size?: 'm' | 's' | 'l' | 'xs';
33
+ disabled?: boolean;
34
+ pilled?: boolean;
35
+ filledBackground?: boolean;
36
+ stretch?: boolean;
37
+ vertical?: boolean;
38
+ selectionMode?: 'multiple' | 'single';
39
+ }
40
+
41
+ interface SegmentItem {
42
+ view?: 'clear' | 'filled';
43
+ size?: 'm' | 's' | 'l' | 'xs';
44
+ pilled?: boolean;
45
+ label?: ReactNode;
46
+ stretch?: boolean;
47
+ selectionMode?: 'multiple' | 'single';
48
+ }
49
+ ```
50
+
51
+ ```jsx
52
+ <SegmentGroup
53
+ defaultValue={['a']}
54
+ value={''}
55
+ items={[
56
+ { value: 'a', label: 'A' },
57
+ { value: 'b', label: 'B' },
58
+ ]}
59
+ onChange(({ value }) => void)
60
+ />
61
+ ```
@@ -2,7 +2,11 @@ export var classes = {
2
2
  selectedSegmentItem: 'selected-segment-item',
3
3
  segmentPilled: 'segment-pilled',
4
4
  segmentGroupFilledBackground: 'segment-group-filled-background',
5
- segmentStretch: 'segment-stretched'
5
+ segmentStretch: 'segment-stretched',
6
+ segmentVertical: 'segment-vertical',
7
+ segmentArrowPadding: 'segment-arrow-padding',
8
+ segmentXsSize: 'segment-xs-size',
9
+ segmentAdditionalText: 'segment-additional-text'
6
10
  };
7
11
  export var tokens = {
8
12
  fontFamily: '--plasma-segment-item-font-family',
@@ -17,6 +21,8 @@ export var tokens = {
17
21
  groupPilledBorderRadius: '--plasma-segment-group-pilled-border-radius',
18
22
  groupWidth: '--plasma-segment-group-width',
19
23
  groupHeight: '--plasma-segment-group-height',
24
+ groupArrowPadding: '--plasma-segment-group-arrow-padding',
25
+ groupVerticalArrowPadding: '--plasma-segment-group-vertical-arrow-padding',
20
26
  groupBackgroundColor: '--plasma-segment-group-background-color',
21
27
  groupFilledBackgroundColor: '--plasma-segment-group-filled-background-color',
22
28
  itemBorderRadius: '--plasma-segment-item-border-radius',
@@ -24,14 +30,21 @@ export var tokens = {
24
30
  itemWidth: '--plasma-segment-item-width',
25
31
  itemHeight: '--plasma-segment-item-height',
26
32
  itemPadding: '--plasma-segment-item-padding',
33
+ itemPilledPadding: '--plasma-segment-item-pilled-padding',
27
34
  itemMarginLeft: '--plasma-segment-item-margin-left',
35
+ itemContentPadding: '--plasma-segment-item-content-padding',
36
+ itemIconMargin: '--plasma-segment-item-content-icon-margin',
28
37
  itemColor: '--plasma-segment-item-color',
29
38
  itemBackgroundColor: '--plasma-segment-item-background-color',
30
39
  itemColorHover: '--plasma-segment-item-color-hover',
31
40
  itemBackgroundColorHover: '--plasma-segment-item-background-color-hover',
41
+ itemAdditionalColor: '--plasma-segment-item-additional-color',
42
+ itemAdditionalColorHover: '--plasma-segment-item-additional-color-hover',
32
43
  itemSelectedColor: '--plasma-segment-item-selected-color',
33
44
  itemSelectedBackgroundColor: '--plasma-segment-item-selected-background-color',
34
45
  itemSelectedColorHover: '--plasma-segment-item-selected-color-hover',
35
46
  itemSelectedBackgroundColorHover: '--plasma-segment-item-selected-background-color-hover',
47
+ itemSelectedAdditionalColor: '--plasma-segment-item-selected-additional-color',
48
+ itemSelectedAdditionalColorHover: '--plasma-segment-item-selected-additional-color-hover',
36
49
  disabledOpacity: '--plasma-segment-disabled-opacity'
37
50
  };
@@ -1,17 +1,10 @@
1
- var _excluded = ["id", "selectionMode", "pilled", "stretch", "filledBackground", "disabled", "size", "view", "children"];
1
+ var _excluded = ["id", "selectionMode", "pilled", "stretch", "orientation", "filledBackground", "hasBackground", "disabled", "size", "view", "children"];
2
2
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
3
- function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
4
- function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
5
- function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
6
- function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
7
- function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
8
- function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
9
3
  function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
10
4
  function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
11
- import React, { forwardRef, useCallback, useMemo, useState, Children, useEffect } from 'react';
12
- import { safeUseId, useCarousel } from '@salutejs/plasma-core';
13
- import { IconDisclosureLeft, IconDisclosureRight } from '../../../_Icon';
14
- import { classes, tokens } from '../../tokens';
5
+ import React, { forwardRef, useCallback, useEffect, useRef } from 'react';
6
+ import { safeUseId } from '@salutejs/plasma-core';
7
+ import { classes } from '../../tokens';
15
8
  import { cx } from '../../../../utils';
16
9
  import { useSegmentInner } from '../../SegmentProvider/SegmentProvider';
17
10
  import { base as sizeCSS } from './variations/_size/base';
@@ -20,150 +13,106 @@ import { base as disabledCSS } from './variations/_disabled/base';
20
13
  import { base as pilledCSS } from './variations/_pilled/base';
21
14
  import { base as filledBackgroundCSS } from './variations/_filledBackgound/base';
22
15
  import { base as stretchCSS } from './variations/_stretch/base';
23
- import { StyledArrow, StyledContent, StyledContentWrapper, base } from './SegmentGroup.styles';
16
+ import { base as orientationCSS } from './variations/_orientation/base';
17
+ import { StyledContent, StyledContentWrapper, base } from './SegmentGroup.styles';
18
+ var Keys = /*#__PURE__*/function (Keys) {
19
+ Keys[Keys["end"] = 35] = "end";
20
+ Keys[Keys["home"] = 36] = "home";
21
+ Keys[Keys["left"] = 37] = "left";
22
+ Keys[Keys["right"] = 39] = "right";
23
+ return Keys;
24
+ }(Keys || {});
25
+ export var getChildNodes = function getChildNodes(wrapper) {
26
+ var container = wrapper === null || wrapper === void 0 ? void 0 : wrapper.firstChild;
27
+ return container ? Array.from(container === null || container === void 0 ? void 0 : container.childNodes) : [];
28
+ };
24
29
  export var segmentGroupRoot = function segmentGroupRoot(Root) {
25
30
  return /*#__PURE__*/forwardRef(function (props, outerRef) {
26
31
  var id = props.id,
27
32
  selectionMode = props.selectionMode,
28
33
  pilled = props.pilled,
29
34
  stretch = props.stretch,
35
+ _props$orientation = props.orientation,
36
+ orientation = _props$orientation === void 0 ? 'horizontal' : _props$orientation,
30
37
  _props$filledBackgrou = props.filledBackground,
31
38
  filledBackground = _props$filledBackgrou === void 0 ? false : _props$filledBackgrou,
39
+ _props$hasBackground = props.hasBackground,
40
+ hasBackground = _props$hasBackground === void 0 ? false : _props$hasBackground,
32
41
  _props$disabled = props.disabled,
33
42
  disabled = _props$disabled === void 0 ? false : _props$disabled,
34
43
  size = props.size,
35
44
  view = props.view,
36
45
  children = props.children,
37
46
  rest = _objectWithoutProperties(props, _excluded);
47
+ var scrollRef = useRef(null);
48
+ var trackRef = useRef(null);
38
49
  var _useSegmentInner = useSegmentInner(),
39
50
  setSelectionMode = _useSegmentInner.setSelectionMode,
40
51
  setDisabledGroup = _useSegmentInner.setDisabledGroup;
41
- var _useState = useState(0),
42
- _useState2 = _slicedToArray(_useState, 2),
43
- index = _useState2[0],
44
- setIndex = _useState2[1];
45
- var _useState3 = useState(false),
46
- _useState4 = _slicedToArray(_useState3, 2),
47
- firstItemVisible = _useState4[0],
48
- setFirstItemVisible = _useState4[1];
49
- var _useState5 = useState(false),
50
- _useState6 = _slicedToArray(_useState5, 2),
51
- lastItemVisible = _useState6[0],
52
- setLastItemVisible = _useState6[1];
53
52
  var uniqId = safeUseId();
54
53
  var segmentGroupId = id || uniqId;
55
- var pilledAttr = view !== 'clear' && pilled;
56
- var filledBackgroundAttr = view !== 'clear' && filledBackground;
54
+ var isVertical = orientation === 'vertical';
55
+ var pilledAttr = hasBackground && pilled;
56
+ var filledBackgroundAttr = filledBackground || hasBackground;
57
+ var stretchClass = stretch ? classes.segmentStretch : undefined;
58
+ var orientationClass = isVertical ? classes.segmentVertical : undefined;
57
59
  var pilledClass = pilledAttr ? classes.segmentPilled : undefined;
58
60
  var filledClass = filledBackgroundAttr ? classes.segmentGroupFilledBackground : undefined;
59
- var stretchClass = firstItemVisible && lastItemVisible && stretch ? classes.segmentStretch : undefined;
60
- var items = (Children === null || Children === void 0 ? void 0 : Children.map(children, function (child) {
61
- return child;
62
- })) || [];
63
- var onPrev = useCallback(function () {
64
- !disabled && setIndex(function (prevIndex) {
65
- return prevIndex > 0 ? prevIndex - 1 : 0;
66
- });
67
- }, [disabled]);
68
- var onNext = useCallback(function () {
69
- !disabled && setIndex(function (prevIndex) {
70
- return prevIndex < items.length - 1 ? prevIndex + 1 : prevIndex;
61
+ var onKeyDown = useCallback(function (event) {
62
+ var childNodes = getChildNodes(scrollRef === null || scrollRef === void 0 ? void 0 : scrollRef.current);
63
+ var index = childNodes.findIndex(function (child) {
64
+ return document.activeElement === child;
71
65
  });
72
- }, [disabled]);
73
- var onIntersecting = function onIntersecting(setVisible) {
74
- return function (entries) {
75
- /*
76
- * Пробегаемся по элементам на которых есть слушатель события появления.
77
- * Если элемент находится в зоне видимости или выходит из нее, меняем значение флага видимости
78
- */
79
- entries.forEach(function (entry) {
80
- if (entry.isIntersecting) {
81
- setVisible(true);
82
- } else {
83
- setVisible(false);
84
- }
66
+ var minIndex = 0;
67
+ var maxIndex = childNodes.length - 1;
68
+ var nextIndex;
69
+ switch (event.keyCode) {
70
+ case Keys.end:
71
+ nextIndex = maxIndex;
72
+ break;
73
+ case Keys.left:
74
+ nextIndex = index > minIndex ? index - 1 : index;
75
+ break;
76
+ case Keys.right:
77
+ nextIndex = index < maxIndex ? index + 1 : index;
78
+ break;
79
+ case Keys.home:
80
+ nextIndex = minIndex;
81
+ break;
82
+ default:
83
+ return;
84
+ }
85
+ if (nextIndex !== index) {
86
+ var _childNodes$nextIndex, _childNodes$nextIndex2;
87
+ event.preventDefault();
88
+ (_childNodes$nextIndex = childNodes[nextIndex]) === null || _childNodes$nextIndex === void 0 || _childNodes$nextIndex.focus();
89
+ (_childNodes$nextIndex2 = childNodes[nextIndex]) === null || _childNodes$nextIndex2 === void 0 || _childNodes$nextIndex2.scrollIntoView({
90
+ block: 'center',
91
+ inline: 'center',
92
+ behavior: 'smooth'
85
93
  });
86
- };
87
- };
88
- var _useCarousel = useCarousel({
89
- index: index,
90
- axis: 'x',
91
- scrollAlign: 'start',
92
- detectActive: true,
93
- debounceMs: 250,
94
- onIndexChange: setIndex
95
- }),
96
- scrollRef = _useCarousel.scrollRef,
97
- trackRef = _useCarousel.trackRef;
98
- var PreviousButton = useMemo(function () {
99
- return /*#__PURE__*/React.createElement(StyledArrow, {
100
- type: "button",
101
- "aria-label": "\u041F\u0440\u0435\u0434\u044B\u0434\u0443\u0449\u0438\u0439 \u0441\u0435\u0433\u043C\u0435\u043D\u0442",
102
- onClick: onPrev,
103
- tabIndex: disabled ? -1 : 0,
104
- disabled: disabled
105
- }, /*#__PURE__*/React.createElement(IconDisclosureLeft, {
106
- color: "var(".concat(tokens.arrowColor, ")")
107
- }));
108
- }, [onPrev]);
109
- var NextButton = useMemo(function () {
110
- return /*#__PURE__*/React.createElement(StyledArrow, {
111
- type: "button",
112
- "aria-label": "\u0421\u043B\u0435\u0434\u0443\u044E\u0449\u0438\u0439 \u0441\u0435\u0433\u043C\u0435\u043D\u0442",
113
- onClick: onNext,
114
- tabIndex: disabled ? -1 : 0,
115
- disabled: disabled
116
- }, /*#__PURE__*/React.createElement(IconDisclosureRight, {
117
- color: "var(".concat(tokens.arrowColor, ")")
118
- }));
119
- }, [onNext]);
94
+ }
95
+ }, []);
120
96
  useEffect(function () {
121
97
  selectionMode && setSelectionMode(selectionMode);
122
98
  setDisabledGroup(disabled);
123
99
  }, [selectionMode, disabled]);
124
- useEffect(function () {
125
- var _trackRef$current;
126
- // Intersection observer для первого сегмента
127
- var observeFirstItem = new IntersectionObserver(onIntersecting(setFirstItemVisible), {
128
- root: null,
129
- rootMargin: '0px',
130
- threshold: 0.5
131
- });
132
-
133
- // Intersection observer для последнего сегмента
134
- var observeLastItem = new IntersectionObserver(onIntersecting(setLastItemVisible), {
135
- root: null,
136
- rootMargin: '0px',
137
- threshold: 0.5
138
- });
139
-
140
- // получаем список сегментов внутри SegmentGroup
141
- var childrenArray = Array.from(((_trackRef$current = trackRef.current) === null || _trackRef$current === void 0 ? void 0 : _trackRef$current.children) || []);
142
- if (childrenArray.length) {
143
- // подписываемся на событие появление внутри SegmentGroup
144
- observeFirstItem.observe(childrenArray[0]);
145
- observeLastItem.observe(childrenArray[childrenArray.length - 1]);
146
- }
147
- return function () {
148
- // отписываемся от события появления внутри SegmentGroup
149
- observeFirstItem.disconnect();
150
- observeLastItem.disconnect();
151
- };
152
- }, [children]);
153
100
  return /*#__PURE__*/React.createElement(Root, _extends({
154
101
  view: view,
155
102
  size: size,
103
+ orientation: orientation,
156
104
  id: segmentGroupId,
157
105
  ref: outerRef,
158
106
  filledBackground: filledBackgroundAttr,
159
107
  disabled: disabled,
160
108
  pilled: pilledAttr,
161
- className: cx(pilledClass, filledClass, stretchClass)
162
- }, rest), !firstItemVisible && PreviousButton, /*#__PURE__*/React.createElement(StyledContentWrapper, {
109
+ className: cx(pilledClass, filledClass, stretchClass, orientationClass),
110
+ onKeyDown: onKeyDown
111
+ }, rest), /*#__PURE__*/React.createElement(StyledContentWrapper, {
163
112
  ref: scrollRef
164
113
  }, /*#__PURE__*/React.createElement(StyledContent, {
165
114
  ref: trackRef
166
- }, children)), !lastItemVisible && NextButton);
115
+ }, children)));
167
116
  });
168
117
  };
169
118
  export var segmentGroupConfig = {
@@ -190,13 +139,15 @@ export var segmentGroupConfig = {
190
139
  css: stretchCSS,
191
140
  attrs: true
192
141
  },
142
+ orientation: {
143
+ css: orientationCSS
144
+ },
193
145
  filledBackground: {
194
146
  css: filledBackgroundCSS,
195
147
  attrs: true
196
148
  }
197
149
  },
198
150
  defaults: {
199
- view: 'clear',
200
151
  size: 'xs'
201
152
  }
202
153
  };
@@ -2,20 +2,11 @@ var _templateObject;
2
2
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
3
3
  import { css } from 'styled-components';
4
4
  import styled from 'styled-components';
5
- import { addFocus } from '../../../../mixins';
6
5
  import { tokens } from '../../tokens';
7
- export var base = /*#__PURE__*/css(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n display: inline-flex;\n align-items: center;\n"])));
6
+ export var base = /*#__PURE__*/css(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteral(["\n display: inline-flex;\n align-items: center;\n max-width: 100%;\n\n &:before {\n border-radius: var(", ");\n }\n"])), tokens.groupBorderRadius);
8
7
  export var StyledContent = /*#__PURE__*/styled.div.withConfig({
9
8
  componentId: "plasma-new-hope__sc-1kj8wok-0"
10
- })(["display:inline-flex;flex-direction:row;align-items:center;"]);
9
+ })(["display:inline-flex;flex-direction:row;align-items:center;max-width:100%;"]);
11
10
  export var StyledContentWrapper = /*#__PURE__*/styled.div.withConfig({
12
11
  componentId: "plasma-new-hope__sc-1kj8wok-1"
13
- })(["position:relative;height:100%;margin:0;padding:0.25rem;::-webkit-scrollbar{display:none;}overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;scroll-snap-type:x mandatory;"]);
14
- export var StyledArrow = /*#__PURE__*/styled.button.withConfig({
15
- componentId: "plasma-new-hope__sc-1kj8wok-2"
16
- })(["display:flex;cursor:pointer;border:none;background-color:transparent;padding:0;outline:none;", ";&[disabled]{cursor:not-allowed;}"], /*#__PURE__*/addFocus({
17
- outlineSize: '0.063rem',
18
- outlineOffset: '-0.125rem',
19
- outlineColor: /*#__PURE__*/"var(".concat(tokens.outlineFocusColor, ")"),
20
- outlineRadius: 'calc(var(--plasma_private-outline-radius) - 0.063rem)'
21
- }));
12
+ })(["position:relative;height:100%;width:100%;display:flex;align-items:center;"]);
@@ -1,3 +1,3 @@
1
1
  import { css } from 'styled-components';
2
2
  import { classes, tokens } from '../../../../tokens';
3
- export var base = /*#__PURE__*/css(["&.", "{background-color:var(", ");}"], /*#__PURE__*/String(classes.segmentGroupFilledBackground), tokens.groupFilledBackgroundColor);
3
+ export var base = /*#__PURE__*/css(["position:relative;&.", "{&:before{content:'';position:absolute;inset:-0.125rem;background-color:var(", ");}}"], /*#__PURE__*/String(classes.segmentGroupFilledBackground), tokens.groupFilledBackgroundColor);
@@ -0,0 +1,4 @@
1
+ import { css } from 'styled-components';
2
+ import { classes } from '../../../../tokens';
3
+ import { StyledContent, StyledContentWrapper } from '../../SegmentGroup.styles';
4
+ export var base = /*#__PURE__*/css(["&.", "{flex-direction:column;", "{flex-direction:column;}", "{flex-direction:column;}}"], classes.segmentVertical, StyledContentWrapper, StyledContent);
@@ -1,3 +1,3 @@
1
1
  import { css } from 'styled-components';
2
2
  import { classes, tokens } from '../../../../tokens';
3
- export var base = /*#__PURE__*/css(["&.", "{--plasma_private-outline-radius:var(", ");border-radius:var(", ");}"], /*#__PURE__*/String(classes.segmentPilled), tokens.groupPilledBorderRadius, tokens.groupPilledBorderRadius);
3
+ export var base = /*#__PURE__*/css(["&.", "{&:before{border-radius:var(", ");}}"], /*#__PURE__*/String(classes.segmentPilled), tokens.groupPilledBorderRadius);
@@ -1,3 +1,3 @@
1
1
  import { css } from 'styled-components';
2
2
  import { tokens } from '../../../../tokens';
3
- export var base = /*#__PURE__*/css(["width:var(", ");height:var(", ");--plasma_private-outline-radius:var(", ");border-radius:var(", ");"], tokens.groupWidth, tokens.groupHeight, tokens.groupBorderRadius, tokens.groupBorderRadius);
3
+ export var base = /*#__PURE__*/css(["width:var(", ");height:var(", ");&:before{border-radius:var(", ");}"], tokens.groupWidth, tokens.groupHeight, tokens.groupBorderRadius);