Skip to main content
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âmetroTipoDescrição
trimStringRemove bordas de cor uniforme da imagem.
fitInStringRedimensiona mantendo proporção dentro das dimensões. Use 'fit-in'.
cropStringRecorte manual no formato AxB:CxD.
resizeStringDimensões no formato LARGURAxALTURA (ex: '300x300'). Use 0 para proporcional (ex: '300x0').
hAlignStringAlinhamento horizontal: 'left', 'center', 'right'.
vAlignStringAlinhamento vertical: 'top', 'middle', 'bottom'.
smartStringDetecção inteligente de foco. Use 'smart'.
filtersArrayFiltros adicionais do Thumbor (ex: ['quality(80)', 'format(webp)']).

Métodos

MétodoRetornoDescrição
generate()StringRetorna a URL final do Thumbor. Se desabilitado, retorna a URL original.
addFilter(filter: String)thisAdiciona um filtro Thumbor dinamicamente. Encadeável.