callstack / callstack/react-native-paper
Missing fonts in NavigationTheme type
- 主要语言
- TypeScript
- 星标
- 14.5k
- 派生
- 2.2k
- 平均合并
- 5 天 23 小时
- 30 天内合并 PR
- 12
描述
### Current behaviour
```
import { DefaultTheme, NavigationContainer } from '@react-navigation/native'
import { adaptNavigationTheme } from 'react-native-paper'
...
const { LightTheme } = adaptNavigationTheme({ reactNavigationLight: DefaultTheme })
...
...
```
Typing error in VSC:
```
Property 'fonts' is missing in type 'NavigationTheme' but required in type 'Theme'.ts(2741)
types.d.ts(22, 5): 'fonts' is declared here.
types.d.ts(313, 5): The expected type comes from property 'theme' which is declared here on type 'IntrinsicAttributes & NavigationContainerProps & { direction?: LocaleDirection | undefined; linking?: LinkingOptions<...> | undefined; fallback?: ReactNode; documentTitle?: DocumentTitleOptions | undefined; } & { ...; }'
(property) theme?: ReactNavigation.Theme | undefined
```
### Explanation
There is a discrepancy between:
`@react-navigation\native\src\types.tsx`
```
interface NativeTheme {
dark: boolean;
colors: {
...
};
fonts: {
regular: FontStyle;
medium: FontStyle;
bold: FontStyle;
heavy: FontStyle;
};
}
```
And `react-native-paper\src\types.tsx`
```
export type NavigationTheme = {
dark: boolean;
colors: {
...
};
};
```
### What have you tried so far?
Not a definitive fix, but, as a confirmation, the error disappeared with this edit in `react-native-paper\lib\typescript\types.d.ts`
```
/*psam*/type FontStyle = {
fontFamily: string;
fontWeight:
| 'normal'
| 'bold'
| '100'
| '200'
| '300'
| '400'
| '500'
| '600'
| '700'
| '800'
| '900';
};
export type NavigationTheme = {
dark: boolean;
colors: {
primary: string;
background: string;
card: string;
text: string;
border: string;
notification: string;
};
/*psam*/ fonts: {
regular: FontStyle;
medium: FontStyle;
bold: FontStyle;
heavy: FontStyle;
};
};
```
### Your Environment
| software | version
| --------------------- | -------
| @react-navigation/native | 7.1.9
| react-native | 0.79.1
| react-native-paper | 5.14.0
贡献指南
调研方向
比较 @react-navigation/native/src/types.tsx 与 react-native-paper/src/types.tsx,重点关注 NativeTheme 和 NavigationTheme。使用报告中的 NavigationContainer 示例验证这些类型,并确认源定义与生成的类型一致后,missing-fonts 错误已消失。
由索引模型根据 Issue 内容生成。
评估
- 技术栈
- react-native, typescript
- 领域
- mobile-dev
- Issue 类型
- 缺陷
- 难度
- 2/5
- 预计耗时
- 1-3 小时
- 活跃度
- 停滞
- 描述清晰度
- 基本清楚
- 新手友好度
- 45/100