@breadstone/mosaik-elements-foundation 0.0.221 → 0.0.222

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 (111) hide show
  1. package/Controls/Behaviors/Themeable.js +2 -2
  2. package/Controls/Behaviors/Themeable.js.map +1 -1
  3. package/Controls/Components/Buttons/Button/Themes/ButtonElement.Cosmopolitan.js +26 -26
  4. package/Controls/Components/Buttons/Button/Themes/ButtonElement.Joy.js +27 -27
  5. package/Controls/Components/Buttons/Button/Themes/ButtonElement.Memphis.js +26 -26
  6. package/Controls/Components/Buttons/CompoundButton/Themes/CompoundButtonElement.Cosmopolitan.js +8 -8
  7. package/Controls/Components/Buttons/CompoundButton/Themes/CompoundButtonElement.Joy.js +10 -10
  8. package/Controls/Components/Buttons/CompoundButton/Themes/CompoundButtonElement.Memphis.js +9 -9
  9. package/Controls/Components/Buttons/DropDownButton/Themes/DropDownButtonElement.Cosmopolitan.js +9 -9
  10. package/Controls/Components/Buttons/DropDownButton/Themes/DropDownButtonElement.Joy.js +10 -10
  11. package/Controls/Components/Buttons/DropDownButton/Themes/DropDownButtonElement.Memphis.js +8 -8
  12. package/Controls/Components/Buttons/FloatingActionButton/Themes/FloatingActionButtonElement.Cosmopolitan.js +8 -8
  13. package/Controls/Components/Buttons/FloatingActionButton/Themes/FloatingActionButtonElement.Joy.js +9 -9
  14. package/Controls/Components/Buttons/FloatingActionButton/Themes/FloatingActionButtonElement.Memphis.js +32 -32
  15. package/Controls/Components/Buttons/RepeatButton/Themes/RepeatButtonElement.Cosmopolitan.js +8 -8
  16. package/Controls/Components/Buttons/RepeatButton/Themes/RepeatButtonElement.Joy.js +10 -10
  17. package/Controls/Components/Buttons/RepeatButton/Themes/RepeatButtonElement.Memphis.js +9 -9
  18. package/Controls/Components/Buttons/SplitButton/Themes/SplitButtonElement.Cosmopolitan.js +8 -8
  19. package/Controls/Components/Buttons/SplitButton/Themes/SplitButtonElement.Joy.js +12 -12
  20. package/Controls/Components/Buttons/SplitButton/Themes/SplitButtonElement.Memphis.js +9 -9
  21. package/Controls/Components/Buttons/ToggleButton/Themes/ToggleButtonElement.Cosmopolitan.js +9 -9
  22. package/Controls/Components/Buttons/ToggleButton/Themes/ToggleButtonElement.Joy.js +10 -10
  23. package/Controls/Components/Buttons/ToggleButton/Themes/ToggleButtonElement.Memphis.js +9 -9
  24. package/Controls/Components/Grouping/BannerGroup/Themes/BannerGroupElement.Cosmopolitan.js +1 -1
  25. package/Controls/Components/Grouping/BannerGroup/Themes/BannerGroupElement.Joy.js +1 -1
  26. package/Controls/Components/Grouping/BannerGroup/Themes/BannerGroupElement.Memphis.js +1 -1
  27. package/Controls/Components/Grouping/Expander/ExpanderGroupElement.d.ts +0 -3
  28. package/Controls/Components/Grouping/Expander/ExpanderGroupElement.d.ts.map +1 -1
  29. package/Controls/Components/Grouping/Expander/Themes/ExpanderElement.Cosmopolitan.d.ts.map +1 -1
  30. package/Controls/Components/Grouping/Expander/Themes/ExpanderElement.Cosmopolitan.js +0 -4
  31. package/Controls/Components/Grouping/Expander/Themes/ExpanderElement.Cosmopolitan.js.map +1 -1
  32. package/Controls/Components/Grouping/Expander/Themes/ExpanderElement.Joy.d.ts.map +1 -1
  33. package/Controls/Components/Grouping/Expander/Themes/ExpanderElement.Joy.js +0 -4
  34. package/Controls/Components/Grouping/Expander/Themes/ExpanderElement.Joy.js.map +1 -1
  35. package/Controls/Components/Grouping/Expander/Themes/ExpanderElement.Memphis.d.ts.map +1 -1
  36. package/Controls/Components/Grouping/Expander/Themes/ExpanderElement.Memphis.js +0 -4
  37. package/Controls/Components/Grouping/Expander/Themes/ExpanderElement.Memphis.js.map +1 -1
  38. package/Controls/Components/Inputs/Calendar/Themes/CalendarSubHeaderElement.Cosmopolitan.js +1 -1
  39. package/Controls/Components/Inputs/Calendar/Themes/CalendarSubHeaderElement.Joy.js +1 -1
  40. package/Controls/Components/Inputs/Calendar/Themes/CalendarSubHeaderElement.Memphis.js +1 -1
  41. package/Controls/Components/Inputs/CheckBox/Themes/CheckBoxElement.Joy.js +1 -1
  42. package/Controls/Components/Inputs/Choice/Themes/ChoiceElement.Joy.js +1 -1
  43. package/Controls/Components/Inputs/Radio/Themes/RadioElement.Joy.js +1 -1
  44. package/Controls/Components/Inputs/Radio/Themes/RadioElement.Memphis.js +1 -1
  45. package/Controls/Components/Inputs/ToggleSwitch/Themes/ToggleSwitchElement.Joy.js +1 -1
  46. package/Controls/Components/Layouts/TileManager/Themes/TileManagerTileElement.Cosmopolitan.js +2 -2
  47. package/Controls/Components/Layouts/TileManager/Themes/TileManagerTileElement.Joy.js +2 -2
  48. package/Controls/Components/Layouts/TileManager/Themes/TileManagerTileElement.Memphis.js +2 -2
  49. package/Controls/Components/Media/Avatar/Themes/AvatarElement.Joy.js +3 -3
  50. package/Controls/Components/Media/Avatar/Themes/AvatarElement.Memphis.js +1 -1
  51. package/Controls/Components/Media/Badge/Themes/BadgeElement.Joy.js +4 -4
  52. package/Controls/Components/Media/Chat/Themes/ChatMessageAvatarElement.Joy.js +1 -1
  53. package/Controls/Components/Media/Chat/Themes/ChatMessageAvatarElement.Memphis.js +1 -1
  54. package/Controls/Components/Media/Chip/Themes/ChipElement.Joy.js +4 -4
  55. package/Controls/Components/Media/ColorSwatch/Themes/ColorSwatchElement.Cosmopolitan.js +4 -4
  56. package/Controls/Components/Media/ColorSwatch/Themes/ColorSwatchElement.Joy.js +4 -4
  57. package/Controls/Components/Media/ColorSwatch/Themes/ColorSwatchElement.Memphis.js +4 -4
  58. package/Controls/Components/Media/Persona/Themes/PersonaElement.Joy.js +1 -1
  59. package/Controls/Components/Overlays/Toast/Themes/ToastElement.Memphis.js +1 -1
  60. package/Controls/Components/Primitives/Floating/Themes/FloatingElement.Joy.js +1 -1
  61. package/Controls/Components/Primitives/Floating/Themes/FloatingElement.Memphis.js +1 -1
  62. package/Controls/Components/Primitives/Popup/Themes/PopupElement.Memphis.js +1 -1
  63. package/Controls/Components/Primitives/TickBar/Themes/TickBarElement.Cosmopolitan.js +5 -5
  64. package/Controls/Components/Primitives/TickBar/Themes/TickBarElement.Joy.js +5 -5
  65. package/Controls/Components/Primitives/TickBar/Themes/TickBarElement.Memphis.js +5 -5
  66. package/Controls/Components/Ranges/MeterRing/Themes/MeterRingElement.Cosmopolitan.js +2 -2
  67. package/Controls/Components/Ranges/MeterRing/Themes/MeterRingElement.Joy.js +2 -2
  68. package/Controls/Components/Ranges/MeterRing/Themes/MeterRingElement.Memphis.js +2 -2
  69. package/Controls/Components/Ranges/ProgressBar/Themes/ProgressBarElement.Joy.d.ts.map +1 -1
  70. package/Controls/Components/Ranges/ProgressBar/Themes/ProgressBarElement.Joy.js +7 -4
  71. package/Controls/Components/Ranges/ProgressBar/Themes/ProgressBarElement.Joy.js.map +1 -1
  72. package/Controls/Components/Ranges/ProgressRing/Themes/ProgressRingElement.Cosmopolitan.js +3 -3
  73. package/Controls/Components/Ranges/ProgressRing/Themes/ProgressRingElement.Joy.js +3 -3
  74. package/Controls/Components/Ranges/ProgressRing/Themes/ProgressRingElement.Memphis.js +3 -3
  75. package/Controls/Components/Ranges/ScrubSlider/Themes/ScrubSliderElement.Cosmopolitan.js +2 -2
  76. package/Controls/Components/Ranges/ScrubSlider/Themes/ScrubSliderElement.Joy.js +2 -2
  77. package/Controls/Components/Ranges/ScrubSlider/Themes/ScrubSliderElement.Memphis.js +2 -2
  78. package/Controls/Components/Selectors/ElectronicProgramGuide/Themes/EpgProgramElement.Joy.js +1 -1
  79. package/Controls/Components/Selectors/ElectronicProgramGuide/Themes/EpgProgramElement.Memphis.js +1 -1
  80. package/Controls/Components/Selectors/Menu/Themes/MenuItemElement.Cosmopolitan.js +1 -1
  81. package/Controls/Components/Selectors/Menu/Themes/MenuItemElement.Joy.js +1 -1
  82. package/Controls/Components/Selectors/Menu/Themes/MenuItemElement.Memphis.js +1 -1
  83. package/Controls/Components/Selectors/Segment/Themes/SegmentElement.Joy.js +1 -1
  84. package/Controls/Components/Selectors/Segment/Themes/SegmentElement.Memphis.js +1 -1
  85. package/Controls/Components/Selectors/Tab/Themes/TabElement.Cosmopolitan.js +1 -1
  86. package/Controls/Components/Selectors/Tab/Themes/TabElement.Joy.js +1 -1
  87. package/Controls/Components/Selectors/Tab/Themes/TabElement.Memphis.js +1 -1
  88. package/Controls/Components/Selectors/TabStrip/Themes/TabStripItemElement.Joy.js +1 -1
  89. package/Index.d.ts +1 -1
  90. package/Index.d.ts.map +1 -1
  91. package/Reactivity/Rx/Directives/AsyncDirective.d.ts +1 -1
  92. package/Routing/PathToRegexp.d.ts +1 -1
  93. package/Theming/IThemeElementProps.d.ts +16 -1
  94. package/Theming/IThemeElementProps.d.ts.map +1 -1
  95. package/Theming/IThemeService.d.ts +57 -154
  96. package/Theming/IThemeService.d.ts.map +1 -1
  97. package/Theming/IThemeService.js +3 -1
  98. package/Theming/IThemeService.js.map +1 -1
  99. package/Theming/Theme2Element.d.ts +76 -9
  100. package/Theming/Theme2Element.d.ts.map +1 -1
  101. package/Theming/Theme2Element.js +105 -54
  102. package/Theming/Theme2Element.js.map +1 -1
  103. package/Theming/Theme2ElementTemplate.d.ts +1 -1
  104. package/Theming/Theme2ElementTemplate.d.ts.map +1 -1
  105. package/Theming/Theme2ElementTemplate.js +1 -1
  106. package/Theming/Theme2ElementTemplate.js.map +1 -1
  107. package/Theming/ThemeService.d.ts +118 -67
  108. package/Theming/ThemeService.d.ts.map +1 -1
  109. package/Theming/ThemeService.js +453 -195
  110. package/Theming/ThemeService.js.map +1 -1
  111. package/package.json +3 -3
