activeElement
Track and access the currently focused DOM element
activeElement
provides reactive access to the currently focused DOM element in your application,
similar to document.activeElement
but with reactive updates.
- Updates synchronously with DOM focus changes
- Returns
null
when no element is focused - Safe to use with SSR (Server-Side Rendering)
- Lightweight alternative to manual focus tracking
Demo
Currently active element: No active element found
Usage
<script lang="ts">
import { activeElement } from "runed";
</script>
<p>
Currently active element:
{activeElement.current?.localName ?? "No active element found"}
</p>
Type Definition
interface ActiveElement {
readonly current: Element | null;
}