Skip to content
This repository was archived by the owner on Mar 26, 2022. It is now read-only.

Commit 46cf3d8

Browse files
solomontangsolomontang
authored
Merge pull request #1036 from openlattice/task/APPS-2513-styled-components-v5
Task/apps 2513 styled components v5
2 parents 6031940 + 2e3876e commit 46cf3d8

File tree

41 files changed

+24641
-42901
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

41 files changed

+24641
-42901
lines changed

‎config/babel/babel.config.js‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,10 @@ module.exports = {
33
'@babel/plugin-proposal-class-properties',
44
'@babel/plugin-proposal-object-rest-spread',
55
'@babel/plugin-transform-runtime',
6-
'babel-plugin-styled-components',
6+
[
7+
'babel-plugin-styled-components',
8+
{ ssr: false, displayName: false, namespace: 'sc' },
9+
],
710
['babel-plugin-transform-imports', {
811
'@fortawesome/pro-duotone-svg-icons': {
912
transform: (importName) => `@fortawesome/pro-duotone-svg-icons/${importName}`,

‎package-lock.json‎

Lines changed: 17 additions & 55 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -89,7 +89,7 @@
8989
"flow-bin": "~0.131.0",
9090
"import-sort-style-openlattice": "~0.1.0",
9191
"jest": "~26.6.3",
92-
"jest-styled-components": "~6.3.0",
92+
"jest-styled-components": "~7.0.3",
9393
"npm-run-all": "~4.1.5",
9494
"raw-loader": "~4.0.2",
9595
"react": "~16.13.0",
@@ -98,7 +98,7 @@
9898
"react-router-dom": "~5.2.0",
9999
"rimraf": "~3.0.2",
100100
"style-loader": "~2.0.0",
101-
"styled-components": "~4.4.0",
101+
"styled-components": "~5.2.1",
102102
"stylelint": "~13.9.0",
103103
"stylelint-config-standard": "~20.0.0",
104104
"stylelint-config-styled-components": "~0.1.1",

‎src/badge/src/components/__snapshots__/Badge.test.js.snap‎

Lines changed: 24 additions & 148 deletions
Original file line numberDiff line numberDiff line change
@@ -16,47 +16,16 @@ exports[`Badge snapshots default max value should be displayed 1`] = `
1616
max={999}
1717
mode="default"
1818
>
19-
<Badge__BadgeWrapper
19+
<styled.span
2020
mode="default"
2121
>
22-
<StyledComponent
23-
forwardedComponent={
24-
Object {
25-
"$$typeof": Symbol(react.forward_ref),
26-
"attrs": Array [],
27-
"componentStyle": ComponentStyle {
28-
"componentId": "Badge__BadgeWrapper-sc-1kfg7sp-0",
29-
"isStatic": false,
30-
"lastClassName": "c0",
31-
"rules": Array [
32-
"background-color:",
33-
[Function],
34-
";border-radius:2em;color:",
35-
[Function],
36-
";font-size:12px;font-weight:600;padding:0.1875em 0.5em;text-align:center;",
37-
],
38-
},
39-
"displayName": "Badge__BadgeWrapper",
40-
"foldedComponentIds": Array [],
41-
"render": [Function],
42-
"styledComponentId": "Badge__BadgeWrapper-sc-1kfg7sp-0",
43-
"target": "span",
44-
"toString": [Function],
45-
"warnTooManyClasses": [Function],
46-
"withComponent": [Function],
47-
}
48-
}
49-
forwardedRef={null}
22+
<span
23+
className="c0"
5024
mode="default"
5125
>
52-
<span
53-
className="c0"
54-
mode="default"
55-
>
56-
999+
57-
</span>
58-
</StyledComponent>
59-
</Badge__BadgeWrapper>
26+
999+
27+
</span>
28+
</styled.span>
6029
</Badge>
6130
`;
6231

@@ -76,47 +45,16 @@ exports[`Badge snapshots should match snapshot 1`] = `
7645
max={999}
7746
mode="default"
7847
>
79-
<Badge__BadgeWrapper
48+
<styled.span
8049
mode="default"
8150
>
82-
<StyledComponent
83-
forwardedComponent={
84-
Object {
85-
"$$typeof": Symbol(react.forward_ref),
86-
"attrs": Array [],
87-
"componentStyle": ComponentStyle {
88-
"componentId": "Badge__BadgeWrapper-sc-1kfg7sp-0",
89-
"isStatic": false,
90-
"lastClassName": "c0",
91-
"rules": Array [
92-
"background-color:",
93-
[Function],
94-
";border-radius:2em;color:",
95-
[Function],
96-
";font-size:12px;font-weight:600;padding:0.1875em 0.5em;text-align:center;",
97-
],
98-
},
99-
"displayName": "Badge__BadgeWrapper",
100-
"foldedComponentIds": Array [],
101-
"render": [Function],
102-
"styledComponentId": "Badge__BadgeWrapper-sc-1kfg7sp-0",
103-
"target": "span",
104-
"toString": [Function],
105-
"warnTooManyClasses": [Function],
106-
"withComponent": [Function],
107-
}
108-
}
109-
forwardedRef={null}
51+
<span
52+
className="c0"
11053
mode="default"
11154
>
112-
<span
113-
className="c0"
114-
mode="default"
115-
>
116-
10
117-
</span>
118-
</StyledComponent>
119-
</Badge__BadgeWrapper>
55+
10
56+
</span>
57+
</styled.span>
12058
</Badge>
12159
`;
12260

@@ -136,47 +74,16 @@ exports[`Badge snapshots text should show count and not max 1`] = `
13674
max="99"
13775
mode="default"
13876
>
139-
<Badge__BadgeWrapper
77+
<styled.span
14078
mode="default"
14179
>
142-
<StyledComponent
143-
forwardedComponent={
144-
Object {
145-
"$$typeof": Symbol(react.forward_ref),
146-
"attrs": Array [],
147-
"componentStyle": ComponentStyle {
148-
"componentId": "Badge__BadgeWrapper-sc-1kfg7sp-0",
149-
"isStatic": false,
150-
"lastClassName": "c0",
151-
"rules": Array [
152-
"background-color:",
153-
[Function],
154-
";border-radius:2em;color:",
155-
[Function],
156-
";font-size:12px;font-weight:600;padding:0.1875em 0.5em;text-align:center;",
157-
],
158-
},
159-
"displayName": "Badge__BadgeWrapper",
160-
"foldedComponentIds": Array [],
161-
"render": [Function],
162-
"styledComponentId": "Badge__BadgeWrapper-sc-1kfg7sp-0",
163-
"target": "span",
164-
"toString": [Function],
165-
"warnTooManyClasses": [Function],
166-
"withComponent": [Function],
167-
}
168-
}
169-
forwardedRef={null}
80+
<span
81+
className="c0"
17082
mode="default"
17183
>
172-
<span
173-
className="c0"
174-
mode="default"
175-
>
176-
82
177-
</span>
178-
</StyledComponent>
179-
</Badge__BadgeWrapper>
84+
82
85+
</span>
86+
</styled.span>
18087
</Badge>
18188
`;
18289

@@ -196,46 +103,15 @@ exports[`Badge snapshots text should show max and not count 1`] = `
196103
max="99"
197104
mode="default"
198105
>
199-
<Badge__BadgeWrapper
106+
<styled.span
200107
mode="default"
201108
>
202-
<StyledComponent
203-
forwardedComponent={
204-
Object {
205-
"$$typeof": Symbol(react.forward_ref),
206-
"attrs": Array [],
207-
"componentStyle": ComponentStyle {
208-
"componentId": "Badge__BadgeWrapper-sc-1kfg7sp-0",
209-
"isStatic": false,
210-
"lastClassName": "c0",
211-
"rules": Array [
212-
"background-color:",
213-
[Function],
214-
";border-radius:2em;color:",
215-
[Function],
216-
";font-size:12px;font-weight:600;padding:0.1875em 0.5em;text-align:center;",
217-
],
218-
},
219-
"displayName": "Badge__BadgeWrapper",
220-
"foldedComponentIds": Array [],
221-
"render": [Function],
222-
"styledComponentId": "Badge__BadgeWrapper-sc-1kfg7sp-0",
223-
"target": "span",
224-
"toString": [Function],
225-
"warnTooManyClasses": [Function],
226-
"withComponent": [Function],
227-
}
228-
}
229-
forwardedRef={null}
109+
<span
110+
className="c0"
230111
mode="default"
231112
>
232-
<span
233-
className="c0"
234-
mode="default"
235-
>
236-
100
237-
</span>
238-
</StyledComponent>
239-
</Badge__BadgeWrapper>
113+
100
114+
</span>
115+
</styled.span>
240116
</Badge>
241117
`;

0 commit comments

Comments
 (0)