MetaMask / MetaMask/metamask-design-system

[DS QA]: Add props to Text component DSRN

Open
#574 0 comments 0 reactions 1 assignee Claimed by @brianacnguyen View on GitHub
team-design-system
Dominant language
TypeScript
Stars
37
Forks
14
Avg merge
1d 9h
Merged PRs (30d)
60

Description

### **Description**

Add additional style-related props to the `Text` component in `@metamask/design-system-react-native` (DSRN) to expand flexibility and align with common web and design system usage. These props should match existing DSR or platform conventions where applicable.

### **Technical Details**

- Add support for the following props to the DSRN `Text` component:
- `textTransform` (e.g., `"none"`, `"uppercase"`, `"lowercase"`, `"capitalize"`)
- `textAlign` (e.g., `"left"`, `"right"`, `"center"`, `"justify"`)
- `overflowWrap` or equivalent line-breaking control (e.g., wrap or truncate behavior)
- `ellipsis` boolean prop for enabling `numberOfLines`-based truncation

- Ensure compatibility with React Native style props and accessibility.
- Update prop types and documentation accordingly.

### **Acceptance Criteria**

- All four props are supported and function correctly in the DSRN `Text` component.
- Styles are applied consistently across platforms and variants.
- Prop definitions and usage are documented.
- Unit or snapshot tests validate behavior where applicable.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.