@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.
- package/cjs/components/Autocomplete/Autocomplete.css +22 -22
- package/cjs/components/Combobox/ComboboxNew/Combobox.css +22 -22
- package/cjs/components/DatePicker/RangeDate/RangeDate.css +22 -22
- package/cjs/components/DatePicker/RangeDate/RangeDatePopover/RangeDatePopover.css +22 -22
- package/cjs/components/DatePicker/SingleDate/SingleDate.css +22 -22
- package/cjs/components/Pagination/Pagination.css +22 -22
- package/cjs/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.css +22 -22
- package/cjs/components/Range/Range.css +22 -22
- package/cjs/components/Select/Select.css +22 -22
- package/cjs/components/Select/ui/Target/Target.css +22 -22
- package/cjs/components/Select/ui/Target/ui/Textfield/Textfield.css +22 -22
- package/cjs/components/Slider/Slider.css +22 -22
- package/cjs/components/Slider/components/DoubleUncontrolled/DoubleUncontrolled.css +22 -22
- package/cjs/components/Table/Table.css +22 -22
- package/cjs/components/Table/ui/Cell/Cell.css +22 -22
- package/cjs/components/Table/ui/EditableCell/EditableCell.css +22 -22
- package/cjs/components/Table/ui/HeadCell/HeadCell.css +22 -22
- package/cjs/components/Table/ui/HeadCell/ui/Filter/Filter.css +22 -22
- package/cjs/components/TextField/TextField.styles.js +17 -17
- package/cjs/components/TextField/TextField.styles.js.map +1 -1
- package/cjs/components/TextField/{TextField.styles_1cdp5eg.css → TextField.styles_1895ept.css} +1 -1
- package/cjs/components/TextField/ui/Hint/Hint.css +20 -20
- package/cjs/index.css +22 -22
- package/emotion/cjs/components/Accordion/Accordion.template-doc.mdx +71 -99
- package/emotion/cjs/components/Autocomplete/Autocomplete.template-doc.mdx +454 -523
- package/emotion/cjs/components/Checkbox/Checkbox.template-doc.mdx +3 -3
- package/emotion/cjs/components/Combobox/Combobox.template-doc.mdx +27 -58
- package/emotion/cjs/components/DatePicker/DatePicker.template-doc.mdx +0 -5
- package/emotion/cjs/components/Dropdown/Dropdown.template-doc.mdx +10 -10
- package/emotion/cjs/components/Flow/Flow.template-doc.mdx +2 -2
- package/emotion/cjs/components/Notification/Notification.template-doc.mdx +1 -10
- package/emotion/cjs/components/NumberFormat/NumberFormat.template-doc.mdx +4 -4
- package/emotion/cjs/components/Radiobox/Radiobox.template-doc.mdx +11 -10
- package/emotion/cjs/components/Range/Range.template-doc.mdx +1 -5
- package/emotion/cjs/components/Segment/Segment.template-doc.mdx +3 -3
- package/emotion/cjs/components/Select/Select.template-doc.mdx +27 -27
- package/emotion/cjs/components/Slider/Slider.template-doc.mdx +2 -2
- package/emotion/cjs/components/Switch/Switch.template-doc.mdx +3 -3
- package/emotion/cjs/components/Table/Table.template-doc.mdx +2 -2
- package/emotion/cjs/components/Tabs/Tabs.template-doc.mdx +7 -11
- package/emotion/cjs/components/TextArea/TextArea.template-doc.mdx +2 -9
- package/emotion/cjs/components/TextField/TextField.styles.js +23 -30
- package/emotion/cjs/components/TextField/TextField.template-doc.mdx +32 -117
- package/emotion/cjs/components/Toast/Toast.template-doc.mdx +2 -48
- package/emotion/cjs/components/Tooltip/Tooltip.template-doc.mdx +4 -19
- package/emotion/cjs/components/Tree/Tree.template-doc.mdx +1 -0
- package/emotion/es/components/Accordion/Accordion.template-doc.mdx +71 -99
- package/emotion/es/components/Autocomplete/Autocomplete.template-doc.mdx +454 -523
- package/emotion/es/components/Checkbox/Checkbox.template-doc.mdx +3 -3
- package/emotion/es/components/Combobox/Combobox.template-doc.mdx +27 -58
- package/emotion/es/components/DatePicker/DatePicker.template-doc.mdx +0 -5
- package/emotion/es/components/Dropdown/Dropdown.template-doc.mdx +10 -10
- package/emotion/es/components/Flow/Flow.template-doc.mdx +2 -2
- package/emotion/es/components/Notification/Notification.template-doc.mdx +1 -10
- package/emotion/es/components/NumberFormat/NumberFormat.template-doc.mdx +4 -4
- package/emotion/es/components/Radiobox/Radiobox.template-doc.mdx +11 -10
- package/emotion/es/components/Range/Range.template-doc.mdx +1 -5
- package/emotion/es/components/Segment/Segment.template-doc.mdx +3 -3
- package/emotion/es/components/Select/Select.template-doc.mdx +27 -27
- package/emotion/es/components/Slider/Slider.template-doc.mdx +2 -2
- package/emotion/es/components/Switch/Switch.template-doc.mdx +3 -3
- package/emotion/es/components/Table/Table.template-doc.mdx +2 -2
- package/emotion/es/components/Tabs/Tabs.template-doc.mdx +7 -11
- package/emotion/es/components/TextArea/TextArea.template-doc.mdx +2 -9
- package/emotion/es/components/TextField/TextField.styles.js +23 -30
- package/emotion/es/components/TextField/TextField.template-doc.mdx +32 -117
- package/emotion/es/components/Toast/Toast.template-doc.mdx +2 -48
- package/emotion/es/components/Tooltip/Tooltip.template-doc.mdx +4 -19
- package/emotion/es/components/Tree/Tree.template-doc.mdx +1 -0
- package/es/components/Autocomplete/Autocomplete.css +22 -22
- package/es/components/Combobox/ComboboxNew/Combobox.css +22 -22
- package/es/components/DatePicker/RangeDate/RangeDate.css +22 -22
- package/es/components/DatePicker/RangeDate/RangeDatePopover/RangeDatePopover.css +22 -22
- package/es/components/DatePicker/SingleDate/SingleDate.css +22 -22
- package/es/components/Pagination/Pagination.css +22 -22
- package/es/components/Pagination/ui/PaginationSelectPerPage/PaginationSelectPerPage.css +22 -22
- package/es/components/Range/Range.css +22 -22
- package/es/components/Select/Select.css +22 -22
- package/es/components/Select/ui/Target/Target.css +22 -22
- package/es/components/Select/ui/Target/ui/Textfield/Textfield.css +22 -22
- package/es/components/Slider/Slider.css +22 -22
- package/es/components/Slider/components/DoubleUncontrolled/DoubleUncontrolled.css +22 -22
- package/es/components/Table/Table.css +22 -22
- package/es/components/Table/ui/Cell/Cell.css +22 -22
- package/es/components/Table/ui/EditableCell/EditableCell.css +22 -22
- package/es/components/Table/ui/HeadCell/HeadCell.css +22 -22
- package/es/components/Table/ui/HeadCell/ui/Filter/Filter.css +22 -22
- package/es/components/TextField/TextField.styles.js +17 -17
- package/es/components/TextField/TextField.styles.js.map +1 -1
- package/es/components/TextField/{TextField.styles_1cdp5eg.css → TextField.styles_1895ept.css} +1 -1
- package/es/components/TextField/ui/Hint/Hint.css +20 -20
- package/es/index.css +22 -22
- package/package.json +4 -4
- package/styled-components/cjs/components/Accordion/Accordion.template-doc.mdx +71 -99
- package/styled-components/cjs/components/Autocomplete/Autocomplete.template-doc.mdx +454 -523
- package/styled-components/cjs/components/Checkbox/Checkbox.template-doc.mdx +3 -3
- package/styled-components/cjs/components/Combobox/Combobox.template-doc.mdx +27 -58
- package/styled-components/cjs/components/DatePicker/DatePicker.template-doc.mdx +0 -5
- package/styled-components/cjs/components/Dropdown/Dropdown.template-doc.mdx +10 -10
- package/styled-components/cjs/components/Flow/Flow.template-doc.mdx +2 -2
- package/styled-components/cjs/components/Notification/Notification.template-doc.mdx +1 -10
- package/styled-components/cjs/components/NumberFormat/NumberFormat.template-doc.mdx +4 -4
- package/styled-components/cjs/components/Radiobox/Radiobox.template-doc.mdx +11 -10
- package/styled-components/cjs/components/Range/Range.template-doc.mdx +1 -5
- package/styled-components/cjs/components/Segment/Segment.template-doc.mdx +3 -3
- package/styled-components/cjs/components/Select/Select.template-doc.mdx +27 -27
- package/styled-components/cjs/components/Slider/Slider.template-doc.mdx +2 -2
- package/styled-components/cjs/components/Switch/Switch.template-doc.mdx +3 -3
- package/styled-components/cjs/components/Table/Table.template-doc.mdx +2 -2
- package/styled-components/cjs/components/Tabs/Tabs.template-doc.mdx +7 -11
- package/styled-components/cjs/components/TextArea/TextArea.template-doc.mdx +2 -9
- package/styled-components/cjs/components/TextField/TextField.styles.js +2 -1
- package/styled-components/cjs/components/TextField/TextField.template-doc.mdx +32 -117
- package/styled-components/cjs/components/Toast/Toast.template-doc.mdx +2 -48
- package/styled-components/cjs/components/Tooltip/Tooltip.template-doc.mdx +4 -19
- package/styled-components/cjs/components/Tree/Tree.template-doc.mdx +1 -0
- package/styled-components/es/components/Accordion/Accordion.template-doc.mdx +71 -99
- package/styled-components/es/components/Autocomplete/Autocomplete.template-doc.mdx +454 -523
- package/styled-components/es/components/Checkbox/Checkbox.template-doc.mdx +3 -3
- package/styled-components/es/components/Combobox/Combobox.template-doc.mdx +27 -58
- package/styled-components/es/components/DatePicker/DatePicker.template-doc.mdx +0 -5
- package/styled-components/es/components/Dropdown/Dropdown.template-doc.mdx +10 -10
- package/styled-components/es/components/Flow/Flow.template-doc.mdx +2 -2
- package/styled-components/es/components/Notification/Notification.template-doc.mdx +1 -10
- package/styled-components/es/components/NumberFormat/NumberFormat.template-doc.mdx +4 -4
- package/styled-components/es/components/Radiobox/Radiobox.template-doc.mdx +11 -10
- package/styled-components/es/components/Range/Range.template-doc.mdx +1 -5
- package/styled-components/es/components/Segment/Segment.template-doc.mdx +3 -3
- package/styled-components/es/components/Select/Select.template-doc.mdx +27 -27
- package/styled-components/es/components/Slider/Slider.template-doc.mdx +2 -2
- package/styled-components/es/components/Switch/Switch.template-doc.mdx +3 -3
- package/styled-components/es/components/Table/Table.template-doc.mdx +2 -2
- package/styled-components/es/components/Tabs/Tabs.template-doc.mdx +7 -11
- package/styled-components/es/components/TextArea/TextArea.template-doc.mdx +2 -9
- package/styled-components/es/components/TextField/TextField.styles.js +2 -1
- package/styled-components/es/components/TextField/TextField.template-doc.mdx +32 -117
- package/styled-components/es/components/Toast/Toast.template-doc.mdx +2 -48
- package/styled-components/es/components/Tooltip/Tooltip.template-doc.mdx +4 -19
- package/styled-components/es/components/Tree/Tree.template-doc.mdx +1 -0
- package/types/components/TextField/TextField.styles.d.ts.map +1 -1
- /package/emotion/cjs/components/Combobox/ComboboxOld/{Combobox.doc.mdx → Combobox.template-doc.mdx} +0 -0
- /package/emotion/es/components/Combobox/ComboboxOld/{Combobox.doc.mdx → Combobox.template-doc.mdx} +0 -0
- /package/styled-components/cjs/components/Combobox/ComboboxOld/{Combobox.doc.mdx → Combobox.template-doc.mdx} +0 -0
- /package/styled-components/es/components/Combobox/ComboboxOld/{Combobox.doc.mdx → Combobox.template-doc.mdx} +0 -0
@@ -7,7 +7,7 @@ import { PropsTable, Description } from '@site/src/components';
|
|
7
7
|
|
8
8
|
# Switch
|
9
9
|
<Description name="Switch" />
|
10
|
-
<PropsTable name="Switch"
|
10
|
+
<PropsTable name="Switch" />
|
11
11
|
|
12
12
|
## Использование
|
13
13
|
Компонент `Switch` может содержать лейбл.
|
@@ -30,7 +30,7 @@ export function App() {
|
|
30
30
|
|
31
31
|
```tsx live
|
32
32
|
import React from 'react';
|
33
|
-
import {
|
33
|
+
import { Button } from '@salutejs/{{ package }}';
|
34
34
|
|
35
35
|
export function App() {
|
36
36
|
return (
|
@@ -47,7 +47,7 @@ export function App() {
|
|
47
47
|
|
48
48
|
```tsx live
|
49
49
|
import React from 'react';
|
50
|
-
import {
|
50
|
+
import { Button } from '@salutejs/{{ package }}';
|
51
51
|
|
52
52
|
export function App() {
|
53
53
|
return (
|
@@ -492,7 +492,7 @@ export type TableColumnData = {
|
|
492
492
|
];
|
493
493
|
|
494
494
|
return (
|
495
|
-
<div style
|
495
|
+
<div style={{ display: "block" }}>
|
496
496
|
<ButtonGroup size="xs" isCommonButtonStyles={false}>
|
497
497
|
<Button text="Очистить выбранные" view="warning" size="xs" onClick={clearSelected} />
|
498
498
|
<Button text="Убрать сортировку" view="warning" size="xs" onClick={clearSorted} />
|
@@ -504,7 +504,7 @@ export type TableColumnData = {
|
|
504
504
|
<br />
|
505
505
|
<br />
|
506
506
|
|
507
|
-
<div style
|
507
|
+
<div style={{ overflow: "scroll" }}>
|
508
508
|
<Table
|
509
509
|
data={data}
|
510
510
|
columns={columns}
|
@@ -5,10 +5,6 @@ title: Tabs
|
|
5
5
|
|
6
6
|
import { PropsTable, Description } from '@site/src/components';
|
7
7
|
|
8
|
-
# Tabs
|
9
|
-
Набор компонентов для создания вкладок.
|
10
|
-
Структура для вкладок похожа на структуру маркированных списков.
|
11
|
-
|
12
8
|
## Tabs
|
13
9
|
|
14
10
|
<Description name="Tabs" />
|
@@ -20,7 +16,7 @@ import { PropsTable, Description } from '@site/src/components';
|
|
20
16
|
<PropsTable name="TabItem" />
|
21
17
|
|
22
18
|
:::caution Взаимоисключающие свойства
|
23
|
-
Свойство `value` - это значение
|
19
|
+
Свойство `value` - это значение таба. Оно отображается справа от основного текста.<br/>
|
24
20
|
`value` и `contentRight` взаимоисключающие: если передано одно, второе передать нельзя.
|
25
21
|
:::
|
26
22
|
|
@@ -65,8 +61,8 @@ export function App() {
|
|
65
61
|
}
|
66
62
|
```
|
67
63
|
|
68
|
-
### Расположение
|
69
|
-
|
64
|
+
### Расположение табов
|
65
|
+
Табы могут быть горизонтальными (по умолчанию) и вертикальными. За это отвечает свойство `orientation`.
|
70
66
|
|
71
67
|
```tsx live
|
72
68
|
import React, { useState } from 'react';
|
@@ -101,11 +97,11 @@ export function App() {
|
|
101
97
|
```
|
102
98
|
|
103
99
|
### Пример с прокруткой
|
104
|
-
При выборе
|
100
|
+
При выборе таба происходит прокрутка до выбранного таба.
|
105
101
|
|
106
102
|
```tsx live
|
107
103
|
import React, { useState } from 'react';
|
108
|
-
import { Tabs, TabItem, Button } from '@salutejs/
|
104
|
+
import { Tabs, TabItem, Button } from '@salutejs/plasma-web';
|
109
105
|
import { IconClock } from '@salutejs/plasma-icons';
|
110
106
|
|
111
107
|
export function App() {
|
@@ -193,8 +189,8 @@ export function App() {
|
|
193
189
|
|
194
190
|
### Подключение клавиатурной навигации
|
195
191
|
Для этого необходимо дополнительно прокинуть свойства `index, itemIndex, onIndexChange`.<br/>
|
196
|
-
Для горизонтальных
|
197
|
-
Для вертикальных
|
192
|
+
Для горизонтальных табов: клавиши ArrowLeft, ArrowRight, Home, End для навигации по вкладкам.<br/>
|
193
|
+
Для вертикальных табов: клавиши ArrowUp, ArrowDown, Home, End для навигации по вкладкам.
|
198
194
|
|
199
195
|
```tsx live
|
200
196
|
import React, { useState } from 'react';
|
@@ -161,18 +161,11 @@ export function App() {
|
|
161
161
|
|
162
162
|
|
163
163
|
### Обязательность поля
|
164
|
-
|
165
|
-
:::tip
|
166
|
-
Наличие индикатора регулируется свойством `hasRequiredIndicator`.
|
167
|
-
:::
|
168
|
-
|
169
|
-
Обязательность поля задаётся с помощью свойств `required` и `requiredPlacement`.
|
170
|
-
|
171
|
-
Где `requiredPlacement` отвечает за выравнивание и принимает значения `"left"` и `"right"`:
|
164
|
+
Обязательность поля задаётся с помощью свойств `required` и `requiredPlacement`. Где `requiredPlacement` отвечает за выравнивание и принимает значения `"left"` и `"right"`:
|
172
165
|
|
173
166
|
```tsx live
|
174
167
|
import React from 'react';
|
175
|
-
import {
|
168
|
+
import { TextField } from '@salutejs/{{ package }}';
|
176
169
|
|
177
170
|
export function App() {
|
178
171
|
return (
|