wagtail-enap-designsystem 1.2.1.105__py3-none-any.whl → 1.2.1.107__py3-none-any.whl

enap_designsystem/templates/enap_designsystem/blocks/suap/suap_courses_block.html

@@ -176,35 +176,55 @@
                 showSlide(currentIndex + moveBy);
             });
             
-            // NOVA FUNCIONALIDADE: Scroll horizontal APENAS com trackpad
+            
             carousel.addEventListener('wheel', function(e) {
-                // Responder APENAS ao scroll horizontal (trackpad lateral)
-                if (Math.abs(e.deltaX) > 0 && Math.abs(e.deltaX) > Math.abs(e.deltaY)) {
-                    e.preventDefault(); // Prevenir scroll da página
+                if (Math.abs(e.deltaX) > 0) {
+                    e.preventDefault();
+                    
+                    // Obter posição atual do transform
+                    const currentTransform = carousel.style.transform;
+                    const match = currentTransform.match(/translateX\((-?\d*\.?\d*)px\)/);
+                    let currentOffset = match ? parseFloat(match[1]) : 0;
                     
-                    // Evitar múltiplos scrolls muito rápidos
-                    if (isScrolling) return;
+                    // Aplicar movimento proporcional (ajuste a velocidade aqui)
+                    const scrollMultiplier = 1.2;
+                    const newOffset = currentOffset - (e.deltaX * scrollMultiplier);
                     
-                    isScrolling = true;
+                    // Calcular limites
+                    const maxOffset = 0;
+                    const minOffset = -(maxIndex * (itemWidth + itemsGap));
                     
-                    // Determinar direção do scroll
-                    if (e.deltaX > 0) {
-                        // Scroll para direita - próximo slide
-                        showSlide(currentIndex + 1);
-                    } else {
-                        // Scroll para esquerda - slide anterior
-                        showSlide(currentIndex - 1);
+                    // Aplicar limites com resistência
+                    let finalOffset = newOffset;
+                    
+                    if (newOffset > maxOffset) {
+                        const overscroll = newOffset - maxOffset;
+                        finalOffset = maxOffset + (overscroll * 0.3);
+                    } else if (newOffset < minOffset) {
+                        const overscroll = newOffset - minOffset;
+                        finalOffset = minOffset + (overscroll * 0.3);
                     }
                     
-                    // Resetar flag após um tempo
+                    // Aplicar transform
+                    carousel.style.transition = 'none';
+                    carousel.style.transform = `translateX(${finalOffset}px)`;
+                    
+                    // Atualizar currentIndex baseado na posição
+                    const newIndex = Math.round(Math.abs(finalOffset) / (itemWidth + itemsGap));
+                    currentIndex = Math.max(0, Math.min(newIndex, maxIndex));
+                    
+                    // Atualizar botões
+                    updateNavigationButtons();
+                    
+                    // Snap suave quando parar
                     clearTimeout(scrollTimeout);
                     scrollTimeout = setTimeout(() => {
-                        isScrolling = false;
-                    }, 300);
+                        carousel.style.transition = 'transform 0.3s ease-out';
+                        showSlide(currentIndex);
+                    }, 150);
                 }
-                // Para scroll vertical, não fazer nada - deixar comportamento normal da página
-            }, { passive: false }); // passive: false para permitir preventDefault
-            
+            }, { passive: false });
+                        
             // Touch events - sempre ativados (para dispositivos touch)
             carousel.addEventListener('touchstart', handleStart, { passive: true });
             carousel.addEventListener('touchmove', handleMove, { passive: true });

enap_designsystem/templates/enap_designsystem/blocks/suap/suap_events_block.html

@@ -479,52 +479,48 @@
             showSlide(currentIndex + moveBy);
         });
         
