@sanity/form-builder/lib/hooks/useScrollIntoViewOnFocusWithin.js

Sanity form builder

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.useScrollIntoViewOnFocusWithin = useScrollIntoViewOnFocusWithin;
var _react = require("react");
var _scrollIntoViewIfNeeded = _interopRequireDefault(require("scroll-into-view-if-needed"));
var _useDidUpdate = require("./useDidUpdate");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var SCROLL_OPTIONS = {
  scrollMode: 'if-needed'
};

/**
 * A hook to help make sure the parent element of a value edited in a dialog (or "out of band") stays
 visible in the background
 * @param elementRef The element to scroll into view when the proivided focusWithin changes from true to false
 * @param hasFocusWithin A boolean indicating whether we have has focus within the currently edited value
 */
function useScrollIntoViewOnFocusWithin(elementRef, hasFocusWithin) {
  return (0, _useDidUpdate.useDidUpdate)(hasFocusWithin, (0, _react.useCallback)((hadFocus, hasFocus) => {
    if (elementRef.current && !hadFocus && hasFocus) {
      (0, _scrollIntoViewIfNeeded.default)(elementRef.current, SCROLL_OPTIONS);
    }
  }, [elementRef]));
}