@rescui/select 0.11.7 → 0.11.8
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/lib/_virtual/check.js +8 -9
- package/lib/_virtual/close.js +8 -9
- package/lib/_virtual/down.js +8 -9
- package/lib/_virtual/index.css.js +7 -7
- package/lib/_virtual/loading.js +8 -9
- package/lib/_virtual/warning.js +8 -9
- package/lib/common-prop-types.js +6 -6
- package/lib/index.css +184 -263
- package/lib/key-codes.js +7 -7
- package/lib/parts/common-select.p.module.css.js +12 -12
- package/lib/parts/foldable.js +158 -220
- package/lib/parts/form-trigger-wrapper.js +20 -16
- package/lib/parts/form-trigger.p.module.css.js +10 -10
- package/lib/parts/multiselect.js +130 -201
- package/lib/parts/native-select.js +85 -117
- package/lib/parts/native-select.p.module.css.js +6 -6
- package/lib/parts/throttle.js +9 -12
- package/lib/parts/trigger.js +86 -118
- package/lib/parts/trigger.p.module.css.js +27 -27
- package/lib/parts/use-observable-force-rerender.js +5 -12
- package/lib/select.js +118 -195
- package/lib/utils.js +44 -90
- package/package.json +10 -11
package/lib/utils.js
CHANGED
|
@@ -1,43 +1,21 @@
|
|
|
1
|
-
import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
|
|
2
|
-
import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
|
|
3
|
-
import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
|
|
4
|
-
import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
|
|
5
|
-
import _slicedToArray from "@babel/runtime-corejs3/helpers/esm/slicedToArray";
|
|
6
|
-
import _toConsumableArray from "@babel/runtime-corejs3/helpers/esm/toConsumableArray";
|
|
7
|
-
import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
|
|
8
|
-
import _findIndexInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/find-index";
|
|
9
|
-
import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
|
|
10
|
-
import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
|
|
11
|
-
import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
|
|
12
|
-
|
|
13
|
-
function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
14
|
-
|
|
15
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? Object.defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
16
|
-
|
|
17
|
-
import "core-js/modules/es.object.to-string.js";
|
|
18
|
-
import "core-js/modules/es.regexp.exec.js";
|
|
19
|
-
import "core-js/modules/es.string.replace.js";
|
|
20
|
-
import "core-js/modules/web.dom-collections.for-each.js";
|
|
21
1
|
import { useRef } from 'react';
|
|
22
2
|
import { ARROW_DOWN, ARROW_UP, SPACE, ENTER } from './key-codes.js';
|
|
23
|
-
|
|
3
|
+
const DEFAULT_NO_OPTIONS_MESSAGES = {
|
|
24
4
|
noOptions: 'No options',
|
|
25
5
|
nothingFound: 'Nothing found',
|
|
26
6
|
loading: 'Loading...'
|
|
27
7
|
};
|
|
28
|
-
|
|
29
|
-
|
|
8
|
+
const MAX_VISIBLE_ITEMS = 5;
|
|
9
|
+
const ITEM_HEIGHT_BY_SIZE = {
|
|
30
10
|
s: 32,
|
|
31
11
|
m: 40,
|
|
32
12
|
l: 52
|
|
33
13
|
};
|
|
34
14
|
|
|
35
|
-
|
|
36
|
-
return typeof optionOrGroup.options !== 'undefined';
|
|
37
|
-
};
|
|
15
|
+
const isOptionsGroup = optionOrGroup => typeof optionOrGroup.options !== 'undefined';
|
|
38
16
|
|
|
39
17
|
function shouldOpenSelect(key) {
|
|
40
|
-
|
|
18
|
+
let isTriggerTarget = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
|
|
41
19
|
return key === ARROW_DOWN || key === ARROW_UP || (key === SPACE || key === ENTER) && isTriggerTarget;
|
|
42
20
|
}
|
|
43
21
|
|
|
@@ -46,12 +24,15 @@ function isString(s) {
|
|
|
46
24
|
}
|
|
47
25
|
|
|
48
26
|
function getEmptyMessage(isLoading, isNothingFound, noOptionsMessage) {
|
|
49
|
-
|
|
27
|
+
const {
|
|
28
|
+
noOptions,
|
|
29
|
+
nothingFound,
|
|
30
|
+
loading
|
|
31
|
+
} = isString(noOptionsMessage) ? { ...DEFAULT_NO_OPTIONS_MESSAGES,
|
|
50
32
|
noOptions: noOptionsMessage
|
|
51
|
-
}
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
loading = _ref.loading;
|
|
33
|
+
} : { ...DEFAULT_NO_OPTIONS_MESSAGES,
|
|
34
|
+
...noOptionsMessage
|
|
35
|
+
};
|
|
55
36
|
|
|
56
37
|
if (isLoading) {
|
|
57
38
|
return loading;
|
|
@@ -67,10 +48,10 @@ function escapeRegex(str) {
|
|
|
67
48
|
}
|
|
68
49
|
|
|
69
50
|
function convertToOptionGroupsIfNeeded() {
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
optionsOrGroups.forEach(
|
|
51
|
+
let optionsOrGroups = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
52
|
+
const newOptions = [];
|
|
53
|
+
let topLevelOptions = [];
|
|
54
|
+
optionsOrGroups.forEach(optionOrGroup => {
|
|
74
55
|
if (isOptionsGroup(optionOrGroup)) {
|
|
75
56
|
if (topLevelOptions.length) {
|
|
76
57
|
newOptions.push({
|
|
@@ -95,13 +76,13 @@ function convertToOptionGroupsIfNeeded() {
|
|
|
95
76
|
return newOptions;
|
|
96
77
|
}
|
|
97
78
|
|
|
98
|
-
|
|
99
|
-
|
|
79
|
+
const calculateMaxHeight = size => {
|
|
80
|
+
const itemHeight = ITEM_HEIGHT_BY_SIZE[size]; // half of item added to show that there is more items even if scroll bar hidden
|
|
100
81
|
|
|
101
82
|
return (Math.ceil(MAX_VISIBLE_ITEMS) + 0.5) * itemHeight;
|
|
102
83
|
};
|
|
103
84
|
|
|
104
|
-
|
|
85
|
+
const reverseTheme = theme => {
|
|
105
86
|
return theme === 'dark' ? 'light' : 'dark';
|
|
106
87
|
};
|
|
107
88
|
|
|
@@ -109,20 +90,18 @@ function getOptionValue(option) {
|
|
|
109
90
|
return typeof option.value === 'string' ? option.value : option.label;
|
|
110
91
|
}
|
|
111
92
|
|
|
112
|
-
|
|
93
|
+
const OptionGroupTypes = {
|
|
113
94
|
HEADER: 'header',
|
|
114
95
|
OPTION: 'option',
|
|
115
96
|
DIVIDER: 'divider'
|
|
116
97
|
};
|
|
117
98
|
|
|
118
|
-
|
|
99
|
+
const getDefaultCursorIndex = groups => {
|
|
119
100
|
if (groups.length === 0) {
|
|
120
101
|
return null;
|
|
121
102
|
}
|
|
122
103
|
|
|
123
|
-
|
|
124
|
-
return group.options && group.options.length > 0;
|
|
125
|
-
});
|
|
104
|
+
const firstNonEmptyGroupIndex = groups.findIndex(group => group.options && group.options.length > 0);
|
|
126
105
|
|
|
127
106
|
if (firstNonEmptyGroupIndex === -1) {
|
|
128
107
|
return null;
|
|
@@ -135,41 +114,27 @@ function optionsNotEmpty(options) {
|
|
|
135
114
|
return options && options.length > 0;
|
|
136
115
|
}
|
|
137
116
|
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
}]).call(_context2, _toConsumableArray(_mapInstanceProperty(_context3 = group.options).call(_context3, function (option, j) {
|
|
149
|
-
return _objectSpread(_objectSpread({}, option), {}, {
|
|
150
|
-
index: [i, j],
|
|
151
|
-
type: OptionGroupTypes.OPTION
|
|
152
|
-
});
|
|
153
|
-
})))).call(_context, function (e) {
|
|
154
|
-
return e;
|
|
155
|
-
}));
|
|
156
|
-
}, []);
|
|
157
|
-
};
|
|
117
|
+
const getPlainOptionsFromGroups = groups => groups.reduce( // eslint-disable-next-line no-shadow
|
|
118
|
+
(acc, group, i) => acc.concat([optionsNotEmpty(group.options) && i !== 0 && !group.label && {
|
|
119
|
+
type: OptionGroupTypes.DIVIDER
|
|
120
|
+
}, optionsNotEmpty(group.options) && group.label && {
|
|
121
|
+
type: OptionGroupTypes.HEADER,
|
|
122
|
+
label: group.label
|
|
123
|
+
}, ...group.options.map((option, j) => ({ ...option,
|
|
124
|
+
index: [i, j],
|
|
125
|
+
type: OptionGroupTypes.OPTION
|
|
126
|
+
}))].filter(e => e)), []);
|
|
158
127
|
|
|
159
128
|
function isGroupsEmpty(groups) {
|
|
160
|
-
return groups.length === 0 || groups.every(
|
|
161
|
-
return !g.options || g.options.length === 0;
|
|
162
|
-
});
|
|
129
|
+
return groups.length === 0 || groups.every(g => !g.options || g.options.length === 0);
|
|
163
130
|
}
|
|
164
131
|
|
|
165
132
|
function useStrongMemo(callback, deps) {
|
|
166
|
-
|
|
167
|
-
|
|
133
|
+
const prevDeps = useRef([]);
|
|
134
|
+
const memoResult = useRef(null);
|
|
168
135
|
|
|
169
|
-
if (deps.length !== prevDeps.current.length || !prevDeps.current.every(
|
|
170
|
-
|
|
171
|
-
})) {
|
|
172
|
-
prevDeps.current = _toConsumableArray(deps);
|
|
136
|
+
if (deps.length !== prevDeps.current.length || !prevDeps.current.every((dep, i) => dep === deps[i])) {
|
|
137
|
+
prevDeps.current = [...deps];
|
|
173
138
|
memoResult.current = callback();
|
|
174
139
|
}
|
|
175
140
|
|
|
@@ -187,17 +152,10 @@ function isIndexOutOfRange(index, len) {
|
|
|
187
152
|
|
|
188
153
|
function getMovedCursorIndex(groups, currentCursorIndex, isDownDirection) {
|
|
189
154
|
if (isGroupsEmpty(groups)) return currentCursorIndex;
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
var optLenByGroup = _mapInstanceProperty(groups).call(groups, function (g) {
|
|
196
|
-
return g.options ? g.options.length : 0;
|
|
197
|
-
});
|
|
198
|
-
|
|
199
|
-
var newGrpIndex = grpIndex;
|
|
200
|
-
var newOptIndex = nextIndex(optIndex, isDownDirection);
|
|
155
|
+
const [grpIndex, optIndex] = currentCursorIndex;
|
|
156
|
+
const optLenByGroup = groups.map(g => g.options ? g.options.length : 0);
|
|
157
|
+
let newGrpIndex = grpIndex;
|
|
158
|
+
let newOptIndex = nextIndex(optIndex, isDownDirection);
|
|
201
159
|
|
|
202
160
|
while (isIndexOutOfRange(newOptIndex, optLenByGroup[newGrpIndex]) || isIndexOutOfRange(newGrpIndex, groups.length)) {
|
|
203
161
|
newGrpIndex = nextIndex(newGrpIndex, isDownDirection);
|
|
@@ -212,15 +170,11 @@ function getMovedCursorIndex(groups, currentCursorIndex, isDownDirection) {
|
|
|
212
170
|
return [newGrpIndex, newOptIndex];
|
|
213
171
|
}
|
|
214
172
|
|
|
215
|
-
|
|
173
|
+
const isIndexMatchCursor = (cursorIndex, index) => {
|
|
216
174
|
if (cursorIndex === null) return false;
|
|
217
175
|
return index[0] === cursorIndex[0] && index[1] === cursorIndex[1];
|
|
218
176
|
};
|
|
219
177
|
|
|
220
|
-
|
|
221
|
-
return groups.every(function (g) {
|
|
222
|
-
return !g.label;
|
|
223
|
-
});
|
|
224
|
-
};
|
|
178
|
+
const withoutGroupsLabel = groups => groups.every(g => !g.label);
|
|
225
179
|
|
|
226
180
|
export { OptionGroupTypes, calculateMaxHeight, convertToOptionGroupsIfNeeded, escapeRegex, getDefaultCursorIndex, getEmptyMessage, getMovedCursorIndex, getOptionValue, getPlainOptionsFromGroups, isGroupsEmpty, isIndexMatchCursor, reverseTheme, shouldOpenSelect, useStrongMemo, withoutGroupsLabel };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@rescui/select",
|
|
3
|
-
"version": "0.11.
|
|
3
|
+
"version": "0.11.8",
|
|
4
4
|
"description": "",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"author": "JetBrains",
|
|
@@ -14,13 +14,12 @@
|
|
|
14
14
|
"access": "public"
|
|
15
15
|
},
|
|
16
16
|
"dependencies": {
|
|
17
|
-
"@babel/runtime-corejs3": "^7.
|
|
18
|
-
"@rescui/dropdown": "^0.7.
|
|
19
|
-
"@rescui/menu": "^0.10.
|
|
20
|
-
"@rescui/tag": "^0.10.
|
|
21
|
-
"@rescui/use-resize-observer": "^0.2.
|
|
17
|
+
"@babel/runtime-corejs3": "^7.26.0",
|
|
18
|
+
"@rescui/dropdown": "^0.7.12",
|
|
19
|
+
"@rescui/menu": "^0.10.10",
|
|
20
|
+
"@rescui/tag": "^0.10.12",
|
|
21
|
+
"@rescui/use-resize-observer": "^0.2.5",
|
|
22
22
|
"classnames": "^2.2.6",
|
|
23
|
-
"core-js": "^3.9.1",
|
|
24
23
|
"scroll-into-view-if-needed": "2.2.20"
|
|
25
24
|
},
|
|
26
25
|
"peerDependencies": {
|
|
@@ -29,9 +28,9 @@
|
|
|
29
28
|
"react": ">=16.8.0 <19"
|
|
30
29
|
},
|
|
31
30
|
"devDependencies": {
|
|
32
|
-
"@rescui/colors": "^0.2.
|
|
33
|
-
"@rescui/scripts": "^0.3.
|
|
34
|
-
"@rescui/typography": "^0.19.
|
|
31
|
+
"@rescui/colors": "^0.2.6",
|
|
32
|
+
"@rescui/scripts": "^0.3.5",
|
|
33
|
+
"@rescui/typography": "^0.19.1",
|
|
35
34
|
"@rescui/visual-regression": "^0.1.2",
|
|
36
35
|
"sniffr": "^1.2.0"
|
|
37
36
|
},
|
|
@@ -40,5 +39,5 @@
|
|
|
40
39
|
"build-pcss-api": "rescui-scripts build-pcss-api --file public-api.p.css"
|
|
41
40
|
},
|
|
42
41
|
"nx": {},
|
|
43
|
-
"gitHead": "
|
|
42
|
+
"gitHead": "67627f69be3de4b4c6a21244fd7de36e841f01f0"
|
|
44
43
|
}
|