ng-virtual-list 18.7.13 → 18.7.15

package/lib/components/ng-virtual-list-item.component.d.ts

@@ -1,34 +1,10 @@
 import { TemplateRef } from '@angular/core';
 import { IRenderVirtualListItem } from '../models/render-item.model';
-import { Id, IRect, ISize } from '../types';
+import { Id, ISize } from '../types';
 import { BaseVirtualListItemComponent } from '../models/base-virtual-list-item-component';
 import { NgVirtualListService } from '../ng-virtual-list.service';
-import { IRenderVirtualListItemConfig } from '../models/render-item-config.model';
+import { IDisplayObjectConfig, IDisplayObjectMeasures } from '../models';
 import * as i0 from "@angular/core";
-interface IItemConfig extends IRenderVirtualListItemConfig {
-    /**
-     * Determines whether the element has focus or not.
-     */
-    focus: boolean;
-    /**
-     * Determines whether the element is selected or not.
-     */
-    selected: boolean;
-    /**
-     * Determines whether the element is collapsed or not.
-     */
-    collapsed: boolean;
-    /**
-      * Selects a list item
-      * @param selected - If the value is undefined, then the toggle method is executed, if false or true, then the selection/deselection is performed.
-      */
-    select: (selected: boolean | undefined) => void;
-    /**
-      * Collapse list items
-      * @param collapsed - If the value is undefined, then the toggle method is executed, if false or true, then the collapse/expand is performed.
-      */
-    collapse: (collapsed: boolean | undefined) => void;
-}
 /**
  * Virtual list item component
  * @link https://github.com/DjonnyX/ng-virtual-list/blob/18.x/projects/ng-virtual-list/src/lib/components/ng-virtual-list-item.component.ts
@@ -42,14 +18,9 @@ export declare class NgVirtualListItemComponent extends BaseVirtualListItemCompo
     protected _service: NgVirtualListService;
     private _isSelected;
     private _isCollapsed;
-    config: import("@angular/core").WritableSignal<IItemConfig>;
-    measures: import("@angular/core").WritableSignal<(IRect & {
-        /**
-         * Delta is calculated for Snapping Method.ADVANCED
-         */
-        delta: number;
-    }) | undefined>;
-    focus: import("@angular/core").WritableSignal<boolean>;
+    config: import("@angular/core").WritableSignal<IDisplayObjectConfig>;
+    measures: import("@angular/core").WritableSignal<IDisplayObjectMeasures | undefined>;
+    focused: import("@angular/core").WritableSignal<boolean>;
     part: import("@angular/core").WritableSignal<string>;
     regular: boolean;
     data: import("@angular/core").WritableSignal<IRenderVirtualListItem<any> | undefined>;
@@ -65,9 +36,11 @@ export declare class NgVirtualListItemComponent extends BaseVirtualListItemCompo
     get element(): HTMLElement;
     private _selectHandler;
     private _collapseHandler;
+    private _focusHandler;
     constructor();
     private focusNext;
     private focusPrev;
+    private focus;
     private updateMeasures;
     private updateConfig;
     private update;
@@ -79,4 +52,3 @@ export declare class NgVirtualListItemComponent extends BaseVirtualListItemCompo
     static ɵfac: i0.ɵɵFactoryDeclaration<NgVirtualListItemComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<NgVirtualListItemComponent, "ng-virtual-list-item", never, {}, {}, never, never, false, never>;
 }
-export {};

package/lib/const/index.d.ts

@@ -16,6 +16,7 @@ export declare const DISPLAY_OBJECTS_LENGTH_MESUREMENT_ERROR = 1;
 export declare const MAX_SCROLL_TO_ITERATIONS = 5;
 export declare const DEFAULT_SNAPPING_METHOD = SnappingMethods.NORMAL;
 export declare const DEFAULT_SELECT_METHOD = MethodsForSelecting.NONE;
+export declare const DEFAULT_SCREEN_READER_MESSAGE = "Showing items $1 to $2";
 export declare const BEHAVIOR_AUTO = "auto";
 export declare const BEHAVIOR_INSTANT = "instant";
 export declare const BEHAVIOR_SMOOTH = "smooth";

package/lib/enums/focus-alignments.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Focus Alignments.
+ * @link https://github.com/DjonnyX/ng-virtual-list/blob/18.x/projects/ng-virtual-list/src/lib/enums/focus-alignments.ts
+ * @author Evgenii Grebennikov
+ * @email djonnyx@gmail.com
+ */
+export declare enum FocusAlignments {
+    NONE = "none",
+    START = "start",
+    CENTER = "center",
+    END = "end"
+}

