@rescui/tag 0.16.2 → 0.16.3
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/lib/_virtual/index.css.js +12 -12
- package/lib/index.css +79 -79
- package/lib/parts/base-tag.p.module.css.js +1 -1
- package/lib/parts/removable-tag.p.module.css.js +1 -1
- package/lib/parts/sticky-tag.p.module.css.js +1 -1
- package/lib/parts/tag.p.module.css.js +1 -1
- package/llm/components/tag.md +25 -25
- package/package.json +3 -3
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
var styles = {
|
|
2
|
-
"icon": "
|
|
3
|
-
"sizeXS": "
|
|
4
|
-
"sizeS": "
|
|
5
|
-
"sizeM": "
|
|
6
|
-
"sizeL": "
|
|
7
|
-
"light": "
|
|
8
|
-
"dark": "
|
|
9
|
-
"allVariants": "
|
|
10
|
-
"variant16": "
|
|
11
|
-
"variant20": "
|
|
12
|
-
"variant24": "
|
|
13
|
-
"variant28": "
|
|
2
|
+
"icon": "_icon_8et0sh_4",
|
|
3
|
+
"sizeXS": "_sizeXS_8et0sh_14",
|
|
4
|
+
"sizeS": "_sizeS_8et0sh_18",
|
|
5
|
+
"sizeM": "_sizeM_8et0sh_22",
|
|
6
|
+
"sizeL": "_sizeL_8et0sh_26",
|
|
7
|
+
"light": "_light_8et0sh_30",
|
|
8
|
+
"dark": "_dark_8et0sh_34",
|
|
9
|
+
"allVariants": "_allVariants_8et0sh_48",
|
|
10
|
+
"variant16": "_variant16_8et0sh_53",
|
|
11
|
+
"variant20": "_variant20_8et0sh_54",
|
|
12
|
+
"variant24": "_variant24_8et0sh_55",
|
|
13
|
+
"variant28": "_variant28_8et0sh_58"
|
|
14
14
|
};
|
|
15
15
|
|
|
16
16
|
export { styles as default };
|
package/lib/index.css
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
inherits:true;
|
|
4
4
|
initial-value:0;
|
|
5
5
|
}
|
|
6
|
-
.
|
|
6
|
+
._icon_8et0sh_4{
|
|
7
7
|
--_rs-theme-dark:var(
|
|
8
8
|
--_rs-internal-force-theme-dark-consult-rescui-before-using,
|
|
9
9
|
var(--rs-theme-dark, 0)
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
--_rs-theme-light-coefficient:calc(1 - var(--_rs-theme-dark-coefficient));
|
|
14
14
|
}
|
|
15
15
|
@supports (color: color-mix(in srgb, #fff 50%, #000 50%)){
|
|
16
|
-
.
|
|
16
|
+
._icon_8et0sh_4{
|
|
17
17
|
--_rs-color-primary:color-mix(in srgb, var(--rs-color-primary-light-theme, #6B57FF) calc(100% * var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-dark-theme, #8473FF) calc(100% * var(--_rs-theme-dark-coefficient, 0)));
|
|
18
18
|
--_rs-color-primary-dim:color-mix(in srgb, var(--rs-color-primary-dim-light-theme, #8979ff) calc(100% * var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-dim-dark-theme, #6f61d2) calc(100% * var(--_rs-theme-dark-coefficient, 0)));
|
|
19
19
|
--_rs-color-primary-fog:color-mix(in srgb, var(--rs-color-primary-fog-light-theme, #e1ddff) calc(100% * var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-fog-dark-theme, #2e2b49) calc(100% * var(--_rs-theme-dark-coefficient, 0)));
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
}
|
|
23
23
|
}
|
|
24
24
|
@supports not (color: color-mix(in srgb, #fff 50%, #000 50%)){
|
|
25
|
-
.
|
|
25
|
+
._icon_8et0sh_4{
|
|
26
26
|
--_rs-color-primary:rgb(calc(107 * var(--_rs-theme-light-coefficient, 1) + 132 * var(--_rs-theme-dark-coefficient, 0)), calc(87 * var(--_rs-theme-light-coefficient, 1) + 115 * var(--_rs-theme-dark-coefficient, 0)), 255);
|
|
27
27
|
--_rs-color-primary-dim:rgb(calc(137 * var(--_rs-theme-light-coefficient, 1) + 111 * var(--_rs-theme-dark-coefficient, 0)), calc(121 * var(--_rs-theme-light-coefficient, 1) + 97 * var(--_rs-theme-dark-coefficient, 0)), calc(255 * var(--_rs-theme-light-coefficient, 1) + 210 * var(--_rs-theme-dark-coefficient, 0)));
|
|
28
28
|
--_rs-color-primary-fog:rgb(calc(225 * var(--_rs-theme-light-coefficient, 1) + 46 * var(--_rs-theme-dark-coefficient, 0)), calc(221 * var(--_rs-theme-light-coefficient, 1) + 43 * var(--_rs-theme-dark-coefficient, 0)), calc(255 * var(--_rs-theme-light-coefficient, 1) + 73 * var(--_rs-theme-dark-coefficient, 0)));
|
|
@@ -30,7 +30,7 @@
|
|
|
30
30
|
--_rs-color-primary-t-fog:rgba(calc(107 * var(--_rs-theme-light-coefficient, 1) + 132 * var(--_rs-theme-dark-coefficient, 0)), calc(87 * var(--_rs-theme-light-coefficient, 1) + 115 * var(--_rs-theme-dark-coefficient, 0)), 255, calc(.2 * var(--_rs-theme-light-coefficient, 1) + .3 * var(--_rs-theme-dark-coefficient, 0)));
|
|
31
31
|
}
|
|
32
32
|
}
|
|
33
|
-
.
|
|
33
|
+
._icon_8et0sh_4{
|
|
34
34
|
|
|
35
35
|
fill:var(--_rs-icons-themed-fill-or-initial, currentcolor);
|
|
36
36
|
|
|
@@ -38,27 +38,27 @@
|
|
|
38
38
|
height:var(--rs-icons-height, var(--_rs-icons-height));
|
|
39
39
|
}
|
|
40
40
|
|
|
41
|
-
.
|
|
41
|
+
._sizeXS_8et0sh_14{
|
|
42
42
|
--_rs-icons-height:16px;
|
|
43
43
|
}
|
|
44
44
|
|
|
45
|
-
.
|
|
45
|
+
._sizeS_8et0sh_18{
|
|
46
46
|
--_rs-icons-height:20px;
|
|
47
47
|
}
|
|
48
48
|
|
|
49
|
-
.
|
|
49
|
+
._sizeM_8et0sh_22{
|
|
50
50
|
--_rs-icons-height:24px;
|
|
51
51
|
}
|
|
52
52
|
|
|
53
|
-
.
|
|
53
|
+
._sizeL_8et0sh_26{
|
|
54
54
|
--_rs-icons-height:28px;
|
|
55
55
|
}
|
|
56
56
|
|
|
57
|
-
.
|
|
57
|
+
._light_8et0sh_30{
|
|
58
58
|
--rs-theme-dark:0;
|
|
59
59
|
--_rs-icons-themed-fill-or-initial:rgb(calc(25 + 230 * var(--_rs-theme-dark-coefficient, 0)), calc(25 + 230 * var(--_rs-theme-dark-coefficient, 0)), calc(28 + 227 * var(--_rs-theme-dark-coefficient, 0)));
|
|
60
60
|
}
|
|
61
|
-
.
|
|
61
|
+
._dark_8et0sh_34{
|
|
62
62
|
--rs-theme-dark:1;
|
|
63
63
|
--_rs-icons-themed-fill-or-initial:rgb(calc(25 + 230 * var(--_rs-theme-dark-coefficient, 0)), calc(25 + 230 * var(--_rs-theme-dark-coefficient, 0)), calc(28 + 227 * var(--_rs-theme-dark-coefficient, 0)));
|
|
64
64
|
}
|
|
@@ -72,40 +72,40 @@
|
|
|
72
72
|
}
|
|
73
73
|
}
|
|
74
74
|
|
|
75
|
-
.
|
|
75
|
+
._allVariants_8et0sh_48{
|
|
76
76
|
aspect-ratio:var(--rs-icon-ar-width, 1) / var(--rs-icon-ar-height, 1);
|
|
77
77
|
container:rs-icon / size;
|
|
78
78
|
}
|
|
79
79
|
|
|
80
|
-
.
|
|
81
|
-
.
|
|
82
|
-
.
|
|
80
|
+
._variant16_8et0sh_53,
|
|
81
|
+
._variant20_8et0sh_54,
|
|
82
|
+
._variant24_8et0sh_55{
|
|
83
83
|
display:none;
|
|
84
84
|
}
|
|
85
|
-
.
|
|
85
|
+
._variant28_8et0sh_58{
|
|
86
86
|
display:block;
|
|
87
87
|
}
|
|
88
88
|
@container rs-icon (max-height: 24px){
|
|
89
|
-
.
|
|
89
|
+
._variant24_8et0sh_55{
|
|
90
90
|
display:block;
|
|
91
91
|
}
|
|
92
|
-
.
|
|
92
|
+
._variant28_8et0sh_58{
|
|
93
93
|
display:none;
|
|
94
94
|
}
|
|
95
95
|
}
|
|
96
96
|
@container rs-icon (max-height: 20px){
|
|
97
|
-
.
|
|
97
|
+
._variant20_8et0sh_54{
|
|
98
98
|
display:block;
|
|
99
99
|
}
|
|
100
|
-
.
|
|
100
|
+
._variant24_8et0sh_55{
|
|
101
101
|
display:none;
|
|
102
102
|
}
|
|
103
103
|
}
|
|
104
104
|
@container rs-icon (max-height: 16px){
|
|
105
|
-
.
|
|
105
|
+
._variant16_8et0sh_53{
|
|
106
106
|
display:block;
|
|
107
107
|
}
|
|
108
|
-
.
|
|
108
|
+
._variant20_8et0sh_54{
|
|
109
109
|
display:none;
|
|
110
110
|
}
|
|
111
111
|
}
|
|
@@ -115,21 +115,21 @@
|
|
|
115
115
|
inherits:true;
|
|
116
116
|
initial-value:0;
|
|
117
117
|
}
|
|
118
|
-
.
|
|
118
|
+
._alignIconLeft_mh6av7_7{
|
|
119
119
|
--_rs-tag-flex-direction:row;
|
|
120
120
|
}
|
|
121
|
-
.
|
|
121
|
+
._alignIconRight_mh6av7_10{
|
|
122
122
|
--_rs-tag-flex-direction:row-reverse;
|
|
123
123
|
}
|
|
124
124
|
|
|
125
|
-
.
|
|
125
|
+
._uppercase_mh6av7_14{
|
|
126
126
|
--_rs-tag-text-transform:uppercase;
|
|
127
127
|
--_rs-tag-horizontal-padding-or-initial:var(
|
|
128
128
|
--_rs-tag-uppercase-horizontal-padding
|
|
129
129
|
);
|
|
130
130
|
}
|
|
131
131
|
|
|
132
|
-
.
|
|
132
|
+
._sizeXs_mh6av7_18{
|
|
133
133
|
--_rs-tag-vertical-padding:2px;
|
|
134
134
|
--_rs-tag-base-horizontal-padding:8px;
|
|
135
135
|
--_rs-tag-uppercase-horizontal-padding:var(
|
|
@@ -171,7 +171,7 @@
|
|
|
171
171
|
--_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
|
|
172
172
|
--_rs-typography-link-border-bottom-width-from-text:1px;
|
|
173
173
|
}
|
|
174
|
-
.
|
|
174
|
+
._sizeS_mh6av7_21{
|
|
175
175
|
--_rs-tag-vertical-padding:4px;
|
|
176
176
|
--_rs-tag-base-horizontal-padding:8px;
|
|
177
177
|
--_rs-tag-uppercase-horizontal-padding:10px;
|
|
@@ -211,7 +211,7 @@
|
|
|
211
211
|
--_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
|
|
212
212
|
--_rs-typography-link-border-bottom-width-from-text:1px;
|
|
213
213
|
}
|
|
214
|
-
.
|
|
214
|
+
._sizeM_mh6av7_24{
|
|
215
215
|
--_rs-tag-vertical-padding:6px;
|
|
216
216
|
--_rs-tag-base-horizontal-padding:12px;
|
|
217
217
|
--_rs-tag-uppercase-horizontal-padding:var(
|
|
@@ -257,11 +257,11 @@
|
|
|
257
257
|
--_rs-typography-link-border-bottom-width-from-text:1px;
|
|
258
258
|
}
|
|
259
259
|
@media screen and (max-width: 640px){
|
|
260
|
-
.
|
|
260
|
+
._sizeM_mh6av7_24{
|
|
261
261
|
--_rs-typography-text-2-sm-list-li-margin-top-from-text:12px;
|
|
262
262
|
}
|
|
263
263
|
}
|
|
264
|
-
.
|
|
264
|
+
._sizeL_mh6av7_27{
|
|
265
265
|
--_rs-tag-vertical-padding:8px;
|
|
266
266
|
--_rs-tag-base-horizontal-padding:16px;
|
|
267
267
|
--_rs-tag-uppercase-horizontal-padding:var(
|
|
@@ -307,12 +307,12 @@
|
|
|
307
307
|
--_rs-typography-link-border-bottom-width-from-text:1px;
|
|
308
308
|
}
|
|
309
309
|
@media screen and (max-width: 640px){
|
|
310
|
-
.
|
|
310
|
+
._sizeL_mh6av7_27{
|
|
311
311
|
--_rs-typography-text-1-sm-list-li-margin-top-from-text:16px;
|
|
312
312
|
}
|
|
313
313
|
}
|
|
314
314
|
|
|
315
|
-
.
|
|
315
|
+
._main_mh6av7_31{
|
|
316
316
|
--_rs-tag-border-width:1px;
|
|
317
317
|
|
|
318
318
|
--_rs-tag-horizontal-padding:var(
|
|
@@ -354,14 +354,14 @@
|
|
|
354
354
|
gap:8px;
|
|
355
355
|
}
|
|
356
356
|
|
|
357
|
-
.
|
|
357
|
+
._main_mh6av7_31 ._icon_mh6av7_60{
|
|
358
358
|
fill:currentColor;
|
|
359
359
|
|
|
360
360
|
width:auto;
|
|
361
361
|
height:var(--_rs-tag-icon-size);
|
|
362
362
|
}
|
|
363
363
|
|
|
364
|
-
.
|
|
364
|
+
._main_1hlpjhx_1{
|
|
365
365
|
border-radius:var(--_rs-tag-border-radius);
|
|
366
366
|
}
|
|
367
367
|
|
|
@@ -370,14 +370,14 @@
|
|
|
370
370
|
inherits:true;
|
|
371
371
|
initial-value:0;
|
|
372
372
|
}
|
|
373
|
-
.
|
|
373
|
+
._themeLight_8m3b7j_7{
|
|
374
374
|
--rs-theme-dark:0;
|
|
375
375
|
}
|
|
376
|
-
.
|
|
376
|
+
._themeDark_8m3b7j_10{
|
|
377
377
|
--rs-theme-dark:1;
|
|
378
378
|
}
|
|
379
379
|
|
|
380
|
-
.
|
|
380
|
+
._sizeXs_8m3b7j_14{
|
|
381
381
|
--_rs-tag-removable-vertical-padding:2px;
|
|
382
382
|
--_rs-tag-removable-left-padding:8px;
|
|
383
383
|
--_rs-tag-removable-border-radius:4px;
|
|
@@ -385,11 +385,11 @@
|
|
|
385
385
|
--_rs-tag-removable-custom-icon-size:16px;
|
|
386
386
|
}
|
|
387
387
|
|
|
388
|
-
.
|
|
388
|
+
._sizeXs_8m3b7j_14 [data-rs-internal="removable-tag__close-icon"]:not(html){
|
|
389
389
|
--_rs-icons-height:16px;
|
|
390
390
|
}
|
|
391
391
|
|
|
392
|
-
.
|
|
392
|
+
._sizeXs_8m3b7j_14 {
|
|
393
393
|
--_rs-typography-letter-spacing:var(--rs-text-3-letter-spacing, 0.0045em);
|
|
394
394
|
--_rs-typography-text-transform:initial;
|
|
395
395
|
--_rs-typography-font-variant-numeric:initial;
|
|
@@ -424,17 +424,17 @@
|
|
|
424
424
|
--_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
|
|
425
425
|
--_rs-typography-link-border-bottom-width-from-text:1px;
|
|
426
426
|
}
|
|
427
|
-
.
|
|
427
|
+
._sizeS_8m3b7j_17{
|
|
428
428
|
--_rs-tag-removable-vertical-padding:4px;
|
|
429
429
|
--_rs-tag-removable-left-padding:8px;
|
|
430
430
|
--_rs-tag-removable-border-radius:4px;
|
|
431
431
|
--_rs-tag-removable-close-part-size:28px;
|
|
432
432
|
--_rs-tag-removable-custom-icon-size:20px;
|
|
433
433
|
}
|
|
434
|
-
.
|
|
434
|
+
._sizeS_8m3b7j_17 [data-rs-internal="removable-tag__close-icon"]:not(html){
|
|
435
435
|
--_rs-icons-height:20px;
|
|
436
436
|
}
|
|
437
|
-
.
|
|
437
|
+
._sizeS_8m3b7j_17 {
|
|
438
438
|
--_rs-typography-letter-spacing:var(--rs-text-3-letter-spacing, 0.0045em);
|
|
439
439
|
--_rs-typography-text-transform:initial;
|
|
440
440
|
--_rs-typography-font-variant-numeric:initial;
|
|
@@ -469,17 +469,17 @@
|
|
|
469
469
|
--_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
|
|
470
470
|
--_rs-typography-link-border-bottom-width-from-text:1px;
|
|
471
471
|
}
|
|
472
|
-
.
|
|
472
|
+
._sizeM_8m3b7j_20{
|
|
473
473
|
--_rs-tag-removable-vertical-padding:6px;
|
|
474
474
|
--_rs-tag-removable-left-padding:12px;
|
|
475
475
|
--_rs-tag-removable-border-radius:6px;
|
|
476
476
|
--_rs-tag-removable-close-part-size:36px;
|
|
477
477
|
--_rs-tag-removable-custom-icon-size:24px;
|
|
478
478
|
}
|
|
479
|
-
.
|
|
479
|
+
._sizeM_8m3b7j_20 [data-rs-internal="removable-tag__close-icon"]:not(html){
|
|
480
480
|
--_rs-icons-height:24px;
|
|
481
481
|
}
|
|
482
|
-
.
|
|
482
|
+
._sizeM_8m3b7j_20 {
|
|
483
483
|
--_rs-typography-letter-spacing:var(--rs-text-2-letter-spacing, 0.0015em);
|
|
484
484
|
--_rs-typography-text-transform:initial;
|
|
485
485
|
--_rs-typography-font-variant-numeric:initial;
|
|
@@ -518,21 +518,21 @@
|
|
|
518
518
|
--_rs-typography-link-border-bottom-width-from-text:1px;
|
|
519
519
|
}
|
|
520
520
|
@media screen and (max-width: 640px){
|
|
521
|
-
.
|
|
521
|
+
._sizeM_8m3b7j_20 {
|
|
522
522
|
--_rs-typography-text-2-sm-list-li-margin-top-from-text:12px;
|
|
523
523
|
}
|
|
524
524
|
}
|
|
525
|
-
.
|
|
525
|
+
._sizeL_8m3b7j_23{
|
|
526
526
|
--_rs-tag-removable-vertical-padding:8px;
|
|
527
527
|
--_rs-tag-removable-left-padding:16px;
|
|
528
528
|
--_rs-tag-removable-border-radius:8px;
|
|
529
529
|
--_rs-tag-removable-close-part-size:44px;
|
|
530
530
|
--_rs-tag-removable-custom-icon-size:28px;
|
|
531
531
|
}
|
|
532
|
-
.
|
|
532
|
+
._sizeL_8m3b7j_23 [data-rs-internal="removable-tag__close-icon"]:not(html){
|
|
533
533
|
--_rs-icons-height:28px;
|
|
534
534
|
}
|
|
535
|
-
.
|
|
535
|
+
._sizeL_8m3b7j_23 {
|
|
536
536
|
--_rs-typography-letter-spacing:var(--rs-text-1-letter-spacing, normal);
|
|
537
537
|
--_rs-typography-text-transform:initial;
|
|
538
538
|
--_rs-typography-font-variant-numeric:initial;
|
|
@@ -571,12 +571,12 @@
|
|
|
571
571
|
--_rs-typography-link-border-bottom-width-from-text:1px;
|
|
572
572
|
}
|
|
573
573
|
@media screen and (max-width: 640px){
|
|
574
|
-
.
|
|
574
|
+
._sizeL_8m3b7j_23 {
|
|
575
575
|
--_rs-typography-text-1-sm-list-li-margin-top-from-text:16px;
|
|
576
576
|
}
|
|
577
577
|
}
|
|
578
578
|
|
|
579
|
-
.
|
|
579
|
+
._wrapper_8m3b7j_27{
|
|
580
580
|
--_rs-theme-dark:var(
|
|
581
581
|
--_rs-internal-force-theme-dark-consult-rescui-before-using,
|
|
582
582
|
var(--rs-theme-dark, 0)
|
|
@@ -588,7 +588,7 @@
|
|
|
588
588
|
|
|
589
589
|
@supports (color: color-mix(in srgb, #fff 50%, #000 50%)){
|
|
590
590
|
|
|
591
|
-
.
|
|
591
|
+
._wrapper_8m3b7j_27{
|
|
592
592
|
--_rs-color-primary:color-mix(in srgb, var(--rs-color-primary-light-theme, #6B57FF) calc(100% * var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-dark-theme, #8473FF) calc(100% * var(--_rs-theme-dark-coefficient, 0)));
|
|
593
593
|
--_rs-color-primary-dim:color-mix(in srgb, var(--rs-color-primary-dim-light-theme, #8979ff) calc(100% * var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-dim-dark-theme, #6f61d2) calc(100% * var(--_rs-theme-dark-coefficient, 0)));
|
|
594
594
|
--_rs-color-primary-fog:color-mix(in srgb, var(--rs-color-primary-fog-light-theme, #e1ddff) calc(100% * var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-fog-dark-theme, #2e2b49) calc(100% * var(--_rs-theme-dark-coefficient, 0)));
|
|
@@ -599,7 +599,7 @@
|
|
|
599
599
|
|
|
600
600
|
@supports not (color: color-mix(in srgb, #fff 50%, #000 50%)){
|
|
601
601
|
|
|
602
|
-
.
|
|
602
|
+
._wrapper_8m3b7j_27{
|
|
603
603
|
--_rs-color-primary:rgb(calc(107 * var(--_rs-theme-light-coefficient, 1) + 132 * var(--_rs-theme-dark-coefficient, 0)), calc(87 * var(--_rs-theme-light-coefficient, 1) + 115 * var(--_rs-theme-dark-coefficient, 0)), 255);
|
|
604
604
|
--_rs-color-primary-dim:rgb(calc(137 * var(--_rs-theme-light-coefficient, 1) + 111 * var(--_rs-theme-dark-coefficient, 0)), calc(121 * var(--_rs-theme-light-coefficient, 1) + 97 * var(--_rs-theme-dark-coefficient, 0)), calc(255 * var(--_rs-theme-light-coefficient, 1) + 210 * var(--_rs-theme-dark-coefficient, 0)));
|
|
605
605
|
--_rs-color-primary-fog:rgb(calc(225 * var(--_rs-theme-light-coefficient, 1) + 46 * var(--_rs-theme-dark-coefficient, 0)), calc(221 * var(--_rs-theme-light-coefficient, 1) + 43 * var(--_rs-theme-dark-coefficient, 0)), calc(255 * var(--_rs-theme-light-coefficient, 1) + 73 * var(--_rs-theme-dark-coefficient, 0)));
|
|
@@ -608,7 +608,7 @@
|
|
|
608
608
|
}
|
|
609
609
|
}
|
|
610
610
|
|
|
611
|
-
.
|
|
611
|
+
._wrapper_8m3b7j_27 {
|
|
612
612
|
letter-spacing:var(
|
|
613
613
|
--rs-text-base-letter-spacing,
|
|
614
614
|
var(--_rs-typography-letter-spacing)
|
|
@@ -638,11 +638,11 @@
|
|
|
638
638
|
background-color:rgba(calc(25 + 230 * var(--_rs-theme-dark-coefficient, 0)), calc(25 + 230 * var(--_rs-theme-dark-coefficient, 0)), calc(28 + 227 * var(--_rs-theme-dark-coefficient, 0)), 0.1);
|
|
639
639
|
}
|
|
640
640
|
|
|
641
|
-
.
|
|
641
|
+
._wrapper_8m3b7j_27 > *{
|
|
642
642
|
vertical-align:top;
|
|
643
643
|
}
|
|
644
644
|
|
|
645
|
-
.
|
|
645
|
+
._wrapper_8m3b7j_27 ._icon_8m3b7j_49{
|
|
646
646
|
flex:1 0 auto;
|
|
647
647
|
align-self:center;
|
|
648
648
|
|
|
@@ -654,7 +654,7 @@
|
|
|
654
654
|
fill:currentColor;
|
|
655
655
|
}
|
|
656
656
|
|
|
657
|
-
.
|
|
657
|
+
._disabled_8m3b7j_62{
|
|
658
658
|
pointer-events:none;
|
|
659
659
|
color:var(
|
|
660
660
|
--rs-color-pale,
|
|
@@ -662,7 +662,7 @@
|
|
|
662
662
|
);
|
|
663
663
|
}
|
|
664
664
|
|
|
665
|
-
.
|
|
665
|
+
._main_8m3b7j_67{
|
|
666
666
|
display:inline-flex;
|
|
667
667
|
flex:1 1 auto;
|
|
668
668
|
justify-content:center;
|
|
@@ -677,11 +677,11 @@
|
|
|
677
677
|
background:transparent;
|
|
678
678
|
}
|
|
679
679
|
|
|
680
|
-
.
|
|
680
|
+
._wrap_8m3b7j_27 ._main_8m3b7j_67{
|
|
681
681
|
white-space:normal;
|
|
682
682
|
}
|
|
683
683
|
|
|
684
|
-
.
|
|
684
|
+
._close_8m3b7j_86{
|
|
685
685
|
top:0;
|
|
686
686
|
right:0;
|
|
687
687
|
bottom:0;
|
|
@@ -710,36 +710,36 @@
|
|
|
710
710
|
-moz-osx-font-smoothing:inherit;
|
|
711
711
|
}
|
|
712
712
|
|
|
713
|
-
.
|
|
713
|
+
._close_8m3b7j_86::-moz-focus-inner{
|
|
714
714
|
padding:0;
|
|
715
715
|
|
|
716
716
|
border:0;
|
|
717
717
|
}
|
|
718
718
|
|
|
719
|
-
.
|
|
720
|
-
.
|
|
721
|
-
.
|
|
719
|
+
._close_8m3b7j_86:active,
|
|
720
|
+
._close_8m3b7j_86:hover,
|
|
721
|
+
._close_8m3b7j_86:focus{
|
|
722
722
|
outline:none;
|
|
723
723
|
|
|
724
724
|
text-decoration:none;
|
|
725
725
|
}
|
|
726
726
|
|
|
727
|
-
.
|
|
727
|
+
._close_8m3b7j_86:hover{
|
|
728
728
|
color:rgb(calc(25 + 230 * var(--_rs-theme-dark-coefficient, 0)), calc(25 + 230 * var(--_rs-theme-dark-coefficient, 0)), calc(28 + 227 * var(--_rs-theme-dark-coefficient, 0)));
|
|
729
729
|
background-color:rgba(calc(25 + 230 * var(--_rs-theme-dark-coefficient, 0)), calc(25 + 230 * var(--_rs-theme-dark-coefficient, 0)), calc(28 + 227 * var(--_rs-theme-dark-coefficient, 0)), 0.1);
|
|
730
730
|
}
|
|
731
731
|
|
|
732
|
-
.
|
|
732
|
+
._close_8m3b7j_86:active{
|
|
733
733
|
color:rgb(calc(25 + 230 * var(--_rs-theme-dark-coefficient, 0)), calc(25 + 230 * var(--_rs-theme-dark-coefficient, 0)), calc(28 + 227 * var(--_rs-theme-dark-coefficient, 0)));
|
|
734
734
|
background-color:rgba(calc(25 + 230 * var(--_rs-theme-dark-coefficient, 0)), calc(25 + 230 * var(--_rs-theme-dark-coefficient, 0)), calc(28 + 227 * var(--_rs-theme-dark-coefficient, 0)), 0.2);
|
|
735
735
|
}
|
|
736
736
|
|
|
737
|
-
.
|
|
738
|
-
.
|
|
737
|
+
._close_8m3b7j_86:focus-visible,
|
|
738
|
+
._close_8m3b7j_86:focus[data-focus-method='key']{
|
|
739
739
|
box-shadow:inset 0 0 0 4px var(--_rs-color-primary-dim);
|
|
740
740
|
}
|
|
741
741
|
|
|
742
|
-
.
|
|
742
|
+
._disabled_8m3b7j_62 ._close_8m3b7j_86{
|
|
743
743
|
pointer-events:none;
|
|
744
744
|
}
|
|
745
745
|
|
|
@@ -748,51 +748,51 @@
|
|
|
748
748
|
inherits:true;
|
|
749
749
|
initial-value:0;
|
|
750
750
|
}
|
|
751
|
-
.
|
|
751
|
+
._wrapper_11z76on_3{
|
|
752
752
|
position:relative;
|
|
753
753
|
}
|
|
754
754
|
|
|
755
|
-
.
|
|
755
|
+
._offset16_11z76on_7{
|
|
756
756
|
--_rs-tag-sticky-side-offset:16px;
|
|
757
757
|
}
|
|
758
|
-
.
|
|
758
|
+
._offset24_11z76on_10{
|
|
759
759
|
--_rs-tag-sticky-side-offset:24px;
|
|
760
760
|
}
|
|
761
|
-
.
|
|
761
|
+
._offset32_11z76on_13{
|
|
762
762
|
--_rs-tag-sticky-side-offset:32px;
|
|
763
763
|
}
|
|
764
764
|
|
|
765
|
-
.
|
|
765
|
+
._alignTop_11z76on_17{
|
|
766
766
|
--_rs-tag-sticky-border-radius:var(--_rs-tag-border-radius) var(--_rs-tag-border-radius) 0 0;
|
|
767
767
|
--_rs-tag-sticky-translate-y:-100%;
|
|
768
768
|
}
|
|
769
|
-
.
|
|
769
|
+
._alignMiddle_11z76on_20{
|
|
770
770
|
--_rs-tag-sticky-border-radius:var(--_rs-tag-border-radius);
|
|
771
771
|
--_rs-tag-sticky-translate-y:-50%;
|
|
772
772
|
}
|
|
773
773
|
|
|
774
|
-
.
|
|
774
|
+
._topStart_11z76on_24{
|
|
775
775
|
--_rs-tag-sticky-top:0;
|
|
776
776
|
--_rs-tag-sticky-right:initial;
|
|
777
777
|
--_rs-tag-sticky-left:var(--_rs-tag-sticky-side-offset);
|
|
778
778
|
--_rs-tag-sticky-transform:translate(0, var(--_rs-tag-sticky-translate-y));
|
|
779
779
|
--_rs-tag-sticky-transform-origin:initial;
|
|
780
780
|
}
|
|
781
|
-
.
|
|
781
|
+
._topEnd_11z76on_27{
|
|
782
782
|
--_rs-tag-sticky-top:0;
|
|
783
783
|
--_rs-tag-sticky-right:var(--_rs-tag-sticky-side-offset);
|
|
784
784
|
--_rs-tag-sticky-left:initial;
|
|
785
785
|
--_rs-tag-sticky-transform:translate(0, var(--_rs-tag-sticky-translate-y));
|
|
786
786
|
--_rs-tag-sticky-transform-origin:initial;
|
|
787
787
|
}
|
|
788
|
-
.
|
|
788
|
+
._leftStart_11z76on_30{
|
|
789
789
|
--_rs-tag-sticky-top:var(--_rs-tag-sticky-side-offset);
|
|
790
790
|
--_rs-tag-sticky-right:100%;
|
|
791
791
|
--_rs-tag-sticky-left:initial;
|
|
792
792
|
--_rs-tag-sticky-transform:rotate(270deg) translate(0, var(--_rs-tag-sticky-translate-y));
|
|
793
793
|
--_rs-tag-sticky-transform-origin:100% 0;
|
|
794
794
|
}
|
|
795
|
-
.
|
|
795
|
+
._leftEnd_11z76on_33{
|
|
796
796
|
--_rs-tag-sticky-top:calc(100% - var(--_rs-tag-sticky-side-offset));
|
|
797
797
|
--_rs-tag-sticky-right:100%;
|
|
798
798
|
--_rs-tag-sticky-left:initial;
|
|
@@ -800,7 +800,7 @@
|
|
|
800
800
|
--_rs-tag-sticky-transform-origin:100% 0;
|
|
801
801
|
}
|
|
802
802
|
|
|
803
|
-
.
|
|
803
|
+
._tag_11z76on_37{
|
|
804
804
|
position:absolute;
|
|
805
805
|
top:var(--_rs-tag-sticky-top);
|
|
806
806
|
right:var(--_rs-tag-sticky-right);
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
var styles = {"alignIconLeft":"
|
|
1
|
+
var styles = {"alignIconLeft":"_alignIconLeft_mh6av7_7","alignIconRight":"_alignIconRight_mh6av7_10","uppercase":"_uppercase_mh6av7_14","sizeXs":"_sizeXs_mh6av7_18","sizeS":"_sizeS_mh6av7_21","sizeM":"_sizeM_mh6av7_24","sizeL":"_sizeL_mh6av7_27","main":"_main_mh6av7_31","icon":"_icon_mh6av7_60"};
|
|
2
2
|
|
|
3
3
|
export { styles as default };
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
var styles = {"themeLight":"
|
|
1
|
+
var styles = {"themeLight":"_themeLight_8m3b7j_7","themeDark":"_themeDark_8m3b7j_10","sizeXs":"_sizeXs_8m3b7j_14","sizeS":"_sizeS_8m3b7j_17","sizeM":"_sizeM_8m3b7j_20","sizeL":"_sizeL_8m3b7j_23","wrapper":"_wrapper_8m3b7j_27","icon":"_icon_8m3b7j_49","disabled":"_disabled_8m3b7j_62","main":"_main_8m3b7j_67","wrap":"_wrap_8m3b7j_27","close":"_close_8m3b7j_86"};
|
|
2
2
|
|
|
3
3
|
export { styles as default };
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
var styles = {"wrapper":"
|
|
1
|
+
var styles = {"wrapper":"_wrapper_11z76on_3","offset16":"_offset16_11z76on_7","offset24":"_offset24_11z76on_10","offset32":"_offset32_11z76on_13","alignTop":"_alignTop_11z76on_17","alignMiddle":"_alignMiddle_11z76on_20","topStart":"_topStart_11z76on_24","topEnd":"_topEnd_11z76on_27","leftStart":"_leftStart_11z76on_30","leftEnd":"_leftEnd_11z76on_33","tag":"_tag_11z76on_37"};
|
|
2
2
|
|
|
3
3
|
export { styles as default };
|
package/llm/components/tag.md
CHANGED
|
@@ -8,7 +8,7 @@ Tags allow users to filter content, and they can also be useful for drawing atte
|
|
|
8
8
|
|
|
9
9
|
### Examples
|
|
10
10
|
|
|
11
|
-
```
|
|
11
|
+
```jsx
|
|
12
12
|
import { Tag, presets } from '@rescui/tag';
|
|
13
13
|
|
|
14
14
|
<Tag {...presets['classic-light']}>Tag</Tag>;
|
|
@@ -16,7 +16,7 @@ import { Tag, presets } from '@rescui/tag';
|
|
|
16
16
|
|
|
17
17
|
#### Custom appearance
|
|
18
18
|
|
|
19
|
-
```
|
|
19
|
+
```jsx
|
|
20
20
|
import { Tag } from '@rescui/tag';
|
|
21
21
|
|
|
22
22
|
<Tag color="white" backgroundColor="purple">
|
|
@@ -26,7 +26,7 @@ import { Tag } from '@rescui/tag';
|
|
|
26
26
|
|
|
27
27
|
#### Custom outline appearance
|
|
28
28
|
|
|
29
|
-
```
|
|
29
|
+
```jsx
|
|
30
30
|
import { Tag } from '@rescui/tag';
|
|
31
31
|
|
|
32
32
|
<Tag color="black" borderColor="purple">
|
|
@@ -36,7 +36,7 @@ import { Tag } from '@rescui/tag';
|
|
|
36
36
|
|
|
37
37
|
#### Preset extension
|
|
38
38
|
|
|
39
|
-
```
|
|
39
|
+
```jsx
|
|
40
40
|
import { Tag, presets } from '@rescui/tag';
|
|
41
41
|
|
|
42
42
|
<Tag {...presets['classic-light']} backgroundColor="red">
|
|
@@ -46,7 +46,7 @@ import { Tag, presets } from '@rescui/tag';
|
|
|
46
46
|
|
|
47
47
|
#### Make your own presets set
|
|
48
48
|
|
|
49
|
-
```
|
|
49
|
+
```jsx
|
|
50
50
|
import { Tag, presets as basePresets } from '@rescui/tag';
|
|
51
51
|
|
|
52
52
|
const presets = {
|
|
@@ -59,7 +59,7 @@ render(<Tag {...presets.space}>Tag</Tag>);
|
|
|
59
59
|
|
|
60
60
|
#### Change size
|
|
61
61
|
|
|
62
|
-
```
|
|
62
|
+
```jsx
|
|
63
63
|
import { Tag, presets } from '@rescui/tag';
|
|
64
64
|
|
|
65
65
|
<Tag {...presets['classic-light']} size="m">
|
|
@@ -69,7 +69,7 @@ import { Tag, presets } from '@rescui/tag';
|
|
|
69
69
|
|
|
70
70
|
#### Uppercase mode
|
|
71
71
|
|
|
72
|
-
```
|
|
72
|
+
```jsx
|
|
73
73
|
import { Tag, presets } from '@rescui/tag';
|
|
74
74
|
|
|
75
75
|
<Tag {...presets['classic-light']} isUppercase>
|
|
@@ -79,7 +79,7 @@ import { Tag, presets } from '@rescui/tag';
|
|
|
79
79
|
|
|
80
80
|
#### Add icon
|
|
81
81
|
|
|
82
|
-
```
|
|
82
|
+
```jsx
|
|
83
83
|
import { Tag, presets } from '@rescui/tag';
|
|
84
84
|
import { DownloadOutlineIcon } from '@rescui/icons';
|
|
85
85
|
|
|
@@ -105,7 +105,7 @@ If you want to add your own icon, please make sure that the icon has `24×24px`
|
|
|
105
105
|
|
|
106
106
|
Also, icon should have one `className` props.
|
|
107
107
|
|
|
108
|
-
```
|
|
108
|
+
```jsx
|
|
109
109
|
import { Tag, presets } from '@rescui/tag';
|
|
110
110
|
|
|
111
111
|
const SettingsIcon = ({ className }) => (
|
|
@@ -144,7 +144,7 @@ render(<Demo />);
|
|
|
144
144
|
|
|
145
145
|
### Examples
|
|
146
146
|
|
|
147
|
-
```
|
|
147
|
+
```jsx
|
|
148
148
|
import { StickyTag, presets } from '@rescui/tag';
|
|
149
149
|
import { textCn } from '@rescui/typography';
|
|
150
150
|
import { cardCn } from '@rescui/card';
|
|
@@ -172,7 +172,7 @@ render(<Demo />);
|
|
|
172
172
|
|
|
173
173
|
#### Custom appearance
|
|
174
174
|
|
|
175
|
-
```
|
|
175
|
+
```jsx
|
|
176
176
|
import { StickyTag } from '@rescui/tag';
|
|
177
177
|
import { textCn } from '@rescui/typography';
|
|
178
178
|
import { cardCn } from '@rescui/card';
|
|
@@ -200,7 +200,7 @@ render(<Demo />);
|
|
|
200
200
|
|
|
201
201
|
#### Change size
|
|
202
202
|
|
|
203
|
-
```
|
|
203
|
+
```jsx
|
|
204
204
|
import { StickyTag, presets } from '@rescui/tag';
|
|
205
205
|
import { textCn } from '@rescui/typography';
|
|
206
206
|
import { cardCn } from '@rescui/card';
|
|
@@ -228,7 +228,7 @@ render(<Demo />);
|
|
|
228
228
|
|
|
229
229
|
#### Change placement
|
|
230
230
|
|
|
231
|
-
```
|
|
231
|
+
```jsx
|
|
232
232
|
import { StickyTag, presets } from '@rescui/tag';
|
|
233
233
|
import { textCn } from '@rescui/typography';
|
|
234
234
|
import { cardCn } from '@rescui/card';
|
|
@@ -260,7 +260,7 @@ render(<Demo />);
|
|
|
260
260
|
|
|
261
261
|
#### Change align
|
|
262
262
|
|
|
263
|
-
```
|
|
263
|
+
```jsx
|
|
264
264
|
import { StickyTag, presets } from '@rescui/tag';
|
|
265
265
|
import { textCn } from '@rescui/typography';
|
|
266
266
|
import { cardCn } from '@rescui/card';
|
|
@@ -288,7 +288,7 @@ render(<Demo />);
|
|
|
288
288
|
|
|
289
289
|
#### Change offset
|
|
290
290
|
|
|
291
|
-
```
|
|
291
|
+
```jsx
|
|
292
292
|
import { StickyTag, presets } from '@rescui/tag';
|
|
293
293
|
import { textCn } from '@rescui/typography';
|
|
294
294
|
import { cardCn } from '@rescui/card';
|
|
@@ -316,7 +316,7 @@ render(<Demo />);
|
|
|
316
316
|
|
|
317
317
|
#### Uppercase mode
|
|
318
318
|
|
|
319
|
-
```
|
|
319
|
+
```jsx
|
|
320
320
|
import { StickyTag, presets } from '@rescui/tag';
|
|
321
321
|
import { textCn } from '@rescui/typography';
|
|
322
322
|
import { cardCn } from '@rescui/card';
|
|
@@ -344,7 +344,7 @@ render(<Demo />);
|
|
|
344
344
|
|
|
345
345
|
#### Add icon
|
|
346
346
|
|
|
347
|
-
```
|
|
347
|
+
```jsx
|
|
348
348
|
import { StickyTag, presets } from '@rescui/tag';
|
|
349
349
|
import { textCn } from '@rescui/typography';
|
|
350
350
|
import { cardCn } from '@rescui/card';
|
|
@@ -383,7 +383,7 @@ render(<Demo />);
|
|
|
383
383
|
|
|
384
384
|
`onRemoveClick` is a required prop.
|
|
385
385
|
|
|
386
|
-
```
|
|
386
|
+
```jsx
|
|
387
387
|
import { RemovableTag } from '@rescui/tag';
|
|
388
388
|
|
|
389
389
|
<RemovableTag onRemoveClick={() => console.log('removed')}>
|
|
@@ -393,7 +393,7 @@ import { RemovableTag } from '@rescui/tag';
|
|
|
393
393
|
|
|
394
394
|
#### Change size
|
|
395
395
|
|
|
396
|
-
```
|
|
396
|
+
```jsx
|
|
397
397
|
import { RemovableTag } from '@rescui/tag';
|
|
398
398
|
|
|
399
399
|
<RemovableTag size="m" onRemoveClick={() => console.log('removed')}>
|
|
@@ -403,7 +403,7 @@ import { RemovableTag } from '@rescui/tag';
|
|
|
403
403
|
|
|
404
404
|
#### Disabled
|
|
405
405
|
|
|
406
|
-
```
|
|
406
|
+
```jsx
|
|
407
407
|
import { RemovableTag } from '@rescui/tag';
|
|
408
408
|
|
|
409
409
|
<RemovableTag disabled onRemoveClick={() => console.log('removed')}>
|
|
@@ -413,7 +413,7 @@ import { RemovableTag } from '@rescui/tag';
|
|
|
413
413
|
|
|
414
414
|
#### With icon
|
|
415
415
|
|
|
416
|
-
```
|
|
416
|
+
```jsx
|
|
417
417
|
import { RemovableTag } from '@rescui/tag';
|
|
418
418
|
import { PersonOutlineIcon } from '@rescui/icons';
|
|
419
419
|
|
|
@@ -441,7 +441,7 @@ import { PersonOutlineIcon } from '@rescui/icons';
|
|
|
441
441
|
|
|
442
442
|
Use the controls to see the effect at different viewport widths.
|
|
443
443
|
|
|
444
|
-
```
|
|
444
|
+
```jsx
|
|
445
445
|
import { Tag, presets } from '@rescui/tag';
|
|
446
446
|
import { PersonIcon } from '@rescui/icons';
|
|
447
447
|
|
|
@@ -504,7 +504,7 @@ render(<MyTag />);
|
|
|
504
504
|
|
|
505
505
|
Use the controls to see the effect at different viewport widths.
|
|
506
506
|
|
|
507
|
-
```
|
|
507
|
+
```jsx
|
|
508
508
|
import { StickyTag, presets } from '@rescui/tag';
|
|
509
509
|
import { PersonIcon } from '@rescui/icons';
|
|
510
510
|
import { textCn } from '@rescui/typography';
|
|
@@ -569,7 +569,7 @@ render(<MyStickyTag />);
|
|
|
569
569
|
|
|
570
570
|
Use the controls to see the effect at different viewport widths.
|
|
571
571
|
|
|
572
|
-
```
|
|
572
|
+
```jsx
|
|
573
573
|
import { RemovableTag } from '@rescui/tag';
|
|
574
574
|
|
|
575
575
|
const MyRemovableTag = () => {
|
|
@@ -607,7 +607,7 @@ Use presets for styling tags when possible.
|
|
|
607
607
|
|
|
608
608
|
#### Example
|
|
609
609
|
|
|
610
|
-
```
|
|
610
|
+
```jsx
|
|
611
611
|
import { Tag, presets } from '@rescui/tag';
|
|
612
612
|
|
|
613
613
|
<Tag {...presets['classic-light']}>Tag</Tag>;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@rescui/tag",
|
|
3
|
-
"version": "0.16.
|
|
3
|
+
"version": "0.16.3",
|
|
4
4
|
"description": "",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"author": "JetBrains",
|
|
@@ -26,7 +26,7 @@
|
|
|
26
26
|
"react": ">=17.0.0 <20"
|
|
27
27
|
},
|
|
28
28
|
"devDependencies": {
|
|
29
|
-
"@rescui/icons": "^1.12.
|
|
29
|
+
"@rescui/icons": "^1.12.1",
|
|
30
30
|
"@rescui/scripts": "^0.6.0",
|
|
31
31
|
"@rescui/typography": "^0.30.2"
|
|
32
32
|
},
|
|
@@ -35,5 +35,5 @@
|
|
|
35
35
|
"build-pcss-api": "rescui-scripts build-pcss-api --file public-api.p.css"
|
|
36
36
|
},
|
|
37
37
|
"nx": {},
|
|
38
|
-
"gitHead": "
|
|
38
|
+
"gitHead": "de39487aaf7fa1351451b7a4c73b0f6024551e5a"
|
|
39
39
|
}
|