@salutejs/plasma-new-hope 0.138.0-canary.1406.10670275161.0 → 0.138.0-canary.1406.10679978473.0
Sign up to get free protection for your applications and to get access to all the features.
- package/cjs/components/Combobox/ComboboxNew/Combobox.css +3 -3
- package/cjs/components/Combobox/ComboboxNew/Combobox.js +70 -62
- package/cjs/components/Combobox/ComboboxNew/Combobox.js.map +1 -1
- package/cjs/components/Combobox/ComboboxNew/Combobox.styles.js +22 -6
- package/cjs/components/Combobox/ComboboxNew/Combobox.styles.js.map +1 -1
- package/cjs/components/Combobox/ComboboxNew/{Combobox.styles_79kgrq.css → Combobox.styles_iq2uzw.css} +1 -1
- package/cjs/components/Combobox/ComboboxNew/Combobox.tokens.js +25 -0
- package/cjs/components/Combobox/ComboboxNew/Combobox.tokens.js.map +1 -1
- package/cjs/components/Combobox/ComboboxNew/hooks/useKeyboardNavigation.js +8 -8
- package/cjs/components/Combobox/ComboboxNew/hooks/useKeyboardNavigation.js.map +1 -1
- package/cjs/components/Combobox/ComboboxNew/ui/Inner/Inner.css +3 -3
- package/cjs/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.css +3 -3
- package/cjs/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.js +2 -2
- package/cjs/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.js.map +1 -1
- package/cjs/index.css +3 -3
- package/emotion/cjs/components/Combobox/ComboboxNew/Combobox.js +70 -62
- package/emotion/cjs/components/Combobox/ComboboxNew/Combobox.styles.js +11 -5
- package/emotion/cjs/components/Combobox/ComboboxNew/hooks/useKeyboardNavigation.js +8 -8
- package/emotion/cjs/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.js +2 -2
- package/emotion/es/components/Combobox/ComboboxNew/Combobox.js +70 -62
- package/emotion/es/components/Combobox/ComboboxNew/Combobox.styles.js +11 -5
- package/emotion/es/components/Combobox/ComboboxNew/hooks/useKeyboardNavigation.js +8 -8
- package/emotion/es/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.js +2 -2
- package/es/components/Combobox/ComboboxNew/Combobox.css +3 -3
- package/es/components/Combobox/ComboboxNew/Combobox.js +70 -62
- package/es/components/Combobox/ComboboxNew/Combobox.js.map +1 -1
- package/es/components/Combobox/ComboboxNew/Combobox.styles.js +23 -7
- package/es/components/Combobox/ComboboxNew/Combobox.styles.js.map +1 -1
- package/es/components/Combobox/ComboboxNew/{Combobox.styles_79kgrq.css → Combobox.styles_iq2uzw.css} +1 -1
- package/es/components/Combobox/ComboboxNew/Combobox.tokens.js +25 -1
- package/es/components/Combobox/ComboboxNew/Combobox.tokens.js.map +1 -1
- package/es/components/Combobox/ComboboxNew/hooks/useKeyboardNavigation.js +8 -8
- package/es/components/Combobox/ComboboxNew/hooks/useKeyboardNavigation.js.map +1 -1
- package/es/components/Combobox/ComboboxNew/ui/Inner/Inner.css +3 -3
- package/es/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.css +3 -3
- package/es/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.js +2 -2
- package/es/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.js.map +1 -1
- package/es/index.css +3 -3
- package/package.json +2 -2
- package/styled-components/cjs/components/Combobox/ComboboxNew/Combobox.js +70 -62
- package/styled-components/cjs/components/Combobox/ComboboxNew/Combobox.styles.js +7 -1
- package/styled-components/cjs/components/Combobox/ComboboxNew/hooks/useKeyboardNavigation.js +8 -8
- package/styled-components/cjs/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.js +2 -2
- package/styled-components/es/components/Combobox/ComboboxNew/Combobox.js +70 -62
- package/styled-components/es/components/Combobox/ComboboxNew/Combobox.styles.js +7 -1
- package/styled-components/es/components/Combobox/ComboboxNew/hooks/useKeyboardNavigation.js +8 -8
- package/styled-components/es/components/Combobox/ComboboxNew/ui/Inner/ui/Item/Item.js +2 -2
- package/types/components/Combobox/ComboboxNew/Combobox.d.ts.map +1 -1
- package/types/components/Combobox/ComboboxNew/Combobox.styles.d.ts +3 -1
- package/types/components/Combobox/ComboboxNew/Combobox.styles.d.ts.map +1 -1
- package/types/components/Combobox/ComboboxNew/hooks/useKeyboardNavigation.d.ts +2 -2
- package/types/components/Combobox/ComboboxNew/hooks/useKeyboardNavigation.d.ts.map +1 -1
@@ -133,7 +133,7 @@ var comboboxRoot = exports.comboboxRoot = function comboboxRoot(Root) {
|
|
133
133
|
type: 'reset'
|
134
134
|
});
|
135
135
|
|
136
|
-
// Проверяем, отличается ли значение инпуте от выбранного value после закрытия дропдауна.
|
136
|
+
// Проверяем, отличается ли значение в инпуте от выбранного value после закрытия дропдауна.
|
137
137
|
// Если изменилось, то возвращаем label выбранного айтема.
|
138
138
|
// Если нет выбранного элемента, то стираем значение инпута.
|
139
139
|
if (textValue !== value) {
|
@@ -152,6 +152,9 @@ var comboboxRoot = exports.comboboxRoot = function comboboxRoot(Root) {
|
|
152
152
|
setInternalValue(newValue);
|
153
153
|
};
|
154
154
|
var handleClickArrow = function handleClickArrow() {
|
155
|
+
if (disabled) {
|
156
|
+
return;
|
157
|
+
}
|
155
158
|
if (isCurrentListOpen) {
|
156
159
|
dispatchPath({
|
157
160
|
type: 'reset'
|
@@ -185,7 +188,10 @@ var comboboxRoot = exports.comboboxRoot = function comboboxRoot(Root) {
|
|
185
188
|
};
|
186
189
|
|
187
190
|
// Обработчик открытия/закрытия выпадающего списка
|
188
|
-
var
|
191
|
+
var handleListToggle = function handleListToggle(opened) {
|
192
|
+
if (disabled) {
|
193
|
+
return;
|
194
|
+
}
|
189
195
|
if (opened) {
|
190
196
|
dispatchPath({
|
191
197
|
type: 'opened_first_level'
|
@@ -202,44 +208,45 @@ var comboboxRoot = exports.comboboxRoot = function comboboxRoot(Root) {
|
|
202
208
|
|
203
209
|
// Обработчик выбора чекбоксов (только при multiple)
|
204
210
|
var handleCheckboxChange = function handleCheckboxChange(item) {
|
205
|
-
if (multiple) {
|
206
|
-
|
207
|
-
|
208
|
-
|
209
|
-
|
210
|
-
|
211
|
-
|
212
|
-
|
211
|
+
if (!multiple) {
|
212
|
+
return;
|
213
|
+
}
|
214
|
+
var checkedCopy = new Map(checked);
|
215
|
+
if (!checkedCopy.get(item.value)) {
|
216
|
+
checkedCopy.set(item.value, true);
|
217
|
+
(0, _utils3.updateDescendants)(item, checkedCopy, true);
|
218
|
+
} else {
|
219
|
+
checkedCopy.set(item.value, false);
|
220
|
+
(0, _utils3.updateDescendants)(item, checkedCopy, false);
|
221
|
+
}
|
222
|
+
(0, _utils3.updateAncestors)(item, checkedCopy);
|
223
|
+
var newValues = [];
|
224
|
+
valueToItemMap.forEach(function (item, key) {
|
225
|
+
if (checkedCopy.get(key)) {
|
226
|
+
newValues.push(item.value);
|
213
227
|
}
|
214
|
-
|
215
|
-
|
216
|
-
|
217
|
-
|
218
|
-
newValues.push(item.value);
|
219
|
-
}
|
228
|
+
});
|
229
|
+
if (closeAfterSelect) {
|
230
|
+
dispatchPath({
|
231
|
+
type: 'reset'
|
220
232
|
});
|
221
|
-
|
222
|
-
|
223
|
-
|
224
|
-
|
225
|
-
|
226
|
-
|
233
|
+
dispatchFocusedPath({
|
234
|
+
type: 'reset'
|
235
|
+
});
|
236
|
+
}
|
237
|
+
if (onChange) {
|
238
|
+
onChange(newValues);
|
239
|
+
}
|
240
|
+
|
241
|
+
// После выбора/снятия чекбокса скроллим к инпуту
|
242
|
+
setTimeout(function () {
|
243
|
+
if (inputRef.current) {
|
244
|
+
inputRef.current.scrollIntoView({
|
245
|
+
behavior: 'smooth',
|
246
|
+
inline: 'start'
|
227
247
|
});
|
228
248
|
}
|
229
|
-
|
230
|
-
onChange(newValues);
|
231
|
-
}
|
232
|
-
|
233
|
-
// После выбора/снятия чекбокса скроллим к инпуту
|
234
|
-
setTimeout(function () {
|
235
|
-
if (inputRef.current) {
|
236
|
-
inputRef.current.scrollIntoView({
|
237
|
-
behavior: 'smooth',
|
238
|
-
inline: 'start'
|
239
|
-
});
|
240
|
-
}
|
241
|
-
}, 1);
|
242
|
-
}
|
249
|
+
}, 1);
|
243
250
|
};
|
244
251
|
|
245
252
|
// Обработчик клика по айтему выпадающего списка
|
@@ -249,31 +256,31 @@ var comboboxRoot = exports.comboboxRoot = function comboboxRoot(Root) {
|
|
249
256
|
}
|
250
257
|
if (multiple) {
|
251
258
|
handleCheckboxChange(item);
|
252
|
-
|
253
|
-
|
254
|
-
|
255
|
-
|
256
|
-
|
257
|
-
|
258
|
-
|
259
|
-
|
259
|
+
return;
|
260
|
+
}
|
261
|
+
if (e) {
|
262
|
+
e.stopPropagation();
|
263
|
+
}
|
264
|
+
var checkedCopy = new Map(checked);
|
265
|
+
var isCurrentChecked = checkedCopy.get(item.value);
|
266
|
+
checkedCopy.forEach(function (_, key) {
|
267
|
+
checkedCopy.set(key, false);
|
268
|
+
});
|
269
|
+
if (!isCurrentChecked) {
|
270
|
+
checkedCopy.set(item.value, 'done');
|
271
|
+
(0, _utils3.updateSingleAncestors)(item, checkedCopy, 'dot');
|
272
|
+
}
|
273
|
+
setTextValue(isCurrentChecked ? '' : item.label);
|
274
|
+
if (closeAfterSelect) {
|
275
|
+
dispatchPath({
|
276
|
+
type: 'reset'
|
260
277
|
});
|
261
|
-
|
262
|
-
|
263
|
-
|
264
|
-
|
265
|
-
|
266
|
-
|
267
|
-
dispatchPath({
|
268
|
-
type: 'reset'
|
269
|
-
});
|
270
|
-
dispatchFocusedPath({
|
271
|
-
type: 'reset'
|
272
|
-
});
|
273
|
-
}
|
274
|
-
if (onChange) {
|
275
|
-
onChange(isCurrentChecked ? '' : item.value);
|
276
|
-
}
|
278
|
+
dispatchFocusedPath({
|
279
|
+
type: 'reset'
|
280
|
+
});
|
281
|
+
}
|
282
|
+
if (onChange) {
|
283
|
+
onChange(isCurrentChecked ? '' : item.value);
|
277
284
|
}
|
278
285
|
};
|
279
286
|
var getChips = function getChips() {
|
@@ -302,7 +309,7 @@ var comboboxRoot = exports.comboboxRoot = function comboboxRoot(Root) {
|
|
302
309
|
dispatchPath: dispatchPath,
|
303
310
|
pathMap: pathMap,
|
304
311
|
focusedToValueMap: focusedToValueMap,
|
305
|
-
|
312
|
+
handleListToggle: handleListToggle,
|
306
313
|
handlePressDown: handlePressDown,
|
307
314
|
multiselect: multiple,
|
308
315
|
setTextValue: setTextValue
|
@@ -353,7 +360,7 @@ var comboboxRoot = exports.comboboxRoot = function comboboxRoot(Root) {
|
|
353
360
|
ref: floatingPopoverRef,
|
354
361
|
opened: isCurrentListOpen,
|
355
362
|
onToggle: function onToggle(opened) {
|
356
|
-
return opened &&
|
363
|
+
return opened && handleListToggle(true);
|
357
364
|
},
|
358
365
|
placement: placement,
|
359
366
|
portal: portal,
|
@@ -372,6 +379,7 @@ var comboboxRoot = exports.comboboxRoot = function comboboxRoot(Root) {
|
|
372
379
|
placeholder: placeholder,
|
373
380
|
contentLeft: contentLeft,
|
374
381
|
contentRight: /*#__PURE__*/_react["default"].createElement(_Combobox2.IconArrowWrapper, {
|
382
|
+
disabled: disabled,
|
375
383
|
onClick: handleClickArrow
|
376
384
|
}, /*#__PURE__*/_react["default"].createElement(_Combobox2.StyledArrow, {
|
377
385
|
color: "inherit",
|
@@ -31,7 +31,13 @@ var Ul = exports.Ul = /*#__PURE__*/_styledComponents["default"].ul.withConfig({
|
|
31
31
|
}, _Combobox.tokens.padding, _Combobox.classes.emptyStateWrapper);
|
32
32
|
var IconArrowWrapper = exports.IconArrowWrapper = /*#__PURE__*/_styledComponents["default"].div.withConfig({
|
33
33
|
componentId: "plasma-new-hope__sc-2kddkg-1"
|
34
|
-
})(["line-height:0;color:var(", ");cursor:
|
34
|
+
})(["line-height:0;color:var(", ");cursor:", ";.", "{transform:rotate(-180deg);}&:hover,&:active{color:", ";}"], _Combobox.constants.disclosureIconColor, function (_ref5) {
|
35
|
+
var disabled = _ref5.disabled;
|
36
|
+
return disabled ? 'inherit' : 'pointer';
|
37
|
+
}, _Combobox.classes.arrowInverse, function (_ref6) {
|
38
|
+
var disabled = _ref6.disabled;
|
39
|
+
return disabled ? "var(".concat(_Combobox.constants.disclosureIconColor, ")") : "var(".concat(_Combobox.constants.disclosureIconColorHover, ")");
|
40
|
+
});
|
35
41
|
var StyledArrow = exports.StyledArrow = /*#__PURE__*/(0, _styledComponents["default"])(_Icon.IconDisclosureDownCentered).withConfig({
|
36
42
|
componentId: "plasma-new-hope__sc-2kddkg-2"
|
37
43
|
})([""]);
|
package/styled-components/cjs/components/Combobox/ComboboxNew/hooks/useKeyboardNavigation.js
CHANGED
@@ -33,7 +33,7 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
|
|
33
33
|
dispatchPath = _ref.dispatchPath,
|
34
34
|
pathMap = _ref.pathMap,
|
35
35
|
focusedToValueMap = _ref.focusedToValueMap,
|
36
|
-
|
36
|
+
handleListToggle = _ref.handleListToggle,
|
37
37
|
handlePressDown = _ref.handlePressDown,
|
38
38
|
multiselect = _ref.multiselect,
|
39
39
|
setTextValue = _ref.setTextValue;
|
@@ -62,7 +62,7 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
|
|
62
62
|
dispatchFocusedPath({
|
63
63
|
type: 'set_initial_focus'
|
64
64
|
});
|
65
|
-
|
65
|
+
handleListToggle(true);
|
66
66
|
}
|
67
67
|
if (path[0]) {
|
68
68
|
event.stopPropagation();
|
@@ -91,7 +91,7 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
|
|
91
91
|
dispatchFocusedPath({
|
92
92
|
type: 'set_initial_focus'
|
93
93
|
});
|
94
|
-
|
94
|
+
handleListToggle(true);
|
95
95
|
}
|
96
96
|
if (path[0]) {
|
97
97
|
event.stopPropagation();
|
@@ -116,7 +116,7 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
|
|
116
116
|
}
|
117
117
|
}
|
118
118
|
if (path.length === 1) {
|
119
|
-
|
119
|
+
handleListToggle(false);
|
120
120
|
}
|
121
121
|
}
|
122
122
|
break;
|
@@ -213,7 +213,7 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
|
|
213
213
|
dispatchFocusedPath({
|
214
214
|
type: 'reset'
|
215
215
|
});
|
216
|
-
|
216
|
+
handleListToggle(false);
|
217
217
|
setTextValue('');
|
218
218
|
break;
|
219
219
|
}
|
@@ -225,7 +225,7 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
|
|
225
225
|
dispatchFocusedPath({
|
226
226
|
type: 'reset'
|
227
227
|
});
|
228
|
-
|
228
|
+
handleListToggle(false);
|
229
229
|
break;
|
230
230
|
}
|
231
231
|
case keys.Home:
|
@@ -247,7 +247,7 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
|
|
247
247
|
dispatchFocusedPath({
|
248
248
|
type: 'set_initial_focus'
|
249
249
|
});
|
250
|
-
|
250
|
+
handleListToggle(true);
|
251
251
|
}
|
252
252
|
break;
|
253
253
|
}
|
@@ -271,7 +271,7 @@ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref
|
|
271
271
|
type: 'change_last_focus',
|
272
272
|
value: (pathMap.get('root') || 0) - 1
|
273
273
|
});
|
274
|
-
|
274
|
+
handleListToggle(true);
|
275
275
|
}
|
276
276
|
break;
|
277
277
|
}
|
@@ -42,7 +42,7 @@ var Item = exports.Item = function Item(_ref) {
|
|
42
42
|
renderItem = _useContext.renderItem,
|
43
43
|
valueToItemMap = _useContext.valueToItemMap,
|
44
44
|
treeId = _useContext.treeId;
|
45
|
-
var
|
45
|
+
var disabledClassName = disabled ? _Combobox.classes.dropdownItemIsDisabled : undefined;
|
46
46
|
var focusedClass = currentLevel === focusedPath.length - 1 && index === (focusedPath === null || focusedPath === void 0 ? void 0 : focusedPath[currentLevel]) ? _Combobox.classes.dropdownItemIsFocused : undefined;
|
47
47
|
var activeClass = value === (path === null || path === void 0 ? void 0 : path[currentLevel + 1]) ? _Combobox.classes.dropdownItemIsActive : undefined;
|
48
48
|
(0, _hooks.useDidMountEffect)(function () {
|
@@ -67,7 +67,7 @@ var Item = exports.Item = function Item(_ref) {
|
|
67
67
|
handleItemClick(item, e);
|
68
68
|
};
|
69
69
|
return /*#__PURE__*/_react["default"].createElement(_Item.Wrapper, {
|
70
|
-
className: (0, _utils2.cx)(
|
70
|
+
className: (0, _utils2.cx)(disabledClassName, focusedClass, activeClass),
|
71
71
|
id: (0, _utils.getItemId)(treeId, value),
|
72
72
|
ref: ref,
|
73
73
|
onClick: handleClick,
|
@@ -124,7 +124,7 @@ export var comboboxRoot = function comboboxRoot(Root) {
|
|
124
124
|
type: 'reset'
|
125
125
|
});
|
126
126
|
|
127
|
-
// Проверяем, отличается ли значение инпуте от выбранного value после закрытия дропдауна.
|
127
|
+
// Проверяем, отличается ли значение в инпуте от выбранного value после закрытия дропдауна.
|
128
128
|
// Если изменилось, то возвращаем label выбранного айтема.
|
129
129
|
// Если нет выбранного элемента, то стираем значение инпута.
|
130
130
|
if (textValue !== value) {
|
@@ -143,6 +143,9 @@ export var comboboxRoot = function comboboxRoot(Root) {
|
|
143
143
|
setInternalValue(newValue);
|
144
144
|
};
|
145
145
|
var handleClickArrow = function handleClickArrow() {
|
146
|
+
if (disabled) {
|
147
|
+
return;
|
148
|
+
}
|
146
149
|
if (isCurrentListOpen) {
|
147
150
|
dispatchPath({
|
148
151
|
type: 'reset'
|
@@ -176,7 +179,10 @@ export var comboboxRoot = function comboboxRoot(Root) {
|
|
176
179
|
};
|
177
180
|
|
178
181
|
// Обработчик открытия/закрытия выпадающего списка
|
179
|
-
var
|
182
|
+
var handleListToggle = function handleListToggle(opened) {
|
183
|
+
if (disabled) {
|
184
|
+
return;
|
185
|
+
}
|
180
186
|
if (opened) {
|
181
187
|
dispatchPath({
|
182
188
|
type: 'opened_first_level'
|
@@ -193,44 +199,45 @@ export var comboboxRoot = function comboboxRoot(Root) {
|
|
193
199
|
|
194
200
|
// Обработчик выбора чекбоксов (только при multiple)
|
195
201
|
var handleCheckboxChange = function handleCheckboxChange(item) {
|
196
|
-
if (multiple) {
|
197
|
-
|
198
|
-
|
199
|
-
|
200
|
-
|
201
|
-
|
202
|
-
|
203
|
-
|
202
|
+
if (!multiple) {
|
203
|
+
return;
|
204
|
+
}
|
205
|
+
var checkedCopy = new Map(checked);
|
206
|
+
if (!checkedCopy.get(item.value)) {
|
207
|
+
checkedCopy.set(item.value, true);
|
208
|
+
updateDescendants(item, checkedCopy, true);
|
209
|
+
} else {
|
210
|
+
checkedCopy.set(item.value, false);
|
211
|
+
updateDescendants(item, checkedCopy, false);
|
212
|
+
}
|
213
|
+
updateAncestors(item, checkedCopy);
|
214
|
+
var newValues = [];
|
215
|
+
valueToItemMap.forEach(function (item, key) {
|
216
|
+
if (checkedCopy.get(key)) {
|
217
|
+
newValues.push(item.value);
|
204
218
|
}
|
205
|
-
|
206
|
-
|
207
|
-
|
208
|
-
|
209
|
-
newValues.push(item.value);
|
210
|
-
}
|
219
|
+
});
|
220
|
+
if (closeAfterSelect) {
|
221
|
+
dispatchPath({
|
222
|
+
type: 'reset'
|
211
223
|
});
|
212
|
-
|
213
|
-
|
214
|
-
|
215
|
-
|
216
|
-
|
217
|
-
|
224
|
+
dispatchFocusedPath({
|
225
|
+
type: 'reset'
|
226
|
+
});
|
227
|
+
}
|
228
|
+
if (onChange) {
|
229
|
+
onChange(newValues);
|
230
|
+
}
|
231
|
+
|
232
|
+
// После выбора/снятия чекбокса скроллим к инпуту
|
233
|
+
setTimeout(function () {
|
234
|
+
if (inputRef.current) {
|
235
|
+
inputRef.current.scrollIntoView({
|
236
|
+
behavior: 'smooth',
|
237
|
+
inline: 'start'
|
218
238
|
});
|
219
239
|
}
|
220
|
-
|
221
|
-
onChange(newValues);
|
222
|
-
}
|
223
|
-
|
224
|
-
// После выбора/снятия чекбокса скроллим к инпуту
|
225
|
-
setTimeout(function () {
|
226
|
-
if (inputRef.current) {
|
227
|
-
inputRef.current.scrollIntoView({
|
228
|
-
behavior: 'smooth',
|
229
|
-
inline: 'start'
|
230
|
-
});
|
231
|
-
}
|
232
|
-
}, 1);
|
233
|
-
}
|
240
|
+
}, 1);
|
234
241
|
};
|
235
242
|
|
236
243
|
// Обработчик клика по айтему выпадающего списка
|
@@ -240,31 +247,31 @@ export var comboboxRoot = function comboboxRoot(Root) {
|
|
240
247
|
}
|
241
248
|
if (multiple) {
|
242
249
|
handleCheckboxChange(item);
|
243
|
-
|
244
|
-
|
245
|
-
|
246
|
-
|
247
|
-
|
248
|
-
|
249
|
-
|
250
|
-
|
250
|
+
return;
|
251
|
+
}
|
252
|
+
if (e) {
|
253
|
+
e.stopPropagation();
|
254
|
+
}
|
255
|
+
var checkedCopy = new Map(checked);
|
256
|
+
var isCurrentChecked = checkedCopy.get(item.value);
|
257
|
+
checkedCopy.forEach(function (_, key) {
|
258
|
+
checkedCopy.set(key, false);
|
259
|
+
});
|
260
|
+
if (!isCurrentChecked) {
|
261
|
+
checkedCopy.set(item.value, 'done');
|
262
|
+
updateSingleAncestors(item, checkedCopy, 'dot');
|
263
|
+
}
|
264
|
+
setTextValue(isCurrentChecked ? '' : item.label);
|
265
|
+
if (closeAfterSelect) {
|
266
|
+
dispatchPath({
|
267
|
+
type: 'reset'
|
251
268
|
});
|
252
|
-
|
253
|
-
|
254
|
-
|
255
|
-
|
256
|
-
|
257
|
-
|
258
|
-
dispatchPath({
|
259
|
-
type: 'reset'
|
260
|
-
});
|
261
|
-
dispatchFocusedPath({
|
262
|
-
type: 'reset'
|
263
|
-
});
|
264
|
-
}
|
265
|
-
if (onChange) {
|
266
|
-
onChange(isCurrentChecked ? '' : item.value);
|
267
|
-
}
|
269
|
+
dispatchFocusedPath({
|
270
|
+
type: 'reset'
|
271
|
+
});
|
272
|
+
}
|
273
|
+
if (onChange) {
|
274
|
+
onChange(isCurrentChecked ? '' : item.value);
|
268
275
|
}
|
269
276
|
};
|
270
277
|
var getChips = function getChips() {
|
@@ -293,7 +300,7 @@ export var comboboxRoot = function comboboxRoot(Root) {
|
|
293
300
|
dispatchPath: dispatchPath,
|
294
301
|
pathMap: pathMap,
|
295
302
|
focusedToValueMap: focusedToValueMap,
|
296
|
-
|
303
|
+
handleListToggle: handleListToggle,
|
297
304
|
handlePressDown: handlePressDown,
|
298
305
|
multiselect: multiple,
|
299
306
|
setTextValue: setTextValue
|
@@ -344,7 +351,7 @@ export var comboboxRoot = function comboboxRoot(Root) {
|
|
344
351
|
ref: floatingPopoverRef,
|
345
352
|
opened: isCurrentListOpen,
|
346
353
|
onToggle: function onToggle(opened) {
|
347
|
-
return opened &&
|
354
|
+
return opened && handleListToggle(true);
|
348
355
|
},
|
349
356
|
placement: placement,
|
350
357
|
portal: portal,
|
@@ -363,6 +370,7 @@ export var comboboxRoot = function comboboxRoot(Root) {
|
|
363
370
|
placeholder: placeholder,
|
364
371
|
contentLeft: contentLeft,
|
365
372
|
contentRight: /*#__PURE__*/React.createElement(IconArrowWrapper, {
|
373
|
+
disabled: disabled,
|
366
374
|
onClick: handleClickArrow
|
367
375
|
}, /*#__PURE__*/React.createElement(StyledArrow, {
|
368
376
|
color: "inherit",
|
@@ -23,7 +23,13 @@ export var Ul = /*#__PURE__*/styled.ul.withConfig({
|
|
23
23
|
}, tokens.padding, classes.emptyStateWrapper);
|
24
24
|
export var IconArrowWrapper = /*#__PURE__*/styled.div.withConfig({
|
25
25
|
componentId: "plasma-new-hope__sc-2kddkg-1"
|
26
|
-
})(["line-height:0;color:var(", ");cursor:
|
26
|
+
})(["line-height:0;color:var(", ");cursor:", ";.", "{transform:rotate(-180deg);}&:hover,&:active{color:", ";}"], constants.disclosureIconColor, function (_ref5) {
|
27
|
+
var disabled = _ref5.disabled;
|
28
|
+
return disabled ? 'inherit' : 'pointer';
|
29
|
+
}, classes.arrowInverse, function (_ref6) {
|
30
|
+
var disabled = _ref6.disabled;
|
31
|
+
return disabled ? "var(".concat(constants.disclosureIconColor, ")") : "var(".concat(constants.disclosureIconColorHover, ")");
|
32
|
+
});
|
27
33
|
export var StyledArrow = /*#__PURE__*/styled(IconDisclosureDownCentered).withConfig({
|
28
34
|
componentId: "plasma-new-hope__sc-2kddkg-2"
|
29
35
|
})([""]);
|
@@ -27,7 +27,7 @@ export var useKeyNavigation = function useKeyNavigation(_ref) {
|
|
27
27
|
dispatchPath = _ref.dispatchPath,
|
28
28
|
pathMap = _ref.pathMap,
|
29
29
|
focusedToValueMap = _ref.focusedToValueMap,
|
30
|
-
|
30
|
+
handleListToggle = _ref.handleListToggle,
|
31
31
|
handlePressDown = _ref.handlePressDown,
|
32
32
|
multiselect = _ref.multiselect,
|
33
33
|
setTextValue = _ref.setTextValue;
|
@@ -56,7 +56,7 @@ export var useKeyNavigation = function useKeyNavigation(_ref) {
|
|
56
56
|
dispatchFocusedPath({
|
57
57
|
type: 'set_initial_focus'
|
58
58
|
});
|
59
|
-
|
59
|
+
handleListToggle(true);
|
60
60
|
}
|
61
61
|
if (path[0]) {
|
62
62
|
event.stopPropagation();
|
@@ -85,7 +85,7 @@ export var useKeyNavigation = function useKeyNavigation(_ref) {
|
|
85
85
|
dispatchFocusedPath({
|
86
86
|
type: 'set_initial_focus'
|
87
87
|
});
|
88
|
-
|
88
|
+
handleListToggle(true);
|
89
89
|
}
|
90
90
|
if (path[0]) {
|
91
91
|
event.stopPropagation();
|
@@ -110,7 +110,7 @@ export var useKeyNavigation = function useKeyNavigation(_ref) {
|
|
110
110
|
}
|
111
111
|
}
|
112
112
|
if (path.length === 1) {
|
113
|
-
|
113
|
+
handleListToggle(false);
|
114
114
|
}
|
115
115
|
}
|
116
116
|
break;
|
@@ -207,7 +207,7 @@ export var useKeyNavigation = function useKeyNavigation(_ref) {
|
|
207
207
|
dispatchFocusedPath({
|
208
208
|
type: 'reset'
|
209
209
|
});
|
210
|
-
|
210
|
+
handleListToggle(false);
|
211
211
|
setTextValue('');
|
212
212
|
break;
|
213
213
|
}
|
@@ -219,7 +219,7 @@ export var useKeyNavigation = function useKeyNavigation(_ref) {
|
|
219
219
|
dispatchFocusedPath({
|
220
220
|
type: 'reset'
|
221
221
|
});
|
222
|
-
|
222
|
+
handleListToggle(false);
|
223
223
|
break;
|
224
224
|
}
|
225
225
|
case keys.Home:
|
@@ -241,7 +241,7 @@ export var useKeyNavigation = function useKeyNavigation(_ref) {
|
|
241
241
|
dispatchFocusedPath({
|
242
242
|
type: 'set_initial_focus'
|
243
243
|
});
|
244
|
-
|
244
|
+
handleListToggle(true);
|
245
245
|
}
|
246
246
|
break;
|
247
247
|
}
|
@@ -265,7 +265,7 @@ export var useKeyNavigation = function useKeyNavigation(_ref) {
|
|
265
265
|
type: 'change_last_focus',
|
266
266
|
value: (pathMap.get('root') || 0) - 1
|
267
267
|
});
|
268
|
-
|
268
|
+
handleListToggle(true);
|
269
269
|
}
|
270
270
|
break;
|
271
271
|
}
|
@@ -33,7 +33,7 @@ export var Item = function Item(_ref) {
|
|
33
33
|
renderItem = _useContext.renderItem,
|
34
34
|
valueToItemMap = _useContext.valueToItemMap,
|
35
35
|
treeId = _useContext.treeId;
|
36
|
-
var
|
36
|
+
var disabledClassName = disabled ? classes.dropdownItemIsDisabled : undefined;
|
37
37
|
var focusedClass = currentLevel === focusedPath.length - 1 && index === (focusedPath === null || focusedPath === void 0 ? void 0 : focusedPath[currentLevel]) ? classes.dropdownItemIsFocused : undefined;
|
38
38
|
var activeClass = value === (path === null || path === void 0 ? void 0 : path[currentLevel + 1]) ? classes.dropdownItemIsActive : undefined;
|
39
39
|
useDidMountEffect(function () {
|
@@ -58,7 +58,7 @@ export var Item = function Item(_ref) {
|
|
58
58
|
handleItemClick(item, e);
|
59
59
|
};
|
60
60
|
return /*#__PURE__*/React.createElement(Wrapper, {
|
61
|
-
className: cx(
|
61
|
+
className: cx(disabledClassName, focusedClass, activeClass),
|
62
62
|
id: getItemId(treeId, value),
|
63
63
|
ref: ref,
|
64
64
|
onClick: handleClick,
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Combobox.d.ts","sourceRoot":"","sources":["../../../../src/components/Combobox/ComboboxNew/Combobox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4F,MAAM,OAAO,CAAC;AAIjH,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAoB7C,OAAO,KAAK,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAKnE,eAAO,MAAM,OAAO,4BAAgD,CAAC;AAErE;;GAEG;AACH,eAAO,MAAM,YAAY,SAAU,UAAU,gBAAgB,EAAE,KAAK,aAAa,EAAE,OAAO,CAAC,CAAC,
|
1
|
+
{"version":3,"file":"Combobox.d.ts","sourceRoot":"","sources":["../../../../src/components/Combobox/ComboboxNew/Combobox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4F,MAAM,OAAO,CAAC;AAIjH,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAoB7C,OAAO,KAAK,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAKnE,eAAO,MAAM,OAAO,4BAAgD,CAAC;AAErE;;GAEG;AACH,eAAO,MAAM,YAAY,SAAU,UAAU,gBAAgB,EAAE,KAAK,aAAa,EAAE,OAAO,CAAC,CAAC,2FAsYtF,CAAC;AAEP,eAAO,MAAM,cAAc;;;mBAxYQ,UAAU,gBAAgB,EAAE,KAAK,aAAa,EAAE,OAAO,CAAC,CAAC;;;;;;;;;;;;;;;;;;CA6Z3F,CAAC"}
|
@@ -6,7 +6,9 @@ export declare const Ul: import("@linaria/react").StyledComponent<import("react"
|
|
6
6
|
listWidth?: ComboboxProps['listWidth'];
|
7
7
|
isInnerUl?: boolean | undefined;
|
8
8
|
}>;
|
9
|
-
export declare const IconArrowWrapper: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> &
|
9
|
+
export declare const IconArrowWrapper: import("@linaria/react").StyledComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
|
10
|
+
disabled: boolean;
|
11
|
+
}>;
|
10
12
|
export declare const StyledArrow: import("@linaria/react").StyledMeta & import("react").FC<import("../../_Icon/IconRoot").IconProps>;
|
11
13
|
export declare const base: import("@linaria/core").LinariaClassName;
|
12
14
|
export declare const StyledEmptyState: import("@linaria/react").StyledMeta & import("react").FunctionComponent<import("../../../engines/types").PropsType<import("../../../engines/types").Variants> & import("../../EmptyState/EmptyState.types").Props & import("react").RefAttributes<HTMLDivElement>>;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Combobox.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Combobox/ComboboxNew/Combobox.styles.ts"],"names":[],"mappings":";AAOA,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAMjD,eAAO,MAAM,EAAE;mBACI,aAAa,CAAC,cAAc,CAAC;iBAC/B,aAAa,CAAC,YAAY,CAAC;gBAC5B,aAAa,CAAC,WAAW,CAAC;;EAmBzC,CAAC;AAEF,eAAO,MAAM,gBAAgB,
|
1
|
+
{"version":3,"file":"Combobox.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Combobox/ComboboxNew/Combobox.styles.ts"],"names":[],"mappings":";AAOA,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAMjD,eAAO,MAAM,EAAE;mBACI,aAAa,CAAC,cAAc,CAAC;iBAC/B,aAAa,CAAC,YAAY,CAAC;gBAC5B,aAAa,CAAC,WAAW,CAAC;;EAmBzC,CAAC;AAEF,eAAO,MAAM,gBAAgB;cAA0B,OAAO;EAc7D,CAAC;AAEF,eAAO,MAAM,WAAW,oGAAuC,CAAC;AAEhE,eAAO,MAAM,IAAI,0CAAQ,CAAC;AAE1B,eAAO,MAAM,gBAAgB,oQAS5B,CAAC"}
|
@@ -27,7 +27,7 @@ declare type Props = {
|
|
27
27
|
dispatchPath: Dispatch<PathAction>;
|
28
28
|
pathMap: PathMapType;
|
29
29
|
focusedToValueMap: FocusedToValueMapType;
|
30
|
-
|
30
|
+
handleListToggle: (opened: boolean) => void;
|
31
31
|
handlePressDown: (item: ItemOptionTransformed, e?: React.MouseEvent<HTMLElement>) => void;
|
32
32
|
multiselect: ComboboxProps['multiple'];
|
33
33
|
setTextValue: React.Dispatch<React.SetStateAction<string>>;
|
@@ -35,6 +35,6 @@ declare type Props = {
|
|
35
35
|
declare type ReturnedProps = {
|
36
36
|
onKeyDown: (event: React.KeyboardEvent<HTMLElement>) => void;
|
37
37
|
};
|
38
|
-
export declare const useKeyNavigation: ({ focusedPath, dispatchFocusedPath, path, dispatchPath, pathMap, focusedToValueMap,
|
38
|
+
export declare const useKeyNavigation: ({ focusedPath, dispatchFocusedPath, path, dispatchPath, pathMap, focusedToValueMap, handleListToggle, handlePressDown, multiselect, setTextValue, }: Props) => ReturnedProps;
|
39
39
|
export {};
|
40
40
|
//# sourceMappingURL=useKeyboardNavigation.d.ts.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"useKeyboardNavigation.d.ts","sourceRoot":"","sources":["../../../../../src/components/Combobox/ComboboxNew/hooks/useKeyboardNavigation.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAiB,QAAQ,EAAE,MAAM,OAAO,CAAC;AACrD,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AACzF,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAE5E,OAAO,EAAE,WAAW,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC;AAInE,eAAO,MAAM,IAAI;;;;;;;;;;;;;;CAchB,CAAC;AAEF,eAAO,MAAM,gBAAgB,gHAI5B,CAAC;AAEF,aAAK,KAAK,GAAG;IACT,WAAW,EAAE,gBAAgB,CAAC;IAC9B,mBAAmB,EAAE,QAAQ,CAAC,iBAAiB,CAAC,CAAC;IACjD,IAAI,EAAE,SAAS,CAAC;IAChB,YAAY,EAAE,QAAQ,CAAC,UAAU,CAAC,CAAC;IACnC,OAAO,EAAE,WAAW,CAAC;IACrB,iBAAiB,EAAE,qBAAqB,CAAC;IACzC,
|
1
|
+
{"version":3,"file":"useKeyboardNavigation.d.ts","sourceRoot":"","sources":["../../../../../src/components/Combobox/ComboboxNew/hooks/useKeyboardNavigation.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAiB,QAAQ,EAAE,MAAM,OAAO,CAAC;AACrD,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AACzF,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAE5E,OAAO,EAAE,WAAW,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC;AAInE,eAAO,MAAM,IAAI;;;;;;;;;;;;;;CAchB,CAAC;AAEF,eAAO,MAAM,gBAAgB,gHAI5B,CAAC;AAEF,aAAK,KAAK,GAAG;IACT,WAAW,EAAE,gBAAgB,CAAC;IAC9B,mBAAmB,EAAE,QAAQ,CAAC,iBAAiB,CAAC,CAAC;IACjD,IAAI,EAAE,SAAS,CAAC;IAChB,YAAY,EAAE,QAAQ,CAAC,UAAU,CAAC,CAAC;IACnC,OAAO,EAAE,WAAW,CAAC;IACrB,iBAAiB,EAAE,qBAAqB,CAAC;IACzC,gBAAgB,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAC5C,eAAe,EAAE,CAAC,IAAI,EAAE,qBAAqB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAC1F,WAAW,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;IACvC,YAAY,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC;CAC9D,CAAC;AAEF,aAAK,aAAa,GAAG;IACjB,SAAS,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;CAChE,CAAC;AAEF,eAAO,MAAM,gBAAgB,wJAW1B,KAAK,KAAG,aA0PV,CAAC"}
|