ng-virtual-list 20.7.13 → 20.7.15

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/index.d.ts CHANGED
@@ -45,6 +45,133 @@ interface IRect extends ISize {
45
45
  y: number;
46
46
  }
47
47
 
48
+ /**
49
+ * Action modes for collection elements.
50
+ * @link https://github.com/DjonnyX/ng-virtual-list/blob/20.x/projects/ng-virtual-list/src/lib/enums/collection-modes.ts
51
+ * @author Evgenii Grebennikov
52
+ * @email djonnyx@gmail.com
53
+ */
54
+ declare enum CollectionModes {
55
+ /**
56
+ * When adding elements to the beginning of the collection, the scroll remains at the current position.
57
+ */
58
+ NORMAL = "normal",
59
+ /**
60
+ * When adding elements to the beginning of the collection, the scroll is shifted by the sum of the sizes of the new elements.
61
+ */
62
+ LAZY = "lazy"
63
+ }
64
+
65
+ /**
66
+ * Action modes for collection elements.
67
+ * @link https://github.com/DjonnyX/ng-virtual-list/blob/20.x/projects/ng-virtual-list/src/lib/enums/collection-mode.ts
68
+ * @author Evgenii Grebennikov
69
+ * @email djonnyx@gmail.com
70
+ */
71
+ type CollectionMode = CollectionModes | 'normal' | 'lazy';
72
+
73
+ /**
74
+ * Axis of the arrangement of virtual list elements.
75
+ * @link https://github.com/DjonnyX/ng-virtual-list/blob/20.x/projects/ng-virtual-list/src/lib/enums/directions.ts
76
+ * @author Evgenii Grebennikov
77
+ * @email djonnyx@gmail.com
78
+ */
79
+ declare enum Directions {
80
+ /**
81
+ * Horizontal axis.
82
+ */
83
+ HORIZONTAL = "horizontal",
84
+ /**
85
+ * Vertical axis.
86
+ */
87
+ VERTICAL = "vertical"
88
+ }
89
+
90
+ /**
91
+ * Axis of the arrangement of virtual list elements.
92
+ * @link https://github.com/DjonnyX/ng-virtual-list/blob/20.x/projects/ng-virtual-list/src/lib/enums/direction.ts
93
+ * @author Evgenii Grebennikov
94
+ * @email djonnyx@gmail.com
95
+ */
96
+ type Direction = Directions | 'horizontal' | 'vertical';
97
+
98
+ /**
99
+ * Methods for selecting list items.
100
+ * @link https://github.com/DjonnyX/ng-virtual-list/blob/20.x/projects/ng-virtual-list/src/lib/enums/methods-for-selecting.ts
101
+ * @author Evgenii Grebennikov
102
+ * @email djonnyx@gmail.com
103
+ */
104
+ declare enum MethodsForSelecting {
105
+ /**
106
+ * List items are not selectable.
107
+ */
108
+ NONE = "none",
109
+ /**
110
+ * List items are selected one by one.
111
+ */
112
+ SELECT = "select",
113
+ /**
114
+ * Multiple selection of list items.
115
+ */
116
+ MULTI_SELECT = "multi-select"
117
+ }
118
+
119
+ /**
120
+ * Methods for selecting list items.
121
+ * @link https://github.com/DjonnyX/ng-virtual-list/blob/20.x/projects/ng-virtual-list/src/lib/enums/method-for-selecting.ts
122
+ * @author Evgenii Grebennikov
123
+ * @email djonnyx@gmail.com
124
+ */
125
+ type MethodForSelecting = MethodsForSelecting | 'none' | 'select' | 'multi-select';
126
+
127
+ /**
128
+ * Snapping method.
129
+ * @link https://github.com/DjonnyX/ng-virtual-list/blob/20.x/projects/ng-virtual-list/src/lib/enums/snapping-method.ts
130
+ * @author Evgenii Grebennikov
131
+ * @email djonnyx@gmail.com
132
+ */
133
+ declare enum SnappingMethods {
134
+ /**
135
+ * Normal group rendering.
136
+ */
137
+ NORMAL = "normal",
138
+ /**
139
+ * The group is rendered on a transparent background. List items below the group are not rendered.
140
+ */
141
+ ADVANCED = "advanced"
142
+ }
143
+
144
+ /**
145
+ * Snapping method.
146
+ * 'normal' - Normal group rendering.
147
+ * 'advanced' - The group is rendered on a transparent background. List items below the group are not rendered.
148
+ * @link https://github.com/DjonnyX/ng-virtual-list/blob/20.x/projects/ng-virtual-list/src/lib/enums/snapping-method.ts
149
+ * @author Evgenii Grebennikov
150
+ * @email djonnyx@gmail.com
151
+ */
152
+ type SnappingMethod = SnappingMethods | 'normal' | 'advanced';
153
+
154
+ /**
155
+ * Focus Alignments.
156
+ * @link https://github.com/DjonnyX/ng-virtual-list/blob/20.x/projects/ng-virtual-list/src/lib/enums/focus-alignments.ts
157
+ * @author Evgenii Grebennikov
158
+ * @email djonnyx@gmail.com
159
+ */
160
+ declare enum FocusAlignments {
161
+ NONE = "none",
162
+ START = "start",
163
+ CENTER = "center",
164
+ END = "end"
165
+ }
166
+
167
+ /**
168
+ * Focus Alignment
169
+ * @link https://github.com/DjonnyX/ng-virtual-list/blob/20.x/projects/ng-virtual-list/src/lib/types/focus-alignment.ts
170
+ * @author Evgenii Grebennikov
171
+ * @email djonnyx@gmail.com
172
+ */
173
+ type FocusAlignment = FocusAlignments | 'none' | 'start' | 'center' | 'end';
174
+
48
175
  /**
49
176
  * Virtual list element model
50
177
  * @link https://github.com/DjonnyX/ng-virtual-list/blob/20.x/projects/ng-virtual-list/src/lib/models/item.model.ts
@@ -286,6 +413,54 @@ interface IVirtualListItemConfigMap {
286
413
  interface IVirtualListCollection<E = Object> extends Array<IVirtualListItem<E>> {
287
414
  }
288
415
 
416
+ /**
417
+ * Display object configuration. A set of `select`, `collapse`, and `focus` methods are also provided.
418
+ * @link https://github.com/DjonnyX/ng-virtual-list/blob/20.x/projects/ng-virtual-list/src/lib/models/display-object-config.model.ts
419
+ * @author Evgenii Grebennikov
420
+ * @email djonnyx@gmail.com
421
+ */
422
+ interface IDisplayObjectConfig extends IRenderVirtualListItemConfig {
423
+ /**
424
+ * Determines whether the element has focused or not.
425
+ */
426
+ focused: boolean;
427
+ /**
428
+ * Determines whether the element is selected or not.
429
+ */
430
+ selected: boolean;
431
+ /**
432
+ * Determines whether the element is collapsed or not.
433
+ */
434
+ collapsed: boolean;
435
+ /**
436
+ * Focus a list item
437
+ */
438
+ focus: () => void;
439
+ /**
440
+ * Selects a list item
441
+ * @param selected - If the value is undefined, then the toggle method is executed, if false or true, then the selection/deselection is performed.
442
+ */
443
+ select: (selected: boolean | undefined) => void;
444
+ /**
445
+ * Collapse list items
446
+ * @param collapsed - If the value is undefined, then the toggle method is executed, if false or true, then the collapse/expand is performed.
447
+ */
448
+ collapse: (collapsed: boolean | undefined) => void;
449
+ }
450
+
451
+ /**
452
+ * Display object metrics.
453
+ * @link https://github.com/DjonnyX/ng-virtual-list/blob/20.x/projects/ng-virtual-list/src/lib/models/display-object-measures.model.ts
454
+ * @author Evgenii Grebennikov
455
+ * @email djonnyx@gmail.com
456
+ */
457
+ interface IDisplayObjectMeasures extends IRect {
458
+ /**
459
+ * Delta is calculated for Snapping Method.ADVANCED
460
+ */
461
+ delta: number;
462
+ }
463
+
289
464
  type TEventHandler = (...args: Array<any>) => void;
