@progress/kendo-react-dropdowns 6.1.1 → 7.0.0-develop.10

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 (177) hide show
  1. package/{dist/es/AutoComplete → AutoComplete}/AutoComplete.d.ts +12 -8
  2. package/{dist/npm/AutoComplete → AutoComplete}/AutoCompleteProps.d.ts +4 -1
  3. package/{dist/es/ComboBox → ComboBox}/ComboBox.d.ts +12 -8
  4. package/{dist/es/ComboBox → ComboBox}/ComboBoxProps.d.ts +4 -1
  5. package/{dist/es/DropDownList → DropDownList}/DropDownList.d.ts +9 -5
  6. package/{dist/es/DropDownList → DropDownList}/DropDownListProps.d.ts +4 -1
  7. package/{dist/es/DropDownTree → DropDownTree}/DropDownTree.d.ts +4 -0
  8. package/{dist/npm/DropDownTree → DropDownTree}/DropDownTreeProps.d.ts +4 -1
  9. package/DropDownTree/ListNoData.d.ts +10 -0
  10. package/DropDownTree/useDropdownWidth.d.ts +9 -0
  11. package/LICENSE.md +1 -1
  12. package/{dist/es/MultiColumnComboBox → MultiColumnComboBox}/MultiColumnComboBox.d.ts +4 -0
  13. package/{dist/npm/MultiSelect → MultiSelect}/MultiSelect.d.ts +9 -5
  14. package/{dist/es/MultiSelect → MultiSelect}/MultiSelectProps.d.ts +4 -1
  15. package/{dist/npm/MultiSelect → MultiSelect}/TagList.d.ts +5 -1
  16. package/{dist/es/MultiSelectTree → MultiSelectTree}/MultiSelectTree.d.ts +4 -0
  17. package/{dist/es/MultiSelectTree → MultiSelectTree}/MultiSelectTreeProps.d.ts +5 -1
  18. package/{dist/npm/MultiSelectTree → MultiSelectTree}/utils.d.ts +5 -1
  19. package/{dist/npm/common → common}/AdaptiveMode.d.ts +5 -1
  20. package/common/ClearButton.d.ts +18 -0
  21. package/{dist/npm/common → common}/DropDownBase.d.ts +5 -1
  22. package/{dist/es/common → common}/GroupStickyHeader.d.ts +5 -1
  23. package/{dist/es/common → common}/List.d.ts +8 -3
  24. package/common/ListContainer.d.ts +22 -0
  25. package/common/ListDefaultItem.d.ts +20 -0
  26. package/{dist/npm/common → common}/ListFilter.d.ts +4 -0
  27. package/{dist/npm/common → common}/ListGroupItem.d.ts +5 -1
  28. package/{dist/npm/common → common}/ListItem.d.ts +5 -1
  29. package/common/MultiColumnList.d.ts +9 -0
  30. package/common/Navigation.d.ts +17 -0
  31. package/{dist/es/common → common}/SearchBar.d.ts +5 -1
  32. package/{dist/npm/common → common}/VirtualScroll.d.ts +4 -1
  33. package/common/constants.d.ts +8 -0
  34. package/{dist/es/common → common}/events.d.ts +4 -1
  35. package/{dist/npm/common → common}/filterDescriptor.d.ts +4 -0
  36. package/{dist/es/common → common}/settings.d.ts +5 -2
  37. package/{dist/npm/common → common}/utils.d.ts +4 -0
  38. package/dist/cdn/js/kendo-react-dropdowns.js +5 -1
  39. package/index.d.ts +29 -0
  40. package/index.js +5 -0
  41. package/index.mjs +4397 -0
  42. package/{dist/npm/messages → messages}/index.d.ts +4 -0
  43. package/package-metadata.d.ts +9 -0
  44. package/package.json +34 -62
  45. package/about.md +0 -3
  46. package/dist/es/AutoComplete/AutoComplete.js +0 -652
  47. package/dist/es/AutoComplete/AutoCompleteProps.d.ts +0 -243
  48. package/dist/es/AutoComplete/AutoCompleteProps.js +0 -2
  49. package/dist/es/ComboBox/ComboBox.js +0 -915
  50. package/dist/es/ComboBox/ComboBoxProps.js +0 -2
  51. package/dist/es/DropDownList/DropDownList.js +0 -887
  52. package/dist/es/DropDownList/DropDownListProps.js +0 -2
  53. package/dist/es/DropDownTree/DropDownTree.js +0 -540
  54. package/dist/es/DropDownTree/DropDownTreeProps.d.ts +0 -294
  55. package/dist/es/DropDownTree/DropDownTreeProps.js +0 -2
  56. package/dist/es/DropDownTree/ListNoData.d.ts +0 -6
  57. package/dist/es/DropDownTree/ListNoData.js +0 -8
  58. package/dist/es/DropDownTree/useDropdownWidth.d.ts +0 -5
  59. package/dist/es/DropDownTree/useDropdownWidth.js +0 -13
  60. package/dist/es/MultiColumnComboBox/MultiColumnComboBox.js +0 -213
  61. package/dist/es/MultiSelect/MultiSelect.d.ts +0 -256
  62. package/dist/es/MultiSelect/MultiSelect.js +0 -1110
  63. package/dist/es/MultiSelect/MultiSelectProps.js +0 -2
  64. package/dist/es/MultiSelect/TagList.d.ts +0 -38
  65. package/dist/es/MultiSelect/TagList.js +0 -39
  66. package/dist/es/MultiSelectTree/MultiSelectTree.js +0 -619
  67. package/dist/es/MultiSelectTree/MultiSelectTreeProps.js +0 -2
  68. package/dist/es/MultiSelectTree/utils.d.ts +0 -17
  69. package/dist/es/MultiSelectTree/utils.js +0 -191
  70. package/dist/es/common/AdaptiveMode.d.ts +0 -21
  71. package/dist/es/common/AdaptiveMode.js +0 -45
  72. package/dist/es/common/ClearButton.d.ts +0 -14
  73. package/dist/es/common/ClearButton.js +0 -39
  74. package/dist/es/common/DropDownBase.d.ts +0 -175
  75. package/dist/es/common/DropDownBase.js +0 -297
  76. package/dist/es/common/GroupStickyHeader.js +0 -34
  77. package/dist/es/common/List.js +0 -75
  78. package/dist/es/common/ListContainer.d.ts +0 -18
  79. package/dist/es/common/ListContainer.js +0 -43
  80. package/dist/es/common/ListDefaultItem.d.ts +0 -16
  81. package/dist/es/common/ListDefaultItem.js +0 -36
  82. package/dist/es/common/ListFilter.d.ts +0 -19
  83. package/dist/es/common/ListFilter.js +0 -37
  84. package/dist/es/common/ListGroupItem.d.ts +0 -33
  85. package/dist/es/common/ListGroupItem.js +0 -33
  86. package/dist/es/common/ListItem.d.ts +0 -61
  87. package/dist/es/common/ListItem.js +0 -44
  88. package/dist/es/common/MultiColumnList.d.ts +0 -6
  89. package/dist/es/common/MultiColumnList.js +0 -22
  90. package/dist/es/common/Navigation.d.ts +0 -13
  91. package/dist/es/common/Navigation.js +0 -34
  92. package/dist/es/common/SearchBar.js +0 -62
  93. package/dist/es/common/VirtualScroll.d.ts +0 -42
  94. package/dist/es/common/VirtualScroll.js +0 -161
  95. package/dist/es/common/constants.d.ts +0 -4
  96. package/dist/es/common/constants.js +0 -4
  97. package/dist/es/common/events.js +0 -1
  98. package/dist/es/common/filterDescriptor.d.ts +0 -41
  99. package/dist/es/common/filterDescriptor.js +0 -2
  100. package/dist/es/common/settings.js +0 -8
  101. package/dist/es/common/utils.d.ts +0 -62
  102. package/dist/es/common/utils.js +0 -194
  103. package/dist/es/main.d.ts +0 -25
  104. package/dist/es/main.js +0 -19
  105. package/dist/es/messages/index.d.ts +0 -40
  106. package/dist/es/messages/index.js +0 -41
  107. package/dist/es/package-metadata.d.ts +0 -5
  108. package/dist/es/package-metadata.js +0 -11
  109. package/dist/npm/AutoComplete/AutoComplete.d.ts +0 -230
  110. package/dist/npm/AutoComplete/AutoComplete.js +0 -655
  111. package/dist/npm/AutoComplete/AutoCompleteProps.js +0 -3
  112. package/dist/npm/ComboBox/ComboBox.d.ts +0 -248
  113. package/dist/npm/ComboBox/ComboBox.js +0 -918
  114. package/dist/npm/ComboBox/ComboBoxProps.d.ts +0 -313
  115. package/dist/npm/ComboBox/ComboBoxProps.js +0 -3
  116. package/dist/npm/DropDownList/DropDownList.d.ts +0 -258
  117. package/dist/npm/DropDownList/DropDownList.js +0 -890
  118. package/dist/npm/DropDownList/DropDownListProps.d.ts +0 -326
  119. package/dist/npm/DropDownList/DropDownListProps.js +0 -3
  120. package/dist/npm/DropDownTree/DropDownTree.d.ts +0 -70
  121. package/dist/npm/DropDownTree/DropDownTree.js +0 -543
  122. package/dist/npm/DropDownTree/DropDownTreeProps.js +0 -3
  123. package/dist/npm/DropDownTree/ListNoData.d.ts +0 -6
  124. package/dist/npm/DropDownTree/ListNoData.js +0 -12
  125. package/dist/npm/DropDownTree/useDropdownWidth.d.ts +0 -5
  126. package/dist/npm/DropDownTree/useDropdownWidth.js +0 -17
  127. package/dist/npm/MultiColumnComboBox/MultiColumnComboBox.d.ts +0 -287
  128. package/dist/npm/MultiColumnComboBox/MultiColumnComboBox.js +0 -216
  129. package/dist/npm/MultiSelect/MultiSelect.js +0 -1113
  130. package/dist/npm/MultiSelect/MultiSelectProps.d.ts +0 -314
  131. package/dist/npm/MultiSelect/MultiSelectProps.js +0 -3
  132. package/dist/npm/MultiSelect/TagList.js +0 -41
  133. package/dist/npm/MultiSelectTree/MultiSelectTree.d.ts +0 -81
  134. package/dist/npm/MultiSelectTree/MultiSelectTree.js +0 -622
  135. package/dist/npm/MultiSelectTree/MultiSelectTreeProps.d.ts +0 -320
  136. package/dist/npm/MultiSelectTree/MultiSelectTreeProps.js +0 -3
  137. package/dist/npm/MultiSelectTree/utils.js +0 -196
  138. package/dist/npm/common/AdaptiveMode.js +0 -49
  139. package/dist/npm/common/ClearButton.d.ts +0 -14
  140. package/dist/npm/common/ClearButton.js +0 -41
  141. package/dist/npm/common/DropDownBase.js +0 -299
  142. package/dist/npm/common/GroupStickyHeader.d.ts +0 -24
  143. package/dist/npm/common/GroupStickyHeader.js +0 -36
  144. package/dist/npm/common/List.d.ts +0 -45
  145. package/dist/npm/common/List.js +0 -77
  146. package/dist/npm/common/ListContainer.d.ts +0 -18
  147. package/dist/npm/common/ListContainer.js +0 -45
  148. package/dist/npm/common/ListDefaultItem.d.ts +0 -16
  149. package/dist/npm/common/ListDefaultItem.js +0 -38
  150. package/dist/npm/common/ListFilter.js +0 -39
  151. package/dist/npm/common/ListGroupItem.js +0 -35
  152. package/dist/npm/common/ListItem.js +0 -46
  153. package/dist/npm/common/MultiColumnList.d.ts +0 -6
  154. package/dist/npm/common/MultiColumnList.js +0 -26
  155. package/dist/npm/common/Navigation.d.ts +0 -13
  156. package/dist/npm/common/Navigation.js +0 -37
  157. package/dist/npm/common/SearchBar.d.ts +0 -43
  158. package/dist/npm/common/SearchBar.js +0 -64
  159. package/dist/npm/common/VirtualScroll.js +0 -163
  160. package/dist/npm/common/constants.d.ts +0 -4
  161. package/dist/npm/common/constants.js +0 -7
  162. package/dist/npm/common/events.d.ts +0 -73
  163. package/dist/npm/common/events.js +0 -2
  164. package/dist/npm/common/filterDescriptor.js +0 -3
  165. package/dist/npm/common/settings.d.ts +0 -114
  166. package/dist/npm/common/settings.js +0 -11
  167. package/dist/npm/common/utils.js +0 -211
  168. package/dist/npm/main.d.ts +0 -25
  169. package/dist/npm/main.js +0 -62
  170. package/dist/npm/messages/index.js +0 -44
  171. package/dist/npm/package-metadata.d.ts +0 -5
  172. package/dist/npm/package-metadata.js +0 -14
  173. package/dist/systemjs/kendo-react-dropdowns.js +0 -1
  174. package/e2e-next/combobox.basic.ts +0 -24
  175. package/e2e-next/dropdownlist.basic.tests.ts +0 -24
  176. package/e2e-next/dropdowntree.basic.tests.ts +0 -24
  177. package/e2e-next/multicolumncombobox.basic.tests.ts +0 -24