package/Controls/Behaviors/Themeable.js CHANGED
@@ -82,8 +82,8 @@ export const Themeable = (base) => {
82
82
  // if (!this._theme) {
83
83
  // this.theme = this.getGlobalTheme();
84
84
  // }
85
- this._themeChangedSubscription = ThemeService.instance.themeChanged.subscribe(() => {
86
- this.themeName = ThemeService.instance.getTheme().name;
85
+ this._themeChangedSubscription = ThemeService.instance.themeChanged.subscribe((x) => {
86
+ this.themeName = x?.name ?? '';
87
87
  });
88
88
  ThemeObserverServiceLocator.current.themeChanged.subscribe(() => {
89
89
  this.forceStyleUpdate();
package/Controls/Behaviors/Themeable.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Themeable.js","sourceRoot":"","sources":["../../../src/Controls/Behaviors/Themeable.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Themeable.js","sourceRoot":"","sources":["../../../src/Controls/Behaviors/Themeable.ts"],"names":[],"mappings":"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"}
package/Controls/Components/Buttons/Button/Themes/ButtonElement.Cosmopolitan.js CHANGED
@@ -141,7 +141,7 @@ export function buttonElementCosmopolitanStyle() {
141
141
 
142
142
  :host [part="button"]:before {
143
143
  border-radius: var(--button-border-radius);
144
- border-radius: calc(var(--button-border-radius) - var(--button-border-width));
144
+ border-radius: calc(var(--button-border-radius) - var(--button-border-width));
145
145
  content: "";
146
146
  opacity: 0;
147
147
  pointer-events: none;
@@ -221,7 +221,7 @@ export function buttonElementCosmopolitanStyle() {
221
221
  }
222
222
 
223
223
  :host [part="progressRing"] {
224
- --progress-ring-thickness: base. component-property($ props, progress-thickness);
224
+ --progress-ring-thickness: var(--button-progress-thickness);
225
225
  margin: -12px 0 0 -12px;
226
226
  position: absolute;
227
227
  top: 50%;
@@ -277,21 +277,21 @@ export function buttonElementCosmopolitanStyle() {
277
277
  }
278
278
 
279
279
  :host([size="tiny"]) {
280
- --button-font-size: calc(var(--memphis-typography-button-font-size) - 4px);
281
- --button-font-line-height: calc(var(--memphis-typography-button-line-height) - 4px);
282
- --button-padding-top: calc(var(--memphis-layout-space) - 4px);
283
- --button-padding-right: calc(var(--memphis-layout-space) - 4px);
284
- --button-padding-bottom: calc(var(--memphis-layout-space) - 4px);
285
- --button-padding-left: calc(var(--memphis-layout-space) - 4px);
280
+ --button-font-size: calc(var(--memphis-typography-button-font-size) - 4px);
281
+ --button-font-line-height: calc(var(--memphis-typography-button-line-height) - 4px);
282
+ --button-padding-top: calc(var(--memphis-layout-space) - 4px);
283
+ --button-padding-right: calc(var(--memphis-layout-space) - 4px);
284
+ --button-padding-bottom: calc(var(--memphis-layout-space) - 4px);
285
+ --button-padding-left: calc(var(--memphis-layout-space) - 4px);
286
286
  }
287
287
 
288
288
  :host([size="small"]) {
289
- --button-font-size: calc(var(--memphis-typography-button-font-size) - 2px);
290
- --button-font-line-height: calc(var(--memphis-typography-button-line-height) - 2px);
291
- --button-padding-top: calc(var(--memphis-layout-space) - 2px);
292
- --button-padding-right: calc(var(--memphis-layout-space) - 2px);
293
- --button-padding-bottom: calc(var(--memphis-layout-space) - 2px);
294
- --button-padding-left: calc(var(--memphis-layout-space) - 2px);
289
+ --button-font-size: calc(var(--memphis-typography-button-font-size) - 2px);
290
+ --button-font-line-height: calc(var(--memphis-typography-button-line-height) - 2px);
291
+ --button-padding-top: calc(var(--memphis-layout-space) - 2px);
292
+ --button-padding-right: calc(var(--memphis-layout-space) - 2px);
293
+ --button-padding-bottom: calc(var(--memphis-layout-space) - 2px);
294
+ --button-padding-left: calc(var(--memphis-layout-space) - 2px);
295
295
  }
296
296
 
297
297
  :host([size="medium"]) {
@@ -300,21 +300,21 @@ export function buttonElementCosmopolitanStyle() {
300
300
  }
301
301
 
302
302
  :host([size="large"]) {
303
- --button-font-size: calc(var(--memphis-typography-button-font-size) + 2px);
304
- --button-font-line-height: calc(var(--memphis-typography-button-line-height) + 2px);
305
- --button-padding-top: calc(var(--memphis-layout-space) + 4px);
306
- --button-padding-right: calc(var(--memphis-layout-space) + 4px);
307
- --button-padding-bottom: calc(var(--memphis-layout-space) + 4px);
308
- --button-padding-left: calc(var(--memphis-layout-space) + 4px);
303
+ --button-font-size: calc(var(--memphis-typography-button-font-size) + 2px);
304
+ --button-font-line-height: calc(var(--memphis-typography-button-line-height) + 2px);
305
+ --button-padding-top: calc(var(--memphis-layout-space) + 4px);
306
+ --button-padding-right: calc(var(--memphis-layout-space) + 4px);
307
+ --button-padding-bottom: calc(var(--memphis-layout-space) + 4px);
308
+ --button-padding-left: calc(var(--memphis-layout-space) + 4px);
309
309
  }
310
310
 
311
311
  :host([size="giant"]) {
312
- --button-font-size: calc(var(--memphis-typography-button-font-size) + 4px);
313
- --button-font-line-height: calc(var(--memphis-typography-button-line-height) + 4px);
314
- --button-padding-top: calc(var(--memphis-layout-space) + 8px);
315
- --button-padding-right: calc(var(--memphis-layout-space) + 8px);
316
- --button-padding-bottom: calc(var(--memphis-layout-space) + 8px);
317
- --button-padding-left: calc(var(--memphis-layout-space) + 8px);
312
+ --button-font-size: calc(var(--memphis-typography-button-font-size) + 4px);
313
+ --button-font-line-height: calc(var(--memphis-typography-button-line-height) + 4px);
314
+ --button-padding-top: calc(var(--memphis-layout-space) + 8px);
315
+ --button-padding-right: calc(var(--memphis-layout-space) + 8px);
316
+ --button-padding-bottom: calc(var(--memphis-layout-space) + 8px);
317
+ --button-padding-left: calc(var(--memphis-layout-space) + 8px);
318
318
  }
319
319
 
320
320
  `;
package/Controls/Components/Buttons/Button/Themes/ButtonElement.Joy.js CHANGED
@@ -141,7 +141,7 @@ export function buttonElementJoyStyle() {
141
141
 
142
142
  :host [part="button"]:before {
143
143
  border-radius: var(--button-border-radius);
144
- border-radius: calc(var(--button-border-radius) - var(--button-border-width));
144
+ border-radius: calc(var(--button-border-radius) - var(--button-border-width));
145
145
  content: "";
146
146
  opacity: 0;
147
147
  pointer-events: none;
@@ -221,7 +221,7 @@ export function buttonElementJoyStyle() {
221
221
  }
222
222
 
223
223
  :host [part="progressRing"] {
224
- --progress-ring-thickness: base. component-property($ props, progress-thickness);
224
+ --progress-ring-thickness: var(--button-progress-thickness);
225
225
  margin: -12px 0 0 -12px;
226
226
  position: absolute;
227
227
  top: 50%;
@@ -268,7 +268,7 @@ export function buttonElementJoyStyle() {
268
268
  }
269
269
 
270
270
  :host [part="focusRing"] {
271
- border-radius: min(var(--button-border-radius), var(--button-border-radius) + var(--joy-layout-thickness));
271
+ border-radius: min(var(--button-border-radius), var(--button-border-radius) + var(--joy-layout-thickness));
272
272
  --focus-ring-outward-offset: 0px;
273
273
  }
274
274
 
@@ -697,21 +697,21 @@ export function buttonElementJoyStyle() {
697
697
  }
698
698
 
699
699
  :host([size="tiny"]) {
700
- --button-font-size: calc(var(--joy-typography-button-font-size) - 4px);
701
- --button-font-line-height: calc(var(--joy-typography-button-line-height) - 4px);
702
- --button-padding-top: calc(var(--joy-layout-space) - 4px);
703
- --button-padding-right: calc(var(--joy-layout-space) - 4px);
704
- --button-padding-bottom: calc(var(--joy-layout-space) - 4px);
705
- --button-padding-left: calc(var(--joy-layout-space) - 4px);
700
+ --button-font-size: calc(var(--joy-typography-button-font-size) - 4px);
701
+ --button-font-line-height: calc(var(--joy-typography-button-line-height) - 4px);
702
+ --button-padding-top: calc(var(--joy-layout-space) - 4px);
703
+ --button-padding-right: calc(var(--joy-layout-space) - 4px);
704
+ --button-padding-bottom: calc(var(--joy-layout-space) - 4px);
705
+ --button-padding-left: calc(var(--joy-layout-space) - 4px);
706
706
  }
707
707
 
708
708
  :host([size="small"]) {
709
- --button-font-size: calc(var(--joy-typography-button-font-size) - 2px);
710
- --button-font-line-height: calc(var(--joy-typography-button-line-height) - 2px);
711
- --button-padding-top: calc(var(--joy-layout-space) - 2px);
712
- --button-padding-right: calc(var(--joy-layout-space) - 2px);
713
- --button-padding-bottom: calc(var(--joy-layout-space) - 2px);
714
- --button-padding-left: calc(var(--joy-layout-space) - 2px);
709
+ --button-font-size: calc(var(--joy-typography-button-font-size) - 2px);
710
+ --button-font-line-height: calc(var(--joy-typography-button-line-height) - 2px);
711
+ --button-padding-top: calc(var(--joy-layout-space) - 2px);
712
+ --button-padding-right: calc(var(--joy-layout-space) - 2px);
713
+ --button-padding-bottom: calc(var(--joy-layout-space) - 2px);
714
+ --button-padding-left: calc(var(--joy-layout-space) - 2px);
715
715
  }
716
716
 
717
717
  :host([size="medium"]) {
@@ -720,21 +720,21 @@ export function buttonElementJoyStyle() {
720
720
  }
721
721
 
722
722
  :host([size="large"]) {
723
- --button-font-size: calc(var(--joy-typography-button-font-size) + 2px);
724
- --button-font-line-height: calc(var(--joy-typography-button-line-height) + 2px);
725
- --button-padding-top: calc(var(--joy-layout-space) + 4px);
726
- --button-padding-right: calc(var(--joy-layout-space) + 4px);
727
- --button-padding-bottom: calc(var(--joy-layout-space) + 4px);
728
- --button-padding-left: calc(var(--joy-layout-space) + 4px);
723
+ --button-font-size: calc(var(--joy-typography-button-font-size) + 2px);
724
+ --button-font-line-height: calc(var(--joy-typography-button-line-height) + 2px);
725
+ --button-padding-top: calc(var(--joy-layout-space) + 4px);
726
+ --button-padding-right: calc(var(--joy-layout-space) + 4px);
727
+ --button-padding-bottom: calc(var(--joy-layout-space) + 4px);
728
+ --button-padding-left: calc(var(--joy-layout-space) + 4px);
729
729
  }
730
730
 
731
731
  :host([size="giant"]) {
732
- --button-font-size: calc(var(--joy-typography-button-font-size) + 4px);
733
- --button-font-line-height: calc(var(--joy-typography-button-line-height) + 4px);
734
- --button-padding-top: calc(var(--joy-layout-space) + 8px);
735
- --button-padding-right: calc(var(--joy-layout-space) + 8px);
736
- --button-padding-bottom: calc(var(--joy-layout-space) + 8px);
737
- --button-padding-left: calc(var(--joy-layout-space) + 8px);
732
+ --button-font-size: calc(var(--joy-typography-button-font-size) + 4px);
733
+ --button-font-line-height: calc(var(--joy-typography-button-line-height) + 4px);
734
+ --button-padding-top: calc(var(--joy-layout-space) + 8px);
735
+ --button-padding-right: calc(var(--joy-layout-space) + 8px);
736
+ --button-padding-bottom: calc(var(--joy-layout-space) + 8px);
737
+ --button-padding-left: calc(var(--joy-layout-space) + 8px);
738
738
  }
739
739
 
740
740
  :host(.button-group__button.first) {
package/Controls/Components/Buttons/Button/Themes/ButtonElement.Memphis.js CHANGED
@@ -146,7 +146,7 @@ export function buttonElementMemphisStyle() {
146
146
 
147
147
  :host [part="button"]:before {
148
148
  border-radius: var(--button-border-radius);
149
- border-radius: calc(var(--button-border-radius) - var(--button-border-width));
149
+ border-radius: calc(var(--button-border-radius) - var(--button-border-width));
150
150
  content: "";
151
151
  opacity: 0;
152
152
  pointer-events: none;
@@ -226,7 +226,7 @@ export function buttonElementMemphisStyle() {
226
226
  }
227
227
 
228
228
  :host [part="progressRing"] {
229
- --progress-ring-thickness: base. component-property($ props, progress-thickness);
229
+ --progress-ring-thickness: var(--button-progress-thickness);
230
230
  margin: -12px 0 0 -12px;
231
231
  position: absolute;
232
232
  top: 50%;
@@ -511,21 +511,21 @@ export function buttonElementMemphisStyle() {
511
511
  }
512
512
 
513
513
  :host([size="tiny"]) {
514
- --button-font-size: calc(var(--memphis-typography-button-font-size) - 4px);
515
- --button-font-line-height: calc(var(--memphis-typography-button-line-height) - 4px);
516
- --button-padding-top: calc(var(--memphis-layout-space) - 4px);
517
- --button-padding-right: calc(var(--memphis-layout-space) - 4px);
518
- --button-padding-bottom: calc(var(--memphis-layout-space) - 4px);
519
- --button-padding-left: calc(var(--memphis-layout-space) - 4px);
514
+ --button-font-size: calc(var(--memphis-typography-button-font-size) - 4px);
515
+ --button-font-line-height: calc(var(--memphis-typography-button-line-height) - 4px);
516
+ --button-padding-top: calc(var(--memphis-layout-space) - 4px);
517
+ --button-padding-right: calc(var(--memphis-layout-space) - 4px);
518
+ --button-padding-bottom: calc(var(--memphis-layout-space) - 4px);
519
+ --button-padding-left: calc(var(--memphis-layout-space) - 4px);
520
520
  }
521
521
 
522
522
  :host([size="small"]) {
523
- --button-font-size: calc(var(--memphis-typography-button-font-size) - 2px);
524
- --button-font-line-height: calc(var(--memphis-typography-button-line-height) - 2px);
525
- --button-padding-top: calc(var(--memphis-layout-space) - 2px);
526
- --button-padding-right: calc(var(--memphis-layout-space) - 2px);
527
- --button-padding-bottom: calc(var(--memphis-layout-space) - 2px);
528
- --button-padding-left: calc(var(--memphis-layout-space) - 2px);
523
+ --button-font-size: calc(var(--memphis-typography-button-font-size) - 2px);
524
+ --button-font-line-height: calc(var(--memphis-typography-button-line-height) - 2px);
525
+ --button-padding-top: calc(var(--memphis-layout-space) - 2px);
526
+ --button-padding-right: calc(var(--memphis-layout-space) - 2px);
527
+ --button-padding-bottom: calc(var(--memphis-layout-space) - 2px);
528
+ --button-padding-left: calc(var(--memphis-layout-space) - 2px);
529
529
  }
530
530
 
531
531
  :host([size="medium"]) {
@@ -534,21 +534,21 @@ export function buttonElementMemphisStyle() {
534
534
  }
535
535
 
536
536
  :host([size="large"]) {
537
- --button-font-size: calc(var(--memphis-typography-button-font-size) + 2px);
538
- --button-font-line-height: calc(var(--memphis-typography-button-line-height) + 2px);
539
- --button-padding-top: calc(var(--memphis-layout-space) + 4px);
540
- --button-padding-right: calc(var(--memphis-layout-space) + 4px);
541
- --button-padding-bottom: calc(var(--memphis-layout-space) + 4px);
542
- --button-padding-left: calc(var(--memphis-layout-space) + 4px);
537
+ --button-font-size: calc(var(--memphis-typography-button-font-size) + 2px);
538
+ --button-font-line-height: calc(var(--memphis-typography-button-line-height) + 2px);
539
+ --button-padding-top: calc(var(--memphis-layout-space) + 4px);
540
+ --button-padding-right: calc(var(--memphis-layout-space) + 4px);
541
+ --button-padding-bottom: calc(var(--memphis-layout-space) + 4px);
542
+ --button-padding-left: calc(var(--memphis-layout-space) + 4px);
543
543
  }
544
544
 
545
545
  :host([size="giant"]) {
546
- --button-font-size: calc(var(--memphis-typography-button-font-size) + 4px);
547
- --button-font-line-height: calc(var(--memphis-typography-button-line-height) + 4px);
548
- --button-padding-top: calc(var(--memphis-layout-space) + 8px);
549
- --button-padding-right: calc(var(--memphis-layout-space) + 8px);
550
- --button-padding-bottom: calc(var(--memphis-layout-space) + 8px);
551
- --button-padding-left: calc(var(--memphis-layout-space) + 8px);
546
+ --button-font-size: calc(var(--memphis-typography-button-font-size) + 4px);
547
+ --button-font-line-height: calc(var(--memphis-typography-button-line-height) + 4px);
548
+ --button-padding-top: calc(var(--memphis-layout-space) + 8px);
549
+ --button-padding-right: calc(var(--memphis-layout-space) + 8px);
550
+ --button-padding-bottom: calc(var(--memphis-layout-space) + 8px);
551
+ --button-padding-left: calc(var(--memphis-layout-space) + 8px);
552
552
  }
553
553
 
554
554
  `;
package/Controls/Components/Buttons/CompoundButton/Themes/CompoundButtonElement.Cosmopolitan.js CHANGED
@@ -201,23 +201,23 @@ export function compoundButtonElementCosmopolitanStyle() {
201
201
  }
202
202
 
203
203
  :host([size="tiny"]) {
204
- --compound-button-font-size: calc(var(--compound-button-font-size) - 4px);
205
- --compound-button-line-height: calc(var(--compound-button-font-line-height) - 4px);
204
+ --compound-button-font-size: calc(var(--compound-button-font-size) - 4px);
205
+ --compound-button-line-height: calc(var(--compound-button-font-line-height) - 4px);
206
206
  }
207
207
 
208
208
  :host([size="small"]) {
209
- --compound-button-font-size: calc(var(--compound-button-font-size) - 2px);
210
- --compound-button-line-height: calc(var(--compound-button-font-line-height) - 2px);
209
+ --compound-button-font-size: calc(var(--compound-button-font-size) - 2px);
210
+ --compound-button-line-height: calc(var(--compound-button-font-line-height) - 2px);
211
211
  }
212
212
 
213
213
  :host([size="large"]) {
214
- --compound-button-font-size: calc(var(--compound-button-font-size) + 2px);
215
- --compound-button-line-height: calc(var(--compound-button-font-line-height) + 2px);
214
+ --compound-button-font-size: calc(var(--compound-button-font-size) + 2px);
215
+ --compound-button-line-height: calc(var(--compound-button-font-line-height) + 2px);
216
216
  }
217
217
 
218
218
  :host([size="giant"]) {
219
- --compound-button-font-size: calc(var(--compound-button-font-size) + 4px);
220
- --compound-button-line-height: calc(var(--compound-button-font-line-height) + 4px);
219
+ --compound-button-font-size: calc(var(--compound-button-font-size) + 4px);
220
+ --compound-button-line-height: calc(var(--compound-button-font-line-height) + 4px);
221
221
  }
222
222
 
223
223
  :host([fit="width"]) {
package/Controls/Components/Buttons/CompoundButton/Themes/CompoundButtonElement.Joy.js CHANGED
@@ -201,23 +201,23 @@ export function compoundButtonElementJoyStyle() {
201
201
  }
202
202
 
203
203
  :host([size="tiny"]) {
204
- --compound-button-font-size: calc(var(--compound-button-font-size) - 4px);
205
- --compound-button-line-height: calc(var(--compound-button-font-line-height) - 4px);
204
+ --compound-button-font-size: calc(var(--compound-button-font-size) - 4px);
205
+ --compound-button-line-height: calc(var(--compound-button-font-line-height) - 4px);
206
206
  }
207
207
 
208
208
  :host([size="small"]) {
209
- --compound-button-font-size: calc(var(--compound-button-font-size) - 2px);
210
- --compound-button-line-height: calc(var(--compound-button-font-line-height) - 2px);
209
+ --compound-button-font-size: calc(var(--compound-button-font-size) - 2px);
210
+ --compound-button-line-height: calc(var(--compound-button-font-line-height) - 2px);
211
211
  }
212
212
 
213
213
  :host([size="large"]) {
214
- --compound-button-font-size: calc(var(--compound-button-font-size) + 2px);
215
- --compound-button-line-height: calc(var(--compound-button-font-line-height) + 2px);
214
+ --compound-button-font-size: calc(var(--compound-button-font-size) + 2px);
215
+ --compound-button-line-height: calc(var(--compound-button-font-line-height) + 2px);
216
216
  }
217
217
 
218
218
  :host([size="giant"]) {
219
- --compound-button-font-size: calc(var(--compound-button-font-size) + 4px);
220
- --compound-button-line-height: calc(var(--compound-button-font-line-height) + 4px);
219
+ --compound-button-font-size: calc(var(--compound-button-font-size) + 4px);
220
+ --compound-button-line-height: calc(var(--compound-button-font-line-height) + 4px);
221
221
  }
222
222
 
223
223
  :host([fit="width"]) {
@@ -234,7 +234,7 @@ export function compoundButtonElementJoyStyle() {
234
234
  }
235
235
 
236
236
  :host [part="focusRing"] {
237
- border-radius: min(var(--compound-button-border-radius), var(--compound-button-border-radius) + var(--joy-layout-thickness));
237
+ border-radius: min(var(--compound-button-border-radius), var(--compound-button-border-radius) + var(--joy-layout-thickness));
238
238
  }
239
239
 
240
240
  :host [part="button"] {
@@ -247,7 +247,7 @@ export function compoundButtonElementJoyStyle() {
247
247
  }
248
248
 
249
249
  :host [part="button"]:before {
250
- border-radius: calc(var(--compound-button-border-radius) - var(--compound-button-border-width));
250
+ border-radius: calc(var(--compound-button-border-radius) - var(--compound-button-border-width));
251
251
  background-color: var(--joy-scheme-transparent);
252
252
  content: "";
253
253
  opacity: 0;
package/Controls/Components/Buttons/CompoundButton/Themes/CompoundButtonElement.Memphis.js CHANGED
@@ -203,23 +203,23 @@ export function compoundButtonElementMemphisStyle() {
203
203
  }
204
204
 
205
205
  :host([size="tiny"]) {
206
- --compound-button-font-size: calc(var(--compound-button-font-size) - 4px);
207
- --compound-button-line-height: calc(var(--compound-button-font-line-height) - 4px);
206
+ --compound-button-font-size: calc(var(--compound-button-font-size) - 4px);
207
+ --compound-button-line-height: calc(var(--compound-button-font-line-height) - 4px);
208
208
  }
209
209
 
210
210
  :host([size="small"]) {
211
- --compound-button-font-size: calc(var(--compound-button-font-size) - 2px);
212
- --compound-button-line-height: calc(var(--compound-button-font-line-height) - 2px);
211
+ --compound-button-font-size: calc(var(--compound-button-font-size) - 2px);
212
+ --compound-button-line-height: calc(var(--compound-button-font-line-height) - 2px);
213
213
  }
214
214
 
215
215
  :host([size="large"]) {
216
- --compound-button-font-size: calc(var(--compound-button-font-size) + 2px);
217
- --compound-button-line-height: calc(var(--compound-button-font-line-height) + 2px);
216
+ --compound-button-font-size: calc(var(--compound-button-font-size) + 2px);
217
+ --compound-button-line-height: calc(var(--compound-button-font-line-height) + 2px);
218
218
  }
219
219
 
220
220
  :host([size="giant"]) {
221
- --compound-button-font-size: calc(var(--compound-button-font-size) + 4px);
222
- --compound-button-line-height: calc(var(--compound-button-font-line-height) + 4px);
221
+ --compound-button-font-size: calc(var(--compound-button-font-size) + 4px);
222
+ --compound-button-line-height: calc(var(--compound-button-font-line-height) + 4px);
223
223
  }
224
224
 
225
225
  :host([fit="width"]) {
@@ -257,7 +257,7 @@ export function compoundButtonElementMemphisStyle() {
257
257
 
258
258
  :host [part="button"]:before {
259
259
  border-radius: var(--compound-button-border-radius);
260
- border-radius: calc(var(--compound-button-border-radius) - var(--compound-button-border-width));
260
+ border-radius: calc(var(--compound-button-border-radius) - var(--compound-button-border-width));
261
261
  background-color: var(--memphis-scheme-transparent);
262
262
  content: "";
263
263
  opacity: 0;
package/Controls/Components/Buttons/DropDownButton/Themes/DropDownButtonElement.Cosmopolitan.js CHANGED
@@ -33,7 +33,7 @@ export function dropDownButtonElementCosmopolitanStyle() {
33
33
  --dropdown-button-gap: var(--cosmopolitan-layout-space);
34
34
  --dropdown-button-icon-min-width: 36px;
35
35
  --dropdown-button-icon-min-height: 36px;
36
- --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) - 4px);
36
+ --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) - 4px);
37
37
  --dropdown-button-min-height: calc(var(--joy-layout-space) * 5 - var(--joy-layout-space) / 2);
38
38
  --dropdown-button-min-width: 64px;
39
39
  --dropdown-button-padding-bottom: var(--cosmopolitan-layout-space);
@@ -289,23 +289,23 @@ export function dropDownButtonElementCosmopolitanStyle() {
289
289
  }
290
290
 
291
291
  :host([size="tiny"]) {
292
- --dropdown-button-font-size: calc(var(--dropdown-button-font-size) - 4px);
293
- --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) - 4px);
292
+ --dropdown-button-font-size: calc(var(--dropdown-button-font-size) - 4px);
293
+ --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) - 4px);
294
294
  }
295
295
 
296
296
  :host([size="small"]) {
297
- --dropdown-button-font-size: calc(var(--dropdown-button-font-size) - 2px);
298
- --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) - 2px);
297
+ --dropdown-button-font-size: calc(var(--dropdown-button-font-size) - 2px);
298
+ --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) - 2px);
299
299
  }
300
300
 
301
301
  :host([size="large"]) {
302
- --dropdown-button-font-size: calc(var(--dropdown-button-font-size) + 2px);
303
- --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) + 2px);
302
+ --dropdown-button-font-size: calc(var(--dropdown-button-font-size) + 2px);
303
+ --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) + 2px);
304
304
  }
305
305
 
306
306
  :host([size="giant"]) {
307
- --dropdown-button-font-size: calc(var(--dropdown-button-font-size) + 4px);
308
- --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) + 4px);
307
+ --dropdown-button-font-size: calc(var(--dropdown-button-font-size) + 4px);
308
+ --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) + 4px);
309
309
  }
