callstack / callstack/react-native-paper
Some Colors are not included in Type MD3Colors
- Dominant language
- TypeScript
- Stars
- 14.5k
- Forks
- 2.2k
- Avg merge
- 5d 23h
- Merged PRs (30d)
- 12
Description
### Current behaviour
Using `surfaceContainer` color gives following error in TypeScript:
`Property 'surfaceContainer' does not exist on type 'MD3Colors'.ts(2339)`
After looking at Type `MD3Colors`, I found out these Colors are not included in React-Native-Paper's `MD3Color` type :
`surfaceContainer`
`surfaceContainerHigh`
`surfaceContainerHighest`
`surfaceContainerLow`
`surfaceContainerLowest`
> _Note:
> There are 2 MD3Colors .
> The one I am talking about is a `type` from `node_modules\react-native-paper\src\types.tsx` , which contains type definitions.
> The other `MD3Colors` is a `const object` from file `node_modules\react-native-paper\src\styles\themes\v3\tokens.tsx`
> which contains palette_
### Expected behaviour
These colors should be included in `MD3Colors` and should not get any error's as these are part of Material You's Color Roles :

I used `useMaterial3Theme` from `pchmn/expo-material3-theme` to generate my theme colors, and it gives all the SurfaceContainer colors. But Paper's default theme and Type MD3Colors don't have it. So whenever I use SurfaceContainer Colors, I get errors in VS Code. Just want to know why is it not included ?
### How to reproduce?
Create expo app
Install `react-native-paper`
Try using `surfaceContianer` Color to a background of `View`, You will get error.
### Preview

### What have you tried so far?
Nothing much, except, editing MD3Colors type in and including all missing colors, but I still got the error. I don't really know how these things work.
I checked [React-Native-Paper's docs on Theming](https://callstack.github.io/react-native-paper/docs/guides/theming/), but even there, there's no word about `surfaceContianer` Colors. I think it's just not included/was missed while creating paper's MD3Colors or was not present in Material You by that time, but now it is and should be included in paper too. Surface Container and its variants are unique and provides amazing theming for surfaces. Please try to include them as fast as possible ✨.
### Your Environment
| software | version
| --------------------- | -------
| android | 13
| react-native | 0.72.10
| react-native-paper | 5.11.1
| node | 20.10.0
| npm or yarn | 1.22.21
| expo sdk | 50.0.13
Contributor guide
Assessment
This issue has not been assessed yet.