Repository navigation
Endfield Vision 2.2.13
Spotlight: point the user at one element. Everything is backward compatible.
New
spotlight(el, options). Highlights an existing element above the interface and returnsdismiss. Called imperatively on a DOM element, so it works inside dialogs and portals and outside providers.- Everything else goes under the same blurred dim as the dialog backdrop, with a rounded cutout around the element (
padding,radius, corners from--ev-radius-md). - Around the cutout: the focus ring settles in from a slight scale, and a thin wave in
--ev-accent-edgeleaves the ring, expands and fades, then starts again. - The element stays live: the layer lets the pointer through,
focus: truemoves focus inside it. - The layer sits above dialogs and dropdowns and below toasts (new
--ev-z-spotlighttoken), so a toast explaining the highlight stays on top. - The cutout follows the element as it moves; the element is scrolled into view on start.
- Dismissed by any pointer press, Escape (the first Escape closes only the spotlight, not the dialog under it), input inside the element or a timeout (
timeout, 4 s by default). One spotlight at a time: a new call replaces the previous one. - With reduced motion: no scale, no wave, no fade.
spotlightPath(the cutout path) is exported too.
- Everything else goes under the same blurred dim as the dialog backdrop, with a rounded cutout around the element (
Install
npm install endfield-vision@2.2.13The same build is attached to this release as an archive for installs without the registry.
По-русски
spotlight(el, options) - подсветка одного элемента поверх интерфейса: остальное под затемнением с размытием, вокруг элемента вырез, кольцо фокуса и расходящаяся волна. Элемент живой, focus: true ставит в него фокус. Слой выше окон и списков, ниже тостов (токен --ev-z-spotlight). Закрывается нажатием, Escape (первый - только подсветку), вводом в элементе или по таймеру. Все изменения обратно совместимы.