1 | import _extends from "@babel/runtime/helpers/esm/extends";
|
2 | import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
|
3 | import * as React from 'react';
|
4 | import PropTypes from 'prop-types';
|
5 | import clsx from 'clsx';
|
6 | import { refType } from '@material-ui/utils';
|
7 | import { useFormControl } from '../FormControl';
|
8 | import withStyles from '../styles/withStyles';
|
9 | import Typography from '../Typography';
|
10 | import capitalize from '../utils/capitalize';
|
11 | export const styles = theme => ({
|
12 |
|
13 | root: {
|
14 | display: 'inline-flex',
|
15 | alignItems: 'center',
|
16 | cursor: 'pointer',
|
17 |
|
18 | verticalAlign: 'middle',
|
19 | WebkitTapHighlightColor: 'transparent',
|
20 | marginLeft: -11,
|
21 | marginRight: 16,
|
22 |
|
23 | '&$disabled': {
|
24 | cursor: 'default'
|
25 | }
|
26 | },
|
27 |
|
28 |
|
29 | labelPlacementStart: {
|
30 | flexDirection: 'row-reverse',
|
31 | marginLeft: 16,
|
32 |
|
33 | marginRight: -11
|
34 | },
|
35 |
|
36 |
|
37 | labelPlacementTop: {
|
38 | flexDirection: 'column-reverse',
|
39 | marginLeft: 16
|
40 | },
|
41 |
|
42 |
|
43 | labelPlacementBottom: {
|
44 | flexDirection: 'column',
|
45 | marginLeft: 16
|
46 | },
|
47 |
|
48 |
|
49 | disabled: {},
|
50 |
|
51 |
|
52 | label: {
|
53 | '&$disabled': {
|
54 | color: theme.palette.text.disabled
|
55 | }
|
56 | }
|
57 | });
|
58 |
|
59 |
|
60 |
|
61 |
|
62 |
|
63 | const FormControlLabel = React.forwardRef(function FormControlLabel(props, ref) {
|
64 | const {
|
65 | classes,
|
66 | className,
|
67 | control,
|
68 | disabled: disabledProp,
|
69 | label,
|
70 | labelPlacement = 'end'
|
71 | } = props,
|
72 | other = _objectWithoutPropertiesLoose(props, ["checked", "classes", "className", "control", "disabled", "inputRef", "label", "labelPlacement", "name", "onChange", "value"]);
|
73 |
|
74 | const muiFormControl = useFormControl();
|
75 | let disabled = disabledProp;
|
76 |
|
77 | if (typeof disabled === 'undefined' && typeof control.props.disabled !== 'undefined') {
|
78 | disabled = control.props.disabled;
|
79 | }
|
80 |
|
81 | if (typeof disabled === 'undefined' && muiFormControl) {
|
82 | disabled = muiFormControl.disabled;
|
83 | }
|
84 |
|
85 | const controlProps = {
|
86 | disabled
|
87 | };
|
88 | ['checked', 'name', 'onChange', 'value', 'inputRef'].forEach(key => {
|
89 | if (typeof control.props[key] === 'undefined' && typeof props[key] !== 'undefined') {
|
90 | controlProps[key] = props[key];
|
91 | }
|
92 | });
|
93 | return React.createElement("label", _extends({
|
94 | className: clsx(classes.root, className, labelPlacement !== 'end' && classes[`labelPlacement${capitalize(labelPlacement)}`], disabled && classes.disabled),
|
95 | ref: ref
|
96 | }, other), React.cloneElement(control, controlProps), React.createElement(Typography, {
|
97 | component: "span",
|
98 | className: clsx(classes.label, disabled && classes.disabled)
|
99 | }, label));
|
100 | });
|
101 | process.env.NODE_ENV !== "production" ? FormControlLabel.propTypes = {
|
102 |
|
103 |
|
104 |
|
105 |
|
106 |
|
107 | |
108 |
|
109 |
|
110 | checked: PropTypes.bool,
|
111 |
|
112 | |
113 |
|
114 |
|
115 |
|
116 | classes: PropTypes.object,
|
117 |
|
118 | |
119 |
|
120 |
|
121 | className: PropTypes.string,
|
122 |
|
123 | |
124 |
|
125 |
|
126 | control: PropTypes.element.isRequired,
|
127 |
|
128 | |
129 |
|
130 |
|
131 | disabled: PropTypes.bool,
|
132 |
|
133 | |
134 |
|
135 |
|
136 | inputRef: refType,
|
137 |
|
138 | |
139 |
|
140 |
|
141 | label: PropTypes.node,
|
142 |
|
143 | |
144 |
|
145 |
|
146 | labelPlacement: PropTypes.oneOf(['bottom', 'end', 'start', 'top']),
|
147 |
|
148 | |
149 |
|
150 |
|
151 | name: PropTypes.string,
|
152 |
|
153 | |
154 |
|
155 |
|
156 |
|
157 |
|
158 |
|
159 | onChange: PropTypes.func,
|
160 |
|
161 | |
162 |
|
163 |
|
164 | value: PropTypes.any
|
165 | } : void 0;
|
166 | export default withStyles(styles, {
|
167 | name: 'MuiFormControlLabel'
|
168 | })(FormControlLabel); |
\ | No newline at end of file |