-
Notifications
You must be signed in to change notification settings - Fork 660
/
hoc.js
76 lines (67 loc) · 1.09 KB
/
hoc.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
import React from 'react'
import { compose } from 'recompose'
import styled from 'styled-components'
import {
space,
width,
fontSize,
color
} from 'styled-system'
import {
arrayOf,
oneOfType,
number,
string
} from 'prop-types'
import tag from 'tag-hoc'
import blacklist from './blacklist'
const prop = oneOfType([
number,
string,
arrayOf(oneOfType([
number,
string
]))
])
const propTypes = {
width: prop,
w: prop,
fontSize: prop,
f: prop,
color: prop,
bg: prop,
m: prop,
mt: prop,
mr: prop,
mb: prop,
ml: prop,
mx: prop,
my: prop,
p: prop,
pt: prop,
pr: prop,
pb: prop,
pl: prop,
px: prop,
py: prop,
}
const withStyle = (style, props) => Component => {
const Base = styled(Component)([],
space,
width,
fontSize,
color
)
Base.propTypes = propTypes
// Clean this up after styled-components removes whitelisting
const Comp = styled(Base)
.attrs(props)
([], style)
return Comp
}
const Tag = tag(blacklist)
const hoc = (style, props) => compose(
withStyle(style, props),
Tag
)
export default hoc