@atlaskit/editor-core 153.1.4 → 156.0.0

package/dist/es2019/ui/DropdownMenu/index.js

@@ -6,7 +6,7 @@ import DropList from '@atlaskit/droplist'; // eslint-disable-next-line @atlaskit
 
 import Item, { ItemGroup } from '@atlaskit/item';
 import Tooltip from '@atlaskit/tooltip';
-import { Popup } from '@atlaskit/editor-common';
+import { Popup } from '@atlaskit/editor-common/ui';
 import { akEditorFloatingPanelZIndex } from '@atlaskit/editor-shared-styles';
 import withOuterListeners from '../with-outer-listeners';
 const Wrapper = styled.div`
@@ -72,7 +72,8 @@ export default class DropdownMenuWrapper extends PureComponent {
     const {
       onItemActivated,
       onMouseEnter,
-      onMouseLeave
+      onMouseLeave,
+      shouldUseDefaultRole
     } = this.props; // onClick and value.name are the action indicators in the handlers
     // If neither are present, don't wrap in an Item.
 
@@ -86,7 +87,7 @@ export default class DropdownMenuWrapper extends PureComponent {
       key: item.key || item.content,
       isSelected: item.isActive
     }, /*#__PURE__*/React.createElement(Item, {
-      role: "menuitem",
+      role: shouldUseDefaultRole ? 'button' : 'menuitem',
       elemBefore: item.elemBefore,
       elemAfter: item.elemAfter,
       isDisabled: item.isDisabled,
@@ -100,7 +101,8 @@ export default class DropdownMenuWrapper extends PureComponent {
         item
       }),
       className: item.className,
-      "aria-label": String(item.content)
+      "aria-label": item.label || String(item.content),
+      "aria-pressed": shouldUseDefaultRole ? item.isActive : undefined
     }, /*#__PURE__*/React.createElement(ItemContentWrapper, {
       hasElemBefore: !!item.elemBefore
     }, item.content)));
@@ -130,7 +132,8 @@ export default class DropdownMenuWrapper extends PureComponent {
       fitHeight,
       fitWidth,
       isOpen,
-      zIndex
+      zIndex,
+      shouldUseDefaultRole
     } = this.props;
     return /*#__PURE__*/React.createElement(Popup, {
       target: isOpen ? target : undefined,
@@ -158,7 +161,7 @@ export default class DropdownMenuWrapper extends PureComponent {
       }
     }), items.map((group, index) => /*#__PURE__*/React.createElement(ItemGroup, {
       key: index,
-      role: "menu"
+      role: shouldUseDefaultRole ? 'group' : 'menu'
     }, group.items.map(item => this.renderItem(item))))));
   }
 

package/dist/es2019/ui/ElementBrowser/ModalElementBrowser.js

@@ -49,9 +49,8 @@ const ModalElementBrowser = props => {
     onClick: onModalClick,
     onKeyDown: onKeyDown
   }, /*#__PURE__*/React.createElement(ModalTransition, null, props.isOpen && /*#__PURE__*/React.createElement(Modal, {
-    stackIndex: 1
-    /** setting stackIndex 1 disables focus control in the modal dialog which was causing conflicts with insertion methods from prosemirror */
-    ,
+    testId: "element-browser-modal-dialog",
+    stackIndex: 0,
     key: "element-browser-modal",
     onClose: props.onClose,
     height: "664px",

package/dist/es2019/ui/ElementBrowser/components/ElementList/ElementList.js

@@ -215,7 +215,7 @@ function ElementItem({
     innerRef: ref,
     onKeyPress: onKeyPress,
     "data-testid": `element-item-${index}`,
-    tabIndex: -1,
+    tabIndex: 0,
     style: inlineMode ? null : itemStyleOverrides
   }, /*#__PURE__*/React.createElement(ItemContent, {
     title: title,

package/dist/es2019/ui/FloatingToolbar/index.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { PureComponent } from 'react';
-import { Popup } from '@atlaskit/editor-common';
+import { Popup } from '@atlaskit/editor-common/ui';
 import { Container } from './styles';
 export { handlePositionCalculatedWith, getOffsetParent, getNearestNonTextNode } from './utils';
 export default class FloatingToolbar extends PureComponent {

package/dist/es2019/ui/LinkSearch/LinkSearchList.js

@@ -25,15 +25,21 @@ export default class LinkSearchList extends PureComponent {
       items,
       selectedIndex,
       isLoading,
-      ariaControls
+      ariaControls,
+      role,
+      id
     } = this.props;
     let itemsContent;
     let loadingContent;
 
     if (items && items.length > 0) {
       itemsContent = /*#__PURE__*/React.createElement(List, {
+        id: id,
+        role: role,
         "aria-controls": ariaControls
       }, items.map((item, index) => /*#__PURE__*/React.createElement(LinkSearchListItem, {
+        id: `link-search-list-item-${index}`,
+        role: role && 'option',
         item: item,
         selected: selectedIndex === index,
         onMouseMove: onMouseMove,

package/dist/es2019/ui/LinkSearch/LinkSearchListItem.js

@@ -6,12 +6,9 @@ import styled from 'styled-components'; // AFP-2532 TODO: Fix automatic suppress
 import { fontSizeSmall } from '@atlaskit/theme';
 import { N20, N300, N800 } from '@atlaskit/theme/colors';
 import { relativeFontSizeToBase16 } from '@atlaskit/editor-shared-styles';
-import formatDistance from 'date-fns/formatDistance';
-import differenceInCalendarDays from 'date-fns/differenceInCalendarDays';
-import format from 'date-fns/format';
 import { getCorrectAltByIconUrl } from './listItemAlts';
+import { transformTimeStamp } from './transformTimeStamp';
 import { injectIntl } from 'react-intl-next';
-import messages from '../../messages';
 export const Container = styled.li`
   background-color: ${props => props.selected ? N20 : 'transparent'};
   padding: 8px 12px;
