React-native-paper: [Typescript] Export component props such as TextInputProps

[jsamr]

First of all, thanks for this delightful library! This is not a feature request nor exactly a bug, I guess somewhere in the middle, so I didn't use any template.

I would like to extend TextInput. To do so, I need the prop type, TextInputProp. As of today, I have to import the types like this:

import { TextInputProps } from 'react-native-paper/lib/typescript/src/components/TextInput/TextInput'

This is very unsatisfying, because this path could change at any time and depends on your build logic. A tool such as api-extractor would rightfully forbid you from not exporting indirect types, as it undermines the clear identification of your library API surface and prevent users from easily extending core features.

Component props are obviously part of the API surface, and as such must be exported.

[Trancever]

For anyone who also encounters this problem:

React.ComponentProps<typeof TextInput>

This will extract the Props from any component, not only Paper's one. It works with both class and function components.

[vpontis]

@Trancever thanks for your work on this project and for that work around.

However, I believe it would still be nice to export the types so that the TypeScript analyzer can understand them statically.

For example, let's say I want to extend the props and do this:

import { IconButton as RNIconButton } from 'react-native-paper';

type RNIconButtonProps = React.ComponentProps<typeof RNIconButton>;

interface IIconButtonProps extends RNIconButtonProps {
  backgroundColor?: string;
}

I get this error message:

TS2312: An interface can only extend an object type or 
intersection of object types with statically known members.

[satya164]

You can do:

type IconButtonProps = RNIconButtonProps & {
  backgroundColor?: string;
}

Interfaces don't really provide any advantage.

[vpontis]

You can do:

type IconButtonProps = RNIconButtonProps & {
  backgroundColor?: string;
}

Interfaces don't really provide any advantage.

Ah whoa, that worked! Thank you. And that was so fast omg