shadcn-ahooks

useFocusWithin

Monitor whether the current focus is within a certain area, Same as css attribute [:focus-within](https://developer.mozilla.org/en-US/docs/Web/CSS/:focus-within).

Overview

Monitor whether the current focus is within a certain area, Same as css attribute :focus-within.

Documentation and Examples

Installation

Open in
pnpm dlx shadcn@latest add https://shadcn-ahooks.vercel.app/r/useFocusWithin.json
npx shadcn@latest add https://shadcn-ahooks.vercel.app/r/useFocusWithin.json
yarn shadcn@latest add https://shadcn-ahooks.vercel.app/r/useFocusWithin.json
bun shadcn@latest add https://shadcn-ahooks.vercel.app/r/useFocusWithin.json

Monitor whether the current focus is within a certain area, Same as css attribute :focus-within.

Examples

Default usage

Pass in DOM element

API

const isFocusWithin = useFocusWithin(
  target,
  {
   onFocus,
   onBlur,
   onChange
  }
);

Params

| Property | Description | Type | Default | | -- | | | - | --- | | isFocusWithin | Whether the focus is in the current area | boolean |

On this page