@@ -106,57 +103,29 @@ class LinkSearchListItem extends React.PureComponent {
     return null;
   }
 
-  renderWithSpaces(pageAction, dateString, timeSince = '') {
-    return /*#__PURE__*/React.createElement(React.Fragment, null, "\xA0 \u2022", /*#__PURE__*/React.createElement("span", {
-      className: "link-search-timestamp",
-      "data-test-id": "link-search-timestamp"
-    }, "\xA0 ", pageAction, " ", dateString, " ", timeSince));
-  }
-
-  renderAbsoluteOrRelativeDate(timeStamp, pageAction) {
+  renderTimeStamp() {
     const {
+      item,
       intl
     } = this.props;
-    let pageActionText = '';
-
-    switch (pageAction) {
-      case 'updated':
-        pageActionText = intl.formatMessage(messages.timeUpdated);
-        break;
-
-      case 'viewed':
-        pageActionText = intl.formatMessage(messages.timeViewed);
-        break;
-    }
-
-    if (differenceInCalendarDays(timeStamp, Date.now()) < -7) {
-      return this.renderWithSpaces(pageActionText, format(timeStamp, 'MMMM dd, yyyy'));
-    }
-
-    return this.renderWithSpaces(pageActionText, formatDistance(timeStamp, Date.now()), intl.formatMessage(messages.timeAgo));
-  }
-
-  renderTimeStamp() {
-    const {
-      lastUpdatedDate,
-      lastViewedDate
-    } = this.props.item;
-
-    if (lastViewedDate) {
-      return this.renderAbsoluteOrRelativeDate(lastViewedDate, 'viewed');
-    }
-
-    if (lastUpdatedDate) {
-      return this.renderAbsoluteOrRelativeDate(lastUpdatedDate, 'updated');
-    }
+    const date = transformTimeStamp(intl, item.lastViewedDate, item.lastUpdatedDate);
+    return date && /*#__PURE__*/React.createElement(React.Fragment, null, "\xA0 \u2022", /*#__PURE__*/React.createElement("span", {
+      className: "link-search-timestamp",
+      "data-test-id": "link-search-timestamp"
+    }, "\xA0 ", date.pageAction, " ", date.dateString, " ", date.timeSince || ''));
   }
 
   render() {
     const {
       item,
-      selected
+      selected,
+      id,
+      role
     } = this.props;
     return /*#__PURE__*/React.createElement(Container, {
+      role: role,
+      id: id,
+      "aria-selected": selected,
       "data-testid": "link-search-list-item",
       selected: selected,
       onMouseMove: this.handleMouseMove,

package/dist/es2019/ui/LinkSearch/transformTimeStamp.js

@@ -0,0 +1,41 @@
+import formatDistance from 'date-fns/formatDistance';
+import differenceInCalendarDays from 'date-fns/differenceInCalendarDays';
+import format from 'date-fns/format';
+import messages from '../../messages';
+
+const renderAbsoluteOrRelativeDate = (timeStamp, pageAction, intl) => {
+  let pageActionText = '';
+
+  switch (pageAction) {
+    case 'updated':
+      pageActionText = intl.formatMessage(messages.timeUpdated);
+      break;
+
+    case 'viewed':
+      pageActionText = intl.formatMessage(messages.timeViewed);
+      break;
+  }
+
+  if (differenceInCalendarDays(timeStamp, Date.now()) < -7) {
+    return {
+      pageAction: pageActionText,
+      dateString: format(timeStamp, 'MMMM dd, yyyy')
+    };
+  }
+
+  return {
+    pageAction: pageActionText,
+    dateString: formatDistance(timeStamp, Date.now()),
+    timeSince: intl.formatMessage(messages.timeAgo)
+  };
+};
+
+export const transformTimeStamp = (intl, lastViewedDate, lastUpdatedDate) => {
+  if (lastViewedDate) {
+    return renderAbsoluteOrRelativeDate(lastViewedDate, 'viewed', intl);
+  }
+
+  if (lastUpdatedDate) {
+    return renderAbsoluteOrRelativeDate(lastUpdatedDate, 'updated', intl);
+  }
+};

package/dist/es2019/ui/LinkSearch/withActivityProvider.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React from 'react';
-import { WithProviders } from '@atlaskit/editor-common';
+import { WithProviders } from '@atlaskit/editor-common/provider-factory';
 export default function withActivityProvider(WrappedComponent) {
   return class WithActivityProvider extends React.Component {
     constructor(...args) {

package/dist/es2019/ui/PanelTextInput/index.js

@@ -2,7 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React from 'react';
 import { PureComponent } from 'react';
 import { Input } from './styles';
-import { browser } from '@atlaskit/editor-common';
+import { browser } from '@atlaskit/editor-common/utils';
 const KeyZCode = 90;
 const KeyYCode = 89;
 export default class PanelTextInput extends PureComponent {
@@ -109,12 +109,22 @@ export default class PanelTextInput extends PureComponent {
       maxLength,
       testId,
       ariaLabel,
-      describedById
+      describedById,
+      ariaActiveDescendant,
+      ariaControls,
+      ariaExpanded,
+      ariaAutoComplete,
+      role
     } = this.props;
     const {
       value
     } = this.state;
     return /*#__PURE__*/React.createElement(Input, {
+      role: role,
+      "aria-autocomplete": ariaAutoComplete ? 'list' : undefined,
+      "aria-expanded": ariaExpanded,
+      "aria-controls": ariaControls,
+      "aria-activedescendant": ariaActiveDescendant,
       "aria-describedby": describedById,
       "data-testid": testId || '',
       type: "text",

package/dist/es2019/ui/Resizer/index.js

@@ -4,7 +4,7 @@ import classnames from 'classnames';
 import { Resizable } from 're-resizable';
 import { gridTypeForLayout } from '../../plugins/grid';
 import { snapTo, handleSides } from './utils';
-import { richMediaClassName } from '@atlaskit/editor-common';
+import { richMediaClassName } from '@atlaskit/editor-common/styles';
 import { akRichMediaResizeZIndex } from '@atlaskit/editor-shared-styles';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '../../plugins/analytics';
 

package/dist/es2019/ui/Resizer/styled.js

@@ -1,4 +1,4 @@
-import { MediaSingleDimensionHelper } from '@atlaskit/editor-common';
+import { MediaSingleDimensionHelper } from '@atlaskit/editor-common/ui';
 import styled from 'styled-components';
 export const Wrapper = styled.div`
   & > div {

package/dist/es2019/ui/ToolbarButton/index.js

@@ -27,6 +27,10 @@ const ToolbarButton = /*#__PURE__*/React.forwardRef((props, ref) => {
     title,
     titlePosition = 'top',
     item,
+    'aria-label': ariaLabel,
+    'aria-haspopup': ariaHasPopup,
+    'aria-expanded': ariaExpanded,
+    'aria-pressed': ariaPressed,
     onClick,
     onItemClick
   } = props;
@@ -52,17 +56,14 @@ const ToolbarButton = /*#__PURE__*/React.forwardRef((props, ref) => {
       onItemClick(item);
     }
   }, [disabled, onClick, onItemClick, item, buttonId]);
-  const ariaLabel = props['aria-label'];
   const id = buttonId ? `editor-toolbar__${buttonId}` : undefined;
   const button = /*#__PURE__*/React.createElement(Button, {
     id: id,
     ref: ref,
     appearance: "subtle",
-    "aria-haspopup": true,
     testId: testId,
     className: className,
     href: href,
-    "aria-label": ariaLabel,
     iconAfter: iconAfter,
     iconBefore: iconBefore,
     isDisabled: disabled,
@@ -70,7 +71,11 @@ const ToolbarButton = /*#__PURE__*/React.forwardRef((props, ref) => {
     onClick: handleClick,
     spacing: spacing || 'default',
     target: target,
-    shouldFitContainer: true
+    shouldFitContainer: true,
+    "aria-expanded": ariaExpanded,
+    "aria-haspopup": ariaHasPopup,
+    "aria-label": ariaLabel,
+    "aria-pressed": ariaPressed
   }, children);
 
   if (!title) {

package/dist/es2019/ui/ToolbarFeedback/index.js

@@ -4,7 +4,7 @@ import ReactDOM from 'react-dom';
 import { PureComponent } from 'react';
 import PropTypes from 'prop-types';
 import Spinner from '@atlaskit/spinner';
-import { Popup } from '@atlaskit/editor-common';
+import { Popup } from '@atlaskit/editor-common/ui';
 import ButtonGroup from '@atlaskit/button/button-group';
 import Button from '@atlaskit/button/custom-theme-button';
 import ToolbarButton from '../ToolbarButton';

package/dist/es2019/ui/ToolbarHelp/index.js

@@ -2,16 +2,31 @@ import React from 'react';
 import QuestionIcon from '@atlaskit/icon/glyph/question';
 import ToolbarButton from '../ToolbarButton';
 import WithHelpTrigger from '../WithHelpTrigger';
-export default (({
+import { injectIntl } from 'react-intl-next';
+import { messages } from './messages';
+
+const tooltipHelpTrigger = ({
   title = 'Open help dialog',
-  titlePosition = 'left'
-}) => /*#__PURE__*/React.createElement(WithHelpTrigger, {
-  render: showHelp => /*#__PURE__*/React.createElement(ToolbarButton, {
-    onClick: showHelp,
-    title: title,
-    titlePosition: titlePosition,
-    iconBefore: /*#__PURE__*/React.createElement(QuestionIcon, {
-      label: title
+  titlePosition = 'left',
+  intl
+}) => {
+  // to have translation for the default tooltip helper
+  let displayTitle = title;
+
+  if (title === 'Open help dialog') {
+    displayTitle = intl.formatMessage(messages.toolbarHelpTitle);
+  }
+
+  return /*#__PURE__*/React.createElement(WithHelpTrigger, {
+    render: showHelp => /*#__PURE__*/React.createElement(ToolbarButton, {
+      onClick: showHelp,
+      title: displayTitle,
+      titlePosition: titlePosition,
+      iconBefore: /*#__PURE__*/React.createElement(QuestionIcon, {
+        label: displayTitle
+      })
     })
-  })
-}));
+  });
+};
+
+export default injectIntl(tooltipHelpTrigger);

package/dist/es2019/ui/ToolbarHelp/messages.js

@@ -0,0 +1,8 @@
+import { defineMessages } from 'react-intl-next';
+export const messages = defineMessages({
+  toolbarHelpTitle: {
+    id: 'fabric.editor.headingLink.toolbarHelpTitle',
+    defaultMessage: 'Open help dialog',
+    description: 'a label for a button that provides help'
+  }
+});

package/dist/es2019/ui/WidthEmitter/index.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { pluginKey as widthPluginKey } from '../../plugins/width';
-import { WidthConsumer } from '@atlaskit/editor-common';
+import { WidthConsumer } from '@atlaskit/editor-common/ui';
 import { ContextPanelConsumer } from '../ContextPanel/context';
 
 function useCreateWidthCallbacks({

package/dist/es2019/ui/WithPluginState/index.js

@@ -1,7 +1,7 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React from 'react';
 import PropTypes from 'prop-types';
-import { startMeasure, stopMeasure } from '@atlaskit/editor-common';
+import { startMeasure, stopMeasure } from '@atlaskit/editor-common/utils';
 import { createDispatch } from '../../event-dispatcher';
 import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '../../plugins/analytics';
 import { analyticsEventKey } from '../../plugins/analytics/consts';

package/dist/es2019/utils/announcer/announcer.js

@@ -0,0 +1,38 @@
+import React, { forwardRef, memo, useState, useEffect } from 'react'; // How to use:
+// https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions#Preferring_specialized_live_region_roles
+// Demo: https://dequeuniversity.com/library/aria/liveregion-playground
+// Important: Strongly recommend test your solution in all supported screen readers
+// if you use non default value of properties: ariaAtomic, ariaLive, ariaRelevant, role
+// Note: Text won't be announced if the text message doesn't change after the render.
+// For using a forced announcement in this case, set the 'key' attribute - key={Date.now()}
+
+// Note: Flag 'contentRendered' resolves bug with duplicates messages (NVDA + Firefox)
+// https://github.com/nvaccess/nvda/labels/bug%2Fdouble-speaking
+let timer;
+const Announcer = /*#__PURE__*/forwardRef(({
+  ariaAtomic = 'true',
+  ariaLive = 'polite',
+  ariaRelevant = 'all',
+  role = 'status',
+  text = '',
+  delay = 0
+}, ref) => {
+  const [contentRendered, setContentRendered] = useState(false);
+  useEffect(() => {
+    clearTimeout(timer);
+    setContentRendered(false);
+    timer = setTimeout(() => {
+      setContentRendered(true);
+    }, delay);
+    return () => clearTimeout(timer);
+  }, [text, delay]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "assistive",
+    ref: ref,
+    role: role,
+    "aria-atomic": ariaAtomic,
+    "aria-relevant": ariaRelevant,
+    "aria-live": ariaLive
+  }, contentRendered && /*#__PURE__*/React.createElement("span", null, text));
+});
+export default /*#__PURE__*/memo(Announcer);

package/dist/es2019/utils/document.js

@@ -1,7 +1,7 @@
 import { Node } from 'prosemirror-model';
-import { transformTextLinkCodeMarks } from '@atlaskit/adf-utils';
+import { transformMediaLinkMarks, transformTextLinkCodeMarks } from '@atlaskit/adf-utils';
 import { sanitizeNodeForPrivacy } from '../utils/filter/privacy-filter';
-import { validateADFEntity, findAndTrackUnsupportedContentNodes } from '@atlaskit/editor-common';
+import { validateADFEntity, findAndTrackUnsupportedContentNodes } from '@atlaskit/editor-common/utils';
 import { getBreakoutMode } from './node-width';
 import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '../plugins/analytics/types/enums';
 /**
@@ -170,6 +170,21 @@ export function processRawValue(schema, value, providerFactory, sanitizePrivateC
 
     if (contentTransformer) {
       return Node.fromJSON(schema, node);
+    } // link mark on mediaSingle is deprecated, need to move link mark to child media node
+    // https://product-fabric.atlassian.net/browse/ED-14043
+
+
+    let {
+      transformedAdf,
+      isTransformed
+    } = transformMediaLinkMarks(node);
+
+    if (isTransformed && dispatchAnalyticsEvent) {
+      dispatchAnalyticsEvent({
+        action: ACTION.MEDIA_LINK_TRANSFORMED,
+        actionSubject: ACTION_SUBJECT.EDITOR,
+        eventType: EVENT_TYPE.OPERATIONAL
+      });
     } // See: HOT-97965 https://product-fabric.atlassian.net/browse/ED-14400
     // We declared in code mark spec that links and marks should not co-exist on
     // text nodes. This util strips code marks from bad text nodes and preserves links.
@@ -177,10 +192,9 @@ export function processRawValue(schema, value, providerFactory, sanitizePrivateC
     // and preserving code marks during content changes.
 
 
-    let {
-      transformedAdf,
-      isTransformed
-    } = transformTextLinkCodeMarks(node);
+    const transformResult = transformTextLinkCodeMarks(node);
+    transformedAdf = transformResult.transformedAdf;
+    isTransformed = transformResult.isTransformed;
 
     if (isTransformed && dispatchAnalyticsEvent) {
       dispatchAnalyticsEvent({

package/dist/es2019/utils/extensions.js

@@ -1,6 +1,7 @@
 import React from 'react';
 import Loadable from 'react-loadable';
-import { combineProviders, getQuickInsertItemsFromModule, resolveImport } from '@atlaskit/editor-common';
+import { getQuickInsertItemsFromModule, resolveImport } from '@atlaskit/editor-common/extensions';
+import { combineProviders } from '@atlaskit/editor-common/provider-helpers';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '../plugins/analytics/types/enums';
 import { fireAnalyticsEvent } from '../plugins/analytics';
 /**

package/dist/es2019/utils/input-rules.js

@@ -180,7 +180,7 @@ const isCursorInsideUnsupportedMarks = (state, marksNameUnsupported) => {
 
 
 import { inputRules as unpredictableInputRulesPlugin, InputRule as UnpredictableInputRule } from 'prosemirror-inputrules';
-import { startMeasure, stopMeasure } from '@atlaskit/editor-common';
+import { startMeasure, stopMeasure } from '@atlaskit/editor-common/utils';
 
 function createUnpredictableInputRulePlugin(pluginName, rules, isBlockNodeRule = false) {
   const hasUnsupportedMarkForBlockInputRule = (state, start, end) => {

package/dist/es2019/utils/keymap.js

@@ -1,4 +1,4 @@
-import { Plugin } from 'prosemirror-state';
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { keydownHandler } from 'prosemirror-keymap';
 import { base, keyName } from 'w3c-keyname';
 /**
@@ -10,7 +10,7 @@ import { base, keyName } from 'w3c-keyname';
  */
 
 export function keymap(bindings) {
-  return new Plugin({
+  return new SafePlugin({
     props: {
       handleKeyDown(view, event) {
         const name = keyName(event);

package/dist/es2019/utils/node-width.js

@@ -1,5 +1,5 @@
 import { findParentNodeOfTypeClosestToPos } from 'prosemirror-utils';
-import { absoluteBreakoutWidth } from '@atlaskit/editor-common';
+import { absoluteBreakoutWidth } from '@atlaskit/editor-common/utils';
 import { akEditorFullWidthLayoutWidth, akLayoutGutterOffset, gridMediumMaxWidth } from '@atlaskit/editor-shared-styles';
 import { LAYOUT_SECTION_MARGIN, LAYOUT_COLUMN_PADDING } from '../plugins/layout/styles';
 import { BODIED_EXT_PADDING } from '../plugins/extension/ui/Extension/styles';

package/dist/es2019/utils/performance/instrumented-plugin.js

@@ -1,6 +1,7 @@
-import { Plugin } from 'prosemirror-state';
-import { startMeasure, stopMeasure } from '@atlaskit/editor-common';
-export class InstrumentedPlugin extends Plugin {
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import { startMeasure, stopMeasure } from '@atlaskit/editor-common/utils';
+import { freezeUnsafeTransactionProperties } from './safer-transactions';
+export class InstrumentedPlugin extends SafePlugin {
   constructor(spec, options = {}, transactionTracker) {
     const {
       transactionTracking = {
@@ -8,16 +9,24 @@ export class InstrumentedPlugin extends Plugin {
       },
       uiTracking = {
         enabled: false
-      }
+      },
+      saferDispatchedTransactions = false,
+      dispatchAnalyticsEvent
     } = options;
+    const shouldOverrideApply = transactionTracking.enabled && transactionTracker || saferDispatchedTransactions;
 
-    if (transactionTracking.enabled && spec.state && transactionTracker) {
+    if (shouldOverrideApply && spec.state) {
       const originalApply = spec.state.apply.bind(spec.state);
 
-      spec.state.apply = (tr, value, oldState, newState) => {
-        const shouldTrackTransactions = transactionTracker.shouldTrackTransaction(transactionTracking);
+      spec.state.apply = (aTr, value, oldState, newState) => {
+        const self = this;
+        const tr = saferDispatchedTransactions ? new Proxy(aTr, freezeUnsafeTransactionProperties({
+          dispatchAnalyticsEvent,
+          pluginKey: self.key
+        })) : aTr;
+        const shouldTrackTransactions = transactionTracker === null || transactionTracker === void 0 ? void 0 : transactionTracker.shouldTrackTransaction(transactionTracking);
 
-        if (!shouldTrackTransactions) {
+        if (!shouldTrackTransactions || !transactionTracker) {
           return originalApply(tr, value, oldState, newState);
         }
 
@@ -25,7 +34,6 @@ export class InstrumentedPlugin extends Plugin {
           startMeasure,
           stopMeasure
         } = transactionTracker.getMeasureHelpers(transactionTracking);
-        const self = this;
         const measure = `🦉${self.key}::apply`;
         startMeasure(measure);
         const result = originalApply(tr, value, oldState, newState);

package/dist/es2019/utils/performance/safer-transactions.js

@@ -0,0 +1,43 @@
+import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '../../plugins/analytics';
+export const UNSAFE_PROPERTY_SET_ERROR = 'Setting an unsafe property on transaction after dispatch!'; // since selection uses curSelection under the hood, we guard setSelection instead
+
+const isUnsafeMethod = prop => ['setSelection'].includes(prop.toString());
+
+const isReadOnlyProperty = prop => ['doc', 'docs', 'steps', 'selection'].includes(prop.toString());
+
+export const freezeUnsafeTransactionProperties = ({
+  dispatchAnalyticsEvent,
+  pluginKey
+}) => {
+  const isUnsafe = () => {
+    if (dispatchAnalyticsEvent) {
+      dispatchAnalyticsEvent({
+        action: ACTION.TRANSACTION_MUTATED_AFTER_DISPATCH,
+        actionSubject: ACTION_SUBJECT.EDITOR,
+        eventType: EVENT_TYPE.OPERATIONAL,
+        attributes: {
+          pluginKey: pluginKey || 'unknown'
+        }
+      });
+    }
+
+    throw new Error(UNSAFE_PROPERTY_SET_ERROR);
+  };
+
+  return {
+    get: function (target, prop, receiver) {
+      if (isUnsafeMethod(prop)) {
+        isUnsafe();
+      }
+
+      return Reflect.get(target, prop, receiver);
+    },
+    set: function (target, prop, receiver) {
+      if (isReadOnlyProperty(prop)) {
+        isUnsafe();
+      }
+
+      return Reflect.set(target, prop, receiver);
+    }
+  };
+};

package/dist/es2019/utils/performance/track-transactions.js

@@ -1,5 +1,5 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import { isPerformanceAPIAvailable, startMeasure, stopMeasure } from '@atlaskit/editor-common';
+import { isPerformanceAPIAvailable, startMeasure, stopMeasure } from '@atlaskit/editor-common/utils';
 import { getTimeSince } from './get-performance-timing';
 export const EVENT_NAME_STATE_APPLY = `🦉 EditorView::state::apply`;
 export const EVENT_NAME_UPDATE_STATE = `🦉 EditorView::updateState`;