-        // SCROLL FLUIDO com trackpad
+        // SCROLL FLUIDO dinâmico com trackpad
         carousel.addEventListener('wheel', function(e) {
-            // Responder APENAS ao scroll horizontal (trackpad lateral)
-            if (Math.abs(e.deltaX) > 0 && Math.abs(e.deltaX) > Math.abs(e.deltaY)) {
-                e.preventDefault(); // Prevenir scroll da página
+            if (Math.abs(e.deltaX) > 0) {
+                e.preventDefault();
                 
-                // Acumular o scroll para movimento mais fluido
-                scrollAccumulator += e.deltaX * 0.01; // Fator de sensibilidade
+                // Obter posição atual
+                const currentTransform = carousel.style.transform;
+                const match = currentTransform.match(/translateX\((-?\d*\.?\d*)px\)/);
+                let currentOffset = match ? parseFloat(match[1]) : 0;
                 
-                // Calcular nova posição baseada no acumulador
-                const newPosition = currentIndex + scrollAccumulator;
+                // Movimento proporcional ao deltaX
+                const scrollMultiplier = 1.5;
+                const newOffset = currentOffset - (e.deltaX * scrollMultiplier);
                 
-                // Aplicar movimento fluido
-                const clampedPosition = setCarouselPosition(newPosition);
+                // Limites
+                const maxOffset = 0;
+                const minOffset = -(maxIndex * (itemWidth + itemsGap));
                 
-                // Cancelar animação anterior se existir
-                if (scrollAnimationFrame) {
-                    cancelAnimationFrame(scrollAnimationFrame);
+                // Resistência nas bordas
+                let finalOffset = newOffset;
+                if (newOffset > maxOffset) {
+                    finalOffset = maxOffset + ((newOffset - maxOffset) * 0.3);
+                } else if (newOffset < minOffset) {
+                    finalOffset = minOffset + ((newOffset - minOffset) * 0.3);
                 }
                 
-                // Se parou de fazer scroll, fazer snap para o slide mais próximo
-                isScrolling = true;
+                // Aplicar posição
+                carousel.style.transition = 'none';
+                carousel.style.transform = `translateX(${finalOffset}px)`;
+                
+                // Atualizar currentIndex
+                const newIndex = Math.round(Math.abs(finalOffset) / (itemWidth + itemsGap));
+                currentIndex = Math.max(0, Math.min(newIndex, maxIndex));
+                updateNavigationButtons();
+                
+                // Snap quando parar
                 clearTimeout(scrollTimeout);
                 scrollTimeout = setTimeout(() => {
-                    isScrolling = false;
-                    
-                    // Snap para o slide mais próximo
-                    const targetIndex = Math.round(clampedPosition);
-                    currentIndex = targetIndex;
-                    
-                    // Animação suave para o snap
-                    carousel.style.transition = 'transform 0.2s ease-out';
-                    setCarouselPosition(currentIndex);
-                    updateNavigationButtons();
-                    
-                    // Remover transição após a animação
-                    setTimeout(() => {
-                        carousel.style.transition = 'none';
-                    }, 200);
-                    
-                    // Resetar acumulador
-                    scrollAccumulator = 0;
-                }, 150); // Tempo de espera antes do snap
-                
+                    carousel.style.transition = 'transform 0.3s ease-out';
+                    showSlide(currentIndex);
+                }, 150);
             }
-            // Para scroll vertical, não fazer nada - deixar comportamento normal da página
         }, { passive: false });
         
         // Touch e arraste para mobile

enap_designsystem/templates/enap_designsystem/blocks/team_carousel.html

@@ -7,7 +7,7 @@
     <div class="team-container">
         <div class="team-header">
             <h2 class="team-title">{{ value.title }}</h2>
-            <h4 class="team-subtitle">{{ value.description }}</h4>
+            <h3 class="team-subtitle">{{ value.description }}</h3>
         </div>
 
         <div class="team-carousel-wrapper">
@@ -73,6 +73,7 @@
         let currentIndex = 0;
         let startX, moveX, initialPosition;
         let isDragging = false;
+        let snapTimeout; // Para o timeout do snap do trackpad
         
         // Verifica se é dispositivo mobile
         function isMobile() {
@@ -209,6 +210,62 @@
             }
         }
         
