Permission Section - Copy this React, Tailwind Component to your project
"Crie um componente em React que implemente a funcionalidade de rolagem para exibir uma sequência de imagens (frames) de forma semelhante ao elemento <div class="scrollMotion-wrapper"> encontrado no site da PlayStation. O componente deve: Exibir uma imagem correspondente ao índice atual com base na rolagem do mouse. Impedir a rolagem normal da página enquanto o scroll é utilizado para passar pelas imagens, mas permitir que a rolagem normal seja habilitada novamente ao atingir o último frame. Reiniciar a contagem dos frames quando o usuário voltar para o topo da tela, permitindo que a rolagem inverta a direção e passe dos frames do último para o primeiro. Utilizar um elemento <canvas> para renderizar as imagens de maneira eficiente. Implementar um fator de escala que controle a velocidade de rolagem para cada frame. Incluir uma funcionalidade de acessibilidade que permita ao usuário desativar o movimento de rolagem. Garantir que as imagens sejam carregadas dinamicamente com base na quantidade total de frames. As imagens devem ser carregadas a partir de URLs dinâmicas, onde o índice da imagem pode ser formatado como 'ezgif-frame-IMAGE_INDEX'. Certifique-se de que o componente é responsivo e se adapta ao tamanho da tela."
