> ## Documentation Index
> Fetch the complete documentation index at: https://docs.yampi.com.br/llms.txt
> Use this file to discover all available pages before exploring further.

# Filtros e Funções

> Filtros e funções disponíveis no Twig

## Filtros

Filtros são operações simples que formatam uma variável ou expressão para serem exibidos para o usuário.

### `assets_url`

Gera um link completo para um asset(Imagem, arquivo JS, etc.)

```twig theme={"system"}
{% assets_url(string): string %}
```

#### Parâmetros

| Parâmetro | Tipo     | Descrição |
| :-------- | :------- | :-------- |
| `string`  | `string` |           |

#### Retorno

Tipo: `string`

### `bool_text`

Renderiza os textos `true` ou `false` dependendo da condição informada

```twig theme={"system"}
{% bool_text(condition): string %}
```

#### Parâmetros

| Parâmetro   | Tipo     | Descrição |
| :---------- | :------- | :-------- |
| `condition` | `string` |           |

#### Retorno

Tipo: `string`

Textos `true` ou `false`

### `boolean`

Converte um valor em texto para booleano

```twig theme={"system"}
{% boolean(value): bool %}
```

#### Parâmetros

| Parâmetro | Tipo     | Descrição |
| :-------- | :------- | :-------- |
| `value`   | `string` |           |

#### Retorno

Tipo: `bool`

### `components_url`

Gera um link completo para um componente

```twig theme={"system"}
{% components_url(string): string %}
```

#### Parâmetros

| Parâmetro | Tipo     | Descrição |
| :-------- | :------- | :-------- |
| `string`  | `string` |           |

#### Retorno

Tipo: `string`

### `font_link`

Gera links para incorporação do Google Fonts para a fonte especificada com todos os pesos conhecidos

```twig theme={"system"}
{% font_link(font): string %}
```

#### Exemplo de uso

```twig theme={"system"}
<link href="{{ nomeDaFonte | font_link }}" rel="stylesheet">
// https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700;900&display=swap
```

#### Parâmetros

| Parâmetro | Tipo     | Descrição                 |
| :-------- | :------- | :------------------------ |
| `font`    | `string` | Nome da fonte (ex: Inter) |

#### Retorno

Tipo: `string`

Link do Google Fonts

### `json_decode`

Leitura de uma string JSON

```twig theme={"system"}
{% json_decode(value): array %}
```

#### Parâmetros

| Parâmetro | Tipo     | Descrição |
| :-------- | :------- | :-------- |
| `value`   | `string` |           |

#### Retorno

Tipo: `array`

### `mask`

Formata um texto seguindo a máscara informada

```twig theme={"system"}
{% mask(string, mask): string %}
```

#### Exemplo de uso

```twig theme={"system"}
{{ cep | mask('#####-###') }}
// 12345-678
```

#### Parâmetros

| Parâmetro | Tipo     | Descrição                                        |
| :-------- | :------- | :----------------------------------------------- |
| `string`  | `string` | Texto a ser formatado                            |
| `mask`    | `string` | Máscara (utilize `#` para representar um dígito) |

#### Retorno

Tipo: `string`

### `only_numbers`

Remove todos os caracteres não-numéricos de um texto

```twig theme={"system"}
{% only_numbers(string): string %}
```

#### Parâmetros

| Parâmetro | Tipo     | Descrição |
| :-------- | :------- | :-------- |
| `string`  | `string` |           |

#### Retorno

Tipo: `string`

### `vendor_url`

Gera um link completo para um arquivo estático

```twig theme={"system"}
{% vendor_url(file): string %}
```

#### Exemplo de uso

```twig theme={"system"}
<link rel="stylesheet" href="{{ '/css/style.css' | vendor_url }}" media="screen">
```

#### Parâmetros

| Parâmetro | Tipo     | Descrição                |
| :-------- | :------- | :----------------------- |
| `file`    | `string` | Nome do arquivo estático |

#### Retorno

Tipo: `string`

URL completa para o arquivo

### `youtube_url`

Gera links para incorporar vídeos do YouTube, junto com uma thumbnail

```twig theme={"system"}
{% youtube_url(url): array %}
```

#### Parâmetros

| Parâmetro | Tipo     | Descrição |
| :-------- | :------- | :-------- |
| `url`     | `string` |           |

