@central-design-system/components 3.8.2 → 3.9.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/dist/cds.css +1 -1
- package/dist/cds.es.js +10680 -10334
- package/dist/cds.es.js.map +1 -1
- package/dist/cds.umd.js +5 -5
- package/dist/cds.umd.js.map +1 -1
- package/dist/components/CdsBadge/CdsBadge.d.ts +287 -9
- package/dist/components/CdsBreadcrumbs/CdsBreadcrumbsItem.d.ts +17 -2
- package/dist/components/CdsImage/CdsImage.d.ts +2 -2
- package/dist/components/CdsImage/components/CdsResponsive.d.ts +1 -1
- package/dist/components/CdsModal/CdsModal.d.ts +2 -2
- package/dist/composable/index.d.ts +1 -0
- package/dist/composable/useColor.d.ts +42 -0
- package/dist/utils/colorsUtils/utils.d.ts +3 -0
- package/dist/utils/dom/warn.d.ts +1 -0
- package/dist/utils/index.d.ts +1 -0
- package/package.json +1 -1
|
@@ -1,56 +1,334 @@
|
|
|
1
|
+
import { TCdsIconsName } from '@central-design-system/icons';
|
|
1
2
|
import { PropType } from 'vue';
|
|
2
3
|
export declare const componentName = "CdsBadge";
|
|
3
4
|
declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
|
|
5
|
+
invertColor: {
|
|
6
|
+
type: PropType<boolean>;
|
|
7
|
+
default: boolean;
|
|
8
|
+
};
|
|
9
|
+
/**
|
|
10
|
+
* @deprecated Используйте `content` вместо `count`
|
|
11
|
+
*/
|
|
12
|
+
count: {
|
|
13
|
+
type: PropType<number | string | undefined>;
|
|
14
|
+
default: undefined;
|
|
15
|
+
};
|
|
16
|
+
/**
|
|
17
|
+
* @deprecated Используйте `max` с значением лимита вместо `limited`
|
|
18
|
+
*/
|
|
19
|
+
limited: {
|
|
20
|
+
type: PropType<boolean>;
|
|
21
|
+
default: boolean;
|
|
22
|
+
};
|
|
4
23
|
theme: {
|
|
5
24
|
type: PropType<import('../../composable').TTheme | string>;
|
|
6
25
|
available: readonly ["cdsLight", "cdsDark", "b2bLight", "b2bDark", "promoLight", "promoDark"];
|
|
7
26
|
default: undefined;
|
|
8
27
|
};
|
|
28
|
+
color: {
|
|
29
|
+
type: PropType<string>;
|
|
30
|
+
default: undefined;
|
|
31
|
+
};
|
|
32
|
+
transition: {
|
|
33
|
+
type: PropType<string | boolean | (import('vue').TransitionProps & {
|
|
34
|
+
component?: import('vue').Component;
|
|
35
|
+
})>;
|
|
36
|
+
default: string;
|
|
37
|
+
validator: (value: unknown) => boolean;
|
|
38
|
+
};
|
|
39
|
+
height: {
|
|
40
|
+
type: PropType<number | string>;
|
|
41
|
+
default: string;
|
|
42
|
+
};
|
|
43
|
+
width: {
|
|
44
|
+
type: PropType<number | string>;
|
|
45
|
+
default: string;
|
|
46
|
+
};
|
|
47
|
+
maxHeight: {
|
|
48
|
+
type: PropType<number | string>;
|
|
49
|
+
default: string;
|
|
50
|
+
};
|
|
51
|
+
maxWidth: {
|
|
52
|
+
type: PropType<number | string>;
|
|
53
|
+
default: string;
|
|
54
|
+
};
|
|
55
|
+
minHeight: {
|
|
56
|
+
type: PropType<number | string>;
|
|
57
|
+
default: string;
|
|
58
|
+
};
|
|
59
|
+
minWidth: {
|
|
60
|
+
type: PropType<number | string>;
|
|
61
|
+
default: string;
|
|
62
|
+
};
|
|
63
|
+
tag: {
|
|
64
|
+
type: PropType<string>;
|
|
65
|
+
default: string;
|
|
66
|
+
description: string;
|
|
67
|
+
};
|
|
68
|
+
location: Omit<{
|
|
69
|
+
type: PropType<import('../../utils').TAnchor>;
|
|
70
|
+
default: string;
|
|
71
|
+
}, "default" | "type"> & {
|
|
72
|
+
type: PropType<NonNullable<import('../../utils').TAnchor>>;
|
|
73
|
+
default: NonNullable<import('../../utils').TAnchor>;
|
|
74
|
+
};
|
|
75
|
+
/**
|
|
76
|
+
* Текст, отображаемый в компоненте. Если указано свойство `dot`, то это свойство будет проигнорировано.
|
|
77
|
+
*/
|
|
78
|
+
content: {
|
|
79
|
+
type: PropType<number | string>;
|
|
80
|
+
default: undefined;
|
|
81
|
+
};
|
|
82
|
+
/**
|
|
83
|
+
* Иконка, отображаемая в компоненте. Если указано свойство `dot`, то это свойство будет проигнорировано.
|
|
84
|
+
*/
|
|
85
|
+
icon: {
|
|
86
|
+
type: PropType<TCdsIconsName>;
|
|
87
|
+
default: undefined;
|
|
88
|
+
validator: (value: TCdsIconsName) => boolean;
|
|
89
|
+
};
|
|
90
|
+
/**
|
|
91
|
+
* Уменьшает размер и скрывает содержимое, отображая компонент в виде точки
|
|
92
|
+
*/
|
|
93
|
+
dot: {
|
|
94
|
+
type: PropType<boolean>;
|
|
95
|
+
default: undefined;
|
|
96
|
+
};
|
|
97
|
+
/**
|
|
98
|
+
* Размер точки
|
|
99
|
+
*/
|
|
100
|
+
dotSize: {
|
|
101
|
+
type: PropType<number | string>;
|
|
102
|
+
default: undefined;
|
|
103
|
+
};
|
|
104
|
+
/**
|
|
105
|
+
* Отображать как inline блок вместо абсолютного позиционирования. Свойства location, floating и offset будут проигнорированы.
|
|
106
|
+
* @deprecated Значение по умолчанию `true` установлено для обратной совместимости. В v4.0.0 значение по умолчанию изменится на `undefined`. Укажите значение явно.
|
|
107
|
+
*/
|
|
108
|
+
inline: {
|
|
109
|
+
type: PropType<boolean>;
|
|
110
|
+
default: boolean;
|
|
111
|
+
};
|
|
112
|
+
/**
|
|
113
|
+
* Переносит компонент дальше от контента. Это соответствует смещению на 8 пикселей.
|
|
114
|
+
*/
|
|
115
|
+
floating: {
|
|
116
|
+
type: PropType<boolean>;
|
|
117
|
+
default: undefined;
|
|
118
|
+
};
|
|
119
|
+
/**
|
|
120
|
+
* Устанавливает максимальное допустимое значение при использовании атрибута content со значением в виде числа.
|
|
121
|
+
* Если число в поле content превышает максимальное значение, к нему добавляется суффикс «+».
|
|
122
|
+
*/
|
|
123
|
+
max: {
|
|
124
|
+
type: PropType<number | string>;
|
|
125
|
+
default: undefined;
|
|
126
|
+
};
|
|
127
|
+
/**
|
|
128
|
+
* Цвет текста бейджа
|
|
129
|
+
*/
|
|
130
|
+
textColor: {
|
|
131
|
+
type: PropType<string>;
|
|
132
|
+
default: undefined;
|
|
133
|
+
};
|
|
134
|
+
/**
|
|
135
|
+
* Сместить по оси X
|
|
136
|
+
*/
|
|
137
|
+
offsetX: {
|
|
138
|
+
type: PropType<number | string>;
|
|
139
|
+
default: undefined;
|
|
140
|
+
};
|
|
141
|
+
/**
|
|
142
|
+
* Сместить по оси Y
|
|
143
|
+
*/
|
|
144
|
+
offsetY: {
|
|
145
|
+
type: PropType<number | string>;
|
|
146
|
+
default: undefined;
|
|
147
|
+
};
|
|
148
|
+
/**
|
|
149
|
+
* Определяет, отображается ли компонент или скрыт.
|
|
150
|
+
*/
|
|
151
|
+
modelValue: {
|
|
152
|
+
type: PropType<boolean>;
|
|
153
|
+
default: boolean;
|
|
154
|
+
};
|
|
155
|
+
}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
|
|
9
156
|
invertColor: {
|
|
10
157
|
type: PropType<boolean>;
|
|
11
158
|
default: boolean;
|
|
12
159
|
};
|
|
13
160
|
/**
|
|
14
|
-
*
|
|
161
|
+
* @deprecated Используйте `content` вместо `count`
|
|
15
162
|
*/
|
|
16
163
|
count: {
|
|
17
164
|
type: PropType<number | string | undefined>;
|
|
18
165
|
default: undefined;
|
|
19
166
|
};
|
|
20
167
|
/**
|
|
21
|
-
*
|
|
168
|
+
* @deprecated Используйте `max` с значением лимита вместо `limited`
|
|
22
169
|
*/
|
|
23
170
|
limited: {
|
|
24
171
|
type: PropType<boolean>;
|
|
25
172
|
default: boolean;
|
|
26
173
|
};
|
|
27
|
-
}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
|
|
28
174
|
theme: {
|
|
29
175
|
type: PropType<import('../../composable').TTheme | string>;
|
|
30
176
|
available: readonly ["cdsLight", "cdsDark", "b2bLight", "b2bDark", "promoLight", "promoDark"];
|
|
31
177
|
default: undefined;
|
|
32
178
|
};
|
|
33
|
-
|
|
179
|
+
color: {
|
|
180
|
+
type: PropType<string>;
|
|
181
|
+
default: undefined;
|
|
182
|
+
};
|
|
183
|
+
transition: {
|
|
184
|
+
type: PropType<string | boolean | (import('vue').TransitionProps & {
|
|
185
|
+
component?: import('vue').Component;
|
|
186
|
+
})>;
|
|
187
|
+
default: string;
|
|
188
|
+
validator: (value: unknown) => boolean;
|
|
189
|
+
};
|
|
190
|
+
height: {
|
|
191
|
+
type: PropType<number | string>;
|
|
192
|
+
default: string;
|
|
193
|
+
};
|
|
194
|
+
width: {
|
|
195
|
+
type: PropType<number | string>;
|
|
196
|
+
default: string;
|
|
197
|
+
};
|
|
198
|
+
maxHeight: {
|
|
199
|
+
type: PropType<number | string>;
|
|
200
|
+
default: string;
|
|
201
|
+
};
|
|
202
|
+
maxWidth: {
|
|
203
|
+
type: PropType<number | string>;
|
|
204
|
+
default: string;
|
|
205
|
+
};
|
|
206
|
+
minHeight: {
|
|
207
|
+
type: PropType<number | string>;
|
|
208
|
+
default: string;
|
|
209
|
+
};
|
|
210
|
+
minWidth: {
|
|
211
|
+
type: PropType<number | string>;
|
|
212
|
+
default: string;
|
|
213
|
+
};
|
|
214
|
+
tag: {
|
|
215
|
+
type: PropType<string>;
|
|
216
|
+
default: string;
|
|
217
|
+
description: string;
|
|
218
|
+
};
|
|
219
|
+
location: Omit<{
|
|
220
|
+
type: PropType<import('../../utils').TAnchor>;
|
|
221
|
+
default: string;
|
|
222
|
+
}, "default" | "type"> & {
|
|
223
|
+
type: PropType<NonNullable<import('../../utils').TAnchor>>;
|
|
224
|
+
default: NonNullable<import('../../utils').TAnchor>;
|
|
225
|
+
};
|
|
226
|
+
/**
|
|
227
|
+
* Текст, отображаемый в компоненте. Если указано свойство `dot`, то это свойство будет проигнорировано.
|
|
228
|
+
*/
|
|
229
|
+
content: {
|
|
230
|
+
type: PropType<number | string>;
|
|
231
|
+
default: undefined;
|
|
232
|
+
};
|
|
233
|
+
/**
|
|
234
|
+
* Иконка, отображаемая в компоненте. Если указано свойство `dot`, то это свойство будет проигнорировано.
|
|
235
|
+
*/
|
|
236
|
+
icon: {
|
|
237
|
+
type: PropType<TCdsIconsName>;
|
|
238
|
+
default: undefined;
|
|
239
|
+
validator: (value: TCdsIconsName) => boolean;
|
|
240
|
+
};
|
|
241
|
+
/**
|
|
242
|
+
* Уменьшает размер и скрывает содержимое, отображая компонент в виде точки
|
|
243
|
+
*/
|
|
244
|
+
dot: {
|
|
245
|
+
type: PropType<boolean>;
|
|
246
|
+
default: undefined;
|
|
247
|
+
};
|
|
248
|
+
/**
|
|
249
|
+
* Размер точки
|
|
250
|
+
*/
|
|
251
|
+
dotSize: {
|
|
252
|
+
type: PropType<number | string>;
|
|
253
|
+
default: undefined;
|
|
254
|
+
};
|
|
255
|
+
/**
|
|
256
|
+
* Отображать как inline блок вместо абсолютного позиционирования. Свойства location, floating и offset будут проигнорированы.
|
|
257
|
+
* @deprecated Значение по умолчанию `true` установлено для обратной совместимости. В v4.0.0 значение по умолчанию изменится на `undefined`. Укажите значение явно.
|
|
258
|
+
*/
|
|
259
|
+
inline: {
|
|
34
260
|
type: PropType<boolean>;
|
|
35
261
|
default: boolean;
|
|
36
262
|
};
|
|
37
263
|
/**
|
|
38
|
-
*
|
|
264
|
+
* Переносит компонент дальше от контента. Это соответствует смещению на 8 пикселей.
|
|
39
265
|
*/
|
|
40
|
-
|
|
41
|
-
type: PropType<
|
|
266
|
+
floating: {
|
|
267
|
+
type: PropType<boolean>;
|
|
42
268
|
default: undefined;
|
|
43
269
|
};
|
|
44
270
|
/**
|
|
45
|
-
*
|
|
271
|
+
* Устанавливает максимальное допустимое значение при использовании атрибута content со значением в виде числа.
|
|
272
|
+
* Если число в поле content превышает максимальное значение, к нему добавляется суффикс «+».
|
|
46
273
|
*/
|
|
47
|
-
|
|
274
|
+
max: {
|
|
275
|
+
type: PropType<number | string>;
|
|
276
|
+
default: undefined;
|
|
277
|
+
};
|
|
278
|
+
/**
|
|
279
|
+
* Цвет текста бейджа
|
|
280
|
+
*/
|
|
281
|
+
textColor: {
|
|
282
|
+
type: PropType<string>;
|
|
283
|
+
default: undefined;
|
|
284
|
+
};
|
|
285
|
+
/**
|
|
286
|
+
* Сместить по оси X
|
|
287
|
+
*/
|
|
288
|
+
offsetX: {
|
|
289
|
+
type: PropType<number | string>;
|
|
290
|
+
default: undefined;
|
|
291
|
+
};
|
|
292
|
+
/**
|
|
293
|
+
* Сместить по оси Y
|
|
294
|
+
*/
|
|
295
|
+
offsetY: {
|
|
296
|
+
type: PropType<number | string>;
|
|
297
|
+
default: undefined;
|
|
298
|
+
};
|
|
299
|
+
/**
|
|
300
|
+
* Определяет, отображается ли компонент или скрыт.
|
|
301
|
+
*/
|
|
302
|
+
modelValue: {
|
|
48
303
|
type: PropType<boolean>;
|
|
49
304
|
default: boolean;
|
|
50
305
|
};
|
|
51
306
|
}>> & Readonly<{}>, {
|
|
307
|
+
tag: string;
|
|
308
|
+
location: NonNullable<import('../../utils').TAnchor>;
|
|
309
|
+
icon: "link" | "search" | "bold" | "delete" | "add" | "administrator" | "ai" | "alert-fill" | "alert" | "analog" | "arrow-down" | "arrow-left-bottom" | "arrow-left-top" | "arrow-left" | "arrow-right-bottom" | "arrow-right-top" | "arrow-right" | "arrow-up" | "arrows-vertical" | "bookmark-fill" | "bookmark" | "calendar" | "card-bank" | "category" | "check-fill" | "check" | "checkbox-fill" | "checkbox" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "chocholate-menu" | "chocolate-menu" | "clock-fill" | "clock" | "collapse" | "comment" | "company" | "compare" | "copy" | "data-cards" | "directory-open" | "directory" | "doc-download" | "doc" | "download" | "draggable" | "edit" | "education" | "enter" | "error-fill" | "error" | "expand" | "external" | "facebook-fill" | "facebook" | "fill" | "filters" | "flag" | "format" | "formula" | "funnel" | "globe" | "highlight" | "infinity" | "info-fill" | "info" | "insert" | "italic" | "list-search" | "list" | "loader" | "location" | "locked" | "login" | "logout" | "menu" | "minus" | "notification" | "overflow-menu-horizontal" | "overflow-menu-vertical" | "password" | "pin" | "plus" | "printer" | "question-fill" | "question" | "refresh" | "remove" | "sandglass" | "save" | "scale-left" | "scale-right" | "settings" | "shopping-cart" | "sort-date" | "sorting-down" | "sorting-up" | "sorting" | "source" | "star-fill" | "star" | "tab-backward" | "tab-forward" | "telegram" | "thumb-down-fill" | "thumb-down" | "thumb-up-fill" | "thumb-up" | "timer" | "tool" | "truck" | "underline" | "unlocked-left" | "unlocked" | "upload" | "user-avatar" | "user-group" | "visibility-off" | "visibility-on" | "vk" | "whatsapp" | "winner" | "workspace" | "youtube";
|
|
52
310
|
invertColor: boolean;
|
|
311
|
+
color: string;
|
|
312
|
+
modelValue: boolean;
|
|
313
|
+
transition: string | boolean | (import('vue').TransitionProps & {
|
|
314
|
+
component?: import('vue').Component;
|
|
315
|
+
});
|
|
316
|
+
height: string | number;
|
|
317
|
+
width: string | number;
|
|
318
|
+
maxHeight: string | number;
|
|
319
|
+
maxWidth: string | number;
|
|
320
|
+
minHeight: string | number;
|
|
321
|
+
minWidth: string | number;
|
|
53
322
|
theme: string;
|
|
323
|
+
max: string | number;
|
|
324
|
+
content: string | number;
|
|
325
|
+
dot: boolean;
|
|
326
|
+
dotSize: string | number;
|
|
327
|
+
inline: boolean;
|
|
328
|
+
floating: boolean;
|
|
329
|
+
textColor: string;
|
|
330
|
+
offsetX: string | number;
|
|
331
|
+
offsetY: string | number;
|
|
54
332
|
count: string | number | undefined;
|
|
55
333
|
limited: boolean;
|
|
56
334
|
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
|
|
@@ -19,12 +19,19 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
19
19
|
default: undefined;
|
|
20
20
|
};
|
|
21
21
|
/**
|
|
22
|
-
* Является ли элемент текущей страницей
|
|
22
|
+
* @deprecated Является ли элемент текущей страницей
|
|
23
23
|
*/
|
|
24
24
|
currentPage: {
|
|
25
25
|
type: PropType<boolean>;
|
|
26
26
|
default: boolean;
|
|
27
27
|
};
|
|
28
|
+
/**
|
|
29
|
+
* Неактивная страница
|
|
30
|
+
*/
|
|
31
|
+
disabled: {
|
|
32
|
+
type: PropType<boolean>;
|
|
33
|
+
default: undefined;
|
|
34
|
+
};
|
|
28
35
|
}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
|
|
29
36
|
theme: {
|
|
30
37
|
type: PropType<import('../../composable').TTheme | string>;
|
|
@@ -44,16 +51,24 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
44
51
|
default: undefined;
|
|
45
52
|
};
|
|
46
53
|
/**
|
|
47
|
-
* Является ли элемент текущей страницей
|
|
54
|
+
* @deprecated Является ли элемент текущей страницей
|
|
48
55
|
*/
|
|
49
56
|
currentPage: {
|
|
50
57
|
type: PropType<boolean>;
|
|
51
58
|
default: boolean;
|
|
52
59
|
};
|
|
60
|
+
/**
|
|
61
|
+
* Неактивная страница
|
|
62
|
+
*/
|
|
63
|
+
disabled: {
|
|
64
|
+
type: PropType<boolean>;
|
|
65
|
+
default: undefined;
|
|
66
|
+
};
|
|
53
67
|
}>> & Readonly<{}>, {
|
|
54
68
|
text: string | number;
|
|
55
69
|
to: import('vue-router').RouteLocationRaw;
|
|
56
70
|
href: string;
|
|
71
|
+
disabled: boolean;
|
|
57
72
|
theme: string;
|
|
58
73
|
currentPage: boolean;
|
|
59
74
|
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
|
|
@@ -259,18 +259,18 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
259
259
|
absolute: boolean;
|
|
260
260
|
position: string;
|
|
261
261
|
options: IntersectionObserverInit;
|
|
262
|
+
inline: boolean;
|
|
263
|
+
cover: boolean;
|
|
262
264
|
src: string | ISrcObject;
|
|
263
265
|
srcset: string;
|
|
264
266
|
lazySrc: string;
|
|
265
267
|
sizes: string;
|
|
266
268
|
crossorigin: "" | "anonymous" | "use-credentials";
|
|
267
269
|
referrerpolicy: "origin" | "no-referrer" | "no-referrer-when-downgrade" | "origin-when-cross-origin" | "same-origin" | "strict-origin" | "strict-origin-when-cross-origin" | "unsafe-url";
|
|
268
|
-
cover: boolean;
|
|
269
270
|
alt: string;
|
|
270
271
|
gradient: string;
|
|
271
272
|
aspectRatio: string | number;
|
|
272
273
|
contentClass: string;
|
|
273
|
-
inline: boolean;
|
|
274
274
|
}, {}, {}, {
|
|
275
275
|
Intersect: {
|
|
276
276
|
mounted: (el: HTMLElement, binding: import('../../directives/intersect').ObserverDirectiveBinding) => void;
|
|
@@ -80,8 +80,8 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
80
80
|
maxWidth: string | number;
|
|
81
81
|
minHeight: string | number;
|
|
82
82
|
minWidth: string | number;
|
|
83
|
+
inline: boolean;
|
|
83
84
|
aspectRatio: string | number;
|
|
84
85
|
contentClass: string;
|
|
85
|
-
inline: boolean;
|
|
86
86
|
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
|
|
87
87
|
export default _default;
|
|
@@ -202,7 +202,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
202
202
|
default: boolean;
|
|
203
203
|
};
|
|
204
204
|
/**
|
|
205
|
-
*
|
|
205
|
+
* @deprecated Показывать кнопку закрытия модального окна (или слот dismissBtn)
|
|
206
206
|
*/
|
|
207
207
|
dismissBtn: {
|
|
208
208
|
type: PropType<boolean>;
|
|
@@ -416,7 +416,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
416
416
|
default: boolean;
|
|
417
417
|
};
|
|
418
418
|
/**
|
|
419
|
-
*
|
|
419
|
+
* @deprecated Показывать кнопку закрытия модального окна (или слот dismissBtn)
|
|
420
420
|
*/
|
|
421
421
|
dismissBtn: {
|
|
422
422
|
type: PropType<boolean>;
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { CSSProperties, PropType, Ref } from 'vue';
|
|
2
|
+
import { MaybeRefOrGetter } from '../utils';
|
|
3
|
+
export type ColorValue = string | false | null | undefined;
|
|
4
|
+
export type ColorAliasType = 'surface' | 'fill' | 'content';
|
|
5
|
+
export type ColorAlias = typeof availableColorAliases[number];
|
|
6
|
+
export declare const availableColorAliases: readonly ["neutral", "red", "green", "chocolate", "lemon", "lime", "cyan", "teal", "indigo", "purple", "pink"];
|
|
7
|
+
export declare const colorAliases: Record<ColorAlias, Record<ColorAliasType, string>>;
|
|
8
|
+
export interface TextColorData {
|
|
9
|
+
textColorClasses: Ref<string[]>;
|
|
10
|
+
textColorStyles: Ref<CSSProperties>;
|
|
11
|
+
}
|
|
12
|
+
export interface BackgroundColorData {
|
|
13
|
+
backgroundColorClasses: Ref<string[]>;
|
|
14
|
+
backgroundColorStyles: Ref<CSSProperties>;
|
|
15
|
+
}
|
|
16
|
+
export declare const makeModernColorProps: <Defaults extends {
|
|
17
|
+
color?: unknown;
|
|
18
|
+
} = {}>(defaults?: Defaults | undefined) => import('../utils').AppendDefault<{
|
|
19
|
+
/**
|
|
20
|
+
* Цвет компонента
|
|
21
|
+
*/
|
|
22
|
+
color: {
|
|
23
|
+
type: PropType<string>;
|
|
24
|
+
default: undefined;
|
|
25
|
+
};
|
|
26
|
+
}, Defaults>;
|
|
27
|
+
export declare function useModernColor(colors: MaybeRefOrGetter<{
|
|
28
|
+
background?: ColorValue;
|
|
29
|
+
text?: ColorValue;
|
|
30
|
+
}>, aliasPath?: ColorAliasType): import('vue').ToRefs<{
|
|
31
|
+
colorClasses: string[];
|
|
32
|
+
colorStyles: CSSProperties;
|
|
33
|
+
}>;
|
|
34
|
+
export declare function useTextColor(color: MaybeRefOrGetter<ColorValue>, aliasPath?: ColorAliasType): TextColorData;
|
|
35
|
+
export declare function useBackgroundColor(color: MaybeRefOrGetter<ColorValue>, aliasPath?: ColorAliasType): BackgroundColorData;
|
|
36
|
+
export declare function computeColor(colors: MaybeRefOrGetter<{
|
|
37
|
+
background?: ColorValue;
|
|
38
|
+
text?: ColorValue;
|
|
39
|
+
}>, aliasPath: ColorAliasType): {
|
|
40
|
+
class: string[];
|
|
41
|
+
style: CSSProperties;
|
|
42
|
+
};
|
|
@@ -23,6 +23,7 @@ export type Hex = string & {
|
|
|
23
23
|
};
|
|
24
24
|
export type Color = string | number | HSV | RGB | HSL;
|
|
25
25
|
export declare function isCssColor(color?: string | null | false): boolean;
|
|
26
|
+
export declare function isParsableColor(color: string): boolean;
|
|
26
27
|
export declare function parseColor(color: Color): RGB;
|
|
27
28
|
export declare function lighten(value: RGB, amount: number): RGB;
|
|
28
29
|
export declare function darken(value: RGB, amount: number): RGB;
|
|
@@ -40,3 +41,5 @@ export declare function HSLtoRGB(hsla: HSL): RGB;
|
|
|
40
41
|
export declare function getLuma(color: Color): number;
|
|
41
42
|
export declare function getForeground(color: Color): "#fff" | "#000";
|
|
42
43
|
export declare function rgbToColorString(color: RGB): string;
|
|
44
|
+
export declare function hasLightForeground(color: Color): boolean;
|
|
45
|
+
export declare function resolveColorPrimitive(color: string): string | undefined;
|
package/dist/utils/dom/warn.d.ts
CHANGED
package/dist/utils/index.d.ts
CHANGED
|
@@ -8,6 +8,7 @@ export * from './use/cache';
|
|
|
8
8
|
export * from './use/copyToClipboard';
|
|
9
9
|
export * from './use/flattenChildren';
|
|
10
10
|
export * from './use/listener';
|
|
11
|
+
export * from './use/toValue';
|
|
11
12
|
export * from './changeCase/noCase';
|
|
12
13
|
export * from './changeCase/lowerCase';
|
|
13
14
|
export * from './changeCase/pascalCase';
|