@salutejs/plasma-new-hope 0.72.0-canary.1160.8617165473.0 → 0.72.0-canary.1161.8613087402.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (434) hide show
  1. package/cjs/components/Cell/Cell.js +0 -2
  2. package/cjs/components/Cell/Cell.js.map +1 -1
  3. package/cjs/components/Combobox/Combobox.css +10 -10
  4. package/cjs/components/Combobox/Combobox.styles.js +5 -5
  5. package/cjs/components/Combobox/Combobox.styles.js.map +1 -1
  6. package/cjs/components/Combobox/{Combobox.styles_17ei5vn.css → Combobox.styles_dw6hnk.css} +1 -1
  7. package/cjs/components/Combobox/ui/ComboboxDivider/ComboboxDivider.css +4 -4
  8. package/cjs/components/Combobox/ui/ComboboxFooter/ComboboxFooter.css +4 -4
  9. package/cjs/components/Combobox/ui/ComboboxGroup/ComboboxGroup.css +4 -4
  10. package/cjs/components/Combobox/ui/ComboboxHeader/ComboboxHeader.css +4 -4
  11. package/cjs/components/Combobox/ui/ComboboxItem/ComboboxItem.css +4 -4
  12. package/cjs/components/Dropdown/Dropdown.css +4 -4
  13. package/cjs/components/Dropdown/Dropdown.js +0 -1
  14. package/cjs/components/Dropdown/Dropdown.js.map +1 -1
  15. package/cjs/components/Pagination/Pagination.css +4 -4
  16. package/cjs/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.css +4 -4
  17. package/cjs/components/Popover/Popover.css +4 -4
  18. package/cjs/components/Popover/Popover.js +33 -43
  19. package/cjs/components/Popover/Popover.js.map +1 -1
  20. package/cjs/components/Popover/Popover.styles.js +1 -1
  21. package/cjs/components/Popover/Popover.styles.js.map +1 -1
  22. package/{es/components/Popover/Popover.styles_1rk9t6z.css → cjs/components/Popover/Popover.styles_1ggb66y.css} +1 -1
  23. package/cjs/components/Select/Select.css +4 -4
  24. package/cjs/components/Select/ui/SelectDivider/SelectDivider.css +23 -0
  25. package/cjs/components/Select/ui/SelectDivider/SelectDivider.js +40 -0
  26. package/cjs/components/Select/ui/SelectDivider/SelectDivider.js.map +1 -0
  27. package/cjs/components/Select/ui/SelectDivider/SelectDivider.styles.js +12 -0
  28. package/cjs/components/Select/ui/SelectDivider/SelectDivider.styles.js.map +1 -0
  29. package/cjs/components/Select/ui/SelectDivider/SelectDivider.styles_673hj6.css +1 -0
  30. package/cjs/components/{TextField/variations/_view → Select/ui/SelectDivider/variations/_size}/base.js +2 -2
  31. package/cjs/components/Select/ui/SelectDivider/variations/_size/base.js.map +1 -0
  32. package/cjs/components/{TextField/variations/_read-only → Select/ui/SelectDivider/variations/_view}/base.js +2 -2
  33. package/cjs/components/Select/ui/SelectDivider/variations/_view/base.js.map +1 -0
  34. package/cjs/components/Select/ui/SelectFooter/SelectFooter.css +23 -0
  35. package/cjs/components/Select/ui/SelectFooter/SelectFooter.js +40 -0
  36. package/cjs/components/Select/ui/SelectFooter/SelectFooter.js.map +1 -0
  37. package/cjs/components/Select/ui/SelectFooter/SelectFooter.styles.js +12 -0
  38. package/cjs/components/Select/ui/SelectFooter/SelectFooter.styles.js.map +1 -0
  39. package/cjs/components/Select/ui/SelectFooter/SelectFooter.styles_11hk6tt.css +1 -0
  40. package/cjs/components/{TextField → Select/ui/SelectFooter}/variations/_size/base.js +2 -2
  41. package/cjs/components/Select/ui/SelectFooter/variations/_size/base.js.map +1 -0
  42. package/cjs/components/Select/ui/SelectFooter/variations/_size/base_x642ct.css +1 -0
  43. package/cjs/components/Select/ui/SelectFooter/variations/_view/base.js +9 -0
  44. package/cjs/components/Select/ui/SelectFooter/variations/_view/base.js.map +1 -0
  45. package/cjs/components/Select/ui/SelectFooter/variations/_view/base_x642ct.css +1 -0
  46. package/cjs/components/Select/ui/SelectGroup/SelectGroup.css +23 -0
  47. package/cjs/components/Select/ui/SelectGroup/SelectGroup.js +40 -0
  48. package/cjs/components/Select/ui/SelectGroup/SelectGroup.js.map +1 -0
  49. package/cjs/components/Select/ui/SelectGroup/SelectGroup.styles.js +12 -0
  50. package/cjs/components/Select/ui/SelectGroup/SelectGroup.styles.js.map +1 -0
  51. package/cjs/components/Select/ui/SelectGroup/SelectGroup.styles_mktu7e.css +1 -0
  52. package/cjs/components/Select/ui/SelectGroup/variations/_size/base.js +9 -0
  53. package/cjs/components/Select/ui/SelectGroup/variations/_size/base.js.map +1 -0
  54. package/cjs/components/Select/ui/SelectGroup/variations/_size/base_x642ct.css +1 -0
  55. package/cjs/components/Select/ui/SelectGroup/variations/_view/base.js +9 -0
  56. package/cjs/components/Select/ui/SelectGroup/variations/_view/base.js.map +1 -0
  57. package/cjs/components/Select/ui/SelectGroup/variations/_view/base_x642ct.css +1 -0
  58. package/cjs/components/Select/ui/SelectHeader/SelectHeader.css +23 -0
  59. package/cjs/components/Select/ui/SelectHeader/SelectHeader.js +40 -0
  60. package/cjs/components/Select/ui/SelectHeader/SelectHeader.js.map +1 -0
  61. package/cjs/components/Select/ui/SelectHeader/SelectHeader.styles.js +12 -0
  62. package/cjs/components/Select/ui/SelectHeader/SelectHeader.styles.js.map +1 -0
  63. package/cjs/components/Select/ui/SelectHeader/SelectHeader.styles_24gqog.css +1 -0
  64. package/cjs/components/Select/ui/SelectHeader/variations/_size/base.js +9 -0
  65. package/cjs/components/Select/ui/SelectHeader/variations/_size/base.js.map +1 -0
  66. package/cjs/components/Select/ui/SelectHeader/variations/_size/base_x642ct.css +1 -0
  67. package/cjs/components/Select/ui/SelectHeader/variations/_view/base.js +9 -0
  68. package/cjs/components/Select/ui/SelectHeader/variations/_view/base.js.map +1 -0
  69. package/cjs/components/Select/ui/SelectHeader/variations/_view/base_x642ct.css +1 -0
  70. package/cjs/components/Select/ui/SelectItem/SelectItem.css +4 -4
  71. package/cjs/components/Select/ui/SelectTarget/SelectTarget.js +2 -1
  72. package/cjs/components/Select/ui/SelectTarget/SelectTarget.js.map +1 -1
  73. package/cjs/components/TextField/TextField.js +40 -166
  74. package/cjs/components/TextField/TextField.js.map +1 -1
  75. package/cjs/components/TextField/TextField.styles.js +11 -27
  76. package/cjs/components/TextField/TextField.styles.js.map +1 -1
  77. package/cjs/components/TextField/TextField.styles_2qw1n8.css +5 -0
  78. package/cjs/components/TextField/TextField.tokens.js +20 -68
  79. package/cjs/components/TextField/TextField.tokens.js.map +1 -1
  80. package/cjs/components/TextField/TextField_1lzb2r1.css +1 -0
  81. package/cjs/components/TextField/{variations/_disabled → _disabled}/base.js +2 -2
  82. package/cjs/components/TextField/_disabled/base.js.map +1 -0
  83. package/cjs/components/TextField/_disabled/base_so3w81.css +1 -0
  84. package/cjs/components/TextField/{variations/_label-placement → _label-placement}/base.js +1 -1
  85. package/cjs/components/TextField/_label-placement/base.js.map +1 -0
  86. package/cjs/components/TextField/_label-placement/base_x642ct.css +1 -0
  87. package/cjs/components/TextField/{variations/_label-placement → _label-placement}/inner.js +2 -2
  88. package/cjs/components/TextField/_label-placement/inner.js.map +1 -0
  89. package/cjs/components/TextField/_label-placement/inner_1tyuicp.css +1 -0
  90. package/cjs/components/TextField/{variations/_label-placement → _label-placement}/outer.js +2 -2
  91. package/cjs/components/TextField/_label-placement/outer.js.map +1 -0
  92. package/cjs/components/TextField/_label-placement/outer_19ekaek.css +1 -0
  93. package/cjs/components/TextField/_size/base.js +9 -0
  94. package/cjs/components/TextField/_size/base.js.map +1 -0
  95. package/cjs/components/TextField/_size/base_b5smyu.css +1 -0
  96. package/cjs/components/TextField/_view/base.js +9 -0
  97. package/cjs/components/TextField/_view/base.js.map +1 -0
  98. package/cjs/components/TextField/_view/base_5bqzed.css +1 -0
  99. package/cjs/index.css +42 -49
  100. package/cjs/index.js +41 -6
  101. package/cjs/index.js.map +1 -1
  102. package/cjs/utils/index.js +13 -1
  103. package/cjs/utils/index.js.map +1 -1
  104. package/cjs/utils/react.js +12 -2
  105. package/cjs/utils/react.js.map +1 -1
  106. package/es/components/Cell/Cell.js +0 -2
  107. package/es/components/Cell/Cell.js.map +1 -1
  108. package/es/components/Combobox/Combobox.css +10 -10
  109. package/es/components/Combobox/Combobox.styles.js +5 -5
  110. package/es/components/Combobox/Combobox.styles.js.map +1 -1
  111. package/es/components/Combobox/{Combobox.styles_17ei5vn.css → Combobox.styles_dw6hnk.css} +1 -1
  112. package/es/components/Combobox/ui/ComboboxDivider/ComboboxDivider.css +4 -4
  113. package/es/components/Combobox/ui/ComboboxFooter/ComboboxFooter.css +4 -4
  114. package/es/components/Combobox/ui/ComboboxGroup/ComboboxGroup.css +4 -4
  115. package/es/components/Combobox/ui/ComboboxHeader/ComboboxHeader.css +4 -4
  116. package/es/components/Combobox/ui/ComboboxItem/ComboboxItem.css +4 -4
  117. package/es/components/Dropdown/Dropdown.css +4 -4
  118. package/es/components/Dropdown/Dropdown.js +0 -1
  119. package/es/components/Dropdown/Dropdown.js.map +1 -1
  120. package/es/components/Pagination/Pagination.css +4 -4
  121. package/es/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.css +4 -4
  122. package/es/components/Popover/Popover.css +4 -4
  123. package/es/components/Popover/Popover.js +33 -43
  124. package/es/components/Popover/Popover.js.map +1 -1
  125. package/es/components/Popover/Popover.styles.js +1 -1
  126. package/es/components/Popover/Popover.styles.js.map +1 -1
  127. package/{cjs/components/Popover/Popover.styles_1rk9t6z.css → es/components/Popover/Popover.styles_1ggb66y.css} +1 -1
  128. package/es/components/Select/Select.css +4 -4
  129. package/es/components/Select/ui/SelectDivider/SelectDivider.css +23 -0
  130. package/es/components/Select/ui/SelectDivider/SelectDivider.js +35 -0
  131. package/es/components/Select/ui/SelectDivider/SelectDivider.js.map +1 -0
  132. package/es/components/Select/ui/SelectDivider/SelectDivider.styles.js +7 -0
  133. package/es/components/Select/ui/SelectDivider/SelectDivider.styles.js.map +1 -0
  134. package/es/components/Select/ui/SelectDivider/SelectDivider.styles_673hj6.css +1 -0
  135. package/es/components/{TextField/variations/_view → Select/ui/SelectDivider/variations/_size}/base.js +2 -2
  136. package/es/components/Select/ui/SelectDivider/variations/_size/base.js.map +1 -0
  137. package/es/components/Select/ui/SelectDivider/variations/_size/base_x642ct.css +1 -0
  138. package/es/components/Select/ui/SelectDivider/variations/_view/base.js +5 -0
  139. package/es/components/Select/ui/SelectDivider/variations/_view/base.js.map +1 -0
  140. package/es/components/Select/ui/SelectDivider/variations/_view/base_x642ct.css +1 -0
  141. package/es/components/Select/ui/SelectFooter/SelectFooter.css +23 -0
  142. package/es/components/Select/ui/SelectFooter/SelectFooter.js +35 -0
  143. package/es/components/Select/ui/SelectFooter/SelectFooter.js.map +1 -0
  144. package/es/components/Select/ui/SelectFooter/SelectFooter.styles.js +7 -0
  145. package/es/components/Select/ui/SelectFooter/SelectFooter.styles.js.map +1 -0
  146. package/es/components/Select/ui/SelectFooter/SelectFooter.styles_11hk6tt.css +1 -0
  147. package/es/components/Select/ui/SelectFooter/variations/_size/base.js +5 -0
  148. package/es/components/Select/ui/SelectFooter/variations/_size/base.js.map +1 -0
  149. package/es/components/Select/ui/SelectFooter/variations/_size/base_x642ct.css +1 -0
  150. package/es/components/Select/ui/SelectFooter/variations/_view/base.js +5 -0
  151. package/es/components/Select/ui/SelectFooter/variations/_view/base.js.map +1 -0
  152. package/es/components/Select/ui/SelectFooter/variations/_view/base_x642ct.css +1 -0
  153. package/es/components/Select/ui/SelectGroup/SelectGroup.css +23 -0
  154. package/es/components/Select/ui/SelectGroup/SelectGroup.js +35 -0
  155. package/es/components/Select/ui/SelectGroup/SelectGroup.js.map +1 -0
  156. package/es/components/Select/ui/SelectGroup/SelectGroup.styles.js +7 -0
  157. package/es/components/Select/ui/SelectGroup/SelectGroup.styles.js.map +1 -0
  158. package/es/components/Select/ui/SelectGroup/SelectGroup.styles_mktu7e.css +1 -0
  159. package/es/components/Select/ui/SelectGroup/variations/_size/base.js +5 -0
  160. package/es/components/Select/ui/SelectGroup/variations/_size/base.js.map +1 -0
  161. package/es/components/Select/ui/SelectGroup/variations/_size/base_x642ct.css +1 -0
  162. package/es/components/Select/ui/SelectGroup/variations/_view/base.js +5 -0
  163. package/es/components/Select/ui/SelectGroup/variations/_view/base.js.map +1 -0
  164. package/es/components/Select/ui/SelectGroup/variations/_view/base_x642ct.css +1 -0
  165. package/es/components/Select/ui/SelectHeader/SelectHeader.css +23 -0
  166. package/es/components/Select/ui/SelectHeader/SelectHeader.js +35 -0
  167. package/es/components/Select/ui/SelectHeader/SelectHeader.js.map +1 -0
  168. package/es/components/Select/ui/SelectHeader/SelectHeader.styles.js +7 -0
  169. package/es/components/Select/ui/SelectHeader/SelectHeader.styles.js.map +1 -0
  170. package/es/components/Select/ui/SelectHeader/SelectHeader.styles_24gqog.css +1 -0
  171. package/es/components/Select/ui/SelectHeader/variations/_size/base.js +5 -0
  172. package/es/components/Select/ui/SelectHeader/variations/_size/base.js.map +1 -0
  173. package/es/components/Select/ui/SelectHeader/variations/_size/base_x642ct.css +1 -0
  174. package/es/components/Select/ui/SelectHeader/variations/_view/base.js +5 -0
  175. package/es/components/Select/ui/SelectHeader/variations/_view/base.js.map +1 -0
  176. package/es/components/Select/ui/SelectHeader/variations/_view/base_x642ct.css +1 -0
  177. package/es/components/Select/ui/SelectItem/SelectItem.css +4 -4
  178. package/es/components/Select/ui/SelectTarget/SelectTarget.js +2 -1
  179. package/es/components/Select/ui/SelectTarget/SelectTarget.js.map +1 -1
  180. package/es/components/TextField/TextField.js +44 -169
  181. package/es/components/TextField/TextField.js.map +1 -1
  182. package/es/components/TextField/TextField.styles.js +12 -25
  183. package/es/components/TextField/TextField.styles.js.map +1 -1
  184. package/es/components/TextField/TextField.styles_2qw1n8.css +5 -0
  185. package/es/components/TextField/TextField.tokens.js +21 -68
  186. package/es/components/TextField/TextField.tokens.js.map +1 -1
  187. package/es/components/TextField/TextField_1lzb2r1.css +1 -0
  188. package/es/components/TextField/_disabled/base.js +5 -0
  189. package/es/components/TextField/_disabled/base.js.map +1 -0
  190. package/es/components/TextField/_disabled/base_so3w81.css +1 -0
  191. package/es/components/TextField/{variations/_label-placement → _label-placement}/base.js +1 -1
  192. package/es/components/TextField/_label-placement/base.js.map +1 -0
  193. package/es/components/TextField/_label-placement/base_x642ct.css +1 -0
  194. package/es/components/TextField/_label-placement/inner.js +5 -0
  195. package/es/components/TextField/_label-placement/inner.js.map +1 -0
  196. package/es/components/TextField/_label-placement/inner_1tyuicp.css +1 -0
  197. package/es/components/TextField/_label-placement/outer.js +5 -0
  198. package/es/components/TextField/_label-placement/outer.js.map +1 -0
  199. package/es/components/TextField/_label-placement/outer_19ekaek.css +1 -0
  200. package/es/components/TextField/_size/base.js +5 -0
  201. package/es/components/TextField/_size/base.js.map +1 -0
  202. package/es/components/TextField/_size/base_b5smyu.css +1 -0
  203. package/es/components/TextField/_view/base.js +5 -0
  204. package/es/components/TextField/_view/base.js.map +1 -0
  205. package/es/components/TextField/_view/base_5bqzed.css +1 -0
  206. package/es/index.css +42 -49
  207. package/es/index.js +15 -2
  208. package/es/index.js.map +1 -1
  209. package/es/utils/index.js +11 -2
  210. package/es/utils/index.js.map +1 -1
  211. package/es/utils/react.js +9 -2
  212. package/es/utils/react.js.map +1 -1
  213. package/package.json +2 -2
  214. package/styled-components/cjs/components/Cell/Cell.js +0 -2
  215. package/styled-components/cjs/components/Combobox/Combobox.styles.js +1 -1
  216. package/styled-components/cjs/components/Dropdown/Dropdown.js +0 -1
  217. package/styled-components/cjs/components/Popover/Popover.js +33 -43
  218. package/styled-components/cjs/components/Popover/Popover.styles.js +1 -1
  219. package/styled-components/cjs/components/Select/ui/SelectTarget/SelectTarget.js +2 -1
  220. package/styled-components/cjs/components/TextField/TextField.js +43 -173
  221. package/styled-components/cjs/components/TextField/TextField.styles.js +10 -18
  222. package/styled-components/cjs/components/TextField/TextField.template-doc.mdx +0 -24
  223. package/styled-components/cjs/components/TextField/TextField.tokens.js +21 -68
  224. package/styled-components/cjs/components/TextField/_disabled/base.js +9 -0
  225. package/styled-components/cjs/components/TextField/_label-placement/inner.js +10 -0
  226. package/styled-components/cjs/components/TextField/{variations/_label-placement → _label-placement}/outer.js +3 -3
  227. package/styled-components/cjs/components/TextField/_size/base.js +10 -0
  228. package/styled-components/cjs/components/TextField/_view/base.js +10 -0
  229. package/styled-components/cjs/components/TextField/index.js +2 -2
  230. package/styled-components/cjs/examples/plasma_b2c/components/Popover/Popover.stories.tsx +0 -7
  231. package/styled-components/cjs/index.js +22 -0
  232. package/styled-components/es/components/Cell/Cell.js +0 -2
  233. package/styled-components/es/components/Combobox/Combobox.styles.js +1 -1
  234. package/styled-components/es/components/Dropdown/Dropdown.js +0 -1
  235. package/styled-components/es/components/Popover/Popover.js +33 -43
  236. package/styled-components/es/components/Popover/Popover.styles.js +1 -1
  237. package/styled-components/es/components/Select/ui/SelectTarget/SelectTarget.js +2 -1
  238. package/styled-components/es/components/TextField/TextField.js +47 -177
  239. package/styled-components/es/components/TextField/TextField.styles.js +9 -17
  240. package/styled-components/es/components/TextField/TextField.template-doc.mdx +0 -24
  241. package/styled-components/es/components/TextField/TextField.tokens.js +20 -67
  242. package/styled-components/es/components/TextField/_disabled/base.js +3 -0
  243. package/styled-components/es/components/TextField/_label-placement/inner.js +4 -0
  244. package/styled-components/es/components/TextField/_label-placement/outer.js +4 -0
  245. package/styled-components/es/components/TextField/_size/base.js +4 -0
  246. package/styled-components/es/components/TextField/_view/base.js +4 -0
  247. package/styled-components/es/components/TextField/index.js +2 -2
  248. package/styled-components/es/examples/plasma_b2c/components/Popover/Popover.stories.tsx +0 -7
  249. package/styled-components/es/index.js +2 -0
  250. package/types/components/Cell/Cell.d.ts.map +1 -1
  251. package/types/components/Combobox/Combobox.styles.d.ts +2 -8
  252. package/types/components/Combobox/Combobox.styles.d.ts.map +1 -1
  253. package/types/components/Dropdown/Dropdown.d.ts.map +1 -1
  254. package/types/components/Dropdown/Dropdown.styles.d.ts +1 -7
  255. package/types/components/Dropdown/Dropdown.styles.d.ts.map +1 -1
  256. package/types/components/Popover/Popover.d.ts +2 -2
  257. package/types/components/Popover/Popover.d.ts.map +1 -1
  258. package/types/components/Popover/Popover.styles.d.ts.map +1 -1
  259. package/types/components/Popover/Popover.types.d.ts +12 -19
  260. package/types/components/Popover/Popover.types.d.ts.map +1 -1
  261. package/types/components/Select/Select.styles.d.ts +2 -8
  262. package/types/components/Select/Select.styles.d.ts.map +1 -1
  263. package/types/components/Select/ui/SelectTarget/SelectTarget.d.ts.map +1 -1
  264. package/types/components/TextField/TextField.d.ts +3 -8
  265. package/types/components/TextField/TextField.d.ts.map +1 -1
  266. package/types/components/TextField/TextField.styles.d.ts +3 -6
  267. package/types/components/TextField/TextField.styles.d.ts.map +1 -1
  268. package/types/components/TextField/TextField.tokens.d.ts +8 -57
  269. package/types/components/TextField/TextField.tokens.d.ts.map +1 -1
  270. package/types/components/TextField/TextField.types.d.ts +6 -71
  271. package/types/components/TextField/TextField.types.d.ts.map +1 -1
  272. package/types/components/TextField/_disabled/base.d.ts.map +1 -0
  273. package/types/components/TextField/_label-placement/base.d.ts.map +1 -0
  274. package/types/components/TextField/_label-placement/index.d.ts.map +1 -0
  275. package/types/components/TextField/_label-placement/inner.d.ts.map +1 -0
  276. package/types/components/TextField/_label-placement/outer.d.ts.map +1 -0
  277. package/types/components/TextField/_size/base.d.ts.map +1 -0
  278. package/types/components/TextField/_view/base.d.ts.map +1 -0
  279. package/types/components/TextField/index.d.ts +2 -3
  280. package/types/components/TextField/index.d.ts.map +1 -1
  281. package/types/examples/plasma_b2c/components/Popover/Popover.d.ts +1 -7
  282. package/types/examples/plasma_b2c/components/Popover/Popover.d.ts.map +1 -1
  283. package/types/examples/plasma_web/components/Popover/Popover.d.ts +1 -7
  284. package/types/examples/plasma_web/components/Popover/Popover.d.ts.map +1 -1
  285. package/types/examples/sds_engineer/components/Popover/Popover.d.ts +1 -7
  286. package/types/examples/sds_engineer/components/Popover/Popover.d.ts.map +1 -1
  287. package/types/index.d.ts +2 -0
  288. package/types/index.d.ts.map +1 -1
  289. package/cjs/components/TextField/TextField.styles_1b1mddp.css +0 -8
  290. package/cjs/components/TextField/TextField_wctd2m.css +0 -1
  291. package/cjs/components/TextField/hooks/useKeyNavigation.js +0 -132
  292. package/cjs/components/TextField/hooks/useKeyNavigation.js.map +0 -1
  293. package/cjs/components/TextField/ui/TextFieldChip/TextFieldChip.css +0 -19
  294. package/cjs/components/TextField/ui/TextFieldChip/TextFieldChip.js +0 -38
  295. package/cjs/components/TextField/ui/TextFieldChip/TextFieldChip.js.map +0 -1
  296. package/cjs/components/TextField/ui/TextFieldChip/TextFieldChip.styles.js +0 -26
  297. package/cjs/components/TextField/ui/TextFieldChip/TextFieldChip.styles.js.map +0 -1
  298. package/cjs/components/TextField/ui/TextFieldChip/TextFieldChip.styles_1y8n7la.css +0 -1
  299. package/cjs/components/TextField/variations/_disabled/base.js.map +0 -1
  300. package/cjs/components/TextField/variations/_disabled/base_1tnjoy9.css +0 -1
  301. package/cjs/components/TextField/variations/_label-placement/base.js.map +0 -1
  302. package/cjs/components/TextField/variations/_label-placement/inner.js.map +0 -1
  303. package/cjs/components/TextField/variations/_label-placement/inner_gqlcj2.css +0 -1
  304. package/cjs/components/TextField/variations/_label-placement/outer.js.map +0 -1
  305. package/cjs/components/TextField/variations/_label-placement/outer_is41nj.css +0 -1
  306. package/cjs/components/TextField/variations/_read-only/base.js.map +0 -1
  307. package/cjs/components/TextField/variations/_read-only/base_134hshp.css +0 -1
  308. package/cjs/components/TextField/variations/_size/base.js.map +0 -1
  309. package/cjs/components/TextField/variations/_size/base_1khzr9t.css +0 -1
  310. package/cjs/components/TextField/variations/_view/base.js.map +0 -1
  311. package/cjs/components/TextField/variations/_view/base_1qd77x6.css +0 -1
  312. package/es/components/TextField/TextField.styles_1b1mddp.css +0 -8
  313. package/es/components/TextField/TextField_wctd2m.css +0 -1
  314. package/es/components/TextField/hooks/useKeyNavigation.js +0 -127
  315. package/es/components/TextField/hooks/useKeyNavigation.js.map +0 -1
  316. package/es/components/TextField/ui/TextFieldChip/TextFieldChip.css +0 -19
  317. package/es/components/TextField/ui/TextFieldChip/TextFieldChip.js +0 -34
  318. package/es/components/TextField/ui/TextFieldChip/TextFieldChip.js.map +0 -1
  319. package/es/components/TextField/ui/TextFieldChip/TextFieldChip.styles.js +0 -22
  320. package/es/components/TextField/ui/TextFieldChip/TextFieldChip.styles.js.map +0 -1
  321. package/es/components/TextField/ui/TextFieldChip/TextFieldChip.styles_1y8n7la.css +0 -1
  322. package/es/components/TextField/variations/_disabled/base.js +0 -5
  323. package/es/components/TextField/variations/_disabled/base.js.map +0 -1
  324. package/es/components/TextField/variations/_disabled/base_1tnjoy9.css +0 -1
  325. package/es/components/TextField/variations/_label-placement/base.js.map +0 -1
  326. package/es/components/TextField/variations/_label-placement/inner.js +0 -5
  327. package/es/components/TextField/variations/_label-placement/inner.js.map +0 -1
  328. package/es/components/TextField/variations/_label-placement/inner_gqlcj2.css +0 -1
  329. package/es/components/TextField/variations/_label-placement/outer.js +0 -5
  330. package/es/components/TextField/variations/_label-placement/outer.js.map +0 -1
  331. package/es/components/TextField/variations/_label-placement/outer_is41nj.css +0 -1
  332. package/es/components/TextField/variations/_read-only/base.js +0 -5
  333. package/es/components/TextField/variations/_read-only/base.js.map +0 -1
  334. package/es/components/TextField/variations/_read-only/base_134hshp.css +0 -1
  335. package/es/components/TextField/variations/_size/base.js +0 -5
  336. package/es/components/TextField/variations/_size/base.js.map +0 -1
  337. package/es/components/TextField/variations/_size/base_1khzr9t.css +0 -1
  338. package/es/components/TextField/variations/_view/base.js.map +0 -1
  339. package/es/components/TextField/variations/_view/base_1qd77x6.css +0 -1
  340. package/styled-components/cjs/components/TextField/hooks/index.js +0 -12
  341. package/styled-components/cjs/components/TextField/hooks/useKeyNavigation.js +0 -138
  342. package/styled-components/cjs/components/TextField/ui/TextFieldChip/TextFieldChip.js +0 -39
  343. package/styled-components/cjs/components/TextField/ui/TextFieldChip/TextFieldChip.styles.js +0 -25
  344. package/styled-components/cjs/components/TextField/ui/TextFieldChip/TextFieldChip.types.js +0 -5
  345. package/styled-components/cjs/components/TextField/ui/index.js +0 -12
  346. package/styled-components/cjs/components/TextField/variations/_disabled/base.js +0 -10
  347. package/styled-components/cjs/components/TextField/variations/_label-placement/inner.js +0 -10
  348. package/styled-components/cjs/components/TextField/variations/_read-only/base.js +0 -10
  349. package/styled-components/cjs/components/TextField/variations/_read-only/tokens.json +0 -1
  350. package/styled-components/cjs/components/TextField/variations/_size/base.js +0 -10
  351. package/styled-components/cjs/components/TextField/variations/_view/base.js +0 -10
  352. package/styled-components/cjs/examples/plasma_b2c/components/TextField/TextField.config.js +0 -43
  353. package/styled-components/cjs/examples/plasma_b2c/components/TextField/TextField.js +0 -11
  354. package/styled-components/cjs/examples/plasma_b2c/components/TextField/TextField.stories.tsx +0 -181
  355. package/styled-components/cjs/examples/plasma_web/components/TextField/TextField.config.js +0 -40
  356. package/styled-components/cjs/examples/plasma_web/components/TextField/TextField.js +0 -11
  357. package/styled-components/cjs/examples/plasma_web/components/TextField/TextField.stories.tsx +0 -181
  358. package/styled-components/cjs/examples/sds_engineer/components/TextField/TextField.config.js +0 -43
  359. package/styled-components/cjs/examples/sds_engineer/components/TextField/TextField.js +0 -11
  360. package/styled-components/cjs/examples/sds_engineer/components/TextField/TextField.stories.tsx +0 -181
  361. package/styled-components/es/components/TextField/hooks/index.js +0 -1
  362. package/styled-components/es/components/TextField/hooks/useKeyNavigation.js +0 -132
  363. package/styled-components/es/components/TextField/ui/TextFieldChip/TextFieldChip.js +0 -30
  364. package/styled-components/es/components/TextField/ui/TextFieldChip/TextFieldChip.styles.js +0 -19
  365. package/styled-components/es/components/TextField/ui/TextFieldChip/TextFieldChip.types.js +0 -1
  366. package/styled-components/es/components/TextField/ui/index.js +0 -1
  367. package/styled-components/es/components/TextField/variations/_disabled/base.js +0 -4
  368. package/styled-components/es/components/TextField/variations/_label-placement/inner.js +0 -4
  369. package/styled-components/es/components/TextField/variations/_label-placement/outer.js +0 -4
  370. package/styled-components/es/components/TextField/variations/_read-only/base.js +0 -4
  371. package/styled-components/es/components/TextField/variations/_read-only/tokens.json +0 -1
  372. package/styled-components/es/components/TextField/variations/_size/base.js +0 -4
  373. package/styled-components/es/components/TextField/variations/_view/base.js +0 -4
  374. package/styled-components/es/examples/plasma_b2c/components/TextField/TextField.config.js +0 -37
  375. package/styled-components/es/examples/plasma_b2c/components/TextField/TextField.js +0 -5
  376. package/styled-components/es/examples/plasma_b2c/components/TextField/TextField.stories.tsx +0 -181
  377. package/styled-components/es/examples/plasma_web/components/TextField/TextField.config.js +0 -34
  378. package/styled-components/es/examples/plasma_web/components/TextField/TextField.js +0 -5
  379. package/styled-components/es/examples/plasma_web/components/TextField/TextField.stories.tsx +0 -181
  380. package/styled-components/es/examples/sds_engineer/components/TextField/TextField.config.js +0 -37
  381. package/styled-components/es/examples/sds_engineer/components/TextField/TextField.js +0 -5
  382. package/styled-components/es/examples/sds_engineer/components/TextField/TextField.stories.tsx +0 -181
  383. package/types/components/TextField/hooks/index.d.ts +0 -2
  384. package/types/components/TextField/hooks/index.d.ts.map +0 -1
  385. package/types/components/TextField/hooks/useKeyNavigation.d.ts +0 -17
  386. package/types/components/TextField/hooks/useKeyNavigation.d.ts.map +0 -1
  387. package/types/components/TextField/ui/TextFieldChip/TextFieldChip.d.ts +0 -7
  388. package/types/components/TextField/ui/TextFieldChip/TextFieldChip.d.ts.map +0 -1
  389. package/types/components/TextField/ui/TextFieldChip/TextFieldChip.styles.d.ts +0 -3
  390. package/types/components/TextField/ui/TextFieldChip/TextFieldChip.styles.d.ts.map +0 -1
  391. package/types/components/TextField/ui/TextFieldChip/TextFieldChip.types.d.ts +0 -37
  392. package/types/components/TextField/ui/TextFieldChip/TextFieldChip.types.d.ts.map +0 -1
  393. package/types/components/TextField/ui/index.d.ts +0 -2
  394. package/types/components/TextField/ui/index.d.ts.map +0 -1
  395. package/types/components/TextField/variations/_disabled/base.d.ts.map +0 -1
  396. package/types/components/TextField/variations/_label-placement/base.d.ts.map +0 -1
  397. package/types/components/TextField/variations/_label-placement/index.d.ts.map +0 -1
  398. package/types/components/TextField/variations/_label-placement/inner.d.ts.map +0 -1
  399. package/types/components/TextField/variations/_label-placement/outer.d.ts.map +0 -1
  400. package/types/components/TextField/variations/_read-only/base.d.ts.map +0 -1
  401. package/types/components/TextField/variations/_size/base.d.ts.map +0 -1
  402. package/types/components/TextField/variations/_view/base.d.ts +0 -2
  403. package/types/components/TextField/variations/_view/base.d.ts.map +0 -1
  404. package/types/examples/plasma_b2c/components/TextField/TextField.config.d.ts +0 -32
  405. package/types/examples/plasma_b2c/components/TextField/TextField.config.d.ts.map +0 -1
  406. package/types/examples/plasma_b2c/components/TextField/TextField.d.ts +0 -60
  407. package/types/examples/plasma_b2c/components/TextField/TextField.d.ts.map +0 -1
  408. package/types/examples/plasma_web/components/TextField/TextField.config.d.ts +0 -32
  409. package/types/examples/plasma_web/components/TextField/TextField.config.d.ts.map +0 -1
  410. package/types/examples/plasma_web/components/TextField/TextField.d.ts +0 -60
  411. package/types/examples/plasma_web/components/TextField/TextField.d.ts.map +0 -1
  412. package/types/examples/sds_engineer/components/TextField/TextField.config.d.ts +0 -32
  413. package/types/examples/sds_engineer/components/TextField/TextField.config.d.ts.map +0 -1
  414. package/types/examples/sds_engineer/components/TextField/TextField.d.ts +0 -60
  415. package/types/examples/sds_engineer/components/TextField/TextField.d.ts.map +0 -1
  416. /package/cjs/components/{TextField/variations/_label-placement → Select/ui/SelectDivider/variations/_size}/base_x642ct.css +0 -0
  417. /package/{es/components/TextField/variations/_label-placement → cjs/components/Select/ui/SelectDivider/variations/_view}/base_x642ct.css +0 -0
  418. /package/styled-components/cjs/components/TextField/{variations/_disabled → _disabled}/tokens.json +0 -0
  419. /package/styled-components/cjs/components/TextField/{variations/_label-placement → _label-placement}/base.js +0 -0
  420. /package/styled-components/cjs/components/TextField/{variations/_label-placement → _label-placement}/index.js +0 -0
  421. /package/styled-components/cjs/components/TextField/{variations/_size → _size}/tokens.json +0 -0
  422. /package/styled-components/cjs/components/TextField/{variations/_view → _view}/tokens.json +0 -0
  423. /package/styled-components/es/components/TextField/{variations/_disabled → _disabled}/tokens.json +0 -0
  424. /package/styled-components/es/components/TextField/{variations/_label-placement → _label-placement}/base.js +0 -0
  425. /package/styled-components/es/components/TextField/{variations/_label-placement → _label-placement}/index.js +0 -0
  426. /package/styled-components/es/components/TextField/{variations/_size → _size}/tokens.json +0 -0
  427. /package/styled-components/es/components/TextField/{variations/_view → _view}/tokens.json +0 -0
  428. /package/types/components/TextField/{variations/_disabled → _disabled}/base.d.ts +0 -0
  429. /package/types/components/TextField/{variations/_label-placement → _label-placement}/base.d.ts +0 -0
  430. /package/types/components/TextField/{variations/_label-placement → _label-placement}/index.d.ts +0 -0
  431. /package/types/components/TextField/{variations/_label-placement → _label-placement}/inner.d.ts +0 -0
  432. /package/types/components/TextField/{variations/_label-placement → _label-placement}/outer.d.ts +0 -0
  433. /package/types/components/TextField/{variations/_read-only → _size}/base.d.ts +0 -0
  434. /package/types/components/TextField/{variations/_size → _view}/base.d.ts +0 -0
