/
githubmirror
/
material-ui
Обзор
Документация
Войти
/
githubmirror
/
material-ui
Код
Запросы
0
Пакеты
0
Релизы
0
Аналитика
Безопасность
master
docs/data/material/components/tooltips/AnchorElTooltips.js
52 строки
1 KB
Silviu Alexandru Avram
[docs] Make tooltips describe their visible text triggers (#47658)
13 фев 2026, 12:11
Не верифицирован
13 фев 2026, 12:11
48e7bd8
Код
Авторство
О чём код?
import * as React from 'react'; import Box from '@mui/material/Box'; import Tooltip from '@mui/material/Tooltip'; export default function AnchorElTooltips() { const positionRef = React.useRef({ x: 0, y: 0, }); const popperRef = React.useRef(null); const areaRef = React.useRef(null); const handleMouseMove = (event) => { positionRef.current = { x: event.clientX, y: event.clientY }; if (popperRef.current != null) { popperRef.current.update(); } }; return ( <Tooltip describeChild title="Add" placement="top" arrow slotProps={{ popper: { popperRef, anchorEl: { getBoundingClientRect: () => { return new DOMRect( positionRef.current.x, areaRef.current.getBoundingClientRect().y, 0, 0, ); }, }, }, }} > <Box ref={areaRef} onMouseMove={handleMouseMove} sx={{ bgcolor: 'primary.main', color: 'primary.contrastText', p: 2 }} > Hover </Box> </Tooltip> ); }