forked from blocks/blocks
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathbasic.js
More file actions
84 lines (76 loc) · 1.4 KB
/
Copy pathbasic.js
File metadata and controls
84 lines (76 loc) · 1.4 KB
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
77
78
79
80
81
82
83
84
/** @jsx jsx */
import { jsx } from 'theme-ui'
import { ControlType, applyPropertyControls } from 'property-controls'
const QuoteBasic = ({ textAlign = 'center', ...props }) => (
<section
sx={{
px: 2,
py: [3, 4, 5],
textAlign
}}
{...props}
/>
)
QuoteBasic.Content = props => (
<blockquote
sx={{
maxWidth: 'container',
mx: 'auto',
my: 0,
fontSize: [3, 4, 6],
lineHeight: 'heading',
fontWeight: 'heading'
}}
{...props}
/>
)
QuoteBasic.Author = ({ children, ...props }) =>
children ? (
<footer
sx={{
fontSize: 1
}}
{...props}
>
— {children}
</footer>
) : null
applyPropertyControls(QuoteBasic, {
textAlign: {
type: ControlType.Enum,
options: ['left', 'center', 'right']
},
sx: {
type: ControlType.Style
}
})
applyPropertyControls(QuoteBasic.Content, {
children: {
title: 'Text',
type: ControlType.String,
required: true
},
sx: {
type: ControlType.Style
}
})
applyPropertyControls(QuoteBasic.Author, {
children: {
title: 'Text',
type: ControlType.String
},
sx: {
type: ControlType.Style
}
})
QuoteBasic.usage = `
<QuoteBasic>
<QuoteBasic.Content>
Science is magic that works.
</QuoteBasic.Content>
<QuoteBasic.Author>
Kurt Vonnegut
</QuoteBasic.Author>
</QuoteBasic>
`
export default QuoteBasic