Seu assistente de produtividade pessoal em qualquer página da web: selecione o texto e receba traduções, explicações e sínteses em um tooltip flutuante elegante.
A Versatile_AI_Tooltip é uma extensão de produtividade para navegadores baseados em Chromium desenvolvida por Alex Santos. Compatível com as diretrizes rígidas do Chrome Manifest V3, a extensão injeta um elemento isolado via Shadow DOM diretamente no navegador do usuário. Ao selecionar qualquer frase ou parágrafo na web, um tooltip contextual aparece imediatamente oferecendo ações de um clique: traduzir para português, resumir em uma frase, reescrever em tom profissional ou enviar um prompt customizado com resposta exibida no próprio popup.
Visão macro de como o projeto processa requisições, gerencia dados e entrega valor técnico com máxima eficiência.
+---------------------------+ +---------------------------+ +--------------------------+
| Seleção de Texto pelo | ===> | Content Script | ===> | Background Service Worker|
| Usuário na Página Web | | (Calcula coordenadas BBox)| | (Manifest V3 Messaging) |
+---------------------------+ +---------------------------+ +--------------------------+
| |
v v
+---------------------------+ +--------------------------+
| Injeção em Shadow DOM | <=== | Chamada API do Modelo LLM|
| (Estilos 100% Blindados) | | (Streaming de Resposta) |
+---------------------------+ +--------------------------+Decisões de design, algoritmos e técnicas aplicadas para garantir confiabilidade, segurança e excelência operacional.
Extensões antigas sofriam com conflitos de CSS causados por regras agressivas como `* { color: red !important }` em sites de terceiros. A Versatile_AI_Tooltip encapsula todos os seus estilos e elementos dentro de uma Shadow Root isolada, garantindo tipografia legível, tema escuro consistente e botões perfeitos em qualquer domínio da web.
O motor de posicionamento calcula o `getBoundingClientRect()` da seleção de texto e ajusta as posições top/left em tempo real. Se o texto estiver muito próximo da borda superior ou direita da janela, o tooltip reposiciona-se automaticamente para baixo ou para a esquerda, garantindo visibilidade total.
O Content Script não realiza requisições diretas de rede com chaves expostas. Toda comunicação ocorre por meio de `chrome.runtime.sendMessage` para um Service Worker em segundo plano, que mantém as chaves de API encriptadas no `chrome.storage.sync` e gerencia as chamadas de inferência de forma assíncrona.
O usuário conta com presets instantâneos: Traduzir, Resumir, Simplificar Explicação, Corrigir Gramática e Extrair Ações. Para tarefas específicas, um campo de texto embutido permite digitar comandos livres sem trocar de aba nem abrir janelas externas.
Exemplo concreto de uso, configuração e integração técnica.
// Criação de container seguro e isolamento de estilos
const hostElement = document.createElement('div');
hostElement.id = 'versatile-tooltip-host';
document.body.appendChild(hostElement);
const shadowRoot = hostElement.attachShadow({ mode: 'open' });
shadowRoot.innerHTML = `
<style>
:host { all: initial; }
.tooltip-bubble {
position: absolute;
background: #121212;
border: 1px solid #00ff88;
border-radius: 8px;
color: #ffffff;
font-family: system-ui, sans-serif;
box-shadow: 0 8px 24px rgba(0,0,0,0.5);
z-index: 2147483647;
padding: 8px;
}
</style>
<div class="tooltip-bubble" id="tooltip">
<button id="btn-translate">Traduzir</button>
<button id="btn-summarize">Resumir</button>
</div>
`;Esclarecimentos detalhados sobre funcionamento, licenças, compatibilidade e privacidade.
Sim. Como as requisições para a API de IA são disparadas a partir do Background Service Worker da extensão, as restrições de CSP da página anfitriã não bloqueiam o envio de requisições.
Sua chave de API é armazenada localmente no chrome.storage.sync do seu próprio navegador, criptografada pelo mecanismo de segurança da conta Google.
Não. Apenas o texto selecionado explicitamente pelo usuário no momento do clique é enviado ao provedor de IA escolhido.
Sim, você pode configurar atalhos globais em chrome://extensions/shortcuts para acionar a tradução ou resumo sem precisar clicar.