# Apollion

Estes são os componentes da implementação do Apollion Design System, a solução completa de UI da Captalys. Você pode encontrar a documentação completa [neste link](https://apollion-legion.captalysplatform.io/docs/getting-started--page).

## Tecnologias

- [Lit](https://lit.dev/)
- [UnoCSS](https://github.com/unocss/unocss)

## Iniciando

### Instalação

Na pasta raiz do seu projeto, execute o seguinte comando:

```bash
$ npm install --save @apollion-ds/web-components
# ou
$ yarn add @apollion-ds/web-components
```

### Instalação de nossos ícones

Esta biblioteca fornece nossos ícones que são utilizados nos componentes.

```bash
$ npm install --save @apollion-ds/icons
# ou
$ yarn add @apollion-ds/icons
```

após a instalação dos ícones é necessário importa-lo na raiz do seu app raiz ex:

```jsx
// ~/app.tsx|jsx|js
import '@apollion-ds/icons';
```

### Instalação para React

Esta instalação conta com tratamentos exclusivos para react para optimizar o desenvolvimento.

```bash
$ npm install --save @apollion-ds/react
# ou
$ yarn add @apollion-ds/react
```

após a instalação dos ícones é necessário importa-lo na raiz do seu app raiz ex:

```jsx
// ~/app.tsx|jsx|js
import '@apollion-ds/icons';
```

### Utilização

Para que os componentes funcionem corretamente é necessário fazer a instalação dos `global-tokens.css`:

```html
/* default */ <link href="/node_modules/@apollion-ds/web-components/tokens.css" rel="stylesheet" />
```

Por padrão oferecemos um arquivo com a configuração de todos os nossos tokens, mas você pode configurar o seu próprio,
mas lembre-se de que as chaves são imutáveis, somente os valores podem ser alterados.

## Licença

© 2022 Captalys - Todos os direitos reservados.