@kiwicom/orbit-components/lib/hooks/useFocusTrap/index.js

Orbit-components is a React component library which provides developers with the easiest possible way of building Kiwi.com’s products.

"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));

var React = _interopRequireWildcard(require("react"));

var _consts = _interopRequireDefault(require("./consts"));

var _keyMaps = _interopRequireDefault(require("../../common/keyMaps"));

var manageFocus = function manageFocus(ref, triggered) {
  if (triggered && ref.current) {
    var focusableElements = ref.current.querySelectorAll(_consts.default);

    if (focusableElements.length > 0) {
      var firstFocusableEl = focusableElements[0];
      var lastFocusableEl = focusableElements[focusableElements.length - 1];
      return {
        first: firstFocusableEl,
        last: lastFocusableEl
      };
    }
  }

  return {
    first: null,
    last: null
  };
};

var useFocusTrap = function useFocusTrap(ref) {
  var _React$useState = React.useState(false),
      _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
      triggered = _React$useState2[0],
      setTriggered = _React$useState2[1];

  React.useEffect(function () {
    var handleKeyDown = function handleKeyDown(ev) {
      if (ev.keyCode === _keyMaps.default.TAB) {
        if (!triggered) {
          setTriggered(true);
        }

        var _manageFocus = manageFocus(ref, triggered),
            first = _manageFocus.first,
            last = _manageFocus.last;

        if (ev.shiftKey && last && (document.activeElement === first || document.activeElement === ref.current)) {
          ev.preventDefault();
          last.focus();
        } else if (!ev.shiftKey && first && document.activeElement === last) {
          ev.preventDefault();
          first.focus();
        }
      }
    };

    document.addEventListener("keydown", handleKeyDown);
    return function () {
      document.removeEventListener("keydown", handleKeyDown);
    };
  }, [triggered, ref]);
};

var _default = useFocusTrap;
exports.default = _default;