Skip to content

feat: migrate ButtonIcon to ADR-0003 and ADR-0004 (DSYS-485)#1038

Draft
cursor[bot] wants to merge 1 commit intomainfrom
cursor/enum-shared-type-migration-398d
Draft

feat: migrate ButtonIcon to ADR-0003 and ADR-0004 (DSYS-485)#1038
cursor[bot] wants to merge 1 commit intomainfrom
cursor/enum-shared-type-migration-398d

Conversation

@cursor
Copy link
Copy Markdown
Contributor

@cursor cursor bot commented Apr 3, 2026

Description

Migrates the ButtonIcon component to follow ADR-0003 (String Unions) and ADR-0004 (Centralized Types Architecture).

Changes:

  • Creates ButtonIconSize and ButtonIconVariant const objects in @metamask/design-system-shared (ADR-0003), replacing the duplicate TypeScript enums in both platform packages
  • Creates ButtonIconPropsShared type in shared package (ADR-0004) with platform-independent props (iconName: string, size, isDisabled, variant)
  • Updates ButtonIconProps in both React and React Native to import and extend from shared (platform-specific props like iconProps: Partial<IconProps>, ariaLabel, className/twClassName, and style remain in platform packages)
  • Updates index.ts files in both platform packages to re-export const objects from shared
  • Removes old ButtonIconSize and ButtonIconVariant enums from platform types/index.ts files
  • Updates all consumers (ButtonIcon.tsx, ButtonIcon.constants.ts, ButtonIcon.stories.tsx, ButtonIcon.test.tsx, BannerBase.tsx) to import from @metamask/design-system-shared

Related issues

Fixes: https://consensyssoftware.atlassian.net/browse/DSYS-485

Manual testing steps

  1. Run yarn build — should complete with no errors
  2. Run yarn test — all tests pass with 100% coverage
  3. Run yarn lint — no errors

Screenshots/Recordings

Before

Duplicate ButtonIconSize and ButtonIconVariant enums defined separately in both design-system-react/src/types/index.ts and design-system-react-native/src/types/index.ts.

After

Single source of truth: ButtonIconSize and ButtonIconVariant as const objects in @metamask/design-system-shared, with ButtonIconPropsShared capturing cross-platform props.

Pre-merge author checklist

  • I've followed MetaMask Contributor Docs
  • I've completed the PR template to the best of my ability
  • I've included tests if applicable
  • I've documented my code using JSDoc format if applicable
  • I've applied the right labels on the PR (see labeling guidelines). Not required for external contributors.

Pre-merge reviewer checklist

  • I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed).
  • I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots.
Open in Web View Automation 

- Create ButtonIconSize and ButtonIconVariant const objects in shared package (ADR-0003)
- Create ButtonIconPropsShared type in shared package (ADR-0004)
- Update React and React Native ButtonIcon.types.ts to import from shared
- Update ButtonIcon index.ts files to re-export const objects from shared
- Update ButtonIcon.tsx, constants, stories, and test files to import from shared
- Remove old ButtonIconSize and ButtonIconVariant enums from platform types/index.ts
- Update BannerBase.tsx in both packages to import ButtonIconSize from shared

Co-authored-by: George Marshall <georgewrmarshall@users.noreply.github.com>
@github-actions
Copy link
Copy Markdown
Contributor

github-actions bot commented Apr 3, 2026

📖 Storybook Preview

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.

1 participant