Skip to content

fix(mui): respect custom startIcon when hideText is true on all button components#7345

Open
tysoncung wants to merge 1 commit intorefinedev:mainfrom
tysoncung:fix/mui-button-hidetext-starticon
Open

fix(mui): respect custom startIcon when hideText is true on all button components#7345
tysoncung wants to merge 1 commit intorefinedev:mainfrom
tysoncung:fix/mui-button-hidetext-starticon

Conversation

@tysoncung
Copy link

Summary

Fixes #7343

When hideText=true, all MUI button components (ShowButton, EditButton, DeleteButton, CloneButton, CreateButton, ListButton, RefreshButton, SaveButton, ExportButton, ImportButton) ignored any custom startIcon passed via props and always rendered the hardcoded default icon as children. If a user also passed startIcon through rest props, it would render as the MUI Button startIcon slot AND the default icon would render as children — causing a double-icon display.

Root Cause

The startIcon prop was not extracted from the rest/spread props, so it was passed through to the MUI <Button> component via {...restProps}. Meanwhile, the component always rendered its default icon as children when hideText=true, resulting in two icons.

Fix

For all 10 affected button components:

  1. Extract startIcon from the rest/spread props
  2. When hideText=true: render startIcon ?? defaultIcon as the button's children (no startIcon prop on the Button itself)
  3. When hideText=false: use startIcon ?? <DefaultIcon /> as the Button's startIcon prop

This ensures a user-provided startIcon is respected in both modes, with the default icon as fallback.

Affected Components

Component Default Icon
ShowButton VisibilityOutlined
EditButton EditOutlined
DeleteButton DeleteOutline
CloneButton AddBoxOutlined
CreateButton AddBoxOutlined
ListButton ListOutlined
RefreshButton RefreshOutlined
SaveButton SaveOutlined
ExportButton ImportExportOutlined
ImportButton ImportExportOutlined

Testing

Added MUI-specific tests for ShowButton covering:

  • Custom startIcon with hideText=true renders only the custom icon
  • Default icon renders when hideText=true with no custom startIcon
  • Custom startIcon used in startIcon slot when hideText=false

…n components

When hideText=true, MUI button components (Show, Edit, Delete, Clone, Create,
List, Refresh, Save, Export, Import) ignored any custom startIcon passed via
props, always rendering the hardcoded default icon as children. If a user also
passed startIcon, it would render as the MUI Button startIcon slot AND the
default icon would render as children — causing a double-icon display.

Fix: Extract startIcon from rest props and use it as the icon content when
hideText=true if provided, falling back to the default icon otherwise. When
hideText=false and a custom startIcon is provided, use it instead of the
default.

Fixes refinedev#7343
@tysoncung tysoncung requested a review from a team as a code owner March 11, 2026 17:11
@changeset-bot
Copy link

changeset-bot bot commented Mar 11, 2026

⚠️ No Changeset found

Latest commit: f118c74

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[BUG] ShowButton ignores custom startIcon when hideText=true, causing double icon display

1 participant