@rescui/button 0.15.2 → 0.15.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.
Files changed (5) hide show
  1. package/lib/button.p.module.css.js +29 -29
  2. package/lib/index.css +63 -63
  3. package/lib/public-api.p.css +5 -5
  4. package/lib/public-api.pcss +5 -5
  5. package/package.json +2 -2
package/lib/button.p.module.css.js CHANGED
@@ -1,32 +1,32 @@
1
1
  var styles = {
2
- "light": "_light_1jyvgzb_6",
3
- "dark": "_dark_1jyvgzb_9",
4
- "flatRight": "_flatRight_1jyvgzb_13",
5
- "flatLeft": "_flatLeft_1jyvgzb_16",
6
- "sizeXs": "_sizeXs_1jyvgzb_20",
7
- "sizeS": "_sizeS_1jyvgzb_23",
8
- "sizeM": "_sizeM_1jyvgzb_26",
9
- "sizeL": "_sizeL_1jyvgzb_29",
10
- "modeClassic": "_modeClassic_1jyvgzb_33",
11
- "modeRock": "_modeRock_1jyvgzb_36",
12
- "modeTransparent": "_modeTransparent_1jyvgzb_39",
13
- "modeOutline": "_modeOutline_1jyvgzb_42",
14
- "modeClear": "_modeClear_1jyvgzb_45",
15
- "alignIconLeft": "_alignIconLeft_1jyvgzb_49",
16
- "alignIconRight": "_alignIconRight_1jyvgzb_52",
17
- "main": "_main_1jyvgzb_56",
18
- "disabled": "_disabled_1jyvgzb_141",
19
- "busy": "_busy_1jyvgzb_148",
20
- "busyOverlay": "_busyOverlay_1jyvgzb_152",
21
- "allowMultiline": "_allowMultiline_1jyvgzb_173",
22
- "multiline": "_multiline_1jyvgzb_177",
23
- "withoutText": "_withoutText_1jyvgzb_181",
24
- "withIcon": "_withIcon_1jyvgzb_197",
25
- "icon": "_icon_1jyvgzb_203",
26
- "busyIcon": "_busyIcon_1jyvgzb_217",
27
- "shiftedLeft": "_shiftedLeft_1jyvgzb_234",
28
- "shiftedRight": "_shiftedRight_1jyvgzb_237",
29
- "shiftedTop": "_shiftedTop_1jyvgzb_240",
30
- "shiftedBottom": "_shiftedBottom_1jyvgzb_243"
2
+ "light": "_light_1nfvtky_6",
3
+ "dark": "_dark_1nfvtky_9",
4
+ "flatRight": "_flatRight_1nfvtky_13",
5
+ "flatLeft": "_flatLeft_1nfvtky_16",
6
+ "sizeXs": "_sizeXs_1nfvtky_20",
7
+ "sizeS": "_sizeS_1nfvtky_23",
8
+ "sizeM": "_sizeM_1nfvtky_26",
9
+ "sizeL": "_sizeL_1nfvtky_29",
10
+ "modeClassic": "_modeClassic_1nfvtky_33",
11
+ "modeRock": "_modeRock_1nfvtky_36",
12
+ "modeTransparent": "_modeTransparent_1nfvtky_39",
13
+ "modeOutline": "_modeOutline_1nfvtky_42",
14
+ "modeClear": "_modeClear_1nfvtky_45",
15
+ "alignIconLeft": "_alignIconLeft_1nfvtky_49",
16
+ "alignIconRight": "_alignIconRight_1nfvtky_52",
17
+ "main": "_main_1nfvtky_56",
18
+ "disabled": "_disabled_1nfvtky_141",
19
+ "busy": "_busy_1nfvtky_148",
20
+ "busyOverlay": "_busyOverlay_1nfvtky_152",
21
+ "allowMultiline": "_allowMultiline_1nfvtky_173",
22
+ "multiline": "_multiline_1nfvtky_177",
23
+ "withoutText": "_withoutText_1nfvtky_181",
24
+ "withIcon": "_withIcon_1nfvtky_197",
25
+ "icon": "_icon_1nfvtky_203",
26
+ "busyIcon": "_busyIcon_1nfvtky_217",
27
+ "shiftedLeft": "_shiftedLeft_1nfvtky_234",
28
+ "shiftedRight": "_shiftedRight_1nfvtky_237",
29
+ "shiftedTop": "_shiftedTop_1nfvtky_240",
30
+ "shiftedBottom": "_shiftedBottom_1nfvtky_243"
31
31
  };
