@breadstone/mosaik-elements-foundation 0.0.27 → 0.0.28

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
@@ -284,94 +284,94 @@ export function compoundButtonElementJoyStyle() {
284
284
  --focus-ring-outward-offset: 0px;
285
285
  }
286
286
 
287
- :host([appearance="outline"]:not([disabled]):not([disabled="false"])) {
287
+ :host([appearance="outline"]:not([disabled]:not([disabled="false"]))) {
288
288
  --compound-button-background-color: var(--joy-scheme-background);
289
289
  --compound-button-foreground-color: var(--joy-scheme-foreground);
290
290
  --compound-button-border-color: var(--joy-scheme-highlight);
291
291
  }
292
292
 
293
- :host([appearance="outline"]:not([disabled]):not([disabled="false"]):hover) {
293
+ :host([appearance="outline"]:not([disabled]:not([disabled="false"])):hover) {
294
294
  --compound-button-background-color: var(--joy-scheme-highlight);
295
295
  }
296
296
 
297
- :host([appearance="outline"][variant="primary"]:not([disabled]):not([disabled="false"])) {
297
+ :host([appearance="outline"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
298
298
  --compound-button-foreground-color: var(--joy-color-primary-500);
299
299
  --compound-button-border-color: var(--joy-color-primary-500);
300
300
  }
301
301
 
302
- :host([appearance="outline"][variant="primary"]:not([disabled]):not([disabled="false"]):hover) {
302
+ :host([appearance="outline"][variant="primary"]:not([disabled]:not([disabled="false"])):hover) {
303
303
  --compound-button-background-color: var(--joy-color-primary-100);
304
304
  }
305
305
 
306
- :host([appearance="outline"][variant="secondary"]:not([disabled]):not([disabled="false"])) {
306
+ :host([appearance="outline"][variant="secondary"]:not([disabled]:not([disabled="false"]))) {
307
307
  --compound-button-foreground-color: var(--joy-color-secondary-500);
308
308
  --compound-button-border-color: var(--joy-color-secondary-500);
309
309
  }
310
310
 
311
- :host([appearance="outline"][variant="secondary"]:not([disabled]):not([disabled="false"]):hover) {
311
+ :host([appearance="outline"][variant="secondary"]:not([disabled]:not([disabled="false"])):hover) {
312
312
  --compound-button-background-color: var(--joy-color-secondary-100);
313
313
  }
314
314
 
315
- :host([appearance="outline"][variant="tertiary"]:not([disabled]):not([disabled="false"])) {
315
+ :host([appearance="outline"][variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
316
316
  --compound-button-foreground-color: var(--joy-color-tertiary-500);
317
317
  --compound-button-border-color: var(--joy-color-tertiary-500);
318
318
  }
319
319
 
320
- :host([appearance="outline"][variant="tertiary"]:not([disabled]):not([disabled="false"]):hover) {
320
+ :host([appearance="outline"][variant="tertiary"]:not([disabled]:not([disabled="false"])):hover) {
321
321
  --compound-button-background-color: var(--joy-color-tertiary-100);
322
322
  }
323
323
 
324
- :host([appearance="outline"][variant="danger"]:not([disabled]):not([disabled="false"])) {
324
+ :host([appearance="outline"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
325
325
  --compound-button-foreground-color: var(--joy-color-danger-500);
326
326
  --compound-button-border-color: var(--joy-color-danger-500);
327
327
  }
328
328
 
329
- :host([appearance="outline"][variant="danger"]:not([disabled]):not([disabled="false"]):hover) {
329
+ :host([appearance="outline"][variant="danger"]:not([disabled]:not([disabled="false"])):hover) {
330
330
  --compound-button-background-color: var(--joy-color-danger-100);
331
331
  }
332
332
 
333
- :host([appearance="outline"][variant="warning"]:not([disabled]):not([disabled="false"])) {
333
+ :host([appearance="outline"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
334
334
  --compound-button-foreground-color: var(--joy-color-warning-500);
335
335
  --compound-button-border-color: var(--joy-color-warning-500);
336
336
  }
337
337
 
338
- :host([appearance="outline"][variant="warning"]:not([disabled]):not([disabled="false"]):hover) {
338
+ :host([appearance="outline"][variant="warning"]:not([disabled]:not([disabled="false"])):hover) {
339
339
  --compound-button-background-color: var(--joy-color-warning-100);
340
340
  }
341
341
 
342
- :host([appearance="outline"][variant="success"]:not([disabled]):not([disabled="false"])) {
342
+ :host([appearance="outline"][variant="success"]:not([disabled]:not([disabled="false"]))) {
343
343
  --compound-button-foreground-color: var(--joy-color-success-500);
344
344
  --compound-button-border-color: var(--joy-color-success-500);
345
345
  }
346
346
 
347
- :host([appearance="outline"][variant="success"]:not([disabled]):not([disabled="false"]):hover) {
347
+ :host([appearance="outline"][variant="success"]:not([disabled]:not([disabled="false"])):hover) {
348
348
  --compound-button-background-color: var(--joy-color-success-100);
349
349
  }
350
350
 
351
- :host([appearance="outline"][variant="info"]:not([disabled]):not([disabled="false"])) {
351
+ :host([appearance="outline"][variant="info"]:not([disabled]:not([disabled="false"]))) {
352
352
  --compound-button-foreground-color: var(--joy-color-info-500);
353
353
  --compound-button-border-color: var(--joy-color-info-500);
354
354
  }
355
355
 
356
- :host([appearance="outline"][variant="info"]:not([disabled]):not([disabled="false"]):hover) {
356
+ :host([appearance="outline"][variant="info"]:not([disabled]:not([disabled="false"])):hover) {
357
357
  --compound-button-background-color: var(--joy-color-info-100);
358
358
  }
359
359
 
360
- :host([appearance="outline"][variant="highlight"]:not([disabled]):not([disabled="false"])) {
360
+ :host([appearance="outline"][variant="highlight"]:not([disabled]:not([disabled="false"]))) {
361
361
  --compound-button-foreground-color: var(--joy-color-highlight-500);
362
362
  --compound-button-border-color: var(--joy-color-highlight-500);
363
363
  }
364
364
 
365
- :host([appearance="outline"][variant="highlight"]:not([disabled]):not([disabled="false"]):hover) {
365
+ :host([appearance="outline"][variant="highlight"]:not([disabled]:not([disabled="false"])):hover) {
366
366
  --compound-button-background-color: var(--joy-color-highlight-100);
367
367
  }
368
368
 
369
- :host([appearance="outline"][variant="neutral"]:not([disabled]):not([disabled="false"])) {
369
+ :host([appearance="outline"][variant="neutral"]:not([disabled]:not([disabled="false"]))) {
370
370
  --compound-button-foreground-color: var(--joy-color-neutral-500);
371
371
  --compound-button-border-color: var(--joy-color-neutral-500);
372
372
  }
373
373
 
374
- :host([appearance="outline"][variant="neutral"]:not([disabled]):not([disabled="false"]):hover) {
374
+ :host([appearance="outline"][variant="neutral"]:not([disabled]:not([disabled="false"])):hover) {
375
375
  --compound-button-background-color: var(--joy-color-neutral-100);
376
376
  }
377
377
 
@@ -380,91 +380,91 @@ export function compoundButtonElementJoyStyle() {
380
380
  --compound-button-background-color: var(--joy-scheme-transparent);
381
381
  }
382
382
 
383
- :host([appearance="plain"]:not([disabled]):not([disabled="false"])) [part="focusRing"] {
383
+ :host([appearance="plain"]:not([disabled]:not([disabled="false"]))) [part="focusRing"] {
384
384
  --focus-ring-outward-offset: 0px;
385
385
  }
386
386
 
387
- :host([appearance="plain"]:not([disabled]):not([disabled="false"]):hover) {
387
+ :host([appearance="plain"]:not([disabled]:not([disabled="false"])):hover) {
388
388
  --compound-button-background-color: var(--joy-scheme-highlight);
389
389
  }
390
390
 
391
- :host([appearance="plain"][variant="primary"]:not([disabled]):not([disabled="false"])) {
391
+ :host([appearance="plain"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
392
392
  --compound-button-foreground-color: var(--joy-color-primary-500);
393
393
  }
394
394
 
395
- :host([appearance="plain"][variant="primary"]:not([disabled]):not([disabled="false"]):hover) {
395
+ :host([appearance="plain"][variant="primary"]:not([disabled]:not([disabled="false"])):hover) {
396
396
  --compound-button-background-color: var(--joy-color-primary-100);
397
397
  --compound-button-foreground-color: var(--joy-color-primary-500);
398
398
  }
399
399
 
400
- :host([appearance="plain"][variant="secondary"]:not([disabled]):not([disabled="false"])) {
400
+ :host([appearance="plain"][variant="secondary"]:not([disabled]:not([disabled="false"]))) {
401
401
  --compound-button-foreground-color: var(--joy-color-secondary-500);
402
402
  }
403
403
 
404
- :host([appearance="plain"][variant="secondary"]:not([disabled]):not([disabled="false"]):hover) {
404
+ :host([appearance="plain"][variant="secondary"]:not([disabled]:not([disabled="false"])):hover) {
405
405
  --compound-button-background-color: var(--joy-color-secondary-100);
406
406
  --compound-button-foreground-color: var(--joy-color-secondary-500);
407
407
  }
408
408
 
409
- :host([appearance="plain"][variant="tertiary"]:not([disabled]):not([disabled="false"])) {
409
+ :host([appearance="plain"][variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
410
410
  --compound-button-foreground-color: var(--joy-color-tertiary-500);
411
411
  }
412
412
 
413
- :host([appearance="plain"][variant="tertiary"]:not([disabled]):not([disabled="false"]):hover) {
413
+ :host([appearance="plain"][variant="tertiary"]:not([disabled]:not([disabled="false"])):hover) {
414
414
  --compound-button-background-color: var(--joy-color-tertiary-100);
415
415
  --compound-button-foreground-color: var(--joy-color-tertiary-500);
416
416
  }
417
417
 
418
- :host([appearance="plain"][variant="danger"]:not([disabled]):not([disabled="false"])) {
418
+ :host([appearance="plain"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
419
419
  --compound-button-foreground-color: var(--joy-color-danger-500);
420
420
  }
421
421
 
422
- :host([appearance="plain"][variant="danger"]:not([disabled]):not([disabled="false"]):hover) {
422
+ :host([appearance="plain"][variant="danger"]:not([disabled]:not([disabled="false"])):hover) {
423
423
  --compound-button-background-color: var(--joy-color-danger-100);
424
424
  --compound-button-foreground-color: var(--joy-color-danger-500);
425
425
  }
426
426
 
427
- :host([appearance="plain"][variant="warning"]:not([disabled]):not([disabled="false"])) {
427
+ :host([appearance="plain"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
428
428
  --compound-button-foreground-color: var(--joy-color-warning-500);
429
429
  }
430
430
 
431
- :host([appearance="plain"][variant="warning"]:not([disabled]):not([disabled="false"]):hover) {
431
+ :host([appearance="plain"][variant="warning"]:not([disabled]:not([disabled="false"])):hover) {
432
432
  --compound-button-background-color: var(--joy-color-warning-100);
433
433
  --compound-button-foreground-color: var(--joy-color-warning-500);
434
434
  }
435
435
 
436
- :host([appearance="plain"][variant="success"]:not([disabled]):not([disabled="false"])) {
436
+ :host([appearance="plain"][variant="success"]:not([disabled]:not([disabled="false"]))) {
437
437
  --compound-button-foreground-color: var(--joy-color-success-500);
438
438
  }
439
439
 
440
- :host([appearance="plain"][variant="success"]:not([disabled]):not([disabled="false"]):hover) {
440
+ :host([appearance="plain"][variant="success"]:not([disabled]:not([disabled="false"])):hover) {
441
441
  --compound-button-background-color: var(--joy-color-success-100);
442
442
  --compound-button-foreground-color: var(--joy-color-success-500);
443
443
  }
444
444
 
445
- :host([appearance="plain"][variant="info"]:not([disabled]):not([disabled="false"])) {
445
+ :host([appearance="plain"][variant="info"]:not([disabled]:not([disabled="false"]))) {
446
446
  --compound-button-foreground-color: var(--joy-color-info-500);
447
447
  }
448
448
 
449
- :host([appearance="plain"][variant="info"]:not([disabled]):not([disabled="false"]):hover) {
449
+ :host([appearance="plain"][variant="info"]:not([disabled]:not([disabled="false"])):hover) {
450
450
  --compound-button-background-color: var(--joy-color-info-100);
451
451
  --compound-button-foreground-color: var(--joy-color-info-500);
452
452
  }
453
453
 
454
- :host([appearance="plain"][variant="highlight"]:not([disabled]):not([disabled="false"])) {
454
+ :host([appearance="plain"][variant="highlight"]:not([disabled]:not([disabled="false"]))) {
455
455
  --compound-button-foreground-color: var(--joy-color-highlight-500);
456
456
  }
457
457
 
458
- :host([appearance="plain"][variant="highlight"]:not([disabled]):not([disabled="false"]):hover) {
458
+ :host([appearance="plain"][variant="highlight"]:not([disabled]:not([disabled="false"])):hover) {
459
459
  --compound-button-background-color: var(--joy-color-highlight-100);
460
460
  --compound-button-foreground-color: var(--joy-color-highlight-500);
461
461
  }
462
462
 
463
- :host([appearance="plain"][variant="neutral"]:not([disabled]):not([disabled="false"])) {
463
+ :host([appearance="plain"][variant="neutral"]:not([disabled]:not([disabled="false"]))) {
464
464
  --compound-button-foreground-color: var(--joy-color-neutral-500);
465
465
  }
466
466
 
467
- :host([appearance="plain"][variant="neutral"]:not([disabled]):not([disabled="false"]):hover) {
467
+ :host([appearance="plain"][variant="neutral"]:not([disabled]:not([disabled="false"])):hover) {
468
468
  --compound-button-background-color: var(--joy-color-neutral-100);
469
469
  --compound-button-foreground-color: var(--joy-color-neutral-500);
470
470
  }
@@ -477,89 +477,89 @@ export function compoundButtonElementJoyStyle() {
477
477
  --focus-ring-outward-offset: 0px;
478
478
  }
479
479
 
480
- :host([appearance="soft"]:not([disabled]):not([disabled="false"])) {
480
+ :host([appearance="soft"]:not([disabled]:not([disabled="false"]))) {
481
481
  --compound-button-background-color: var(--joy-scheme-highlight);
482
482
  --compound-button-foreground-color: var(--joy-scheme-foreground);
483
483
  }
484
484
 
485
- :host([appearance="soft"][variant="primary"]:not([disabled]):not([disabled="false"])) {
485
+ :host([appearance="soft"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
486
486
  --compound-button-background-color: var(--joy-color-primary-100);
487
487
  --compound-button-foreground-color: var(--joy-color-primary-500);
488
488
  }
489
489
 
490
- :host([appearance="soft"][variant="primary"]:not([disabled]):not([disabled="false"]):hover) {
490
+ :host([appearance="soft"][variant="primary"]:not([disabled]:not([disabled="false"])):hover) {
491
491
  --compound-button-background-color: var(--joy-color-primary-200);
492
492
  }
493
493
 
494
- :host([appearance="soft"][variant="secondary"]:not([disabled]):not([disabled="false"])) {
494
+ :host([appearance="soft"][variant="secondary"]:not([disabled]:not([disabled="false"]))) {
495
495
  --compound-button-background-color: var(--joy-color-secondary-100);
496
496
  --compound-button-foreground-color: var(--joy-color-secondary-500);
497
497
  }
498
498
 
499
- :host([appearance="soft"][variant="secondary"]:not([disabled]):not([disabled="false"]):hover) {
499
+ :host([appearance="soft"][variant="secondary"]:not([disabled]:not([disabled="false"])):hover) {
500
500
  --compound-button-background-color: var(--joy-color-secondary-200);
501
501
  }
502
502
 
503
- :host([appearance="soft"][variant="tertiary"]:not([disabled]):not([disabled="false"])) {
503
+ :host([appearance="soft"][variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
504
504
  --compound-button-background-color: var(--joy-color-tertiary-100);
505
505
  --compound-button-foreground-color: var(--joy-color-tertiary-500);
506
506
  }
507
507
 
508
- :host([appearance="soft"][variant="tertiary"]:not([disabled]):not([disabled="false"]):hover) {
508
+ :host([appearance="soft"][variant="tertiary"]:not([disabled]:not([disabled="false"])):hover) {
509
509
  --compound-button-background-color: var(--joy-color-tertiary-200);
510
510
  }
511
511
 
512
- :host([appearance="soft"][variant="danger"]:not([disabled]):not([disabled="false"])) {
512
+ :host([appearance="soft"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
513
513
  --compound-button-background-color: var(--joy-color-danger-100);
514
514
  --compound-button-foreground-color: var(--joy-color-danger-500);
515
515
  }
516
516
 
517
- :host([appearance="soft"][variant="danger"]:not([disabled]):not([disabled="false"]):hover) {
517
+ :host([appearance="soft"][variant="danger"]:not([disabled]:not([disabled="false"])):hover) {
518
518
  --compound-button-background-color: var(--joy-color-danger-200);
519
519
  }
520
520
 
521
- :host([appearance="soft"][variant="warning"]:not([disabled]):not([disabled="false"])) {
521
+ :host([appearance="soft"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
522
522
  --compound-button-background-color: var(--joy-color-warning-100);
523
523
  --compound-button-foreground-color: var(--joy-color-warning-500);
524
524
  }
525
525
 
526
- :host([appearance="soft"][variant="warning"]:not([disabled]):not([disabled="false"]):hover) {
526
+ :host([appearance="soft"][variant="warning"]:not([disabled]:not([disabled="false"])):hover) {
527
527
  --compound-button-background-color: var(--joy-color-warning-200);
528
528
  }
529
529
 
530
- :host([appearance="soft"][variant="success"]:not([disabled]):not([disabled="false"])) {
530
+ :host([appearance="soft"][variant="success"]:not([disabled]:not([disabled="false"]))) {
531
531
  --compound-button-background-color: var(--joy-color-success-100);
532
532
  --compound-button-foreground-color: var(--joy-color-success-500);
533
533
  }
534
534
 
535
- :host([appearance="soft"][variant="success"]:not([disabled]):not([disabled="false"]):hover) {
535
+ :host([appearance="soft"][variant="success"]:not([disabled]:not([disabled="false"])):hover) {
536
536
  --compound-button-background-color: var(--joy-color-success-200);
537
537
  }
538
538
 
539
- :host([appearance="soft"][variant="info"]:not([disabled]):not([disabled="false"])) {
539
+ :host([appearance="soft"][variant="info"]:not([disabled]:not([disabled="false"]))) {
540
540
  --compound-button-background-color: var(--joy-color-info-100);
541
541
  --compound-button-foreground-color: var(--joy-color-info-500);
542
542
  }
543
543
 
544
- :host([appearance="soft"][variant="info"]:not([disabled]):not([disabled="false"]):hover) {
544
+ :host([appearance="soft"][variant="info"]:not([disabled]:not([disabled="false"])):hover) {
545
545
  --compound-button-background-color: var(--joy-color-info-200);
546
546
  }
547
547
 
548
- :host([appearance="soft"][variant="highlight"]:not([disabled]):not([disabled="false"])) {
548
+ :host([appearance="soft"][variant="highlight"]:not([disabled]:not([disabled="false"]))) {
549
549
  --compound-button-background-color: var(--joy-color-highlight-100);
550
550
  --compound-button-foreground-color: var(--joy-color-highlight-500);
551
551
  }
552
552
 
553
- :host([appearance="soft"][variant="highlight"]:not([disabled]):not([disabled="false"]):hover) {
553
+ :host([appearance="soft"][variant="highlight"]:not([disabled]:not([disabled="false"])):hover) {
554
554
  --compound-button-background-color: var(--joy-color-highlight-200);
555
555
  }
556
556
 
557
- :host([appearance="soft"][variant="neutral"]:not([disabled]):not([disabled="false"])) {
557
+ :host([appearance="soft"][variant="neutral"]:not([disabled]:not([disabled="false"]))) {
558
558
  --compound-button-background-color: var(--joy-color-neutral-100);
559
559
  --compound-button-foreground-color: var(--joy-color-neutral-500);
560
560
  }
561
561
 
562
- :host([appearance="soft"][variant="neutral"]:not([disabled]):not([disabled="false"]):hover) {
562
+ :host([appearance="soft"][variant="neutral"]:not([disabled]:not([disabled="false"])):hover) {
563
563
  --compound-button-background-color: var(--joy-color-neutral-200);
564
564
  }
565
565
 
@@ -571,89 +571,89 @@ export function compoundButtonElementJoyStyle() {
571
571
  --focus-ring-outward-offset: 0px;
572
572
  }
573
573
 
574
- :host([appearance="solid"]:not([disabled]):not([disabled="false"])) {
574
+ :host([appearance="solid"]:not([disabled]:not([disabled="false"]))) {
575
575
  --compound-button-background-color: var(--joy-scheme-highlight);
576
576
  --compound-button-foreground-color: var(--joy-scheme-foreground);
577
577
  }
578
578
 
579
- :host([appearance="solid"][variant="primary"]:not([disabled]):not([disabled="false"])) {
579
+ :host([appearance="solid"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
580
580
  --compound-button-background-color: var(--joy-color-primary-500);
581
581
  --compound-button-foreground-color: var(--joy-color-primary-0);
582
582
  }
583
583
 
584
- :host([appearance="solid"][variant="primary"]:not([disabled]):not([disabled="false"]):hover) {
584
+ :host([appearance="solid"][variant="primary"]:not([disabled]:not([disabled="false"])):hover) {
585
585
  --compound-button-background-color: var(--joy-color-primary-600);
586
586
  }
587
587
 
588
- :host([appearance="solid"][variant="secondary"]:not([disabled]):not([disabled="false"])) {
588
+ :host([appearance="solid"][variant="secondary"]:not([disabled]:not([disabled="false"]))) {
589
589
  --compound-button-background-color: var(--joy-color-secondary-500);
590
590
  --compound-button-foreground-color: var(--joy-color-secondary-0);
591
591
  }
592
592
 
593
- :host([appearance="solid"][variant="secondary"]:not([disabled]):not([disabled="false"]):hover) {
593
+ :host([appearance="solid"][variant="secondary"]:not([disabled]:not([disabled="false"])):hover) {
594
594
  --compound-button-background-color: var(--joy-color-secondary-600);
595
595
  }
596
596
 
597
- :host([appearance="solid"][variant="tertiary"]:not([disabled]):not([disabled="false"])) {
597
+ :host([appearance="solid"][variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
598
598
  --compound-button-background-color: var(--joy-color-tertiary-500);
599
599
  --compound-button-foreground-color: var(--joy-color-tertiary-0);
600
600
  }
601
601
 
602
- :host([appearance="solid"][variant="tertiary"]:not([disabled]):not([disabled="false"]):hover) {
602
+ :host([appearance="solid"][variant="tertiary"]:not([disabled]:not([disabled="false"])):hover) {
603
603
  --compound-button-background-color: var(--joy-color-tertiary-600);
604
604
  }
605
605
 
606
- :host([appearance="solid"][variant="danger"]:not([disabled]):not([disabled="false"])) {
606
+ :host([appearance="solid"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
607
607
  --compound-button-background-color: var(--joy-color-danger-500);
608
608
  --compound-button-foreground-color: var(--joy-color-danger-0);
609
609
  }
610
610
 
611
- :host([appearance="solid"][variant="danger"]:not([disabled]):not([disabled="false"]):hover) {
611
+ :host([appearance="solid"][variant="danger"]:not([disabled]:not([disabled="false"])):hover) {
612
612
  --compound-button-background-color: var(--joy-color-danger-600);
613
613
  }
614
614
 
615
- :host([appearance="solid"][variant="warning"]:not([disabled]):not([disabled="false"])) {
615
+ :host([appearance="solid"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
616
616
  --compound-button-background-color: var(--joy-color-warning-500);
617
617
  --compound-button-foreground-color: var(--joy-color-warning-0);
618
618
  }
619
619
 
620
- :host([appearance="solid"][variant="warning"]:not([disabled]):not([disabled="false"]):hover) {
620
+ :host([appearance="solid"][variant="warning"]:not([disabled]:not([disabled="false"])):hover) {
621
621
  --compound-button-background-color: var(--joy-color-warning-600);
622
622
  }
623
623
 
624
- :host([appearance="solid"][variant="success"]:not([disabled]):not([disabled="false"])) {
624
+ :host([appearance="solid"][variant="success"]:not([disabled]:not([disabled="false"]))) {
625
625
  --compound-button-background-color: var(--joy-color-success-500);
626
626
  --compound-button-foreground-color: var(--joy-color-success-0);
627
627
  }
628
628
 
629
- :host([appearance="solid"][variant="success"]:not([disabled]):not([disabled="false"]):hover) {
629
+ :host([appearance="solid"][variant="success"]:not([disabled]:not([disabled="false"])):hover) {
630
630
  --compound-button-background-color: var(--joy-color-success-600);
631
631
  }
632
632
 
633
- :host([appearance="solid"][variant="info"]:not([disabled]):not([disabled="false"])) {
633
+ :host([appearance="solid"][variant="info"]:not([disabled]:not([disabled="false"]))) {
634
634
  --compound-button-background-color: var(--joy-color-info-500);
635
635
  --compound-button-foreground-color: var(--joy-color-info-0);
636
636
  }
637
637
 
638
- :host([appearance="solid"][variant="info"]:not([disabled]):not([disabled="false"]):hover) {
638
+ :host([appearance="solid"][variant="info"]:not([disabled]:not([disabled="false"])):hover) {
639
639
  --compound-button-background-color: var(--joy-color-info-600);
640
640
  }
641
641
 
642
- :host([appearance="solid"][variant="highlight"]:not([disabled]):not([disabled="false"])) {
642
+ :host([appearance="solid"][variant="highlight"]:not([disabled]:not([disabled="false"]))) {
643
643
  --compound-button-background-color: var(--joy-color-highlight-500);
644
644
  --compound-button-foreground-color: var(--joy-color-highlight-0);
645
645
  }
646
646
 
647
- :host([appearance="solid"][variant="highlight"]:not([disabled]):not([disabled="false"]):hover) {
647
+ :host([appearance="solid"][variant="highlight"]:not([disabled]:not([disabled="false"])):hover) {
648
648
  --compound-button-background-color: var(--joy-color-highlight-600);
649
649
  }
650
650
 
651
- :host([appearance="solid"][variant="neutral"]:not([disabled]):not([disabled="false"])) {
651
+ :host([appearance="solid"][variant="neutral"]:not([disabled]:not([disabled="false"]))) {
652
652
  --compound-button-background-color: var(--joy-color-neutral-500);
653
653
  --compound-button-foreground-color: var(--joy-color-neutral-0);
654
654
  }
655
655
 
656
- :host([appearance="solid"][variant="neutral"]:not([disabled]):not([disabled="false"]):hover) {
656
+ :host([appearance="solid"][variant="neutral"]:not([disabled]:not([disabled="false"])):hover) {
657
657
  --compound-button-background-color: var(--joy-color-neutral-600);
658
658
  }
659
659
 
@@ -272,73 +272,73 @@ export function compoundButtonElementRetroStyle() {
272
272
  box-shadow: var(--retro-elevation-none);
273
273
  }
274
274
 
275
- :host([variant="primary"]:not([disabled]):not([disabled="false"])) {
275
+ :host([variant="primary"]:not([disabled]:not([disabled="false"]))) {
276
276
  --compound-button-background-color: var(--retro-color-primary-500);
277
277
  --compound-button-foreground-color: var(--retro-color-primary-0);
278
278
  --compound-button-shadow-color: var(--retro-color-primary-200);
279
279
  }
280
280
 
281
- :host([variant="primary"]:not([disabled]):not([disabled="false"]):hover) {
281
+ :host([variant="primary"]:not([disabled]:not([disabled="false"])):hover) {
282
282
  --compound-button-background-color: var(--retro-color-primary-600);
283
283
  }
284
284
 
285
- :host([variant="secondary"]:not([disabled]):not([disabled="false"])) {
285
+ :host([variant="secondary"]:not([disabled]:not([disabled="false"]))) {
286
286
  --compound-button-background-color: var(--retro-color-secondary-500);
287
287
  --compound-button-foreground-color: var(--retro-color-secondary-0);
288
288
  --compound-button-shadow-color: var(--retro-color-secondary-200);
289
289
  }
290
290
 
291
- :host([variant="secondary"]:not([disabled]):not([disabled="false"]):hover) {
291
+ :host([variant="secondary"]:not([disabled]:not([disabled="false"])):hover) {
292
292
  --compound-button-background-color: var(--retro-color-secondary-600);
293
293
  }
294
294
 
295
- :host([variant="info"]:not([disabled]):not([disabled="false"])) {
295
+ :host([variant="info"]:not([disabled]:not([disabled="false"]))) {
296
296
  --compound-button-background-color: var(--retro-color-info-500);
297
297
  --compound-button-foreground-color: var(--retro-color-info-0);
298
298
  --compound-button-shadow-color: var(--retro-color-info-200);
299
299
  }
300
300
 
301
- :host([variant="info"]:not([disabled]):not([disabled="false"]):hover) {
301
+ :host([variant="info"]:not([disabled]:not([disabled="false"])):hover) {
302
302
  --compound-button-background-color: var(--retro-color-info-600);
303
303
  }
304
304
 
305
- :host([variant="warning"]:not([disabled]):not([disabled="false"])) {
305
+ :host([variant="warning"]:not([disabled]:not([disabled="false"]))) {
306
306
  --compound-button-background-color: var(--retro-color-warning-500);
307
307
  --compound-button-foreground-color: var(--retro-color-warning-0);
308
308
  --compound-button-shadow-color: var(--retro-color-warning-200);
309
309
  }
310
310
 
311
- :host([variant="warning"]:not([disabled]):not([disabled="false"]):hover) {
311
+ :host([variant="warning"]:not([disabled]:not([disabled="false"])):hover) {
312
312
  --compound-button-background-color: var(--retro-color-warning-600);
313
313
  }
314
314
 
315
- :host([variant="danger"]:not([disabled]):not([disabled="false"])) {
315
+ :host([variant="danger"]:not([disabled]:not([disabled="false"]))) {
316
316
  --compound-button-background-color: var(--retro-color-danger-500);
317
317
  --compound-button-foreground-color: var(--retro-color-danger-0);
318
318
  --compound-button-shadow-color: var(--retro-color-danger-200);
319
319
  }
320
320
 
321
- :host([variant="danger"]:not([disabled]):not([disabled="false"]):hover) {
321
+ :host([variant="danger"]:not([disabled]:not([disabled="false"])):hover) {
322
322
  --compound-button-background-color: var(--retro-color-danger-600);
323
323
  }
324
324
 
325
- :host([variant="success"]:not([disabled]):not([disabled="false"])) {
325
+ :host([variant="success"]:not([disabled]:not([disabled="false"]))) {
326
326
  --compound-button-background-color: var(--retro-color-success-500);
327
327
  --compound-button-foreground-color: var(--retro-color-success-0);
328
328
  --compound-button-shadow-color: var(--retro-color-success-200);
329
329
  }
330
330
 
331
- :host([variant="success"]:not([disabled]):not([disabled="false"]):hover) {
331
+ :host([variant="success"]:not([disabled]:not([disabled="false"])):hover) {
332
332
  --compound-button-background-color: var(--retro-color-success-600);
333
333
  }
334
334
 
335
- :host([variant="neutral"]:not([disabled]):not([disabled="false"])) {
335
+ :host([variant="neutral"]:not([disabled]:not([disabled="false"]))) {
336
336
  --compound-button-background-color: var(--retro-color-neutral-500);
337
337
  --compound-button-foreground-color: var(--retro-color-neutral-0);
338
338
  --compound-button-shadow-color: var(--retro-color-neutral-200);
339
339
  }
340
340
 
341
- :host([variant="neutral"]:not([disabled]):not([disabled="false"]):hover) {
341
+ :host([variant="neutral"]:not([disabled]:not([disabled="false"])):hover) {
342
342
  --compound-button-background-color: var(--retro-color-neutral-600);
343
343
  }
344
344
 
@@ -248,7 +248,7 @@ export function dropDownButtonElementCosmopolitanStyle() {
248
248
  --dropdown-button-border-width: 0px;
249
249
  }
250
250
 
251
- :host([appearance="plain"]:not([disabled]):not([disabled="false"])) [part="focusRing"] {
251
+ :host([appearance="plain"]:not([disabled]:not([disabled="false"]))) [part="focusRing"] {
252
252
  --focus-ring-outward-offset: 0px;
253
253
  }
254
254