Fixed #2373 - Improve VirtualScroller component

primefaces · Oct 31, 2021 · b7ee21d · b7ee21d
1 parent d46700a
commit b7ee21d
Show file tree

Hide file tree

Showing 7 changed files with 299 additions and 157 deletions.
diff --git a/src/components/autocomplete/AutoCompletePanel.js b/src/components/autocomplete/AutoCompletePanel.js
@@ -72,7 +72,7 @@ class AutoCompletePanelComponent extends Component {
                     const className = classNames('p-autocomplete-items', options.className);
 
                     return (
-                        <ul ref={options.ref} className={className} role="listbox" id={this.props.listId}>
+                        <ul ref={options.contentRef} className={className} role="listbox" id={this.props.listId}>
                             {options.children}
                         </ul>
                     );

diff --git a/src/components/dropdown/DropdownPanel.js b/src/components/dropdown/DropdownPanel.js
@@ -147,7 +147,7 @@ class DropdownPanelComponent extends Component {
                     const content = this.isEmptyFilter() ? this.renderEmptyMessage() : options.children;
 
                     return (
-                        <ul ref={options.ref} className={className} role="listbox">
+                        <ul ref={options.contentRef} className={className} role="listbox">
                             {content}
                         </ul>
                     );

diff --git a/src/components/listbox/ListBox.js b/src/components/listbox/ListBox.js
@@ -407,7 +407,7 @@ export class ListBox extends Component {
                     const className = classNames('p-listbox-list', options.className);
 
                     return (
-                        <ul ref={options.ref} className={className} role="listbox" aria-multiselectable={this.props.multiple}>
+                        <ul ref={options.contentRef} className={className} role="listbox" aria-multiselectable={this.props.multiple}>
                             {options.children}
                         </ul>
                     );

diff --git a/src/components/multiselect/MultiSelectPanel.js b/src/components/multiselect/MultiSelectPanel.js
@@ -137,7 +137,7 @@ class MultiSelectPanelComponent extends Component {
                     const content = this.isEmptyFilter() ? this.renderEmptyFilter() : options.children;
 
                     return (
-                        <ul ref={options.ref} className={className} role="listbox" aria-multiselectable>
+                        <ul ref={options.contentRef} className={className} role="listbox" aria-multiselectable>
                             {content}
                         </ul>
                     );

diff --git a/src/components/virtualscroller/VirtualScroller.d.ts b/src/components/virtualscroller/VirtualScroller.d.ts
@@ -54,30 +54,37 @@ interface VirtualScrollerTemplateOptions {
 
 interface VirtualScrollerLoadingTemplateOptions extends VirtualScrollerTemplateOptions {
     numCols: number;
+    [key: string]: any;
 }
 
 interface VirtualScrollerContentTemplateOptions {
     className: string;
-    ref: any;
+    contentRef: any;
+    spacerRef: any;
+    stickyRef: any;
+    items: VirtualScrollerItemsType;
+    getItemOptions(index: number): VirtualScrollerTemplateOptions;
     children: any;
     element: JSX.Element;
     props: VirtualScrollerProps;
     loading: boolean;
-    first: number;
-    last: number;
+    getLoaderOptions(index: number, ext?: object): VirtualScrollerLoadingTemplateOptions;
+    loadingTemplate: VirtualScrollerLoadingTemplateType;
+    itemSize: VirtualScrollerItemSizeType;
+    rows: any[];
+    columns: any[];
+    vertical: boolean;
+    horizontal: boolean;
+    both: boolean;
 }
 
 interface VirtualScrollerChangeParams {
-    first: VirtualScrollerStateType;
-    numItems: VirtualScrollerStateType;
-}
-
-interface VirtualScrollerLazyParams {
     first: VirtualScrollerStateType;
     last: VirtualScrollerStateType;
-    [key: string]: any;
 }
 
+interface VirtualScrollerLazyParams extends VirtualScrollerChangeParams {}
+
 export interface VirtualScrollerProps {
     id?: string;
     style?: object;
@@ -90,6 +97,11 @@ export interface VirtualScrollerProps {
     numToleratedItems?: number;
     delay?: number;
     lazy?: boolean;
+    disabled?: boolean;
+    loaderDisabled?: boolean;
+    columns?: any;
+    loading?: boolean;
+    showSpacer?: boolean;
     showLoader?: boolean;
     loadingTemplate?: VirtualScrollerLoadingTemplateType;
     itemTemplate?: VirtualScrollerItemTemplateType;