Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings
This repository was archived by the owner on Nov 8, 2022. It is now read-only.

Commit4b26ca9

Browse files
authored
refactor(ts-js): more ts day3 (#1017)
* refactor(ts-workflow): styled-component workflow* refactor(ts-workflow): @/types -> @/spec
1 parent807f89f commit4b26ca9

File tree

324 files changed

+1463
-1010
lines changed

Some content is hidden

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

324 files changed

+1463
-1010
lines changed

‎.eslintrc.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ module.exports = {
3333
'@/Img':'src/components/Img',
3434
'@/SvgIcons':'src/components/SvgIcons',
3535
'@/i18n':'i18n',
36-
'@/types':'src/types',
36+
'@/spec':'src/spec',
3737
},
3838
extensions:['.js','.jsx','.ts','.tsx'],
3939
},

‎package.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -144,6 +144,7 @@
144144
"@types/mocha":"^8.2.1",
145145
"@types/ramda":"^0.27.38",
146146
"@types/react":"^17.0.3",
147+
"@types/styled-components":"^5.1.8",
147148
"@typescript-eslint/eslint-plugin":"^4.17.0",
148149
"@typescript-eslint/parser":"^4.17.0",
149150
"babel-eslint":"^10.0.2",
@@ -161,7 +162,7 @@
161162
"jest":"26.2.2",
162163
"npm-run-all":"^4.1.1",
163164
"plop":"2.7.4",
164-
"prettier":"2.0.5",
165+
"prettier":"2.2.1",
165166
"pretty-quick":"^1.10.0",
166167
"react-test-renderer":"16.10.0",
167168
"shelljs":"0.8.4",

‎src/components/AlertBar/styles/index.ts‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
11
importstyledfrom'styled-components'
22

3+
import{TTestable}from'@/spec'
34
// import Img from '@/Img'
45
// import { theme } from '@/utils'
56

6-
exportconstWrapper=styled.div.attrs((props)=>({
7-
'data-test-id':props.testid,
8-
}))`
7+
exportconstWrapper=styled.div.attrs(({ testid}:TTestable)=>({
8+
'data-test-id':testid,
9+
}))<TTestable>`
910
font-size: 14px;
1011
font-variant: tabular-nums;
1112
line-height: 1.5;

‎src/components/ArticleActionsPanel/styles/index.ts‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ export const Wrapper = styled.div`
99
padding-left: 10px;
1010
padding-bottom: 0;
1111
`
12-
exportconstOption=styled.div`
12+
exportconstOption=styled.div<{red:boolean}>`
1313
${css.flex('align-center')};
1414
color:${theme('banner.desc')};
1515
margin-bottom: 8px;
@@ -20,7 +20,11 @@ export const Option = styled.div`
2020
cursor: pointer;
2121
}
2222
`
23-
exportconstOptionIcon=styled(Img)`
23+
typeTOptionIcon={
24+
red:boolean
25+
reverse:boolean
26+
}
27+
exportconstOptionIcon=styled(Img)<TOptionIcon>`
2428
fill:${theme('banner.desc')};
2529
${css.size(18)};
2630
margin-right: 6px;

‎src/components/ArticleEditToolbar/styles/copyright_selector.ts‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
importstyledfrom'styled-components'
22

3+
import{TActive}from'@/spec'
34
import{theme,css}from'@/utils'
45
importImgfrom'@/Img'
56

@@ -14,12 +15,12 @@ export const Selector = styled.div`
1415
color:${theme('editor.title')};
1516
}
1617
`
17-
exportconstCheckIcon=styled(Img)`
18+
exportconstCheckIcon=styled(Img)<TActive>`
1819
fill:${theme('editor.content')};
1920
${css.size(18)};
2021
margin-top: 2px;
2122
margin-left: 3px;
22-
visibility:${({ active})=>(active ?'visiable' :'hidden')};
23+
visibility:${({ active})=>(active ?'visible' :'hidden')};
2324
`
2425
exportconstCheckText=styled.div`
2526
color:${theme('editor.content')};

‎src/components/ArticleItemPrefixLabel/styles/index.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import styled from 'styled-components'
33
import{theme,css,pixelAdd}from'@/utils'
44
importPinSVGfrom'@/SvgIcons/PinSVG'
55

6-
exportconstReadedLabel=styled.div`
6+
exportconstReadedLabel=styled.div<{topOffset:string}>`
77
background:${theme('thread.articleDigest')};
88
width: 8px;
99
height: 3px;

‎src/components/AvatarsRow/styles/index.ts‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import { theme, css } from '@/utils'
66
importImgFallbackfrom'@/components/ImgFallback'
77
import{getLiSize,getAvatarSize,getUlMarginRight}from'./metric'
88

