@syncfusion/ej2-splitbuttons 25.1.38 → 25.2.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 (41) hide show
  1. package/CHANGELOG.md +2 -0
  2. package/dist/ej2-splitbuttons.min.js +1 -1
  3. package/dist/ej2-splitbuttons.umd.min.js +1 -1
  4. package/dist/global/ej2-splitbuttons.min.js +1 -1
  5. package/dist/global/index.d.ts +1 -1
  6. package/package.json +7 -7
  7. package/styles/bootstrap-dark.css +26 -26
  8. package/styles/bootstrap.css +26 -26
  9. package/styles/bootstrap4.css +26 -26
  10. package/styles/bootstrap5-dark.css +26 -26
  11. package/styles/bootstrap5.css +26 -26
  12. package/styles/button-group/_theme.scss +1 -1
  13. package/styles/button-group/bootstrap-dark.css +26 -26
  14. package/styles/button-group/bootstrap.css +26 -26
  15. package/styles/button-group/bootstrap4.css +26 -26
  16. package/styles/button-group/bootstrap5-dark.css +26 -26
  17. package/styles/button-group/bootstrap5.css +26 -26
  18. package/styles/button-group/fabric-dark.css +26 -26
  19. package/styles/button-group/fabric.css +26 -26
  20. package/styles/button-group/fluent-dark.css +26 -26
  21. package/styles/button-group/fluent.css +26 -26
  22. package/styles/button-group/highcontrast-light.css +26 -26
  23. package/styles/button-group/highcontrast.css +26 -26
  24. package/styles/button-group/material-dark.css +26 -26
  25. package/styles/button-group/material.css +26 -26
  26. package/styles/button-group/material3-dark.css +26 -26
  27. package/styles/button-group/material3.css +26 -26
  28. package/styles/button-group/tailwind-dark.css +26 -26
  29. package/styles/button-group/tailwind.css +26 -26
  30. package/styles/fabric-dark.css +26 -26
  31. package/styles/fabric.css +26 -26
  32. package/styles/fluent-dark.css +26 -26
  33. package/styles/fluent.css +26 -26
  34. package/styles/highcontrast-light.css +26 -26
  35. package/styles/highcontrast.css +26 -26
  36. package/styles/material-dark.css +26 -26
  37. package/styles/material.css +26 -26
  38. package/styles/material3-dark.css +26 -26
  39. package/styles/material3.css +26 -26
  40. package/styles/tailwind-dark.css +26 -26
  41. package/styles/tailwind.css +26 -26
package/styles/button-group/material.css CHANGED
@@ -249,9 +249,9 @@
249
249
  box-shadow: none;
250
250
  }
251
251
  .e-btn-group .e-btn:focus,
252
- .e-btn-group input:focus + label.e-btn,
252
+ .e-btn-group input:focus-visible + label.e-btn,
253
253
  .e-css.e-btn-group .e-btn:focus,
