@atlaskit/editor-core/dist/esm/ui/Toolbar/ToolbarInner.js

A package contains Atlassian editor core functionality

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; })(); }
/**
 * @jsxRuntime classic
 * @jsx jsx
 */
import React from 'react';

// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports -- Ignored via go/DSP-18766; jsx required at runtime for @jsxRuntime classic
import { css, jsx } from '@emotion/react';
import isEqual from 'lodash/isEqual';
import { isSSR } from '@atlaskit/editor-common/core-utils';
import { akEditorMobileMaxWidth } from '@atlaskit/editor-shared-styles';
var toolbarComponentsWrapper = css(_defineProperty({
  display: 'flex'
}, "@media (max-width: ".concat(akEditorMobileMaxWidth, "px)"), {
  justifyContent: 'space-between'
}));

// Ignored via go/ees005
// eslint-disable-next-line @repo/internal/react/no-class-components
export var ToolbarInner = /*#__PURE__*/function (_React$Component) {
  function ToolbarInner() {
    _classCallCheck(this, ToolbarInner);
    return _callSuper(this, ToolbarInner, arguments);
  }
  _inherits(ToolbarInner, _React$Component);
  return _createClass(ToolbarInner, [{
    key: "shouldComponentUpdate",
    value: function shouldComponentUpdate(nextProps) {
      return !isEqual(nextProps, this.props);
    }
  }, {
    key: "render",
    value: function render() {
      var _this$props = this.props,
        appearance = _this$props.appearance,
        editorView = _this$props.editorView,
        editorActions = _this$props.editorActions,
        eventDispatcher = _this$props.eventDispatcher,
        providerFactory = _this$props.providerFactory,
        items = _this$props.items,
        popupsMountPoint = _this$props.popupsMountPoint,
        popupsBoundariesElement = _this$props.popupsBoundariesElement,
        popupsScrollableElement = _this$props.popupsScrollableElement,
        toolbarSize = _this$props.toolbarSize,
        disabled = _this$props.disabled,
        isToolbarReducedSpacing = _this$props.isToolbarReducedSpacing,
        dispatchAnalyticsEvent = _this$props.dispatchAnalyticsEvent,
        containerElement = _this$props.containerElement;
      if (!items || !items.length) {
        return null;
      }
      if (isSSR()) {
        // Toolbar in SSR environment is showing collapsed state, which caused layout shift after hydrating to SPA.
        // Hiding toolbar in SSR until the dependency of screen width is resolved in SSR environment.
        return null;
      }
      return jsx("div", {
        css: toolbarComponentsWrapper,
        "data-vc": "toolbar-inner"
      }, items.map(function (component, key) {
        var element = component({
          editorView: editorView,
          editorActions: editorActions,
          eventDispatcher: eventDispatcher,
          providerFactory: providerFactory,
          // Ignored via go/ees005
          // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
          appearance: appearance,
          popupsMountPoint: popupsMountPoint,
          popupsBoundariesElement: popupsBoundariesElement,
          popupsScrollableElement: popupsScrollableElement,
          disabled: disabled,
          toolbarSize: toolbarSize,
          isToolbarReducedSpacing: isToolbarReducedSpacing,
          containerElement: containerElement,
          isLastItem: key === items.length - 1,
          dispatchAnalyticsEvent: dispatchAnalyticsEvent,
          wrapperElement: null
        });
        return element && /*#__PURE__*/React.cloneElement(element, {
          key: key
        });
      }));
    }
  }]);
}(React.Component);