@progress/kendo-react-dropdowns 5.4.0-dev.202205271059 → 5.4.0-dev.202206090823
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cdn/js/kendo-react-dropdowns.js +1 -1
- package/dist/es/AutoComplete/AutoComplete.d.ts +6 -6
- package/dist/es/AutoComplete/AutoComplete.js +6 -4
- package/dist/es/ComboBox/ComboBox.d.ts +6 -6
- package/dist/es/ComboBox/ComboBox.js +12 -10
- package/dist/es/DropDownList/DropDownList.d.ts +3 -6
- package/dist/es/DropDownList/DropDownList.js +10 -8
- package/dist/es/DropDownTree/DropDownTree.d.ts +1 -1
- package/dist/es/DropDownTree/DropDownTree.js +17 -13
- package/dist/es/MultiColumnComboBox/MultiColumnComboBox.d.ts +2 -2
- package/dist/es/MultiColumnComboBox/MultiColumnComboBox.js +1 -1
- package/dist/es/MultiSelect/MultiSelect.d.ts +5 -5
- package/dist/es/MultiSelect/MultiSelect.js +23 -17
- package/dist/es/MultiSelect/TagList.d.ts +1 -0
- package/dist/es/MultiSelect/TagList.js +1 -1
- package/dist/es/MultiSelectTree/MultiSelectTree.d.ts +1 -1
- package/dist/es/MultiSelectTree/MultiSelectTree.js +16 -12
- package/dist/es/MultiSelectTree/utils.d.ts +3 -3
- package/dist/es/MultiSelectTree/utils.js +11 -7
- package/dist/es/common/DropDownBase.d.ts +1 -1
- package/dist/es/common/DropDownBase.js +2 -0
- package/dist/es/common/List.d.ts +2 -2
- package/dist/es/common/List.js +1 -1
- package/dist/es/common/ListContainer.d.ts +1 -0
- package/dist/es/common/ListFilter.js +6 -4
- package/dist/es/common/ListItem.d.ts +1 -1
- package/dist/es/common/MultiColumnList.d.ts +2 -1
- package/dist/es/common/Navigation.d.ts +1 -1
- package/dist/es/common/SearchBar.d.ts +1 -1
- package/dist/es/common/SearchBar.js +3 -1
- package/dist/es/common/VirtualScroll.d.ts +1 -1
- package/dist/es/common/VirtualScroll.js +5 -1
- package/dist/es/package-metadata.js +1 -1
- package/dist/npm/AutoComplete/AutoComplete.d.ts +6 -6
- package/dist/npm/AutoComplete/AutoComplete.js +21 -19
- package/dist/npm/ComboBox/ComboBox.d.ts +6 -6
- package/dist/npm/ComboBox/ComboBox.js +46 -44
- package/dist/npm/DropDownList/DropDownList.d.ts +3 -6
- package/dist/npm/DropDownList/DropDownList.js +37 -35
- package/dist/npm/DropDownTree/DropDownTree.d.ts +1 -1
- package/dist/npm/DropDownTree/DropDownTree.js +33 -29
- package/dist/npm/MultiColumnComboBox/MultiColumnComboBox.d.ts +2 -2
- package/dist/npm/MultiColumnComboBox/MultiColumnComboBox.js +10 -10
- package/dist/npm/MultiSelect/MultiSelect.d.ts +5 -5
- package/dist/npm/MultiSelect/MultiSelect.js +43 -37
- package/dist/npm/MultiSelect/TagList.d.ts +1 -0
- package/dist/npm/MultiSelect/TagList.js +1 -1
- package/dist/npm/MultiSelectTree/MultiSelectTree.d.ts +1 -1
- package/dist/npm/MultiSelectTree/MultiSelectTree.js +30 -26
- package/dist/npm/MultiSelectTree/utils.d.ts +3 -3
- package/dist/npm/MultiSelectTree/utils.js +18 -14
- package/dist/npm/common/ClearButton.js +2 -2
- package/dist/npm/common/DropDownBase.d.ts +1 -1
- package/dist/npm/common/DropDownBase.js +7 -5
- package/dist/npm/common/List.d.ts +2 -2
- package/dist/npm/common/List.js +7 -7
- package/dist/npm/common/ListContainer.d.ts +1 -0
- package/dist/npm/common/ListDefaultItem.js +2 -2
- package/dist/npm/common/ListFilter.js +7 -5
- package/dist/npm/common/ListItem.d.ts +1 -1
- package/dist/npm/common/ListItem.js +2 -2
- package/dist/npm/common/MultiColumnList.d.ts +2 -1
- package/dist/npm/common/Navigation.d.ts +1 -1
- package/dist/npm/common/Navigation.js +1 -1
- package/dist/npm/common/SearchBar.d.ts +1 -1
- package/dist/npm/common/SearchBar.js +3 -1
- package/dist/npm/common/VirtualScroll.d.ts +1 -1
- package/dist/npm/common/VirtualScroll.js +5 -1
- package/dist/npm/main.js +5 -1
- package/dist/npm/package-metadata.js +1 -1
- package/dist/systemjs/kendo-react-dropdowns.js +1 -1
- package/package.json +13 -13
|
@@ -10,10 +10,14 @@ var __assign = (this && this.__assign) || function () {
|
|
|
10
10
|
};
|
|
11
11
|
return __assign.apply(this, arguments);
|
|
12
12
|
};
|
|
13
|
-
var __spreadArray = (this && this.__spreadArray) || function (to, from) {
|
|
14
|
-
for (var i = 0,
|
|
15
|
-
|
|
16
|
-
|
|
13
|
+
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
14
|
+
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
15
|
+
if (ar || !(i in from)) {
|
|
16
|
+
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
|
17
|
+
ar[i] = from[i];
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
return to.concat(ar || Array.prototype.slice.call(from));
|
|
17
21
|
};
|
|
18
22
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
19
23
|
exports.MultiSelectTree = exports.MultiSelectTreePropsContext = void 0;
|
|
@@ -38,8 +42,8 @@ var sizeMap = kendo_react_common_1.kendoThemeMaps.sizeMap, roundedMap = kendo_re
|
|
|
38
42
|
var toLevel = function (hierarchicalIndex) {
|
|
39
43
|
return hierarchicalIndex.split('_').map(function (i) { return parseInt(i, 10); });
|
|
40
44
|
};
|
|
41
|
-
var getValidity = function (
|
|
42
|
-
var validationMessage =
|
|
45
|
+
var getValidity = function (parameters, hasValue) {
|
|
46
|
+
var validationMessage = parameters.validationMessage, valid = parameters.valid, required = parameters.required;
|
|
43
47
|
return ({
|
|
44
48
|
customError: validationMessage !== undefined,
|
|
45
49
|
valid: Boolean(valid !== undefined ? valid : (!required || hasValue)),
|
|
@@ -67,7 +71,7 @@ var defaultProps = {
|
|
|
67
71
|
*
|
|
68
72
|
* For more information, refer to the [Dropdowns Props Context]({% slug props-context_dropdowns %}) article.
|
|
69
73
|
*/
|
|
70
|
-
exports.MultiSelectTreePropsContext = kendo_react_common_1.createPropsContext();
|
|
74
|
+
exports.MultiSelectTreePropsContext = (0, kendo_react_common_1.createPropsContext)();
|
|
71
75
|
/**
|
|
72
76
|
* Represents the MultiSelectTree component.
|
|
73
77
|
*
|
|
@@ -76,12 +80,12 @@ exports.MultiSelectTreePropsContext = kendo_react_common_1.createPropsContext();
|
|
|
76
80
|
*/
|
|
77
81
|
exports.MultiSelectTree = React.forwardRef(function (directProps, ref) {
|
|
78
82
|
var _a, _b;
|
|
79
|
-
var props = kendo_react_common_1.usePropsContext(exports.MultiSelectTreePropsContext, directProps);
|
|
80
|
-
kendo_react_common_2.validatePackage(package_metadata_1.packageMetadata);
|
|
81
|
-
var componentGuid = React.useMemo(function () { return kendo_react_common_1.guid(); }, []);
|
|
83
|
+
var props = (0, kendo_react_common_1.usePropsContext)(exports.MultiSelectTreePropsContext, directProps);
|
|
84
|
+
(0, kendo_react_common_2.validatePackage)(package_metadata_1.packageMetadata);
|
|
85
|
+
var componentGuid = React.useMemo(function () { return (0, kendo_react_common_1.guid)(); }, []);
|
|
82
86
|
var id = props.id || componentGuid;
|
|
83
87
|
var _c = props.data, data = _c === void 0 ? [] : _c, dataItemKey = props.dataItemKey, _d = props.popupSettings, popupSettings = _d === void 0 ? {} : _d, _e = props.style, style = _e === void 0 ? {} : _e, opened = props.opened, disabled = props.disabled, _f = props.onOpen, onOpen = _f === void 0 ? kendo_react_common_1.noop : _f, _g = props.onClose, onClose = _g === void 0 ? kendo_react_common_1.noop : _g, placeholder = props.placeholder, label = props.label, name = props.name, _h = props.checkField, checkField = _h === void 0 ? defaultProps.checkField : _h, _j = props.checkIndeterminateField, checkIndeterminateField = _j === void 0 ? defaultProps.checkIndeterminateField : _j, _k = props.subItemsField, subItemsField = _k === void 0 ? defaultProps.subItemsField : _k, validationMessage = props.validationMessage, valid = props.valid, tags = props.tags, value = props.value, _l = props.required, required = _l === void 0 ? defaultProps.required : _l, _m = props.validityStyles, validityStyles = _m === void 0 ? defaultProps.validityStyles : _m;
|
|
84
|
-
var tabIndex = kendo_react_common_1.getTabIndex(props.tabIndex, disabled);
|
|
88
|
+
var tabIndex = (0, kendo_react_common_1.getTabIndex)(props.tabIndex, disabled);
|
|
85
89
|
var targetRef = React.useRef(null);
|
|
86
90
|
var elementRef = React.useRef(null);
|
|
87
91
|
var inputRef = React.useRef(null);
|
|
@@ -97,14 +101,14 @@ exports.MultiSelectTree = React.forwardRef(function (directProps, ref) {
|
|
|
97
101
|
var isOpen = opened !== undefined ? opened : openState;
|
|
98
102
|
var hasValue = Boolean(Array.isArray(value) && value.length);
|
|
99
103
|
var validity = getValidity({ validationMessage: validationMessage, valid: valid, required: required }, hasValue);
|
|
100
|
-
var dir = kendo_react_common_1.useRtl(elementRef, props.dir);
|
|
104
|
+
var dir = (0, kendo_react_common_1.useRtl)(elementRef, props.dir);
|
|
101
105
|
var initialStyleWidth = popupSettings.width !== undefined ?
|
|
102
106
|
popupSettings.width : (style.width !== undefined ? style.width : defaultProps.popupSettings.width);
|
|
103
|
-
var popupWidth = useDropdownWidth_1.useDropdownWidth(elementRef, initialStyleWidth);
|
|
107
|
+
var popupWidth = (0, useDropdownWidth_1.useDropdownWidth)(elementRef, initialStyleWidth);
|
|
104
108
|
var popupStyles = __assign({ width: popupWidth }, (dir !== undefined ? { direction: dir } : {}));
|
|
105
109
|
var focus = React.useCallback(function () { return elementRef.current && elementRef.current.focus(); }, []);
|
|
106
110
|
tagsToRenderRef.current = tags === undefined ?
|
|
107
|
-
(value || []).map(function (item) { return ({ text: utils_1.getItemValue(item, props.textField), data: [item] }); }) : __spreadArray([], tags);
|
|
111
|
+
(value || []).map(function (item) { return ({ text: (0, utils_1.getItemValue)(item, props.textField), data: [item] }); }) : __spreadArray([], tags, true);
|
|
108
112
|
React.useImperativeHandle(targetRef, function () { return ({
|
|
109
113
|
props: props,
|
|
110
114
|
element: elementRef.current,
|
|
@@ -131,7 +135,7 @@ exports.MultiSelectTree = React.forwardRef(function (directProps, ref) {
|
|
|
131
135
|
}
|
|
132
136
|
}, [props.onChange]);
|
|
133
137
|
var onChange = React.useCallback(function (event) {
|
|
134
|
-
if (utils_1.areSame(event.item, value, dataItemKey) || !targetRef.current) {
|
|
138
|
+
if ((0, utils_1.areSame)(event.item, value, dataItemKey) || !targetRef.current) {
|
|
135
139
|
return;
|
|
136
140
|
}
|
|
137
141
|
var item = event.item, nativeEvent = event.nativeEvent, syntheticEvent = event.syntheticEvent;
|
|
@@ -257,7 +261,7 @@ exports.MultiSelectTree = React.forwardRef(function (directProps, ref) {
|
|
|
257
261
|
keyCode === kendo_react_common_1.Keys.delete)) {
|
|
258
262
|
var tagsToRender = tagsToRenderRef.current;
|
|
259
263
|
var focusedIndex = focusedTagState ?
|
|
260
|
-
tagsToRender.findIndex(function (t) { return utils_1.matchTags(t, focusedTagState, dataItemKey); }) : -1;
|
|
264
|
+
tagsToRender.findIndex(function (t) { return (0, utils_1.matchTags)(t, focusedTagState, dataItemKey); }) : -1;
|
|
261
265
|
var newFocusedTag = undefined;
|
|
262
266
|
var hasFocused = focusedIndex !== -1;
|
|
263
267
|
if (keyCode === kendo_react_common_1.Keys.left) {
|
|
@@ -304,7 +308,7 @@ exports.MultiSelectTree = React.forwardRef(function (directProps, ref) {
|
|
|
304
308
|
keyCode === kendo_react_common_1.Keys.home || keyCode === kendo_react_common_1.Keys.end)) {
|
|
305
309
|
if (keyCode === kendo_react_common_1.Keys.up && inputRef.current) {
|
|
306
310
|
var items = Array.from(treeviewElement.querySelectorAll('.k-treeview-item'));
|
|
307
|
-
var focusedItem = __spreadArray([], items).reverse().find(function (i) { return Boolean(i && i.querySelector('.k-focus')); });
|
|
311
|
+
var focusedItem = __spreadArray([], items, true).reverse().find(function (i) { return Boolean(i && i.querySelector('.k-focus')); });
|
|
308
312
|
if (focusedItem && items.indexOf(focusedItem) === 0) {
|
|
309
313
|
return switchFocus(function () { focusElement(inputRef.current); });
|
|
310
314
|
}
|
|
@@ -385,30 +389,30 @@ exports.MultiSelectTree = React.forwardRef(function (directProps, ref) {
|
|
|
385
389
|
}
|
|
386
390
|
}, [props.onFilterChange, props.filter, props.textField]);
|
|
387
391
|
var NoData = props.listNoData || ListNoData_1.ListNoData;
|
|
388
|
-
var localization = kendo_react_intl_1.useLocalization();
|
|
392
|
+
var localization = (0, kendo_react_intl_1.useLocalization)();
|
|
389
393
|
var isValid = !validityStyles || validity.valid;
|
|
390
394
|
var size = props.size, rounded = props.rounded, fillMode = props.fillMode;
|
|
391
|
-
var multiselecttree = (React.createElement("span", { className: kendo_react_common_1.classNames('k-multiselect k-input', props.className, (_a = {},
|
|
392
|
-
_a["k-input-"
|
|
393
|
-
_a["k-rounded-"
|
|
394
|
-
_a["k-input-"
|
|
395
|
+
var multiselecttree = (React.createElement("span", { className: (0, kendo_react_common_1.classNames)('k-multiselect k-input', props.className, (_a = {},
|
|
396
|
+
_a["k-input-".concat(sizeMap[size] || size)] = size,
|
|
397
|
+
_a["k-rounded-".concat(roundedMap[rounded] || rounded)] = rounded,
|
|
398
|
+
_a["k-input-".concat(fillMode)] = fillMode,
|
|
395
399
|
_a['k-focus'] = focusedState && !disabled,
|
|
396
400
|
_a['k-invalid'] = !isValid,
|
|
397
401
|
_a['k-disabled'] = disabled,
|
|
398
402
|
_a['k-loading'] = props.loading,
|
|
399
403
|
_a['k-required'] = required,
|
|
400
404
|
_a)), tabIndex: tabIndex, accessKey: props.accessKey, id: id, style: label ? __assign(__assign({}, style), { width: undefined }) : style, dir: dir, ref: elementRef, onKeyDown: disabled ? undefined : onWrapperKeyDown, onMouseDown: onWrapperMouseDown, onFocus: onFocus, onBlur: onBlur, role: "listbox", "aria-haspopup": "true", "aria-expanded": isOpen, "aria-disabled": disabled, "aria-label": label, "aria-labelledby": props.ariaLabelledBy, "aria-describedby": props.ariaDescribedBy, onClick: disabled ? undefined : onWrapperClick },
|
|
401
|
-
tagsToRenderRef.current.length > 0 && (React.createElement("div", { className: kendo_react_common_1.classNames('k-input-values k-chip-list k-selection-multiple', (_b = {},
|
|
402
|
-
_b["k-chip-list-"
|
|
405
|
+
tagsToRenderRef.current.length > 0 && (React.createElement("div", { className: (0, kendo_react_common_1.classNames)('k-input-values k-chip-list k-selection-multiple', (_b = {},
|
|
406
|
+
_b["k-chip-list-".concat(sizeMap[size] || size)] = size,
|
|
403
407
|
_b)), role: "listbox", id: 'tagslist-' + id },
|
|
404
|
-
React.createElement(TagList_1.default, { tag: props.tag, onTagDelete: onTagDelete, data: tagsToRenderRef.current, guid: id, focused: focusedTagState ? tagsToRenderRef.current.find(function (t) { return utils_1.matchTags(t, focusedTagState, dataItemKey); }) : undefined, size: size }))),
|
|
408
|
+
React.createElement(TagList_1.default, { tag: props.tag, onTagDelete: onTagDelete, data: tagsToRenderRef.current, guid: id, focused: focusedTagState ? tagsToRenderRef.current.find(function (t) { return (0, utils_1.matchTags)(t, focusedTagState, dataItemKey); }) : undefined, size: size }))),
|
|
405
409
|
!hasValue && React.createElement("span", { className: "k-input-inner" },
|
|
406
410
|
React.createElement("span", { className: "k-input-value-text" }, "\u00A0")),
|
|
407
411
|
props.loading && React.createElement("span", { className: "k-icon k-i-loading k-input-loading-icon" }),
|
|
408
412
|
hasValue && !disabled && React.createElement(ClearButton_1.default, { onClick: onClear }),
|
|
409
413
|
React.createElement("select", { name: name, ref: selectRef, tabIndex: -1, "aria-hidden": true, title: label, style: { opacity: 0, width: 1, border: 0, zIndex: -1, position: 'absolute', left: '50%' } },
|
|
410
414
|
React.createElement("option", { value: props.valueMap ? props.valueMap.call(undefined, value) : value })),
|
|
411
|
-
React.createElement(kendo_react_popup_1.Popup, { popupClass: popupSettings.popupClass, className: kendo_react_common_1.classNames(popupSettings.className, { 'k-rtl': dir === 'rtl' }), style: popupStyles, animate: popupSettings.animate, anchor: elementRef.current, show: isOpen, onOpen: onPopupOpened, onClose: onPopupClosed, appendTo: popupSettings.appendTo, ref: popupRef },
|
|
415
|
+
React.createElement(kendo_react_popup_1.Popup, { popupClass: popupSettings.popupClass, className: (0, kendo_react_common_1.classNames)(popupSettings.className, { 'k-rtl': dir === 'rtl' }), style: popupStyles, animate: popupSettings.animate, anchor: elementRef.current, show: isOpen, onOpen: onPopupOpened, onClose: onPopupClosed, appendTo: popupSettings.appendTo, ref: popupRef },
|
|
412
416
|
props.filterable && (React.createElement(ListFilter_1.default, { value: props.filter === undefined ? filterState : props.filter, inputRef: inputRef, onChange: onFilterChange, onKeyDown: onInputKeyDown, tabIndex: tabIndex, size: size, rounded: rounded, fillMode: fillMode })),
|
|
413
417
|
data.length > 0 ? (React.createElement(kendo_react_treeview_1.TreeView, { ref: treeViewRef, tabIndex: tabIndex, data: data, focusIdField: dataItemKey, textField: props.textField, checkField: checkField, checkIndeterminateField: checkIndeterminateField, expandField: props.expandField, childrenField: subItemsField, expandIcons: true, onItemClick: onChange, onCheckChange: onChange, onExpandChange: onExpand, checkboxes: true, size: size, item: props.item })) : (React.createElement(NoData, null, localization.toLanguageString(messages_1.nodata, messages_1.messages[messages_1.nodata]))))));
|
|
414
418
|
return label ? (React.createElement(kendo_react_labels_1.FloatingLabel, { label: label, editorValue: hasValue, editorPlaceholder: placeholder, editorValid: isValid, editorDisabled: disabled, editorId: id, style: { width: style ? style.width : undefined }, children: multiselecttree, dir: dir })) : multiselecttree;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { MultiSelectTreeChangeEventOperation } from './MultiSelectTreeProps';
|
|
2
2
|
/** @hidden */
|
|
3
|
-
export declare const getValueMap: (value: any, idGetter: any) =>
|
|
3
|
+
export declare const getValueMap: (value: any[], idGetter: any) => any;
|
|
4
4
|
/**
|
|
5
5
|
* Get MultiSelectTree new value from the component `onChange` event.
|
|
6
6
|
*
|
|
@@ -8,8 +8,8 @@ export declare const getValueMap: (value: any, idGetter: any) => {};
|
|
|
8
8
|
* @param {object} options
|
|
9
9
|
* @returns {any[]}
|
|
10
10
|
*/
|
|
11
|
-
export declare const getMultiSelectTreeValue: (data: any, options: {
|
|
12
|
-
subItemsField?: string;
|
|
11
|
+
export declare const getMultiSelectTreeValue: (data: any[], options: {
|
|
12
|
+
subItemsField?: string | undefined;
|
|
13
13
|
dataItemKey: string;
|
|
14
14
|
items: any;
|
|
15
15
|
value: Array<any>;
|
|
@@ -1,8 +1,12 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __spreadArray = (this && this.__spreadArray) || function (to, from) {
|
|
3
|
-
for (var i = 0,
|
|
4
|
-
|
|
5
|
-
|
|
2
|
+
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
3
|
+
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
4
|
+
if (ar || !(i in from)) {
|
|
5
|
+
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
|
6
|
+
ar[i] = from[i];
|
|
7
|
+
}
|
|
8
|
+
}
|
|
9
|
+
return to.concat(ar || Array.prototype.slice.call(from));
|
|
6
10
|
};
|
|
7
11
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
8
12
|
exports.getMultiSelectTreeValue = exports.getValueMap = void 0;
|
|
@@ -27,22 +31,22 @@ exports.getValueMap = getValueMap;
|
|
|
27
31
|
*/
|
|
28
32
|
var getMultiSelectTreeValue = function (data, options) {
|
|
29
33
|
var items = options.items, dataItemKey = options.dataItemKey, value = options.value, _a = options.subItemsField, subItemsField = _a === void 0 ? 'items' : _a, operation = options.operation;
|
|
30
|
-
var idGetter = kendo_react_common_1.getter(dataItemKey);
|
|
31
|
-
var valueMap = exports.getValueMap(value, idGetter);
|
|
34
|
+
var idGetter = (0, kendo_react_common_1.getter)(dataItemKey);
|
|
35
|
+
var valueMap = (0, exports.getValueMap)(value, idGetter);
|
|
32
36
|
if (operation === 'clear') {
|
|
33
37
|
return [];
|
|
34
38
|
}
|
|
35
39
|
else if (operation === 'delete') {
|
|
36
|
-
var deletedItemsMap_1 = exports.getValueMap(items, idGetter);
|
|
40
|
+
var deletedItemsMap_1 = (0, exports.getValueMap)(items, idGetter);
|
|
37
41
|
return value.filter(function (item) { return !deletedItemsMap_1[idGetter(item)]; });
|
|
38
42
|
}
|
|
39
43
|
// operation === 'toggle'
|
|
40
44
|
var selectedItem = items[0];
|
|
41
45
|
var selectedId = idGetter(selectedItem);
|
|
42
|
-
var subItemGetter = kendo_react_common_1.getter(subItemsField);
|
|
43
|
-
var stack = __spreadArray([], data);
|
|
46
|
+
var subItemGetter = (0, kendo_react_common_1.getter)(subItemsField);
|
|
47
|
+
var stack = __spreadArray([], data, true);
|
|
44
48
|
var context = [];
|
|
45
|
-
var parents;
|
|
49
|
+
var parents = [];
|
|
46
50
|
var foundItem;
|
|
47
51
|
while (stack.length) {
|
|
48
52
|
var currentItem = stack.pop();
|
|
@@ -64,7 +68,7 @@ var getMultiSelectTreeValue = function (data, options) {
|
|
|
64
68
|
}
|
|
65
69
|
}
|
|
66
70
|
}
|
|
67
|
-
var childrenStack = __spreadArray([], (subItemGetter(foundItem) || []));
|
|
71
|
+
var childrenStack = __spreadArray([], (subItemGetter(foundItem) || []), true);
|
|
68
72
|
var children = [];
|
|
69
73
|
while (childrenStack.length) {
|
|
70
74
|
var currentItem = childrenStack.pop();
|
|
@@ -81,7 +85,7 @@ var getMultiSelectTreeValue = function (data, options) {
|
|
|
81
85
|
newValue.push(foundItem);
|
|
82
86
|
newValue.push.apply(newValue, children.filter(function (item) { return !valueMap[idGetter(item)]; }));
|
|
83
87
|
var parentCandidates = parents.filter(function (item) { return !valueMap[idGetter(item)]; });
|
|
84
|
-
var newValueMap_1 = exports.getValueMap(newValue, idGetter);
|
|
88
|
+
var newValueMap_1 = (0, exports.getValueMap)(newValue, idGetter);
|
|
85
89
|
for (var i = parentCandidates.length - 1; i > -1; i--) {
|
|
86
90
|
var candidate = parentCandidates[i];
|
|
87
91
|
var subItems = subItemGetter(candidate);
|
|
@@ -97,8 +101,8 @@ var getMultiSelectTreeValue = function (data, options) {
|
|
|
97
101
|
}
|
|
98
102
|
else {
|
|
99
103
|
var foundId_1 = idGetter(foundItem);
|
|
100
|
-
var childrenMap_1 = exports.getValueMap(children, idGetter);
|
|
101
|
-
var parentsMap_1 = exports.getValueMap(parents, idGetter);
|
|
104
|
+
var childrenMap_1 = (0, exports.getValueMap)(children, idGetter);
|
|
105
|
+
var parentsMap_1 = (0, exports.getValueMap)(parents, idGetter);
|
|
102
106
|
newValue.push.apply(newValue, (value
|
|
103
107
|
.filter(function (item) {
|
|
104
108
|
var itemId = idGetter(item);
|
|
@@ -29,11 +29,11 @@ var ClearButton = /** @class */ (function (_super) {
|
|
|
29
29
|
return _this;
|
|
30
30
|
}
|
|
31
31
|
ClearButton.prototype.render = function () {
|
|
32
|
-
var title = kendo_react_intl_1.provideLocalizationService(this).toLanguageString(messages_1.clear, messages_1.messages[messages_1.clear]);
|
|
32
|
+
var title = (0, kendo_react_intl_1.provideLocalizationService)(this).toLanguageString(messages_1.clear, messages_1.messages[messages_1.clear]);
|
|
33
33
|
return (React.createElement("span", { className: "k-clear-value", role: "button", onClick: this.props.onClick, onMouseDown: this.onMouseDown, tabIndex: -1, title: title, key: "clearbutton" },
|
|
34
34
|
React.createElement("span", { className: "k-icon k-i-x" })));
|
|
35
35
|
};
|
|
36
36
|
return ClearButton;
|
|
37
37
|
}(React.Component));
|
|
38
38
|
exports.default = ClearButton;
|
|
39
|
-
kendo_react_intl_1.registerForLocalization(ClearButton);
|
|
39
|
+
(0, kendo_react_intl_1.registerForLocalization)(ClearButton);
|
|
@@ -158,6 +158,6 @@ export default class DropDownBase {
|
|
|
158
158
|
triggerOnPageChange(state: InternalState, skip: number, take: number): void;
|
|
159
159
|
triggerPageChangeCornerItems(item: any, state: InternalState): void;
|
|
160
160
|
scrollToVirtualItem: (virtual: VirtualizationSettings, selectedItemIndex: number) => void;
|
|
161
|
-
renderScrollElement: () => JSX.Element;
|
|
161
|
+
renderScrollElement: () => false | JSX.Element;
|
|
162
162
|
getPopupSettings(): DropDownsPopupSettings;
|
|
163
163
|
}
|
|
@@ -23,6 +23,8 @@ var kendo_react_common_1 = require("@progress/kendo-react-common");
|
|
|
23
23
|
var DropDownBase = /** @class */ (function () {
|
|
24
24
|
function DropDownBase(component) {
|
|
25
25
|
var _this = this;
|
|
26
|
+
this.wrapper = null;
|
|
27
|
+
this.list = null;
|
|
26
28
|
this.vs = new VirtualScroll_1.default();
|
|
27
29
|
this.navigation = new Navigation_1.Navigation();
|
|
28
30
|
this.handleItemClick = function (index, event) {
|
|
@@ -103,8 +105,8 @@ var DropDownBase = /** @class */ (function () {
|
|
|
103
105
|
var vs = _this.vs;
|
|
104
106
|
return vs.enabled && (React.createElement("div", { ref: function (element) { return vs.scrollElement = element; }, key: 'scrollElementKey' }));
|
|
105
107
|
};
|
|
106
|
-
this.listBoxId = kendo_react_common_1.guid();
|
|
107
|
-
this.guid = kendo_react_common_1.guid();
|
|
108
|
+
this.listBoxId = (0, kendo_react_common_1.guid)();
|
|
109
|
+
this.guid = (0, kendo_react_common_1.guid)();
|
|
108
110
|
this.component = component;
|
|
109
111
|
this.vs.PageChange = this.pageChange;
|
|
110
112
|
}
|
|
@@ -142,7 +144,7 @@ var DropDownBase = /** @class */ (function () {
|
|
|
142
144
|
var vs = this.vs;
|
|
143
145
|
var scrollElement = (vs.container || list.parentNode);
|
|
144
146
|
var virtualScroll = vsEnabled !== undefined ? vsEnabled : vs.enabled;
|
|
145
|
-
utils_1.scrollToItem(scrollElement, list, itemIndex, vs.translate, virtualScroll);
|
|
147
|
+
(0, utils_1.scrollToItem)(scrollElement, list, itemIndex, vs.translate, virtualScroll);
|
|
146
148
|
}
|
|
147
149
|
};
|
|
148
150
|
DropDownBase.prototype.initState = function () {
|
|
@@ -190,11 +192,11 @@ var DropDownBase = /** @class */ (function () {
|
|
|
190
192
|
var _a = props.data, data = _a === void 0 ? [] : _a, dataItemKey = props.dataItemKey, virtual = props.virtual;
|
|
191
193
|
var opened = props.opened !== undefined ? props.opened : this.component.state.opened;
|
|
192
194
|
if (item && virtual && this.vs.enabled) {
|
|
193
|
-
if (virtual.skip > 0 && utils_1.areSame(item, data[0], dataItemKey)) {
|
|
195
|
+
if (virtual.skip > 0 && (0, utils_1.areSame)(item, data[0], dataItemKey)) {
|
|
194
196
|
this.triggerOnPageChange(state, virtual.skip - 1, virtual.pageSize);
|
|
195
197
|
}
|
|
196
198
|
else if (!opened && virtual.skip + virtual.pageSize < virtual.total &&
|
|
197
|
-
utils_1.areSame(item, data[data.length - 1], dataItemKey)) {
|
|
199
|
+
(0, utils_1.areSame)(item, data[data.length - 1], dataItemKey)) {
|
|
198
200
|
this.triggerOnPageChange(state, virtual.skip + 1, virtual.pageSize);
|
|
199
201
|
}
|
|
200
202
|
}
|
|
@@ -36,6 +36,6 @@ export interface ListProps {
|
|
|
36
36
|
*/
|
|
37
37
|
export default class List extends React.Component<ListProps> {
|
|
38
38
|
renderItems(): JSX.Element[];
|
|
39
|
-
renderNoValueElement(localizationService: LocalizationService):
|
|
40
|
-
render():
|
|
39
|
+
renderNoValueElement(localizationService: LocalizationService): string | number | boolean | React.ReactFragment | JSX.Element | null | undefined;
|
|
40
|
+
render(): string | number | boolean | React.ReactFragment | JSX.Element | null | undefined;
|
|
41
41
|
}
|
package/dist/npm/common/List.js
CHANGED
|
@@ -35,18 +35,18 @@ var List = /** @class */ (function (_super) {
|
|
|
35
35
|
return data.map(function (item, index) {
|
|
36
36
|
var realIndex = skip + index;
|
|
37
37
|
var selected = highlightSelected &&
|
|
38
|
-
((!isArray && utils_1.areSame(item, value, valueField)) ||
|
|
39
|
-
(isArray && value.findIndex(function (i) { return utils_1.areSame(i, item, valueField); }) !== -1));
|
|
38
|
+
((!isArray && (0, utils_1.areSame)(item, value, valueField)) ||
|
|
39
|
+
(isArray && value.findIndex(function (i) { return (0, utils_1.areSame)(i, item, valueField); }) !== -1));
|
|
40
40
|
var group = undefined;
|
|
41
41
|
var current, previous;
|
|
42
42
|
if (index > 0 && groupField !== undefined) {
|
|
43
|
-
current = utils_1.getItemValue(item, groupField);
|
|
44
|
-
previous = utils_1.getItemValue(data[index - 1], groupField);
|
|
43
|
+
current = (0, utils_1.getItemValue)(item, groupField);
|
|
44
|
+
previous = (0, utils_1.getItemValue)(data[index - 1], groupField);
|
|
45
45
|
if (current && previous && current !== previous) {
|
|
46
46
|
group = current;
|
|
47
47
|
}
|
|
48
48
|
}
|
|
49
|
-
return (React.createElement(ListItem_1.default, { id: "option-"
|
|
49
|
+
return (React.createElement(ListItem_1.default, { id: "option-".concat(optionsGuid, "-").concat(realIndex), virtual: virtual, dataItem: item, selected: selected, focused: focusedIndex === index, index: realIndex, key: realIndex, onClick: _this.props.onClick, textField: textField, group: group, render: itemRender }));
|
|
50
50
|
});
|
|
51
51
|
};
|
|
52
52
|
List.prototype.renderNoValueElement = function (localizationService) {
|
|
@@ -57,7 +57,7 @@ var List = /** @class */ (function (_super) {
|
|
|
57
57
|
noDataRender.call(undefined, noDataElement) : noDataElement;
|
|
58
58
|
};
|
|
59
59
|
List.prototype.render = function () {
|
|
60
|
-
var localizationService = kendo_react_intl_1.provideLocalizationService(this);
|
|
60
|
+
var localizationService = (0, kendo_react_intl_1.provideLocalizationService)(this);
|
|
61
61
|
var _a = this.props, id = _a.id, show = _a.show, wrapperCssClass = _a.wrapperCssClass, wrapperStyle = _a.wrapperStyle, listStyle = _a.listStyle, listRef = _a.listRef, wrapperRef = _a.wrapperRef, _b = _a.listClassName, listClassName = _b === void 0 ? 'k-list-ul' : _b;
|
|
62
62
|
var items = this.renderItems();
|
|
63
63
|
return (items.length ? (React.createElement("div", { className: wrapperCssClass, style: wrapperStyle, ref: wrapperRef, onMouseDown: this.props.onMouseDown, onBlur: this.props.onBlur, onScroll: this.props.onScroll, unselectable: "on" },
|
|
@@ -67,4 +67,4 @@ var List = /** @class */ (function (_super) {
|
|
|
67
67
|
return List;
|
|
68
68
|
}(React.Component));
|
|
69
69
|
exports.default = List;
|
|
70
|
-
kendo_react_intl_1.registerForLocalization(List);
|
|
70
|
+
(0, kendo_react_intl_1.registerForLocalization)(List);
|
|
@@ -29,9 +29,9 @@ var ListDefaultItem = /** @class */ (function (_super) {
|
|
|
29
29
|
}
|
|
30
30
|
ListDefaultItem.prototype.render = function () {
|
|
31
31
|
var _a = this.props, selected = _a.selected, defaultItem = _a.defaultItem, textField = _a.textField;
|
|
32
|
-
return (React.createElement("div", { onClick: this.props.onClick, onMouseDown: preventDefault, style: { position: 'unset' }, className: kendo_react_common_1.classNames('k-list-optionlabel', {
|
|
32
|
+
return (React.createElement("div", { onClick: this.props.onClick, onMouseDown: preventDefault, style: { position: 'unset' }, className: (0, kendo_react_common_1.classNames)('k-list-optionlabel', {
|
|
33
33
|
'k-selected': selected
|
|
34
|
-
}) }, utils_1.getItemValue(defaultItem, textField) || ''));
|
|
34
|
+
}) }, (0, utils_1.getItemValue)(defaultItem, textField) || ''));
|
|
35
35
|
};
|
|
36
36
|
return ListDefaultItem;
|
|
37
37
|
}(React.Component));
|
|
@@ -24,17 +24,19 @@ var sizeMap = kendo_react_common_1.kendoThemeMaps.sizeMap, roundedMap = kendo_re
|
|
|
24
24
|
var ListFilter = /** @class */ (function (_super) {
|
|
25
25
|
__extends(ListFilter, _super);
|
|
26
26
|
function ListFilter() {
|
|
27
|
-
|
|
27
|
+
var _this = _super !== null && _super.apply(this, arguments) || this;
|
|
28
|
+
_this.input = null;
|
|
29
|
+
return _this;
|
|
28
30
|
}
|
|
29
31
|
ListFilter.prototype.render = function () {
|
|
30
32
|
var _a;
|
|
31
33
|
var _this = this;
|
|
32
34
|
var _b = this.props, size = _b.size, rounded = _b.rounded, fillMode = _b.fillMode, inputRef = _b.inputRef;
|
|
33
35
|
return (React.createElement("div", { className: "k-list-filter" },
|
|
34
|
-
React.createElement("span", { className: kendo_react_common_1.classNames('k-searchbox k-input', (_a = {},
|
|
35
|
-
_a["k-input-"
|
|
36
|
-
_a["k-rounded-"
|
|
37
|
-
_a["k-input-"
|
|
36
|
+
React.createElement("span", { className: (0, kendo_react_common_1.classNames)('k-searchbox k-input', (_a = {},
|
|
37
|
+
_a["k-input-".concat(sizeMap[size] || size)] = size,
|
|
38
|
+
_a["k-rounded-".concat(roundedMap[rounded] || rounded)] = rounded,
|
|
39
|
+
_a["k-input-".concat(fillMode)] = fillMode,
|
|
38
40
|
_a)) },
|
|
39
41
|
React.createElement("span", { className: "k-input-icon k-icon k-i-search" }),
|
|
40
42
|
React.createElement("input", { ref: inputRef ? inputRef : function (input) { return _this.input = input; }, value: this.props.value || '', className: "k-input-inner", onChange: this.props.onChange, onKeyDown: this.props.onKeyDown, tabIndex: this.props.tabIndex, onClick: function (e) { return e.stopPropagation(); } }))));
|
|
@@ -49,5 +49,5 @@ export interface ListItemProps {
|
|
|
49
49
|
*/
|
|
50
50
|
export default class ListItem extends React.Component<ListItemProps, {}> {
|
|
51
51
|
handleClick: React.MouseEventHandler<HTMLLIElement>;
|
|
52
|
-
render():
|
|
52
|
+
render(): string | number | boolean | React.ReactFragment | JSX.Element | null | undefined;
|
|
53
53
|
}
|
|
@@ -31,12 +31,12 @@ var ListItem = /** @class */ (function (_super) {
|
|
|
31
31
|
}
|
|
32
32
|
ListItem.prototype.render = function () {
|
|
33
33
|
var _a = this.props, selected = _a.selected, group = _a.group, dataItem = _a.dataItem, virtual = _a.virtual, renderer = _a.render;
|
|
34
|
-
var item = (React.createElement("li", { id: this.props.id, role: "option", "aria-selected": selected, className: kendo_react_common_1.classNames('k-list-item', {
|
|
34
|
+
var item = (React.createElement("li", { id: this.props.id, role: "option", "aria-selected": selected, className: (0, kendo_react_common_1.classNames)('k-list-item', {
|
|
35
35
|
'k-selected': selected,
|
|
36
36
|
'k-focus': this.props.focused,
|
|
37
37
|
'k-first': Boolean(group)
|
|
38
38
|
}), onClick: this.handleClick, style: { position: virtual ? 'relative' : 'unset' } },
|
|
39
|
-
React.createElement("span", { className: 'k-list-item-text' }, utils_1.getItemValue(dataItem, this.props.textField).toString()),
|
|
39
|
+
React.createElement("span", { className: 'k-list-item-text' }, (0, utils_1.getItemValue)(dataItem, this.props.textField).toString()),
|
|
40
40
|
group !== undefined ? React.createElement("div", { className: "k-list-item-group-label" }, group) : null));
|
|
41
41
|
return renderer !== undefined ? renderer.call(undefined, item, this.props) : item;
|
|
42
42
|
};
|
|
@@ -36,5 +36,5 @@ export default class SearchBar extends React.Component<SearchBarProps> {
|
|
|
36
36
|
*/
|
|
37
37
|
get input(): HTMLInputElement | null;
|
|
38
38
|
componentDidUpdate(prevProps: SearchBarProps): void;
|
|
39
|
-
render():
|
|
39
|
+
render(): string | number | boolean | React.ReactFragment | JSX.Element | null | undefined;
|
|
40
40
|
}
|
|
@@ -22,7 +22,9 @@ var React = require("react");
|
|
|
22
22
|
var SearchBar = /** @class */ (function (_super) {
|
|
23
23
|
__extends(SearchBar, _super);
|
|
24
24
|
function SearchBar() {
|
|
25
|
-
|
|
25
|
+
var _this = _super !== null && _super.apply(this, arguments) || this;
|
|
26
|
+
_this._input = null;
|
|
27
|
+
return _this;
|
|
26
28
|
}
|
|
27
29
|
Object.defineProperty(SearchBar.prototype, "input", {
|
|
28
30
|
/**
|
|
@@ -22,7 +22,7 @@ export default class VirtualScroll {
|
|
|
22
22
|
enabled: boolean;
|
|
23
23
|
pageSize: number;
|
|
24
24
|
itemHeight: number;
|
|
25
|
-
PageChange: (event: Page, syntheticEvent: React.SyntheticEvent<any>) => void;
|
|
25
|
+
PageChange: ((event: Page, syntheticEvent: React.SyntheticEvent<any>) => void) | null;
|
|
26
26
|
private prevScrollPos;
|
|
27
27
|
private listTranslate;
|
|
28
28
|
private scrollSyncing;
|
|
@@ -7,12 +7,16 @@ var maxHeightIE = 1533915;
|
|
|
7
7
|
var VirtualScroll = /** @class */ (function () {
|
|
8
8
|
function VirtualScroll() {
|
|
9
9
|
var _this = this;
|
|
10
|
+
this.container = null;
|
|
11
|
+
this.scrollElement = null;
|
|
12
|
+
this.list = null;
|
|
10
13
|
this.containerHeight = 0;
|
|
11
14
|
this.skip = 0;
|
|
12
15
|
this.total = 0;
|
|
13
16
|
this.enabled = false;
|
|
14
17
|
this.pageSize = 0;
|
|
15
18
|
this.itemHeight = 0;
|
|
19
|
+
this.PageChange = null;
|
|
16
20
|
this.prevScrollPos = 0;
|
|
17
21
|
this.listTranslate = 0;
|
|
18
22
|
this.scrollSyncing = false;
|
|
@@ -50,7 +54,7 @@ var VirtualScroll = /** @class */ (function () {
|
|
|
50
54
|
});
|
|
51
55
|
VirtualScroll.prototype.changePage = function (skip, e) {
|
|
52
56
|
var newSkip = Math.min(Math.max(0, skip), this.total - this.pageSize);
|
|
53
|
-
if (newSkip !== this.skip) {
|
|
57
|
+
if (newSkip !== this.skip && this.PageChange) {
|
|
54
58
|
this.PageChange({ skip: newSkip, take: this.pageSize }, e);
|
|
55
59
|
}
|
|
56
60
|
};
|
package/dist/npm/main.js
CHANGED
|
@@ -1,7 +1,11 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
3
|
if (k2 === undefined) k2 = k;
|
|
4
|
-
Object.
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
5
9
|
}) : (function(o, m, k, k2) {
|
|
6
10
|
if (k2 === undefined) k2 = k;
|
|
7
11
|
o[k2] = m[k];
|
|
@@ -8,7 +8,7 @@ exports.packageMetadata = {
|
|
|
8
8
|
name: '@progress/kendo-react-dropdowns',
|
|
9
9
|
productName: 'KendoReact',
|
|
10
10
|
productCodes: ['KENDOUIREACT', 'KENDOUICOMPLETE'],
|
|
11
|
-
publishDate:
|
|
11
|
+
publishDate: 1654761911,
|
|
12
12
|
version: '',
|
|
13
13
|
licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning'
|
|
14
14
|
};
|