package/lib/enums/index.d.ts

@@ -6,5 +6,6 @@ import { MethodsForSelecting } from "./methods-for-selecting";
 import { MethodForSelecting } from "./method-for-selecting";
 import { SnappingMethods } from "./snapping-methods";
 import { SnappingMethod } from "./snapping-method";
-export { CollectionModes, Directions, MethodsForSelecting, SnappingMethods, };
+import { FocusAlignments } from "./focus-alignments";
+export { CollectionModes, Directions, MethodsForSelecting, SnappingMethods, FocusAlignments, };
 export type { CollectionMode, Direction, MethodForSelecting, SnappingMethod, };

package/lib/models/display-object-config.model.d.ts

@@ -0,0 +1,35 @@
+import { IRenderVirtualListItemConfig } from "./render-item-config.model";
+/**
+ * Display object configuration. A set of `select`, `collapse`, and `focus` methods are also provided.
+ * @link https://github.com/DjonnyX/ng-virtual-list/blob/18.x/projects/ng-virtual-list/src/lib/models/display-object-config.model.ts
+ * @author Evgenii Grebennikov
+ * @email djonnyx@gmail.com
+ */
+export interface IDisplayObjectConfig extends IRenderVirtualListItemConfig {
+    /**
+     * Determines whether the element has focused or not.
+     */
+    focused: boolean;
+    /**
+     * Determines whether the element is selected or not.
+     */
+    selected: boolean;
+    /**
+     * Determines whether the element is collapsed or not.
+     */
+    collapsed: boolean;
+    /**
+      * Focus a list item
+      */
+    focus: () => void;
+    /**
+      * Selects a list item
+      * @param selected - If the value is undefined, then the toggle method is executed, if false or true, then the selection/deselection is performed.
+      */
+    select: (selected: boolean | undefined) => void;
+    /**
+      * Collapse list items
+      * @param collapsed - If the value is undefined, then the toggle method is executed, if false or true, then the collapse/expand is performed.
+      */
+    collapse: (collapsed: boolean | undefined) => void;
+}

package/lib/models/display-object-measures.model.d.ts

@@ -0,0 +1,13 @@
+import { IRect } from "../types";
+/**
+ * Display object metrics.
+ * @link https://github.com/DjonnyX/ng-virtual-list/blob/18.x/projects/ng-virtual-list/src/lib/models/display-object-measures.model.ts
+ * @author Evgenii Grebennikov
+ * @email djonnyx@gmail.com
+ */
+export interface IDisplayObjectMeasures extends IRect {
+    /**
+     * Delta is calculated for Snapping Method.ADVANCED
+     */
+    delta: number;
+}

package/lib/models/index.d.ts

@@ -4,4 +4,6 @@ import { IVirtualListItem } from './item.model';
 import { IVirtualListItemConfigMap } from './item-config-map.model';
 import { IVirtualListCollection } from './collection.model';
 import { IRenderVirtualListItem } from './render-item.model';
-export type { ScrollDirection, IScrollEvent, IVirtualListItem, IVirtualListItemConfigMap, IVirtualListCollection, IRenderVirtualListItem, };
+import { IDisplayObjectConfig } from './display-object-config.model';
+import { IDisplayObjectMeasures } from './display-object-measures.model';
+export type { IDisplayObjectConfig, IDisplayObjectMeasures, IScrollEvent, IVirtualListItem, IVirtualListItemConfigMap, IVirtualListCollection, IRenderVirtualListItem, ScrollDirection, };

package/lib/ng-virtual-list.component.d.ts

@@ -1,7 +1,7 @@
 import { AfterViewInit, OnDestroy, OnInit, TemplateRef, WritableSignal } from '@angular/core';
 import { Observable } from 'rxjs';
 import { IRenderVirtualListItem, IScrollEvent, IVirtualListCollection, IVirtualListItemConfigMap } from './models';
-import { Id, ISize } from './types';
+import { FocusAlignment, Id, ISize } from './types';
 import { CollectionMode, Direction, Directions, MethodForSelecting, SnappingMethod } from './enums';
 import * as i0 from "@angular/core";
 /**
@@ -168,6 +168,15 @@ export declare class NgVirtualListComponent implements AfterViewInit, OnInit, On
      * The name of the property by which tracking is performed
      */
     trackBy: import("@angular/core").InputSignal<string>;
