@breadstone/mosaik-elements-foundation 0.0.27 → 0.0.29

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 (105) hide show
  1. package/Controls/Components/Buttons/Anchor/Themes/AnchorElement.Joy.js +27 -27
  2. package/Controls/Components/Buttons/Button/Themes/ButtonElement.Cosmopolitan.js +2 -2
  3. package/Controls/Components/Buttons/Button/Themes/ButtonElement.Joy.js +78 -78
  4. package/Controls/Components/Buttons/Button/Themes/ButtonElement.Retro.js +31 -31
  5. package/Controls/Components/Buttons/Button/Themes/ButtonGroupElement.Joy.js +36 -36
  6. package/Controls/Components/Buttons/CompoundButton/Themes/CompoundButtonElement.Joy.js +78 -78
  7. package/Controls/Components/Buttons/CompoundButton/Themes/CompoundButtonElement.Retro.js +14 -14
  8. package/Controls/Components/Buttons/DropDownButton/Themes/DropDownButtonElement.Cosmopolitan.js +1 -1
  9. package/Controls/Components/Buttons/DropDownButton/Themes/DropDownButtonElement.Joy.js +78 -78
  10. package/Controls/Components/Buttons/DropDownButton/Themes/DropDownButtonElement.Retro.js +1 -1
  11. package/Controls/Components/Buttons/FloatingActionButton/Themes/FloatingActionButtonElement.Cosmopolitan.js +1 -1
  12. package/Controls/Components/Buttons/FloatingActionButton/Themes/FloatingActionButtonElement.Joy.js +1 -1
  13. package/Controls/Components/Buttons/FloatingActionButton/Themes/FloatingActionButtonElement.Retro.js +32 -32
  14. package/Controls/Components/Buttons/RepeatButton/Themes/RepeatButtonElement.Cosmopolitan.js +1 -1
  15. package/Controls/Components/Buttons/RepeatButton/Themes/RepeatButtonElement.Joy.js +78 -78
  16. package/Controls/Components/Buttons/RepeatButton/Themes/RepeatButtonElement.Retro.js +1 -1
  17. package/Controls/Components/Buttons/SplitButton/Themes/SplitButtonElement.Cosmopolitan.js +1 -1
  18. package/Controls/Components/Buttons/SplitButton/Themes/SplitButtonElement.Joy.js +78 -78
  19. package/Controls/Components/Buttons/SplitButton/Themes/SplitButtonElement.Retro.js +1 -1
  20. package/Controls/Components/Buttons/ToggleButton/Themes/ToggleButtonElement.Joy.js +87 -87
  21. package/Controls/Components/Buttons/ToggleButton/Themes/ToggleButtonElement.Retro.js +14 -14
  22. package/Controls/Components/Effects/Ripple/Themes/RippleElement.Joy.js +9 -9
  23. package/Controls/Components/Grouping/Banner/Themes/BannerElement.Joy.js +36 -36
  24. package/Controls/Components/Grouping/Banner/Themes/BannerElement.Retro.js +7 -7
  25. package/Controls/Components/Grouping/Expander/Themes/ExpanderElement.Joy.js +11 -11
  26. package/Controls/Components/Grouping/Expander/Themes/ExpanderElement.Retro.js +2 -2
  27. package/Controls/Components/Grouping/Toolbar/Themes/ToolbarElement.Joy.js +38 -38
  28. package/Controls/Components/Grouping/Toolbar/Themes/ToolbarElement.Retro.js +1 -1
  29. package/Controls/Components/Inputs/AutoCompleteBox/Themes/AutoCompleteBoxElement.Joy.d.ts.map +1 -1
  30. package/Controls/Components/Inputs/AutoCompleteBox/Themes/AutoCompleteBoxElement.Joy.js +6 -5
  31. package/Controls/Components/Inputs/AutoCompleteBox/Themes/AutoCompleteBoxElement.Joy.js.map +1 -1
  32. package/Controls/Components/Inputs/Calendar/Themes/CalendarItemElement.Joy.js +1 -1
  33. package/Controls/Components/Inputs/CheckBox/Themes/CheckBoxElement.Cosmopolitan.js +1 -1
  34. package/Controls/Components/Inputs/CheckBox/Themes/CheckBoxElement.Joy.js +4 -4
  35. package/Controls/Components/Inputs/CheckBox/Themes/CheckBoxElement.Retro.js +1 -1
  36. package/Controls/Components/Inputs/ChipBox/Themes/ChipBoxElement.Joy.js +42 -42
  37. package/Controls/Components/Inputs/Choice/Themes/ChoiceElement.Joy.js +9 -9
  38. package/Controls/Components/Inputs/ColorBox/Themes/ColorBoxElement.Joy.js +42 -42
  39. package/Controls/Components/Inputs/DateBox/Themes/DateBoxElement.Joy.js +42 -42
  40. package/Controls/Components/Inputs/DateTimeBox/Themes/DateTimeBoxElement.Joy.js +42 -42
  41. package/Controls/Components/Inputs/NumberBox/Themes/NumberBoxElement.Cosmopolitan.js +1 -1
  42. package/Controls/Components/Inputs/NumberBox/Themes/NumberBoxElement.Joy.js +42 -42
  43. package/Controls/Components/Inputs/NumberBox/Themes/NumberBoxElement.Retro.js +1 -1
  44. package/Controls/Components/Inputs/PasswordBox/Themes/PasswordBoxElement.Joy.js +42 -42
  45. package/Controls/Components/Inputs/PinBox/Themes/PinBoxElement.Joy.js +9 -9
  46. package/Controls/Components/Inputs/Radio/Themes/RadioElement.Cosmopolitan.js +1 -1
  47. package/Controls/Components/Inputs/Radio/Themes/RadioElement.Joy.js +4 -4
  48. package/Controls/Components/Inputs/Radio/Themes/RadioElement.Retro.js +1 -1
  49. package/Controls/Components/Inputs/Rating/Themes/RatingElement.Joy.js +9 -9
  50. package/Controls/Components/Inputs/RichTextBox/Themes/RichTextBoxElement.Joy.js +42 -42
  51. package/Controls/Components/Inputs/SearchBox/Themes/SearchBoxElement.Joy.js +14 -14
  52. package/Controls/Components/Inputs/Select/Themes/SelectElement.Joy.js +9 -9
  53. package/Controls/Components/Inputs/Select/Themes/SelectItemElement.Cosmopolitan.js +1 -1
  54. package/Controls/Components/Inputs/Select/Themes/SelectItemElement.Joy.js +2 -2
  55. package/Controls/Components/Inputs/Select/Themes/SelectItemElement.Retro.js +1 -1
  56. package/Controls/Components/Inputs/SignaturePad/Themes/SignaturePadElement.Joy.js +9 -9
  57. package/Controls/Components/Inputs/TextBox/Themes/TextBoxElement.Joy.d.ts.map +1 -1
  58. package/Controls/Components/Inputs/TextBox/Themes/TextBoxElement.Joy.js +40 -36
  59. package/Controls/Components/Inputs/TextBox/Themes/TextBoxElement.Joy.js.map +1 -1
  60. package/Controls/Components/Inputs/TimeBox/Themes/TimeBoxElement.Joy.js +42 -42
  61. package/Controls/Components/Inputs/ToggleSwitch/Themes/ToggleSwitchElement.Joy.js +3 -3
  62. package/Controls/Components/Layouts/Split/Themes/SplitElement.Joy.js +2 -2
  63. package/Controls/Components/Media/Avatar/Themes/AvatarElement.Joy.js +38 -38
  64. package/Controls/Components/Media/Avatar/Themes/AvatarGroupElement.Cosmopolitan.js +1 -1
  65. package/Controls/Components/Media/Avatar/Themes/AvatarGroupElement.Joy.js +2 -2
  66. package/Controls/Components/Media/Avatar/Themes/AvatarGroupElement.Retro.js +1 -1
  67. package/Controls/Components/Media/Badge/Themes/BadgeElement.Joy.js +9 -9
  68. package/Controls/Components/Media/Chat/Themes/ChatMarkerElement.Joy.js +9 -9
  69. package/Controls/Components/Media/Chip/Themes/ChipElement.Joy.js +104 -104
  70. package/Controls/Components/Media/Chip/Themes/ChipElement.Retro.js +7 -7
  71. package/Controls/Components/Media/Icon/Themes/IconElement.Joy.js +37 -37
  72. package/Controls/Components/Media/Icon/Themes/IconElement.Retro.js +37 -37
  73. package/Controls/Components/Primitives/Checkmark/Themes/CheckmarkElement.Cosmopolitan.js +1 -1
  74. package/Controls/Components/Primitives/Checkmark/Themes/CheckmarkElement.Joy.js +92 -92
  75. package/Controls/Components/Primitives/Checkmark/Themes/CheckmarkElement.Retro.js +1 -1
  76. package/Controls/Components/Primitives/Dot/Themes/DotElement.Cosmopolitan.js +1 -1
  77. package/Controls/Components/Primitives/Dot/Themes/DotElement.Joy.js +10 -10
  78. package/Controls/Components/Primitives/Dot/Themes/DotElement.Retro.js +8 -8
  79. package/Controls/Components/Primitives/DropZone/Themes/DropZoneElement.Cosmopolitan.js +1 -1
  80. package/Controls/Components/Primitives/DropZone/Themes/DropZoneElement.Joy.js +1 -1
  81. package/Controls/Components/Primitives/DropZone/Themes/DropZoneElement.Retro.js +1 -1
  82. package/Controls/Components/Primitives/Floating/Themes/FloatingElement.Joy.js +1 -1
  83. package/Controls/Components/Primitives/FocusRing/Themes/FocusRingElement.Joy.js +9 -9
  84. package/Controls/Components/Primitives/InkBar/Themes/InkBarElement.Joy.js +18 -18
  85. package/Controls/Components/Primitives/Popup/Themes/PopupElement.Joy.js +1 -1
  86. package/Controls/Components/Primitives/Ribbon/Themes/RibbonElement.Joy.js +18 -18
  87. package/Controls/Components/Primitives/Text/Themes/TextElement.Joy.js +10 -10
  88. package/Controls/Components/Ranges/ProgressBar/Themes/ProgressBarElement.Joy.js +9 -9
  89. package/Controls/Components/Ranges/ProgressRing/Themes/ProgressRingElement.Joy.js +9 -9
  90. package/Controls/Components/Ranges/Slider/Themes/SliderElement.Joy.js +108 -108
  91. package/Controls/Components/Selectors/Combo/Themes/ComboItemElement.Cosmopolitan.js +1 -1
  92. package/Controls/Components/Selectors/Combo/Themes/ComboItemElement.Joy.js +1 -1
  93. package/Controls/Components/Selectors/Combo/Themes/ComboItemElement.Retro.js +1 -1
  94. package/Controls/Components/Selectors/ElectronicProgramGuide/Themes/EpgProgramElement.Joy.js +10 -10
  95. package/Controls/Components/Selectors/List/Themes/ListItemElement.Cosmopolitan.js +1 -1
  96. package/Controls/Components/Selectors/List/Themes/ListItemElement.Joy.js +3 -3
  97. package/Controls/Components/Selectors/List/Themes/ListItemElement.Retro.js +1 -1
  98. package/Controls/Components/Selectors/Menu/Themes/MenuItemElement.Joy.js +5 -5
  99. package/Controls/Components/Selectors/Segment/Themes/SegmentElement.Retro.js +31 -31
  100. package/Controls/Components/Selectors/Segment/Themes/SegmentItemElement.Joy.js +9 -9
  101. package/Controls/Components/Selectors/TabStrip/Themes/TabStripItemElement.Cosmopolitan.js +1 -1
  102. package/Controls/Components/Selectors/TabStrip/Themes/TabStripItemElement.Joy.js +41 -41
  103. package/Controls/Components/Selectors/TabStrip/Themes/TabStripItemElement.Retro.js +2 -2
  104. package/Controls/Components/Selectors/Tree/Themes/TreeItemElement.Joy.js +2 -2
  105. package/package.json +3 -3
