Skip to content

Commit 6df7b8d

Browse files
9renpoto9renpoto
committed
feat(types): Added TypeScript definitions
1 parent 60b6eff commit 6df7b8d

File tree

3 files changed

+408
-0
lines changed

3 files changed

+408
-0
lines changed

‎types/index-tests.tsx‎

Lines changed: 292 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,292 @@
1+
import * as React from "react";
2+
import { TwitterTimelineEmbed, TwitterFollowButton, TwitterHashtagButton, TwitterShareButton, TwitterMentionButton, TwitterTweetEmbed, TwitterMomentShare, TwitterDMButton, TwitterVideoEmbed, TwitterOnAirButton } from ".";
3+
4+
export const example = () => (
5+
<>
6+
<TwitterTimelineEmbed
7+
sourceType={"profile"}
8+
screenName={"saurabhnemade"}
9+
options={{ height: 400 }}
10+
/>
11+
<TwitterTimelineEmbed
12+
sourceType={"profile"}
13+
userId={1934309676}
14+
options={{ height: 400 }}
15+
/>
16+
<TwitterTimelineEmbed
17+
sourceType={"likes"}
18+
screenName={"saurabhnemade"}
19+
options={{ height: 400 }}
20+
/>
21+
<TwitterTimelineEmbed
22+
sourceType={"likes"}
23+
userId={1934309676}
24+
options={{ height: 400 }}
25+
/>
26+
<TwitterTimelineEmbed
27+
sourceType={"list"}
28+
ownerScreenName={"palafo"}
29+
slug={"breakingnews"}
30+
options={{ height: 400 }}
31+
/>
32+
<TwitterTimelineEmbed
33+
sourceType={"list"}
34+
id={8044403}
35+
options={{ height: 400 }}
36+
/>
37+
<TwitterTimelineEmbed
38+
sourceType={"collection"}
39+
id={"576828964162965504"}
40+
options={{ height: 400 }}
41+
/>
42+
<TwitterTimelineEmbed
43+
sourceType={"url"}
44+
url={"https://twitter.com/NYTNow/timelines/576828964162965504"}
45+
options={{ height: 400 }}
46+
/>
47+
<TwitterTimelineEmbed
48+
sourceType={"url"}
49+
url={"https://twitter.com/rahul581"}
50+
options={{ height: 400 }}
51+
/>
52+
<TwitterTimelineEmbed
53+
sourceType={"url"}
54+
url={"https://twitter.com/mashable/lists/social-media"}
55+
options={{ height: 400 }}
56+
/>
57+
<TwitterTimelineEmbed
58+
sourceType={"url"}
59+
url={"https://twitter.com/ladygaga/likes"}
60+
options={{ height: 400 }}
61+
/>
62+
<TwitterTimelineEmbed
63+
sourceType={"widget"}
64+
widgetId={"539487832448843776"}
65+
options={{ height: 400 }}
66+
/>
67+
<TwitterTimelineEmbed
68+
sourceType={"widget"}
69+
widgetId={"539487832448843776"}
70+
autoHeight
71+
/>
72+
<TwitterTimelineEmbed
73+
sourceType={"widget"}
74+
widgetId={"539487832448843776"}
75+
autoHeight
76+
/>
77+
<TwitterTimelineEmbed
78+
sourceType={"widget"}
79+
widgetId={"539487832448843776"}
80+
autoHeight
81+
/>
82+
<TwitterTimelineEmbed
83+
sourceType={"timeline"}
84+
id={"539487832448843776"}
85+
theme={"dark"}
86+
options={{ height: 400 }}
87+
/>
88+
<TwitterTimelineEmbed
89+
sourceType={"timeline"}
90+
id={"539487832448843776"}
91+
theme={"light"}
92+
options={{ height: 400 }}
93+
/>
94+
<TwitterTimelineEmbed
95+
sourceType={"timeline"}
96+
id={"539487832448843776"}
97+
linkColor={"#F44336"}
98+
theme={"dark"}
99+
options={{ height: 400 }}
100+
/>
101+
<TwitterTimelineEmbed
102+
sourceType={"timeline"}
103+
id={"539487832448843776"}
104+
linkColor={"#CDDC39"}
105+
theme={"dark"}
106+
options={{ height: 400 }}
107+
/>
108+
<TwitterTimelineEmbed
109+
sourceType={"timeline"}
110+
id={"539487832448843776"}
111+
linkColor={"#4CAF50"}
112+
theme={"dark"}
113+
options={{ height: 400 }}
114+
/>
115+
<TwitterTimelineEmbed
116+
sourceType={"timeline"}
117+
id={"539487832448843776"}
118+
borderColor={"#F44336"}
119+
theme={"dark"}
120+
options={{ height: 400 }}
121+
/>
122+
<TwitterTimelineEmbed
123+
sourceType={"timeline"}
124+
id={"539487832448843776"}
125+
borderColor={"#CDDC39"}
126+
theme={"dark"}
127+
options={{ height: 400 }}
128+
/>
129+
<TwitterTimelineEmbed
130+
sourceType={"timeline"}
131+
id={"539487832448843776"}
132+
borderColor={"#4CAF50"}
133+
theme={"dark"}
134+
options={{ height: 400 }}
135+
/>
136+
<TwitterTimelineEmbed
137+
sourceType={"timeline"}
138+
id={"539487832448843776"}
139+
theme={"dark"}
140+
options={{ height: 400 }}
141+
/>
142+
<TwitterTimelineEmbed
143+
sourceType={"timeline"}
144+
id={"539487832448843776"}
145+
theme={"dark"}
146+
noHeader
147+
options={{ height: 400 }}
148+
/>
149+
<TwitterTimelineEmbed
150+
sourceType={"timeline"}
151+
id={"539487832448843776"}
152+
theme={"dark"}
153+
options={{ height: 400 }}
154+
/>
155+
<TwitterTimelineEmbed
156+
sourceType={"timeline"}
157+
id={"539487832448843776"}
158+
theme={"dark"}
159+
noFooter
160+
options={{ height: 400 }}
161+
/>
162+
<TwitterTimelineEmbed
163+
sourceType={"timeline"}
164+
id={"539487832448843776"}
165+
theme={"dark"}
166+
options={{ height: 400 }}
167+
/>
168+
<TwitterTimelineEmbed
169+
sourceType={"timeline"}
170+
id={"539487832448843776"}
171+
theme={"dark"}
172+
noHeader
173+
noFooter
174+
options={{ height: 400 }}
175+
/>
176+
<TwitterTimelineEmbed
177+
sourceType={"timeline"}
178+
id={"539487832448843776"}
179+
options={{ height: 400 }}
180+
theme={"dark"}
181+
/>
182+
<TwitterTimelineEmbed
183+
sourceType={"timeline"}
184+
id={"539487832448843776"}
185+
theme={"dark"}
186+
options={{ height: 400 }}
187+
noBorders
188+
/>
189+
<TwitterTimelineEmbed
190+
sourceType={"timeline"}
191+
id={"539487832448843776"}
192+
options={{ height: 400 }}
193+
theme={"dark"}
194+
/>
195+
<TwitterTimelineEmbed
196+
sourceType={"timeline"}
197+
id={"539487832448843776"}
198+
theme={"dark"}
199+
options={{ height: 400 }}
200+
noScrollbar
201+
/>
202+
<TwitterTimelineEmbed
203+
sourceType={"timeline"}
204+
id={"539487832448843776"}
205+
options={{ height: 400 }}
206+
theme={"dark"}
207+
/>
208+
<TwitterTimelineEmbed
209+
sourceType={"timeline"}
210+
id={"539487832448843776"}
211+
theme={"dark"}
212+
options={{ height: 400 }}
213+
transparent
214+
/>
215+
<TwitterTimelineEmbed
216+
sourceType={"timeline"}
217+
id={"539487832448843776"}
218+
options={{ height: 400 }}
219+
theme={"dark"}
220+
lang={"hi"}
221+
/>
222+
<TwitterTimelineEmbed
223+
sourceType={"timeline"}
224+
id={"539487832448843776"}
225+
theme={"dark"}
226+
options={{ height: 400 }}
227+
lang={"es"}
228+
/>
229+
<TwitterTimelineEmbed
230+
sourceType={"timeline"}
231+
id={"539487832448843776"}
232+
theme={"dark"}
233+
options={{ height: 400 }}
234+
lang={"fr"}
235+
/>
236+
<TwitterShareButton
237+
url={"https://facebook.com/saurabhnemade"}
238+
options={{ text: "#reactjs is awesome", via: "saurabhnemade" }}
239+
/>
240+
<TwitterShareButton
241+
url={"https://facebook.com/saurabhnemade"}
242+
options={{
243+
text: "#reactjs is awesome",
244+
via: "saurabhnemade",
245+
size: "large"
246+
}}
247+
/>
248+
<>
249+
<TwitterFollowButton screenName={"saurabhnemade"} />
250+
<TwitterFollowButton
251+
screenName={"saurabhnemade"}
252+
options={{ size: "large" }}
253+
/>
254+
</>
255+
<>
256+
<TwitterHashtagButton tag={"cybersecurity"} />
257+
<TwitterHashtagButton tag={"cybersecurity"} options={{ size: "large" }} />
258+
</>
259+
260+
<>
261+
<TwitterMentionButton screenName={"saurabhnemade"} />
262+
<TwitterMentionButton
263+
screenName={"saurabhnemade"}
264+
options={{ size: "large" }}
265+
/>
266+
</>
267+
268+
<TwitterTweetEmbed tweetId={"933354946111705097"} />
269+
<TwitterTweetEmbed tweetId={"1083592734038929408"} />
270+
<TwitterTweetEmbed
271+
tweetId={"1083592734038929408"}
272+
options={{ cards: "hidden" }}
273+
/>
274+
<TwitterTweetEmbed
275+
tweetId={"1083592734038929408"}
276+
onLoaded={tweetWidgetEl => {
277+
const tweetEl = tweetWidgetEl.shadowRoot.querySelector(
278+
".EmbeddedTweet"
279+
);
280+
tweetEl.style.border = "5px solid red";
281+
}}
282+
/>
283+
<TwitterMomentShare momentId="650667182356082688" />
284+
<TwitterDMButton id={1364031673} />
285+
<TwitterDMButton id={1364031673} options={{ size: "large" }} />
286+
287+
<TwitterVideoEmbed id={"560070183650213889"} />
288+
289+
<TwitterOnAirButton username={"KatmaiNPS"} />
290+
<TwitterOnAirButton username={"KatmaiNPS"} options={{ size: "large" }} />
291+
</>
292+
);

