[georgewrmarshall]

Release 80.0.0

This release fixes AvatarNetwork, AvatarToken, and AvatarFavicon so a non-square image covers the avatar on React and React Native (#1659, #1661, #1662). It also fixes React InputProps and TextField inputProps so object literals accept data-* attributes (#1667). On React Native, Spinner now runs on Animated's native driver, fixing an Android freeze caused by continuous Reanimated commits competing with layout animations (#1665).

This supersedes #1668, which was closed. The branch was recut from current main (da657b74) so it includes #1665.

📦 Package Versions

• @metamask/design-system-react: 0.51.0 → 0.51.1 (patch): the three avatar fixes and the data-* typing fix
• @metamask/design-system-react-native: 0.56.0 → 0.56.1 (patch): the three avatar fixes and the Spinner native-driver fix

Not published: @metamask/design-system-shared (0.45.0) has no changes, and @metamask/design-tokens (13.0.0), @metamask/design-system-tailwind-preset (0.16.0), and @metamask/design-system-twrnc-preset (0.14.0) only have the #1653 devDependency bump (intentionally-skip). @metamask/storybook-react is a private app (intentionally-skip).

Merged PRs since v79.0.0

PR	Packages	In changelog
#1659 AvatarNetwork image cover	React, React Native	Yes, Fixed
#1661 AvatarToken image cover	React, React Native	Yes, Fixed
#1662 AvatarFavicon image cover	React, React Native	Yes, Fixed
#1667 data-* in Input and TextField inputProps	React	Yes, Fixed
#1665 Spinner native animation driver	React Native	Yes, Fixed
#1658 bump @expo/config-plugins	yarn.lock only	No. It only affects the private Storybook React Native toolchain, not a runtime dependency of a published package
#1663 document hosted React Native components.json	AGENTS.md, docs/	No. Contributor docs
#1583 hide docs pages for example stories	private apps/storybook-react	No. Not published

#1667 is a patch: the component already passed data-* attributes to the native <input> at runtime, and only the TypeScript type rejected them. One edge case: the new index signature types data-* values as string, so <Input data-count={3} /> now needs a string value.

#1665 is a patch: the public API is unchanged and the spinner still makes one linear full turn per second. Rotation now uses React Native Animated with useNativeDriver: true instead of a Reanimated withRepeat loop, so it no longer commits the shadow tree on every frame.

🌐 React Web Updates (0.51.1)

Fixed

• Fixed AvatarNetwork image to cover the avatar instead of letterboxing non-square images (fix: make AvatarNetwork image cover the avatar #1659)
• Fixed AvatarToken image to cover the avatar instead of letterboxing non-square images (fix: make AvatarToken image cover the avatar #1661)
• Fixed AvatarFavicon image to cover the avatar instead of letterboxing non-square images (fix: make AvatarFavicon image cover the avatar #1662)
• Fixed InputProps and the inputProps of TextField, TextFieldSearch, and FormTextField to accept data-* attributes such as data-testid (fix(design-system-react): allow data-* attributes in Input and TextField inputProps #1667)

📱 React Native Updates (0.56.1)

Fixed

• Fixed AvatarNetwork image to cover the avatar instead of letterboxing non-square images (fix: make AvatarNetwork image cover the avatar #1659)
• Fixed AvatarToken image to cover the avatar instead of letterboxing non-square images (fix: make AvatarToken image cover the avatar #1661)
• Fixed AvatarFavicon image to cover the avatar instead of letterboxing non-square images (fix: make AvatarFavicon image cover the avatar #1662)
• Fixed Spinner so it runs on Animated's native driver, fixing an Android freeze caused by continuous Reanimated commits competing with layout animations (fix(Spinner): rotate on the native animation driver #1665)

⚠️ Breaking Changes

None.

✅ Checklist

• Changelogs updated with human-readable descriptions
• Changelog validation passed (yarn changelog:validate)
• Version bumps follow semantic versioning
  • design-system-react: patch (0.51.0 → 0.51.1): avatar cover fixes and the data-* typing fix
  • design-system-react-native: patch (0.56.0 → 0.56.1): avatar cover fixes and the Spinner native-driver fix
• Breaking changes documented with migration guidance: none in this release
• Migration guides updated with before/after examples (if breaking changes): not applicable
• PR references included in changelog entries

Pre-merge author checklist

• I've followed MetaMask Contributor Docs
• I've reviewed the Release Workflow cursor rule
• All tests pass (yarn build && yarn test && yarn lint)
• Changelog validation passes (yarn changelog:validate)

Pre-merge reviewer checklist

• I've reviewed the Reviewing Release PRs guide
• Package versions follow semantic versioning
• Changelog entries are consumer-facing (not commit message regurgitation)
• Breaking changes are documented in MIGRATION.md with examples
• All unreleased changes are accounted for in changelogs

Squash-merge this pull request with the commit title Release 80.0.0.

  

---

Note

Low Risk
Release-only version and changelog updates with no runtime code changes in this diff; risk is limited to consumers reading new semver tags.

^{Reviewed by Cursor Bugbot for commit b65e2bd. Bugbot is set up for automated code reviews on this repo. Configure here.}

[github-actions]

📖 Storybook Links

Compare the preview for this pull request with the latest Storybooks from the main branch.

🔀 Pull Request Preview

• 🖥️ React
• 📱 React Native

🌳 Main Branch (Latest)

• 🖥️ React
• 📱 React Native