290
465
  /**
291
466
  * Simple event emitter
@@ -421,112 +596,6 @@ declare class Tracker<C extends BaseVirtualListItemComponent = any> {
421
596
  dispose(): void;
422
597
  }
423
598
 
424
- /**
425
- * Action modes for collection elements.
426
- * @link https://github.com/DjonnyX/ng-virtual-list/blob/20.x/projects/ng-virtual-list/src/lib/enums/collection-modes.ts
427
- * @author Evgenii Grebennikov
428
- * @email djonnyx@gmail.com
429
- */
430
- declare enum CollectionModes {
431
- /**
432
- * When adding elements to the beginning of the collection, the scroll remains at the current position.
433
- */
434
- NORMAL = "normal",
435
- /**
436
- * When adding elements to the beginning of the collection, the scroll is shifted by the sum of the sizes of the new elements.
437
- */
438
- LAZY = "lazy"
439
- }
440
-
441
- /**
442
- * Action modes for collection elements.
443
- * @link https://github.com/DjonnyX/ng-virtual-list/blob/20.x/projects/ng-virtual-list/src/lib/enums/collection-mode.ts
444
- * @author Evgenii Grebennikov
445
- * @email djonnyx@gmail.com
446
- */
447
- type CollectionMode = CollectionModes | 'normal' | 'lazy';
448
-
449
- /**
450
- * Axis of the arrangement of virtual list elements.
451
- * @link https://github.com/DjonnyX/ng-virtual-list/blob/20.x/projects/ng-virtual-list/src/lib/enums/directions.ts
452
- * @author Evgenii Grebennikov
453
- * @email djonnyx@gmail.com
454
- */
455
- declare enum Directions {
456
- /**
457
- * Horizontal axis.
458
- */
459
- HORIZONTAL = "horizontal",
460
- /**
461
- * Vertical axis.
462
- */
463
- VERTICAL = "vertical"
464
- }
465
-
466
- /**
467
- * Axis of the arrangement of virtual list elements.
468
- * @link https://github.com/DjonnyX/ng-virtual-list/blob/20.x/projects/ng-virtual-list/src/lib/enums/direction.ts
469
- * @author Evgenii Grebennikov
470
- * @email djonnyx@gmail.com
471
- */
472
- type Direction = Directions | 'horizontal' | 'vertical';
473
-
474
- /**
475
- * Methods for selecting list items.
476
- * @link https://github.com/DjonnyX/ng-virtual-list/blob/20.x/projects/ng-virtual-list/src/lib/enums/methods-for-selecting.ts
477
- * @author Evgenii Grebennikov
478
- * @email djonnyx@gmail.com
479
- */
480
- declare enum MethodsForSelecting {
481
- /**
482
- * List items are not selectable.
483
- */
484
- NONE = "none",
485
- /**
486
- * List items are selected one by one.
487
- */
488
- SELECT = "select",
489
- /**
490
- * Multiple selection of list items.
491
- */
492
- MULTI_SELECT = "multi-select"
493
- }
494
-
495
- /**
496
- * Methods for selecting list items.
497
- * @link https://github.com/DjonnyX/ng-virtual-list/blob/20.x/projects/ng-virtual-list/src/lib/enums/method-for-selecting.ts
498
- * @author Evgenii Grebennikov
499
- * @email djonnyx@gmail.com
500
- */
501
- type MethodForSelecting = MethodsForSelecting | 'none' | 'select' | 'multi-select';
502
-
503
- /**
504
- * Snapping method.
505
- * @link https://github.com/DjonnyX/ng-virtual-list/blob/20.x/projects/ng-virtual-list/src/lib/enums/snapping-method.ts
506
- * @author Evgenii Grebennikov
507
- * @email djonnyx@gmail.com
508
- */
509
- declare enum SnappingMethods {
510
- /**
511
- * Normal group rendering.
512
- */
513
- NORMAL = "normal",
514
- /**
515
- * The group is rendered on a transparent background. List items below the group are not rendered.
516
- */
517
- ADVANCED = "advanced"
518
- }
519
-
520
- /**
521
- * Snapping method.
522
- * 'normal' - Normal group rendering.
523
- * 'advanced' - The group is rendered on a transparent background. List items below the group are not rendered.
524
- * @link https://github.com/DjonnyX/ng-virtual-list/blob/20.x/projects/ng-virtual-list/src/lib/enums/snapping-method.ts
525
- * @author Evgenii Grebennikov
526
- * @email djonnyx@gmail.com
527
- */
528
- type SnappingMethod = SnappingMethods | 'normal' | 'advanced';
529
-
530
599
  declare const WIDTH_PROP_NAME = "width";
