styleguidist/react-styleguidist

Try rendering examples in iframe

Open

#1.496 aberto em 12 de dez. de 2019

Ver no GitHub
 (4 comments) (2 reactions) (0 assignees)TypeScript (1.416 forks)github user discovery
enhancementhelp wanted

Métricas do repositório

Stars
 (11.091 stars)
Métricas de merge de PR
 (Métricas PR pendentes)

Description

Right now each example is a separate React app that renders into the same DOM as the Styleguidist app itself. This approach have some problems:

  • We share styles between Styleguidist and user's component, we use some hacks to isolate Stylegudist styles but sometimes styles still affect each other.
  • We can't implement a nice responsive design preview, because we can't affect media queries in components without resizing the window.

Possible issues of the iframe approach:

  • It could be slower than the current approach.
  • Interaction between Styleguidist and iframes could be more complex.
  • We'll need to add global styles to every iframe instead of adding them once at the Styleguidst root level.

Guia do colaborador

Direção de pesquisa
Pesquise como isolar exemplos de componentes React em iframes, abordando o isolamento de estilo e a prévia de design responsivo sem sacrificar o desempenho. Considere as compensações da comunicação iframe e da injeção de estilo global.
Pilha de tecnologia
javascripttypescriptreact
Domain
frontenddeveloper experience
Tipo Issue
Funcionalidade
DifficultyDificuldade de implementação estimada para um novo contribuidor, de 1 para alterações muito pequenas a 5 para trabalho de nível especializado.
3
Tempo estimadoUm intervalo de tempo aproximado para um colaborador experiente investigar, implementar, testar e preparar um pull request.
Meio dia
Status da atividadeQuão disponível o issue aparece agora: novo, ativo, obsoleto, bloqueado ou aguardando entrada do mantenedor.
Ativo
ClarityCom que clareza o issue explica a mudança esperada, os critérios de aceitação e a próxima etapa.
Claro
Prerequisites
ReactGitiframes
Simpatia para novatosUma pontuação de 1 a 100 que estima o quão acessível este issue é para colaboradores iniciantes.
50