Solucionado
Olá, boa tarde!
Pessoal, estou trabalhando em uma tela web que terá várias tooltips que aparecerão ao passar o mouse no ícone de info.
Como posso realizar essa interação no componente? Tentei o "while hovering", porem não aparece o frame da tooltip para conectar. Poderiam me dar um help?
Obrigada :)
hoje, com a Alura e o Google Gemini
E aí Jheniffer, tudo beleza?
Pra trabalhar com a interação de hover no tooltip dentro de um componente, você precisa fazer o seguinte:
Essa é a parte mais fácil, e pelo print sei que você não tem dificuldades com isso!
Basta dar um ctrl+c no seu tooltip, e ctrl+v dentro da sua variant. Por padrão, ele irá aparecer sobre ela, e caberá a você movimentar para o lado que deseja que o tooltip atue.
O clip content é uma ação do Figma que permite esconder tudo o que não está dentro da área do componente. Perceba na imagem abaixo que a minha segunda variant ainda está pegando só o espaço do ícone, de 24x24 pixels, e o tooltip está fora dessa área quadrada. Isso acontece porque o tooltip é um elemento flutuante, ou seja, ele aparece sobre outros elementos, então ele estar fora dessa área é o ideal, pois do contrário ele poderia movimentar o seu ícone de lugar, além de outros elementos numa composição com auto layout.
O último passo é criar a interação de hover, puxando uma ação da primeira variant para a segunda, em que as configurações principais devem estar identificadas como "While hovering" e "Change to".
Prontinho! Qualquer dúvida que tiver, só dar um toque