@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
@@ -98,111 +98,111 @@ export function anchorElementJoyStyle() {
98
98
  text-decoration: none;
99
99
  }
100
100
 
101
- :host([variant="primary"]:not([disabled]):not([disabled="false"])) {
101
+ :host([variant="primary"]:not([disabled]:not([disabled="false"]))) {
102
102
  --anchor-foreground-color: var(--joy-color-primary-500);
103
103
  }
104
104
 
105
- :host([variant="primary"]:not([disabled]):not([disabled="false"]):hover) {
105
+ :host([variant="primary"]:not([disabled]:not([disabled="false"])):hover) {
106
106
  --anchor-foreground-color: var(--joy-color-primary-300);
107
107
  }
108
108
 
109
- :host([variant="primary"]:not([disabled]):not([disabled="false"]):active) {
109
+ :host([variant="primary"]:not([disabled]:not([disabled="false"])):active) {
110
110
  --anchor-foreground-color: var(--joy-color-primary-700);
111
111
  }
112
112
 
113
- :host([variant="secondary"]:not([disabled]):not([disabled="false"])) {
113
+ :host([variant="secondary"]:not([disabled]:not([disabled="false"]))) {
114
114
  --anchor-foreground-color: var(--joy-color-secondary-500);
115
115
  }
116
116
 
117
- :host([variant="secondary"]:not([disabled]):not([disabled="false"]):hover) {
117
+ :host([variant="secondary"]:not([disabled]:not([disabled="false"])):hover) {
118
118
  --anchor-foreground-color: var(--joy-color-secondary-300);
119
119
  }
120
120
 
121
- :host([variant="secondary"]:not([disabled]):not([disabled="false"]):active) {
121
+ :host([variant="secondary"]:not([disabled]:not([disabled="false"])):active) {
122
122
  --anchor-foreground-color: var(--joy-color-secondary-700);
123
123
  }
124
124
 
125
- :host([variant="tertiary"]:not([disabled]):not([disabled="false"])) {
125
+ :host([variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
126
126
  --anchor-foreground-color: var(--joy-color-tertiary-500);
127
127
  }
128
128
 
129
- :host([variant="tertiary"]:not([disabled]):not([disabled="false"]):hover) {
129
+ :host([variant="tertiary"]:not([disabled]:not([disabled="false"])):hover) {
130
130
  --anchor-foreground-color: var(--joy-color-tertiary-300);
131
131
  }
132
132
 
133
- :host([variant="tertiary"]:not([disabled]):not([disabled="false"]):active) {
133
+ :host([variant="tertiary"]:not([disabled]:not([disabled="false"])):active) {
134
134
  --anchor-foreground-color: var(--joy-color-tertiary-700);
135
135
  }
136
136
 
137
- :host([variant="danger"]:not([disabled]):not([disabled="false"])) {
137
+ :host([variant="danger"]:not([disabled]:not([disabled="false"]))) {
138
138
  --anchor-foreground-color: var(--joy-color-danger-500);
139
139
  }
140
140
 
141
- :host([variant="danger"]:not([disabled]):not([disabled="false"]):hover) {
141
+ :host([variant="danger"]:not([disabled]:not([disabled="false"])):hover) {
142
142
  --anchor-foreground-color: var(--joy-color-danger-300);
143
143
  }
144
144
 
145
- :host([variant="danger"]:not([disabled]):not([disabled="false"]):active) {
145
+ :host([variant="danger"]:not([disabled]:not([disabled="false"])):active) {
146
146
  --anchor-foreground-color: var(--joy-color-danger-700);
147
147
  }
148
148
 
149
- :host([variant="warning"]:not([disabled]):not([disabled="false"])) {
149
+ :host([variant="warning"]:not([disabled]:not([disabled="false"]))) {
150
150
  --anchor-foreground-color: var(--joy-color-warning-500);
151
151
  }
152
152
 
153
- :host([variant="warning"]:not([disabled]):not([disabled="false"]):hover) {
153
+ :host([variant="warning"]:not([disabled]:not([disabled="false"])):hover) {
154
154
  --anchor-foreground-color: var(--joy-color-warning-300);
155
155
  }
156
156
 
157
- :host([variant="warning"]:not([disabled]):not([disabled="false"]):active) {
157
+ :host([variant="warning"]:not([disabled]:not([disabled="false"])):active) {
158
158
  --anchor-foreground-color: var(--joy-color-warning-700);
159
159
  }
160
160
 
161
- :host([variant="success"]:not([disabled]):not([disabled="false"])) {
161
+ :host([variant="success"]:not([disabled]:not([disabled="false"]))) {
162
162
  --anchor-foreground-color: var(--joy-color-success-500);
163
163
  }
164
164
 
165
- :host([variant="success"]:not([disabled]):not([disabled="false"]):hover) {
165
+ :host([variant="success"]:not([disabled]:not([disabled="false"])):hover) {
166
166
  --anchor-foreground-color: var(--joy-color-success-300);
167
167
  }
168
168
 
169
- :host([variant="success"]:not([disabled]):not([disabled="false"]):active) {
169
+ :host([variant="success"]:not([disabled]:not([disabled="false"])):active) {
170
170
  --anchor-foreground-color: var(--joy-color-success-700);
171
171
  }
172
172
 
173
- :host([variant="info"]:not([disabled]):not([disabled="false"])) {
173
+ :host([variant="info"]:not([disabled]:not([disabled="false"]))) {
174
174
  --anchor-foreground-color: var(--joy-color-info-500);
175
175
  }
176
176
 
177
- :host([variant="info"]:not([disabled]):not([disabled="false"]):hover) {
177
+ :host([variant="info"]:not([disabled]:not([disabled="false"])):hover) {
178
178
  --anchor-foreground-color: var(--joy-color-info-300);
179
179
  }
180
180
 
181
- :host([variant="info"]:not([disabled]):not([disabled="false"]):active) {
181
+ :host([variant="info"]:not([disabled]:not([disabled="false"])):active) {
182
182
  --anchor-foreground-color: var(--joy-color-info-700);
183
183
  }
184
184
 
185
- :host([variant="highlight"]:not([disabled]):not([disabled="false"])) {
185
+ :host([variant="highlight"]:not([disabled]:not([disabled="false"]))) {
186
186
  --anchor-foreground-color: var(--joy-color-highlight-500);
187
187
  }
188
188
 
189
- :host([variant="highlight"]:not([disabled]):not([disabled="false"]):hover) {
189
+ :host([variant="highlight"]:not([disabled]:not([disabled="false"])):hover) {
190
190
  --anchor-foreground-color: var(--joy-color-highlight-300);
191
191
  }
192
192
 
193
- :host([variant="highlight"]:not([disabled]):not([disabled="false"]):active) {
193
+ :host([variant="highlight"]:not([disabled]:not([disabled="false"])):active) {
194
194
  --anchor-foreground-color: var(--joy-color-highlight-700);
195
195
  }
196
196
 
197
- :host([variant="neutral"]:not([disabled]):not([disabled="false"])) {
197
+ :host([variant="neutral"]:not([disabled]:not([disabled="false"]))) {
198
198
  --anchor-foreground-color: var(--joy-color-neutral-500);
199
199
  }
200
200
 
201
- :host([variant="neutral"]:not([disabled]):not([disabled="false"]):hover) {
201
+ :host([variant="neutral"]:not([disabled]:not([disabled="false"])):hover) {
202
202
  --anchor-foreground-color: var(--joy-color-neutral-300);
203
203
  }
204
204
 
205
- :host([variant="neutral"]:not([disabled]):not([disabled="false"]):active) {
205
+ :host([variant="neutral"]:not([disabled]:not([disabled="false"])):active) {
206
206
  --anchor-foreground-color: var(--joy-color-neutral-700);
207
207
  }
208
208
 
@@ -236,12 +236,12 @@ export function buttonElementCosmopolitanStyle() {
236
236
  visibility: hidden;
237
237
  }
238
238
 
239
- :host([variant="primary"]:not([disabled]):not([disabled="false"])) {
239
+ :host([variant="primary"]:not([disabled]:not([disabled="false"]))) {
240
240
  --button-background-color: var(--cosmopolitan-color-primary-500);
241
241
  --button-foreground-color: var(--cosmopolitan-color-primary-0);
242
242
  }
243
243
 
244
- :host([variant="primary"]:not([disabled]):not([disabled="false"]):hover) {
244
+ :host([variant="primary"]:not([disabled]:not([disabled="false"])):hover) {
245
245
  --button-background-color: var(--cosmopolitan-color-primary-500);
246
246
  }
247
247
 
@@ -279,94 +279,94 @@ export function buttonElementJoyStyle() {
279
279
  --focus-ring-outward-offset: 0px;
280
280
  }
281
281
 
282
- :host([appearance="outline"]:not([disabled]):not([disabled="false"])) {
282
+ :host([appearance="outline"]:not([disabled]:not([disabled="false"]))) {
283
283
  --button-background-color: var(--joy-scheme-background);
284
284
  --button-foreground-color: var(--joy-scheme-foreground);
285
285
  --button-border-color: var(--joy-scheme-highlight);
286
286
  }
287
287
 
288
- :host([appearance="outline"]:not([disabled]):not([disabled="false"]):hover) {
288
+ :host([appearance="outline"]:not([disabled]:not([disabled="false"])):hover) {
289
289
  --button-background-color: var(--joy-scheme-highlight);
290
290
  }
291
291
 
292
- :host([appearance="outline"][variant="primary"]:not([disabled]):not([disabled="false"])) {
292
+ :host([appearance="outline"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
293
293
  --button-foreground-color: var(--joy-color-primary-500);
294
294
  --button-border-color: var(--joy-color-primary-500);
295
295
  }
296
296
 
297
- :host([appearance="outline"][variant="primary"]:not([disabled]):not([disabled="false"]):hover) {
297
+ :host([appearance="outline"][variant="primary"]:not([disabled]:not([disabled="false"])):hover) {
298
298
  --button-background-color: var(--joy-color-primary-100);
299
299
  }
300
300
 
301
- :host([appearance="outline"][variant="secondary"]:not([disabled]):not([disabled="false"])) {
301
+ :host([appearance="outline"][variant="secondary"]:not([disabled]:not([disabled="false"]))) {
302
302
  --button-foreground-color: var(--joy-color-secondary-500);
303
303
  --button-border-color: var(--joy-color-secondary-500);
304
304
  }
305
305
 
306
- :host([appearance="outline"][variant="secondary"]:not([disabled]):not([disabled="false"]):hover) {
306
+ :host([appearance="outline"][variant="secondary"]:not([disabled]:not([disabled="false"])):hover) {
307
307
  --button-background-color: var(--joy-color-secondary-100);
308
308
  }
309
309
 
310
- :host([appearance="outline"][variant="tertiary"]:not([disabled]):not([disabled="false"])) {
310
+ :host([appearance="outline"][variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
311
311
  --button-foreground-color: var(--joy-color-tertiary-500);
312
312
  --button-border-color: var(--joy-color-tertiary-500);
313
313
  }
314
314
 
315
- :host([appearance="outline"][variant="tertiary"]:not([disabled]):not([disabled="false"]):hover) {
315
+ :host([appearance="outline"][variant="tertiary"]:not([disabled]:not([disabled="false"])):hover) {
316
316
  --button-background-color: var(--joy-color-tertiary-100);
317
317
  }
318
318
 
319
- :host([appearance="outline"][variant="danger"]:not([disabled]):not([disabled="false"])) {
319
+ :host([appearance="outline"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
320
320
  --button-foreground-color: var(--joy-color-danger-500);
321
321
  --button-border-color: var(--joy-color-danger-500);
322
322
  }
323
323
 
324
- :host([appearance="outline"][variant="danger"]:not([disabled]):not([disabled="false"]):hover) {
324
+ :host([appearance="outline"][variant="danger"]:not([disabled]:not([disabled="false"])):hover) {
325
325
  --button-background-color: var(--joy-color-danger-100);
326
326
  }
327
327
 
328
- :host([appearance="outline"][variant="warning"]:not([disabled]):not([disabled="false"])) {
328
+ :host([appearance="outline"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
329
329
  --button-foreground-color: var(--joy-color-warning-500);
330
330
  --button-border-color: var(--joy-color-warning-500);
331
331
  }
332
332
 
333
- :host([appearance="outline"][variant="warning"]:not([disabled]):not([disabled="false"]):hover) {
333
+ :host([appearance="outline"][variant="warning"]:not([disabled]:not([disabled="false"])):hover) {
334
334
  --button-background-color: var(--joy-color-warning-100);
335
335
  }
336
336
 
337
- :host([appearance="outline"][variant="success"]:not([disabled]):not([disabled="false"])) {
337
+ :host([appearance="outline"][variant="success"]:not([disabled]:not([disabled="false"]))) {
338
338
  --button-foreground-color: var(--joy-color-success-500);
339
339
  --button-border-color: var(--joy-color-success-500);
340
340
  }
341
341
 
342
- :host([appearance="outline"][variant="success"]:not([disabled]):not([disabled="false"]):hover) {
342
+ :host([appearance="outline"][variant="success"]:not([disabled]:not([disabled="false"])):hover) {
343
343
  --button-background-color: var(--joy-color-success-100);
344
344
  }
345
345
 
346
- :host([appearance="outline"][variant="info"]:not([disabled]):not([disabled="false"])) {
346
+ :host([appearance="outline"][variant="info"]:not([disabled]:not([disabled="false"]))) {
347
347
  --button-foreground-color: var(--joy-color-info-500);
348
348
  --button-border-color: var(--joy-color-info-500);
349
349
  }
350
350
 
351
- :host([appearance="outline"][variant="info"]:not([disabled]):not([disabled="false"]):hover) {
351
+ :host([appearance="outline"][variant="info"]:not([disabled]:not([disabled="false"])):hover) {
352
352
  --button-background-color: var(--joy-color-info-100);
353
353
  }
354
354
 
355
- :host([appearance="outline"][variant="highlight"]:not([disabled]):not([disabled="false"])) {
355
+ :host([appearance="outline"][variant="highlight"]:not([disabled]:not([disabled="false"]))) {
356
356
  --button-foreground-color: var(--joy-color-highlight-500);
357
357
  --button-border-color: var(--joy-color-highlight-500);
358
358
  }
359
359
 
360
- :host([appearance="outline"][variant="highlight"]:not([disabled]):not([disabled="false"]):hover) {
360
+ :host([appearance="outline"][variant="highlight"]:not([disabled]:not([disabled="false"])):hover) {
361
361
  --button-background-color: var(--joy-color-highlight-100);
362
362
  }
363
363
 
364
- :host([appearance="outline"][variant="neutral"]:not([disabled]):not([disabled="false"])) {
364
+ :host([appearance="outline"][variant="neutral"]:not([disabled]:not([disabled="false"]))) {
365
365
  --button-foreground-color: var(--joy-color-neutral-500);
366
366
  --button-border-color: var(--joy-color-neutral-500);
367
367
  }
368
368
 
369
- :host([appearance="outline"][variant="neutral"]:not([disabled]):not([disabled="false"]):hover) {
369
+ :host([appearance="outline"][variant="neutral"]:not([disabled]:not([disabled="false"])):hover) {
370
370
  --button-background-color: var(--joy-color-neutral-100);
371
371
  }
372
372
 
@@ -379,91 +379,91 @@ export function buttonElementJoyStyle() {
379
379
  --button-foreground-color: var(--joy-scheme-disabled);
380
380
  }
381
381
 
382
- :host([appearance="plain"]:not([disabled]):not([disabled="false"])) [part="focusRing"] {
382
+ :host([appearance="plain"]:not([disabled]:not([disabled="false"]))) [part="focusRing"] {
383
383
  --focus-ring-outward-offset: 0px;
384
384
  }
385
385
 
386
- :host([appearance="plain"]:not([disabled]):not([disabled="false"]):hover) {
386
+ :host([appearance="plain"]:not([disabled]:not([disabled="false"])):hover) {
387
387
  --button-background-color: var(--joy-scheme-highlight);
388
388
  }
389
389
 
390
- :host([appearance="plain"][variant="primary"]:not([disabled]):not([disabled="false"])) {
390
+ :host([appearance="plain"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
391
391
  --button-foreground-color: var(--joy-color-primary-500);
392
392
  }
393
393
 
394
- :host([appearance="plain"][variant="primary"]:not([disabled]):not([disabled="false"]):hover) {
394
+ :host([appearance="plain"][variant="primary"]:not([disabled]:not([disabled="false"])):hover) {
395
395
  --button-background-color: var(--joy-color-primary-100);
396
396
  --button-foreground-color: var(--joy-color-primary-500);
397
397
  }
398
398
 
399
- :host([appearance="plain"][variant="secondary"]:not([disabled]):not([disabled="false"])) {
399
+ :host([appearance="plain"][variant="secondary"]:not([disabled]:not([disabled="false"]))) {
400
400
  --button-foreground-color: var(--joy-color-secondary-500);
401
401
  }
402
402
 
403
- :host([appearance="plain"][variant="secondary"]:not([disabled]):not([disabled="false"]):hover) {
403
+ :host([appearance="plain"][variant="secondary"]:not([disabled]:not([disabled="false"])):hover) {
404
404
  --button-background-color: var(--joy-color-secondary-100);
405
405
  --button-foreground-color: var(--joy-color-secondary-500);
406
406
  }
407
407
 
408
- :host([appearance="plain"][variant="tertiary"]:not([disabled]):not([disabled="false"])) {
408
+ :host([appearance="plain"][variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
409
409
  --button-foreground-color: var(--joy-color-tertiary-500);
410
410
  }
411
411
 
412
- :host([appearance="plain"][variant="tertiary"]:not([disabled]):not([disabled="false"]):hover) {
412
+ :host([appearance="plain"][variant="tertiary"]:not([disabled]:not([disabled="false"])):hover) {
413
413
  --button-background-color: var(--joy-color-tertiary-100);
414
414
  --button-foreground-color: var(--joy-color-tertiary-500);
415
415
  }
416
416
 
417
- :host([appearance="plain"][variant="danger"]:not([disabled]):not([disabled="false"])) {
417
+ :host([appearance="plain"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
418
418
  --button-foreground-color: var(--joy-color-danger-500);
419
419
  }
420
420
 
421
- :host([appearance="plain"][variant="danger"]:not([disabled]):not([disabled="false"]):hover) {
421
+ :host([appearance="plain"][variant="danger"]:not([disabled]:not([disabled="false"])):hover) {
422
422
  --button-background-color: var(--joy-color-danger-100);
423
423
  --button-foreground-color: var(--joy-color-danger-500);
424
424
  }
425
425
 
426
- :host([appearance="plain"][variant="warning"]:not([disabled]):not([disabled="false"])) {
426
+ :host([appearance="plain"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
427
427
  --button-foreground-color: var(--joy-color-warning-500);
428
428
  }
429
429
 
430
- :host([appearance="plain"][variant="warning"]:not([disabled]):not([disabled="false"]):hover) {
430
+ :host([appearance="plain"][variant="warning"]:not([disabled]:not([disabled="false"])):hover) {
431
431
  --button-background-color: var(--joy-color-warning-100);
432
432
  --button-foreground-color: var(--joy-color-warning-500);
433
433
  }
434
434
 
435
- :host([appearance="plain"][variant="success"]:not([disabled]):not([disabled="false"])) {
435
+ :host([appearance="plain"][variant="success"]:not([disabled]:not([disabled="false"]))) {
436
436
  --button-foreground-color: var(--joy-color-success-500);
437
437
  }
438
438
 
439
- :host([appearance="plain"][variant="success"]:not([disabled]):not([disabled="false"]):hover) {
439
+ :host([appearance="plain"][variant="success"]:not([disabled]:not([disabled="false"])):hover) {
440
440
  --button-background-color: var(--joy-color-success-100);
441
441
  --button-foreground-color: var(--joy-color-success-500);
442
442
  }
443
443
 
444
- :host([appearance="plain"][variant="info"]:not([disabled]):not([disabled="false"])) {
444
+ :host([appearance="plain"][variant="info"]:not([disabled]:not([disabled="false"]))) {
445
445
  --button-foreground-color: var(--joy-color-info-500);
446
446
  }
447
447
 
448
- :host([appearance="plain"][variant="info"]:not([disabled]):not([disabled="false"]):hover) {
448
+ :host([appearance="plain"][variant="info"]:not([disabled]:not([disabled="false"])):hover) {
449
449
  --button-background-color: var(--joy-color-info-100);
450
450
  --button-foreground-color: var(--joy-color-info-500);
451
451
  }
452
452
 
453
- :host([appearance="plain"][variant="highlight"]:not([disabled]):not([disabled="false"])) {
453
+ :host([appearance="plain"][variant="highlight"]:not([disabled]:not([disabled="false"]))) {
454
454
  --button-foreground-color: var(--joy-color-highlight-500);
455
455
  }
456
456
 
457
- :host([appearance="plain"][variant="highlight"]:not([disabled]):not([disabled="false"]):hover) {
457
+ :host([appearance="plain"][variant="highlight"]:not([disabled]:not([disabled="false"])):hover) {
458
458
  --button-background-color: var(--joy-color-highlight-100);
459
459
  --button-foreground-color: var(--joy-color-highlight-500);
460
460
  }
461
461
 
462
- :host([appearance="plain"][variant="neutral"]:not([disabled]):not([disabled="false"])) {
462
+ :host([appearance="plain"][variant="neutral"]:not([disabled]:not([disabled="false"]))) {
463
463
  --button-foreground-color: var(--joy-color-neutral-500);
464
464
  }
465
465
 
466
- :host([appearance="plain"][variant="neutral"]:not([disabled]):not([disabled="false"]):hover) {
466
+ :host([appearance="plain"][variant="neutral"]:not([disabled]:not([disabled="false"])):hover) {
467
467
  --button-background-color: var(--joy-color-neutral-100);
468
468
  --button-foreground-color: var(--joy-color-neutral-500);
469
469
  }
@@ -476,98 +476,98 @@ export function buttonElementJoyStyle() {
476
476
  --focus-ring-outward-offset: 0px;
477
477
  }
478
478
 
479
- :host([appearance="soft"]:not([disabled]):not([disabled="false"])) {
479
+ :host([appearance="soft"]:not([disabled]:not([disabled="false"]))) {
480
480
  --button-background-color: var(--joy-scheme-highlight);
481
481
  --button-foreground-color: var(--joy-scheme-foreground);
482
482
  }
483
483
 
484
- :host([appearance="soft"][variant="primary"]:not([disabled]):not([disabled="false"])) {
484
+ :host([appearance="soft"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
485
485
  --_color: min(var(--button-color-scheme), 1) var(--joy-color-primary-900), max(1 - var(--button-color-scheme), 0) var(--joy-color-primary-100);
486
486
  --button-background-color: var(--joy-color-primary-100);
487
487
  --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
  --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
  --_color: min(var(--button-color-scheme), 1) var(--joy-color-primary-900), max(1 - var(--button-color-scheme), 0) var(--joy-color-primary-100);
496
496
  --button-background-color: var(--joy-color-secondary-100);
497
497
  --button-foreground-color: var(--joy-color-secondary-500);
498
498
  }
499
499
 
500
- :host([appearance="soft"][variant="secondary"]:not([disabled]):not([disabled="false"]):hover) {
500
+ :host([appearance="soft"][variant="secondary"]:not([disabled]:not([disabled="false"])):hover) {
501
501
  --button-background-color: var(--joy-color-secondary-200);
502
502
  }
503
503
 
504
- :host([appearance="soft"][variant="tertiary"]:not([disabled]):not([disabled="false"])) {
504
+ :host([appearance="soft"][variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
505
505
  --_color: min(var(--button-color-scheme), 1) var(--joy-color-primary-900), max(1 - var(--button-color-scheme), 0) var(--joy-color-primary-100);
506
506
  --button-background-color: var(--joy-color-tertiary-100);
507
507
  --button-foreground-color: var(--joy-color-tertiary-500);
508
508
  }
509
509
 
510
- :host([appearance="soft"][variant="tertiary"]:not([disabled]):not([disabled="false"]):hover) {
510
+ :host([appearance="soft"][variant="tertiary"]:not([disabled]:not([disabled="false"])):hover) {
511
511
  --button-background-color: var(--joy-color-tertiary-200);
512
512
  }
513
513
 
514
- :host([appearance="soft"][variant="danger"]:not([disabled]):not([disabled="false"])) {
514
+ :host([appearance="soft"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
515
515
  --_color: min(var(--button-color-scheme), 1) var(--joy-color-primary-900), max(1 - var(--button-color-scheme), 0) var(--joy-color-primary-100);
516
516
  --button-background-color: var(--joy-color-danger-100);
517
517
  --button-foreground-color: var(--joy-color-danger-500);
518
518
  }
519
519
 
520
- :host([appearance="soft"][variant="danger"]:not([disabled]):not([disabled="false"]):hover) {
520
+ :host([appearance="soft"][variant="danger"]:not([disabled]:not([disabled="false"])):hover) {
521
521
  --button-background-color: var(--joy-color-danger-200);
522
522
  }
523
523
 
524
- :host([appearance="soft"][variant="warning"]:not([disabled]):not([disabled="false"])) {
524
+ :host([appearance="soft"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
525
525
  --_color: min(var(--button-color-scheme), 1) var(--joy-color-primary-900), max(1 - var(--button-color-scheme), 0) var(--joy-color-primary-100);
526
526
  --button-background-color: var(--joy-color-warning-100);
527
527
  --button-foreground-color: var(--joy-color-warning-500);
528
528
  }
529
529
 
530
- :host([appearance="soft"][variant="warning"]:not([disabled]):not([disabled="false"]):hover) {
530
+ :host([appearance="soft"][variant="warning"]:not([disabled]:not([disabled="false"])):hover) {
531
531
  --button-background-color: var(--joy-color-warning-200);
532
532
  }
533
533
 
534
- :host([appearance="soft"][variant="success"]:not([disabled]):not([disabled="false"])) {
534
+ :host([appearance="soft"][variant="success"]:not([disabled]:not([disabled="false"]))) {
535
535
  --_color: min(var(--button-color-scheme), 1) var(--joy-color-primary-900), max(1 - var(--button-color-scheme), 0) var(--joy-color-primary-100);
536
536
  --button-background-color: var(--joy-color-success-100);
537
537
  --button-foreground-color: var(--joy-color-success-500);
538
538
  }
539
539
 
540
- :host([appearance="soft"][variant="success"]:not([disabled]):not([disabled="false"]):hover) {
540
+ :host([appearance="soft"][variant="success"]:not([disabled]:not([disabled="false"])):hover) {
541
541
  --button-background-color: var(--joy-color-success-200);
542
542
  }
543
543
 
544
- :host([appearance="soft"][variant="info"]:not([disabled]):not([disabled="false"])) {
544
+ :host([appearance="soft"][variant="info"]:not([disabled]:not([disabled="false"]))) {
545
545
  --_color: min(var(--button-color-scheme), 1) var(--joy-color-primary-900), max(1 - var(--button-color-scheme), 0) var(--joy-color-primary-100);
546
546
  --button-background-color: var(--joy-color-info-100);
547
547
  --button-foreground-color: var(--joy-color-info-500);
548
548
  }
549
549
 
550
- :host([appearance="soft"][variant="info"]:not([disabled]):not([disabled="false"]):hover) {
550
+ :host([appearance="soft"][variant="info"]:not([disabled]:not([disabled="false"])):hover) {
551
551
  --button-background-color: var(--joy-color-info-200);
552
552
  }
553
553
 
554
- :host([appearance="soft"][variant="highlight"]:not([disabled]):not([disabled="false"])) {
554
+ :host([appearance="soft"][variant="highlight"]:not([disabled]:not([disabled="false"]))) {
555
555
  --_color: min(var(--button-color-scheme), 1) var(--joy-color-primary-900), max(1 - var(--button-color-scheme), 0) var(--joy-color-primary-100);
556
556
  --button-background-color: var(--joy-color-highlight-100);
557
557
  --button-foreground-color: var(--joy-color-highlight-500);
558
558
  }
559
559
 
560
- :host([appearance="soft"][variant="highlight"]:not([disabled]):not([disabled="false"]):hover) {
560
+ :host([appearance="soft"][variant="highlight"]:not([disabled]:not([disabled="false"])):hover) {
561
561
  --button-background-color: var(--joy-color-highlight-200);
562
562
  }
563
563
 
564
- :host([appearance="soft"][variant="neutral"]:not([disabled]):not([disabled="false"])) {
564
+ :host([appearance="soft"][variant="neutral"]:not([disabled]:not([disabled="false"]))) {
565
565
  --_color: min(var(--button-color-scheme), 1) var(--joy-color-primary-900), max(1 - var(--button-color-scheme), 0) var(--joy-color-primary-100);
566
566
  --button-background-color: var(--joy-color-neutral-100);
567
567
  --button-foreground-color: var(--joy-color-neutral-500);
568
568
  }
569
569
 
570
- :host([appearance="soft"][variant="neutral"]:not([disabled]):not([disabled="false"]):hover) {
570
+ :host([appearance="soft"][variant="neutral"]:not([disabled]:not([disabled="false"])):hover) {
571
571
  --button-background-color: var(--joy-color-neutral-200);
572
572
  }
573
573
 
@@ -579,89 +579,89 @@ export function buttonElementJoyStyle() {
579
579
  --focus-ring-outward-offset: 0px;
580
580
  }
581
581
 
582
- :host([appearance="solid"]:not([disabled]):not([disabled="false"])) {
582
+ :host([appearance="solid"]:not([disabled]:not([disabled="false"]))) {
583
583
  --button-background-color: var(--joy-scheme-background);
584
584
  --button-foreground-color: var(--joy-scheme-foreground);
585
585
  }
586
586
 
587
- :host([appearance="solid"][variant="primary"]:not([disabled]):not([disabled="false"])) {
587
+ :host([appearance="solid"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
588
588
  --button-background-color: var(--joy-color-primary-500);
589
589
  --button-foreground-color: var(--joy-color-primary-0);
590
590
  }
591
591
 
592
- :host([appearance="solid"][variant="primary"]:not([disabled]):not([disabled="false"]):hover) {
592
+ :host([appearance="solid"][variant="primary"]:not([disabled]:not([disabled="false"])):hover) {
593
593
  --button-background-color: var(--joy-color-primary-600);
594
594
  }
595
595
 
596
- :host([appearance="solid"][variant="secondary"]:not([disabled]):not([disabled="false"])) {
596
+ :host([appearance="solid"][variant="secondary"]:not([disabled]:not([disabled="false"]))) {
597
597
  --button-background-color: var(--joy-color-secondary-500);
598
598
  --button-foreground-color: var(--joy-color-secondary-0);
599
599
  }
600
600
 
601
- :host([appearance="solid"][variant="secondary"]:not([disabled]):not([disabled="false"]):hover) {
601
+ :host([appearance="solid"][variant="secondary"]:not([disabled]:not([disabled="false"])):hover) {
602
602
  --button-background-color: var(--joy-color-secondary-600);
603
603
  }
604
604
 
605
- :host([appearance="solid"][variant="tertiary"]:not([disabled]):not([disabled="false"])) {
605
+ :host([appearance="solid"][variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
606
606
  --button-background-color: var(--joy-color-tertiary-500);
607
607
  --button-foreground-color: var(--joy-color-tertiary-0);
608
608
  }
609
609
 
610
- :host([appearance="solid"][variant="tertiary"]:not([disabled]):not([disabled="false"]):hover) {
610
+ :host([appearance="solid"][variant="tertiary"]:not([disabled]:not([disabled="false"])):hover) {
611
611
  --button-background-color: var(--joy-color-tertiary-600);
612
612
  }
613
613
 
614
- :host([appearance="solid"][variant="danger"]:not([disabled]):not([disabled="false"])) {
614
+ :host([appearance="solid"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
615
615
  --button-background-color: var(--joy-color-danger-500);
616
616
  --button-foreground-color: var(--joy-color-danger-0);
617
617
  }
618
618
 
619
- :host([appearance="solid"][variant="danger"]:not([disabled]):not([disabled="false"]):hover) {
619
+ :host([appearance="solid"][variant="danger"]:not([disabled]:not([disabled="false"])):hover) {
620
620
  --button-background-color: var(--joy-color-danger-600);
621
621
  }
622
622
 
623
- :host([appearance="solid"][variant="warning"]:not([disabled]):not([disabled="false"])) {
623
+ :host([appearance="solid"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
624
624
  --button-background-color: var(--joy-color-warning-500);
625
625
  --button-foreground-color: var(--joy-color-warning-0);
626
626
  }
627
627
 
628
- :host([appearance="solid"][variant="warning"]:not([disabled]):not([disabled="false"]):hover) {
628
+ :host([appearance="solid"][variant="warning"]:not([disabled]:not([disabled="false"])):hover) {
629
629
  --button-background-color: var(--joy-color-warning-600);
630
630
  }
631
631
 
632
- :host([appearance="solid"][variant="success"]:not([disabled]):not([disabled="false"])) {
632
+ :host([appearance="solid"][variant="success"]:not([disabled]:not([disabled="false"]))) {
633
633
  --button-background-color: var(--joy-color-success-500);
634
634
  --button-foreground-color: var(--joy-color-success-0);
635
635
  }
636
636
 
637
- :host([appearance="solid"][variant="success"]:not([disabled]):not([disabled="false"]):hover) {
637
+ :host([appearance="solid"][variant="success"]:not([disabled]:not([disabled="false"])):hover) {
638
638
  --button-background-color: var(--joy-color-success-600);
639
639
  }
640
640
 
641
- :host([appearance="solid"][variant="info"]:not([disabled]):not([disabled="false"])) {
641
+ :host([appearance="solid"][variant="info"]:not([disabled]:not([disabled="false"]))) {
642
642
  --button-background-color: var(--joy-color-info-500);
643
643
  --button-foreground-color: var(--joy-color-info-0);
644
644
  }
645
645
 
646
- :host([appearance="solid"][variant="info"]:not([disabled]):not([disabled="false"]):hover) {
646
+ :host([appearance="solid"][variant="info"]:not([disabled]:not([disabled="false"])):hover) {
647
647
  --button-background-color: var(--joy-color-info-600);
648
648
  }
649
649
 
650
- :host([appearance="solid"][variant="highlight"]:not([disabled]):not([disabled="false"])) {
650
+ :host([appearance="solid"][variant="highlight"]:not([disabled]:not([disabled="false"]))) {
651
651
  --button-background-color: var(--joy-color-highlight-500);
652
652
  --button-foreground-color: var(--joy-color-highlight-0);
653
653
  }
654
654
 
655
- :host([appearance="solid"][variant="highlight"]:not([disabled]):not([disabled="false"]):hover) {
655
+ :host([appearance="solid"][variant="highlight"]:not([disabled]:not([disabled="false"])):hover) {
656
656
  --button-background-color: var(--joy-color-highlight-600);
657
657
  }
658
658
 
659
- :host([appearance="solid"][variant="neutral"]:not([disabled]):not([disabled="false"])) {
659
+ :host([appearance="solid"][variant="neutral"]:not([disabled]:not([disabled="false"]))) {
660
660
  --button-background-color: var(--joy-color-neutral-500);
661
661
  --button-foreground-color: var(--joy-color-neutral-0);
662
662
  }
663
663
 
664
- :host([appearance="solid"][variant="neutral"]:not([disabled]):not([disabled="false"]):hover) {
664
+ :host([appearance="solid"][variant="neutral"]:not([disabled]:not([disabled="false"])):hover) {
665
665
  --button-background-color: var(--joy-color-neutral-600);
666
666
  }
667
667