fix: primefaces#7037, Dropdown: Cannot change icon when expanding or …

…collapsing options
qburst · Aug 13, 2024 · dfad4ff · dfad4ff
1 parent 4da5a7b
commit dfad4ff
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 1 deletion.
diff --git a/components/lib/dropdown/Dropdown.js b/components/lib/dropdown/Dropdown.js
@@ -3,6 +3,7 @@ import PrimeReact, { FilterService, PrimeReactContext, localeOption } from '../a
 import { useHandleStyle } from '../componentbase/ComponentBase';
 import { useMergeProps, useMountEffect, useOverlayListener, useUnmountEffect, useUpdateEffect } from '../hooks/Hooks';
 import { ChevronDownIcon } from '../icons/chevrondown';
+import { ChevronUpIcon } from '../icons/chevronup';
 import { SpinnerIcon } from '../icons/spinner';
 import { TimesIcon } from '../icons/times';
 import { OverlayService } from '../overlayservice/OverlayService';
@@ -1197,7 +1198,7 @@ export const Dropdown = React.memo(
                 },
                 ptm('dropdownIcon')
             );
-            const icon = props.dropdownIcon || <ChevronDownIcon {...dropdownIconProps} />;
+            const icon = !overlayVisibleState ? props.dropdownIcon || <ChevronDownIcon {...dropdownIconProps} /> : props.collapseIcon || <ChevronUpIcon {...dropdownIconProps} />;
             const dropdownIcon = IconUtils.getJSXIcon(icon, { ...dropdownIconProps }, { props });
 
             const ariaLabel = props.placeholder || props.ariaLabel;

diff --git a/components/lib/dropdown/DropdownBase.js b/components/lib/dropdown/DropdownBase.js
@@ -170,6 +170,7 @@ export const DropdownBase = ComponentBase.extend({
         dataKey: null,
         disabled: false,
         dropdownIcon: null,
+        collapseIcon: null,
         editable: false,
         emptyFilterMessage: null,
         highlightOnSelect: true,

diff --git a/components/lib/dropdown/dropdown.d.ts b/components/lib/dropdown/dropdown.d.ts
@@ -281,6 +281,10 @@ export interface DropdownProps extends Omit<React.DetailedHTMLProps<React.InputH
      * Icon of the dropdown.
      */
     dropdownIcon?: IconType<DropdownProps> | undefined;
+    /**
+     * Icon of collapse action.
+     */
+    collapseIcon?: IconType<DropdownProps> | undefined;
     /**
      * When present, custom value instead of predefined options can be entered using the editable input field.
      * @defaultValue false