@rescui/select 0.15.0 → 0.15.1-RUI-280-Update-select-component-026338d06.52

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.
Files changed (92) hide show
  1. package/lib/_virtual/index.css.js +12 -12
  2. package/lib/common-prop-types.d.ts +9 -14
  3. package/lib/common-prop-types.js +4 -3
  4. package/lib/constants.d.ts +7 -0
  5. package/lib/constants.js +8 -0
  6. package/lib/hooks/use-css-context-transfer.d.ts +14 -0
  7. package/lib/hooks/use-css-context-transfer.js +40 -0
  8. package/lib/hooks/use-label-focus.d.ts +11 -0
  9. package/lib/hooks/use-label-focus.js +28 -0
  10. package/lib/hooks/use-multi-option-serialization.d.ts +10 -0
  11. package/lib/hooks/use-multi-option-serialization.js +82 -0
  12. package/lib/hooks/use-option-serialization.d.ts +10 -0
  13. package/lib/hooks/use-option-serialization.js +59 -0
  14. package/lib/index.css +2004 -837
  15. package/lib/index.d.ts +4 -6
  16. package/lib/index.js +3 -3
  17. package/lib/multiselect.d.ts +29 -0
  18. package/lib/multiselect.js +239 -0
  19. package/lib/native-select.d.ts +4 -0
  20. package/lib/native-select.js +182 -0
  21. package/lib/parts/foldable.js +5 -7
  22. package/lib/parts/form-trigger-wrapper.d.ts +7 -7
  23. package/lib/parts/form-trigger-wrapper.js +16 -34
  24. package/lib/parts/icons.d.ts +17 -0
  25. package/lib/parts/icons.js +75 -0
  26. package/lib/parts/list-box.d.ts +19 -0
  27. package/lib/parts/list-box.js +146 -0
  28. package/lib/parts/multi-trigger.d.ts +11 -0
  29. package/lib/parts/multi-trigger.js +62 -0
  30. package/lib/parts/native-select-options-with-groups.d.ts +8 -0
  31. package/lib/parts/native-select-options-with-groups.js +76 -0
  32. package/lib/parts/native-select-trigger.d.ts +18 -0
  33. package/lib/parts/native-select-trigger.js +54 -0
  34. package/lib/parts/popover.d.ts +12 -0
  35. package/lib/parts/popover.js +62 -0
  36. package/lib/parts/popup-content.d.ts +19 -0
  37. package/lib/parts/popup-content.js +76 -0
  38. package/lib/public-api.p.css +486 -444
  39. package/lib/public-api.pcss +486 -444
  40. package/lib/select-basic.d.ts +3 -0
  41. package/lib/select-basic.js +143 -0
  42. package/lib/select-searchable.d.ts +3 -0
  43. package/lib/select-searchable.js +168 -0
  44. package/lib/select.d.ts +27 -91
  45. package/lib/select.js +53 -360
  46. package/lib/styles/common.p.module.css.js +27 -0
  47. package/lib/styles/form-trigger.p.module.css.js +15 -0
  48. package/lib/styles/list-box.p.module.css.js +16 -0
  49. package/lib/styles/native-select-trigger.p.module.css.js +17 -0
  50. package/lib/styles/native-select.p.module.css.js +9 -0
  51. package/lib/styles/popover.p.module.css.js +10 -0
  52. package/lib/types.d.ts +167 -4
  53. package/lib/utils/calculate-max-height-by-items.d.ts +13 -0
  54. package/lib/utils/calculate-max-height-by-items.js +22 -0
  55. package/lib/utils/convert-options.d.ts +3 -0
  56. package/lib/utils/convert-options.js +52 -0
  57. package/lib/utils/convert-placement.d.ts +3 -0
  58. package/lib/utils/convert-placement.js +22 -0
  59. package/lib/utils/css-vars-utils.d.ts +3 -0
  60. package/lib/utils/css-vars-utils.js +20 -0
  61. package/lib/utils/get-empty-message.d.ts +6 -0
  62. package/lib/utils/get-empty-message.js +32 -0
  63. package/lib/utils/get-option-value.d.ts +2 -0
  64. package/lib/utils/get-option-value.js +11 -0
  65. package/lib/utils/get-real-items-cnt.d.ts +2 -0
  66. package/lib/utils/get-real-items-cnt.js +21 -0
  67. package/lib/utils/get-text-from-nodes.d.ts +2 -0
  68. package/lib/utils/get-text-from-nodes.js +28 -0
  69. package/lib/utils/is-option-a-group.d.ts +2 -0
  70. package/lib/utils/is-option-a-group.js +5 -0
  71. package/lib/utils/throttle.d.ts +1 -0
  72. package/package.json +14 -11
  73. package/lib/key-codes.d.ts +0 -7
  74. package/lib/key-codes.js +0 -8
  75. package/lib/parts/common-select.p.module.css.js +0 -15
  76. package/lib/parts/form-trigger.p.module.css.js +0 -15
  77. package/lib/parts/multiselect.d.ts +0 -86
  78. package/lib/parts/multiselect.js +0 -455
  79. package/lib/parts/native-select.d.ts +0 -36
  80. package/lib/parts/native-select.js +0 -257
  81. package/lib/parts/native-select.p.module.css.js +0 -9
  82. package/lib/parts/throttle.d.ts +0 -1
  83. package/lib/parts/trigger.d.ts +0 -37
  84. package/lib/parts/trigger.js +0 -255
  85. package/lib/parts/trigger.p.module.css.js +0 -31
  86. package/lib/parts/use-backward-compatible-id.d.ts +0 -4
  87. package/lib/parts/use-backward-compatible-id.js +0 -14
  88. package/lib/utils.d.ts +0 -22
  89. package/lib/utils.js +0 -201
  90. /package/lib/{parts → hooks}/use-observable-force-rerender.d.ts +0 -0
  91. /package/lib/{parts → hooks}/use-observable-force-rerender.js +0 -0
  92. /package/lib/{parts → utils}/throttle.js +0 -0
