A hook to trap focus inside a specific element so the user can't tab outside it.

Parameters:
NameTypeDescription
activeboolean

Whether the element that will trap the focus is active or not.

optionsobject

Options for the focus trap hook. @see https://www.npmjs.com/package/@charlietango/use-focus-trap

Since
  • 1.1.3
Author
  • https://github.com/charlie-tango
Source
Returns:

A reference to the element that will trap the focus.

Type: 
object
Example
import React from 'react'
import useFocusTrap from '@gravityforms/react-utils';

const Component = () => {
 const ref = useFocusTrap()
 return (
  <div ref={ref}>
    <button>Trapped to the button</button>
  </div>
 )
}

export default Component