Ciano

O Ciano é um conjunto de componentes UI projetado para ser fácil de usar e eficiente para a equipe de tecnologia do Grupo Mateus. Ciano promete ajudar na criação de aplicativos de alta qualidade com agilidade e simplicidade. Ao utilizar o Ciano, a equipe poderá economizar tempo e recursos, ao mesmo tempo em que oferece uma experiência de usuário consistente e atraente.

Comandos disponíveis

Aqui estão os comandos disponíveis para gerenciamento do projeto:

Gerar release

• yarn build: Compila o projeto para produção.

Testes

• yarn test: Executa testes de unidade com Jest.

Validação e formatação de código

• yarn stylelint: Verifica se o estilo CSS/SCSS do projeto está de acordo com as configurações definidas no arquivo .stylelintrc.json.

• yarn tslint: Verifica se o TypeScript do projeto está de acordo com as configurações definidas no arquivo tslint.json.

• yarn format: Aplica formatação automática ao código do projeto, com base nas configurações de Prettier.

• yarn format:check: Verifica se o código do projeto está de acordo com as configurações de Prettier.

Documentação

• yarn compodoc:build: Compila a documentação da API do projeto, utilizando Compodoc.

• yarn compodoc:build-and-serve: Compila e inicia o servidor da documentação da API do projeto, utilizando Compodoc.

• yarn compodoc:serve: Inicia o servidor da documentação da API do projeto, utilizando Compodoc.

Quer colaborar?

Para desenvolver e testar o Ciano localmente, você precisa seguir os seguintes passos:

Acessar o diretório do ciano e rodar o comando:

Para gerar a distribuição e fazer monitoramento de modificações:

yarn watch

Em seguida, fazer link do diretório de distribuição:

cd dist/
yarn link

Isso irá adicionar um link direto para o Ciano que ficará disponível para uso externo via uso do comando yarn link ciano.

No projeto que irá utilizar o Ciano, adicione "preserveSymlinks": true no arquivo angular.json:

architect": {
  "build": {
    "builder": "@angular-devkit/build-angular:browser",
    "options": {
      ...
      "preserveSymlinks": true, // <---------------------
      ...
    },

Em seguida, faça o link do ciano no projeto que deseja utilizar:

yarn link ciano

Pronto, a partir de agora a biblioteca estará disponível para uso e desenvolvimento local.

Para importar os estilos do Ciano, adicione a seguinte linha do arquivo angular.json

"build": {
  "builder": "@angular-devkit/build-angular:browser",
  "options": {
    ...
    "styles": [
      ...
      "ciano/styles/main.scss" // <-------------------
    ],
    ...
  },

E pronto, o Ciano já pode ser consumido através aplicação.