@@ -1,655 +0,0 @@
1
- "use strict";
2
- var __extends = (this && this.__extends) || (function () {
3
- var extendStatics = function (d, b) {
4
- extendStatics = Object.setPrototypeOf ||
5
- ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
6
- function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
7
- return extendStatics(d, b);
8
- };
9
- return function (d, b) {
10
- if (typeof b !== "function" && b !== null)
11
- throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
12
- extendStatics(d, b);
13
- function __() { this.constructor = d; }
14
- d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
15
- };
16
- })();
17
- var __assign = (this && this.__assign) || function () {
18
- __assign = Object.assign || function(t) {
19
- for (var s, i = 1, n = arguments.length; i < n; i++) {
20
- s = arguments[i];
21
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
22
- t[p] = s[p];
23
- }
24
- return t;
25
- };
26
- return __assign.apply(this, arguments);
27
- };
28
- Object.defineProperty(exports, "__esModule", { value: true });
29
- exports.AutoComplete = exports.AutoCompletePropsContext = exports.AutoCompleteWithoutContext = void 0;
30
- var React = require("react");
31
- var PropTypes = require("prop-types");
32
- var SearchBar_1 = require("./../common/SearchBar");
33
- var ListContainer_1 = require("./../common/ListContainer");
34
- var List_1 = require("./../common/List");
35
- var DropDownBase_1 = require("../common/DropDownBase");
36
- var GroupStickyHeader_1 = require("../common/GroupStickyHeader");
37
- var utils_1 = require("../common/utils");
38
- var kendo_react_common_1 = require("@progress/kendo-react-common");
39
- var kendo_react_labels_1 = require("@progress/kendo-react-labels");
40
- var kendo_react_common_2 = require("@progress/kendo-react-common");
41
- var package_metadata_1 = require("../package-metadata");
42
- var ClearButton_1 = require("../common/ClearButton");
43
- var VALIDATION_MESSAGE = 'Please enter a valid value!';
44
- var sizeMap = kendo_react_common_1.kendoThemeMaps.sizeMap, roundedMap = kendo_react_common_1.kendoThemeMaps.roundedMap;
45
- /** @hidden */
46
- var AutoCompleteWithoutContext = /** @class */ (function (_super) {
47
- __extends(AutoCompleteWithoutContext, _super);
48
- function AutoCompleteWithoutContext(props) {
49
- var _this = _super.call(this, props) || this;
50
- /**
51
- * @hidden
52
- */
53
- _this.state = {};
54
- _this.base = new DropDownBase_1.default(_this);
55
- _this._element = null;
56
- _this._inputId = (0, kendo_react_common_1.guid)();
57
- _this._suggested = '';
58
- _this._input = null;
59
- _this._isScrolling = false;
60
- _this.itemHeight = 0;
61
- /**
62
- * @hidden
63
- */
64
- _this.focus = function () {
65
- if (_this._input) {
66
- _this._input.focus();
67
- }
68
- };
69
- /**
70
- * @hidden
71
- */
72
- _this.handleItemSelect = function (index, state) {
73
- var _a = _this.props.data, data = _a === void 0 ? [] : _a;
74
- var newText = (0, utils_1.getItemValue)(data[index], _this.props.textField);
75
- _this.triggerOnChange(newText, state);
76
- };
77
- /**
78
- * @hidden
79
- */
80
- _this.itemFocus = function (index, state) {
81
- var _a = _this.props, _b = _a.data, data = _b === void 0 ? [] : _b, textField = _a.textField;
82
- var focusedItem = data[index];
83
- if (!(0, utils_1.areSame)(_this.state.focusedItem, focusedItem, textField)) {
84
- state.data.focusedItem = focusedItem;
85
- }
86
- };
87
- /**
88
- * @hidden
89
- */
90
- _this.togglePopup = function (state) {
91
- _this.base.togglePopup(state);
92
- };
93
- _this.setValidity = function () {
94
- if (_this._input && _this._input.setCustomValidity) {
95
- _this._input.setCustomValidity(_this.validity.valid
96
- ? ''
97
- : _this.props.validationMessage || VALIDATION_MESSAGE);
98
- }
99
- };
100
- _this.onScroll = function (event) {
101
- _this._isScrolling = true;
102
- var list = _this.base.list;
103
- var groupField = _this.props.groupField;
104
- var _a = _this.props.data, data = _a === void 0 ? [] : _a;
105
- if (!groupField || !data.length) {
106
- return;
107
- }
108
- var itemHeight = _this.itemHeight || (list ? list.children[0].offsetHeight : 0);
109
- var target = event.target;
110
- var scrollTop = target.scrollTop;
111
- if (groupField) {
112
- data = _this.base.getGroupedDataModernMode(data, groupField);
113
- }
114
- ;
115
- var group = data[0][groupField];
116
- for (var i = 1; i < data.length; i++) {
117
- if (itemHeight * i > scrollTop) {
118
- break;
119
- }
120
- if (data[i] && data[i][groupField]) {
121
- group = data[i][groupField];
122
- }
123
- }
124
- if (group !== _this.state.group) {
125
- _this.setState({
126
- group: group
127
- });
128
- }
129
- };
130
- _this.handleItemClick = function (index, event) {
131
- _this.base.handleItemClick(index, event);
132
- _this._valueDuringOnChange = undefined;
133
- };
134
- _this.onChangeHandler = function (event) {
135
- var base = _this.base;
136
- var state = base.initState();
137
- var input = event.currentTarget;
138
- var value = input.value;
139
- var selectionAtEnd = input.selectionEnd === value.length;
140
- state.syntheticEvent = event;
141
- var prevSuggestion = _this._suggested;
142
- var prevValue = _this.value;
143
- var prevUserInput = prevValue &&
144
- prevValue.substring(0, prevValue.length - prevSuggestion.length);
145
- var deletedSuggestion = prevUserInput && prevUserInput === value;
146
- var deleting = prevUserInput && prevUserInput.length > value.length;
147
- var suggest = _this.props.suggest;
148
- var opened = _this.props.opened !== undefined ?
149
- _this.props.opened : _this.state.opened;
150
- if (suggest !== undefined && suggest !== false) {
151
- if (deletedSuggestion || deleting || !selectionAtEnd) {
152
- _this._suggested = '';
153
- }
154
- else {
155
- _this.suggestValue(value);
156
- }
157
- var newValue = value + _this._suggested;
158
- var suggestion = { userInput: value, value: _this._suggested };
159
- _this.triggerOnChange(newValue, state, { suggestion: suggestion });
160
- }
161
- else {
162
- _this._suggested = '';
163
- _this.triggerOnChange(value, state);
164
- }
165
- if ((!opened && value) || (opened && !value)) {
166
- _this.togglePopup(state);
167
- }
168
- state.data.focusedItem = undefined;
169
- _this.applyState(state);
170
- _this.setState({ group: undefined });
171
- };
172
- _this.clearButtonClick = function (event) {
173
- var base = _this.base;
174
- var state = base.initState();
175
- var opened = _this.props.opened !== undefined ? _this.props.opened : _this.state.opened;
176
- state.syntheticEvent = event;
177
- var newValue = '';
178
- _this._suggested = '';
179
- _this.triggerOnChange(newValue, state);
180
- if (_this.state.focusedItem !== undefined) {
181
- state.data.focusedItem = undefined;
182
- }
183
- if (opened) {
184
- _this.togglePopup(state);
185
- }
186
- _this.applyState(state);
187
- };
188
- _this.onInputKeyDown = function (event) {
189
- var _a = _this.props, _b = _a.data, data = _b === void 0 ? [] : _b, skipDisabledItems = _a.skipDisabledItems, groupField = _a.groupField, textField = _a.textField;
190
- if (_this._isScrolling) {
191
- _this._isScrolling = false;
192
- }
193
- var focusedIndex = _this.focusedIndex();
194
- var focusedItem = data[focusedIndex];
195
- var keyCode = event.keyCode;
196
- var altOrOptionsKeyPressed = event.altKey;
197
- var opened = _this.props.opened !== undefined ? _this.props.opened : _this.state.opened;
198
- var state = _this.base.initState();
199
- state.syntheticEvent = event;
200
- var preventDefault = function () {
201
- if (opened) {
202
- event.preventDefault();
203
- }
204
- };
205
- if (altOrOptionsKeyPressed && keyCode === kendo_react_common_1.Keys.down) {
206
- _this.setState({
207
- opened: true
208
- });
209
- }
210
- else if (altOrOptionsKeyPressed && keyCode === kendo_react_common_1.Keys.up) {
211
- _this.setState({
212
- opened: false
213
- });
214
- }
215
- else if (opened && keyCode === kendo_react_common_1.Keys.pageUp) {
216
- _this.base.scrollPopupByPageSize(-1);
217
- }
218
- else if (opened && keyCode === kendo_react_common_1.Keys.pageDown) {
219
- _this.base.scrollPopupByPageSize(1);
220
- }
221
- else if (opened && (keyCode === kendo_react_common_1.Keys.enter || keyCode === kendo_react_common_1.Keys.esc)) {
222
- preventDefault();
223
- if (skipDisabledItems === false && focusedItem && focusedItem.disabled) {
224
- if (opened) {
225
- _this.togglePopup(state);
226
- }
227
- _this.applyState(state);
228
- }
229
- else {
230
- _this.applyInputValue(event.currentTarget.value, state, event.keyCode);
231
- }
232
- }
233
- else if (!opened && keyCode === kendo_react_common_1.Keys.esc) {
234
- var newValue = '';
235
- _this._suggested = '';
236
- _this.triggerOnChange(newValue, state);
237
- if (_this.state.focusedItem !== undefined) {
238
- state.data.focusedItem = undefined;
239
- }
240
- _this.applyState(state);
241
- }
242
- else if (keyCode === kendo_react_common_1.Keys.up || keyCode === kendo_react_common_1.Keys.down) {
243
- if (groupField !== '' && textField) {
244
- if (!_this.props.skipDisabledItems && opened) {
245
- _this.onNavigate(state, keyCode);
246
- }
247
- else {
248
- var newIndex = 0;
249
- if (keyCode === kendo_react_common_1.Keys.down || keyCode === kendo_react_common_1.Keys.right) {
250
- var tempnewIndex_1 = data.slice(focusedIndex + 1).find(function (i) { return !i.disabled && i[textField]; });
251
- newIndex = tempnewIndex_1 && data.findIndex(function (el) { return el[textField] === tempnewIndex_1[textField]; });
252
- }
253
- else if (keyCode === kendo_react_common_1.Keys.up || keyCode === kendo_react_common_1.Keys.left) {
254
- var dataToSearch = void 0;
255
- if (focusedIndex === -1) {
256
- dataToSearch = data;
257
- newIndex = data.findIndex(function (i) { return !i.disabled && i[textField]; });
258
- }
259
- else {
260
- dataToSearch = data.slice(0, focusedIndex);
261
- var tempnewIndex_2 = dataToSearch.pop();
262
- while (tempnewIndex_2 && tempnewIndex_2.disabled) {
263
- tempnewIndex_2 = dataToSearch.pop();
264
- }
265
- newIndex = tempnewIndex_2 && data.findIndex(function (el) { return el[textField] === tempnewIndex_2[textField]; });
266
- }
267
- }
268
- if (newIndex !== undefined) {
269
- var skipItems = newIndex - focusedIndex;
270
- _this.onNavigate(state, keyCode, skipItems);
271
- }
272
- else if (newIndex === undefined && data.findIndex(function (el) { return el[textField]; }) === data.length - 1) {
273
- _this.onNavigate(state, keyCode);
274
- }
275
- }
276
- }
277
- else if (!_this.props.skipDisabledItems && opened) {
278
- _this.onNavigate(state, keyCode);
279
- }
280
- else {
281
- var newIndex = null;
282
- if (keyCode === kendo_react_common_1.Keys.down || keyCode === kendo_react_common_1.Keys.right) {
283
- newIndex = data.slice(focusedIndex + 1).find(function (i) { return !i.disabled; });
284
- }
285
- else if (keyCode === kendo_react_common_1.Keys.up || keyCode === kendo_react_common_1.Keys.left) {
286
- var dataTest = data.slice(0, focusedIndex);
287
- newIndex = dataTest.pop();
288
- while (newIndex && newIndex.disabled) {
289
- newIndex = dataTest.pop();
290
- }
291
- }
292
- if (newIndex) {
293
- var skipItems = newIndex.id - focusedIndex - 1;
294
- _this.onNavigate(state, keyCode, skipItems);
295
- }
296
- else {
297
- _this.onNavigate(state, keyCode);
298
- }
299
- }
300
- _this.applyState(state);
301
- preventDefault();
302
- }
303
- };
304
- _this.handleBlur = function (event) {
305
- if (_this.state.focused) {
306
- var state = _this.base.initState();
307
- state.data.focused = false;
308
- state.events.push({ type: 'onBlur' });
309
- state.syntheticEvent = event;
310
- _this.applyInputValue(event.currentTarget.value, state);
311
- }
312
- };
313
- (0, kendo_react_common_2.validatePackage)(package_metadata_1.packageMetadata);
314
- return _this;
315
- }
316
- Object.defineProperty(AutoCompleteWithoutContext.prototype, "element", {
317
- /**
318
- * @hidden
319
- */
320
- get: function () {
321
- return this._element;
322
- },
323
- enumerable: false,
324
- configurable: true
325
- });
326
- Object.defineProperty(AutoCompleteWithoutContext.prototype, "value", {
327
- /**
328
- * The value of the AutoComplete.
329
- */
330
- get: function () {
331
- if (this._valueDuringOnChange !== undefined) {
332
- return this._valueDuringOnChange;
333
- }
334
- else if (this.props.value !== undefined) {
335
- return this.props.value;
336
- }
337
- else if (this.state.value !== undefined) {
338
- return this.state.value;
339
- }
340
- else if (this.props.defaultValue !== undefined) {
341
- return this.props.defaultValue;
342
- }
343
- return '';
344
- },
345
- enumerable: false,
346
- configurable: true
347
- });
348
- Object.defineProperty(AutoCompleteWithoutContext.prototype, "name", {
349
- /**
350
- * Gets the `name` property of the AutoComplete.
351
- */
352
- get: function () {
353
- return this.props.name;
354
- },
355
- enumerable: false,
356
- configurable: true
357
- });
358
- Object.defineProperty(AutoCompleteWithoutContext.prototype, "validity", {
359
- /**
360
- * Represents the validity state into which the AutoComplete is set.
361
- */
362
- get: function () {
363
- // The AutoComplete component is in a invalid state
364
- // only if it's required and the value is null!
365
- var customError = this.props.validationMessage !== undefined;
366
- var isValid = (!this.required || this.value !== '');
367
- var valid = this.props.valid !== undefined ? this.props.valid : isValid;
368
- return {
369
- customError: customError,
370
- valid: valid,
371
- valueMissing: this.value === null
372
- };
373
- },
374
- enumerable: false,
375
- configurable: true
376
- });
377
- Object.defineProperty(AutoCompleteWithoutContext.prototype, "validityStyles", {
378
- /**
379
- * @hidden
380
- */
381
- get: function () {
382
- return this.props.validityStyles !== undefined
383
- ? this.props.validityStyles
384
- : AutoCompleteWithoutContext.defaultProps.validityStyles;
385
- },
386
- enumerable: false,
387
- configurable: true
388
- });
389
- Object.defineProperty(AutoCompleteWithoutContext.prototype, "required", {
390
- /**
391
- * @hidden
392
- */
393
- get: function () {
394
- return this.props.required !== undefined
395
- ? this.props.required
396
- : AutoCompleteWithoutContext.defaultProps.required;
397
- },
398
- enumerable: false,
399
- configurable: true
400
- });
401
- /**
402
- * @hidden
403
- */
404
- AutoCompleteWithoutContext.prototype.componentDidUpdate = function (prevProps, prevState) {
405
- var _a;
406
- var _b = this.props, _c = _b.groupField, groupField = _c === void 0 ? '' : _c, _d = _b.data, data = _d === void 0 ? [] : _d;
407
- var _e = prevProps.data, prevData = _e === void 0 ? [] : _e;
408
- var focusedIndex = this.focusedIndex();
409
- var focusedItem = data[focusedIndex];
410
- var dataChanged = prevData !== data;
411
- var focusedItemChanged = focusedItem !== undefined && prevState.focusedItem !== focusedItem;
412
- var opened = this.props.opened !== undefined ? this.props.opened : this.state.opened;
413
- var prevOpened = prevProps.opened !== undefined ? prevProps.opened : prevState.opened;
414
- var opening = !prevOpened && opened;
415
- if (groupField === '') {
416
- if ((opened && (focusedItemChanged || dataChanged)) || opening) {
417
- this.base.scrollToItem(focusedIndex);
418
- }
419
- }
420
- else if (!this._isScrolling) {
421
- var focusedItemIndex = (_a = this.base.getGroupedDataModernMode(data, groupField)) === null || _a === void 0 ? void 0 : _a.indexOf(focusedItem);
422
- if (opening) {
423
- // Resets the sticky header group value for scenarios with open/close of component's popup
424
- if (data && data.length !== 0) {
425
- this.base.resetGroupStickyHeader(data[0][groupField], this);
426
- }
427
- this.base.scrollToItem(focusedItemIndex);
428
- }
429
- ;
430
- if (opened && prevOpened && focusedItemChanged) {
431
- this.base.scrollToItem(focusedItemIndex);
432
- }
433
- }
434
- this.setValidity();
435
- };
436
- /**
437
- * @hidden
438
- */
439
- AutoCompleteWithoutContext.prototype.componentDidMount = function () {
440
- this.base.didMount();
441
- this.setValidity();
442
- };
443
- /**
444
- * @hidden
445
- */
446
- AutoCompleteWithoutContext.prototype.render = function () {
447
- var _a;
448
- var _this = this;
449
- var _b = this.props, dir = _b.dir, disabled = _b.disabled, label = _b.label, className = _b.className, style = _b.style, loading = _b.loading, suggest = _b.suggest, size = _b.size, rounded = _b.rounded, fillMode = _b.fillMode;
450
- var isValid = !this.validityStyles || this.validity.valid;
451
- var base = this.base;
452
- var value = this.value;
453
- var renderClearButton = this.props.clearButton !== false && !loading && !!value;
454
- var id = this.props.id || this._inputId;
455
- if (typeof suggest === 'string') {
456
- this._suggested = suggest;
457
- }
458
- var autoComplete = (React.createElement("span", { className: (0, kendo_react_common_1.classNames)('k-autocomplete k-input', className, (_a = {},
459
- _a["k-input-".concat(sizeMap[size] || size)] = size,
460
- _a["k-rounded-".concat(roundedMap[rounded] || rounded)] = rounded,
461
- _a["k-input-".concat(fillMode)] = fillMode,
462
- _a['k-invalid'] = !isValid,
463
- _a['k-loading'] = loading,
464
- _a['k-required'] = this.required,
465
- _a['k-disabled'] = disabled,
466
- _a)), ref: function (element) {
467
- _this._element = element;
468
- base.wrapper = element;
469
- }, style: !label
470
- ? style
471
- : __assign(__assign({}, style), { width: undefined }), dir: dir },
472
- this.renderSearchBar(value || '', id),
473
- loading && React.createElement(kendo_react_common_1.IconWrap, { className: "k-input-loading-icon", name: 'loading' }),
474
- renderClearButton && !loading && React.createElement(ClearButton_1.default, { onClick: this.clearButtonClick, key: "clearbutton" }),
475
- this.renderListContainer()));
476
- return label
477
- ? (React.createElement(kendo_react_labels_1.FloatingLabel, { label: label, editorId: id, editorValue: value, editorValid: isValid, editorDisabled: disabled, style: { width: style ? style.width : undefined }, children: autoComplete }))
478
- : autoComplete;
479
- };
480
- /**
481
- * @hidden
482
- */
483
- AutoCompleteWithoutContext.prototype.onNavigate = function (state, keyCode, skipItems) {
484
- var _this = this;
485
- var typedText = this.value;
486
- var _a = this.props, _b = _a.data, data = _b === void 0 ? [] : _b, textField = _a.textField, focusedItemIndex = _a.focusedItemIndex;
487
- var focusedIndex = this.state.focusedItem !== undefined ?
488
- data.findIndex(function (i) { return (0, utils_1.areSame)(i, _this.state.focusedItem, textField); }) :
489
- (focusedItemIndex ? focusedItemIndex(data, typedText, textField) :
490
- data.indexOf((0, utils_1.getFocusedItem)(data, typedText, textField)));
491
- var newFocused = this.base.navigation.navigate({
492
- keyCode: keyCode,
493
- current: focusedIndex,
494
- max: data.length - 1,
495
- min: 0,
496
- skipItems: skipItems ? skipItems : undefined
497
- });
498
- if (newFocused !== undefined) {
499
- this.itemFocus(newFocused, state);
500
- }
501
- this.applyState(state);
502
- };
503
- /**
504
- * @hidden
505
- */
506
- AutoCompleteWithoutContext.prototype.applyInputValue = function (value, state, eventKey) {
507
- var opened = this.props.opened !== undefined ? this.props.opened : this.state.opened;
508
- var _a = this.props, _b = _a.data, data = _b === void 0 ? [] : _b, textField = _a.textField;
509
- var focusedIndex = this.focusedIndex();
510
- var focusedItem = data[focusedIndex];
511
- this._suggested = '';
512
- if (opened && eventKey === kendo_react_common_1.Keys.enter) {
513
- if (focusedItem && !focusedItem.disabled) {
514
- var newValue = (0, utils_1.getItemValue)(data[this.focusedIndex(value)], textField);
515
- this.triggerOnChange(newValue, state);
516
- }
517
- }
518
- if (opened) {
519
- this.togglePopup(state);
520
- }
521
- this.applyState(state);
522
- };
523
- AutoCompleteWithoutContext.prototype.renderSearchBar = function (value, id) {
524
- var _this = this;
525
- var base = this.base;
526
- var _a = this.props, placeholder = _a.placeholder, tabIndex = _a.tabIndex, disabled = _a.disabled, readonly = _a.readonly;
527
- var focused = this.state.focused;
528
- var opened = this.props.opened !== undefined ? this.props.opened : this.state.opened;
529
- return (React.createElement(SearchBar_1.default, { id: id, placeholder: placeholder, tabIndex: tabIndex, accessKey: this.props.accessKey, value: value, suggestedText: this._suggested, focused: focused, name: this.props.name, ref: function (searchbar) { return _this._input = searchbar && searchbar.input; }, onKeyDown: this.onInputKeyDown, onChange: this.onChangeHandler, onFocus: base.handleFocus, onBlur: this.handleBlur, disabled: disabled, readOnly: readonly, expanded: opened, owns: base.listBoxId, activedescendant: 'option-' + base.guid + '-' + this.focusedIndex(), role: "combobox", ariaLabelledBy: this.props.ariaLabelledBy, ariaDescribedBy: this.props.ariaDescribedBy, ariaRequired: this.required, render: this.props.valueRender }));
530
- };
531
- AutoCompleteWithoutContext.prototype.renderListContainer = function () {
532
- var _a;
533
- var base = this.base;
534
- var _b = this.props, dir = _b.dir, header = _b.header, footer = _b.footer, _c = _b.data, data = _c === void 0 ? [] : _c, size = _b.size, groupField = _b.groupField, list = _b.list, groupStickyHeaderItemRender = _b.groupStickyHeaderItemRender;
535
- var popupSettings = base.getPopupSettings();
536
- var opened = this.props.opened !== undefined ? this.props.opened : this.state.opened;
537
- var popupWidth = popupSettings.width !== undefined ? popupSettings.width : base.popupWidth;
538
- var group = this.state.group;
539
- if (group === undefined && groupField !== undefined) {
540
- group = (0, utils_1.getItemValue)(data[0], groupField);
541
- }
542
- return (React.createElement(ListContainer_1.default, { width: popupWidth, popupSettings: {
543
- animate: popupSettings.animate,
544
- anchor: this.element,
545
- show: opened,
546
- popupClass: (0, kendo_react_common_1.classNames)(popupSettings.popupClass, 'k-list-container', 'k-autocomplete-popup'),
547
- className: popupSettings.className,
548
- appendTo: popupSettings.appendTo
549
- }, dir: dir !== undefined ? dir : this.base.dirCalculated, itemsCount: [data.length] },
550
- header && React.createElement("div", { className: "k-list-header" }, header),
551
- React.createElement("div", { className: (0, kendo_react_common_1.classNames)('k-list', (_a = {},
552
- _a["k-list-".concat(sizeMap[size] || size)] = size,
553
- _a)) },
554
- !list && group && data.length !== 0 && React.createElement(GroupStickyHeader_1.default, { group: group, groupMode: 'modern', render: groupStickyHeaderItemRender }),
555
- this.renderList()),
556
- footer && React.createElement("div", { className: "k-list-footer" }, footer)));
557
- };
558
- AutoCompleteWithoutContext.prototype.renderList = function () {
559
- var base = this.base;
560
- var popupSettings = base.getPopupSettings();
561
- var _a = this.props, textField = _a.textField, _b = _a.data, data = _b === void 0 ? [] : _b, listNoDataRender = _a.listNoDataRender, itemRender = _a.itemRender, groupHeaderItemRender = _a.groupHeaderItemRender;
562
- var value = this.value;
563
- var opened = this.props.opened !== undefined ? this.props.opened : this.state.opened;
564
- return (React.createElement(List_1.default, { id: base.listBoxId, show: opened, data: data.slice(), focusedIndex: this.focusedIndex(), value: value, textField: textField, valueField: textField, highlightSelected: false, optionsGuid: base.guid, groupField: this.props.groupField, groupMode: 'modern', listRef: function (list) { return base.list = list; }, wrapperStyle: { maxHeight: popupSettings.height }, wrapperCssClass: "k-list-content", onClick: this.handleItemClick, itemRender: itemRender, groupHeaderItemRender: groupHeaderItemRender, noDataRender: listNoDataRender, onMouseDown: function (e) { return e.preventDefault(); }, onScroll: this.onScroll }));
565
- };
566
- AutoCompleteWithoutContext.prototype.triggerOnChange = function (newValue, state, eventArgs) {
567
- if (this.value === newValue && !eventArgs) {
568
- return;
569
- }
570
- state.data.value = newValue;
571
- this._valueDuringOnChange = newValue;
572
- state.events.push(__assign({ type: 'onChange' }, (eventArgs || {})));
573
- };
574
- AutoCompleteWithoutContext.prototype.applyState = function (state) {
575
- this.base.applyState(state);
576
- this._valueDuringOnChange = undefined;
577
- };
578
- AutoCompleteWithoutContext.prototype.suggestValue = function (value) {
579
- this._suggested = '';
580
- if (value) {
581
- var _a = this.props, _b = _a.data, data = _b === void 0 ? [] : _b, textField = _a.textField;
582
- var suggestedItem = data[(0, utils_1.itemIndexStartsWith)(data, value, textField)];
583
- if (suggestedItem) {
584
- var suggestedText = (0, utils_1.getItemValue)(suggestedItem, textField);
585
- if (value.toLowerCase() !== suggestedText.toLowerCase()) {
586
- this._suggested = suggestedText.substring(value.length);
587
- }
588
- }
589
- }
590
- };
591
- AutoCompleteWithoutContext.prototype.focusedIndex = function (value) {
592
- var _this = this;
593
- var _a = this.props, _b = _a.data, data = _b === void 0 ? [] : _b, textField = _a.textField, focusedItemIndex = _a.focusedItemIndex, skipDisabledItems = _a.skipDisabledItems;
594
- var inputValue = value !== undefined ? value : this.value;
595
- if (this.state.focusedItem !== undefined) {
596
- return data.findIndex(function (i) { return (0, utils_1.areSame)(i, _this.state.focusedItem, textField); });
597
- }
598
- else if (focusedItemIndex) {
599
- return focusedItemIndex(data, inputValue, textField);
600
- }
601
- else {
602
- var indexOfFocusedItem = data.indexOf((0, utils_1.getFocusedItem)(data, inputValue, textField));
603
- if (skipDisabledItems && textField && indexOfFocusedItem === -1) {
604
- return data.findIndex(function (i) { return !i.disabled && i[textField]; });
605
- }
606
- return Math.max(0, indexOfFocusedItem);
607
- }
608
- };
609
- AutoCompleteWithoutContext.displayName = 'AutoComplete';
610
- /**
611
- * @hidden
612
- */
613
- AutoCompleteWithoutContext.propTypes = __assign(__assign({}, DropDownBase_1.default.basicPropTypes), { size: PropTypes.oneOf([null, 'small', 'medium', 'large']), rounded: PropTypes.oneOf([null, 'small', 'medium', 'large', 'full']), fillMode: PropTypes.oneOf([null, 'solid', 'flat', 'outline']), groupField: PropTypes.string, suggest: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]), placeholder: PropTypes.string, value: PropTypes.string, defaultValue: PropTypes.string, validationMessage: PropTypes.string, required: PropTypes.bool, readonly: PropTypes.bool, clearButton: PropTypes.bool, valueRender: PropTypes.func, id: PropTypes.string, ariaLabelledBy: PropTypes.string, ariaDescribedBy: PropTypes.string, list: PropTypes.any, skipDisabledItems: PropTypes.bool });
614
- /**
615
- * @hidden
616
- */
617
- AutoCompleteWithoutContext.defaultProps = __assign(__assign({}, DropDownBase_1.default.defaultProps), { size: 'medium', rounded: 'medium', fillMode: 'solid', skipDisabledItems: true });
618
- return AutoCompleteWithoutContext;
619
- }(React.Component));
620
- exports.AutoCompleteWithoutContext = AutoCompleteWithoutContext;
621
- /**
622
- * Represents the PropsContext of the `AutoComplete` component.
623
- * Used for global configuration of all `AutoComplete` instances.
624
- *
625
- * For more information, refer to the [Dropdowns Props Context]({% slug props-context_dropdowns %}) article.
626
- */
627
- exports.AutoCompletePropsContext = (0, kendo_react_common_1.createPropsContext)();
628
- /* eslint-disable @typescript-eslint/no-redeclare -- intentionally naming the component the same as the type */
629
- /**
630
- * Represents the [KendoReact AutoComplete component]({% slug overview_autocomplete %}).
631
- *
632
- * Accepts properties of type [AutoCompleteProps]({% slug api_dropdowns_autocompleteprops %}).
633
- * Obtaining the `ref` returns an object of type [AutoCompleteHandle]({% slug api_dropdowns_autocompletehandle %}).
634
- *
635
- * @example
636
- * ```jsx
637
- * class App extends React.Component {
638
- * autocomplete = null;
639
- * render() {
640
- * return (
641
- * <div>
642
- * <AutoComplete
643
- * data={[ "Albania", "Andorra", "Austria", "Belarus" ]}
644
- * ref={component => this.autocomplete = component}
645
- * />
646
- * <button onClick={() => alert(this.autocomplete.value)}>alert value</button>
647
- * </div>
648
- * );
649
- * }
650
- * }
651
- * ReactDOM.render(<App />, document.querySelector('my-app'));
652
- * ```
653
- */
654
- exports.AutoComplete = (0, kendo_react_common_1.withPropsContext)(exports.AutoCompletePropsContext, AutoCompleteWithoutContext);
655
- exports.AutoComplete.displayName = 'KendoReactAutoComplete';
@@ -1,3 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- // tslint:enable:max-line-length