1 | import _extends from "@babel/runtime/helpers/esm/extends";
|
2 | import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
3 | import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
4 |
|
5 | var _circle;
|
6 |
|
7 | import * as React from 'react';
|
8 | import PropTypes from 'prop-types';
|
9 | import clsx from 'clsx';
|
10 | import { unstable_composeClasses as composeClasses } from '@mui/base';
|
11 | import styled from '../styles/styled';
|
12 | import useThemeProps from '../styles/useThemeProps';
|
13 | import CheckCircle from '../internal/svg-icons/CheckCircle';
|
14 | import Warning from '../internal/svg-icons/Warning';
|
15 | import SvgIcon from '../SvgIcon';
|
16 | import stepIconClasses, { getStepIconUtilityClass } from './stepIconClasses';
|
17 | import { jsx as _jsx } from "react/jsx-runtime";
|
18 | import { jsxs as _jsxs } from "react/jsx-runtime";
|
19 |
|
20 | var useUtilityClasses = function useUtilityClasses(ownerState) {
|
21 | var classes = ownerState.classes,
|
22 | active = ownerState.active,
|
23 | completed = ownerState.completed,
|
24 | error = ownerState.error;
|
25 | var slots = {
|
26 | root: ['root', active && 'active', completed && 'completed', error && 'error'],
|
27 | text: ['text']
|
28 | };
|
29 | return composeClasses(slots, getStepIconUtilityClass, classes);
|
30 | };
|
31 |
|
32 | var StepIconRoot = styled(SvgIcon, {
|
33 | name: 'MuiStepIcon',
|
34 | slot: 'Root',
|
35 | overridesResolver: function overridesResolver(props, styles) {
|
36 | return styles.root;
|
37 | }
|
38 | })(function (_ref) {
|
39 | var _ref2;
|
40 |
|
41 | var theme = _ref.theme;
|
42 | return _ref2 = {
|
43 | display: 'block',
|
44 | transition: theme.transitions.create('color', {
|
45 | duration: theme.transitions.duration.shortest
|
46 | }),
|
47 | color: (theme.vars || theme).palette.text.disabled
|
48 | }, _defineProperty(_ref2, "&.".concat(stepIconClasses.completed), {
|
49 | color: (theme.vars || theme).palette.primary.main
|
50 | }), _defineProperty(_ref2, "&.".concat(stepIconClasses.active), {
|
51 | color: (theme.vars || theme).palette.primary.main
|
52 | }), _defineProperty(_ref2, "&.".concat(stepIconClasses.error), {
|
53 | color: (theme.vars || theme).palette.error.main
|
54 | }), _ref2;
|
55 | });
|
56 | var StepIconText = styled('text', {
|
57 | name: 'MuiStepIcon',
|
58 | slot: 'Text',
|
59 | overridesResolver: function overridesResolver(props, styles) {
|
60 | return styles.text;
|
61 | }
|
62 | })(function (_ref3) {
|
63 | var theme = _ref3.theme;
|
64 | return {
|
65 | fill: (theme.vars || theme).palette.primary.contrastText,
|
66 | fontSize: theme.typography.caption.fontSize,
|
67 | fontFamily: theme.typography.fontFamily
|
68 | };
|
69 | });
|
70 | var StepIcon = React.forwardRef(function StepIcon(inProps, ref) {
|
71 | var props = useThemeProps({
|
72 | props: inProps,
|
73 | name: 'MuiStepIcon'
|
74 | });
|
75 |
|
76 | var _props$active = props.active,
|
77 | active = _props$active === void 0 ? false : _props$active,
|
78 | classNameProp = props.className,
|
79 | _props$completed = props.completed,
|
80 | completed = _props$completed === void 0 ? false : _props$completed,
|
81 | _props$error = props.error,
|
82 | error = _props$error === void 0 ? false : _props$error,
|
83 | icon = props.icon,
|
84 | other = _objectWithoutProperties(props, ["active", "className", "completed", "error", "icon"]);
|
85 |
|
86 | var ownerState = _extends({}, props, {
|
87 | active: active,
|
88 | completed: completed,
|
89 | error: error
|
90 | });
|
91 |
|
92 | var classes = useUtilityClasses(ownerState);
|
93 |
|
94 | if (typeof icon === 'number' || typeof icon === 'string') {
|
95 | var className = clsx(classNameProp, classes.root);
|
96 |
|
97 | if (error) {
|
98 | return _jsx(StepIconRoot, _extends({
|
99 | as: Warning,
|
100 | className: className,
|
101 | ref: ref,
|
102 | ownerState: ownerState
|
103 | }, other));
|
104 | }
|
105 |
|
106 | if (completed) {
|
107 | return _jsx(StepIconRoot, _extends({
|
108 | as: CheckCircle,
|
109 | className: className,
|
110 | ref: ref,
|
111 | ownerState: ownerState
|
112 | }, other));
|
113 | }
|
114 |
|
115 | return _jsxs(StepIconRoot, _extends({
|
116 | className: className,
|
117 | ref: ref,
|
118 | ownerState: ownerState
|
119 | }, other, {
|
120 | children: [_circle || (_circle = _jsx("circle", {
|
121 | cx: "12",
|
122 | cy: "12",
|
123 | r: "12"
|
124 | })), _jsx(StepIconText, {
|
125 | className: classes.text,
|
126 | x: "12",
|
127 | y: "12",
|
128 | textAnchor: "middle",
|
129 | dominantBaseline: "central",
|
130 | ownerState: ownerState,
|
131 | children: icon
|
132 | })]
|
133 | }));
|
134 | }
|
135 |
|
136 | return icon;
|
137 | });
|
138 | process.env.NODE_ENV !== "production" ? StepIcon.propTypes
|
139 |
|
140 | = {
|
141 |
|
142 |
|
143 |
|
144 |
|
145 |
|
146 | |
147 |
|
148 |
|
149 |
|
150 | active: PropTypes.bool,
|
151 |
|
152 | |
153 |
|
154 |
|
155 | classes: PropTypes.object,
|
156 |
|
157 | |
158 |
|
159 |
|
160 | className: PropTypes.string,
|
161 |
|
162 | |
163 |
|
164 |
|
165 |
|
166 | completed: PropTypes.bool,
|
167 |
|
168 | |
169 |
|
170 |
|
171 |
|
172 | error: PropTypes.bool,
|
173 |
|
174 | |
175 |
|
176 |
|
177 | icon: PropTypes.node,
|
178 |
|
179 | |
180 |
|
181 |
|
182 | sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
|
183 | } : void 0;
|
184 | export default StepIcon; |
\ | No newline at end of file |