Widget para ser incluso exclusicamente na página de detalhes do produto.

{% set html = html.productDetailSKU(sku, extra.id) %}
{%
	set setTagsEcommerceProductDetail = store.setTagsEcommerceProductDetail({
        id: extra.id,
		sku: sku,
		name: html.matriz.produto,
		quantity: 1,
		price: html.matriz.valor_cliente.valor,
	})
%}

<div id="produto-sku" data-sku="{{ sku }}" data-widget="produto-sku-html.html" data-loadingwhenchange="true">
	{{ html.googletags }}
    {{ html.pontoswb }}
	{{ html.valor }}
	{{ html.desconto }}
	{{ html.compra_minima }}
	{{ html.parcelamento }}
	{{ html.contador_regressivo }}
	{{ html.disponibilidade }}
	{{ html.valor_atacado }}
	{{ html.ultimas_unidades }}
	{{ html.frete_gratis }}
	{{ html.tabela_medidas }}
    {{ html.info_assinatura }}

	<div class="estoque">
		{{ html.grade }}
		{{ html.campos_adicionais }}
	</div>

	<div class="botoes">
		{{ html.botao_carrinho }}
		{{ html.calculo_frete }}
	</div>
	
	{{ html.caracteristicas }}
</div>

<script>
	var _cor_id = '{{ html.matriz.cor.id }}';
	$(function(){
		if(productPhotosColorSelected != _cor_id){
			mobileLoadPhotosByColor(_cor_id);
			productLoadPhotosByColor({
				cor_id: _cor_id,
				tipo_fotos: '{{ html.matriz.tipo_fotos }}',
			});
			productPhotosColorSelected = _cor_id;
		}
		
		{% if html.matriz.grade_tipo == 'grid' %}
		$('#geral, #mymodal').on('click', '.grade .l .cor .item', function(){
			let _th = $(this);
			let color = _th.data('cor');
			productLoadPhotosByColor({
				cor_id: color,
				tipo_fotos: '{{ html.matriz.tipo_fotos }}',
			});
			mobileLoadPhotosByColor(color);
		});
		{% endif %}
	});
</script>

{{ setTagsEcommerceProductDetail }}