fn

useFocusWithin

v0.0.14testeddemo

Reactive tracking of whether an element or any of its descendants are focused, backed by the focusin/focusout events.

Example

ts
const el = useTemplateRef<HTMLElement>('el');
const { focused } = useFocusWithin(el);

Demo

Loading demo…

Signature

ts
export function useFocusWithin(
  target: MaybeComputedElementRef,
  options: UseFocusWithinOptions ={ ... }

Parameters

ParameterTypeDescription
targetMaybeComputedElementRefElement to track
options?UseFocusWithinOptionsOptions

Returns

UseFocusWithinReturn{ focused } reactive focus-within state
PropertyTypeDescription
focusedComputedRef<boolean>Whether the element or any of its descendants currently hold focus.