32
32
  export { styles as default };
package/lib/index.css CHANGED
@@ -1,22 +1,22 @@
1
- ._light_1jyvgzb_6{
1
+ ._light_1nfvtky_6{
2
2
  --rs-theme-dark:0;
3
3
  }
4
- ._dark_1jyvgzb_9{
4
+ ._dark_1nfvtky_9{
5
5
  --rs-theme-dark:1;
6
6
  }
7
- ._flatRight_1jyvgzb_13{
7
+ ._flatRight_1nfvtky_13{
8
8
  --_rs-button-top-right-border-radius-or-initial:0px;
9
9
  --_rs-button-bottom-right-border-radius-or-initial:0px;
10
10
  --_rs-button-top-right-multiline-border-radius-or-initial:0px;
11
11
  --_rs-button-bottom-right-multiline-border-radius-or-initial:0px;
12
12
  }
13
- ._flatLeft_1jyvgzb_16{
13
+ ._flatLeft_1nfvtky_16{
14
14
  --_rs-button-top-left-border-radius-or-initial:0px;
15
15
  --_rs-button-bottom-left-border-radius-or-initial:0px;
16
16
  --_rs-button-top-left-multiline-border-radius-or-initial:0px;
17
17
  --_rs-button-bottom-left-multiline-border-radius-or-initial:0px;
18
18
  }
19
- ._sizeXs_1jyvgzb_20{
19
+ ._sizeXs_1nfvtky_20{
20
20
  --_rs-typography-letter-spacing:0.0045em;
21
21
  --_rs-typography-text-transform:initial;
22
22
  --_rs-typography-font-variant-numeric:initial;
@@ -63,7 +63,7 @@
63
63
  --_rs-button-icon-offset:8px;
64
64
  --_rs-button-icon-margin-top:2px;
65
65
  }
66
- ._sizeS_1jyvgzb_23{
66
+ ._sizeS_1nfvtky_23{
67
67
  --_rs-typography-letter-spacing:0.0045em;
68
68
  --_rs-typography-text-transform:initial;
69
69
  --_rs-typography-font-variant-numeric:initial;
@@ -110,7 +110,7 @@
110
110
  --_rs-button-icon-offset:8px;
111
111
  --_rs-button-icon-margin-top:0px;
112
112
  }
113
- ._sizeM_1jyvgzb_26{
113
+ ._sizeM_1nfvtky_26{
114
114
  --_rs-typography-letter-spacing:0.0015em;
115
115
  --_rs-typography-text-transform:initial;
116
116
  --_rs-typography-font-variant-numeric:initial;
@@ -145,11 +145,11 @@
145
145
  --_rs-typography-link-border-bottom-width-from-text:1px;
146
146
  }
147
147
  @media screen and (max-width: 640px){
148
- ._sizeM_1jyvgzb_26{
148
+ ._sizeM_1nfvtky_26{
149
149
  --_rs-typography-list-li-margin-top-from-text:12px;
150
150
  }
151
151
  }
152
- ._sizeM_1jyvgzb_26 {
152
+ ._sizeM_1nfvtky_26 {
153
153
  --_rs-button-border-radius-base:var(
154
154
  --rs-button-m-border-radius,
155
155
  var(--rs-button-border-radius, 20px)
@@ -164,7 +164,7 @@
164
164
  --_rs-button-icon-offset:8px;
165
165
  --_rs-button-icon-margin-top:0px;
166
166
  }
167
- ._sizeL_1jyvgzb_29{
167
+ ._sizeL_1nfvtky_29{
168
168
  --_rs-typography-letter-spacing:normal;
169
169
  --_rs-typography-text-transform:initial;
170
170
  --_rs-typography-font-variant-numeric:initial;
@@ -199,11 +199,11 @@
199
199
  --_rs-typography-link-border-bottom-width-from-text:1px;
200
200
  }
201
201
  @media screen and (max-width: 640px){
202
- ._sizeL_1jyvgzb_29{
202
+ ._sizeL_1nfvtky_29{
203
203
  --_rs-typography-list-li-margin-top-from-text:16px;
204
204
  }
205
205
  }
206
- ._sizeL_1jyvgzb_29 {
206
+ ._sizeL_1nfvtky_29 {
207
207
  --_rs-button-border-radius-base:var(
208
208
  --rs-button-l-border-radius,
209
209
  var(--rs-button-border-radius, 26px)
@@ -218,72 +218,72 @@
218
218
  --_rs-button-icon-offset:16px;
219
219
  --_rs-button-icon-margin-top:0px;
220
220
  }
221
- ._modeClassic_1jyvgzb_33{
221
+ ._modeClassic_1nfvtky_33{
222
222
  --_rs-button-border-width:0px;
223
223
  --_rs-button-active-border-width:0px;
224
224
  --_rs-button-color:#FFFFFF;
225
225
  --_rs-button-background:var(--_rs-color-primary);
226
226
  --_rs-button-hover-background:var(--_rs-color-primary-t-dim);
227
227
  --_rs-button-active-background:var(--_rs-color-primary);
228
- --_rs-button-focus-background:var(--_rs-color-primary-t-dim);
228
+ --_rs-button-active-focus-visible-no-hover-background:var(--_rs-color-primary-t-dim);
229
229
  --_rs-button-disabled-color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.5);
230
230
  --_rs-button-disabled-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.2);
231
231
  }
232
- ._modeRock_1jyvgzb_36{
232
+ ._modeRock_1nfvtky_36{
233
233
  --_rs-button-border-width:0px;
234
234
  --_rs-button-active-border-width:0px;
235
235
  --_rs-button-color:rgb(calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*227));
236
236
  --_rs-button-background:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
237
237
  --_rs-button-hover-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.8);
238
238
  --_rs-button-active-background:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
239
- --_rs-button-focus-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.8);
239
+ --_rs-button-active-focus-visible-no-hover-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.8);
240
240
  --_rs-button-disabled-color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.5);
241
241
  --_rs-button-disabled-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.2);
242
242
  }
243
- ._modeTransparent_1jyvgzb_39{
243
+ ._modeTransparent_1nfvtky_39{
244
244
  --_rs-button-border-width:0px;
245
245
  --_rs-button-active-border-width:0px;
246
246
  --_rs-button-color:rgb(calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*227));
247
247
  --_rs-button-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.5);
248
248
  --_rs-button-hover-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.8);
249
249
  --_rs-button-active-background:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
250
- --_rs-button-focus-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.5);
250
+ --_rs-button-active-focus-visible-no-hover-background:var(--_rs-button-active-background);
251
251
  --_rs-button-disabled-color:rgba(calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*227), 0.5);
252
252
  --_rs-button-disabled-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.4);
253
253
  }
254
- ._modeOutline_1jyvgzb_42{
254
+ ._modeOutline_1nfvtky_42{
255
255
  --_rs-button-border-width:1px;
256
256
  --_rs-button-active-border-width:2px;
257
257
  --_rs-button-color:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
258
258
  --_rs-button-background:transparent;
259
259
  --_rs-button-hover-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.1);
260
260
  --_rs-button-active-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.1);
261
- --_rs-button-focus-background:transparent;
261
+ --_rs-button-active-focus-visible-no-hover-background:var(--_rs-button-active-background);
262
262
  --_rs-button-disabled-color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.5);
263
263
  --_rs-button-disabled-background:transparent;
264
264
  }
265
- ._modeClear_1jyvgzb_45{
265
+ ._modeClear_1nfvtky_45{
266
266
  --_rs-button-border-width:0px;
267
267
  --_rs-button-active-border-width:0px;
268
268
  --_rs-button-color:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
269
269
  --_rs-button-background:transparent;
270
270
  --_rs-button-hover-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.1);
271
271
  --_rs-button-active-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.2);
272
- --_rs-button-focus-background:transparent;
272
+ --_rs-button-active-focus-visible-no-hover-background:var(--_rs-button-active-background);
273
273
  --_rs-button-disabled-color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.5);
