Skip to content

Commit f1a099d

Browse files
layershifterlayershifter
committed
style(Form): update typings and propTypes usage
1 parent 17a5775 commit f1a099d

20 files changed

+131
-208
lines changed

‎src/addons/Radio/index.d.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import * as React from 'react';
22
import { CheckboxProps } from '../../modules/Checkbox';
33

4-
interface RadioProps extends CheckboxProps {
4+
export interface RadioProps extends CheckboxProps {
55
[key: string]: any;
66

77
/** Format to emphasize the current selection state. */

‎src/addons/Select/index.d.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import {
77
DropdownProps
88
} from '../../modules/Dropdown';
99

10-
interface SelectProps extends DropdownProps {
10+
export interface SelectProps extends DropdownProps {
1111
selection: true;
1212
}
1313

‎src/collections/Form/Form.js

+20-26
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import _ from 'lodash'
21
import cx from 'classnames'
2+
import _ from 'lodash'
33
import React, { Component, PropTypes } from 'react'
44

55
import {
@@ -156,15 +156,6 @@ function formSerializer(formNode) {
156156
return json
157157
}
158158

159-
const _meta = {
160-
name: 'Form',
161-
type: META.TYPES.COLLECTION,
162-
props: {
163-
widths: ['equal'],
164-
size: _.without(SUI.SIZES, 'medium'),
165-
},
166-
}
167-
168159
/**
169160
* A Form displays a set of related user input fields in a structured way.
170161
* @see Button
@@ -177,11 +168,6 @@ const _meta = {
177168
* @see TextArea
178169
*/
179170
export default class Form extends Component {
180-
static defaultProps = {
181-
as: 'form',
182-
serializer: formSerializer,
183-
}
184-
185171
static propTypes = {
186172
/** An element type to render as (string or function). */
187173
as: customPropTypes.as,
@@ -192,13 +178,13 @@ export default class Form extends Component {
192178
/** Additional classes. */
193179
className: PropTypes.string,
194180

195-
/** Automatically show any error Message children */
181+
/** Automatically show any error Message children. */
196182
error: PropTypes.bool,
197183

198-
/** A form can have its color inverted for contrast */
184+
/** A form can have its color inverted for contrast. */
199185
inverted: PropTypes.bool,
200186

201-
/** Automatically show a loading indicator */
187+
/** Automatically show a loading indicator. */
202188
loading: PropTypes.bool,
203189

204190
/**
@@ -212,23 +198,31 @@ export default class Form extends Component {
212198
/** A comment can contain a form to reply to a comment. This may have arbitrary content. */
213199
reply: PropTypes.bool,
214200

215-
/** Called onSubmit with the form node that returns the serialized form object */
201+
/** Called onSubmit with the form node that returns the serialized form object. */
216202
serializer: PropTypes.func,
217203

218-
/** A form can vary in size */
219-
size: PropTypes.oneOf(_meta.props.size),
204+
/** A form can vary in size. */
205+
size: PropTypes.oneOf(_.without(SUI.SIZES, 'medium')),
220206

221-
/** Automatically show any success Message children */
207+
/** Automatically show any success Message children. */
222208
success: PropTypes.bool,
223209

224-
/** Automatically show any warning Message children */
210+
/** Automatically show any warning Message children .*/
225211
warning: PropTypes.bool,
226212

227-
/** Forms can automatically divide fields to be equal width */
228-
widths: PropTypes.oneOf(_meta.props.widths),
213+
/** Forms can automatically divide fields to be equal width. */
214+
widths: PropTypes.oneOf(['equal']),
229215
}
230216

231-
static _meta = _meta
217+
static defaultProps = {
218+
as: 'form',
219+
serializer: formSerializer,
220+
}
221+
222+
static _meta = {
223+
name: 'Form',
224+
type: META.TYPES.COLLECTION,
225+
}
232226

233227
static Field = FormField
234228
static Button = FormButton

‎src/collections/Form/FormButton.js

+2-3
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,10 @@ import {
77
META,
88
} from '../../lib'
99
import Button from '../../elements/Button'
10-
1110
import FormField from './FormField'
1211

1312
/**
14-
* Sugar for <Form.Field control={Button} />
13+
* Sugar for <Form.Field control={Button} />.
1514
* @see Button
1615
* @see Form
1716
*/
@@ -33,7 +32,7 @@ FormButton.propTypes = {
3332
/** An element type to render as (string or function). */
3433
as: customPropTypes.as,
3534

36-
/** A FormField control prop */
35+
/** A FormField control prop. */
3736
control: FormField.propTypes.control,
3837
}
3938

‎src/collections/Form/FormCheckbox.js

+2-3
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,10 @@ import {
77
META,
88
} from '../../lib'
99
import Checkbox from '../../modules/Checkbox'
10-
1110
import FormField from './FormField'
1211

1312
/**
14-
* Sugar for <Form.Field control={Checkbox} />
13+
* Sugar for <Form.Field control={Checkbox} />.
1514
* @see Checkbox
1615
* @see Form
1716
*/
@@ -33,7 +32,7 @@ FormCheckbox.propTypes = {
3332
/** An element type to render as (string or function). */
3433
as: customPropTypes.as,
3534

36-
/** A FormField control prop */
35+
/** A FormField control prop. */
3736
control: FormField.propTypes.control,
3837
}
3938

‎src/collections/Form/FormDropdown.js

+2-3
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,10 @@ import {
77
META,
88
} from '../../lib'
99
import Dropdown from '../../modules/Dropdown'
10-
1110
import FormField from './FormField'
1211

1312
/**
14-
* Sugar for <Form.Field control={Dropdown} />
13+
* Sugar for <Form.Field control={Dropdown} />.
1514
* @see Dropdown
1615
* @see Form
1716
*/
@@ -33,7 +32,7 @@ FormDropdown.propTypes = {
3332
/** An element type to render as (string or function). */
3433
as: customPropTypes.as,
3534

36-
/** A FormField control prop */
35+
/** A FormField control prop. */
3736
control: FormField.propTypes.control,
3837
}
3938

‎src/collections/Form/FormField.js

+7-16
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import _ from 'lodash'
21
import cx from 'classnames'
2+
import _ from 'lodash'
33
import React, { createElement, PropTypes } from 'react'
44

55
import {
@@ -16,7 +16,7 @@ import Checkbox from '../../modules/Checkbox'
1616
import Radio from '../../addons/Radio'
1717

1818
/**
19-
* A field is a form element containing a label and an input
19+
* A field is a form element containing a label and an input.
2020
* @see Form
2121
* @see Button
2222
* @see Checkbox
@@ -103,15 +103,6 @@ FormField._meta = {
103103
name: 'FormField',
104104
parent: 'Form',
105105
type: META.TYPES.COLLECTION,
106-
props: {
107-
width: SUI.WIDTHS,
108-
control: [
109-
'button',
110-
'input',
111-
'select',
112-
'textarea',
113-
],
114-
},
115106
}
116107

117108
FormField.propTypes = {
@@ -131,16 +122,16 @@ FormField.propTypes = {
131122
*/
132123
control: customPropTypes.some([
133124
PropTypes.func,
134-
PropTypes.oneOf(FormField._meta.props.control),
125+
PropTypes.oneOf(['button', 'input', 'select', 'textarea']),
135126
]),
136127

137-
/** Individual fields may be disabled */
128+
/** Individual fields may be disabled. */
138129
disabled: PropTypes.bool,
139130

140-
/** Individual fields may display an error state */
131+
/** Individual fields may display an error state. */
141132
error: PropTypes.bool,
142133

143-
/** A field can have its label next to instead of above it */
134+
/** A field can have its label next to instead of above it. */
144135
inline: PropTypes.bool,
145136

146137
// Heads Up!
@@ -167,7 +158,7 @@ FormField.propTypes = {
167158
]),
168159

169160
/** A field can specify its width in grid columns */
170-
width: PropTypes.oneOf(FormField._meta.props.width),
161+
width: PropTypes.oneOf(SUI.WIDTHS),
171162
}
172163

173164
export default FormField

‎src/collections/Form/FormGroup.js

+18-18
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,33 @@
1-
import React, { PropTypes } from 'react'
21
import cx from 'classnames'
2+
import React, { PropTypes } from 'react'
33

44
import {
5+
customPropTypes,
56
getElementType,
67
getUnhandledProps,
78
META,
89
SUI,
9-
useWidthProp,
1010
useKeyOnly,
11-
customPropTypes,
11+
useWidthProp,
1212
} from '../../lib'
1313

1414
/**
15-
* A set of fields can appear grouped together
15+
* A set of fields can appear grouped together.
1616
* @see Form
1717
*/
1818
function FormGroup(props) {
19-
const { children, className, grouped, inline, widths } = props
19+
const {
20+
children,
21+
className,
22+
grouped,
23+
inline,
24+
widths,
25+
} = props
26+
2027
const classes = cx(
21-
useWidthProp(widths, null, true),
22-
useKeyOnly(inline, 'inline'),
2328
useKeyOnly(grouped, 'grouped'),
29+
useKeyOnly(inline, 'inline'),
30+
useWidthProp(widths, null, true),
2431
'fields',
2532
className,
2633
)
@@ -34,9 +41,6 @@ FormGroup._meta = {
3441
name: 'FormGroup',
3542
parent: 'Form',
3643
type: META.TYPES.COLLECTION,
37-
props: {
38-
widths: [...SUI.WIDTHS, 'equal'],
39-
},
4044
}
4145

4246
FormGroup.propTypes = {
@@ -49,24 +53,20 @@ FormGroup.propTypes = {
4953
/** Additional classes. */
5054
className: PropTypes.string,
5155

52-
/** Fields can show related choices */
56+
/** Fields can show related choices. */
5357
grouped: customPropTypes.every([
5458
customPropTypes.disallow(['inline']),
5559
PropTypes.bool,
5660
]),
5761

58-
/** Multiple fields may be inline in a row */
62+
/** Multiple fields may be inline in a row. */
5963
inline: customPropTypes.every([
6064
customPropTypes.disallow(['grouped']),
6165
PropTypes.bool,
6266
]),
6367

64-
/** Fields Groups can specify their width in grid columns or automatically divide fields to be equal width */
65-
widths: PropTypes.oneOf(FormGroup._meta.props.widths),
66-
}
67-
68-
FormGroup.defaultProps = {
69-
as: 'div',
68+
/** Fields Groups can specify their width in grid columns or automatically divide fields to be equal width. */
69+
widths: PropTypes.oneOf([...SUI.WIDTHS, 'equal']),
7070
}
7171

7272
export default FormGroup

‎src/collections/Form/FormInput.js

+2-3
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,10 @@ import {
77
META,
88
} from '../../lib'
99
import Input from '../../elements/Input'
10-
1110
import FormField from './FormField'
1211

1312
/**
14-
* Sugar for <Form.Field control={Input} />
13+
* Sugar for <Form.Field control={Input} />.
1514
* @see Form
1615
* @see Input
1716
*/
@@ -33,7 +32,7 @@ FormInput.propTypes = {
3332
/** An element type to render as (string or function). */
3433
as: customPropTypes.as,
3534

36-
/** A FormField control prop */
35+
/** A FormField control prop. */
3736
control: FormField.propTypes.control,
3837
}
3938

‎src/collections/Form/FormRadio.js

+2-3
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,10 @@ import {
77
META,
88
} from '../../lib'
99
import Radio from '../../addons/Radio'
10-
1110
import FormField from './FormField'
1211

1312
/**
14-
* Sugar for <Form.Field control={Radio} />
13+
* Sugar for <Form.Field control={Radio} />.
1514
* @see Form
1615
* @see Radio
1716
*/
@@ -33,7 +32,7 @@ FormRadio.propTypes = {
3332
/** An element type to render as (string or function). */
3433
as: customPropTypes.as,
3534

36-
/** A FormField control prop */
35+
/** A FormField control prop. */
3736
control: FormField.propTypes.control,
3837
}
3938

‎src/collections/Form/FormSelect.js

+2-3
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,10 @@ import {
77
META,
88
} from '../../lib'
99
import Select from '../../addons/Select'
10-
1110
import FormField from './FormField'
1211

1312
/**
14-
* Sugar for <Form.Field control={Select} />
13+
* Sugar for <Form.Field control={Select} />.
1514
* @see Form
1615
* @see Select
1716
*/
@@ -33,7 +32,7 @@ FormSelect.propTypes = {
3332
/** An element type to render as (string or function). */
3433
as: customPropTypes.as,
3534

36-
/** A FormField control prop */
35+
/** A FormField control prop. */
3736
control: FormField.propTypes.control,
3837
}
3938

0 commit comments

Comments
 (0)