In typescript react-native project, this is component that I set:
type Variants = "body" | "label" | "caption" | "error" | "hint"; interface TextProps { theme?: DefaultTheme; // variant?: Omit<keyof Variants, undefined>; variant?: Variants; } export const Text = styled.Text<TextProps>` ${({ theme }) => defaultTextStyles(theme)} // HERE IS THE ISSUE "variants[variant](theme)" ${({ variant, theme }) => variants[variant](theme)} `; Text.defaultProps = { variant: "body", };
If I set variant?: Variants
optional, I get this error from ${({ variant, theme }) => variants[variant](theme)
. Since "variant" is optional, it can be undefined, so undefined cannot be used as index. But I also set
Text.defaultProps = { variant: "body", };
default variant should be "body" but this does not kick in.