274
274
  --_rs-button-disabled-background:transparent;
275
275
  }
276
- ._alignIconLeft_1jyvgzb_49{
276
+ ._alignIconLeft_1nfvtky_49{
277
277
  --_rs-button-icon-flex-direction:row;
278
278
  --_rs-button-icon-position-multiplier-left:1;
279
279
  --_rs-button-icon-position-multiplier-right:0;
280
280
  }
281
- ._alignIconRight_1jyvgzb_52{
281
+ ._alignIconRight_1nfvtky_52{
282
282
  --_rs-button-icon-flex-direction:row-reverse;
283
283
  --_rs-button-icon-position-multiplier-left:0;
284
284
  --_rs-button-icon-position-multiplier-right:1;
285
285
  }
286
- ._main_1jyvgzb_56{
286
+ ._main_1nfvtky_56{
287
287
  --_rs-theme-dark:var(
288
288
  --_rs-internal-force-theme-dark-consult-rescui-before-using,
289
289
  var(--rs-theme-dark, 0)
@@ -293,7 +293,7 @@
293
293
  --_rs-theme-light-coefficient:calc(1 - var(--_rs-theme-dark-coefficient));
294
294
  }
295
295
  @supports (color: color-mix(in srgb, #fff 50%, #000 50%)){
296
- ._main_1jyvgzb_56{
296
+ ._main_1nfvtky_56{
297
297
  --_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)));
298
298
  --_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)));
299
299
  --_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)));
