"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = require("react");
var _outline = require("../containers/outline");
var _common = require("../utils/common");
var _eventBus = _interopRequireDefault(require("../utils/event-bus"));
var _eventTypes = require("../constants/event-types");
const useContainerStyle = function (scrollRef) {
  let isShowOutline = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
  const [containerStyle, setContainerStyle] = (0, _react.useState)({});

  // Adjust article container margin-left value according to isShown of the outline and width of window
  const handleWindowResize = (0, _react.useCallback)(() => {
    const rect = scrollRef.current.getBoundingClientRect();
    const articleElement = document.querySelector('.article');
    const articleRect = articleElement ? articleElement.getBoundingClientRect() : null;
    const isOutlineShow = (0, _outline.getOutlineSetting)();
    if (isOutlineShow && articleRect && (rect.width - articleRect.width) / 2 < 280) {
      setContainerStyle({
        marginLeft: 280
      });
    } else {
      setContainerStyle({});
    }
  }, [scrollRef]);
  (0, _react.useEffect)(() => {
    if (_common.isMobile) return;
    if (!isShowOutline) return;
    handleWindowResize();
    window.addEventListener('resize', handleWindowResize);
    const eventBus = _eventBus.default.getInstance();
    const unsubscribeOutline = eventBus.subscribe(_eventTypes.INTERNAL_EVENTS.OUTLINE_STATE_CHANGED, handleWindowResize);
    const unsubscribeResizeArticle = eventBus.subscribe(_eventTypes.INTERNAL_EVENTS.RESIZE_ARTICLE, handleWindowResize);
    return () => {
      window.removeEventListener('resize', handleWindowResize);
      unsubscribeOutline();
      unsubscribeResizeArticle();
    };
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, []);
  return {
    containerStyle
  };
};
var _default = exports.default = useContainerStyle;