@salutejs/plasma-new-hope 0.139.0-canary.1417.10695762745.0 → 0.139.0-dev.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (216) hide show
  1. package/cjs/components/Autocomplete/Autocomplete.css +16 -12
  2. package/cjs/components/DatePicker/RangeDate/RangeDate.css +16 -12
  3. package/cjs/components/DatePicker/RangeDate/RangeDatePopover/RangeDatePopover.css +16 -12
  4. package/cjs/components/DatePicker/SingleDate/SingleDate.css +16 -12
  5. package/cjs/components/Range/Range.css +16 -12
  6. package/cjs/components/Slider/Slider.css +16 -12
  7. package/cjs/components/Slider/components/Double/Double.css +16 -12
  8. package/cjs/components/TextArea/TextArea.js +24 -7
  9. package/cjs/components/TextArea/TextArea.js.map +1 -1
  10. package/cjs/components/TextArea/TextArea.styles.js +47 -35
  11. package/cjs/components/TextArea/TextArea.styles.js.map +1 -1
  12. package/cjs/components/TextArea/TextArea.styles_1fyj8ox.css +11 -0
  13. package/cjs/components/TextArea/TextArea.tokens.js +13 -2
  14. package/cjs/components/TextArea/TextArea.tokens.js.map +1 -1
  15. package/cjs/components/TextField/TextField.js +46 -20
  16. package/cjs/components/TextField/TextField.js.map +1 -1
  17. package/cjs/components/TextField/TextField.styles.js +31 -7
  18. package/cjs/components/TextField/TextField.styles.js.map +1 -1
  19. package/cjs/components/TextField/TextField.styles_u6pm7v.css +14 -0
  20. package/cjs/components/TextField/TextField.tokens.js +10 -1
  21. package/cjs/components/TextField/TextField.tokens.js.map +1 -1
  22. package/cjs/components/TextField/TextField_1lzb2r1.css +1 -0
  23. package/cjs/components/TextField/variations/_label-placement/base.js +1 -1
  24. package/cjs/components/TextField/variations/_label-placement/base.js.map +1 -1
  25. package/cjs/components/TextField/variations/_label-placement/base_1dbnupp.css +1 -0
  26. package/cjs/components/TextField/variations/_read-only/base.js +1 -1
  27. package/cjs/components/TextField/variations/_read-only/base.js.map +1 -1
  28. package/cjs/components/TextField/variations/_read-only/base_4tqave.css +1 -0
  29. package/cjs/components/TextField/variations/_size/base.js +1 -1
  30. package/cjs/components/TextField/variations/_size/base.js.map +1 -1
  31. package/cjs/components/TextField/variations/_size/base_uk56yo.css +1 -0
  32. package/cjs/components/TextField/variations/_view/base.js +1 -1
  33. package/cjs/components/TextField/variations/_view/base.js.map +1 -1
  34. package/cjs/components/TextField/variations/_view/{base_18ea6z7.css → base_uszjx8.css} +1 -1
  35. package/cjs/index.css +27 -21
  36. package/emotion/cjs/components/TextArea/TextArea.js +25 -8
  37. package/emotion/cjs/components/TextArea/TextArea.styles.js +27 -19
  38. package/emotion/cjs/components/TextArea/TextArea.template-doc.mdx +29 -3
  39. package/emotion/cjs/components/TextArea/TextArea.tokens.js +13 -2
  40. package/emotion/cjs/components/TextArea/variations/_size/tokens.json +7 -1
  41. package/emotion/cjs/components/TextField/TextField.js +50 -24
  42. package/emotion/cjs/components/TextField/TextField.styles.js +57 -25
  43. package/emotion/cjs/components/TextField/TextField.template-doc.mdx +27 -1
  44. package/emotion/cjs/components/TextField/TextField.tokens.js +10 -1
  45. package/emotion/cjs/components/TextField/variations/_label-placement/base.js +1 -1
  46. package/emotion/cjs/components/TextField/variations/_read-only/base.js +1 -1
  47. package/emotion/cjs/components/TextField/variations/_size/base.js +1 -1
  48. package/emotion/cjs/components/TextField/variations/_size/tokens.json +6 -0
  49. package/emotion/cjs/components/TextField/variations/_view/base.js +1 -1
  50. package/emotion/cjs/examples/plasma_b2c/components/TextArea/TextArea.config.js +9 -9
  51. package/emotion/cjs/examples/plasma_b2c/components/TextArea/TextArea.stories.tsx +21 -0
  52. package/emotion/cjs/examples/plasma_b2c/components/TextField/TextField.config.js +12 -12
  53. package/emotion/cjs/examples/plasma_b2c/components/TextField/TextField.stories.tsx +21 -1
  54. package/emotion/cjs/examples/plasma_web/components/TextArea/TextArea.config.js +9 -9
  55. package/emotion/cjs/examples/plasma_web/components/TextArea/TextArea.stories.tsx +22 -0
  56. package/emotion/cjs/examples/plasma_web/components/TextField/TextField.config.js +12 -12
  57. package/emotion/cjs/examples/plasma_web/components/TextField/TextField.stories.tsx +22 -0
  58. package/emotion/es/components/TextArea/TextArea.js +26 -9
  59. package/emotion/es/components/TextArea/TextArea.styles.js +27 -19
  60. package/emotion/es/components/TextArea/TextArea.template-doc.mdx +29 -3
  61. package/emotion/es/components/TextArea/TextArea.tokens.js +13 -2
  62. package/emotion/es/components/TextArea/variations/_size/tokens.json +7 -1
  63. package/emotion/es/components/TextField/TextField.js +51 -25
  64. package/emotion/es/components/TextField/TextField.styles.js +56 -24
  65. package/emotion/es/components/TextField/TextField.template-doc.mdx +27 -1
  66. package/emotion/es/components/TextField/TextField.tokens.js +10 -1
  67. package/emotion/es/components/TextField/variations/_label-placement/base.js +2 -2
  68. package/emotion/es/components/TextField/variations/_read-only/base.js +2 -2
  69. package/emotion/es/components/TextField/variations/_size/base.js +2 -2
  70. package/emotion/es/components/TextField/variations/_size/tokens.json +6 -0
  71. package/emotion/es/components/TextField/variations/_view/base.js +2 -2
  72. package/emotion/es/examples/plasma_b2c/components/TextArea/TextArea.config.js +9 -9
  73. package/emotion/es/examples/plasma_b2c/components/TextArea/TextArea.stories.tsx +21 -0
  74. package/emotion/es/examples/plasma_b2c/components/TextField/TextField.config.js +12 -12
  75. package/emotion/es/examples/plasma_b2c/components/TextField/TextField.stories.tsx +21 -1
  76. package/emotion/es/examples/plasma_web/components/TextArea/TextArea.config.js +9 -9
  77. package/emotion/es/examples/plasma_web/components/TextArea/TextArea.stories.tsx +22 -0
  78. package/emotion/es/examples/plasma_web/components/TextField/TextField.config.js +12 -12
  79. package/emotion/es/examples/plasma_web/components/TextField/TextField.stories.tsx +22 -0
  80. package/es/components/Autocomplete/Autocomplete.css +16 -12
  81. package/es/components/DatePicker/RangeDate/RangeDate.css +16 -12
  82. package/es/components/DatePicker/RangeDate/RangeDatePopover/RangeDatePopover.css +16 -12
  83. package/es/components/DatePicker/SingleDate/SingleDate.css +16 -12
  84. package/es/components/Range/Range.css +16 -12
  85. package/es/components/Slider/Slider.css +16 -12
  86. package/es/components/Slider/components/Double/Double.css +16 -12
  87. package/es/components/TextArea/TextArea.js +25 -8
  88. package/es/components/TextArea/TextArea.js.map +1 -1
  89. package/es/components/TextArea/TextArea.styles.js +46 -36
  90. package/es/components/TextArea/TextArea.styles.js.map +1 -1
  91. package/es/components/TextArea/TextArea.styles_1fyj8ox.css +11 -0
  92. package/es/components/TextArea/TextArea.tokens.js +13 -2
  93. package/es/components/TextArea/TextArea.tokens.js.map +1 -1
  94. package/es/components/TextField/TextField.js +47 -21
  95. package/es/components/TextField/TextField.js.map +1 -1
  96. package/es/components/TextField/TextField.styles.js +28 -8
  97. package/es/components/TextField/TextField.styles.js.map +1 -1
  98. package/es/components/TextField/TextField.styles_u6pm7v.css +14 -0
  99. package/es/components/TextField/TextField.tokens.js +10 -1
  100. package/es/components/TextField/TextField.tokens.js.map +1 -1
  101. package/es/components/TextField/TextField_1lzb2r1.css +1 -0
  102. package/es/components/TextField/variations/_label-placement/base.js +1 -1
  103. package/es/components/TextField/variations/_label-placement/base.js.map +1 -1
  104. package/es/components/TextField/variations/_label-placement/base_1dbnupp.css +1 -0
  105. package/es/components/TextField/variations/_read-only/base.js +1 -1
  106. package/es/components/TextField/variations/_read-only/base.js.map +1 -1
  107. package/es/components/TextField/variations/_read-only/base_4tqave.css +1 -0
  108. package/es/components/TextField/variations/_size/base.js +1 -1
  109. package/es/components/TextField/variations/_size/base.js.map +1 -1
  110. package/es/components/TextField/variations/_size/base_uk56yo.css +1 -0
  111. package/es/components/TextField/variations/_view/base.js +1 -1
  112. package/es/components/TextField/variations/_view/base.js.map +1 -1
  113. package/es/components/TextField/variations/_view/{base_18ea6z7.css → base_uszjx8.css} +1 -1
  114. package/es/index.css +27 -21
  115. package/package.json +4 -4
  116. package/styled-components/cjs/components/TextArea/TextArea.js +24 -7
  117. package/styled-components/cjs/components/TextArea/TextArea.styles.js +17 -11
  118. package/styled-components/cjs/components/TextArea/TextArea.template-doc.mdx +29 -3
  119. package/styled-components/cjs/components/TextArea/TextArea.tokens.js +13 -2
  120. package/styled-components/cjs/components/TextArea/variations/_size/tokens.json +7 -1
  121. package/styled-components/cjs/components/TextField/TextField.js +46 -20
  122. package/styled-components/cjs/components/TextField/TextField.styles.js +22 -10
  123. package/styled-components/cjs/components/TextField/TextField.template-doc.mdx +27 -1
  124. package/styled-components/cjs/components/TextField/TextField.tokens.js +10 -1
  125. package/styled-components/cjs/components/TextField/variations/_label-placement/base.js +1 -1
  126. package/styled-components/cjs/components/TextField/variations/_read-only/base.js +1 -1
  127. package/styled-components/cjs/components/TextField/variations/_size/base.js +1 -1
  128. package/styled-components/cjs/components/TextField/variations/_size/tokens.json +6 -0
  129. package/styled-components/cjs/components/TextField/variations/_view/base.js +1 -1
  130. package/styled-components/cjs/examples/plasma_b2c/components/TextArea/TextArea.config.js +7 -7
  131. package/styled-components/cjs/examples/plasma_b2c/components/TextArea/TextArea.stories.tsx +21 -0
  132. package/styled-components/cjs/examples/plasma_b2c/components/TextField/TextField.config.js +8 -8
  133. package/styled-components/cjs/examples/plasma_b2c/components/TextField/TextField.stories.tsx +21 -1
  134. package/styled-components/cjs/examples/plasma_web/components/TextArea/TextArea.config.js +8 -8
  135. package/styled-components/cjs/examples/plasma_web/components/TextArea/TextArea.stories.tsx +22 -0
  136. package/styled-components/cjs/examples/plasma_web/components/TextField/TextField.config.js +8 -8
  137. package/styled-components/cjs/examples/plasma_web/components/TextField/TextField.stories.tsx +22 -0
  138. package/styled-components/es/components/TextArea/TextArea.js +25 -8
  139. package/styled-components/es/components/TextArea/TextArea.styles.js +17 -11
  140. package/styled-components/es/components/TextArea/TextArea.template-doc.mdx +29 -3
  141. package/styled-components/es/components/TextArea/TextArea.tokens.js +13 -2
  142. package/styled-components/es/components/TextArea/variations/_size/tokens.json +7 -1
  143. package/styled-components/es/components/TextField/TextField.js +47 -21
  144. package/styled-components/es/components/TextField/TextField.styles.js +21 -9
  145. package/styled-components/es/components/TextField/TextField.template-doc.mdx +27 -1
  146. package/styled-components/es/components/TextField/TextField.tokens.js +10 -1
  147. package/styled-components/es/components/TextField/variations/_label-placement/base.js +2 -2
  148. package/styled-components/es/components/TextField/variations/_read-only/base.js +2 -2
  149. package/styled-components/es/components/TextField/variations/_size/base.js +2 -2
  150. package/styled-components/es/components/TextField/variations/_size/tokens.json +6 -0
  151. package/styled-components/es/components/TextField/variations/_view/base.js +2 -2
  152. package/styled-components/es/examples/plasma_b2c/components/TextArea/TextArea.config.js +7 -7
  153. package/styled-components/es/examples/plasma_b2c/components/TextArea/TextArea.stories.tsx +21 -0
  154. package/styled-components/es/examples/plasma_b2c/components/TextField/TextField.config.js +8 -8
  155. package/styled-components/es/examples/plasma_b2c/components/TextField/TextField.stories.tsx +21 -1
  156. package/styled-components/es/examples/plasma_web/components/TextArea/TextArea.config.js +8 -8
  157. package/styled-components/es/examples/plasma_web/components/TextArea/TextArea.stories.tsx +22 -0
  158. package/styled-components/es/examples/plasma_web/components/TextField/TextField.config.js +8 -8
  159. package/styled-components/es/examples/plasma_web/components/TextField/TextField.stories.tsx +22 -0
  160. package/types/components/Autocomplete/Autocomplete.d.ts +2 -2
  161. package/types/components/Autocomplete/Autocomplete.d.ts.map +1 -1
  162. package/types/components/Autocomplete/Autocomplete.types.d.ts +1 -1
  163. package/types/components/Autocomplete/Autocomplete.types.d.ts.map +1 -1
  164. package/types/components/Autocomplete/ui/TextField/TextField.styles.d.ts +60 -2
  165. package/types/components/Autocomplete/ui/TextField/TextField.styles.d.ts.map +1 -1
  166. package/types/components/DatePicker/SingleDate/SingleDate.styles.d.ts +60 -2
  167. package/types/components/DatePicker/SingleDate/SingleDate.styles.d.ts.map +1 -1
  168. package/types/components/Range/Range.styles.d.ts +60 -2
  169. package/types/components/Range/Range.styles.d.ts.map +1 -1
  170. package/types/components/Slider/components/Double/Double.styles.d.ts +60 -2
  171. package/types/components/Slider/components/Double/Double.styles.d.ts.map +1 -1
  172. package/types/components/TextArea/TextArea.d.ts.map +1 -1
  173. package/types/components/TextArea/TextArea.styles.d.ts +2 -0
  174. package/types/components/TextArea/TextArea.styles.d.ts.map +1 -1
  175. package/types/components/TextArea/TextArea.tokens.d.ts +11 -0
  176. package/types/components/TextArea/TextArea.tokens.d.ts.map +1 -1
  177. package/types/components/TextArea/TextArea.types.d.ts +30 -5
  178. package/types/components/TextArea/TextArea.types.d.ts.map +1 -1
  179. package/types/components/TextField/TextField.d.ts.map +1 -1
  180. package/types/components/TextField/TextField.styles.d.ts +4 -0
  181. package/types/components/TextField/TextField.styles.d.ts.map +1 -1
  182. package/types/components/TextField/TextField.tokens.d.ts +9 -0
  183. package/types/components/TextField/TextField.tokens.d.ts.map +1 -1
  184. package/types/components/TextField/TextField.types.d.ts +27 -2
  185. package/types/components/TextField/TextField.types.d.ts.map +1 -1
  186. package/types/components/TextField/variations/_label-placement/base.d.ts.map +1 -1
  187. package/types/components/TextField/variations/_size/base.d.ts.map +1 -1
  188. package/types/components/TextField/variations/_view/base.d.ts.map +1 -1
  189. package/types/examples/plasma_b2c/components/Autocomplete/Autocomplete.d.ts +1 -1
  190. package/types/examples/plasma_b2c/components/Autocomplete/Autocomplete.d.ts.map +1 -1
  191. package/types/examples/plasma_b2c/components/TextArea/TextArea.config.d.ts.map +1 -1
  192. package/types/examples/plasma_b2c/components/TextArea/TextArea.d.ts +135 -3
  193. package/types/examples/plasma_b2c/components/TextArea/TextArea.d.ts.map +1 -1
  194. package/types/examples/plasma_b2c/components/TextField/TextField.config.d.ts.map +1 -1
  195. package/types/examples/plasma_b2c/components/TextField/TextField.d.ts +60 -2
  196. package/types/examples/plasma_b2c/components/TextField/TextField.d.ts.map +1 -1
  197. package/types/examples/plasma_web/components/Autocomplete/Autocomplete.d.ts +1 -1
  198. package/types/examples/plasma_web/components/Autocomplete/Autocomplete.d.ts.map +1 -1
  199. package/types/examples/plasma_web/components/TextArea/TextArea.config.d.ts.map +1 -1
  200. package/types/examples/plasma_web/components/TextArea/TextArea.d.ts +135 -3
  201. package/types/examples/plasma_web/components/TextArea/TextArea.d.ts.map +1 -1
  202. package/types/examples/plasma_web/components/TextField/TextField.config.d.ts.map +1 -1
  203. package/types/examples/plasma_web/components/TextField/TextField.d.ts +60 -2
  204. package/types/examples/plasma_web/components/TextField/TextField.d.ts.map +1 -1
  205. package/cjs/components/TextArea/TextArea.styles_1bv40vw.css +0 -9
  206. package/cjs/components/TextField/TextField.styles_9fkr1l.css +0 -10
  207. package/cjs/components/TextField/TextField_wctd2m.css +0 -1
  208. package/cjs/components/TextField/variations/_label-placement/base_170eaex.css +0 -1
  209. package/cjs/components/TextField/variations/_read-only/base_1vu13zn.css +0 -1
  210. package/cjs/components/TextField/variations/_size/base_orwx1f.css +0 -1
  211. package/es/components/TextArea/TextArea.styles_1bv40vw.css +0 -9
  212. package/es/components/TextField/TextField.styles_9fkr1l.css +0 -10
  213. package/es/components/TextField/TextField_wctd2m.css +0 -1
  214. package/es/components/TextField/variations/_label-placement/base_170eaex.css +0 -1
  215. package/es/components/TextField/variations/_read-only/base_1vu13zn.css +0 -1
  216. package/es/components/TextField/variations/_size/base_orwx1f.css +0 -1
