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

Commit 4cc8cbd

Browse files
gregbergegregberge
committed
refactor: use create pattern to make tree shaking effective
1 parent 5a02542 commit 4cc8cbd

File tree

5 files changed

+238
-231
lines changed

5 files changed

+238
-231
lines changed

‎packages/shared/core/Col.js‎

Lines changed: 66 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -92,55 +92,69 @@ function getStyleFromProps(p) {
9292
return style
9393
}
9494

95-
const Col = createComponent(() => ({
96-
name: 'col',
97-
omitProps: ['xs', 'sm', 'md', 'lg', 'xl', 'oxs', 'osm', 'omd', 'olg', 'oxl'],
98-
style: getStyleFromProps,
99-
propTypes: {
100-
children: PropTypes.node,
101-
gutter: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
102-
xs: PropTypes.oneOfType([
103-
PropTypes.bool,
104-
PropTypes.string,
105-
PropTypes.number,
106-
]),
107-
sm: PropTypes.oneOfType([
108-
PropTypes.bool,
109-
PropTypes.string,
110-
PropTypes.number,
111-
]),
112-
md: PropTypes.oneOfType([
113-
PropTypes.bool,
114-
PropTypes.string,
115-
PropTypes.number,
116-
]),
117-
lg: PropTypes.oneOfType([
118-
PropTypes.bool,
119-
PropTypes.string,
120-
PropTypes.number,
121-
]),
122-
xl: PropTypes.oneOfType([
123-
PropTypes.bool,
124-
PropTypes.string,
125-
PropTypes.number,
126-
]),
127-
oxs: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
128-
osm: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
129-
omd: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
130-
olg: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
131-
oxl: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
132-
},
133-
}))
134-
135-
const Split = createComponent(() => ({
136-
name: 'col-split',
137-
style: () =>
138-
css`
139-
width: 100% !important;
140-
`,
141-
}))
142-
143-
/* #__PURE__ */
144-
Object.defineProperty(Col, 'Split', { value: Split })
145-
146-
export default Col
95+
function create() {
96+
const Col = createComponent(() => ({
97+
name: 'col',
98+
omitProps: [
99+
'xs',
100+
'sm',
101+
'md',
102+
'lg',
103+
'xl',
104+
'oxs',
105+
'osm',
106+
'omd',
107+
'olg',
108+
'oxl',
109+
],
110+
style: getStyleFromProps,
111+
propTypes: {
112+
children: PropTypes.node,
113+
gutter: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
114+
xs: PropTypes.oneOfType([
115+
PropTypes.bool,
116+
PropTypes.string,
117+
PropTypes.number,
118+
]),
119+
sm: PropTypes.oneOfType([
120+
PropTypes.bool,
121+
PropTypes.string,
122+
PropTypes.number,
123+
]),
124+
md: PropTypes.oneOfType([
125+
PropTypes.bool,
126+
PropTypes.string,
127+
PropTypes.number,
128+
]),
129+
lg: PropTypes.oneOfType([
130+
PropTypes.bool,
131+
PropTypes.string,
132+
PropTypes.number,
133+
]),
134+
xl: PropTypes.oneOfType([
135+
PropTypes.bool,
136+
PropTypes.string,
137+
PropTypes.number,
138+
]),
139+
oxs: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
140+
osm: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
141+
omd: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
142+
olg: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
143+
oxl: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
144+
},
145+
}))
146+
147+
const Split = createComponent(() => ({
148+
name: 'col-split',
149+
style: () =>
150+
css`
151+
width: 100% !important;
152+
`,
153+
}))
154+
155+
Col.Split = Split
156+
157+
return Col
158+
}
159+
160+
export default create()

‎packages/shared/core/Portal.js‎

Lines changed: 28 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -2,39 +2,37 @@ import { Component } from 'react'
22
import { createPortal } from 'react-dom'
33
import PropTypes from 'prop-types'
44

