@zohodesk/a11y/es/FocusScope/FocusControl/useFocusScope.js

In this Package, We Provide Some Basic Components For Accessibility.

import React, { useEffect } from "react";
import useAutoFocus from "./useAutoFocus";
import useFocusLoop from "./useFocusLoop";
import useRestoreFocus from "./useRestoreFocus";
export default (_ref => {
  let {
    needAutoFocus = false,
    needListNavigation = false,
    needFocusLoop = false,
    needRestoreFocus = false,
    onFocus,
    contentRef = null,
    onUpdateRestore,
    onClearRestore,
    onClose,
    needEnterAction,
    loadNextOptions,
    searchValue,
    isFetchingOptions
  } = _ref;
  useEffect(() => {
    if (contentRef && contentRef()) {
      contentRef().dataset.a11yFocusScope = true;
    }

    return () => {
      if (contentRef && contentRef()) {
        contentRef().dataset.a11yFocusScope = false;
      }
    };
  }, []);
  useAutoFocus({
    contentRef,
    needAutoFocus,
    onFocus
  });
  useFocusLoop({
    contentRef,
    needListNavigation,
    needFocusLoop,
    onFocus,
    onClose,
    needEnterAction,
    loadNextOptions,
    searchValue,
    isFetchingOptions
  });
  useRestoreFocus({
    contentRef,
    isRestoreFocus: needRestoreFocus,
    onUpdate: onUpdateRestore,
    onClear: onClearRestore
  });
});