样式化组件元素的静态属性类型

Question

如何键入具有静态属性的样式化组件元素？

interface IMyList {
  Item: ThemedStyledFunction<"li", any>;
}

const MyList: IMyList = styled.ul`
  padding: 0;
  margin: 0;
`;

MyList.Item = styled.li`
  display: block;
  padding-left: 16px;
  color: rebeccapurple;
`;

// Usage
type TUser = {
    name: string;
    age: number
}

export default function Users(data: TUser[]) {
    return (
        <List>
            {data.map(user => {
                <List.Item>
                    <span className="name">{ user.name }</span>
                    <span className="age">{ user.age }</span>
                </List.Item>
            })}
        </List>
    );
}

上面让我感到Property 'Item' is missing in type 'String & StyledComponentBase<"ul", any, {}, never>' but required in type 'IMyList'.ts(2741)对于“ Property 'Item' is missing in type 'String & StyledComponentBase<"ul", any, {}, never>' but required in type 'IMyList'.ts(2741) ”和Property 'attrs' is missing in type 'String & StyledComponentBase<"li", any, {}, never>' but required in type 'ThemedStyledFunction<"li", any, {}, never>'.ts(2741)为“ MyList.Item”缺少”。