@salutejs/plasma-new-hope 0.321.1-canary.1931.14570122322.0 → 0.321.1-canary.1937.14653374486.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (144) hide show
  1. package/cjs/components/Autocomplete/Autocomplete.css +22 -22
  2. package/cjs/components/Combobox/ComboboxNew/Combobox.css +22 -22
  3. package/cjs/components/DatePicker/RangeDate/RangeDate.css +22 -22
  4. package/cjs/components/DatePicker/RangeDate/RangeDatePopover/RangeDatePopover.css +22 -22
  5. package/cjs/components/DatePicker/SingleDate/SingleDate.css +22 -22
  6. package/cjs/components/Pagination/Pagination.css +22 -22
  7. package/cjs/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.css +22 -22
  8. package/cjs/components/Range/Range.css +22 -22
  9. package/cjs/components/Select/Select.css +22 -22
  10. package/cjs/components/Select/ui/Target/Target.css +22 -22
  11. package/cjs/components/Select/ui/Target/ui/Textfield/Textfield.css +22 -22
  12. package/cjs/components/Slider/Slider.css +22 -22
  13. package/cjs/components/Slider/components/DoubleUncontrolled/DoubleUncontrolled.css +22 -22
  14. package/cjs/components/Table/Table.css +22 -22
  15. package/cjs/components/Table/ui/Cell/Cell.css +22 -22
  16. package/cjs/components/Table/ui/EditableCell/EditableCell.css +22 -22
  17. package/cjs/components/Table/ui/HeadCell/HeadCell.css +22 -22
  18. package/cjs/components/Table/ui/HeadCell/ui/Filter/Filter.css +22 -22
  19. package/cjs/components/TextField/TextField.styles.js +17 -17
  20. package/cjs/components/TextField/TextField.styles.js.map +1 -1
  21. package/cjs/components/TextField/{TextField.styles_1cdp5eg.css → TextField.styles_1895ept.css} +1 -1
  22. package/cjs/components/TextField/ui/Hint/Hint.css +20 -20
  23. package/cjs/index.css +22 -22
  24. package/emotion/cjs/components/Accordion/Accordion.template-doc.mdx +71 -99
  25. package/emotion/cjs/components/Autocomplete/Autocomplete.template-doc.mdx +454 -523
  26. package/emotion/cjs/components/Checkbox/Checkbox.template-doc.mdx +3 -3
  27. package/emotion/cjs/components/Combobox/Combobox.template-doc.mdx +27 -58
  28. package/emotion/cjs/components/DatePicker/DatePicker.template-doc.mdx +0 -5
  29. package/emotion/cjs/components/Dropdown/Dropdown.template-doc.mdx +10 -10
  30. package/emotion/cjs/components/Flow/Flow.template-doc.mdx +2 -2
  31. package/emotion/cjs/components/Notification/Notification.template-doc.mdx +1 -10
  32. package/emotion/cjs/components/NumberFormat/NumberFormat.template-doc.mdx +4 -4
  33. package/emotion/cjs/components/Radiobox/Radiobox.template-doc.mdx +11 -10
  34. package/emotion/cjs/components/Range/Range.template-doc.mdx +1 -5
  35. package/emotion/cjs/components/Segment/Segment.template-doc.mdx +3 -3
  36. package/emotion/cjs/components/Select/Select.template-doc.mdx +27 -27
  37. package/emotion/cjs/components/Slider/Slider.template-doc.mdx +2 -2
  38. package/emotion/cjs/components/Switch/Switch.template-doc.mdx +3 -3
  39. package/emotion/cjs/components/Table/Table.template-doc.mdx +2 -2
  40. package/emotion/cjs/components/Tabs/Tabs.template-doc.mdx +7 -11
  41. package/emotion/cjs/components/TextArea/TextArea.template-doc.mdx +2 -9
  42. package/emotion/cjs/components/TextField/TextField.styles.js +23 -30
  43. package/emotion/cjs/components/TextField/TextField.template-doc.mdx +32 -117
  44. package/emotion/cjs/components/Toast/Toast.template-doc.mdx +2 -48
  45. package/emotion/cjs/components/Tooltip/Tooltip.template-doc.mdx +4 -19
  46. package/emotion/cjs/components/Tree/Tree.template-doc.mdx +1 -0
  47. package/emotion/es/components/Accordion/Accordion.template-doc.mdx +71 -99
  48. package/emotion/es/components/Autocomplete/Autocomplete.template-doc.mdx +454 -523
  49. package/emotion/es/components/Checkbox/Checkbox.template-doc.mdx +3 -3
  50. package/emotion/es/components/Combobox/Combobox.template-doc.mdx +27 -58
  51. package/emotion/es/components/DatePicker/DatePicker.template-doc.mdx +0 -5
  52. package/emotion/es/components/Dropdown/Dropdown.template-doc.mdx +10 -10
  53. package/emotion/es/components/Flow/Flow.template-doc.mdx +2 -2
  54. package/emotion/es/components/Notification/Notification.template-doc.mdx +1 -10
  55. package/emotion/es/components/NumberFormat/NumberFormat.template-doc.mdx +4 -4
  56. package/emotion/es/components/Radiobox/Radiobox.template-doc.mdx +11 -10
  57. package/emotion/es/components/Range/Range.template-doc.mdx +1 -5
  58. package/emotion/es/components/Segment/Segment.template-doc.mdx +3 -3
  59. package/emotion/es/components/Select/Select.template-doc.mdx +27 -27
  60. package/emotion/es/components/Slider/Slider.template-doc.mdx +2 -2
  61. package/emotion/es/components/Switch/Switch.template-doc.mdx +3 -3
  62. package/emotion/es/components/Table/Table.template-doc.mdx +2 -2
  63. package/emotion/es/components/Tabs/Tabs.template-doc.mdx +7 -11
  64. package/emotion/es/components/TextArea/TextArea.template-doc.mdx +2 -9
  65. package/emotion/es/components/TextField/TextField.styles.js +23 -30
  66. package/emotion/es/components/TextField/TextField.template-doc.mdx +32 -117
  67. package/emotion/es/components/Toast/Toast.template-doc.mdx +2 -48
  68. package/emotion/es/components/Tooltip/Tooltip.template-doc.mdx +4 -19
  69. package/emotion/es/components/Tree/Tree.template-doc.mdx +1 -0
  70. package/es/components/Autocomplete/Autocomplete.css +22 -22
  71. package/es/components/Combobox/ComboboxNew/Combobox.css +22 -22
  72. package/es/components/DatePicker/RangeDate/RangeDate.css +22 -22
  73. package/es/components/DatePicker/RangeDate/RangeDatePopover/RangeDatePopover.css +22 -22
  74. package/es/components/DatePicker/SingleDate/SingleDate.css +22 -22
  75. package/es/components/Pagination/Pagination.css +22 -22
  76. package/es/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.css +22 -22
  77. package/es/components/Range/Range.css +22 -22
  78. package/es/components/Select/Select.css +22 -22
  79. package/es/components/Select/ui/Target/Target.css +22 -22
  80. package/es/components/Select/ui/Target/ui/Textfield/Textfield.css +22 -22
  81. package/es/components/Slider/Slider.css +22 -22
  82. package/es/components/Slider/components/DoubleUncontrolled/DoubleUncontrolled.css +22 -22
  83. package/es/components/Table/Table.css +22 -22
  84. package/es/components/Table/ui/Cell/Cell.css +22 -22
  85. package/es/components/Table/ui/EditableCell/EditableCell.css +22 -22
  86. package/es/components/Table/ui/HeadCell/HeadCell.css +22 -22
  87. package/es/components/Table/ui/HeadCell/ui/Filter/Filter.css +22 -22
  88. package/es/components/TextField/TextField.styles.js +17 -17
  89. package/es/components/TextField/TextField.styles.js.map +1 -1
  90. package/es/components/TextField/{TextField.styles_1cdp5eg.css → TextField.styles_1895ept.css} +1 -1
  91. package/es/components/TextField/ui/Hint/Hint.css +20 -20
  92. package/es/index.css +22 -22
  93. package/package.json +4 -4
  94. package/styled-components/cjs/components/Accordion/Accordion.template-doc.mdx +71 -99
  95. package/styled-components/cjs/components/Autocomplete/Autocomplete.template-doc.mdx +454 -523
  96. package/styled-components/cjs/components/Checkbox/Checkbox.template-doc.mdx +3 -3
  97. package/styled-components/cjs/components/Combobox/Combobox.template-doc.mdx +27 -58
  98. package/styled-components/cjs/components/DatePicker/DatePicker.template-doc.mdx +0 -5
  99. package/styled-components/cjs/components/Dropdown/Dropdown.template-doc.mdx +10 -10
  100. package/styled-components/cjs/components/Flow/Flow.template-doc.mdx +2 -2
  101. package/styled-components/cjs/components/Notification/Notification.template-doc.mdx +1 -10
  102. package/styled-components/cjs/components/NumberFormat/NumberFormat.template-doc.mdx +4 -4
  103. package/styled-components/cjs/components/Radiobox/Radiobox.template-doc.mdx +11 -10
  104. package/styled-components/cjs/components/Range/Range.template-doc.mdx +1 -5
  105. package/styled-components/cjs/components/Segment/Segment.template-doc.mdx +3 -3
  106. package/styled-components/cjs/components/Select/Select.template-doc.mdx +27 -27
  107. package/styled-components/cjs/components/Slider/Slider.template-doc.mdx +2 -2
  108. package/styled-components/cjs/components/Switch/Switch.template-doc.mdx +3 -3
  109. package/styled-components/cjs/components/Table/Table.template-doc.mdx +2 -2
  110. package/styled-components/cjs/components/Tabs/Tabs.template-doc.mdx +7 -11
  111. package/styled-components/cjs/components/TextArea/TextArea.template-doc.mdx +2 -9
  112. package/styled-components/cjs/components/TextField/TextField.styles.js +2 -1
  113. package/styled-components/cjs/components/TextField/TextField.template-doc.mdx +32 -117
  114. package/styled-components/cjs/components/Toast/Toast.template-doc.mdx +2 -48
  115. package/styled-components/cjs/components/Tooltip/Tooltip.template-doc.mdx +4 -19
  116. package/styled-components/cjs/components/Tree/Tree.template-doc.mdx +1 -0
  117. package/styled-components/es/components/Accordion/Accordion.template-doc.mdx +71 -99
  118. package/styled-components/es/components/Autocomplete/Autocomplete.template-doc.mdx +454 -523
  119. package/styled-components/es/components/Checkbox/Checkbox.template-doc.mdx +3 -3
  120. package/styled-components/es/components/Combobox/Combobox.template-doc.mdx +27 -58
  121. package/styled-components/es/components/DatePicker/DatePicker.template-doc.mdx +0 -5
  122. package/styled-components/es/components/Dropdown/Dropdown.template-doc.mdx +10 -10
  123. package/styled-components/es/components/Flow/Flow.template-doc.mdx +2 -2
  124. package/styled-components/es/components/Notification/Notification.template-doc.mdx +1 -10
  125. package/styled-components/es/components/NumberFormat/NumberFormat.template-doc.mdx +4 -4
  126. package/styled-components/es/components/Radiobox/Radiobox.template-doc.mdx +11 -10
  127. package/styled-components/es/components/Range/Range.template-doc.mdx +1 -5
  128. package/styled-components/es/components/Segment/Segment.template-doc.mdx +3 -3
  129. package/styled-components/es/components/Select/Select.template-doc.mdx +27 -27
  130. package/styled-components/es/components/Slider/Slider.template-doc.mdx +2 -2
  131. package/styled-components/es/components/Switch/Switch.template-doc.mdx +3 -3
  132. package/styled-components/es/components/Table/Table.template-doc.mdx +2 -2
  133. package/styled-components/es/components/Tabs/Tabs.template-doc.mdx +7 -11
  134. package/styled-components/es/components/TextArea/TextArea.template-doc.mdx +2 -9
  135. package/styled-components/es/components/TextField/TextField.styles.js +2 -1
  136. package/styled-components/es/components/TextField/TextField.template-doc.mdx +32 -117
  137. package/styled-components/es/components/Toast/Toast.template-doc.mdx +2 -48
  138. package/styled-components/es/components/Tooltip/Tooltip.template-doc.mdx +4 -19
  139. package/styled-components/es/components/Tree/Tree.template-doc.mdx +1 -0
  140. package/types/components/TextField/TextField.styles.d.ts.map +1 -1
  141. /package/emotion/cjs/components/Combobox/ComboboxOld/{Combobox.doc.mdx → Combobox.template-doc.mdx} +0 -0
  142. /package/emotion/es/components/Combobox/ComboboxOld/{Combobox.doc.mdx → Combobox.template-doc.mdx} +0 -0
  143. /package/styled-components/cjs/components/Combobox/ComboboxOld/{Combobox.doc.mdx → Combobox.template-doc.mdx} +0 -0
  144. /package/styled-components/es/components/Combobox/ComboboxOld/{Combobox.doc.mdx → Combobox.template-doc.mdx} +0 -0
