1 | 'use strict';
|
2 |
|
3 | Object.defineProperty(exports, "__esModule", {
|
4 | value: true
|
5 | });
|
6 |
|
7 | var _extends2 = require('babel-runtime/helpers/extends');
|
8 |
|
9 | var _extends3 = _interopRequireDefault(_extends2);
|
10 |
|
11 | var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');
|
12 |
|
13 | var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
|
14 |
|
15 | var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
|
16 |
|
17 | var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
|
18 |
|
19 | var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
|
20 |
|
21 | var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
|
22 |
|
23 | var _createClass2 = require('babel-runtime/helpers/createClass');
|
24 |
|
25 | var _createClass3 = _interopRequireDefault(_createClass2);
|
26 |
|
27 | var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
|
28 |
|
29 | var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
|
30 |
|
31 | var _inherits2 = require('babel-runtime/helpers/inherits');
|
32 |
|
33 | var _inherits3 = _interopRequireDefault(_inherits2);
|
34 |
|
35 | var _simpleAssign = require('simple-assign');
|
36 |
|
37 | var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
|
38 |
|
39 | var _react = require('react');
|
40 |
|
41 | var _react2 = _interopRequireDefault(_react);
|
42 |
|
43 | var _propTypes = require('prop-types');
|
44 |
|
45 | var _propTypes2 = _interopRequireDefault(_propTypes);
|
46 |
|
47 | var _transitions = require('../styles/transitions');
|
48 |
|
49 | var _transitions2 = _interopRequireDefault(_transitions);
|
50 |
|
51 | var _EnhancedButton = require('../internal/EnhancedButton');
|
52 |
|
53 | var _EnhancedButton2 = _interopRequireDefault(_EnhancedButton);
|
54 |
|
55 | var _StepLabel = require('./StepLabel');
|
56 |
|
57 | var _StepLabel2 = _interopRequireDefault(_StepLabel);
|
58 |
|
59 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
60 |
|
61 | var isLabel = function isLabel(child) {
|
62 | return child && child.type && child.type.muiName === 'StepLabel';
|
63 | };
|
64 |
|
65 | var getStyles = function getStyles(props, context, state) {
|
66 | var hovered = state.hovered;
|
67 | var _context$muiTheme$ste = context.muiTheme.stepper,
|
68 | backgroundColor = _context$muiTheme$ste.backgroundColor,
|
69 | hoverBackgroundColor = _context$muiTheme$ste.hoverBackgroundColor;
|
70 |
|
71 |
|
72 | var styles = {
|
73 | root: {
|
74 | padding: 0,
|
75 | backgroundColor: hovered ? hoverBackgroundColor : backgroundColor,
|
76 | transition: _transitions2.default.easeOut()
|
77 | }
|
78 | };
|
79 |
|
80 | if (context.stepper.orientation === 'vertical') {
|
81 | styles.root.width = '100%';
|
82 | }
|
83 |
|
84 | return styles;
|
85 | };
|
86 |
|
87 | var StepButton = function (_Component) {
|
88 | (0, _inherits3.default)(StepButton, _Component);
|
89 |
|
90 | function StepButton() {
|
91 | var _ref;
|
92 |
|
93 | var _temp, _this, _ret;
|
94 |
|
95 | (0, _classCallCheck3.default)(this, StepButton);
|
96 |
|
97 | for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
|
98 | args[_key] = arguments[_key];
|
99 | }
|
100 |
|
101 | return _ret = (_temp = (_this = (0, _possibleConstructorReturn3.default)(this, (_ref = StepButton.__proto__ || (0, _getPrototypeOf2.default)(StepButton)).call.apply(_ref, [this].concat(args))), _this), _this.state = {
|
102 | hovered: false,
|
103 | touched: false
|
104 | }, _this.handleMouseEnter = function (event) {
|
105 | var onMouseEnter = _this.props.onMouseEnter;
|
106 |
|
107 |
|
108 | if (!_this.state.touched) {
|
109 | _this.setState({ hovered: true });
|
110 | }
|
111 | if (typeof onMouseEnter === 'function') {
|
112 | onMouseEnter(event);
|
113 | }
|
114 | }, _this.handleMouseLeave = function (event) {
|
115 | var onMouseLeave = _this.props.onMouseLeave;
|
116 |
|
117 | _this.setState({ hovered: false });
|
118 | if (typeof onMouseLeave === 'function') {
|
119 | onMouseLeave(event);
|
120 | }
|
121 | }, _this.handleTouchStart = function (event) {
|
122 | var onTouchStart = _this.props.onTouchStart;
|
123 |
|
124 | if (!_this.state.touched) {
|
125 | _this.setState({ touched: true });
|
126 | }
|
127 | if (typeof onTouchStart === 'function') {
|
128 | onTouchStart(event);
|
129 | }
|
130 | }, _temp), (0, _possibleConstructorReturn3.default)(_this, _ret);
|
131 | }
|
132 |
|
133 | (0, _createClass3.default)(StepButton, [{
|
134 | key: 'render',
|
135 | value: function render() {
|
136 | var _props = this.props,
|
137 | active = _props.active,
|
138 | children = _props.children,
|
139 | completed = _props.completed,
|
140 | disabled = _props.disabled,
|
141 | icon = _props.icon,
|
142 | iconContainerStyle = _props.iconContainerStyle,
|
143 | last = _props.last,
|
144 | onMouseEnter = _props.onMouseEnter,
|
145 | onMouseLeave = _props.onMouseLeave,
|
146 | onTouchStart = _props.onTouchStart,
|
147 | style = _props.style,
|
148 | other = (0, _objectWithoutProperties3.default)(_props, ['active', 'children', 'completed', 'disabled', 'icon', 'iconContainerStyle', 'last', 'onMouseEnter', 'onMouseLeave', 'onTouchStart', 'style']);
|
149 |
|
150 |
|
151 | var styles = getStyles(this.props, this.context, this.state);
|
152 |
|
153 | var child = isLabel(children) ? children : _react2.default.createElement(
|
154 | _StepLabel2.default,
|
155 | null,
|
156 | children
|
157 | );
|
158 |
|
159 | return _react2.default.createElement(
|
160 | _EnhancedButton2.default,
|
161 | (0, _extends3.default)({
|
162 | disabled: disabled,
|
163 | style: (0, _simpleAssign2.default)(styles.root, style),
|
164 | onMouseEnter: this.handleMouseEnter,
|
165 | onMouseLeave: this.handleMouseLeave,
|
166 | onTouchStart: this.handleTouchStart
|
167 | }, other),
|
168 | _react2.default.cloneElement(child, { active: active, completed: completed, disabled: disabled, icon: icon, iconContainerStyle: iconContainerStyle })
|
169 | );
|
170 | }
|
171 | }]);
|
172 | return StepButton;
|
173 | }(_react.Component);
|
174 |
|
175 | StepButton.contextTypes = {
|
176 | muiTheme: _propTypes2.default.object.isRequired,
|
177 | stepper: _propTypes2.default.object
|
178 | };
|
179 | StepButton.propTypes = process.env.NODE_ENV !== "production" ? {
|
180 | |
181 |
|
182 |
|
183 | active: _propTypes2.default.bool,
|
184 | |
185 |
|
186 |
|
187 | children: _propTypes2.default.node,
|
188 | |
189 |
|
190 |
|
191 | completed: _propTypes2.default.bool,
|
192 | |
193 |
|
194 |
|
195 | disabled: _propTypes2.default.bool,
|
196 | |
197 |
|
198 |
|
199 | icon: _propTypes2.default.oneOfType([_propTypes2.default.element, _propTypes2.default.string, _propTypes2.default.number]),
|
200 | |
201 |
|
202 |
|
203 | iconContainerStyle: _propTypes2.default.object,
|
204 |
|
205 | last: _propTypes2.default.bool,
|
206 |
|
207 | onMouseEnter: _propTypes2.default.func,
|
208 |
|
209 | onMouseLeave: _propTypes2.default.func,
|
210 |
|
211 | onTouchStart: _propTypes2.default.func,
|
212 | |
213 |
|
214 |
|
215 | style: _propTypes2.default.object
|
216 | } : {};
|
217 | exports.default = StepButton; |
\ | No newline at end of file |