Skip to content
This repository was archived by the owner on Sep 20, 2024. It is now read-only.

Commit 22d5e25

Browse files
committed
refactor(switch): use api
1 parent b5cb72c commit 22d5e25

File tree

5 files changed

+337
-93
lines changed

5 files changed

+337
-93
lines changed

packages/chakra-ui-core/src/CSelect/CSelect.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -76,7 +76,7 @@ const CSelectInput = {
7676
}
7777

7878
const { native, nonNative } = extractListeners({ listeners }, nonNativeEvents)
79-
console.log(forwardProps(props))
79+
8080
return h(CInput, {
8181
...rest,
8282
props: {

packages/chakra-ui-core/src/CStat/tests/__snapshots__/CStat.test.js.snap

Lines changed: 154 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -2,28 +2,81 @@
22

33
exports[`"CStatArrow" should display corresponding icon for "type" prop 1`] = `
44
<DocumentFragment>
5-
<div
6-
class="css-i8ou7a"
5+
.emotion-6 {
6+
-webkit-flex: 1;
7+
-ms-flex: 1;
8+
flex: 1;
9+
padding-right: 1rem;
10+
position: relative;
11+
}
12+
13+
.emotion-0 {
14+
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
15+
font-weight: 500;
16+
font-size: 0.875rem;
17+
}
18+
19+
.emotion-1 {
20+
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
21+
font-size: 1.5rem;
22+
vertical-align: baseline;
23+
font-weight: 600;
24+
}
25+
26+
.emotion-5 {
27+
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
28+
font-size: 0.875rem;
29+
opacity: 0.8;
30+
margin-bottom: 0.5rem;
31+
}
32+
33+
.emotion-4 {
34+
margin-right: 0.25rem;
35+
vertical-align: middle;
36+
color: #58c184;
37+
}
38+
39+
.emotion-2 {
40+
-webkit-flex-shrink: 0;
41+
-ms-flex-negative: 0;
42+
flex-shrink: 0;
43+
-webkit-backface-visibility: hidden;
44+
backface-visibility: hidden;
45+
}
46+
47+
.emotion-2:not(:root) {
48+
overflow: hidden;
49+
}
50+
51+
.emotion-3 {
52+
width: 1em;
53+
height: 1em;
54+
display: inline-block;
55+
vertical-align: middle;
56+
}
57+
58+
<div
59+
class="emotion-6"
760
data-chakra-component="CStat"
861
>
962
<p
10-
class="css-zb0vz7"
63+
class="emotion-0"
1164
data-chakra-component="CStatLabel"
1265
>
1366
Sent
1467
</p>
1568
<p
16-
class="css-1ecn2q9"
69+
class="emotion-1"
1770
data-chakra-component="CStatNumber"
1871
>
1972
345,670
2073
</p>
2174
<p
22-
class="css-1x22fzm"
23-
data-chakra-component="CText"
75+
class="emotion-5"
76+
data-chakra-component="CStatHelperText"
2477
>
2578
<svg
26-
class="css-ata6yd css-y3asau"
79+
class="emotion-2 emotion-3 emotion-4"
2780
data-chakra-component="CStatArrow"
2881
role="presentation"
2982
viewBox="0 0 24 24"
@@ -47,28 +100,81 @@ exports[`"CStatArrow" should display corresponding icon for "type" prop 1`] = `
47100

48101
exports[`"CStatArrow" should display corresponding icon for "type" prop 2`] = `
49102
<DocumentFragment>
50-
<div
51-
class="css-i8ou7a"
103+
.emotion-6 {
104+
-webkit-flex: 1;
105+
-ms-flex: 1;
106+
flex: 1;
107+
padding-right: 1rem;
108+
position: relative;
109+
}
110+
111+
.emotion-0 {
112+
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
113+
font-weight: 500;
114+
font-size: 0.875rem;
115+
}
116+
117+
.emotion-1 {
118+
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
119+
font-size: 1.5rem;
120+
vertical-align: baseline;
121+
font-weight: 600;
122+
}
123+
124+
.emotion-5 {
125+
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
126+
font-size: 0.875rem;
127+
opacity: 0.8;
128+
margin-bottom: 0.5rem;
129+
}
130+
131+
.emotion-2 {
132+
-webkit-flex-shrink: 0;
133+
-ms-flex-negative: 0;
134+
flex-shrink: 0;
135+
-webkit-backface-visibility: hidden;
136+
backface-visibility: hidden;
137+
}
138+
139+
.emotion-2:not(:root) {
140+
overflow: hidden;
141+
}
142+
143+
.emotion-3 {
144+
width: 1em;
145+
height: 1em;
146+
display: inline-block;
147+
vertical-align: middle;
148+
}
149+
150+
.emotion-4 {
151+
margin-right: 0.25rem;
152+
vertical-align: middle;
153+
color: #dd3b4b;
154+
}
155+
156+
<div
157+
class="emotion-6"
52158
data-chakra-component="CStat"
53159
>
54160
<p
55-
class="css-zb0vz7"
161+
class="emotion-0"
56162
data-chakra-component="CStatLabel"
57163
>
58164
Sent
59165
</p>
60166
<p
61-
class="css-1ecn2q9"
167+
class="emotion-1"
62168
data-chakra-component="CStatNumber"
63169
>
64170
345,670
65171
</p>
66172
<p
67-
class="css-1x22fzm"
68-
data-chakra-component="CText"
173+
class="emotion-5"
174+
data-chakra-component="CStatHelperText"
69175
>
70176
<svg
71-
class="css-4vpgj8 css-y3asau"
177+
class="emotion-2 emotion-3 emotion-4"
72178
data-chakra-component="CStatArrow"
73179
role="presentation"
74180
viewBox="0 0 24 24"
@@ -92,25 +198,53 @@ exports[`"CStatArrow" should display corresponding icon for "type" prop 2`] = `
92198

93199
exports[`should render correctly 1`] = `
94200
<DocumentFragment>
95-
<div
96-
class="css-i8ou7a"
201+
.emotion-3 {
202+
-webkit-flex: 1;
203+
-ms-flex: 1;
204+
flex: 1;
205+
padding-right: 1rem;
206+
position: relative;
207+
}
208+
209+
.emotion-0 {
210+
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
211+
font-weight: 500;
212+
font-size: 0.875rem;
213+
}
214+
215+
.emotion-1 {
216+
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
217+
font-size: 1.5rem;
218+
vertical-align: baseline;
219+
font-weight: 600;
220+
}
221+
222+
.emotion-2 {
223+
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
224+
font-size: 0.875rem;
225+
opacity: 0.8;
226+
margin-bottom: 0.5rem;
227+
}
228+
229+
<div
230+
class="emotion-3"
97231
data-chakra-component="CStat"
98232
>
99233
<p
100-
class="css-zb0vz7"
234+
class="emotion-0"
101235
data-chakra-component="CStatLabel"
102236
>
103237
Collected Fees
104238
</p>
105239
<p
106-
class="css-1ecn2q9"
240+
class="emotion-1"
107241
data-chakra-component="CStatNumber"
108242
>
109243
£0.00
110244
</p>
111245
<p
112-
class="css-1x22fzm"
113-
data-chakra-component="CText"
246+
class="emotion-2"
247+
data-chakra-component="CStatHelperText"
114248
>
115249
Feb 12 - Feb 28
116250
</p>

0 commit comments

Comments
 (0)