@rescui/tag 0.4.0 → 0.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/lib/index.css +120 -104
  2. package/lib/parts/base-tag.p.module.css.js +10 -10
  3. package/lib/parts/presets.d.ts +50 -2
  4. package/lib/parts/presets.js +34 -2
  5. package/lib/parts/removable-tag.p.module.css.js +13 -13
  6. package/lib/parts/sticky-tag.d.ts +3 -3
  7. package/lib/parts/sticky-tag.p.module.css.js +15 -15
  8. package/lib/parts/tag.p.module.css.js +4 -4
  9. package/lib/tag.d.ts +3 -3
  10. package/package.json +5 -5
package/lib/index.css CHANGED
@@ -1,4 +1,4 @@
1
- ._wrapper_1lv49zg_36{
1
+ ._wrapper_5ozgm2_36{
2
2
  position:relative;
3
3
 
4
4
  display:-webkit-inline-box;
@@ -10,90 +10,96 @@
10
10
  white-space:nowrap;
11
11
  }
12
12
 
13
- ._wrapper_1lv49zg_36 > *{
13
+ ._wrapper_5ozgm2_36 > *{
14
14
  vertical-align:top;
15
15
  }
16
- ._sizeXs_1lv49zg_48,
17
- ._sizeS_1lv49zg_49{
16
+ ._sizeXs_5ozgm2_48,
17
+ ._sizeS_5ozgm2_49{
18
18
  letter-spacing:0.0045em;
19
19
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
20
20
  font-family:var(--rs-font-family-ui, var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif));
21
+ -webkit-font-feature-settings:"kern", "liga", "calt";
22
+ font-feature-settings:"kern", "liga", "calt";
21
23
  font-size:13px;
22
24
  font-size:var(--rs-text-3-font-size, 13px);
23
25
  line-height:20px;
24
26
  line-height:var(--rs-text-3-line-height, 20px);
25
27
  }
26
- ._rs-reset-letter-spacing_1lv49zg_1 ._sizeXs_1lv49zg_48,._rs-reset-letter-spacing_1lv49zg_1 ._sizeS_1lv49zg_49{
28
+ ._rs-reset-letter-spacing_5ozgm2_1 ._sizeXs_5ozgm2_48,._rs-reset-letter-spacing_5ozgm2_1 ._sizeS_5ozgm2_49{
27
29
  letter-spacing:normal;
28
30
  }
29
- ._sizeM_1lv49zg_53{
31
+ ._sizeM_5ozgm2_53{
30
32
  letter-spacing:0.0015em;
31
33
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
32
34
  font-family:var(--rs-font-family-ui, var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif));
35
+ -webkit-font-feature-settings:"kern", "liga", "calt";
36
+ font-feature-settings:"kern", "liga", "calt";
33
37
  font-size:16px;
34
38
  font-size:var(--rs-text-2-font-size, 16px);
35
39
  font-weight:400;
36
40
  line-height:24px;
37
41
  line-height:var(--rs-text-2-line-height, 24px);
38
42
  }
39
- ._rs-reset-letter-spacing_1lv49zg_1 ._sizeM_1lv49zg_53{
43
+ ._rs-reset-letter-spacing_5ozgm2_1 ._sizeM_5ozgm2_53{
40
44
  letter-spacing:normal;
41
45
  }
42
- ._sizeL_1lv49zg_57{
46
+ ._sizeL_5ozgm2_57{
43
47
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
44
48
  font-family:var(--rs-font-family-ui, var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif));
49
+ -webkit-font-feature-settings:"kern", "liga", "calt";
50
+ font-feature-settings:"kern", "liga", "calt";
45
51
  font-size:19px;
46
52
  font-size:var(--rs-text-1-font-size, 19px);
47
53
  font-weight:normal;
48
54
  line-height:28px;
49
55
  line-height:var(--rs-text-1-line-height, 28px);
50
56
  }
51
- ._themeLight_1lv49zg_61{
57
+ ._themeLight_5ozgm2_61{
52
58
  color:rgba(25,25,28,0.7);
53
59
  color:var(--rs-typography-color-average, rgba(25,25,28,0.7));
54
60
  }
55
- ._themeLight_1lv49zg_61._disabled_1lv49zg_65{
61
+ ._themeLight_5ozgm2_61._disabled_5ozgm2_65{
56
62
  color:rgba(25,25,28,0.5);
57
63
  color:var(--rs-typography-color-pale, rgba(25,25,28,0.5));
58
64
  }
59
- ._themeDark_1lv49zg_69{
65
+ ._themeDark_5ozgm2_69{
60
66
  color:rgba(255,255,255,0.7);
61
67
  color:var(--rs-typography-color-average, rgba(255,255,255,0.7));
62
68
  }
63
- ._themeDark_1lv49zg_69._disabled_1lv49zg_65{
69
+ ._themeDark_5ozgm2_69._disabled_5ozgm2_65{
64
70
  color:rgba(255,255,255,0.5);
65
71
  color:var(--rs-typography-color-pale, rgba(255,255,255,0.5));
66
72
  }
67
- ._disabled_1lv49zg_65{
73
+ ._disabled_5ozgm2_65{
68
74
  pointer-events:none;
69
75
  }
70
- ._sizeXs_1lv49zg_48{
76
+ ._sizeXs_5ozgm2_48{
71
77
  padding-left:8px;
72
78
 
73
79
  border-radius:4px;
74
80
  }
75
- ._sizeS_1lv49zg_49{
81
+ ._sizeS_5ozgm2_49{
76
82
  padding-left:8px;
77
83
 
78
84
  border-radius:4px;
79
85
  }
80
- ._sizeM_1lv49zg_53{
86
+ ._sizeM_5ozgm2_53{
81
87
  padding-left:12px;
82
88
 
83
89
  border-radius:6px;
84
90
  }
85
- ._sizeL_1lv49zg_57{
91
+ ._sizeL_5ozgm2_57{
86
92
  padding-left:16px;
87
93
 
88
94
  border-radius:8px;
89
95
  }
90
- ._themeLight_1lv49zg_61{
96
+ ._themeLight_5ozgm2_61{
91
97
  background-color:rgba(25,25,28,0.1);
92
98
  }
93
- ._themeDark_1lv49zg_69{
99
+ ._themeDark_5ozgm2_69{
94
100
  background-color:rgba(255,255,255,0.1);
95
101
  }
96
- ._main_1lv49zg_110{
102
+ ._main_5ozgm2_110{
97
103
  display:-webkit-inline-box;
98
104
  display:-ms-inline-flexbox;
99
105
  display:inline-flex;
@@ -111,30 +117,30 @@
111
117
 
112
118
  background:transparent;
113
119
  }
114
- ._wrap_1lv49zg_36 ._main_1lv49zg_110{
120
+ ._wrap_5ozgm2_36 ._main_5ozgm2_110{
115
121
  white-space:normal;
116
122
  }
117
- ._sizeXs_1lv49zg_48 ._main_1lv49zg_110{
123
+ ._sizeXs_5ozgm2_48 ._main_5ozgm2_110{
118
124
  padding-top:2px;
119
125
  padding-right:2px;
120
126
  padding-bottom:2px;
121
127
  }
122
- ._sizeS_1lv49zg_49 ._main_1lv49zg_110{
128
+ ._sizeS_5ozgm2_49 ._main_5ozgm2_110{
123
129
  padding-top:4px;
124
130
  padding-right:2px;
125
131
  padding-bottom:4px;
126
132
  }
127
- ._sizeM_1lv49zg_53 ._main_1lv49zg_110{
133
+ ._sizeM_5ozgm2_53 ._main_5ozgm2_110{
128
134
  padding-top:6px;
129
135
  padding-right:2px;
130
136
  padding-bottom:6px;
131
137
  }
132
- ._sizeL_1lv49zg_57 ._main_1lv49zg_110{
138
+ ._sizeL_5ozgm2_57 ._main_5ozgm2_110{
133
139
  padding-top:8px;
134
140
  padding-right:4px;
135
141
  padding-bottom:8px;
136
142
  }
137
- ._close_1lv49zg_146{
143
+ ._close_5ozgm2_146{
138
144
  top:0;
139
145
  right:0;
140
146
  bottom:0;
@@ -170,70 +176,70 @@
170
176
  -webkit-font-smoothing:inherit;
171
177
  -moz-osx-font-smoothing:inherit;
172
178
  }
173
- ._close_1lv49zg_146::-moz-focus-inner{
179
+ ._close_5ozgm2_146::-moz-focus-inner{
174
180
  padding:0;
175
181
 
176
182
  border:0;
177
183
  }
178
- ._close_1lv49zg_146:active,
179
- ._close_1lv49zg_146:hover,
180
- ._close_1lv49zg_146:focus{
184
+ ._close_5ozgm2_146:active,
185
+ ._close_5ozgm2_146:hover,
186
+ ._close_5ozgm2_146:focus{
181
187
  outline:none;
182
188
 
183
189
  text-decoration:none;
184
190
  }
185
- ._sizeXs_1lv49zg_48 ._close_1lv49zg_146{
191
+ ._sizeXs_5ozgm2_48 ._close_5ozgm2_146{
186
192
  width:28px;
187
193
 
188
194
  border-radius:4px;
189
195
  }
190
- ._sizeS_1lv49zg_49 ._close_1lv49zg_146{
196
+ ._sizeS_5ozgm2_49 ._close_5ozgm2_146{
191
197
  width:28px;
192
198
 
193
199
  border-radius:4px;
194
200
  }
195
- ._sizeM_1lv49zg_53 ._close_1lv49zg_146{
201
+ ._sizeM_5ozgm2_53 ._close_5ozgm2_146{
196
202
  width:36px;
197
203
 
198
204
  border-radius:6px;
199
205
  }
200
- ._sizeL_1lv49zg_57 ._close_1lv49zg_146{
206
+ ._sizeL_5ozgm2_57 ._close_5ozgm2_146{
201
207
  width:44px;
202
208
 
203
209
  border-radius:8px;
204
210
  }
205
- ._disabled_1lv49zg_65 ._close_1lv49zg_146{
211
+ ._disabled_5ozgm2_65 ._close_5ozgm2_146{
206
212
  pointer-events:none;
207
213
  }
208
- ._themeLight_1lv49zg_61 ._close_1lv49zg_146:hover{
214
+ ._themeLight_5ozgm2_61 ._close_5ozgm2_146:hover{
209
215
  color:#19191C;
210
216
  background-color:rgba(25,25,28,0.1);
211
217
  }
212
- ._themeDark_1lv49zg_69 ._close_1lv49zg_146:hover{
218
+ ._themeDark_5ozgm2_69 ._close_5ozgm2_146:hover{
213
219
  color:#FFFFFF;
214
220
  background-color:rgba(255,255,255,0.1);
215
221
  }
216
- ._themeLight_1lv49zg_61 ._close_1lv49zg_146:active{
222
+ ._themeLight_5ozgm2_61 ._close_5ozgm2_146:active{
217
223
  color:#19191C;
218
224
  background-color:rgba(25,25,28,0.2);
219
225
  }
220
- ._themeDark_1lv49zg_69 ._close_1lv49zg_146:active{
226
+ ._themeDark_5ozgm2_69 ._close_5ozgm2_146:active{
221
227
  color:#FFFFFF;
222
228
  background-color:rgba(255,255,255,0.2);
223
229
  }
224
- ._themeLight_1lv49zg_61 ._close_1lv49zg_146:focus[data-focus-method='key']{
230
+ ._themeLight_5ozgm2_61 ._close_5ozgm2_146:focus[data-focus-method='key']{
225
231
  -webkit-box-shadow:inset 0 0 0 4px #8979ff;
226
232
  -webkit-box-shadow:inset 0 0 0 4px var(--rs-color-primary-dim-light-theme, #8979ff);
227
233
  box-shadow:inset 0 0 0 4px #8979ff;
228
234
  box-shadow:inset 0 0 0 4px var(--rs-color-primary-dim-light-theme, #8979ff);
229
235
  }
230
- ._themeDark_1lv49zg_69 ._close_1lv49zg_146:focus[data-focus-method='key']{
236
+ ._themeDark_5ozgm2_69 ._close_5ozgm2_146:focus[data-focus-method='key']{
231
237
  -webkit-box-shadow:inset 0 0 0 4px #6f61d2;
232
238
  -webkit-box-shadow:inset 0 0 0 4px var(--rs-color-primary-dim-dark-theme, #6f61d2);
233
239
  box-shadow:inset 0 0 0 4px #6f61d2;
234
240
  box-shadow:inset 0 0 0 4px var(--rs-color-primary-dim-dark-theme, #6f61d2);
235
241
  }
236
- ._icon_1lv49zg_243{
242
+ ._icon_5ozgm2_243{
237
243
  -webkit-box-flex:1;
238
244
  -ms-flex:1 0 auto;
239
245
  flex:1 0 auto;
@@ -243,45 +249,47 @@
243
249
  vertical-align:top;
244
250
  fill:currentColor;
245
251
  }
246
- ._sizeXs_1lv49zg_48 ._icon_1lv49zg_243{
252
+ ._sizeXs_5ozgm2_48 ._icon_5ozgm2_243{
247
253
  width:20px;
248
254
  height:20px;
249
255
  margin-top:2px;
250
256
  margin-bottom:2px;
251
257
  }
252
- ._sizeS_1lv49zg_49 ._icon_1lv49zg_243{
258
+ ._sizeS_5ozgm2_49 ._icon_5ozgm2_243{
253
259
  width:20px;
254
260
  height:20px;
255
261
  margin-top:4px;
256
262
  margin-bottom:4px;
257
263
  }
258
- ._sizeM_1lv49zg_53 ._icon_1lv49zg_243{
264
+ ._sizeM_5ozgm2_53 ._icon_5ozgm2_243{
259
265
  width:24px;
260
266
  height:24px;
261
267
  margin-top:6px;
262
268
  margin-bottom:6px;
263
269
  }
264
- ._sizeL_1lv49zg_57 ._icon_1lv49zg_243{
270
+ ._sizeL_5ozgm2_57 ._icon_5ozgm2_243{
265
271
  width:28px;
266
272
  height:28px;
267
273
  margin-top:8px;
268
274
  margin-bottom:8px;
269
275
  }
270
276
 
271
- ._main_pambgr_25{
277
+ ._main_1xxxd5p_25{
272
278
  letter-spacing:0.0015em;
273
279
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
274
280
  font-family:var(--rs-font-family-ui, var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif));
281
+ -webkit-font-feature-settings:"kern", "liga", "calt";
282
+ font-feature-settings:"kern", "liga", "calt";
275
283
  font-size:16px;
276
284
  font-size:var(--rs-text-2-font-size, 16px);
277
285
  font-weight:400;
278
286
  line-height:24px;
279
287
  line-height:var(--rs-text-2-line-height, 24px);
280
288
  }
281
- ._rs-reset-letter-spacing_pambgr_1 ._main_pambgr_25{
289
+ ._rs-reset-letter-spacing_1xxxd5p_1 ._main_1xxxd5p_25{
282
290
  letter-spacing:normal;
283
291
  }
284
- ._main_pambgr_25 {
292
+ ._main_1xxxd5p_25 {
285
293
 
286
294
  position:relative;
287
295
 
@@ -310,70 +318,78 @@
310
318
 
311
319
  background:transparent;
312
320
  }
313
- ._alignIconLeft_pambgr_46{
321
+ ._alignIconLeft_1xxxd5p_46{
314
322
  -webkit-box-orient:horizontal;
315
323
  -webkit-box-direction:normal;
316
324
  -ms-flex-direction:row;
317
325
  flex-direction:row;
318
326
  }
319
- ._alignIconRight_pambgr_50{
327
+ ._alignIconRight_1xxxd5p_50{
320
328
  -webkit-box-orient:horizontal;
321
329
  -webkit-box-direction:reverse;
322
330
  -ms-flex-direction:row-reverse;
323
331
  flex-direction:row-reverse;
324
332
  }
325
- ._sizeXs_pambgr_54{
333
+ ._sizeXs_1xxxd5p_54{
326
334
  letter-spacing:0.0045em;
327
335
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
328
336
  font-family:var(--rs-font-family-ui, var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif));
337
+ -webkit-font-feature-settings:"kern", "liga", "calt";
338
+ font-feature-settings:"kern", "liga", "calt";
329
339
  font-size:13px;
330
340
  font-size:var(--rs-text-3-font-size, 13px);
331
341
  line-height:20px;
332
342
  line-height:var(--rs-text-3-line-height, 20px);
333
343
  }
334
- ._rs-reset-letter-spacing_pambgr_1 ._sizeXs_pambgr_54{
344
+ ._rs-reset-letter-spacing_1xxxd5p_1 ._sizeXs_1xxxd5p_54{
335
345
  letter-spacing:normal;
336
346
  }
337
- ._sizeXs_pambgr_54 {
347
+ ._sizeXs_1xxxd5p_54 {
338
348
 
339
349
  padding:1px 7px;
340
350
  }
341
- ._sizeS_pambgr_61{
351
+ ._sizeS_1xxxd5p_61{
342
352
  letter-spacing:0.0045em;
343
353
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
344
354
  font-family:var(--rs-font-family-ui, var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif));
355
+ -webkit-font-feature-settings:"kern", "liga", "calt";
356
+ font-feature-settings:"kern", "liga", "calt";
345
357
  font-size:13px;
346
358
  font-size:var(--rs-text-3-font-size, 13px);
347
359
  line-height:20px;
348
360
  line-height:var(--rs-text-3-line-height, 20px);
349
361
  }
350
- ._rs-reset-letter-spacing_pambgr_1 ._sizeS_pambgr_61{
362
+ ._rs-reset-letter-spacing_1xxxd5p_1 ._sizeS_1xxxd5p_61{
351
363
  letter-spacing:normal;
352
364
  }
353
- ._sizeS_pambgr_61 {
365
+ ._sizeS_1xxxd5p_61 {
354
366
 
355
367
  padding:3px 7px;
356
368
  }
357
- ._sizeM_pambgr_68{
369
+ ._sizeM_1xxxd5p_68{
358
370
  letter-spacing:0.0015em;
359
371
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
360
372
  font-family:var(--rs-font-family-ui, var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif));
373
+ -webkit-font-feature-settings:"kern", "liga", "calt";
374
+ font-feature-settings:"kern", "liga", "calt";
361
375
  font-size:16px;
362
376
  font-size:var(--rs-text-2-font-size, 16px);
363
377
  font-weight:400;
364
378
  line-height:24px;
365
379
  line-height:var(--rs-text-2-line-height, 24px);
366
380
  }
367
- ._rs-reset-letter-spacing_pambgr_1 ._sizeM_pambgr_68{
381
+ ._rs-reset-letter-spacing_1xxxd5p_1 ._sizeM_1xxxd5p_68{
368
382
  letter-spacing:normal;
369
383
  }
370
- ._sizeM_pambgr_68 {
384
+ ._sizeM_1xxxd5p_68 {
371
385
 
372
386
  padding:5px 11px;
373
387
  }
374
- ._sizeL_pambgr_75{
388
+ ._sizeL_1xxxd5p_75{
375
389
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
376
390
  font-family:var(--rs-font-family-ui, var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif));
391
+ -webkit-font-feature-settings:"kern", "liga", "calt";
392
+ font-feature-settings:"kern", "liga", "calt";
377
393
  font-size:19px;
378
394
  font-size:var(--rs-text-1-font-size, 19px);
379
395
  font-weight:normal;
@@ -382,155 +398,155 @@
382
398
 
383
399
  padding:7px 15px;
384
400
  }
385
- ._icon_pambgr_82{
401
+ ._icon_1xxxd5p_82{
386
402
  fill:currentColor;
387
403
  }
388
- ._sizeXs_pambgr_54 ._icon_pambgr_82{
404
+ ._sizeXs_1xxxd5p_54 ._icon_1xxxd5p_82{
389
405
  width:20px;
390
406
  height:20px;
391
407
  }
392
- ._sizeS_pambgr_61 ._icon_pambgr_82{
408
+ ._sizeS_1xxxd5p_61 ._icon_1xxxd5p_82{
393
409
  width:20px;
394
410
  height:20px;
395
411
  }
396
- ._sizeM_pambgr_68 ._icon_pambgr_82{
412
+ ._sizeM_1xxxd5p_68 ._icon_1xxxd5p_82{
397
413
  width:24px;
398
414
  height:24px;
399
415
  }
400
- ._sizeL_pambgr_75 ._icon_pambgr_82{
416
+ ._sizeL_1xxxd5p_75 ._icon_1xxxd5p_82{
401
417
  width:28px;
402
418
  height:28px;
403
419
  }
404
- ._alignIconLeft_pambgr_46 ._icon_pambgr_82{
420
+ ._alignIconLeft_1xxxd5p_46 ._icon_1xxxd5p_82{
405
421
  margin-right:8px;
406
422
  margin-left:0;
407
423
  }
408
- ._alignIconRight_pambgr_50 ._icon_pambgr_82{
424
+ ._alignIconRight_1xxxd5p_50 ._icon_1xxxd5p_82{
409
425
  margin-right:0;
410
426
  margin-left:8px;
411
427
  }
412
- ._uppercase_pambgr_116{
428
+ ._uppercase_1xxxd5p_116{
413
429
  text-transform:uppercase;
414
430
 
415
431
  font-weight:530;
416
432
 
417
433
  font-weight:var(--rs-font-weight-semi-bold, 530);
418
434
  }
419
- ._uppercase_pambgr_116._sizeS_pambgr_61{
435
+ ._uppercase_1xxxd5p_116._sizeS_1xxxd5p_61{
420
436
  padding-right:9px;
421
437
  padding-left:9px;
422
438
  }
423
439
 
424
- ._wrapper_11vprs6_10{
440
+ ._wrapper_1cxmre8_10{
425
441
  position:relative;
426
442
  }
427
- ._tag_11vprs6_14{
443
+ ._tag_1cxmre8_14{
428
444
  position:absolute;
429
445
  }
430
- ._alignTop_11vprs6_20._sizeXs_11vprs6_21{
446
+ ._alignTop_1cxmre8_20._sizeXs_1cxmre8_21{
431
447
  border-radius:4px 4px 0 0;
432
448
  }
433
- ._alignTop_11vprs6_20._sizeS_11vprs6_24{
449
+ ._alignTop_1cxmre8_20._sizeS_1cxmre8_24{
434
450
  border-radius:4px 4px 0 0;
435
451
  }
436
- ._alignTop_11vprs6_20._sizeM_11vprs6_27{
452
+ ._alignTop_1cxmre8_20._sizeM_1cxmre8_27{
437
453
  border-radius:6px 6px 0 0;
438
454
  }
439
- ._alignTop_11vprs6_20._sizeL_11vprs6_30{
455
+ ._alignTop_1cxmre8_20._sizeL_1cxmre8_30{
440
456
  border-radius:8px 8px 0 0;
441
457
  }
442
- ._alignMiddle_11vprs6_35._sizeXs_11vprs6_21{
458
+ ._alignMiddle_1cxmre8_35._sizeXs_1cxmre8_21{
443
459
  border-radius:4px;
444
460
  }
445
- ._alignMiddle_11vprs6_35._sizeS_11vprs6_24{
461
+ ._alignMiddle_1cxmre8_35._sizeS_1cxmre8_24{
446
462
  border-radius:4px;
447
463
  }
448
- ._alignMiddle_11vprs6_35._sizeM_11vprs6_27{
464
+ ._alignMiddle_1cxmre8_35._sizeM_1cxmre8_27{
449
465
  border-radius:6px;
450
466
  }
451
- ._alignMiddle_11vprs6_35._sizeL_11vprs6_30{
467
+ ._alignMiddle_1cxmre8_35._sizeL_1cxmre8_30{
452
468
  border-radius:8px;
453
469
  }
454
- ._top_11vprs6_52{
470
+ ._top_1cxmre8_52{
455
471
  top:0;
456
472
  }
457
- ._top_11vprs6_52._start_11vprs6_56._offset16_11vprs6_57{
473
+ ._top_1cxmre8_52._start_1cxmre8_56._offset16_1cxmre8_57{
458
474
  left:16px;
459
475
  }
460
- ._top_11vprs6_52._start_11vprs6_56._offset24_11vprs6_60{
476
+ ._top_1cxmre8_52._start_1cxmre8_56._offset24_1cxmre8_60{
461
477
  left:24px;
462
478
  }
463
- ._top_11vprs6_52._start_11vprs6_56._offset32_11vprs6_63{
479
+ ._top_1cxmre8_52._start_1cxmre8_56._offset32_1cxmre8_63{
464
480
  left:32px;
465
481
  }
466
- ._top_11vprs6_52._end_11vprs6_68._offset16_11vprs6_57{
482
+ ._top_1cxmre8_52._end_1cxmre8_68._offset16_1cxmre8_57{
467
483
  right:16px;
468
484
  }
469
- ._top_11vprs6_52._end_11vprs6_68._offset24_11vprs6_60{
485
+ ._top_1cxmre8_52._end_1cxmre8_68._offset24_1cxmre8_60{
470
486
  right:24px;
471
487
  }
472
- ._top_11vprs6_52._end_11vprs6_68._offset32_11vprs6_63{
488
+ ._top_1cxmre8_52._end_1cxmre8_68._offset32_1cxmre8_63{
473
489
  right:32px;
474
490
  }
475
- ._top_11vprs6_52._alignTop_11vprs6_20{
491
+ ._top_1cxmre8_52._alignTop_1cxmre8_20{
476
492
  -webkit-transform:translate(0, -100%);
477
493
  transform:translate(0, -100%);
478
494
  }
479
- ._top_11vprs6_52._alignMiddle_11vprs6_35{
495
+ ._top_1cxmre8_52._alignMiddle_1cxmre8_35{
480
496
  -webkit-transform:translate(0, -50%);
481
497
  transform:translate(0, -50%);
482
498
  }
483
- ._left_11vprs6_90{
499
+ ._left_1cxmre8_90{
484
500
  right:100%;
485
501
 
486
502
  -webkit-transform-origin:100% 0;
487
503
 
488
504
  transform-origin:100% 0;
489
505
  }
490
- ._left_11vprs6_90._start_11vprs6_56._offset16_11vprs6_57{
506
+ ._left_1cxmre8_90._start_1cxmre8_56._offset16_1cxmre8_57{
491
507
  top:16px;
492
508
  }
493
- ._left_11vprs6_90._start_11vprs6_56._offset24_11vprs6_60{
509
+ ._left_1cxmre8_90._start_1cxmre8_56._offset24_1cxmre8_60{
494
510
  top:24px;
495
511
  }
496
- ._left_11vprs6_90._start_11vprs6_56._offset32_11vprs6_63{
512
+ ._left_1cxmre8_90._start_1cxmre8_56._offset32_1cxmre8_63{
497
513
  top:32px;
498
514
  }
499
- ._left_11vprs6_90._end_11vprs6_68._offset16_11vprs6_57{
515
+ ._left_1cxmre8_90._end_1cxmre8_68._offset16_1cxmre8_57{
500
516
  top:calc(100% - 16px);
501
517
  }
502
- ._left_11vprs6_90._end_11vprs6_68._offset24_11vprs6_60{
518
+ ._left_1cxmre8_90._end_1cxmre8_68._offset24_1cxmre8_60{
503
519
  top:calc(100% - 24px);
504
520
  }
505
- ._left_11vprs6_90._end_11vprs6_68._offset32_11vprs6_63{
521
+ ._left_1cxmre8_90._end_1cxmre8_68._offset32_1cxmre8_63{
506
522
  top:calc(100% - 32px);
507
523
  }
508
- ._left_11vprs6_90._start_11vprs6_56._alignTop_11vprs6_20{
524
+ ._left_1cxmre8_90._start_1cxmre8_56._alignTop_1cxmre8_20{
509
525
  -webkit-transform:rotate(270deg) translate(0, -100%);
510
526
  transform:rotate(270deg) translate(0, -100%);
511
527
  }
512
- ._left_11vprs6_90._end_11vprs6_68._alignTop_11vprs6_20{
528
+ ._left_1cxmre8_90._end_1cxmre8_68._alignTop_1cxmre8_20{
513
529
  -webkit-transform:rotate(270deg) translate(100%, -100%);
514
530
  transform:rotate(270deg) translate(100%, -100%);
515
531
  }
516
- ._left_11vprs6_90._start_11vprs6_56._alignMiddle_11vprs6_35{
532
+ ._left_1cxmre8_90._start_1cxmre8_56._alignMiddle_1cxmre8_35{
517
533
  -webkit-transform:rotate(270deg) translate(0, -50%);
518
534
  transform:rotate(270deg) translate(0, -50%);
519
535
  }
520
- ._left_11vprs6_90._end_11vprs6_68._alignMiddle_11vprs6_35{
536
+ ._left_1cxmre8_90._end_1cxmre8_68._alignMiddle_1cxmre8_35{
521
537
  -webkit-transform:rotate(270deg) translate(100%, -50%);
522
538
  transform:rotate(270deg) translate(100%, -50%);
523
539
  }
524
540
 
525
- ._sizeXs_3zb0vj_9{
541
+ ._sizeXs_11defeh_9{
526
542
  border-radius:4px;
527
543
  }
528
- ._sizeS_3zb0vj_13{
544
+ ._sizeS_11defeh_13{
529
545
  border-radius:4px;
530
546
  }
531
- ._sizeM_3zb0vj_17{
547
+ ._sizeM_11defeh_17{
532
548
  border-radius:6px;
533
549
  }
534
- ._sizeL_3zb0vj_21{
550
+ ._sizeL_11defeh_21{
535
551
  border-radius:8px;
536
552
  }
package/lib/parts/base-tag.p.module.css.js CHANGED
@@ -1,13 +1,13 @@
1
1
  var styles = {
2
- "main": "_main_pambgr_25",
3
- "rs-reset-letter-spacing": "_rs-reset-letter-spacing_pambgr_1",
4
- "alignIconLeft": "_alignIconLeft_pambgr_46",
5
- "alignIconRight": "_alignIconRight_pambgr_50",
6
- "sizeXs": "_sizeXs_pambgr_54",
7
- "sizeS": "_sizeS_pambgr_61",
8
- "sizeM": "_sizeM_pambgr_68",
9
- "sizeL": "_sizeL_pambgr_75",
10
- "icon": "_icon_pambgr_82",
11
- "uppercase": "_uppercase_pambgr_116"
2
+ "main": "_main_1xxxd5p_25",
3
+ "rs-reset-letter-spacing": "_rs-reset-letter-spacing_1xxxd5p_1",
4
+ "alignIconLeft": "_alignIconLeft_1xxxd5p_46",
5
+ "alignIconRight": "_alignIconRight_1xxxd5p_50",
6
+ "sizeXs": "_sizeXs_1xxxd5p_54",
7
+ "sizeS": "_sizeS_1xxxd5p_61",
8
+ "sizeM": "_sizeM_1xxxd5p_68",
9
+ "sizeL": "_sizeL_1xxxd5p_75",
10
+ "icon": "_icon_1xxxd5p_82",
11
+ "uppercase": "_uppercase_1xxxd5p_116"
12
12
  };
13
13
  export { styles as default };
package/lib/parts/presets.d.ts CHANGED
@@ -1,9 +1,57 @@
1
1
  export declare type Preset = {
2
+ /** Tag text color */
2
3
  color: string;
4
+ /** Tag background color */
3
5
  backgroundColor?: string;
6
+ /** Tag border color */
4
7
  borderColor?: string;
5
8
  };
6
- export declare type Presets = {
7
- [key: string]: Preset;
9
+ declare const presetsLight: {
10
+ /** Primary background */
11
+ classicLight: {
12
+ color: "#FFFFFF";
13
+ backgroundColor: "var(--rs-color-primary-light-theme, #6B57FF)";
14
+ };
15
+ /** Contrast background */
16
+ rockLight: {
17
+ color: "#FFFFFF";
18
+ backgroundColor: "#19191C";
19
+ };
20
+ /** Grey background */
21
+ filledLight: {
22
+ color: "rgba(25,25,28,0.7)";
23
+ backgroundColor: "rgba(25,25,28,0.1)";
24
+ };
25
+ /** Transparent with border */
26
+ outlineLight: {
27
+ color: "#19191C";
28
+ borderColor: "#19191C";
29
+ };
8
30
  };
31
+ declare const presetsDark: {
32
+ /** Primary background */
33
+ classicDark: {
34
+ color: "#FFFFFF";
35
+ backgroundColor: "var(--rs-color-primary-dark-theme, #8473FF)";
36
+ };
37
+ /** Contrast background */
38
+ rockDark: {
39
+ color: "#19191C";
40
+ backgroundColor: "#FFFFFF";
41
+ };
42
+ /** Grey background */
43
+ filledDark: {
44
+ color: "rgba(255,255,255,0.7)";
45
+ backgroundColor: "rgba(255,255,255,0.1)";
46
+ };
47
+ /** Transparent with border */
48
+ outlineDark: {
49
+ color: "#FFFFFF";
50
+ borderColor: "#FFFFFF";
51
+ };
52
+ };
53
+ export declare type PresetsLight = typeof presetsLight;
54
+ export declare type PresetsDark = typeof presetsDark;
55
+ export declare type Presets = Record<keyof PresetsLight | keyof PresetsDark, Preset>;
9
56
  export declare const presets: Presets;
57
+ export {};
package/lib/parts/presets.js CHANGED
@@ -1,36 +1,68 @@
1
+ import "core-js/modules/es.object.to-string.js";
2
+ import "core-js/modules/web.dom-collections.for-each.js";
3
+ import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
4
+ import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
5
+ import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
6
+ import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
7
+ import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
8
+ import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
9
+
10
+ function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
11
+
12
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? Object.defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
13
+
1
14
  import { RS_COLOR_WHITE, RS_COLOR_PRIMARY_LIGHT_THEME, RS_COLOR_BLACK, RS_COLOR_BLACK_T70, RS_COLOR_BLACK_T10, RS_COLOR_PRIMARY_DARK_THEME, RS_COLOR_WHITE_T70, RS_COLOR_WHITE_T10 } from '@rescui/colors';
2
- var presets = {
15
+ var presetsLight = {
16
+ /** Primary background */
3
17
  classicLight: {
4
18
  color: RS_COLOR_WHITE,
5
19
  backgroundColor: "var(--rs-color-primary-light-theme, ".concat(RS_COLOR_PRIMARY_LIGHT_THEME, ")")
6
20
  },
21
+
22
+ /** Contrast background */
7
23
  rockLight: {
8
24
  color: RS_COLOR_WHITE,
9
25
  backgroundColor: RS_COLOR_BLACK
10
26
  },
27
+
28
+ /** Grey background */
11
29
  filledLight: {
12
30
  color: RS_COLOR_BLACK_T70,
13
31
  backgroundColor: RS_COLOR_BLACK_T10
14
32
  },
33
+
34
+ /** Transparent with border */
15
35
  outlineLight: {
16
36
  color: RS_COLOR_BLACK,
17
37
  borderColor: RS_COLOR_BLACK
18
- },
38
+ }
39
+ };
40
+ var presetsDark = {
41
+ /** Primary background */
19
42
  classicDark: {
20
43
  color: RS_COLOR_WHITE,
21
44
  backgroundColor: "var(--rs-color-primary-dark-theme, ".concat(RS_COLOR_PRIMARY_DARK_THEME, ")")
22
45
  },
46
+
47
+ /** Contrast background */
23
48
  rockDark: {
24
49
  color: RS_COLOR_BLACK,
25
50
  backgroundColor: RS_COLOR_WHITE
26
51
  },
52
+
53
+ /** Grey background */
27
54
  filledDark: {
28
55
  color: RS_COLOR_WHITE_T70,
29
56
  backgroundColor: RS_COLOR_WHITE_T10
30
57
  },
58
+
59
+ /** Transparent with border */
31
60
  outlineDark: {
32
61
  color: RS_COLOR_WHITE,
33
62
  borderColor: RS_COLOR_WHITE
34
63
  }
35
64
  };
65
+
66
+ var presets = _objectSpread(_objectSpread({}, presetsLight), presetsDark);
67
+
36
68
  export { presets };
package/lib/parts/removable-tag.p.module.css.js CHANGED
@@ -1,16 +1,16 @@
1
1
  var styles = {
2
- "wrapper": "_wrapper_1lv49zg_36",
3
- "sizeXs": "_sizeXs_1lv49zg_48",
4
- "sizeS": "_sizeS_1lv49zg_49",
5
- "rs-reset-letter-spacing": "_rs-reset-letter-spacing_1lv49zg_1",
6
- "sizeM": "_sizeM_1lv49zg_53",
7
- "sizeL": "_sizeL_1lv49zg_57",
8
- "themeLight": "_themeLight_1lv49zg_61",
9
- "disabled": "_disabled_1lv49zg_65",
10
- "themeDark": "_themeDark_1lv49zg_69",
11
- "main": "_main_1lv49zg_110",
12
- "wrap": "_wrap_1lv49zg_36",
13
- "close": "_close_1lv49zg_146",
14
- "icon": "_icon_1lv49zg_243"
2
+ "wrapper": "_wrapper_5ozgm2_36",
3
+ "sizeXs": "_sizeXs_5ozgm2_48",
4
+ "sizeS": "_sizeS_5ozgm2_49",
5
+ "rs-reset-letter-spacing": "_rs-reset-letter-spacing_5ozgm2_1",
6
+ "sizeM": "_sizeM_5ozgm2_53",
7
+ "sizeL": "_sizeL_5ozgm2_57",
8
+ "themeLight": "_themeLight_5ozgm2_61",
9
+ "disabled": "_disabled_5ozgm2_65",
10
+ "themeDark": "_themeDark_5ozgm2_69",
11
+ "main": "_main_5ozgm2_110",
12
+ "wrap": "_wrap_5ozgm2_36",
13
+ "close": "_close_5ozgm2_146",
14
+ "icon": "_icon_5ozgm2_243"
15
15
  };
16
16
  export { styles as default };
package/lib/parts/sticky-tag.d.ts CHANGED
@@ -24,15 +24,15 @@ export declare type StickyTagProps = {
24
24
  align?: StickyTagAlign;
25
25
  /** Offset from the edge */
26
26
  offset?: StickyTagOffset;
27
- /** Text color */
27
+ /** Text color. See [Presets](/components/tag/presets) page. */
28
28
  color?: string;
29
29
  /**
30
- * Background color.
30
+ * Background color. See [Presets](/components/tag/presets) page.
31
31
  * @default transparent
32
32
  * */
33
33
  backgroundColor?: string;
34
34
  /**
35
- * Border color.
35
+ * Border color. See [Presets](/components/tag/presets) page.
36
36
  * @default transparent
37
37
  * */
38
38
  borderColor?: string;
package/lib/parts/sticky-tag.p.module.css.js CHANGED
@@ -1,18 +1,18 @@
1
1
  var styles = {
2
- "wrapper": "_wrapper_11vprs6_10",
3
- "tag": "_tag_11vprs6_14",
4
- "alignTop": "_alignTop_11vprs6_20",
5
- "sizeXs": "_sizeXs_11vprs6_21",
6
- "sizeS": "_sizeS_11vprs6_24",
7
- "sizeM": "_sizeM_11vprs6_27",
8
- "sizeL": "_sizeL_11vprs6_30",
9
- "alignMiddle": "_alignMiddle_11vprs6_35",
10
- "top": "_top_11vprs6_52",
11
- "start": "_start_11vprs6_56",
12
- "offset16": "_offset16_11vprs6_57",
13
- "offset24": "_offset24_11vprs6_60",
14
- "offset32": "_offset32_11vprs6_63",
15
- "end": "_end_11vprs6_68",
16
- "left": "_left_11vprs6_90"
2
+ "wrapper": "_wrapper_1cxmre8_10",
3
+ "tag": "_tag_1cxmre8_14",
4
+ "alignTop": "_alignTop_1cxmre8_20",
5
+ "sizeXs": "_sizeXs_1cxmre8_21",
6
+ "sizeS": "_sizeS_1cxmre8_24",
7
+ "sizeM": "_sizeM_1cxmre8_27",
8
+ "sizeL": "_sizeL_1cxmre8_30",
9
+ "alignMiddle": "_alignMiddle_1cxmre8_35",
10
+ "top": "_top_1cxmre8_52",
11
+ "start": "_start_1cxmre8_56",
12
+ "offset16": "_offset16_1cxmre8_57",
13
+ "offset24": "_offset24_1cxmre8_60",
14
+ "offset32": "_offset32_1cxmre8_63",
15
+ "end": "_end_1cxmre8_68",
16
+ "left": "_left_1cxmre8_90"
17
17
  };
18
18
  export { styles as default };
package/lib/parts/tag.p.module.css.js CHANGED
@@ -1,7 +1,7 @@
1
1
  var styles = {
2
- "sizeXs": "_sizeXs_3zb0vj_9",
3
- "sizeS": "_sizeS_3zb0vj_13",
4
- "sizeM": "_sizeM_3zb0vj_17",
5
- "sizeL": "_sizeL_3zb0vj_21"
2
+ "sizeXs": "_sizeXs_11defeh_9",
3
+ "sizeS": "_sizeS_11defeh_13",
4
+ "sizeM": "_sizeM_11defeh_17",
5
+ "sizeL": "_sizeL_11defeh_21"
6
6
  };
7
7
  export { styles as default };
package/lib/tag.d.ts CHANGED
@@ -11,15 +11,15 @@ export declare type TagProps = {
11
11
  size?: TagSize;
12
12
  /** Should the content be uppercase */
13
13
  isUppercase?: boolean;
14
- /** Text color */
14
+ /** Text color. See [Presets](/components/tag/presets) page. */
15
15
  color?: string;
16
16
  /**
17
- * Background color.
17
+ * Background color. See [Presets](/components/tag/presets) page.
18
18
  * @default transparent
19
19
  * */
20
20
  backgroundColor?: string;
21
21
  /**
22
- * Border color.
22
+ * Border color. See [Presets](/components/tag/presets) page.
23
23
  * @default transparent
24
24
  * */
25
25
  borderColor?: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rescui/tag",
3
- "version": "0.4.0",
3
+ "version": "0.5.0",
4
4
  "description": "",
5
5
  "license": "Apache-2.0",
6
6
  "author": "JetBrains",
@@ -15,8 +15,8 @@
15
15
  },
16
16
  "dependencies": {
17
17
  "@babel/runtime-corejs3": "^7.14.0",
18
- "@rescui/colors": "^0.1.4",
19
- "@rescui/icons": "^0.10.1",
18
+ "@rescui/colors": "^0.1.5",
19
+ "@rescui/icons": "^0.10.3",
20
20
  "classnames": "^2.3.1",
21
21
  "core-js": "^3.9.1"
22
22
  },
@@ -27,10 +27,10 @@
27
27
  },
28
28
  "devDependencies": {
29
29
  "@rescui/scripts": "^0.1.7",
30
- "@rescui/typography": "^0.8.1"
30
+ "@rescui/typography": "^0.8.3"
31
31
  },
32
32
  "scripts": {
33
33
  "build": "rescui-scripts build"
34
34
  },
35
- "gitHead": "a5f17fe15635423a27d4f69cdacd3c24bae7e80b"
35
+ "gitHead": "20a2d86279a96ad1375a69513d550bdc983f9616"
36
36
  }