310
310
 
311
311
  :host([fit="width"]) {
package/Controls/Components/Buttons/DropDownButton/Themes/DropDownButtonElement.Joy.js CHANGED
@@ -33,7 +33,7 @@ export function dropDownButtonElementJoyStyle() {
33
33
  --dropdown-button-gap: var(--joy-layout-space);
34
34
  --dropdown-button-icon-min-width: 36px;
35
35
  --dropdown-button-icon-min-height: 36px;
36
- --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) - 4px);
36
+ --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) - 4px);
37
37
  --dropdown-button-min-height: calc(var(--joy-layout-space) * 5 - var(--joy-layout-space) / 2);
38
38
  --dropdown-button-min-width: 64px;
39
39
  --dropdown-button-padding-bottom: var(--joy-layout-space);
@@ -289,23 +289,23 @@ export function dropDownButtonElementJoyStyle() {
289
289
  }
290
290
 
291
291
  :host([size="tiny"]) {
292
- --dropdown-button-font-size: calc(var(--dropdown-button-font-size) - 4px);
293
- --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) - 4px);
292
+ --dropdown-button-font-size: calc(var(--dropdown-button-font-size) - 4px);
293
+ --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) - 4px);
294
294
  }
295
295
 
296
296
  :host([size="small"]) {
297
- --dropdown-button-font-size: calc(var(--dropdown-button-font-size) - 2px);
298
- --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) - 2px);
297
+ --dropdown-button-font-size: calc(var(--dropdown-button-font-size) - 2px);
298
+ --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) - 2px);
299
299
  }
