From 91bc90f56c84c3f69f82ec57ca357a9886be62ec Mon Sep 17 00:00:00 2001
From: mertsincan <sincan.mert@gmail.com>
Date: Tue, 14 Feb 2023 12:51:46 +0000
Subject: [PATCH] Refactor #4052

---
 components/lib/cascadeselect/CascadeSelect.js     | 5 +++++
 components/lib/cascadeselect/CascadeSelectBase.js | 1 +
 components/lib/cascadeselect/cascadeselect.d.ts   | 5 +++++
 3 files changed, 11 insertions(+)

diff --git a/components/lib/cascadeselect/CascadeSelect.js b/components/lib/cascadeselect/CascadeSelect.js
index 26fb294665..73dfe42cdd 100644
--- a/components/lib/cascadeselect/CascadeSelect.js
+++ b/components/lib/cascadeselect/CascadeSelect.js
@@ -209,6 +209,11 @@ export const CascadeSelect = React.memo(
                 const selector = `${attributeSelectorState}_panel`;
                 const innerHTML = `
 @media screen and (max-width: ${props.breakpoint}) {
+    .p-cascadeselect-panel[${selector}] .p-cascadeselect-items-wrapper > ul {
+        max-height: ${props.scrollHeight};
+        overflow: ${props.scrollHeight ? 'auto' : ''};
+    }
+
     .p-cascadeselect-panel[${selector}] .p-cascadeselect-sublist {
         position: relative;
     }
diff --git a/components/lib/cascadeselect/CascadeSelectBase.js b/components/lib/cascadeselect/CascadeSelectBase.js
index 8fd94459dd..fdc6418302 100644
--- a/components/lib/cascadeselect/CascadeSelectBase.js
+++ b/components/lib/cascadeselect/CascadeSelectBase.js
@@ -25,6 +25,7 @@ export const CascadeSelectBase = {
         appendTo: null,
         transitionOptions: null,
         dropdownIcon: 'pi pi-chevron-down',
+        scrollHeight: '400px',
         onChange: null,
         onGroupChange: null,
         onBeforeShow: null,
diff --git a/components/lib/cascadeselect/cascadeselect.d.ts b/components/lib/cascadeselect/cascadeselect.d.ts
index 578a03ad11..0d016b6be0 100644
--- a/components/lib/cascadeselect/cascadeselect.d.ts
+++ b/components/lib/cascadeselect/cascadeselect.d.ts
@@ -132,6 +132,11 @@ export interface CascadeSelectProps extends Omit<React.DetailedHTMLProps<React.I
      * @defaultValue pi pi-chevron-down
      */
     dropdownIcon?: string | undefined;
+    /**
+     * Maximum height of the options panel on responsive mode.
+     * @defaultValue 400px
+     */
+    scrollHeight?: string | undefined;
     /**
      * Callback to invoke on value change
      * @param {CascadeSelectChangeEvent} event - Custom change event