package/Controls/Components/Buttons/SplitButton/Themes/SplitButtonElement.Joy.js CHANGED
@@ -252,7 +252,7 @@ export function splitButtonElementJoyStyle() {
252
252
  --split-button-border-style: solid;
253
253
  }
254
254
 
255
- :host([appearance="outline"]) [part="focusRing"], :host([appearance="plain"]:not([disabled]):not([disabled="false"])) [part="focusRing"] {
255
+ :host([appearance="outline"]) [part="focusRing"], :host([appearance="plain"]:not([disabled]:not([disabled="false"]))) [part="focusRing"] {
256
256
  --focus-ring-outward-offset: 0px;
257
257
  }
258
258
 
@@ -336,94 +336,94 @@ export function splitButtonElementJoyStyle() {
336
336
  --split-button-border-width: var(--joy-layout-thickness);
337
337
  }
338
338
 
339
- :host([appearance="outline"]:not([disabled]):not([disabled="false"])) {
339
+ :host([appearance="outline"]:not([disabled]:not([disabled="false"]))) {
340
340
  --split-button-background-color: var(--joy-scheme-background);
341
341
  --split-button-foreground-color: var(--joy-scheme-foreground);
342
342
  --split-button-border-color: var(--joy-scheme-highlight);
343
343
  }
344
344
 
345
- :host([appearance="outline"]:not([disabled]):not([disabled="false"]):hover) {
345
+ :host([appearance="outline"]:not([disabled]:not([disabled="false"])):hover) {
346
346
  --split-button-background-color: var(--joy-scheme-highlight);
347
347
  }
348
348
 
349
- :host([appearance="outline"][variant="primary"]:not([disabled]):not([disabled="false"])) {
349
+ :host([appearance="outline"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
350
350
  --split-button-foreground-color: var(--joy-color-primary-500);
351
351
  --split-button-border-color: var(--joy-color-primary-500);
352
352
  }
353
353
 
354
- :host([appearance="outline"][variant="primary"]:not([disabled]):not([disabled="false"]):hover) {
354
+ :host([appearance="outline"][variant="primary"]:not([disabled]:not([disabled="false"])):hover) {
355
355
  --split-button-background-color: var(--joy-color-primary-100);
356
356
  }
357
357
 
358
- :host([appearance="outline"][variant="secondary"]:not([disabled]):not([disabled="false"])) {
358
+ :host([appearance="outline"][variant="secondary"]:not([disabled]:not([disabled="false"]))) {
359
359
  --split-button-foreground-color: var(--joy-color-secondary-500);
360
360
  --split-button-border-color: var(--joy-color-secondary-500);
361
361
  }
362
362
 
363
- :host([appearance="outline"][variant="secondary"]:not([disabled]):not([disabled="false"]):hover) {
363
+ :host([appearance="outline"][variant="secondary"]:not([disabled]:not([disabled="false"])):hover) {
364
364
  --split-button-background-color: var(--joy-color-secondary-100);
365
365
  }
366
366
 
367
- :host([appearance="outline"][variant="tertiary"]:not([disabled]):not([disabled="false"])) {
367
+ :host([appearance="outline"][variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
368
368
  --split-button-foreground-color: var(--joy-color-tertiary-500);
369
369
  --split-button-border-color: var(--joy-color-tertiary-500);
370
370
  }
371
371
 
372
- :host([appearance="outline"][variant="tertiary"]:not([disabled]):not([disabled="false"]):hover) {
372
+ :host([appearance="outline"][variant="tertiary"]:not([disabled]:not([disabled="false"])):hover) {
373
373
  --split-button-background-color: var(--joy-color-tertiary-100);
374
374
  }
375
375
 
376
- :host([appearance="outline"][variant="danger"]:not([disabled]):not([disabled="false"])) {
376
+ :host([appearance="outline"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
377
377
  --split-button-foreground-color: var(--joy-color-danger-500);
378
378
  --split-button-border-color: var(--joy-color-danger-500);
379
379
  }
380
380
 
381
- :host([appearance="outline"][variant="danger"]:not([disabled]):not([disabled="false"]):hover) {
381
+ :host([appearance="outline"][variant="danger"]:not([disabled]:not([disabled="false"])):hover) {
382
382
  --split-button-background-color: var(--joy-color-danger-100);
383
383
  }
384
384
 
385
- :host([appearance="outline"][variant="warning"]:not([disabled]):not([disabled="false"])) {
385
+ :host([appearance="outline"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
386
386
  --split-button-foreground-color: var(--joy-color-warning-500);
387
387
  --split-button-border-color: var(--joy-color-warning-500);
388
388
  }
389
389
 
390
- :host([appearance="outline"][variant="warning"]:not([disabled]):not([disabled="false"]):hover) {
390
+ :host([appearance="outline"][variant="warning"]:not([disabled]:not([disabled="false"])):hover) {
391
391
  --split-button-background-color: var(--joy-color-warning-100);
392
392
  }
393
393
 
394
- :host([appearance="outline"][variant="success"]:not([disabled]):not([disabled="false"])) {
394
+ :host([appearance="outline"][variant="success"]:not([disabled]:not([disabled="false"]))) {
395
395
  --split-button-foreground-color: var(--joy-color-success-500);
396
396
  --split-button-border-color: var(--joy-color-success-500);
397
397
  }
398
398
 
399
- :host([appearance="outline"][variant="success"]:not([disabled]):not([disabled="false"]):hover) {
399
+ :host([appearance="outline"][variant="success"]:not([disabled]:not([disabled="false"])):hover) {
400
400
  --split-button-background-color: var(--joy-color-success-100);
401
401
  }
402
402
 
403
- :host([appearance="outline"][variant="info"]:not([disabled]):not([disabled="false"])) {
403
+ :host([appearance="outline"][variant="info"]:not([disabled]:not([disabled="false"]))) {
404
404
  --split-button-foreground-color: var(--joy-color-info-500);
405
405
  --split-button-border-color: var(--joy-color-info-500);
406
406
  }
407
407
 
408
- :host([appearance="outline"][variant="info"]:not([disabled]):not([disabled="false"]):hover) {
408
+ :host([appearance="outline"][variant="info"]:not([disabled]:not([disabled="false"])):hover) {
409
409
  --split-button-background-color: var(--joy-color-info-100);
410
410
  }
411
411
 
412
- :host([appearance="outline"][variant="highlight"]:not([disabled]):not([disabled="false"])) {
412
+ :host([appearance="outline"][variant="highlight"]:not([disabled]:not([disabled="false"]))) {
413
413
  --split-button-foreground-color: var(--joy-color-highlight-500);
414
414
  --split-button-border-color: var(--joy-color-highlight-500);
415
415
  }
416
416
 
417
- :host([appearance="outline"][variant="highlight"]:not([disabled]):not([disabled="false"]):hover) {
417
+ :host([appearance="outline"][variant="highlight"]:not([disabled]:not([disabled="false"])):hover) {
418
418
  --split-button-background-color: var(--joy-color-highlight-100);
419
419
  }
420
420
 
421
- :host([appearance="outline"][variant="neutral"]:not([disabled]):not([disabled="false"])) {
421
+ :host([appearance="outline"][variant="neutral"]:not([disabled]:not([disabled="false"]))) {
422
422
  --split-button-foreground-color: var(--joy-color-neutral-500);
423
423
  --split-button-border-color: var(--joy-color-neutral-500);
424
424
  }
425
425
 
426
- :host([appearance="outline"][variant="neutral"]:not([disabled]):not([disabled="false"]):hover) {
426
+ :host([appearance="outline"][variant="neutral"]:not([disabled]:not([disabled="false"])):hover) {
427
427
  --split-button-background-color: var(--joy-color-neutral-100);
428
428
  }
429
429
 
@@ -432,260 +432,260 @@ export function splitButtonElementJoyStyle() {
432
432
  --split-button-background-color: var(--joy-scheme-transparent);
433
433
  }
434
434
 
435
- :host([appearance="plain"]:not([disabled]):not([disabled="false"]):hover) {
435
+ :host([appearance="plain"]:not([disabled]:not([disabled="false"])):hover) {
436
436
  --split-button-background-color: var(--joy-scheme-highlight);
437
437
  }
438
438
 
439
- :host([appearance="plain"][variant="primary"]:not([disabled]):not([disabled="false"])) {
439
+ :host([appearance="plain"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
440
440
  --split-button-foreground-color: var(--joy-color-primary-500);
441
441
  }
442
442
 
443
- :host([appearance="plain"][variant="primary"]:not([disabled]):not([disabled="false"]):hover) {
443
+ :host([appearance="plain"][variant="primary"]:not([disabled]:not([disabled="false"])):hover) {
444
444
  --split-button-background-color: var(--joy-color-primary-100);
445
445
  --split-button-foreground-color: var(--joy-color-primary-500);
446
446
  }
447
447
 
448
- :host([appearance="plain"][variant="secondary"]:not([disabled]):not([disabled="false"])) {
448
+ :host([appearance="plain"][variant="secondary"]:not([disabled]:not([disabled="false"]))) {
449
449
  --split-button-foreground-color: var(--joy-color-secondary-500);
450
450
  }
451
451
 
452
- :host([appearance="plain"][variant="secondary"]:not([disabled]):not([disabled="false"]):hover) {
452
+ :host([appearance="plain"][variant="secondary"]:not([disabled]:not([disabled="false"])):hover) {
453
453
  --split-button-background-color: var(--joy-color-secondary-100);
454
454
  --split-button-foreground-color: var(--joy-color-secondary-500);
455
455
  }
456
456
 
457
- :host([appearance="plain"][variant="tertiary"]:not([disabled]):not([disabled="false"])) {
457
+ :host([appearance="plain"][variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
458
458
  --split-button-foreground-color: var(--joy-color-tertiary-500);
459
459
  }
460
460
 
461
- :host([appearance="plain"][variant="tertiary"]:not([disabled]):not([disabled="false"]):hover) {
461
+ :host([appearance="plain"][variant="tertiary"]:not([disabled]:not([disabled="false"])):hover) {
462
462
  --split-button-background-color: var(--joy-color-tertiary-100);
463
463
  --split-button-foreground-color: var(--joy-color-tertiary-500);
464
464
  }
465
465
 
466
- :host([appearance="plain"][variant="danger"]:not([disabled]):not([disabled="false"])) {
466
+ :host([appearance="plain"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
467
467
  --split-button-foreground-color: var(--joy-color-danger-500);
468
468
  }
469
469
 
470
- :host([appearance="plain"][variant="danger"]:not([disabled]):not([disabled="false"]):hover) {
470
+ :host([appearance="plain"][variant="danger"]:not([disabled]:not([disabled="false"])):hover) {
471
471
  --split-button-background-color: var(--joy-color-danger-100);
472
472
  --split-button-foreground-color: var(--joy-color-danger-500);
473
473
  }
474
474
 
475
- :host([appearance="plain"][variant="warning"]:not([disabled]):not([disabled="false"])) {
475
+ :host([appearance="plain"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
476
476
  --split-button-foreground-color: var(--joy-color-warning-500);
477
477
  }
478
478
 
479
- :host([appearance="plain"][variant="warning"]:not([disabled]):not([disabled="false"]):hover) {
479
+ :host([appearance="plain"][variant="warning"]:not([disabled]:not([disabled="false"])):hover) {
480
480
  --split-button-background-color: var(--joy-color-warning-100);
481
481
  --split-button-foreground-color: var(--joy-color-warning-500);
482
482
  }
483
483
 
484
- :host([appearance="plain"][variant="success"]:not([disabled]):not([disabled="false"])) {
484
+ :host([appearance="plain"][variant="success"]:not([disabled]:not([disabled="false"]))) {
485
485
  --split-button-foreground-color: var(--joy-color-success-500);
486
486
  }
487
487
 
488
- :host([appearance="plain"][variant="success"]:not([disabled]):not([disabled="false"]):hover) {
488
+ :host([appearance="plain"][variant="success"]:not([disabled]:not([disabled="false"])):hover) {
489
489
  --split-button-background-color: var(--joy-color-success-100);
490
490
  --split-button-foreground-color: var(--joy-color-success-500);
491
491
  }
492
492
 
493
- :host([appearance="plain"][variant="info"]:not([disabled]):not([disabled="false"])) {
493
+ :host([appearance="plain"][variant="info"]:not([disabled]:not([disabled="false"]))) {
494
494
  --split-button-foreground-color: var(--joy-color-info-500);
495
495
  }
496
496
 
497
- :host([appearance="plain"][variant="info"]:not([disabled]):not([disabled="false"]):hover) {
497
+ :host([appearance="plain"][variant="info"]:not([disabled]:not([disabled="false"])):hover) {
498
498
  --split-button-background-color: var(--joy-color-info-100);
499
499
  --split-button-foreground-color: var(--joy-color-info-500);
500
500
  }
501
501
 
502
- :host([appearance="plain"][variant="highlight"]:not([disabled]):not([disabled="false"])) {
502
+ :host([appearance="plain"][variant="highlight"]:not([disabled]:not([disabled="false"]))) {
503
503
  --split-button-foreground-color: var(--joy-color-highlight-500);
504
504
  }
505
505
 
506
- :host([appearance="plain"][variant="highlight"]:not([disabled]):not([disabled="false"]):hover) {
506
+ :host([appearance="plain"][variant="highlight"]:not([disabled]:not([disabled="false"])):hover) {
507
507
  --split-button-background-color: var(--joy-color-highlight-100);
508
508
  --split-button-foreground-color: var(--joy-color-highlight-500);
509
509
  }
510
510
 
511
- :host([appearance="plain"][variant="neutral"]:not([disabled]):not([disabled="false"])) {
511
+ :host([appearance="plain"][variant="neutral"]:not([disabled]:not([disabled="false"]))) {
512
512
  --split-button-foreground-color: var(--joy-color-neutral-500);
513
513
  }
514
514
 
515
- :host([appearance="plain"][variant="neutral"]:not([disabled]):not([disabled="false"]):hover) {
515
+ :host([appearance="plain"][variant="neutral"]:not([disabled]:not([disabled="false"])):hover) {
516
516
  --split-button-background-color: var(--joy-color-neutral-100);
517
517
  --split-button-foreground-color: var(--joy-color-neutral-500);
518
518
  }
519
519
 
520
- :host([appearance="soft"]:not([disabled]):not([disabled="false"])) {
520
+ :host([appearance="soft"]:not([disabled]:not([disabled="false"]))) {
521
521
  --split-button-background-color: var(--joy-scheme-highlight);
522
522
  --split-button-foreground-color: var(--joy-scheme-foreground);
523
523
  }
524
524
 
525
- :host([appearance="soft"][variant="primary"]:not([disabled]):not([disabled="false"])) {
525
+ :host([appearance="soft"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
526
526
  --split-button-background-color: var(--joy-color-primary-100);
527
527
  --split-button-foreground-color: var(--joy-color-primary-500);
528
528
  }
529
529
 
530
- :host([appearance="soft"][variant="primary"]:not([disabled]):not([disabled="false"]):hover) {
530
+ :host([appearance="soft"][variant="primary"]:not([disabled]:not([disabled="false"])):hover) {
531
531
  --split-button-background-color: var(--joy-color-primary-200);
532
532
  }
533
533
 
534
- :host([appearance="soft"][variant="secondary"]:not([disabled]):not([disabled="false"])) {
534
+ :host([appearance="soft"][variant="secondary"]:not([disabled]:not([disabled="false"]))) {
535
535
  --split-button-background-color: var(--joy-color-secondary-100);
536
536
  --split-button-foreground-color: var(--joy-color-secondary-500);
537
537
  }
538
538
 
539
- :host([appearance="soft"][variant="secondary"]:not([disabled]):not([disabled="false"]):hover) {
539
+ :host([appearance="soft"][variant="secondary"]:not([disabled]:not([disabled="false"])):hover) {
540
540
  --split-button-background-color: var(--joy-color-secondary-200);
541
541
  }
542
542
 
543
- :host([appearance="soft"][variant="tertiary"]:not([disabled]):not([disabled="false"])) {
543
+ :host([appearance="soft"][variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
544
544
  --split-button-background-color: var(--joy-color-tertiary-100);
545
545
  --split-button-foreground-color: var(--joy-color-tertiary-500);
546
546
  }
547
547
 
548
- :host([appearance="soft"][variant="tertiary"]:not([disabled]):not([disabled="false"]):hover) {
548
+ :host([appearance="soft"][variant="tertiary"]:not([disabled]:not([disabled="false"])):hover) {
549
549
  --split-button-background-color: var(--joy-color-tertiary-200);
550
550
  }
551
551
 
552
- :host([appearance="soft"][variant="danger"]:not([disabled]):not([disabled="false"])) {
552
+ :host([appearance="soft"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
553
553
  --split-button-background-color: var(--joy-color-danger-100);
554
554
  --split-button-foreground-color: var(--joy-color-danger-500);
555
555
  }
556
556
 
557
- :host([appearance="soft"][variant="danger"]:not([disabled]):not([disabled="false"]):hover) {
557
+ :host([appearance="soft"][variant="danger"]:not([disabled]:not([disabled="false"])):hover) {
558
558
  --split-button-background-color: var(--joy-color-danger-200);
559
559
  }
560
560
 
561
- :host([appearance="soft"][variant="warning"]:not([disabled]):not([disabled="false"])) {
561
+ :host([appearance="soft"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
562
562
  --split-button-background-color: var(--joy-color-warning-100);
563
563
  --split-button-foreground-color: var(--joy-color-warning-500);
564
564
  }
565
565
 
566
- :host([appearance="soft"][variant="warning"]:not([disabled]):not([disabled="false"]):hover) {
566
+ :host([appearance="soft"][variant="warning"]:not([disabled]:not([disabled="false"])):hover) {
567
567
  --split-button-background-color: var(--joy-color-warning-200);
568
568
  }
569
569
 
570
- :host([appearance="soft"][variant="success"]:not([disabled]):not([disabled="false"])) {
570
+ :host([appearance="soft"][variant="success"]:not([disabled]:not([disabled="false"]))) {
571
571
  --split-button-background-color: var(--joy-color-success-100);
572
572
  --split-button-foreground-color: var(--joy-color-success-500);
573
573
  }
574
574
 
575
- :host([appearance="soft"][variant="success"]:not([disabled]):not([disabled="false"]):hover) {
575
+ :host([appearance="soft"][variant="success"]:not([disabled]:not([disabled="false"])):hover) {
576
576
  --split-button-background-color: var(--joy-color-success-200);
577
577
  }
578
578
 
579
- :host([appearance="soft"][variant="info"]:not([disabled]):not([disabled="false"])) {
579
+ :host([appearance="soft"][variant="info"]:not([disabled]:not([disabled="false"]))) {
580
580
  --split-button-background-color: var(--joy-color-info-100);
581
581
  --split-button-foreground-color: var(--joy-color-info-500);
582
582
  }
583
583
 
584
- :host([appearance="soft"][variant="info"]:not([disabled]):not([disabled="false"]):hover) {
584
+ :host([appearance="soft"][variant="info"]:not([disabled]:not([disabled="false"])):hover) {
585
585
  --split-button-background-color: var(--joy-color-info-200);
586
586
  }
587
587
 
588
- :host([appearance="soft"][variant="highlight"]:not([disabled]):not([disabled="false"])) {
588
+ :host([appearance="soft"][variant="highlight"]:not([disabled]:not([disabled="false"]))) {
589
589
  --split-button-background-color: var(--joy-color-highlight-100);
590
590
  --split-button-foreground-color: var(--joy-color-highlight-500);
591
591
  }
592
592
 
593
- :host([appearance="soft"][variant="highlight"]:not([disabled]):not([disabled="false"]):hover) {
593
+ :host([appearance="soft"][variant="highlight"]:not([disabled]:not([disabled="false"])):hover) {
594
594
  --split-button-background-color: var(--joy-color-highlight-200);
595
595
  }
596
596
 
597
- :host([appearance="soft"][variant="neutral"]:not([disabled]):not([disabled="false"])) {
597
+ :host([appearance="soft"][variant="neutral"]:not([disabled]:not([disabled="false"]))) {
598
598
  --split-button-background-color: var(--joy-color-neutral-100);
599
599
  --split-button-foreground-color: var(--joy-color-neutral-500);
600
600
  }
601
601
 
602
- :host([appearance="soft"][variant="neutral"]:not([disabled]):not([disabled="false"]):hover) {
602
+ :host([appearance="soft"][variant="neutral"]:not([disabled]:not([disabled="false"])):hover) {
603
603
  --split-button-background-color: var(--joy-color-neutral-200);
604
604
  }
605
605
 
606
- :host([appearance="solid"]:not([disabled]):not([disabled="false"])) {
606
+ :host([appearance="solid"]:not([disabled]:not([disabled="false"]))) {
607
607
  --split-button-background-color: var(--joy-scheme-highlight);
608
608
  --split-button-foreground-color: var(--joy-scheme-foreground);
609
609
  }
610
610
 
611
- :host([appearance="solid"][variant="primary"]:not([disabled]):not([disabled="false"])) {
611
+ :host([appearance="solid"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
612
612
  --split-button-background-color: var(--joy-color-primary-500);
613
613
  --split-button-foreground-color: var(--joy-color-primary-0);
614
614
  }
615
615
 
616
- :host([appearance="solid"][variant="primary"]:not([disabled]):not([disabled="false"]):hover) {
616
+ :host([appearance="solid"][variant="primary"]:not([disabled]:not([disabled="false"])):hover) {
617
617
  --split-button-background-color: var(--joy-color-primary-600);
618
618
  }
619
619
 
620
- :host([appearance="solid"][variant="secondary"]:not([disabled]):not([disabled="false"])) {
620
+ :host([appearance="solid"][variant="secondary"]:not([disabled]:not([disabled="false"]))) {
621
621
  --split-button-background-color: var(--joy-color-secondary-500);
622
622
  --split-button-foreground-color: var(--joy-color-secondary-0);
623
623
  }
624
624
 
625
- :host([appearance="solid"][variant="secondary"]:not([disabled]):not([disabled="false"]):hover) {
625
+ :host([appearance="solid"][variant="secondary"]:not([disabled]:not([disabled="false"])):hover) {
626
626
  --split-button-background-color: var(--joy-color-secondary-600);
627
627
  }
628
628
 
629
- :host([appearance="solid"][variant="tertiary"]:not([disabled]):not([disabled="false"])) {
629
+ :host([appearance="solid"][variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
630
630
  --split-button-background-color: var(--joy-color-tertiary-500);
631
631
  --split-button-foreground-color: var(--joy-color-tertiary-0);
632
632
  }
633
633
 
634
- :host([appearance="solid"][variant="tertiary"]:not([disabled]):not([disabled="false"]):hover) {
634
+ :host([appearance="solid"][variant="tertiary"]:not([disabled]:not([disabled="false"])):hover) {
635
635
  --split-button-background-color: var(--joy-color-tertiary-600);
636
636
  }
637
637
 
638
- :host([appearance="solid"][variant="danger"]:not([disabled]):not([disabled="false"])) {
638
+ :host([appearance="solid"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
639
639
  --split-button-background-color: var(--joy-color-danger-500);
640
640
  --split-button-foreground-color: var(--joy-color-danger-0);
641
641
  }
642
642
 
643
- :host([appearance="solid"][variant="danger"]:not([disabled]):not([disabled="false"]):hover) {
643
+ :host([appearance="solid"][variant="danger"]:not([disabled]:not([disabled="false"])):hover) {
644
644
  --split-button-background-color: var(--joy-color-danger-600);
645
645
  }
646
646
 
647
- :host([appearance="solid"][variant="warning"]:not([disabled]):not([disabled="false"])) {
647
+ :host([appearance="solid"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
648
648
  --split-button-background-color: var(--joy-color-warning-500);
649
649
  --split-button-foreground-color: var(--joy-color-warning-0);
650
650
  }
651
651
 
652
- :host([appearance="solid"][variant="warning"]:not([disabled]):not([disabled="false"]):hover) {
652
+ :host([appearance="solid"][variant="warning"]:not([disabled]:not([disabled="false"])):hover) {
653
653
  --split-button-background-color: var(--joy-color-warning-600);
654
654
  }
655
655
 
656
- :host([appearance="solid"][variant="success"]:not([disabled]):not([disabled="false"])) {
656
+ :host([appearance="solid"][variant="success"]:not([disabled]:not([disabled="false"]))) {
657
657
  --split-button-background-color: var(--joy-color-success-500);
658
658
  --split-button-foreground-color: var(--joy-color-success-0);
659
659
  }
660
660
 
661
- :host([appearance="solid"][variant="success"]:not([disabled]):not([disabled="false"]):hover) {
661
+ :host([appearance="solid"][variant="success"]:not([disabled]:not([disabled="false"])):hover) {
662
662
  --split-button-background-color: var(--joy-color-success-600);
663
663
  }
664
664
 
665
- :host([appearance="solid"][variant="info"]:not([disabled]):not([disabled="false"])) {
665
+ :host([appearance="solid"][variant="info"]:not([disabled]:not([disabled="false"]))) {
666
666
  --split-button-background-color: var(--joy-color-info-500);
667
667
  --split-button-foreground-color: var(--joy-color-info-0);
668
668
  }
669
669
 
670
- :host([appearance="solid"][variant="info"]:not([disabled]):not([disabled="false"]):hover) {
670
+ :host([appearance="solid"][variant="info"]:not([disabled]:not([disabled="false"])):hover) {
671
671
  --split-button-background-color: var(--joy-color-info-600);
672
672
  }
673
673
 
674
- :host([appearance="solid"][variant="highlight"]:not([disabled]):not([disabled="false"])) {
674
+ :host([appearance="solid"][variant="highlight"]:not([disabled]:not([disabled="false"]))) {
675
675
  --split-button-background-color: var(--joy-color-highlight-500);
676
676
  --split-button-foreground-color: var(--joy-color-highlight-0);
677
677
  }
678
678
 
679
- :host([appearance="solid"][variant="highlight"]:not([disabled]):not([disabled="false"]):hover) {
679
+ :host([appearance="solid"][variant="highlight"]:not([disabled]:not([disabled="false"])):hover) {
680
680
  --split-button-background-color: var(--joy-color-highlight-600);
681
681
  }
682
682
 
683
- :host([appearance="solid"][variant="neutral"]:not([disabled]):not([disabled="false"])) {
683
+ :host([appearance="solid"][variant="neutral"]:not([disabled]:not([disabled="false"]))) {
684
684
  --split-button-background-color: var(--joy-color-neutral-500);
685
685
  --split-button-foreground-color: var(--joy-color-neutral-0);
686
686
  }
687
687
 
688
- :host([appearance="solid"][variant="neutral"]:not([disabled]):not([disabled="false"]):hover) {
688
+ :host([appearance="solid"][variant="neutral"]:not([disabled]:not([disabled="false"])):hover) {
689
689
  --split-button-background-color: var(--joy-color-neutral-600);
690
690
  }
691
691
 
package/Controls/Components/Buttons/SplitButton/Themes/SplitButtonElement.Retro.js CHANGED
@@ -255,7 +255,7 @@ export function splitButtonElementRetroStyle() {
255
255
  --split-button-border-style: solid;
256
256
  }
257
257
 
258
- :host([appearance="outline"]) [part="focusRing"], :host([appearance="plain"]:not([disabled]):not([disabled="false"])) [part="focusRing"] {
258
+ :host([appearance="outline"]) [part="focusRing"], :host([appearance="plain"]:not([disabled]:not([disabled="false"]))) [part="focusRing"] {
259
259
  --focus-ring-outward-offset: 0px;
260
260
  }
261
261