@renderlesskit/react/dist/cjs/dialog/helpers/useFocusOnShow.js

Collection of headless components/hooks that are accessible, composable, customizable from low level to build your own UI & Design System powered by Reakit

"use strict";

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

var _reakitUtils = require("reakit-utils");

var _reakitWarning = require("reakit-warning");

function useFocusOnShow(dialogRef, nestedDialogs, options) {
  var initialFocusRef = options.unstable_initialFocusRef;
  var shouldFocus = options.visible && options.unstable_autoFocusOnShow;
  (0, _reakitUtils.useUpdateEffect)(function () {
    var dialog = dialogRef.current;
    (0, _reakitWarning.warning)(!!shouldFocus && !dialog, "[reakit/Dialog]", "Can't set initial focus on dialog because `ref` wasn't passed to the dialog element.");
    if (!shouldFocus) return;
    if (!dialog) return;
    if (options.animating) return; // If there're nested open dialogs, let them handle focus

    if (nestedDialogs.some(function (child) {
      return child.current && !child.current.hidden;
    })) {
      return;
    }

    if (initialFocusRef !== null && initialFocusRef !== void 0 && initialFocusRef.current) {
      initialFocusRef.current.focus({
        preventScroll: true
      });
    } else {
      var tabbable = (0, _reakitUtils.getFirstTabbableIn)(dialog, true);

      var isActive = function isActive() {
        return (0, _reakitUtils.hasFocusWithin)(dialog);
      };

      if (tabbable) {
        (0, _reakitUtils.ensureFocus)(tabbable, {
          preventScroll: true,
          isActive: isActive
        });
      } else {
        (0, _reakitUtils.ensureFocus)(dialog, {
          preventScroll: true,
          isActive: isActive
        });
        (0, _reakitWarning.warning)(dialog.tabIndex === undefined || dialog.tabIndex < 0, "It's recommended to have at least one tabbable element inside dialog. The dialog element has been automatically focused.", "If this is the intended behavior, pass `tabIndex={0}` to the dialog element to disable this warning.", dialog);
      }
    }
  }, [dialogRef, shouldFocus, options.animating, nestedDialogs, initialFocusRef]);
}
//# sourceMappingURL=useFocusOnShow.js.map