@atlaskit/editor-plugin-table/dist/cjs/ui/FloatingContextualButton/useCellLayoutVersion.js

Table plugin for the @atlaskit/editor

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.useCellLayoutVersion = void 0;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _react = require("react");
var _rafSchd = _interopRequireDefault(require("raf-schd"));
var _fg = require("@atlaskit/platform-feature-flags/fg");
/**
 * Counts layout changes that can move the target cell without re-rendering the cell options
 * button: the editor container resizing (window resize, side panel, product sidebar) or the table
 * resizing (column scaling). Changing the count re-renders the button so it repositions on its
 * cell. Stays 0 when the gate is off.
 */
var useCellLayoutVersion = exports.useCellLayoutVersion = function useCellLayoutVersion(targetCellRef) {
  var _useState = (0, _react.useState)(0),
    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
    layoutVersion = _useState2[0],
    setLayoutVersion = _useState2[1];
  (0, _react.useEffect)(function () {
    if (!(0, _fg.fg)('platform_editor_sticky_cell_options_position')) {
      return;
    }
    if (!(targetCellRef instanceof HTMLElement)) {
      return;
    }
    var container = targetCellRef.closest('[data-editor-container="true"]');
    var table = targetCellRef.closest('table');
    var bumpLayoutVersion = (0, _rafSchd.default)(function () {
      return setLayoutVersion(function (version) {
        return version + 1;
      });
    });
    var hasReceivedInitialEntries = false;
    var observer = new ResizeObserver(function () {
      // ResizeObserver reports every observed element once on observe(); that is not a move.
      if (!hasReceivedInitialEntries) {
        hasReceivedInitialEntries = true;
        return;
      }
      bumpLayoutVersion();
    });
    if (container) {
      observer.observe(container);
    }
    if (table) {
      observer.observe(table);
    }
    return function () {
      observer.disconnect();
      bumpLayoutVersion.cancel();
    };
  }, [targetCellRef]);
  return layoutVersion;
};