+        // FUNCIONALIDADE DE SCROLL COM TRACKPAD (APENAS HORIZONTAL)
+        carousel.addEventListener('wheel', function(e) {
+            // Verifica se há movimento horizontal (trackpad)
+            const hasHorizontalScroll = Math.abs(e.deltaX) > 0;
+            
+            // No mobile, não intercepta o scroll para permitir scroll da página
+            if (isMobile()) return;
+            
+            // Apenas intercepta se há movimento horizontal
+            if (hasHorizontalScroll) {
+                e.preventDefault();
+                
+                // Usa apenas deltaX (movimento horizontal)
+                const deltaValue = e.deltaX;
+                
+                // Obter posição atual do transform
+                const currentTransform = carousel.style.transform;
+                const match = currentTransform.match(/translateX\((-?\d*\.?\d*)px\)/);
+                let currentOffset = match ? parseFloat(match[1]) : 0;
+                
+                // Movimento proporcional
+                const scrollMultiplier = 1.5;
+                const newOffset = currentOffset - (deltaValue * scrollMultiplier);
+                
+                // Calcula os limites baseado nas funções existentes
+                const maxOffset = 0;
+                const itemWidth = getItemWidth();
+                const itemGap = getItemGap();
+                const minOffset = -(getMaxIndex() * (itemWidth + itemGap));
+                
+                // Resistência nas bordas
+                let finalOffset = newOffset;
+                if (newOffset > maxOffset) {
+                    finalOffset = maxOffset + ((newOffset - maxOffset) * 0.3);
+                } else if (newOffset < minOffset) {
+                    finalOffset = minOffset + ((newOffset - minOffset) * 0.3);
+                }
+                
+                // Aplicar posição
+                carousel.style.transition = 'none';
+                carousel.style.transform = `translateX(${finalOffset}px)`;
+                
+                // Atualizar currentIndex baseado na posição
+                const newIndex = Math.round(Math.abs(finalOffset) / (itemWidth + itemGap));
+                currentIndex = Math.max(0, Math.min(newIndex, getMaxIndex()));
+                updateNavigationButtons();
+                
+                // Snap quando parar de rolar
+                clearTimeout(snapTimeout);
+                snapTimeout = setTimeout(() => {
+                    carousel.style.transition = 'transform 0.5s ease-in-out';
+                    showSlide(currentIndex);
+                }, 150);
+            }
+        }, { passive: false });
+        
         // Ajuste quando a tela é redimensionada
         let resizeTimeout;
         window.addEventListener('resize', function() {

enap_designsystem/templates/enap_designsystem/blocks/testimonials_carousel.html

@@ -62,6 +62,7 @@
             let currentIndex = 0;
             let startX, moveX, initialPosition;
             let isDragging = false;
+            let isScrolling = false;
             
             // Verifica se é dispositivo mobile
             function isMobile() {
@@ -75,27 +76,61 @@
                 return 2;
             }
             
-            // Verifica se deve mostrar as setas
+            // NOVA FUNÇÃO: Verifica se há cards à esquerda
+            function hasCardsToLeft() {
+                return currentIndex > 0;
+            }
+            
+            // NOVA FUNÇÃO: Verifica se há cards à direita
+            function hasCardsToRight() {
+                // Método mais simples e confiável
+                return currentIndex < getMaxIndex();
+            }
+            
+            // Verifica se deve mostrar as setas (MELHORADO)
             function shouldShowArrows() {
-                if (isMobile()) return false; // Sempre esconder no mobile
-                return items.length > getVisibleItems(); // Só mostrar se há mais itens que o visível
+                if (isMobile()) return false;
+                return items.length > getVisibleItems();
             }
             
-            // Esconde os botões quando necessário
-            function hideButtonsWhenNeeded() {
+            // Esconde/mostra botões baseado na existência de cards (MELHORADO)
+            function updateArrowVisibility() {
                 if (!shouldShowArrows()) {
                     prevButton.style.setProperty('display', 'none', 'important');
                     nextButton.style.setProperty('display', 'none', 'important');
-                } else {
-                    // Mostrar os botões no desktop quando há mais itens
+                    return;
+                }
+                
+                // Debug: mostra valores no console
+                console.log('Current Index:', currentIndex);
+                console.log('Max Index:', getMaxIndex());
+                console.log('Has Cards Left:', hasCardsToLeft());
+                console.log('Has Cards Right:', hasCardsToRight());
+                
+                // Mostrar/esconder botão anterior baseado se há cards à esquerda
+                if (hasCardsToLeft()) {
                     prevButton.style.removeProperty('display');
+                    prevButton.style.opacity = '1';
+                    prevButton.style.pointerEvents = 'auto';
+                } else {
+                    prevButton.style.opacity = '0';
+                    prevButton.style.pointerEvents = 'none';
+                }
+                
+                // Mostrar/esconder botão próximo baseado se há cards à direita
+                if (hasCardsToRight()) {
                     nextButton.style.removeProperty('display');
+                    nextButton.style.setProperty('opacity', '1', 'important');
+                    nextButton.style.setProperty('display', 'flex', 'important');
+                    nextButton.style.setProperty('pointer-events', 'auto', 'important');
+                } else {
+                    nextButton.style.setProperty('opacity', '0', 'important');
+                    nextButton.style.setProperty('pointer-events', 'none', 'important');
                 }
             }
             
             // Obtém a largura de um item considerando a viewport
             function getItemWidth() {
-                // Em telas muito pequenas, use a largura da viewport menos padding
                 if (window.innerWidth < 480) {
                     return Math.min(items[0].offsetWidth, window.innerWidth * 0.9);
                 }
@@ -103,18 +138,16 @@
             }
             
             function getItemGap() {
-                // Gap ajustável dependendo da tela
                 return window.innerWidth < 768 ? 15 : 25;
             }
             
-            // Calcula o índice máximo com base nos itens visíveis
             function getMaxIndex() {
-                return Math.max(0, items.length - getVisibleItems());
+                const visibleItems = getVisibleItems();
+                return Math.max(0, items.length - visibleItems);
             }
             
-            // Define quantos itens rolar por vez (1 no mobile, 1 no desktop)
             function getScrollAmount() {
-                return 1; // Sempre 1 neste carrossel específico
+                return 1;
             }
             
             // Mostra os slides baseado no índice atual
@@ -125,47 +158,107 @@
                 const offset = currentIndex * (itemWidth + itemGap);
                 
                 carousel.style.transform = `translateX(-${offset}px)`;
-                updateNavigationButtons();
+                updateArrowVisibility(); // Atualizada para nova função
             }
             
-            // Atualiza a visibilidade dos botões de navegação
-            function updateNavigationButtons() {
-                // Se não deve mostrar setas, esconder ambos os botões
-                if (!shouldShowArrows()) {
-                    hideButtonsWhenNeeded();
-                    return;
-                }
+            // NOVA FUNCIONALIDADE: Scroll dinâmico com trackpad/mouse wheel
+            function handleWheel(e) {
+                // Debug: mostra valores do evento
+                console.log('Wheel event:', { deltaX: e.deltaX, deltaY: e.deltaY, shiftKey: e.shiftKey });
                 
-                // No primeiro slide, ocultar o botão anterior
-                if (currentIndex === 0) {
-                    prevButton.style.opacity = '0';
-                    prevButton.style.pointerEvents = 'none';
-                } else {
-                    prevButton.style.opacity = '1';
-                    prevButton.style.pointerEvents = 'auto';
+                let deltaX = e.deltaX;
+                
+                // Para mouse wheel: usar Shift + wheel (deltaY vira deltaX)
+                if (e.shiftKey && Math.abs(e.deltaY) > Math.abs(e.deltaX)) {
+                    deltaX = e.deltaY;
                 }
                 
-                // No último slide, ocultar o botão próximo
-                if (currentIndex >= getMaxIndex()) {
-                    nextButton.style.setProperty('opacity', '0');
-                    nextButton.style.setProperty('pointer-events', 'none');
-                } else {
-                    nextButton.style.setProperty('opacity', '1', 'important');
-                    nextButton.style.setProperty('display', 'flex', 'important');
-                    nextButton.style.setProperty('pointer-events', 'auto', 'important');
+                // Detectar qualquer scroll horizontal (sem threshold mínimo)
+                if (Math.abs(deltaX) > 0) {
+                    e.preventDefault();
+                    e.stopPropagation();
+                    
+                    // Obter posição atual do transform
+                    const currentTransform = carousel.style.transform;
+                    const match = currentTransform.match(/translateX\((-?\d*\.?\d*)px\)/);
+                    let currentOffset = match ? parseFloat(match[1]) : 0;
+                    
+                    // Aplicar o movimento proporcional ao deltaX
+                    // Multiplicador para controlar a velocidade (ajuste conforme necessário)
+                    const scrollMultiplier = 1.5;
+                    const newOffset = currentOffset - (deltaX * scrollMultiplier);
+                    
+                    // Calcular limites
+                    const maxOffset = 0; // Limite esquerdo
+                    const itemWidth = getItemWidth();
+                    const itemGap = getItemGap();
+                    const totalItems = items.length;
+                    const visibleItems = getVisibleItems();
+                    const minOffset = -((totalItems - visibleItems) * (itemWidth + itemGap));
+                    
+                    // Aplicar limites com efeito de "elastic" nas bordas
+                    let finalOffset = newOffset;
+                    
+                    if (newOffset > maxOffset) {
+                        // Resistência ao puxar além do início
+                        const overscroll = newOffset - maxOffset;
+                        finalOffset = maxOffset + (overscroll * 0.3);
+                    } else if (newOffset < minOffset) {
+                        // Resistência ao puxar além do fim
+                        const overscroll = newOffset - minOffset;
+                        finalOffset = minOffset + (overscroll * 0.3);
+                    }
+                    
+                    // Aplicar o transform
+                    carousel.style.transition = 'none';
+                    carousel.style.transform = `translateX(${finalOffset}px)`;
+                    
+                    // Atualizar currentIndex baseado na posição
+                    const newIndex = Math.round(Math.abs(finalOffset) / (itemWidth + itemGap));
+                    currentIndex = Math.max(0, Math.min(newIndex, getMaxIndex()));
+                    
+                    // Atualizar setas baseado na nova posição
+                    updateArrowVisibility();
+                    
+                    // Aplicar snap suave quando parar de rolar
+                    clearTimeout(window.snapTimeout);
+                    window.snapTimeout = setTimeout(() => {
+                        carousel.style.transition = 'transform 0.3s ease-out';
+                        showSlide(currentIndex);
+                    }, 150);
+                    
+                    console.log('Smooth scroll:', { 
+                        deltaX, 
+                        currentOffset, 
+                        newOffset: finalOffset,
+                        currentIndex 
+                    });
                 }
             }
             
-            // Eventos dos botões
+            // Eventos dos botões (mantidos)
             prevButton.addEventListener('click', function() {
-                showSlide(currentIndex - getScrollAmount());
+                if (hasCardsToLeft()) {
+                    showSlide(currentIndex - getScrollAmount());
+                }
             });
             
             nextButton.addEventListener('click', function() {
-                showSlide(currentIndex + getScrollAmount());
+                if (hasCardsToRight()) {
+                    showSlide(currentIndex + getScrollAmount());
+                }
             });
             
-            // Eventos de arrastar
+            // NOVO: Adicionar evento de scroll do mouse/trackpad
+            carousel.addEventListener('wheel', handleWheel, { passive: false });
+            
+            // Adicionar também no container para capturar melhor
+            const carouselContainer = carousel.parentElement;
+            if (carouselContainer) {
+                carouselContainer.addEventListener('wheel', handleWheel, { passive: false });
+            }
+            
+            // Eventos de arrastar (mantidos com pequenos ajustes)
             carousel.addEventListener('mousedown', handleStart);
             carousel.addEventListener('touchstart', handleStart, { passive: true });
             
@@ -182,8 +275,6 @@
                 initialPosition = currentIndex * (getItemWidth() + getItemGap());
                 carousel.style.transition = 'none';
                 
-                // Prevenir comportamento padrão para evitar scrolling da página
-                // mas apenas se for desktop
                 if (e.type !== 'touchstart') {
                     e.preventDefault();
                 }
@@ -192,26 +283,21 @@
             function handleMove(e) {
                 if (!isDragging) return;
                 
-                // Atualizar a posição atual do toque/mouse
                 moveX = e.type === 'touchmove' ? e.touches[0].clientX : e.clientX;
                 const diff = moveX - startX;
                 
-                // Limitar o arrasto para evitar exceder os limites
                 const maxDrag = getItemWidth() * (items.length - getVisibleItems());
                 let newPosition = diff - initialPosition;
                 
-                // Adicionar resistência ao arrastar além dos limites
                 if (newPosition > 0) {
-                    newPosition = newPosition * 0.3; // Resistência ao puxar para a direita no início
+                    newPosition = newPosition * 0.3;
                 } else if (newPosition < -maxDrag) {
                     const overDrag = newPosition + maxDrag;
-                    newPosition = -maxDrag + (overDrag * 0.3); // Resistência ao puxar para a esquerda no final
+                    newPosition = -maxDrag + (overDrag * 0.3);
                 }
                 
                 carousel.style.transform = `translateX(${newPosition}px)`;
                 
-                // Prevenir comportamento padrão para evitar scrolling da página
-                // mas apenas se for desktop
                 if (e.type !== 'touchmove') {
                     e.preventDefault();
                 }
@@ -224,17 +310,16 @@
                 carousel.style.transition = 'transform 0.3s ease-in-out';
                 
                 if (!moveX) {
-                    // Se não houve movimento, apenas restore
                     showSlide(currentIndex);
                     return;
                 }
                 
                 const diff = moveX - startX;
-                const threshold = getItemWidth() / 3; // 1/3 da largura para mudar de slide
+                const threshold = getItemWidth() / 3;
                 
-                if (diff > threshold) {
+                if (diff > threshold && hasCardsToLeft()) {
                     showSlide(currentIndex - getScrollAmount());
-                } else if (diff < -threshold) {
+                } else if (diff < -threshold && hasCardsToRight()) {
                     showSlide(currentIndex + getScrollAmount());
                 } else {
                     showSlide(currentIndex);
@@ -246,19 +331,15 @@
             window.addEventListener('resize', function() {
                 clearTimeout(resizeTimeout);
                 resizeTimeout = setTimeout(function() {
-                    // Atualiza a visibilidade dos botões com base no novo tamanho da tela
-                    hideButtonsWhenNeeded();
+                    updateArrowVisibility(); // Usar nova função
                     
-                    // Verifica se o índice atual ainda é válido com o novo tamanho
                     if (currentIndex > getMaxIndex()) {
                         currentIndex = getMaxIndex();
                     }
                     
-                    // Reajustar tamanhos baseados na nova largura da tela
-                    carousel.style.transition = 'none'; // Desativa transição para reposicionamento imediato
+                    carousel.style.transition = 'none';
                     showSlide(currentIndex);
                     
-                    // Restaura a transição após o reposicionamento
                     setTimeout(() => {
                         carousel.style.transition = 'transform 0.3s ease-in-out';
                     }, 50);
@@ -268,22 +349,18 @@
             // Inicializar o carrossel
             showSlide(0);
             
-            // Adiciona uma verificação adicional após carregamento completo
+            // Verificação adicional após carregamento
             setTimeout(function() {
-                // Garante que os botões estejam configurados corretamente
-                hideButtonsWhenNeeded();
+                updateArrowVisibility();
                 
-                // Verificar se deve mostrar as setas e configurar adequadamente
                 if (shouldShowArrows()) {
-                    updateNavigationButtons();
+                    updateArrowVisibility(); // Usar nova função
                 }
                 
-                // Verificar novamente se os elementos têm tamanho correto
                 showSlide(currentIndex);
             }, 500);
         }
         
-        // Iniciar carrossel com um pequeno atraso para garantir que todos os elementos estejam carregados
         setTimeout(initCarousel, 100);
     });
 </script>

{wagtail_enap_designsystem-1.2.1.105.dist-info → wagtail_enap_designsystem-1.2.1.107.dist-info}/METADATA

@@ -1,6 +1,6 @@
 Metadata-Version: 2.4
 Name: wagtail-enap-designsystem
-Version: 1.2.1.105
+Version: 1.2.1.107
 Summary: Módulo de componentes utilizado nos portais ENAP, desenvolvido com Wagtail + CodeRedCMS
 Author: Renan Campos
 Author-email: renan.oliveira@enap.gov.br