@atlaskit/editor-core
Version:
A package contains Atlassian editor core functionality
161 lines (158 loc) • 8.83 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.CoreEditor = CoreEditor;
exports.default = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _react = require("react");
var _react2 = require("@emotion/react");
var _isEqual = _interopRequireDefault(require("lodash/isEqual"));
var _v = _interopRequireDefault(require("uuid/v4"));
var _analyticsNamespacedContext = require("@atlaskit/analytics-namespaced-context");
var _useAnalyticsEvents2 = require("@atlaskit/analytics-next/useAnalyticsEvents");
var _analytics = require("@atlaskit/editor-common/analytics");
var _performanceMeasures = require("@atlaskit/editor-common/performance-measures");
var _analytics2 = require("@atlaskit/editor-common/utils/analytics");
var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
var _actions = _interopRequireDefault(require("../actions"));
var _EditorContext = require("../ui/EditorContext");
var _featureFlagsFromProps = require("../utils/feature-flags-from-props");
var _measureEnum = _interopRequireDefault(require("../utils/performance/measure-enum"));
var _versionWrapper = require("../version-wrapper");
var _editorInpMetrics = require("./editor-inp-metrics");
var _editorInternal = require("./editor-internal");
var _useMeasureEditorMountTime = _interopRequireDefault(require("./hooks/useMeasureEditorMountTime"));
var _useMemoEditorProps = _interopRequireDefault(require("./hooks/useMemoEditorProps"));
var _useProviderFactory = _interopRequireDefault(require("./hooks/useProviderFactory"));
var _sendDurationAnalytics = _interopRequireDefault(require("./utils/sendDurationAnalytics"));
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) { (0, _defineProperty2.default)(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
*/ // 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
// eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
// Ignored via go/ees005
// eslint-disable-next-line import/no-named-as-default
/**
* Editor wrapper that deals with the lifecycle logic of the editor
* @param passedProps
* @example
*/
function Editor(passedProps) {
var propsRef = (0, _react.useRef)(passedProps);
var props = (0, _useMemoEditorProps.default)(passedProps);
(0, _react.useMemo)(function () {
propsRef.current = props;
}, [props]);
var editorContext = (0, _EditorContext.useEditorContext)();
var editorActionsPlaceholderInstance = (0, _react.useMemo)(function () {
return new _actions.default();
}, []);
var editorActions = editorContext.editorActions || editorActionsPlaceholderInstance;
var _useAnalyticsEvents = (0, _useAnalyticsEvents2.useAnalyticsEvents)(),
createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
var handleAnalyticsEvent = (0, _react.useCallback)(function (data) {
(0, _analytics.fireAnalyticsEvent)(createAnalyticsEvent)(data);
}, [createAnalyticsEvent]);
var getFeatureFlagsFromRef = (0, _react.useCallback)(function () {
var _propsRef$current$col, _propsRef$current$col2;
return _objectSpread(_objectSpread({}, (0, _featureFlagsFromProps.createFeatureFlagsFromProps)(propsRef.current.featureFlags)), {}, {
useNativeCollabPlugin: Boolean(typeof ((_propsRef$current$col = propsRef.current.collabEdit) === null || _propsRef$current$col === void 0 ? void 0 : _propsRef$current$col.useNativePlugin) === 'boolean' ? !!((_propsRef$current$col2 = propsRef.current.collabEdit) !== null && _propsRef$current$col2 !== void 0 && _propsRef$current$col2.useNativePlugin) : false)
});
}, []);
var onEditorCreated = (0, _react.useCallback)(function (instance) {
var _propsRef$current = propsRef.current,
contextIdentifierProvider = _propsRef$current.contextIdentifierProvider,
onEditorReady = _propsRef$current.onEditorReady,
featureFlags = _propsRef$current.featureFlags;
editorActions._privateRegisterEditor(instance.view, instance.eventDispatcher, instance.transformer, getFeatureFlagsFromRef);
if (onEditorReady) {
(0, _performanceMeasures.startMeasure)(_measureEnum.default.ON_EDITOR_READY_CALLBACK);
onEditorReady(editorActions);
(0, _performanceMeasures.stopMeasure)(_measureEnum.default.ON_EDITOR_READY_CALLBACK, (0, _sendDurationAnalytics.default)(_analytics.ACTION.ON_EDITOR_READY_CALLBACK, {
contextIdentifierProvider: contextIdentifierProvider,
featureFlags: featureFlags
}, createAnalyticsEvent));
}
}, [editorActions, createAnalyticsEvent, getFeatureFlagsFromRef, propsRef]);
var onEditorDestroyed = (0, _react.useCallback)(function (_instance) {
var onDestroy = propsRef.current.onDestroy;
editorActions._privateUnregisterEditor();
if (onDestroy) {
onDestroy();
}
}, [editorActions, propsRef]);
(0, _useMeasureEditorMountTime.default)(props, createAnalyticsEvent);
var providerFactory = (0, _useProviderFactory.default)(props, editorActions, createAnalyticsEvent);
var onSaveFromProps = props.onSave;
var handleSave = (0, _react.useCallback)(function (view) {
if (onSaveFromProps) {
onSaveFromProps(view);
}
}, [onSaveFromProps]);
var isFullPageAppearance = Boolean(props.appearance && ['full-page', 'full-width'].concat((0, _toConsumableArray2.default)((0, _experiments.editorExperiment)('platform_synced_block', true) ? ['max'] : [])).includes(props.appearance));
return (0, _react2.jsx)(_react.Fragment, null, isFullPageAppearance ? (0, _react2.jsx)(_editorInpMetrics.EditorINPMetrics, null) : null, (0, _react2.jsx)(_editorInternal.EditorInternal, {
props: props,
handleAnalyticsEvent: handleAnalyticsEvent,
createAnalyticsEvent: createAnalyticsEvent,
preset: props.preset,
handleSave: handleSave,
editorActions: editorActions,
onEditorCreated: onEditorCreated,
onEditorDestroyed: onEditorDestroyed,
providerFactory: providerFactory,
AppearanceComponent: props.AppearanceComponent
}));
}
var useMemoEditorFeatureFlags = function useMemoEditorFeatureFlags(featureFlags) {
var ffRef = (0, _react.useRef)(featureFlags);
if (!(0, _isEqual.default)(ffRef.current, featureFlags)) {
ffRef.current = featureFlags;
}
return ffRef.current;
};
/**
*
* @param props
* @example
*/
function CoreEditor(props) {
// eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
var editorSessionId = (0, _react.useRef)((0, _v.default)());
var data = (0, _react.useMemo)(function () {
return {
packageName: _versionWrapper.name,
packageVersion: _versionWrapper.version,
componentName: 'editorCore',
appearance: (0, _analytics2.getAnalyticsAppearance)(props.appearance),
editorSessionId: editorSessionId.current
};
}, [props.appearance]);
var memodEditorFeatureFlags = useMemoEditorFeatureFlags(props.featureFlags);
return (0, _react2.jsx)(_analyticsNamespacedContext.FabricEditorAnalyticsContext
// @ts-expect-error Type 'string' is not assignable to type '"editorCore" | "renderer"'.
, {
data: data
}, (0, _react2.jsx)(Editor
// Ignored via go/ees005
// eslint-disable-next-line react/jsx-props-no-spreading
, (0, _extends2.default)({}, props, {
featureFlags: memodEditorFeatureFlags
})));
}
// eslint-disable-next-line @typescript-eslint/no-namespace
CoreEditor.propTypes = {
minHeight: function minHeight(_ref) {
var appearance = _ref.appearance,
_minHeight = _ref.minHeight;
if (_minHeight && appearance && !['comment', 'chromeless'].includes(appearance)) {
return new Error('minHeight only supports editor appearance chromeless and comment for Editor');
}
return null;
}
};
var _default = exports.default = CoreEditor;