Release/40.0.0

[brianacnguyen]

Release 40.0.0

This release updates the shared layer and both UI packages: new extension-aligned primitives and form helpers on web, new selection and multi-line input components on React Native, shared types and context for those APIs, coordinated BannerBase close behavior, and ButtonBase defaults driven by size (with migration guidance for wrappers that overrode label, icon, or spacing).

Package versions

• @metamask/design-system-shared: 0.18.0
• @metamask/design-system-react: 0.23.0
• @metamask/design-system-react-native: 0.25.0

Shared type updates (0.18.0)

Component type additions (#1172, #1164, #1169, #1141)

What changed

• SelectButton shared props and variants (SelectButtonPropsShared, SelectButtonVariant, SelectButtonEndArrow).
• SegmentGroup shared props and SegmentGroupContext (SegmentGroupPropsShared, SegmentGroupContext, SegmentGroupContextValue).
• SensitiveText shared types (SensitiveTextLength, SensitiveTextPropsShared, and related exports).
• HelpText shared types (HelpTextSeverity, HelpTextPropsShared, and related exports).
• TextAreaPropsShared for multi-line input wrappers.

Impact

• React and React Native stay aligned on the same ADR-0003/0004-style contracts for the new and updated surfaces above.

React web updates (0.23.0)

Added

• PopoverHeader — popover title rows and trailing actions, extension migration patterns (#1158).
• ModalHeader — modal title rows and accessory slots (#1144).
• Label — captions paired with form controls (#1152).
• SensitiveText — mask/reveal for sensitive strings with configurable visible length (#1164).
• HelpText — helper, success, warning, and error copy under inputs and controls (#1169).

Changed

• ButtonBase — label Text variant, start/end icon sizes, and internal spacing are derived from size for each ButtonBaseSize (#1150). See Migration guide — ButtonBase.
• BannerBase — close behavior uses onClose only; closeButtonProps.onClick is not the dismiss API; closeButtonProps is for customization (#1166).

React Native updates (0.25.0)

Added

• SelectButton, SegmentButton, SegmentGroup (#1172).
• SensitiveText, aligned with the shared contract (#1164).
• HeaderStandardAnimated and useHeaderStandardAnimated (#1151).
• TextArea (#1141).

Changed

• ButtonBase — same size-driven defaults as web (#1150). See Migration guide — ButtonBase.
• BannerBase — close behavior uses onClose only; closeButtonProps.onPress is not the dismiss API (#1166).

Breaking changes

BannerBase close API (both platforms)

What changed

• React: Use onClose for dismiss behavior. closeButtonProps.onClick is removed from that role. The close control is tied to onClose. closeButtonProps remains for non-behavioral customization (e.g. data-testid, accessibility, styling hooks).
• React Native: Same pattern: onClose instead of closeButtonProps.onPress for dismiss behavior.

Migration

• Move any close action from closeButtonProps.onClick / closeButtonProps.onPress to onClose.
• If you previously forced a close button with only closeButtonProps, also provide onClose.

Impact

• Call sites that dismissed via closeButtonProps or showed a close button without onClose must be updated.

See:

• React — From version 0.22.0 to 0.x.0
• React Native — From version 0.24.0 to 0.x.0

ButtonBase: not called out here as a semver-breaking API change; consumers who overrode typography, icon size, or spacing on ButtonBase wrappers should follow the ButtonBase migration sections linked above.

Checklist

• Changelogs updated with human-readable descriptions
• yarn changelog:validate passes
• Version bumps follow semantic versioning
  • @metamask/design-system-shared: minor (0.17.x → 0.18.0) — new shared exports for select/segment, sensitive text, help text, text area
  • @metamask/design-system-react: minor (0.22.x → 0.23.0) — new components; BannerBase / ButtonBase behavior
  • @metamask/design-system-react-native: minor (0.24.x → 0.25.0) — new components; BannerBase / ButtonBase behavior
• Breaking changes documented (BannerBase) in MIGRATION with before/after examples
• PR references present in changelog entries

Pre-merge author checklist

• MetaMask Contributor Docs
• Release Workflow
• yarn build && yarn test && yarn lint
• yarn changelog:validate

Pre-merge reviewer checklist

• Reviewing Release PRs
• Package versions and semver match what this PR actually publishes
• Changelogs are consumer-facing
• Breaking changes covered in MIGRATION.md
• No unpublished package is missing from the changelogs / version list for this PR

[github-actions]

📖 Storybook Preview

• View PR Storybook