# Guia de contribuição
Se precisar de algum componente novo, ou precisar adicionar algo novo em algum componente, sinta-se à vontade para contribuir com o projeto.
A equipe de UX é a responsável pelo projeto, então para que sua alteração vá para produção é necessário passar pela aprovação de algum membro do time. Além disso, em alguns momentos é interessante adicionar o componente no Design System, já em outros é mais interessante criar um componente no próprio projeto.
Esta página busca esclarecer o que faz parte do design system e o que não faz.
# Quando contribuir?
O Design System é um projeto utilizado em diversos produtos da empresa. Por esse motivo, buscamos deixar os componentes mais puros possível, sem adicionar código ou uma regra de negócio que possa ser específica de algum projeto e sem manter um estado local.
As seguintes situações indicam que você deve alterar o Design System:
- Precisa criar um componente que não tem no Design System e está no protótipo / documentação do Figma;
- Precisa de uma variação do componente que hoje o componente não atende;
- Precisa que o comportamento de um componente visual permita ficar igual ao protótipo feito;
Algumas perguntas podem ajudar a entender se deve ser criado um Pull Request para alteração do Design System, ou se o componente deve ser criado no projeto como um componente específico do projeto:
- Esse componente pode ser útil para outros projetos?
- A variação que eu preciso, é genérica e pode ser reutilizada?
- A minha alteração mantém compatibilidade com a versão anterior?
Se suas perguntas foram sim para os itens anteriores, é bastante interessante que o componente ou a variação do componente seja adicionado no Design System.
# Quando não contribuir?
Não deve ser feito um Pull Request quando a alteração que você estiver querendo adicionar seja específica do projeto.
Perguntas que podem ajudar a entender se não deve criar um Pull Request:
- Esse componente contém regras/propriedades específicas do meu projeto?
- Esse componente precisa fazer chamadas para alguma API?
- O componente precisa de validações dentro dele que não são genéricas ou customizáveis?
# Base do Design System
A base de design do design system é o Material Design (opens new window) da Google. Então todos os componentes devem ser criados utilizando esse padrão.
Para a implementação do Material, utilizamos a biblioteca do Vue chamada Vuetify. Então o Design System todo é baseado no Vuetify (opens new window). Então para contribuir, é interessante que se tenha alguma familiaridade com a biblioteca. Alguns dos componentes são apenas um wrapper do componente do Vuetify com alguma customização por cima.
Dessa maneira, dentro do design system é possível utilizar todos os componentes do vuetify. Podemos customizar o vuetify entre outras coisas.
O Design System não se limita em usar somente o Vuetify. Se fizer sentido para o componente em desenvolvimento, pode ser feito "from scratch, ou mesmo em casos específicos, adicionada outra biblioteca para permitir a implementação do componente.
# Variações de componentes
Ao criar variações de um componente, colocar na balança a decisão entre criar uma variação com prop ou criar um componente diferente. Se o componente tem uma responsabilidade diferente, deve ser um componente diferente.