@atlaskit/editor-core
Version:
A package contains Atlassian editor core functionality
147 lines (145 loc) • 8.01 kB
JavaScript
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
/**
* @jsxRuntime classic
* @jsx jsx
*/
import { Fragment, memo } from 'react';
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
import { css, jsx } from '@emotion/react';
import { ACTION, ACTION_SUBJECT } from '@atlaskit/editor-common/analytics';
import { usePortalProvider } from '@atlaskit/editor-common/portal';
import { fg } from '@atlaskit/platform-feature-flags';
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
import ErrorBoundary from '../create-editor/ErrorBoundary';
import ReactEditorViewNext from '../create-editor/ReactEditorView';
import EditorContext from '../ui/EditorContext';
import { IntlProviderIfMissingWrapper } from '../ui/IntlProviderIfMissingWrapper/IntlProviderIfMissingWrapper';
import { createFeatureFlagsFromProps } from '../utils/feature-flags-from-props';
import { RenderTracking } from '../utils/performance/components/RenderTracking';
import { BaseThemeWrapper } from './BaseThemeWrapper';
import { getBaseFontSize } from './utils/getBaseFontSize';
var editorContainerStyles = css({
position: 'relative',
width: '100%',
height: '100%'
});
var DEFAULT_VALUE_PROP_TO_IGNORE = ['defaultValue'];
/**
* EditorInternalComponent is used to capture the common component
* from the `render` method of `Editor` and share it with `EditorNext`.
*/
export var EditorInternal = /*#__PURE__*/memo(function (_ref) {
var props = _ref.props,
handleAnalyticsEvent = _ref.handleAnalyticsEvent,
createAnalyticsEvent = _ref.createAnalyticsEvent,
handleSave = _ref.handleSave,
editorActions = _ref.editorActions,
providerFactory = _ref.providerFactory,
onEditorCreated = _ref.onEditorCreated,
onEditorDestroyed = _ref.onEditorDestroyed,
preset = _ref.preset,
AppearanceComponent = _ref.AppearanceComponent;
var overriddenEditorProps = _objectSpread(_objectSpread({}, props), {}, {
onSave: props.onSave ? handleSave : undefined,
// noop all analytic events, even if a handler is still passed.
analyticsHandler: undefined
});
var featureFlags = createFeatureFlagsFromProps(props.featureFlags);
// Render tracking is firing too many events in Jira so we are disabling them for now. See - https://product-fabric.atlassian.net/browse/ED-25616
// Also firing too many events for the legacy content macro, so disabling for now. See - https://product-fabric.atlassian.net/browse/ED-26650
var renderTrackingEnabled = !fg('platform_editor_disable_rerender_tracking_jira') && !featureFlags.lcmPreventRenderTracking;
var useShallow = false;
var _usePortalProvider = usePortalProvider(),
_usePortalProvider2 = _slicedToArray(_usePortalProvider, 2),
portalProviderAPI = _usePortalProvider2[0],
PortalRenderer = _usePortalProvider2[1];
var _usePortalProvider3 = usePortalProvider(),
_usePortalProvider4 = _slicedToArray(_usePortalProvider3, 2),
nodeViewPortalProviderAPI = _usePortalProvider4[0],
NodeViewPortalRenderer = _usePortalProvider4[1];
var propsToIgnore = expValEquals('platform_editor_perf_lint_cleanup', 'isEnabled', true) ? DEFAULT_VALUE_PROP_TO_IGNORE : ['defaultValue'];
return jsx(Fragment, null, renderTrackingEnabled && jsx(RenderTracking, {
componentProps: props,
action: ACTION.RE_RENDERED,
actionSubject: ACTION_SUBJECT.EDITOR,
handleAnalyticsEvent: handleAnalyticsEvent,
propsToIgnore: propsToIgnore,
useShallow: useShallow
}), jsx(ErrorBoundary, {
errorTracking: true,
createAnalyticsEvent: createAnalyticsEvent,
contextIdentifierProvider: props.contextIdentifierProvider,
featureFlags: featureFlags
}, jsx("div", {
css: editorContainerStyles
}, jsx(EditorContext, {
editorActions: editorActions
}, jsx(IntlProviderIfMissingWrapper, null, jsx(Fragment, null, jsx(ReactEditorViewNext, {
editorProps: overriddenEditorProps,
createAnalyticsEvent: createAnalyticsEvent,
portalProviderAPI: portalProviderAPI,
nodeViewPortalProviderAPI: nodeViewPortalProviderAPI,
providerFactory: providerFactory,
onEditorCreated: onEditorCreated,
onEditorDestroyed: onEditorDestroyed,
disabled: props.disabled,
preset: preset
// eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017: this callback closes over the full props object and derived featureFlags; memoization is ineffective because ReactEditorViewNext is not memo()'d and deps (props, featureFlags) change every render
,
render: function render(_ref2) {
var _props$featureFlags, _props$featureFlags2;
var editor = _ref2.editor,
view = _ref2.view,
eventDispatcher = _ref2.eventDispatcher,
config = _ref2.config,
dispatchAnalyticsEvent = _ref2.dispatchAnalyticsEvent,
editorRef = _ref2.editorRef,
editorAPI = _ref2.editorAPI;
return jsx(BaseThemeWrapper, {
baseFontSize: getBaseFontSize(props.appearance, props.contentMode)
}, jsx(AppearanceComponent, {
innerRef: editorRef,
editorAPI: editorAPI
// Ignored via go/ees005
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
,
appearance: props.appearance,
disabled: props.disabled,
editorActions: editorActions,
editorDOMElement: editor,
editorView: view,
providerFactory: providerFactory,
eventDispatcher: eventDispatcher,
dispatchAnalyticsEvent: dispatchAnalyticsEvent,
maxHeight: props.maxHeight,
minHeight: props.minHeight,
onSave: props.onSave ? handleSave : undefined,
onCancel: props.onCancel,
onSSRMeasure: props.onSSRMeasure,
popupsMountPoint: props.popupsMountPoint,
popupsBoundariesElement: props.popupsBoundariesElement,
popupsScrollableElement: props.popupsScrollableElement,
contentComponents: config.contentComponents,
contentMode: props.contentMode,
primaryToolbarComponents: config.primaryToolbarComponents,
primaryToolbarIconBefore: props.primaryToolbarIconBefore,
secondaryToolbarComponents: config.secondaryToolbarComponents,
customContentComponents: props.contentComponents,
customPrimaryToolbarComponents: props.primaryToolbarComponents,
customSecondaryToolbarComponents: props.secondaryToolbarComponents,
contextPanel: props.contextPanel,
collabEdit: props.collabEdit,
persistScrollGutter: props.persistScrollGutter,
enableToolbarMinWidth: ((_props$featureFlags = props.featureFlags) === null || _props$featureFlags === void 0 ? void 0 : _props$featureFlags.toolbarMinWidthOverflow) != null ? !!((_props$featureFlags2 = props.featureFlags) !== null && _props$featureFlags2 !== void 0 && _props$featureFlags2.toolbarMinWidthOverflow) : props.allowUndoRedoButtons,
useStickyToolbar: props.useStickyToolbar,
featureFlags: featureFlags,
pluginHooks: config.pluginHooks,
__livePage: props.__livePage,
preset: preset
}));
}
}), jsx(PortalRenderer, null), jsx(NodeViewPortalRenderer, null)))))));
});