diff --git a/packages/react-core/src/components/ExpandableSection/ExpandableSection.tsx b/packages/react-core/src/components/ExpandableSection/ExpandableSection.tsx
index e6331b70b35..220e83bab9d 100644
--- a/packages/react-core/src/components/ExpandableSection/ExpandableSection.tsx
+++ b/packages/react-core/src/components/ExpandableSection/ExpandableSection.tsx
@@ -62,6 +62,10 @@ export interface ExpandableSectionProps extends Omit,
+ hasToggleIcon = true,
children,
isExpanded,
isDetached,
@@ -267,13 +273,10 @@ class ExpandableSection extends Component onToggle(event, !propOrStateIsExpanded)}
- {...(variant !== ExpandableSectionVariant.truncate && {
- icon: (
-
-
-
- )
- })}
+ {...(variant !== ExpandableSectionVariant.truncate &&
+ hasToggleIcon && {
+ icon: {toggleIcon}
+ })}
aria-label={toggleAriaLabel}
aria-labelledby={toggleAriaLabelledBy}
>
diff --git a/packages/react-core/src/components/ExpandableSection/__tests__/ExpandableSection.test.tsx b/packages/react-core/src/components/ExpandableSection/__tests__/ExpandableSection.test.tsx
index 651214938f5..05e1c153181 100644
--- a/packages/react-core/src/components/ExpandableSection/__tests__/ExpandableSection.test.tsx
+++ b/packages/react-core/src/components/ExpandableSection/__tests__/ExpandableSection.test.tsx
@@ -3,6 +3,7 @@ import userEvent from '@testing-library/user-event';
import { ExpandableSection, ExpandableSectionVariant } from '../ExpandableSection';
import styles from '@patternfly/react-styles/css/components/ExpandableSection/expandable-section';
+import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon';
const props = { contentId: 'content-id', toggleId: 'toggle-id' };
@@ -271,3 +272,33 @@ test('Renders with div wrapper when toggleWrapper="div"', () => {
const toggle = screen.getByRole('button').parentElement;
expect(toggle?.tagName).toBe('DIV');
});
+
+test('Can render custom toggle icon', () => {
+ render(}>Test content);
+
+ expect(screen.getByTestId('bell-icon')).toBeInTheDocument();
+});
+
+test('Does not render toggle icon when hasToggleIcon is false', () => {
+ render(Test content);
+
+ const button = screen.getByRole('button');
+ expect(button.querySelector('.pf-v6-c-expandable-section__toggle-icon')).not.toBeInTheDocument();
+});
+
+test('Does not render custom toggle icon when hasToggleIcon is false', () => {
+ render(
+ } hasToggleIcon={false}>
+ Test content
+
+ );
+
+ expect(screen.queryByTestId('bell-icon')).not.toBeInTheDocument();
+});
+
+test('Renders toggle icon by default when hasToggleIcon is true', () => {
+ render(Test content);
+
+ const button = screen.getByRole('button');
+ expect(button.querySelector('.pf-v6-c-expandable-section__toggle-icon')).toBeInTheDocument();
+});