@rt-tools/ui-kit-v2 0.19.1 → 0.21.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/fesm2022/rt-tools-ui-kit-v2-core.mjs +61 -1
- package/fesm2022/rt-tools-ui-kit-v2-core.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-dynamic-selector.mjs +129 -18
- package/fesm2022/rt-tools-ui-kit-v2-dynamic-selector.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-empty-state.mjs +2 -2
- package/fesm2022/rt-tools-ui-kit-v2-empty-state.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-icon.mjs +28 -11
- package/fesm2022/rt-tools-ui-kit-v2-icon.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-input-number.mjs +4 -3
- package/fesm2022/rt-tools-ui-kit-v2-input-number.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-input.mjs +4 -3
- package/fesm2022/rt-tools-ui-kit-v2-input.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-rich-editor.mjs +100 -19
- package/fesm2022/rt-tools-ui-kit-v2-rich-editor.mjs.map +1 -1
- package/fesm2022/rt-tools-ui-kit-v2-thread-list.mjs +15 -9
- package/fesm2022/rt-tools-ui-kit-v2-thread-list.mjs.map +1 -1
- package/package.json +1 -1
- package/rt-tools-ui-kit-v2-0.21.0.tgz +0 -0
- package/src/assets/icons-material/history.fill.svg +5 -0
- package/src/assets/icons-material/history.svg +5 -0
- package/src/assets/icons-material/window-minimize.fill.svg +5 -0
- package/src/assets/icons-material/window-minimize.svg +5 -0
- package/src/lib/components/dynamic-selector/CONTEXT.md +24 -3
- package/src/lib/components/dynamic-selector/dynamic-input/rt-dynamic-input.component.scss +4 -5
- package/src/lib/components/dynamic-selector/list/rt-dynamic-selector-list.component.scss +50 -6
- package/src/lib/components/dynamic-selector/popup/rt-dynamic-selector-popup-options.scss +108 -0
- package/src/lib/components/dynamic-selector/popup/rt-dynamic-selector-popup.component.scss +28 -23
- package/src/lib/components/dynamic-selector/rt-dynamic-selector.component.scss +4 -5
- package/src/lib/components/empty-state/CONTEXT.md +3 -1
- package/src/lib/components/empty-state/rt-empty-state.component.scss +9 -5
- package/src/lib/components/icon/CONTEXT.md +7 -0
- package/src/lib/components/input/rt-input.component.scss +17 -0
- package/src/lib/components/input-number/rt-input-number.component.scss +15 -0
- package/src/lib/components/markdown-text/CONTEXT.md +3 -0
- package/src/lib/components/thread-list/CONTEXT.md +3 -1
- package/src/rich-editor/lib/components/ai-chat/CONTEXT.md +15 -0
- package/src/rich-editor/lib/components/ai-chat/copy/rt-ai-chat-copy.component.scss +5 -0
- package/src/rich-editor/lib/components/ai-chat/rt-ai-chat.component.scss +8 -1
- package/types/rt-tools-ui-kit-v2-core.d.ts +81 -5
- package/types/rt-tools-ui-kit-v2-dynamic-selector.d.ts +45 -3
- package/types/rt-tools-ui-kit-v2-icon.d.ts +14 -3
- package/types/rt-tools-ui-kit-v2-rich-editor.d.ts +23 -6
- package/types/rt-tools-ui-kit-v2-thread-list.d.ts +13 -8
- package/rt-tools-ui-kit-v2-0.19.1.tgz +0 -0
|
@@ -0,0 +1,108 @@
|
|
|
1
|
+
@layer rt-kit.components {
|
|
2
|
+
/* Строки и пункты окна выбора — отдельным файлом: стили окна целиком переросли бюджет сборки
|
|
3
|
+
приложений на один файл стилей компонента. Свойства пунктов объявлены на корне окна. */
|
|
4
|
+
.rt-dynamic-selector-popup {
|
|
5
|
+
// Шаг строки снят с первого кита: флажок и по отступу сверху и снизу — около 36px. Наименьшая
|
|
6
|
+
// высота считается с отступами, а содержимое стоит посередине выросшей строки.
|
|
7
|
+
&__row {
|
|
8
|
+
display: flex;
|
|
9
|
+
min-height: var(--rt-dynamic-selector-popup-option-min-height, var(--rt-dynamic-selector-popup-option-min-height-default));
|
|
10
|
+
box-sizing: border-box;
|
|
11
|
+
flex-direction: column;
|
|
12
|
+
justify-content: center;
|
|
13
|
+
padding-block: var(--rt-space-sm);
|
|
14
|
+
|
|
15
|
+
&--separated {
|
|
16
|
+
border-bottom: var(--rt-dynamic-selector-popup-border-width, var(--rt-dynamic-selector-popup-border-width-default)) solid
|
|
17
|
+
var(--rt-color-border-subtle);
|
|
18
|
+
margin-block-end: var(--rt-space-2xs);
|
|
19
|
+
padding-block-end: var(--rt-space-sm);
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
// Длинная подпись строки переносится: обрезка спрятала бы, какую запись человек отмечает.
|
|
24
|
+
&__option {
|
|
25
|
+
display: block;
|
|
26
|
+
overflow-wrap: anywhere;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
&__option-label {
|
|
30
|
+
overflow-wrap: anywhere;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
// Высота строки подписи пункта — свойство окна. Подпись стоит в подписи флажка или кнопки, и
|
|
34
|
+
// строку растит она, а не вложенная строчная подпись.
|
|
35
|
+
&__option-label,
|
|
36
|
+
&__option .rt-checkbox__label,
|
|
37
|
+
&__option .rt-radio-button__label {
|
|
38
|
+
line-height: var(--rt-dynamic-selector-popup-option-line-height, var(--rt-dynamic-selector-popup-option-line-height-default));
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
// Без переноса подпись пункта идёт одной строкой с многоточием, а обрезанная показывает себя
|
|
42
|
+
// в подсказке. Флажок и его подпись сжимаются до ширины строки, иначе обрезать нечего.
|
|
43
|
+
// Строка идёт слева направо: центр колонки из базового правила здесь сдвинул бы пункт к середине.
|
|
44
|
+
&__row--nowrap {
|
|
45
|
+
display: flex;
|
|
46
|
+
flex-direction: row;
|
|
47
|
+
align-items: center;
|
|
48
|
+
justify-content: flex-start;
|
|
49
|
+
gap: var(--rt-space-sm);
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
&__row--nowrap &__option {
|
|
53
|
+
min-width: 0;
|
|
54
|
+
max-width: 100%;
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
// Подпись выбора одной записи рисует окно рядом с кнопкой — так же, как её рисует сама кнопка.
|
|
58
|
+
&__row--own {
|
|
59
|
+
display: flex;
|
|
60
|
+
flex-direction: row;
|
|
61
|
+
align-items: flex-start;
|
|
62
|
+
justify-content: flex-start;
|
|
63
|
+
gap: var(--rt-space-sm);
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
// Кнопка выбора без своей подписи не сжимается: сжатая, она наезжает кружком на подпись.
|
|
67
|
+
&__option--fixed {
|
|
68
|
+
flex: 0 0 auto;
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
&__row--own &__option-label {
|
|
72
|
+
min-width: 0;
|
|
73
|
+
flex: 1 1 auto;
|
|
74
|
+
color: var(--rt-color-text-primary);
|
|
75
|
+
cursor: pointer;
|
|
76
|
+
font-size: var(--rt-text-sm);
|
|
77
|
+
user-select: none;
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
// Совпавшие с поиском символы: фон метки браузера заменён свойством окна, как и скругление,
|
|
81
|
+
// цвет и насыщенность.
|
|
82
|
+
&__match {
|
|
83
|
+
border-radius: var(--rt-dynamic-selector-popup-highlight-radius, var(--rt-dynamic-selector-popup-highlight-radius-default));
|
|
84
|
+
background: var(--rt-dynamic-selector-popup-highlight-bg, var(--rt-dynamic-selector-popup-highlight-bg-default));
|
|
85
|
+
color: var(--rt-dynamic-selector-popup-highlight-color, var(--rt-dynamic-selector-popup-highlight-color-default));
|
|
86
|
+
font-weight: var(--rt-dynamic-selector-popup-highlight-weight, var(--rt-dynamic-selector-popup-highlight-weight-default));
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
&__row--nowrap &__option .rt-checkbox {
|
|
90
|
+
max-width: 100%;
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
&__row--nowrap &__option .rt-checkbox__label {
|
|
94
|
+
overflow: hidden;
|
|
95
|
+
min-width: 0;
|
|
96
|
+
}
|
|
97
|
+
|
|
98
|
+
&__row--nowrap &__option-label {
|
|
99
|
+
display: block;
|
|
100
|
+
overflow: hidden;
|
|
101
|
+
min-width: 0;
|
|
102
|
+
flex: 1 1 auto;
|
|
103
|
+
font-size: var(--rt-text-sm);
|
|
104
|
+
text-overflow: ellipsis;
|
|
105
|
+
white-space: nowrap;
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
}
|
|
@@ -32,6 +32,21 @@
|
|
|
32
32
|
--rt-dynamic-selector-popup-empty-text-size-default: var(--rt-text-md);
|
|
33
33
|
--rt-dynamic-selector-popup-empty-text-weight-default: var(--rt-font-weight-medium);
|
|
34
34
|
--rt-dynamic-selector-popup-empty-text-color-default: var(--rt-color-text-primary);
|
|
35
|
+
--rt-dynamic-selector-popup-highlight-color-default: var(--rt-color-text-primary);
|
|
36
|
+
--rt-dynamic-selector-popup-highlight-weight-default: var(--rt-font-weight-semibold);
|
|
37
|
+
--rt-dynamic-selector-popup-highlight-bg-default: transparent;
|
|
38
|
+
--rt-dynamic-selector-popup-highlight-radius-default: 0;
|
|
39
|
+
|
|
40
|
+
/* Пункт по умолчанию держит высоту строки браузера и высоту своего содержимого. */
|
|
41
|
+
--rt-dynamic-selector-popup-option-line-height-default: normal;
|
|
42
|
+
--rt-dynamic-selector-popup-option-min-height-default: 0;
|
|
43
|
+
|
|
44
|
+
/* Зазор от круга под значком до подписи пустого результата: отступ круга и зазор заглушки. */
|
|
45
|
+
--rt-dynamic-selector-popup-empty-gap-default: calc(var(--rt-space-xs) + var(--rt-space-sm));
|
|
46
|
+
|
|
47
|
+
/* Низ окна: отступ сверху до кнопок и отступ окна по бокам, снизу его даёт само окно. */
|
|
48
|
+
--rt-dynamic-selector-popup-foot-padding-default: var(--rt-space-sm)
|
|
49
|
+
var(--rt-dynamic-selector-popup-padding, var(--rt-dynamic-selector-popup-padding-default)) 0;
|
|
35
50
|
|
|
36
51
|
display: flex;
|
|
37
52
|
width: var(--rt-dynamic-selector-popup-width, var(--rt-dynamic-selector-popup-width-default));
|
|
@@ -96,13 +111,16 @@
|
|
|
96
111
|
display: block;
|
|
97
112
|
}
|
|
98
113
|
|
|
99
|
-
|
|
114
|
+
// Два класса, а не один: `.rt-icon` задаёт значку свой display, и порядок стилей двух
|
|
115
|
+
// компонентов кита между собой не закреплён.
|
|
116
|
+
&__multi &__multi-hint-icon {
|
|
100
117
|
display: none;
|
|
101
118
|
}
|
|
102
119
|
}
|
|
103
120
|
|
|
121
|
+
// Хост rt-checkbox несёт свой display; в колонке flex флажок и так стоит блоком.
|
|
104
122
|
&__select-all {
|
|
105
|
-
|
|
123
|
+
min-width: 0;
|
|
106
124
|
}
|
|
107
125
|
|
|
108
126
|
// Тело окна — загрузка, список или пустой результат — занимает высоту, которую оставили шапка и
|
|
@@ -124,25 +142,6 @@
|
|
|
124
142
|
padding-inline: var(--rt-dynamic-selector-popup-padding, var(--rt-dynamic-selector-popup-padding-default));
|
|
125
143
|
}
|
|
126
144
|
|
|
127
|
-
// Шаг строки снят с первого кита: флажок и по отступу сверху и снизу — около 36px.
|
|
128
|
-
&__row {
|
|
129
|
-
display: block;
|
|
130
|
-
padding-block: var(--rt-space-sm);
|
|
131
|
-
|
|
132
|
-
&--separated {
|
|
133
|
-
border-bottom: var(--rt-dynamic-selector-popup-border-width, var(--rt-dynamic-selector-popup-border-width-default)) solid
|
|
134
|
-
var(--rt-color-border-subtle);
|
|
135
|
-
margin-block-end: var(--rt-space-2xs);
|
|
136
|
-
padding-block-end: var(--rt-space-sm);
|
|
137
|
-
}
|
|
138
|
-
}
|
|
139
|
-
|
|
140
|
-
// Длинная подпись строки переносится: обрезка спрятала бы, какую запись человек отмечает.
|
|
141
|
-
&__option {
|
|
142
|
-
display: block;
|
|
143
|
-
overflow-wrap: anywhere;
|
|
144
|
-
}
|
|
145
|
-
|
|
146
145
|
&__sentinel {
|
|
147
146
|
min-height: var(--rt-size-1);
|
|
148
147
|
}
|
|
@@ -158,6 +157,13 @@
|
|
|
158
157
|
padding-inline: var(--rt-dynamic-selector-popup-padding, var(--rt-dynamic-selector-popup-padding-default));
|
|
159
158
|
}
|
|
160
159
|
|
|
160
|
+
// Зазор заглушки стоит и между подписью и её действием, поэтому свойство двигает отступ круга.
|
|
161
|
+
&__empty .rt-empty-state__icon-wrap {
|
|
162
|
+
margin-bottom: calc(
|
|
163
|
+
var(--rt-dynamic-selector-popup-empty-gap, var(--rt-dynamic-selector-popup-empty-gap-default)) - var(--rt-space-sm)
|
|
164
|
+
);
|
|
165
|
+
}
|
|
166
|
+
|
|
161
167
|
/* Свойства заглушки переставляются правилом из двух классов: объявление самой заглушки
|
|
162
168
|
стоит на том же элементе, и одним классом его не перебить. */
|
|
163
169
|
&__empty.rt-empty-state {
|
|
@@ -187,11 +193,10 @@
|
|
|
187
193
|
display: flex;
|
|
188
194
|
align-items: center;
|
|
189
195
|
justify-content: flex-end;
|
|
196
|
+
padding: var(--rt-dynamic-selector-popup-foot-padding, var(--rt-dynamic-selector-popup-foot-padding-default));
|
|
190
197
|
border-top: var(--rt-dynamic-selector-popup-foot-border-width, var(--rt-dynamic-selector-popup-foot-border-width-default)) solid
|
|
191
198
|
var(--rt-color-border-subtle);
|
|
192
199
|
gap: var(--rt-space-sm);
|
|
193
|
-
padding-block-start: var(--rt-space-sm);
|
|
194
|
-
padding-inline: var(--rt-dynamic-selector-popup-padding, var(--rt-dynamic-selector-popup-padding-default));
|
|
195
200
|
|
|
196
201
|
&--nav {
|
|
197
202
|
justify-content: space-between;
|
|
@@ -12,12 +12,11 @@
|
|
|
12
12
|
gap: var(--rt-space-sm);
|
|
13
13
|
}
|
|
14
14
|
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
15
|
+
// Хосты компонентов кита несут свой блочный класс и свой display, а порядок стилей двух
|
|
16
|
+
// компонентов между собой не закреплён: своего display у этих элементов нет.
|
|
17
|
+
&__invitation,
|
|
19
18
|
&__nothing {
|
|
20
|
-
|
|
19
|
+
min-width: 0;
|
|
21
20
|
}
|
|
22
21
|
}
|
|
23
22
|
}
|
|
@@ -35,7 +35,9 @@
|
|
|
35
35
|
- Размеры и подложка — свойства блока: `--rt-empty-state-icon-wrap-size`,
|
|
36
36
|
`--rt-empty-state-icon-wrap-bg`, `--rt-empty-state-icon-size`, `--rt-empty-state-title-size`,
|
|
37
37
|
`--rt-empty-state-title-weight`, `--rt-empty-state-title-color`,
|
|
38
|
-
`--rt-empty-state-description-size`.
|
|
38
|
+
`--rt-empty-state-description-size`. Поля и зазоры задают `--rt-empty-state-padding`,
|
|
39
|
+
`--rt-empty-state-gap`, `--rt-empty-state-icon-offset` и
|
|
40
|
+
`--rt-empty-state-description-line-height`. Список ставит им назначения `--rt-list-empty-*`. Под
|
|
39
41
|
материальным набором его заглушка рисуется как у первого кита: значок 48px без круга, заголовок
|
|
40
42
|
32px весом 400.
|
|
41
43
|
|
|
@@ -15,6 +15,10 @@
|
|
|
15
15
|
--rt-empty-state-title-weight: var(--rt-font-weight-medium);
|
|
16
16
|
--rt-empty-state-title-color: var(--rt-color-text-primary);
|
|
17
17
|
--rt-empty-state-description-size: var(--rt-text-sm);
|
|
18
|
+
--rt-empty-state-description-line-height: var(--rt-leading-normal);
|
|
19
|
+
--rt-empty-state-padding: var(--rt-space-xl) var(--rt-space-lg);
|
|
20
|
+
--rt-empty-state-gap: var(--rt-space-sm);
|
|
21
|
+
--rt-empty-state-icon-offset: var(--rt-space-xs);
|
|
18
22
|
--rt-empty-state-frame-width: var(--rt-border-width-medium);
|
|
19
23
|
--rt-empty-state-frame-color: var(--rt-color-border-strong);
|
|
20
24
|
--rt-empty-state-frame-radius: var(--rt-radius-lg);
|
|
@@ -23,8 +27,8 @@
|
|
|
23
27
|
flex-direction: column;
|
|
24
28
|
align-items: center;
|
|
25
29
|
justify-content: center;
|
|
26
|
-
padding: var(--rt-
|
|
27
|
-
gap: var(--rt-
|
|
30
|
+
padding: var(--rt-empty-state-padding);
|
|
31
|
+
gap: var(--rt-empty-state-gap);
|
|
28
32
|
text-align: center;
|
|
29
33
|
|
|
30
34
|
/* Рамка зоны загрузки: пунктир говорит «сюда можно бросить файл», как у первого кита. */
|
|
@@ -39,7 +43,7 @@
|
|
|
39
43
|
display: none;
|
|
40
44
|
}
|
|
41
45
|
|
|
42
|
-
margin-bottom: var(--rt-
|
|
46
|
+
margin-bottom: var(--rt-empty-state-icon-offset);
|
|
43
47
|
}
|
|
44
48
|
|
|
45
49
|
&__icon-wrap {
|
|
@@ -49,7 +53,7 @@
|
|
|
49
53
|
align-items: center;
|
|
50
54
|
justify-content: center;
|
|
51
55
|
border-radius: var(--rt-empty-state-icon-radius);
|
|
52
|
-
margin-bottom: var(--rt-
|
|
56
|
+
margin-bottom: var(--rt-empty-state-icon-offset);
|
|
53
57
|
background: var(--rt-empty-state-icon-wrap-bg);
|
|
54
58
|
color: var(--rt-color-text-muted);
|
|
55
59
|
|
|
@@ -74,7 +78,7 @@
|
|
|
74
78
|
margin: 0;
|
|
75
79
|
color: var(--rt-color-text-muted);
|
|
76
80
|
font-size: var(--rt-empty-state-description-size);
|
|
77
|
-
line-height: var(--rt-
|
|
81
|
+
line-height: var(--rt-empty-state-description-line-height);
|
|
78
82
|
}
|
|
79
83
|
|
|
80
84
|
/* Слот действия скрыт, если ничего не спроецировано (пустой div). */
|
|
@@ -39,6 +39,13 @@ symbol внутри спрайта — и тем же движением про
|
|
|
39
39
|
и на контейнере, и на одной странице законно живут оба набора рядом. Ставит его приложение своей
|
|
40
40
|
разметкой, своей службы у набора нет — этим он и отличается от темы.
|
|
41
41
|
|
|
42
|
+
Второй признак — `data-rt-icon-preset='material'`, имя атрибута `RT_ICON_PRESET_ATTRIBUTE`. Он
|
|
43
|
+
стоит в том же `RT_ICON_MATERIAL_PRESET_SELECTOR`, поэтому его читают и значок, и кнопка
|
|
44
|
+
`rtButton`, но стили его не знают: токены набора оформления строятся только из `data-preset` и
|
|
45
|
+
`.rt-preset-material`. Так участок страницы получает материальные значки без чужих токенов.
|
|
46
|
+
Значение `'base'` у признака ничего не делает: выбирается ближайший материальный предок, а не
|
|
47
|
+
ближайший признак.
|
|
48
|
+
|
|
42
49
|
Стилями набор не выбирается, хотя набор оформления работает именно так: ссылку на символ спрайта
|
|
43
50
|
CSS подменить нечем. Второй `<use>` рядом с первым тоже не годится — он вечно указывает на символ,
|
|
44
51
|
за которым никто не ходил, а обвязка снимков ждёт, пока нарисуется каждый значок на странице.
|
|
@@ -47,6 +47,23 @@
|
|
|
47
47
|
background-color: var(--rt-color-bg-surface-subtle-2);
|
|
48
48
|
}
|
|
49
49
|
|
|
50
|
+
/* Шаг входа `radius` у залитого поля скругляет все четыре угла, и черта снизу не рисуется:
|
|
51
|
+
прямой низ с чертой у поля-таблетки читается обрубленным. Без шага поле остаётся прежним.
|
|
52
|
+
`:where` держит силу правила на уровне вида, и рамки фокуса и ошибки ниже его перекрывают. */
|
|
53
|
+
&--appearance--fill:where([data-rt-radius]) {
|
|
54
|
+
border-radius: var(--rt-input-box-radius);
|
|
55
|
+
border-bottom-color: transparent;
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
/* Вид «pill» — залитое поле-таблетка без черты. Скругление идёт через своё свойство поля,
|
|
59
|
+
поэтому шаг входа `radius` его переназначает. */
|
|
60
|
+
&--appearance--pill {
|
|
61
|
+
--rt-input-box-radius: var(--rt-radius-full);
|
|
62
|
+
|
|
63
|
+
border-color: transparent;
|
|
64
|
+
background-color: var(--rt-color-bg-surface-subtle-2);
|
|
65
|
+
}
|
|
66
|
+
|
|
50
67
|
&--invalid {
|
|
51
68
|
border-color: var(--rt-input-color-border-error);
|
|
52
69
|
|
|
@@ -46,6 +46,21 @@
|
|
|
46
46
|
background-color: var(--rt-color-bg-surface-subtle-2);
|
|
47
47
|
}
|
|
48
48
|
|
|
49
|
+
/* Шаг входа `radius` у залитого поля скругляет все четыре угла, и черта снизу не рисуется —
|
|
50
|
+
так же, как у поля ввода. `:where` держит силу правила на уровне вида. */
|
|
51
|
+
&--appearance--fill:where([data-rt-radius]) {
|
|
52
|
+
border-radius: var(--rt-input-number-radius);
|
|
53
|
+
border-bottom-color: transparent;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
/* Вид «pill» — залитое поле-таблетка без черты; шаг входа `radius` переназначает скругление. */
|
|
57
|
+
&--appearance--pill {
|
|
58
|
+
--rt-input-number-radius: var(--rt-radius-full);
|
|
59
|
+
|
|
60
|
+
border-color: transparent;
|
|
61
|
+
background-color: var(--rt-color-bg-surface-subtle-2);
|
|
62
|
+
}
|
|
63
|
+
|
|
49
64
|
&--invalid {
|
|
50
65
|
border-color: var(--rt-input-color-border-error);
|
|
51
66
|
|
|
@@ -38,3 +38,6 @@
|
|
|
38
38
|
директивами, а число столбцов здесь приходит из текста.
|
|
39
39
|
- **Пустой текст не рисует ничего** — ни пустого абзаца, ни отступа: показывать или прятать
|
|
40
40
|
заголовок раздела, решает потребитель.
|
|
41
|
+
- **Видимый текст без знаков разметки даёт `markdownToPlainText`** (`@rt-tools/ui-kit-v2/core`). Он
|
|
42
|
+
идёт по тому же дереву `parseMarkdown`: блоки через пустую строку, пункты списка и строки таблицы
|
|
43
|
+
построчно без маркеров, ячейки через табуляцию, у ссылки — её текст без адреса.
|
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
```
|
|
20
20
|
|
|
21
21
|
Входы: `rows`, `activeId`, `searchPlaceholder`, `emptyText`, `loading`, `fetching`, `hasMore`,
|
|
22
|
-
`filtersActive`. Выходы: `selectRow`, `openInNewTab`, `searchChange`, `loadMore`.
|
|
22
|
+
`filtersActive`, `emptyPreviewIcons`. Выходы: `selectRow`, `openInNewTab`, `searchChange`, `loadMore`.
|
|
23
23
|
|
|
24
24
|
Строка обязана иметь `id`, `hasUnread` и (необязательно) `overdue` — это всё, что список о ней знает.
|
|
25
25
|
Номер строки — число или строка: у записей домена ключ не всегда числовой. Тем же типом приходит
|
|
@@ -45,6 +45,8 @@
|
|
|
45
45
|
|
|
46
46
|
## Края
|
|
47
47
|
|
|
48
|
+
- Пустой список рисует строки-превью по одной на значок из `emptyPreviewIcons` (по умолчанию
|
|
49
|
+
`user`, `users`, `user`); каждая вторая строка сдвинута модификатором `offset`.
|
|
48
50
|
- Якорь догрузки (`rtInfiniteScroll`) появляется только при `hasMore`.
|
|
49
51
|
- Кнопка фильтров рисуется, только если объявлен шаблон `[rtThreadListFilters]`;
|
|
50
52
|
`filtersActive` рисует на ней точку.
|
|
@@ -48,8 +48,23 @@
|
|
|
48
48
|
- Удаление беседы — действие строки `rt-thread-list` (`rtThreadListRowActions`), подтверждение —
|
|
49
49
|
на приложении.
|
|
50
50
|
- Подсветка совпадений поиска по беседам — `splitSideMenuTitle`.
|
|
51
|
+
- Строки-превью пустого списка бесед — `emptyPreviewIcons`, по умолчанию `sparkle`, `bot`, `sparkle`:
|
|
52
|
+
беседы идут с ассистентом, а не с людьми. Вход уходит в `rt-thread-list` как есть.
|
|
51
53
|
- Ответ рисует внутренний `rt-ai-chat-answer` (папка `answer/`): без него шаблон организма
|
|
52
54
|
превышает предел цикломатической сложности.
|
|
55
|
+
- Копирование — внутренний `rt-ai-chat-copy` (папка `copy/`): у вопроса строкой под пузырём, у
|
|
56
|
+
ответа первым в строке оценки. Состояние «скопировано» своё у каждой кнопки, приём —
|
|
57
|
+
`rt-copy-value`: CDK `Clipboard`, `check` и `uiCopied` на 2000 мс. Подписи — `uiCopy`, `uiCopied`
|
|
58
|
+
кита, своих `ai*` нет. Вопрос копирует `message.text` как есть. Ответ — видимый текст без знаков
|
|
59
|
+
разметки: `plainText` через `markdownToPlainText` кита, по тому же дереву `parseMarkdown`, что
|
|
60
|
+
рисует `rt-markdown-text`. Ход работы, вложения `extra` и строка действий в буфер не попадают —
|
|
61
|
+
их нет в `message.text`. `innerText` отображённого текста не взят: в jsdom спек его нет, и
|
|
62
|
+
проверялась бы подмена, а не настоящий путь. `copyable` выключает обе.
|
|
63
|
+
- `headerIconPreset="material"` ставит на `<header>` признак `data-rt-icon-preset='material'`
|
|
64
|
+
(`RT_ICON_PRESET_ATTRIBUTE`): значки шапки — назад, знак ассистента в заголовке, полный экран,
|
|
65
|
+
беседы, новая беседа, закрыть — рисуются материальным набором, токены набора оформления не
|
|
66
|
+
меняются. При `'base'` признака нет. Значок читает признак один раз после первой отрисовки:
|
|
67
|
+
смена входа на живой панели перерисовывает только значки, появившиеся после неё.
|
|
53
68
|
|
|
54
69
|
## Рядом
|
|
55
70
|
|
|
@@ -119,7 +119,14 @@
|
|
|
119
119
|
|
|
120
120
|
&__question {
|
|
121
121
|
display: flex;
|
|
122
|
-
|
|
122
|
+
flex-direction: column;
|
|
123
|
+
align-items: flex-end;
|
|
124
|
+
gap: var(--rt-space-2xs);
|
|
125
|
+
}
|
|
126
|
+
|
|
127
|
+
&__question-actions {
|
|
128
|
+
display: flex;
|
|
129
|
+
gap: var(--rt-space-xs);
|
|
123
130
|
}
|
|
124
131
|
|
|
125
132
|
&__bubble {
|
|
@@ -159,6 +159,61 @@ declare namespace IRtDataTable {
|
|
|
159
159
|
}
|
|
160
160
|
}
|
|
161
161
|
|
|
162
|
+
/**
|
|
163
|
+
* Модель `rt-dynamic-selector`: один корневой неймспейс с префиксом `I`.
|
|
164
|
+
*/
|
|
165
|
+
declare namespace IRtDynamicSelector {
|
|
166
|
+
/** Состояние флажка «Выбрать всё» по видимым пунктам. */
|
|
167
|
+
type SelectAllState = 'none' | 'some' | 'all';
|
|
168
|
+
/** Как выбирает всплывающий список: один пункт переключателем или несколько флажками. */
|
|
169
|
+
type Mode = 'single' | 'multi';
|
|
170
|
+
/** Регистр подписи кнопки: как есть, каждое слово с заглавной или вся заглавными. */
|
|
171
|
+
type LabelCase = 'none' | 'title' | 'upper';
|
|
172
|
+
/** Строки всплывающего выбора: отмеченные раньше над разделителем и найденные под ним. */
|
|
173
|
+
interface PopupRows<T> {
|
|
174
|
+
readonly ticked: ReadonlyArray<T>;
|
|
175
|
+
readonly found: ReadonlyArray<T>;
|
|
176
|
+
}
|
|
177
|
+
/** Кусок подписи пункта: совпал ли он со словом поиска. */
|
|
178
|
+
interface MatchPart {
|
|
179
|
+
readonly text: string;
|
|
180
|
+
readonly matched: boolean;
|
|
181
|
+
}
|
|
182
|
+
/** Строка всплывающего выбора, готовая для разметки. */
|
|
183
|
+
interface PopupRow<T> {
|
|
184
|
+
readonly entity: T;
|
|
185
|
+
readonly key: unknown;
|
|
186
|
+
readonly label: string;
|
|
187
|
+
/** Подпись по кускам; без подсветки поиска — один кусок без отметки. */
|
|
188
|
+
readonly parts: ReadonlyArray<MatchPart>;
|
|
189
|
+
readonly ticked: boolean;
|
|
190
|
+
/** Под строкой стоит разделитель. */
|
|
191
|
+
readonly separated: boolean;
|
|
192
|
+
}
|
|
193
|
+
/** Строка списка выбранного, готовая для разметки. */
|
|
194
|
+
interface ListRow<T> {
|
|
195
|
+
readonly item: T;
|
|
196
|
+
readonly key: unknown;
|
|
197
|
+
readonly label: string;
|
|
198
|
+
/** Строку нельзя убрать из списка. */
|
|
199
|
+
readonly locked: boolean;
|
|
200
|
+
}
|
|
201
|
+
/** Перенос строки списка выбранного: откуда и куда. */
|
|
202
|
+
interface Move {
|
|
203
|
+
readonly from: number;
|
|
204
|
+
readonly to: number;
|
|
205
|
+
}
|
|
206
|
+
/** Обстановка шаблона строки, который принёс вызывающий. */
|
|
207
|
+
interface RowContext<T> {
|
|
208
|
+
readonly $implicit: T;
|
|
209
|
+
}
|
|
210
|
+
/** Правка строки поля списка строк: прежнее значение и новое. */
|
|
211
|
+
interface TextEdit {
|
|
212
|
+
readonly previous: string;
|
|
213
|
+
readonly next: string;
|
|
214
|
+
}
|
|
215
|
+
}
|
|
216
|
+
|
|
162
217
|
/**
|
|
163
218
|
* Имена иконок rt-icon. Набор лежит в `assets/icons` пакета, откуда сборка
|
|
164
219
|
* приложения кладёт его туда, куда указывает `provideRtIcons()`. Большинство
|
|
@@ -226,10 +281,10 @@ declare namespace IRtInput {
|
|
|
226
281
|
/** Размерный вариант поля (высота). Общий для всего input-семейства. */
|
|
227
282
|
type Size = 'sm' | 'md' | 'lg';
|
|
228
283
|
/**
|
|
229
|
-
* Вид рамки
|
|
230
|
-
*
|
|
284
|
+
* Вид рамки поля. `outline` — рамка со всех сторон, `fill` — залитое поле с чертой снизу, как у
|
|
285
|
+
* материального поля первого кита, `pill` — залитое поле-таблетка без черты.
|
|
231
286
|
*/
|
|
232
|
-
type Appearance = 'outline' | 'fill';
|
|
287
|
+
type Appearance = 'outline' | 'fill' | 'pill';
|
|
233
288
|
}
|
|
234
289
|
|
|
235
290
|
/** Один шаг шкалы скругления. Значения шагов лежат в токенах `--rt-radius-<шаг>`. */
|
|
@@ -319,6 +374,16 @@ declare namespace IRtKitConfig {
|
|
|
319
374
|
emptyResultsText?: string;
|
|
320
375
|
/** Переносится ли название строки списка. Умолчание кита — переносится. */
|
|
321
376
|
titleWrap?: boolean;
|
|
377
|
+
/** Шаг скругления поля поиска в окне выбора. Умолчание кита — скругление самого поля. */
|
|
378
|
+
searchRadius?: TRtRadius | null;
|
|
379
|
+
/** Выделять ли в подписи пункта символы, совпавшие с поиском. Умолчание кита — не выделять. */
|
|
380
|
+
highlightSearch?: boolean;
|
|
381
|
+
/** Подпись кнопки применения в окне выбора. Умолчание кита — пустая строка, то есть подпись кита. */
|
|
382
|
+
applyLabel?: string;
|
|
383
|
+
/** Регистр подписи кнопки применения. Умолчание кита — `none`, подпись как есть. */
|
|
384
|
+
applyLabelCase?: IRtDynamicSelector.LabelCase;
|
|
385
|
+
/** Получает ли поле поиска фокус при открытии окна выбора. Умолчание кита — не получает. */
|
|
386
|
+
autofocusSearch?: boolean;
|
|
322
387
|
}
|
|
323
388
|
/** Умолчания по узлам: каждое действует на одну семью и перебивает общее. */
|
|
324
389
|
interface Components {
|
|
@@ -1025,7 +1090,7 @@ declare class RtInfiniteScrollDirective implements OnDestroy {
|
|
|
1025
1090
|
/** The name of a styling property the kit declares itself. */
|
|
1026
1091
|
type TRtDesignTokenName = '--rt-amber-400' | '--rt-border-width-medium' | '--rt-border-width-thick' | '--rt-border-width-thin' | '--rt-bp-lg' | '--rt-bp-md' | '--rt-bp-sm' | '--rt-bp-xl' | '--rt-brand-100' | '--rt-brand-200' | '--rt-brand-300' | '--rt-brand-400' | '--rt-brand-50' | '--rt-brand-500' | '--rt-brand-600' | '--rt-brand-700' | '--rt-brand-800' | '--rt-brand-900' | '--rt-brand-950' | '--rt-btn-tint-active' | '--rt-btn-tint-hover' | '--rt-charcoal-700' | '--rt-charcoal-800' | '--rt-charcoal-900' | '--rt-charcoal-950' | '--rt-charcoal-border' | '--rt-charcoal-border-strong' | '--rt-chat-bubble-date' | '--rt-chat-bubble-in-author' | '--rt-chat-bubble-in-bg' | '--rt-chat-bubble-own-author' | '--rt-chat-bubble-own-bg' | '--rt-chat-status-read' | '--rt-color-action-danger' | '--rt-color-action-danger-active' | '--rt-color-action-danger-hover' | '--rt-color-action-danger-on-surface' | '--rt-color-action-disabled' | '--rt-color-action-info' | '--rt-color-action-info-active' | '--rt-color-action-info-hover' | '--rt-color-action-info-on-surface' | '--rt-color-action-on-danger' | '--rt-color-action-on-disabled' | '--rt-color-action-on-info' | '--rt-color-action-on-primary' | '--rt-color-action-on-secondary' | '--rt-color-action-on-success' | '--rt-color-action-on-warning' | '--rt-color-action-primary' | '--rt-color-action-primary-active' | '--rt-color-action-primary-hover' | '--rt-color-action-primary-on-surface' | '--rt-color-action-primary-soft' | '--rt-color-action-primary-subtle' | '--rt-color-action-secondary' | '--rt-color-action-secondary-active' | '--rt-color-action-secondary-hover' | '--rt-color-action-secondary-on-surface' | '--rt-color-action-success' | '--rt-color-action-success-active' | '--rt-color-action-success-hover' | '--rt-color-action-success-on-surface' | '--rt-color-action-warning' | '--rt-color-action-warning-active' | '--rt-color-action-warning-hover' | '--rt-color-action-warning-on-surface' | '--rt-color-bg-hover' | '--rt-color-bg-inverse' | '--rt-color-bg-nav' | '--rt-color-bg-overlay' | '--rt-color-bg-page' | '--rt-color-bg-page-auth' | '--rt-color-bg-subtle' | '--rt-color-bg-surface' | '--rt-color-bg-surface-auth-card' | '--rt-color-bg-surface-subtle' | '--rt-color-bg-surface-subtle-2' | '--rt-color-border-default' | '--rt-color-border-focus' | '--rt-color-border-strong' | '--rt-color-border-subtle' | '--rt-color-field-fill-underline' | '--rt-color-skeleton-base' | '--rt-color-skeleton-wave' | '--rt-color-state-danger' | '--rt-color-state-danger-bg' | '--rt-color-state-error-text' | '--rt-color-state-info' | '--rt-color-state-info-bg' | '--rt-color-state-success' | '--rt-color-state-success-bg' | '--rt-color-state-success-text' | '--rt-color-state-warning' | '--rt-color-state-warning-bg' | '--rt-color-state-warning-text' | '--rt-color-stepper-current' | '--rt-color-stepper-current-subtle' | '--rt-color-stepper-progress' | '--rt-color-stepper-track' | '--rt-color-table-head-bg' | '--rt-color-text-disabled' | '--rt-color-text-inverse' | '--rt-color-text-link' | '--rt-color-text-link-hover' | '--rt-color-text-muted' | '--rt-color-text-primary' | '--rt-control-height-2xl' | '--rt-control-height-lg' | '--rt-control-height-md' | '--rt-control-height-sm' | '--rt-control-height-xl' | '--rt-control-max-width' | '--rt-control-panel-max-height' | '--rt-control-textarea-min-height-lg' | '--rt-control-textarea-min-height-md' | '--rt-control-textarea-min-height-sm' | '--rt-counter-gap' | '--rt-counter-row-color-border' | '--rt-counter-row-gap' | '--rt-counter-row-hint-color' | '--rt-counter-row-hint-font-size' | '--rt-counter-row-label-color' | '--rt-counter-row-label-font-size' | '--rt-counter-row-padding-y' | '--rt-counter-value-color' | '--rt-counter-value-font-size' | '--rt-counter-value-min-width' | '--rt-danger-50' | '--rt-danger-500' | '--rt-danger-600' | '--rt-danger-700' | '--rt-duration-base' | '--rt-duration-fast' | '--rt-duration-slow' | '--rt-duration-slower' | '--rt-field-error-color' | '--rt-field-error-font-size' | '--rt-field-gap' | '--rt-field-hint-color' | '--rt-field-hint-font-size' | '--rt-field-label-color' | '--rt-field-label-font-size' | '--rt-field-label-font-weight' | '--rt-field-label-help-gap' | '--rt-field-required-color' | '--rt-field-value-color' | '--rt-field-value-empty-color' | '--rt-field-value-font-size' | '--rt-focus-ring-color' | '--rt-focus-ring-color-danger' | '--rt-focus-ring-offset' | '--rt-focus-ring-width' | '--rt-font-family-mono' | '--rt-font-family-sans' | '--rt-font-weight-bold' | '--rt-font-weight-medium' | '--rt-font-weight-regular' | '--rt-font-weight-semibold' | '--rt-gray-350' | '--rt-icon-button-color-bg-hover' | '--rt-icon-button-disabled-color' | '--rt-icon-button-disabled-fill' | '--rt-icon-button-disabled-opacity' | '--rt-info-50' | '--rt-info-500' | '--rt-info-600' | '--rt-info-700' | '--rt-input-border-width' | '--rt-input-color-bg' | '--rt-input-color-bg-disabled' | '--rt-input-color-bg-hover' | '--rt-input-color-border' | '--rt-input-color-border-error' | '--rt-input-color-border-focus' | '--rt-input-color-text' | '--rt-input-color-text-placeholder' | '--rt-input-disabled-opacity' | '--rt-input-focus-outline-offset' | '--rt-input-focus-shadow' | '--rt-input-focus-shadow-error' | '--rt-input-font-size' | '--rt-input-gap' | '--rt-input-height' | '--rt-input-height-lg' | '--rt-input-height-md' | '--rt-input-height-sm' | '--rt-input-icon-color' | '--rt-input-icon-size' | '--rt-input-line-height' | '--rt-input-max-width' | '--rt-input-padding-x' | '--rt-input-padding-y' | '--rt-input-panel-max-height' | '--rt-input-radius' | '--rt-input-transition' | '--rt-leading-none' | '--rt-leading-normal' | '--rt-leading-relaxed' | '--rt-leading-snug' | '--rt-leading-tight' | '--rt-letter-spacing-wide' | '--rt-list-action-color' | '--rt-list-action-color-bg-hover' | '--rt-list-action-color-hover' | '--rt-list-action-divider-height' | '--rt-list-action-gap' | '--rt-list-action-icon-size' | '--rt-list-action-radius' | '--rt-list-action-shadow' | '--rt-list-action-shadow-hover' | '--rt-list-content-padding-bottom' | '--rt-list-copy-button-bg' | '--rt-list-copy-button-bg-hover' | '--rt-list-copy-button-color' | '--rt-list-copy-button-radius' | '--rt-list-copy-button-size' | '--rt-list-empty-icon-size' | '--rt-list-empty-icon-wrap-bg' | '--rt-list-empty-icon-wrap-size' | '--rt-list-empty-title-size' | '--rt-list-empty-title-weight' | '--rt-list-filter-line-height' | '--rt-list-placeholder-grow' | '--rt-list-placeholder-min-height' | '--rt-list-search-color-bg' | '--rt-list-search-color-border' | '--rt-list-search-color-placeholder' | '--rt-list-search-font-size' | '--rt-list-search-gap' | '--rt-list-search-height' | '--rt-list-search-icon-color' | '--rt-list-search-icon-size' | '--rt-list-search-padding-x' | '--rt-list-search-radius' | '--rt-list-search-width' | '--rt-list-selector-label-color' | '--rt-list-settings-icon-color' | '--rt-list-settings-item-bg' | '--rt-list-settings-item-radius' | '--rt-list-table-button-radius' | '--rt-list-table-button-size' | '--rt-list-table-head-divider-color' | '--rt-list-table-icon-color' | '--rt-list-table-icon-size' | '--rt-list-toolbar-gap' | '--rt-list-toolbar-padding-bottom' | '--rt-list-toolbar-padding-top' | '--rt-mat-blue-100' | '--rt-mat-blue-20' | '--rt-mat-blue-40' | '--rt-mat-blue-60' | '--rt-mat-blue-80' | '--rt-mat-blue-active' | '--rt-mat-blue-hover' | '--rt-mat-dark-10' | '--rt-mat-dark-20' | '--rt-mat-dark-30' | '--rt-mat-dark-40' | '--rt-mat-green-10' | '--rt-mat-green-100' | '--rt-mat-green-120' | '--rt-mat-green-20' | '--rt-mat-green-40' | '--rt-mat-green-60' | '--rt-mat-green-80' | '--rt-mat-green-active' | '--rt-mat-green-hover' | '--rt-mat-menu-min-width' | '--rt-mat-menu-sm-icon-size' | '--rt-mat-menu-sm-item-height' | '--rt-mat-navy-100' | '--rt-mat-neutral-0' | '--rt-mat-neutral-10' | '--rt-mat-neutral-100' | '--rt-mat-neutral-15' | '--rt-mat-neutral-20' | '--rt-mat-neutral-25' | '--rt-mat-neutral-30' | '--rt-mat-neutral-35' | '--rt-mat-neutral-40' | '--rt-mat-neutral-5' | '--rt-mat-neutral-60' | '--rt-mat-neutral-80' | '--rt-mat-neutral-active' | '--rt-mat-neutral-hover' | '--rt-mat-orange-10' | '--rt-mat-orange-100' | '--rt-mat-orange-20' | '--rt-mat-orange-40' | '--rt-mat-orange-5' | '--rt-mat-orange-60' | '--rt-mat-orange-70' | '--rt-mat-orange-80' | '--rt-mat-orange-active' | '--rt-mat-orange-hover' | '--rt-mat-overlay-black-32' | '--rt-mat-overlay-black-4' | '--rt-mat-overlay-blue-24' | '--rt-mat-overlay-blue-8' | '--rt-mat-radius-4' | '--rt-mat-radius-5' | '--rt-mat-red-10' | '--rt-mat-red-100' | '--rt-mat-red-20' | '--rt-mat-red-40' | '--rt-mat-red-60' | '--rt-mat-red-80' | '--rt-mat-red-active' | '--rt-mat-red-hover' | '--rt-mat-shadow-fab' | '--rt-mat-shadow-fab-hover' | '--rt-mat-shadow-level-2' | '--rt-nav-caret-size' | '--rt-nav-color-disabled' | '--rt-nav-color-focus' | '--rt-nav-header-color-bg' | '--rt-nav-header-padding' | '--rt-nav-item-color' | '--rt-nav-item-color-bg' | '--rt-nav-item-color-bg-active' | '--rt-nav-item-color-border' | '--rt-nav-item-color-caret' | '--rt-nav-item-color-hover' | '--rt-nav-item-color-pressed' | '--rt-nav-item-content-gap' | '--rt-nav-item-font-size' | '--rt-nav-item-font-weight' | '--rt-nav-item-gap' | '--rt-nav-item-height' | '--rt-nav-item-line-height' | '--rt-nav-item-padding' | '--rt-nav-marker-color' | '--rt-nav-marker-size' | '--rt-nav-panel-color-bg' | '--rt-nav-panel-color-border' | '--rt-nav-panel-column-gap' | '--rt-nav-panel-column-width' | '--rt-nav-panel-columns' | '--rt-nav-panel-group-color' | '--rt-nav-panel-group-content-gap' | '--rt-nav-panel-group-font-size' | '--rt-nav-panel-group-font-weight' | '--rt-nav-panel-group-gap' | '--rt-nav-panel-item-color' | '--rt-nav-panel-item-color-active' | '--rt-nav-panel-item-color-bg-active' | '--rt-nav-panel-item-color-bg-hover' | '--rt-nav-panel-item-content-gap' | '--rt-nav-panel-item-font-size' | '--rt-nav-panel-item-font-weight' | '--rt-nav-panel-item-gap' | '--rt-nav-panel-item-height' | '--rt-nav-panel-item-padding' | '--rt-nav-panel-padding' | '--rt-nav-panel-padding-y' | '--rt-nav-panel-shadow' | '--rt-navy-600' | '--rt-navy-900' | '--rt-neutral-0' | '--rt-neutral-100' | '--rt-neutral-200' | '--rt-neutral-300' | '--rt-neutral-400' | '--rt-neutral-50' | '--rt-neutral-500' | '--rt-neutral-600' | '--rt-neutral-700' | '--rt-neutral-800' | '--rt-neutral-900' | '--rt-neutral-950' | '--rt-opacity-disabled' | '--rt-overlay-amber-16' | '--rt-overlay-black-4' | '--rt-overlay-black-50' | '--rt-overlay-black-8' | '--rt-overlay-brand-24' | '--rt-overlay-brand-8' | '--rt-overlay-danger-16' | '--rt-overlay-menu-bg' | '--rt-overlay-menu-current-bg' | '--rt-overlay-menu-danger-color' | '--rt-overlay-menu-danger-label-color' | '--rt-overlay-menu-item-icon-size' | '--rt-overlay-menu-item-min-height' | '--rt-overlay-menu-item-padding-x' | '--rt-overlay-menu-item-padding-y' | '--rt-overlay-menu-item-weight' | '--rt-overlay-menu-min-width' | '--rt-overlay-menu-padding-y' | '--rt-overlay-menu-radius' | '--rt-overlay-menu-shadow' | '--rt-overlay-menu-sm-item-icon-size' | '--rt-overlay-menu-sm-item-min-height' | '--rt-overlay-navy-70' | '--rt-overlay-select-check-display' | '--rt-overlay-select-option-font-size' | '--rt-overlay-select-option-min-height' | '--rt-overlay-select-panel-border-width' | '--rt-overlay-select-radius' | '--rt-overlay-select-selected-bg' | '--rt-overlay-select-selected-weight' | '--rt-overlay-select-shadow' | '--rt-overlay-tooltip-radius' | '--rt-overlay-tooltip-shadow' | '--rt-overlay-white-25' | '--rt-overlay-white-4' | '--rt-overlay-white-40' | '--rt-overlay-white-50' | '--rt-overlay-white-8' | '--rt-pagination-arrow-color' | '--rt-pagination-arrow-radius' | '--rt-pagination-arrow-shadow' | '--rt-pagination-arrow-size' | '--rt-pagination-box-color-border' | '--rt-pagination-box-color-text' | '--rt-pagination-box-current-color-bg' | '--rt-pagination-box-current-color-border' | '--rt-pagination-box-current-color-text' | '--rt-pagination-box-current-font-weight' | '--rt-pagination-box-radius' | '--rt-pagination-box-size' | '--rt-pagination-field-color-bg' | '--rt-pagination-field-color-border' | '--rt-pagination-field-color-text' | '--rt-pagination-field-height' | '--rt-pagination-field-padding-x' | '--rt-pagination-field-radius' | '--rt-pagination-gap' | '--rt-pagination-justify' | '--rt-pagination-nav-gap' | '--rt-pagination-padding-x' | '--rt-pagination-padding-y' | '--rt-pagination-per-page-gap' | '--rt-pagination-per-page-label-white-space' | '--rt-pagination-range-display' | '--rt-profile-avatar-font-size' | '--rt-profile-avatar-size' | '--rt-profile-item-content-gap' | '--rt-profile-item-font-size' | '--rt-profile-item-font-weight' | '--rt-profile-item-padding-y' | '--rt-profile-item-radius' | '--rt-profile-menu-min-width' | '--rt-profile-menu-padding' | '--rt-profile-menu-shadow' | '--rt-profile-row-inset' | '--rt-profile-theme-icon-padding' | '--rt-radius-2xl' | '--rt-radius-control' | '--rt-radius-full' | '--rt-radius-lg' | '--rt-radius-md' | '--rt-radius-ms' | '--rt-radius-none' | '--rt-radius-sm' | '--rt-radius-xl' | '--rt-radius-xs' | '--rt-shadow-card' | '--rt-shadow-card-soft' | '--rt-shadow-dialog' | '--rt-shadow-focus-ring' | '--rt-shadow-focus-ring-danger' | '--rt-shadow-lg' | '--rt-shadow-md' | '--rt-shadow-nav-panel' | '--rt-shadow-none' | '--rt-shadow-profile-menu' | '--rt-shadow-sm' | '--rt-shadow-status-dot' | '--rt-shadow-step-indicator' | '--rt-shadow-xl' | '--rt-size-1' | '--rt-size-10' | '--rt-size-100' | '--rt-size-12' | '--rt-size-16' | '--rt-size-2' | '--rt-size-20' | '--rt-size-24' | '--rt-size-3' | '--rt-size-30' | '--rt-size-4' | '--rt-size-40' | '--rt-size-5' | '--rt-size-6' | '--rt-size-60' | '--rt-size-64' | '--rt-size-8' | '--rt-slate-300' | '--rt-space-0' | '--rt-space-0-5' | '--rt-space-1' | '--rt-space-10' | '--rt-space-12' | '--rt-space-16' | '--rt-space-2' | '--rt-space-20' | '--rt-space-24' | '--rt-space-2xl' | '--rt-space-2xs' | '--rt-space-3xl' | '--rt-space-4' | '--rt-space-5' | '--rt-space-6' | '--rt-space-8' | '--rt-space-lg' | '--rt-space-md' | '--rt-space-sm' | '--rt-space-xl' | '--rt-space-xs' | '--rt-success-100' | '--rt-success-400' | '--rt-success-50' | '--rt-success-500' | '--rt-success-600' | '--rt-success-700' | '--rt-text-2xl' | '--rt-text-2xs' | '--rt-text-3xl' | '--rt-text-3xs' | '--rt-text-4xl' | '--rt-text-base' | '--rt-text-lg' | '--rt-text-md' | '--rt-text-sm' | '--rt-text-xl' | '--rt-text-xs' | '--rt-textarea-line-height' | '--rt-textarea-min-height' | '--rt-textarea-min-height-lg' | '--rt-textarea-min-height-md' | '--rt-textarea-min-height-sm' | '--rt-textarea-padding-y' | '--rt-toggle-color-border' | '--rt-toggle-color-icon' | '--rt-toggle-color-thumb' | '--rt-toggle-color-track' | '--rt-toggle-color-track-on' | '--rt-toggle-shadow-border' | '--rt-toggle-shadow-thumb' | '--rt-warning-50' | '--rt-warning-500' | '--rt-warning-600' | '--rt-warning-700' | '--rt-yellow-400' | '--rt-z-base' | '--rt-z-dropdown' | '--rt-z-fixed' | '--rt-z-modal' | '--rt-z-modal-backdrop' | '--rt-z-popover' | '--rt-z-sticky' | '--rt-z-tooltip';
|
|
1027
1092
|
/** The name of a consumer's handle — a property the kit deliberately does not declare. */
|
|
1028
|
-
type TRtConsumerHandleName = '--rt-action-bar-action-bg-hover' | '--rt-action-bar-action-color-danger' | '--rt-action-bar-action-focus-shadow' | '--rt-action-bar-action-font-size' | '--rt-action-bar-action-height' | '--rt-action-bar-action-padding-block' | '--rt-action-bar-action-padding-inline' | '--rt-action-bar-action-radius' | '--rt-action-bar-action-weight' | '--rt-action-bar-bg' | '--rt-action-bar-close-icon-size' | '--rt-action-bar-close-size' | '--rt-action-bar-color' | '--rt-action-bar-counter-font-size' | '--rt-action-bar-counter-weight' | '--rt-action-bar-font-size' | '--rt-action-bar-gap' | '--rt-action-bar-holder-bottom' | '--rt-action-bar-holder-enter-duration' | '--rt-action-bar-holder-inline' | '--rt-action-bar-holder-leave-duration' | '--rt-action-bar-icon-gap' | '--rt-action-bar-icon-size' | '--rt-action-bar-menu-bg' | '--rt-action-bar-menu-color' | '--rt-action-bar-menu-gap' | '--rt-action-bar-menu-item-font-size' | '--rt-action-bar-menu-padding' | '--rt-action-bar-menu-radius' | '--rt-action-bar-menu-shadow' | '--rt-action-bar-padding' | '--rt-action-bar-radius' | '--rt-action-bar-shadow' | '--rt-aside-bg' | '--rt-aside-content-inset' | '--rt-aside-error-margin-block' | '--rt-aside-footer-gap' | '--rt-aside-footer-inset' | '--rt-aside-footer-justify' | '--rt-aside-footer-margin' | '--rt-aside-header-back-icon-size' | '--rt-aside-header-back-size' | '--rt-aside-header-gap' | '--rt-aside-header-inset' | '--rt-aside-header-min-height' | '--rt-aside-header-subtitle-size' | '--rt-aside-header-title-leading' | '--rt-aside-header-title-size' | '--rt-aside-header-title-weight' | '--rt-aside-width' | '--rt-data-table-scrollbar-color' | '--rt-data-table-scrollbar-horizontal-height' | '--rt-data-table-scrollbar-vertical-width' | '--rt-data-table-scrollbar-width' | '--rt-dialog-bg' | '--rt-dialog-border' | '--rt-dialog-content-max-height' | '--rt-dialog-content-padding' | '--rt-dialog-footer-border' | '--rt-dialog-footer-padding' | '--rt-dialog-header-border' | '--rt-dialog-header-padding' | '--rt-dialog-title-font-size' | '--rt-dialog-title-transform' | '--rt-dialog-title-weight' | '--rt-dialog-width' | '--rt-dynamic-selector-list-add-color' | '--rt-dynamic-selector-popup-bg' | '--rt-dynamic-selector-popup-border-width' | '--rt-dynamic-selector-popup-button-font-size' | '--rt-dynamic-selector-popup-button-height' | '--rt-dynamic-selector-popup-empty-icon-size' | '--rt-dynamic-selector-popup-empty-icon-wrap-bg' | '--rt-dynamic-selector-popup-empty-text-color' | '--rt-dynamic-selector-popup-empty-text-size' | '--rt-dynamic-selector-popup-empty-text-weight' | '--rt-dynamic-selector-popup-foot-border-width' | '--rt-dynamic-selector-popup-max-height' | '--rt-dynamic-selector-popup-min-height' | '--rt-dynamic-selector-popup-nav-color' | '--rt-dynamic-selector-popup-padding' | '--rt-dynamic-selector-popup-radius' | '--rt-dynamic-selector-popup-shadow' | '--rt-dynamic-selector-popup-width' | '--rt-header-content-max-width' | '--rt-header-height' | '--rt-icon-button-bg' | '--rt-icon-button-bg-hover' | '--rt-icon-button-size' | '--rt-icon-color-danger' | '--rt-icon-color-disabled' | '--rt-icon-color-info' | '--rt-icon-color-inverse' | '--rt-icon-color-muted' | '--rt-icon-color-primary' | '--rt-icon-color-success' | '--rt-icon-color-warning' | '--rt-icon-glyph-font' | '--rt-icon-glyph-grade' | '--rt-icon-glyph-opsz' | '--rt-icon-glyph-weight' | '--rt-icon-step-2xl' | '--rt-icon-step-3xl' | '--rt-icon-step-4xl' | '--rt-icon-step-lg' | '--rt-icon-step-md' | '--rt-icon-step-sm' | '--rt-icon-step-xl' | '--rt-icon-step-xs' | '--rt-logo-tagline' | '--rt-logo-tagline-dark' | '--rt-logo-wordmark' | '--rt-logo-wordmark-dark' | '--rt-page-header-bg' | '--rt-table-actions-bg' | '--rt-tag-color-bg' | '--rt-tag-color-border' | '--rt-tag-color-text' | '--rt-tag-letter-spacing' | '--rt-tag-padding-block' | '--rt-tag-padding-inline' | '--rt-toast-action-color' | '--rt-toast-bg' | '--rt-toast-border-color' | '--rt-toast-close-color' | '--rt-toast-color' | '--rt-toast-filled-danger-bg' | '--rt-toast-filled-danger-border-color' | '--rt-toast-filled-danger-color' | '--rt-toast-filled-info-bg' | '--rt-toast-filled-info-border-color' | '--rt-toast-filled-info-color' | '--rt-toast-filled-success-bg' | '--rt-toast-filled-success-border-color' | '--rt-toast-filled-success-color' | '--rt-toast-filled-warning-bg' | '--rt-toast-filled-warning-border-color' | '--rt-toast-filled-warning-color' | '--rt-toast-icon-color' | '--rt-toast-progress-color' | '--rt-toast-progress-height' | '--rt-workspace-aside-size' | '--rt-workspace-list-size';
|
|
1093
|
+
type TRtConsumerHandleName = '--rt-action-bar-action-bg-hover' | '--rt-action-bar-action-color-danger' | '--rt-action-bar-action-focus-shadow' | '--rt-action-bar-action-font-size' | '--rt-action-bar-action-height' | '--rt-action-bar-action-padding-block' | '--rt-action-bar-action-padding-inline' | '--rt-action-bar-action-radius' | '--rt-action-bar-action-weight' | '--rt-action-bar-bg' | '--rt-action-bar-close-icon-size' | '--rt-action-bar-close-size' | '--rt-action-bar-color' | '--rt-action-bar-counter-font-size' | '--rt-action-bar-counter-weight' | '--rt-action-bar-font-size' | '--rt-action-bar-gap' | '--rt-action-bar-holder-bottom' | '--rt-action-bar-holder-enter-duration' | '--rt-action-bar-holder-inline' | '--rt-action-bar-holder-leave-duration' | '--rt-action-bar-icon-gap' | '--rt-action-bar-icon-size' | '--rt-action-bar-menu-bg' | '--rt-action-bar-menu-color' | '--rt-action-bar-menu-gap' | '--rt-action-bar-menu-item-font-size' | '--rt-action-bar-menu-padding' | '--rt-action-bar-menu-radius' | '--rt-action-bar-menu-shadow' | '--rt-action-bar-padding' | '--rt-action-bar-radius' | '--rt-action-bar-shadow' | '--rt-aside-bg' | '--rt-aside-content-inset' | '--rt-aside-error-margin-block' | '--rt-aside-footer-gap' | '--rt-aside-footer-inset' | '--rt-aside-footer-justify' | '--rt-aside-footer-margin' | '--rt-aside-header-back-icon-size' | '--rt-aside-header-back-size' | '--rt-aside-header-gap' | '--rt-aside-header-inset' | '--rt-aside-header-min-height' | '--rt-aside-header-subtitle-size' | '--rt-aside-header-title-leading' | '--rt-aside-header-title-size' | '--rt-aside-header-title-weight' | '--rt-aside-width' | '--rt-data-table-scrollbar-color' | '--rt-data-table-scrollbar-horizontal-height' | '--rt-data-table-scrollbar-vertical-width' | '--rt-data-table-scrollbar-width' | '--rt-dialog-bg' | '--rt-dialog-border' | '--rt-dialog-content-max-height' | '--rt-dialog-content-padding' | '--rt-dialog-footer-border' | '--rt-dialog-footer-padding' | '--rt-dialog-header-border' | '--rt-dialog-header-padding' | '--rt-dialog-title-font-size' | '--rt-dialog-title-transform' | '--rt-dialog-title-weight' | '--rt-dialog-width' | '--rt-dynamic-selector-list-actions-gap' | '--rt-dynamic-selector-list-actions-offset' | '--rt-dynamic-selector-list-actions-padding-end' | '--rt-dynamic-selector-list-add-color' | '--rt-dynamic-selector-list-controls-divider-color' | '--rt-dynamic-selector-list-controls-divider-width' | '--rt-dynamic-selector-list-controls-gap' | '--rt-dynamic-selector-list-handle-padding-end' | '--rt-dynamic-selector-list-handle-padding-start' | '--rt-dynamic-selector-list-row-padding-end' | '--rt-dynamic-selector-list-title-gap' | '--rt-dynamic-selector-popup-bg' | '--rt-dynamic-selector-popup-border-width' | '--rt-dynamic-selector-popup-button-font-size' | '--rt-dynamic-selector-popup-button-height' | '--rt-dynamic-selector-popup-empty-gap' | '--rt-dynamic-selector-popup-empty-icon-size' | '--rt-dynamic-selector-popup-empty-icon-wrap-bg' | '--rt-dynamic-selector-popup-empty-text-color' | '--rt-dynamic-selector-popup-empty-text-size' | '--rt-dynamic-selector-popup-empty-text-weight' | '--rt-dynamic-selector-popup-foot-border-width' | '--rt-dynamic-selector-popup-foot-padding' | '--rt-dynamic-selector-popup-highlight-bg' | '--rt-dynamic-selector-popup-highlight-color' | '--rt-dynamic-selector-popup-highlight-radius' | '--rt-dynamic-selector-popup-highlight-weight' | '--rt-dynamic-selector-popup-max-height' | '--rt-dynamic-selector-popup-min-height' | '--rt-dynamic-selector-popup-nav-color' | '--rt-dynamic-selector-popup-option-line-height' | '--rt-dynamic-selector-popup-option-min-height' | '--rt-dynamic-selector-popup-padding' | '--rt-dynamic-selector-popup-radius' | '--rt-dynamic-selector-popup-shadow' | '--rt-dynamic-selector-popup-width' | '--rt-header-content-max-width' | '--rt-header-height' | '--rt-icon-button-bg' | '--rt-icon-button-bg-hover' | '--rt-icon-button-size' | '--rt-icon-color-danger' | '--rt-icon-color-disabled' | '--rt-icon-color-info' | '--rt-icon-color-inverse' | '--rt-icon-color-muted' | '--rt-icon-color-primary' | '--rt-icon-color-success' | '--rt-icon-color-warning' | '--rt-icon-glyph-font' | '--rt-icon-glyph-grade' | '--rt-icon-glyph-opsz' | '--rt-icon-glyph-weight' | '--rt-icon-step-2xl' | '--rt-icon-step-3xl' | '--rt-icon-step-4xl' | '--rt-icon-step-lg' | '--rt-icon-step-md' | '--rt-icon-step-sm' | '--rt-icon-step-xl' | '--rt-icon-step-xs' | '--rt-logo-tagline' | '--rt-logo-tagline-dark' | '--rt-logo-wordmark' | '--rt-logo-wordmark-dark' | '--rt-page-header-bg' | '--rt-table-actions-bg' | '--rt-tag-color-bg' | '--rt-tag-color-border' | '--rt-tag-color-text' | '--rt-tag-letter-spacing' | '--rt-tag-padding-block' | '--rt-tag-padding-inline' | '--rt-toast-action-color' | '--rt-toast-bg' | '--rt-toast-border-color' | '--rt-toast-close-color' | '--rt-toast-color' | '--rt-toast-filled-danger-bg' | '--rt-toast-filled-danger-border-color' | '--rt-toast-filled-danger-color' | '--rt-toast-filled-info-bg' | '--rt-toast-filled-info-border-color' | '--rt-toast-filled-info-color' | '--rt-toast-filled-success-bg' | '--rt-toast-filled-success-border-color' | '--rt-toast-filled-success-color' | '--rt-toast-filled-warning-bg' | '--rt-toast-filled-warning-border-color' | '--rt-toast-filled-warning-color' | '--rt-toast-icon-color' | '--rt-toast-progress-color' | '--rt-toast-progress-height' | '--rt-workspace-aside-size' | '--rt-workspace-list-size';
|
|
1029
1094
|
/** All the styling properties declared by the kit. */
|
|
1030
1095
|
declare const RT_DESIGN_TOKEN_NAMES: readonly TRtDesignTokenName[];
|
|
1031
1096
|
/** All the consumer's handles: the value comes from the application, until then the fallback works. */
|
|
@@ -1143,6 +1208,17 @@ declare function parseInline(source: string): IRtMarkdownInlineNode[];
|
|
|
1143
1208
|
*/
|
|
1144
1209
|
declare function parseMarkdown(source: string | null | undefined): IRtMarkdownBlockNode[];
|
|
1145
1210
|
|
|
1211
|
+
/**
|
|
1212
|
+
* Видимый текст разметки без её знаков: то, что `rt-markdown-text` показывает читателю.
|
|
1213
|
+
*
|
|
1214
|
+
* Строится по тому же дереву узлов, что рисует компонент, поэтому `##`, `**`, маркеры списков и
|
|
1215
|
+
* черта таблицы в вывод не попадают, а то, что разборщик оставил текстом, остаётся текстом.
|
|
1216
|
+
*
|
|
1217
|
+
* @param source Текст в разметке. Пустота и отсутствие значения дают пустую строку.
|
|
1218
|
+
* @returns Блоки через пустую строку, пункты списка и строки таблицы — построчно, ячейки — через табуляцию.
|
|
1219
|
+
*/
|
|
1220
|
+
declare function markdownToPlainText(source: string | null | undefined): string;
|
|
1221
|
+
|
|
1146
1222
|
/**
|
|
1147
1223
|
* Готовая начинка `<picture>`: источники по форматам и запасной кадр на `<img>`.
|
|
1148
1224
|
*
|
|
@@ -1258,5 +1334,5 @@ declare function themeScopeOfFocus(document: Document): string | null;
|
|
|
1258
1334
|
*/
|
|
1259
1335
|
declare function carryThemeScopeOfFocus(pane: HTMLElement, document: Document): void;
|
|
1260
1336
|
|
|
1261
|
-
export { BreakpointsService, ERtDataTableCellColor, ERtDataTableColumnType, ERtDataTableFilterType, ERtMarkdownBlock, ERtMarkdownInline, ERtStorageKeys, IButton, INotification, IRtDataTable, IRtIcon, IRtInput, IRtKitConfig, ITheme, MessageBus, NotificationBus, RT_CONSUMER_HANDLE_NAMES, RT_DATA_TABLE_PRESET_FROM_HOST, RT_DESIGN_TOKEN_NAMES, RT_KIT_CONFIG, RT_KIT_LABELS, RT_KIT_LABELS_EN, RT_KIT_LOCALE, RT_KIT_TRANSLATOR, RT_MATERIAL_PRESET_CLASS, RT_MATERIAL_PRESET_SELECTOR, RT_PRESET_MATERIAL_CLASS, RT_RADIUS_DEFAULT, RT_RADIUS_STEPS, RT_THEME_SCOPE_ATTRIBUTE, RtDayStampPipe, RtInfiniteScrollDirective, RtKitLabelPipe, RtThemeScopeDirective, SEARCH_DEBOUNCE_MS, ThemeService, breakNode, carryThemeScope, carryThemeScopeOfFocus, coerceQuillDeltaOutput, fileNameFromUrl, formatFileSize, iconsName, materialPresetClassesOf, materialPresetClassesOfFocus, normalizeQuillDelta, parseInline, parseMarkdown, provideRtKit, provideRtKitLabels, rtKitDefault, rtKitLabel, searchDebounce, themeScopeOf, themeScopeOfFocus };
|
|
1337
|
+
export { BreakpointsService, ERtDataTableCellColor, ERtDataTableColumnType, ERtDataTableFilterType, ERtMarkdownBlock, ERtMarkdownInline, ERtStorageKeys, IButton, INotification, IRtDataTable, IRtIcon, IRtInput, IRtKitConfig, ITheme, MessageBus, NotificationBus, RT_CONSUMER_HANDLE_NAMES, RT_DATA_TABLE_PRESET_FROM_HOST, RT_DESIGN_TOKEN_NAMES, RT_KIT_CONFIG, RT_KIT_LABELS, RT_KIT_LABELS_EN, RT_KIT_LOCALE, RT_KIT_TRANSLATOR, RT_MATERIAL_PRESET_CLASS, RT_MATERIAL_PRESET_SELECTOR, RT_PRESET_MATERIAL_CLASS, RT_RADIUS_DEFAULT, RT_RADIUS_STEPS, RT_THEME_SCOPE_ATTRIBUTE, RtDayStampPipe, RtInfiniteScrollDirective, RtKitLabelPipe, RtThemeScopeDirective, SEARCH_DEBOUNCE_MS, ThemeService, breakNode, carryThemeScope, carryThemeScopeOfFocus, coerceQuillDeltaOutput, fileNameFromUrl, formatFileSize, iconsName, markdownToPlainText, materialPresetClassesOf, materialPresetClassesOfFocus, normalizeQuillDelta, parseInline, parseMarkdown, provideRtKit, provideRtKitLabels, rtKitDefault, rtKitLabel, searchDebounce, themeScopeOf, themeScopeOfFocus };
|
|
1262
1338
|
export type { IMessageBusEvent, IQuillDelta, IQuillDeltaAttributes, IQuillDeltaOp, IRtMarkdownBlockNode, IRtMarkdownInlineNode, IRtMarkdownListItem, IRtPicture, IRtPictureSource, TRtConsumerHandleName, TRtDataTableFilters, TRtDesignTokenName, TRtKitLabelKey, TRtKitLabelMap, TRtKitLabelParams, TRtKitTranslator, TRtRadius };
|