rsuite 4.9.4 → 4.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -146,7 +146,7 @@ function (_React$Component) {
146
146
  className: classes,
147
147
  componentClass: "li",
148
148
  indeterminate: cascade && !active && this.utils.isSomeChildChecked(node, value),
149
- onSelectItem: this.handleSelect.bind(this, layer, node),
149
+ onSelectItem: this.handleSelect.bind(this, layer),
150
150
  onCheck: onCheck,
151
151
  checkable: !uncheckable
152
152
  }, renderMenuItem ? renderMenuItem(label, node) : label, children ? React.createElement("span", {
@@ -41,6 +41,14 @@ export interface MultiCascaderProps<ValueType = any> extends FormControlPickerPr
41
41
  event: React.SyntheticEvent<HTMLElement>
42
42
  ) => void;
43
43
 
44
+ /** Called after the checkbox state changes */
45
+ onCheck?: (
46
+ value: ValueType,
47
+ item: any,
48
+ checked: boolean,
49
+ event: React.SyntheticEvent<HTMLElement>
50
+ ) => void;
51
+
44
52
  /** Called when clean */
45
53
  onClean?: (event: React.SyntheticEvent<HTMLElement>) => void;
46
54
 
@@ -37,9 +37,10 @@ function (_React$Component) {
37
37
  _this.handleCheck = function (item, event, checked) {
38
38
  var _this$props = _this.props,
39
39
  valueKey = _this$props.valueKey,
40
- onChange = _this$props.onChange,
41
40
  cascade = _this$props.cascade,
42
- uncheckableItemValues = _this$props.uncheckableItemValues;
41
+ uncheckableItemValues = _this$props.uncheckableItemValues,
42
+ onChange = _this$props.onChange,
43
+ onCheck = _this$props.onCheck;
43
44
  var itemValue = item[valueKey];
44
45
  var value = [];
45
46
 
@@ -64,6 +65,7 @@ function (_React$Component) {
64
65
  }
65
66
 
66
67
  onChange === null || onChange === void 0 ? void 0 : onChange(value, event);
68
+ onCheck === null || onCheck === void 0 ? void 0 : onCheck(value, item, checked, event);
67
69
  };
68
70
 
69
71
  _this.handleChangeForSearchItem = function (value, checked, event) {
@@ -543,7 +545,8 @@ MultiCascader.propTypes = _extends({}, listPickerPropTypes, {
543
545
  renderMenuItem: PropTypes.func,
544
546
  renderMenu: PropTypes.func,
545
547
  onSearch: PropTypes.func,
546
- onSelect: PropTypes.func
548
+ onSelect: PropTypes.func,
549
+ onCheck: PropTypes.func
547
550
  });
548
551
  MultiCascader.defaultProps = _extends({}, listPickerDefaultProps, {
549
552
  searchable: true,
@@ -166,11 +166,12 @@
166
166
  border-style: solid;
167
167
  border-width: 0;
168
168
  border-color: @table-border-color;
169
- display: block;
170
169
  overflow: hidden;
171
170
  position: absolute;
172
171
  white-space: normal;
173
172
  background: @table-body-background;
173
+ display: table;
174
+ table-layout: fixed;
174
175
 
175
176
  &.first {
176
177
  border-left-width: 0;
@@ -168,7 +168,7 @@ function (_React$Component) {
168
168
  className: classes,
169
169
  componentClass: "li",
170
170
  indeterminate: cascade && !active && this.utils.isSomeChildChecked(node, value),
171
- onSelectItem: this.handleSelect.bind(this, layer, node),
171
+ onSelectItem: this.handleSelect.bind(this, layer),
172
172
  onCheck: onCheck,
173
173
  checkable: !uncheckable
174
174
  }, renderMenuItem ? renderMenuItem(label, node) : label, children ? React.createElement("span", {
@@ -41,6 +41,14 @@ export interface MultiCascaderProps<ValueType = any> extends FormControlPickerPr
41
41
  event: React.SyntheticEvent<HTMLElement>
42
42
  ) => void;
43
43
 
44
+ /** Called after the checkbox state changes */
45
+ onCheck?: (
46
+ value: ValueType,
47
+ item: any,
48
+ checked: boolean,
49
+ event: React.SyntheticEvent<HTMLElement>
50
+ ) => void;
51
+
44
52
  /** Called when clean */
45
53
  onClean?: (event: React.SyntheticEvent<HTMLElement>) => void;
46
54
 
@@ -66,9 +66,10 @@ function (_React$Component) {
66
66
  _this.handleCheck = function (item, event, checked) {
67
67
  var _this$props = _this.props,
68
68
  valueKey = _this$props.valueKey,
69
- onChange = _this$props.onChange,
70
69
  cascade = _this$props.cascade,
71
- uncheckableItemValues = _this$props.uncheckableItemValues;
70
+ uncheckableItemValues = _this$props.uncheckableItemValues,
71
+ onChange = _this$props.onChange,
72
+ onCheck = _this$props.onCheck;
72
73
  var itemValue = item[valueKey];
73
74
  var value = [];
74
75
 
@@ -93,6 +94,7 @@ function (_React$Component) {
93
94
  }
94
95
 
95
96
  onChange === null || onChange === void 0 ? void 0 : onChange(value, event);
97
+ onCheck === null || onCheck === void 0 ? void 0 : onCheck(value, item, checked, event);
96
98
  };
97
99
 
98
100
  _this.handleChangeForSearchItem = function (value, checked, event) {
@@ -569,7 +571,8 @@ MultiCascader.propTypes = (0, _extends3.default)({}, _propTypes2.listPickerPropT
569
571
  renderMenuItem: _propTypes.default.func,
570
572
  renderMenu: _propTypes.default.func,
571
573
  onSearch: _propTypes.default.func,
572
- onSelect: _propTypes.default.func
574
+ onSelect: _propTypes.default.func,
575
+ onCheck: _propTypes.default.func
573
576
  });
574
577
  MultiCascader.defaultProps = (0, _extends3.default)({}, _propTypes2.listPickerDefaultProps, {
575
578
  searchable: true,
@@ -166,11 +166,12 @@
166
166
  border-style: solid;
167
167
  border-width: 0;
168
168
  border-color: @table-border-color;
169
- display: block;
170
169
  overflow: hidden;
171
170
  position: absolute;
172
171
  white-space: normal;
173
172
  background: @table-body-background;
173
+ display: table;
174
+ table-layout: fixed;
174
175
 
175
176
  &.first {
176
177
  border-left-width: 0;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "rsuite",
3
- "version": "4.9.4",
3
+ "version": "4.10.0",
4
4
  "description": "A suite of react components",
5
5
  "main": "lib/index.js",
6
6
  "typings": "lib/index.d.ts",
@@ -166,7 +166,7 @@ class DropdownMenu extends React.Component<DropdownMenuProps> {
166
166
  className={classes}
167
167
  componentClass="li"
168
168
  indeterminate={cascade && !active && this.utils.isSomeChildChecked(node, value)}
169
- onSelectItem={this.handleSelect.bind(this, layer, node)}
169
+ onSelectItem={this.handleSelect.bind(this, layer)}
170
170
  onCheck={onCheck}
171
171
  checkable={!uncheckable}
172
172
  >
@@ -41,6 +41,14 @@ export interface MultiCascaderProps<ValueType = any> extends FormControlPickerPr
41
41
  event: React.SyntheticEvent<HTMLElement>
42
42
  ) => void;
43
43
 
44
+ /** Called after the checkbox state changes */
45
+ onCheck?: (
46
+ value: ValueType,
47
+ item: any,
48
+ checked: boolean,
49
+ event: React.SyntheticEvent<HTMLElement>
50
+ ) => void;
51
+
44
52
  /** Called when clean */
45
53
  onClean?: (event: React.SyntheticEvent<HTMLElement>) => void;
46
54
 
@@ -57,7 +57,8 @@ class MultiCascader extends React.Component<MultiCascaderProps, MultiCascaderSta
57
57
  renderMenuItem: PropTypes.func,
58
58
  renderMenu: PropTypes.func,
59
59
  onSearch: PropTypes.func,
60
- onSelect: PropTypes.func
60
+ onSelect: PropTypes.func,
61
+ onCheck: PropTypes.func
61
62
  };
62
63
 
63
64
  static defaultProps = {
@@ -187,7 +188,7 @@ class MultiCascader extends React.Component<MultiCascaderProps, MultiCascaderSta
187
188
  }
188
189
 
189
190
  handleCheck = (item: any, event: React.SyntheticEvent<any>, checked: boolean) => {
190
- const { valueKey, onChange, cascade, uncheckableItemValues } = this.props;
191
+ const { valueKey, cascade, uncheckableItemValues, onChange, onCheck } = this.props;
191
192
  const itemValue = item[valueKey];
192
193
  let value = [];
193
194
 
@@ -208,6 +209,7 @@ class MultiCascader extends React.Component<MultiCascaderProps, MultiCascaderSta
208
209
  }
209
210
 
210
211
  onChange?.(value, event);
212
+ onCheck?.(value, item, checked, event);
211
213
  };
212
214
 
213
215
  handleChangeForSearchItem = (value: any, checked: boolean, event: React.SyntheticEvent<any>) => {
@@ -112,6 +112,23 @@ describe('MultiCascader - DropdownMenu', () => {
112
112
  }, 1);
113
113
  });
114
114
 
115
+ it('Should call onSelect callback with 4 params', done => {
116
+ const doneOp = (node, activePaths, createConcat, event) => {
117
+ if (
118
+ typeof node === 'object' &&
119
+ Array.isArray(activePaths) &&
120
+ typeof createConcat === 'function' &&
121
+ event.target
122
+ ) {
123
+ done();
124
+ }
125
+ };
126
+
127
+ const instance = getInstance(<Dropdown defaultOpen data={items} onSelect={doneOp} />);
128
+ const menuContainer = getDOMNode(instance.menuContainerRef.current);
129
+ ReactTestUtils.Simulate.click(menuContainer.querySelectorAll('.rs-checkbox')[1]);
130
+ });
131
+
115
132
  it('Should not call onSelect callback on disabled item', () => {
116
133
  const onSelectSpy = sinon.spy();
117
134
  const instance = getInstance(
@@ -7,7 +7,6 @@ import Button from '../../Button';
7
7
 
8
8
  const namespace = `${globalKey}-picker`;
9
9
  const toggleClassName = `.${namespace}-toggle-placeholder`;
10
- const activeClassName = '.rs-dropdown-menu-item-active';
11
10
 
12
11
  const items = [
13
12
  {
@@ -209,6 +208,20 @@ describe('MultiCascader', () => {
209
208
  ReactTestUtils.Simulate.click(menu.querySelector('.rs-checkbox'));
210
209
  });
211
210
 
211
+ it('Should call onCheck callback ', done => {
212
+ let checkbox = null;
213
+ const doneOp = (value, item, checked, event) => {
214
+ if (value[0] === 'abc' && item.value === 'abc' && checked && event.target === checkbox) {
215
+ done();
216
+ }
217
+ };
218
+
219
+ const instance = getInstance(<Dropdown data={items} defaultOpen onCheck={doneOp} />);
220
+ const menu = findDOMNode(instance.menuContainerRef.current);
221
+ checkbox = menu.querySelector('.rs-checkbox-wrapper');
222
+ ReactTestUtils.Simulate.click(checkbox);
223
+ });
224
+
212
225
  it('Should call onChange callback ', done => {
213
226
  const doneOp = value => {
214
227
  if (value[0] === 'abc') {
@@ -166,11 +166,12 @@
166
166
  border-style: solid;
167
167
  border-width: 0;
168
168
  border-color: @table-border-color;
169
- display: block;
170
169
  overflow: hidden;
171
170
  position: absolute;
172
171
  white-space: normal;
173
172
  background: @table-body-background;
173
+ display: table;
174
+ table-layout: fixed;
174
175
 
175
176
  &.first {
176
177
  border-left-width: 0;