diff options
Diffstat (limited to 'packages/forms/src/label/index.tsx')
-rw-r--r-- | packages/forms/src/label/index.tsx | 49 |
1 files changed, 49 insertions, 0 deletions
diff --git a/packages/forms/src/label/index.tsx b/packages/forms/src/label/index.tsx new file mode 100644 index 000000000..348b820c5 --- /dev/null +++ b/packages/forms/src/label/index.tsx | |||
@@ -0,0 +1,49 @@ | |||
1 | import classnames from 'classnames'; | ||
2 | import { Classes } from 'jss'; | ||
3 | import { observer } from 'mobx-react'; | ||
4 | import React, { Component } from 'react'; | ||
5 | import injectSheet from 'react-jss'; | ||
6 | |||
7 | import { IFormField } from '../typings/generic'; | ||
8 | |||
9 | import styles from './styles'; | ||
10 | |||
11 | interface ILabel extends IFormField, React.LabelHTMLAttributes<HTMLLabelElement> { | ||
12 | classes: Classes; | ||
13 | } | ||
14 | |||
15 | @observer | ||
16 | class Label extends Component<ILabel> { | ||
17 | static defaultProps = { | ||
18 | showLabel: true, | ||
19 | }; | ||
20 | |||
21 | render() { | ||
22 | const { | ||
23 | title, | ||
24 | showLabel, | ||
25 | classes, | ||
26 | className, | ||
27 | children, | ||
28 | htmlFor, | ||
29 | } = this.props; | ||
30 | |||
31 | return ( | ||
32 | <label | ||
33 | className={classnames({ | ||
34 | [`${className}`]: className, | ||
35 | })} | ||
36 | htmlFor={htmlFor} | ||
37 | > | ||
38 | {showLabel && ( | ||
39 | <span className={classes.label}>{title}</span> | ||
40 | )} | ||
41 | <div className={classes.content}> | ||
42 | {children} | ||
43 | </div> | ||
44 | </label> | ||
45 | ); | ||
46 | } | ||
47 | } | ||
48 | |||
49 | export default injectSheet(styles)(Label); | ||