callstack / callstack/react-native-paper

feat: implement the loading indicator component

Open
#4,985 1 comment 0 reactions 0 assignees View on GitHub
v6
Dominant language
TypeScript
Stars
14.5k
Forks
2.2k
Avg merge
5d 23h
Merged PRs (30d)
12

Description

- The goal is to implement a loading indicator. This component is similar but not the same as progress indicators. The modern expressive version uses a set of shapes and morphing between them.
- Reuse the shapes added in https://github.com/callstack/react-native-paper/issues/4984
- See https://m3.material.io/components/loading-indicator/specs
- Reuse newly introduced tokens (shape, motion, typography, color etc)
- Extract component specific tokens for easier maintenance.
- Get inspired from TextInput/TextField, Switch, Checkbox, FAB components which have gone through modernization.
- Showcase the component in the example app
- Update the documentation

Contributor guide

Open the contributing guide

Research direction

Start by reviewing the shapes from issue #4984 and the Material 3 loading-indicator specifications. Compare the modernization patterns in TextInput/TextField, Switch, Checkbox, and FAB, then define the component tokens and implementation scope. Done means the indicator is available in the example app and its documentation is updated.

Written by the indexing model from the issue text.

Assessment

Tech stack
react-native, typescript
Domain
design, documentation, frontend, mobile
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.