@@ -302,7 +302,7 @@
302
302
  }
303
303
  }
304
304
  @supports not (color: color-mix(in srgb, #fff 50%, #000 50%)){
305
- ._main_1jyvgzb_56{
305
+ ._main_1nfvtky_56{
306
306
  --_rs-color-primary:rgb(calc(var(--_rs-theme-light-coefficient, 1)*107 + var(--_rs-theme-dark-coefficient, 0)*132), calc(var(--_rs-theme-light-coefficient, 1)*87 + var(--_rs-theme-dark-coefficient, 0)*115), 255);
307
307
  --_rs-color-primary-dim:rgb(calc(var(--_rs-theme-light-coefficient, 1)*137 + var(--_rs-theme-dark-coefficient, 0)*111), calc(var(--_rs-theme-light-coefficient, 1)*121 + var(--_rs-theme-dark-coefficient, 0)*97), calc(var(--_rs-theme-light-coefficient, 1)*255 + var(--_rs-theme-dark-coefficient, 0)*210));
308
308
  --_rs-color-primary-fog:rgb(calc(var(--_rs-theme-light-coefficient, 1)*225 + var(--_rs-theme-dark-coefficient, 0)*46), calc(var(--_rs-theme-light-coefficient, 1)*221 + var(--_rs-theme-dark-coefficient, 0)*43), calc(var(--_rs-theme-light-coefficient, 1)*255 + var(--_rs-theme-dark-coefficient, 0)*73));
@@ -310,7 +310,7 @@
310
310
  --_rs-color-primary-t-fog:rgba(calc(var(--_rs-theme-light-coefficient, 1)*107 + var(--_rs-theme-dark-coefficient, 0)*132), calc(var(--_rs-theme-light-coefficient, 1)*87 + var(--_rs-theme-dark-coefficient, 0)*115), 255, calc(var(--_rs-theme-light-coefficient, 1)*0.2 + var(--_rs-theme-dark-coefficient, 0)*0.3));
311
311
  }
312
312
  }
313
- ._main_1jyvgzb_56 {
313
+ ._main_1nfvtky_56 {
314
314
  --_rs-button-border-radius:var(
315
315
  --_rs-button-top-left-border-radius-or-initial,
316
316
  var(--_rs-button-border-radius-base)
@@ -352,11 +352,11 @@
352
352
  -webkit-font-feature-settings:'kern', 'liga', 'calt';
353
353
  font-feature-settings:'kern', 'liga', 'calt';
354
354
  }
355
- ._main_1jyvgzb_56 > p:not(:nth-child(1)),
356
- ._main_1jyvgzb_56 > pre:not(:nth-child(1)){
355
+ ._main_1nfvtky_56 > p:not(:nth-child(1)),
356
+ ._main_1nfvtky_56 > pre:not(:nth-child(1)){
357
357
  padding-top:var(--_rs-typography-auto-offset-or-initial);
358
358
  }
359
- ._main_1jyvgzb_56 {
359
+ ._main_1nfvtky_56 {
360
360
 
361
361
  position:relative;
362
362
  z-index:1;
@@ -387,19 +387,19 @@
387
387
 
388
388
  transition:color 100ms, background-color 100ms, border-color 100ms;
389
389
  }
390
- ._main_1jyvgzb_56:hover,
391
- ._main_1jyvgzb_56:focus,
392
- ._main_1jyvgzb_56:active{
390
+ ._main_1nfvtky_56:hover,
391
+ ._main_1nfvtky_56:focus,
392
+ ._main_1nfvtky_56:active{
393
393
  outline:none;
394
394
 
395
395
  text-decoration:none;
396
396
  }
397
- ._main_1jyvgzb_56:focus{
397
+ ._main_1nfvtky_56:focus{
398
398
  color:var(--_rs-button-color);
399
399
  background:var(--_rs-button-background);
400
400
  }
401
401
  @media (hover: hover){
402
- ._main_1jyvgzb_56:hover{
402
+ ._main_1nfvtky_56:hover{
403
403
  border-color:rgba(
404
404
  calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227),
405
405
  calc(0.3 + var(--_rs-theme-dark-coefficient, 0)*0.1)
@@ -409,7 +409,7 @@
409
409
  background:var(--_rs-button-hover-background);
410
410
  }
411
411
  }
412
- ._main_1jyvgzb_56:active{
412
+ ._main_1nfvtky_56:active{
413
413
  padding:calc(var(--_rs-button-vertical-padding) - var(--_rs-button-active-border-width)) calc(var(--_rs-button-horizontal-padding) - var(--_rs-button-active-border-width));
414
414
 
415
415
  border-width:var(--_rs-button-active-border-width);
@@ -418,23 +418,23 @@
418
418
  color:var(--_rs-button-color);
419
419
  background:var(--_rs-button-active-background);
420
420
  }
421
- ._main_1jyvgzb_56:focus[data-focus-method='key']{
421
+ ._main_1nfvtky_56:focus[data-focus-method='key']{
422
422
  -webkit-box-shadow:var(--_rs-color-primary-t-dim) 0 0 0 4px;
423
423
  box-shadow:var(--_rs-color-primary-t-dim) 0 0 0 4px;
424
424
  }
425
- ._main_1jyvgzb_56:active:focus:not(:hover)[data-focus-method='key']{
426
- background:var(--_rs-button-focus-background);
425
+ ._main_1nfvtky_56:active:not(:hover):focus[data-focus-method='key']{
426
+ background:var(--_rs-button-active-focus-visible-no-hover-background);
427
427
  }
428
- ._main_1jyvgzb_56._disabled_1jyvgzb_141{
428
+ ._main_1nfvtky_56._disabled_1nfvtky_141{
429
429
  border-color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.2);
430
430
 
431
431
  color:var(--_rs-button-disabled-color);
432
432
  background:var(--_rs-button-disabled-background);
433
433
  }
434
- ._main_1jyvgzb_56._busy_1jyvgzb_148{
434
+ ._main_1nfvtky_56._busy_1nfvtky_148{
435
435
  pointer-events:none;
436
436
  }
437
- ._main_1jyvgzb_56._busyOverlay_1jyvgzb_152{
437
+ ._main_1nfvtky_56._busyOverlay_1nfvtky_152{
438
438
  display:-webkit-inline-box;
439
439
  display:-ms-inline-flexbox;
440
440
  display:inline-flex;
@@ -445,11 +445,11 @@
445
445
  -ms-flex-align:center;
446
446
  align-items:center;
447
447
  }
448
- ._main_1jyvgzb_56._busyOverlay_1jyvgzb_152,
449
- ._main_1jyvgzb_56._busyOverlay_1jyvgzb_152:hover,
450
- ._main_1jyvgzb_56._busyOverlay_1jyvgzb_152:active,
451
- ._main_1jyvgzb_56._busyOverlay_1jyvgzb_152._disabled_1jyvgzb_141,
452
- ._main_1jyvgzb_56._busyOverlay_1jyvgzb_152:focus{
448
+ ._main_1nfvtky_56._busyOverlay_1nfvtky_152,
449
+ ._main_1nfvtky_56._busyOverlay_1nfvtky_152:hover,
450
+ ._main_1nfvtky_56._busyOverlay_1nfvtky_152:active,
451
+ ._main_1nfvtky_56._busyOverlay_1nfvtky_152._disabled_1nfvtky_141,
452
+ ._main_1nfvtky_56._busyOverlay_1nfvtky_152:focus{
453
453
  -webkit-user-select:none;
454
454
  -moz-user-select:none;
455
455
  -ms-user-select:none;
@@ -457,16 +457,16 @@
457
457
 
458
458
  color:transparent;
459
459
  }
460
- ._disabled_1jyvgzb_141{
460
+ ._disabled_1nfvtky_141{
461
461
  pointer-events:none;
462
462
  }
463
- ._allowMultiline_1jyvgzb_173{
463
+ ._allowMultiline_1nfvtky_173{
464
464
  white-space:normal;
465
465
  }
466
- ._multiline_1jyvgzb_177{
466
+ ._multiline_1nfvtky_177{
467
467
  border-radius:var(--_rs-button-multiline-border-radius);
468
468
  }
469
- ._withoutText_1jyvgzb_181{
469
+ ._withoutText_1nfvtky_181{
470
470
  display:-webkit-inline-box;
471
471
  display:-ms-inline-flexbox;
472
472
  display:inline-flex;
@@ -479,10 +479,10 @@
479
479
 
480
480
  padding:calc(var(--_rs-button-vertical-padding) - var(--_rs-button-border-width));
481
481
  }
482
- ._withoutText_1jyvgzb_181:active{
482
+ ._withoutText_1nfvtky_181:active{
483
483
  padding:calc(var(--_rs-button-vertical-padding) - var(--_rs-button-active-border-width));
484
484
  }
485
- ._withIcon_1jyvgzb_197{
485
+ ._withIcon_1nfvtky_197{
486
486
  display:-webkit-inline-box;
487
487
  display:-ms-inline-flexbox;
488
488
  display:inline-flex;
@@ -497,17 +497,17 @@
497
497
  -ms-flex-align:center;
498
498
  align-items:center;
499
499
  }
500
- ._withIcon_1jyvgzb_197 ._icon_1jyvgzb_203{
500
+ ._withIcon_1nfvtky_197 ._icon_1nfvtky_203{
501
501
  width:auto;
502
502
  height:var(--_rs-button-icon-size);
503
503
 
504
504
  margin:var(--_rs-button-icon-margin-top) var(--_rs-button-icon-margin-right) 0 var(--_rs-button-icon-margin-left);
505
505
  fill:currentColor;
506
506
  }
507
- ._withIcon_1jyvgzb_197._withoutText_1jyvgzb_181 ._icon_1jyvgzb_203{
507
+ ._withIcon_1nfvtky_197._withoutText_1nfvtky_181 ._icon_1nfvtky_203{
508
508
  margin:0;
509
509
  }
510
- ._busyIcon_1jyvgzb_217{
510
+ ._busyIcon_1nfvtky_217{
511
511
  position:absolute;
512
512
  top:50%;
513
513
  left:50%;
@@ -516,21 +516,21 @@
516
516
 
517
517
  transform:translate(-50%, -50%);
518
518
  }
519
- ._main_1jyvgzb_56 ._busyIcon_1jyvgzb_217{
519
+ ._main_1nfvtky_56 ._busyIcon_1nfvtky_217{
520
520
  color:var(--_rs-button-color);
521
521
  }
522
- ._main_1jyvgzb_56._disabled_1jyvgzb_141 ._busyIcon_1jyvgzb_217{
522
+ ._main_1nfvtky_56._disabled_1nfvtky_141 ._busyIcon_1nfvtky_217{
523
523
  color:var(--_rs-button-disabled-color);
524
524
  }
525
- ._shiftedLeft_1jyvgzb_234{
525
+ ._shiftedLeft_1nfvtky_234{
526
526
  margin-left:calc(var(--_rs-button-horizontal-padding)*-1);
527
527
  }
528
- ._shiftedRight_1jyvgzb_237{
528
+ ._shiftedRight_1nfvtky_237{
529
529
  margin-right:calc(var(--_rs-button-horizontal-padding)*-1);
530
530
  }
531
- ._shiftedTop_1jyvgzb_240{
531
+ ._shiftedTop_1nfvtky_240{
532
532
  margin-top:calc(var(--_rs-button-vertical-padding)*-1);
533
533
  }
534
- ._shiftedBottom_1jyvgzb_243{
534
+ ._shiftedBottom_1nfvtky_243{
535
535
  margin-bottom:calc(var(--_rs-button-vertical-padding)*-1);
536
536
  }
package/lib/public-api.p.css CHANGED
@@ -216,7 +216,7 @@
216
216
  --_rs-button-background:var(--_rs-color-primary);
217
217
  --_rs-button-hover-background:var(--_rs-color-primary-t-dim);
218
218
  --_rs-button-active-background:var(--_rs-color-primary);
219
- --_rs-button-focus-background:var(--_rs-color-primary-t-dim);
219
+ --_rs-button-active-focus-visible-no-hover-background:var(--_rs-color-primary-t-dim);
220
220
  --_rs-button-disabled-color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.5);
221
221
  --_rs-button-disabled-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.2);
222
222
  }
@@ -229,7 +229,7 @@
229
229
  --_rs-button-background:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
230
230
  --_rs-button-hover-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.8);
231
231
  --_rs-button-active-background:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
232
- --_rs-button-focus-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.8);
232
+ --_rs-button-active-focus-visible-no-hover-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.8);
233
233
  --_rs-button-disabled-color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.5);
234
234
  --_rs-button-disabled-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.2);
235
235
  }
@@ -242,7 +242,7 @@
242
242
  --_rs-button-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.5);
243
243
  --_rs-button-hover-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.8);
244
244
  --_rs-button-active-background:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
245
- --_rs-button-focus-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.5);
245
+ --_rs-button-active-focus-visible-no-hover-background:var(--_rs-button-active-background);
246
246
  --_rs-button-disabled-color:rgba(calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*227), 0.5);
247
247
  --_rs-button-disabled-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.4);
248
248
  }
@@ -255,7 +255,7 @@
255
255
  --_rs-button-background:transparent;
256
256
  --_rs-button-hover-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.1);
257
257
  --_rs-button-active-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.1);
258
- --_rs-button-focus-background:transparent;
258
+ --_rs-button-active-focus-visible-no-hover-background:var(--_rs-button-active-background);
259
259
  --_rs-button-disabled-color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.5);
260
260
  --_rs-button-disabled-background:transparent;
261
261
  }
@@ -268,7 +268,7 @@
268
268
  --_rs-button-background:transparent;
269
269
  --_rs-button-hover-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.1);
270
270
  --_rs-button-active-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.2);
271
- --_rs-button-focus-background:transparent;
271
+ --_rs-button-active-focus-visible-no-hover-background:var(--_rs-button-active-background);
272
272
  --_rs-button-disabled-color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.5);
273
273
  --_rs-button-disabled-background:transparent;
274
274
  }
package/lib/public-api.pcss CHANGED
@@ -216,7 +216,7 @@
216
216
  --_rs-button-background:var(--_rs-color-primary);
217
217
  --_rs-button-hover-background:var(--_rs-color-primary-t-dim);
218
218
  --_rs-button-active-background:var(--_rs-color-primary);
219
- --_rs-button-focus-background:var(--_rs-color-primary-t-dim);
219
+ --_rs-button-active-focus-visible-no-hover-background:var(--_rs-color-primary-t-dim);
220
220
  --_rs-button-disabled-color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.5);
221
221
  --_rs-button-disabled-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.2);
222
222
  }
@@ -229,7 +229,7 @@
229
229
  --_rs-button-background:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
230
230
  --_rs-button-hover-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.8);
231
231
  --_rs-button-active-background:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
232
- --_rs-button-focus-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.8);
232
+ --_rs-button-active-focus-visible-no-hover-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.8);
233
233
  --_rs-button-disabled-color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.5);