300
300
 
301
301
  :host([size="large"]) {
302
- --dropdown-button-font-size: calc(var(--dropdown-button-font-size) + 2px);
303
- --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) + 2px);
302
+ --dropdown-button-font-size: calc(var(--dropdown-button-font-size) + 2px);
303
+ --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) + 2px);
304
304
  }
305
305
 
306
306
  :host([size="giant"]) {
307
- --dropdown-button-font-size: calc(var(--dropdown-button-font-size) + 4px);
308
- --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) + 4px);
307
+ --dropdown-button-font-size: calc(var(--dropdown-button-font-size) + 4px);
308
+ --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) + 4px);
309
309
  }
310
310
 
311
311
  :host([fit="width"]) {
@@ -322,7 +322,7 @@ export function dropDownButtonElementJoyStyle() {
322
322
  }
323
323
 
324
324
  :host [part="focusRing"] {
325
- border-radius: min(var(--dropdown-button-border-radius), var(--dropdown-button-border-radius) + var(--joy-layout-thickness));
325
+ border-radius: min(var(--dropdown-button-border-radius), var(--dropdown-button-border-radius) + var(--joy-layout-thickness));
326
326
  }
327
327
 
328
328
  :host [part="button"]:before {
package/Controls/Components/Buttons/DropDownButton/Themes/DropDownButtonElement.Memphis.js CHANGED
@@ -291,23 +291,23 @@ export function dropDownButtonElementMemphisStyle() {
291
291
  }
292
292
 
293
293
  :host([size="tiny"]) {
294
- --dropdown-button-font-size: calc(var(--dropdown-button-font-size) - 4px);
295
- --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) - 4px);
294
+ --dropdown-button-font-size: calc(var(--dropdown-button-font-size) - 4px);
295
+ --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) - 4px);
296
296
  }
