Human Request: Autocomplete de Páginas em Galerias, Ajuste do Menu Horizontal e Preparação Final de Release (req-025)

Esta especificação define o lote de trabalho req-025 (BATCH-025) para o Engenheiro Executor. O escopo abrange a incorporação do buscador AJAX com autocomplete de páginas na curadoria individual de imagens de galerias, correção de links inativos no widget de galeria, alinhamento da seta indicadora de submenu no navbar, ampliação das miniaturas de imagem curadas, e a atualização final dos arquivos de documentação e pipeline de CI/CD para o lançamento da versão 2.8.0.

1. Contexto e Requisitos

1.1 Autocomplete de Páginas em Galerias

• Na curadoria de imagens, ao configurar um link do tipo Página, o painel atualmente exibe um dropdown <select> simples com todas as páginas do site. Para sites com grande volume de páginas, isso é inviável.

• Deve-se replicar o comportamento do módulo Menus: ao selecionar o tipo de link Página, exibir dinamicamente o filtro de tipo de página (Página, Sistema, Ambos) e um input de busca que faz autocomplete AJAX a partir do servidor.

• Como cada item da lista curada é dinâmico e existem múltiplas linhas abertas na curadoria, os elementos (inputs, checkboxes, listas de sugestão) devem ser diferenciados via classes ou IDs contendo o id único do item para evitar conflitos de seleção jQuery.

• Vincular os endpoints AJAX de busca (pages-search) e hidratação (pages-fetch) no controlador PHP do módulo de galerias.

1.2 Links Inativos nas Galerias

• No widget público e no previewer, as imagens da galeria estão sendo envolvidas por tags <a>. Se o usuário não configurou nenhum link (tipo 'nenhum'), o cursor do mouse ainda muda para ponteiro ("dedinho") e as imagens parecem clicáveis.

• Quando o link não estiver configurado (link_type === 'nenhum'), a imagem não deve disparar eventos de clique nem alterar o cursor visual. A classe utilitária do Tailwind pointer-events-none cursor-default deve ser adicionada dinamicamente à tag <a> nestes casos.

1.3 Alinhamento de Seta de Submenu no Navbar Horizontal

• No template menus-horizontal-navbar, o espaçamento e padding dos submenus recursivos (níveis 2+) foram corrigidos, mas os itens pai desses níveis exibem o caractere/SVG da setinha quebrado na linha abaixo do rótulo, em vez de na mesma linha à direita.

• Isso ocorre porque o seletor [data-title="menu-horizontal-navbar"] ul.absolute a força display: block !important.

• O seletor deve ser ajustado para usar display: flex !important; align-items: center; justify-content: space-between; (ou similar) garantindo o alinhamento horizontal em uma única linha.

1.4 Aumento do Tamanho do Thumb da Imagem

• Na lista curada de imagens do painel administrativo de galerias, a classe .gallery-item-thumb possui dimensões estáticas de 64px por 48px.

• Para melhorar a identificação das fotos curadas, a dimensão deve ser ampliada para 200px de largura por 140px de altura.

1.5 Atualização de READMEs, CHANGELOGs e Workflow de Release

• Atualizar a data de lançamento da versão 2.8.0 para a data de hoje nos arquivos CHANGELOG.md e CHANGELOG-PT-BR.md.

• Incluir as melhorias de otimização de CSS redundante (BATCH-023), links individuais em galerias, exibição dinâmica e correções de layout (BATCH-024 e BATCH-025) nos changelogs.

• Atualizar os arquivos README.md e README-PT-BR.md com a documentação do novo módulo de Menus, Galerias e compilação CLI do Tailwind CSS v4.

• Atualizar o corpo (body) da mensagem do release no pipeline do GitHub Actions em .github/workflows/release-gestor.yml para documentar estas melhorias na geração do pacote ZIP da release.

2. Especificações de Alteração de Código

2.1 Módulo de Galerias: Painel Administrativo

[MODIFY] galleries.js

1. Estilos CSS (injectGalleryStyles): Alterar as propriedades de .gallery-item-thumb para width:200px; height:140px;.

2. Construção da Linha de Item (buildItemRow):

   • Substituir o dropdown simples de seleção de páginas por:

     • Um wrapper de filtros de tipo de página (radios "Página", "Sistema", "Ambos") contendo o atributo name="page_search_type_${it.id}" para isolamento.

     • Um input de busca .gallery-item-link-search com um input flutuante de autocomplete .gallery-item-link-suggestions (análogo a #search-suggestions-dropdown de Menus, mas com classe local para o item).

3. Lógica de Autocomplete:

   • Replicar a lógica de debounce no input de busca: capturar o texto digitado e o rádio ativo, e fazer a chamada AJAX para a opção pages-search do módulo galerias.

   • Renderizar as sugestões na lista flutuante específica daquela linha. Se o item já estiver selecionado, marcar como desabilitado.

   • Ao clicar em uma sugestão, associar o value (ID/Slug da página) ao campo link_page_id, salvar a URL canônica resolvida em link_url, atualizar o texto do input com o nome amigável da página, fechar a lista e disparar serializeAndPreview().

   • Ao limpar o campo de busca, limpar link_page_id e link_url.

4. Hidratação da Edição:

   • Na inicialização, se o item possuir link_page_id preenchido e do tipo pagina, buscar o nome amigável correspondente. Como o array global galleries_pages já está carregado em memória, fazer uma varredura local para encontrar o nome e preencher o input de busca. Caso não encontre, fazer um fetch via AJAX pages-fetch.

[MODIFY] galleries.php

1. Endpoints AJAX:

   • Adicionar os cases pages-search e pages-fetch na função galleries_start().

   • Implementar galleries_ajax_pages_search() e galleries_ajax_pages_fetch() contendo a mesma estrutura de consulta de tabelas de páginas existente no menus.php.

2.2 Módulo de Galerias: Renderização do Widget

[MODIFY] galleries.widget.php

1. Variável link-css-classes:

   • Na função galleries_widget_resolver_item_vars(), se o link_type for 'nenhum', adicionar o sufixo ' pointer-events-none cursor-default' na variável $link_css_classes que é injetada no template final.

2.3 Visual Templates e Layouts

[MODIFY] Templates de Menu Horizontal (pt-br e en)

1. No bloco <style> injetado, alterar a regra do menu flutuante:

   • De:

     [data-title="menu-horizontal-navbar"] ul.absolute a {
         display: block !important;
         padding: 0.5rem 1rem !important;
         font-size: 0.875rem !important;
     }

   • Para:

     [data-title="menu-horizontal-navbar"] ul.absolute a {
         display: flex !important;
         align-items: center;
         justify-content: space-between;
         gap: 0.25rem !important;
         padding: 0.5rem 1rem !important;
         font-size: 0.875rem !important;
     }

2.4 Documentação e Workflow de Release

[MODIFY] CHANGELOG-PT-BR.md e CHANGELOG.md

1. Alterar a data da versão [2.8.0] de 2026-06-08 para a data corrente (2026-06-10).

2. Adicionar os registros de entrega das otimizações de CSS, links individuais em galerias, buscas dinâmicas, correção de cursor de imagens e alinhamento do submenu.

[MODIFY] README-PT-BR.md e README.md

1. Garantir que a documentação técnica abranja o Módulo de Menus (árvore/WordPress), o Módulo de Galerias (carrossel/lote), a Aba de Código de Widget do CodeMirror e a integração CLI do Tailwind CSS v4.

[MODIFY] release-gestor.yml

1. Atualizar o campo body do passo Create Release para incluir os changelogs das otimizações de CSS redundantes e as novas correções funcionais de links e layouts do menu/galerias.