@atlaskit/editor-common/dist/esm/ui/ContextPanel/context.js

A package that contains common classes and components for editor and renderer

import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
import _createClass from "@babel/runtime/helpers/createClass";
import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
import _inherits from "@babel/runtime/helpers/inherits";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
import React from 'react';

// React context to communicate the active context panel width up and down the tree.
//
// We need the width prop from the ContextPanel component.
//
// However, the actual <ContextPanel /> component might be deeply nested inside the contextPanel.
// For example, in the template context panel storybook, we wrap it in 2 higher order components.
//
// Changing the max-width on the main editor container happens above where the <ContextPanel /> gets rendered.
//
// To subtract the context panel width from the available real estate, we use the Provider and Consumer.
//
// positionedOverEditor is used to determine whether the context panel is positioned over the Editor so we are
// able to position and add margins to handle certain elements like inline comment dialogues overlapping the context
// panel

export var ContextPanel = /*#__PURE__*/React.createContext({
  width: 0,
  positionedOverEditor: false,
  broadcastWidth: function broadcastWidth() {},
  broadcastPosition: function broadcastPosition() {}
});
// Ignored via go/ees005
// eslint-disable-next-line @repo/internal/react/no-class-components, @typescript-eslint/no-explicit-any
export var ContextPanelWidthProvider = /*#__PURE__*/function (_React$Component) {
  // Ignored via go/ees005
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
  function ContextPanelWidthProvider(props) {
    var _this;
    _classCallCheck(this, ContextPanelWidthProvider);
    _this = _callSuper(this, ContextPanelWidthProvider, [props]);
    _defineProperty(_this, "state", {
      width: 0,
      positionedOverEditor: false
    });
    _defineProperty(_this, "broadcastSidebarWidth", function (width) {
      if (width !== _this.state.width) {
        _this.setState({
          width: width
        });
      }
    });
    _defineProperty(_this, "broadcastPosition", function (positionedOverEditor) {
      if (positionedOverEditor !== _this.state.positionedOverEditor) {
        _this.setState({
          positionedOverEditor: positionedOverEditor
        });
      }
    });
    return _this;
  }
  _inherits(ContextPanelWidthProvider, _React$Component);
  return _createClass(ContextPanelWidthProvider, [{
    key: "render",
    value: function render() {
      var _this$state = this.state,
        width = _this$state.width,
        positionedOverEditor = _this$state.positionedOverEditor;
      return /*#__PURE__*/React.createElement(Provider, {
        value: {
          width: width,
          positionedOverEditor: positionedOverEditor,
          broadcastWidth: this.broadcastSidebarWidth,
          broadcastPosition: this.broadcastPosition
        }
      }, this.props.children);
    }
  }]);
}(React.Component);
var Provider = ContextPanel.Provider,
  Consumer = ContextPanel.Consumer;
export { Provider as ContextPanelProvider, Consumer as ContextPanelConsumer };