pruncalc/ts/popover.ts

export function setupPopover() {
    const main = document.querySelector('main')!;
    const popover = document.querySelector('#popover') as HTMLElement;
    main.addEventListener('mouseover', (event) => {
        const target = event.target as HTMLElement;
        if (target.dataset.tooltip) {
            popover.textContent = target.dataset.tooltip;
            const rect = target.getBoundingClientRect();
            popover.style.left = `${rect.left}px`;
            popover.style.top = `${rect.bottom}px`;
            popover.showPopover();
        }
    });
    main.addEventListener('mouseout', (event) => {
        const target = event.target as HTMLElement;
        if (target.dataset.tooltip)
            popover.hidePopover();
    });
}