#### Retorno

Tipo: `array`

Um array com os campos `video` com o link de embed do vídeo e `thumbnail` com o link da thumb

## Funções

Funções podem ser usadas para executar cálculos ou ações mais complexas que filtros, retornando valores mais elaborados
ou manipulando dados de uma maneira mais específica.

### `button_bg_color`

Retorna a cor para um botão

```twig theme={"system"}
{% button_bg_color(type, color): string %}
```

#### Parâmetros

| Parâmetro | Tipo     | Descrição                           |
| :-------- | :------- | :---------------------------------- |
| `type`    | `string` | Tipo da cor (aceita apenas `solid`) |
| `color`   | `string` | Cor desejada                        |

#### Retorno

Tipo: `string`

A cor informada se `$type` for `solid` ou `transparent` senão

### `calculate_colors_contrast`

Dados as luminancias relativas das cores $primary_color e $secondary\_color, calcula qual o contraste entre elas
seguindo o guia: [https://www.accessibility-developer-guide.com/knowledge/colours-and-contrast/how-to-calculate/#the-formula](https://www.accessibility-developer-guide.com/knowledge/colours-and-contrast/how-to-calculate/#the-formula)

```twig theme={"system"}
{% calculate_colors_contrast(primary_color_luminance, secondary_color_luminance): float %}
```

#### Parâmetros

| Parâmetro                   | Tipo     | Descrição |
| :-------------------------- | :------- | :-------- |
| `primary_color_luminance`   | `string` |           |
| `secondary_color_luminance` | `float`  |           |

#### Retorno

Tipo: `float`

### `color_is_light`

Verifica se a cor é clara (`true`) ou escura (`false`)

```twig theme={"system"}
{% color_is_light(color): bool %}
```

#### Exemplo de uso

```twig theme={"system"}
<div class="{{ color_is_light(background_color) ? '-light' : '-dark' }}">
```

#### Parâmetros

| Parâmetro | Tipo     | Descrição                  |
| :-------- | :------- | :------------------------- |
| `color`   | `string` | Cor em formato hexadecimal |

#### Retorno

Tipo: `bool`

### `font_weight`

Retorna o valor do `font-weight` de uma determinada fonte

```twig theme={"system"}
{% font_weight(font, weight): int %}
```

#### Parâmetros

| Parâmetro | Tipo     | Descrição                                                     |
| :-------- | :------- | :------------------------------------------------------------ |
| `font`    | `string` | Nome da fonte                                                 |
| `weight`  | `string` | Variação da fonte (`regular`, `medium`, `bold`, `black`, etc) |

#### Retorno

Tipo: `int|null`

### `generate_seo`

Gera as tags necessárias para o SEO da página

```twig theme={"system"}
{% generate_seo(): string %}
```

#### Retorno

Tipo: `string`

### `get_contrasting_color`

Determina qual cor entre $default_color e $alternative\_color contrasta mais a cor \$primary\_color

```twig theme={"system"}
{% get_contrasting_color(primary_color, default_color, alternative_color): string %}
```

#### Parâmetros

| Parâmetro           | Tipo     | Descrição |
| :------------------ | :------- | :-------- |
| `primary_color`     | `string` |           |
| `default_color`     | `string` |           |
| `alternative_color` | `string` |           |

#### Retorno

Tipo: `string`

### `get_section_file`

Retorna o arquivo da respectiva seção

```twig theme={"system"}
{% get_section_file(section, page): string %}
```

#### Exemplo de uso

```twig theme={"system"}
{{ get_section_file('main_product_content') }}
```

#### Parâmetros

| Parâmetro | Tipo     | Descrição |
| :-------- | :------- | :-------- |
| `section` | `string` |           |
| `page`    | `string` |           |

#### Retorno

Tipo: `string`

### `hex_to_rgb`

Converte um código em hexa para RGB

```twig theme={"system"}
{% hex_to_rgb(hex): string %}
```

#### Exemplo de uso

```twig theme={"system"}
{% hex_to_rgb("#000000") %}
"0, 0, 0"

{% hex_to_rgb("#ffffff") %}
"255, 255, 255"
```

#### Parâmetros

| Parâmetro | Tipo     | Descrição   |
| :-------- | :------- | :---------- |
| `hex`     | `string` | Código hexa |

#### Retorno

Tipo: `string`

Código RGB

### `hex_to_rgba`

Converte uma cor hexadecimal em RGBA

```twig theme={"system"}
{% hex_to_rgba(hex, opacity): string %}
```

#### Exemplo de uso

```twig theme={"system"}
{% hex_to_rgba("#000000", 0.5) %}
"0, 0, 0, 0.5"
```

#### Parâmetros

| Parâmetro | Tipo     | Descrição                        |
| :-------- | :------- | :------------------------------- |
| `hex`     | `string` | Cor em hexadecimal               |
| `opacity` | `float`  | Opacidade desejada (entre 0 e 1) |

#### Retorno

Tipo: `string`

RGBA calculado

### `is_color_contrasting`

Calcula se as cores $primary_color e $secondary\_color contrastam, dado um limite default de 10.

```twig theme={"system"}
{% is_color_contrasting(primary_color, secondary_color, threshold): bool %}
```

#### Parâmetros

| Parâmetro         | Tipo     | Descrição |
| :---------------- | :------- | :-------- |
| `primary_color`   | `string` |           |
| `secondary_color` | `float`  |           |

#### Retorno

Tipo: `bool`

### `mix`

Retorna o caminho para um arquivo estático a ser compilado

```twig theme={"system"}
{% mix(path): string %}
```

#### Parâmetros

| Parâmetro | Tipo     | Descrição |
| :-------- | :------- | :-------- |
| `path`    | `string` |           |

#### Retorno

Tipo: `string`

### `relative_luminance`

Calcula a luminância relativa de uma cor, de acordo com a especificação em
[https://www.w3.org/TR/WCAG20/#relativeluminancedef](https://www.w3.org/TR/WCAG20/#relativeluminancedef)

```twig theme={"system"}
{% relative_luminance(hex_color): float %}
```

#### Parâmetros

| Parâmetro   | Tipo     | Descrição |
| :---------- | :------- | :-------- |
| `hex_color` | `string` |           |

#### Retorno

Tipo: `float`

### `social_media_fa`

```twig theme={"system"}
{% social_media_fa(mediaUrl): string %}
```

#### Parâmetros

| Parâmetro  | Tipo     | Descrição |
| :--------- | :------- | :-------- |
| `mediaUrl` | `string` |           |

#### Retorno

Tipo: `string`

### `strip_mustache`

Retira tags específicas da engine de templates Mustache

```twig theme={"system"}
{% strip_mustache(string): string %}
```

#### Parâmetros

| Parâmetro | Tipo     | Descrição |
| :-------- | :------- | :-------- |
| `string`  | `string` |           |

#### Retorno

Tipo: `string`

### `thumborize`

Gera uma thumbnail para uma determinada imagem

```twig theme={"system"}
{% thumborize(url, params): string %}
```

#### Exemplo de uso

```twig theme={"system"}
<img src="{{ thumborize(imageUrl, {"resize": "300x300"}) }}">
```

#### Parâmetros

| Parâmetro | Tipo     | Descrição                                                  |
| :-------- | :------- | :--------------------------------------------------------- |
| `url`     | `string` | URL da imagem                                              |
| `params`  | `array`  | Parâmetros opcionais (para redimensionamento, por exemplo) |

#### Retorno

Tipo: `string`

### `type_border_radius`

Retorna o `border-radius` em pixels para determinados formatos

```twig theme={"system"}
{% type_border_radius(type): string %}
```

#### Parâmetros

| Parâmetro | Tipo     | Descrição                     |
| :-------- | :------- | :---------------------------- |
| `type`    | `string` | `square`, `rounded` ou `pill` |

#### Retorno

Tipo: `string`

### `vuetify`

Retorna uma propriedade a partir do array informado

```twig theme={"system"}
{% vuetify(array, varName, path, useMustacheSyntax): string %}
```

#### Exemplo de uso

```twig theme={"system"}
{{ vuetify(product, 'product', 'name') }}
```

#### Parâmetros

| Parâmetro           | Tipo     | Descrição |
| :------------------ | :------- | :-------- |
| `array`             | `array`  |           |
| `varName`           | `string` |           |
| `path`              | `string` |           |
| `useMustacheSyntax` | `bool`   |           |

#### Retorno

Tipo: `string`