@@ -37,7 +37,7 @@ export function App() {
37
37
  ```
38
38
 
39
39
  ### Размер поля
40
- Размер поля задаётся с помощью свойства `size`. Свойство принимает значения `"l" | "m" | "s" | "xs"`:
40
+ Размер поля задаётся с помощью свойства `size`. Свойство принимает значения `"l"` и `"m"`:
41
41
 
42
42
  ```tsx live
43
43
  import React from 'react';
@@ -53,8 +53,8 @@ export function App() {
53
53
  />
54
54
  <TextField
55
55
  placeholder="Размер"
56
- size="s"
57
- defaultValue="S40"
56
+ size="m"
57
+ defaultValue="M48"
58
58
  />
59
59
  </div>
60
60
  );
@@ -62,9 +62,9 @@ export function App() {
62
62
  ```
63
63
 
64
64
  ### Статус поля
65
- Статус поля задается с помощью свойства `view`.
66
-
67
- Возможные значения свойства: `"positive" | "warning" | "negative"`
65
+ Статус поля задается с помощью свойства `status`.
66
+ Возможные значения свойства: `success`, `warning` и `error`.
67
+ На отображение TextField так же влияют свойства `clear` и `hasDivider`:
68
68
 
69
69
  ```tsx live
70
70
  import React from 'react';
@@ -75,61 +75,46 @@ export function App() {
75
75
  <div style=\{{ display: "flex", flexDirection: "column", gap: "1rem" }}>
76
76
  <div style=\{{ display: "flex", gap: "0.5rem" }}>
77
77
  <TextField
78
- placeholder="Статус positive"
79
- view="positive"
78
+ placeholder="Статус"
79
+ status="success"
80
80
  size="m"
81
- defaultValue="Positive"
81
+ defaultValue="Успех"
82
82
  />
83
83
  <TextField
84
- placeholder="Статус warning"
85
- view="warning"
84
+ placeholder="Статус"
85
+ status="warning"
86
86
  size="m"
87
- defaultValue="Warning"
87
+ defaultValue="Предупреждение"
88
88
  />
89
89
  <TextField
90
- placeholder="Статус Ошибка"
91
- view="negative"
90
+ placeholder="Статус"
91
+ status="error"
92
92
  size="m"
93
- defaultValue="Negative"
93
+ defaultValue="Ошибка"
94
94
  />
95
95
  </div>
96
- </div>
97
- );
98
- }
99
- ```
100
-
101
- ### Вариация Clear
102
- На отображение компонента так же влияют свойства `clear` и `hasDivider`:
103
-
104
- ```tsx live
105
- import React from 'react';
106
- import { TextField } from '@salutejs/{{ package }}';
107
-
108
- export function App() {
109
- return (
110
- <div style=\{{ display: "flex", flexDirection: "column", gap: "1rem" }}>
111
96
  <div style=\{{ display: "flex", gap: "0.5rem" }}>
112
97
  <TextField
113
- placeholder="Статус positive"
114
- view="positive"
98
+ placeholder="Статус"
99
+ status="success"
115
100
  size="m"
116
- defaultValue="Positive"
101
+ defaultValue="Успех"
117
102
  clear
118
103
  hasDivider
119
104
  />
120
105
  <TextField
121
- placeholder="Статус warning"
122
- view="warning"
106
+ placeholder="Статус"
107
+ status="warning"
123
108
  size="m"
124
- defaultValue="Warning"
109
+ defaultValue="Предупреждение"
125
110
  clear
126
111
  hasDivider
127
112
  />
128
113
  <TextField
129
- placeholder="Статус negative"
130
- view="negative"
114
+ placeholder="Статус"
115
+ status="error"
131
116
  size="m"
132
- defaultValue="Negative"
117
+ defaultValue="Ошибка"
133
118
  clear
134
119
  hasDivider
135
120
  />
@@ -140,11 +125,8 @@ export function App() {
140
125
  ```
141
126
 
142
127
  ### Подсказка
143
- Для вывода подсказок:
144
-
145
- - `leftHelper` внизу слева под компонентом
146
- - `titleCaption` сверху справа над компонентом
147
- - `hintText` для подсказки в виде `Tooltip`
128
+ Для вывода подсказки снизу от поля используйте свойство `helperText`,
129
+ для подсказки в виде Tooltip - `hintText`, для подсказки сверху справа - `titleCaption`:
148
130
 
149
131
  ```tsx live
150
132
  import React from 'react';
@@ -156,7 +138,7 @@ export function App() {
156
138
  <TextField
157
139
  placeholder="Введите значение"
158
140
  defaultValue="Значение"
159
- leftHelper="Подсказка снизу"
141
+ helperText="Подсказка снизу"
160
142
  titleCaption="Подсказка сверху"
161
143
  hintText="Подсказка в виде Tooltip"
162
144
  hintView="default"
@@ -169,9 +151,7 @@ export function App() {
169
151
 
170
152
  ### Режим ввода
171
153
  С помощью свойства `enumerationType` можно вводить элементы как теги. Свойство `chipType` изменяет внешний вид чипа.
172
-
173
- С помощью `chipView` можно задать общий вид `Chip`. Валидация `Chip` происходит с помощью функции `chipValidator`.
174
-
154
+ С помощью `chipView` можно задать общий вид Chip. Валидация Chip происходит с помощью функции chipValidator.
175
155
  По нажатию Enter, после ввода нужного текста, он преобразуется в Chip.
176
156
 
177
157
  ```tsx live
@@ -188,7 +168,7 @@ export function App() {
188
168
  defaultValue="Значение"
189
169
  size="l"
190
170
  enumerationType="chip"
191
- leftHelper="Подсказка снизу"
171
+ helperText="Подсказка снизу"
192
172
  chips={["Значение 1", "Значение 2"]}
193
173
  chipView="positive"
194
174
  chipValidator={validateChip}
@@ -199,7 +179,7 @@ export function App() {
199
179
  defaultValue="Значение"
200
180
  size="l"
201
181
  enumerationType="chip"
202
- leftHelper="Подсказка снизу"
182
+ helperText="Подсказка снизу"
203
183
  chips={["Значение 1"]}
204
184
  chipType="text"
205
185
  />
@@ -208,15 +188,9 @@ export function App() {
208
188
  }
209
189
  ```
210
190
 
211
- ### Обязательность поля
212
-
213
- :::tip
214
- Наличие индикатора регулируется свойством `hasRequiredIndicator`.
215
- :::
216
-
217
- Обязательность поля задаётся с помощью свойств `required` и `requiredPlacement`.
218
191
 
219
- Где `requiredPlacement` отвечает за выравнивание и принимает значения `"left"` и `"right"`:
192
+ ### Обязательность поля
193
+ Обязательность поля задаётся с помощью свойств `required` и `requiredPlacement`. Где `requiredPlacement` отвечает за выравнивание и принимает значения `"left"` и `"right"`:
220
194
 
221
195
  ```tsx live
222
196
  import React from 'react';
@@ -235,66 +209,7 @@ export function App() {
235
209
  required
236
210
  requiredPlacement="right"
237
211
  />
238
- <TextField
239
- placeholder="Введите значение"
240
- label="Поле обязательное, но не имеет визуального индикатора"
241
- required
242
- requiredPlacement="right"
243
- hasRequiredIndicator={false}
244
- />
245
212
  </div>
246
213
  );
247
214
  }
248
215
  ```
249
-
250
- ## Примеры
251
-
252
- ### TextField + очистка поля
253
-
254
- ```tsx live
255
- import React, { useState } from "react";
256
- import { TextField } from "@salutejs/{{ package }}";
257
- import { IconClose } from "@salutejs/plasma-icons";
258
-
259
- export function App() {
260
- const [value, setValue] = useState("");
261
-
262
- const ControlClear = (props: { onClick: () => void }) => {
263
- return (
264
- <div {...props}>
265
- <IconClose size="xs" color="inherit" />
266
- </div>
267
- );
268
- };
269
-
270
- return (
271
- <div>
272
- <TextField
273
- placeholder="Положение иконки"
274
- value={value}
275
- onChange={(e) => {
276
- setValue(e.target.value);
277
- }}
278
- contentRight={
279
- <ControlClear
280
- onClick={() => {
281
- setValue("");
282
- }}
283
- />
284
- }
285
- />
286
- </div>
287
- );
288
- }
289
- ```
290
-
291
- ## Клавиатурная навигация
292
-
293
- Данный компонент может полностью управляться с помощью клавиатуры, используя следующие клавиши:
294
- - по нажатию `Tab` фокусируемся на input
295
- - если enumeratinType=`chip` после ввода текста, по нажатию `Enter`, input очистится и появится Chip
296
- - если введен текст в input по нажатию `ArrowLeft` или `ArrowRight` каретка передвигается по тексту
297
- - при достижении левой границы текста или отсутствии текста в input, при нажатии `Backspace` удаляем последний Chip, если он есть
298
- - при достижении левой границы текста или отсутствии текста в input, при нажатии `ArrowLeft` переключаемся на последний Chip, если он есть
299
- - при фокусе на Chip работает переключение фокуса на другие Chip по нажатию `ArrowLeft`, `ArrowRight`; если же Chip крайний правый, при нажатии `ArrowRight` фокус переходит на input
300
-
@@ -9,11 +9,6 @@ import { PropsTable, Description } from '@site/src/components';
9
9
  <Description name="Toast" />
10
10
  <PropsTable name="Toast" />
11
11
 
12
- :::caution Устаревшие значения свойства `view`
13
- Значения `dark` и `light` являются устаревшими.<br/>
14
- Для изменения фона `Toast` используйте компонент `ViewContainer` (см. <a href="#пример-использования">пример использования</a>)
15
- :::
16
-
17
12
  ## Система подсказок
18
13
  Существует готовая система текстовых подсказок, для использования которой необходимо обернуть приложение в `ToastProvider`:
19
14
 
@@ -125,6 +120,7 @@ export interface ShowToastArgs {
125
120
  ```
126
121
 
127
122
  ## Пример использования
123
+
128
124
  Для изменения цветовой темы компонента `Toast` используйте свойство `view` компонента `ViewContainer`.
129
125
 
130
126
  ```jsx live
@@ -134,7 +130,7 @@ import { useToast, ToastProvider, Button, ViewContainer } from '@salutejs/{{ pac
134
130
  export function App() {
135
131
 
136
132
  const ToastExample = () => {
137
- const { showToast } = useToast()
133
+ const { showToast, hideToast } = useToast()
138
134
 
139
135
  const onShow = () => {}
140
136
  const onHide = () => {}
@@ -172,45 +168,3 @@ export function App() {
172
168
  )
173
169
  }
174
170
  ```
175
-
176
- ## Вид иконки
177
- Значения `positive` и `negative` свойства `view` изменяют цвет иконки.<br/>
178
- Чтобы цвет применился, установите в иконке свойство `color` со значением `inherit`:
179
-
180
- ```jsx live
181
- import React from 'react'
182
- import { IconBell } from '@salutejs/plasma-icons';
183
- import { useToast, ToastProvider, Button } from '@salutejs/{{ package }}'
184
-
185
- export function App() {
186
- const Icon = () => <IconBell color="inherit" size="xs" />;
187
-
188
- const ToastExample = () => {
189
- const { showToast } = useToast()
190
-
191
- const onShow = () => {}
192
- const onHide = () => {}
193
- const toastData = {
194
- contentLeft: <Icon />,
195
- text: 'Подсказка c иконкой',
196
- position: 'bottom',
197
- role: 'status',
198
- hasClose: true,
199
- fade: false,
200
- size: 'm',
201
- view: 'positive',
202
- timeout: 3000,
203
- onShow,
204
- onHide
205
- }
206
-
207
- return <Button onClick={() => showToast(toastData)} text="Вызвать подсказку" />
208
- }
209
-
210
- return (
211
- <ToastProvider>
212
- <ToastExample />
213
- </ToastProvider>
214
- )
215
- }
216
- ```
@@ -17,28 +17,13 @@ import { PropsTable, Description } from '@site/src/components';
17
17
 
18
18
  ```tsx live
19
19
  import React from 'react';
20
- import { Tooltip, Button } from '@salutejs/{{ package }}';
20
+ import { Tooltip } from '@salutejs/{{ package }}';
21
+ import { IconApps } from '@salutejs/plasma-icons';
21
22
 
22
23
  export function App() {
23
24
  return (
24
- <div style=\{{display: 'grid', gridTemplateColumns: 'repeat(3, max-content)', gridGap: '1rem 3.5rem', padding: '3.5rem'}}>
25
- <Tooltip
26
- target={<Tooltip target={<Button>Btn</Button>} placement="left" opened text="left" />}
27
- placement="top-start"
28
- opened
29
- text="top-start"
30
- view="default"
31
- />
32
- <Tooltip target={<Button>Btn</Button>} placement="top" opened text="top" />
33
- <Tooltip
34
- target={<Tooltip target={<Button>Btn</Button>} placement="right" opened text="right" />}
35
- placement="top-end"
36
- opened
37
- text="top-end"
38
- />
39
- <Tooltip target={<Button>Btn</Button>} placement="bottom-start" opened text="bottom-start" />
40
- <Tooltip target={<Button>Btn</Button>} placement="bottom" opened text="bottom" />
41
- <Tooltip target={<Button>Btn</Button>} placement="bottom-end" opened text="bottom-end" />
25
+ <div style=\{{marginLeft: '100px',marginBottom: '35px'}}>
26
+ <Tooltip target={( <IconApps />)} text="Высокое качество воспроизведения" placement="bottom" hasArrow opened />
42
27
  </div>
43
28
  );
44
29
  }
@@ -218,3 +218,4 @@ type TreeItem = {
218
218
  ```
219
219
  </TabItem>
220
220
  </Tabs>
221
+
@@ -24,28 +24,28 @@
24
24
 
25
25
  .Tooltip_1qsg6ij_s1cz8cv8__da7f9e0a{--plasma-popover-arrow-mask-width:var(--plasma-tooltip-arrow-mask-width);--plasma-popover-arrow-mask-height:var(--plasma-tooltip-arrow-mask-height);--plasma-popover-arrow-mask-image:var(--plasma-tooltip-arrow-mask-image);--plasma-popover-arrow-background:var(--plasma-tooltip-arrow-background);--plasma-popover-arrow-height:var(--plasma-tooltip-arrow-height);--plasma-popover-arrow-edge-margin:var(--plasma-tooltip-arrow-edge-margin);}
26
26
 
27
- .TextField_styles_1cdp5eg_iq39zt5__dcbef05d{position:relative;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;box-sizing:border-box;}
28
- .TextField_styles_1cdp5eg_i1j28rg8__dcbef05d{-webkit-flex:1;-ms-flex:1;flex:1;overflow:scroll;position:relative;width:100%;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-scrollbar-width:none;-moz-scrollbar-width:none;-ms-scrollbar-width:none;scrollbar-width:none;overscroll-behavior:contain;}.TextField_styles_1cdp5eg_i1j28rg8__dcbef05d::-webkit-scrollbar{display:none;}.TextField_styles_1cdp5eg_i1j28rg8__dcbef05d.TextField_styles_1cdp5eg_hasChips__dcbef05d{height:var(--plasma-textfield__chip-height);border-radius:var(--plasma-textfield__chip-border-radius);}
29
- .TextField_styles_1cdp5eg_s13zudoe__dcbef05d{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:var(--plasma-textfield__chip-gap);margin-right:var(--plasma-textfield__chip-margin-right,var(--plasma-textfield__chip-gap));-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}
30
- .TextField_styles_1cdp5eg_io4bpie__dcbef05d{box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;padding:0;background-color:transparent;outline:none;width:100%;z-index:1;}.TextField_styles_1cdp5eg_io4bpie__dcbef05d::-webkit-input-placeholder{opacity:0;}.TextField_styles_1cdp5eg_io4bpie__dcbef05d::-moz-placeholder{opacity:0;}.TextField_styles_1cdp5eg_io4bpie__dcbef05d:-ms-input-placeholder{opacity:0;}.TextField_styles_1cdp5eg_io4bpie__dcbef05d::placeholder{opacity:0;}
31
- .TextField_styles_1cdp5eg_i13qvwoy__dcbef05d{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex:1;-ms-flex:1;flex:1;min-width:var(--i13qvwoy-0);}.TextField_styles_1cdp5eg_i13qvwoy__dcbef05d .TextField_styles_1cdp5eg_io4bpie__dcbef05d{max-width:var(--i13qvwoy-1);}
32
- .TextField_styles_1cdp5eg_i19ry60d__dcbef05d{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;position:absolute;top:0;left:0;right:0;bottom:0;z-index:0;white-space:nowrap;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font:inherit;-webkit-letter-spacing:inherit;-moz-letter-spacing:inherit;-ms-letter-spacing:inherit;letter-spacing:inherit;line-height:inherit;color:var(--plasma-textfield__placeholder-color);padding:var(--i19ry60d-0);}
33
- .TextField_styles_1cdp5eg_obt1ohz__dcbef05d{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;white-space:var(--obt1ohz-0);margin-bottom:var(--obt1ohz-1);}
34
- .TextField_styles_1cdp5eg_tlv9av6__dcbef05d{display:inline-block;margin-left:auto;}
35
- .TextField_styles_1cdp5eg_s600610__dcbef05d{position:relative;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;}
36
- .TextField_styles_1cdp5eg_luk2zst__dcbef05d{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}
37
- .TextField_styles_1cdp5eg_s1gjsnfi__dcbef05d{margin:var(--plasma-textfield__left-content-margin);color:var(--s1gjsnfi-0);line-height:0;}
38
- .TextField_styles_1cdp5eg_ssv2kwg__dcbef05d{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;}
39
- .TextField_styles_1cdp5eg_s190z894__dcbef05d{line-height:0;margin:var(--plasma-textfield__right-content-margin);color:var(--plasma-textfield-content-right-slot-color,var(--plasma-textfield-content-slot-color));}.TextField_styles_1cdp5eg_s190z894__dcbef05d:hover{color:var(--plasma-textfield-content-right-slot-color-hover,var(--plasma-textfield-content-slot-color-hover));cursor:pointer;}.TextField_styles_1cdp5eg_s190z894__dcbef05d:active{color:var(--plasma-textfield-content-right-slot-color-active,var(--plasma-textfield-content-slot-color-active));}
40
-
41
- .TextField_styles_1cdp5eg_s7hnwwb__dcbef05d{visibility:var(--s7hnwwb-0);}
42
-
43
- .TextField_styles_1cdp5eg_s14qvple__dcbef05d{color:var(--plasma-textfield__optional-color);}
44
- .TextField_styles_1cdp5eg_s16itze4__dcbef05d{display:inline-block;line-height:0;}.TextField_styles_1cdp5eg_s16itze4__dcbef05d.TextField_styles_1cdp5eg_labelPlacementInner__dcbef05d{position:absolute;margin:0;inset:var(--plasma-textfield__hint-inner-label-placement-offset);}
45
- .TextField_styles_1cdp5eg_h1skqnhr__dcbef05d{color:var(--plasma-textfield__hint-icon-color);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}
46
- .TextField_styles_1cdp5eg_hgy0im1__dcbef05d .TextField_styles_1cdp5eg_h1skqnhr__dcbef05d .TextField_styles_1cdp5eg_popoverRoot__dcbef05d{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;}
47
- .TextField_styles_1cdp5eg_h8yezh4__dcbef05d{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}
48
- .TextField_styles_1cdp5eg_szsveq4__dcbef05d{position:absolute;border-radius:50%;background-color:var(--plasma-textfield__indicator-color);}.TextField_styles_1cdp5eg_szsveq4__dcbef05d.TextField_styles_1cdp5eg_labelPlacementOuter__dcbef05d{width:var(--plasma-textfield__indicator-size-outer);height:var(--plasma-textfield__indicator-size-outer);inset:var(--plasma-textfield__indicator-placement-outer);}.TextField_styles_1cdp5eg_szsveq4__dcbef05d.TextField_styles_1cdp5eg_labelPlacementOuter__dcbef05d.TextField_styles_1cdp5eg_requiredAlignRight__dcbef05d{inset:var(--plasma-textfield__indicator-placement-outer-right);}.TextField_styles_1cdp5eg_szsveq4__dcbef05d.TextField_styles_1cdp5eg_labelPlacementOuter__dcbef05d.TextField_styles_1cdp5eg_requiredAlignRight__dcbef05d.TextField_styles_1cdp5eg_textfieldHasHint__dcbef05d{right:calc( -1 * var(--plasma-textfield__indicator-size-outer) + var(--plasma-textfield__indicator-hint-placement-outer-right,0px) );}.TextField_styles_1cdp5eg_szsveq4__dcbef05d.TextField_styles_1cdp5eg_labelPlacementInner__dcbef05d{width:var(--plasma-textfield__indicator-size-inner);height:var(--plasma-textfield__indicator-size-inner);inset:var(--plasma-textfield__indicator-placement-inner);}.TextField_styles_1cdp5eg_szsveq4__dcbef05d.TextField_styles_1cdp5eg_labelPlacementInner__dcbef05d.TextField_styles_1cdp5eg_requiredAlignRight__dcbef05d{inset:var(--plasma-textfield__indicator-placement-inner-right);}
27
+ .TextField_styles_1895ept_iq39zt5__ebba80b9{position:relative;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;box-sizing:border-box;}
28
+ .TextField_styles_1895ept_i1j28rg8__ebba80b9{-webkit-flex:1;-ms-flex:1;flex:1;overflow:scroll;position:relative;width:100%;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-scrollbar-width:none;-moz-scrollbar-width:none;-ms-scrollbar-width:none;scrollbar-width:none;overscroll-behavior:contain;}.TextField_styles_1895ept_i1j28rg8__ebba80b9::-webkit-scrollbar{display:none;}.TextField_styles_1895ept_i1j28rg8__ebba80b9.TextField_styles_1895ept_hasChips__ebba80b9{height:var(--plasma-textfield__chip-height);border-radius:var(--plasma-textfield__chip-border-radius);}
29
+ .TextField_styles_1895ept_s13zudoe__ebba80b9{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:var(--plasma-textfield__chip-gap);margin-right:var(--plasma-textfield__chip-margin-right,var(--plasma-textfield__chip-gap));-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}
30
+ .TextField_styles_1895ept_io4bpie__ebba80b9{box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;padding:0;background-color:transparent;outline:none;width:100%;z-index:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.TextField_styles_1895ept_io4bpie__ebba80b9::-webkit-input-placeholder{opacity:0;}.TextField_styles_1895ept_io4bpie__ebba80b9::-moz-placeholder{opacity:0;}.TextField_styles_1895ept_io4bpie__ebba80b9:-ms-input-placeholder{opacity:0;}.TextField_styles_1895ept_io4bpie__ebba80b9::placeholder{opacity:0;}
31
+ .TextField_styles_1895ept_i13qvwoy__ebba80b9{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex:1;-ms-flex:1;flex:1;min-width:var(--i13qvwoy-0);}.TextField_styles_1895ept_i13qvwoy__ebba80b9 .TextField_styles_1895ept_io4bpie__ebba80b9{max-width:var(--i13qvwoy-1);}
32
+ .TextField_styles_1895ept_i19ry60d__ebba80b9{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;position:absolute;top:0;left:0;right:0;bottom:0;z-index:0;white-space:nowrap;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font:inherit;-webkit-letter-spacing:inherit;-moz-letter-spacing:inherit;-ms-letter-spacing:inherit;letter-spacing:inherit;line-height:inherit;color:var(--plasma-textfield__placeholder-color);padding:var(--i19ry60d-0);}
33
+ .TextField_styles_1895ept_obt1ohz__ebba80b9{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;white-space:var(--obt1ohz-0);margin-bottom:var(--obt1ohz-1);}
34
+ .TextField_styles_1895ept_tlv9av6__ebba80b9{display:inline-block;margin-left:auto;}
35
+ .TextField_styles_1895ept_s600610__ebba80b9{position:relative;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;}
36
+ .TextField_styles_1895ept_luk2zst__ebba80b9{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}
37
+ .TextField_styles_1895ept_s1gjsnfi__ebba80b9{margin:var(--plasma-textfield__left-content-margin);color:var(--s1gjsnfi-0);line-height:0;}
38
+ .TextField_styles_1895ept_ssv2kwg__ebba80b9{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;}
39
+ .TextField_styles_1895ept_s190z894__ebba80b9{line-height:0;margin:var(--plasma-textfield__right-content-margin);color:var(--plasma-textfield-content-right-slot-color,var(--plasma-textfield-content-slot-color));}.TextField_styles_1895ept_s190z894__ebba80b9:hover{color:var(--plasma-textfield-content-right-slot-color-hover,var(--plasma-textfield-content-slot-color-hover));cursor:pointer;}.TextField_styles_1895ept_s190z894__ebba80b9:active{color:var(--plasma-textfield-content-right-slot-color-active,var(--plasma-textfield-content-slot-color-active));}
40
+
41
+ .TextField_styles_1895ept_s7hnwwb__ebba80b9{visibility:var(--s7hnwwb-0);}
42
+
43
+ .TextField_styles_1895ept_s14qvple__ebba80b9{color:var(--plasma-textfield__optional-color);}
44
+ .TextField_styles_1895ept_s16itze4__ebba80b9{display:inline-block;line-height:0;}.TextField_styles_1895ept_s16itze4__ebba80b9.TextField_styles_1895ept_labelPlacementInner__ebba80b9{position:absolute;margin:0;inset:var(--plasma-textfield__hint-inner-label-placement-offset);}
45
+ .TextField_styles_1895ept_h1skqnhr__ebba80b9{color:var(--plasma-textfield__hint-icon-color);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}
46
+ .TextField_styles_1895ept_hgy0im1__ebba80b9 .TextField_styles_1895ept_h1skqnhr__ebba80b9 .TextField_styles_1895ept_popoverRoot__ebba80b9{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;}
47
+ .TextField_styles_1895ept_h8yezh4__ebba80b9{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}
48
+ .TextField_styles_1895ept_szsveq4__ebba80b9{position:absolute;border-radius:50%;background-color:var(--plasma-textfield__indicator-color);}.TextField_styles_1895ept_szsveq4__ebba80b9.TextField_styles_1895ept_labelPlacementOuter__ebba80b9{width:var(--plasma-textfield__indicator-size-outer);height:var(--plasma-textfield__indicator-size-outer);inset:var(--plasma-textfield__indicator-placement-outer);}.TextField_styles_1895ept_szsveq4__ebba80b9.TextField_styles_1895ept_labelPlacementOuter__ebba80b9.TextField_styles_1895ept_requiredAlignRight__ebba80b9{inset:var(--plasma-textfield__indicator-placement-outer-right);}.TextField_styles_1895ept_szsveq4__ebba80b9.TextField_styles_1895ept_labelPlacementOuter__ebba80b9.TextField_styles_1895ept_requiredAlignRight__ebba80b9.TextField_styles_1895ept_textfieldHasHint__ebba80b9{right:calc( -1 * var(--plasma-textfield__indicator-size-outer) + var(--plasma-textfield__indicator-hint-placement-outer-right,0px) );}.TextField_styles_1895ept_szsveq4__ebba80b9.TextField_styles_1895ept_labelPlacementInner__ebba80b9{width:var(--plasma-textfield__indicator-size-inner);height:var(--plasma-textfield__indicator-size-inner);inset:var(--plasma-textfield__indicator-placement-inner);}.TextField_styles_1895ept_szsveq4__ebba80b9.TextField_styles_1895ept_labelPlacementInner__ebba80b9.TextField_styles_1895ept_requiredAlignRight__ebba80b9{inset:var(--plasma-textfield__indicator-placement-inner-right);}
49
49
 
50
50
  .base_1lwlv7t_b13tc97x__334a4e59{color:var(--plasma-chip-color);background-color:var(--plasma-chip-background);}.base_1lwlv7t_b13tc97x__334a4e59:hover{color:var(--plasma-chip-color-hover);background-color:var(--plasma-chip-background-hover);scale:var(--plasma-chip-scale-hover);}.base_1lwlv7t_b13tc97x__334a4e59:active{color:var(--plasma-chip-color-active);background-color:var(--plasma-chip-background-active);scale:var(--plasma-chip-scale-active);}
51
51
 
@@ -75,28 +75,28 @@
75
75
 
76
76
  .Tooltip_1qsg6ij_s1cz8cv8__da7f9e0a{--plasma-popover-arrow-mask-width:var(--plasma-tooltip-arrow-mask-width);--plasma-popover-arrow-mask-height:var(--plasma-tooltip-arrow-mask-height);--plasma-popover-arrow-mask-image:var(--plasma-tooltip-arrow-mask-image);--plasma-popover-arrow-background:var(--plasma-tooltip-arrow-background);--plasma-popover-arrow-height:var(--plasma-tooltip-arrow-height);--plasma-popover-arrow-edge-margin:var(--plasma-tooltip-arrow-edge-margin);}
77
77
 
78
- .TextField_styles_1cdp5eg_iq39zt5__dcbef05d{position:relative;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;box-sizing:border-box;}
79
- .TextField_styles_1cdp5eg_i1j28rg8__dcbef05d{-webkit-flex:1;-ms-flex:1;flex:1;overflow:scroll;position:relative;width:100%;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-scrollbar-width:none;-moz-scrollbar-width:none;-ms-scrollbar-width:none;scrollbar-width:none;overscroll-behavior:contain;}.TextField_styles_1cdp5eg_i1j28rg8__dcbef05d::-webkit-scrollbar{display:none;}.TextField_styles_1cdp5eg_i1j28rg8__dcbef05d.TextField_styles_1cdp5eg_hasChips__dcbef05d{height:var(--plasma-textfield__chip-height);border-radius:var(--plasma-textfield__chip-border-radius);}
80
- .TextField_styles_1cdp5eg_s13zudoe__dcbef05d{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:var(--plasma-textfield__chip-gap);margin-right:var(--plasma-textfield__chip-margin-right,var(--plasma-textfield__chip-gap));-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}
81
- .TextField_styles_1cdp5eg_io4bpie__dcbef05d{box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;padding:0;background-color:transparent;outline:none;width:100%;z-index:1;}.TextField_styles_1cdp5eg_io4bpie__dcbef05d::-webkit-input-placeholder{opacity:0;}.TextField_styles_1cdp5eg_io4bpie__dcbef05d::-moz-placeholder{opacity:0;}.TextField_styles_1cdp5eg_io4bpie__dcbef05d:-ms-input-placeholder{opacity:0;}.TextField_styles_1cdp5eg_io4bpie__dcbef05d::placeholder{opacity:0;}
82
- .TextField_styles_1cdp5eg_i13qvwoy__dcbef05d{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex:1;-ms-flex:1;flex:1;min-width:var(--i13qvwoy-0);}.TextField_styles_1cdp5eg_i13qvwoy__dcbef05d .TextField_styles_1cdp5eg_io4bpie__dcbef05d{max-width:var(--i13qvwoy-1);}
83
- .TextField_styles_1cdp5eg_i19ry60d__dcbef05d{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;position:absolute;top:0;left:0;right:0;bottom:0;z-index:0;white-space:nowrap;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font:inherit;-webkit-letter-spacing:inherit;-moz-letter-spacing:inherit;-ms-letter-spacing:inherit;letter-spacing:inherit;line-height:inherit;color:var(--plasma-textfield__placeholder-color);padding:var(--i19ry60d-0);}
84
- .TextField_styles_1cdp5eg_obt1ohz__dcbef05d{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;white-space:var(--obt1ohz-0);margin-bottom:var(--obt1ohz-1);}
85
- .TextField_styles_1cdp5eg_tlv9av6__dcbef05d{display:inline-block;margin-left:auto;}
86
- .TextField_styles_1cdp5eg_s600610__dcbef05d{position:relative;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;}
87
- .TextField_styles_1cdp5eg_luk2zst__dcbef05d{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}
88
- .TextField_styles_1cdp5eg_s1gjsnfi__dcbef05d{margin:var(--plasma-textfield__left-content-margin);color:var(--s1gjsnfi-0);line-height:0;}
89
- .TextField_styles_1cdp5eg_ssv2kwg__dcbef05d{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;}
90
- .TextField_styles_1cdp5eg_s190z894__dcbef05d{line-height:0;margin:var(--plasma-textfield__right-content-margin);color:var(--plasma-textfield-content-right-slot-color,var(--plasma-textfield-content-slot-color));}.TextField_styles_1cdp5eg_s190z894__dcbef05d:hover{color:var(--plasma-textfield-content-right-slot-color-hover,var(--plasma-textfield-content-slot-color-hover));cursor:pointer;}.TextField_styles_1cdp5eg_s190z894__dcbef05d:active{color:var(--plasma-textfield-content-right-slot-color-active,var(--plasma-textfield-content-slot-color-active));}
91
-
92
- .TextField_styles_1cdp5eg_s7hnwwb__dcbef05d{visibility:var(--s7hnwwb-0);}
93
-
94
- .TextField_styles_1cdp5eg_s14qvple__dcbef05d{color:var(--plasma-textfield__optional-color);}
95
- .TextField_styles_1cdp5eg_s16itze4__dcbef05d{display:inline-block;line-height:0;}.TextField_styles_1cdp5eg_s16itze4__dcbef05d.TextField_styles_1cdp5eg_labelPlacementInner__dcbef05d{position:absolute;margin:0;inset:var(--plasma-textfield__hint-inner-label-placement-offset);}
96
- .TextField_styles_1cdp5eg_h1skqnhr__dcbef05d{color:var(--plasma-textfield__hint-icon-color);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}
97
- .TextField_styles_1cdp5eg_hgy0im1__dcbef05d .TextField_styles_1cdp5eg_h1skqnhr__dcbef05d .TextField_styles_1cdp5eg_popoverRoot__dcbef05d{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;}
98
- .TextField_styles_1cdp5eg_h8yezh4__dcbef05d{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}
99
- .TextField_styles_1cdp5eg_szsveq4__dcbef05d{position:absolute;border-radius:50%;background-color:var(--plasma-textfield__indicator-color);}.TextField_styles_1cdp5eg_szsveq4__dcbef05d.TextField_styles_1cdp5eg_labelPlacementOuter__dcbef05d{width:var(--plasma-textfield__indicator-size-outer);height:var(--plasma-textfield__indicator-size-outer);inset:var(--plasma-textfield__indicator-placement-outer);}.TextField_styles_1cdp5eg_szsveq4__dcbef05d.TextField_styles_1cdp5eg_labelPlacementOuter__dcbef05d.TextField_styles_1cdp5eg_requiredAlignRight__dcbef05d{inset:var(--plasma-textfield__indicator-placement-outer-right);}.TextField_styles_1cdp5eg_szsveq4__dcbef05d.TextField_styles_1cdp5eg_labelPlacementOuter__dcbef05d.TextField_styles_1cdp5eg_requiredAlignRight__dcbef05d.TextField_styles_1cdp5eg_textfieldHasHint__dcbef05d{right:calc( -1 * var(--plasma-textfield__indicator-size-outer) + var(--plasma-textfield__indicator-hint-placement-outer-right,0px) );}.TextField_styles_1cdp5eg_szsveq4__dcbef05d.TextField_styles_1cdp5eg_labelPlacementInner__dcbef05d{width:var(--plasma-textfield__indicator-size-inner);height:var(--plasma-textfield__indicator-size-inner);inset:var(--plasma-textfield__indicator-placement-inner);}.TextField_styles_1cdp5eg_szsveq4__dcbef05d.TextField_styles_1cdp5eg_labelPlacementInner__dcbef05d.TextField_styles_1cdp5eg_requiredAlignRight__dcbef05d{inset:var(--plasma-textfield__indicator-placement-inner-right);}
78
+ .TextField_styles_1895ept_iq39zt5__ebba80b9{position:relative;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;box-sizing:border-box;}
79
+ .TextField_styles_1895ept_i1j28rg8__ebba80b9{-webkit-flex:1;-ms-flex:1;flex:1;overflow:scroll;position:relative;width:100%;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-scrollbar-width:none;-moz-scrollbar-width:none;-ms-scrollbar-width:none;scrollbar-width:none;overscroll-behavior:contain;}.TextField_styles_1895ept_i1j28rg8__ebba80b9::-webkit-scrollbar{display:none;}.TextField_styles_1895ept_i1j28rg8__ebba80b9.TextField_styles_1895ept_hasChips__ebba80b9{height:var(--plasma-textfield__chip-height);border-radius:var(--plasma-textfield__chip-border-radius);}
80
+ .TextField_styles_1895ept_s13zudoe__ebba80b9{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:var(--plasma-textfield__chip-gap);margin-right:var(--plasma-textfield__chip-margin-right,var(--plasma-textfield__chip-gap));-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}
81
+ .TextField_styles_1895ept_io4bpie__ebba80b9{box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;padding:0;background-color:transparent;outline:none;width:100%;z-index:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.TextField_styles_1895ept_io4bpie__ebba80b9::-webkit-input-placeholder{opacity:0;}.TextField_styles_1895ept_io4bpie__ebba80b9::-moz-placeholder{opacity:0;}.TextField_styles_1895ept_io4bpie__ebba80b9:-ms-input-placeholder{opacity:0;}.TextField_styles_1895ept_io4bpie__ebba80b9::placeholder{opacity:0;}
82
+ .TextField_styles_1895ept_i13qvwoy__ebba80b9{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex:1;-ms-flex:1;flex:1;min-width:var(--i13qvwoy-0);}.TextField_styles_1895ept_i13qvwoy__ebba80b9 .TextField_styles_1895ept_io4bpie__ebba80b9{max-width:var(--i13qvwoy-1);}
83
+ .TextField_styles_1895ept_i19ry60d__ebba80b9{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;position:absolute;top:0;left:0;right:0;bottom:0;z-index:0;white-space:nowrap;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font:inherit;-webkit-letter-spacing:inherit;-moz-letter-spacing:inherit;-ms-letter-spacing:inherit;letter-spacing:inherit;line-height:inherit;color:var(--plasma-textfield__placeholder-color);padding:var(--i19ry60d-0);}
84
+ .TextField_styles_1895ept_obt1ohz__ebba80b9{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;white-space:var(--obt1ohz-0);margin-bottom:var(--obt1ohz-1);}
85
+ .TextField_styles_1895ept_tlv9av6__ebba80b9{display:inline-block;margin-left:auto;}
86
+ .TextField_styles_1895ept_s600610__ebba80b9{position:relative;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;}
87
+ .TextField_styles_1895ept_luk2zst__ebba80b9{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}
88
+ .TextField_styles_1895ept_s1gjsnfi__ebba80b9{margin:var(--plasma-textfield__left-content-margin);color:var(--s1gjsnfi-0);line-height:0;}
89
+ .TextField_styles_1895ept_ssv2kwg__ebba80b9{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;}
90
+ .TextField_styles_1895ept_s190z894__ebba80b9{line-height:0;margin:var(--plasma-textfield__right-content-margin);color:var(--plasma-textfield-content-right-slot-color,var(--plasma-textfield-content-slot-color));}.TextField_styles_1895ept_s190z894__ebba80b9:hover{color:var(--plasma-textfield-content-right-slot-color-hover,var(--plasma-textfield-content-slot-color-hover));cursor:pointer;}.TextField_styles_1895ept_s190z894__ebba80b9:active{color:var(--plasma-textfield-content-right-slot-color-active,var(--plasma-textfield-content-slot-color-active));}
91
+
92
+ .TextField_styles_1895ept_s7hnwwb__ebba80b9{visibility:var(--s7hnwwb-0);}
93
+
94
+ .TextField_styles_1895ept_s14qvple__ebba80b9{color:var(--plasma-textfield__optional-color);}
95
+ .TextField_styles_1895ept_s16itze4__ebba80b9{display:inline-block;line-height:0;}.TextField_styles_1895ept_s16itze4__ebba80b9.TextField_styles_1895ept_labelPlacementInner__ebba80b9{position:absolute;margin:0;inset:var(--plasma-textfield__hint-inner-label-placement-offset);}
96
+ .TextField_styles_1895ept_h1skqnhr__ebba80b9{color:var(--plasma-textfield__hint-icon-color);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}
97
+ .TextField_styles_1895ept_hgy0im1__ebba80b9 .TextField_styles_1895ept_h1skqnhr__ebba80b9 .TextField_styles_1895ept_popoverRoot__ebba80b9{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;}
98
+ .TextField_styles_1895ept_h8yezh4__ebba80b9{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}
99
+ .TextField_styles_1895ept_szsveq4__ebba80b9{position:absolute;border-radius:50%;background-color:var(--plasma-textfield__indicator-color);}.TextField_styles_1895ept_szsveq4__ebba80b9.TextField_styles_1895ept_labelPlacementOuter__ebba80b9{width:var(--plasma-textfield__indicator-size-outer);height:var(--plasma-textfield__indicator-size-outer);inset:var(--plasma-textfield__indicator-placement-outer);}.TextField_styles_1895ept_szsveq4__ebba80b9.TextField_styles_1895ept_labelPlacementOuter__ebba80b9.TextField_styles_1895ept_requiredAlignRight__ebba80b9{inset:var(--plasma-textfield__indicator-placement-outer-right);}.TextField_styles_1895ept_szsveq4__ebba80b9.TextField_styles_1895ept_labelPlacementOuter__ebba80b9.TextField_styles_1895ept_requiredAlignRight__ebba80b9.TextField_styles_1895ept_textfieldHasHint__ebba80b9{right:calc( -1 * var(--plasma-textfield__indicator-size-outer) + var(--plasma-textfield__indicator-hint-placement-outer-right,0px) );}.TextField_styles_1895ept_szsveq4__ebba80b9.TextField_styles_1895ept_labelPlacementInner__ebba80b9{width:var(--plasma-textfield__indicator-size-inner);height:var(--plasma-textfield__indicator-size-inner);inset:var(--plasma-textfield__indicator-placement-inner);}.TextField_styles_1895ept_szsveq4__ebba80b9.TextField_styles_1895ept_labelPlacementInner__ebba80b9.TextField_styles_1895ept_requiredAlignRight__ebba80b9{inset:var(--plasma-textfield__indicator-placement-inner-right);}
100
100
 
101
101
  .base_1lwlv7t_b13tc97x__334a4e59{color:var(--plasma-chip-color);background-color:var(--plasma-chip-background);}.base_1lwlv7t_b13tc97x__334a4e59:hover{color:var(--plasma-chip-color-hover);background-color:var(--plasma-chip-background-hover);scale:var(--plasma-chip-scale-hover);}.base_1lwlv7t_b13tc97x__334a4e59:active{color:var(--plasma-chip-color-active);background-color:var(--plasma-chip-background-active);scale:var(--plasma-chip-scale-active);}
102
102
 
@@ -107,28 +107,28 @@
107
107
 
108
108
  .Tooltip_1qsg6ij_s1cz8cv8__da7f9e0a{--plasma-popover-arrow-mask-width:var(--plasma-tooltip-arrow-mask-width);--plasma-popover-arrow-mask-height:var(--plasma-tooltip-arrow-mask-height);--plasma-popover-arrow-mask-image:var(--plasma-tooltip-arrow-mask-image);--plasma-popover-arrow-background:var(--plasma-tooltip-arrow-background);--plasma-popover-arrow-height:var(--plasma-tooltip-arrow-height);--plasma-popover-arrow-edge-margin:var(--plasma-tooltip-arrow-edge-margin);}
109
109
 
110
- .TextField_styles_1cdp5eg_iq39zt5__dcbef05d{position:relative;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;box-sizing:border-box;}
111
- .TextField_styles_1cdp5eg_i1j28rg8__dcbef05d{-webkit-flex:1;-ms-flex:1;flex:1;overflow:scroll;position:relative;width:100%;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-scrollbar-width:none;-moz-scrollbar-width:none;-ms-scrollbar-width:none;scrollbar-width:none;overscroll-behavior:contain;}.TextField_styles_1cdp5eg_i1j28rg8__dcbef05d::-webkit-scrollbar{display:none;}.TextField_styles_1cdp5eg_i1j28rg8__dcbef05d.TextField_styles_1cdp5eg_hasChips__dcbef05d{height:var(--plasma-textfield__chip-height);border-radius:var(--plasma-textfield__chip-border-radius);}
112
- .TextField_styles_1cdp5eg_s13zudoe__dcbef05d{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:var(--plasma-textfield__chip-gap);margin-right:var(--plasma-textfield__chip-margin-right,var(--plasma-textfield__chip-gap));-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}
113
- .TextField_styles_1cdp5eg_io4bpie__dcbef05d{box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;padding:0;background-color:transparent;outline:none;width:100%;z-index:1;}.TextField_styles_1cdp5eg_io4bpie__dcbef05d::-webkit-input-placeholder{opacity:0;}.TextField_styles_1cdp5eg_io4bpie__dcbef05d::-moz-placeholder{opacity:0;}.TextField_styles_1cdp5eg_io4bpie__dcbef05d:-ms-input-placeholder{opacity:0;}.TextField_styles_1cdp5eg_io4bpie__dcbef05d::placeholder{opacity:0;}
114
- .TextField_styles_1cdp5eg_i13qvwoy__dcbef05d{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex:1;-ms-flex:1;flex:1;min-width:var(--i13qvwoy-0);}.TextField_styles_1cdp5eg_i13qvwoy__dcbef05d .TextField_styles_1cdp5eg_io4bpie__dcbef05d{max-width:var(--i13qvwoy-1);}
115
- .TextField_styles_1cdp5eg_i19ry60d__dcbef05d{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;position:absolute;top:0;left:0;right:0;bottom:0;z-index:0;white-space:nowrap;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font:inherit;-webkit-letter-spacing:inherit;-moz-letter-spacing:inherit;-ms-letter-spacing:inherit;letter-spacing:inherit;line-height:inherit;color:var(--plasma-textfield__placeholder-color);padding:var(--i19ry60d-0);}
116
- .TextField_styles_1cdp5eg_obt1ohz__dcbef05d{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;white-space:var(--obt1ohz-0);margin-bottom:var(--obt1ohz-1);}
117
- .TextField_styles_1cdp5eg_tlv9av6__dcbef05d{display:inline-block;margin-left:auto;}
118
- .TextField_styles_1cdp5eg_s600610__dcbef05d{position:relative;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;}
119
- .TextField_styles_1cdp5eg_luk2zst__dcbef05d{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}
120
- .TextField_styles_1cdp5eg_s1gjsnfi__dcbef05d{margin:var(--plasma-textfield__left-content-margin);color:var(--s1gjsnfi-0);line-height:0;}
121
- .TextField_styles_1cdp5eg_ssv2kwg__dcbef05d{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;}
122
- .TextField_styles_1cdp5eg_s190z894__dcbef05d{line-height:0;margin:var(--plasma-textfield__right-content-margin);color:var(--plasma-textfield-content-right-slot-color,var(--plasma-textfield-content-slot-color));}.TextField_styles_1cdp5eg_s190z894__dcbef05d:hover{color:var(--plasma-textfield-content-right-slot-color-hover,var(--plasma-textfield-content-slot-color-hover));cursor:pointer;}.TextField_styles_1cdp5eg_s190z894__dcbef05d:active{color:var(--plasma-textfield-content-right-slot-color-active,var(--plasma-textfield-content-slot-color-active));}
123
-
124
- .TextField_styles_1cdp5eg_s7hnwwb__dcbef05d{visibility:var(--s7hnwwb-0);}
125
-
126
- .TextField_styles_1cdp5eg_s14qvple__dcbef05d{color:var(--plasma-textfield__optional-color);}
127
- .TextField_styles_1cdp5eg_s16itze4__dcbef05d{display:inline-block;line-height:0;}.TextField_styles_1cdp5eg_s16itze4__dcbef05d.TextField_styles_1cdp5eg_labelPlacementInner__dcbef05d{position:absolute;margin:0;inset:var(--plasma-textfield__hint-inner-label-placement-offset);}
128
- .TextField_styles_1cdp5eg_h1skqnhr__dcbef05d{color:var(--plasma-textfield__hint-icon-color);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}
129
- .TextField_styles_1cdp5eg_hgy0im1__dcbef05d .TextField_styles_1cdp5eg_h1skqnhr__dcbef05d .TextField_styles_1cdp5eg_popoverRoot__dcbef05d{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;}
130
- .TextField_styles_1cdp5eg_h8yezh4__dcbef05d{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}
131
- .TextField_styles_1cdp5eg_szsveq4__dcbef05d{position:absolute;border-radius:50%;background-color:var(--plasma-textfield__indicator-color);}.TextField_styles_1cdp5eg_szsveq4__dcbef05d.TextField_styles_1cdp5eg_labelPlacementOuter__dcbef05d{width:var(--plasma-textfield__indicator-size-outer);height:var(--plasma-textfield__indicator-size-outer);inset:var(--plasma-textfield__indicator-placement-outer);}.TextField_styles_1cdp5eg_szsveq4__dcbef05d.TextField_styles_1cdp5eg_labelPlacementOuter__dcbef05d.TextField_styles_1cdp5eg_requiredAlignRight__dcbef05d{inset:var(--plasma-textfield__indicator-placement-outer-right);}.TextField_styles_1cdp5eg_szsveq4__dcbef05d.TextField_styles_1cdp5eg_labelPlacementOuter__dcbef05d.TextField_styles_1cdp5eg_requiredAlignRight__dcbef05d.TextField_styles_1cdp5eg_textfieldHasHint__dcbef05d{right:calc( -1 * var(--plasma-textfield__indicator-size-outer) + var(--plasma-textfield__indicator-hint-placement-outer-right,0px) );}.TextField_styles_1cdp5eg_szsveq4__dcbef05d.TextField_styles_1cdp5eg_labelPlacementInner__dcbef05d{width:var(--plasma-textfield__indicator-size-inner);height:var(--plasma-textfield__indicator-size-inner);inset:var(--plasma-textfield__indicator-placement-inner);}.TextField_styles_1cdp5eg_szsveq4__dcbef05d.TextField_styles_1cdp5eg_labelPlacementInner__dcbef05d.TextField_styles_1cdp5eg_requiredAlignRight__dcbef05d{inset:var(--plasma-textfield__indicator-placement-inner-right);}
110
+ .TextField_styles_1895ept_iq39zt5__ebba80b9{position:relative;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;box-sizing:border-box;}
111
+ .TextField_styles_1895ept_i1j28rg8__ebba80b9{-webkit-flex:1;-ms-flex:1;flex:1;overflow:scroll;position:relative;width:100%;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-scrollbar-width:none;-moz-scrollbar-width:none;-ms-scrollbar-width:none;scrollbar-width:none;overscroll-behavior:contain;}.TextField_styles_1895ept_i1j28rg8__ebba80b9::-webkit-scrollbar{display:none;}.TextField_styles_1895ept_i1j28rg8__ebba80b9.TextField_styles_1895ept_hasChips__ebba80b9{height:var(--plasma-textfield__chip-height);border-radius:var(--plasma-textfield__chip-border-radius);}
112
+ .TextField_styles_1895ept_s13zudoe__ebba80b9{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:var(--plasma-textfield__chip-gap);margin-right:var(--plasma-textfield__chip-margin-right,var(--plasma-textfield__chip-gap));-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}
113
+ .TextField_styles_1895ept_io4bpie__ebba80b9{box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;padding:0;background-color:transparent;outline:none;width:100%;z-index:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.TextField_styles_1895ept_io4bpie__ebba80b9::-webkit-input-placeholder{opacity:0;}.TextField_styles_1895ept_io4bpie__ebba80b9::-moz-placeholder{opacity:0;}.TextField_styles_1895ept_io4bpie__ebba80b9:-ms-input-placeholder{opacity:0;}.TextField_styles_1895ept_io4bpie__ebba80b9::placeholder{opacity:0;}
114
+ .TextField_styles_1895ept_i13qvwoy__ebba80b9{position:relative;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex:1;-ms-flex:1;flex:1;min-width:var(--i13qvwoy-0);}.TextField_styles_1895ept_i13qvwoy__ebba80b9 .TextField_styles_1895ept_io4bpie__ebba80b9{max-width:var(--i13qvwoy-1);}
115
+ .TextField_styles_1895ept_i19ry60d__ebba80b9{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;position:absolute;top:0;left:0;right:0;bottom:0;z-index:0;white-space:nowrap;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font:inherit;-webkit-letter-spacing:inherit;-moz-letter-spacing:inherit;-ms-letter-spacing:inherit;letter-spacing:inherit;line-height:inherit;color:var(--plasma-textfield__placeholder-color);padding:var(--i19ry60d-0);}
116
+ .TextField_styles_1895ept_obt1ohz__ebba80b9{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;white-space:var(--obt1ohz-0);margin-bottom:var(--obt1ohz-1);}
117
+ .TextField_styles_1895ept_tlv9av6__ebba80b9{display:inline-block;margin-left:auto;}
118
+ .TextField_styles_1895ept_s600610__ebba80b9{position:relative;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;}
119
+ .TextField_styles_1895ept_luk2zst__ebba80b9{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}
120
+ .TextField_styles_1895ept_s1gjsnfi__ebba80b9{margin:var(--plasma-textfield__left-content-margin);color:var(--s1gjsnfi-0);line-height:0;}
121
+ .TextField_styles_1895ept_ssv2kwg__ebba80b9{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;}
122
+ .TextField_styles_1895ept_s190z894__ebba80b9{line-height:0;margin:var(--plasma-textfield__right-content-margin);color:var(--plasma-textfield-content-right-slot-color,var(--plasma-textfield-content-slot-color));}.TextField_styles_1895ept_s190z894__ebba80b9:hover{color:var(--plasma-textfield-content-right-slot-color-hover,var(--plasma-textfield-content-slot-color-hover));cursor:pointer;}.TextField_styles_1895ept_s190z894__ebba80b9:active{color:var(--plasma-textfield-content-right-slot-color-active,var(--plasma-textfield-content-slot-color-active));}
123
+
124
+ .TextField_styles_1895ept_s7hnwwb__ebba80b9{visibility:var(--s7hnwwb-0);}
125
+
126
+ .TextField_styles_1895ept_s14qvple__ebba80b9{color:var(--plasma-textfield__optional-color);}
127
+ .TextField_styles_1895ept_s16itze4__ebba80b9{display:inline-block;line-height:0;}.TextField_styles_1895ept_s16itze4__ebba80b9.TextField_styles_1895ept_labelPlacementInner__ebba80b9{position:absolute;margin:0;inset:var(--plasma-textfield__hint-inner-label-placement-offset);}
128
+ .TextField_styles_1895ept_h1skqnhr__ebba80b9{color:var(--plasma-textfield__hint-icon-color);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}
129
+ .TextField_styles_1895ept_hgy0im1__ebba80b9 .TextField_styles_1895ept_h1skqnhr__ebba80b9 .TextField_styles_1895ept_popoverRoot__ebba80b9{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;}
130
+ .TextField_styles_1895ept_h8yezh4__ebba80b9{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}
131
+ .TextField_styles_1895ept_szsveq4__ebba80b9{position:absolute;border-radius:50%;background-color:var(--plasma-textfield__indicator-color);}.TextField_styles_1895ept_szsveq4__ebba80b9.TextField_styles_1895ept_labelPlacementOuter__ebba80b9{width:var(--plasma-textfield__indicator-size-outer);height:var(--plasma-textfield__indicator-size-outer);inset:var(--plasma-textfield__indicator-placement-outer);}.TextField_styles_1895ept_szsveq4__ebba80b9.TextField_styles_1895ept_labelPlacementOuter__ebba80b9.TextField_styles_1895ept_requiredAlignRight__ebba80b9{inset:var(--plasma-textfield__indicator-placement-outer-right);}.TextField_styles_1895ept_szsveq4__ebba80b9.TextField_styles_1895ept_labelPlacementOuter__ebba80b9.TextField_styles_1895ept_requiredAlignRight__ebba80b9.TextField_styles_1895ept_textfieldHasHint__ebba80b9{right:calc( -1 * var(--plasma-textfield__indicator-size-outer) + var(--plasma-textfield__indicator-hint-placement-outer-right,0px) );}.TextField_styles_1895ept_szsveq4__ebba80b9.TextField_styles_1895ept_labelPlacementInner__ebba80b9{width:var(--plasma-textfield__indicator-size-inner);height:var(--plasma-textfield__indicator-size-inner);inset:var(--plasma-textfield__indicator-placement-inner);}.TextField_styles_1895ept_szsveq4__ebba80b9.TextField_styles_1895ept_labelPlacementInner__ebba80b9.TextField_styles_1895ept_requiredAlignRight__ebba80b9{inset:var(--plasma-textfield__indicator-placement-inner-right);}
132
132
 
133
133
  .base_1lwlv7t_b13tc97x__334a4e59{color:var(--plasma-chip-color);background-color:var(--plasma-chip-background);}.base_1lwlv7t_b13tc97x__334a4e59:hover{color:var(--plasma-chip-color-hover);background-color:var(--plasma-chip-background-hover);scale:var(--plasma-chip-scale-hover);}.base_1lwlv7t_b13tc97x__334a4e59:active{color:var(--plasma-chip-color-active);background-color:var(--plasma-chip-background-active);scale:var(--plasma-chip-scale-active);}
134
134