reactjs / reactjs/react-docgen
Support extracting of type information from tagged templates
Nadie ha tomado este issue todavía.
- Lenguaje dominante
- TypeScript
- Estrellas
- 3.8k
- Forks
- 316
- Merge medio
- 5 h 7 min
- PR fusionados (30 d)
- 4
Descripción
It looks like even if I have a resolver that resolves to components that use tagged templates like styled-components, the type annotations aren't extracted.
Consider the following example:
import styled from "styled-components";
interface FlexProps {
bool: boolean
}
const Flex = styled('div')<FlexProps>`
display: flex;
`;
/** @component */
export default Flex;
When used with an react-docgen-annotation-resolver, the type definitions won't be extracted.
I scoped it to this place in code that's responsible for finding type annotations: https://github.com/okonet/react-docgen/blob/8fb401089e3fe2b38d41638bc5690436e23aceb3/src/utils/getTypeAnnotation.js#L22
and it looks like it's searching for specific key typeAnnotation in the AST. For styled-component example, though, it won't present. But what's going to present is
Node {
type: 'TaggedTemplateExpression',
start: 95,
end: 138,
loc: SourceLocation { start: [Position], end: [Position] },
tag:
Node {
type: 'CallExpression',
start: 95,
end: 108,
loc: [SourceLocation],
callee: [Node],
arguments: [Array] },
quasi:
Node {
type: 'TemplateLiteral',
start: 119,
end: 138,
loc: [SourceLocation],
expressions: [],
quasis: [Array] },
typeParameters:
Node {
type: 'TSTypeParameterInstantiation',
start: 108,
end: 119,
loc: [SourceLocation],
params: [Array] } },
So, it looks like there is something related to types in there but its not being properly handled.
Does anyone has any pointers on how to fix it?
Guía de contribución
Primeros pasos
- Lee el issue completo y luego la guía de contribución del proyecto.
- Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
- Haz un fork del repositorio y trabaja en una rama.
- Abre un pull request que haga referencia al número del issue.
Línea de trabajo
Comienza en src/utils/getTypeAnnotation.js, en la búsqueda de la anotación de tipo enlazada en el issue, y compara después el AST de TaggedTemplateExpression mostrado con los nodos que se admiten actualmente. Rastrea cómo react-docgen-annotation-resolver consume el resultado. El trabajo estará terminado cuando se extraigan definiciones de tipo como FlexProps del ejemplo de styled-components.
Escrito por el modelo de indexación a partir del texto del issue.
Evaluación
- Stack tecnológico
- react, typescript
- Área
- documentation
- Tipo de issue
- Error
- Dificultad
- 4/5
- Tiempo estimado
- 3-5 días
- Estado de actividad
- Estancado
- Claridad
- Bastante claro
- Aptitud para principiantes
- 35/100