@breadstone/mosaik-themes 0.0.229 → 0.0.230

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 (10) hide show
  1. package/index.cjs +4 -3
  2. package/index.cjs.map +1 -1
  3. package/index.d.mts +1 -1
  4. package/index.d.ts +1 -1
  5. package/index.js +4 -3
  6. package/index.js.map +1 -1
  7. package/package.json +2 -2
  8. package/themes/cosmopolitan.scss +244 -24
  9. package/themes/joy.scss +244 -23
  10. package/themes/memphis.scss +269 -2
package/themes/joy.scss CHANGED
@@ -1733,7 +1733,7 @@ $audio-props: (
1733
1733
  'padding-left': 16px,
1734
1734
  'padding-right': 16px,
1735
1735
  'padding-top': 16px,
1736
- 'shadow': unset,
1736
+ 'shadow': var(--joy-elevation-none),
1737
1737
  'transition-duration': var(--joy-duration-short),
1738
1738
  'transition-mode': ease,
1739
1739
  'transition-property': (color, background-color, border-color, opacity, box-shadow),
@@ -1771,7 +1771,7 @@ $auto-complete-box-props: (
1771
1771
  'padding-left': 12px,
1772
1772
  'padding-right': 12px,
1773
1773
  'padding-top': 8px,
1774
- 'shadow': unset,
1774
+ 'shadow': var(--joy-elevation-none),
1775
1775
  'transition-duration': var(--joy-duration-short),
1776
1776
  'transition-mode': ease,
1777
1777
  'transition-property': all,
@@ -1811,6 +1811,7 @@ $avatar-props: (
1811
1811
  'padding-left': var(--joy-layout-space),
1812
1812
  'padding-right': var(--joy-layout-space),
1813
1813
  'padding-top': calc(var(--joy-layout-space) / 2),
1814
+ 'shadow': unset unset unset unset unset,
1814
1815
  'shadow-blur': unset,
1815
1816
  'shadow-color': unset,
1816
1817
  'shadow-offset-x': unset,
@@ -1849,6 +1850,7 @@ $avatar-group-props: (
1849
1850
  'padding-left': var(--joy-layout-space),
1850
1851
  'padding-right': var(--joy-layout-space),
1851
1852
  'padding-top': calc(var(--joy-layout-space) / 2),
1853
+ 'shadow': unset unset unset unset unset,
1852
1854
  'shadow-blur': unset,
1853
1855
  'shadow-color': unset,
1854
1856
  'shadow-offset-x': unset,
@@ -1944,6 +1946,12 @@ $badge-props: (
1944
1946
  'padding-left': var(--joy-layout-space),
1945
1947
  'padding-right': var(--joy-layout-space),
1946
1948
  'padding-top': calc(var(--joy-layout-space) / 2),
1949
+ 'shadow': var(--joy-elevation-light-offset-x-1) var(--joy-elevation-light-offset-y-1) var(--joy-elevation-light-blur-1) var(--joy-elevation-light-spread-1) var(--joy-elevation-light-color-1),
1950
+ 'shadow-blur': var(--joy-elevation-light-blur-1),
1951
+ 'shadow-color': var(--joy-elevation-light-color-1),
1952
+ 'shadow-offset-x': var(--joy-elevation-light-offset-x-1),
1953
+ 'shadow-offset-y': var(--joy-elevation-light-offset-y-1),
1954
+ 'shadow-spread': var(--joy-elevation-light-spread-1),
1947
1955
  'transition-duration': var(--joy-duration-short),
1948
1956
  'transition-mode': ease,
1949
1957
  'transition-property': (background-color, color, border-color, opacity, box-shadow),
@@ -1980,7 +1988,7 @@ $banner-props: (
1980
1988
  'shadow': var(--joy-elevation-none),
1981
1989
  'transition-duration': var(--joy-duration-short),
1982
1990
  'transition-mode': ease,
1983
- 'transition-property': all,
1991
+ 'transition-property': (background-color, color, border-color, opacity, box-shadow),
1984
1992
  'translate': unset
1985
1993
  );
1986
1994
  /**
@@ -2554,6 +2562,7 @@ $card-props: (
2554
2562
  'padding-left': unset,
2555
2563
  'padding-right': unset,
2556
2564
  'padding-top': unset,
2565
+ 'shadow': var(--joy-elevation-light-offset-x-0) var(--joy-elevation-light-offset-y-0) var(--joy-elevation-light-blur-0) var(--joy-elevation-light-spread-0) var(--joy-elevation-light-color-0),
2557
2566
  'shadow-blur': var(--joy-elevation-light-blur-0),
2558
2567
  'shadow-color': var(--joy-elevation-light-color-0),
2559
2568
  'shadow-offset-x': var(--joy-elevation-light-offset-x-0),
@@ -2742,6 +2751,8 @@ $card-title-props: (
2742
2751
  * ------------------------------------------------------------------------------
2743
2752
  */
2744
2753
  $carousel-props: (
2754
+ 'deck-animation-duration': "0.4s",
2755
+ 'deck-rotation': "3deg",
2745
2756
  'font-family': unset,
2746
2757
  'font-letter-spacing': unset,
2747
2758
  'font-line-height': unset,
@@ -2749,13 +2760,13 @@ $carousel-props: (
2749
2760
  'font-text-decoration': unset,
2750
2761
  'font-text-transform': unset,
2751
2762
  'font-weight': unset,
2752
- 'gap': unset,
2763
+ 'gap': var(--joy-layout-space),
2753
2764
  'padding-bottom': unset,
2754
2765
  'padding-left': unset,
2755
2766
  'padding-right': unset,
2756
2767
  'padding-top': unset,
2757
- 'transition-duration': unset,
2758
- 'transition-mode': unset,
2768
+ 'transition-duration': var(--joy-duration-short),
2769
+ 'transition-mode': ease,
2759
2770
  'transition-property': unset,
2760
2771
  'translate': unset
2761
2772
  );
@@ -2966,7 +2977,7 @@ $chat-props: (
2966
2977
  'padding-left': calc(var(--joy-layout-space) * 2),
2967
2978
  'padding-right': calc(var(--joy-layout-space) * 2),
2968
2979
  'padding-top': var(--joy-layout-space),
2969
- 'shadow': 0,
2980
+ 'shadow': var(--joy-elevation-none),
2970
2981
  'transition-duration': var(--joy-duration-short),
2971
2982
  'transition-mode': ease,
2972
2983
  'transition-property': all,
@@ -3098,7 +3109,7 @@ $chat-marker-props: (
3098
3109
  'padding-left': calc(var(--joy-layout-space) * 2),
3099
3110
  'padding-right': calc(var(--joy-layout-space) * 2),
3100
3111
  'padding-top': var(--joy-layout-space),
3101
- 'shadow': 0,
3112
+ 'shadow': var(--joy-elevation-none),
3102
3113
  'transition-duration': unset,
3103
3114
  'transition-mode': unset,
3104
3115
  'transition-property': unset,
@@ -3132,10 +3143,15 @@ $chat-message-props: (
3132
3143
  'padding-left': calc(var(--joy-layout-space) * 2),
3133
3144
  'padding-right': calc(var(--joy-layout-space) * 2),
3134
3145
  'padding-top': var(--joy-layout-space),
3135
- 'shadow': 0,
3146
+ 'shadow': var(--joy-elevation-none),
3147
+ 'shadow-blur': var(--joy-elevation-light-blur-1),
3148
+ 'shadow-color': var(--joy-elevation-light-color-1),
3149
+ 'shadow-offset-x': var(--joy-elevation-light-offset-x-1),
3150
+ 'shadow-offset-y': var(--joy-elevation-light-offset-y-1),
3151
+ 'shadow-spread': var(--joy-elevation-light-spread-1),
3136
3152
  'transition-duration': var(--joy-duration-short),
3137
3153
  'transition-mode': ease,
3138
- 'transition-property': all,
3154
+ 'transition-property': (background-color, color, border-color, opacity, box-shadow, translate, transform),
3139
3155
  'translate': unset,
3140
3156
  'white-space': 44px
3141
3157
  );
@@ -3173,6 +3189,7 @@ $chat-message-avatar-props: (
3173
3189
  'padding-left': var(--joy-layout-space),
3174
3190
  'padding-right': var(--joy-layout-space),
3175
3191
  'padding-top': calc(var(--joy-layout-space) / 2),
3192
+ 'shadow': unset unset unset unset unset,
3176
3193
  'shadow-blur': unset,
3177
3194
  'shadow-color': unset,
3178
3195
  'shadow-offset-x': unset,
@@ -3328,7 +3345,7 @@ $check-box-group-props: (
3328
3345
  'padding-left': unset,
3329
3346
  'padding-right': unset,
3330
3347
  'padding-top': unset,
3331
- 'shadow': unset,
3348
+ 'shadow': var(--joy-elevation-none),
3332
3349
  'transition-duration': unset,
3333
3350
  'transition-mode': unset,
3334
3351
  'transition-property': unset,
@@ -3365,6 +3382,11 @@ $checkmark-props: (
3365
3382
  'padding-right': 8px,
3366
3383
  'padding-top': 4px,
3367
3384
  'shadow': var(--joy-elevation-none),
3385
+ 'shadow-blur': var(--joy-elevation-light-blur-1),
3386
+ 'shadow-color': var(--joy-elevation-light-color-1),
3387
+ 'shadow-offset-x': var(--joy-elevation-light-offset-x-1),
3388
+ 'shadow-offset-y': var(--joy-elevation-light-offset-y-1),
3389
+ 'shadow-spread': var(--joy-elevation-light-spread-1),
3368
3390
  'thickness': 2px,
3369
3391
  'transition-duration': var(--joy-duration-short),
3370
3392
  'transition-mode': ease,
@@ -3410,7 +3432,7 @@ $chip-props: (
3410
3432
  'shadow': var(--joy-elevation-none),
3411
3433
  'transition-duration': var(--joy-duration-short),
3412
3434
  'transition-mode': ease,
3413
- 'transition-property': (background-color, color, border-color, opacity, box-shadow),
3435
+ 'transition-property': (background-color, color, border-color, box-shadow, opacity, box-shadow),
3414
3436
  'translate': unset
3415
3437
  );
3416
3438
  /**
@@ -3753,6 +3775,11 @@ $color-editor-alpha-slider-props: (
3753
3775
  'padding-right': unset,
3754
3776
  'padding-top': unset,
3755
3777
  'shadow': none,
3778
+ 'shadow-blur': var(--joy-elevation-light-blur-1),
3779
+ 'shadow-color': var(--joy-elevation-light-color-1),
3780
+ 'shadow-offset-x': var(--joy-elevation-light-offset-x-1),
3781
+ 'shadow-offset-y': var(--joy-elevation-light-offset-y-1),
3782
+ 'shadow-spread': var(--joy-elevation-light-spread-1),
3756
3783
  'thumb-background-color': var(--joy-scheme-highlight),
3757
3784
  'thumb-border-color': var(--joy-scheme-highlight),
3758
3785
  'thumb-border-radius': 50%,
@@ -3799,6 +3826,11 @@ $color-editor-area-props: (
3799
3826
  'padding-right': unset,
3800
3827
  'padding-top': unset,
3801
3828
  'shadow': none,
3829
+ 'shadow-blur': var(--joy-elevation-light-blur-1),
3830
+ 'shadow-color': var(--joy-elevation-light-color-1),
3831
+ 'shadow-offset-x': var(--joy-elevation-light-offset-x-1),
3832
+ 'shadow-offset-y': var(--joy-elevation-light-offset-y-1),
3833
+ 'shadow-spread': var(--joy-elevation-light-spread-1),
3802
3834
  'thumb-border-color': var(--joy-scheme-surface),
3803
3835
  'thumb-border-radius': 50%,
3804
3836
  'thumb-border-width': var(--joy-layout-thickness),
@@ -3844,6 +3876,11 @@ $color-editor-hue-slider-props: (
3844
3876
  'padding-right': unset,
3845
3877
  'padding-top': unset,
3846
3878
  'shadow': none,
3879
+ 'shadow-blur': var(--joy-elevation-light-blur-1),
3880
+ 'shadow-color': var(--joy-elevation-light-color-1),
3881
+ 'shadow-offset-x': var(--joy-elevation-light-offset-x-1),
3882
+ 'shadow-offset-y': var(--joy-elevation-light-offset-y-1),
3883
+ 'shadow-spread': var(--joy-elevation-light-spread-1),
3847
3884
  'thumb-background-color': var(--joy-scheme-highlight),
3848
3885
  'thumb-border-color': var(--joy-scheme-highlight),
3849
3886
  'thumb-border-radius': 50%,
@@ -3975,6 +4012,11 @@ $color-editor-shade-slider-props: (
3975
4012
  'padding-right': unset,
3976
4013
  'padding-top': unset,
3977
4014
  'shadow': none,
4015
+ 'shadow-blur': var(--joy-elevation-light-blur-1),
4016
+ 'shadow-color': var(--joy-elevation-light-color-1),
4017
+ 'shadow-offset-x': var(--joy-elevation-light-offset-x-1),
4018
+ 'shadow-offset-y': var(--joy-elevation-light-offset-y-1),
4019
+ 'shadow-spread': var(--joy-elevation-light-spread-1),
3978
4020
  'thumb-background-color': var(--joy-scheme-highlight),
3979
4021
  'thumb-border-color': var(--joy-scheme-highlight),
3980
4022
  'thumb-border-radius': 50%,
@@ -4549,6 +4591,7 @@ $dialog-props: (
4549
4591
  'padding-left': calc(var(--joy-layout-space)*2),
4550
4592
  'padding-right': calc(var(--joy-layout-space)*2),
4551
4593
  'padding-top': var(--joy-layout-space),
4594
+ 'shadow': var(--joy-elevation-regular-offset-x-0) var(--joy-elevation-regular-offset-y-0) var(--joy-elevation-regular-blur-0) var(--joy-elevation-regular-spread-0) var(--joy-elevation-regular-color-0),
4552
4595
  'shadow-blur': var(--joy-elevation-regular-blur-0),
4553
4596
  'shadow-color': var(--joy-elevation-regular-color-0),
4554
4597
  'shadow-offset-x': var(--joy-elevation-regular-offset-x-0),
@@ -6160,6 +6203,7 @@ $flow-board-column-item-props: (
6160
6203
  'padding-right': unset,
6161
6204
  'padding-top': unset,
6162
6205
  'pinned-background-color': var(--joy-scheme-surface),
6206
+ 'shadow': var(--joy-elevation-light-offset-x-1) var(--joy-elevation-light-offset-y-1) var(--joy-elevation-light-blur-1) var(--joy-elevation-light-spread-1) var(--joy-elevation-light-color-1),
6163
6207
  'shadow-blur': var(--joy-elevation-light-blur-1),
6164
6208
  'shadow-color': var(--joy-elevation-light-color-1),
6165
6209
  'shadow-offset-x': var(--joy-elevation-light-offset-x-1),
@@ -6671,6 +6715,7 @@ $image-props: (
6671
6715
  'padding-right': 16px,
6672
6716
  'padding-top': 16px,
6673
6717
  'shadow': unset,
6718
+ 'thumbnail-blur': 20px,
6674
6719
  'transition-duration': var(--joy-duration-short),
6675
6720
  'transition-mode': ease,
6676
6721
  'transition-property': (color, background-color, border-color, opacity, box-shadow),
@@ -6864,7 +6909,12 @@ $kbd-props: (
6864
6909
  'padding-left': calc(var(--joy-layout-space) / 2),
6865
6910
  'padding-right': calc(var(--joy-layout-space) / 2),
6866
6911
  'padding-top': calc(var(--joy-layout-space) / 2),
6867
- 'shadow': var(--joy-elevation-light),
6912
+ 'shadow': var(--joy-elevation-light-offset-x-1) var(--joy-elevation-light-offset-y-1) var(--joy-elevation-light-blur-1) var(--joy-elevation-light-spread-1) var(--joy-elevation-light-color-1),
6913
+ 'shadow-blur': var(--joy-elevation-light-blur-1),
6914
+ 'shadow-color': var(--joy-elevation-light-color-1),
6915
+ 'shadow-offset-x': var(--joy-elevation-light-offset-x-1),
6916
+ 'shadow-offset-y': var(--joy-elevation-light-offset-y-1),
6917
+ 'shadow-spread': var(--joy-elevation-light-spread-1),
6868
6918
  'transition-duration': unset,
6869
6919
  'transition-mode': unset,
6870
6920
  'transition-property': unset,
@@ -7032,6 +7082,98 @@ $list-item-group-props: (
7032
7082
  'transition-property': all,
7033
7083
  'translate': unset
7034
7084
  );
7085
+ /**
7086
+ * ------------------------------------------------------------------------------
7087
+ * <auto-generated>
7088
+ * This code was generated by a tool.
7089
+ * Changes to this file may cause incorrect behavior and will be lost if
7090
+ * the code is regenerated.
7091
+ * </auto-generated>
7092
+ * ------------------------------------------------------------------------------
7093
+ */
7094
+ $listing-props: (
7095
+ 'background-color': var(--joy-scheme-transparent),
7096
+ 'font-family': var(--joy-font-family),
7097
+ 'font-letter-spacing': unset,
7098
+ 'font-line-height': var(--joy-typography-body1-line-height),
7099
+ 'font-size': var(--joy-typography-body1-font-size),
7100
+ 'font-text-decoration': unset,
7101
+ 'font-text-transform': unset,
7102
+ 'font-weight': var(--joy-typography-body1-font-weight),
7103
+ 'foreground-color': var(--joy-scheme-foreground),
7104
+ 'gap': var(--joy-layout-space),
7105
+ 'padding-bottom': 0px,
7106
+ 'padding-left': 0px,
7107
+ 'padding-right': 0px,
7108
+ 'padding-top': 0px,
7109
+ 'transition-duration': var(--joy-duration-short),
7110
+ 'transition-mode': ease,
7111
+ 'transition-property': (color, opacity),
7112
+ 'translate': unset
7113
+ );
7114
+ /**
7115
+ * ------------------------------------------------------------------------------
7116
+ * <auto-generated>
7117
+ * This code was generated by a tool.
7118
+ * Changes to this file may cause incorrect behavior and will be lost if
7119
+ * the code is regenerated.
7120
+ * </auto-generated>
7121
+ * ------------------------------------------------------------------------------
7122
+ */
7123
+ $listing-item-props: (
7124
+ 'background-color': transparent,
7125
+ 'font-family': var(--joy-font-family),
7126
+ 'font-letter-spacing': unset,
7127
+ 'font-line-height': var(--joy-typography-body1-line-height),
7128
+ 'font-size': var(--joy-typography-body1-font-size),
7129
+ 'font-text-decoration': unset,
7130
+ 'font-text-transform': unset,
7131
+ 'font-weight': var(--joy-typography-body1-font-weight),
7132
+ 'foreground-color': var(--joy-scheme-foreground),
7133
+ 'gap': 8px,
7134
+ 'padding-bottom': 0px,
7135
+ 'padding-left': 0px,
7136
+ 'padding-right': 0px,
7137
+ 'padding-top': 0px,
7138
+ 'transition-duration': var(--joy-duration-short),
7139
+ 'transition-mode': ease,
7140
+ 'transition-property': (color, opacity),
7141
+ 'translate': unset
7142
+ );
7143
+ /**
7144
+ * ------------------------------------------------------------------------------
7145
+ * <auto-generated>
7146
+ * This code was generated by a tool.
7147
+ * Changes to this file may cause incorrect behavior and will be lost if
7148
+ * the code is regenerated.
7149
+ * </auto-generated>
7150
+ * ------------------------------------------------------------------------------
7151
+ */
7152
+ $listing-item-marker-props: (
7153
+ 'background-color': var(--joy-scheme-background),
7154
+ 'border-color': var(--joy-scheme-highlight),
7155
+ 'border-radius': 50%,
7156
+ 'border-style': solid,
7157
+ 'border-width': var(--joy-layout-thickness),
7158
+ 'font-family': var(--joy-font-family),
7159
+ 'font-letter-spacing': var(--joy-typography-body2-letter-spacing),
7160
+ 'font-line-height': var(--joy-typography-body2-line-height),
7161
+ 'font-size': var(--joy-typography-body2-font-size),
7162
+ 'font-text-decoration': var(--joy-typography-body2-text-decoration),
7163
+ 'font-text-transform': var(--joy-typography-body2-text-transform),
7164
+ 'font-weight': var(--joy-typography-body2-font-weight),
7165
+ 'foreground-color': var(--joy-scheme-foreground),
7166
+ 'gap': calc(var(--joy-layout-space) / 2),
7167
+ 'height': 22px,
7168
+ 'padding-bottom': calc(var(--joy-layout-space) / 2),
7169
+ 'padding-left': calc(var(--joy-layout-space) / 2),
7170
+ 'padding-right': calc(var(--joy-layout-space) / 2),
7171
+ 'padding-top': calc(var(--joy-layout-space) / 2),
7172
+ 'transition-duration': var(--joy-duration-short),
7173
+ 'transition-mode': ease,
7174
+ 'transition-property': (background-color, color, border-color, opacity, box-shadow),
7175
+ 'translate': unset
7176
+ );
7035
7177
  /**
7036
7178
  * ------------------------------------------------------------------------------
7037
7179
  * <auto-generated>
@@ -7059,6 +7201,40 @@ $map-props: (
7059
7201
  'transition-property': unset,
7060
7202
  'translate': unset
7061
7203
  );
7204
+ /**
7205
+ * ------------------------------------------------------------------------------
7206
+ * <auto-generated>
7207
+ * This code was generated by a tool.
7208
+ * Changes to this file may cause incorrect behavior and will be lost if
7209
+ * the code is regenerated.
7210
+ * </auto-generated>
7211
+ * ------------------------------------------------------------------------------
7212
+ */
7213
+ $marker-props: (
7214
+ 'background-color': var(--joy-scheme-background),
7215
+ 'border-color': var(--joy-scheme-highlight),
7216
+ 'border-radius': 50%,
7217
+ 'border-style': solid,
7218
+ 'border-width': var(--joy-layout-thickness),
7219
+ 'font-family': var(--joy-font-family),
7220
+ 'font-letter-spacing': var(--joy-typography-body2-letter-spacing),
7221
+ 'font-line-height': var(--joy-typography-body2-line-height),
7222
+ 'font-size': var(--joy-typography-body2-font-size),
7223
+ 'font-text-decoration': var(--joy-typography-body2-text-decoration),
7224
+ 'font-text-transform': var(--joy-typography-body2-text-transform),
7225
+ 'font-weight': var(--joy-typography-body2-font-weight),
7226
+ 'foreground-color': var(--joy-scheme-foreground),
7227
+ 'gap': calc(var(--joy-layout-space) / 2),
7228
+ 'height': 22px,
7229
+ 'padding-bottom': calc(var(--joy-layout-space) / 2),
7230
+ 'padding-left': calc(var(--joy-layout-space) / 2),
7231
+ 'padding-right': calc(var(--joy-layout-space) / 2),
7232
+ 'padding-top': calc(var(--joy-layout-space) / 2),
7233
+ 'transition-duration': var(--joy-duration-short),
7234
+ 'transition-mode': ease,
7235
+ 'transition-property': (background-color, color, border-color, opacity, box-shadow),
7236
+ 'translate': unset
7237
+ );
7062
7238
  /**
7063
7239
  * ------------------------------------------------------------------------------
7064
7240
  * <auto-generated>
@@ -7266,7 +7442,7 @@ $message-props: (
7266
7442
  'shadow': var(--joy-elevation-none),
7267
7443
  'transition-duration': var(--joy-duration-short),
7268
7444
  'transition-mode': ease,
7269
- 'transition-property': all,
7445
+ 'transition-property': (background-color, color, border-color, opacity, box-shadow),
7270
7446
  'translate': unset
7271
7447
  );
7272
7448
  /**
@@ -7306,9 +7482,9 @@ $message-box-props: (
7306
7482
  * ------------------------------------------------------------------------------
7307
7483
  */
7308
7484
  $meter-bar-props: (
7309
- 'fill-color-high': var(--joy-color-semantic-warning),
7310
- 'fill-color-low': var(--joy-color-semantic-error),
7311
- 'fill-color-optimum': var(--joy-color-semantic-success),
7485
+ 'fill-color-high': var(--joy-color-warning-500),
7486
+ 'fill-color-low': var(--joy-color-error-500),
7487
+ 'fill-color-optimum': var(--joy-color-success-500),
7312
7488
  'font-family': unset,
7313
7489
  'font-letter-spacing': unset,
7314
7490
  'font-line-height': unset,
@@ -7342,11 +7518,11 @@ $meter-ring-props: (
7342
7518
  'border-radius': 16px,
7343
7519
  'border-style': solid,
7344
7520
  'border-width': 0px,
7345
- 'fill-color': var(--joy-color-light-info-500),
7346
- 'fill-color-high': var(--joy-color-light-danger-500),
7347
- 'fill-color-low': var(--joy-color-light-warning-500),
7348
- 'fill-color-normal': var(--joy-color-light-info-500),
7349
- 'fill-color-optimum': var(--joy-color-light-success-500),
7521
+ 'fill-color': var(--joy-color-info-500),
7522
+ 'fill-color-high': var(--joy-color-danger-500),
7523
+ 'fill-color-low': var(--joy-color-warning-500),
7524
+ 'fill-color-normal': var(--joy-color-info-500),
7525
+ 'fill-color-optimum': var(--joy-color-success-500),
7350
7526
  'font-family': var(--joy-font-family),
7351
7527
  'font-letter-spacing': unset,
7352
7528
  'font-line-height': unset,
@@ -7827,6 +8003,40 @@ $pin-box-props: (
7827
8003
  'transition-property': (background-color, color, border-color, opacity, box-shadow),
7828
8004
  'translate': unset
7829
8005
  );
8006
+ /**
8007
+ * ------------------------------------------------------------------------------
8008
+ * <auto-generated>
8009
+ * This code was generated by a tool.
8010
+ * Changes to this file may cause incorrect behavior and will be lost if
8011
+ * the code is regenerated.
8012
+ * </auto-generated>
8013
+ * ------------------------------------------------------------------------------
8014
+ */
8015
+ $pip-props: (
8016
+ 'background-color': var(--joy-scheme-background),
8017
+ 'border-color': var(--joy-scheme-highlight),
8018
+ 'border-radius': 50%,
8019
+ 'border-style': solid,
8020
+ 'border-width': var(--joy-layout-thickness),
8021
+ 'font-family': var(--joy-font-family),
8022
+ 'font-letter-spacing': var(--joy-typography-body2-letter-spacing),
8023
+ 'font-line-height': var(--joy-typography-body2-line-height),
8024
+ 'font-size': var(--joy-typography-body2-font-size),
8025
+ 'font-text-decoration': var(--joy-typography-body2-text-decoration),
8026
+ 'font-text-transform': var(--joy-typography-body2-text-transform),
8027
+ 'font-weight': var(--joy-typography-body2-font-weight),
8028
+ 'foreground-color': var(--joy-scheme-foreground),
8029
+ 'gap': calc(var(--joy-layout-space) / 2),
8030
+ 'height': 22px,
8031
+ 'padding-bottom': calc(var(--joy-layout-space) / 2),
8032
+ 'padding-left': calc(var(--joy-layout-space) / 2),
8033
+ 'padding-right': calc(var(--joy-layout-space) / 2),
8034
+ 'padding-top': calc(var(--joy-layout-space) / 2),
8035
+ 'transition-duration': var(--joy-duration-short),
8036
+ 'transition-mode': ease,
8037
+ 'transition-property': (background-color, color, border-color, opacity, box-shadow),
8038
+ 'translate': unset
8039
+ );
7830
8040
  /**
7831
8041
  * ------------------------------------------------------------------------------
7832
8042
  * <auto-generated>
@@ -7887,6 +8097,7 @@ $popup-props: (
7887
8097
  'padding-left': calc(var(--joy-layout-space) * 1.25),
7888
8098
  'padding-right': calc(var(--joy-layout-space) * 1.25),
7889
8099
  'padding-top': calc(var(--joy-layout-space) * 1),
8100
+ 'shadow': var(--joy-elevation-regular-offset-x-0) var(--joy-elevation-regular-offset-y-0) var(--joy-elevation-regular-blur-0) var(--joy-elevation-regular-spread-0) var(--joy-elevation-regular-color-0),
7890
8101
  'shadow-blur': var(--joy-elevation-regular-blur-0),
7891
8102
  'shadow-color': var(--joy-elevation-regular-color-0),
7892
8103
  'shadow-offset-x': var(--joy-elevation-regular-offset-x-0),
@@ -8853,6 +9064,7 @@ $scheduler-event-props: (
8853
9064
  'padding-top': unset,
8854
9065
  'ripple-color': unset,
8855
9066
  'ripple-duration': 200ms,
9067
+ 'shadow': var(--joy-elevation-light-offset-x-1) var(--joy-elevation-light-offset-y-1) var(--joy-elevation-light-blur-1) var(--joy-elevation-light-spread-1) var(--joy-elevation-light-color-1),
8856
9068
  'shadow-blur': var(--joy-elevation-light-blur-1),
8857
9069
  'shadow-color': var(--joy-elevation-light-color-1),
8858
9070
  'shadow-offset-x': var(--joy-elevation-light-offset-x-1),
@@ -9250,7 +9462,7 @@ $segment-item-props: (
9250
9462
  'font-text-decoration': var(--joy-typography-button-text-decoration),
9251
9463
  'font-text-transform': var(--joy-typography-button-text-transform),
9252
9464
  'font-weight': var(--joy-typography-button-font-weight),
9253
- 'gap': unset,
9465
+ 'gap': var(--joy-layout-space),
9254
9466
  'padding-bottom': unset,
9255
9467
  'padding-left': unset,
9256
9468
  'padding-right': unset,
@@ -10564,6 +10776,12 @@ $thumb-props: (
10564
10776
  'padding-left': unset,
10565
10777
  'padding-right': unset,
10566
10778
  'padding-top': unset,
10779
+ 'shadow': var(--joy-elevation-light-offset-x-1) var(--joy-elevation-light-offset-y-1) var(--joy-elevation-light-blur-1) var(--joy-elevation-light-spread-1) var(--joy-elevation-light-color-1),
10780
+ 'shadow-blur': var(--joy-elevation-light-blur-1),
10781
+ 'shadow-color': var(--joy-elevation-light-color-1),
10782
+ 'shadow-offset-x': var(--joy-elevation-light-offset-x-1),
10783
+ 'shadow-offset-y': var(--joy-elevation-light-offset-y-1),
10784
+ 'shadow-spread': var(--joy-elevation-light-spread-1),
10567
10785
  'transition-duration': var(--joy-duration-short),
10568
10786
  'transition-mode': ease,
10569
10787
  'transition-property': (background-color, color, border-color, opacity, box-shadow, translate, transform),
@@ -10940,6 +11158,7 @@ $timeline-marker-props: (
10940
11158
  'padding-left': unset,
10941
11159
  'padding-right': unset,
10942
11160
  'padding-top': unset,
11161
+ 'progress-ring-width': var(--joy-layout-thickness),
10943
11162
  'transition-duration': unset,
10944
11163
  'transition-mode': unset,
10945
11164
  'transition-property': unset,
@@ -11234,6 +11453,7 @@ $toolbar-props: (
11234
11453
  'padding-left': calc(var(--joy-layout-space) * 2),
11235
11454
  'padding-right': calc(var(--joy-layout-space) * 2),
11236
11455
  'padding-top': var(--joy-layout-space),
11456
+ 'shadow': unset unset unset unset unset,
11237
11457
  'shadow-blur': unset,
11238
11458
  'shadow-color': unset,
11239
11459
  'shadow-offset-x': unset,
@@ -11368,6 +11588,7 @@ $tour-step-props: (
11368
11588
  'padding-left': calc(var(--joy-layout-space)*2),
11369
11589
  'padding-right': calc(var(--joy-layout-space)*2),
11370
11590
  'padding-top': calc(var(--joy-layout-space)*2),
11591
+ 'shadow': 0px 16px 32px 0px rgba(0, 0, 0, 0.18),
11371
11592
  'shadow-blur': 32px,
11372
11593
  'shadow-color': rgba(0, 0, 0, 0.18),
11373
11594
  'shadow-offset-x': 0px,