callstack / callstack/react-native-paper
Skeleton Loader component
- Dominant language
- TypeScript
- Stars
- 14.5k
- Forks
- 2.2k
- Avg merge
- 5d 23h
- Merged PRs (30d)
- 12
Description
**Describe the solution you’d like**
Add a built-in Skeleton Loader component to react-native-paper that can be used as a placeholder while content is loading.
The component should align with Material Design principles and the existing Paper theming system (colors, dark mode, shape, animation preferences).
This would provide a consistent, first-class loading experience without requiring third-party libraries.
**Describe alternatives you’ve considered**
Currently, skeleton loading is typically implemented by:
Using third-party libraries (which may not integrate well with Paper’s theme system), or
Manually composing View components with animated opacity/backgrounds, which leads to duplicated, inconsistent implementations across apps
Neither approach feels ideal for a UI library that already provides polished, opinionated components.
**Additional context**
Many modern design systems include skeleton loaders as a standard pattern, and they are increasingly preferred over spinners for content-heavy screens. Having this as part of react-native-paper would improve developer experience and visual consistency across applications using the library.
Contributor guide
Research direction
No files, tests, or entry points are named in the issue, so start by locating existing React Native Paper components and its theming and animation patterns. Done means a built-in Skeleton Loader with a defined Material-aligned API that integrates with colors, dark mode, shape, and animation preferences.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react-native, typescript
- Domain
- design, frontend, mobile
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 25/100