From 0b5ac272efd129edcd3dd70d19b5eece3b672fd2 Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 26 Mar 2024 17:21:39 +0300
Subject: [PATCH] Refactor #5437 - For scrollHeight

---
 components/lib/autocomplete/AutoComplete.d.ts    | 2 +-
 components/lib/autocomplete/BaseAutoComplete.vue | 2 +-
 components/lib/dropdown/BaseDropdown.vue         | 2 +-
 components/lib/dropdown/Dropdown.d.ts            | 2 +-
 components/lib/listbox/BaseListbox.vue           | 4 ++++
 components/lib/listbox/Listbox.d.ts              | 5 +++++
 components/lib/listbox/Listbox.vue               | 4 ++--
 components/lib/multiselect/BaseMultiSelect.vue   | 2 +-
 components/lib/multiselect/MultiSelect.d.ts      | 2 +-
 components/lib/orderlist/BaseOrderList.vue       | 4 ++++
 components/lib/orderlist/OrderList.d.ts          | 5 +++++
 components/lib/orderlist/OrderList.vue           | 1 +
 components/lib/picklist/BasePickList.vue         | 4 ++++
 components/lib/picklist/PickList.d.ts            | 5 +++++
 components/lib/picklist/PickList.vue             | 2 ++
 components/lib/treeselect/BaseTreeSelect.vue     | 2 +-
 components/lib/treeselect/TreeSelect.d.ts        | 4 ++--
 17 files changed, 41 insertions(+), 11 deletions(-)

