Skip to content

Commit 2dddad3

Browse files
committed
Update baselines
1 parent df3ba4d commit 2dddad3

11 files changed

+149
-56
lines changed

src/__tests__/baselines/componentIdPrefix/issue33.ts.baseline

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -45,5 +45,13 @@ TypeScript after transform:
4545
const Button4 = _.extend \` color: red \`;
4646

4747

48+
TypeScript after transpile module:
49+
50+
const Button1 = Button.extend \` color: red \`;
51+
const Button2 = $.extend \` color: red \`;
52+
const Button3 = jQuery.extend \` color: red \`;
53+
const Button4 = _.extend \` color: red \`;
54+
55+
4856

4957
`;

src/__tests__/baselines/componentIdPrefix/multiple-components.tsx.baseline

Lines changed: 20 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ Source code:
2424

2525
TypeScript before transform:
2626

27-
import styled from "styled-components";
27+
import styled from 'styled-components';
2828
export function createButtons() {
2929
const A = styled.button \` color: red; \`;
3030
const B = styled(A) \` color: blue; \`;
@@ -41,13 +41,28 @@ TypeScript after transform:
4141

4242
import styled from 'styled-components';
4343
export function createButtons() {
44-
const A = styled.button.withConfig({ displayName: "test-A", componentId: "test-hana72" }) \` color: red; \`;
45-
const B = styled(A).withConfig({ displayName: "test-B", componentId: "test-ke4nds" }) \` color: blue; \`;
44+
const A = styled.button.withConfig({ displayName: "test-A", componentId: "test-h2cmto" }) \` color: red; \`;
45+
const B = styled(A).withConfig({ displayName: "test-B", componentId: "test-3cja5" }) \` color: blue; \`;
46+
return { A, B };
47+
}
48+
export function createDivs() {
49+
const A = styled.div.withConfig({ displayName: "test-A", componentId: "test-1oubriv" }) \` color: green; \`;
50+
const B = styled(A).withConfig({ displayName: "test-B", componentId: "test-lfixbl" }) \` color: yellow; \`;
51+
return { A, B };
52+
}
53+
54+
55+
TypeScript after transpile module:
56+
57+
import styled from 'styled-components';
58+
export function createButtons() {
59+
const A = styled.button.withConfig({ displayName: "test-A", componentId: "test-1lfj0gb" }) \` color: red; \`;
60+
const B = styled(A).withConfig({ displayName: "test-B", componentId: "test-kjhsv6" }) \` color: blue; \`;
4661
return { A, B };
4762
}
4863
export function createDivs() {
49-
const A = styled.div.withConfig({ displayName: "test-A", componentId: "test-1q7vmnt" }) \` color: green; \`;
50-
const B = styled(A).withConfig({ displayName: "test-B", componentId: "test-7q8oop" }) \` color: yellow; \`;
64+
const A = styled.div.withConfig({ displayName: "test-A", componentId: "test-wzcq75" }) \` color: green; \`;
65+
const B = styled(A).withConfig({ displayName: "test-B", componentId: "test-6zek9o" }) \` color: yellow; \`;
5166
return { A, B };
5267
}
5368

src/__tests__/baselines/componentIdPrefix/sample1.ts.baseline

Lines changed: 31 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@ Source code:
4040

4141
TypeScript before transform:
4242

43-
import styled from "styled-components";
43+
import styled from 'styled-components';
4444
const Button = styled.button \`
4545
color: red;
4646
\`;
@@ -60,22 +60,22 @@ TypeScript before transform:
6060
export const SmallButton = Button.extend \`
6161
font-size: .7em;
6262
\`;
63-
const MiniButton = styled(SmallButton).attrs({ size: "mini" }) \`
63+
const MiniButton = styled(SmallButton).attrs({ size: 'mini' }) \`
6464
font-size: .1em;
6565
\`;
6666

6767

6868
TypeScript after transform:
6969

7070
import styled from 'styled-components';
71-
const Button = styled.button.withConfig({ displayName: "test-Button", componentId: "test-1okqsxw" }) \`
71+
const Button = styled.button.withConfig({ displayName: "test-Button", componentId: "test-uezo0r" }) \`
7272
color: red;
7373
\`;
7474
declare const nonStyled: any;
7575
const NonButton = nonStyled.button \`
7676
yo
7777
\`;
78-
const OtherButton = styled(Button).withConfig({ displayName: "test-OtherButton", componentId: "test-ce0fkl" }) \`
78+
const OtherButton = styled(Button).withConfig({ displayName: "test-OtherButton", componentId: "test-1x4ml5" }) \`
7979
color: blue;
8080
\`;
8181
const SuperButton = Button.extend \`
@@ -87,7 +87,33 @@ TypeScript after transform:
8787
export const SmallButton = Button.extend \`
8888
font-size: .7em;
8989
\`;
90-
const MiniButton = styled(SmallButton).attrs({ size: "mini" }).withConfig({ displayName: "test-MiniButton", componentId: "test-ndnumj" }) \`
90+
const MiniButton = styled(SmallButton).attrs({ size: 'mini' }).withConfig({ displayName: "test-MiniButton", componentId: "test-1ktoxg0" }) \`
91+
font-size: .1em;
92+
\`;
93+
94+
95+
TypeScript after transpile module:
96+
97+
import styled from 'styled-components';
98+
const Button = styled.button.withConfig({ displayName: "test-Button", componentId: "test-1nbxxpw" }) \`
99+
color: red;
100+
\`;
101+
const NonButton = nonStyled.button \`
102+
yo
103+
\`;
104+
const OtherButton = styled(Button).withConfig({ displayName: "test-OtherButton", componentId: "test-17xltiv" }) \`
105+
color: blue;
106+
\`;
107+
const SuperButton = Button.extend \`
108+
color: super;
109+
\`;
110+
export default styled.link.withConfig({ componentId: "test-ep20on" }) \`
111+
color: black;
112+
\`;
113+
export const SmallButton = Button.extend \`
114+
font-size: .7em;
115+
\`;
116+
const MiniButton = styled(SmallButton).attrs({ size: 'mini' }).withConfig({ displayName: "test-MiniButton", componentId: "test-am1bk" }) \`
91117
font-size: .1em;
92118
\`;
93119

src/__tests__/baselines/componentIdPrefix/sample2.ts.baseline

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ Source code:
1515

1616
TypeScript before transform:
1717

18-
import styled from "styled-components";
18+
import styled from 'styled-components';
1919
const styled2 = styled;
2020
const NonButton = styled.button;
2121
const NonStyled = styled \` color: red; \`;
@@ -28,7 +28,16 @@ TypeScript after transform:
2828
const styled2 = styled;
2929
const NonButton = styled.button;
3030
const NonStyled = styled \` color: red; \`;
31-
const Link = styled(NonStyled).withConfig({ displayName: "test-Link", componentId: "test-1xlc242" }) \` color: red; \`;
31+
const Link = styled(NonStyled).withConfig({ displayName: "test-Link", componentId: "test-1gbt9xq" }) \` color: red; \`;
32+
33+
34+
TypeScript after transpile module:
35+
36+
import styled from 'styled-components';
37+
const styled2 = styled;
38+
const NonButton = styled.button;
39+
const NonStyled = styled \` color: red; \`;
40+
const Link = styled(NonStyled).withConfig({ displayName: "test-Link", componentId: "test-gbrvon" }) \` color: red; \`;
3241

3342

3443

src/__tests__/baselines/componentIdPrefix/sample3.tsx.baseline

Lines changed: 15 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -24,14 +24,14 @@ Source code:
2424

2525
TypeScript before transform:
2626

27-
import * as React from "react";
28-
import styled from "../themed-styled";
29-
import { SmallButton } from "./sample1";
27+
import * as React from 'react';
28+
import styled from '../themed-styled';
29+
import { SmallButton } from './sample1';
3030
interface LabelProps {
3131
size: number;
3232
}
3333
const CustomLabel = styled.label \`
34-
font-size: \${(props: LabelProps) => props.size + "px"}
34+
font-size: \${(props: LabelProps) => props.size + 'px'}
3535
\`;
3636
const LabeledLink = () => <SmallButton />;
3737
export default CustomLabel;
@@ -45,12 +45,22 @@ TypeScript after transform:
4545
interface LabelProps {
4646
size: number;
4747
}
48-
const CustomLabel = styled.label.withConfig({ displayName: "test-CustomLabel", componentId: "test-1ydgk9x" }) \`
48+
const CustomLabel = styled.label.withConfig({ displayName: "test-CustomLabel", componentId: "test-xtd6b" }) \`
4949
font-size: \${(props: LabelProps) => props.size + 'px'}
5050
\`;
5151
const LabeledLink = () => <SmallButton />;
5252
export default CustomLabel;
5353

5454

55+
TypeScript after transpile module:
56+
57+
import styled from '../themed-styled';
58+
const CustomLabel = styled.label.withConfig({ displayName: "test-CustomLabel", componentId: "test-mqylua" }) \`
59+
font-size: \${(props) => props.size + 'px'}
60+
\`;
61+
const LabeledLink = () => />;;
62+
export default CustomLabel;
63+
64+
5565

5666
`;

src/__tests__/baselines/componentIdPrefix/style-objects.ts.baseline

Lines changed: 36 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -42,40 +42,40 @@ TypeScript before transform:
4242

4343
declare const styled: any;
4444
const Button = styled.button({
45-
color: "red"
45+
color: 'red'
4646
});
4747
declare const nonStyled: any;
4848
const NonButton = nonStyled.button({
49-
color: "red"
49+
color: 'red'
5050
});
5151
const OtherButton = styled(Button)({
52-
color: "blue"
52+
color: 'blue'
5353
});
5454
const SuperButton = Button.extend({
55-
color: "super"
55+
color: 'super'
5656
});
5757
export default styled.link({
58-
color: "black"
58+
color: 'black'
5959
});
6060
export const SmallButton = Button.extend({
61-
fontSize: ".7em"
61+
fontSize: '.7em'
6262
});
63-
const MiniButton = styled(SmallButton).attrs({ size: "mini" })({
64-
fontSize: ".1em"
63+
const MiniButton = styled(SmallButton).attrs({ size: 'mini' })({
64+
fontSize: '.1em'
6565
});
6666

6767

6868
TypeScript after transform:
6969

7070
declare const styled: any;
71-
const Button = styled.button.withConfig({ displayName: "test-Button", componentId: "test-7b7p9e" })({
71+
const Button = styled.button.withConfig({ displayName: "test-Button", componentId: "test-1qkmci6" })({
7272
color: 'red'
7373
});
7474
declare const nonStyled: any;
7575
const NonButton = nonStyled.button({
7676
color: 'red'
7777
});
78-
const OtherButton = styled(Button).withConfig({ displayName: "test-OtherButton", componentId: "test-14ah7t" })({
78+
const OtherButton = styled(Button).withConfig({ displayName: "test-OtherButton", componentId: "test-6fha6t" })({
7979
color: 'blue'
8080
});
8181
const SuperButton = Button.extend({
@@ -87,7 +87,32 @@ TypeScript after transform:
8787
export const SmallButton = Button.extend({
8888
fontSize: '.7em'
8989
});
90-
const MiniButton = styled(SmallButton).attrs({ size: "mini" }).withConfig({ displayName: "test-MiniButton", componentId: "test-ad4g7l" })({
90+
const MiniButton = styled(SmallButton).attrs({ size: 'mini' }).withConfig({ displayName: "test-MiniButton", componentId: "test-nrep0p" })({
91+
fontSize: '.1em'
92+
});
93+
94+
95+
TypeScript after transpile module:
96+
97+
const Button = styled.button.withConfig({ displayName: "test-Button", componentId: "test-1nbxxpw" })({
98+
color: 'red'
99+
});
100+
const NonButton = nonStyled.button({
101+
color: 'red'
102+
});
103+
const OtherButton = styled(Button).withConfig({ displayName: "test-OtherButton", componentId: "test-17xltiv" })({
104+
color: 'blue'
105+
});
106+
const SuperButton = Button.extend({
107+
color: 'super'
108+
});
109+
export default styled.link.withConfig({ componentId: "test-ep20on" })({
110+
color: 'black'
111+
});
112+
export const SmallButton = Button.extend({
113+
fontSize: '.7em'
114+
});
115+
const MiniButton = styled(SmallButton).attrs({ size: 'mini' }).withConfig({ displayName: "test-MiniButton", componentId: "test-am1bk" })({
91116
fontSize: '.1em'
92117
});
93118

src/__tests__/baselines/ssr/multiple-components.tsx.baseline

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -41,13 +41,13 @@ TypeScript after transform:
4141

4242
import styled from 'styled-components';
4343
export function createButtons() {
44-
const A = styled.button.withConfig({ displayName: "A", componentId: "sc-hana72" }) \` color: red; \`;
45-
const B = styled(A).withConfig({ displayName: "B", componentId: "sc-ke4nds" }) \` color: blue; \`;
44+
const A = styled.button.withConfig({ displayName: "A", componentId: "-hana72" }) \` color: red; \`;
45+
const B = styled(A).withConfig({ displayName: "B", componentId: "-ke4nds" }) \` color: blue; \`;
4646
return { A, B };
4747
}
4848
export function createDivs() {
49-
const A = styled.div.withConfig({ displayName: "A", componentId: "sc-1q7vmnt" }) \` color: green; \`;
50-
const B = styled(A).withConfig({ displayName: "B", componentId: "sc-7q8oop" }) \` color: yellow; \`;
49+
const A = styled.div.withConfig({ displayName: "A", componentId: "-1q7vmnt" }) \` color: green; \`;
50+
const B = styled(A).withConfig({ displayName: "B", componentId: "-7q8oop" }) \` color: yellow; \`;
5151
return { A, B };
5252
}
5353

@@ -56,13 +56,13 @@ TypeScript after transpile module:
5656

5757
import styled from 'styled-components';
5858
export function createButtons() {
59-
const A = styled.button.withConfig({ displayName: "A", componentId: "sc-67koye" }) \` color: red; \`;
60-
const B = styled(A).withConfig({ displayName: "B", componentId: "sc-1svbc9u" }) \` color: blue; \`;
59+
const A = styled.button.withConfig({ displayName: "A", componentId: "-67koye" }) \` color: red; \`;
60+
const B = styled(A).withConfig({ displayName: "B", componentId: "-1svbc9u" }) \` color: blue; \`;
6161
return { A, B };
6262
}
6363
export function createDivs() {
64-
const A = styled.div.withConfig({ displayName: "A", componentId: "sc-uo2lv8" }) \` color: green; \`;
65-
const B = styled(A).withConfig({ displayName: "B", componentId: "sc-1cxyj9q" }) \` color: yellow; \`;
64+
const A = styled.div.withConfig({ displayName: "A", componentId: "-uo2lv8" }) \` color: green; \`;
65+
const B = styled(A).withConfig({ displayName: "B", componentId: "-1cxyj9q" }) \` color: yellow; \`;
6666
return { A, B };
6767
}
6868

src/__tests__/baselines/ssr/sample1.ts.baseline

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -68,52 +68,52 @@ TypeScript before transform:
6868
TypeScript after transform:
6969

7070
import styled from 'styled-components';
71-
const Button = styled.button.withConfig({ displayName: "Button", componentId: "sc-1okqsxw" }) \`
71+
const Button = styled.button.withConfig({ displayName: "Button", componentId: "-1okqsxw" }) \`
7272
color: red;
7373
\`;
7474
declare const nonStyled: any;
7575
const NonButton = nonStyled.button \`
7676
yo
7777
\`;
78-
const OtherButton = styled(Button).withConfig({ displayName: "OtherButton", componentId: "sc-ce0fkl" }) \`
78+
const OtherButton = styled(Button).withConfig({ displayName: "OtherButton", componentId: "-ce0fkl" }) \`
7979
color: blue;
8080
\`;
8181
const SuperButton = Button.extend \`
8282
color: super;
8383
\`;
84-
export default styled.link.withConfig({ componentId: "sc-vba0dl" }) \`
84+
export default styled.link.withConfig({ componentId: "-vba0dl" }) \`
8585
color: black;
8686
\`;
8787
export const SmallButton = Button.extend \`
8888
font-size: .7em;
8989
\`;
90-
const MiniButton = styled(SmallButton).attrs({ size: 'mini' }).withConfig({ displayName: "MiniButton", componentId: "sc-ndnumj" }) \`
90+
const MiniButton = styled(SmallButton).attrs({ size: 'mini' }).withConfig({ displayName: "MiniButton", componentId: "-ndnumj" }) \`
9191
font-size: .1em;
9292
\`;
9393

9494

9595
TypeScript after transpile module:
9696

9797
import styled from 'styled-components';
98-
const Button = styled.button.withConfig({ displayName: "Button", componentId: "sc-13dat8f" }) \`
98+
const Button = styled.button.withConfig({ displayName: "Button", componentId: "-13dat8f" }) \`
9999
color: red;
100100
\`;
101101
const NonButton = nonStyled.button \`
102102
yo
103103
\`;
104-
const OtherButton = styled(Button).withConfig({ displayName: "OtherButton", componentId: "sc-1pbo6g5" }) \`
104+
const OtherButton = styled(Button).withConfig({ displayName: "OtherButton", componentId: "-1pbo6g5" }) \`
105105
color: blue;
106106
\`;
107107
const SuperButton = Button.extend \`
108108
color: super;
109109
\`;
110-
export default styled.link.withConfig({ componentId: "sc-ep20on" }) \`
110+
export default styled.link.withConfig({ componentId: "-ep20on" }) \`
111111
color: black;
112112
\`;
113113
export const SmallButton = Button.extend \`
114114
font-size: .7em;
115115
\`;
116-
const MiniButton = styled(SmallButton).attrs({ size: 'mini' }).withConfig({ displayName: "MiniButton", componentId: "sc-1cgykmr" }) \`
116+
const MiniButton = styled(SmallButton).attrs({ size: 'mini' }).withConfig({ displayName: "MiniButton", componentId: "-1cgykmr" }) \`
117117
font-size: .1em;
118118
\`;
119119

src/__tests__/baselines/ssr/sample2.ts.baseline

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ TypeScript after transform:
2828
const styled2 = styled;
2929
const NonButton = styled.button;
3030
const NonStyled = styled \` color: red; \`;
31-
const Link = styled(NonStyled).withConfig({ displayName: "Link", componentId: "sc-1xlc242" }) \` color: red; \`;
31+
const Link = styled(NonStyled).withConfig({ displayName: "Link", componentId: "-1xlc242" }) \` color: red; \`;
3232

3333

3434
TypeScript after transpile module:
@@ -37,7 +37,7 @@ TypeScript after transpile module:
3737
const styled2 = styled;
3838
const NonButton = styled.button;
3939
const NonStyled = styled \` color: red; \`;
40-
const Link = styled(NonStyled).withConfig({ displayName: "Link", componentId: "sc-z7xxm1" }) \` color: red; \`;
40+
const Link = styled(NonStyled).withConfig({ displayName: "Link", componentId: "-z7xxm1" }) \` color: red; \`;
4141

4242

4343

0 commit comments

Comments
 (0)