Skip to content

Commit da751ca

Browse files
author
Matthias Prost
committed
refactor(Stack): vanilla extract (#5492)
* refactor(Stack): vanilla extract * fix: add changeset * fix: issue with css type
1 parent 61b8a82 commit da751ca

File tree

1 file changed

+42
-0
lines changed

1 file changed

+42
-0
lines changed

packages/ui/src/components/Stepper/__tests__/__snapshots__/index.test.tsx.snap

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -470,6 +470,7 @@ exports[`stepper > handles clicks when interactive 1`] = `
470470
data-label-position="bottom"
471471
data-selected="false"
472472
data-testid="stepper-step-0"
473+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
473474
>
474475
<div
475476
class="emotion-4 emotion-5 emotion-6"
@@ -501,6 +502,7 @@ exports[`stepper > handles clicks when interactive 1`] = `
501502
data-label-position="bottom"
502503
data-selected="true"
503504
data-testid="stepper-step-1"
505+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
504506
>
505507
<div
506508
class="emotion-4 emotion-12 emotion-6"
@@ -524,6 +526,7 @@ exports[`stepper > handles clicks when interactive 1`] = `
524526
data-label-position="bottom"
525527
data-selected="false"
526528
data-testid="stepper-step-2"
529+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
527530
>
528531
<div
529532
class="emotion-4 emotion-19 emotion-6"
@@ -1012,6 +1015,7 @@ exports[`stepper > handles clicks when interactive and small 1`] = `
10121015
data-label-position="bottom"
10131016
data-selected="false"
10141017
data-testid="stepper-step-0"
1018+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
10151019
>
10161020
<div
10171021
class="emotion-4 emotion-5 emotion-6"
@@ -1043,6 +1047,7 @@ exports[`stepper > handles clicks when interactive and small 1`] = `
10431047
data-label-position="bottom"
10441048
data-selected="true"
10451049
data-testid="stepper-step-1"
1050+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
10461051
>
10471052
<div
10481053
class="emotion-4 emotion-12 emotion-6"
@@ -1066,6 +1071,7 @@ exports[`stepper > handles clicks when interactive and small 1`] = `
10661071
data-label-position="bottom"
10671072
data-selected="false"
10681073
data-testid="stepper-step-2"
1074+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
10691075
>
10701076
<div
10711077
class="emotion-4 emotion-19 emotion-6"
@@ -1554,6 +1560,7 @@ exports[`stepper > handles clicks when not interactive 1`] = `
15541560
data-label-position="bottom"
15551561
data-selected="false"
15561562
data-testid="stepper-step-0"
1563+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
15571564
>
15581565
<div
15591566
class="emotion-4 emotion-5 emotion-6"
@@ -1585,6 +1592,7 @@ exports[`stepper > handles clicks when not interactive 1`] = `
15851592
data-label-position="bottom"
15861593
data-selected="true"
15871594
data-testid="stepper-step-1"
1595+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
15881596
>
15891597
<div
15901598
class="emotion-4 emotion-12 emotion-6"
@@ -1608,6 +1616,7 @@ exports[`stepper > handles clicks when not interactive 1`] = `
16081616
data-label-position="bottom"
16091617
data-selected="false"
16101618
data-testid="stepper-step-2"
1619+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
16111620
>
16121621
<div
16131622
class="emotion-4 emotion-19 emotion-6"
@@ -1870,6 +1879,7 @@ exports[`stepper > renders correctly with all selected 1`] = `
18701879
data-label-position="bottom"
18711880
data-selected="false"
18721881
data-testid="stepper-step-0"
1882+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
18731883
>
18741884
<div
18751885
class="emotion-4 emotion-5 emotion-6"
@@ -1901,6 +1911,7 @@ exports[`stepper > renders correctly with all selected 1`] = `
19011911
data-label-position="bottom"
19021912
data-selected="true"
19031913
data-testid="stepper-step-1"
1914+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
19041915
>
19051916
<div
19061917
class="emotion-4 emotion-12 emotion-6"
@@ -1924,6 +1935,7 @@ exports[`stepper > renders correctly with all selected 1`] = `
19241935
data-label-position="bottom"
19251936
data-selected="false"
19261937
data-testid="stepper-step-2"
1938+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
19271939
>
19281940
<div
19291941
class="emotion-4 emotion-19 emotion-6"
@@ -2186,6 +2198,7 @@ exports[`stepper > renders correctly with animation 1`] = `
21862198
data-label-position="bottom"
21872199
data-selected="false"
21882200
data-testid="stepper-step-0"
2201+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
21892202
>
21902203
<div
21912204
class="emotion-4 emotion-5 emotion-6"
@@ -2217,6 +2230,7 @@ exports[`stepper > renders correctly with animation 1`] = `
22172230
data-label-position="bottom"
22182231
data-selected="true"
22192232
data-testid="stepper-step-1"
2233+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
22202234
>
22212235
<div
22222236
class="emotion-4 emotion-12 emotion-6"
@@ -2240,6 +2254,7 @@ exports[`stepper > renders correctly with animation 1`] = `
22402254
data-label-position="bottom"
22412255
data-selected="false"
22422256
data-testid="stepper-step-2"
2257+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
22432258
>
22442259
<div
22452260
class="emotion-4 emotion-19 emotion-6"
@@ -2502,6 +2517,7 @@ exports[`stepper > renders correctly with children 1`] = `
25022517
data-label-position="bottom"
25032518
data-selected="false"
25042519
data-testid="stepper-step-0"
2520+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
25052521
>
25062522
<div
25072523
class="emotion-4 emotion-5 emotion-6"
@@ -2534,6 +2550,7 @@ exports[`stepper > renders correctly with children 1`] = `
25342550
data-label-position="bottom"
25352551
data-selected="true"
25362552
data-testid="stepper-step-1"
2553+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
25372554
>
25382555
<div
25392556
class="emotion-4 emotion-12 emotion-6"
@@ -2557,6 +2574,7 @@ exports[`stepper > renders correctly with children 1`] = `
25572574
data-label-position="bottom"
25582575
data-selected="false"
25592576
data-testid="stepper-step-2"
2577+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
25602578
>
25612579
<div
25622580
class="emotion-4 emotion-19 emotion-6"
@@ -2819,6 +2837,7 @@ exports[`stepper > renders correctly with default props 1`] = `
28192837
data-label-position="bottom"
28202838
data-selected="false"
28212839
data-testid="stepper-step-0"
2840+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
28222841
>
28232842
<div
28242843
class="emotion-4 emotion-5 emotion-6"
@@ -2850,6 +2869,7 @@ exports[`stepper > renders correctly with default props 1`] = `
28502869
data-label-position="bottom"
28512870
data-selected="true"
28522871
data-testid="stepper-step-1"
2872+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
28532873
>
28542874
<div
28552875
class="emotion-4 emotion-12 emotion-6"
@@ -2873,6 +2893,7 @@ exports[`stepper > renders correctly with default props 1`] = `
28732893
data-label-position="bottom"
28742894
data-selected="false"
28752895
data-testid="stepper-step-2"
2896+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
28762897
>
28772898
<div
28782899
class="emotion-4 emotion-19 emotion-6"
@@ -3110,6 +3131,7 @@ exports[`stepper > renders correctly with disabled steps 1`] = `
31103131
data-label-position="bottom"
31113132
data-selected="true"
31123133
data-testid="stepper-step-0"
3134+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
31133135
>
31143136
<div
31153137
class="emotion-4 emotion-5 emotion-6"
@@ -3133,6 +3155,7 @@ exports[`stepper > renders correctly with disabled steps 1`] = `
31333155
data-label-position="bottom"
31343156
data-selected="false"
31353157
data-testid="stepper-step-1"
3158+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
31363159
>
31373160
<div
31383161
class="emotion-4 emotion-12 emotion-6"
@@ -3156,6 +3179,7 @@ exports[`stepper > renders correctly with disabled steps 1`] = `
31563179
data-label-position="bottom"
31573180
data-selected="false"
31583181
data-testid="stepper-step-2"
3182+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
31593183
>
31603184
<div
31613185
class="emotion-4 emotion-12 emotion-6"
@@ -3393,6 +3417,7 @@ exports[`stepper > renders correctly with selected prop 1`] = `
33933417
data-label-position="bottom"
33943418
data-selected="false"
33953419
data-testid="stepper-step-0"
3420+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
33963421
>
33973422
<div
33983423
class="emotion-4 emotion-5 emotion-6"
@@ -3424,6 +3449,7 @@ exports[`stepper > renders correctly with selected prop 1`] = `
34243449
data-label-position="bottom"
34253450
data-selected="false"
34263451
data-testid="stepper-step-1"
3452+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
34273453
>
34283454
<div
34293455
class="emotion-4 emotion-5 emotion-6"
@@ -3455,6 +3481,7 @@ exports[`stepper > renders correctly with selected prop 1`] = `
34553481
data-label-position="bottom"
34563482
data-selected="true"
34573483
data-testid="stepper-step-2"
3484+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
34583485
>
34593486
<div
34603487
class="emotion-4 emotion-19 emotion-6"
@@ -3717,6 +3744,7 @@ exports[`stepper > renders correctly with small size 1`] = `
37173744
data-label-position="bottom"
37183745
data-selected="false"
37193746
data-testid="stepper-step-0"
3747+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
37203748
>
37213749
<div
37223750
class="emotion-4 emotion-5 emotion-6"
@@ -3748,6 +3776,7 @@ exports[`stepper > renders correctly with small size 1`] = `
37483776
data-label-position="bottom"
37493777
data-selected="true"
37503778
data-testid="stepper-step-1"
3779+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
37513780
>
37523781
<div
37533782
class="emotion-4 emotion-12 emotion-6"
@@ -3771,6 +3800,7 @@ exports[`stepper > renders correctly with small size 1`] = `
37713800
data-label-position="bottom"
37723801
data-selected="false"
37733802
data-testid="stepper-step-2"
3803+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
37743804
>
37753805
<div
37763806
class="emotion-4 emotion-19 emotion-6"
@@ -4090,6 +4120,7 @@ exports[`stepper > renders correctly with step number in row 1`] = `
40904120
data-label-position="right"
40914121
data-selected="false"
40924122
data-testid="stepper-step-0"
4123+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
40934124
>
40944125
<div
40954126
class="emotion-4 emotion-5 emotion-6"
@@ -4125,6 +4156,7 @@ exports[`stepper > renders correctly with step number in row 1`] = `
41254156
data-label-position="right"
41264157
data-selected="true"
41274158
data-testid="stepper-step-1"
4159+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
41284160
>
41294161
<div
41304162
class="emotion-4 emotion-14 emotion-6"
@@ -4152,6 +4184,7 @@ exports[`stepper > renders correctly with step number in row 1`] = `
41524184
data-label-position="right"
41534185
data-selected="false"
41544186
data-testid="stepper-step-2"
4187+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
41554188
>
41564189
<div
41574190
class="emotion-4 emotion-23 emotion-6"
@@ -4624,6 +4657,7 @@ exports[`stepper > renders correctly without Stepper.Step 1`] = `
46244657
data-label-position="bottom"
46254658
data-selected="false"
46264659
data-testid="stepper-step-0"
4660+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
46274661
>
46284662
<div
46294663
class="emotion-4 emotion-5 emotion-6"
@@ -4650,6 +4684,7 @@ exports[`stepper > renders correctly without Stepper.Step 1`] = `
46504684
data-label-position="bottom"
46514685
data-selected="true"
46524686
data-testid="stepper-step-1"
4687+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
46534688
>
46544689
<div
46554690
class="emotion-4 emotion-10 emotion-6"
@@ -4668,6 +4703,7 @@ exports[`stepper > renders correctly without Stepper.Step 1`] = `
46684703
data-label-position="bottom"
46694704
data-selected="false"
46704705
data-testid="stepper-step-2"
4706+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
46714707
>
46724708
<div
46734709
class="emotion-4 emotion-15 emotion-6"
@@ -4925,6 +4961,7 @@ exports[`stepper > renders correctly without separator 1`] = `
49254961
data-label-position="bottom"
49264962
data-selected="false"
49274963
data-testid="stepper-step-0"
4964+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
49284965
>
49294966
<div
49304967
class="emotion-4 emotion-5 emotion-6"
@@ -4956,6 +4993,7 @@ exports[`stepper > renders correctly without separator 1`] = `
49564993
data-label-position="bottom"
49574994
data-selected="true"
49584995
data-testid="stepper-step-1"
4996+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
49594997
>
49604998
<div
49614999
class="emotion-4 emotion-12 emotion-6"
@@ -4979,6 +5017,7 @@ exports[`stepper > renders correctly without separator 1`] = `
49795017
data-label-position="bottom"
49805018
data-selected="false"
49815019
data-testid="stepper-step-2"
5020+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
49825021
>
49835022
<div
49845023
class="emotion-4 emotion-19 emotion-6"
@@ -5241,6 +5280,7 @@ exports[`stepper > renders correctly without separator with label on the right 1
52415280
data-label-position="right"
52425281
data-selected="false"
52435282
data-testid="stepper-step-0"
5283+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
52445284
>
52455285
<div
52465286
class="emotion-4 emotion-5 emotion-6"
@@ -5272,6 +5312,7 @@ exports[`stepper > renders correctly without separator with label on the right 1
52725312
data-label-position="right"
52735313
data-selected="true"
52745314
data-testid="stepper-step-1"
5315+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
52755316
>
52765317
<div
52775318
class="emotion-4 emotion-12 emotion-6"
@@ -5295,6 +5336,7 @@ exports[`stepper > renders correctly without separator with label on the right 1
52955336
data-label-position="right"
52965337
data-selected="false"
52975338
data-testid="stepper-step-2"
5339+
style="--_4k0ekn0: var(--_4k0ekn0); --_4k0ekn1: var(--_4k0ekn1); --_4k0ekn2: var(--_4k0ekn2); --_4k0ekn3: var(--_4k0ekn3);"
52985340
>
52995341
<div
53005342
class="emotion-4 emotion-19 emotion-6"

0 commit comments

Comments
 (0)