diff --git a/components/lib/autocomplete/AutoComplete.d.ts b/components/lib/autocomplete/AutoComplete.d.ts
index e2c9dabeb..ab70814cf 100755
--- a/components/lib/autocomplete/AutoComplete.d.ts
+++ b/components/lib/autocomplete/AutoComplete.d.ts
@@ -322,7 +322,7 @@ export interface AutoCompleteProps {
     optionGroupChildren?: string | ((data: any) => any[]) | undefined;
     /**
      * Maximum height of the suggestions panel.
-     * @defaultValue 200px
+     * @defaultValue 14rem
      */
     scrollHeight?: string | undefined;
     /**
diff --git a/components/lib/autocomplete/BaseAutoComplete.vue b/components/lib/autocomplete/BaseAutoComplete.vue
index fd2d60999..1c653e462 100644
--- a/components/lib/autocomplete/BaseAutoComplete.vue
+++ b/components/lib/autocomplete/BaseAutoComplete.vue
@@ -22,7 +22,7 @@ export default {
         optionGroupChildren: null,
         scrollHeight: {
             type: String,
-            default: '200px'
+            default: '14rem'
         },
         dropdown: {
             type: Boolean,
diff --git a/components/lib/dropdown/BaseDropdown.vue b/components/lib/dropdown/BaseDropdown.vue
index 0b59278c1..beb515f91 100644
--- a/components/lib/dropdown/BaseDropdown.vue
+++ b/components/lib/dropdown/BaseDropdown.vue
@@ -15,7 +15,7 @@ export default {
         optionGroupChildren: [String, Function],
         scrollHeight: {
             type: String,
-            default: '200px'
+            default: '14rem'
         },
         filter: Boolean,
         filterPlaceholder: String,
diff --git a/components/lib/dropdown/Dropdown.d.ts b/components/lib/dropdown/Dropdown.d.ts
index 75b742d7f..0de74c673 100755
--- a/components/lib/dropdown/Dropdown.d.ts
+++ b/components/lib/dropdown/Dropdown.d.ts
@@ -302,7 +302,7 @@ export interface DropdownProps {
     optionGroupChildren?: string | ((data: any) => any[]) | undefined;
     /**
      * Height of the viewport, a scrollbar is defined if height of list exceeds this value.
-     * @defaultValue 200px
+     * @defaultValue 14rem
      */
     scrollHeight?: string | undefined;
     /**
diff --git a/components/lib/listbox/BaseListbox.vue b/components/lib/listbox/BaseListbox.vue
index 938966729..7ddf95604 100644
--- a/components/lib/listbox/BaseListbox.vue
+++ b/components/lib/listbox/BaseListbox.vue
@@ -14,6 +14,10 @@ export default {
         optionGroupLabel: null,
         optionGroupChildren: null,
         listStyle: null,
+        scrollHeight: {
+            type: String,
+            default: '14rem'
+        },
         invalid: {
             type: Boolean,
             default: false
diff --git a/components/lib/listbox/Listbox.d.ts b/components/lib/listbox/Listbox.d.ts
index 6bd88800d..8fb241a9e 100755
--- a/components/lib/listbox/Listbox.d.ts
+++ b/components/lib/listbox/Listbox.d.ts
@@ -271,6 +271,11 @@ export interface ListboxProps {
      * Inline style of inner list element.
      */
     listStyle?: string | undefined;
+    /**
+     * Height of the viewport, a scrollbar is defined if height of list exceeds this value.
+     * @defaultValue 14rem
+     */
+    scrollHeight?: string | undefined;
     /**
      * When present, it specifies that the component should have invalid state style.
      * @defaultValue false
diff --git a/components/lib/listbox/Listbox.vue b/components/lib/listbox/Listbox.vue
index 0ddc11d9b..8d9efbd82 100755
--- a/components/lib/listbox/Listbox.vue
+++ b/components/lib/listbox/Listbox.vue
@@ -43,8 +43,8 @@
                 {{ filterResultMessageText }}
             </span>
         </div>
-        <div ref="listWrapper" :class="cx('wrapper')" :style="listStyle" v-bind="ptm('wrapper')">
-            <VirtualScroller :ref="virtualScrollerRef" v-bind="virtualScrollerOptions" :style="listStyle" :items="visibleOptions" :tabindex="-1" :disabled="virtualScrollerDisabled" :pt="ptm('virtualScroller')">
+        <div :class="cx('wrapper')" :style="[{ 'max-height': virtualScrollerDisabled ? scrollHeight : '' }, listStyle]" v-bind="ptm('wrapper')">
+            <VirtualScroller :ref="virtualScrollerRef" v-bind="virtualScrollerOptions" :items="visibleOptions" :style="[{ height: scrollHeight }, listStyle]" :tabindex="-1" :disabled="virtualScrollerDisabled" :pt="ptm('virtualScroller')">
                 <template v-slot:content="{ styleClass, contentRef, items, getItemOptions, contentStyle, itemSize }">
                     <ul
                         :ref="(el) => listRef(el, contentRef)"
diff --git a/components/lib/multiselect/BaseMultiSelect.vue b/components/lib/multiselect/BaseMultiSelect.vue
index f109718a0..e681934bd 100644
--- a/components/lib/multiselect/BaseMultiSelect.vue
+++ b/components/lib/multiselect/BaseMultiSelect.vue
@@ -15,7 +15,7 @@ export default {
         optionGroupChildren: null,
         scrollHeight: {
             type: String,
-            default: '200px'
+            default: '14rem'
         },
         placeholder: String,
         variant: {
diff --git a/components/lib/multiselect/MultiSelect.d.ts b/components/lib/multiselect/MultiSelect.d.ts
index cf1d221f2..8cc397f91 100755
--- a/components/lib/multiselect/MultiSelect.d.ts
+++ b/components/lib/multiselect/MultiSelect.d.ts
@@ -332,7 +332,7 @@ export interface MultiSelectProps {
     optionGroupChildren?: string | ((data: any) => any[]) | undefined;
     /**
      * Height of the viewport, a scrollbar is defined if height of list exceeds this value.
-     * @defaultValue 200px
+     * @defaultValue 14rem
      */
     scrollHeight?: string | undefined;
     /**
diff --git a/components/lib/orderlist/BaseOrderList.vue b/components/lib/orderlist/BaseOrderList.vue
index 62e2eb1b9..3d51abb56 100644
--- a/components/lib/orderlist/BaseOrderList.vue
+++ b/components/lib/orderlist/BaseOrderList.vue
@@ -46,6 +46,10 @@ export default {
             type: Boolean,
             default: false
         },
+        scrollHeight: {
+            type: String,
+            default: '14rem'
+        },
         buttonProps: {
             type: Object,
             default() {
diff --git a/components/lib/orderlist/OrderList.d.ts b/components/lib/orderlist/OrderList.d.ts
index fde23461b..93c266869 100755
--- a/components/lib/orderlist/OrderList.d.ts
+++ b/components/lib/orderlist/OrderList.d.ts
@@ -226,6 +226,11 @@ export interface OrderListProps {
      * Index of the element in tabbing order.
      */
     tabindex?: number | string | undefined;
+    /**
+     * Height of the viewport, a scrollbar is defined if height of list exceeds this value.
+     * @defaultValue 14rem
+     */
+    scrollHeight?: string | undefined;
     /**
      * Used to pass all properties of the ButtonProps to the move up button inside the component.
      * @type {ButtonProps}
diff --git a/components/lib/orderlist/OrderList.vue b/components/lib/orderlist/OrderList.vue
index cfd6b6514..158635d52 100755
--- a/components/lib/orderlist/OrderList.vue
+++ b/components/lib/orderlist/OrderList.vue
@@ -40,6 +40,7 @@
             multiple
             :metaKeySelection="metaKeySelection"
             :listStyle="listStyle"
+            :scrollHeight="scrollHeight"
             :tabindex="tabindex"
             :dataKey="dataKey"
             :autoOptionFocus="autoOptionFocus"
diff --git a/components/lib/picklist/BasePickList.vue b/components/lib/picklist/BasePickList.vue
index 9f73886cf..ca67754a4 100644
--- a/components/lib/picklist/BasePickList.vue
+++ b/components/lib/picklist/BasePickList.vue
@@ -46,6 +46,10 @@ export default {
             type: Boolean,
             default: false
         },
+        scrollHeight: {
+            type: String,
+            default: '14rem'
+        },
         showSourceControls: {
             type: Boolean,
             default: true
diff --git a/components/lib/picklist/PickList.d.ts b/components/lib/picklist/PickList.d.ts
index 77f550582..6aa8240c8 100755
--- a/components/lib/picklist/PickList.d.ts
+++ b/components/lib/picklist/PickList.d.ts
@@ -341,6 +341,11 @@ export interface PickListProps {
      * @defaultValue 960px
      */
     breakpoint?: string | undefined;
+    /**
+     * Height of the viewport, a scrollbar is defined if height of list exceeds this value.
+     * @defaultValue 14rem
+     */
+    scrollHeight?: string | undefined;
     /**
      * Whether to displays rows with alternating colors.
      * @defaultValue false
diff --git a/components/lib/picklist/PickList.vue b/components/lib/picklist/PickList.vue
index b3f81b97d..200604b3f 100755
--- a/components/lib/picklist/PickList.vue
+++ b/components/lib/picklist/PickList.vue
@@ -41,6 +41,7 @@
                 multiple
                 :metaKeySelection="metaKeySelection"
                 :listStyle="listStyle"
+                :scrollHeight="scrollHeight"
                 :tabindex="sourceList && sourceList.length > 0 ? tabindex : -1"
                 :dataKey="dataKey"
                 :autoOptionFocus="autoOptionFocus"
@@ -104,6 +105,7 @@
                 multiple
                 :metaKeySelection="metaKeySelection"
                 :listStyle="listStyle"
+                :scrollHeight="scrollHeight"
                 :tabindex="targetList && targetList.length > 0 ? tabindex : -1"
                 :dataKey="dataKey"
                 :autoOptionFocus="autoOptionFocus"
diff --git a/components/lib/treeselect/BaseTreeSelect.vue b/components/lib/treeselect/BaseTreeSelect.vue
index e6471c369..0c79199f0 100644
--- a/components/lib/treeselect/BaseTreeSelect.vue
+++ b/components/lib/treeselect/BaseTreeSelect.vue
@@ -10,7 +10,7 @@ export default {
         options: Array,
         scrollHeight: {
             type: String,
-            default: '400px'
+            default: '14rem'
         },
         placeholder: {
             type: String,
diff --git a/components/lib/treeselect/TreeSelect.d.ts b/components/lib/treeselect/TreeSelect.d.ts
index f0456c019..2380be218 100644
--- a/components/lib/treeselect/TreeSelect.d.ts
+++ b/components/lib/treeselect/TreeSelect.d.ts
@@ -12,7 +12,7 @@ import { ComponentHooks } from '../basecomponent';
 import { PassThroughOptions } from '../passthrough';
 import { TreeExpandedKeys, TreePassThroughOptions } from '../tree';
 import { TreeNode } from '../treenode';
-import { ClassComponent, GlobalComponentConstructor, PassThrough, HintedString } from '../ts-helpers';
+import { ClassComponent, GlobalComponentConstructor, HintedString, PassThrough } from '../ts-helpers';
 
 export declare type TreeSelectPassThroughOptionType = TreeSelectPassThroughAttributes | ((options: TreeSelectPassThroughMethodOptions) => TreeSelectPassThroughAttributes | string) | string | null | undefined;
 
@@ -172,7 +172,7 @@ export interface TreeSelectProps {
     options?: TreeNode[] | undefined;
     /**
      * Height of the viewport, a scrollbar is defined if height of list exceeds this value.
-     * @defaultValue 200px
+     * @defaultValue 14rem
      */
     scrollHeight?: string | undefined;
     /**