9-
exportconstWrapper=styled.ul`
9+
exportconstWrapper=styled.ul<{total:number}>`
1010
${css.flex('align-center')};
1111
flex-direction: row-reverse;
1212
list-style-type: none;
@@ -15,7 +15,8 @@ export const Wrapper = styled.ul`
1515
margin-right:${({ total})=>getUlMarginRight(total)};
1616
`
1717
// height: 49px;
18-
constBaseAvatarItem=styled.li`
18+
typeTBaseAvatarItem={size:string;noHoverMargin:string}
19+
constBaseAvatarItem=styled.li<TBaseAvatarItem>`
1920
margin: 0px 0px 0px 0px;
2021
padding: 0px 0px 0px 0px;
2122
position: relative;
@@ -44,7 +45,7 @@ export const AvatarsItem = styled(BaseAvatarItem)`
4445
exportconstTotalOneOffset=styled.span`
4546
margin-right: 10px;
4647
`
47-
exportconstAvatarsImg=styled(Img)`
48+
exportconstAvatarsImg=styled(Img)<{size:string}>`
4849
border: 2px solid;
4950
border-color:${theme('thread.commentsUserBorder')};
5051
border-radius: 100px 100px 100px 100px;
@@ -59,7 +60,8 @@ export const AvatarsImg = styled(Img)`
5960
6061
text-align: center;
6162
`
62-
exportconstAvatarsMore=styled.span`
63+
typeTAvatarsMore={size:string;total:number}
64+
exportconstAvatarsMore=styled.span<TAvatarsMore>`
6365
${css.flex('align-both')};
6466
font-size: 14px;
6567
border-color: #113744;

‎src/components/AvatarsRow/styles/more_item.ts‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import { css, theme } from '@/utils'
55
import{WrapperasBaseWrapper,AvatarsMore}from'./index'
66
import{getAvatarSize,getMoreTextWidth}from'./metric'
77

8-
constBaseAvatarItem=styled.li`
8+
constBaseAvatarItem=styled.li<{size:string}>`
99
margin: 0px 0px 0px 0px;
1010
padding: 0px 0px 0px 0px;
1111
position: relative;
@@ -21,7 +21,8 @@ const BaseAvatarItem = styled.li`
2121
exportconstWrapper=styled(BaseAvatarItem)`
2222
${css.media.mobile`display: none`};
2323
`
24-
exportconstNumbersMore=styled(AvatarsMore)`
24+
typeTNumbersMore={size:string;total:number}
25+
exportconstNumbersMore=styled(AvatarsMore)<TNumbersMore>`
2526
height:${({ size})=>getAvatarSize(size)};
2627
width:${({ total})=>getMoreTextWidth(total)};
2728
font-weight: 400;
Lines changed: 17 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
importReactfrom'react'
2-
importTfrom'prop-types'
32

43
import{SIZE}from'@/constant'
4+
import{TButtonSize}from'@/spec'
55

66
import{
77
Wrapper,
@@ -10,8 +10,22 @@ import {
1010
RightButton,
1111
}from'../styles/or_button/horizontal_button'
1212

13-
// const OrButton = ({ children, onClick, size }) => {
14-
constHorizontalButton=({ onClick, size, activeKey, group})=>{
13+
typeTProps={
14+
activeKey:string
15+
size?:TButtonSize
16+
onClick:(key:string)=>void
17+
group:{
18+
key:string
19+
title:string
20+
}[]
21+
}
22+
23+
constHorizontalButton:React.FC<TProps>=({
24+
onClick,
25+
size=SIZE.SMALLasTButtonSize,
26+
activeKey,
27+
group,
28+
})=>{
1529
return(
1630
<Wrappersize={size}>
1731
<LeftButton
@@ -33,34 +47,4 @@ const HorizontalButton = ({ onClick, size, activeKey, group }) => {
3347
)
3448
}
3549

36-
HorizontalButton.propTypes={
37-
size:T.oneOf([SIZE.MEDIUM,SIZE.SMALL]),
38-
onClick:T.func,
39-
activeKey:T.string,
40-
group:T.arrayOf(
41-
T.shape({
42-
key:T.string,
43-
title:T.string,
44-
}),
45-
),
46-
}
47-
48-
HorizontalButton.defaultProps={
49-
// children: 'Button',
50-
size:SIZE.MEDIUM,
51-
// eslint-disable-next-line no-console
52-
onClick:console.log,
53-
activeKey:'hello',
54-
group:[
55-
{
56-
key:'hello',
57-
title:'hello',
58-
},
59-
{
60-
key:'cps',
61-
title:'cps',
62-
},
63-
],
64-
}
65-
6650
exportdefaultHorizontalButton

‎src/components/Buttons/styles/arrow_button.ts‎

Lines changed: 12 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,13 @@ import {
1111
getSimpleMargin,
1212
}from'./metircs/arrow_button'
1313

14-
exportconstWrapper=styled.div`
14+
typeTWrapper={
15+
disabled:boolean
16+
dimWhenIdle:boolean
17+
size:string
18+
width:number
19+
}
20+
exportconstWrapper=styled.div<TWrapper>`
1521
${css.flex('align-center')};
1622
opacity:${({ dimWhenIdle, disabled})=>
1723
dimWhenIdle||disabled ?'0.65' :1};
@@ -23,18 +29,19 @@ export const Wrapper = styled.div`
2329
}
2430
transition: all 0.25s;
2531
`
26-
exportconstText=styled.div`
32+
exportconstText=styled.div<{size:string}>`
2733
font-size:${({ size})=>getFontSize(size)};
2834
color: #327ca1;
2935
`
30-
exportconstIcon=styled(Img)`
36+
exportconstIcon=styled(Img)<{size:string}>`
3137
fill: #327ca1;
3238
width:${({ size})=>getIconSize(size)};
3339
height:${({ size})=>getIconSize(size)};
3440
display: block;
3541
transition: all 0.2s;
3642
`
37-
exportconstLeftIcon=styled(Icon)`
43+
typeTIcon={size:string;arrowStyle:string;disabled:boolean}
44+
exportconstLeftIcon=styled(Icon)<TIcon>`
3845
margin-right:${({ size, arrowStyle})=>
3946
arrowStyle==='default' ?getMargin(size) :getSimpleMargin(size)};
4047
@@ -51,7 +58,7 @@ export const LeftIcon = styled(Icon)`
5158
fill: #327ca1;
5259
}
5360
`
54-
exportconstRightIcon=styled(Icon)`
61+
exportconstRightIcon=styled(Icon)<TIcon>`
5562
margin-left:${({ size, arrowStyle})=>
5663
arrowStyle==='default' ?getMargin(size) :getSimpleMargin(size)};
5764

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp