@acorex/components 22.4.30 → 22.4.31

package/lookup/README.md

@@ -1,6 +1,6 @@
 # @acorex/components/lookup
 
-An advanced drop-down (lookup) component with six modes, `AXDataSource` support, and virtual scrolling.
+An advanced drop-down (lookup) component with six modes, `AXDataSource` support, virtual scrolling, and sequential infinite scroll for remote lists.
 
 ## Modes
 
@@ -56,7 +56,7 @@ import { AXDataSource } from '@acorex/cdk/common';
 
 Value binding uses the signal `value` model (`FormValueControl`) — prefer `[(ngModel)]` (or `[(value)]` / signal forms). No `ControlValueAccessor`.
 
-- `dataSource`: `AXDataSource` or a plain array (list and multi-column modes). Supports remote paging, `byKey` value resolution, and server-side filtering. Also used by `multi-column-tree` when `treeDataSource` is not set (hierarchical load via `treeParentField`).
+- `dataSource`: `AXDataSource` or a plain array (list and multi-column modes). Supports remote paging, `byKey` value resolution, and server-side filtering. In `drop-down-list`, `multi-select`, and `multi-column`, additional pages load on scroll one request at a time: while a page is loading, further scroll events do not start another request; when the request completes, the scroll position is checked again and the next page loads if you are still near the end (or the first page does not fill the viewport). Also used by `multi-column-tree` when `treeDataSource` is not set (hierarchical load via `treeParentField`).
 - `valueItems`: full items that resolve the current `value` key(s) without calling `byKey` (useful when the parent already loaded the selected entity). Missing keys still fall through to `find` / `byKey`. You can also call `seedItems(items)` imperatively.
 - `treeDataSource`: node array or lazy children callback (tree modes, including `multi-column-tree`).
 - `valueField` / `textField` / `disabledField`: field mappings. For tree modes these map to the tree `idField` / `titleField`.
@@ -67,7 +67,7 @@ Value binding uses the signal `value` model (`FormValueControl`) — prefer `[(n
 - `caption`: title shown in the actionsheet header (falls back to `placeholder`).
 - `alternate`: when `true`, list rows use alternating background colors for easier scanning (all modes, including tree).
 - `searchPlaceholder`: placeholder for the multi-select / multi-select-tree trigger search input when chips are already selected.
-- `itemHeight` / `maxVisibleItems`: list virtual-scroll sizing, and multi-column table viewport height (multi-column loads more pages on scroll, not via a pager).
+- `itemHeight` / `maxVisibleItems`: list virtual-scroll sizing (only loaded rows plus an optional loading row are rendered), and multi-column table viewport height (same sequential scroll loading as list modes, not via a pager).
 - `look`: the same editor-container look schemes as other editors like `ax-text-box`.
 - `ax-prefix` / `ax-suffix`: project decorators into the editor container.
 

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "@acorex/components",
-  "version": "22.4.30",
+  "version": "22.4.31",
   "peerDependencies": {
-    "@acorex/core": "22.4.30",
-    "@acorex/cdk": "22.4.30",
+    "@acorex/core": "22.4.31",
+    "@acorex/cdk": "22.4.31",
     "@angular/aria": ">=22.1.0",
     "polytype": ">=0.17.0",
     "hammerjs": ">=2.0.8",

package/types/acorex-components-lookup.d.ts

@@ -1,6 +1,6 @@
 import * as _angular_core from '@angular/core';
 import { TemplateRef, InjectionToken, ElementRef } from '@angular/core';
-import { AXEvent, AXDataSource, AXListDataSource, AXHtmlEvent, NXValueComponent, AXStyleLookType, AXValueChangedEvent, AXFocusEvent, AXItemClickEvent, AXItemSelectedEvent } from '@acorex/cdk/common';
+import { AXEvent, AXDataSource, AXHtmlEvent, NXValueComponent, AXStyleLookType, AXValueChangedEvent, AXFocusEvent, AXItemClickEvent, AXItemSelectedEvent } from '@acorex/cdk/common';
 import { AXPopoverComponent } from '@acorex/components/popover';
 import { AXSearchBoxComponent } from '@acorex/components/search-box';
 import { AXTreeViewDataSource, AXTreeViewSelectionBehavior, AXTreeViewItemTemplateContext, AXTreeViewNode, AXTreeViewSelectionChangeEvent } from '@acorex/components/tree-view';
@@ -71,6 +71,10 @@ interface AXLookupSelectionChangedEvent<TItem = any> extends AXEvent {
 /**
  * Shared `AXDataSource` + CDK virtual scroll plumbing for the list-based lookup views
  * (`ax-lookup-drop-down-list`, `ax-lookup-multi-select`).
+ *
+ * Loads pages sequentially on scroll: only one API request at a time; further scroll
+ * events are ignored until the current request resolves, then the scroll position is
+ * re-checked for the next page.
  */
 declare abstract class AXLookupListViewBase {
     #private;
@@ -141,8 +145,12 @@ declare abstract class AXLookupListViewBase {
      * item, or a printable key that should return focus to the trigger search input).
      */
     navigateOut: _angular_core.OutputEmitterRef<"up" | "typeahead">;
-    /** CDK virtual scroll adapter over the datasource. */
-    protected listDataSource: _angular_core.WritableSignal<AXListDataSource<AXLookupItem>>;
+    /** Rows loaded so far (contiguous from the start of the result set). */
+    protected loadedItems: _angular_core.WritableSignal<AXLookupItem[]>;
+    /** When true, more pages exist and a trailing loading row is shown. */
+    protected hasMore: _angular_core.WritableSignal<boolean>;
+    /** Virtual-scroll data: loaded rows plus an optional `null` loading sentinel. */
+    protected renderedItems: _angular_core.Signal<AXLookupItem[]>;
     protected totalCount: _angular_core.WritableSignal<number>;
     protected isLoading: _angular_core.WritableSignal<boolean>;
     protected isEmpty: _angular_core.Signal<boolean>;