531
600
  declare const HEIGHT_PROP_NAME = "height";
532
601
 
@@ -778,7 +847,11 @@ declare class NgVirtualListService {
778
847
  collapseByClick: boolean;
779
848
  private _trackBox;
780
849
  listElement: HTMLDivElement | null;
781
- collection: IRenderVirtualListCollection;
850
+ private _$displayItems;
851
+ readonly $displayItems: rxjs.Observable<IRenderVirtualListCollection>;
852
+ private _collection;
853
+ set collection(v: IRenderVirtualListCollection);
854
+ get collection(): IRenderVirtualListCollection;
782
855
  constructor();
783
856
  setSelectedIds(ids: Array<Id> | Id | undefined): void;
784
857
  setCollapsedIds(ids: Array<Id>): void;
@@ -796,8 +869,8 @@ declare class NgVirtualListService {
796
869
  * @param collapsed - If the value is undefined, then the toggle method is executed, if false or true, then the collapse/expand is performed.
797
870
  */
798
871
  collapse(data: IRenderVirtualListItem | undefined, collapsed?: boolean | undefined): void;
799
- itemToFocus: ((element: HTMLElement, position: number) => void) | undefined;
800
- focus(element: HTMLElement): void;
872
+ itemToFocus: ((element: HTMLElement, position: number, align: FocusAlignment) => void) | undefined;
873
+ focus(element: HTMLElement, align?: FocusAlignment): void;
801
874
  areaFocus(id: Id | null): void;
802
875
  initialize(trackBox: TrackBox): void;
803
876
  generateComponentId(): number;
@@ -805,30 +878,6 @@ declare class NgVirtualListService {
805
878
  static ɵprov: _angular_core.ɵɵInjectableDeclaration<NgVirtualListService>;
806
879
  }
807
880
 
808
- interface IItemConfig extends IRenderVirtualListItemConfig {
809
- /**
810
- * Determines whether the element has focus or not.
811
- */
812
- focus: boolean;
813
- /**
814
- * Determines whether the element is selected or not.
815
- */
816
- selected: boolean;
817
- /**
818
- * Determines whether the element is collapsed or not.
819
- */
820
- collapsed: boolean;
821
- /**
822
- * Selects a list item
823
- * @param selected - If the value is undefined, then the toggle method is executed, if false or true, then the selection/deselection is performed.
824
- */
825
- select: (selected: boolean | undefined) => void;
826
- /**
827
- * Collapse list items
828
- * @param collapsed - If the value is undefined, then the toggle method is executed, if false or true, then the collapse/expand is performed.
829
- */
830
- collapse: (collapsed: boolean | undefined) => void;
831
- }
832
881
  /**
833
882
  * Virtual list item component
834
883
  * @link https://github.com/DjonnyX/ng-virtual-list/blob/20.x/projects/ng-virtual-list/src/lib/components/ng-virtual-list-item.component.ts
@@ -841,14 +890,9 @@ declare class NgVirtualListItemComponent extends BaseVirtualListItemComponent {
841
890
  protected _service: NgVirtualListService;
842
891
  private _isSelected;
843
892
  private _isCollapsed;
844
- config: _angular_core.WritableSignal<IItemConfig>;
845
- measures: _angular_core.WritableSignal<(IRect & {
846
- /**
847
- * Delta is calculated for Snapping Method.ADVANCED
848
- */
849
- delta: number;
850
- }) | undefined>;
851
- focus: _angular_core.WritableSignal<boolean>;
893
+ config: _angular_core.WritableSignal<IDisplayObjectConfig>;
894
+ measures: _angular_core.WritableSignal<IDisplayObjectMeasures | undefined>;
895
+ focused: _angular_core.WritableSignal<boolean>;
852
896
  part: _angular_core.WritableSignal<string>;
