React Native Material 3

Material Design 3 components library for React Native with support for dynamic theming and interactivity out of the box

[!IMPORTANT]
STATUS UPDATE! I've been unable to work on the project recently since I'm busy with school. Maybe in the future I'll come back to this.

The library is being slowly worked on. See the roadmap for more information.

⬇️ Installation

Coming soon...

🧑🏻‍💻 Usage

Coming soon...

🛣️ Roadmap

🚩 v1.0.0 (initial release)

[!IMPORTANT]
ETA: Around Q2 2024 (April - June)
This is just an estimate. There's NO guarantee that RNM3 will release around this time.

[!NOTE]
BOLD means it is being actively worked on.
* means it is low priority.

🙋🏻‍♂️ Utility functions & hooks

• [x] Theming

📄 Constants & tokens

• [x] States

  • [x] Constants

• [x] Shape scale

• [x] Type scale

• [x] Motion

  • [x] Duration
  • [x] Easing

📦 Components

• [ ] Badge
  • [x] Component
  • [ ] Integration with other components
    Depends on: other components being finished.
• [ ] Bottom app bar
• [ ] Bottom sheet
• [ ] Buttons
  • [ ] Standard button
  • [ ] FAB
  • [ ] Extended FAB
  • [ ] Icon button
  • [ ] Segmented button
• [ ] Card
• [ ] Checkbox
• [ ] Chips
• [ ] Dialog
• [x] Divider
  • [x] Component
  • [ ] Subheading support*
• [ ] List
  • [ ] Component
  • [ ] Account for extra empty space for FABs*
• [ ] Menu
• [ ] Navigation bar
• [ ] Progress indicators
• [ ] Radio button
• [ ] Snackbar
• [ ] Switch
  • [x] Component
  • [ ] Animation*
    Note: This may be one of the few things I'll work on last as the animation is a bit more complicated than just change from X to Y.
  • [ ] Dragging*
  • [x] State layer
• [ ] Tabs
• [x] Text
• [ ] Tooltips
• [ ] Top app bar

♿ Accessibility

• [x] Scaling
• [ ] Accessibility properties
• [ ] RTL support
  • [ ] Optional RTL property for icons
  • [ ] Element alignment

🏳️ v1.1.0 (feature update)

• [ ] Navigation drawer
• [ ] Navigation rail
• [ ] Search
• [ ] Side sheet
• [ ] Slider
• [ ] Text fields

⌚ Future

These features are planned for a future release.

• [ ] Carousel
• [ ] Date picker
• [ ] Time picker