@progress/kendo-angular-dropdowns 19.1.1 → 19.1.2-develop.2
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/autocomplete/autocomplete.component.d.ts +62 -53
- package/autocomplete/autocomplete.module.d.ts +9 -1
- package/comboboxes/combobox-column/column-cell-template.directive.d.ts +6 -6
- package/comboboxes/combobox-column/column-header-template.directive.d.ts +5 -4
- package/comboboxes/combobox-column/combobox-column.component.d.ts +21 -17
- package/comboboxes/combobox-column/util.d.ts +7 -4
- package/comboboxes/combobox.component.d.ts +28 -45
- package/comboboxes/combobox.module.d.ts +11 -2
- package/comboboxes/multicolumncombobox.component.d.ts +12 -2
- package/dropdownlist/dropdownlist.component.d.ts +53 -75
- package/dropdownlist/dropdownlist.module.d.ts +29 -11
- package/dropdowns.module.d.ts +8 -20
- package/dropdowntrees/checked-state/base-check.directive.d.ts +4 -7
- package/dropdowntrees/checked-state/check-all.directive.d.ts +4 -7
- package/dropdowntrees/checked-state/check.directive.d.ts +6 -10
- package/dropdowntrees/checked-state/checkable-settings.d.ts +2 -4
- package/dropdowntrees/checked-state/checked-item.d.ts +2 -2
- package/dropdowntrees/data-binding/dropdowntree/flat-binding.directive.d.ts +3 -3
- package/dropdowntrees/data-binding/dropdowntree/hierarchy-binding.directive.d.ts +2 -2
- package/dropdowntrees/data-binding/multiselecttree/flat-binding.directive.d.ts +3 -3
- package/dropdowntrees/data-binding/multiselecttree/hierarchy-binding.directive.d.ts +2 -2
- package/dropdowntrees/dropdowntree.component.d.ts +3 -3
- package/dropdowntrees/dropdowntrees.module.d.ts +1 -0
- package/dropdowntrees/expanded-state/expand.directive.d.ts +1 -1
- package/dropdowntrees/multiselecttree.component.d.ts +139 -120
- package/dropdowntrees/summary-tag/summary-tag.directive.d.ts +8 -6
- package/dropdowntrees/templates/node-template.directive.d.ts +4 -3
- package/esm2022/autocomplete/autocomplete.component.mjs +62 -53
- package/esm2022/autocomplete/autocomplete.module.mjs +9 -1
- package/esm2022/comboboxes/combobox-column/column-cell-template.directive.mjs +6 -6
- package/esm2022/comboboxes/combobox-column/column-header-template.directive.mjs +5 -4
- package/esm2022/comboboxes/combobox-column/combobox-column.component.mjs +21 -17
- package/esm2022/comboboxes/combobox-column/util.mjs +10 -5
- package/esm2022/comboboxes/combobox.component.mjs +28 -45
- package/esm2022/comboboxes/combobox.module.mjs +11 -2
- package/esm2022/comboboxes/multicolumncombobox.component.mjs +12 -2
- package/esm2022/dropdownlist/dropdownlist.component.mjs +53 -75
- package/esm2022/dropdownlist/dropdownlist.module.mjs +29 -11
- package/esm2022/dropdowns.module.mjs +8 -20
- package/esm2022/dropdowntrees/checked-state/base-check.directive.mjs +1 -1
- package/esm2022/dropdowntrees/checked-state/check-all.directive.mjs +4 -7
- package/esm2022/dropdowntrees/checked-state/check.directive.mjs +6 -10
- package/esm2022/dropdowntrees/data-binding/dropdowntree/flat-binding.directive.mjs +3 -3
- package/esm2022/dropdowntrees/data-binding/dropdowntree/hierarchy-binding.directive.mjs +2 -2
- package/esm2022/dropdowntrees/data-binding/multiselecttree/flat-binding.directive.mjs +3 -3
- package/esm2022/dropdowntrees/data-binding/multiselecttree/hierarchy-binding.directive.mjs +2 -2
- package/esm2022/dropdowntrees/dropdowntree.component.mjs +3 -3
- package/esm2022/dropdowntrees/dropdowntrees.module.mjs +1 -0
- package/esm2022/dropdowntrees/expanded-state/expand.directive.mjs +1 -1
- package/esm2022/dropdowntrees/multiselecttree.component.mjs +139 -120
- package/esm2022/dropdowntrees/summary-tag/summary-tag.directive.mjs +8 -6
- package/esm2022/dropdowntrees/templates/node-template.directive.mjs +4 -3
- package/esm2022/multiselect/multiselect.component.mjs +119 -163
- package/esm2022/multiselect/multiselect.module.mjs +13 -5
- package/esm2022/multiselect/summary-tag.directive.mjs +6 -4
- package/esm2022/package-metadata.mjs +2 -2
- package/fesm2022/progress-kendo-angular-dropdowns.mjs +571 -576
- package/multiselect/multiselect.component.d.ts +119 -163
- package/multiselect/multiselect.module.d.ts +13 -5
- package/multiselect/summary-tag.directive.d.ts +6 -4
- package/package.json +10 -10
- package/schematics/ngAdd/index.js +2 -2
@@ -36,7 +36,16 @@ import * as i5 from "../common/disabled-items/disabled-items.service";
|
|
36
36
|
import * as i6 from "../common/data.service";
|
37
37
|
import * as i7 from "@progress/kendo-angular-utils";
|
38
38
|
/**
|
39
|
-
* Represents the
|
39
|
+
* Represents the Kendo UI MultiColumnComboBox component for Angular.
|
40
|
+
*
|
41
|
+
* Use the `MultiColumnComboBoxComponent` to show a dropdown list with multiple columns.
|
42
|
+
* [See example]({% slug overview_multicolumncombobox %}).
|
43
|
+
*
|
44
|
+
* @example
|
45
|
+
* ```html
|
46
|
+
* <kendo-multicolumncombobox [data]="data" [columns]="columns">
|
47
|
+
* </kendo-multicolumncombobox>
|
48
|
+
* ```
|
40
49
|
*/
|
41
50
|
export class MultiColumnComboBoxComponent extends ComboBoxComponent {
|
42
51
|
hostElement;
|
@@ -55,7 +64,8 @@ export class MultiColumnComboBoxComponent extends ComboBoxComponent {
|
|
55
64
|
return this.disabled;
|
56
65
|
}
|
57
66
|
/**
|
58
|
-
*
|
67
|
+
* Contains a query list of all declared `ComboBoxColumnComponent` columns.
|
68
|
+
* Use this property to access and configure the columns displayed in the dropdown.
|
59
69
|
*/
|
60
70
|
columns;
|
61
71
|
/**
|
@@ -58,20 +58,11 @@ const DEFAULT_SIZE = 'medium';
|
|
58
58
|
const DEFAULT_ROUNDED = 'medium';
|
59
59
|
const DEFAULT_FILL_MODE = 'solid';
|
60
60
|
/**
|
61
|
-
* Represents the
|
61
|
+
* Represents the Kendo UI for Angular [DropDownList]({% slug overview_ddl %}) component.
|
62
62
|
*
|
63
63
|
* @example
|
64
|
-
* ```
|
65
|
-
*
|
66
|
-
* selector: 'my-app',
|
67
|
-
* template: `
|
68
|
-
* <kendo-dropdownlist [data]="listItems">
|
69
|
-
* </kendo-dropdownlist>
|
70
|
-
* `
|
71
|
-
* })
|
72
|
-
* class AppComponent {
|
73
|
-
* public listItems: Array<string> = ["Item 1", "Item 2", "Item 3", "Item 4"];
|
74
|
-
* }
|
64
|
+
* ```html
|
65
|
+
* <kendo-dropdownlist [data]="["Item 1", "Item 2", "Item 3"]"></kendo-dropdownlist>
|
75
66
|
* ```
|
76
67
|
*/
|
77
68
|
export class DropDownListComponent {
|
@@ -175,7 +166,7 @@ export class DropDownListComponent {
|
|
175
166
|
}
|
176
167
|
/**
|
177
168
|
* Shows or hides the current group sticky header when using grouped data.
|
178
|
-
*
|
169
|
+
* The sticky header displays by default. [see example.]({% slug grouping_autocomplete %}#toc-sticky-header)
|
179
170
|
*/
|
180
171
|
showStickyHeader = true;
|
181
172
|
/**
|
@@ -187,13 +178,13 @@ export class DropDownListComponent {
|
|
187
178
|
*/
|
188
179
|
svgIcon;
|
189
180
|
/**
|
190
|
-
* Sets and gets the loading state of the
|
181
|
+
* Sets and gets the loading state of the `DropDownListComponent`.
|
191
182
|
*/
|
192
183
|
loading;
|
193
184
|
/**
|
194
|
-
* Sets the data of the
|
185
|
+
* Sets the data of the `DropDownListComponent`.
|
195
186
|
*
|
196
|
-
*
|
187
|
+
* The data must be an array-like list.
|
197
188
|
*/
|
198
189
|
set data(data) {
|
199
190
|
this.dataService.data = data || [];
|
@@ -214,11 +205,11 @@ export class DropDownListComponent {
|
|
214
205
|
return this.dataService.data;
|
215
206
|
}
|
216
207
|
/**
|
217
|
-
* Sets the value of the
|
218
|
-
*
|
219
|
-
*
|
208
|
+
* Sets the value of the `DropDownListComponent`.
|
209
|
+
* The value can be a primitive (string, number) or a complex object.
|
210
|
+
* Use the `valuePrimitive` option to define the type.
|
220
211
|
*
|
221
|
-
*
|
212
|
+
* All selected values not present in the source are ignored.
|
222
213
|
*/
|
223
214
|
set value(newValue) {
|
224
215
|
if (!isPresent(newValue)) {
|
@@ -233,31 +224,31 @@ export class DropDownListComponent {
|
|
233
224
|
}
|
234
225
|
/**
|
235
226
|
* Sets the data item field that represents the item text.
|
236
|
-
* If the data contains only primitive values, do not define
|
227
|
+
* If the data contains only primitive values, do not define this property.
|
237
228
|
*
|
238
|
-
*
|
229
|
+
* The `textField` property can point to a nested property value, for example, `category.name`.
|
239
230
|
*/
|
240
231
|
textField;
|
241
232
|
/**
|
242
233
|
* Sets the data item field that represents the item value.
|
243
|
-
* If the data contains only primitive values, do not define
|
234
|
+
* If the data contains only primitive values, do not define this property.
|
244
235
|
*
|
245
|
-
*
|
236
|
+
* The `valueField` property can point to a nested property value, for example, `category.id`.
|
246
237
|
*/
|
247
238
|
valueField;
|
248
239
|
/**
|
249
|
-
* Enables or disables the adaptive mode.
|
240
|
+
* Enables or disables the adaptive mode. The adaptive rendering is disabled by default.
|
250
241
|
*/
|
251
242
|
adaptiveMode = 'none';
|
252
243
|
/**
|
253
|
-
* Sets the title of the ActionSheet
|
254
|
-
* By default the ActionSheet title uses the text
|
244
|
+
* Sets the title of the ActionSheet rendered instead of the Popup on small screens.
|
245
|
+
* By default, the ActionSheet title uses the label text of the `DropDownListComponent`.
|
255
246
|
*/
|
256
247
|
adaptiveTitle = '';
|
257
248
|
/**
|
258
|
-
* Sets the subtitle of the ActionSheet
|
259
|
-
* By default the ActionSheet does not render a subtitle.
|
260
|
-
|
249
|
+
* Sets the subtitle of the ActionSheet rendered instead of the Popup on small screens.
|
250
|
+
* By default, the ActionSheet does not render a subtitle.
|
251
|
+
*/
|
261
252
|
adaptiveSubtitle = '';
|
262
253
|
/**
|
263
254
|
* @hidden
|
@@ -282,13 +273,13 @@ export class DropDownListComponent {
|
|
282
273
|
return this.isAdaptiveModeEnabled && this.windowSize !== 'large';
|
283
274
|
}
|
284
275
|
/**
|
285
|
-
* Configures the popup of the
|
276
|
+
* Configures the popup of the `DropDownListComponent`.
|
286
277
|
*
|
287
278
|
* The available options are:
|
288
|
-
* - `animate: Boolean`—Controls the popup animation.
|
279
|
+
* - `animate: Boolean`—Controls the popup animation. The open and close animations are enabled by default.
|
289
280
|
* - `width: Number | String`—Sets the width of the popup container. By default, the width of the host element is used. If set to `auto`, the component automatically adjusts the width of the popup and no item labels are wrapped. The `auto` mode is not supported when virtual scrolling is enabled.
|
290
281
|
* - `height: Number`—Sets the height of the popup container.
|
291
|
-
* - `popupClass: String`—Specifies a list of CSS classes
|
282
|
+
* - `popupClass: String`—Specifies a list of CSS classes used to style the popup.
|
292
283
|
* - `appendTo: "root" | "component" | ViewContainerRef`—Specifies the component to which the popup will be appended.
|
293
284
|
*/
|
294
285
|
set popupSettings(settings) {
|
@@ -298,12 +289,14 @@ export class DropDownListComponent {
|
|
298
289
|
return this._popupSettings;
|
299
290
|
}
|
300
291
|
/**
|
301
|
-
* Sets the height of the options list in the popup.
|
292
|
+
* Sets the height of the options list in the popup.
|
293
|
+
*
|
294
|
+
* The `listHeight` property affects only the list of options, not the whole popup container.
|
295
|
+
* To set the height of the popup container, use `popupSettings.height`.
|
302
296
|
*
|
303
|
-
*
|
304
|
-
* > To set the height of the popup container, use `popupSettings.height`.
|
297
|
+
* When using `adaptiveMode` and the screen size is `small` or `medium`, the `listHeight` property is set to null.
|
305
298
|
*
|
306
|
-
*
|
299
|
+
* @default 200
|
307
300
|
*/
|
308
301
|
set listHeight(_listHeight) {
|
309
302
|
this._listHeight = _listHeight;
|
@@ -316,16 +309,15 @@ export class DropDownListComponent {
|
|
316
309
|
}
|
317
310
|
_listHeight = 200;
|
318
311
|
/**
|
319
|
-
* Sets the text of the default empty item. The
|
312
|
+
* Sets the text of the default empty item. The value type must match the data type.
|
320
313
|
*/
|
321
314
|
defaultItem;
|
322
315
|
/**
|
323
|
-
* Sets the disabled state of the component. To
|
316
|
+
* Sets the disabled state of the component. To disable the component in reactive forms, see [Forms Support](slug:formssupport_ddl#toc-managing-the-dropdownlist-disabled-state-in-reactive-forms).
|
324
317
|
*/
|
325
318
|
disabled;
|
326
319
|
/**
|
327
|
-
* Defines a Boolean function
|
328
|
-
* ([see examples]({% slug disableditems_ddl %})). Determines whether the item will be disabled.
|
320
|
+
* Defines a Boolean function executed for each data item in the component. Determines whether the item is disabled. [See examples.]({% slug disableditems_ddl %})
|
329
321
|
*/
|
330
322
|
set itemDisabled(fn) {
|
331
323
|
if (typeof fn !== 'function') {
|
@@ -340,7 +332,7 @@ export class DropDownListComponent {
|
|
340
332
|
*/
|
341
333
|
readonly = false;
|
342
334
|
/**
|
343
|
-
* Enables the [filtering]({% slug filtering_ddl %}) functionality of the
|
335
|
+
* Enables the [filtering]({% slug filtering_ddl %}) functionality of the `DropDownListComponent`.
|
344
336
|
*/
|
345
337
|
filterable = false;
|
346
338
|
/**
|
@@ -353,17 +345,16 @@ export class DropDownListComponent {
|
|
353
345
|
return this._virtualSettings;
|
354
346
|
}
|
355
347
|
/**
|
356
|
-
* Enables a case-insensitive search.
|
348
|
+
* Enables a case-insensitive search. Use this option when filtration is disabled.
|
357
349
|
*/
|
358
350
|
ignoreCase = true;
|
359
351
|
/**
|
360
|
-
* Sets the delay before an item search is performed.
|
352
|
+
* Sets the delay before an item search is performed. Use this option when filtration is disabled.
|
361
353
|
*/
|
362
354
|
delay = 500;
|
363
355
|
/**
|
364
|
-
* Specifies the type of the selected value
|
365
|
-
*
|
366
|
-
* If set to `true`, the selected value has to be of a primitive value.
|
356
|
+
* Specifies the type of the selected value. If set to `true`, the selected value must be a primitive value.
|
357
|
+
* * [More information and example.]({% slug valuebinding_ddl %}#toc-primitive-values-from-object-fields)
|
367
358
|
*/
|
368
359
|
set valuePrimitive(isPrimitive) {
|
369
360
|
this._valuePrimitive = isPrimitive;
|
@@ -396,6 +387,7 @@ export class DropDownListComponent {
|
|
396
387
|
* * `large`
|
397
388
|
* * `none`
|
398
389
|
*
|
390
|
+
* @default 'medium'
|
399
391
|
*/
|
400
392
|
set size(size) {
|
401
393
|
const newSize = size ? size : DEFAULT_SIZE;
|
@@ -418,6 +410,7 @@ export class DropDownListComponent {
|
|
418
410
|
* * `full`
|
419
411
|
* * `none`
|
420
412
|
*
|
413
|
+
* @default 'medium'
|
421
414
|
*/
|
422
415
|
set rounded(rounded) {
|
423
416
|
const newRounded = rounded ? rounded : DEFAULT_ROUNDED;
|
@@ -439,6 +432,7 @@ export class DropDownListComponent {
|
|
439
432
|
* * `outline`
|
440
433
|
* * `none`
|
441
434
|
*
|
435
|
+
* @default 'solid'
|
442
436
|
*/
|
443
437
|
set fillMode(fillMode) {
|
444
438
|
const newFillMode = fillMode ? fillMode : DEFAULT_FILL_MODE;
|
@@ -457,27 +451,19 @@ export class DropDownListComponent {
|
|
457
451
|
*/
|
458
452
|
leftRightArrowsNavigation = true;
|
459
453
|
/**
|
460
|
-
* Fires each time the value
|
454
|
+
* Fires each time the value changes. [See example.](slug:events_ddl).
|
461
455
|
*/
|
462
456
|
valueChange = new EventEmitter();
|
463
457
|
/**
|
464
|
-
|
465
|
-
* ([see example](slug:events_ddl)).
|
466
|
-
* You can filter the source based on the passed filtration value.
|
467
|
-
* When the value of the component is programmatically changed to `ngModel` or `formControl`
|
468
|
-
* through its API or form binding, the `valueChange` event is not triggered because it
|
469
|
-
* might cause a mix-up with the built-in `valueChange` mechanisms of the `ngModel` or `formControl` bindings.
|
458
|
+
** Fires each time the user types in the input field. You can filter the source based on the filtration value. When the value is programmatically changed, the `valueChange` event is not triggered. [See example.](slug:events_ddl).
|
470
459
|
*/
|
471
460
|
filterChange = new EventEmitter();
|
472
461
|
/**
|
473
|
-
* Fires each time the item selection
|
474
|
-
* ([see example](slug:events_ddl)).
|
462
|
+
* Fires each time the item selection changes. [see example.](slug:events_ddl).
|
475
463
|
*/
|
476
464
|
selectionChange = new EventEmitter();
|
477
465
|
/**
|
478
|
-
* Fires each time the popup is about to open
|
479
|
-
* ([see example]({% slug openstate_ddl %}#toc-preventing-opening-and-closing)).
|
480
|
-
* This event is preventable. If you cancel it, the popup will remain closed.
|
466
|
+
* Fires each time the popup is about to open. This event is preventable. If you cancel it, the popup remains closed. [see example.]({% slug openstate_ddl %}#toc-preventing-opening-and-closing)
|
481
467
|
*/
|
482
468
|
open = new EventEmitter();
|
483
469
|
/**
|
@@ -485,9 +471,7 @@ export class DropDownListComponent {
|
|
485
471
|
*/
|
486
472
|
opened = new EventEmitter();
|
487
473
|
/**
|
488
|
-
* Fires each time the popup is about to close
|
489
|
-
* ([see example]({% slug openstate_ddl %}#toc-preventing-opening-and-closing)).
|
490
|
-
* This event is preventable. If you cancel it, the popup will remain open.
|
474
|
+
* Fires each time the popup is about to close. This event is preventable. If you cancel it, the popup remains open. [see example.]({% slug openstate_ddl %}#toc-preventing-opening-and-closing)
|
491
475
|
*/
|
492
476
|
close = new EventEmitter();
|
493
477
|
/**
|
@@ -495,11 +479,11 @@ export class DropDownListComponent {
|
|
495
479
|
*/
|
496
480
|
closed = new EventEmitter();
|
497
481
|
/**
|
498
|
-
* Fires each time the user focuses the
|
482
|
+
* Fires each time the user focuses the `DropDownListComponent`.
|
499
483
|
*/
|
500
484
|
onFocus = new EventEmitter();
|
501
485
|
/**
|
502
|
-
* Fires each time the
|
486
|
+
* Fires each time the `DropDownListComponent` gets blurred.
|
503
487
|
*/
|
504
488
|
onBlur = new EventEmitter();
|
505
489
|
itemTemplate;
|
@@ -798,9 +782,7 @@ export class DropDownListComponent {
|
|
798
782
|
return ngControl?.control || null;
|
799
783
|
}
|
800
784
|
/**
|
801
|
-
* Focuses a specific item of the
|
802
|
-
* If there is a default item it is positioned at index -1.
|
803
|
-
* If null or invalid index is provided the focus will be removed.
|
785
|
+
* Focuses a specific item of the `DropDownListComponent` based on the provided index. If there is a default item, it is positioned at index `-1`. If `null` or an invalid index is provided, the focus is removed.
|
804
786
|
*/
|
805
787
|
focusItemAt(index) {
|
806
788
|
const minIndex = isPresent(this.defaultItem) ? -1 : 0;
|
@@ -813,7 +795,7 @@ export class DropDownListComponent {
|
|
813
795
|
}
|
814
796
|
}
|
815
797
|
/**
|
816
|
-
* Focuses the
|
798
|
+
* Focuses the `DropDownListComponent`.
|
817
799
|
*/
|
818
800
|
focus() {
|
819
801
|
if (!this.disabled) {
|
@@ -821,7 +803,7 @@ export class DropDownListComponent {
|
|
821
803
|
}
|
822
804
|
}
|
823
805
|
/**
|
824
|
-
* Blurs the
|
806
|
+
* Blurs the `DropDownListComponent`.
|
825
807
|
*/
|
826
808
|
blur() {
|
827
809
|
if (!this.disabled) {
|
@@ -830,9 +812,7 @@ export class DropDownListComponent {
|
|
830
812
|
}
|
831
813
|
}
|
832
814
|
/**
|
833
|
-
* Toggles the visibility of the
|
834
|
-
* ([see example]({% slug openstate_ddl %}#toc-setting-the-initially-opened-component)).
|
835
|
-
* If you use the `toggle` method to open or close the popup, the `open` and `close` events will not be fired.
|
815
|
+
* Toggles the visibility of the Popup or ActionSheet. If you use the `toggle` method to open or close the Popup, the `open` and `close` events are not fired.
|
836
816
|
*
|
837
817
|
* @param open - The state of the popup.
|
838
818
|
*/
|
@@ -888,9 +868,7 @@ export class DropDownListComponent {
|
|
888
868
|
return isTruthy(this._open || this.isActionSheetExpanded);
|
889
869
|
}
|
890
870
|
/**
|
891
|
-
* Resets the value of the
|
892
|
-
* If you use the `reset` method to clear the value of the component,
|
893
|
-
* the model will not update automatically and the `selectionChange` and `valueChange` events will not be fired.
|
871
|
+
* Resets the value of the `DropDownListComponent`. If you use the `reset` method to clear the value, the model does not update automatically and the `selectionChange` and `valueChange` events are not fired.
|
894
872
|
*/
|
895
873
|
reset() {
|
896
874
|
this.value = undefined;
|
@@ -21,20 +21,38 @@ import * as i9 from "../common/filtering/filter.directive";
|
|
21
21
|
import * as i10 from "../common/localization/custom-messages.component";
|
22
22
|
// IMPORTANT: NgModule export kept for backwards compatibility
|
23
23
|
/**
|
24
|
+
* Required for adding all DropDownList features in NgModule-based Angular applications.
|
24
25
|
*
|
25
|
-
*
|
26
|
+
* ```typescript
|
27
|
+
* import { DropDownListModule } from '@progress/kendo-angular-dropdowns';
|
28
|
+
* @NgModule({
|
29
|
+
* imports: [DropDownListModule],
|
30
|
+
* declarations: [AppComponent],
|
31
|
+
* bootstrap: [AppComponent]
|
32
|
+
* })
|
33
|
+
* ```
|
26
34
|
*
|
27
35
|
* The package exports:
|
28
|
-
* - `DropDownListComponent`—The
|
29
|
-
* - `ItemTemplateDirective`—The
|
30
|
-
* - `ValueTemplateDirective`—The
|
31
|
-
* - `HeaderTemplateDirective`—The
|
32
|
-
* - `FooterTemplateDirective`—The
|
33
|
-
* - `NoDataTemplateDirective`—The
|
34
|
-
* - `GroupTemplateDirective`—The
|
35
|
-
* - `FixedGroupTemplateDirective`—The
|
36
|
-
* - `FilterDirective`—The
|
37
|
-
* - `CustomMessagesComponent`—The
|
36
|
+
* - `DropDownListComponent`—The `DropDownListComponent` class.
|
37
|
+
* - `ItemTemplateDirective`—The `ItemTemplateDirective` directive.
|
38
|
+
* - `ValueTemplateDirective`—The `ValueTemplateDirective` directive.
|
39
|
+
* - `HeaderTemplateDirective`—The `HeaderTemplateDirective` directive.
|
40
|
+
* - `FooterTemplateDirective`—The `FooterTemplateDirective` directive.
|
41
|
+
* - `NoDataTemplateDirective`—The `NoDataTemplateDirective` directive.
|
42
|
+
* - `GroupTemplateDirective`—The `GroupTemplateDirective` directive.
|
43
|
+
* - `FixedGroupTemplateDirective`—The `FixedGroupTemplateDirective` directive.
|
44
|
+
* - `FilterDirective`—The `FilterDirective` directive.
|
45
|
+
* - `CustomMessagesComponent`—The `CustomMessagesComponent` component.
|
46
|
+
*
|
47
|
+
* @example
|
48
|
+
* ```typescript
|
49
|
+
* import { DropDownListModule } from '@progress/kendo-angular-dropdowns';
|
50
|
+
*
|
51
|
+
* @NgModule({
|
52
|
+
* imports: [DropDownListModule],
|
53
|
+
* })
|
54
|
+
* export class AppModule {}
|
55
|
+
* ```
|
38
56
|
*/
|
39
57
|
export class DropDownListModule {
|
40
58
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DropDownListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
@@ -43,34 +43,22 @@ import * as i30 from "./dropdowntrees/data-binding/multiselecttree/hierarchy-bin
|
|
43
43
|
import * as i31 from "./dropdowntrees/summary-tag/summary-tag.directive";
|
44
44
|
// IMPORTANT: NgModule export kept for backwards compatibility
|
45
45
|
/**
|
46
|
-
*
|
47
|
-
* definition for the Dropdowns components.
|
46
|
+
* Required for adding all DropDowns features in NgModule-based Angular applications.
|
48
47
|
*
|
49
48
|
* @example
|
50
|
-
*
|
51
|
-
*
|
52
|
-
* // Import the Dropdowns module
|
49
|
+
* ```typescript
|
50
|
+
* // Import the DropDownsModule
|
53
51
|
* import { DropDownsModule } from '@progress/kendo-angular-dropdowns';
|
54
|
-
*
|
55
|
-
* // The browser platform with a compiler
|
56
|
-
* import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
|
57
|
-
*
|
58
52
|
* import { NgModule } from '@angular/core';
|
59
|
-
*
|
60
|
-
* // Import the app component
|
53
|
+
* import { BrowserModule } from '@angular/platform-browser';
|
61
54
|
* import { AppComponent } from './app.component';
|
62
55
|
*
|
63
|
-
*
|
64
|
-
*
|
65
|
-
*
|
66
|
-
*
|
67
|
-
* bootstrap: [AppComponent]
|
56
|
+
* @NgModule({
|
57
|
+
* declarations: [AppComponent],
|
58
|
+
* imports: [BrowserModule, DropDownsModule],
|
59
|
+
* bootstrap: [AppComponent]
|
68
60
|
* })
|
69
61
|
* export class AppModule {}
|
70
|
-
*
|
71
|
-
* // Compile and launch the module
|
72
|
-
* platformBrowserDynamic().bootstrapModule(AppModule);
|
73
|
-
*
|
74
62
|
* ```
|
75
63
|
*/
|
76
64
|
export class DropDownsModule {
|
@@ -54,7 +54,7 @@ export class BaseCheckDirective {
|
|
54
54
|
this.checkedKeys = new Set(this.checkedItems.map(item => item.key));
|
55
55
|
}
|
56
56
|
/**
|
57
|
-
*
|
57
|
+
* Add the item's depth to its value so you can have duplicate values on different levels.
|
58
58
|
*
|
59
59
|
* @param item - The checked key.
|
60
60
|
* @returns { string } - A string key consisting of the item's `valueField` value and its depth (depth is 0 if data is homogeneous).
|
@@ -20,23 +20,20 @@ export class CheckAllDirective extends BaseCheckDirective {
|
|
20
20
|
lastAction;
|
21
21
|
treeview;
|
22
22
|
/**
|
23
|
-
*
|
23
|
+
* Sets the collection that stores all checked items.
|
24
24
|
*/
|
25
25
|
checkedItems;
|
26
26
|
/**
|
27
|
-
*
|
27
|
+
* Sets the item key or keys to compare data items.
|
28
28
|
*/
|
29
29
|
valueField;
|
30
30
|
focused;
|
31
31
|
/**
|
32
|
-
* Fires when the `checkedItems` collection
|
32
|
+
* Fires when the `checkedItems` collection updates.
|
33
33
|
*/
|
34
34
|
checkedItemsChange = new EventEmitter();
|
35
35
|
/**
|
36
|
-
* Holds a Set with
|
37
|
-
*
|
38
|
-
* Should be updated each time the `checkedItems` value or content is changed.
|
39
|
-
* Can be used for efficient look-up of whether an item is checked or not (O(1) access time).
|
36
|
+
* Holds a `Set` with only the checked item keys. Updates this set each time the `checkedItems` value or content changes and uses it for fast look-up to check if an item is checked.
|
40
37
|
*/
|
41
38
|
checkedKeys = new Set();
|
42
39
|
currentCheckedState;
|
@@ -18,28 +18,24 @@ import * as i1 from "@progress/kendo-angular-treeview";
|
|
18
18
|
export class CheckDirective extends BaseCheckDirective {
|
19
19
|
treeView;
|
20
20
|
/**
|
21
|
-
* Specifies whether items
|
22
|
-
*
|
23
|
-
* The `checkChildren` prop also enables or disables parent item checking (i.e. checking all child items automatically checks the parent).
|
21
|
+
* Specifies whether items are checked on click and if checking a node also checks its children.
|
22
|
+
* The `checkChildren` property also controls parent item checking (checking all child items automatically checks the parent).
|
24
23
|
*/
|
25
24
|
checkable;
|
26
25
|
/**
|
27
|
-
*
|
26
|
+
* Sets the item key or keys to compare data items.
|
28
27
|
*/
|
29
28
|
valueField;
|
30
29
|
/**
|
31
|
-
*
|
30
|
+
* Sets the collection that stores all checked items.
|
32
31
|
*/
|
33
32
|
checkedItems;
|
34
33
|
/**
|
35
|
-
* Fires when the `checkedItems` collection
|
34
|
+
* Fires when the `checkedItems` collection updates.
|
36
35
|
*/
|
37
36
|
checkedItemsChange = new EventEmitter();
|
38
37
|
/**
|
39
|
-
* Holds a Set with
|
40
|
-
*
|
41
|
-
* Should be updated each time the `checkedItems` value or content is changed.
|
42
|
-
* Can be used for efficient look-up of whether an item is checked or not (O(1) access time).
|
38
|
+
* Holds a `Set` with only the checked item keys. Updates this set each time the `checkedItems` value or content changes and uses it for fast look-up to check if an item is checked.
|
43
39
|
*/
|
44
40
|
checkedKeys = new Set();
|
45
41
|
subscriptions = new Subscription();
|
@@ -8,12 +8,12 @@ import { DataBoundComponent, FlatDataBindingDirective } from '@progress/kendo-an
|
|
8
8
|
import * as i0 from "@angular/core";
|
9
9
|
import * as i1 from "@progress/kendo-angular-treeview";
|
10
10
|
/**
|
11
|
-
*
|
11
|
+
* Retrieves child nodes when the provided data is flat.
|
12
12
|
*/
|
13
13
|
export class DropDownTreeFlatBindingDirective extends FlatDataBindingDirective {
|
14
14
|
dropDownTree;
|
15
15
|
/**
|
16
|
-
*
|
16
|
+
* Sets the nodes to display in the DropDownTree.
|
17
17
|
*/
|
18
18
|
set nodes(nodes) {
|
19
19
|
// Needs to be a setter so that it matches the accessor in FlatDataBindingDirective it extends
|
@@ -23,7 +23,7 @@ export class DropDownTreeFlatBindingDirective extends FlatDataBindingDirective {
|
|
23
23
|
return this._nodes;
|
24
24
|
}
|
25
25
|
/**
|
26
|
-
*
|
26
|
+
* Sets the unique field that identifies a node.
|
27
27
|
*/
|
28
28
|
idField;
|
29
29
|
/**
|
@@ -8,12 +8,12 @@ import { DataBoundComponent, HierarchyBindingDirective } from '@progress/kendo-a
|
|
8
8
|
import * as i0 from "@angular/core";
|
9
9
|
import * as i1 from "@progress/kendo-angular-treeview";
|
10
10
|
/**
|
11
|
-
*
|
11
|
+
* Retrieves child nodes when the provided data is hierarchical.
|
12
12
|
*/
|
13
13
|
export class DropDownTreeHierarchyBindingDirective extends HierarchyBindingDirective {
|
14
14
|
dropDownTree;
|
15
15
|
/**
|
16
|
-
*
|
16
|
+
* Sets the nodes to display in the DropDownTree.
|
17
17
|
*/
|
18
18
|
set nodes(nodes) {
|
19
19
|
// Needs to be a setter so that it matches the accessor in FlatDataBindingDirective it extends
|
@@ -8,12 +8,12 @@ import { DataBoundComponent, FlatDataBindingDirective } from '@progress/kendo-an
|
|
8
8
|
import * as i0 from "@angular/core";
|
9
9
|
import * as i1 from "@progress/kendo-angular-treeview";
|
10
10
|
/**
|
11
|
-
*
|
11
|
+
* Retrieves child nodes when the provided data is flat for the MultiSelectTree.
|
12
12
|
*/
|
13
13
|
export class MultiSelectTreeFlatBindingDirective extends FlatDataBindingDirective {
|
14
14
|
multiSelectTree;
|
15
15
|
/**
|
16
|
-
*
|
16
|
+
* Sets the nodes to display in the MultiSelectTree.
|
17
17
|
*/
|
18
18
|
set nodes(nodes) {
|
19
19
|
// Needs to be a setter so that it matches the accessor in FlatDataBindingDirective it extends
|
@@ -23,7 +23,7 @@ export class MultiSelectTreeFlatBindingDirective extends FlatDataBindingDirectiv
|
|
23
23
|
return this._nodes;
|
24
24
|
}
|
25
25
|
/**
|
26
|
-
*
|
26
|
+
* Sets the unique field that identifies a node.
|
27
27
|
*/
|
28
28
|
idField;
|
29
29
|
/**
|
@@ -8,12 +8,12 @@ import { DataBoundComponent, HierarchyBindingDirective } from '@progress/kendo-a
|
|
8
8
|
import * as i0 from "@angular/core";
|
9
9
|
import * as i1 from "@progress/kendo-angular-treeview";
|
10
10
|
/**
|
11
|
-
*
|
11
|
+
* Retrieves child nodes when the provided data is hierarchical for the MultiSelectTree.
|
12
12
|
*/
|
13
13
|
export class MultiSelectTreeHierarchyBindingDirective extends HierarchyBindingDirective {
|
14
14
|
multiSelectTree;
|
15
15
|
/**
|
16
|
-
*
|
16
|
+
* Sets the nodes to display in the MultiSelectTree.
|
17
17
|
*/
|
18
18
|
set nodes(nodes) {
|
19
19
|
// Needs to be a setter so that it matches the accessor in FlatDataBindingDirective it extends
|
@@ -268,7 +268,7 @@ export class DropDownTreeComponent {
|
|
268
268
|
*/
|
269
269
|
fetchChildren = fetchChildren;
|
270
270
|
/**
|
271
|
-
*
|
271
|
+
* Sets the placeholder of the input element of the DropDownTree.
|
272
272
|
*/
|
273
273
|
placeholder = "";
|
274
274
|
/**
|
@@ -304,7 +304,7 @@ export class DropDownTreeComponent {
|
|
304
304
|
* > The `listHeight` property affects only the list of options and not the whole popup container.
|
305
305
|
* > To set the height of the popup container, use `popupSettings.height`.
|
306
306
|
*
|
307
|
-
*
|
307
|
+
* When using `adaptiveMode` and the screen size is `small` or `medium` the `listHeight` property is set to null.
|
308
308
|
*/
|
309
309
|
set listHeight(_listHeight) {
|
310
310
|
this._listHeight = _listHeight;
|
@@ -416,7 +416,7 @@ export class DropDownTreeComponent {
|
|
416
416
|
*/
|
417
417
|
isNodeExpanded;
|
418
418
|
/**
|
419
|
-
* A callback which determines whether a tree node should be rendered as hidden. The utility
|
419
|
+
* A callback which determines whether a tree node should be rendered as hidden. The utility `.k-hidden` class is used to hide the nodes.
|
420
420
|
* Useful for custom filtering implementations.
|
421
421
|
*/
|
422
422
|
isNodeVisible = isNodeVisible;
|
@@ -28,6 +28,7 @@ import * as i15 from "../common/templates/group-tag-template.directive";
|
|
28
28
|
import * as i16 from "../common/templates/tag-template.directive";
|
29
29
|
// IMPORTANT: NgModule export kept for backwards compatibility
|
30
30
|
/**
|
31
|
+
* Required for adding all DropDownTree features in NgModule-based Angular applications.
|
31
32
|
* - `MultiSelectTreeComponent`—The MultiSelectTree component class.
|
32
33
|
* - `DropDownTreeComponent`—The DropDownTree component class.
|
33
34
|
* - `MultiSelectTreeFlatBindingDirective`—The MultiSelectTree flat binding directive.
|
@@ -7,7 +7,7 @@ import { ExpandableComponent, ExpandDirective } from '@progress/kendo-angular-tr
|
|
7
7
|
import * as i0 from "@angular/core";
|
8
8
|
import * as i1 from "@progress/kendo-angular-treeview";
|
9
9
|
/**
|
10
|
-
*
|
10
|
+
* Manages the expanded state of the popup TreeView.
|
11
11
|
*/
|
12
12
|
export class DropDownTreesExpandDirective extends ExpandDirective {
|
13
13
|
dropDownTree;
|