+    private _screenReaderMessageOptions;
+    /**
+     * Message for screen reader.
+     * The message format is: "some text $1 some text $2",
+     * where $1 is the number of the first element of the screen collection,
+     * $2 is the number of the last element of the screen collection.
+     */
+    screenReaderMessage: import("@angular/core").InputSignal<string>;
+    readonly screenReaderFormattedMessage: WritableSignal<string>;
     private _isNotSelecting;
     get isNotSelecting(): boolean;
     private _isSingleSelecting;
@@ -236,6 +245,10 @@ export declare class NgVirtualListComponent implements AfterViewInit, OnInit, On
      * Returns the bounds of an element with a given id
      */
     getItemBounds(id: Id): ISize | undefined;
+    /**
+     * Focus an list item by a given id.
+     */
+    focus(id: Id, align?: FocusAlignment): void;
     /**
      * The method scrolls the list to the element with the given id and returns the value of the scrolled area.
      * Behavior accepts the values ​​"auto", "instant" and "smooth".
@@ -255,5 +268,5 @@ export declare class NgVirtualListComponent implements AfterViewInit, OnInit, On
     ngOnDestroy(): void;
     private dispose;
     static ɵfac: i0.ɵɵFactoryDeclaration<NgVirtualListComponent, never>;
-    static ɵcmp: i0.ɵɵ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, false, never>;
+    static ɵcmp: i0.ɵɵ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, false, never>;
 }

package/lib/ng-virtual-list.service.d.ts

@@ -1,8 +1,8 @@
 import { TrackBox } from './utils/trackBox';
 import { IRenderVirtualListItem } from './models';
-import { Id } from './types';
-import { MethodsForSelectingTypes } from './enums/method-for-selecting-types';
 import { IRenderVirtualListCollection } from './models/render-collection.model';
+import { MethodsForSelectingTypes } from './enums/method-for-selecting-types';
+import { FocusAlignment, Id } from './types';
 import * as i0 from "@angular/core";
 export declare class NgVirtualListService {
     private _nextComponentId;
@@ -22,7 +22,11 @@ export declare class NgVirtualListService {
     collapseByClick: boolean;
     private _trackBox;
     listElement: HTMLDivElement | null;
-    collection: IRenderVirtualListCollection;
+    private _$displayItems;
+    readonly $displayItems: import("rxjs").Observable<IRenderVirtualListCollection>;
+    private _collection;
+    set collection(v: IRenderVirtualListCollection);
+    get collection(): IRenderVirtualListCollection;
     constructor();
     setSelectedIds(ids: Array<Id> | Id | undefined): void;
     setCollapsedIds(ids: Array<Id>): void;
@@ -40,8 +44,8 @@ export declare class NgVirtualListService {
       * @param collapsed - If the value is undefined, then the toggle method is executed, if false or true, then the collapse/expand is performed.
       */
     collapse(data: IRenderVirtualListItem | undefined, collapsed?: boolean | undefined): void;
-    itemToFocus: ((element: HTMLElement, position: number) => void) | undefined;
-    focus(element: HTMLElement): void;
+    itemToFocus: ((element: HTMLElement, position: number, align: FocusAlignment) => void) | undefined;
+    focus(element: HTMLElement, align?: FocusAlignment): void;
     areaFocus(id: Id | null): void;
     initialize(trackBox: TrackBox): void;
     generateComponentId(): number;

package/lib/types/focus-alignment.d.ts

@@ -0,0 +1,8 @@
+import { FocusAlignments } from "../enums";
+/**
+ * Focus Alignment
+ * @link https://github.com/DjonnyX/ng-virtual-list/blob/18.x/projects/ng-virtual-list/src/lib/types/focus-alignment.ts
+ * @author Evgenii Grebennikov
+ * @email djonnyx@gmail.com
+ */
+export type FocusAlignment = FocusAlignments | 'none' | 'start' | 'center' | 'end';

package/lib/types/index.d.ts

@@ -1,4 +1,5 @@
 import { Id } from './id';
 import { ISize } from './size';
 import { IRect } from './rect';
-export type { Id, ISize, IRect, };
+import { FocusAlignment } from './focus-alignment';
+export type { Id, ISize, IRect, FocusAlignment, };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ng-virtual-list",
-  "version": "18.7.13",
+  "version": "18.7.15",
   "author": {
     "name": "Evgenii Grebennikov",
     "email": "djonnyx@gmail.com"