@jetbrains/ring-ui-built 6.0.32 → 6.0.34
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/components/_helpers/_rollupPluginBabelHelpers.js +567 -1
- package/components/_helpers/anchor.js +6 -7
- package/components/_helpers/button__classes.js +14 -16
- package/components/_helpers/caption.js +20 -14
- package/components/_helpers/card.js +105 -95
- package/components/_helpers/dialog__body-scroll-preventer.js +19 -11
- package/components/_helpers/icon__svg.js +25 -22
- package/components/_helpers/input.js +176 -146
- package/components/_helpers/query-assist__suggestions.js +90 -74
- package/components/_helpers/select__filter.js +69 -48
- package/components/_helpers/services-link.js +37 -29
- package/components/_helpers/sidebar.js +107 -99
- package/components/_helpers/tab-link.js +7 -7
- package/components/_helpers/theme.js +40 -31
- package/components/_helpers/title.js +72 -57
- package/components/alert/alert.js +202 -150
- package/components/alert/container.js +41 -32
- package/components/alert-service/alert-service.js +170 -105
- package/components/analytics/analytics.js +22 -12
- package/components/analytics/analytics__custom-plugin.js +75 -54
- package/components/auth/auth.js +36 -4
- package/components/auth/auth__core.js +1471 -746
- package/components/auth/background-flow.js +127 -87
- package/components/auth/down-notification.js +73 -30
- package/components/auth/iframe-flow.js +133 -75
- package/components/auth/request-builder.js +82 -46
- package/components/auth/response-parser.js +116 -86
- package/components/auth/storage.js +334 -171
- package/components/auth/token-validator.js +242 -137
- package/components/auth/window-flow.js +134 -92
- package/components/auth-dialog/auth-dialog.js +172 -114
- package/components/auth-dialog-service/auth-dialog-service.js +31 -8
- package/components/avatar/avatar-example-datauri.js +1 -23
- package/components/avatar/avatar.js +152 -119
- package/components/avatar/fallback-avatar.js +38 -22
- package/components/badge/badge.js +45 -35
- package/components/button/button.js +107 -86
- package/components/button-group/button-group.js +33 -19
- package/components/button-set/button-set.js +32 -20
- package/components/button-toolbar/button-toolbar.js +31 -19
- package/components/caret/caret.js +220 -186
- package/components/checkbox/checkbox.js +101 -76
- package/components/clipboard/clipboard-fallback.js +10 -10
- package/components/clipboard/clipboard.js +132 -35
- package/components/code/code.js +166 -92
- package/components/collapse/collapse-content.js +64 -42
- package/components/collapse/collapse-context.js +2 -2
- package/components/collapse/collapse-control.js +14 -12
- package/components/collapse/collapse.js +17 -11
- package/components/collapse/consts.js +4 -4
- package/components/collapse/utils.js +3 -1
- package/components/confirm/confirm.js +104 -66
- package/components/confirm-service/confirm-service.js +59 -37
- package/components/content-layout/content-layout.js +64 -43
- package/components/content-layout/sidebar.js +1 -0
- package/components/contenteditable/contenteditable.js +59 -50
- package/components/control-label/control-label.js +9 -9
- package/components/data-list/data-list.js +182 -129
- package/components/data-list/data-list.mock.js +6 -2
- package/components/data-list/item.js +170 -143
- package/components/data-list/selection.js +136 -76
- package/components/data-list/title.js +12 -1
- package/components/date-picker/consts.js +26 -19
- package/components/date-picker/date-input.js +144 -113
- package/components/date-picker/date-picker.js +282 -227
- package/components/date-picker/date-popup.js +395 -350
- package/components/date-picker/day.js +116 -87
- package/components/date-picker/month-names.js +66 -43
- package/components/date-picker/month-slider.js +76 -51
- package/components/date-picker/month.js +25 -16
- package/components/date-picker/months.js +50 -43
- package/components/date-picker/weekdays.js +22 -12
- package/components/date-picker/years.js +110 -83
- package/components/dialog/dialog.js +190 -142
- package/components/dialog/dialog__body-scroll-preventer.js +4 -0
- package/components/dropdown/anchor.js +9 -0
- package/components/dropdown/dropdown.js +213 -182
- package/components/dropdown-menu/dropdown-menu.js +97 -71
- package/components/editable-heading/editable-heading.js +127 -75
- package/components/error-bubble/error-bubble.js +60 -31
- package/components/error-message/error-message.js +59 -39
- package/components/footer/footer.js +30 -27
- package/components/global/compose.js +10 -1
- package/components/global/composeRefs.js +12 -7
- package/components/global/controls-height.js +2 -2
- package/components/global/create-stateful-context.js +15 -15
- package/components/global/data-tests.js +14 -6
- package/components/global/dom.js +86 -47
- package/components/global/focus-sensor-hoc.js +132 -122
- package/components/global/fuzzy-highlight.js +36 -22
- package/components/global/get-event-key.js +8 -8
- package/components/global/get-uid.js +8 -4
- package/components/global/inject-styles.js +15 -10
- package/components/global/listeners.js +51 -27
- package/components/global/memoize.js +12 -6
- package/components/global/normalize-indent.js +50 -19
- package/components/global/promise-with-timeout.js +8 -6
- package/components/global/prop-types.js +5 -3
- package/components/global/react-dom-renderer.js +44 -28
- package/components/global/react-render-adapter.js +1 -1
- package/components/global/rerender-hoc.js +30 -12
- package/components/global/schedule-raf.js +6 -5
- package/components/global/sniffer.js +1 -1
- package/components/global/theme.js +22 -0
- package/components/global/trivial-template-tag.js +10 -3
- package/components/global/typescript-utils.js +6 -2
- package/components/global/url.js +26 -20
- package/components/global/use-event-callback.js +4 -6
- package/components/grid/col.js +52 -35
- package/components/grid/grid.js +31 -17
- package/components/grid/row.js +47 -35
- package/components/group/group.js +25 -17
- package/components/header/header.js +78 -33
- package/components/header/logo.js +36 -20
- package/components/header/profile.js +199 -166
- package/components/header/services-link.js +4 -0
- package/components/header/services.js +116 -73
- package/components/header/smart-profile.js +203 -111
- package/components/header/smart-services.js +113 -62
- package/components/header/tray-icon.js +37 -21
- package/components/header/tray.js +32 -21
- package/components/heading/heading.js +25 -24
- package/components/http/http.d.ts +1 -2
- package/components/http/http.js +345 -203
- package/components/http/http.mock.d.ts +1 -5
- package/components/http/http.mock.js +101 -49
- package/components/hub-source/hub-source.js +190 -83
- package/components/hub-source/hub-source__user.js +44 -11
- package/components/hub-source/hub-source__users-groups.js +65 -37
- package/components/i18n/i18n-context.js +10 -7
- package/components/i18n/i18n.js +10 -7
- package/components/icon/icon.js +93 -76
- package/components/icon/icon__svg.js +8 -0
- package/components/icon/index.js +8 -0
- package/components/input/input.js +13 -0
- package/components/island/adaptive-island-hoc.js +43 -30
- package/components/island/content.js +132 -115
- package/components/island/header.js +70 -57
- package/components/island/island.js +40 -28
- package/components/island-legacy/content-legacy.js +25 -17
- package/components/island-legacy/header-legacy.js +27 -19
- package/components/island-legacy/island-legacy.js +25 -17
- package/components/link/clickableLink.js +59 -44
- package/components/link/link.js +68 -57
- package/components/list/consts.js +2 -2
- package/components/list/list.js +698 -611
- package/components/list/list__custom.js +62 -44
- package/components/list/list__hint.js +19 -10
- package/components/list/list__item.js +174 -133
- package/components/list/list__link.js +50 -37
- package/components/list/list__separator.js +24 -14
- package/components/list/list__title.js +32 -22
- package/components/list/list__users-groups-source.js +126 -54
- package/components/loader/loader.js +74 -43
- package/components/loader/loader__core.js +263 -198
- package/components/loader-inline/loader-inline.js +35 -23
- package/components/loader-screen/loader-screen.js +46 -25
- package/components/login-dialog/login-dialog.js +158 -111
- package/components/login-dialog/service.js +34 -8
- package/components/markdown/markdown.js +23 -15
- package/components/message/message.js +203 -161
- package/components/old-browsers-message/old-browsers-message.js +18 -11
- package/components/old-browsers-message/old-browsers-message__stop.js +7 -0
- package/components/old-browsers-message/white-list.js +17 -9
- package/components/pager/pager.js +271 -212
- package/components/panel/panel.js +25 -17
- package/components/permissions/permissions.js +172 -127
- package/components/permissions/permissions__cache.js +224 -194
- package/components/popup/popup.consts.js +1 -1
- package/components/popup/popup.js +343 -284
- package/components/popup/popup.target.js +8 -9
- package/components/popup/position.js +106 -96
- package/components/popup-menu/popup-menu.js +81 -44
- package/components/progress-bar/progress-bar.js +104 -87
- package/components/query-assist/query-assist.js +916 -838
- package/components/query-assist/query-assist__suggestions.js +30 -1
- package/components/radio/radio.js +34 -19
- package/components/radio/radio__item.js +69 -52
- package/components/select/select.js +957 -852
- package/components/select/select__filter.js +30 -0
- package/components/select/select__popup.js +487 -373
- package/components/shortcuts/core.js +217 -166
- package/components/shortcuts/shortcut-title.js +11 -6
- package/components/shortcuts/shortcuts-hoc.js +45 -19
- package/components/shortcuts/shortcuts.js +75 -50
- package/components/slider/slider.js +122 -99
- package/components/slider/slider.utils.js +24 -14
- package/components/storage/storage.js +33 -4
- package/components/storage/storage__fallback.js +224 -149
- package/components/storage/storage__local.js +153 -90
- package/components/tab-trap/tab-trap.js +153 -122
- package/components/table/cell.js +26 -14
- package/components/table/disable-hover-hoc.js +51 -33
- package/components/table/header-cell.js +89 -64
- package/components/table/header.js +132 -104
- package/components/table/multitable.js +125 -107
- package/components/table/row-with-focus-sensor.js +69 -25
- package/components/table/row.js +216 -175
- package/components/table/selection-adapter.js +3 -1
- package/components/table/selection-shortcuts-hoc.js +181 -180
- package/components/table/selection.js +226 -156
- package/components/table/smart-table.js +88 -50
- package/components/table/table.js +358 -289
- package/components/tabs/collapsible-more.js +79 -46
- package/components/tabs/collapsible-tab.js +38 -31
- package/components/tabs/collapsible-tabs.js +153 -88
- package/components/tabs/custom-item.js +2 -4
- package/components/tabs/dumb-tabs.js +117 -74
- package/components/tabs/smart-tabs.js +69 -29
- package/components/tabs/tab-link.js +5 -1
- package/components/tabs/tab.js +31 -19
- package/components/tabs/tabs.js +31 -0
- package/components/tag/tag.js +173 -133
- package/components/tags-input/tags-input.js +427 -329
- package/components/tags-list/tags-list.js +78 -57
- package/components/text/text.js +39 -28
- package/components/toggle/toggle.js +70 -56
- package/components/tooltip/tooltip.js +190 -146
- package/components/user-agreement/service.js +371 -228
- package/components/user-agreement/toolbox.eula.js +1 -160
- package/components/user-agreement/user-agreement.js +120 -85
- package/components/user-card/card.js +29 -0
- package/components/user-card/smart-user-card-tooltip.js +111 -51
- package/components/user-card/tooltip.js +84 -47
- package/components/user-card/user-card.js +29 -0
- package/package.json +1 -2
@@ -1,3 +1,10 @@
|
|
1
|
+
import { _ as _defineProperty, a as _inherits, b as _createClass, f as _classCallCheck, g as _callSuper } from '../_helpers/_rollupPluginBabelHelpers.js';
|
2
|
+
import 'core-js/modules/es.array.concat.js';
|
3
|
+
import 'core-js/modules/es.array.filter.js';
|
4
|
+
import 'core-js/modules/es.array.index-of.js';
|
5
|
+
import 'core-js/modules/es.array.reduce.js';
|
6
|
+
import 'core-js/modules/es.array.slice.js';
|
7
|
+
import 'core-js/modules/es.object.to-string.js';
|
1
8
|
import React, { PureComponent } from 'react';
|
2
9
|
import classNames from 'classnames';
|
3
10
|
import searchIcon from '@jetbrains/icons/search';
|
@@ -23,14 +30,34 @@ import { refObject } from '../global/prop-types.js';
|
|
23
30
|
import composeRefs from '../global/composeRefs.js';
|
24
31
|
import { DEFAULT_DIRECTIONS } from '../popup/popup.consts.js';
|
25
32
|
import { S as SelectFilter, m as modules_b607bec2 } from '../_helpers/select__filter.js';
|
26
|
-
import '../_helpers/_rollupPluginBabelHelpers.js';
|
27
33
|
import 'util-deprecate';
|
28
34
|
import '../icon/icon__constants.js';
|
29
35
|
import '../_helpers/icon__svg.js';
|
36
|
+
import 'core-js/modules/es.regexp.exec.js';
|
37
|
+
import 'core-js/modules/es.string.replace.js';
|
38
|
+
import 'core-js/modules/es.string.starts-with.js';
|
39
|
+
import 'core-js/modules/es.array.iterator.js';
|
40
|
+
import 'core-js/modules/es.map.js';
|
41
|
+
import 'core-js/modules/es.weak-map.js';
|
42
|
+
import 'core-js/modules/web.dom-collections.iterator.js';
|
43
|
+
import 'core-js/modules/es.object.entries.js';
|
44
|
+
import 'core-js/modules/es.regexp.to-string.js';
|
45
|
+
import 'core-js/modules/web.dom-collections.for-each.js';
|
30
46
|
import 'react-dom';
|
31
47
|
import '../global/schedule-raf.js';
|
32
48
|
import '../global/data-tests.js';
|
33
49
|
import '../tab-trap/tab-trap.js';
|
50
|
+
import 'core-js/modules/es.array.includes.js';
|
51
|
+
import 'core-js/modules/es.array.map.js';
|
52
|
+
import 'core-js/modules/es.array.sort.js';
|
53
|
+
import 'core-js/modules/es.string.includes.js';
|
54
|
+
import 'core-js/modules/es.object.assign.js';
|
55
|
+
import 'core-js/modules/es.set.js';
|
56
|
+
import 'core-js/modules/es.string.split.js';
|
57
|
+
import 'core-js/modules/es.symbol.js';
|
58
|
+
import 'core-js/modules/es.symbol.description.js';
|
59
|
+
import 'core-js/modules/es.array.find.js';
|
60
|
+
import 'core-js/modules/es.array.find-index.js';
|
34
61
|
import 'react-virtualized/dist/es/List';
|
35
62
|
import 'react-virtualized/dist/es/AutoSizer';
|
36
63
|
import 'react-virtualized/dist/es/WindowScroller';
|
@@ -44,7 +71,9 @@ import '../_helpers/list.js';
|
|
44
71
|
import '../list/list__item.js';
|
45
72
|
import '../avatar/avatar.js';
|
46
73
|
import '../global/url.js';
|
74
|
+
import 'core-js/modules/es.string.match.js';
|
47
75
|
import '../avatar/fallback-avatar.js';
|
76
|
+
import 'core-js/modules/es.array.from.js';
|
48
77
|
import '../checkbox/checkbox.js';
|
49
78
|
import '@jetbrains/icons/checkmark-12px';
|
50
79
|
import '@jetbrains/icons/remove-12px';
|
@@ -55,6 +84,7 @@ import '../list/list__separator.js';
|
|
55
84
|
import '../list/list__hint.js';
|
56
85
|
import '../list/consts.js';
|
57
86
|
import '../shortcuts/core.js';
|
87
|
+
import 'core-js/modules/es.array.splice.js';
|
58
88
|
import 'combokeys';
|
59
89
|
import '../global/sniffer.js';
|
60
90
|
import 'sniffr';
|
@@ -63,407 +93,491 @@ import '@jetbrains/icons/close-12px';
|
|
63
93
|
import '@jetbrains/icons/chevron-10px';
|
64
94
|
import '../_helpers/button__classes.js';
|
65
95
|
import '../_helpers/input.js';
|
96
|
+
import 'core-js/modules/es.object.values.js';
|
66
97
|
import '../i18n/i18n-context.js';
|
67
98
|
import '../i18n/i18n.js';
|
68
99
|
import '../control-label/control-label.js';
|
69
100
|
|
70
|
-
|
71
|
-
|
101
|
+
var FILTER_HEIGHT = 35;
|
102
|
+
var TOOLBAR_HEIGHT = 49;
|
72
103
|
function noop() {}
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
|
78
|
-
|
79
|
-
|
80
|
-
filter: false,
|
81
|
-
filterIcon: null,
|
82
|
-
filterRef: noop,
|
83
|
-
multiple: false,
|
84
|
-
message: null,
|
85
|
-
anchorElement: null,
|
86
|
-
maxHeight: 600,
|
87
|
-
minWidth: 240,
|
88
|
-
loading: false,
|
89
|
-
onSelect: noop,
|
90
|
-
onCloseAttempt: noop,
|
91
|
-
onOutsideClick: noop,
|
92
|
-
onFilter: noop,
|
93
|
-
onClear: noop,
|
94
|
-
onLoadMore: noop,
|
95
|
-
selected: [],
|
96
|
-
tags: null,
|
97
|
-
ringPopupTarget: null,
|
98
|
-
onSelectAll: noop,
|
99
|
-
onEmptyPopupEnter: noop
|
100
|
-
};
|
101
|
-
state = {
|
102
|
-
popupFilterShortcutsOptions: {
|
103
|
-
modal: true,
|
104
|
-
disabled: true
|
105
|
-
},
|
106
|
-
tagsActiveIndex: null
|
107
|
-
};
|
108
|
-
componentDidMount() {
|
109
|
-
window.document.addEventListener('mouseup', this.mouseUpHandler);
|
110
|
-
}
|
111
|
-
componentWillUnmount() {
|
112
|
-
window.document.removeEventListener('mouseup', this.mouseUpHandler);
|
113
|
-
}
|
114
|
-
isClickingPopup = false; // This flag is set to true while an item in the popup is being clicked
|
115
|
-
filter;
|
116
|
-
focusFilter() {
|
117
|
-
setTimeout(() => this.filter?.focus());
|
118
|
-
}
|
119
|
-
isEventTargetFilter(event) {
|
120
|
-
return event.target instanceof Element && event.target.matches('input,textarea');
|
121
|
-
}
|
122
|
-
caret;
|
123
|
-
handleNavigation(event, navigateLeft) {
|
124
|
-
if (this.isEventTargetFilter(event) && this.caret != null && Number(this.caret.getPosition()) > 0 || !Array.isArray(this.props.selected)) {
|
125
|
-
return;
|
126
|
-
}
|
127
|
-
let newIndex = null;
|
128
|
-
if (navigateLeft) {
|
129
|
-
newIndex = this.state.tagsActiveIndex === null ? this.props.selected.length - 1 : this.state.tagsActiveIndex - 1;
|
130
|
-
} else if (this.state.tagsActiveIndex !== null) {
|
131
|
-
newIndex = this.state.tagsActiveIndex + 1;
|
104
|
+
var FilterWithShortcuts = shortcutsHOC(SelectFilter);
|
105
|
+
var SelectPopup = /*#__PURE__*/function (_PureComponent) {
|
106
|
+
function SelectPopup() {
|
107
|
+
var _this;
|
108
|
+
_classCallCheck(this, SelectPopup);
|
109
|
+
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
110
|
+
args[_key] = arguments[_key];
|
132
111
|
}
|
133
|
-
|
134
|
-
|
135
|
-
|
136
|
-
|
137
|
-
|
138
|
-
|
112
|
+
_this = _callSuper(this, SelectPopup, [].concat(args));
|
113
|
+
_defineProperty(_this, "state", {
|
114
|
+
popupFilterShortcutsOptions: {
|
115
|
+
modal: true,
|
116
|
+
disabled: true
|
117
|
+
},
|
118
|
+
tagsActiveIndex: null
|
119
|
+
});
|
120
|
+
_defineProperty(_this, "isClickingPopup", false);
|
121
|
+
// This flag is set to true while an item in the popup is being clicked
|
122
|
+
_defineProperty(_this, "filter", void 0);
|
123
|
+
_defineProperty(_this, "caret", void 0);
|
124
|
+
_defineProperty(_this, "onFilterFocus", function () {
|
125
|
+
_this._togglePopupFilterShortcuts(false);
|
126
|
+
_this.setState({
|
127
|
+
tagsActiveIndex: null
|
128
|
+
});
|
129
|
+
});
|
130
|
+
_defineProperty(_this, "popupFilterOnBlur", function () {
|
131
|
+
if (_this.state.tagsActiveIndex === null) {
|
132
|
+
_this._togglePopupFilterShortcuts(true);
|
133
|
+
}
|
134
|
+
});
|
135
|
+
_defineProperty(_this, "mouseDownHandler", function () {
|
136
|
+
_this.isClickingPopup = true;
|
139
137
|
});
|
138
|
+
_defineProperty(_this, "mouseUpHandler", function () {
|
139
|
+
_this.isClickingPopup = false;
|
140
|
+
});
|
141
|
+
_defineProperty(_this, "popup", void 0);
|
142
|
+
_defineProperty(_this, "onListSelect", function (selected, event, opts) {
|
143
|
+
var getSelectItemEvent = function getSelectItemEvent() {
|
144
|
+
var customEvent = document.createEvent('Event');
|
145
|
+
customEvent.initEvent('select', true, false);
|
146
|
+
if (event && 'persist' in event) {
|
147
|
+
event.persist();
|
148
|
+
}
|
149
|
+
customEvent.originalEvent = event;
|
150
|
+
return customEvent;
|
151
|
+
};
|
152
|
+
_this.props.onSelect(selected, getSelectItemEvent(), opts);
|
153
|
+
});
|
154
|
+
_defineProperty(_this, "tabPress", function (event) {
|
155
|
+
_this.props.onCloseAttempt(event, true);
|
156
|
+
});
|
157
|
+
_defineProperty(_this, "onClickHandler", function () {
|
158
|
+
var _this$filter;
|
159
|
+
return (_this$filter = _this.filter) === null || _this$filter === void 0 ? void 0 : _this$filter.focus();
|
160
|
+
});
|
161
|
+
_defineProperty(_this, "handleRemoveTag", memoize(function (tag) {
|
162
|
+
return function (event) {
|
163
|
+
return _this.removeTag(tag, event);
|
164
|
+
};
|
165
|
+
}));
|
166
|
+
_defineProperty(_this, "handleTagClick", memoize(function (tag) {
|
167
|
+
return function () {
|
168
|
+
if (Array.isArray(_this.props.selected)) {
|
169
|
+
_this.setState({
|
170
|
+
tagsActiveIndex: _this.props.selected.indexOf(tag)
|
171
|
+
});
|
172
|
+
}
|
173
|
+
};
|
174
|
+
}));
|
175
|
+
_defineProperty(_this, "handleListResize", function () {
|
176
|
+
_this.forceUpdate();
|
177
|
+
});
|
178
|
+
_defineProperty(_this, "handleSelectAll", function () {
|
179
|
+
if (Array.isArray(_this.props.selected)) {
|
180
|
+
_this.props.onSelectAll(_this.props.data.filter(function (item) {
|
181
|
+
return !item.disabled;
|
182
|
+
}).length !== _this.props.selected.length);
|
183
|
+
}
|
184
|
+
});
|
185
|
+
_defineProperty(_this, "getSelectAll", function () {
|
186
|
+
var _multiple$renderSelec;
|
187
|
+
var multiple = _this.props.multiple;
|
188
|
+
var activeFilters = _this.props.data.filter(function (item) {
|
189
|
+
return !item.disabled;
|
190
|
+
});
|
191
|
+
return Array.isArray(_this.props.selected) && /*#__PURE__*/React.createElement("div", {
|
192
|
+
className: modules_b607bec2.selectAll
|
193
|
+
}, activeFilters.length === 0 ? /*#__PURE__*/React.createElement("span", null) : /*#__PURE__*/React.createElement(Button, {
|
194
|
+
text: true,
|
195
|
+
inline: true,
|
196
|
+
onClick: _this.handleSelectAll
|
197
|
+
}, activeFilters.length !== _this.props.selected.length ? multiple.selectAllLabel || 'Select all' : multiple.deselectAllLabel || 'Deselect all'), ((_multiple$renderSelec = multiple.renderSelectedItemsDescription) === null || _multiple$renderSelec === void 0 ? void 0 : _multiple$renderSelec.call(multiple, _this.props.selected, activeFilters.length)) || /*#__PURE__*/React.createElement(Text, {
|
198
|
+
info: true
|
199
|
+
}, "".concat(_this.props.selected.length, " selected")));
|
200
|
+
});
|
201
|
+
// Cache the value because this method is called
|
202
|
+
// inside `render` function which can be called N times
|
203
|
+
// and should be fast as possible.
|
204
|
+
// Cache invalidates each time hidden or userDefinedMaxHeight changes
|
205
|
+
_defineProperty(_this, "_adjustListMaxHeight", memoizeOne(function (hidden, userDefinedMaxHeight, ringPopupTarget) {
|
206
|
+
if (hidden) {
|
207
|
+
return userDefinedMaxHeight;
|
208
|
+
}
|
209
|
+
// Calculate list's maximum height that can't
|
210
|
+
// get beyond the screen
|
211
|
+
// @see RG-1838, JT-48358
|
212
|
+
var minMaxHeight = 100;
|
213
|
+
var directions = _this.props.directions || DEFAULT_DIRECTIONS;
|
214
|
+
// Note:
|
215
|
+
// Create a method which'll be called only when the popup opens and before
|
216
|
+
// render the list would be a better way
|
217
|
+
var anchorNode = _this.props.anchorElement;
|
218
|
+
var containerNode = getPopupContainer(ringPopupTarget) || document.documentElement;
|
219
|
+
return anchorNode != null ? Math.min(directions.reduce(function (maxHeight, direction) {
|
220
|
+
var _maxHeightForDirectio;
|
221
|
+
return Math.max(maxHeight, (_maxHeightForDirectio = maxHeightForDirection(direction, anchorNode, getStyles(containerNode).position !== 'static' ? containerNode : null)) !== null && _maxHeightForDirectio !== void 0 ? _maxHeightForDirectio : 0);
|
222
|
+
}, minMaxHeight), userDefinedMaxHeight) : userDefinedMaxHeight;
|
223
|
+
}));
|
224
|
+
_defineProperty(_this, "popupRef", function (el) {
|
225
|
+
_this.popup = el;
|
226
|
+
});
|
227
|
+
_defineProperty(_this, "list", void 0);
|
228
|
+
_defineProperty(_this, "listRef", function (el) {
|
229
|
+
_this.list = el;
|
230
|
+
});
|
231
|
+
_defineProperty(_this, "filterRef", function (el) {
|
232
|
+
_this.filter = el;
|
233
|
+
_this.caret = el && new Caret(el);
|
234
|
+
});
|
235
|
+
_defineProperty(_this, "shortcutsScope", getUID('select-popup-'));
|
236
|
+
_defineProperty(_this, "shortcutsMap", {
|
237
|
+
tab: _this.tabPress
|
238
|
+
});
|
239
|
+
_defineProperty(_this, "popupFilterShortcutsMap", {
|
240
|
+
up: function up(event) {
|
241
|
+
return _this.list && _this.list.upHandler(event);
|
242
|
+
},
|
243
|
+
down: function down(event) {
|
244
|
+
return _this.list && _this.list.downHandler(event);
|
245
|
+
},
|
246
|
+
home: function home(event) {
|
247
|
+
return _this.list && _this.list.homeHandler(event);
|
248
|
+
},
|
249
|
+
end: function end(event) {
|
250
|
+
return _this.list && _this.list.endHandler(event);
|
251
|
+
},
|
252
|
+
enter: function enter(event) {
|
253
|
+
return _this.list ? _this.list.enterHandler(event) : _this.props.onEmptyPopupEnter(event);
|
254
|
+
},
|
255
|
+
esc: function esc(event) {
|
256
|
+
return _this.props.onCloseAttempt(event, true);
|
257
|
+
},
|
258
|
+
tab: function tab(event) {
|
259
|
+
return _this.tabPress(event);
|
260
|
+
},
|
261
|
+
backspace: function backspace(event) {
|
262
|
+
return _this.handleBackspace(event);
|
263
|
+
},
|
264
|
+
del: function del() {
|
265
|
+
return _this.removeSelectedTag();
|
266
|
+
},
|
267
|
+
left: function left(event) {
|
268
|
+
return _this.handleNavigation(event, true);
|
269
|
+
},
|
270
|
+
right: function right(event) {
|
271
|
+
return _this.handleNavigation(event);
|
272
|
+
}
|
273
|
+
});
|
274
|
+
return _this;
|
140
275
|
}
|
141
|
-
|
142
|
-
|
143
|
-
|
276
|
+
_inherits(SelectPopup, _PureComponent);
|
277
|
+
return _createClass(SelectPopup, [{
|
278
|
+
key: "componentDidMount",
|
279
|
+
value: function componentDidMount() {
|
280
|
+
window.document.addEventListener('mouseup', this.mouseUpHandler);
|
281
|
+
}
|
282
|
+
}, {
|
283
|
+
key: "componentWillUnmount",
|
284
|
+
value: function componentWillUnmount() {
|
285
|
+
window.document.removeEventListener('mouseup', this.mouseUpHandler);
|
144
286
|
}
|
145
|
-
|
146
|
-
|
147
|
-
|
148
|
-
|
287
|
+
}, {
|
288
|
+
key: "focusFilter",
|
289
|
+
value: function focusFilter() {
|
290
|
+
var _this2 = this;
|
291
|
+
setTimeout(function () {
|
292
|
+
var _this2$filter;
|
293
|
+
return (_this2$filter = _this2.filter) === null || _this2$filter === void 0 ? void 0 : _this2$filter.focus();
|
149
294
|
});
|
295
|
+
}
|
296
|
+
}, {
|
297
|
+
key: "isEventTargetFilter",
|
298
|
+
value: function isEventTargetFilter(event) {
|
299
|
+
return event.target instanceof Element && event.target.matches('input,textarea');
|
300
|
+
}
|
301
|
+
}, {
|
302
|
+
key: "handleNavigation",
|
303
|
+
value: function handleNavigation(event, navigateLeft) {
|
304
|
+
if (this.isEventTargetFilter(event) && this.caret != null && Number(this.caret.getPosition()) > 0 || !Array.isArray(this.props.selected)) {
|
305
|
+
return;
|
306
|
+
}
|
307
|
+
var newIndex = null;
|
308
|
+
if (navigateLeft) {
|
309
|
+
newIndex = this.state.tagsActiveIndex === null ? this.props.selected.length - 1 : this.state.tagsActiveIndex - 1;
|
310
|
+
} else if (this.state.tagsActiveIndex !== null) {
|
311
|
+
newIndex = this.state.tagsActiveIndex + 1;
|
312
|
+
}
|
313
|
+
if (newIndex !== null && (newIndex >= this.props.selected.length || newIndex < 0)) {
|
314
|
+
newIndex = null;
|
315
|
+
this.focusFilter();
|
316
|
+
}
|
150
317
|
this.setState({
|
151
|
-
tagsActiveIndex:
|
318
|
+
tagsActiveIndex: newIndex
|
152
319
|
});
|
153
|
-
this.focusFilter();
|
154
320
|
}
|
155
|
-
}
|
156
|
-
|
157
|
-
|
158
|
-
|
159
|
-
|
321
|
+
}, {
|
322
|
+
key: "removeTag",
|
323
|
+
value: function removeTag(tag, event) {
|
324
|
+
if (!Array.isArray(this.props.selected)) {
|
325
|
+
return;
|
326
|
+
}
|
327
|
+
var _tag = tag || this.props.selected.slice(0)[this.props.selected.length - 1];
|
328
|
+
if (_tag) {
|
329
|
+
this.onListSelect(_tag, event, {
|
330
|
+
tryKeepOpen: true
|
331
|
+
});
|
332
|
+
this.setState({
|
333
|
+
tagsActiveIndex: null
|
334
|
+
});
|
335
|
+
this.focusFilter();
|
336
|
+
}
|
160
337
|
}
|
161
|
-
|
162
|
-
|
163
|
-
|
164
|
-
|
338
|
+
}, {
|
339
|
+
key: "removeSelectedTag",
|
340
|
+
value: function removeSelectedTag() {
|
341
|
+
if (Array.isArray(this.props.selected) && this.state.tagsActiveIndex != null) {
|
342
|
+
this.removeTag(this.props.selected[this.state.tagsActiveIndex]);
|
343
|
+
return false;
|
344
|
+
}
|
165
345
|
return true;
|
166
346
|
}
|
167
|
-
|
168
|
-
|
169
|
-
|
170
|
-
|
171
|
-
|
172
|
-
this.removeTag();
|
173
|
-
return false;
|
174
|
-
}
|
175
|
-
return true;
|
176
|
-
}
|
177
|
-
onFilterFocus = () => {
|
178
|
-
this._togglePopupFilterShortcuts(false);
|
179
|
-
this.setState({
|
180
|
-
tagsActiveIndex: null
|
181
|
-
});
|
182
|
-
};
|
183
|
-
popupFilterOnBlur = () => {
|
184
|
-
if (this.state.tagsActiveIndex === null) {
|
185
|
-
this._togglePopupFilterShortcuts(true);
|
186
|
-
}
|
187
|
-
};
|
188
|
-
_togglePopupFilterShortcuts(shortcutsDisabled) {
|
189
|
-
this.setState({
|
190
|
-
popupFilterShortcutsOptions: {
|
191
|
-
modal: true,
|
192
|
-
disabled: shortcutsDisabled
|
347
|
+
}, {
|
348
|
+
key: "handleBackspace",
|
349
|
+
value: function handleBackspace(event) {
|
350
|
+
if (!this.props.tags) {
|
351
|
+
return true;
|
193
352
|
}
|
194
|
-
|
195
|
-
|
196
|
-
|
197
|
-
this.isClickingPopup = true;
|
198
|
-
};
|
199
|
-
mouseUpHandler = () => {
|
200
|
-
this.isClickingPopup = false;
|
201
|
-
};
|
202
|
-
popup;
|
203
|
-
isVisible() {
|
204
|
-
return this.popup && this.popup.isVisible();
|
205
|
-
}
|
206
|
-
onListSelect = (selected, event, opts) => {
|
207
|
-
const getSelectItemEvent = () => {
|
208
|
-
const customEvent = document.createEvent('Event');
|
209
|
-
customEvent.initEvent('select', true, false);
|
210
|
-
if (event && 'persist' in event) {
|
211
|
-
event.persist();
|
353
|
+
if (!this.isEventTargetFilter(event)) {
|
354
|
+
this.removeSelectedTag();
|
355
|
+
return false;
|
212
356
|
}
|
213
|
-
|
214
|
-
|
215
|
-
|
216
|
-
|
217
|
-
|
218
|
-
tabPress = event => {
|
219
|
-
this.props.onCloseAttempt(event, true);
|
220
|
-
};
|
221
|
-
onClickHandler = () => this.filter?.focus();
|
222
|
-
getFilter() {
|
223
|
-
if (this.props.filter || this.props.tags) {
|
224
|
-
var _this$props$filterIco;
|
225
|
-
return /*#__PURE__*/React.createElement("div", {
|
226
|
-
className: modules_b607bec2.filterWrapper,
|
227
|
-
"data-test": "ring-select-popup-filter"
|
228
|
-
}, !this.props.tags && /*#__PURE__*/React.createElement(Icon, {
|
229
|
-
glyph: (_this$props$filterIco = this.props.filterIcon) !== null && _this$props$filterIco !== void 0 ? _this$props$filterIco : searchIcon,
|
230
|
-
className: modules_b607bec2.filterIcon,
|
231
|
-
"data-test-custom": "ring-select-popup-filter-icon"
|
232
|
-
}), /*#__PURE__*/React.createElement(FilterWithShortcuts, {
|
233
|
-
rgShortcutsOptions: this.state.popupFilterShortcutsOptions,
|
234
|
-
rgShortcutsMap: this.popupFilterShortcutsMap,
|
235
|
-
value: this.props.filterValue,
|
236
|
-
inputRef: composeRefs(this.filterRef, this.props.filterRef),
|
237
|
-
onBlur: this.popupFilterOnBlur,
|
238
|
-
onFocus: this.onFilterFocus,
|
239
|
-
className: "ring-js-shortcuts",
|
240
|
-
inputClassName: classNames({
|
241
|
-
[modules_b607bec2.filterWithTagsInput]: this.props.tags
|
242
|
-
}),
|
243
|
-
placeholder: typeof this.props.filter === 'object' ? this.props.filter.placeholder : undefined,
|
244
|
-
height: this.props.tags ? ControlsHeight.S : ControlsHeight.L,
|
245
|
-
onChange: this.props.onFilter,
|
246
|
-
onClick: this.onClickHandler,
|
247
|
-
onClear: this.props.tags ? undefined : this.props.onClear,
|
248
|
-
"data-test-custom": "ring-select-popup-filter-input",
|
249
|
-
listId: this.props.listId,
|
250
|
-
enableShortcuts: Object.keys(this.popupFilterShortcutsMap)
|
251
|
-
}));
|
357
|
+
if ((event.target instanceof HTMLInputElement || event.target instanceof HTMLTextAreaElement) && !event.target.value) {
|
358
|
+
this.removeTag();
|
359
|
+
return false;
|
360
|
+
}
|
361
|
+
return true;
|
252
362
|
}
|
253
|
-
|
254
|
-
|
255
|
-
|
256
|
-
handleTagClick = memoize(tag => () => {
|
257
|
-
if (Array.isArray(this.props.selected)) {
|
363
|
+
}, {
|
364
|
+
key: "_togglePopupFilterShortcuts",
|
365
|
+
value: function _togglePopupFilterShortcuts(shortcutsDisabled) {
|
258
366
|
this.setState({
|
259
|
-
|
367
|
+
popupFilterShortcutsOptions: {
|
368
|
+
modal: true,
|
369
|
+
disabled: shortcutsDisabled
|
370
|
+
}
|
260
371
|
});
|
261
372
|
}
|
262
|
-
}
|
263
|
-
|
264
|
-
|
265
|
-
return
|
266
|
-
}
|
267
|
-
return undefined;
|
268
|
-
}
|
269
|
-
getTags() {
|
270
|
-
return Array.isArray(this.props.selected) && /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(TagsList, {
|
271
|
-
tags: this.props.selected,
|
272
|
-
activeIndex: this.state.tagsActiveIndex,
|
273
|
-
handleRemove: this.handleRemoveTag,
|
274
|
-
handleClick: this.handleTagClick,
|
275
|
-
disabled: this.props.disabled,
|
276
|
-
customTagComponent: this.getCustomTag(this.props.tags)
|
277
|
-
}));
|
278
|
-
}
|
279
|
-
getFilterWithTags() {
|
280
|
-
if (this.props.tags) {
|
281
|
-
const classes = classNames([modules_b607bec2.filterWithTags, {
|
282
|
-
[modules_b607bec2.filterWithTagsFocused]: !this.state.popupFilterShortcutsOptions.disabled
|
283
|
-
}]);
|
284
|
-
return /*#__PURE__*/React.createElement("div", {
|
285
|
-
className: classes
|
286
|
-
}, this.getTags(), this.getFilter());
|
373
|
+
}, {
|
374
|
+
key: "isVisible",
|
375
|
+
value: function isVisible() {
|
376
|
+
return this.popup && this.popup.isVisible();
|
287
377
|
}
|
288
|
-
|
289
|
-
|
290
|
-
|
291
|
-
|
292
|
-
|
293
|
-
|
294
|
-
|
295
|
-
|
296
|
-
|
297
|
-
|
298
|
-
|
299
|
-
|
300
|
-
|
301
|
-
|
302
|
-
|
303
|
-
|
304
|
-
|
305
|
-
|
306
|
-
|
307
|
-
|
308
|
-
|
309
|
-
|
310
|
-
|
311
|
-
|
312
|
-
|
313
|
-
|
314
|
-
|
378
|
+
}, {
|
379
|
+
key: "getFilter",
|
380
|
+
value: function getFilter() {
|
381
|
+
if (this.props.filter || this.props.tags) {
|
382
|
+
var _this$props$filterIco;
|
383
|
+
return /*#__PURE__*/React.createElement("div", {
|
384
|
+
className: modules_b607bec2.filterWrapper,
|
385
|
+
"data-test": "ring-select-popup-filter"
|
386
|
+
}, !this.props.tags && /*#__PURE__*/React.createElement(Icon, {
|
387
|
+
glyph: (_this$props$filterIco = this.props.filterIcon) !== null && _this$props$filterIco !== void 0 ? _this$props$filterIco : searchIcon,
|
388
|
+
className: modules_b607bec2.filterIcon,
|
389
|
+
"data-test-custom": "ring-select-popup-filter-icon"
|
390
|
+
}), /*#__PURE__*/React.createElement(FilterWithShortcuts, {
|
391
|
+
rgShortcutsOptions: this.state.popupFilterShortcutsOptions,
|
392
|
+
rgShortcutsMap: this.popupFilterShortcutsMap,
|
393
|
+
value: this.props.filterValue,
|
394
|
+
inputRef: composeRefs(this.filterRef, this.props.filterRef),
|
395
|
+
onBlur: this.popupFilterOnBlur,
|
396
|
+
onFocus: this.onFilterFocus,
|
397
|
+
className: "ring-js-shortcuts",
|
398
|
+
inputClassName: classNames({
|
399
|
+
[modules_b607bec2.filterWithTagsInput]: this.props.tags
|
400
|
+
}),
|
401
|
+
placeholder: typeof this.props.filter === 'object' ? this.props.filter.placeholder : undefined,
|
402
|
+
height: this.props.tags ? ControlsHeight.S : ControlsHeight.L,
|
403
|
+
onChange: this.props.onFilter,
|
404
|
+
onClick: this.onClickHandler,
|
405
|
+
onClear: this.props.tags ? undefined : this.props.onClear,
|
406
|
+
"data-test-custom": "ring-select-popup-filter-input",
|
407
|
+
listId: this.props.listId,
|
408
|
+
enableShortcuts: Object.keys(this.popupFilterShortcutsMap)
|
409
|
+
}));
|
315
410
|
}
|
316
|
-
|
317
|
-
|
411
|
+
return null;
|
412
|
+
}
|
413
|
+
}, {
|
414
|
+
key: "getCustomTag",
|
415
|
+
value: function getCustomTag(tags) {
|
416
|
+
if (tags !== null && typeof tags !== 'boolean') {
|
417
|
+
return tags.customTagComponent;
|
318
418
|
}
|
319
|
-
|
320
|
-
|
419
|
+
return undefined;
|
420
|
+
}
|
421
|
+
}, {
|
422
|
+
key: "getTags",
|
423
|
+
value: function getTags() {
|
424
|
+
return Array.isArray(this.props.selected) && /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(TagsList, {
|
425
|
+
tags: this.props.selected,
|
426
|
+
activeIndex: this.state.tagsActiveIndex,
|
427
|
+
handleRemove: this.handleRemoveTag,
|
428
|
+
handleClick: this.handleTagClick,
|
429
|
+
disabled: this.props.disabled,
|
430
|
+
customTagComponent: this.getCustomTag(this.props.tags)
|
431
|
+
}));
|
432
|
+
}
|
433
|
+
}, {
|
434
|
+
key: "getFilterWithTags",
|
435
|
+
value: function getFilterWithTags() {
|
436
|
+
if (this.props.tags) {
|
437
|
+
var classes = classNames([modules_b607bec2.filterWithTags, {
|
438
|
+
[modules_b607bec2.filterWithTagsFocused]: !this.state.popupFilterShortcutsOptions.disabled
|
439
|
+
}]);
|
440
|
+
return /*#__PURE__*/React.createElement("div", {
|
441
|
+
className: classes
|
442
|
+
}, this.getTags(), this.getFilter());
|
321
443
|
}
|
322
|
-
return
|
323
|
-
id: this.props.listId,
|
324
|
-
maxHeight: maxHeight,
|
325
|
-
data: this.props.data,
|
326
|
-
activeIndex: this.props.activeIndex,
|
327
|
-
ref: this.listRef,
|
328
|
-
restoreActiveIndex: true,
|
329
|
-
activateFirstItem: true,
|
330
|
-
onSelect: this.onListSelect,
|
331
|
-
onResize: this.handleListResize,
|
332
|
-
onScrollToBottom: this.props.onLoadMore,
|
333
|
-
hidden: this.props.hidden,
|
334
|
-
shortcuts: !this.props.hidden,
|
335
|
-
disableMoveOverflow: this.props.disableMoveOverflow,
|
336
|
-
disableMoveDownOverflow: this.props.loading,
|
337
|
-
disableScrollToActive: this.props.disableScrollToActive,
|
338
|
-
compact: this.props.compact,
|
339
|
-
preventListOverscroll: this.props.preventListOverscroll,
|
340
|
-
renderOptimization: this.props.renderOptimization
|
341
|
-
});
|
444
|
+
return this.getFilter();
|
342
445
|
}
|
343
|
-
|
344
|
-
|
345
|
-
|
346
|
-
|
347
|
-
|
446
|
+
}, {
|
447
|
+
key: "getBottomLine",
|
448
|
+
value: function getBottomLine() {
|
449
|
+
var _this$props = this.props,
|
450
|
+
loading = _this$props.loading,
|
451
|
+
message = _this$props.message,
|
452
|
+
data = _this$props.data;
|
453
|
+
var hasMoreThanOneItem = data.length > 1;
|
454
|
+
return (loading || message) && /*#__PURE__*/React.createElement("div", {
|
455
|
+
className: classNames(modules_b607bec2.bottomLine, {
|
456
|
+
[modules_b607bec2.bottomLineOverItem]: hasMoreThanOneItem
|
457
|
+
})
|
458
|
+
}, loading && /*#__PURE__*/React.createElement(LoaderInline, null), message && /*#__PURE__*/React.createElement("div", {
|
459
|
+
className: modules_b607bec2.message
|
460
|
+
}, message));
|
348
461
|
}
|
349
|
-
}
|
350
|
-
|
351
|
-
|
352
|
-
|
353
|
-
|
354
|
-
|
355
|
-
|
356
|
-
|
357
|
-
|
358
|
-
|
359
|
-
|
360
|
-
|
361
|
-
|
362
|
-
|
363
|
-
|
364
|
-
|
365
|
-
|
366
|
-
|
367
|
-
|
368
|
-
|
369
|
-
|
462
|
+
}, {
|
463
|
+
key: "getList",
|
464
|
+
value: function getList(ringPopupTarget) {
|
465
|
+
if (this.props.data.length) {
|
466
|
+
var maxHeight = this.props.maxHeight;
|
467
|
+
if (this.props.anchorElement) {
|
468
|
+
maxHeight = this._adjustListMaxHeight(this.props.hidden, maxHeight, ringPopupTarget);
|
469
|
+
}
|
470
|
+
if (this.props.filter) {
|
471
|
+
maxHeight -= FILTER_HEIGHT;
|
472
|
+
}
|
473
|
+
if (this.props.toolbar) {
|
474
|
+
maxHeight -= TOOLBAR_HEIGHT;
|
475
|
+
}
|
476
|
+
return /*#__PURE__*/React.createElement(List, {
|
477
|
+
id: this.props.listId,
|
478
|
+
maxHeight: maxHeight,
|
479
|
+
data: this.props.data,
|
480
|
+
activeIndex: this.props.activeIndex,
|
481
|
+
ref: this.listRef,
|
482
|
+
restoreActiveIndex: true,
|
483
|
+
activateFirstItem: true,
|
484
|
+
onSelect: this.onListSelect,
|
485
|
+
onResize: this.handleListResize,
|
486
|
+
onScrollToBottom: this.props.onLoadMore,
|
487
|
+
hidden: this.props.hidden,
|
488
|
+
shortcuts: !this.props.hidden,
|
489
|
+
disableMoveOverflow: this.props.disableMoveOverflow,
|
490
|
+
disableMoveDownOverflow: this.props.loading,
|
491
|
+
disableScrollToActive: this.props.disableScrollToActive,
|
492
|
+
compact: this.props.compact,
|
493
|
+
preventListOverscroll: this.props.preventListOverscroll,
|
494
|
+
renderOptimization: this.props.renderOptimization
|
495
|
+
});
|
496
|
+
}
|
497
|
+
return null;
|
370
498
|
}
|
371
|
-
|
372
|
-
|
373
|
-
|
374
|
-
|
375
|
-
|
376
|
-
|
377
|
-
|
378
|
-
|
379
|
-
|
380
|
-
|
381
|
-
|
382
|
-
|
383
|
-
|
384
|
-
|
385
|
-
|
386
|
-
|
387
|
-
|
388
|
-
|
389
|
-
|
390
|
-
|
391
|
-
|
392
|
-
|
393
|
-
|
394
|
-
|
395
|
-
|
396
|
-
|
397
|
-
|
398
|
-
|
399
|
-
|
400
|
-
|
401
|
-
|
402
|
-
|
403
|
-
|
404
|
-
|
405
|
-
|
406
|
-
|
407
|
-
|
408
|
-
|
409
|
-
|
410
|
-
|
411
|
-
|
412
|
-
|
413
|
-
|
414
|
-
|
415
|
-
|
416
|
-
|
417
|
-
|
418
|
-
|
419
|
-
|
420
|
-
|
421
|
-
|
422
|
-
|
423
|
-
|
424
|
-
|
425
|
-
|
426
|
-
|
427
|
-
|
428
|
-
|
429
|
-
|
430
|
-
|
431
|
-
|
432
|
-
|
433
|
-
|
434
|
-
|
435
|
-
|
436
|
-
|
437
|
-
|
438
|
-
|
439
|
-
|
440
|
-
|
441
|
-
|
442
|
-
|
443
|
-
|
444
|
-
|
445
|
-
|
446
|
-
|
447
|
-
|
448
|
-
|
449
|
-
|
450
|
-
|
451
|
-
|
452
|
-
|
453
|
-
left: left,
|
454
|
-
onMouseDown: this.mouseDownHandler,
|
455
|
-
target: this.props.ringPopupTarget,
|
456
|
-
autoCorrectTopOverflow: false,
|
457
|
-
style: style
|
458
|
-
}, /*#__PURE__*/React.createElement("div", {
|
459
|
-
dir: dir
|
460
|
-
}, !hidden && filter && /*#__PURE__*/React.createElement(Shortcuts, {
|
461
|
-
map: this.shortcutsMap,
|
462
|
-
scope: this.shortcutsScope
|
463
|
-
}), topbar, hidden ? /*#__PURE__*/React.createElement("div", null) : filterWithTags, selectAll, list, bottomLine, toolbar));
|
464
|
-
});
|
465
|
-
}
|
466
|
-
}
|
499
|
+
}, {
|
500
|
+
key: "render",
|
501
|
+
value: function render() {
|
502
|
+
var _this3 = this;
|
503
|
+
var _this$props2 = this.props,
|
504
|
+
toolbar = _this$props2.toolbar,
|
505
|
+
topbar = _this$props2.topbar,
|
506
|
+
className = _this$props2.className,
|
507
|
+
multiple = _this$props2.multiple,
|
508
|
+
hidden = _this$props2.hidden,
|
509
|
+
isInputMode = _this$props2.isInputMode,
|
510
|
+
anchorElement = _this$props2.anchorElement,
|
511
|
+
minWidth = _this$props2.minWidth,
|
512
|
+
onCloseAttempt = _this$props2.onCloseAttempt,
|
513
|
+
onOutsideClick = _this$props2.onOutsideClick,
|
514
|
+
directions = _this$props2.directions,
|
515
|
+
top = _this$props2.top,
|
516
|
+
left = _this$props2.left,
|
517
|
+
style = _this$props2.style,
|
518
|
+
dir = _this$props2.dir,
|
519
|
+
filter = _this$props2.filter;
|
520
|
+
var classes = classNames(modules_b607bec2.popup, className);
|
521
|
+
return /*#__PURE__*/React.createElement(PopupTargetContext.Consumer, null, function (ringPopupTarget) {
|
522
|
+
var filterWithTags = _this3.getFilterWithTags();
|
523
|
+
var selectAll = multiple && typeof multiple === 'object' && !multiple.limit && multiple.selectAll && _this3.getSelectAll();
|
524
|
+
var list = _this3.getList(_this3.props.ringPopupTarget || ringPopupTarget);
|
525
|
+
var bottomLine = _this3.getBottomLine();
|
526
|
+
var hasContent = filterWithTags || selectAll || list || bottomLine || toolbar || topbar;
|
527
|
+
return /*#__PURE__*/React.createElement(Popup, {
|
528
|
+
trapFocus: false,
|
529
|
+
ref: _this3.popupRef,
|
530
|
+
hidden: hidden || !hasContent,
|
531
|
+
attached: isInputMode,
|
532
|
+
className: classes,
|
533
|
+
dontCloseOnAnchorClick: true,
|
534
|
+
anchorElement: anchorElement,
|
535
|
+
minWidth: minWidth,
|
536
|
+
onCloseAttempt: onCloseAttempt,
|
537
|
+
onOutsideClick: onOutsideClick,
|
538
|
+
directions: directions,
|
539
|
+
top: top,
|
540
|
+
left: left,
|
541
|
+
onMouseDown: _this3.mouseDownHandler,
|
542
|
+
target: _this3.props.ringPopupTarget,
|
543
|
+
autoCorrectTopOverflow: false,
|
544
|
+
style: style
|
545
|
+
}, /*#__PURE__*/React.createElement("div", {
|
546
|
+
dir: dir
|
547
|
+
}, !hidden && filter && /*#__PURE__*/React.createElement(Shortcuts, {
|
548
|
+
map: _this3.shortcutsMap,
|
549
|
+
scope: _this3.shortcutsScope
|
550
|
+
}), topbar, hidden ? /*#__PURE__*/React.createElement("div", null) : filterWithTags, selectAll, list, bottomLine, toolbar));
|
551
|
+
});
|
552
|
+
}
|
553
|
+
}]);
|
554
|
+
}(PureComponent);
|
555
|
+
_defineProperty(SelectPopup, "defaultProps", {
|
556
|
+
data: [],
|
557
|
+
activeIndex: null,
|
558
|
+
toolbar: null,
|
559
|
+
topbar: null,
|
560
|
+
filter: false,
|
561
|
+
filterIcon: null,
|
562
|
+
filterRef: noop,
|
563
|
+
multiple: false,
|
564
|
+
message: null,
|
565
|
+
anchorElement: null,
|
566
|
+
maxHeight: 600,
|
567
|
+
minWidth: 240,
|
568
|
+
loading: false,
|
569
|
+
onSelect: noop,
|
570
|
+
onCloseAttempt: noop,
|
571
|
+
onOutsideClick: noop,
|
572
|
+
onFilter: noop,
|
573
|
+
onClear: noop,
|
574
|
+
onLoadMore: noop,
|
575
|
+
selected: [],
|
576
|
+
tags: null,
|
577
|
+
ringPopupTarget: null,
|
578
|
+
onSelectAll: noop,
|
579
|
+
onEmptyPopupEnter: noop
|
580
|
+
});
|
467
581
|
SelectPopup.propTypes = {
|
468
582
|
activeIndex: PropTypes.number,
|
469
583
|
anchorElement: PropTypes.instanceOf(HTMLElement),
|