1 | 'use strict';
|
2 |
|
3 | exports.__esModule = true;
|
4 | exports.default = undefined;
|
5 |
|
6 | var _extends2 = require('babel-runtime/helpers/extends');
|
7 |
|
8 | var _extends3 = _interopRequireDefault(_extends2);
|
9 |
|
10 | var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
|
11 |
|
12 | var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
|
13 |
|
14 | var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
|
15 |
|
16 | var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
|
17 |
|
18 | var _inherits2 = require('babel-runtime/helpers/inherits');
|
19 |
|
20 | var _inherits3 = _interopRequireDefault(_inherits2);
|
21 |
|
22 | var _class, _temp;
|
23 |
|
24 | var _react = require('react');
|
25 |
|
26 | var _react2 = _interopRequireDefault(_react);
|
27 |
|
28 | var _propTypes = require('prop-types');
|
29 |
|
30 | var _propTypes2 = _interopRequireDefault(_propTypes);
|
31 |
|
32 | var _classnames = require('classnames');
|
33 |
|
34 | var _classnames2 = _interopRequireDefault(_classnames);
|
35 |
|
36 | var _menu = require('../menu');
|
37 |
|
38 | var _menu2 = _interopRequireDefault(_menu);
|
39 |
|
40 | var _icon = require('../icon');
|
41 |
|
42 | var _icon2 = _interopRequireDefault(_icon);
|
43 |
|
44 | var _util = require('../util');
|
45 |
|
46 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
47 |
|
48 | var bindCtx = _util.func.bindCtx;
|
49 | var pickOthers = _util.obj.pickOthers;
|
50 | var CascaderMenuItem = (_temp = _class = function (_Component) {
|
51 | (0, _inherits3.default)(CascaderMenuItem, _Component);
|
52 |
|
53 | function CascaderMenuItem(props) {
|
54 | (0, _classCallCheck3.default)(this, CascaderMenuItem);
|
55 |
|
56 | var _this = (0, _possibleConstructorReturn3.default)(this, _Component.call(this, props));
|
57 |
|
58 | _this.state = {
|
59 | loading: false
|
60 | };
|
61 |
|
62 | bindCtx(_this, ['handleExpand', 'handleClick', 'handleMouseEnter', 'handleKeyDown', 'removeLoading']);
|
63 | return _this;
|
64 | }
|
65 |
|
66 | CascaderMenuItem.prototype.addLoading = function addLoading() {
|
67 | this.setState({
|
68 | loading: true
|
69 | });
|
70 | };
|
71 |
|
72 | CascaderMenuItem.prototype.removeLoading = function removeLoading() {
|
73 | this.setState({
|
74 | loading: false
|
75 | });
|
76 | };
|
77 |
|
78 | CascaderMenuItem.prototype.setLoadingIfNeed = function setLoadingIfNeed(p) {
|
79 | if (p && typeof p.then === 'function') {
|
80 | this.addLoading();
|
81 | p.then(this.removeLoading).catch(this.removeLoading);
|
82 | }
|
83 | };
|
84 |
|
85 | CascaderMenuItem.prototype.handleExpand = function handleExpand(focusedFirstChild) {
|
86 | this.setLoadingIfNeed(this.props.onExpand(focusedFirstChild));
|
87 | };
|
88 |
|
89 | CascaderMenuItem.prototype.handleClick = function handleClick() {
|
90 | this.handleExpand(false);
|
91 | };
|
92 |
|
93 | CascaderMenuItem.prototype.handleMouseEnter = function handleMouseEnter() {
|
94 | this.handleExpand(false);
|
95 | };
|
96 |
|
97 | CascaderMenuItem.prototype.handleKeyDown = function handleKeyDown(e) {
|
98 | if (!this.props.disabled) {
|
99 | if (e.keyCode === _util.KEYCODE.RIGHT || e.keyCode === _util.KEYCODE.ENTER) {
|
100 | if (this.props.canExpand) {
|
101 | this.handleExpand(true);
|
102 | }
|
103 | } else if (e.keyCode === _util.KEYCODE.LEFT || e.keyCode === _util.KEYCODE.ESC) {
|
104 | this.props.onFold();
|
105 | } else if (e.keyCode === _util.KEYCODE.SPACE) {
|
106 | this.handleExpand(false);
|
107 | }
|
108 | }
|
109 | };
|
110 |
|
111 | CascaderMenuItem.prototype.render = function render() {
|
112 | var _cx;
|
113 |
|
114 | var _props = this.props,
|
115 | prefix = _props.prefix,
|
116 | className = _props.className,
|
117 | menu = _props.menu,
|
118 | disabled = _props.disabled,
|
119 | selected = _props.selected,
|
120 | onSelect = _props.onSelect,
|
121 | expanded = _props.expanded,
|
122 | canExpand = _props.canExpand,
|
123 | expandTriggerType = _props.expandTriggerType,
|
124 | checkable = _props.checkable,
|
125 | checked = _props.checked,
|
126 | indeterminate = _props.indeterminate,
|
127 | checkboxDisabled = _props.checkboxDisabled,
|
128 | onCheck = _props.onCheck,
|
129 | children = _props.children;
|
130 |
|
131 | var others = pickOthers(Object.keys(CascaderMenuItem.propTypes), this.props);
|
132 | var loading = this.state.loading;
|
133 |
|
134 |
|
135 | var itemProps = (0, _extends3.default)({
|
136 | className: (0, _classnames2.default)((_cx = {}, _cx[prefix + 'cascader-menu-item'] = true, _cx[prefix + 'expanded'] = expanded, _cx[className] = !!className, _cx)),
|
137 | disabled: disabled,
|
138 | menu: menu,
|
139 | onKeyDown: this.handleKeyDown,
|
140 | role: 'option'
|
141 | }, others);
|
142 | if (!disabled) {
|
143 | if (expandTriggerType === 'hover') {
|
144 | itemProps.onMouseEnter = this.handleMouseEnter;
|
145 | } else {
|
146 | itemProps.onClick = this.handleClick;
|
147 | }
|
148 | }
|
149 |
|
150 | var Item = void 0,
|
151 | title = void 0;
|
152 | if (checkable) {
|
153 | Item = _menu2.default.CheckboxItem;
|
154 | itemProps.checked = checked;
|
155 | itemProps.indeterminate = indeterminate;
|
156 | itemProps.checkboxDisabled = checkboxDisabled;
|
157 | itemProps.onChange = onCheck;
|
158 | } else {
|
159 | Item = _menu2.default.Item;
|
160 | itemProps.selected = selected;
|
161 | itemProps.onSelect = onSelect;
|
162 | }
|
163 |
|
164 | if (typeof children === 'string') {
|
165 | title = children;
|
166 | }
|
167 |
|
168 | return _react2.default.createElement(
|
169 | Item,
|
170 | (0, _extends3.default)({ title: title }, itemProps),
|
171 | children,
|
172 | canExpand ? loading ? _react2.default.createElement(_icon2.default, {
|
173 | className: prefix + 'cascader-menu-icon-right ' + prefix + 'cascader-menu-icon-loading',
|
174 | type: 'loading'
|
175 | }) : _react2.default.createElement(_icon2.default, {
|
176 | className: prefix + 'cascader-menu-icon-right ' + prefix + 'cascader-menu-icon-expand',
|
177 | type: 'arrow-right'
|
178 | }) : null
|
179 | );
|
180 | };
|
181 |
|
182 | return CascaderMenuItem;
|
183 | }(_react.Component), _class.menuChildType = 'item', _class.propTypes = {
|
184 | prefix: _propTypes2.default.string,
|
185 | className: _propTypes2.default.string,
|
186 | disabled: _propTypes2.default.bool,
|
187 | selected: _propTypes2.default.bool,
|
188 | onSelect: _propTypes2.default.func,
|
189 | expanded: _propTypes2.default.bool,
|
190 | canExpand: _propTypes2.default.bool,
|
191 | menu: _propTypes2.default.any,
|
192 | expandTriggerType: _propTypes2.default.oneOf(['click', 'hover']),
|
193 | onExpand: _propTypes2.default.func,
|
194 | onFold: _propTypes2.default.func,
|
195 | checkable: _propTypes2.default.bool,
|
196 | checked: _propTypes2.default.bool,
|
197 | indeterminate: _propTypes2.default.bool,
|
198 | checkboxDisabled: _propTypes2.default.bool,
|
199 | onCheck: _propTypes2.default.func,
|
200 | children: _propTypes2.default.node
|
201 | }, _temp);
|
202 | CascaderMenuItem.displayName = 'CascaderMenuItem';
|
203 | exports.default = CascaderMenuItem;
|
204 | module.exports = exports['default']; |
\ | No newline at end of file |