Есть ли у styled-components интерфейс для функций в литерале шаблона?

Я новичок в Typescript, я не могу понять это: https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/styled-components/index.d.ts

Я пытаюсь выяснить, есть ли уже определенный тип для функций внутри литерала шаблона в styled-components. Например:

export const getColor = props => props.color;

const ColorButton = styled.button`
    border: 0;
    color: ${getColor};
`;

export default ColorButton;

Я хотел бы написать файл d.ts для этих двух экспортов. В настоящее время я следую этой схеме:

type PropFunction<T> = (props: T) => string;
type Prop<T> = string | PropFunction<T>;

interface ColorButtonProps extends React.ButtonHTMLAttributes<HTMLButtonComponent> {
    color?: string;
    css?: Prop<ColorButtonProps>;
}

declare const getColor: Prop<ColorButtonProps>;
declare const ColorButton: React.ComponentType<ColorButtonProps>;

export default ColorButton;

Причина этого в том, что я могу написать функции styled-component как реквизиты:

<ColorButton color="purple" css={getColor} />

Так как getColor - это тип функции, которую ожидают styled-components в литерале шаблона, я бы предположил, что для него уже определен тип, и мне не нужно создавать свой собственный (PropFunction и Prop). Есть ли лучший способ определить эти типы?

0 ответов

Другие вопросы по тегам