853
897
  regular: boolean;
854
898
  data: _angular_core.WritableSignal<IRenderVirtualListItem<any> | undefined>;
@@ -864,9 +908,11 @@ declare class NgVirtualListItemComponent extends BaseVirtualListItemComponent {
864
908
  get element(): HTMLElement;
865
909
  private _selectHandler;
866
910
  private _collapseHandler;
911
+ private _focusHandler;
867
912
  constructor();
868
913
  private focusNext;
869
914
  private focusPrev;
915
+ private focus;
870
916
  private updateMeasures;
871
917
  private updateConfig;
872
918
  private update;
@@ -1043,6 +1089,15 @@ declare class NgVirtualListComponent implements AfterViewInit, OnInit, OnDestroy
1043
1089
  * The name of the property by which tracking is performed
1044
1090
  */
1045
1091
  trackBy: _angular_core.InputSignal<string>;
1092
+ private _screenReaderMessageOptions;
1093
+ /**
1094
+ * Message for screen reader.
1095
+ * The message format is: "some text $1 some text $2",
1096
+ * where $1 is the number of the first element of the screen collection,
1097
+ * $2 is the number of the last element of the screen collection.
1098
+ */
1099
+ screenReaderMessage: _angular_core.InputSignal<string>;
1100
+ readonly screenReaderFormattedMessage: WritableSignal<string>;
1046
1101
  private _isNotSelecting;
1047
1102
  get isNotSelecting(): boolean;
1048
1103
  private _isSingleSelecting;
@@ -1111,6 +1166,10 @@ declare class NgVirtualListComponent implements AfterViewInit, OnInit, OnDestroy
1111
1166
  * Returns the bounds of an element with a given id
1112
1167
  */
1113
1168
  getItemBounds(id: Id): ISize | undefined;
1169
+ /**
1170
+ * Focus an list item by a given id.
1171
+ */
1172
+ focus(id: Id, align?: FocusAlignment): void;
1114
1173
  /**
1115
1174
  * The method scrolls the list to the element with the given id and returns the value of the scrolled area.
1116
1175
  * Behavior accepts the values ​​"auto", "instant" and "smooth".
@@ -1130,7 +1189,7 @@ declare class NgVirtualListComponent implements AfterViewInit, OnInit, OnDestroy
1130
1189
  ngOnDestroy(): void;
1131
1190
  private dispose;
1132
1191
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<NgVirtualListComponent, never>;
1133
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgVirtualListComponent, "ng-virtual-list", never, { "items": { "alias": "items"; "required": true; "isSignal": true; }; "selectedIds": { "alias": "selectedIds"; "required": false; "isSignal": true; }; "collapsedIds": { "alias": "collapsedIds"; "required": false; "isSignal": true; }; "selectByClick": { "alias": "selectByClick"; "required": false; "isSignal": true; }; "collapseByClick": { "alias": "collapseByClick"; "required": false; "isSignal": true; }; "snap": { "alias": "snap"; "required": false; "isSignal": true; }; "enabledBufferOptimization": { "alias": "enabledBufferOptimization"; "required": false; "isSignal": true; }; "itemRenderer": { "alias": "itemRenderer"; "required": true; "isSignal": true; }; "itemConfigMap": { "alias": "itemConfigMap"; "required": false; "isSignal": true; }; "itemSize": { "alias": "itemSize"; "required": false; "isSignal": true; }; "dynamicSize": { "alias": "dynamicSize"; "required": false; "isSignal": true; }; "direction": { "alias": "direction"; "required": false; "isSignal": true; }; "collectionMode": { "alias": "collectionMode"; "required": false; "isSignal": true; }; "bufferSize": { "alias": "bufferSize"; "required": false; "isSignal": true; }; "maxBufferSize": { "alias": "maxBufferSize"; "required": false; "isSignal": true; }; "snappingMethod": { "alias": "snappingMethod"; "required": false; "isSignal": true; }; "methodForSelecting": { "alias": "methodForSelecting"; "required": false; "isSignal": true; }; "trackBy": { "alias": "trackBy"; "required": false; "isSignal": true; }; }, { "onScroll": "onScroll"; "onScrollEnd": "onScrollEnd"; "onViewportChange": "onViewportChange"; "onItemClick": "onItemClick"; "onSelect": "onSelect"; "onCollapse": "onCollapse"; "onScrollReachStart": "onScrollReachStart"; "onScrollReachEnd": "onScrollReachEnd"; }, never, never, true, never>;
1192
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<NgVirtualListComponent, "ng-virtual-list", never, { "items": { "alias": "items"; "required": true; "isSignal": true; }; "selectedIds": { "alias": "selectedIds"; "required": false; "isSignal": true; }; "collapsedIds": { "alias": "collapsedIds"; "required": false; "isSignal": true; }; "selectByClick": { "alias": "selectByClick"; "required": false; "isSignal": true; }; "collapseByClick": { "alias": "collapseByClick"; "required": false; "isSignal": true; }; "snap": { "alias": "snap"; "required": false; "isSignal": true; }; "enabledBufferOptimization": { "alias": "enabledBufferOptimization"; "required": false; "isSignal": true; }; "itemRenderer": { "alias": "itemRenderer"; "required": true; "isSignal": true; }; "itemConfigMap": { "alias": "itemConfigMap"; "required": false; "isSignal": true; }; "itemSize": { "alias": "itemSize"; "required": false; "isSignal": true; }; "dynamicSize": { "alias": "dynamicSize"; "required": false; "isSignal": true; }; "direction": { "alias": "direction"; "required": false; "isSignal": true; }; "collectionMode": { "alias": "collectionMode"; "required": false; "isSignal": true; }; "bufferSize": { "alias": "bufferSize"; "required": false; "isSignal": true; }; "maxBufferSize": { "alias": "maxBufferSize"; "required": false; "isSignal": true; }; "snappingMethod": { "alias": "snappingMethod"; "required": false; "isSignal": true; }; "methodForSelecting": { "alias": "methodForSelecting"; "required": false; "isSignal": true; }; "trackBy": { "alias": "trackBy"; "required": false; "isSignal": true; }; "screenReaderMessage": { "alias": "screenReaderMessage"; "required": false; "isSignal": true; }; }, { "onScroll": "onScroll"; "onScrollEnd": "onScrollEnd"; "onViewportChange": "onViewportChange"; "onItemClick": "onItemClick"; "onSelect": "onSelect"; "onCollapse": "onCollapse"; "onScrollReachStart": "onScrollReachStart"; "onScrollReachEnd": "onScrollReachEnd"; }, never, never, true, never>;
1134
1193
  }
1135
1194
 
1136
1195
  /**
@@ -1196,5 +1255,5 @@ declare class ScrollEvent implements IScrollEvent {
1196
1255
  constructor(params: IScrollEventParams);
1197
1256
  }
1198
1257
 
1199
- export { CollectionModes, Directions, MethodsForSelecting, NgVirtualListComponent, NgVirtualListItemComponent, ScrollEvent, SnappingMethods, debounce, toggleClassName };
1200
- export type { CollectionMode, Direction, IMetrics, IRect, IRenderVirtualListItem, IScrollEvent, ISize, IVirtualListCollection, IVirtualListItem, IVirtualListItemConfigMap, Id, MethodForSelecting, ScrollDirection, SnappingMethod };
1258
+ export { CollectionModes, Directions, FocusAlignments, MethodsForSelecting, NgVirtualListComponent, NgVirtualListItemComponent, ScrollEvent, SnappingMethods, debounce, toggleClassName };
1259
+ export type { CollectionMode, Direction, FocusAlignment, IDisplayObjectConfig, IDisplayObjectMeasures, IMetrics, IRect, IRenderVirtualListItem, IScrollEvent, ISize, IVirtualListCollection, IVirtualListItem, IVirtualListItemConfigMap, Id, MethodForSelecting, ScrollDirection, SnappingMethod };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ng-virtual-list",
3
- "version": "20.7.13",
3
+ "version": "20.7.15",
4
4
  "author": {
5
5
  "name": "Evgenii Grebennikov",
6
6
  "email": "djonnyx@gmail.com"