A simple constructor to manage focus in the DOM, designed to work with React's component lifecycle methods. It is intended for dynamically introduced content such as overlays and modals which feature a close button. In these situations, FocusBoomerang will capture the element which triggered the dynamic content, and return focus to that element when the dynamic content is closed. It also accepts a 'focusedWhenActive' property, and will focus on that element when the dynamic content is added to the DOM.

Example usage

In the constructor of a dynamic content component:

constructor(props) {
  super(props);
  this.focusBoomerang = new FocusBoomerang();
}

In the componentDidUpdate method of the same component:

componentDidUpdate(prevProps) {
  this.focusBoomerang.check({
    wasActive: !!prevProps.children,
    isActive: !!this.props.children,
    focusedWhenActive: ReactDOM.findDOMNode(refToYourIntendedFocusElement)
  });
}