234
234
  --_rs-button-disabled-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.2);
235
235
  }
@@ -242,7 +242,7 @@
242
242
  --_rs-button-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.5);
243
243
  --_rs-button-hover-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.8);
244
244
  --_rs-button-active-background:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
245
- --_rs-button-focus-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.5);
245
+ --_rs-button-active-focus-visible-no-hover-background:var(--_rs-button-active-background);
246
246
  --_rs-button-disabled-color:rgba(calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*227), 0.5);
247
247
  --_rs-button-disabled-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.4);
248
248
  }
@@ -255,7 +255,7 @@
255
255
  --_rs-button-background:transparent;
256
256
  --_rs-button-hover-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.1);
257
257
  --_rs-button-active-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.1);
258
- --_rs-button-focus-background:transparent;
258
+ --_rs-button-active-focus-visible-no-hover-background:var(--_rs-button-active-background);
259
259
  --_rs-button-disabled-color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.5);
260
260
  --_rs-button-disabled-background:transparent;
261
261
  }
@@ -268,7 +268,7 @@
268
268
  --_rs-button-background:transparent;
269
269
  --_rs-button-hover-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.1);
270
270
  --_rs-button-active-background:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.2);
271
- --_rs-button-focus-background:transparent;
271
+ --_rs-button-active-focus-visible-no-hover-background:var(--_rs-button-active-background);
272
272
  --_rs-button-disabled-color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.5);
273
273
  --_rs-button-disabled-background:transparent;
274
274
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rescui/button",
3
- "version": "0.15.2",
3
+ "version": "0.15.3",
4
4
  "description": "",
5
5
  "license": "Apache-2.0",
6
6
  "author": "JetBrains",
@@ -36,5 +36,5 @@
36
36
  "build": "rescui-scripts build && yarn run build-pcss-api",
37
37
  "build-pcss-api": "rescui-scripts build-pcss-api --file public-api.p.css"
38
38
  },
39
- "gitHead": "73268bf009792a4c5565b66806ed063c0c503ba2"
39
+ "gitHead": "a5690100cda7d749a58c4082d1d1eb3c4fc63970"
40
40
  }