@atlaskit/editor-plugin-width/dist/cjs/useResizeWidthObserver.js

Width plugin for @atlaskit/editor-core

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.useResizeWidthObserver = void 0;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _react = require("react");
var _pluginKey = require("./plugin-key");
var setEditorWidth = function setEditorWidth(props) {
  return function (editorView) {
    var dispatch = editorView.dispatch,
      tr = editorView.state.tr;
    tr.setMeta(_pluginKey.pluginKey, props);
    dispatch(tr);
  };
};
var useResizeWidthObserver = function useResizeWidthObserver(_ref) {
  var editorView = _ref.editorView,
    containerElement = _ref.containerElement;
  (0, _react.useEffect)(function () {
    var newState = {
      lineLength: editorView.dom.clientWidth,
      width: containerElement === null || containerElement === void 0 ? void 0 : containerElement.offsetWidth
    };
    setEditorWidth(newState)(editorView);
  }, [editorView, editorView.dom.clientWidth, containerElement]);
  (0, _react.useEffect)(function () {
    var resizeWidth = function resizeWidth(entries) {
      if (entries.length !== 1) {
        return;
      }
      var _entries = (0, _slicedToArray2.default)(entries, 1),
        fullAreaSize = _entries[0];
      if (!fullAreaSize || !Array.isArray(fullAreaSize.borderBoxSize)) {
        return;
      }
      var width = fullAreaSize.borderBoxSize[0].inlineSize;
      var lineLength = editorView.dom.clientWidth;
      setEditorWidth({
        width: width,
        lineLength: lineLength
      })(editorView);
    };
    var resizeObserver = new ResizeObserver(resizeWidth);
    if (containerElement) {
      resizeObserver.observe(containerElement);
    }
    return function () {
      resizeObserver.disconnect();
    };
  }, [containerElement, editorView]);
};
exports.useResizeWidthObserver = useResizeWidthObserver;