@atlaskit/editor-core
Version:
A package contains Atlassian editor core functionality
98 lines (96 loc) • 4.98 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.ToolbarInner = void 0;
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _react = _interopRequireDefault(require("react"));
var _react2 = require("@emotion/react");
var _isEqual = _interopRequireDefault(require("lodash/isEqual"));
var _coreUtils = require("@atlaskit/editor-common/core-utils");
var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(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
*/ // 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
var toolbarComponentsWrapper = (0, _react2.css)((0, _defineProperty2.default)({
display: 'flex'
}, "@media (max-width: ".concat(_editorSharedStyles.akEditorMobileMaxWidth, "px)"), {
justifyContent: 'space-between'
}));
// Ignored via go/ees005
// eslint-disable-next-line @repo/internal/react/no-class-components
var ToolbarInner = exports.ToolbarInner = /*#__PURE__*/function (_React$Component) {
function ToolbarInner() {
(0, _classCallCheck2.default)(this, ToolbarInner);
return _callSuper(this, ToolbarInner, arguments);
}
(0, _inherits2.default)(ToolbarInner, _React$Component);
return (0, _createClass2.default)(ToolbarInner, [{
key: "shouldComponentUpdate",
value: function shouldComponentUpdate(nextProps) {
return !(0, _isEqual.default)(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 ((0, _coreUtils.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 (0, _react2.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.default.cloneElement(element, {
key: key
});
}));
}
}]);
}(_react.default.Component);