ThumborUrlBuilder - Yampi Developer Portal

Classe que constrói URLs de imagem otimizadas pelo serviço Thumbor da Yampi. Quando o Thumbor está desabilitado (window.Yampi.thumbor.enabled === false), retorna a URL original sem modificação. Na maioria dos casos, use o método $thumborize do mixin helpers em vez de instanciar a classe diretamente.

Uso via helpers (recomendado)

// Em qualquer componente (via mixin helpers)
this.$thumborize(imageUrl, { resize: '300x300', smart: 'smart' });

Uso direto

import ThumborUrlBuilder from '@/modules/thumborUrlBuilder';

const url = new ThumborUrlBuilder('https://cdn.example.com/foto.jpg', {
    resize: '600x400',
    smart: 'smart',
    fitIn: 'fit-in',
}).generate();

Construtor

new ThumborUrlBuilder(url: String, params?: Object)

Os params são mesclados com window.Yampi.thumbor.default, que contém as configurações padrão da loja.

Parâmetros

Parâmetro	Tipo	Descrição
`trim`	`String`	Remove bordas de cor uniforme da imagem.
`fitIn`	`String`	Redimensiona mantendo proporção dentro das dimensões. Use `'fit-in'`.
`crop`	`String`	Recorte manual no formato `AxB:CxD`.
`resize`	`String`	Dimensões no formato `LARGURAxALTURA` (ex: `'300x300'`). Use `0` para proporcional (ex: `'300x0'`).
`hAlign`	`String`	Alinhamento horizontal: `'left'`, `'center'`, `'right'`.
`vAlign`	`String`	Alinhamento vertical: `'top'`, `'middle'`, `'bottom'`.
`smart`	`String`	Detecção inteligente de foco. Use `'smart'`.
`filters`	`Array`	Filtros adicionais do Thumbor (ex: `['quality(80)', 'format(webp)']`).

Métodos

Método	Retorno	Descrição
`generate()`	`String`	Retorna a URL final do Thumbor. Se desabilitado, retorna a URL original.
`addFilter(filter: String)`	`this`	Adiciona um filtro Thumbor dinamicamente. Encadeável.

⌘I