Issues with `createText` typing

[nelyousfi]

What:

• Not forcing you to pass the custom component props as generic, this leads to add all the RN Text props to the restyled custom component.

const CustomText = ({ title }: { title: string }) => <Text>{title}</Text>;

const RestyledCustomText = createText<Theme>(CustomText);

<RestyledCustomText color="lightpink" accessibilityLabel="I am a label" />;

• There is no type inference between the generic and the props of the passed component:

const CustomText = ({ title }: { title: string }) => <Text>{title}</Text>;
const RestyledCustomText = createText<Theme, {}>(CustomText);

• We are not forcing the passed custom text to have a style prop (the style prop will contain all the calculated props as a style object)

I believe the same applied for createBox.

[sbalay]

I haven't checked your PR yet, but createText is aimed to be a shorthand of creating a restyle component based on react-native's Text, hence, they are coupled by design.

If you would like to create a restyle version of a custom component you should use createRestyleComponent instead. i.e.:

import {TextProps as RNTextProps} from 'react-native'
import {
  createRestyleComponent,
  textRestyleFunctions,
  TextProps as RestyleTextProps,
} from '@shopify/restyle'
import {Theme} from './theme'
import {CustomText} from './CustomText'

type CustomTextProps = RestyleTextProps<Theme> &
  Omit<
    RNTextProps,
    | 'fontWeight'
    | 'fontFamily'
    | 'fontSize'
    | 'lineHeight'
    | 'letterSpacing'
    | 'style'
  >

const CustomRestyleText = createRestyleComponent<CustomTextProps, Theme>(
  textRestyleFunctions,
  CustomText
)

export const Text = (props: CustomTextProps) => {
  return (
    <CustomRestyleText
      {...props}
    />
  )
}

[nelyousfi]

But then why we can pass an optional BaseComponent to createText + the props as generic? Cause for me, looking at that, I thought that createText and createView can also be used as a customised createRestyleComponent for Text and View.