@@ -1,4 +1,4 @@
1
- import './TextArea.styles_1bv40vw.css';
1
+ import './TextArea.styles_1fyj8ox.css';
2
2
  import { styled } from '@linaria/react';
3
3
  import { tokens } from './TextArea.tokens.js';
4
4
 
@@ -7,13 +7,18 @@ var StyledLabel = /*#__PURE__*/styled('div')({
7
7
  "class": "s1luq7vd",
8
8
  propsAsIs: false
9
9
  });
10
- var _exp10 = function _exp10() {
10
+ var StyledOptionalText = /*#__PURE__*/styled('span')({
11
+ name: "StyledOptionalText",
12
+ "class": "s1r1fvk8",
13
+ propsAsIs: false
14
+ });
15
+ var _exp11 = function _exp11() {
11
16
  return function (_ref) {
12
17
  var hasHelper = _ref.hasHelper;
13
18
  return hasHelper ? "var(".concat(tokens.inputPaddingBottomWithHelpers, ")") : "var(".concat(tokens.inputPaddingBottom, ")");
14
19
  };
15
20
  };
16
- var _exp11 = function _exp11() {
21
+ var _exp12 = function _exp12() {
17
22
  return function (_ref2) {
18
23
  var hasHelper = _ref2.hasHelper;
19
24
  return hasHelper ? "var(".concat(tokens.borderRadiusWithHelpers, ")") : "var(".concat(tokens.borderRadius, ")");
@@ -21,19 +26,19 @@ var _exp11 = function _exp11() {
21
26
  };
22
27
  var StyledTextAreaWrapper = /*#__PURE__*/styled('div')({
23
28
  name: "StyledTextAreaWrapper",
24
- "class": "s1r1fvk8",
29
+ "class": "surmvwq",
25
30
  propsAsIs: false,
26
31
  vars: {
27
- "s1r1fvk8-0": [/*#__PURE__*/_exp10()],
28
- "s1r1fvk8-1": [/*#__PURE__*/_exp11()]
32
+ "surmvwq-0": [/*#__PURE__*/_exp11()],
33
+ "surmvwq-1": [/*#__PURE__*/_exp12()]
29
34
  }
30
35
  });
31
36
  var StyledContent = /*#__PURE__*/styled('div')({
32
37
  name: "StyledContent",
33
- "class": "surmvwq",
38
+ "class": "s18bd513",
34
39
  propsAsIs: false
35
40
  });
36
- var _exp15 = function _exp15() {
41
+ var _exp16 = function _exp16() {
37
42
  return function (_ref3) {
38
43
  var width = _ref3.width;
39
44
  return width;
@@ -41,55 +46,55 @@ var _exp15 = function _exp15() {
41
46
  };
42
47
  var StyledContainer = /*#__PURE__*/styled('div')({
43
48
  name: "StyledContainer",
44
- "class": "s18bd513",
49
+ "class": "s7alcr2",
45
50
  propsAsIs: false,
46
51
  vars: {
47
- "s18bd513-0": [/*#__PURE__*/_exp15()]
52
+ "s7alcr2-0": [/*#__PURE__*/_exp16()]
48
53
  }
49
54
  });
50
- var _exp18 = function _exp18() {
55
+ var _exp19 = function _exp19() {
51
56
  return function (_ref4) {
52
57
  var resize = _ref4.resize;
53
58
  return resize || 'none';
54
59
  };
55
60
  };
56
- var _exp19 = function _exp19() {
61
+ var _exp20 = function _exp20() {
57
62
  return function (_ref5) {
58
63
  var height = _ref5.height;
59
64
  return !Number.isNaN(Number(height)) ? "calc(".concat(height, "rem - 0.875rem)") : height || "var(".concat(tokens.inputHeight, ")");
60
65
  };
61
66
  };
62
- var _exp20 = function _exp20() {
67
+ var _exp21 = function _exp21() {
63
68
  return function (_ref6) {
64
69
  var width = _ref6.width;
65
70
  return !Number.isNaN(Number(width)) ? "".concat(width, "rem") : width || "var(".concat(tokens.inputWidth, ")");
66
71
  };
67
72
  };
68
- var _exp21 = function _exp21() {
73
+ var _exp22 = function _exp22() {
69
74
  return function (_ref7) {
70
75
  var rows = _ref7.rows;
71
76
  return rows ? 'unset' : 'var(--plasma_private-textarea-height)';
72
77
  };
73
78
  };
74
- var _exp22 = function _exp22() {
79
+ var _exp23 = function _exp23() {
75
80
  return function (_ref8) {
76
81
  var cols = _ref8.cols;
77
82
  return cols ? 'unset' : 'var(--plasma_private-textarea-width)';
78
83
  };
79
84
  };
80
- var _exp24 = function _exp24() {
85
+ var _exp25 = function _exp25() {
81
86
  return function (_ref9) {
82
87
  var applyCustomWidth = _ref9.applyCustomWidth;
83
88
  return applyCustomWidth ? 'var(--plasma_private-textarea-width)' : 'auto';
84
89
  };
85
90
  };
86
- var _exp26 = function _exp26() {
91
+ var _exp27 = function _exp27() {
87
92
  return function (_ref10) {
88
93
  var hasContentRight = _ref10.hasContentRight;
89
94
  return hasContentRight ? "var(".concat(tokens.inputPaddingRightWithRightContent, ")") : "var(".concat(tokens.inputPaddingRight, ")");
90
95
  };
91
96
  };
92
- var _exp33 = function _exp33() {
97
+ var _exp34 = function _exp34() {
93
98
  return function (_ref11) {
94
99
  var hasHelper = _ref11.hasHelper,
95
100
  rows = _ref11.rows;
@@ -98,38 +103,38 @@ var _exp33 = function _exp33() {
98
103
  };
99
104
  var StyledTextArea = /*#__PURE__*/styled('textarea')({
100
105
  name: "StyledTextArea",
101
- "class": "s7alcr2",
106
+ "class": "si9oz50",
102
107
  propsAsIs: false,
103
108
  vars: {
104
- "s7alcr2-0": [/*#__PURE__*/_exp18()],
105
- "s7alcr2-1": [/*#__PURE__*/_exp19()],
106
- "s7alcr2-2": [/*#__PURE__*/_exp20()],
107
- "s7alcr2-3": [/*#__PURE__*/_exp21()],
108
- "s7alcr2-4": [/*#__PURE__*/_exp22()],
109
- "s7alcr2-5": [/*#__PURE__*/_exp24()],
110
- "s7alcr2-6": [/*#__PURE__*/_exp26()],
111
- "s7alcr2-7": [/*#__PURE__*/_exp33()]
109
+ "si9oz50-0": [/*#__PURE__*/_exp19()],
110
+ "si9oz50-1": [/*#__PURE__*/_exp20()],
111
+ "si9oz50-2": [/*#__PURE__*/_exp21()],
112
+ "si9oz50-3": [/*#__PURE__*/_exp22()],
113
+ "si9oz50-4": [/*#__PURE__*/_exp23()],
114
+ "si9oz50-5": [/*#__PURE__*/_exp25()],
115
+ "si9oz50-6": [/*#__PURE__*/_exp27()],
116
+ "si9oz50-7": [/*#__PURE__*/_exp34()]
112
117
  }
113
118
  });
114
119
  var StyledHelpers = /*#__PURE__*/styled('div')({
115
120
  name: "StyledHelpers",
116
- "class": "si9oz50",
121
+ "class": "s18tpn65",
117
122
  propsAsIs: false
118
123
  });
119
124
  var StyledLeftHelper = /*#__PURE__*/styled('span')({
120
125
  name: "StyledLeftHelper",
121
- "class": "s18tpn65",
126
+ "class": "s19sfsrt",
122
127
  propsAsIs: false
123
128
  });
124
- var _exp56 = function _exp56() {
129
+ var _exp57 = function _exp57() {
125
130
  return StyledLeftHelper;
126
131
  };
127
- var StyledRightHelper = /*#__PURE__*/styled(_exp56())({
132
+ var StyledRightHelper = /*#__PURE__*/styled(_exp57())({
128
133
  name: "StyledRightHelper",
129
- "class": "s19sfsrt",
134
+ "class": "sfype23",
130
135
  propsAsIs: true
131
136
  });
132
- var _exp61 = function _exp61() {
137
+ var _exp62 = function _exp62() {
133
138
  return function (_ref12) {
134
139
  var hasContentRight = _ref12.hasContentRight;
135
140
  return hasContentRight ? "var(".concat(tokens.inputPaddingRightWithRightContent, ")") : "var(".concat(tokens.inputPaddingRight, ")");
@@ -137,12 +142,17 @@ var _exp61 = function _exp61() {
137
142
  };
138
143
  var StyledPlaceholder = /*#__PURE__*/styled('label')({
139
144
  name: "StyledPlaceholder",
140
- "class": "sfype23",
145
+ "class": "s3wsw3p",
141
146
  propsAsIs: false,
142
147
  vars: {
143
- "sfype23-0": [/*#__PURE__*/_exp61()]
148
+ "s3wsw3p-0": [/*#__PURE__*/_exp62()]
144
149
  }
145
150
  });
151
+ var StyledIndicator = /*#__PURE__*/styled('div')({
152
+ name: "StyledIndicator",
153
+ "class": "stc5t23",
154
+ propsAsIs: false
155
+ });
146
156
 
147
- export { StyledContainer, StyledContent, StyledHelpers, StyledLabel, StyledLeftHelper, StyledPlaceholder, StyledRightHelper, StyledTextArea, StyledTextAreaWrapper };
157
+ export { StyledContainer, StyledContent, StyledHelpers, StyledIndicator, StyledLabel, StyledLeftHelper, StyledOptionalText, StyledPlaceholder, StyledRightHelper, StyledTextArea, StyledTextAreaWrapper };
148
158
  //# sourceMappingURL=TextArea.styles.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"TextArea.styles.js","sources":["../../../src/components/TextArea/TextArea.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\n\nimport { applyEllipsis } from '../../mixins';\n\nimport { tokens } from './TextArea.tokens';\n\nexport const StyledLabel = styled.div`\n margin-bottom: var(${tokens.labelMarginBottom});\n\n font-family: var(${tokens.inputFontFamily});\n font-size: var(${tokens.inputFontSize});\n font-style: var(${tokens.inputFontStyle});\n font-weight: var(${tokens.inputFontWeight});\n letter-spacing: var(${tokens.inputLetterSpacing});\n line-height: var(${tokens.inputLineHeight});\n`;\n\nexport const StyledTextAreaWrapper = styled.div<{\n hasHelper: boolean;\n}>`\n background-color: var(${tokens.inputBackgroundColor});\n\n padding-top: var(${tokens.inputPaddingTop});\n padding-bottom: ${({ hasHelper }) =>\n hasHelper ? `var(${tokens.inputPaddingBottomWithHelpers})` : `var(${tokens.inputPaddingBottom})`};\n\n border-radius: ${({ hasHelper }) =>\n hasHelper ? `var(${tokens.borderRadiusWithHelpers})` : `var(${tokens.borderRadius})`};\n`;\n\nexport const StyledContent = styled.div`\n position: absolute;\n display: flex;\n align-items: center;\n bottom: 0;\n z-index: 1;\n\n top: var(${tokens.rightContentTop});\n right: var(${tokens.rightContentRight});\n\n height: var(${tokens.rightContentHeight});\n`;\n\nexport const StyledContainer = styled.div<{ width: string }>`\n display: inline-flex;\n flex-direction: column;\n\n width: ${({ width }) => width};\n\n position: relative;\n`;\n\nexport const StyledTextArea = styled.textarea<{\n hasHelper: boolean;\n hasContentRight: boolean;\n applyCustomWidth: boolean;\n width?: string | number;\n height?: string | number;\n resize?: string;\n}>`\n display: block;\n box-sizing: border-box;\n outline: none;\n border: none;\n -webkit-appearance: none; /* для отображение рамок на iOS */\n background-color: transparent;\n\n color: var(${tokens.inputColor});\n caret-color: var(${tokens.inputCaretColor});\n\n resize: ${({ resize }) => resize || 'none'};\n\n --plasma_private-textarea-height: ${({ height }) =>\n !Number.isNaN(Number(height)) ? `calc(${height}rem - 0.875rem)` : height || `var(${tokens.inputHeight})`};\n\n --plasma_private-textarea-width: ${({ width }) =>\n !Number.isNaN(Number(width)) ? `${width}rem` : width || `var(${tokens.inputWidth})`};\n\n --plasma_private-textarea-computed-height: ${({ rows }) =>\n rows ? 'unset' : 'var(--plasma_private-textarea-height)'};\n --plasma_private-textarea-computed-width: ${({ cols }) =>\n cols ? 'unset' : 'var(--plasma_private-textarea-width)'};\n\n height: var(--plasma_private-textarea-computed-height);\n width: var(--plasma_private-textarea-computed-width);\n\n min-width: ${({ applyCustomWidth }) => (applyCustomWidth ? 'var(--plasma_private-textarea-width)' : 'auto')};\n max-width: ${({ applyCustomWidth }) => (applyCustomWidth ? 'var(--plasma_private-textarea-width)' : 'auto')};\n\n min-height: var(${tokens.inputMinHeight});\n\n padding-right: ${({ hasContentRight }) =>\n hasContentRight ? `var(${tokens.inputPaddingRightWithRightContent})` : `var(${tokens.inputPaddingRight})`};\n padding-left: var(${tokens.inputPaddingLeft});\n padding-top: 0;\n padding-bottom: 0;\n\n /* INFO: Высчитываем высоту блока с подсказками */\n --plasma_private-textarea-helpers-computed-height: calc(\n var(${tokens.helpersPaddingTop}) + var(${tokens.helpersPaddingBottom}) + var(${tokens.helpersLineHeight})\n );\n\n --plasma_private-textarea-input-with-helpers-height: calc(\n var(--plasma_private-textarea-height) - var(--plasma_private-textarea-helpers-computed-height) +\n var(${tokens.helpersOffset})\n );\n --plasma_private-textarea-input-without-helpers-height: calc(\n var(--plasma_private-textarea-computed-height) - var(${tokens.inputPaddingBottom})\n );\n\n --plasma_private-textarea-input-actual-height: ${({ hasHelper, rows }) =>\n hasHelper && !rows\n ? 'var(--plasma_private-textarea-input-with-helpers-height)'\n : 'var(--plasma_private-textarea-input-without-helpers-height)'};\n\n height: var(--plasma_private-textarea-input-actual-height);\n\n font-family: var(${tokens.inputFontFamily});\n font-size: var(${tokens.inputFontSize});\n font-style: var(${tokens.inputFontStyle});\n font-weight: var(${tokens.inputFontWeight});\n letter-spacing: var(${tokens.inputLetterSpacing});\n line-height: var(${tokens.inputLineHeight});\n\n &::placeholder {\n opacity: 0;\n }\n\n &:read-only {\n cursor: default;\n }\n\n &:focus:not(:disabled) {\n color: var(${tokens.inputColorFocus});\n }\n`;\n\nexport const StyledHelpers = styled.div`\n box-sizing: border-box;\n display: flex;\n justify-content: space-between;\n\n transition: background-color 0.1s ease-in-out;\n\n background-color: var(${tokens.helpersBackgroundColor});\n\n padding-top: var(${tokens.helpersPaddingTop});\n padding-right: var(${tokens.helpersPaddingRight});\n padding-bottom: var(${tokens.helpersPaddingBottom});\n padding-left: var(${tokens.helpersPaddingLeft});\n\n border-bottom-left-radius: var(${tokens.borderRadius});\n border-bottom-right-radius: var(${tokens.borderRadius});\n`;\n\nexport const StyledLeftHelper = styled.span`\n ${applyEllipsis()};\n\n display: block;\n\n font-family: var(${tokens.helpersFontFamily});\n font-size: var(${tokens.helpersFontSize});\n font-style: var(${tokens.helpersFontStyle});\n font-weight: var(${tokens.helpersFontWeight});\n letter-spacing: var(${tokens.helpersLetterSpacing});\n line-height: var(${tokens.helpersLineHeight});\n\n color: var(${tokens.leftHelperColor});\n`;\n\nexport const StyledRightHelper = styled(StyledLeftHelper)`\n color: var(${tokens.rightHelperColor});\n margin-left: auto;\n`;\n\nexport const StyledPlaceholder = styled.label<{\n hasContentRight: boolean;\n}>`\n box-sizing: border-box;\n position: absolute;\n pointer-events: none;\n display: inline-flex;\n align-items: center;\n\n transition: all 0.1s ease-in-out;\n transform-origin: top left;\n\n color: var(${tokens.placeholderColor});\n\n width: 100%;\n height: auto;\n\n top: var(${tokens.inputPaddingTop});\n padding-left: var(${tokens.inputPaddingLeft});\n padding-right: ${({ hasContentRight }) =>\n hasContentRight ? `var(${tokens.inputPaddingRightWithRightContent})` : `var(${tokens.inputPaddingRight})`};\n\n font-family: var(${tokens.inputFontFamily});\n font-size: var(${tokens.inputFontSize});\n font-style: var(${tokens.inputFontStyle});\n font-weight: var(${tokens.inputFontWeight});\n letter-spacing: var(${tokens.inputLetterSpacing});\n line-height: var(${tokens.inputLineHeight});\n`;\n"],"names":["StyledLabel","styled","name","class","propsAsIs","_exp10","_ref","hasHelper","concat","tokens","inputPaddingBottomWithHelpers","inputPaddingBottom","_exp11","_ref2","borderRadiusWithHelpers","borderRadius","StyledTextAreaWrapper","vars","StyledContent","_exp15","_ref3","width","StyledContainer","_exp18","_ref4","resize","_exp19","_ref5","height","Number","isNaN","inputHeight","_exp20","_ref6","inputWidth","_exp21","_ref7","rows","_exp22","_ref8","cols","_exp24","_ref9","applyCustomWidth","_exp26","_ref10","hasContentRight","inputPaddingRightWithRightContent","inputPaddingRight","_exp33","_ref11","StyledTextArea","StyledHelpers","StyledLeftHelper","_exp56","StyledRightHelper","_exp61","_ref12","StyledPlaceholder"],"mappings":"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"}
1
+ {"version":3,"file":"TextArea.styles.js","sources":["../../../src/components/TextArea/TextArea.styles.ts"],"sourcesContent":["import { styled } from '@linaria/react';\n\nimport { applyEllipsis } from '../../mixins';\n\nimport { classes, tokens } from './TextArea.tokens';\n\nexport const StyledLabel = styled.div`\n position: relative;\n display: inline-flex;\n margin-bottom: var(${tokens.labelMarginBottom});\n\n font-family: var(${tokens.inputFontFamily});\n font-size: var(${tokens.inputFontSize});\n font-style: var(${tokens.inputFontStyle});\n font-weight: var(${tokens.inputFontWeight});\n letter-spacing: var(${tokens.inputLetterSpacing});\n line-height: var(${tokens.inputLineHeight});\n`;\n\nexport const StyledOptionalText = styled.span`\n color: var(${tokens.optionalColor});\n`;\n\nexport const StyledTextAreaWrapper = styled.div<{\n hasHelper: boolean;\n}>`\n background-color: var(${tokens.inputBackgroundColor});\n\n padding-top: var(${tokens.inputPaddingTop});\n padding-bottom: ${({ hasHelper }) =>\n hasHelper ? `var(${tokens.inputPaddingBottomWithHelpers})` : `var(${tokens.inputPaddingBottom})`};\n\n border-radius: ${({ hasHelper }) =>\n hasHelper ? `var(${tokens.borderRadiusWithHelpers})` : `var(${tokens.borderRadius})`};\n`;\n\nexport const StyledContent = styled.div`\n position: absolute;\n display: flex;\n align-items: center;\n bottom: 0;\n z-index: 1;\n\n top: var(${tokens.rightContentTop});\n right: var(${tokens.rightContentRight});\n\n height: var(${tokens.rightContentHeight});\n`;\n\nexport const StyledContainer = styled.div<{ width: string }>`\n display: inline-flex;\n flex-direction: column;\n\n width: ${({ width }) => width};\n\n position: relative;\n`;\n\nexport const StyledTextArea = styled.textarea<{\n hasHelper: boolean;\n hasContentRight: boolean;\n applyCustomWidth: boolean;\n width?: string | number;\n height?: string | number;\n resize?: string;\n}>`\n display: block;\n box-sizing: border-box;\n outline: none;\n border: none;\n -webkit-appearance: none; /* для отображение рамок на iOS */\n background-color: transparent;\n\n color: var(${tokens.inputColor});\n caret-color: var(${tokens.inputCaretColor});\n\n resize: ${({ resize }) => resize || 'none'};\n\n --plasma_private-textarea-height: ${({ height }) =>\n !Number.isNaN(Number(height)) ? `calc(${height}rem - 0.875rem)` : height || `var(${tokens.inputHeight})`};\n\n --plasma_private-textarea-width: ${({ width }) =>\n !Number.isNaN(Number(width)) ? `${width}rem` : width || `var(${tokens.inputWidth})`};\n\n --plasma_private-textarea-computed-height: ${({ rows }) =>\n rows ? 'unset' : 'var(--plasma_private-textarea-height)'};\n --plasma_private-textarea-computed-width: ${({ cols }) =>\n cols ? 'unset' : 'var(--plasma_private-textarea-width)'};\n\n height: var(--plasma_private-textarea-computed-height);\n width: var(--plasma_private-textarea-computed-width);\n\n min-width: ${({ applyCustomWidth }) => (applyCustomWidth ? 'var(--plasma_private-textarea-width)' : 'auto')};\n max-width: ${({ applyCustomWidth }) => (applyCustomWidth ? 'var(--plasma_private-textarea-width)' : 'auto')};\n\n min-height: var(${tokens.inputMinHeight});\n\n padding-right: ${({ hasContentRight }) =>\n hasContentRight ? `var(${tokens.inputPaddingRightWithRightContent})` : `var(${tokens.inputPaddingRight})`};\n padding-left: var(${tokens.inputPaddingLeft});\n padding-top: 0;\n padding-bottom: 0;\n\n /* INFO: Высчитываем высоту блока с подсказками */\n --plasma_private-textarea-helpers-computed-height: calc(\n var(${tokens.helpersPaddingTop}) + var(${tokens.helpersPaddingBottom}) + var(${tokens.helpersLineHeight})\n );\n\n --plasma_private-textarea-input-with-helpers-height: calc(\n var(--plasma_private-textarea-height) - var(--plasma_private-textarea-helpers-computed-height) +\n var(${tokens.helpersOffset})\n );\n --plasma_private-textarea-input-without-helpers-height: calc(\n var(--plasma_private-textarea-computed-height) - var(${tokens.inputPaddingBottom})\n );\n\n --plasma_private-textarea-input-actual-height: ${({ hasHelper, rows }) =>\n hasHelper && !rows\n ? 'var(--plasma_private-textarea-input-with-helpers-height)'\n : 'var(--plasma_private-textarea-input-without-helpers-height)'};\n\n height: var(--plasma_private-textarea-input-actual-height);\n\n font-family: var(${tokens.inputFontFamily});\n font-size: var(${tokens.inputFontSize});\n font-style: var(${tokens.inputFontStyle});\n font-weight: var(${tokens.inputFontWeight});\n letter-spacing: var(${tokens.inputLetterSpacing});\n line-height: var(${tokens.inputLineHeight});\n\n &::placeholder {\n opacity: 0;\n }\n\n &:read-only {\n cursor: default;\n }\n\n &:focus:not(:disabled) {\n color: var(${tokens.inputColorFocus});\n }\n`;\n\nexport const StyledHelpers = styled.div`\n box-sizing: border-box;\n display: flex;\n justify-content: space-between;\n\n transition: background-color 0.1s ease-in-out;\n\n background-color: var(${tokens.helpersBackgroundColor});\n\n padding-top: var(${tokens.helpersPaddingTop});\n padding-right: var(${tokens.helpersPaddingRight});\n padding-bottom: var(${tokens.helpersPaddingBottom});\n padding-left: var(${tokens.helpersPaddingLeft});\n\n border-bottom-left-radius: var(${tokens.borderRadius});\n border-bottom-right-radius: var(${tokens.borderRadius});\n`;\n\nexport const StyledLeftHelper = styled.span`\n ${applyEllipsis()};\n\n display: block;\n\n font-family: var(${tokens.helpersFontFamily});\n font-size: var(${tokens.helpersFontSize});\n font-style: var(${tokens.helpersFontStyle});\n font-weight: var(${tokens.helpersFontWeight});\n letter-spacing: var(${tokens.helpersLetterSpacing});\n line-height: var(${tokens.helpersLineHeight});\n\n color: var(${tokens.leftHelperColor});\n`;\n\nexport const StyledRightHelper = styled(StyledLeftHelper)`\n color: var(${tokens.rightHelperColor});\n margin-left: auto;\n`;\n\nexport const StyledPlaceholder = styled.label<{\n hasContentRight: boolean;\n}>`\n box-sizing: border-box;\n position: absolute;\n pointer-events: none;\n display: inline-flex;\n align-items: center;\n\n transition: all 0.1s ease-in-out;\n transform-origin: top left;\n\n color: var(${tokens.placeholderColor});\n\n width: 100%;\n height: auto;\n\n top: var(${tokens.inputPaddingTop});\n padding-left: var(${tokens.inputPaddingLeft});\n padding-right: ${({ hasContentRight }) =>\n hasContentRight ? `var(${tokens.inputPaddingRightWithRightContent})` : `var(${tokens.inputPaddingRight})`};\n\n font-family: var(${tokens.inputFontFamily});\n font-size: var(${tokens.inputFontSize});\n font-style: var(${tokens.inputFontStyle});\n font-weight: var(${tokens.inputFontWeight});\n letter-spacing: var(${tokens.inputLetterSpacing});\n line-height: var(${tokens.inputLineHeight});\n`;\n\nexport const StyledIndicator = styled.div`\n position: absolute;\n border-radius: 50%;\n\n background-color: var(${tokens.indicatorColor});\n\n &.${classes.outerLabelPlacement} {\n width: var(${tokens.indicatorSizeOuter});\n height: var(${tokens.indicatorSizeOuter});\n inset: var(${tokens.indicatorLabelPlacementOuter});\n\n &.align-right {\n inset: var(${tokens.indicatorLabelPlacementOuterRight});\n }\n }\n\n &.${classes.innerLabelPlacement} {\n width: var(${tokens.indicatorSizeInner});\n height: var(${tokens.indicatorSizeInner});\n inset: var(${tokens.indicatorLabelPlacementInner});\n\n &.align-right {\n inset: var(${tokens.indicatorLabelPlacementInnerRight});\n }\n }\n`;\n"],"names":["StyledLabel","styled","name","class","propsAsIs","StyledOptionalText","_exp11","_ref","hasHelper","concat","tokens","inputPaddingBottomWithHelpers","inputPaddingBottom","_exp12","_ref2","borderRadiusWithHelpers","borderRadius","StyledTextAreaWrapper","vars","StyledContent","_exp16","_ref3","width","StyledContainer","_exp19","_ref4","resize","_exp20","_ref5","height","Number","isNaN","inputHeight","_exp21","_ref6","inputWidth","_exp22","_ref7","rows","_exp23","_ref8","cols","_exp25","_ref9","applyCustomWidth","_exp27","_ref10","hasContentRight","inputPaddingRightWithRightContent","inputPaddingRight","_exp34","_ref11","StyledTextArea","StyledHelpers","StyledLeftHelper","_exp57","StyledRightHelper","_exp62","_ref12","StyledPlaceholder","StyledIndicator"],"mappings":"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"}
@@ -0,0 +1,11 @@
1
+ .s1luq7vd{position:relative;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;margin-bottom:var(--plasma-textarea-label-margin-bottom);font-family:var(--plasma-textarea-input-font-family);font-size:var(--plasma-textarea-input-font-size);font-style:var(--plasma-textarea-input-font-style);font-weight:var(--plasma-textarea-input-font-weight);-webkit-letter-spacing:var(--plasma-textarea-input-letter-spacing);-moz-letter-spacing:var(--plasma-textarea-input-letter-spacing);-ms-letter-spacing:var(--plasma-textarea-input-letter-spacing);letter-spacing:var(--plasma-textarea-input-letter-spacing);line-height:var(--plasma-textarea-input-line-height);}
2
+ .s1r1fvk8{color:var(--plasma-textarea__optional-color);}
3
+ .surmvwq{background-color:var(--plasma-textarea-input-background-color);padding-top:var(--plasma-textarea-input-padding-top);padding-bottom:var(--surmvwq-0);border-radius:var(--surmvwq-1);}
4
+ .s18bd513{position:absolute;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;bottom:0;z-index:1;top:var(--plasma-textarea-right-content-top);right:var(--plasma-textarea-right-content-right);height:var(--plasma-textarea-right-content-height);}
5
+ .s7alcr2{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;width:var(--s7alcr2-0);position:relative;}
6
+ .si9oz50{display:block;box-sizing:border-box;outline:none;border:none;-webkit-appearance:none;background-color:transparent;color:var(--plasma-textarea-input-color);caret-color:var(--plasma-textarea-input-caret-color);resize:var(--si9oz50-0);--plasma_private-textarea-height:var(--si9oz50-1);--plasma_private-textarea-width:var(--si9oz50-2);--plasma_private-textarea-computed-height:var(--si9oz50-3);--plasma_private-textarea-computed-width:var(--si9oz50-4);height:var(--plasma_private-textarea-computed-height);width:var(--plasma_private-textarea-computed-width);min-width:var(--si9oz50-5);max-width:var(--si9oz50-5);min-height:var(--plasma-textarea-input-min-height);padding-right:var(--si9oz50-6);padding-left:var(--plasma-textarea-input-padding-left);padding-top:0;padding-bottom:0;--plasma_private-textarea-helpers-computed-height:calc( var(--plasma-textarea-helpers-padding-top) + var(--plasma-textarea-helpers-padding-bottom) + var(--plasma-textarea-helpers-line-height) );--plasma_private-textarea-input-with-helpers-height:calc( var(--plasma_private-textarea-height) - var(--plasma_private-textarea-helpers-computed-height) + var(--plasma-textarea-helpers-offset) );--plasma_private-textarea-input-without-helpers-height:calc( var(--plasma_private-textarea-computed-height) - var(--plasma-textarea-input-padding-bottom) );--plasma_private-textarea-input-actual-height:var(--si9oz50-7);height:var(--plasma_private-textarea-input-actual-height);font-family:var(--plasma-textarea-input-font-family);font-size:var(--plasma-textarea-input-font-size);font-style:var(--plasma-textarea-input-font-style);font-weight:var(--plasma-textarea-input-font-weight);-webkit-letter-spacing:var(--plasma-textarea-input-letter-spacing);-moz-letter-spacing:var(--plasma-textarea-input-letter-spacing);-ms-letter-spacing:var(--plasma-textarea-input-letter-spacing);letter-spacing:var(--plasma-textarea-input-letter-spacing);line-height:var(--plasma-textarea-input-line-height);}.si9oz50::-webkit-input-placeholder{opacity:0;}.si9oz50::-moz-placeholder{opacity:0;}.si9oz50:-ms-input-placeholder{opacity:0;}.si9oz50::placeholder{opacity:0;}.si9oz50:-moz-read-only{cursor:default;}.si9oz50:read-only{cursor:default;}.si9oz50:focus:not(:disabled){color:var(--plasma-textarea-input-color-focus);}
7
+ .s18tpn65{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;-webkit-transition:background-color 0.1s ease-in-out;transition:background-color 0.1s ease-in-out;background-color:var(--plasma-textarea-helpers-background-color);padding-top:var(--plasma-textarea-helpers-padding-top);padding-right:var(--plasma-textarea-helpers-padding-right);padding-bottom:var(--plasma-textarea-helpers-padding-bottom);padding-left:var(--plasma-textarea-helpers-padding-left);border-bottom-left-radius:var(--plasma-textarea-border-radius);border-bottom-right-radius:var(--plasma-textarea-border-radius);}
8
+ .s19sfsrt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;font-family:var(--plasma-textarea-helpers-font-family);font-size:var(--plasma-textarea-helpers-font-size);font-style:var(--plasma-textarea-helpers-font-style);font-weight:var(--plasma-textarea-helpers-font-weight);-webkit-letter-spacing:var(--plasma-textarea-helpers-letter-spacing);-moz-letter-spacing:var(--plasma-textarea-helpers-letter-spacing);-ms-letter-spacing:var(--plasma-textarea-helpers-letter-spacing);letter-spacing:var(--plasma-textarea-helpers-letter-spacing);line-height:var(--plasma-textarea-helpers-line-height);color:var(--plasma-textarea-left-helper-color);}
9
+ .sfype23.s19sfsrt{color:var(--plasma-textarea-right-helper-color);margin-left:auto;}
10
+ .s3wsw3p{box-sizing:border-box;position:absolute;pointer-events:none;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-transition:all 0.1s ease-in-out;transition:all 0.1s ease-in-out;-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;color:var(--plasma-textarea-placeholder-color);width:100%;height:auto;top:var(--plasma-textarea-input-padding-top);padding-left:var(--plasma-textarea-input-padding-left);padding-right:var(--s3wsw3p-0);font-family:var(--plasma-textarea-input-font-family);font-size:var(--plasma-textarea-input-font-size);font-style:var(--plasma-textarea-input-font-style);font-weight:var(--plasma-textarea-input-font-weight);-webkit-letter-spacing:var(--plasma-textarea-input-letter-spacing);-moz-letter-spacing:var(--plasma-textarea-input-letter-spacing);-ms-letter-spacing:var(--plasma-textarea-input-letter-spacing);letter-spacing:var(--plasma-textarea-input-letter-spacing);line-height:var(--plasma-textarea-input-line-height);}
11
+ .stc5t23{position:absolute;border-radius:50%;background-color:var(--plasma-textarea-indicator-color);}.stc5t23.label-placement-outer{width:var(--plasma-textarea-indicator-size-outer);height:var(--plasma-textarea-indicator-size-outer);inset:var(--plasma-textarea-indicator-placement-outer);}.stc5t23.label-placement-outer.align-right{inset:var(--plasma-textarea-indicator-placement-outer-right);}.stc5t23.label-placement-inner{width:var(--plasma-textarea-indicator-size-inner);height:var(--plasma-textarea-indicator-size-inner);inset:var(--plasma-textarea-indicator-placement-inner);}.stc5t23.label-placement-inner.align-right{inset:var(--plasma-textarea-indicator-placement-inner-right);}
@@ -14,7 +14,9 @@ var classes = {
14
14
  /** Класс для компонента `StyledPlaceholder` */
15
15
  styledPlaceholder: 'textarea-placeholder',
16
16
  /** Класс для компонента `StyledHelpers` */
17
- styledHelpers: 'textarea-helpers'
17
+ styledHelpers: 'textarea-helpers',
18
+ innerLabelPlacement: 'label-placement-inner',
19
+ outerLabelPlacement: 'label-placement-outer'
18
20
  };
19
21
  var tokens = {
20
22
  /** Цвет фона для элемента textarea */
@@ -51,6 +53,8 @@ var tokens = {
51
53
  placeholderColor: '--plasma-textarea-placeholder-color',
52
54
  /** Цвет элемента placeholder в состоянии focus */
53
55
  placeholderColorFocus: '--plasma-textarea-placeholder-color-focus',
56
+ /** Цвет элемента optional */
57
+ optionalColor: '--plasma-textarea__optional-color',
54
58
  /** Цвет текста для левой подписи снизу */
55
59
  leftHelperColor: '--plasma-textarea-left-helper-color',
56
60
  /** Цвет текста для правой подписи снизу */
@@ -146,7 +150,14 @@ var tokens = {
146
150
  /** Прозрачность для всего компонента в состоянии disabled */
147
151
  disabledOpacity: '--plasma-textarea-disabled-opacity',
148
152
  /** Цвет текста для элемента textarea в состоянии disabled */
149
- inputColorDisabled: '--plasma-textarea-input-color-disabled'
153
+ inputColorDisabled: '--plasma-textarea-input-color-disabled',
154
+ indicatorColor: '--plasma-textarea-indicator-color',
155
+ indicatorSizeInner: '--plasma-textarea-indicator-size-inner',
156
+ indicatorSizeOuter: '--plasma-textarea-indicator-size-outer',
157
+ indicatorLabelPlacementInner: '--plasma-textarea-indicator-placement-inner',
158
+ indicatorLabelPlacementOuter: '--plasma-textarea-indicator-placement-outer',
159
+ indicatorLabelPlacementInnerRight: '--plasma-textarea-indicator-placement-inner-right',
160
+ indicatorLabelPlacementOuterRight: '--plasma-textarea-indicator-placement-outer-right'
150
161
  };
151
162
 
152
163
  export { classes, tokens };
@@ -1 +1 @@
1
- {"version":3,"file":"TextArea.tokens.js","sources":["../../../src/components/TextArea/TextArea.tokens.ts"],"sourcesContent":["export const classes = {\n /** Класс отвечающий за поднятие и уменьшение плейсхолдера */\n innerPlaceholderUp: 'inner-placeholder-up',\n /** Класс отвечающий за изменение цвета плейсхолдера при фокусе */\n focusedOuterPlaceholderColor: 'focused-outer-placeholder-color',\n /** Класс отвечающий за скрытие плейсхолдера */\n hidePlaceHolder: 'hide-placeholder',\n /** Класс для компонента `StyledContainer` */\n styledContainer: 'textarea-container',\n /** Класс для компонента `StyledTextArea` */\n styledTextArea: 'textarea',\n /** Класс для компонента `StyledTextAreaWrapper` */\n styledTextAreaWrapper: 'textarea-wrapper',\n /** Класс для компонента `StyledPlaceholder` */\n styledPlaceholder: 'textarea-placeholder',\n /** Класс для компонента `StyledHelpers` */\n styledHelpers: 'textarea-helpers',\n};\n\nexport const tokens = {\n /** Цвет фона для элемента textarea */\n inputBackgroundColor: '--plasma-textarea-input-background-color',\n /** Цвет фона для элемента textarea в состоянии hover */\n inputBackgroundColorHover: '--plasma-textarea-input-background-color-hover',\n /** Цвет фона для элемента textarea в состоянии active */\n inputBackgroundColorActive: '--plasma-textarea-input-background-color-active',\n /** Цвет фона для элемента textarea в состоянии focus */\n inputBackgroundColorFocus: '--plasma-textarea-input-background-color-focus',\n /** Цвета границы для элемента textarea */\n inputBorderColor: '--plasma-textarea-input-border-color',\n /** Цвета границы для элемента textarea в состоянии hover */\n inputBorderColorHover: '--plasma-textarea-input-border-color-hover',\n /** Цвета границы для элемента textarea в состоянии active */\n inputBorderColorActive: '--plasma-textarea-input-border-color-active',\n /** Цвета границы для элемента textarea в состоянии focus */\n inputBorderColorFocus: '--plasma-textarea-input-border-color-focus',\n /** Цвет фона для блока подписей снизу */\n helpersBackgroundColor: '--plasma-textarea-helpers-background-color',\n /** Цвет фона для блока подписей снизу в состоянии hover */\n helpersBackgroundColorHover: '--plasma-textarea-helpers-background-color-hover',\n /** Цвет фона для блока подписей снизу в состоянии active */\n helpersBackgroundColorActive: '--plasma-textarea-helpers-background-color-active',\n /** Цвет фона для блока подписей снизу в состоянии focus */\n helpersBackgroundColorFocus: '--plasma-textarea-helpers-background-color-focus',\n /** Цвет текста для элемента textarea */\n inputColor: '--plasma-textarea-input-color',\n /** Цвет текста для элемента textarea в состоянии focus */\n inputColorFocus: '--plasma-textarea-input-color-focus',\n /** Цвет каретки для элемента textarea */\n inputCaretColor: '--plasma-textarea-input-caret-color',\n /** Цвет элемента placeholder */\n placeholderColor: '--plasma-textarea-placeholder-color',\n /** Цвет элемента placeholder в состоянии focus */\n placeholderColorFocus: '--plasma-textarea-placeholder-color-focus',\n /** Цвет текста для левой подписи снизу */\n leftHelperColor: '--plasma-textarea-left-helper-color',\n /** Цвет текста для правой подписи снизу */\n rightHelperColor: '--plasma-textarea-right-helper-color',\n /** Цвета границы для всего компонента */\n borderColor: '--plasma-textarea-border-color',\n /** Цвета границы для всего компонента в состоянии hover */\n borderColorHover: '--plasma-textarea-border-color-hover',\n /** Цвета границы для всего компонента в состоянии focus */\n borderColorFocus: '--plasma-textarea-border-color-focus',\n\n /** Ширина элемента textarea */\n inputWidth: '--plasma-textarea-input-width',\n /** Высота элемента textarea */\n inputHeight: '--plasma-textarea-input-height',\n /** Минимальная высота элемента textarea */\n inputMinHeight: '--plasma-textarea-input-min-height',\n /** Толщина рамки всего компонента */\n borderSize: '--plasma-textarea-border-size',\n /** Размер скругления рамки всего компонента */\n borderRadius: '--plasma-textarea-border-radius',\n /** Размер скругления рамки всего компонента, когда есть блок подписей и у него нет рамки */\n borderRadiusWithHelpers: '--plasma-textarea-border-radius-with-helpers',\n /** Отступ сверху для элемента textarea */\n inputPaddingTop: '--plasma-textarea-input-padding-top',\n /** Отступ справа для элемента textarea */\n inputPaddingRight: '--plasma-textarea-input-padding-right',\n /** Отступ справа для элемента textarea, когда есть контент справа */\n inputPaddingRightWithRightContent: '--plasma-textarea-input-padding-right-with-right-content',\n /** Отступ снизу для элемента textarea */\n inputPaddingBottom: '--plasma-textarea-input-padding-bottom',\n /** Отступ снизу для элемента textarea, когда есть блок подписей */\n inputPaddingBottomWithHelpers: '--plasma-textarea-input-padding-bottom-with-helpers',\n /** Отступ слева для элемента textarea */\n inputPaddingLeft: '--plasma-textarea-input-padding-left',\n /** Отступ сверху для блока подписей */\n helpersPaddingTop: '--plasma-textarea-helpers-padding-top',\n /** Отступ справа для блока подписей */\n helpersPaddingRight: '--plasma-textarea-helpers-padding-right',\n /** Отступ снизу для блока подписей */\n helpersPaddingBottom: '--plasma-textarea-helpers-padding-bottom',\n /** Отступ слева для блока подписей */\n helpersPaddingLeft: '--plasma-textarea-helpers-padding-left',\n /** Вспомогательная высота для всего компонента, когда есть блок подписей и у него нет рамки */\n helpersOffset: '--plasma-textarea-helpers-offset',\n /** Отступ сверху для контента справа */\n rightContentTop: '--plasma-textarea-right-content-top',\n /** Отступ справа для контента справа */\n rightContentRight: '--plasma-textarea-right-content-right',\n /** Высота контента справа */\n rightContentHeight: '--plasma-textarea-right-content-height',\n /** Отступ сверху для элемента label, когда он внутри и уменьшен */\n labelMarginBottom: '--plasma-textarea-label-margin-bottom',\n /** Шрифт для элемента label, когда он внутри и уменьшен */\n labelInnerFontFamily: '--plasma-textarea-label-inner-font-family',\n /** Размер шрифта для элемента label, когда он внутри и уменьшен */\n labelInnerFontSize: '--plasma-textarea-label-inner-font-size',\n /** Стиль шрифта для элемента label, когда он внутри и уменьшен */\n labelInnerFontStyle: '--plasma-textarea-label-inner-font-style',\n /** Начертание шрифта для элемента label, когда он внутри и уменьшен */\n labelInnerFontWeight: '--plasma-textarea-label-inner-font-weight',\n /** Межсимвольное расстояние для элемента label, когда он внутри и уменьшен */\n labelInnerLetterSpacing: '--plasma-textarea-label-inner-letter-spacing',\n /** Высота строки для элемента label, когда он внутри и уменьшен */\n labelInnerLineHeight: '--plasma-textarea-label-inner-line-height',\n /** Отступ сверху для элемента textarea при фокусе */\n labelInnerTop: '--plasma-textarea-label-inner-top',\n /** Отступ между Label и TextArea */\n labelInnerMarginBottom: '--plasma-textarea-label-inner-margin-bottom',\n /** Шрифт для элемента textarea */\n inputFontFamily: '--plasma-textarea-input-font-family',\n /** Размер шрифта для элемента textarea */\n inputFontSize: '--plasma-textarea-input-font-size',\n /** Стиль шрифта для элемента textarea */\n inputFontStyle: '--plasma-textarea-input-font-style',\n /** Начертание шрифта для элемента textarea */\n inputFontWeight: '--plasma-textarea-input-font-weight',\n /** Межсимвольное расстояние шрифта для элемента textarea */\n inputLetterSpacing: '--plasma-textarea-input-letter-spacing',\n /** Высота строки шрифта для элемента textarea */\n inputLineHeight: '--plasma-textarea-input-line-height',\n /** Шрифт для элемента блока подписей снизу */\n helpersFontFamily: '--plasma-textarea-helpers-font-family',\n /** Размер шрифта для элемента блока подписей снизу */\n helpersFontSize: '--plasma-textarea-helpers-font-size',\n /** Стиль шрифта для элемента блока подписей снизу */\n helpersFontStyle: '--plasma-textarea-helpers-font-style',\n /** Начертание шрифта для элемента блока подписей снизу */\n helpersFontWeight: '--plasma-textarea-helpers-font-weight',\n /** Межсимвольное расстояние для элемента блока подписей снизу */\n helpersLetterSpacing: '--plasma-textarea-helpers-letter-spacing',\n /** Высота строки для элемента блока подписей снизу */\n helpersLineHeight: '--plasma-textarea-helpers-line-height',\n\n /** Прозрачность для всего компонента в состоянии disabled */\n disabledOpacity: '--plasma-textarea-disabled-opacity',\n /** Цвет текста для элемента textarea в состоянии disabled */\n inputColorDisabled: '--plasma-textarea-input-color-disabled',\n};\n"],"names":["classes","innerPlaceholderUp","focusedOuterPlaceholderColor","hidePlaceHolder","styledContainer","styledTextArea","styledTextAreaWrapper","styledPlaceholder","styledHelpers","tokens","inputBackgroundColor","inputBackgroundColorHover","inputBackgroundColorActive","inputBackgroundColorFocus","inputBorderColor","inputBorderColorHover","inputBorderColorActive","inputBorderColorFocus","helpersBackgroundColor","helpersBackgroundColorHover","helpersBackgroundColorActive","helpersBackgroundColorFocus","inputColor","inputColorFocus","inputCaretColor","placeholderColor","placeholderColorFocus","leftHelperColor","rightHelperColor","borderColor","borderColorHover","borderColorFocus","inputWidth","inputHeight","inputMinHeight","borderSize","borderRadius","borderRadiusWithHelpers","inputPaddingTop","inputPaddingRight","inputPaddingRightWithRightContent","inputPaddingBottom","inputPaddingBottomWithHelpers","inputPaddingLeft","helpersPaddingTop","helpersPaddingRight","helpersPaddingBottom","helpersPaddingLeft","helpersOffset","rightContentTop","rightContentRight","rightContentHeight","labelMarginBottom","labelInnerFontFamily","labelInnerFontSize","labelInnerFontStyle","labelInnerFontWeight","labelInnerLetterSpacing","labelInnerLineHeight","labelInnerTop","labelInnerMarginBottom","inputFontFamily","inputFontSize","inputFontStyle","inputFontWeight","inputLetterSpacing","inputLineHeight","helpersFontFamily","helpersFontSize","helpersFontStyle","helpersFontWeight","helpersLetterSpacing","helpersLineHeight","disabledOpacity","inputColorDisabled"],"mappings":"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"}
1
+ {"version":3,"file":"TextArea.tokens.js","sources":["../../../src/components/TextArea/TextArea.tokens.ts"],"sourcesContent":["export const classes = {\n /** Класс отвечающий за поднятие и уменьшение плейсхолдера */\n innerPlaceholderUp: 'inner-placeholder-up',\n /** Класс отвечающий за изменение цвета плейсхолдера при фокусе */\n focusedOuterPlaceholderColor: 'focused-outer-placeholder-color',\n /** Класс отвечающий за скрытие плейсхолдера */\n hidePlaceHolder: 'hide-placeholder',\n /** Класс для компонента `StyledContainer` */\n styledContainer: 'textarea-container',\n /** Класс для компонента `StyledTextArea` */\n styledTextArea: 'textarea',\n /** Класс для компонента `StyledTextAreaWrapper` */\n styledTextAreaWrapper: 'textarea-wrapper',\n /** Класс для компонента `StyledPlaceholder` */\n styledPlaceholder: 'textarea-placeholder',\n /** Класс для компонента `StyledHelpers` */\n styledHelpers: 'textarea-helpers',\n innerLabelPlacement: 'label-placement-inner',\n outerLabelPlacement: 'label-placement-outer',\n};\n\nexport const tokens = {\n /** Цвет фона для элемента textarea */\n inputBackgroundColor: '--plasma-textarea-input-background-color',\n /** Цвет фона для элемента textarea в состоянии hover */\n inputBackgroundColorHover: '--plasma-textarea-input-background-color-hover',\n /** Цвет фона для элемента textarea в состоянии active */\n inputBackgroundColorActive: '--plasma-textarea-input-background-color-active',\n /** Цвет фона для элемента textarea в состоянии focus */\n inputBackgroundColorFocus: '--plasma-textarea-input-background-color-focus',\n /** Цвета границы для элемента textarea */\n inputBorderColor: '--plasma-textarea-input-border-color',\n /** Цвета границы для элемента textarea в состоянии hover */\n inputBorderColorHover: '--plasma-textarea-input-border-color-hover',\n /** Цвета границы для элемента textarea в состоянии active */\n inputBorderColorActive: '--plasma-textarea-input-border-color-active',\n /** Цвета границы для элемента textarea в состоянии focus */\n inputBorderColorFocus: '--plasma-textarea-input-border-color-focus',\n /** Цвет фона для блока подписей снизу */\n helpersBackgroundColor: '--plasma-textarea-helpers-background-color',\n /** Цвет фона для блока подписей снизу в состоянии hover */\n helpersBackgroundColorHover: '--plasma-textarea-helpers-background-color-hover',\n /** Цвет фона для блока подписей снизу в состоянии active */\n helpersBackgroundColorActive: '--plasma-textarea-helpers-background-color-active',\n /** Цвет фона для блока подписей снизу в состоянии focus */\n helpersBackgroundColorFocus: '--plasma-textarea-helpers-background-color-focus',\n /** Цвет текста для элемента textarea */\n inputColor: '--plasma-textarea-input-color',\n /** Цвет текста для элемента textarea в состоянии focus */\n inputColorFocus: '--plasma-textarea-input-color-focus',\n /** Цвет каретки для элемента textarea */\n inputCaretColor: '--plasma-textarea-input-caret-color',\n /** Цвет элемента placeholder */\n placeholderColor: '--plasma-textarea-placeholder-color',\n /** Цвет элемента placeholder в состоянии focus */\n placeholderColorFocus: '--plasma-textarea-placeholder-color-focus',\n /** Цвет элемента optional */\n optionalColor: '--plasma-textarea__optional-color',\n /** Цвет текста для левой подписи снизу */\n leftHelperColor: '--plasma-textarea-left-helper-color',\n /** Цвет текста для правой подписи снизу */\n rightHelperColor: '--plasma-textarea-right-helper-color',\n /** Цвета границы для всего компонента */\n borderColor: '--plasma-textarea-border-color',\n /** Цвета границы для всего компонента в состоянии hover */\n borderColorHover: '--plasma-textarea-border-color-hover',\n /** Цвета границы для всего компонента в состоянии focus */\n borderColorFocus: '--plasma-textarea-border-color-focus',\n\n /** Ширина элемента textarea */\n inputWidth: '--plasma-textarea-input-width',\n /** Высота элемента textarea */\n inputHeight: '--plasma-textarea-input-height',\n /** Минимальная высота элемента textarea */\n inputMinHeight: '--plasma-textarea-input-min-height',\n /** Толщина рамки всего компонента */\n borderSize: '--plasma-textarea-border-size',\n /** Размер скругления рамки всего компонента */\n borderRadius: '--plasma-textarea-border-radius',\n /** Размер скругления рамки всего компонента, когда есть блок подписей и у него нет рамки */\n borderRadiusWithHelpers: '--plasma-textarea-border-radius-with-helpers',\n /** Отступ сверху для элемента textarea */\n inputPaddingTop: '--plasma-textarea-input-padding-top',\n /** Отступ справа для элемента textarea */\n inputPaddingRight: '--plasma-textarea-input-padding-right',\n /** Отступ справа для элемента textarea, когда есть контент справа */\n inputPaddingRightWithRightContent: '--plasma-textarea-input-padding-right-with-right-content',\n /** Отступ снизу для элемента textarea */\n inputPaddingBottom: '--plasma-textarea-input-padding-bottom',\n /** Отступ снизу для элемента textarea, когда есть блок подписей */\n inputPaddingBottomWithHelpers: '--plasma-textarea-input-padding-bottom-with-helpers',\n /** Отступ слева для элемента textarea */\n inputPaddingLeft: '--plasma-textarea-input-padding-left',\n /** Отступ сверху для блока подписей */\n helpersPaddingTop: '--plasma-textarea-helpers-padding-top',\n /** Отступ справа для блока подписей */\n helpersPaddingRight: '--plasma-textarea-helpers-padding-right',\n /** Отступ снизу для блока подписей */\n helpersPaddingBottom: '--plasma-textarea-helpers-padding-bottom',\n /** Отступ слева для блока подписей */\n helpersPaddingLeft: '--plasma-textarea-helpers-padding-left',\n /** Вспомогательная высота для всего компонента, когда есть блок подписей и у него нет рамки */\n helpersOffset: '--plasma-textarea-helpers-offset',\n /** Отступ сверху для контента справа */\n rightContentTop: '--plasma-textarea-right-content-top',\n /** Отступ справа для контента справа */\n rightContentRight: '--plasma-textarea-right-content-right',\n /** Высота контента справа */\n rightContentHeight: '--plasma-textarea-right-content-height',\n /** Отступ сверху для элемента label, когда он внутри и уменьшен */\n labelMarginBottom: '--plasma-textarea-label-margin-bottom',\n /** Шрифт для элемента label, когда он внутри и уменьшен */\n labelInnerFontFamily: '--plasma-textarea-label-inner-font-family',\n /** Размер шрифта для элемента label, когда он внутри и уменьшен */\n labelInnerFontSize: '--plasma-textarea-label-inner-font-size',\n /** Стиль шрифта для элемента label, когда он внутри и уменьшен */\n labelInnerFontStyle: '--plasma-textarea-label-inner-font-style',\n /** Начертание шрифта для элемента label, когда он внутри и уменьшен */\n labelInnerFontWeight: '--plasma-textarea-label-inner-font-weight',\n /** Межсимвольное расстояние для элемента label, когда он внутри и уменьшен */\n labelInnerLetterSpacing: '--plasma-textarea-label-inner-letter-spacing',\n /** Высота строки для элемента label, когда он внутри и уменьшен */\n labelInnerLineHeight: '--plasma-textarea-label-inner-line-height',\n /** Отступ сверху для элемента textarea при фокусе */\n labelInnerTop: '--plasma-textarea-label-inner-top',\n /** Отступ между Label и TextArea */\n labelInnerMarginBottom: '--plasma-textarea-label-inner-margin-bottom',\n /** Шрифт для элемента textarea */\n inputFontFamily: '--plasma-textarea-input-font-family',\n /** Размер шрифта для элемента textarea */\n inputFontSize: '--plasma-textarea-input-font-size',\n /** Стиль шрифта для элемента textarea */\n inputFontStyle: '--plasma-textarea-input-font-style',\n /** Начертание шрифта для элемента textarea */\n inputFontWeight: '--plasma-textarea-input-font-weight',\n /** Межсимвольное расстояние шрифта для элемента textarea */\n inputLetterSpacing: '--plasma-textarea-input-letter-spacing',\n /** Высота строки шрифта для элемента textarea */\n inputLineHeight: '--plasma-textarea-input-line-height',\n /** Шрифт для элемента блока подписей снизу */\n helpersFontFamily: '--plasma-textarea-helpers-font-family',\n /** Размер шрифта для элемента блока подписей снизу */\n helpersFontSize: '--plasma-textarea-helpers-font-size',\n /** Стиль шрифта для элемента блока подписей снизу */\n helpersFontStyle: '--plasma-textarea-helpers-font-style',\n /** Начертание шрифта для элемента блока подписей снизу */\n helpersFontWeight: '--plasma-textarea-helpers-font-weight',\n /** Межсимвольное расстояние для элемента блока подписей снизу */\n helpersLetterSpacing: '--plasma-textarea-helpers-letter-spacing',\n /** Высота строки для элемента блока подписей снизу */\n helpersLineHeight: '--plasma-textarea-helpers-line-height',\n\n /** Прозрачность для всего компонента в состоянии disabled */\n disabledOpacity: '--plasma-textarea-disabled-opacity',\n /** Цвет текста для элемента textarea в состоянии disabled */\n inputColorDisabled: '--plasma-textarea-input-color-disabled',\n\n indicatorColor: '--plasma-textarea-indicator-color',\n indicatorSizeInner: '--plasma-textarea-indicator-size-inner',\n indicatorSizeOuter: '--plasma-textarea-indicator-size-outer',\n indicatorLabelPlacementInner: '--plasma-textarea-indicator-placement-inner',\n indicatorLabelPlacementOuter: '--plasma-textarea-indicator-placement-outer',\n indicatorLabelPlacementInnerRight: '--plasma-textarea-indicator-placement-inner-right',\n indicatorLabelPlacementOuterRight: '--plasma-textarea-indicator-placement-outer-right',\n};\n"],"names":["classes","innerPlaceholderUp","focusedOuterPlaceholderColor","hidePlaceHolder","styledContainer","styledTextArea","styledTextAreaWrapper","styledPlaceholder","styledHelpers","innerLabelPlacement","outerLabelPlacement","tokens","inputBackgroundColor","inputBackgroundColorHover","inputBackgroundColorActive","inputBackgroundColorFocus","inputBorderColor","inputBorderColorHover","inputBorderColorActive","inputBorderColorFocus","helpersBackgroundColor","helpersBackgroundColorHover","helpersBackgroundColorActive","helpersBackgroundColorFocus","inputColor","inputColorFocus","inputCaretColor","placeholderColor","placeholderColorFocus","optionalColor","leftHelperColor","rightHelperColor","borderColor","borderColorHover","borderColorFocus","inputWidth","inputHeight","inputMinHeight","borderSize","borderRadius","borderRadiusWithHelpers","inputPaddingTop","inputPaddingRight","inputPaddingRightWithRightContent","inputPaddingBottom","inputPaddingBottomWithHelpers","inputPaddingLeft","helpersPaddingTop","helpersPaddingRight","helpersPaddingBottom","helpersPaddingLeft","helpersOffset","rightContentTop","rightContentRight","rightContentHeight","labelMarginBottom","labelInnerFontFamily","labelInnerFontSize","labelInnerFontStyle","labelInnerFontWeight","labelInnerLetterSpacing","labelInnerLineHeight","labelInnerTop","labelInnerMarginBottom","inputFontFamily","inputFontSize","inputFontStyle","inputFontWeight","inputLetterSpacing","inputLineHeight","helpersFontFamily","helpersFontSize","helpersFontStyle","helpersFontWeight","helpersLetterSpacing","helpersLineHeight","disabledOpacity","inputColorDisabled","indicatorColor","indicatorSizeInner","indicatorSizeOuter","indicatorLabelPlacementInner","indicatorLabelPlacementOuter","indicatorLabelPlacementInnerRight","indicatorLabelPlacementOuterRight"],"mappings":"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"}
@@ -1,4 +1,4 @@
1
- import './TextField_wctd2m.css';
1
+ import './TextField_1lzb2r1.css';
2
2
  import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
3
3
  import React, { forwardRef, useRef, useState, useEffect } from 'react';
4
4
  import { useForkRef, safeUseId } from '@salutejs/plasma-core';
@@ -8,12 +8,13 @@ import { base as base$1 } from './variations/_view/base.js';
8
8
  import { base as base$3 } from './variations/_disabled/base.js';
9
9
  import { base as base$4 } from './variations/_read-only/base.js';
10
10
  import { base as base$5 } from './variations/_label-placement/base.js';
11
- import { Label, InputWrapper, StyledContentLeft, InputLabelWrapper, StyledTextBefore, StyledChips, Input, StyledTextAfter, StyledContentRight, LeftHelper } from './TextField.styles.js';
11
+ import { Label, StyledIndicator, InputWrapper, StyledContentLeft, InputLabelWrapper, StyledTextBefore, StyledChips, InputContainer, Input, InputPlaceholder, StyledTextAfter, StyledContentRight, LeftHelper, StyledOptionalText } from './TextField.styles.js';
12
12
  import { classes } from './TextField.tokens.js';
13
13
  import { TextFieldChip } from './ui/TextFieldChip/TextFieldChip.js';
14
14
  import { useKeyNavigation } from './hooks/useKeyNavigation.js';
15
15
 
16
- var _excluded = ["id", "className", "style", "contentLeft", "contentRight", "label", "labelPlacement", "textBefore", "textAfter", "placeholder", "leftHelper", "enumerationType", "view", "size", "readOnly", "disabled", "chips", "onChange", "onChangeChips", "onSearch", "onKeyDown"];
16
+ var _excluded = ["id", "className", "style", "contentLeft", "contentRight", "label", "labelPlacement", "textBefore", "textAfter", "placeholder", "leftHelper", "enumerationType", "requiredPlacement", "view", "size", "readOnly", "disabled", "required", "optional", "chips", "onChange", "onChangeChips", "onSearch", "onKeyDown"];
17
+ var optionalText = 'optional';
17
18
  var base = "bpunezx";
18
19
  var textFieldRoot = function textFieldRoot(Root) {
19
20
  return /*#__PURE__*/forwardRef(function (_ref, ref) {
@@ -30,12 +31,17 @@ var textFieldRoot = function textFieldRoot(Root) {
30
31
  leftHelper = _ref.leftHelper,
31
32
  _ref$enumerationType = _ref.enumerationType,
32
33
  enumerationType = _ref$enumerationType === void 0 ? 'plain' : _ref$enumerationType,
34
+ _ref$requiredPlacemen = _ref.requiredPlacement,
35
+ requiredPlacement = _ref$requiredPlacemen === void 0 ? 'right' : _ref$requiredPlacemen,
33
36
  view = _ref.view,
34
37
  size = _ref.size,
35
38
  _ref$readOnly = _ref.readOnly,
36
39
  readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
37
40
  _ref$disabled = _ref.disabled,
38
41
  disabled = _ref$disabled === void 0 ? false : _ref$disabled,
42
+ _ref$required = _ref.required,
43
+ required = _ref$required === void 0 ? false : _ref$required,
44
+ optional = _ref.optional,
39
45
  values = _ref.chips,
40
46
  onChange = _ref.onChange,
41
47
  onChangeChips = _ref.onChangeChips,
@@ -51,26 +57,37 @@ var textFieldRoot = function textFieldRoot(Root) {
51
57
  inputRef: inputRef,
52
58
  chipsRefs: chipsRefs
53
59
  };
54
- var _useState = useState([]),
60
+ var _useState = useState(!!rest.value),
55
61
  _useState2 = _slicedToArray(_useState, 2),
56
- chips = _useState2[0],
57
- setChips = _useState2[1];
62
+ hasValue = _useState2[0],
63
+ setHasValue = _useState2[1];
64
+ var _useState3 = useState([]),
65
+ _useState4 = _slicedToArray(_useState3, 2),
66
+ chips = _useState4[0],
67
+ setChips = _useState4[1];
58
68
  var uniqId = safeUseId();
59
69
  var innerId = id || uniqId;
60
70
  var labelId = safeUseId();
61
71
  var helperTextId = safeUseId();
62
72
  var isChipEnumeration = enumerationType === 'chip';
63
- var hideLabel = (size === 'xs' || isChipEnumeration) && labelPlacement === 'inner';
64
- var labelInside = size !== 'xs' && labelPlacement === 'inner';
65
- var innerLabelPlacementValue = hideLabel ? 'outer' : labelPlacement;
66
- var innerPlaceholderValue = hideLabel ? label : placeholder;
67
- var innerLabelValue = hideLabel ? undefined : label;
68
- var hideLabelClass = hideLabel && label ? classes.hideLabel : undefined;
69
- var labelPlacementClass = classes["".concat(labelPlacement, "LabelPlacement")];
70
- var isChipsVisible = isChipEnumeration && (chips === null || chips === void 0 ? void 0 : chips.length);
73
+ var isChipsVisible = isChipEnumeration && !!(chips !== null && chips !== void 0 && chips.length);
71
74
  var withHasChips = isChipsVisible ? classes.hasChips : undefined;
75
+ var hasLabelValue = !!label;
76
+ var hasInnerLabel = size !== 'xs' && labelPlacement === 'inner' && !isChipsVisible && hasLabelValue;
77
+ var hasOuterLabel = labelPlacement === 'outer' && hasLabelValue;
78
+ var hasPlaceholder = !!placeholder && !hasInnerLabel;
79
+ var innerLabelValue = hasInnerLabel || hasOuterLabel ? label : undefined;
80
+ var innerLabelPlacementValue = labelPlacement === 'inner' && !hasInnerLabel ? undefined : labelPlacement;
81
+ var innerPlaceholderValue = hasPlaceholder ? placeholder : undefined;
82
+ var placeholderShown = !!innerPlaceholderValue && !hasValue;
83
+ var requiredPlacementClass = requiredPlacement === 'right' ? 'align-right ' : undefined;
84
+ var labelPlacementClass = innerLabelPlacementValue ? classes["".concat(innerLabelPlacementValue, "LabelPlacement")] : undefined;
85
+ var hasValueClass = hasValue ? classes.hasValue : undefined;
72
86
  var wrapperWithoutLeftContent = !contentLeft && isChipsVisible ? classes.hasEmptyContentLeft : undefined;
73
87
  var wrapperWithoutRightContent = !contentRight && isChipsVisible ? classes.hasEmptyContentRight : undefined;
88
+ var handleInput = function handleInput(event) {
89
+ setHasValue(!!event.target.value);
90
+ };
74
91
  var handleChange = function handleChange(event) {
75
92
  if (disabled || readOnly) {
76
93
  return;
@@ -136,6 +153,9 @@ var textFieldRoot = function textFieldRoot(Root) {
136
153
  })) || [];
137
154
  setChips(newChips);
138
155
  }, [isChipEnumeration, values]);
156
+ var innerOptional = Boolean(required ? false : optional);
157
+ var hasPlaceholderOptional = innerOptional && !innerLabelValue && !hasOuterLabel;
158
+ var optionalTextNode = innerOptional ? /*#__PURE__*/React.createElement(StyledOptionalText, null, Boolean(hasPlaceholderOptional ? innerPlaceholderValue : innerLabelValue) && '\xa0', optionalText) : null;
139
159
  return /*#__PURE__*/React.createElement(Root, {
140
160
  view: view,
141
161
  size: size,
@@ -143,14 +163,18 @@ var textFieldRoot = function textFieldRoot(Root) {
143
163
  readOnly: !disabled && readOnly,
144
164
  labelPlacement: innerLabelPlacementValue,
145
165
  onClick: handleInputFocus,
146
- className: cx(labelPlacementClass, hideLabelClass, classes.textFieldGroupItem, className),
166
+ className: cx(labelPlacementClass, classes.textFieldGroupItem, className),
147
167
  style: style
148
- }, labelInside || innerLabelValue && /*#__PURE__*/React.createElement(Label, {
168
+ }, hasOuterLabel && /*#__PURE__*/React.createElement(Label, {
149
169
  id: labelId,
150
170
  htmlFor: id
151
- }, innerLabelValue), /*#__PURE__*/React.createElement(InputWrapper, {
171
+ }, required && /*#__PURE__*/React.createElement(StyledIndicator, {
172
+ className: cx(classes.outerLabelPlacement, requiredPlacementClass)
173
+ }), innerLabelValue, optionalTextNode), /*#__PURE__*/React.createElement(InputWrapper, {
152
174
  className: cx(withHasChips, wrapperWithoutLeftContent, wrapperWithoutRightContent)
153
- }, contentLeft && /*#__PURE__*/React.createElement(StyledContentLeft, null, contentLeft), /*#__PURE__*/React.createElement(InputLabelWrapper, {
175
+ }, !hasOuterLabel && required && /*#__PURE__*/React.createElement(StyledIndicator, {
176
+ className: cx(classes.innerLabelPlacement, requiredPlacementClass)
177
+ }), contentLeft && /*#__PURE__*/React.createElement(StyledContentLeft, null, contentLeft), /*#__PURE__*/React.createElement(InputLabelWrapper, {
154
178
  tabIndex: -1,
155
179
  ref: contentRef,
156
180
  onKeyDown: handleContentKeyDown,
@@ -176,20 +200,22 @@ var textFieldRoot = function textFieldRoot(Root) {
176
200
  },
177
201
  onClick: onChipClick
178
202
  });
179
- })), /*#__PURE__*/React.createElement(Input, _extends({
203
+ })), /*#__PURE__*/React.createElement(InputContainer, null, /*#__PURE__*/React.createElement(Input, _extends({
180
204
  ref: inputForkRef,
181
205
  id: innerId,
182
206
  "aria-labelledby": labelId,
183
207
  "aria-describedby": helperTextId,
184
208
  placeholder: innerPlaceholderValue,
209
+ className: cx(hasValueClass),
185
210
  disabled: disabled,
186
211
  readOnly: !disabled && readOnly,
212
+ onInput: handleInput,
187
213
  onChange: handleChange,
188
214
  onKeyDown: handleOnKeyDown
189
- }, rest)), labelInside && /*#__PURE__*/React.createElement(Label, {
215
+ }, rest)), hasInnerLabel && /*#__PURE__*/React.createElement(Label, {
190
216
  id: labelId,
191
217
  htmlFor: innerId
192
- }, innerLabelValue), textAfter && /*#__PURE__*/React.createElement(StyledTextAfter, null, textAfter)), contentRight && /*#__PURE__*/React.createElement(StyledContentRight, null, contentRight)), leftHelper && /*#__PURE__*/React.createElement(LeftHelper, {
218
+ }, innerLabelValue, optionalTextNode), placeholderShown && /*#__PURE__*/React.createElement(InputPlaceholder, null, innerPlaceholderValue, hasPlaceholderOptional && optionalTextNode)), textAfter && /*#__PURE__*/React.createElement(StyledTextAfter, null, textAfter)), contentRight && /*#__PURE__*/React.createElement(StyledContentRight, null, contentRight)), leftHelper && /*#__PURE__*/React.createElement(LeftHelper, {
193
219
  id: helperTextId
194
220
  }, leftHelper));
195
221
  });