‎types/index.d.ts‎

Lines changed: 90 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,90 @@
1+
import * as React from 'react'
2+
3+
type TwitterTimelineEmbedBaseProps = {
4+
options?: any
5+
autoHeight?: boolean
6+
theme?: 'dark' | 'light'
7+
linkColor?: string
8+
borderColor?: string
9+
noHeader?: boolean
10+
noFooter?: boolean
11+
noBorders?: boolean
12+
noScrollbar?: boolean
13+
transparent?: boolean
14+
lang?: string
15+
}
16+
17+
type TwitterTimelineEmbedProps =
18+
| TwitterTimelineEmbedBaseProps & { sourceType: 'profile' | 'likes', screenName: string }
19+
| TwitterTimelineEmbedBaseProps & { sourceType: 'profile' | 'likes', userId: number }
20+
| TwitterTimelineEmbedBaseProps & { sourceType: 'list', ownerScreenName: string, slug: string }
21+
| TwitterTimelineEmbedBaseProps & { sourceType: 'list', id: number }
22+
| TwitterTimelineEmbedBaseProps & { sourceType: 'collection', id: string }
23+
| TwitterTimelineEmbedBaseProps & { sourceType: 'url', url: string }
24+
| TwitterTimelineEmbedBaseProps & { sourceType: 'widget', widgetId: string }
25+
| TwitterTimelineEmbedBaseProps & { sourceType: 'timeline', id: string }
26+
27+
export class TwitterTimelineEmbed extends React.Component<TwitterTimelineEmbedProps> {}
28+
29+
type TwitterFollowButtonProps = {
30+
screenName: string
31+
options?: any
32+
}
33+
34+
export class TwitterFollowButton extends React.Component<TwitterFollowButtonProps> {}
35+
36+
type TwitterHashtagButtonProps = {
37+
tag: string
38+
options?: any
39+
}
40+
41+
export class TwitterHashtagButton extends React.Component<TwitterHashtagButtonProps> {}
42+
43+
type TwitterShareButtonProps = {
44+
url: string
45+
options?: any
46+
}
47+
48+
export class TwitterShareButton extends React.Component<TwitterShareButtonProps> {}
49+
50+
type TwitterMentionButtonProps = {
51+
screenName: string
52+
options?: any
53+
}
54+
55+
export class TwitterMentionButton extends React.Component<TwitterMentionButtonProps> {}
56+
57+
type TwitterTweetEmbedProps = {
58+
tweetId: string
59+
options?: any
60+
onLoaded?: (elm: any) => void
61+
}
62+
63+
export class TwitterTweetEmbed extends React.Component<TwitterTweetEmbedProps> {}
64+
65+
type TwitterMomentShareProps = {
66+
momentId: string
67+
options?: any
68+
}
69+
70+
export class TwitterMomentShare extends React.Component<TwitterMomentShareProps> {}
71+
72+
type TwitterDMButtonProps = {
73+
id: number
74+
options?: any
75+
}
76+
77+
export class TwitterDMButton extends React.Component<TwitterDMButtonProps> {}
78+
79+
type TwitterVideoEmbedProps = {
80+
id: string
81+
}
82+
83+
export class TwitterVideoEmbed extends React.Component<TwitterVideoEmbedProps> {}
84+
85+
type TwitterOnAirButtonProps = {
86+
username: string
87+
options?: any
88+
}
89+
90+
export class TwitterOnAirButton extends React.Component<TwitterOnAirButtonProps> {}

0 commit comments

Comments
 (0)