package/lib/utils.js DELETED
@@ -1,201 +0,0 @@
1
- import React, { useRef } from 'react';
2
- import { ARROW_DOWN, ARROW_UP, SPACE, ENTER } from './key-codes.js';
3
- const DEFAULT_NO_OPTIONS_MESSAGES = {
4
- noOptions: 'No options',
5
- nothingFound: 'Nothing found',
6
- loading: 'Loading...'
7
- };
8
- const MAX_VISIBLE_ITEMS = 5;
9
- const ITEM_HEIGHT_BY_SIZE = {
10
- s: 32,
11
- m: 40,
12
- l: 52
13
- };
14
-
15
- const getTextFromNodes = function (node) {
16
- var _node$type;
17
-
18
- let depth = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
19
-
20
- if (typeof node === 'string' || typeof node === 'number') {
21
- return node.toString();
22
- }
23
-
24
- if (depth > 15) {
25
- console.warn('Max depth reached while getting text from nodes');
26
- return '';
27
- }
28
-
29
- if (Array.isArray(node)) {
30
- return node.map(n => getTextFromNodes(n, depth + 1)).join('');
31
- }
32
-
33
- if ( /*#__PURE__*/React.isValidElement(node) && (node === null || node === void 0 || (_node$type = node.type) === null || _node$type === void 0 || (_node$type = _node$type.toString()) === null || _node$type === void 0 ? void 0 : _node$type.toLowerCase()) !== 'svg') {
34
- return getTextFromNodes(node.props.children, depth + 1);
35
- }
36
-
37
- return '';
38
- };
39
-
40
- const isOptionsGroup = optionOrGroup => typeof optionOrGroup.options !== 'undefined';
41
-
42
- function shouldOpenSelect(key) {
43
- let isTriggerTarget = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
44
- return key === ARROW_DOWN || key === ARROW_UP || (key === SPACE || key === ENTER) && isTriggerTarget;
45
- }
46
-
47
- function isString(s) {
48
- return Object.prototype.toString.call(s) === '[object String]';
49
- }
50
-
51
- function getEmptyMessage(isLoading, isNothingFound, noOptionsMessage) {
52
- const {
53
- noOptions,
54
- nothingFound,
55
- loading
56
- } = isString(noOptionsMessage) ? { ...DEFAULT_NO_OPTIONS_MESSAGES,
57
- noOptions: noOptionsMessage
58
- } : { ...DEFAULT_NO_OPTIONS_MESSAGES,
59
- ...noOptionsMessage
60
- };
61
-
62
- if (isLoading) {
63
- return loading;
64
- } else if (isNothingFound) {
65
- return nothingFound;
66
- } else {
67
- return noOptions;
68
- }
69
- }
70
-
71
- function escapeRegex(str) {
72
- return str.replace(/[\-\[\]\/{}()\*+?.\\^$|]/g, '\\$&');
73
- }
74
-
75
- function convertToOptionGroupsIfNeeded() {
76
- let optionsOrGroups = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
77
- const newOptions = [];
78
- let topLevelOptions = [];
79
- optionsOrGroups.forEach(optionOrGroup => {
80
- if (isOptionsGroup(optionOrGroup)) {
81
- if (topLevelOptions.length) {
82
- newOptions.push({
83
- options: topLevelOptions
84
- });
85
- topLevelOptions = [];
86
- }
87
-
88
- newOptions.push(optionOrGroup);
89
- } else {
90
- topLevelOptions.push(optionOrGroup);
91
- }
92
- });
93
-
94
- if (topLevelOptions.length) {
95
- newOptions.push({
96
- options: topLevelOptions
97
- });
98
- topLevelOptions = [];
99
- }
100
-
101
- return newOptions;
102
- }
103
-
104
- const calculateMaxHeight = size => {
105
- const itemHeight = ITEM_HEIGHT_BY_SIZE[size]; // half of item added to show that there is more items even if scroll bar hidden
106
-
107
- return (Math.ceil(MAX_VISIBLE_ITEMS) + 0.5) * itemHeight;
108
- };
109
-
110
- function getOptionValue(option) {
111
- return typeof option.value === 'string' ? option.value : getTextFromNodes(option.label);
112
- }
113
-
114
- const OptionGroupTypes = {
115
- HEADER: 'header',
116
- OPTION: 'option',
117
- DIVIDER: 'divider'
118
- };
119
-
120
- const getDefaultCursorIndex = groups => {
121
- if (groups.length === 0) {
122
- return null;
123
- }
124
-
125
- const firstNonEmptyGroupIndex = groups.findIndex(group => group.options && group.options.length > 0);
126
-
127
- if (firstNonEmptyGroupIndex === -1) {
128
- return null;
129
- }
130
-
131
- return [firstNonEmptyGroupIndex, 0];
132
- };
133
-
134
- function optionsNotEmpty(options) {
135
- return options && options.length > 0;
136
- }
137
-
138
- const getPlainOptionsFromGroups = groups => groups.reduce( // eslint-disable-next-line no-shadow
139
- (acc, group, i) => acc.concat([optionsNotEmpty(group.options) && i !== 0 && !group.label && {
140
- type: OptionGroupTypes.DIVIDER
141
- }, optionsNotEmpty(group.options) && group.label && {
142
- type: OptionGroupTypes.HEADER,
143
- label: group.label
144
- }, ...group.options.map((option, j) => ({ ...option,
145
- index: [i, j],
146
- type: OptionGroupTypes.OPTION
147
- }))].filter(e => e)), []);
148
-
149
- function isGroupsEmpty(groups) {
150
- return groups.length === 0 || groups.every(g => !g.options || g.options.length === 0);
151
- }
152
-
153
- function useStrongMemo(callback, deps) {
154
- const prevDeps = useRef([]);
155
- const memoResult = useRef(null);
156
-
157
- if (deps.length !== prevDeps.current.length || !prevDeps.current.every((dep, i) => dep === deps[i])) {
158
- prevDeps.current = [...deps];
159
- memoResult.current = callback();
160
- }
161
-
162
- return memoResult.current;
163
- }
164
-
165
- function nextIndex(index, isDownDirection) {
166
- return isDownDirection ? index + 1 : index - 1;
167
- }
168
-
169
- function isIndexOutOfRange(index, len) {
170
- return index < 0 || index >= len;
171
- } // eslint-disable-next-line complexity
172
-
173
-
174
- function getMovedCursorIndex(groups, currentCursorIndex, isDownDirection) {
175
- if (isGroupsEmpty(groups)) return currentCursorIndex;
176
- const [grpIndex, optIndex] = currentCursorIndex;
177
- const optLenByGroup = groups.map(g => g.options ? g.options.length : 0);
178
- let newGrpIndex = grpIndex;
179
- let newOptIndex = nextIndex(optIndex, isDownDirection);
180
-
181
- while (isIndexOutOfRange(newOptIndex, optLenByGroup[newGrpIndex]) || isIndexOutOfRange(newGrpIndex, groups.length)) {
182
- newGrpIndex = nextIndex(newGrpIndex, isDownDirection);
183
-
184
- if (isIndexOutOfRange(newGrpIndex, groups.length)) {
185
- newGrpIndex = isDownDirection ? 0 : groups.length - 1;
186
- }
187
-
188
- newOptIndex = isDownDirection ? 0 : optLenByGroup[newGrpIndex] - 1;
189
- }
190
-
191
- return [newGrpIndex, newOptIndex];
192
- }
193
-
194
- const isIndexMatchCursor = (cursorIndex, index) => {
195
- if (cursorIndex === null) return false;
196
- return index[0] === cursorIndex[0] && index[1] === cursorIndex[1];
197
- };
198
-
199
- const withoutGroupsLabel = groups => groups.every(g => !g.label);
200
-
201
- export { OptionGroupTypes, calculateMaxHeight, convertToOptionGroupsIfNeeded, escapeRegex, getDefaultCursorIndex, getEmptyMessage, getMovedCursorIndex, getOptionValue, getPlainOptionsFromGroups, getTextFromNodes, isGroupsEmpty, isIndexMatchCursor, shouldOpenSelect, useStrongMemo, withoutGroupsLabel };
File without changes