297
297
 
298
298
  :host([size="small"]) {
299
- --dropdown-button-font-size: calc(var(--dropdown-button-font-size) - 2px);
300
- --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) - 2px);
299
+ --dropdown-button-font-size: calc(var(--dropdown-button-font-size) - 2px);
300
+ --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) - 2px);
301
301
  }
302
302
 
303
303
  :host([size="large"]) {
304
- --dropdown-button-font-size: calc(var(--dropdown-button-font-size) + 2px);
305
- --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) + 2px);
304
+ --dropdown-button-font-size: calc(var(--dropdown-button-font-size) + 2px);
305
+ --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) + 2px);
306
306
  }
307
307
 
308
308
  :host([size="giant"]) {
309
- --dropdown-button-font-size: calc(var(--dropdown-button-font-size) + 4px);
310
- --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) + 4px);
309
+ --dropdown-button-font-size: calc(var(--dropdown-button-font-size) + 4px);
310
+ --dropdown-button-line-height: calc(var(--dropdown-button-font-line-height) + 4px);
311
311
  }
312
312
 
313
313
  :host([fit="width"]) {
package/Controls/Components/Buttons/FloatingActionButton/Themes/FloatingActionButtonElement.Cosmopolitan.js CHANGED
@@ -245,23 +245,23 @@ export function floatingActionButtonElementCosmopolitanStyle() {
245
245
  }
246
246
 
247
247
  :host([size="tiny"]) {
248
- --fab-font-size: calc(var(--fab-font-size) - 4px);
249
- --fab-line-height: calc(var(--fab-font-line-height) - 4px);
248
+ --fab-font-size: calc(var(--fab-font-size) - 4px);
249
+ --fab-line-height: calc(var(--fab-font-line-height) - 4px);
250
250
  }
251
251
 
252
252
  :host([size="small"]) {
253
- --fab-font-size: calc(var(--fab-font-size) - 2px);
254
- --fab-line-height: calc(var(--fab-font-line-height) - 2px);
253
+ --fab-font-size: calc(var(--fab-font-size) - 2px);
254
+ --fab-line-height: calc(var(--fab-font-line-height) - 2px);
255
255
  }
256
256
 
257
257
  :host([size="large"]) {
258
- --fab-font-size: calc(var(--fab-font-size) + 2px);
259
- --fab-line-height: calc(var(--fab-font-line-height) + 2px);
258
+ --fab-font-size: calc(var(--fab-font-size) + 2px);
259
+ --fab-line-height: calc(var(--fab-font-line-height) + 2px);
260
260
  }
261
261
 
262
262
  :host([size="giant"]) {
263
- --fab-font-size: calc(var(--fab-font-size) + 4px);
264
- --fab-line-height: calc(var(--fab-font-line-height) + 4px);
263
+ --fab-font-size: calc(var(--fab-font-size) + 4px);
264
+ --fab-line-height: calc(var(--fab-font-line-height) + 4px);
265
265
  }
266
266
 
267
267
  :host([fit="width"]) {
package/Controls/Components/Buttons/FloatingActionButton/Themes/FloatingActionButtonElement.Joy.js CHANGED
@@ -250,23 +250,23 @@ export function floatingActionButtonElementJoyStyle() {
250
250
  }
251
251
 
252
252
  :host([size="tiny"]) {
253
- --fab-font-size: calc(var(--fab-font-size) - 4px);
254
- --fab-line-height: calc(var(--fab-font-line-height) - 4px);
253
+ --fab-font-size: calc(var(--fab-font-size) - 4px);
254
+ --fab-line-height: calc(var(--fab-font-line-height) - 4px);
255
255
  }
256
256
 
257
257
  :host([size="small"]) {
258
- --fab-font-size: calc(var(--fab-font-size) - 2px);
259
- --fab-line-height: calc(var(--fab-font-line-height) - 2px);
258
+ --fab-font-size: calc(var(--fab-font-size) - 2px);
259
+ --fab-line-height: calc(var(--fab-font-line-height) - 2px);
260
260
  }
261
261
 
262
262
  :host([size="large"]) {
263
- --fab-font-size: calc(var(--fab-font-size) + 2px);
264
- --fab-line-height: calc(var(--fab-font-line-height) + 2px);
263
+ --fab-font-size: calc(var(--fab-font-size) + 2px);
264
+ --fab-line-height: calc(var(--fab-font-line-height) + 2px);
265
265
  }
266
266
 
267
267
  :host([size="giant"]) {
268
- --fab-font-size: calc(var(--fab-font-size) + 4px);
269
- --fab-line-height: calc(var(--fab-font-line-height) + 4px);
268
+ --fab-font-size: calc(var(--fab-font-size) + 4px);
269
+ --fab-line-height: calc(var(--fab-font-line-height) + 4px);
270
270
  }
271
271
 
272
272
  :host([fit="width"]) {
@@ -283,7 +283,7 @@ export function floatingActionButtonElementJoyStyle() {
283
283
  }
284
284
 
285
285
  :host [part="focusRing"] {
286
- border-radius: min(var(--fab-border-radius), var(--fab-border-radius) + var(--joy-layout-thickness));
286
+ border-radius: min(var(--fab-border-radius), var(--fab-border-radius) + var(--joy-layout-thickness));
287
287
  --fab-background-color: var(--joy-scheme-highlight);
288
288
  --fab-border-color: var(--joy-scheme-highlight);
289
289
  }