5-
class Portal extends Component {
6-
state = { node: null }
5+
function create() {
6+
class Portal extends Component {
7+
static propTypes = {
8+
type: PropTypes.string,
9+
children: PropTypes.node,
10+
}
711

8-
componentDidMount() {
9-
const node = document.createElement(this.props.type)
10-
document.body.appendChild(node)
11-
this.setState({ node })
12-
}
12+
static defaultProps = {
13+
type: 'sui-portal',
14+
}
1315

14-
componentWillUnmount() {
15-
document.body.removeChild(this.state.node)
16-
}
16+
state = { node: null }
17+
18+
componentDidMount() {
19+
const node = document.createElement(this.props.type)
20+
document.body.appendChild(node)
21+
this.setState({ node })
22+
}
1723

18-
render() {
19-
return this.state.node
20-
? createPortal(this.props.children, this.state.node)
21-
: null
24+
componentWillUnmount() {
25+
document.body.removeChild(this.state.node)
26+
}
27+
28+
render() {
29+
return this.state.node
30+
? createPortal(this.props.children, this.state.node)
31+
: null
32+
}
2233
}
34+
35+
return Portal
2336
}
2437

25-
/* #__PURE__ */
26-
Object.defineProperty(Portal, 'propTypes', {
27-
value: {
28-
type: PropTypes.string,
29-
children: PropTypes.node,
30-
},
31-
})
32-
33-
/* #__PURE__ */
34-
Object.defineProperty(Portal, 'defaultProps', {
35-
value: {
36-
type: 'sui-portal',
37-
},
38-
})
39-
40-
export default Portal
38+
export default create()

‎packages/shared/core/RadioGroup.js‎

Lines changed: 42 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -1,51 +1,49 @@
11
import React from 'react'
22
import PropTypes from 'prop-types'
33

4-
class RadioGroup extends React.Component {
5-
getChildContext() {
6-
return { suiGroup: this }
4+
function create() {
5+
class RadioGroup extends React.Component {
6+
static propTypes = {
7+
children: PropTypes.node,
8+
}
9+
10+
static childContextTypes = {
11+
suiGroup: PropTypes.object,
12+
}
13+
14+
getChildContext() {
15+
return { suiGroup: this }
16+
}
17+
18+
controls = []
19+
20+
register(control) {
21+
this.controls.push(control)
22+
}
23+
24+
unregister(control) {
25+
const index = this.controls.indexOf(control)
26+
if (index !== -1) this.controls.splice(index, 1)
27+
}
28+
29+
notify(event) {
30+
this.controls.forEach(control => {
31+
if (
32+
control.props.checked === undefined &&
33+
control.props.name === event.target.name &&
34+
control.props.value !== event.target.value
35+
) {
36+
control.updateState({ checked: false })
37+
}
38+
})
39+
}
40+
41+
render() {
42+
return this.props.children
43+
}
744
}
845

9-
controls = []
10-
11-
register(control) {
12-
this.controls.push(control)
13-
}
14-
15-
unregister(control) {
16-
const index = this.controls.indexOf(control)
17-
if (index !== -1) this.controls.splice(index, 1)
18-
}
19-
20-
notify(event) {
21-
this.controls.forEach(control => {
22-
if (
23-
control.props.checked === undefined &&
24-
control.props.name === event.target.name &&
25-
control.props.value !== event.target.value
26-
) {
27-
control.updateState({ checked: false })
28-
}
29-
})
30-
}
31-
32-
render() {
33-
return this.props.children
34-
}
46+
return RadioGroup
3547
}
3648

37-
/* #__PURE__ */
38-
Object.defineProperty(RadioGroup, 'propTypes', {
39-
value: {
40-
children: PropTypes.node,
41-
},
42-
})
43-
44-
/* #__PURE__ */
45-
Object.defineProperty(RadioGroup, 'childContextTypes', {
46-
value: {
47-
suiGroup: PropTypes.object,
48-
},
49-
})
50-
51-
export default RadioGroup
49+
export default create()

0 commit comments

Comments
 (0)