ufh/web/tooltip.ts
2023-08-09 17:41:37 -07:00

27 lines
619 B
TypeScript

import { computePosition, flip, offset, shift, arrow } from "@floating-ui/dom";
export function tip(node, options) {
const tooltip = document.createElement("div");
Object.assign(tooltip.style, {
position: "fixed",
background: "red",
});
tooltip.innerText = options.text;
document.body.append(tooltip);
computePosition(node, tooltip, {
placement: "left",
middleware: [offset(8), flip(), shift(), arrow()],
}).then(({x, y}) => {
Object.assign(tooltip.style, {
left: `${x}px`,
top: `${y}px`,
});
});
return {
destroy() {
tooltip.remove();
},
};
}