@atlaskit/editor-core 150.0.3 → 151.0.0

package/dist/es2019/create-editor/create-plugins-list.js

@@ -57,7 +57,8 @@ export function getDefaultPresetOptionsFromEditorProps(props, createAnalyticsEve
       allowInlineCursorTarget: !isMobile,
       allowScrollGutter: getScrollGutterOptions(props),
       inputTracking,
-      browserFreezeTracking: (_props$performanceTra2 = props.performanceTracking) === null || _props$performanceTra2 === void 0 ? void 0 : _props$performanceTra2.bFreezeTracking
+      browserFreezeTracking: (_props$performanceTra2 = props.performanceTracking) === null || _props$performanceTra2 === void 0 ? void 0 : _props$performanceTra2.bFreezeTracking,
+      ufo: createFeatureFlagsFromProps(props).ufo
     },
     blockType: {
       lastNodeMustBeParagraph: appearance === 'comment' || appearance === 'chromeless',
@@ -271,7 +272,8 @@ export default function createPluginsList(props, prevProps, createAnalyticsEvent
   if (props.allowPanel) {
     preset.add([panelPlugin, {
       useLongPressSelection: false,
-      UNSAFE_allowCustomPanel: props.allowPanel.UNSAFE_allowCustomPanel
+      UNSAFE_allowCustomPanel: props.allowPanel.UNSAFE_allowCustomPanel,
+      UNSAFE_allowCustomPanelEdit: props.allowPanel.UNSAFE_allowCustomPanelEdit
     }]);
   }
 

package/dist/es2019/editor.js

@@ -7,6 +7,7 @@ import memoizeOne from 'memoize-one';
 import uuid from 'uuid/v4';
 import { name, version } from './version-wrapper';
 import { ProviderFactory, BaseTheme, getAnalyticsAppearance, WithCreateAnalyticsEvent, startMeasure, stopMeasure, clearMeasure, measureTTI, getTTISeverity, combineExtensionProviders, WidthProvider } from '@atlaskit/editor-common';
+import { EditorExperience, ExperienceStore } from '@atlaskit/editor-common/ufo';
 import { akEditorFullPageDefaultFontSize } from '@atlaskit/editor-shared-styles';
 import { FabricEditorAnalyticsContext } from '@atlaskit/analytics-namespaced-context';
 import { getUiComponent } from './create-editor';
@@ -27,6 +28,8 @@ const WidthProviderFullHeight = styled(WidthProvider)`
 `;
 export default class Editor extends React.Component {
   constructor(props, context) {
+    var _props$performanceTra, _props$performanceTra2, _props$featureFlags;
+
     super(props);
 
     _defineProperty(this, "prepareExtensionProvider", memoizeOne(extensionProviders => {
@@ -64,11 +67,16 @@ export default class Editor extends React.Component {
     this.editorActions = (context || {}).editorActions || new EditorActions();
     this.trackEditorActions(this.editorActions, props);
     this.editorSessionId = uuid();
+    this.startTime = performance.now();
     startMeasure(measurements.EDITOR_MOUNTED);
 
-    if (props.performanceTracking && props.performanceTracking.ttiTracking && props.performanceTracking.ttiTracking.enabled) {
+    if ((_props$performanceTra = props.performanceTracking) !== null && _props$performanceTra !== void 0 && (_props$performanceTra2 = _props$performanceTra.ttiTracking) !== null && _props$performanceTra2 !== void 0 && _props$performanceTra2.enabled || (_props$featureFlags = props.featureFlags) !== null && _props$featureFlags !== void 0 && _props$featureFlags.ufo) {
+      var _props$performanceTra5, _props$performanceTra6, _props$performanceTra7, _props$performanceTra8;
+
       measureTTI((tti, ttiFromInvocation, canceled) => {
-        if (this.createAnalyticsEvent) {
+        var _props$performanceTra3, _props$performanceTra4, _props$featureFlags2;
+
+        if ((_props$performanceTra3 = props.performanceTracking) !== null && _props$performanceTra3 !== void 0 && (_props$performanceTra4 = _props$performanceTra3.ttiTracking) !== null && _props$performanceTra4 !== void 0 && _props$performanceTra4.enabled && this.createAnalyticsEvent) {
           var _ttiTracking;
 
           const ttiEvent = {
@@ -101,7 +109,14 @@ export default class Editor extends React.Component {
 
           fireAnalyticsEvent(this.createAnalyticsEvent)(ttiEvent);
         }
-      }, props.performanceTracking.ttiTracking.ttiIdleThreshold, props.performanceTracking.ttiTracking.ttiCancelTimeout);
+
+        if ((_props$featureFlags2 = props.featureFlags) !== null && _props$featureFlags2 !== void 0 && _props$featureFlags2.ufo) {
+          var _this$experienceStore, _this$experienceStore2;
+
+          (_this$experienceStore = this.experienceStore) === null || _this$experienceStore === void 0 ? void 0 : _this$experienceStore.mark(EditorExperience.loadEditor, ACTION.EDITOR_TTI, tti);
+          (_this$experienceStore2 = this.experienceStore) === null || _this$experienceStore2 === void 0 ? void 0 : _this$experienceStore2.success(EditorExperience.loadEditor);
+        }
+      }, (_props$performanceTra5 = props.performanceTracking) === null || _props$performanceTra5 === void 0 ? void 0 : (_props$performanceTra6 = _props$performanceTra5.ttiTracking) === null || _props$performanceTra6 === void 0 ? void 0 : _props$performanceTra6.ttiIdleThreshold, (_props$performanceTra7 = props.performanceTracking) === null || _props$performanceTra7 === void 0 ? void 0 : (_props$performanceTra8 = _props$performanceTra7.ttiTracking) === null || _props$performanceTra8 === void 0 ? void 0 : _props$performanceTra8.ttiCancelTimeout);
     }
 
     const _extensionProvider = this.prepareExtensionProvider(props.extensionProviders);
@@ -139,18 +154,26 @@ export default class Editor extends React.Component {
   }
 
   componentWillUnmount() {
-    var _this$props, _this$props$performan, _this$props$performan2;
+    var _this$props, _this$props$performan, _this$props$performan2, _this$props$featureFl;
 
     this.unregisterEditorFromActions();
     this.providerFactory.destroy();
     clearMeasure(measurements.EDITOR_MOUNTED);
     ((_this$props = this.props) === null || _this$props === void 0 ? void 0 : (_this$props$performan = _this$props.performanceTracking) === null || _this$props$performan === void 0 ? void 0 : (_this$props$performan2 = _this$props$performan.onEditorReadyCallbackTracking) === null || _this$props$performan2 === void 0 ? void 0 : _this$props$performan2.enabled) && clearMeasure(measurements.ON_EDITOR_READY_CALLBACK);
+
+    if ((_this$props$featureFl = this.props.featureFlags) !== null && _this$props$featureFl !== void 0 && _this$props$featureFl.ufo) {
+      var _this$experienceStore3;
+
+      (_this$experienceStore3 = this.experienceStore) === null || _this$experienceStore3 === void 0 ? void 0 : _this$experienceStore3.abortAll({
+        reason: 'editor component unmounted'
+      });
+    }
   }
 
   trackEditorActions(editorActions, props) {
-    var _props$performanceTra, _props$performanceTra2;
+    var _props$performanceTra9, _props$performanceTra10;
 
-    if (props !== null && props !== void 0 && (_props$performanceTra = props.performanceTracking) !== null && _props$performanceTra !== void 0 && (_props$performanceTra2 = _props$performanceTra.contentRetrievalTracking) !== null && _props$performanceTra2 !== void 0 && _props$performanceTra2.enabled) {
+    if (props !== null && props !== void 0 && (_props$performanceTra9 = props.performanceTracking) !== null && _props$performanceTra9 !== void 0 && (_props$performanceTra10 = _props$performanceTra9.contentRetrievalTracking) !== null && _props$performanceTra10 !== void 0 && _props$performanceTra10.enabled) {
       const DEFAULT_SAMPLING_RATE = 100;
       const getValue = editorActions.getValue.bind(editorActions);
 
@@ -174,11 +197,11 @@ export default class Editor extends React.Component {
       if (!getValueTracked) {
         const getValueWithTracking = async () => {
           try {
-            var _props$performanceTra3, _props$performanceTra4, _props$performanceTra5;
+            var _props$performanceTra11, _props$performanceTra12, _props$performanceTra13;
 
             const value = await getValue();
 
-            if (samplingCounters.success === ((_props$performanceTra3 = props === null || props === void 0 ? void 0 : (_props$performanceTra4 = props.performanceTracking) === null || _props$performanceTra4 === void 0 ? void 0 : (_props$performanceTra5 = _props$performanceTra4.contentRetrievalTracking) === null || _props$performanceTra5 === void 0 ? void 0 : _props$performanceTra5.successSamplingRate) !== null && _props$performanceTra3 !== void 0 ? _props$performanceTra3 : DEFAULT_SAMPLING_RATE)) {
+            if (samplingCounters.success === ((_props$performanceTra11 = props === null || props === void 0 ? void 0 : (_props$performanceTra12 = props.performanceTracking) === null || _props$performanceTra12 === void 0 ? void 0 : (_props$performanceTra13 = _props$performanceTra12.contentRetrievalTracking) === null || _props$performanceTra13 === void 0 ? void 0 : _props$performanceTra13.successSamplingRate) !== null && _props$performanceTra11 !== void 0 ? _props$performanceTra11 : DEFAULT_SAMPLING_RATE)) {
               this.handleAnalyticsEvent({
                 payload: {
                   action: ACTION.EDITOR_CONTENT_RETRIEVAL_PERFORMED,
@@ -195,10 +218,10 @@ export default class Editor extends React.Component {
             samplingCounters.success++;
             return value;
           } catch (err) {
-            var _props$performanceTra6, _props$performanceTra7, _props$performanceTra8;
+            var _props$performanceTra14, _props$performanceTra15, _props$performanceTra16;
 
-            if (samplingCounters.failure === ((_props$performanceTra6 = props === null || props === void 0 ? void 0 : (_props$performanceTra7 = props.performanceTracking) === null || _props$performanceTra7 === void 0 ? void 0 : (_props$performanceTra8 = _props$performanceTra7.contentRetrievalTracking) === null || _props$performanceTra8 === void 0 ? void 0 : _props$performanceTra8.failureSamplingRate) !== null && _props$performanceTra6 !== void 0 ? _props$performanceTra6 : DEFAULT_SAMPLING_RATE)) {
-              var _props$performanceTra9, _props$performanceTra10;
+            if (samplingCounters.failure === ((_props$performanceTra14 = props === null || props === void 0 ? void 0 : (_props$performanceTra15 = props.performanceTracking) === null || _props$performanceTra15 === void 0 ? void 0 : (_props$performanceTra16 = _props$performanceTra15.contentRetrievalTracking) === null || _props$performanceTra16 === void 0 ? void 0 : _props$performanceTra16.failureSamplingRate) !== null && _props$performanceTra14 !== void 0 ? _props$performanceTra14 : DEFAULT_SAMPLING_RATE)) {
+              var _props$performanceTra17, _props$performanceTra18;
 
               this.handleAnalyticsEvent({
                 payload: {
@@ -207,7 +230,7 @@ export default class Editor extends React.Component {
                   attributes: {
                     success: false,
                     errorInfo: err.toString(),
-                    errorStack: props !== null && props !== void 0 && (_props$performanceTra9 = props.performanceTracking) !== null && _props$performanceTra9 !== void 0 && (_props$performanceTra10 = _props$performanceTra9.contentRetrievalTracking) !== null && _props$performanceTra10 !== void 0 && _props$performanceTra10.reportErrorStack ? err.stack : undefined
+                    errorStack: props !== null && props !== void 0 && (_props$performanceTra17 = props.performanceTracking) !== null && _props$performanceTra17 !== void 0 && (_props$performanceTra18 = _props$performanceTra17.contentRetrievalTracking) !== null && _props$performanceTra18 !== void 0 && _props$performanceTra18.reportErrorStack ? err.stack : undefined
                   },
                   eventType: EVENT_TYPE.OPERATIONAL
                 }
@@ -229,38 +252,54 @@ export default class Editor extends React.Component {
   }
 
   onEditorCreated(instance) {
+    var _this$props$featureFl2;
+
     this.registerEditorForActions(instance.view, instance.eventDispatcher, instance.transformer);
 
+    if ((_this$props$featureFl2 = this.props.featureFlags) !== null && _this$props$featureFl2 !== void 0 && _this$props$featureFl2.ufo) {
+      this.experienceStore = ExperienceStore.getInstance(instance.view);
+      this.experienceStore.start(EditorExperience.loadEditor, this.startTime);
+    }
+
     if (this.props.onEditorReady) {
-      var _this$props2, _this$props2$performa, _this$props2$performa2, _this$props3, _this$props3$performa, _this$props3$performa2;
+      var _this$props2, _this$props2$performa, _this$props2$performa2, _this$props$featureFl3;
 
-      ((_this$props2 = this.props) === null || _this$props2 === void 0 ? void 0 : (_this$props2$performa = _this$props2.performanceTracking) === null || _this$props2$performa === void 0 ? void 0 : (_this$props2$performa2 = _this$props2$performa.onEditorReadyCallbackTracking) === null || _this$props2$performa2 === void 0 ? void 0 : _this$props2$performa2.enabled) && startMeasure(measurements.ON_EDITOR_READY_CALLBACK);
+      const measureEditorReady = ((_this$props2 = this.props) === null || _this$props2 === void 0 ? void 0 : (_this$props2$performa = _this$props2.performanceTracking) === null || _this$props2$performa === void 0 ? void 0 : (_this$props2$performa2 = _this$props2$performa.onEditorReadyCallbackTracking) === null || _this$props2$performa2 === void 0 ? void 0 : _this$props2$performa2.enabled) || ((_this$props$featureFl3 = this.props.featureFlags) === null || _this$props$featureFl3 === void 0 ? void 0 : _this$props$featureFl3.ufo);
+      measureEditorReady && startMeasure(measurements.ON_EDITOR_READY_CALLBACK);
       this.props.onEditorReady(this.editorActions);
-      ((_this$props3 = this.props) === null || _this$props3 === void 0 ? void 0 : (_this$props3$performa = _this$props3.performanceTracking) === null || _this$props3$performa === void 0 ? void 0 : (_this$props3$performa2 = _this$props3$performa.onEditorReadyCallbackTracking) === null || _this$props3$performa2 === void 0 ? void 0 : _this$props3$performa2.enabled) && stopMeasure(measurements.ON_EDITOR_READY_CALLBACK, this.sendDurationAnalytics(ACTION.ON_EDITOR_READY_CALLBACK));
+      measureEditorReady && stopMeasure(measurements.ON_EDITOR_READY_CALLBACK, this.sendDurationAnalytics(ACTION.ON_EDITOR_READY_CALLBACK));
     }
   }
 
   sendDurationAnalytics(action) {
-    return (duration, startTime) => {
+    return async (duration, startTime) => {
+      var _this$props$featureFl4;
+
+      const contextIdentifier = await this.props.contextIdentifierProvider;
+      const objectId = contextIdentifier === null || contextIdentifier === void 0 ? void 0 : contextIdentifier.objectId;
+
       if (this.createAnalyticsEvent) {
-        const fireMounted = objectId => {
-          fireAnalyticsEvent(this.createAnalyticsEvent)({
-            payload: {
-              action,
-              actionSubject: ACTION_SUBJECT.EDITOR,
-              attributes: {
-                duration,
-                startTime,
-                objectId
-              },
-              eventType: EVENT_TYPE.OPERATIONAL
-            }
-          });
-        };
+        fireAnalyticsEvent(this.createAnalyticsEvent)({
+          payload: {
+            action,
+            actionSubject: ACTION_SUBJECT.EDITOR,
+            attributes: {
+              duration,
+              startTime,
+              objectId
+            },
+            eventType: EVENT_TYPE.OPERATIONAL
+          }
+        });
+      }
+
+      if ((_this$props$featureFl4 = this.props.featureFlags) !== null && _this$props$featureFl4 !== void 0 && _this$props$featureFl4.ufo) {
+        var _this$experienceStore4, _this$experienceStore5;
 
-        Promise.resolve(this.props.contextIdentifierProvider).then(p => {
-          fireMounted(p === null || p === void 0 ? void 0 : p.objectId);
-        }, fireMounted);
+        (_this$experienceStore4 = this.experienceStore) === null || _this$experienceStore4 === void 0 ? void 0 : _this$experienceStore4.mark(EditorExperience.loadEditor, action, startTime + duration);
+        (_this$experienceStore5 = this.experienceStore) === null || _this$experienceStore5 === void 0 ? void 0 : _this$experienceStore5.addMetadata(EditorExperience.loadEditor, {
+          objectId
+        });
       }
     };
   }
@@ -417,7 +456,7 @@ export default class Editor extends React.Component {
             config,
             dispatchAnalyticsEvent
           }) => {
-            var _this$props$featureFl, _this$props$featureFl2;
+            var _this$props$featureFl5, _this$props$featureFl6;
 
             return /*#__PURE__*/React.createElement(BaseTheme, {
               dynamicTextSizing: this.props.allowDynamicTextSizing && this.props.appearance !== 'full-width',
@@ -449,7 +488,7 @@ export default class Editor extends React.Component {
               collabEdit: this.props.collabEdit,
               allowAnnotation: !!this.props.annotationProviders,
               persistScrollGutter: this.props.persistScrollGutter,
-              enableToolbarMinWidth: ((_this$props$featureFl = this.props.featureFlags) === null || _this$props$featureFl === void 0 ? void 0 : _this$props$featureFl.toolbarMinWidthOverflow) != null ? !!((_this$props$featureFl2 = this.props.featureFlags) !== null && _this$props$featureFl2 !== void 0 && _this$props$featureFl2.toolbarMinWidthOverflow) : this.props.UNSAFE_allowUndoRedoButtons,
+              enableToolbarMinWidth: ((_this$props$featureFl5 = this.props.featureFlags) === null || _this$props$featureFl5 === void 0 ? void 0 : _this$props$featureFl5.toolbarMinWidthOverflow) != null ? !!((_this$props$featureFl6 = this.props.featureFlags) !== null && _this$props$featureFl6 !== void 0 && _this$props$featureFl6.toolbarMinWidthOverflow) : this.props.UNSAFE_allowUndoRedoButtons,
               useStickyToolbar: this.props.useStickyToolbar,
               featureFlags: featureFlags
             }));

package/dist/es2019/labs/next/presets/cxhtml.js

@@ -26,7 +26,8 @@ export function useCXHTMLPreset({
     }
   }]);
   preset.add([panelPlugin, {
-    UNSAFE_allowCustomPanel: true
+    UNSAFE_allowCustomPanel: true,
+    UNSAFE_allowCustomPanelEdit: true
   }]);
   preset.add(listPlugin);
   preset.add(textColorPlugin);

package/dist/es2019/plugins/analytics/types/enums.js

@@ -94,6 +94,7 @@ export let ACTION;
   ACTION["ON_EDITOR_READY_CALLBACK"] = "onEditorReadyCallback";
   ACTION["ON_CHANGE_CALLBACK"] = "onChangeCalled";
   ACTION["REMOVE_ICON"] = "removedIcon";
+  ACTION["UFO_SESSION_COMPLETE"] = "ufoSessionComplete";
 })(ACTION || (ACTION = {}));
 
 export let INPUT_METHOD;
@@ -234,8 +235,9 @@ export let ACTION_SUBJECT_ID;
   ACTION_SUBJECT_ID["LINK"] = "link";
   ACTION_SUBJECT_ID["LINK_PREVIEW"] = "linkPreview";
   ACTION_SUBJECT_ID["MEDIA"] = "media";
-  ACTION_SUBJECT_ID["MEDIA_SINGLE"] = "mediaSingle";
   ACTION_SUBJECT_ID["MEDIA_GROUP"] = "mediaGroup";
+  ACTION_SUBJECT_ID["MEDIA_INLINE"] = "mediaInline";
+  ACTION_SUBJECT_ID["MEDIA_SINGLE"] = "mediaSingle";
   ACTION_SUBJECT_ID["MEDIA_LINK"] = "mediaLink";
   ACTION_SUBJECT_ID["MENTION"] = "mention";
   ACTION_SUBJECT_ID["NESTED_EXPAND"] = "nestedExpand";

package/dist/es2019/plugins/base/index.js

@@ -43,10 +43,11 @@ const basePlugin = options => ({
     }, {
       name: 'frozenEditor',
       plugin: ({
-        dispatchAnalyticsEvent,
-        providerFactory
+        dispatchAnalyticsEvent
       }) => {
-        return options && options.inputTracking && options.inputTracking.enabled ? frozenEditor(dispatchAnalyticsEvent, options.inputTracking, options.browserFreezeTracking) : undefined;
+        var _options$inputTrackin;
+
+        return options !== null && options !== void 0 && (_options$inputTrackin = options.inputTracking) !== null && _options$inputTrackin !== void 0 && _options$inputTrackin.enabled || options !== null && options !== void 0 && options.ufo ? frozenEditor(dispatchAnalyticsEvent, options.inputTracking, options.browserFreezeTracking, options.ufo) : undefined;
       }
     }, {
       name: 'decorationPlugin',

package/dist/es2019/plugins/base/pm-plugins/frozen-editor.js

@@ -1,11 +1,13 @@
-import { Plugin } from 'prosemirror-state';
+import { Plugin, PluginKey } from 'prosemirror-state';
 import { isPerformanceObserverAvailable, isPerformanceAPIAvailable, getAnalyticsEventSeverity } from '@atlaskit/editor-common';
+import { EditorExperience, ExperienceStore } from '@atlaskit/editor-common/ufo';
 import { ACTION, ACTION_SUBJECT, BROWSER_FREEZE_INTERACTION_TYPE, EVENT_TYPE } from '../../analytics';
 import { getParticipantsCount } from '../../collab-edit/get-participants-count';
 import { countNodes } from '../../../utils/count-nodes';
 import { getContextIdentifier } from './context-identifier';
 import { setInteractionType } from '../utils/frozen-editor';
 import { getTimeSince } from '../../../utils/performance/get-performance-timing';
+export const frozenEditorPluginKey = new PluginKey('frozenEditor');
 const DEFAULT_KEYSTROKE_SAMPLING_LIMIT = 100;
 const DEFAULT_SLOW_THRESHOLD = 300;
 export const DEFAULT_FREEZE_THRESHOLD = 600;
@@ -38,7 +40,7 @@ const dispatchLongTaskEvent = (dispatchAnalyticsEvent, view, time, allowCountNod
   });
 };
 
-export default ((dispatchAnalyticsEvent, inputTracking, browserFreezeTracking) => {
+export default ((dispatchAnalyticsEvent, inputTracking, browserFreezeTracking, ufo) => {
   let keystrokeCount = 0;
   let interactionType;
 
@@ -54,6 +56,7 @@ export default ((dispatchAnalyticsEvent, inputTracking, browserFreezeTracking) =
   const severityThresholdNormal = (inputTracking === null || inputTracking === void 0 ? void 0 : inputTracking.severityNormalThreshold) || DEFAULT_TRACK_SEVERITY_THRESHOLD_NORMAL;
   const severityThresholdDegraded = (inputTracking === null || inputTracking === void 0 ? void 0 : inputTracking.severityDegradedThreshold) || DEFAULT_TRACK_SEVERITY_THRESHOLD_DEGRADED;
   return new Plugin({
+    key: frozenEditorPluginKey,
     props: isPerformanceAPIAvailable() ? {
       handleTextInput(view) {
         const {
@@ -65,49 +68,74 @@ export default ((dispatchAnalyticsEvent, inputTracking, browserFreezeTracking) =
           interactionType = BROWSER_FREEZE_INTERACTION_TYPE.TYPING;
         }
 
+        const experienceStore = ufo ? ExperienceStore.getInstance(view) : undefined;
+        const trackTyping = samplingRate && ++keystrokeCount === samplingRate;
+
+        if (trackTyping) {
+          experienceStore === null || experienceStore === void 0 ? void 0 : experienceStore.start(EditorExperience.typing);
+        }
+
         requestAnimationFrame(() => {
           const diff = getTimeSince(now);
 
-          if (samplingRate && ++keystrokeCount === samplingRate) {
-            var _getContextIdentifier2;
-
+          if (diff > slowThreshold) {
             const nodesCount = allowCountNodes ? countNodes(view.state) : {};
-            keystrokeCount = 0;
-            const payload = {
-              action: ACTION.INPUT_PERF_SAMPLING,
-              actionSubject: ACTION_SUBJECT.EDITOR,
-              attributes: {
-                time: diff,
-                nodeSize: state.doc.nodeSize,
-                ...nodesCount,
-                participants: getParticipantsCount(state),
-                objectId: (_getContextIdentifier2 = getContextIdentifier(state)) === null || _getContextIdentifier2 === void 0 ? void 0 : _getContextIdentifier2.objectId
-              },
-              eventType: EVENT_TYPE.OPERATIONAL
-            };
-
-            if (shouldTrackSeverity) {
-              payload.attributes.severity = getAnalyticsEventSeverity(diff, severityThresholdNormal, severityThresholdDegraded);
+
+            if (inputTracking !== null && inputTracking !== void 0 && inputTracking.enabled) {
+              var _getContextIdentifier2;
+
+              dispatchAnalyticsEvent({
+                action: ACTION.SLOW_INPUT,
+                actionSubject: ACTION_SUBJECT.EDITOR,
+                attributes: {
+                  time: diff,
+                  nodeSize: state.doc.nodeSize,
+                  ...nodesCount,
+                  participants: getParticipantsCount(state),
+                  objectId: (_getContextIdentifier2 = getContextIdentifier(state)) === null || _getContextIdentifier2 === void 0 ? void 0 : _getContextIdentifier2.objectId
+                },
+                eventType: EVENT_TYPE.OPERATIONAL
+              });
             }
 
-            dispatchAnalyticsEvent(payload);
+            experienceStore === null || experienceStore === void 0 ? void 0 : experienceStore.addMetadata(EditorExperience.typing, {
+              slowInput: true
+            });
           }
 
-          if (diff > slowThreshold) {
-            var _getContextIdentifier3;
+          if (trackTyping) {
+            var _getContextIdentifier4;
 
             const nodesCount = allowCountNodes ? countNodes(view.state) : {};
-            dispatchAnalyticsEvent({
-              action: ACTION.SLOW_INPUT,
-              actionSubject: ACTION_SUBJECT.EDITOR,
-              attributes: {
-                time: diff,
-                nodeSize: state.doc.nodeSize,
-                ...nodesCount,
-                participants: getParticipantsCount(state),
-                objectId: (_getContextIdentifier3 = getContextIdentifier(state)) === null || _getContextIdentifier3 === void 0 ? void 0 : _getContextIdentifier3.objectId
-              },
-              eventType: EVENT_TYPE.OPERATIONAL
+            keystrokeCount = 0;
+            const severity = shouldTrackSeverity ? getAnalyticsEventSeverity(diff, severityThresholdNormal, severityThresholdDegraded) : undefined;
+
+            if (inputTracking !== null && inputTracking !== void 0 && inputTracking.enabled) {
+              var _getContextIdentifier3;
+
+              const payload = {
+                action: ACTION.INPUT_PERF_SAMPLING,
+                actionSubject: ACTION_SUBJECT.EDITOR,
+                attributes: {
+                  time: diff,
+                  nodeSize: state.doc.nodeSize,
+                  ...nodesCount,
+                  participants: getParticipantsCount(state),
+                  objectId: (_getContextIdentifier3 = getContextIdentifier(state)) === null || _getContextIdentifier3 === void 0 ? void 0 : _getContextIdentifier3.objectId,
+                  severity
+                },
+                eventType: EVENT_TYPE.OPERATIONAL
+              };
+              dispatchAnalyticsEvent(payload);
+            }
+
+            experienceStore === null || experienceStore === void 0 ? void 0 : experienceStore.success(EditorExperience.typing, {
+              nodeSize: state.doc.nodeSize,
+              ...nodesCount,
+              participants: getParticipantsCount(state),
+              objectId: (_getContextIdentifier4 = getContextIdentifier(state)) === null || _getContextIdentifier4 === void 0 ? void 0 : _getContextIdentifier4.objectId,
+              time: diff,
+              severity
             });
           }
         });

package/dist/es2019/plugins/block-type/ui/ToolbarBlockType/styled.js

@@ -14,7 +14,8 @@ export const BlockTypeMenuItem = styled.div`
       margin-top: 0;
     }
   }
-  ${props => props.selected ? `${props.tagName} { color: white }` : ''};
+  ${props => // TEMP FIX: See https://product-fabric.atlassian.net/browse/ED-13878
+props.selected ? `${props.tagName} { color: white !important; }` : ''};
 `;
 export const KeyboardShortcut = styled(Shortcut)`
   ${props => props.selected ? `color: ${N400};` : ''}

package/dist/es2019/plugins/card/index.js

@@ -28,13 +28,18 @@ const cardPlugin = options => {
     },
 
     pmPlugins() {
-      var _options$allowResizin, _options$useAlternati;
+      var _options$allowBlockCa, _options$allowResizin, _options$useAlternati;
 
+      const allowBlockCards = (_options$allowBlockCa = options.allowBlockCards) !== null && _options$allowBlockCa !== void 0 ? _options$allowBlockCa : true;
       const allowResizing = (_options$allowResizin = options.allowResizing) !== null && _options$allowResizin !== void 0 ? _options$allowResizin : true;
       const useAlternativePreloader = (_options$useAlternati = options.useAlternativePreloader) !== null && _options$useAlternati !== void 0 ? _options$useAlternati : true;
       return [{
         name: 'card',
-        plugin: createPlugin(options.platform, allowResizing, useAlternativePreloader, options.fullWidthMode, options.createAnalyticsEvent)
+        plugin: createPlugin({ ...options,
+          allowBlockCards,
+          allowResizing,
+          useAlternativePreloader
+        })
       }];
     },
 

package/dist/es2019/plugins/card/nodeviews/embedCard.js

@@ -234,6 +234,7 @@ export class EmbedCardComponent extends React.PureComponent {
         const lineLength = this.getLineLength(view, pos, widthStateLineLength);
         const containerWidth = isRichMediaInsideOfBlockNode(view, pos) ? lineLength : widthStateWidth;
         const smartCard = /*#__PURE__*/React.createElement(SmartCard, {
+          key: url,
           url: url,
           appearance: "embed",
           onClick: this.onClick,

package/dist/es2019/plugins/card/pm-plugins/main.js

@@ -8,12 +8,19 @@ import { EmbedCard } from '../nodeviews/embedCard';
 import { BlockCard } from '../nodeviews/blockCard';
 import { InlineCard } from '../nodeviews/inlineCard';
 export { pluginKey } from './plugin-key';
-export const createPlugin = (platform, allowResizing, useAlternativePreloader, fullWidthMode, createAnalyticsEvent) => ({
+export const createPlugin = options => ({
   portalProviderAPI,
   eventDispatcher,
   providerFactory,
   dispatchAnalyticsEvent
 }) => {
+  const {
+    platform,
+    allowResizing,
+    useAlternativePreloader,
+    fullWidthMode,
+    createAnalyticsEvent
+  } = options;
   return new Plugin({
     state: {
       init() {
@@ -73,7 +80,7 @@ export const createPlugin = (platform, allowResizing, useAlternativePreloader, f
                * By using this approach, the browser is free to schedule the resolution of the promises below in between rendering/network/
                * other tasks as per common implementations of the JavaScript event loop in browsers.
                */
-              const invoke = rafSchedule(() => resolveWithProvider(view, outstandingRequests, provider, request));
+              const invoke = rafSchedule(() => resolveWithProvider(view, outstandingRequests, provider, request, options));
               rafCancellationCallbacks.push(invoke.cancel);
               invoke();
             });

package/dist/es2019/plugins/card/pm-plugins/util/resolve.js

@@ -1,20 +1,27 @@
 import { setProvider } from '../actions';
-import { replaceQueuedUrlWithCard, handleFallbackWithAnalytics } from '../doc'; // ============================================================================ //
+import { replaceQueuedUrlWithCard, handleFallbackWithAnalytics } from '../doc';
+// ============================================================================ //
 // ============================== PROVIDER UTILS ============================== //
 // ============================================================================ //
 // Used for all interactions with the EditorCardProvider.
 // ============================================================================ //
-
-export const resolveWithProvider = (view, outstandingRequests, provider, request) => {
+export const resolveWithProvider = (view, outstandingRequests, provider, request, options) => {
   const handleResolve = provider.resolve(request.url, request.appearance).then(resolvedCard => {
     delete outstandingRequests[request.url];
     return resolvedCard;
-  }).then(handleResolved(view, request), handleRejected(view, request));
+  }).then(handleResolved(view, request, options), handleRejected(view, request));
   outstandingRequests[request.url] = handleResolve;
   return handleResolve;
 };
 
-const handleResolved = (view, request) => resolvedCard => {
+const updateCardType = (resolvedCard, options) => {
+  if ((resolvedCard === null || resolvedCard === void 0 ? void 0 : resolvedCard.type) === 'blockCard' && !options.allowBlockCards || (resolvedCard === null || resolvedCard === void 0 ? void 0 : resolvedCard.type) === 'embedCard' && !options.allowEmbeds) {
+    resolvedCard.type = 'inlineCard';
+  }
+};
+
+const handleResolved = (view, request, options) => resolvedCard => {
+  updateCardType(resolvedCard, options);
   replaceQueuedUrlWithCard(request.url, resolvedCard, request.analyticsAction)(view.state, view.dispatch);
   return resolvedCard;
 };

package/dist/es2019/plugins/code-block/toolbar.js

@@ -41,7 +41,7 @@ export const getToolbarConfig = (allowCopyToClipboard = false) => (state, {
     alias: lang.alias
   })); // If language is not undefined search for it in the value and then search in the aliases
 
-  const defaultValue = language ? options.find(option => option.value === language) || options.find(option => option.alias.includes(language)) : undefined;
+  const defaultValue = language ? options.find(option => option.value === language) || options.find(option => option.alias.includes(language)) : null;
   const languageSelect = {
     id: 'editor.codeBlock.languageOptions',
     type: 'select',

package/dist/es2019/plugins/emoji/styles.js

@@ -5,6 +5,8 @@ import { EmojiSharedCssClassName } from '@atlaskit/editor-common';
 import { SelectionStyle, getSelectionStyles, akEditorSelectedNodeClassName, relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
 export const emojiStyles = css`
   .${EmojiSharedCssClassName.EMOJI_CONTAINER} {
+    display: inline-block;
+
     .${EmojiSharedCssClassName.EMOJI_NODE} {
       cursor: pointer;
 

package/dist/es2019/plugins/extension/pm-plugins/main.js

@@ -97,7 +97,6 @@ export const createContextIdentifierProviderHandler = view => async (name, provi
 
 const createPlugin = (dispatch, providerFactory, extensionHandlers, portalProviderAPI, eventDispatcher, useLongPressSelection = false, options = {}) => {
   const state = createPluginState(dispatch, {
-    layout: 'default',
     showEditButton: false,
     showContextPanel: false
   });
@@ -155,14 +154,12 @@ const createPlugin = (dispatch, providerFactory, extensionHandlers, portalProvid
             const showEditButton = shouldShowEditButton(extensionHandler, extensionProvider);
             const updateExtension = getUpdateExtensionPromise(view, extensionHandler, extensionProvider).catch(() => {// do nothing;
             });
-            const layout = selectedExtension ? node.attrs.layout : 'default';
             updateState({
               localId: node.attrs.localId,
               showContextPanel: false,
               element: newElement,
               showEditButton,
-              updateExtension,
-              layout
+              updateExtension
             })(state, dispatch);
           } // New DOM element doesn't necessarily mean it's a new Node
           else if (element !== newElement) {