@rescui/tag 0.7.1 → 0.8.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 (14) hide show
  1. package/lib/index.css +104 -108
  2. package/lib/parts/base-tag.d.ts +3 -1
  3. package/lib/parts/base-tag.js +5 -3
  4. package/lib/parts/base-tag.p.module.css.js +10 -10
  5. package/lib/parts/presets.d.ts +152 -15
  6. package/lib/parts/presets.js +81 -17
  7. package/lib/parts/removable-tag.p.module.css.js +13 -13
  8. package/lib/parts/sticky-tag.d.ts +3 -1
  9. package/lib/parts/sticky-tag.js +2 -1
  10. package/lib/parts/sticky-tag.p.module.css.js +15 -15
  11. package/lib/parts/tag.p.module.css.js +4 -4
  12. package/lib/tag.d.ts +3 -1
  13. package/lib/tag.js +2 -1
  14. package/package.json +2 -2
package/lib/index.css CHANGED
@@ -1,4 +1,4 @@
1
- ._main_1uoszgd_25{
1
+ ._main_1lmo5uq_25{
2
2
  letter-spacing:0.0015em;
3
3
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
4
4
  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));
@@ -10,10 +10,10 @@
10
10
  line-height:24px;
11
11
  line-height:var(--rs-text-2-line-height, 24px);
12
12
  }
