@deephaven/components 0.22.3-deep-bot-test.14 → 0.23.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.
- package/dist/AutoCompleteInput.js +12 -85
- package/dist/AutoCompleteInput.js.map +1 -1
- package/dist/AutoResizeTextarea.d.ts +5 -5
- package/dist/AutoResizeTextarea.d.ts.map +1 -1
- package/dist/AutoResizeTextarea.js +8 -23
- package/dist/AutoResizeTextarea.js.map +1 -1
- package/dist/BasicModal.d.ts +28 -1
- package/dist/BasicModal.d.ts.map +1 -1
- package/dist/BasicModal.js +2 -8
- package/dist/BasicModal.js.map +1 -1
- package/dist/Button.d.ts +9 -9
- package/dist/Button.d.ts.map +1 -1
- package/dist/Button.js +8 -34
- package/dist/Button.js.map +1 -1
- package/dist/ButtonGroup.d.ts +7 -7
- package/dist/ButtonGroup.d.ts.map +1 -1
- package/dist/ButtonGroup.js +2 -4
- package/dist/ButtonGroup.js.map +1 -1
- package/dist/ButtonOld.js.map +1 -1
- package/dist/CardFlip.d.ts +2 -2
- package/dist/CardFlip.d.ts.map +1 -1
- package/dist/CardFlip.js +2 -7
- package/dist/CardFlip.js.map +1 -1
- package/dist/Checkbox.js +3 -14
- package/dist/Checkbox.js.map +1 -1
- package/dist/Collapse.d.ts +1 -1
- package/dist/Collapse.js +0 -15
- package/dist/Collapse.js.map +1 -1
- package/dist/ComboBox.js +4 -83
- package/dist/ComboBox.js.map +1 -1
- package/dist/CopyButton.d.ts +2 -2
- package/dist/CopyButton.d.ts.map +1 -1
- package/dist/CopyButton.js +2 -4
- package/dist/CopyButton.js.map +1 -1
- package/dist/CustomTimeSelect.d.ts +3 -3
- package/dist/CustomTimeSelect.d.ts.map +1 -1
- package/dist/CustomTimeSelect.js +2 -86
- package/dist/CustomTimeSelect.js.map +1 -1
- package/dist/DateInput.d.ts +1 -1
- package/dist/DateInput.d.ts.map +1 -1
- package/dist/DateInput.js.map +1 -1
- package/dist/DateInputUtils.js +0 -7
- package/dist/DateInputUtils.js.map +1 -1
- package/dist/DateTimeInput.d.ts +1 -1
- package/dist/DateTimeInput.d.ts.map +1 -1
- package/dist/DateTimeInput.js +7 -10
- package/dist/DateTimeInput.js.map +1 -1
- package/dist/DebouncedSearchInput.js +0 -14
- package/dist/DebouncedSearchInput.js.map +1 -1
- package/dist/DragUtils.d.ts +1 -1
- package/dist/DragUtils.d.ts.map +1 -1
- package/dist/DragUtils.js +4 -16
- package/dist/DragUtils.js.map +1 -1
- package/dist/DraggableItemList.d.ts +4 -4
- package/dist/DraggableItemList.d.ts.map +1 -1
- package/dist/DraggableItemList.js +22 -44
- package/dist/DraggableItemList.js.map +1 -1
- package/dist/EditableItemList.d.ts +1 -1
- package/dist/EditableItemList.d.ts.map +1 -1
- package/dist/EditableItemList.js +2 -6
- package/dist/EditableItemList.js.map +1 -1
- package/dist/HierarchicalCheckboxMenu.d.ts +3 -3
- package/dist/HierarchicalCheckboxMenu.d.ts.map +1 -1
- package/dist/HierarchicalCheckboxMenu.js +6 -28
- package/dist/HierarchicalCheckboxMenu.js.map +1 -1
- package/dist/ItemList.d.ts +5 -5
- package/dist/ItemList.d.ts.map +1 -1
- package/dist/ItemList.js +22 -115
- package/dist/ItemList.js.map +1 -1
- package/dist/ItemListItem.d.ts +0 -1
- package/dist/ItemListItem.d.ts.map +1 -1
- package/dist/ItemListItem.js +26 -50
- package/dist/ItemListItem.js.map +1 -1
- package/dist/LoadingOverlay.d.ts +2 -2
- package/dist/LoadingOverlay.d.ts.map +1 -1
- package/dist/LoadingOverlay.js +3 -5
- package/dist/LoadingOverlay.js.map +1 -1
- package/dist/LoadingSpinner.d.ts +2 -2
- package/dist/LoadingSpinner.d.ts.map +1 -1
- package/dist/LoadingSpinner.js +2 -4
- package/dist/LoadingSpinner.js.map +1 -1
- package/dist/MaskedInput.d.ts +2 -2
- package/dist/MaskedInput.d.ts.map +1 -1
- package/dist/MaskedInput.js +26 -85
- package/dist/MaskedInput.js.map +1 -1
- package/dist/Option.d.ts +2 -2
- package/dist/Option.d.ts.map +1 -1
- package/dist/Option.js +2 -4
- package/dist/Option.js.map +1 -1
- package/dist/RadioGroup.d.ts +2 -2
- package/dist/RadioGroup.d.ts.map +1 -1
- package/dist/RadioGroup.js +4 -6
- package/dist/RadioGroup.js.map +1 -1
- package/dist/RadioItem.d.ts +1 -1
- package/dist/RadioItem.d.ts.map +1 -1
- package/dist/RadioItem.js +0 -1
- package/dist/RadioItem.js.map +1 -1
- package/dist/SearchInput.js +2 -13
- package/dist/SearchInput.js.map +1 -1
- package/dist/Select.d.ts +2 -2
- package/dist/Select.d.ts.map +1 -1
- package/dist/Select.js +2 -4
- package/dist/Select.js.map +1 -1
- package/dist/SelectValueList.d.ts +1 -1
- package/dist/SelectValueList.d.ts.map +1 -1
- package/dist/SelectValueList.js +0 -28
- package/dist/SelectValueList.js.map +1 -1
- package/dist/SocketedButton.d.ts +1 -1
- package/dist/SocketedButton.d.ts.map +1 -1
- package/dist/SocketedButton.js.map +1 -1
- package/dist/ThemeExport.d.ts +4 -4
- package/dist/ThemeExport.js +0 -4
- package/dist/ThemeExport.js.map +1 -1
- package/dist/TimeInput.d.ts +2 -2
- package/dist/TimeInput.d.ts.map +1 -1
- package/dist/TimeInput.js +2 -12
- package/dist/TimeInput.js.map +1 -1
- package/dist/TimeSlider.d.ts +2 -2
- package/dist/TimeSlider.d.ts.map +1 -1
- package/dist/TimeSlider.js +19 -33
- package/dist/TimeSlider.js.map +1 -1
- package/dist/ToastNotification.d.ts +6 -6
- package/dist/ToastNotification.d.ts.map +1 -1
- package/dist/ToastNotification.js +2 -4
- package/dist/ToastNotification.js.map +1 -1
- package/dist/UISwitch.d.ts +2 -2
- package/dist/UISwitch.d.ts.map +1 -1
- package/dist/UISwitch.js +2 -4
- package/dist/UISwitch.js.map +1 -1
- package/dist/ValidateLabelInput.d.ts +1 -1
- package/dist/ValidateLabelInput.d.ts.map +1 -1
- package/dist/ValidateLabelInput.js +3 -3
- package/dist/ValidateLabelInput.js.map +1 -1
- package/dist/context-actions/ContextActionUtils.d.ts +3 -3
- package/dist/context-actions/ContextActionUtils.d.ts.map +1 -1
- package/dist/context-actions/ContextActionUtils.js +9 -40
- package/dist/context-actions/ContextActionUtils.js.map +1 -1
- package/dist/context-actions/ContextActions.js +1 -34
- package/dist/context-actions/ContextActions.js.map +1 -1
- package/dist/context-actions/ContextMenu.js +29 -110
- package/dist/context-actions/ContextMenu.js.map +1 -1
- package/dist/context-actions/ContextMenuItem.d.ts.map +1 -1
- package/dist/context-actions/ContextMenuItem.js +3 -19
- package/dist/context-actions/ContextMenuItem.js.map +1 -1
- package/dist/context-actions/ContextMenuRoot.d.ts +1 -1
- package/dist/context-actions/ContextMenuRoot.d.ts.map +1 -1
- package/dist/context-actions/ContextMenuRoot.js +7 -26
- package/dist/context-actions/ContextMenuRoot.js.map +1 -1
- package/dist/context-actions/GlobalContextAction.js +0 -15
- package/dist/context-actions/GlobalContextAction.js.map +1 -1
- package/dist/context-actions/GlobalContextActions.js +0 -6
- package/dist/context-actions/GlobalContextActions.js.map +1 -1
- package/dist/context-actions/index.js.map +1 -1
- package/dist/index.js.map +1 -1
- package/dist/menu-actions/DropdownMenu.d.ts +3 -3
- package/dist/menu-actions/DropdownMenu.d.ts.map +1 -1
- package/dist/menu-actions/DropdownMenu.js +4 -32
- package/dist/menu-actions/DropdownMenu.js.map +1 -1
- package/dist/menu-actions/Menu.d.ts +3 -3
- package/dist/menu-actions/Menu.d.ts.map +1 -1
- package/dist/menu-actions/Menu.js +7 -52
- package/dist/menu-actions/Menu.js.map +1 -1
- package/dist/menu-actions/index.d.ts +2 -1
- package/dist/menu-actions/index.d.ts.map +1 -1
- package/dist/menu-actions/index.js +2 -2
- package/dist/menu-actions/index.js.map +1 -1
- package/dist/modal/Modal.d.ts +2 -2
- package/dist/modal/Modal.d.ts.map +1 -1
- package/dist/modal/Modal.js +3 -9
- package/dist/modal/Modal.js.map +1 -1
- package/dist/modal/ModalBody.d.ts +1 -1
- package/dist/modal/ModalBody.d.ts.map +1 -1
- package/dist/modal/ModalBody.js +2 -4
- package/dist/modal/ModalBody.js.map +1 -1
- package/dist/modal/ModalFooter.d.ts +1 -1
- package/dist/modal/ModalFooter.d.ts.map +1 -1
- package/dist/modal/ModalFooter.js +2 -4
- package/dist/modal/ModalFooter.js.map +1 -1
- package/dist/modal/ModalHeader.d.ts +1 -1
- package/dist/modal/ModalHeader.d.ts.map +1 -1
- package/dist/modal/ModalHeader.js +2 -4
- package/dist/modal/ModalHeader.js.map +1 -1
- package/dist/modal/index.js.map +1 -1
- package/dist/navigation/Menu.d.ts +3 -3
- package/dist/navigation/Menu.d.ts.map +1 -1
- package/dist/navigation/Menu.js +2 -2
- package/dist/navigation/Menu.js.map +1 -1
- package/dist/navigation/MenuItem.d.ts +4 -4
- package/dist/navigation/MenuItem.d.ts.map +1 -1
- package/dist/navigation/MenuItem.js +4 -7
- package/dist/navigation/MenuItem.js.map +1 -1
- package/dist/navigation/Page.d.ts +2 -2
- package/dist/navigation/Page.d.ts.map +1 -1
- package/dist/navigation/Page.js +2 -3
- package/dist/navigation/Page.js.map +1 -1
- package/dist/navigation/Stack.d.ts +2 -2
- package/dist/navigation/Stack.d.ts.map +1 -1
- package/dist/navigation/Stack.js +3 -6
- package/dist/navigation/Stack.js.map +1 -1
- package/dist/navigation/index.js.map +1 -1
- package/dist/popper/Popper.d.ts +2 -2
- package/dist/popper/Popper.d.ts.map +1 -1
- package/dist/popper/Popper.js +13 -46
- package/dist/popper/Popper.js.map +1 -1
- package/dist/popper/Tooltip.d.ts +1 -1
- package/dist/popper/Tooltip.d.ts.map +1 -1
- package/dist/popper/Tooltip.js +0 -56
- package/dist/popper/Tooltip.js.map +1 -1
- package/dist/popper/index.js.map +1 -1
- package/dist/shortcuts/GlobalShortcuts.js.map +1 -1
- package/dist/shortcuts/Shortcut.d.ts +2 -2
- package/dist/shortcuts/Shortcut.d.ts.map +1 -1
- package/dist/shortcuts/Shortcut.js +19 -76
- package/dist/shortcuts/Shortcut.js.map +1 -1
- package/dist/shortcuts/ShortcutRegistry.d.ts +1 -1
- package/dist/shortcuts/ShortcutRegistry.d.ts.map +1 -1
- package/dist/shortcuts/ShortcutRegistry.js +3 -18
- package/dist/shortcuts/ShortcutRegistry.js.map +1 -1
- package/dist/shortcuts/index.js.map +1 -1
- package/package.json +8 -8
package/dist/ItemList.js
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
-
|
|
3
2
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
4
|
-
|
|
3
|
+
/* eslint-disable react/no-unstable-nested-components */
|
|
5
4
|
import React, { PureComponent } from 'react';
|
|
6
5
|
import memoize from 'memoizee';
|
|
7
6
|
import { FixedSizeList as List } from 'react-window';
|
|
@@ -12,16 +11,15 @@ import ItemListItem from "./ItemListItem.js";
|
|
|
12
11
|
import { ContextActionUtils } from "./context-actions/index.js";
|
|
13
12
|
import "./ItemList.css";
|
|
14
13
|
var log = Log.module('ItemList');
|
|
15
|
-
|
|
16
14
|
/**
|
|
17
15
|
* Show items in a long scrollable list.
|
|
18
16
|
* Can be navigated via keyboard or mouse.
|
|
19
17
|
*/
|
|
20
18
|
export class ItemList extends PureComponent {
|
|
21
19
|
// By drawing an additional 10 items on each side, tab/keyboard navigation works better (as the next element exists)
|
|
20
|
+
|
|
22
21
|
static renderItem(_ref) {
|
|
23
22
|
var _ref2, _item$displayValue;
|
|
24
|
-
|
|
25
23
|
var {
|
|
26
24
|
item
|
|
27
25
|
} = _ref;
|
|
@@ -29,18 +27,13 @@ export class ItemList extends PureComponent {
|
|
|
29
27
|
className: "item-list-item-content"
|
|
30
28
|
}, item != null && ((_ref2 = (_item$displayValue = item.displayValue) !== null && _item$displayValue !== void 0 ? _item$displayValue : item.value) !== null && _ref2 !== void 0 ? _ref2 : "".concat(item)));
|
|
31
29
|
}
|
|
32
|
-
|
|
33
30
|
constructor(_props) {
|
|
34
31
|
super(_props);
|
|
35
|
-
|
|
36
32
|
_defineProperty(this, "list", void 0);
|
|
37
|
-
|
|
38
33
|
_defineProperty(this, "listContainer", void 0);
|
|
39
|
-
|
|
40
34
|
_defineProperty(this, "getItemSelected", memoize((index, selectedRanges) => RangeUtils.isSelected(selectedRanges, index), {
|
|
41
35
|
max: ItemList.CACHE_SIZE
|
|
42
36
|
}));
|
|
43
|
-
|
|
44
37
|
_defineProperty(this, "getCachedItem", memoize((itemIndex, key, item, isFocused, isSelected, renderItem, style, disableSelect) => {
|
|
45
38
|
var content = renderItem({
|
|
46
39
|
item,
|
|
@@ -67,7 +60,6 @@ export class ItemList extends PureComponent {
|
|
|
67
60
|
}, {
|
|
68
61
|
max: ItemList.CACHE_SIZE
|
|
69
62
|
}));
|
|
70
|
-
|
|
71
63
|
_defineProperty(this, "getOuterElement", memoize(onKeyDown => {
|
|
72
64
|
var component = /*#__PURE__*/React.forwardRef((props, ref) =>
|
|
73
65
|
/*#__PURE__*/
|
|
@@ -76,29 +68,26 @@ export class ItemList extends PureComponent {
|
|
|
76
68
|
ref: ref,
|
|
77
69
|
tabIndex: -1,
|
|
78
70
|
onKeyDown: onKeyDown,
|
|
79
|
-
role: "presentation"
|
|
80
|
-
|
|
71
|
+
role: "presentation"
|
|
72
|
+
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
81
73
|
}, props)));
|
|
82
74
|
component.displayName = 'ItemListOuterElement';
|
|
83
75
|
return component;
|
|
84
76
|
}));
|
|
85
|
-
|
|
86
77
|
_defineProperty(this, "getInnerElement", memoize(() => {
|
|
87
78
|
var component = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement("div", _extends({
|
|
88
79
|
className: "item-list-inner-element",
|
|
89
|
-
ref: ref
|
|
90
|
-
|
|
80
|
+
ref: ref
|
|
81
|
+
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
91
82
|
}, props)));
|
|
92
83
|
component.displayName = 'ItemListInnerElement';
|
|
93
84
|
return component;
|
|
94
85
|
}));
|
|
95
|
-
|
|
96
86
|
_defineProperty(this, "getItemData", memoize((items, selectedRanges, renderItem) => ({
|
|
97
87
|
items,
|
|
98
88
|
selectedRanges,
|
|
99
89
|
renderItem
|
|
100
90
|
})));
|
|
101
|
-
|
|
102
91
|
this.handleItemBlur = this.handleItemBlur.bind(this);
|
|
103
92
|
this.handleItemContextMenu = this.handleItemContextMenu.bind(this);
|
|
104
93
|
this.handleItemFocus = this.handleItemFocus.bind(this);
|
|
@@ -130,7 +119,6 @@ export class ItemList extends PureComponent {
|
|
|
130
119
|
scrollOffset: null
|
|
131
120
|
};
|
|
132
121
|
}
|
|
133
|
-
|
|
134
122
|
componentDidUpdate(prevProps, prevState) {
|
|
135
123
|
var {
|
|
136
124
|
selectedRanges: propSelectedRanges,
|
|
@@ -143,63 +131,49 @@ export class ItemList extends PureComponent {
|
|
|
143
131
|
height,
|
|
144
132
|
selectedRanges
|
|
145
133
|
} = this.state;
|
|
146
|
-
|
|
147
134
|
if (isStuckToBottom && !this.isListAtBottom() && itemCount > 0) {
|
|
148
135
|
this.scrollToBottom();
|
|
149
136
|
}
|
|
150
|
-
|
|
151
137
|
if (scrollOffset !== prevState.scrollOffset || height !== prevState.height) {
|
|
152
138
|
this.sendViewportUpdate();
|
|
153
139
|
}
|
|
154
|
-
|
|
155
140
|
if (propSelectedRanges !== prevProps.selectedRanges && propSelectedRanges !== selectedRanges) {
|
|
156
141
|
this.setSelectedRanges(propSelectedRanges);
|
|
157
142
|
} else if (selectedRanges !== prevState.selectedRanges) {
|
|
158
143
|
var {
|
|
159
144
|
onSelectionChange: _onSelectionChange
|
|
160
145
|
} = this.props;
|
|
161
|
-
|
|
162
146
|
_onSelectionChange(selectedRanges);
|
|
163
147
|
}
|
|
164
|
-
|
|
165
148
|
if (focusIndex !== prevState.focusIndex) {
|
|
166
149
|
var {
|
|
167
150
|
onFocusChange: _onFocusChange
|
|
168
151
|
} = this.props;
|
|
169
|
-
|
|
170
152
|
_onFocusChange(focusIndex);
|
|
171
153
|
}
|
|
172
154
|
}
|
|
173
|
-
|
|
174
155
|
componentWillUnmount() {
|
|
175
156
|
window.removeEventListener('mouseup', this.handleWindowMouseUp);
|
|
176
157
|
}
|
|
177
|
-
|
|
178
158
|
focus() {
|
|
179
159
|
var _this$listContainer$c;
|
|
180
|
-
|
|
181
160
|
(_this$listContainer$c = this.listContainer.current) === null || _this$listContainer$c === void 0 ? void 0 : _this$listContainer$c.focus();
|
|
182
161
|
}
|
|
183
|
-
|
|
184
162
|
restoreScrollPosition() {
|
|
185
163
|
var {
|
|
186
164
|
scrollOffset
|
|
187
165
|
} = this.state;
|
|
188
|
-
|
|
189
166
|
if (scrollOffset != null) {
|
|
190
167
|
var _this$listContainer$c2;
|
|
191
|
-
|
|
192
168
|
// manually restore the scroll containers offset
|
|
193
169
|
// virtual list doesn't restore scrolloffset in a re-render if it's the same
|
|
194
170
|
(_this$listContainer$c2 = this.listContainer.current) === null || _this$listContainer$c2 === void 0 ? void 0 : _this$listContainer$c2.scrollTo(0, scrollOffset);
|
|
195
171
|
}
|
|
196
172
|
}
|
|
197
|
-
|
|
198
173
|
getElement(itemIndex) {
|
|
199
174
|
if (this.listContainer.current == null) {
|
|
200
175
|
return null;
|
|
201
176
|
}
|
|
202
|
-
|
|
203
177
|
var {
|
|
204
178
|
focusSelector
|
|
205
179
|
} = this.props;
|
|
@@ -210,7 +184,6 @@ export class ItemList extends PureComponent {
|
|
|
210
184
|
var elementIndex = itemIndex - overscanStartIndex;
|
|
211
185
|
return elements[elementIndex];
|
|
212
186
|
}
|
|
213
|
-
|
|
214
187
|
focusItem(itemIndex) {
|
|
215
188
|
var {
|
|
216
189
|
disableSelect
|
|
@@ -220,39 +193,34 @@ export class ItemList extends PureComponent {
|
|
|
220
193
|
focusIndex: itemIndex
|
|
221
194
|
});
|
|
222
195
|
var element = this.getElement(itemIndex);
|
|
223
|
-
|
|
224
196
|
if (element instanceof HTMLElement) {
|
|
225
197
|
element.focus();
|
|
226
198
|
}
|
|
227
199
|
}
|
|
228
|
-
|
|
229
200
|
scrollToItem(itemIndex) {
|
|
230
201
|
var element = this.getElement(itemIndex);
|
|
231
|
-
|
|
232
202
|
if (element != null) {
|
|
233
203
|
element.scrollIntoView({
|
|
234
204
|
block: 'center'
|
|
235
205
|
});
|
|
236
206
|
}
|
|
237
207
|
}
|
|
238
|
-
|
|
239
208
|
handleItemContextMenu(itemIndex, e) {
|
|
240
209
|
// Update the selection, but don't consume the mouse event - it will trigger the context menu
|
|
241
210
|
var {
|
|
242
211
|
selectedRanges
|
|
243
212
|
} = this.state;
|
|
244
|
-
var isSelected = RangeUtils.isSelected(selectedRanges, itemIndex);
|
|
213
|
+
var isSelected = RangeUtils.isSelected(selectedRanges, itemIndex);
|
|
245
214
|
|
|
215
|
+
// When right-clicking, we want to maintain the current selection if the right click happened within the selection even if the modifier key isn't down
|
|
246
216
|
var isModifierDown = isSelected || ContextActionUtils.isModifierKeyDown(e);
|
|
247
217
|
this.toggleSelect(itemIndex, e.shiftKey, isModifierDown, false);
|
|
248
218
|
}
|
|
249
|
-
|
|
250
219
|
handleItemDoubleClick(itemIndex, e) {
|
|
251
220
|
var {
|
|
252
221
|
isDoubleClickSelect,
|
|
253
222
|
onSelect
|
|
254
223
|
} = this.props;
|
|
255
|
-
|
|
256
224
|
if (isDoubleClickSelect) {
|
|
257
225
|
this.setState(_ref3 => {
|
|
258
226
|
var {
|
|
@@ -266,37 +234,33 @@ export class ItemList extends PureComponent {
|
|
|
266
234
|
});
|
|
267
235
|
}
|
|
268
236
|
}
|
|
269
|
-
|
|
270
237
|
handleItemMouseDown(index, e) {
|
|
271
238
|
var {
|
|
272
239
|
selectedRanges
|
|
273
240
|
} = this.state;
|
|
274
|
-
|
|
275
241
|
if (e.target instanceof HTMLElement && ['button', 'select', 'input', 'textarea'].indexOf(e.target.tagName.toLowerCase()) !== -1) {
|
|
276
242
|
// allow these elements to do their own behaviours
|
|
277
243
|
return;
|
|
278
244
|
}
|
|
279
|
-
|
|
280
245
|
if (e.button === 2 && selectedRanges.length === 0) {
|
|
281
246
|
// allow right click to act as a selection if selection is empty
|
|
282
247
|
this.focusItem(index);
|
|
283
248
|
this.selectItem(index);
|
|
284
249
|
return;
|
|
285
250
|
}
|
|
286
|
-
|
|
287
251
|
if (e.button != null && e.button !== 0) {
|
|
288
252
|
return;
|
|
289
253
|
}
|
|
290
|
-
|
|
291
254
|
this.setState({
|
|
292
255
|
mouseDownIndex: index
|
|
293
256
|
});
|
|
294
|
-
window.addEventListener('mouseup', this.handleWindowMouseUp);
|
|
257
|
+
window.addEventListener('mouseup', this.handleWindowMouseUp);
|
|
258
|
+
|
|
259
|
+
// Leave selection until mouse up, to allow for dragging behaviour
|
|
295
260
|
}
|
|
296
261
|
|
|
297
262
|
handleItemBlur(itemIndex, e) {
|
|
298
263
|
log.debug2('item blur', itemIndex, e.currentTarget, e.relatedTarget);
|
|
299
|
-
|
|
300
264
|
if (!e.relatedTarget || this.listContainer.current && e.relatedTarget instanceof HTMLElement && !this.listContainer.current.contains(e.relatedTarget)) {
|
|
301
265
|
// Next focused element is outside of the ItemList
|
|
302
266
|
this.setState({
|
|
@@ -304,24 +268,20 @@ export class ItemList extends PureComponent {
|
|
|
304
268
|
});
|
|
305
269
|
}
|
|
306
270
|
}
|
|
307
|
-
|
|
308
271
|
handleItemFocus(itemIndex, e) {
|
|
309
272
|
log.debug2('item focus', itemIndex, e.target);
|
|
310
273
|
this.setState(state => {
|
|
311
274
|
var {
|
|
312
275
|
focusIndex
|
|
313
276
|
} = state;
|
|
314
|
-
|
|
315
277
|
if (focusIndex !== itemIndex) {
|
|
316
278
|
return {
|
|
317
279
|
focusIndex: itemIndex
|
|
318
280
|
};
|
|
319
281
|
}
|
|
320
|
-
|
|
321
282
|
return null;
|
|
322
283
|
});
|
|
323
284
|
}
|
|
324
|
-
|
|
325
285
|
handleItemMouseMove(itemIndex, e) {
|
|
326
286
|
var {
|
|
327
287
|
isDragSelect,
|
|
@@ -336,23 +296,19 @@ export class ItemList extends PureComponent {
|
|
|
336
296
|
this.setState({
|
|
337
297
|
isDragging: true
|
|
338
298
|
});
|
|
339
|
-
|
|
340
299
|
if (isDragSelect || mouseDownIndex === itemIndex) {
|
|
341
300
|
this.focusItem(itemIndex);
|
|
342
|
-
|
|
343
301
|
if (isMultiSelect) {
|
|
344
302
|
if (!isDragSelect && !this.getItemSelected(itemIndex, selectedRanges) && !ContextActionUtils.isModifierKeyDown(e)) {
|
|
345
303
|
// If there's already a selection and they select outside of that range while dragging without a modifier key, start a new selection with just the new item
|
|
346
304
|
this.deselectAll();
|
|
347
305
|
}
|
|
348
|
-
|
|
349
306
|
this.selectRange([Math.min(mouseDownIndex, itemIndex), Math.max(mouseDownIndex, itemIndex)]);
|
|
350
307
|
} else {
|
|
351
308
|
this.toggleSelect(itemIndex, e.shiftKey, ContextActionUtils.isModifierKeyDown(e), false);
|
|
352
309
|
}
|
|
353
310
|
}
|
|
354
311
|
}
|
|
355
|
-
|
|
356
312
|
handleItemMouseUp(index, e) {
|
|
357
313
|
var {
|
|
358
314
|
isDeselectOnClick,
|
|
@@ -363,25 +319,20 @@ export class ItemList extends PureComponent {
|
|
|
363
319
|
mouseDownIndex,
|
|
364
320
|
isDragging
|
|
365
321
|
} = this.state;
|
|
366
|
-
|
|
367
322
|
if (e.target instanceof HTMLElement && ['button', 'select', 'input', 'textarea'].indexOf(e.target.tagName.toLowerCase()) !== -1) {
|
|
368
323
|
return;
|
|
369
324
|
}
|
|
370
|
-
|
|
371
325
|
if (mouseDownIndex === index && !isDragging) {
|
|
372
326
|
var isShiftDown = e.shiftKey;
|
|
373
327
|
var isModifierDown = ContextActionUtils.isModifierKeyDown(e);
|
|
374
328
|
this.focusItem(index);
|
|
375
329
|
this.toggleSelect(index, isShiftDown, isModifierDown, isDeselectOnClick);
|
|
376
|
-
|
|
377
330
|
if (!isDoubleClickSelect && !isShiftDown && !isModifierDown) {
|
|
378
331
|
onSelect(index, e);
|
|
379
332
|
}
|
|
380
333
|
}
|
|
381
|
-
|
|
382
334
|
this.resetMouseState();
|
|
383
335
|
}
|
|
384
|
-
|
|
385
336
|
handleItemsRendered(_ref4) {
|
|
386
337
|
var {
|
|
387
338
|
overscanStartIndex
|
|
@@ -390,7 +341,6 @@ export class ItemList extends PureComponent {
|
|
|
390
341
|
overscanStartIndex
|
|
391
342
|
});
|
|
392
343
|
}
|
|
393
|
-
|
|
394
344
|
handleResize(_ref5) {
|
|
395
345
|
var {
|
|
396
346
|
height
|
|
@@ -399,18 +349,15 @@ export class ItemList extends PureComponent {
|
|
|
399
349
|
height
|
|
400
350
|
});
|
|
401
351
|
}
|
|
402
|
-
|
|
403
352
|
handleMouseLeave() {
|
|
404
353
|
this.setState({
|
|
405
354
|
mouseDownIndex: null
|
|
406
355
|
});
|
|
407
356
|
}
|
|
408
|
-
|
|
409
357
|
handleWindowMouseUp() {
|
|
410
358
|
this.resetMouseState();
|
|
411
359
|
window.removeEventListener('mouseup', this.handleWindowMouseUp);
|
|
412
360
|
}
|
|
413
|
-
|
|
414
361
|
handleKeyDown(e) {
|
|
415
362
|
var {
|
|
416
363
|
isMultiSelect,
|
|
@@ -421,7 +368,6 @@ export class ItemList extends PureComponent {
|
|
|
421
368
|
focusIndex: oldFocus
|
|
422
369
|
} = this.state;
|
|
423
370
|
var newFocus = oldFocus;
|
|
424
|
-
|
|
425
371
|
if (e.key === 'Enter' || e.key === ' ') {
|
|
426
372
|
if (!isMultiSelect && newFocus != null) {
|
|
427
373
|
this.setState({
|
|
@@ -432,10 +378,8 @@ export class ItemList extends PureComponent {
|
|
|
432
378
|
}
|
|
433
379
|
});
|
|
434
380
|
}
|
|
435
|
-
|
|
436
381
|
return;
|
|
437
382
|
}
|
|
438
|
-
|
|
439
383
|
if (e.key === 'ArrowUp') {
|
|
440
384
|
if (newFocus != null && newFocus >= 0) {
|
|
441
385
|
newFocus = Math.max(0, newFocus - 1);
|
|
@@ -451,7 +395,6 @@ export class ItemList extends PureComponent {
|
|
|
451
395
|
} else {
|
|
452
396
|
return;
|
|
453
397
|
}
|
|
454
|
-
|
|
455
398
|
if (oldFocus !== newFocus) {
|
|
456
399
|
e.stopPropagation();
|
|
457
400
|
e.preventDefault();
|
|
@@ -459,26 +402,21 @@ export class ItemList extends PureComponent {
|
|
|
459
402
|
var {
|
|
460
403
|
selectedRanges
|
|
461
404
|
} = this.state;
|
|
462
|
-
|
|
463
405
|
if (e.shiftKey && selectedRanges.length > 0) {
|
|
464
406
|
var lastRange = selectedRanges[selectedRanges.length - 1];
|
|
465
407
|
this.selectRange([Math.min(newFocus, lastRange[0]), Math.max(newFocus, lastRange[1])]);
|
|
466
408
|
} else {
|
|
467
409
|
this.deselectAll();
|
|
468
|
-
|
|
469
410
|
if (newFocus !== null) {
|
|
470
411
|
this.selectItem(newFocus);
|
|
471
412
|
} else {
|
|
472
413
|
var _this$listContainer$c3;
|
|
473
|
-
|
|
474
414
|
(_this$listContainer$c3 = this.listContainer.current) === null || _this$listContainer$c3 === void 0 ? void 0 : _this$listContainer$c3.focus();
|
|
475
415
|
}
|
|
476
416
|
}
|
|
477
|
-
|
|
478
417
|
this.scrollIntoView(newFocus);
|
|
479
418
|
}
|
|
480
419
|
}
|
|
481
|
-
|
|
482
420
|
handleScroll(_ref6) {
|
|
483
421
|
var {
|
|
484
422
|
scrollUpdateWasRequested,
|
|
@@ -492,7 +430,6 @@ export class ItemList extends PureComponent {
|
|
|
492
430
|
scrollOffset
|
|
493
431
|
};
|
|
494
432
|
}
|
|
495
|
-
|
|
496
433
|
var {
|
|
497
434
|
isStickyBottom
|
|
498
435
|
} = this.props;
|
|
@@ -509,37 +446,32 @@ export class ItemList extends PureComponent {
|
|
|
509
446
|
};
|
|
510
447
|
});
|
|
511
448
|
}
|
|
512
|
-
|
|
513
449
|
resetMouseState() {
|
|
514
450
|
this.setState({
|
|
515
451
|
mouseDownIndex: null,
|
|
516
452
|
isDragging: false
|
|
517
453
|
});
|
|
518
454
|
}
|
|
519
|
-
|
|
520
455
|
scrollToBottom() {
|
|
521
456
|
var {
|
|
522
457
|
itemCount
|
|
523
458
|
} = this.props;
|
|
524
|
-
|
|
525
459
|
if (this.list.current) {
|
|
526
460
|
this.list.current.scrollToItem(itemCount);
|
|
527
461
|
}
|
|
528
462
|
}
|
|
529
|
-
|
|
530
463
|
scrollIntoView(itemIndex) {
|
|
531
464
|
if (this.list.current) {
|
|
532
465
|
this.list.current.scrollToItem(itemIndex);
|
|
533
466
|
}
|
|
534
467
|
}
|
|
468
|
+
|
|
535
469
|
/**
|
|
536
470
|
* @param index The index to toggle selection for
|
|
537
471
|
* @param isShiftDown True if the shift modifier key is down
|
|
538
472
|
* @param isModifierDown True if the meta modifier key is down
|
|
539
473
|
* @param isDeselectable True if item should be deselected if already selected
|
|
540
474
|
*/
|
|
541
|
-
|
|
542
|
-
|
|
543
475
|
toggleSelect(index, isShiftDown, isModifierDown) {
|
|
544
476
|
var isDeselectable = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : true;
|
|
545
477
|
var {
|
|
@@ -548,7 +480,6 @@ export class ItemList extends PureComponent {
|
|
|
548
480
|
var {
|
|
549
481
|
selectedRanges
|
|
550
482
|
} = this.state;
|
|
551
|
-
|
|
552
483
|
if (isMultiSelect && isShiftDown && selectedRanges.length > 0) {
|
|
553
484
|
var lastRange = selectedRanges[selectedRanges.length - 1];
|
|
554
485
|
this.selectRange([Math.min(lastRange[0], index), Math.max(index, lastRange[1])]);
|
|
@@ -569,18 +500,15 @@ export class ItemList extends PureComponent {
|
|
|
569
500
|
this.selectItem(index);
|
|
570
501
|
}
|
|
571
502
|
}
|
|
572
|
-
|
|
573
503
|
deselectAll() {
|
|
574
504
|
var {
|
|
575
505
|
itemCount
|
|
576
506
|
} = this.props;
|
|
577
507
|
this.deselectRange([0, itemCount]);
|
|
578
508
|
}
|
|
579
|
-
|
|
580
509
|
deselectItem(index) {
|
|
581
510
|
this.deselectRange([index, index]);
|
|
582
511
|
}
|
|
583
|
-
|
|
584
512
|
deselectRange(range) {
|
|
585
513
|
RangeUtils.validateRange(range);
|
|
586
514
|
this.setState(_ref7 => {
|
|
@@ -592,7 +520,6 @@ export class ItemList extends PureComponent {
|
|
|
592
520
|
};
|
|
593
521
|
});
|
|
594
522
|
}
|
|
595
|
-
|
|
596
523
|
selectItem(index) {
|
|
597
524
|
var {
|
|
598
525
|
disableSelect
|
|
@@ -600,7 +527,6 @@ export class ItemList extends PureComponent {
|
|
|
600
527
|
if (disableSelect) return;
|
|
601
528
|
this.selectRange([index, index]);
|
|
602
529
|
}
|
|
603
|
-
|
|
604
530
|
selectRange(range) {
|
|
605
531
|
RangeUtils.validateRange(range);
|
|
606
532
|
this.setState(_ref8 => {
|
|
@@ -612,50 +538,40 @@ export class ItemList extends PureComponent {
|
|
|
612
538
|
};
|
|
613
539
|
});
|
|
614
540
|
}
|
|
615
|
-
|
|
616
541
|
setSelectedRanges(selectedRanges) {
|
|
617
542
|
this.setState({
|
|
618
543
|
selectedRanges
|
|
619
544
|
});
|
|
620
545
|
}
|
|
621
|
-
|
|
622
546
|
sendViewportUpdate() {
|
|
623
547
|
var {
|
|
624
548
|
scrollOffset,
|
|
625
549
|
height
|
|
626
550
|
} = this.state;
|
|
627
|
-
|
|
628
551
|
if (scrollOffset != null && height != null) {
|
|
629
552
|
var {
|
|
630
553
|
onViewportChange: _onViewportChange,
|
|
631
554
|
rowHeight
|
|
632
555
|
} = this.props;
|
|
633
|
-
|
|
634
556
|
var _topRow = Math.floor(scrollOffset / rowHeight);
|
|
635
|
-
|
|
636
557
|
var _bottomRow = _topRow + Math.ceil(height / rowHeight);
|
|
637
|
-
|
|
638
558
|
_onViewportChange(_topRow, _bottomRow);
|
|
639
559
|
}
|
|
640
560
|
}
|
|
641
|
-
|
|
642
561
|
isListAtBottom() {
|
|
643
562
|
var {
|
|
644
563
|
scrollOffset,
|
|
645
564
|
height
|
|
646
565
|
} = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.state;
|
|
647
|
-
|
|
648
566
|
if (height == null || scrollOffset == null) {
|
|
649
567
|
return false;
|
|
650
568
|
}
|
|
651
|
-
|
|
652
569
|
var {
|
|
653
570
|
itemCount,
|
|
654
571
|
rowHeight
|
|
655
572
|
} = this.props;
|
|
656
573
|
return scrollOffset + height >= itemCount * rowHeight;
|
|
657
574
|
}
|
|
658
|
-
|
|
659
575
|
renderInnerElement(_ref9) {
|
|
660
576
|
var {
|
|
661
577
|
index: itemIndex,
|
|
@@ -671,15 +587,12 @@ export class ItemList extends PureComponent {
|
|
|
671
587
|
focusIndex,
|
|
672
588
|
selectedRanges
|
|
673
589
|
} = this.state;
|
|
674
|
-
|
|
675
590
|
if (itemIndex < offset || itemIndex >= offset + items.length) {
|
|
676
591
|
return null;
|
|
677
592
|
}
|
|
678
|
-
|
|
679
593
|
var item = items[itemIndex - offset];
|
|
680
594
|
return this.getCachedItem(itemIndex, itemIndex, item, itemIndex === focusIndex && !disableSelect, this.getItemSelected(itemIndex, selectedRanges), renderItem, style, disableSelect);
|
|
681
595
|
}
|
|
682
|
-
|
|
683
596
|
render() {
|
|
684
597
|
var {
|
|
685
598
|
items,
|
|
@@ -707,7 +620,8 @@ export class ItemList extends PureComponent {
|
|
|
707
620
|
width: width,
|
|
708
621
|
initialScrollOffset: isStuckToBottom ? itemCount * rowHeight : 0,
|
|
709
622
|
itemCount: itemCount,
|
|
710
|
-
itemSize: rowHeight
|
|
623
|
+
itemSize: rowHeight
|
|
624
|
+
// This prop isn't actually used by us, it is passed to the render function by react-window
|
|
711
625
|
// Used here to force a re-render of the List component.
|
|
712
626
|
// Otherwise it doesn't know to call the render again when selection or renderItem changes
|
|
713
627
|
,
|
|
@@ -723,15 +637,10 @@ export class ItemList extends PureComponent {
|
|
|
723
637
|
}, this.renderInnerElement);
|
|
724
638
|
});
|
|
725
639
|
}
|
|
726
|
-
|
|
727
640
|
}
|
|
728
|
-
|
|
729
641
|
_defineProperty(ItemList, "CACHE_SIZE", 1000);
|
|
730
|
-
|
|
731
642
|
_defineProperty(ItemList, "DEFAULT_ROW_HEIGHT", 20);
|
|
732
|
-
|
|
733
643
|
_defineProperty(ItemList, "DEFAULT_OVERSCAN", 10);
|
|
734
|
-
|
|
735
644
|
_defineProperty(ItemList, "defaultProps", {
|
|
736
645
|
offset: 0,
|
|
737
646
|
items: [],
|
|
@@ -742,25 +651,23 @@ _defineProperty(ItemList, "defaultProps", {
|
|
|
742
651
|
isMultiSelect: false,
|
|
743
652
|
isStickyBottom: false,
|
|
744
653
|
disableSelect: false,
|
|
745
|
-
|
|
746
|
-
|
|
654
|
+
onFocusChange() {
|
|
655
|
+
// no-op
|
|
747
656
|
},
|
|
748
|
-
|
|
749
|
-
|
|
657
|
+
onSelect() {
|
|
658
|
+
// no-op
|
|
750
659
|
},
|
|
751
|
-
|
|
752
|
-
|
|
660
|
+
onSelectionChange() {
|
|
661
|
+
// no-op
|
|
753
662
|
},
|
|
754
|
-
|
|
755
|
-
|
|
663
|
+
onViewportChange() {
|
|
664
|
+
// no-op
|
|
756
665
|
},
|
|
757
|
-
|
|
758
666
|
overscanCount: ItemList.DEFAULT_OVERSCAN,
|
|
759
667
|
renderItem: ItemList.renderItem,
|
|
760
668
|
selectedRanges: [],
|
|
761
669
|
focusSelector: '.item-list-item',
|
|
762
670
|
'data-testid': undefined
|
|
763
671
|
});
|
|
764
|
-
|
|
765
672
|
export default ItemList;
|
|
766
673
|
//# sourceMappingURL=ItemList.js.map
|