254
- .e-css.e-btn-group input:focus + label.e-btn {
254
+ .e-css.e-btn-group input:focus-visible + label.e-btn {
255
255
  background: rgba(0, 0, 0, 0.18);
256
256
  border-color: transparent;
257
257
  color: rgba(0, 0, 0, 0.87);
@@ -262,9 +262,9 @@
262
262
  outline-color: inherit;
263
263
  }
264
264
  .e-btn-group .e-btn:focus.e-primary,
265
- .e-btn-group input:focus + label.e-btn.e-primary,
265
+ .e-btn-group input:focus-visible + label.e-btn.e-primary,
266
266
  .e-css.e-btn-group .e-btn:focus.e-primary,
267
- .e-css.e-btn-group input:focus + label.e-btn.e-primary {
267
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-primary {
268
268
  background: #ea4e82;
269
269
  border-color: transparent;
270
270
  color: #fff;
@@ -274,9 +274,9 @@
274
274
  outline-color: inherit;
275
275
  }
276
276
  .e-btn-group .e-btn:focus.e-success,
277
- .e-btn-group input:focus + label.e-btn.e-success,
277
+ .e-btn-group input:focus-visible + label.e-btn.e-success,
278
278
  .e-css.e-btn-group .e-btn:focus.e-success,
279
- .e-css.e-btn-group input:focus + label.e-btn.e-success {
279
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-success {
280
280
  background: #78a253;
281
281
  border-color: transparent;
282
282
  color: #fff;
@@ -285,9 +285,9 @@
285
285
  outline-color: inherit;
286
286
  }
287
287
  .e-btn-group .e-btn:focus.e-info,
288
- .e-btn-group input:focus + label.e-btn.e-info,
288
+ .e-btn-group input:focus-visible + label.e-btn.e-info,
289
289
  .e-css.e-btn-group .e-btn:focus.e-info,
290
- .e-css.e-btn-group input:focus + label.e-btn.e-info {
290
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-info {
291
291
  background: #3f98df;
292
292
  border-color: transparent;
293
293
  color: #fff;
@@ -296,9 +296,9 @@
296
296
  outline-color: inherit;
297
297
  }
298
298
  .e-btn-group .e-btn:focus.e-warning,
299
- .e-btn-group input:focus + label.e-btn.e-warning,
299
+ .e-btn-group input:focus-visible + label.e-btn.e-warning,
300
300
  .e-css.e-btn-group .e-btn:focus.e-warning,
301
- .e-css.e-btn-group input:focus + label.e-btn.e-warning {
301
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-warning {
302
302
  background: #d07f3d;
303
303
  border-color: transparent;
304
304
  color: #fff;
@@ -307,9 +307,9 @@
307
307
  outline-color: inherit;
308
308
  }
309
309
  .e-btn-group .e-btn:focus.e-danger,
310
- .e-btn-group input:focus + label.e-btn.e-danger,
310
+ .e-btn-group input:focus-visible + label.e-btn.e-danger,
311
311
  .e-css.e-btn-group .e-btn:focus.e-danger,
312
- .e-css.e-btn-group input:focus + label.e-btn.e-danger {
312
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-danger {
313
313
  background: #e06f4c;
314
314
  border-color: transparent;
315
315
  color: #fff;
@@ -318,9 +318,9 @@
318
318
  outline-color: inherit;
319
319
  }
320
320
  .e-btn-group .e-btn:focus.e-link,
321
- .e-btn-group input:focus + label.e-btn.e-link,
321
+ .e-btn-group input:focus-visible + label.e-btn.e-link,
322
322
  .e-css.e-btn-group .e-btn:focus.e-link,
323
- .e-css.e-btn-group input:focus + label.e-btn.e-link {
323
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-link {
324
324
  border-radius: 0;
325
325
  text-decoration: underline;
326
326
  color: #0a3576;
@@ -330,40 +330,40 @@
330
330
  outline: none;
331
331
  }
332
332
  .e-btn-group .e-btn:focus.e-outline,
333
- .e-btn-group input:focus + label.e-btn.e-outline,
333
+ .e-btn-group input:focus-visible + label.e-btn.e-outline,
334
334
  .e-css.e-btn-group .e-btn:focus.e-outline,
335
- .e-css.e-btn-group input:focus + label.e-btn.e-outline {
335
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline {
336
336
  box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
337
337
  box-shadow: none;
338
338
  }
339
339
  .e-btn-group .e-btn:focus.e-outline.e-primary,
340
- .e-btn-group input:focus + label.e-btn.e-outline.e-primary,
340
+ .e-btn-group input:focus-visible + label.e-btn.e-outline.e-primary,
341
341
  .e-css.e-btn-group .e-btn:focus.e-outline.e-primary,
342
- .e-css.e-btn-group input:focus + label.e-btn.e-outline.e-primary {
342
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline.e-primary {
343
343
  box-shadow: none;
344
344
  }
345
345
  .e-btn-group .e-btn:focus.e-outline.e-success,
346
- .e-btn-group input:focus + label.e-btn.e-outline.e-success,
346
+ .e-btn-group input:focus-visible + label.e-btn.e-outline.e-success,
347
347
  .e-css.e-btn-group .e-btn:focus.e-outline.e-success,
348
- .e-css.e-btn-group input:focus + label.e-btn.e-outline.e-success {
348
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline.e-success {
349
349
  box-shadow: none;
350
350
  }
351
351
  .e-btn-group .e-btn:focus.e-outline.e-info,
352
- .e-btn-group input:focus + label.e-btn.e-outline.e-info,
352
+ .e-btn-group input:focus-visible + label.e-btn.e-outline.e-info,
353
353
  .e-css.e-btn-group .e-btn:focus.e-outline.e-info,
354
- .e-css.e-btn-group input:focus + label.e-btn.e-outline.e-info {
354
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline.e-info {
355
355
  box-shadow: none;
356
356
  }
357
357
  .e-btn-group .e-btn:focus.e-outline.e-warning,
358
- .e-btn-group input:focus + label.e-btn.e-outline.e-warning,
358
+ .e-btn-group input:focus-visible + label.e-btn.e-outline.e-warning,
359
359
  .e-css.e-btn-group .e-btn:focus.e-outline.e-warning,
360
- .e-css.e-btn-group input:focus + label.e-btn.e-outline.e-warning {
360
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline.e-warning {
361
361
  box-shadow: none;
362
362
  }
363
363
  .e-btn-group .e-btn:focus.e-outline.e-danger,
364
- .e-btn-group input:focus + label.e-btn.e-outline.e-danger,
364
+ .e-btn-group input:focus-visible + label.e-btn.e-outline.e-danger,
365
365
  .e-css.e-btn-group .e-btn:focus.e-outline.e-danger,
366
- .e-css.e-btn-group input:focus + label.e-btn.e-outline.e-danger {
366
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline.e-danger {
367
367
  box-shadow: none;
368
368
  }
369
369
  .e-btn-group .e-btn:active,
package/styles/button-group/material3-dark.css CHANGED
@@ -350,9 +350,9 @@
350
350
  z-index: 1;
351
351
  }
352
352
  .e-btn-group .e-btn:focus,
353
- .e-btn-group input:focus + label.e-btn,
353
+ .e-btn-group input:focus-visible + label.e-btn,
354
354
  .e-css.e-btn-group .e-btn:focus,
355
- .e-css.e-btn-group input:focus + label.e-btn {
355
+ .e-css.e-btn-group input:focus-visible + label.e-btn {
356
356
  background: linear-gradient(0deg, rgba(var(--color-sf-on-surface), 0.08), rgba(var(--color-sf-on-surface), 0.08)), rgba(var(--color-sf-surface));
357
357
  border-image: linear-gradient(0deg, rgba(var(--color-sf-on-surface), 0.08), rgba(var(--color-sf-on-surface), 0.08));
358
358
  color: rgba(var(--color-sf-on-surface));
@@ -363,9 +363,9 @@
363
363
  outline-color: inherit;
364
364
  }
365
365
  .e-btn-group .e-btn:focus.e-primary,
366
- .e-btn-group input:focus + label.e-btn.e-primary,
366
+ .e-btn-group input:focus-visible + label.e-btn.e-primary,
367
367
  .e-css.e-btn-group .e-btn:focus.e-primary,
368
- .e-css.e-btn-group input:focus + label.e-btn.e-primary {
368
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-primary {
369
369
  background: linear-gradient(0deg, rgba(var(--color-sf-on-primary), 0.08), rgba(var(--color-sf-on-primary), 0.08)), rgba(var(--color-sf-primary));
370
370
  border-color: rgba(var(--color-sf-primary));
371
371
  color: rgba(var(--color-sf-on-primary));
@@ -375,9 +375,9 @@
375
375
  outline-color: inherit;
376
376
  }
377
377
  .e-btn-group .e-btn:focus.e-success,
378
- .e-btn-group input:focus + label.e-btn.e-success,
378
+ .e-btn-group input:focus-visible + label.e-btn.e-success,
379
379
  .e-css.e-btn-group .e-btn:focus.e-success,
380
- .e-css.e-btn-group input:focus + label.e-btn.e-success {
380
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-success {
381
381
  background: linear-gradient(0deg, rgba(var(--color-sf-success-text), 0.08), rgba(var(--color-sf-success-text), 0.08)), rgba(var(--color-sf-success));
382
382
  border-color: rgba(var(--color-sf-success));
383
383
  color: rgba(var(--color-sf-success-text));
@@ -386,9 +386,9 @@
386
386
  outline-color: inherit;
387
387
  }
388
388
  .e-btn-group .e-btn:focus.e-info,
389
- .e-btn-group input:focus + label.e-btn.e-info,
389
+ .e-btn-group input:focus-visible + label.e-btn.e-info,
390
390
  .e-css.e-btn-group .e-btn:focus.e-info,
391
- .e-css.e-btn-group input:focus + label.e-btn.e-info {
391
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-info {
392
392
  background: linear-gradient(0deg, rgba(var(--color-sf-info-text), 0.08), rgba(var(--color-sf-info-text), 0.08)), rgba(var(--color-sf-info));
393
393
  border-color: rgba(var(--color-sf-info));
394
394
  color: rgba(var(--color-sf-info-text));
@@ -397,9 +397,9 @@
397
397
  outline-color: inherit;
398
398
  }
399
399
  .e-btn-group .e-btn:focus.e-warning,
400
- .e-btn-group input:focus + label.e-btn.e-warning,
400
+ .e-btn-group input:focus-visible + label.e-btn.e-warning,
401
401
  .e-css.e-btn-group .e-btn:focus.e-warning,
402
- .e-css.e-btn-group input:focus + label.e-btn.e-warning {
402
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-warning {
403
403
  background: linear-gradient(0deg, rgba(var(--color-sf-warning-text), 0.08), rgba(var(--color-sf-warning-text), 0.08)), rgba(var(--color-sf-warning));
404
404
  border-color: rgba(var(--color-sf-warning));
405
405
  color: rgba(var(--color-sf-warning-text));
@@ -408,9 +408,9 @@
408
408
  outline-color: inherit;
409
409
  }
410
410
  .e-btn-group .e-btn:focus.e-danger,
411
- .e-btn-group input:focus + label.e-btn.e-danger,
411
+ .e-btn-group input:focus-visible + label.e-btn.e-danger,
412
412
  .e-css.e-btn-group .e-btn:focus.e-danger,
413
- .e-css.e-btn-group input:focus + label.e-btn.e-danger {
413
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-danger {
414
414
  background: linear-gradient(0deg, rgba(var(--color-sf-danger-text), 0.08), rgba(var(--color-sf-danger-text), 0.08)), rgba(var(--color-sf-error));
415
415
  border-color: rgba(var(--color-sf-error));
416
416
  color: rgba(var(--color-sf-danger-text));
@@ -419,9 +419,9 @@
419
419
  outline-color: inherit;
420
420
  }
421
421
  .e-btn-group .e-btn:focus.e-link,
422
- .e-btn-group input:focus + label.e-btn.e-link,
422
+ .e-btn-group input:focus-visible + label.e-btn.e-link,
423
423
  .e-css.e-btn-group .e-btn:focus.e-link,
424
- .e-css.e-btn-group input:focus + label.e-btn.e-link {
424
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-link {
425
425
  border-radius: 0;
426
426
  text-decoration: underline;
427
427
  color: rgba(var(--color-sf-info));
@@ -431,54 +431,54 @@
431
431
  outline: none;
432
432
  }
433
433
  .e-btn-group .e-btn:focus.e-outline,
434
- .e-btn-group input:focus + label.e-btn.e-outline,
434
+ .e-btn-group input:focus-visible + label.e-btn.e-outline,
435
435
  .e-css.e-btn-group .e-btn:focus.e-outline,
436
- .e-css.e-btn-group input:focus + label.e-btn.e-outline {
436
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline {
437
437
  background: rgba(var(--color-sf-on-surface), 0.12);
438
438
  border: 1px solid rgba(var(--color-sf-outline));
439
439
  color: rgba(var(--color-sf-on-surface));
440
440
  box-shadow: none;
441
441
  }
442
442
  .e-btn-group .e-btn:focus.e-outline.e-primary,
443
- .e-btn-group input:focus + label.e-btn.e-outline.e-primary,
443
+ .e-btn-group input:focus-visible + label.e-btn.e-outline.e-primary,
444
444
  .e-css.e-btn-group .e-btn:focus.e-outline.e-primary,
445
- .e-css.e-btn-group input:focus + label.e-btn.e-outline.e-primary {
445
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline.e-primary {
446
446
  background: rgba(var(--color-sf-primary), 0.12);
447
447
  border: 1px solid rgba(var(--color-sf-outline));
448
448
  color: rgba(var(--color-sf-primary));
449
449
  box-shadow: none;
450
450
  }
451
451
  .e-btn-group .e-btn:focus.e-outline.e-success,
452
- .e-btn-group input:focus + label.e-btn.e-outline.e-success,
452
+ .e-btn-group input:focus-visible + label.e-btn.e-outline.e-success,
453
453
  .e-css.e-btn-group .e-btn:focus.e-outline.e-success,
454
- .e-css.e-btn-group input:focus + label.e-btn.e-outline.e-success {
454
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline.e-success {
455
455
  background: rgba(var(--color-sf-success), 0.12);
456
456
  border: 1px solid rgba(var(--color-sf-outline));
457
457
  color: rgba(var(--color-sf-success));
458
458
  box-shadow: none;
459
459
  }
460
460
  .e-btn-group .e-btn:focus.e-outline.e-info,
461
- .e-btn-group input:focus + label.e-btn.e-outline.e-info,
461
+ .e-btn-group input:focus-visible + label.e-btn.e-outline.e-info,
462
462
  .e-css.e-btn-group .e-btn:focus.e-outline.e-info,
463
- .e-css.e-btn-group input:focus + label.e-btn.e-outline.e-info {
463
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline.e-info {
464
464
  background: rgba(var(--color-sf-info), 0.12);
465
465
  border: 1px solid rgba(var(--color-sf-outline));
466
466
  color: rgba(var(--color-sf-info));
467
467
  box-shadow: none;
468
468
  }
469
469
  .e-btn-group .e-btn:focus.e-outline.e-warning,
470
- .e-btn-group input:focus + label.e-btn.e-outline.e-warning,
470
+ .e-btn-group input:focus-visible + label.e-btn.e-outline.e-warning,
471
471
  .e-css.e-btn-group .e-btn:focus.e-outline.e-warning,
472
- .e-css.e-btn-group input:focus + label.e-btn.e-outline.e-warning {
472
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline.e-warning {
473
473
  background: rgba(var(--color-sf-warning), 0.12);
474
474
  border: 1px solid rgba(var(--color-sf-outline));
475
475
  color: rgba(var(--color-sf-warning));
476
476
  box-shadow: none;
477
477
  }
478
478
  .e-btn-group .e-btn:focus.e-outline.e-danger,
479
- .e-btn-group input:focus + label.e-btn.e-outline.e-danger,
479
+ .e-btn-group input:focus-visible + label.e-btn.e-outline.e-danger,
480
480
  .e-css.e-btn-group .e-btn:focus.e-outline.e-danger,
481
- .e-css.e-btn-group input:focus + label.e-btn.e-outline.e-danger {
481
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline.e-danger {
482
482
  background: rgba(var(--color-sf-error), 0.12);
483
483
  border: 1px solid rgba(var(--color-sf-outline));
484
484
  color: rgba(var(--color-sf-error));
package/styles/button-group/material3.css CHANGED
@@ -406,9 +406,9 @@
406
406
  z-index: 1;
407
407
  }
408
408
  .e-btn-group .e-btn:focus,
409
- .e-btn-group input:focus + label.e-btn,
409
+ .e-btn-group input:focus-visible + label.e-btn,
410
410
  .e-css.e-btn-group .e-btn:focus,
411
- .e-css.e-btn-group input:focus + label.e-btn {
411
+ .e-css.e-btn-group input:focus-visible + label.e-btn {
412
412
  background: linear-gradient(0deg, rgba(var(--color-sf-on-surface), 0.08), rgba(var(--color-sf-on-surface), 0.08)), rgba(var(--color-sf-surface));
413
413
  border-image: linear-gradient(0deg, rgba(var(--color-sf-on-surface), 0.08), rgba(var(--color-sf-on-surface), 0.08));
414
414
  color: rgba(var(--color-sf-on-surface));
@@ -419,9 +419,9 @@
419
419
  outline-color: inherit;
420
420
  }
421
421
  .e-btn-group .e-btn:focus.e-primary,
422
- .e-btn-group input:focus + label.e-btn.e-primary,
422
+ .e-btn-group input:focus-visible + label.e-btn.e-primary,
423
423
  .e-css.e-btn-group .e-btn:focus.e-primary,
424
- .e-css.e-btn-group input:focus + label.e-btn.e-primary {
424
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-primary {
425
425
  background: linear-gradient(0deg, rgba(var(--color-sf-on-primary), 0.08), rgba(var(--color-sf-on-primary), 0.08)), rgba(var(--color-sf-primary));
426
426
  border-color: rgba(var(--color-sf-primary));
427
427
  color: rgba(var(--color-sf-on-primary));
@@ -431,9 +431,9 @@
431
431
  outline-color: inherit;
432
432
  }
433
433
  .e-btn-group .e-btn:focus.e-success,
434
- .e-btn-group input:focus + label.e-btn.e-success,
434
+ .e-btn-group input:focus-visible + label.e-btn.e-success,
435
435
  .e-css.e-btn-group .e-btn:focus.e-success,
436
- .e-css.e-btn-group input:focus + label.e-btn.e-success {
436
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-success {
437
437
  background: linear-gradient(0deg, rgba(var(--color-sf-success-text), 0.08), rgba(var(--color-sf-success-text), 0.08)), rgba(var(--color-sf-success));
438
438
  border-color: rgba(var(--color-sf-success));
439
439
  color: rgba(var(--color-sf-success-text));
@@ -442,9 +442,9 @@
442
442
  outline-color: inherit;
443
443
  }
444
444
  .e-btn-group .e-btn:focus.e-info,
445
- .e-btn-group input:focus + label.e-btn.e-info,
445
+ .e-btn-group input:focus-visible + label.e-btn.e-info,
446
446
  .e-css.e-btn-group .e-btn:focus.e-info,
447
- .e-css.e-btn-group input:focus + label.e-btn.e-info {
447
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-info {
448
448
  background: linear-gradient(0deg, rgba(var(--color-sf-info-text), 0.08), rgba(var(--color-sf-info-text), 0.08)), rgba(var(--color-sf-info));
449
449
  border-color: rgba(var(--color-sf-info));
450
450
  color: rgba(var(--color-sf-info-text));
@@ -453,9 +453,9 @@
453
453
  outline-color: inherit;
454
454
  }
455
455
  .e-btn-group .e-btn:focus.e-warning,
456
- .e-btn-group input:focus + label.e-btn.e-warning,
456
+ .e-btn-group input:focus-visible + label.e-btn.e-warning,
457
457
  .e-css.e-btn-group .e-btn:focus.e-warning,
458
- .e-css.e-btn-group input:focus + label.e-btn.e-warning {
458
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-warning {
459
459
  background: linear-gradient(0deg, rgba(var(--color-sf-warning-text), 0.08), rgba(var(--color-sf-warning-text), 0.08)), rgba(var(--color-sf-warning));
460
460
  border-color: rgba(var(--color-sf-warning));
461
461
  color: rgba(var(--color-sf-warning-text));
@@ -464,9 +464,9 @@
464
464
  outline-color: inherit;
465
465
  }
466
466
  .e-btn-group .e-btn:focus.e-danger,
467
- .e-btn-group input:focus + label.e-btn.e-danger,
467
+ .e-btn-group input:focus-visible + label.e-btn.e-danger,
468
468
  .e-css.e-btn-group .e-btn:focus.e-danger,
469
- .e-css.e-btn-group input:focus + label.e-btn.e-danger {
469
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-danger {
470
470
  background: linear-gradient(0deg, rgba(var(--color-sf-danger-text), 0.08), rgba(var(--color-sf-danger-text), 0.08)), rgba(var(--color-sf-error));
471
471
  border-color: rgba(var(--color-sf-error));
472
472
  color: rgba(var(--color-sf-danger-text));
@@ -475,9 +475,9 @@
475
475
  outline-color: inherit;
476
476
  }
477
477
  .e-btn-group .e-btn:focus.e-link,
478
- .e-btn-group input:focus + label.e-btn.e-link,
478
+ .e-btn-group input:focus-visible + label.e-btn.e-link,
479
479
  .e-css.e-btn-group .e-btn:focus.e-link,
480
- .e-css.e-btn-group input:focus + label.e-btn.e-link {
480
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-link {
481
481
  border-radius: 0;
482
482
  text-decoration: underline;
483
483
  color: rgba(var(--color-sf-info));
@@ -487,54 +487,54 @@
487
487
  outline: none;
488
488
  }
489
489
  .e-btn-group .e-btn:focus.e-outline,
490
- .e-btn-group input:focus + label.e-btn.e-outline,
490
+ .e-btn-group input:focus-visible + label.e-btn.e-outline,
491
491
  .e-css.e-btn-group .e-btn:focus.e-outline,
492
- .e-css.e-btn-group input:focus + label.e-btn.e-outline {
492
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline {
493
493
  background: rgba(var(--color-sf-on-surface), 0.12);
494
494
  border: 1px solid rgba(var(--color-sf-outline));
495
495
  color: rgba(var(--color-sf-on-surface));
496
496
  box-shadow: none;
497
497
  }
498
498
  .e-btn-group .e-btn:focus.e-outline.e-primary,
499
- .e-btn-group input:focus + label.e-btn.e-outline.e-primary,
499
+ .e-btn-group input:focus-visible + label.e-btn.e-outline.e-primary,
500
500
  .e-css.e-btn-group .e-btn:focus.e-outline.e-primary,
501
- .e-css.e-btn-group input:focus + label.e-btn.e-outline.e-primary {
501
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline.e-primary {
502
502
  background: rgba(var(--color-sf-primary), 0.12);
503
503
  border: 1px solid rgba(var(--color-sf-outline));
504
504
  color: rgba(var(--color-sf-primary));
505
505
  box-shadow: none;
506
506
  }
507
507
  .e-btn-group .e-btn:focus.e-outline.e-success,
508
- .e-btn-group input:focus + label.e-btn.e-outline.e-success,
508
+ .e-btn-group input:focus-visible + label.e-btn.e-outline.e-success,
509
509
  .e-css.e-btn-group .e-btn:focus.e-outline.e-success,
510
- .e-css.e-btn-group input:focus + label.e-btn.e-outline.e-success {
510
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline.e-success {
511
511
  background: rgba(var(--color-sf-success), 0.12);
512
512
  border: 1px solid rgba(var(--color-sf-outline));
513
513
  color: rgba(var(--color-sf-success));
514
514
  box-shadow: none;
515
515
  }
516
516
  .e-btn-group .e-btn:focus.e-outline.e-info,
517
- .e-btn-group input:focus + label.e-btn.e-outline.e-info,
517
+ .e-btn-group input:focus-visible + label.e-btn.e-outline.e-info,
518
518
  .e-css.e-btn-group .e-btn:focus.e-outline.e-info,
519
- .e-css.e-btn-group input:focus + label.e-btn.e-outline.e-info {
519
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline.e-info {
520
520
  background: rgba(var(--color-sf-info), 0.12);
521
521
  border: 1px solid rgba(var(--color-sf-outline));
522
522
  color: rgba(var(--color-sf-info));
523
523
  box-shadow: none;
524
524
  }
525
525
  .e-btn-group .e-btn:focus.e-outline.e-warning,
526
- .e-btn-group input:focus + label.e-btn.e-outline.e-warning,
526
+ .e-btn-group input:focus-visible + label.e-btn.e-outline.e-warning,
527
527
  .e-css.e-btn-group .e-btn:focus.e-outline.e-warning,
528
- .e-css.e-btn-group input:focus + label.e-btn.e-outline.e-warning {
528
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline.e-warning {
529
529
  background: rgba(var(--color-sf-warning), 0.12);
530
530
  border: 1px solid rgba(var(--color-sf-outline));
531
531
  color: rgba(var(--color-sf-warning));
532
532
  box-shadow: none;
533
533
  }
534
534
  .e-btn-group .e-btn:focus.e-outline.e-danger,
535
- .e-btn-group input:focus + label.e-btn.e-outline.e-danger,
535
+ .e-btn-group input:focus-visible + label.e-btn.e-outline.e-danger,
536
536
  .e-css.e-btn-group .e-btn:focus.e-outline.e-danger,
537
- .e-css.e-btn-group input:focus + label.e-btn.e-outline.e-danger {
537
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline.e-danger {
538
538
  background: rgba(var(--color-sf-error), 0.12);
539
539
  border: 1px solid rgba(var(--color-sf-outline));
540
540
  color: rgba(var(--color-sf-error));
package/styles/button-group/tailwind-dark.css CHANGED
@@ -253,9 +253,9 @@
253
253
  box-shadow: none;
254
254
  }
255
255
  .e-btn-group .e-btn:focus,
256
- .e-btn-group input:focus + label.e-btn,
256
+ .e-btn-group input:focus-visible + label.e-btn,
257
257
  .e-css.e-btn-group .e-btn:focus,
258
- .e-css.e-btn-group input:focus + label.e-btn {
258
+ .e-css.e-btn-group input:focus-visible + label.e-btn {
259
259
  background: #374151;
260
260
  border-color: #6b7280;
261
261
  color: #fff;
@@ -265,9 +265,9 @@
265
265
  outline-color: inherit;
266
266
  }
267
267
  .e-btn-group .e-btn:focus.e-primary,
268
- .e-btn-group input:focus + label.e-btn.e-primary,
268
+ .e-btn-group input:focus-visible + label.e-btn.e-primary,
269
269
  .e-css.e-btn-group .e-btn:focus.e-primary,
270
- .e-css.e-btn-group input:focus + label.e-btn.e-primary {
270
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-primary {
271
271
  background: #06b6d4;
272
272
  border-color: #22d3ee;
273
273
  color: #000;
@@ -276,9 +276,9 @@
276
276
  outline-color: inherit;
277
277
  }
278
278
  .e-btn-group .e-btn:focus.e-success,
279
- .e-btn-group input:focus + label.e-btn.e-success,
279
+ .e-btn-group input:focus-visible + label.e-btn.e-success,
280
280
  .e-css.e-btn-group .e-btn:focus.e-success,
281
- .e-css.e-btn-group input:focus + label.e-btn.e-success {
281
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-success {
282
282
  background: #16a34a;
283
283
  border-color: #22c55e;
284
284
  color: #000;
@@ -286,9 +286,9 @@
286
286
  outline-color: inherit;
287
287
  }
288
288
  .e-btn-group .e-btn:focus.e-info,
289
- .e-btn-group input:focus + label.e-btn.e-info,
289
+ .e-btn-group input:focus-visible + label.e-btn.e-info,
290
290
  .e-css.e-btn-group .e-btn:focus.e-info,
291
- .e-css.e-btn-group input:focus + label.e-btn.e-info {
291
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-info {
292
292
  background: #0284c7;
293
293
  border-color: #0ea5e9;
294
294
  color: #fff;
@@ -296,9 +296,9 @@
296
296
  outline-color: inherit;
297
297
  }
298
298
  .e-btn-group .e-btn:focus.e-warning,
299
- .e-btn-group input:focus + label.e-btn.e-warning,
299
+ .e-btn-group input:focus-visible + label.e-btn.e-warning,
300
300
  .e-css.e-btn-group .e-btn:focus.e-warning,
301
- .e-css.e-btn-group input:focus + label.e-btn.e-warning {
301
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-warning {
302
302
  background: #c2410c;
303
303
  border-color: #ea580c;
304
304
  color: #fff;
@@ -306,9 +306,9 @@
306
306
  outline-color: inherit;
307
307
  }
308
308
  .e-btn-group .e-btn:focus.e-danger,
309
- .e-btn-group input:focus + label.e-btn.e-danger,
309
+ .e-btn-group input:focus-visible + label.e-btn.e-danger,
310
310
  .e-css.e-btn-group .e-btn:focus.e-danger,
311
- .e-css.e-btn-group input:focus + label.e-btn.e-danger {
311
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-danger {
312
312
  background: #ef4444;
313
313
  border-color: #f87171;
314
314
  color: #000;
@@ -316,9 +316,9 @@
316
316
  outline-color: inherit;
317
317
  }
318
318
  .e-btn-group .e-btn:focus.e-link,
319
- .e-btn-group input:focus + label.e-btn.e-link,
319
+ .e-btn-group input:focus-visible + label.e-btn.e-link,
320
320
  .e-css.e-btn-group .e-btn:focus.e-link,
321
- .e-css.e-btn-group input:focus + label.e-btn.e-link {
321
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-link {
322
322
  border-radius: 0;
323
323
  text-decoration: underline;
324
324
  color: #67e8f9;
@@ -328,40 +328,40 @@
328
328
  outline: none;
329
329
  }
330
330
  .e-btn-group .e-btn:focus.e-outline,
331
- .e-btn-group input:focus + label.e-btn.e-outline,
331
+ .e-btn-group input:focus-visible + label.e-btn.e-outline,
332
332
  .e-css.e-btn-group .e-btn:focus.e-outline,
333
- .e-css.e-btn-group input:focus + label.e-btn.e-outline {
333
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline {
334
334
  box-shadow: 0 0 0 2px rgba(31, 41, 55, 0.95), 0 0 0 4px #22d3ee;
335
335
  box-shadow: none;
336
336
  }
337
337
  .e-btn-group .e-btn:focus.e-outline.e-primary,
338
- .e-btn-group input:focus + label.e-btn.e-outline.e-primary,
338
+ .e-btn-group input:focus-visible + label.e-btn.e-outline.e-primary,
339
339
  .e-css.e-btn-group .e-btn:focus.e-outline.e-primary,
340
- .e-css.e-btn-group input:focus + label.e-btn.e-outline.e-primary {
340
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline.e-primary {
341
341
  box-shadow: 0 0 0 2px rgba(31, 41, 55, 0.95), 0 0 0 4px #22d3ee;
342
342
  }
343
343
  .e-btn-group .e-btn:focus.e-outline.e-success,
344
- .e-btn-group input:focus + label.e-btn.e-outline.e-success,
344
+ .e-btn-group input:focus-visible + label.e-btn.e-outline.e-success,
345
345
  .e-css.e-btn-group .e-btn:focus.e-outline.e-success,
346
- .e-css.e-btn-group input:focus + label.e-btn.e-outline.e-success {
346
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline.e-success {
347
347
  box-shadow: 0 0 0 2px rgba(31, 41, 55, 0.95), 0 0 0 4px #22d3ee;
348
348
  }
349
349
  .e-btn-group .e-btn:focus.e-outline.e-info,
350
- .e-btn-group input:focus + label.e-btn.e-outline.e-info,
350
+ .e-btn-group input:focus-visible + label.e-btn.e-outline.e-info,
351
351
  .e-css.e-btn-group .e-btn:focus.e-outline.e-info,
352
- .e-css.e-btn-group input:focus + label.e-btn.e-outline.e-info {
352
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline.e-info {
353
353
  box-shadow: 0 0 0 2px rgba(31, 41, 55, 0.95), 0 0 0 4px #22d3ee;
354
354
  }
355
355
  .e-btn-group .e-btn:focus.e-outline.e-warning,
356
- .e-btn-group input:focus + label.e-btn.e-outline.e-warning,
356
+ .e-btn-group input:focus-visible + label.e-btn.e-outline.e-warning,
357
357
  .e-css.e-btn-group .e-btn:focus.e-outline.e-warning,
358
- .e-css.e-btn-group input:focus + label.e-btn.e-outline.e-warning {
358
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline.e-warning {
359
359
  box-shadow: 0 0 0 2px rgba(31, 41, 55, 0.95), 0 0 0 4px #22d3ee;
360
360
  }
361
361
  .e-btn-group .e-btn:focus.e-outline.e-danger,
362
- .e-btn-group input:focus + label.e-btn.e-outline.e-danger,
362
+ .e-btn-group input:focus-visible + label.e-btn.e-outline.e-danger,
363
363
  .e-css.e-btn-group .e-btn:focus.e-outline.e-danger,
364
- .e-css.e-btn-group input:focus + label.e-btn.e-outline.e-danger {
364
+ .e-css.e-btn-group input:focus-visible + label.e-btn.e-outline.e-danger {
365
365
  box-shadow: 0 0 0 2px rgba(31, 41, 55, 0.95), 0 0 0 4px #22d3ee;
366
366
  }
367
367
  .e-btn-group .e-btn:active,