@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
package/Controls/Components/Buttons/Button/Themes/ButtonElement.Retro.js CHANGED
@@ -273,73 +273,73 @@ export function buttonElementRetroStyle() {
273
273
  --button-shadow-color: var(--retro-scheme-transparent);
274
274
  }
275
275
 
276
- :host([variant="primary"]:not([disabled]):not([disabled="false"])) {
276
+ :host([variant="primary"]:not([disabled]:not([disabled="false"]))) {
277
277
  --button-background-color: var(--retro-color-primary-500);
278
278
  --button-foreground-color: var(--retro-color-primary-0);
279
279
  --button-shadow-color: var(--retro-color-primary-200);
280
280
  }
281
281
 
282
- :host([variant="primary"]:not([disabled]):not([disabled="false"]):hover) {
282
+ :host([variant="primary"]:not([disabled]:not([disabled="false"])):hover) {
283
283
  --button-background-color: var(--retro-color-primary-600);
284
284
  }
285
285
 
286
- :host([variant="secondary"]:not([disabled]):not([disabled="false"])) {
286
+ :host([variant="secondary"]:not([disabled]:not([disabled="false"]))) {
287
287
  --button-background-color: var(--retro-color-secondary-500);
288
288
  --button-foreground-color: var(--retro-color-secondary-0);
289
289
  --button-shadow-color: var(--retro-color-secondary-200);
290
290
  }
291
291
 
292
- :host([variant="secondary"]:not([disabled]):not([disabled="false"]):hover) {
292
+ :host([variant="secondary"]:not([disabled]:not([disabled="false"])):hover) {
293
293
  --button-background-color: var(--retro-color-secondary-600);
294
294
  }
295
295
 
296
- :host([variant="info"]:not([disabled]):not([disabled="false"])) {
296
+ :host([variant="info"]:not([disabled]:not([disabled="false"]))) {
297
297
  --button-background-color: var(--retro-color-info-500);
298
298
  --button-foreground-color: var(--retro-color-info-0);
299
299
  --button-shadow-color: var(--retro-color-info-200);
300
300
  }
301
301
 
302
- :host([variant="info"]:not([disabled]):not([disabled="false"]):hover) {
302
+ :host([variant="info"]:not([disabled]:not([disabled="false"])):hover) {
303
303
  --button-background-color: var(--retro-color-info-600);
304
304
  }
305
305
 
306
- :host([variant="warning"]:not([disabled]):not([disabled="false"])) {
306
+ :host([variant="warning"]:not([disabled]:not([disabled="false"]))) {
307
307
  --button-background-color: var(--retro-color-warning-500);
308
308
  --button-foreground-color: var(--retro-color-warning-0);
309
309
  --button-shadow-color: var(--retro-color-warning-200);
310
310
  }
311
311
 
312
- :host([variant="warning"]:not([disabled]):not([disabled="false"]):hover) {
312
+ :host([variant="warning"]:not([disabled]:not([disabled="false"])):hover) {
313
313
  --button-background-color: var(--retro-color-warning-600);
314
314
  }
315
315
 
316
- :host([variant="danger"]:not([disabled]):not([disabled="false"])) {
316
+ :host([variant="danger"]:not([disabled]:not([disabled="false"]))) {
317
317
  --button-background-color: var(--retro-color-danger-500);
318
318
  --button-foreground-color: var(--retro-color-danger-0);
319
319
  --button-shadow-color: var(--retro-color-danger-200);
320
320
  }
321
321
 
322
- :host([variant="danger"]:not([disabled]):not([disabled="false"]):hover) {
322
+ :host([variant="danger"]:not([disabled]:not([disabled="false"])):hover) {
323
323
  --button-background-color: var(--retro-color-danger-600);
324
324
  }
325
325
 
326
- :host([variant="success"]:not([disabled]):not([disabled="false"])) {
326
+ :host([variant="success"]:not([disabled]:not([disabled="false"]))) {
327
327
  --button-background-color: var(--retro-color-success-500);
328
328
  --button-foreground-color: var(--retro-color-success-0);
329
329
  --button-shadow-color: var(--retro-color-success-200);
330
330
  }
331
331
 
332
- :host([variant="success"]:not([disabled]):not([disabled="false"]):hover) {
332
+ :host([variant="success"]:not([disabled]:not([disabled="false"])):hover) {
333
333
  --button-background-color: var(--retro-color-success-600);
334
334
  }
335
335
 
336
- :host([variant="neutral"]:not([disabled]):not([disabled="false"])) {
336
+ :host([variant="neutral"]:not([disabled]:not([disabled="false"]))) {
337
337
  --button-background-color: var(--retro-color-neutral-500);
338
338
  --button-foreground-color: var(--retro-color-neutral-0);
339
339
  --button-shadow-color: var(--retro-color-neutral-200);
340
340
  }
341
341
 
342
- :host([variant="neutral"]:not([disabled]):not([disabled="false"]):hover) {
342
+ :host([variant="neutral"]:not([disabled]:not([disabled="false"])):hover) {
343
343
  --button-background-color: var(--retro-color-neutral-600);
344
344
  }
345
345
 
@@ -377,48 +377,48 @@ export function buttonElementRetroStyle() {
377
377
  --button-shadow-color: var(--retro-color-neutral-200);
378
378
  }
379
379
 
380
- :host([appearance="outline"]:not([disabled]):not([disabled="false"])) {
380
+ :host([appearance="outline"]:not([disabled]:not([disabled="false"]))) {
381
381
  --button-background-color: var(--retro-scheme-background);
382
382
  --button-foreground-color: var(--retro-scheme-foreground);
383
383
  --button-border-color: var(--retro-scheme-highlight);
384
384
  }
385
385
 
386
- :host([appearance="outline"]:not([disabled]):not([disabled="false"]):hover) {
386
+ :host([appearance="outline"]:not([disabled]:not([disabled="false"])):hover) {
387
387
  --button-background-color: var(--retro-scheme-background);
388
388
  --button-foreground-color: var(--retro-scheme-foreground);
389
389
  }
390
390
 
391
- :host([appearance="outline"][variant="primary"]:not([disabled]):not([disabled="false"])) {
391
+ :host([appearance="outline"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
392
392
  --button-foreground-color: var(--retro-color-primary-500);
393
393
  --button-border-color: var(--retro-color-primary-500);
394
394
  }
395
395
 
396
- :host([appearance="outline"][variant="secondary"]:not([disabled]):not([disabled="false"])) {
396
+ :host([appearance="outline"][variant="secondary"]:not([disabled]:not([disabled="false"]))) {
397
397
  --button-foreground-color: var(--retro-color-secondary-500);
398
398
  --button-border-color: var(--retro-color-secondary-500);
399
399
  }
400
400
 
401
- :host([appearance="outline"][variant="info"]:not([disabled]):not([disabled="false"])) {
401
+ :host([appearance="outline"][variant="info"]:not([disabled]:not([disabled="false"]))) {
402
402
  --button-foreground-color: var(--retro-color-info-500);
403
403
  --button-border-color: var(--retro-color-info-500);
404
404
  }
405
405
 
406
- :host([appearance="outline"][variant="warning"]:not([disabled]):not([disabled="false"])) {
406
+ :host([appearance="outline"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
407
407
  --button-foreground-color: var(--retro-color-warning-500);
408
408
  --button-border-color: var(--retro-color-warning-500);
409
409
  }
410
410
 
411
- :host([appearance="outline"][variant="danger"]:not([disabled]):not([disabled="false"])) {
411
+ :host([appearance="outline"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
412
412
  --button-foreground-color: var(--retro-color-danger-500);
413
413
  --button-border-color: var(--retro-color-danger-500);
414
414
  }
415
415
 
416
- :host([appearance="outline"][variant="success"]:not([disabled]):not([disabled="false"])) {
416
+ :host([appearance="outline"][variant="success"]:not([disabled]:not([disabled="false"]))) {
417
417
  --button-foreground-color: var(--retro-color-success-500);
418
418
  --button-border-color: var(--retro-color-success-500);
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
  --button-foreground-color: var(--retro-color-neutral-500);
423
423
  --button-border-color: var(--retro-color-neutral-500);
424
424
  }
@@ -427,50 +427,50 @@ export function buttonElementRetroStyle() {
427
427
  --button-shadow-color: var(--retro-scheme-disabled);
428
428
  }
429
429
 
430
- :host([appearance="solid"]:not([disabled]):not([disabled="false"])) {
430
+ :host([appearance="solid"]:not([disabled]:not([disabled="false"]))) {
431
431
  --button-background-color: var(--retro-scheme-highlight);
432
432
  --button-border-color: var(--retro-scheme-contrast);
433
433
  --button-shadow-color: var(--retro-scheme-highlight);
434
434
  --button-foreground-color: var(--retro-scheme-foreground);
435
435
  }
436
436
 
437
- :host([appearance="solid"][variant="primary"]:not([disabled]):not([disabled="false"])) {
437
+ :host([appearance="solid"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
438
438
  --button-background-color: var(--retro-color-primary-500);
439
439
  --button-foreground-color: var(--retro-color-primary-0);
440
440
  --button-shadow-color: var(--retro-color-primary-500);
441
441
  }
442
442
 
443
- :host([appearance="solid"][variant="secondary"]:not([disabled]):not([disabled="false"])) {
443
+ :host([appearance="solid"][variant="secondary"]:not([disabled]:not([disabled="false"]))) {
444
444
  --button-background-color: var(--retro-color-secondary-500);
445
445
  --button-foreground-color: var(--retro-color-secondary-0);
446
446
  --button-shadow-color: var(--retro-color-secondary-500);
447
447
  }
448
448
 
449
- :host([appearance="solid"][variant="info"]:not([disabled]):not([disabled="false"])) {
449
+ :host([appearance="solid"][variant="info"]:not([disabled]:not([disabled="false"]))) {
450
450
  --button-background-color: var(--retro-color-info-500);
451
451
  --button-foreground-color: var(--retro-color-info-0);
452
452
  --button-shadow-color: var(--retro-color-info-500);
453
453
  }
454
454
 
455
- :host([appearance="solid"][variant="warning"]:not([disabled]):not([disabled="false"])) {
455
+ :host([appearance="solid"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
456
456
  --button-background-color: var(--retro-color-warning-500);
457
457
  --button-foreground-color: var(--retro-color-warning-0);
458
458
  --button-shadow-color: var(--retro-color-warning-500);
459
459
  }
460
460
 
461
- :host([appearance="solid"][variant="danger"]:not([disabled]):not([disabled="false"])) {
461
+ :host([appearance="solid"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
462
462
  --button-background-color: var(--retro-color-danger-500);
463
463
  --button-foreground-color: var(--retro-color-danger-0);
464
464
  --button-shadow-color: var(--retro-color-danger-500);
465
465
  }
466
466
 
467
- :host([appearance="solid"][variant="success"]:not([disabled]):not([disabled="false"])) {
467
+ :host([appearance="solid"][variant="success"]:not([disabled]:not([disabled="false"]))) {
468
468
  --button-background-color: var(--retro-color-success-500);
469
469
  --button-foreground-color: var(--retro-color-success-0);
470
470
  --button-shadow-color: var(--retro-color-success-500);
471
471
  }
472
472
 
473
- :host([appearance="solid"][variant="neutral"]:not([disabled]):not([disabled="false"])) {
473
+ :host([appearance="solid"][variant="neutral"]:not([disabled]:not([disabled="false"]))) {
474
474
  --button-background-color: var(--retro-color-neutral-500);
475
475
  --button-foreground-color: var(--retro-color-neutral-0);
476
476
  --button-shadow-color: var(--retro-color-neutral-500);
package/Controls/Components/Buttons/Button/Themes/ButtonGroupElement.Joy.js CHANGED
@@ -184,47 +184,47 @@ export function buttonGroupElementJoyStyle() {
184
184
  color: var(--joy-scheme-lowlight);
185
185
  }
186
186
 
187
- :host([appearance="outline"][variant="primary"]:not([disabled]):not([disabled="false"])) {
187
+ :host([appearance="outline"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
188
188
  --button-group-foreground-color: var(--joy-color-primary-500);
189
189
  --button-group-border-color: var(--joy-color-primary-500);
190
190
  }
191
191
 
192
- :host([appearance="outline"][variant="secondary"]:not([disabled]):not([disabled="false"])) {
192
+ :host([appearance="outline"][variant="secondary"]:not([disabled]:not([disabled="false"]))) {
193
193
  --button-group-foreground-color: var(--joy-color-secondary-500);
194
194
  --button-group-border-color: var(--joy-color-secondary-500);
195
195
  }
196
196
 
197
- :host([appearance="outline"][variant="tertiary"]:not([disabled]):not([disabled="false"])) {
197
+ :host([appearance="outline"][variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
198
198
  --button-group-foreground-color: var(--joy-color-tertiary-500);
199
199
  --button-group-border-color: var(--joy-color-tertiary-500);
200
200
  }
201
201
 
202
- :host([appearance="outline"][variant="danger"]:not([disabled]):not([disabled="false"])) {
202
+ :host([appearance="outline"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
203
203
  --button-group-foreground-color: var(--joy-color-danger-500);
204
204
  --button-group-border-color: var(--joy-color-danger-500);
205
205
  }
206
206
 
207
- :host([appearance="outline"][variant="warning"]:not([disabled]):not([disabled="false"])) {
207
+ :host([appearance="outline"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
208
208
  --button-group-foreground-color: var(--joy-color-warning-500);
209
209
  --button-group-border-color: var(--joy-color-warning-500);
210
210
  }
211
211
 
212
- :host([appearance="outline"][variant="success"]:not([disabled]):not([disabled="false"])) {
212
+ :host([appearance="outline"][variant="success"]:not([disabled]:not([disabled="false"]))) {
213
213
  --button-group-foreground-color: var(--joy-color-success-500);
214
214
  --button-group-border-color: var(--joy-color-success-500);
215
215
  }
216
216
 
217
- :host([appearance="outline"][variant="info"]:not([disabled]):not([disabled="false"])) {
217
+ :host([appearance="outline"][variant="info"]:not([disabled]:not([disabled="false"]))) {
218
218
  --button-group-foreground-color: var(--joy-color-info-500);
219
219
  --button-group-border-color: var(--joy-color-info-500);
220
220
  }
221
221
 
222
- :host([appearance="outline"][variant="highlight"]:not([disabled]):not([disabled="false"])) {
222
+ :host([appearance="outline"][variant="highlight"]:not([disabled]:not([disabled="false"]))) {
223
223
  --button-group-foreground-color: var(--joy-color-highlight-500);
224
224
  --button-group-border-color: var(--joy-color-highlight-500);
225
225
  }
226
226
 
227
- :host([appearance="outline"][variant="neutral"]:not([disabled]):not([disabled="false"])) {
227
+ :host([appearance="outline"][variant="neutral"]:not([disabled]:not([disabled="false"]))) {
228
228
  --button-group-foreground-color: var(--joy-color-neutral-500);
229
229
  --button-group-border-color: var(--joy-color-neutral-500);
230
230
  }
@@ -235,83 +235,83 @@ export function buttonGroupElementJoyStyle() {
235
235
  --button-group-background-color: var(--joy-scheme-transparent);
236
236
  }
237
237
 
238
- :host([appearance="plain"][variant="primary"]:not([disabled]):not([disabled="false"])) {
238
+ :host([appearance="plain"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
239
239
  --button-group-foreground-color: var(--joy-color-primary-500);
240
240
  }
241
241
 
242
- :host([appearance="plain"][variant="secondary"]:not([disabled]):not([disabled="false"])) {
242
+ :host([appearance="plain"][variant="secondary"]:not([disabled]:not([disabled="false"]))) {
243
243
  --button-group-foreground-color: var(--joy-color-secondary-500);
244
244
  }
245
245
 
246
- :host([appearance="plain"][variant="tertiary"]:not([disabled]):not([disabled="false"])) {
246
+ :host([appearance="plain"][variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
247
247
  --button-group-foreground-color: var(--joy-color-tertiary-500);
248
248
  }
249
249
 
250
- :host([appearance="plain"][variant="danger"]:not([disabled]):not([disabled="false"])) {
250
+ :host([appearance="plain"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
251
251
  --button-group-foreground-color: var(--joy-color-danger-500);
252
252
  }
253
253
 
254
- :host([appearance="plain"][variant="warning"]:not([disabled]):not([disabled="false"])) {
254
+ :host([appearance="plain"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
255
255
  --button-group-foreground-color: var(--joy-color-warning-500);
256
256
  }
257
257
 
258
- :host([appearance="plain"][variant="success"]:not([disabled]):not([disabled="false"])) {
258
+ :host([appearance="plain"][variant="success"]:not([disabled]:not([disabled="false"]))) {
259
259
  --button-group-foreground-color: var(--joy-color-success-500);
260
260
  }
261
261
 
262
- :host([appearance="plain"][variant="info"]:not([disabled]):not([disabled="false"])) {
262
+ :host([appearance="plain"][variant="info"]:not([disabled]:not([disabled="false"]))) {
263
263
  --button-group-foreground-color: var(--joy-color-info-500);
264
264
  }
265
265
 
266
- :host([appearance="plain"][variant="highlight"]:not([disabled]):not([disabled="false"])) {
266
+ :host([appearance="plain"][variant="highlight"]:not([disabled]:not([disabled="false"]))) {
267
267
  --button-group-foreground-color: var(--joy-color-highlight-500);
268
268
  }
269
269
 
270
- :host([appearance="plain"][variant="neutral"]:not([disabled]):not([disabled="false"])) {
270
+ :host([appearance="plain"][variant="neutral"]:not([disabled]:not([disabled="false"]))) {
271
271
  --button-group-foreground-color: var(--joy-color-neutral-500);
272
272
  }
273
273
 
274
- :host([appearance="soft"][variant="primary"]:not([disabled]):not([disabled="false"])) {
274
+ :host([appearance="soft"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
275
275
  --button-group-background-color: var(--joy-color-primary-100);
276
276
  --button-group-foreground-color: var(--joy-color-primary-500);
277
277
  }
278
278
 
279
- :host([appearance="soft"][variant="secondary"]:not([disabled]):not([disabled="false"])) {
279
+ :host([appearance="soft"][variant="secondary"]:not([disabled]:not([disabled="false"]))) {
280
280
  --button-group-background-color: var(--joy-color-secondary-100);
281
281
  --button-group-foreground-color: var(--joy-color-secondary-500);
282
282
  }
283
283
 
284
- :host([appearance="soft"][variant="tertiary"]:not([disabled]):not([disabled="false"])) {
284
+ :host([appearance="soft"][variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
285
285
  --button-group-background-color: var(--joy-color-tertiary-100);
286
286
  --button-group-foreground-color: var(--joy-color-tertiary-500);
287
287
  }
288
288
 
289
- :host([appearance="soft"][variant="danger"]:not([disabled]):not([disabled="false"])) {
289
+ :host([appearance="soft"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
290
290
  --button-group-background-color: var(--joy-color-danger-100);
291
291
  --button-group-foreground-color: var(--joy-color-danger-500);
292
292
  }
293
293
 
294
- :host([appearance="soft"][variant="warning"]:not([disabled]):not([disabled="false"])) {
294
+ :host([appearance="soft"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
295
295
  --button-group-background-color: var(--joy-color-warning-100);
296
296
  --button-group-foreground-color: var(--joy-color-warning-500);
297
297
  }
298
298
 
299
- :host([appearance="soft"][variant="success"]:not([disabled]):not([disabled="false"])) {
299
+ :host([appearance="soft"][variant="success"]:not([disabled]:not([disabled="false"]))) {
300
300
  --button-group-background-color: var(--joy-color-success-100);
301
301
  --button-group-foreground-color: var(--joy-color-success-500);
302
302
  }
303
303
 
304
- :host([appearance="soft"][variant="info"]:not([disabled]):not([disabled="false"])) {
304
+ :host([appearance="soft"][variant="info"]:not([disabled]:not([disabled="false"]))) {
305
305
  --button-group-background-color: var(--joy-color-info-100);
306
306
  --button-group-foreground-color: var(--joy-color-info-500);
307
307
  }
308
308
 
309
- :host([appearance="soft"][variant="highlight"]:not([disabled]):not([disabled="false"])) {
309
+ :host([appearance="soft"][variant="highlight"]:not([disabled]:not([disabled="false"]))) {
310
310
  --button-group-background-color: var(--joy-color-highlight-100);
311
311
  --button-group-foreground-color: var(--joy-color-highlight-500);
312
312
  }
313
313
 
314
- :host([appearance="soft"][variant="neutral"]:not([disabled]):not([disabled="false"])) {
314
+ :host([appearance="soft"][variant="neutral"]:not([disabled]:not([disabled="false"]))) {
315
315
  --button-group-background-color: var(--joy-color-neutral-100);
316
316
  --button-group-foreground-color: var(--joy-color-neutral-500);
317
317
  }
@@ -322,47 +322,47 @@ export function buttonGroupElementJoyStyle() {
322
322
  --button-group-background-color: var(--joy-scheme-transparent);
323
323
  }
324
324
 
325
- :host([appearance="solid"][variant="primary"]:not([disabled]):not([disabled="false"])) {
325
+ :host([appearance="solid"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
326
326
  --button-group-background-color: var(--joy-color-primary-500);
327
327
  --button-group-foreground-color: var(--joy-color-primary-0);
328
328
  }
329
329
 
330
- :host([appearance="solid"][variant="secondary"]:not([disabled]):not([disabled="false"])) {
330
+ :host([appearance="solid"][variant="secondary"]:not([disabled]:not([disabled="false"]))) {
331
331
  --button-group-background-color: var(--joy-color-secondary-500);
332
332
  --button-group-foreground-color: var(--joy-color-secondary-0);
333
333
  }
334
334
 
335
- :host([appearance="solid"][variant="tertiary"]:not([disabled]):not([disabled="false"])) {
335
+ :host([appearance="solid"][variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
336
336
  --button-group-background-color: var(--joy-color-tertiary-500);
337
337
  --button-group-foreground-color: var(--joy-color-tertiary-0);
338
338
  }
339
339
 
340
- :host([appearance="solid"][variant="danger"]:not([disabled]):not([disabled="false"])) {
340
+ :host([appearance="solid"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
341
341
  --button-group-background-color: var(--joy-color-danger-500);
342
342
  --button-group-foreground-color: var(--joy-color-danger-0);
343
343
  }
344
344
 
345
- :host([appearance="solid"][variant="warning"]:not([disabled]):not([disabled="false"])) {
345
+ :host([appearance="solid"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
346
346
  --button-group-background-color: var(--joy-color-warning-500);
347
347
  --button-group-foreground-color: var(--joy-color-warning-0);
348
348
  }
349
349
 
350
- :host([appearance="solid"][variant="success"]:not([disabled]):not([disabled="false"])) {
350
+ :host([appearance="solid"][variant="success"]:not([disabled]:not([disabled="false"]))) {
351
351
  --button-group-background-color: var(--joy-color-success-500);
352
352
  --button-group-foreground-color: var(--joy-color-success-0);
353
353
  }
354
354
 
355
- :host([appearance="solid"][variant="info"]:not([disabled]):not([disabled="false"])) {
355
+ :host([appearance="solid"][variant="info"]:not([disabled]:not([disabled="false"]))) {
356
356
  --button-group-background-color: var(--joy-color-info-500);
357
357
  --button-group-foreground-color: var(--joy-color-info-0);
358
358
  }
359
359
 
360
- :host([appearance="solid"][variant="highlight"]:not([disabled]):not([disabled="false"])) {
360
+ :host([appearance="solid"][variant="highlight"]:not([disabled]:not([disabled="false"]))) {
361
361
  --button-group-background-color: var(--joy-color-highlight-500);
362
362
  --button-group-foreground-color: var(--joy-color-highlight-0);
363
363
  }
364
364
 
365
- :host([appearance="solid"][variant="neutral"]:not([disabled]):not([disabled="false"])) {
365
+ :host([appearance="solid"][variant="neutral"]:not([disabled]:not([disabled="false"]))) {
366
366
  --button-group-background-color: var(--joy-color-neutral-500);
367
367
  --button-group-foreground-color: var(--joy-color-neutral-0);
368
368
  }