@@ -1,181 +0,0 @@
1
- import React, { ComponentProps, useState } from 'react';
2
- import type { StoryObj, Meta } from '@storybook/react';
3
- import { action } from '@storybook/addon-actions';
4
- import { IconPlaceholder } from '@salutejs/plasma-sb-utils';
5
-
6
- import { WithTheme } from '../../../_helpers';
7
-
8
- import { TextField } from './TextField';
9
-
10
- const onChange = action('onChange');
11
- const onFocus = action('onFocus');
12
- const onBlur = action('onBlur');
13
- const onSearch = action('onSearch');
14
- const onChipsChange = action('onChipsChange');
15
-
16
- const sizes = ['l', 'm', 's', 'xs'];
17
- const views = ['default', 'positive', 'warning', 'negative'];
18
- const labelPlacements = ['outer', 'inner'];
19
-
20
- const meta: Meta<typeof TextField> = {
21
- title: 'plasma_web/TextField',
22
- component: TextField,
23
- decorators: [WithTheme],
24
- argTypes: {
25
- view: {
26
- options: views,
27
- control: {
28
- type: 'select',
29
- },
30
- },
31
- maxLength: {
32
- control: {
33
- type: 'number',
34
- },
35
- },
36
- labelPlacement: {
37
- options: labelPlacements,
38
- control: {
39
- type: 'inline-radio',
40
- },
41
- },
42
- size: {
43
- options: sizes,
44
- control: {
45
- type: 'inline-radio',
46
- },
47
- },
48
- },
49
- };
50
-
51
- export default meta;
52
-
53
- type StoryPropsDefault = Omit<
54
- ComponentProps<typeof TextField>,
55
- | 'helperBlock'
56
- | 'contentLeft'
57
- | 'htmlSize'
58
- | 'contentRight'
59
- | 'type'
60
- | 'name'
61
- | 'onFocus'
62
- | 'onBlur'
63
- | 'onChange'
64
- | 'value'
65
- | 'checked'
66
- | 'maxLength'
67
- | 'minLength'
68
- | 'required'
69
- | 'enumerationType'
70
- | 'chips'
71
- | 'onChangeChips'
72
- > & {
73
- 'storybook:contentLeft': boolean;
74
- 'storybook:contentRight': boolean;
75
- };
76
-
77
- const StoryDemo = ({
78
- 'storybook:contentLeft': enableContentLeft,
79
- 'storybook:contentRight': enableContentRight,
80
- view,
81
- ...rest
82
- }: StoryPropsDefault) => {
83
- const [text, setText] = useState('Значение поля');
84
-
85
- const iconSize = rest.size === 'xs' ? 'xs' : 's';
86
-
87
- return (
88
- <TextField
89
- {...rest}
90
- enumerationType="plain"
91
- value={text}
92
- contentLeft={enableContentLeft ? <IconPlaceholder size={iconSize} /> : undefined}
93
- contentRight={enableContentRight ? <IconPlaceholder size={iconSize} /> : undefined}
94
- view={view}
95
- onChange={(e) => {
96
- setText(e.target.value);
97
- onChange(e.target.value);
98
- }}
99
- onFocus={onFocus}
100
- onBlur={onBlur}
101
- onSearch={onSearch}
102
- />
103
- );
104
- };
105
-
106
- export const Default: StoryObj<StoryPropsDefault> = {
107
- args: {
108
- id: 'example-text-field',
109
- size: 'l',
110
- view: 'default',
111
- label: 'Лейбл',
112
- labelPlacement: 'outer',
113
- placeholder: 'Заполните поле',
114
- leftHelper: 'Подсказка к полю',
115
- disabled: false,
116
- readOnly: false,
117
- 'storybook:contentLeft': true,
118
- 'storybook:contentRight': true,
119
- },
120
- render: (args) => <StoryDemo {...args} />,
121
- };
122
-
123
- type StoryPropsChips = Omit<
124
- ComponentProps<typeof TextField>,
125
- | 'helperBlock'
126
- | 'contentLeft'
127
- | 'htmlSize'
128
- | 'contentRight'
129
- | 'type'
130
- | 'name'
131
- | 'onFocus'
132
- | 'onBlur'
133
- | 'onChange'
134
- | 'onSearch'
135
- | 'value'
136
- | 'checked'
137
- | 'maxLength'
138
- | 'minLength'
139
- | 'required'
140
- | 'enumerationType'
141
- > & {
142
- 'storybook:contentLeft': boolean;
143
- 'storybook:contentRight': boolean;
144
- };
145
-
146
- const StoryChips = ({
147
- 'storybook:contentLeft': enableContentLeft,
148
- 'storybook:contentRight': enableContentRight,
149
- view,
150
- ...rest
151
- }: StoryPropsChips) => {
152
- const [text, setText] = useState('Значение поля');
153
-
154
- const iconSize = rest.size === 'xs' ? 'xs' : 's';
155
-
156
- return (
157
- <TextField
158
- {...rest}
159
- enumerationType="chip"
160
- value={text}
161
- contentLeft={enableContentLeft ? <IconPlaceholder size={iconSize} /> : undefined}
162
- contentRight={enableContentRight ? <IconPlaceholder size={iconSize} /> : undefined}
163
- view={view}
164
- onChange={(e) => {
165
- setText(e.target.value);
166
- onChange(e.target.value);
167
- }}
168
- onFocus={onFocus}
169
- onBlur={onBlur}
170
- onChangeChips={onChipsChange}
171
- />
172
- );
173
- };
174
-
175
- export const Chips: StoryObj<StoryPropsChips> = {
176
- args: {
177
- ...Default.args,
178
- chips: ['1 value', '2 value', '3 value', '4 value'],
179
- },
180
- render: (args) => <StoryChips {...args} />,
181
- };
@@ -1,43 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.config = void 0;
7
- var _styledComponents = /*#__PURE__*/require("styled-components");
8
- var _TextField = /*#__PURE__*/require("../../../../components/TextField");
9
- var config = exports.config = {
10
- defaults: {
11
- view: 'default',
12
- size: 'l',
13
- labelPlacement: 'outer'
14
- },
15
- variations: {
16
- view: {
17
- "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-primary);", ":var(--surface-transparent-primary);", ":var(--surface-transparent-secondary);", ":var(--text-accent);", ":var(--text-secondary);", ":var(--text-primary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--surface-clear);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-transparent-secondary-hover);", ":var(--text-primary);", ":var(--surface-transparent-secondary-active);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":0.72;", ":var(--text-accent);"], _TextField.textFieldTokens.color, _TextField.textFieldTokens.backgroundColor, _TextField.textFieldTokens.backgroundColorFocus, _TextField.textFieldTokens.caretColor, _TextField.textFieldTokens.placeholderColor, _TextField.textFieldTokens.labelColor, _TextField.textFieldTokens.leftHelperColor, _TextField.textFieldTokens.colorReadOnly, _TextField.textFieldTokens.backgroundColorReadOnly, _TextField.textFieldTokens.placeholderColorReadOnly, _TextField.textFieldTokens.chipCloseIconColor, _TextField.textFieldTokens.chipColor, _TextField.textFieldTokens.chipBackground, _TextField.textFieldTokens.chipColorHover, _TextField.textFieldTokens.chipBackgroundHover, _TextField.textFieldTokens.chipColorActive, _TextField.textFieldTokens.chipBackgroundActive, _TextField.textFieldTokens.chipBackgroundReadOnly, _TextField.textFieldTokens.chipColorReadOnly, _TextField.textFieldTokens.chipBackgroundReadOnlyHover, _TextField.textFieldTokens.chipColorReadOnlyHover, _TextField.textFieldTokens.chipOpacityReadonly, _TextField.textFieldTokens.focusColor),
18
- // TODO заменить --surface-transparent-positive на корректный токен
19
- positive: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--plasma-colors-primary);", ":var(--surface-transparent-positive);", ":var(--surface-transparent-positive-active);", ":var(--text-accent);", ":var(--text-secondary);", ":var(--text-primary);", ":var(--text-positive);", ":var(--text-secondary);", ":var(--surface-clear);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-transparent-secondary-hover);", ":var(--text-primary);", ":var(--surface-transparent-secondary-active);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":0.72;", ":var(--text-accent);"], _TextField.textFieldTokens.color, _TextField.textFieldTokens.backgroundColor, _TextField.textFieldTokens.backgroundColorFocus, _TextField.textFieldTokens.caretColor, _TextField.textFieldTokens.placeholderColor, _TextField.textFieldTokens.labelColor, _TextField.textFieldTokens.leftHelperColor, _TextField.textFieldTokens.colorReadOnly, _TextField.textFieldTokens.backgroundColorReadOnly, _TextField.textFieldTokens.placeholderColorReadOnly, _TextField.textFieldTokens.chipCloseIconColor, _TextField.textFieldTokens.chipColor, _TextField.textFieldTokens.chipBackground, _TextField.textFieldTokens.chipColorHover, _TextField.textFieldTokens.chipBackgroundHover, _TextField.textFieldTokens.chipColorActive, _TextField.textFieldTokens.chipBackgroundActive, _TextField.textFieldTokens.chipBackgroundReadOnly, _TextField.textFieldTokens.chipColorReadOnly, _TextField.textFieldTokens.chipBackgroundReadOnlyHover, _TextField.textFieldTokens.chipColorReadOnlyHover, _TextField.textFieldTokens.chipOpacityReadonly, _TextField.textFieldTokens.focusColor),
20
- // // TODO заменить --surface-transparent-warning на корректный токен
21
- warning: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--plasma-colors-primary);", ":var(--surface-transparent-warning);", ":var(--surface-transparent-warning-active);", ":var(--text-accent);", ":var(--text-secondary);", ":var(--text-primary);", ":var(--text-warning);", ":var(--text-secondary);", ":var(--surface-clear);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-transparent-secondary-hover);", ":var(--text-primary);", ":var(--surface-transparent-secondary-active);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":0.72;", ":var(--text-accent);"], _TextField.textFieldTokens.color, _TextField.textFieldTokens.backgroundColor, _TextField.textFieldTokens.backgroundColorFocus, _TextField.textFieldTokens.caretColor, _TextField.textFieldTokens.placeholderColor, _TextField.textFieldTokens.labelColor, _TextField.textFieldTokens.leftHelperColor, _TextField.textFieldTokens.colorReadOnly, _TextField.textFieldTokens.backgroundColorReadOnly, _TextField.textFieldTokens.placeholderColorReadOnly, _TextField.textFieldTokens.chipCloseIconColor, _TextField.textFieldTokens.chipColor, _TextField.textFieldTokens.chipBackground, _TextField.textFieldTokens.chipColorHover, _TextField.textFieldTokens.chipBackgroundHover, _TextField.textFieldTokens.chipColorActive, _TextField.textFieldTokens.chipBackgroundActive, _TextField.textFieldTokens.chipBackgroundReadOnly, _TextField.textFieldTokens.chipColorReadOnly, _TextField.textFieldTokens.chipBackgroundReadOnlyHover, _TextField.textFieldTokens.chipColorReadOnlyHover, _TextField.textFieldTokens.chipOpacityReadonly, _TextField.textFieldTokens.focusColor),
22
- // // TODO заменить --surface-transparent-negative на корректный токен
23
- negative: /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--plasma-colors-primary);", ":var(--surface-transparent-negative);", ":var(--surface-transparent-negative-active);", ":var(--text-accent);", ":var(--text-secondary);", ":var(--text-primary);", ":var(--text-negative);", ":var(--text-secondary);", ":var(--surface-clear);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-transparent-secondary-hover);", ":var(--text-primary);", ":var(--surface-transparent-secondary-active);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":var(--surface-transparent-secondary);", ":var(--text-primary);", ":0.72;", ":var(--text-accent);"], _TextField.textFieldTokens.color, _TextField.textFieldTokens.backgroundColor, _TextField.textFieldTokens.backgroundColorFocus, _TextField.textFieldTokens.caretColor, _TextField.textFieldTokens.placeholderColor, _TextField.textFieldTokens.labelColor, _TextField.textFieldTokens.leftHelperColor, _TextField.textFieldTokens.colorReadOnly, _TextField.textFieldTokens.backgroundColorReadOnly, _TextField.textFieldTokens.placeholderColorReadOnly, _TextField.textFieldTokens.chipCloseIconColor, _TextField.textFieldTokens.chipColor, _TextField.textFieldTokens.chipBackground, _TextField.textFieldTokens.chipColorHover, _TextField.textFieldTokens.chipBackgroundHover, _TextField.textFieldTokens.chipColorActive, _TextField.textFieldTokens.chipBackgroundActive, _TextField.textFieldTokens.chipBackgroundReadOnly, _TextField.textFieldTokens.chipColorReadOnly, _TextField.textFieldTokens.chipBackgroundReadOnlyHover, _TextField.textFieldTokens.chipColorReadOnlyHover, _TextField.textFieldTokens.chipOpacityReadonly, _TextField.textFieldTokens.focusColor)
24
- },
25
- size: {
26
- l: /*#__PURE__*/(0, _styledComponents.css)(["", ":3.5rem;", ":1.0625rem 1.125rem 1.0625rem 1.125rem;", ":0.375rem;", ":0.875rem;", ":-0.0625rem 0.5rem -0.0625rem -0.125rem;", ":-0.0625rem -0.125rem -0.0625rem 0.75rem;", ":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);", ":0.75rem;", ":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);", ":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 0.125rem 0;", ":1.5625rem 0 0.5625rem 0;", ":0.25rem;", ":0.5rem;", ":auto;", ":2.75rem;", ":0.75rem;", ":1rem;", ":0.625rem;", ":0rem;", ":1.5rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);"], _TextField.textFieldTokens.height, _TextField.textFieldTokens.padding, _TextField.textFieldTokens.paddingWithChips, _TextField.textFieldTokens.borderRadius, _TextField.textFieldTokens.leftContentMargin, _TextField.textFieldTokens.rightContentMargin, _TextField.textFieldTokens.fontFamily, _TextField.textFieldTokens.fontSize, _TextField.textFieldTokens.fontStyle, _TextField.textFieldTokens.fontWeight, _TextField.textFieldTokens.letterSpacing, _TextField.textFieldTokens.lineHeight, _TextField.textFieldTokens.labelOffset, _TextField.textFieldTokens.labelFontFamily, _TextField.textFieldTokens.labelFontSize, _TextField.textFieldTokens.labelFontStyle, _TextField.textFieldTokens.labelFontWeight, _TextField.textFieldTokens.labelLetterSpacing, _TextField.textFieldTokens.labelLineHeight, _TextField.textFieldTokens.leftHelperOffset, _TextField.textFieldTokens.leftHelperFontFamily, _TextField.textFieldTokens.leftHelperFontSize, _TextField.textFieldTokens.leftHelperFontStyle, _TextField.textFieldTokens.leftHelperFontWeight, _TextField.textFieldTokens.leftHelperLetterSpacing, _TextField.textFieldTokens.leftHelperLineHeight, _TextField.textFieldTokens.labelInnerPadding, _TextField.textFieldTokens.contentLabelInnerPadding, _TextField.textFieldTokens.chipGap, _TextField.textFieldTokens.chipBorderRadius, _TextField.textFieldTokens.chipWidth, _TextField.textFieldTokens.chipHeight, _TextField.textFieldTokens.chipPaddingRight, _TextField.textFieldTokens.chipPaddingLeft, _TextField.textFieldTokens.chipClearContentMarginLeft, _TextField.textFieldTokens.chipClearContentMarginRight, _TextField.textFieldTokens.chipCloseIconSize, _TextField.textFieldTokens.chipFontFamily, _TextField.textFieldTokens.chipFontSize, _TextField.textFieldTokens.chipFontStyle, _TextField.textFieldTokens.chipFontWeight, _TextField.textFieldTokens.chipLetterSpacing, _TextField.textFieldTokens.chipLineHeight),
27
- m: /*#__PURE__*/(0, _styledComponents.css)(["", ":3rem;", ":0.875rem 1rem 0.875rem 1rem;", ":0.375rem;", ":0.75rem;", ":-0.125rem 0.375rem -0.125rem -0.125rem;", ":-0.125rem -0.125rem -0.125rem 0.75rem;", ":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);", ":0.625rem;", ":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);", ":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 0.125rem 0;", ":1.375rem 0 0.375rem 0;", ":0.25rem;", ":0.375rem;", ":auto;", ":2.25rem;", ":0.625rem;", ":0.875rem;", ":0.5rem;", ":0rem;", ":1.25rem;", ":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);"], _TextField.textFieldTokens.height, _TextField.textFieldTokens.padding, _TextField.textFieldTokens.paddingWithChips, _TextField.textFieldTokens.borderRadius, _TextField.textFieldTokens.leftContentMargin, _TextField.textFieldTokens.rightContentMargin, _TextField.textFieldTokens.fontFamily, _TextField.textFieldTokens.fontSize, _TextField.textFieldTokens.fontStyle, _TextField.textFieldTokens.fontWeight, _TextField.textFieldTokens.letterSpacing, _TextField.textFieldTokens.lineHeight, _TextField.textFieldTokens.labelOffset, _TextField.textFieldTokens.labelFontFamily, _TextField.textFieldTokens.labelFontSize, _TextField.textFieldTokens.labelFontStyle, _TextField.textFieldTokens.labelFontWeight, _TextField.textFieldTokens.labelLetterSpacing, _TextField.textFieldTokens.labelLineHeight, _TextField.textFieldTokens.leftHelperOffset, _TextField.textFieldTokens.leftHelperFontFamily, _TextField.textFieldTokens.leftHelperFontSize, _TextField.textFieldTokens.leftHelperFontStyle, _TextField.textFieldTokens.leftHelperFontWeight, _TextField.textFieldTokens.leftHelperLetterSpacing, _TextField.textFieldTokens.leftHelperLineHeight, _TextField.textFieldTokens.labelInnerPadding, _TextField.textFieldTokens.contentLabelInnerPadding, _TextField.textFieldTokens.chipGap, _TextField.textFieldTokens.chipBorderRadius, _TextField.textFieldTokens.chipWidth, _TextField.textFieldTokens.chipHeight, _TextField.textFieldTokens.chipPaddingRight, _TextField.textFieldTokens.chipPaddingLeft, _TextField.textFieldTokens.chipClearContentMarginLeft, _TextField.textFieldTokens.chipClearContentMarginRight, _TextField.textFieldTokens.chipCloseIconSize, _TextField.textFieldTokens.chipFontFamily, _TextField.textFieldTokens.chipFontSize, _TextField.textFieldTokens.chipFontStyle, _TextField.textFieldTokens.chipFontWeight, _TextField.textFieldTokens.chipLetterSpacing, _TextField.textFieldTokens.chipLineHeight),
28
- s: /*#__PURE__*/(0, _styledComponents.css)(["", ":2.5rem;", ":0.6875rem 0.875rem 0.6875rem 0.875rem;", ":0.375rem;", ":0.625rem;", ":-0.1875rem 0.25rem -0.1875rem -0.125rem;", ":-0.1875rem -0.125rem -0.1875rem 0.75rem;", ":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);", ":0.5rem;", ":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);", ":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.3125rem 0 0 0;", ":1.0625rem 0 0.3125rem 0;", ":0.25rem;", ":0.25rem;", ":auto;", ":1.75rem;", ":0.5rem;", ":0.75rem;", ":0.375rem;", ":0rem;", ":1rem;", ":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);"], _TextField.textFieldTokens.height, _TextField.textFieldTokens.padding, _TextField.textFieldTokens.paddingWithChips, _TextField.textFieldTokens.borderRadius, _TextField.textFieldTokens.leftContentMargin, _TextField.textFieldTokens.rightContentMargin, _TextField.textFieldTokens.fontFamily, _TextField.textFieldTokens.fontSize, _TextField.textFieldTokens.fontStyle, _TextField.textFieldTokens.fontWeight, _TextField.textFieldTokens.letterSpacing, _TextField.textFieldTokens.lineHeight, _TextField.textFieldTokens.labelOffset, _TextField.textFieldTokens.labelFontFamily, _TextField.textFieldTokens.labelFontSize, _TextField.textFieldTokens.labelFontStyle, _TextField.textFieldTokens.labelFontWeight, _TextField.textFieldTokens.labelLetterSpacing, _TextField.textFieldTokens.labelLineHeight, _TextField.textFieldTokens.leftHelperOffset, _TextField.textFieldTokens.leftHelperFontFamily, _TextField.textFieldTokens.leftHelperFontSize, _TextField.textFieldTokens.leftHelperFontStyle, _TextField.textFieldTokens.leftHelperFontWeight, _TextField.textFieldTokens.leftHelperLetterSpacing, _TextField.textFieldTokens.leftHelperLineHeight, _TextField.textFieldTokens.labelInnerPadding, _TextField.textFieldTokens.contentLabelInnerPadding, _TextField.textFieldTokens.chipGap, _TextField.textFieldTokens.chipBorderRadius, _TextField.textFieldTokens.chipWidth, _TextField.textFieldTokens.chipHeight, _TextField.textFieldTokens.chipPaddingRight, _TextField.textFieldTokens.chipPaddingLeft, _TextField.textFieldTokens.chipClearContentMarginLeft, _TextField.textFieldTokens.chipClearContentMarginRight, _TextField.textFieldTokens.chipCloseIconSize, _TextField.textFieldTokens.chipFontFamily, _TextField.textFieldTokens.chipFontSize, _TextField.textFieldTokens.chipFontStyle, _TextField.textFieldTokens.chipFontWeight, _TextField.textFieldTokens.chipLetterSpacing, _TextField.textFieldTokens.chipLineHeight),
29
- xs: /*#__PURE__*/(0, _styledComponents.css)(["", ":2rem;", ":0.5625rem 0.625rem 0.5625rem 0.625rem;", ":0.375rem;", ":0.5rem;", ":-0.0625rem 0.25rem -0.0625rem -0.125rem;", ":-0.0625rem -0.125rem -0.0625rem 0.75rem;", ":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;", ":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.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.3125rem 0 0 0;", ":1.0625rem 0 0.3125rem 0;", ":0.25rem;", ":0.125rem;", ":auto;", ":1.25rem;", ":0.375rem;", ":0.625rem;", ":0.25rem;", ":0rem;", ":0.75rem;", ":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);"], _TextField.textFieldTokens.height, _TextField.textFieldTokens.padding, _TextField.textFieldTokens.paddingWithChips, _TextField.textFieldTokens.borderRadius, _TextField.textFieldTokens.leftContentMargin, _TextField.textFieldTokens.rightContentMargin, _TextField.textFieldTokens.fontFamily, _TextField.textFieldTokens.fontSize, _TextField.textFieldTokens.fontStyle, _TextField.textFieldTokens.fontWeight, _TextField.textFieldTokens.letterSpacing, _TextField.textFieldTokens.lineHeight, _TextField.textFieldTokens.labelOffset, _TextField.textFieldTokens.labelFontFamily, _TextField.textFieldTokens.labelFontSize, _TextField.textFieldTokens.labelFontStyle, _TextField.textFieldTokens.labelFontWeight, _TextField.textFieldTokens.labelLetterSpacing, _TextField.textFieldTokens.labelLineHeight, _TextField.textFieldTokens.leftHelperOffset, _TextField.textFieldTokens.leftHelperFontFamily, _TextField.textFieldTokens.leftHelperFontSize, _TextField.textFieldTokens.leftHelperFontStyle, _TextField.textFieldTokens.leftHelperFontWeight, _TextField.textFieldTokens.leftHelperLetterSpacing, _TextField.textFieldTokens.leftHelperLineHeight, _TextField.textFieldTokens.labelInnerPadding, _TextField.textFieldTokens.contentLabelInnerPadding, _TextField.textFieldTokens.chipGap, _TextField.textFieldTokens.chipBorderRadius, _TextField.textFieldTokens.chipWidth, _TextField.textFieldTokens.chipHeight, _TextField.textFieldTokens.chipPaddingRight, _TextField.textFieldTokens.chipPaddingLeft, _TextField.textFieldTokens.chipClearContentMarginLeft, _TextField.textFieldTokens.chipClearContentMarginRight, _TextField.textFieldTokens.chipCloseIconSize, _TextField.textFieldTokens.chipFontFamily, _TextField.textFieldTokens.chipFontSize, _TextField.textFieldTokens.chipFontStyle, _TextField.textFieldTokens.chipFontWeight, _TextField.textFieldTokens.chipLetterSpacing, _TextField.textFieldTokens.chipLineHeight)
30
- },
31
- labelPlacement: {
32
- inner: [_TextField.textField_labelPlacement_inner, /*#__PURE__*/(0, _styledComponents.css)(["&.", "{", ":var(--plasma-input-label-color,var(--plasma-input-placeholder-color,var(--plasma-colors-secondary)));", ":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);}"], _TextField.textField_labelPlacement_inner, _TextField.textFieldTokens.placeholderColor, _TextField.textFieldTokens.labelInnerFontFamily, _TextField.textFieldTokens.labelInnerFontSize, _TextField.textFieldTokens.labelInnerFontStyle, _TextField.textFieldTokens.labelInnerFontWeight, _TextField.textFieldTokens.labelInnerLetterSpacing, _TextField.textFieldTokens.labelInnerLineHeight)],
33
- outer: [_TextField.textField_labelPlacement_outer, /*#__PURE__*/(0, _styledComponents.css)(["&.", "{}"], _TextField.textField_labelPlacement_outer)]
34
- },
35
- disabled: {
36
- "true": /*#__PURE__*/(0, _styledComponents.css)(["", ":0.4;"], _TextField.textFieldTokens.disabledOpacity)
37
- },
38
- // TODO заменить --surface-transparent-primary на корректный токен
39
- readOnly: {
40
- "true": /*#__PURE__*/(0, _styledComponents.css)(["", ":var(--text-secondary);", ":var(--surface-transparent-primary);", ":var(--text-secondary);", ":var(--text-secondary);", ":var(--text-secondary);"], _TextField.textFieldTokens.colorReadOnly, _TextField.textFieldTokens.backgroundColorReadOnly, _TextField.textFieldTokens.placeholderColorReadOnly, _TextField.textFieldTokens.leftHelperColorReadOnly, _TextField.textFieldTokens.labelColorReadOnly)
41
- }
42
- }
43
- };
@@ -1,11 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.TextField = void 0;
7
- var _engines = /*#__PURE__*/require("../../../../engines");
8
- var _TextField = /*#__PURE__*/require("../../../../components/TextField");
9
- var _TextField2 = /*#__PURE__*/require("./TextField.config");
10
- var mergedConfig = /*#__PURE__*/(0, _engines.mergeConfig)(_TextField.textFieldConfig, _TextField2.config);
11
- var TextField = exports.TextField = /*#__PURE__*/(0, _engines.component)(mergedConfig);
@@ -1,181 +0,0 @@
1
- import React, { ComponentProps, useState } from 'react';
2
- import type { StoryObj, Meta } from '@storybook/react';
3
- import { action } from '@storybook/addon-actions';
4
- import { IconPlaceholder } from '@salutejs/plasma-sb-utils';
5
-
6
- import { WithTheme } from '../../../_helpers';
7
-
8
- import { TextField } from './TextField';
9
-
10
- const onChange = action('onChange');
11
- const onFocus = action('onFocus');
12
- const onBlur = action('onBlur');
13
- const onSearch = action('onSearch');
14
- const onChipsChange = action('onChipsChange');
15
-
16
- const sizes = ['l', 'm', 's', 'xs'];
17
- const views = ['default', 'positive', 'warning', 'negative'];
18
- const labelPlacements = ['outer', 'inner'];
19
-
20
- const meta: Meta<typeof TextField> = {
21
- title: 'sds_engineer/TextField',
22
- component: TextField,
23
- decorators: [WithTheme],
24
- argTypes: {
25
- view: {
26
- options: views,
27
- control: {
28
- type: 'select',
29
- },
30
- },
31
- maxLength: {
32
- control: {
33
- type: 'number',
34
- },
35
- },
36
- labelPlacement: {
37
- options: labelPlacements,
38
- control: {
39
- type: 'inline-radio',
40
- },
41
- },
42
- size: {
43
- options: sizes,
44
- control: {
45
- type: 'inline-radio',
46
- },
47
- },
48
- },
49
- };
50
-
51
- export default meta;
52
-
53
- type StoryPropsDefault = Omit<
54
- ComponentProps<typeof TextField>,
55
- | 'helperBlock'
56
- | 'contentLeft'
57
- | 'htmlSize'
58
- | 'contentRight'
59
- | 'type'
60
- | 'name'
61
- | 'onFocus'
62
- | 'onBlur'
63
- | 'onChange'
64
- | 'value'
65
- | 'checked'
66
- | 'maxLength'
67
- | 'minLength'
68
- | 'required'
69
- | 'enumerationType'
70
- | 'chips'
71
- | 'onChangeChips'
72
- > & {
73
- 'storybook:contentLeft': boolean;
74
- 'storybook:contentRight': boolean;
75
- };
76
-
77
- const StoryDemo = ({
78
- 'storybook:contentLeft': enableContentLeft,
79
- 'storybook:contentRight': enableContentRight,
80
- view,
81
- ...rest
82
- }: StoryPropsDefault) => {
83
- const [text, setText] = useState('Значение поля');
84
-
85
- const iconSize = rest.size === 'xs' ? 'xs' : 's';
86
-
87
- return (
88
- <TextField
89
- {...rest}
90
- enumerationType="plain"
91
- value={text}
92
- contentLeft={enableContentLeft ? <IconPlaceholder size={iconSize} /> : undefined}
93
- contentRight={enableContentRight ? <IconPlaceholder size={iconSize} /> : undefined}
94
- view={view}
95
- onChange={(e) => {
96
- setText(e.target.value);
97
- onChange(e.target.value);
98
- }}
99
- onFocus={onFocus}
100
- onBlur={onBlur}
101
- onSearch={onSearch}
102
- />
103
- );
104
- };
105
-
106
- export const Default: StoryObj<StoryPropsDefault> = {
107
- args: {
108
- id: 'example-text-field',
109
- size: 'l',
110
- view: 'default',
111
- label: 'Лейбл',
112
- labelPlacement: 'outer',
113
- placeholder: 'Заполните поле',
114
- leftHelper: 'Подсказка к полю',
115
- disabled: false,
116
- readOnly: false,
117
- 'storybook:contentLeft': true,
118
- 'storybook:contentRight': true,
119
- },
120
- render: (args) => <StoryDemo {...args} />,
121
- };
122
-
123
- type StoryPropsChips = Omit<
124
- ComponentProps<typeof TextField>,
125
- | 'helperBlock'
126
- | 'contentLeft'
127
- | 'htmlSize'
128
- | 'contentRight'
129
- | 'type'
130
- | 'name'
131
- | 'onFocus'
132
- | 'onBlur'
133
- | 'onChange'
134
- | 'onSearch'
135
- | 'value'
136
- | 'checked'
137
- | 'maxLength'
138
- | 'minLength'
139
- | 'required'
140
- | 'enumerationType'
141
- > & {
142
- 'storybook:contentLeft': boolean;
143
- 'storybook:contentRight': boolean;
144
- };
145
-
146
- const StoryChips = ({
147
- 'storybook:contentLeft': enableContentLeft,
148
- 'storybook:contentRight': enableContentRight,
149
- view,
150
- ...rest
151
- }: StoryPropsChips) => {
152
- const [text, setText] = useState('Значение поля');
153
-
154
- const iconSize = rest.size === 'xs' ? 'xs' : 's';
155
-
156
- return (
157
- <TextField
158
- {...rest}
159
- enumerationType="chip"
160
- value={text}
161
- contentLeft={enableContentLeft ? <IconPlaceholder size={iconSize} /> : undefined}
162
- contentRight={enableContentRight ? <IconPlaceholder size={iconSize} /> : undefined}
163
- view={view}
164
- onChange={(e) => {
165
- setText(e.target.value);
166
- onChange(e.target.value);
167
- }}
168
- onFocus={onFocus}
169
- onBlur={onBlur}
170
- onChangeChips={onChipsChange}
171
- />
172
- );
173
- };
174
-
175
- export const Chips: StoryObj<StoryPropsChips> = {
176
- args: {
177
- ...Default.args,
178
- chips: ['1 value', '2 value', '3 value', '4 value'],
179
- },
180
- render: (args) => <StoryChips {...args} />,
181
- };
@@ -1 +0,0 @@
1
- export { useKeyNavigation } from './useKeyNavigation';
@@ -1,132 +0,0 @@
1
- function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
2
- function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
3
- function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
4
- function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
5
- function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
6
- 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."); }
7
- 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); }
8
- 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; }
9
- 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; } }
10
- function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
11
- import { useState } from 'react';
12
- export var Keys = {
13
- Enter: 'Enter',
14
- Tab: 'Tab',
15
- Escape: 'Escape',
16
- ArrowLeft: 'ArrowLeft',
17
- ArrowRight: 'ArrowRight',
18
- Backspace: 'Backspace'
19
- };
20
- export var useKeyNavigation = function useKeyNavigation(_ref) {
21
- var _ref$controlledRefs = _ref.controlledRefs,
22
- chipsRefs = _ref$controlledRefs.chipsRefs,
23
- contentRef = _ref$controlledRefs.contentRef,
24
- inputRef = _ref$controlledRefs.inputRef,
25
- disabled = _ref.disabled,
26
- readOnly = _ref.readOnly,
27
- chips = _ref.chips,
28
- enumerationType = _ref.enumerationType,
29
- updateChips = _ref.updateChips,
30
- onChange = _ref.onChange,
31
- onSearch = _ref.onSearch;
32
- var _useState = useState(-1),
33
- _useState2 = _slicedToArray(_useState, 2),
34
- activeChipIndex = _useState2[0],
35
- setActiveChipIndex = _useState2[1];
36
- var handleInputKeydown = function handleInputKeydown(event) {
37
- var _inputRef$current;
38
- var _ref2 = event.target,
39
- value = _ref2.value;
40
- if (disabled || readOnly) {
41
- return;
42
- }
43
- if (event.key === Keys.Enter && enumerationType === 'chip' && value) {
44
- var nextIndex = (chips === null || chips === void 0 ? void 0 : chips.length) || 0;
45
- var newChips = [].concat(_toConsumableArray(chips), [{
46
- id: "".concat(nextIndex, "_").concat(value),
47
- text: value
48
- }]);
49
- var newValues = newChips.map(function (_ref3) {
50
- var text = _ref3.text;
51
- return text;
52
- });
53
- updateChips(newChips, newValues);
54
- event.target.value = '';
55
- onChange === null || onChange === void 0 ? void 0 : onChange(event);
56
- }
57
- if (event.key === Keys.Enter && onSearch) {
58
- onSearch(value, event);
59
- }
60
- if (event.key === Keys.Backspace && chips.length && (inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.selectionStart) === 0) {
61
- var _newChips = _toConsumableArray(chips);
62
- _newChips === null || _newChips === void 0 ? void 0 : _newChips.pop();
63
- chipsRefs === null || chipsRefs === void 0 ? void 0 : chipsRefs.current.pop();
64
- var _newValues = _newChips.map(function (_ref4) {
65
- var text = _ref4.text;
66
- return text;
67
- });
68
- updateChips(_newChips, _newValues);
69
- }
70
- };
71
- var onChipClear = function onChipClear(clearId, index) {
72
- if (!chips.length) {
73
- return;
74
- }
75
- var newChips = (chips === null || chips === void 0 ? void 0 : chips.filter(function (_ref5) {
76
- var chipId = _ref5.id;
77
- return chipId !== clearId;
78
- })) || [];
79
- var newValues = newChips.map(function (_ref6) {
80
- var text = _ref6.text;
81
- return text;
82
- });
83
- chipsRefs === null || chipsRefs === void 0 ? void 0 : chipsRefs.current.splice(index, 1);
84
- updateChips(newChips, newValues);
85
- };
86
- var handleChipKeyDown = function handleChipKeyDown(event, chipId, chipIndex) {
87
- if (event.key === Keys.Tab) {
88
- event.preventDefault();
89
- }
90
- if (event.key === Keys.Backspace) {
91
- onChipClear(chipId, chipIndex);
92
- }
93
- };
94
- var handleContentKeyDown = function handleContentKeyDown(event) {
95
- var _inputRef$current2, _focusedItem, _focusedItem2;
96
- var chipsRefsCount = chipsRefs.current.length;
97
- var currentCaretPosition = (inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : _inputRef$current2.selectionStart) || 0;
98
- var newActiveChipIndex = activeChipIndex;
99
- var focusedItem = null;
100
- if (event.key === Keys.ArrowLeft && enumerationType === 'chip' && currentCaretPosition <= 0) {
101
- var _chipsRefs$current;
102
- var index = activeChipIndex - 1 <= 0 ? 0 : activeChipIndex - 1;
103
- newActiveChipIndex = document.activeElement === (inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) ? chipsRefsCount - 1 : index;
104
- focusedItem = (_chipsRefs$current = chipsRefs.current) === null || _chipsRefs$current === void 0 ? void 0 : _chipsRefs$current[newActiveChipIndex];
105
- }
106
- if (event.key === Keys.ArrowRight && enumerationType === 'chip' && document.activeElement !== (inputRef === null || inputRef === void 0 ? void 0 : inputRef.current)) {
107
- var _chipsRefs$current2;
108
- var _index = activeChipIndex + 1 >= chipsRefsCount ? activeChipIndex : activeChipIndex + 1;
109
- newActiveChipIndex = document.activeElement === (contentRef === null || contentRef === void 0 ? void 0 : contentRef.current) ? 0 : _index;
110
- focusedItem = _index === activeChipIndex ? inputRef === null || inputRef === void 0 ? void 0 : inputRef.current : (_chipsRefs$current2 = chipsRefs.current) === null || _chipsRefs$current2 === void 0 ? void 0 : _chipsRefs$current2[newActiveChipIndex];
111
- }
112
- if (event.key === Keys.Backspace && document.activeElement !== (inputRef === null || inputRef === void 0 ? void 0 : inputRef.current)) {
113
- var _chipsRefs$current3;
114
- var _index2 = activeChipIndex - 1 <= 0 ? 0 : activeChipIndex - 1;
115
- newActiveChipIndex = chipsRefsCount === 0 ? -1 : _index2;
116
- focusedItem = chipsRefsCount === 0 ? inputRef === null || inputRef === void 0 ? void 0 : inputRef.current : chipsRefs === null || chipsRefs === void 0 ? void 0 : (_chipsRefs$current3 = chipsRefs.current) === null || _chipsRefs$current3 === void 0 ? void 0 : _chipsRefs$current3[newActiveChipIndex];
117
- }
118
- (_focusedItem = focusedItem) === null || _focusedItem === void 0 ? void 0 : _focusedItem.focus();
119
- (_focusedItem2 = focusedItem) === null || _focusedItem2 === void 0 ? void 0 : _focusedItem2.scrollIntoView({
120
- behavior: 'smooth',
121
- block: 'center',
122
- inline: 'center'
123
- });
124
- setActiveChipIndex(newActiveChipIndex);
125
- };
126
- return {
127
- handleInputKeydown: handleInputKeydown,
128
- handleChipKeyDown: handleChipKeyDown,
129
- onChipClear: onChipClear,
130
- handleContentKeyDown: handleContentKeyDown
131
- };
132
- };
@@ -1,30 +0,0 @@
1
- import React, { forwardRef } from 'react';
2
- import { StyledChip } from './TextFieldChip.styles';
3
- /**
4
- * Чип, отображающий выбранный элемент
5
- */
6
- export var TextFieldChip = /*#__PURE__*/forwardRef(function (_ref, ref) {
7
- var id = _ref.id,
8
- text = _ref.text,
9
- disabled = _ref.disabled,
10
- readOnly = _ref.readOnly,
11
- onClick = _ref.onClick,
12
- onClear = _ref.onClear,
13
- onKeyDown = _ref.onKeyDown;
14
- var onClearHandle = function onClearHandle() {
15
- return onClear(id);
16
- };
17
- var onKeyDownHandle = function onKeyDownHandle(event) {
18
- onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event, id);
19
- };
20
- return /*#__PURE__*/React.createElement(StyledChip, {
21
- ref: ref,
22
- tabIndex: -1,
23
- disabled: disabled,
24
- readOnly: readOnly,
25
- onClick: onClick,
26
- onClear: onClearHandle,
27
- onKeyDown: onKeyDownHandle,
28
- text: "".concat(text)
29
- });
30
- });
@@ -1,19 +0,0 @@
1
- import styled from 'styled-components';
2
- import { chipConfig, chipTokens } from '../../../Chip';
3
- import { component, mergeConfig } from '../../../../engines';
4
- import { tokens } from '../../TextField.tokens';
5
- import { addFocus } from '../../../../mixins';
6
-
7
- // issue #823
8
- var mergedConfig = /*#__PURE__*/mergeConfig(chipConfig);
9
- var Chip = /*#__PURE__*/component(mergedConfig);
10
-
11
- // NOTE: Необходимое переопределение токенов из компонента Chip т.к. используются его части
12
- export var StyledChip = /*#__PURE__*/styled(Chip).withConfig({
13
- componentId: "plasma-new-hope__sc-1mypbcr-0"
14
- })(["", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");scroll-snap-align:center;scroll-snap-stop:normal;", " &[readonly]{opacity:var(", ");}"], chipTokens.color, tokens.chipColor, chipTokens.background, tokens.chipBackground, chipTokens.colorHover, tokens.chipColorHover, chipTokens.backgroundHover, tokens.chipBackgroundHover, chipTokens.colorActive, tokens.chipColorActive, chipTokens.backgroundActive, tokens.chipBackgroundActive, chipTokens.backgroundReadOnly, tokens.chipBackgroundReadOnly, chipTokens.colorReadOnly, tokens.chipColorReadOnly, chipTokens.backgroundReadOnlyHover, tokens.chipBackgroundReadOnlyHover, chipTokens.colorReadOnlyHover, tokens.chipColorReadOnlyHover, chipTokens.borderRadius, tokens.chipBorderRadius, chipTokens.width, tokens.chipWidth, chipTokens.height, tokens.chipHeight, chipTokens.paddingRight, tokens.chipPaddingRight, chipTokens.paddingLeft, tokens.chipPaddingLeft, chipTokens.fontFamily, tokens.chipFontFamily, chipTokens.fontSize, tokens.chipFontSize, chipTokens.fontStyle, tokens.chipFontStyle, chipTokens.fontWeight, tokens.chipFontWeight, chipTokens.letterSpacing, tokens.chipLetterSpacing, chipTokens.lineHeight, tokens.chipLineHeight, chipTokens.clearContentMarginLeft, tokens.chipClearContentMarginLeft, chipTokens.clearContentMarginRight, tokens.chipClearContentMarginRight, chipTokens.scaleHover, tokens.chipScaleHover, chipTokens.scaleActive, tokens.chipScaleActive, chipTokens.closeIconSize, tokens.chipCloseIconSize, chipTokens.closeIconColor, tokens.chipCloseIconColor, chipTokens.focusColor, tokens.focusColor, /*#__PURE__*/addFocus({
15
- outlineOffset: '0.0625rem',
16
- outlineSize: '0.0625rem',
17
- outlineRadius: /*#__PURE__*/"calc(var(".concat(tokens.chipBorderRadius, ") - 0.1rem)"),
18
- outlineColor: /*#__PURE__*/"var(".concat(tokens.focusColor, ")")
19
- }), tokens.chipOpacityReadonly);
@@ -1 +0,0 @@
1
- export { TextFieldChip } from './TextFieldChip/TextFieldChip';