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 withStyles from '../styles/withStyles';
|
7 | import Typography from '../Typography';
|
8 | import StepIcon from '../StepIcon';
|
9 | export const styles = theme => ({
|
10 |
|
11 | root: {
|
12 | display: 'flex',
|
13 | alignItems: 'center',
|
14 | '&$alternativeLabel': {
|
15 | flexDirection: 'column'
|
16 | },
|
17 | '&$disabled': {
|
18 | cursor: 'default'
|
19 | }
|
20 | },
|
21 |
|
22 |
|
23 | horizontal: {},
|
24 |
|
25 |
|
26 | vertical: {},
|
27 |
|
28 |
|
29 | label: {
|
30 | color: theme.palette.text.secondary,
|
31 | '&$active': {
|
32 | color: theme.palette.text.primary,
|
33 | fontWeight: 500
|
34 | },
|
35 | '&$completed': {
|
36 | color: theme.palette.text.primary,
|
37 | fontWeight: 500
|
38 | },
|
39 | '&$alternativeLabel': {
|
40 | textAlign: 'center',
|
41 | marginTop: 16
|
42 | },
|
43 | '&$error': {
|
44 | color: theme.palette.error.main
|
45 | }
|
46 | },
|
47 |
|
48 |
|
49 | active: {},
|
50 |
|
51 |
|
52 | completed: {},
|
53 |
|
54 |
|
55 | error: {},
|
56 |
|
57 |
|
58 | disabled: {},
|
59 |
|
60 |
|
61 | iconContainer: {
|
62 | flexShrink: 0,
|
63 |
|
64 | display: 'flex',
|
65 | paddingRight: 8,
|
66 | '&$alternativeLabel': {
|
67 | paddingRight: 0
|
68 | }
|
69 | },
|
70 |
|
71 |
|
72 | alternativeLabel: {},
|
73 |
|
74 |
|
75 | labelContainer: {
|
76 | width: '100%'
|
77 | }
|
78 | });
|
79 | const StepLabel = React.forwardRef(function StepLabel(props, ref) {
|
80 | const {
|
81 |
|
82 | active = false,
|
83 |
|
84 | alternativeLabel = false,
|
85 | children,
|
86 | classes,
|
87 | className,
|
88 |
|
89 | completed = false,
|
90 | disabled = false,
|
91 | error = false,
|
92 | icon,
|
93 | optional,
|
94 |
|
95 | orientation = 'horizontal',
|
96 | StepIconComponent: StepIconComponentProp,
|
97 | StepIconProps
|
98 | } = props,
|
99 | other = _objectWithoutPropertiesLoose(props, ["active", "alternativeLabel", "children", "classes", "className", "completed", "disabled", "error", "expanded", "icon", "last", "optional", "orientation", "StepIconComponent", "StepIconProps"]);
|
100 |
|
101 | let StepIconComponent = StepIconComponentProp;
|
102 |
|
103 | if (icon && !StepIconComponent) {
|
104 | StepIconComponent = StepIcon;
|
105 | }
|
106 |
|
107 | return React.createElement("span", _extends({
|
108 | className: clsx(classes.root, classes[orientation], className, disabled && classes.disabled, alternativeLabel && classes.alternativeLabel, error && classes.error),
|
109 | ref: ref
|
110 | }, other), icon || StepIconComponent ? React.createElement("span", {
|
111 | className: clsx(classes.iconContainer, alternativeLabel && classes.alternativeLabel)
|
112 | }, React.createElement(StepIconComponent, _extends({
|
113 | completed: completed,
|
114 | active: active,
|
115 | error: error,
|
116 | icon: icon
|
117 | }, StepIconProps))) : null, React.createElement("span", {
|
118 | className: classes.labelContainer
|
119 | }, children ? React.createElement(Typography, {
|
120 | variant: "body2",
|
121 | component: "span",
|
122 | display: "block",
|
123 | className: clsx(classes.label, alternativeLabel && classes.alternativeLabel, completed && classes.completed, active && classes.active, error && classes.error)
|
124 | }, children) : null, optional));
|
125 | });
|
126 | process.env.NODE_ENV !== "production" ? StepLabel.propTypes = {
|
127 |
|
128 |
|
129 |
|
130 |
|
131 |
|
132 | |
133 |
|
134 |
|
135 | children: PropTypes.node,
|
136 |
|
137 | |
138 |
|
139 |
|
140 |
|
141 | classes: PropTypes.object,
|
142 |
|
143 | |
144 |
|
145 |
|
146 | className: PropTypes.string,
|
147 |
|
148 | |
149 |
|
150 |
|
151 |
|
152 | disabled: PropTypes.bool,
|
153 |
|
154 | |
155 |
|
156 |
|
157 | error: PropTypes.bool,
|
158 |
|
159 | |
160 |
|
161 |
|
162 | icon: PropTypes.node,
|
163 |
|
164 | |
165 |
|
166 |
|
167 | optional: PropTypes.node,
|
168 |
|
169 | |
170 |
|
171 |
|
172 | StepIconComponent: PropTypes.elementType,
|
173 |
|
174 | |
175 |
|
176 |
|
177 | StepIconProps: PropTypes.object
|
178 | } : void 0;
|
179 | StepLabel.muiName = 'StepLabel';
|
180 | export default withStyles(styles, {
|
181 | name: 'MuiStepLabel'
|
182 | })(StepLabel); |
\ | No newline at end of file |