13
- ._rs-reset-letter-spacing_1uoszgd_1 ._main_1uoszgd_25{
13
+ ._rs-reset-letter-spacing_1lmo5uq_1 ._main_1lmo5uq_25{
14
14
  letter-spacing:normal;
15
15
  }
16
- ._main_1uoszgd_25 {
16
+ ._main_1lmo5uq_25 {
17
17
 
18
18
  position:relative;
19
19
 
@@ -42,19 +42,19 @@
42
42
 
43
43
  background:transparent;
44
44
  }
45
- ._alignIconLeft_1uoszgd_46{
45
+ ._alignIconLeft_1lmo5uq_46{
46
46
  -webkit-box-orient:horizontal;
47
47
  -webkit-box-direction:normal;
48
48
  -ms-flex-direction:row;
49
49
  flex-direction:row;
50
50
  }
51
- ._alignIconRight_1uoszgd_50{
51
+ ._alignIconRight_1lmo5uq_50{
52
52
  -webkit-box-orient:horizontal;
53
53
  -webkit-box-direction:reverse;
54
54
  -ms-flex-direction:row-reverse;
55
55
  flex-direction:row-reverse;
56
56
  }
57
- ._sizeXs_1uoszgd_54{
57
+ ._sizeXs_1lmo5uq_54{
58
58
  letter-spacing:0.0045em;
59
59
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
60
60
  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));
@@ -65,14 +65,14 @@
65
65
  line-height:20px;
66
66
  line-height:var(--rs-text-3-line-height, 20px);
67
67
  }
68
- ._rs-reset-letter-spacing_1uoszgd_1 ._sizeXs_1uoszgd_54{
68
+ ._rs-reset-letter-spacing_1lmo5uq_1 ._sizeXs_1lmo5uq_54{
69
69
  letter-spacing:normal;
70
70
  }
71
- ._sizeXs_1uoszgd_54 {
71
+ ._sizeXs_1lmo5uq_54 {
72
72
 
73
73
  padding:1px 7px;
74
74
  }
75
- ._sizeS_1uoszgd_61{
75
+ ._sizeS_1lmo5uq_61{
76
76
  letter-spacing:0.0045em;
77
77
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
78
78
  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));
@@ -83,14 +83,14 @@
83
83
  line-height:20px;
84
84
  line-height:var(--rs-text-3-line-height, 20px);
85
85
  }
86
- ._rs-reset-letter-spacing_1uoszgd_1 ._sizeS_1uoszgd_61{
86
+ ._rs-reset-letter-spacing_1lmo5uq_1 ._sizeS_1lmo5uq_61{
87
87
  letter-spacing:normal;
88
88
  }
89
- ._sizeS_1uoszgd_61 {
89
+ ._sizeS_1lmo5uq_61 {
90
90
 
91
91
  padding:3px 7px;
92
92
  }
93
- ._sizeM_1uoszgd_68{
93
+ ._sizeM_1lmo5uq_68{
94
94
  letter-spacing:0.0015em;
95
95
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
96
96
  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));
@@ -102,14 +102,14 @@
102
102
  line-height:24px;
103
103
  line-height:var(--rs-text-2-line-height, 24px);
104
104
  }
105
- ._rs-reset-letter-spacing_1uoszgd_1 ._sizeM_1uoszgd_68{
105
+ ._rs-reset-letter-spacing_1lmo5uq_1 ._sizeM_1lmo5uq_68{
106
106
  letter-spacing:normal;
107
107
  }
108
- ._sizeM_1uoszgd_68 {
108
+ ._sizeM_1lmo5uq_68 {
109
109
 
110
110
  padding:5px 11px;
111
111
  }
112
- ._sizeL_1uoszgd_75{
112
+ ._sizeL_1lmo5uq_75{
113
113
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
114
114
  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));
115
115
  -webkit-font-feature-settings:"kern", "liga", "calt";
@@ -122,59 +122,55 @@
122
122
 
123
123
  padding:7px 15px;
124
124
  }
125
- ._icon_1uoszgd_82{
125
+ ._icon_1lmo5uq_82{
126
126
  fill:currentColor;
127
127
  }
128
- ._sizeXs_1uoszgd_54 ._icon_1uoszgd_82{
128
+ ._sizeXs_1lmo5uq_54 ._icon_1lmo5uq_82{
129
129
  width:20px;
130
130
  height:20px;
131
131
  }
132
- ._sizeS_1uoszgd_61 ._icon_1uoszgd_82{
132
+ ._sizeS_1lmo5uq_61 ._icon_1lmo5uq_82{
133
133
  width:20px;
134
134
  height:20px;
135
135
  }
136
- ._sizeM_1uoszgd_68 ._icon_1uoszgd_82{
136
+ ._sizeM_1lmo5uq_68 ._icon_1lmo5uq_82{
137
137
  width:24px;
138
138
  height:24px;
139
139
  }
140
- ._sizeL_1uoszgd_75 ._icon_1uoszgd_82{
140
+ ._sizeL_1lmo5uq_75 ._icon_1lmo5uq_82{
141
141
  width:28px;
142
142
  height:28px;
143
143
  }
144
- ._alignIconLeft_1uoszgd_46 ._icon_1uoszgd_82{
144
+ ._alignIconLeft_1lmo5uq_46 ._icon_1lmo5uq_82{
145
145
  margin-right:8px;
146
146
  margin-left:0;
147
147
  }
148
- ._alignIconRight_1uoszgd_50 ._icon_1uoszgd_82{
148
+ ._alignIconRight_1lmo5uq_50 ._icon_1lmo5uq_82{
149
149
  margin-right:0;
150
150
  margin-left:8px;
151
151
  }
152
- ._uppercase_1uoszgd_116{
152
+ ._uppercase_1lmo5uq_116{
153
153
  text-transform:uppercase;
154
-
155
- font-weight:530;
156
-
157
- font-weight:var(--rs-font-weight-semi-bold, 530);
158
154
  }
159
- ._uppercase_1uoszgd_116._sizeS_1uoszgd_61{
155
+ ._uppercase_1lmo5uq_116._sizeS_1lmo5uq_61{
160
156
  padding-right:9px;
161
157
  padding-left:9px;
162
158
  }
163
159
 
164
- ._sizeXs_qp3fbt_9{
160
+ ._sizeXs_1co71lk_9{
165
161
  border-radius:4px;
166
162
  }
167
- ._sizeS_qp3fbt_13{
163
+ ._sizeS_1co71lk_13{
168
164
  border-radius:4px;
169
165
  }
170
- ._sizeM_qp3fbt_17{
166
+ ._sizeM_1co71lk_17{
171
167
  border-radius:6px;
172
168
  }
173
- ._sizeL_qp3fbt_21{
169
+ ._sizeL_1co71lk_21{
174
170
  border-radius:8px;
175
171
  }
176
172
 
177
- ._wrapper_4e3oje_36{
173
+ ._wrapper_1o14hrv_36{
178
174
  position:relative;
179
175
 
180
176
  display:-webkit-inline-box;
@@ -186,11 +182,11 @@
186
182
  white-space:nowrap;
187
183
  }
188
184
 
189
- ._wrapper_4e3oje_36 > *{
185
+ ._wrapper_1o14hrv_36 > *{
190
186
  vertical-align:top;
191
187
  }
192
- ._sizeXs_4e3oje_48,
193
- ._sizeS_4e3oje_49{
188
+ ._sizeXs_1o14hrv_48,
189
+ ._sizeS_1o14hrv_49{
194
190
  letter-spacing:0.0045em;
195
191
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
196
192
  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));
@@ -201,10 +197,10 @@
201
197
  line-height:20px;
202
198
  line-height:var(--rs-text-3-line-height, 20px);
203
199
  }
204
- ._rs-reset-letter-spacing_4e3oje_1 ._sizeXs_4e3oje_48,._rs-reset-letter-spacing_4e3oje_1 ._sizeS_4e3oje_49{
200
+ ._rs-reset-letter-spacing_1o14hrv_1 ._sizeXs_1o14hrv_48,._rs-reset-letter-spacing_1o14hrv_1 ._sizeS_1o14hrv_49{
205
201
  letter-spacing:normal;
206
202
  }
207
- ._sizeM_4e3oje_53{
203
+ ._sizeM_1o14hrv_53{
208
204
  letter-spacing:0.0015em;
209
205
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
210
206
  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));
@@ -216,10 +212,10 @@
216
212
  line-height:24px;
217
213
  line-height:var(--rs-text-2-line-height, 24px);
218
214
  }
219
- ._rs-reset-letter-spacing_4e3oje_1 ._sizeM_4e3oje_53{
215
+ ._rs-reset-letter-spacing_1o14hrv_1 ._sizeM_1o14hrv_53{
220
216
  letter-spacing:normal;
221
217
  }
222
- ._sizeL_4e3oje_57{
218
+ ._sizeL_1o14hrv_57{
223
219
  font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
224
220
  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));
225
221
  -webkit-font-feature-settings:"kern", "liga", "calt";
@@ -230,52 +226,52 @@
230
226
  line-height:28px;
231
227
  line-height:var(--rs-text-1-line-height, 28px);
232
228
  }
233
- ._themeLight_4e3oje_61{
229
+ ._themeLight_1o14hrv_61{
234
230
  color:rgba(25,25,28,0.7);
235
231
  color:var(--rs-typography-color-average, rgba(25,25,28,0.7));
236
232
  }
237
- ._themeLight_4e3oje_61._disabled_4e3oje_65{
233
+ ._themeLight_1o14hrv_61._disabled_1o14hrv_65{
238
234
  color:rgba(25,25,28,0.5);
239
235
  color:var(--rs-typography-color-pale, rgba(25,25,28,0.5));
240
236
  }
241
- ._themeDark_4e3oje_69{
237
+ ._themeDark_1o14hrv_69{
242
238
  color:rgba(255,255,255,0.7);
243
239
  color:var(--rs-typography-color-average, rgba(255,255,255,0.7));
244
240
  }
245
- ._themeDark_4e3oje_69._disabled_4e3oje_65{
241
+ ._themeDark_1o14hrv_69._disabled_1o14hrv_65{
246
242
  color:rgba(255,255,255,0.5);
247
243
  color:var(--rs-typography-color-pale, rgba(255,255,255,0.5));
248
244
  }
249
- ._disabled_4e3oje_65{
245
+ ._disabled_1o14hrv_65{
250
246
  pointer-events:none;
251
247
  }
252
- ._sizeXs_4e3oje_48{
248
+ ._sizeXs_1o14hrv_48{
253
249
  padding-left:8px;
254
250
 
255
251
  border-radius:4px;
256
252
  }
257
- ._sizeS_4e3oje_49{
253
+ ._sizeS_1o14hrv_49{
258
254
  padding-left:8px;
259
255
 
260
256
  border-radius:4px;
261
257
  }
262
- ._sizeM_4e3oje_53{
258
+ ._sizeM_1o14hrv_53{
263
259
  padding-left:12px;
264
260
 
265
261
  border-radius:6px;
266
262
  }
267
- ._sizeL_4e3oje_57{
263
+ ._sizeL_1o14hrv_57{
268
264
  padding-left:16px;
269
265
 
270
266
  border-radius:8px;
271
267
  }
272
- ._themeLight_4e3oje_61{
268
+ ._themeLight_1o14hrv_61{
273
269
  background-color:rgba(25,25,28,0.1);
274
270
  }
275
- ._themeDark_4e3oje_69{
271
+ ._themeDark_1o14hrv_69{
276
272
  background-color:rgba(255,255,255,0.1);
277
273
  }
278
- ._main_4e3oje_110{
274
+ ._main_1o14hrv_110{
279
275
  display:-webkit-inline-box;
280
276
  display:-ms-inline-flexbox;
281
277
  display:inline-flex;
@@ -293,30 +289,30 @@
293
289
 
294
290
  background:transparent;
295
291
  }
296
- ._wrap_4e3oje_36 ._main_4e3oje_110{
292
+ ._wrap_1o14hrv_36 ._main_1o14hrv_110{
297
293
  white-space:normal;
298
294
  }
299
- ._sizeXs_4e3oje_48 ._main_4e3oje_110{
295
+ ._sizeXs_1o14hrv_48 ._main_1o14hrv_110{
300
296
  padding-top:2px;
301
297
  padding-right:2px;
302
298
  padding-bottom:2px;
303
299
  }
304
- ._sizeS_4e3oje_49 ._main_4e3oje_110{
300
+ ._sizeS_1o14hrv_49 ._main_1o14hrv_110{
305
301
  padding-top:4px;
306
302
  padding-right:2px;
307
303
  padding-bottom:4px;
308
304
  }
309
- ._sizeM_4e3oje_53 ._main_4e3oje_110{
305
+ ._sizeM_1o14hrv_53 ._main_1o14hrv_110{
310
306
  padding-top:6px;
311
307
  padding-right:2px;
312
308
  padding-bottom:6px;
313
309
  }
314
- ._sizeL_4e3oje_57 ._main_4e3oje_110{
310
+ ._sizeL_1o14hrv_57 ._main_1o14hrv_110{
315
311
  padding-top:8px;
316
312
  padding-right:4px;
317
313
  padding-bottom:8px;
318
314
  }
319
- ._close_4e3oje_146{
315
+ ._close_1o14hrv_146{
320
316
  top:0;
321
317
  right:0;
322
318
  bottom:0;
@@ -352,70 +348,70 @@
352
348
  -webkit-font-smoothing:inherit;
353
349
  -moz-osx-font-smoothing:inherit;
354
350
  }
355
- ._close_4e3oje_146::-moz-focus-inner{
351
+ ._close_1o14hrv_146::-moz-focus-inner{
356
352
  padding:0;
357
353
 
358
354
  border:0;
359
355
  }
360
- ._close_4e3oje_146:active,
361
- ._close_4e3oje_146:hover,
362
- ._close_4e3oje_146:focus{
356
+ ._close_1o14hrv_146:active,
357
+ ._close_1o14hrv_146:hover,
358
+ ._close_1o14hrv_146:focus{
363
359
  outline:none;
364
360
 
365
361
  text-decoration:none;
366
362
  }
367
- ._sizeXs_4e3oje_48 ._close_4e3oje_146{
363
+ ._sizeXs_1o14hrv_48 ._close_1o14hrv_146{
368
364
  width:28px;
369
365
 
370
366
  border-radius:4px;
371
367
  }
372
- ._sizeS_4e3oje_49 ._close_4e3oje_146{
368
+ ._sizeS_1o14hrv_49 ._close_1o14hrv_146{
373
369
  width:28px;
374
370
 
375
371
  border-radius:4px;
376
372
  }
377
- ._sizeM_4e3oje_53 ._close_4e3oje_146{
373
+ ._sizeM_1o14hrv_53 ._close_1o14hrv_146{
378
374
  width:36px;
379
375
 
380
376
  border-radius:6px;
381
377
  }
382
- ._sizeL_4e3oje_57 ._close_4e3oje_146{
378
+ ._sizeL_1o14hrv_57 ._close_1o14hrv_146{
383
379
  width:44px;
384
380
 
385
381
  border-radius:8px;
386
382
  }
387
- ._disabled_4e3oje_65 ._close_4e3oje_146{
383
+ ._disabled_1o14hrv_65 ._close_1o14hrv_146{
388
384
  pointer-events:none;
389
385
  }
390
- ._themeLight_4e3oje_61 ._close_4e3oje_146:hover{
386
+ ._themeLight_1o14hrv_61 ._close_1o14hrv_146:hover{
391
387
  color:#19191C;
392
388
  background-color:rgba(25,25,28,0.1);
393
389
  }
394
- ._themeDark_4e3oje_69 ._close_4e3oje_146:hover{
390
+ ._themeDark_1o14hrv_69 ._close_1o14hrv_146:hover{
395
391
  color:#FFFFFF;
396
392
  background-color:rgba(255,255,255,0.1);
397
393
  }
398
- ._themeLight_4e3oje_61 ._close_4e3oje_146:active{
394
+ ._themeLight_1o14hrv_61 ._close_1o14hrv_146:active{
399
395
  color:#19191C;
400
396
  background-color:rgba(25,25,28,0.2);
401
397
  }
402
- ._themeDark_4e3oje_69 ._close_4e3oje_146:active{
398
+ ._themeDark_1o14hrv_69 ._close_1o14hrv_146:active{
403
399
  color:#FFFFFF;
404
400
  background-color:rgba(255,255,255,0.2);
405
401
  }
406
- ._themeLight_4e3oje_61 ._close_4e3oje_146:focus[data-focus-method='key']{
402
+ ._themeLight_1o14hrv_61 ._close_1o14hrv_146:focus[data-focus-method='key']{
407
403
  -webkit-box-shadow:inset 0 0 0 4px #8979ff;
408
404
  -webkit-box-shadow:inset 0 0 0 4px var(--rs-color-primary-dim-light-theme, #8979ff);
409
405
  box-shadow:inset 0 0 0 4px #8979ff;
410
406
  box-shadow:inset 0 0 0 4px var(--rs-color-primary-dim-light-theme, #8979ff);
411
407
  }
412
- ._themeDark_4e3oje_69 ._close_4e3oje_146:focus[data-focus-method='key']{
408
+ ._themeDark_1o14hrv_69 ._close_1o14hrv_146:focus[data-focus-method='key']{
413
409
  -webkit-box-shadow:inset 0 0 0 4px #6f61d2;
414
410
  -webkit-box-shadow:inset 0 0 0 4px var(--rs-color-primary-dim-dark-theme, #6f61d2);
415
411
  box-shadow:inset 0 0 0 4px #6f61d2;
416
412
  box-shadow:inset 0 0 0 4px var(--rs-color-primary-dim-dark-theme, #6f61d2);
417
413
  }
418
- ._icon_4e3oje_243{
414
+ ._icon_1o14hrv_243{
419
415
  -webkit-box-flex:1;
420
416
  -ms-flex:1 0 auto;
421
417
  flex:1 0 auto;
@@ -425,128 +421,128 @@
425
421
  vertical-align:top;
426
422
  fill:currentColor;
427
423
  }
428
- ._sizeXs_4e3oje_48 ._icon_4e3oje_243{
424
+ ._sizeXs_1o14hrv_48 ._icon_1o14hrv_243{
429
425
  width:20px;
430
426
  height:20px;
431
427
  margin-top:2px;
432
428
  margin-bottom:2px;
433
429
  }
434
- ._sizeS_4e3oje_49 ._icon_4e3oje_243{
430
+ ._sizeS_1o14hrv_49 ._icon_1o14hrv_243{
435
431
  width:20px;
436
432
  height:20px;
437
433
  margin-top:4px;
438
434
  margin-bottom:4px;
439
435
  }
440
- ._sizeM_4e3oje_53 ._icon_4e3oje_243{
436
+ ._sizeM_1o14hrv_53 ._icon_1o14hrv_243{
441
437
  width:24px;
442
438
  height:24px;
443
439
  margin-top:6px;
444
440
  margin-bottom:6px;
445
441
  }
446
- ._sizeL_4e3oje_57 ._icon_4e3oje_243{
442
+ ._sizeL_1o14hrv_57 ._icon_1o14hrv_243{
447
443
  width:28px;
448
444
  height:28px;
449
445
  margin-top:8px;
450
446
  margin-bottom:8px;
451
447
  }
452
448
 
453
- ._wrapper_srqts_10{
449
+ ._wrapper_esh0i9_10{
454
450
  position:relative;
455
451
  }
456
- ._tag_srqts_14{
452
+ ._tag_esh0i9_14{
457
453
  position:absolute;
458
454
  }
459
- ._alignTop_srqts_20._sizeXs_srqts_21{
455
+ ._alignTop_esh0i9_20._sizeXs_esh0i9_21{
460
456
  border-radius:4px 4px 0 0;
461
457
  }
462
- ._alignTop_srqts_20._sizeS_srqts_24{
458
+ ._alignTop_esh0i9_20._sizeS_esh0i9_24{
463
459
  border-radius:4px 4px 0 0;
464
460
  }
465
- ._alignTop_srqts_20._sizeM_srqts_27{
461
+ ._alignTop_esh0i9_20._sizeM_esh0i9_27{
466
462
  border-radius:6px 6px 0 0;
467
463
  }
468
- ._alignTop_srqts_20._sizeL_srqts_30{
464
+ ._alignTop_esh0i9_20._sizeL_esh0i9_30{
469
465
  border-radius:8px 8px 0 0;
470
466
  }
471
- ._alignMiddle_srqts_35._sizeXs_srqts_21{
467
+ ._alignMiddle_esh0i9_35._sizeXs_esh0i9_21{
472
468
  border-radius:4px;
473
469
  }
474
- ._alignMiddle_srqts_35._sizeS_srqts_24{
470
+ ._alignMiddle_esh0i9_35._sizeS_esh0i9_24{
475
471
  border-radius:4px;
476
472
  }
477
- ._alignMiddle_srqts_35._sizeM_srqts_27{
473
+ ._alignMiddle_esh0i9_35._sizeM_esh0i9_27{
478
474
  border-radius:6px;
479
475
  }
480
- ._alignMiddle_srqts_35._sizeL_srqts_30{
476
+ ._alignMiddle_esh0i9_35._sizeL_esh0i9_30{
481
477
  border-radius:8px;
482
478
  }
483
- ._top_srqts_52{
479
+ ._top_esh0i9_52{
484
480
  top:0;
485
481
  }
486
- ._top_srqts_52._start_srqts_56._offset16_srqts_57{
482
+ ._top_esh0i9_52._start_esh0i9_56._offset16_esh0i9_57{
487
483
  left:16px;
488
484
  }
489
- ._top_srqts_52._start_srqts_56._offset24_srqts_60{
485
+ ._top_esh0i9_52._start_esh0i9_56._offset24_esh0i9_60{
490
486
  left:24px;
491
487
  }
492
- ._top_srqts_52._start_srqts_56._offset32_srqts_63{
488
+ ._top_esh0i9_52._start_esh0i9_56._offset32_esh0i9_63{
493
489
  left:32px;
494
490
  }
495
- ._top_srqts_52._end_srqts_68._offset16_srqts_57{
491
+ ._top_esh0i9_52._end_esh0i9_68._offset16_esh0i9_57{
496
492
  right:16px;
497
493
  }
498
- ._top_srqts_52._end_srqts_68._offset24_srqts_60{
494
+ ._top_esh0i9_52._end_esh0i9_68._offset24_esh0i9_60{
499
495
  right:24px;
500
496
  }
501
- ._top_srqts_52._end_srqts_68._offset32_srqts_63{
497
+ ._top_esh0i9_52._end_esh0i9_68._offset32_esh0i9_63{
502
498
  right:32px;
503
499
  }
504
- ._top_srqts_52._alignTop_srqts_20{
500
+ ._top_esh0i9_52._alignTop_esh0i9_20{
505
501
  -webkit-transform:translate(0, -100%);
506
502
  transform:translate(0, -100%);
507
503
  }
508
- ._top_srqts_52._alignMiddle_srqts_35{
504
+ ._top_esh0i9_52._alignMiddle_esh0i9_35{
509
505
  -webkit-transform:translate(0, -50%);
510
506
  transform:translate(0, -50%);
511
507
  }
512
- ._left_srqts_90{
508
+ ._left_esh0i9_90{
513
509
  right:100%;
514
510
 
515
511
  -webkit-transform-origin:100% 0;
516
512
 
517
513
  transform-origin:100% 0;
518
514
  }
519
- ._left_srqts_90._start_srqts_56._offset16_srqts_57{
515
+ ._left_esh0i9_90._start_esh0i9_56._offset16_esh0i9_57{
520
516
  top:16px;
521
517
  }
522
- ._left_srqts_90._start_srqts_56._offset24_srqts_60{
518
+ ._left_esh0i9_90._start_esh0i9_56._offset24_esh0i9_60{
523
519
  top:24px;
524
520
  }
525
- ._left_srqts_90._start_srqts_56._offset32_srqts_63{
521
+ ._left_esh0i9_90._start_esh0i9_56._offset32_esh0i9_63{
526
522
  top:32px;
527
523
  }
528
- ._left_srqts_90._end_srqts_68._offset16_srqts_57{
524
+ ._left_esh0i9_90._end_esh0i9_68._offset16_esh0i9_57{
529
525
  top:calc(100% - 16px);
530
526
  }
531
- ._left_srqts_90._end_srqts_68._offset24_srqts_60{
527
+ ._left_esh0i9_90._end_esh0i9_68._offset24_esh0i9_60{
532
528
  top:calc(100% - 24px);
533
529
  }
534
- ._left_srqts_90._end_srqts_68._offset32_srqts_63{
530
+ ._left_esh0i9_90._end_esh0i9_68._offset32_esh0i9_63{
535
531
  top:calc(100% - 32px);
536
532
  }
537
- ._left_srqts_90._start_srqts_56._alignTop_srqts_20{
533
+ ._left_esh0i9_90._start_esh0i9_56._alignTop_esh0i9_20{
538
534
  -webkit-transform:rotate(270deg) translate(0, -100%);
539
535
  transform:rotate(270deg) translate(0, -100%);
540
536
  }
541
- ._left_srqts_90._end_srqts_68._alignTop_srqts_20{
537
+ ._left_esh0i9_90._end_esh0i9_68._alignTop_esh0i9_20{
542
538
  -webkit-transform:rotate(270deg) translate(100%, -100%);
543
539
  transform:rotate(270deg) translate(100%, -100%);
544
540
  }
545
- ._left_srqts_90._start_srqts_56._alignMiddle_srqts_35{
541
+ ._left_esh0i9_90._start_esh0i9_56._alignMiddle_esh0i9_35{
546
542
  -webkit-transform:rotate(270deg) translate(0, -50%);
547
543
  transform:rotate(270deg) translate(0, -50%);
548
544
  }
549
- ._left_srqts_90._end_srqts_68._alignMiddle_srqts_35{
545
+ ._left_esh0i9_90._end_esh0i9_68._alignMiddle_esh0i9_35{
550
546
  -webkit-transform:rotate(270deg) translate(100%, -50%);
551
547
  transform:rotate(270deg) translate(100%, -50%);
552
548
  }
package/lib/parts/base-tag.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import React from 'react';
1
+ import React, { CSSProperties } from 'react';
2
2
  export declare type BaseTagSize = 'l' | 'm' | 's' | 'xs';
3
3
  export declare type BaseTagIconPosition = 'left' | 'right';
4
4
  export declare type BaseTagProps = {
@@ -12,6 +12,8 @@ export declare type BaseTagProps = {
12
12
  isUppercase?: boolean;
13
13
  /** Text color */
14
14
  color?: string;
15
+ /** Custom CSS styles */
16
+ style?: CSSProperties | undefined;
15
17
  /**
16
18
  * Background color.
17
19
  * @default transparent
package/lib/parts/base-tag.js CHANGED
@@ -7,7 +7,7 @@ import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-sta
7
7
  import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
8
8
  import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
9
9
  import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
10
- var _excluded = ["className", "children", "size", "icon", "iconPosition", "isUppercase", "color", "backgroundColor", "borderColor"];
10
+ var _excluded = ["className", "children", "size", "icon", "iconPosition", "isUppercase", "color", "backgroundColor", "borderColor", "style"];
11
11
 
12
12
  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; }
13
13
 
@@ -40,6 +40,7 @@ function (_ref, ref) {
40
40
  color = _ref.color,
41
41
  backgroundColor = _ref.backgroundColor,
42
42
  borderColor = _ref.borderColor,
43
+ style = _ref.style,
43
44
  restProps = _objectWithoutProperties(_ref, _excluded);
44
45
 
45
46
  var withIcon = /*#__PURE__*/React.isValidElement(icon);
@@ -51,11 +52,11 @@ function (_ref, ref) {
51
52
  }, restProps), {}, {
52
53
  ref: ref,
53
54
  className: cn(styles.main, SIZE_STYLES[size], ICON_POSITION_STYLES[iconPosition], withIcon && styles.withIcon, isUppercase && styles.uppercase, className),
54
- style: {
55
+ style: _objectSpread({
55
56
  color: color,
56
57
  backgroundColor: backgroundColor,
57
58
  borderColor: borderColor
58
- }
59
+ }, style)
59
60
  }), iconSlot, children);
60
61
  });
61
62
  BaseTag.displayName = 'BaseTag';
@@ -66,6 +67,7 @@ BaseTag.propTypes = {
66
67
  iconPosition: PropTypes.oneOf(['left', 'right']),
67
68
  isUppercase: PropTypes.bool,
68
69
  size: PropTypes.oneOf(['l', 'm', 's', 'xs']),
70
+ style: PropTypes.object,
69
71
  color: PropTypes.string,
70
72
  backgroundColor: PropTypes.string,
71
73
  borderColor: PropTypes.string
package/lib/parts/base-tag.p.module.css.js CHANGED
@@ -1,13 +1,13 @@
1
1
  var styles = {
2
- "main": "_main_1uoszgd_25",
3
- "rs-reset-letter-spacing": "_rs-reset-letter-spacing_1uoszgd_1",
4
- "alignIconLeft": "_alignIconLeft_1uoszgd_46",
5
- "alignIconRight": "_alignIconRight_1uoszgd_50",
6
- "sizeXs": "_sizeXs_1uoszgd_54",
7
- "sizeS": "_sizeS_1uoszgd_61",
8
- "sizeM": "_sizeM_1uoszgd_68",
9
- "sizeL": "_sizeL_1uoszgd_75",
10
- "icon": "_icon_1uoszgd_82",
11
- "uppercase": "_uppercase_1uoszgd_116"
2
+ "main": "_main_1lmo5uq_25",
3
+ "rs-reset-letter-spacing": "_rs-reset-letter-spacing_1lmo5uq_1",
4
+ "alignIconLeft": "_alignIconLeft_1lmo5uq_46",
5
+ "alignIconRight": "_alignIconRight_1lmo5uq_50",
6
+ "sizeXs": "_sizeXs_1lmo5uq_54",
7
+ "sizeS": "_sizeS_1lmo5uq_61",
8
+ "sizeM": "_sizeM_1lmo5uq_68",
9
+ "sizeL": "_sizeL_1lmo5uq_75",
10
+ "icon": "_icon_1lmo5uq_82",
11
+ "uppercase": "_uppercase_1lmo5uq_116"
12
12
  };
13
13
  export { styles as default };
package/lib/parts/presets.d.ts CHANGED
@@ -1,57 +1,194 @@
1
1
  export declare type Preset = {
2
2
  /** Tag text color */
3
- color: string;
3
+ color?: string;
4
4
  /** Tag background color */
5
5
  backgroundColor?: string;
6
6
  /** Tag border color */
7
7
  borderColor?: string;
8
8
  };
9
9
  declare const presetsLight: {
10
- /** Primary background */
10
+ /**
11
+ * Primary background
12
+ */
13
+ 'classic-light': {
14
+ color: "#FFFFFF";
15
+ backgroundColor: "var(--rs-color-primary-light-theme, #6B57FF)";
16
+ };
17
+ /**
18
+ * Contrast background
19
+ */
20
+ 'rock-light': {
21
+ color: "#FFFFFF";
22
+ backgroundColor: "#19191C";
23
+ };
24
+ /**
25
+ * Grey background
26
+ */
27
+ 'filled-light': {
28
+ color: "rgba(25,25,28,0.7)";
29
+ backgroundColor: "rgba(25,25,28,0.1)";
30
+ };
31
+ /**
32
+ * Transparent with border
33
+ */
34
+ 'outline-light': {
35
+ color: "#19191C";
36
+ borderColor: "#19191C";
37
+ };
38
+ };
39
+ declare const presetsDark: {
40
+ /**
41
+ * Primary background
42
+ */
43
+ 'classic-dark': {
44
+ color: "#FFFFFF";
45
+ backgroundColor: "var(--rs-color-primary-dark-theme, #8473FF)";
46
+ };
47
+ /**
48
+ * Contrast background
49
+ */
50
+ 'rock-dark': {
51
+ color: "#19191C";
52
+ backgroundColor: "#FFFFFF";
53
+ };
54
+ /**
55
+ * Grey background
56
+ */
57
+ 'filled-dark': {
58
+ color: "rgba(255,255,255,0.7)";
59
+ backgroundColor: "rgba(255,255,255,0.1)";
60
+ };
61
+ /**
62
+ * Transparent with border
63
+ */
64
+ 'outline-dark': {
65
+ color: "#FFFFFF";
66
+ borderColor: "#FFFFFF";
67
+ };
68
+ };
69
+ export declare type PresetsLight = typeof presetsLight;
70
+ export declare type PresetsDark = typeof presetsDark;
71
+ export declare const presets: {
72
+ /**
73
+ * Primary background
74
+ * @deprecated use 'classic-light' instead
75
+ */
11
76
  classicLight: {
12
77
  color: "#FFFFFF";
13
78
  backgroundColor: "var(--rs-color-primary-light-theme, #6B57FF)";
14
79
  };
15
- /** Contrast background */
80
+ /**
81
+ * Contrast background
82
+ * @deprecated use 'rock-light' instead
83
+ */
16
84
  rockLight: {
17
85
  color: "#FFFFFF";
18
86
  backgroundColor: "#19191C";
19
87
  };
20
- /** Grey background */
88
+ /**
89
+ * Grey background
90
+ * @deprecated use 'filled-light' instead
91
+ */
21
92
  filledLight: {
22
93
  color: "rgba(25,25,28,0.7)";
23
94
  backgroundColor: "rgba(25,25,28,0.1)";
24
95
  };
25
- /** Transparent with border */
96
+ /**
97
+ * Transparent with border
98
+ * @deprecated use 'outline-light' instead
99
+ */
26
100
  outlineLight: {
27
101
  color: "#19191C";
28
102
  borderColor: "#19191C";
29
103
  };
30
- };
31
- declare const presetsDark: {
32
- /** Primary background */
104
+ /**
105
+ * Primary background
106
+ * @deprecated use 'classic-dark' instead
107
+ */
33
108
  classicDark: {
34
109
  color: "#FFFFFF";
35
110
  backgroundColor: "var(--rs-color-primary-dark-theme, #8473FF)";
36
111
  };
37
- /** Contrast background */
112
+ /**
113
+ * Contrast background
114
+ * @deprecated use 'rock-dark' instead
115
+ */
38
116
  rockDark: {
39
117
  color: "#19191C";
40
118
  backgroundColor: "#FFFFFF";
41
119
  };
42
- /** Grey background */
120
+ /**
121
+ * Grey background
122
+ * @deprecated use 'filled-dark' instead
123
+ */
43
124
  filledDark: {
44
125
  color: "rgba(255,255,255,0.7)";
45
126
  backgroundColor: "rgba(255,255,255,0.1)";
46
127
  };
47
- /** Transparent with border */
128
+ /**
129
+ * Transparent with border
130
+ * @deprecated use 'outline-dark' instead
131
+ */
48
132
  outlineDark: {
49
133
  color: "#FFFFFF";
50
134
  borderColor: "#FFFFFF";
51
135
  };
136
+ /**
137
+ * Primary background
138
+ */
139
+ 'classic-dark': {
140
+ color: "#FFFFFF";
141
+ backgroundColor: "var(--rs-color-primary-dark-theme, #8473FF)";
142
+ };
143
+ /**
144
+ * Contrast background
145
+ */
146
+ 'rock-dark': {
147
+ color: "#19191C";
148
+ backgroundColor: "#FFFFFF";
149
+ };
150
+ /**
151
+ * Grey background
152
+ */
153
+ 'filled-dark': {
154
+ color: "rgba(255,255,255,0.7)";
155
+ backgroundColor: "rgba(255,255,255,0.1)";
156
+ };
157
+ /**
158
+ * Transparent with border
159
+ */
160
+ 'outline-dark': {
161
+ color: "#FFFFFF";
162
+ borderColor: "#FFFFFF";
163
+ };
164
+ /**
165
+ * Primary background
166
+ */
167
+ 'classic-light': {
168
+ color: "#FFFFFF";
169
+ backgroundColor: "var(--rs-color-primary-light-theme, #6B57FF)";
170
+ };
171
+ /**
172
+ * Contrast background
173
+ */
174
+ 'rock-light': {
175
+ color: "#FFFFFF";
176
+ backgroundColor: "#19191C";
177
+ };
178
+ /**
179
+ * Grey background
180
+ */
181
+ 'filled-light': {
182
+ color: "rgba(25,25,28,0.7)";
183
+ backgroundColor: "rgba(25,25,28,0.1)";
184
+ };
185
+ /**
186
+ * Transparent with border
187
+ */
188
+ 'outline-light': {
189
+ color: "#19191C";
190
+ borderColor: "#19191C";
191
+ };
52
192
  };
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>;
56
- export declare const presets: Presets;
193
+ export declare type Presets = typeof presets;
57
194
  export {};
package/lib/parts/presets.js CHANGED
@@ -13,56 +13,120 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
13
13
 
14
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';
15
15
  var presetsLight = {
16
- /** Primary background */
17
- classicLight: {
16
+ /**
17
+ * Primary background
18
+ */
19
+ 'classic-light': {
18
20
  color: RS_COLOR_WHITE,
19
21
  backgroundColor: "var(--rs-color-primary-light-theme, ".concat(RS_COLOR_PRIMARY_LIGHT_THEME, ")")
20
22
  },
21
23
 
22
- /** Contrast background */
23
- rockLight: {
24
+ /**
25
+ * Contrast background
26
+ */
27
+ 'rock-light': {
24
28
  color: RS_COLOR_WHITE,
25
29
  backgroundColor: RS_COLOR_BLACK
26
30
  },
27
31
 
28
- /** Grey background */
29
- filledLight: {
32
+ /**
33
+ * Grey background
34
+ */
35
+ 'filled-light': {
30
36
  color: RS_COLOR_BLACK_T70,
31
37
  backgroundColor: RS_COLOR_BLACK_T10
32
38
  },
33
39
 
34
- /** Transparent with border */
35
- outlineLight: {
40
+ /**
41
+ * Transparent with border
42
+ */
43
+ 'outline-light': {
36
44
  color: RS_COLOR_BLACK,
37
45
  borderColor: RS_COLOR_BLACK
38
46
  }
39
47
  };
40
48
  var presetsDark = {
41
- /** Primary background */
42
- classicDark: {
49
+ /**
50
+ * Primary background
51
+ */
52
+ 'classic-dark': {
43
53
  color: RS_COLOR_WHITE,
44
54
  backgroundColor: "var(--rs-color-primary-dark-theme, ".concat(RS_COLOR_PRIMARY_DARK_THEME, ")")
45
55
  },
46
56
 
47
- /** Contrast background */
48
- rockDark: {
57
+ /**
58
+ * Contrast background
59
+ */
60
+ 'rock-dark': {
49
61
  color: RS_COLOR_BLACK,
50
62
  backgroundColor: RS_COLOR_WHITE
51
63
  },
52
64
 
53
- /** Grey background */
54
- filledDark: {
65
+ /**
66
+ * Grey background
67
+ */
68
+ 'filled-dark': {
55
69
  color: RS_COLOR_WHITE_T70,
56
70
  backgroundColor: RS_COLOR_WHITE_T10
57
71
  },
58
72
 
59
- /** Transparent with border */
60
- outlineDark: {
73
+ /**
74
+ * Transparent with border
75
+ */
76
+ 'outline-dark': {
61
77
  color: RS_COLOR_WHITE,
62
78
  borderColor: RS_COLOR_WHITE
63
79
  }
64
80
  };
65
81
 
66
- var presets = _objectSpread(_objectSpread({}, presetsLight), presetsDark);
82
+ var presets = _objectSpread(_objectSpread(_objectSpread({}, presetsLight), presetsDark), {}, {
83
+ /**
84
+ * Primary background
85
+ * @deprecated use 'classic-light' instead
86
+ */
87
+ classicLight: presetsLight['classic-light'],
88
+
89
+ /**
90
+ * Contrast background
91
+ * @deprecated use 'rock-light' instead
92
+ */
93
+ rockLight: presetsLight['rock-light'],
94
+
95
+ /**
96
+ * Grey background
97
+ * @deprecated use 'filled-light' instead
98
+ */
99
+ filledLight: presetsLight['filled-light'],
100
+
101
+ /**
102
+ * Transparent with border
103
+ * @deprecated use 'outline-light' instead
104
+ */
105
+ outlineLight: presetsLight['outline-light'],
106
+
107
+ /**
108
+ * Primary background
109
+ * @deprecated use 'classic-dark' instead
110
+ */
111
+ classicDark: presetsDark['classic-dark'],
112
+
113
+ /**
114
+ * Contrast background
115
+ * @deprecated use 'rock-dark' instead
116
+ */
117
+ rockDark: presetsDark['rock-dark'],
118
+
119
+ /**
120
+ * Grey background
121
+ * @deprecated use 'filled-dark' instead
122
+ */
123
+ filledDark: presetsDark['filled-dark'],
124
+
125
+ /**
126
+ * Transparent with border
127
+ * @deprecated use 'outline-dark' instead
128
+ */
129
+ outlineDark: presetsDark['outline-dark']
130
+ });
67
131
 
68
132
  export { presets };
package/lib/parts/removable-tag.p.module.css.js CHANGED
@@ -1,16 +1,16 @@
1
1
  var styles = {
2
- "wrapper": "_wrapper_4e3oje_36",
3
- "sizeXs": "_sizeXs_4e3oje_48",
4
- "sizeS": "_sizeS_4e3oje_49",
5
- "rs-reset-letter-spacing": "_rs-reset-letter-spacing_4e3oje_1",
6
- "sizeM": "_sizeM_4e3oje_53",
7
- "sizeL": "_sizeL_4e3oje_57",
8
- "themeLight": "_themeLight_4e3oje_61",
9
- "disabled": "_disabled_4e3oje_65",
10
- "themeDark": "_themeDark_4e3oje_69",
11
- "main": "_main_4e3oje_110",
12
- "wrap": "_wrap_4e3oje_36",
13
- "close": "_close_4e3oje_146",
14
- "icon": "_icon_4e3oje_243"
2
+ "wrapper": "_wrapper_1o14hrv_36",
3
+ "sizeXs": "_sizeXs_1o14hrv_48",
4
+ "sizeS": "_sizeS_1o14hrv_49",
5
+ "rs-reset-letter-spacing": "_rs-reset-letter-spacing_1o14hrv_1",
6
+ "sizeM": "_sizeM_1o14hrv_53",
7
+ "sizeL": "_sizeL_1o14hrv_57",
8
+ "themeLight": "_themeLight_1o14hrv_61",
9
+ "disabled": "_disabled_1o14hrv_65",
10
+ "themeDark": "_themeDark_1o14hrv_69",
11
+ "main": "_main_1o14hrv_110",
12
+ "wrap": "_wrap_1o14hrv_36",
13
+ "close": "_close_1o14hrv_146",
14
+ "icon": "_icon_1o14hrv_243"
15
15
  };
16
16
  export { styles as default };
package/lib/parts/sticky-tag.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import React from 'react';
1
+ import React, { CSSProperties } from 'react';
2
2
  import { BaseTagIconPosition, BaseTagSize } from './base-tag';
3
3
  export declare type StickyTagSize = BaseTagSize;
4
4
  export declare type StickyTagIconPosition = BaseTagIconPosition;
@@ -36,6 +36,8 @@ export declare type StickyTagProps = {
36
36
  * @default transparent
37
37
  * */
38
38
  borderColor?: string;
39
+ /** Custom CSS styles */
40
+ style?: CSSProperties | undefined;
39
41
  } & ({
40
42
  /** Additional icon */
41
43
  icon: React.ReactNode;
package/lib/parts/sticky-tag.js CHANGED
@@ -115,6 +115,7 @@ StickyTag.propTypes = {
115
115
  size: PropTypes.oneOf(['l', 'm', 's', 'xs']),
116
116
  color: PropTypes.string,
117
117
  backgroundColor: PropTypes.string,
118
- borderColor: PropTypes.string
118
+ borderColor: PropTypes.string,
119
+ style: PropTypes.object
119
120
  };
120
121
  export { StickyTag };
package/lib/parts/sticky-tag.p.module.css.js CHANGED
@@ -1,18 +1,18 @@
1
1
  var styles = {
2
- "wrapper": "_wrapper_srqts_10",
3
- "tag": "_tag_srqts_14",
4
- "alignTop": "_alignTop_srqts_20",
5
- "sizeXs": "_sizeXs_srqts_21",
6
- "sizeS": "_sizeS_srqts_24",
7
- "sizeM": "_sizeM_srqts_27",
8
- "sizeL": "_sizeL_srqts_30",
9
- "alignMiddle": "_alignMiddle_srqts_35",
10
- "top": "_top_srqts_52",
11
- "start": "_start_srqts_56",
12
- "offset16": "_offset16_srqts_57",
13
- "offset24": "_offset24_srqts_60",
14
- "offset32": "_offset32_srqts_63",
15
- "end": "_end_srqts_68",
16
- "left": "_left_srqts_90"
2
+ "wrapper": "_wrapper_esh0i9_10",
3
+ "tag": "_tag_esh0i9_14",
4
+ "alignTop": "_alignTop_esh0i9_20",
5
+ "sizeXs": "_sizeXs_esh0i9_21",
6
+ "sizeS": "_sizeS_esh0i9_24",
7
+ "sizeM": "_sizeM_esh0i9_27",
8
+ "sizeL": "_sizeL_esh0i9_30",
9
+ "alignMiddle": "_alignMiddle_esh0i9_35",
10
+ "top": "_top_esh0i9_52",
11
+ "start": "_start_esh0i9_56",
12
+ "offset16": "_offset16_esh0i9_57",
13
+ "offset24": "_offset24_esh0i9_60",
14
+ "offset32": "_offset32_esh0i9_63",
15
+ "end": "_end_esh0i9_68",
16
+ "left": "_left_esh0i9_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_qp3fbt_9",
3
- "sizeS": "_sizeS_qp3fbt_13",
4
- "sizeM": "_sizeM_qp3fbt_17",
5
- "sizeL": "_sizeL_qp3fbt_21"
2
+ "sizeXs": "_sizeXs_1co71lk_9",
3
+ "sizeS": "_sizeS_1co71lk_13",
4
+ "sizeM": "_sizeM_1co71lk_17",
5
+ "sizeL": "_sizeL_1co71lk_21"
6
6
  };
7
7
  export { styles as default };
package/lib/tag.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import React from 'react';
1
+ import React, { CSSProperties } from 'react';
2
2
  import { BaseTagSize, BaseTagIconPosition } from './parts/base-tag';
3
3
  export declare type TagSize = BaseTagSize;
4
4
  export declare type TagIconPosition = BaseTagIconPosition;
@@ -23,6 +23,8 @@ export declare type TagProps = {
23
23
  * @default transparent
24
24
  * */
25
25
  borderColor?: string;
26
+ /** Custom CSS styles */
27
+ style?: CSSProperties | undefined;
26
28
  } & ({
27
29
  /** Additional icon */
28
30
  icon: React.ReactNode;
package/lib/tag.js CHANGED
@@ -50,6 +50,7 @@ Tag.propTypes = {
50
50
  size: PropTypes.oneOf(['l', 'm', 's', 'xs']),
51
51
  color: PropTypes.string,
52
52
  backgroundColor: PropTypes.string,
53
- borderColor: PropTypes.string
53
+ borderColor: PropTypes.string,
54
+ style: PropTypes.object
54
55
  };
55
56
  export { Tag };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rescui/tag",
3
- "version": "0.7.1",
3
+ "version": "0.8.0",
4
4
  "description": "",
5
5
  "license": "Apache-2.0",
6
6
  "author": "JetBrains",
@@ -32,5 +32,5 @@
32
32
  "scripts": {
33
33
  "build": "rescui-scripts build"
34
34
  },
35
- "gitHead": "d25604773250b6467e5ee8d88c4e44c25833785e"
35
+ "gitHead": "f7dab7dd3a0664847703024d0b82b809ad63fc98"
36
36
  }