@atlaskit/editor-plugin-synced-block 5.1.9 → 5.1.10

package/dist/esm/pm-plugins/experience-tracking/delete-reference-experience.js

@@ -0,0 +1,169 @@
+import { bind } from 'bind-event-listener';
+import { ACTION_SUBJECT, ACTION_SUBJECT_ID } from '@atlaskit/editor-common/analytics';
+import { Experience, ExperienceCheckDomMutation, ExperienceCheckTimeout } from '@atlaskit/editor-common/experiences';
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import { PluginKey } from '@atlaskit/editor-prosemirror/state';
+import { EXPERIENCE_ABORT_REASON } from '../../types';
+import { getRemovedResourceIds, getTarget, wasSyncBlockDeletedOrAddedByHistory } from '../utils/experience-tracking-utils';
+var pluginKey = new PluginKey('deleteReferenceSyncBlockExperience');
+var START_METHOD = {
+  ELEMENT_TOOLBAR: 'element-toolbar',
+  DELETE: 'delete',
+  TYPED_OVER: 'typed-over',
+  CUT: 'cut',
+  UNDO: 'undo',
+  REDO: 'redo'
+};
+
+/**
+ * This experience tracks when a reference sync block is deleted.
+ *
+ * Start: When user deletes ref sync block from toolbar, presses delete when cursor is in front of ref sync block,
+ * presses any key with a ref sync block selected, cuts with a ref sync block selected, triggers undo/redo that deletes a ref sync block
+ * Success: When the sync block is removed from the DOM within 2000ms of start
+ * Failure: When 2000ms passes without the reference sync block being removed from the DOM
+ */
+export var getDeleteReferenceExperiencePlugin = function getDeleteReferenceExperiencePlugin(_ref) {
+  var refs = _ref.refs,
+    dispatchAnalyticsEvent = _ref.dispatchAnalyticsEvent,
+    syncBlockStore = _ref.syncBlockStore;
+  var experience = getDeleteReferenceExperience({
+    refs: refs,
+    dispatchAnalyticsEvent: dispatchAnalyticsEvent
+  });
+  syncBlockStore.sourceManager.setDeleteExperience(experience);
+  var unbindClickListener = bind(document, {
+    type: 'click',
+    listener: function listener(event) {
+      var target = event.target;
+      if (!target) {
+        return;
+      }
+      var button = target.closest('button[data-testid]');
+      if (!button || !(button instanceof HTMLButtonElement)) {
+        return;
+      }
+      var testId = button.dataset.testid;
+      if (isReferenceSyncedBlockDeleteButtonId(testId)) {
+        experience.start({
+          method: START_METHOD.ELEMENT_TOOLBAR
+        });
+      }
+    }
+  });
+  return new SafePlugin({
+    key: pluginKey,
+    props: {
+      handleDOMEvents: {
+        cut: function cut(view) {
+          var state = view.state;
+          if (hasSyncBlockInSelection(state.selection)) {
+            experience.start({
+              method: START_METHOD.CUT
+            });
+          }
+          return false;
+        },
+        keydown: function keydown(view, event) {
+          var state = view.state;
+          var hasSelection = hasSyncBlockInSelection(state.selection);
+          var hasAdjacent = hasSyncBlockBeforeCursor(state.selection);
+          if (hasSelection) {
+            experience.start({
+              method: START_METHOD.TYPED_OVER
+            });
+          }
+          if (isDeleteKey(event.key) && hasAdjacent) {
+            experience.start({
+              method: START_METHOD.DELETE
+            });
+          }
+          return false;
+        }
+      }
+    },
+    appendTransaction: function appendTransaction(transactions, oldState, newState) {
+      transactions.forEach(function (tr) {
+        var _wasSyncBlockDeletedO = wasSyncBlockDeletedOrAddedByHistory(tr, oldState, newState),
+          hasDeletedSyncBlock = _wasSyncBlockDeletedO.hasDeletedSyncBlock,
+          isUndo = _wasSyncBlockDeletedO.isUndo;
+        if (hasDeletedSyncBlock) {
+          experience.start({
+            method: isUndo ? START_METHOD.UNDO : START_METHOD.REDO
+          });
+        }
+      });
+      return null;
+    },
+    view: function view() {
+      return {
+        destroy: function destroy() {
+          experience.abort({
+            reason: EXPERIENCE_ABORT_REASON.EDITOR_DESTROYED
+          });
+          unbindClickListener();
+        }
+      };
+    }
+  });
+};
+export var getDeleteReferenceExperience = function getDeleteReferenceExperience(_ref2) {
+  var refs = _ref2.refs,
+    dispatchAnalyticsEvent = _ref2.dispatchAnalyticsEvent;
+  return new Experience(ACTION_SUBJECT.SYNCED_BLOCK, {
+    actionSubjectId: ACTION_SUBJECT_ID.REFERENCE_SYNCED_BLOCK_DELETE,
+    dispatchAnalyticsEvent: dispatchAnalyticsEvent,
+    checks: [new ExperienceCheckTimeout({
+      durationMs: 2000
+    }), new ExperienceCheckDomMutation({
+      onDomMutation: function onDomMutation(_ref3) {
+        var mutations = _ref3.mutations;
+        var deletedResourceIds = getRemovedResourceIds(mutations, '[data-prosemirror-node-name="syncBlock"]');
+        if (deletedResourceIds.length > 0) {
+          return {
+            status: 'success',
+            metadata: {
+              deletedResourceIds: deletedResourceIds
+            }
+          };
+        }
+        return undefined;
+      },
+      observeConfig: function observeConfig() {
+        return {
+          target: getTarget(refs.containerElement),
+          options: {
+            childList: true
+          }
+        };
+      }
+    })]
+  });
+};
+var isReferenceSyncedBlockDeleteButtonId = function isReferenceSyncedBlockDeleteButtonId(testId) {
+  return testId === 'reference-synced-block-delete-button';
+};
+var isDeleteKey = function isDeleteKey(key) {
+  return key === 'Delete' || key === 'Backspace';
+};
+var hasSyncBlockInSelection = function hasSyncBlockInSelection(selection) {
+  var syncBlock = selection.$from.doc.type.schema.nodes.syncBlock;
+  var found = false;
+  selection.$from.doc.nodesBetween(selection.from, selection.to, function (node) {
+    if (node.type === syncBlock) {
+      found = true;
+      return false;
+    }
+    // sync block nodes can only be found at the top level
+    return false;
+  });
+  return found;
+};
+var hasSyncBlockBeforeCursor = function hasSyncBlockBeforeCursor(selection) {
+  if (!selection.empty) {
+    return false;
+  }
+  var syncBlock = selection.$from.doc.type.schema.nodes.syncBlock;
+  var nodeBefore = selection.$from.nodeBefore;
+  return (nodeBefore === null || nodeBefore === void 0 ? void 0 : nodeBefore.type) === syncBlock;
+};

package/dist/esm/pm-plugins/experience-tracking/delete-source-experience.js

@@ -0,0 +1,97 @@
+import { bind } from 'bind-event-listener';
+import { ACTION_SUBJECT, ACTION_SUBJECT_ID } from '@atlaskit/editor-common/analytics';
+import { Experience, ExperienceCheckDomMutation, ExperienceCheckTimeout } from '@atlaskit/editor-common/experiences';
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import { PluginKey } from '@atlaskit/editor-prosemirror/state';
+import { EXPERIENCE_ABORT_REASON } from '../../types';
+import { getRemovedResourceIds, getTarget } from '../utils/experience-tracking-utils';
+var pluginKey = new PluginKey('deleteSourceSyncBlockExperience');
+var START_METHOD = {
+  DELETE_CONFIRM_BUTTON: 'delete-confirm-button'
+};
+
+/**
+ * This experience tracks when a source sync block is deleted.
+ *
+ * Start: When user clicks the delete button in the delete modal
+ * Success: When the sync block is removed from the DOM within 2000ms of start
+ * Failure: When 2000ms passes without the source sync block being removed from the DOM
+ */
+export var getDeleteSourceExperiencePlugin = function getDeleteSourceExperiencePlugin(_ref) {
+  var refs = _ref.refs,
+    dispatchAnalyticsEvent = _ref.dispatchAnalyticsEvent,
+    syncBlockStore = _ref.syncBlockStore;
+  var experience = getDeleteSourceExperience({
+    refs: refs,
+    dispatchAnalyticsEvent: dispatchAnalyticsEvent
+  });
+  syncBlockStore.sourceManager.setDeleteExperience(experience);
+  var unbindClickListener = bind(document, {
+    type: 'click',
+    listener: function listener(event) {
+      var target = event.target;
+      if (!target) {
+        return;
+      }
+      var button = target.closest('button[data-testid]');
+      if (!button || !(button instanceof HTMLButtonElement)) {
+        return;
+      }
+      var testId = button.dataset.testid;
+      if (isSyncedBlockDeleteButtonId(testId)) {
+        experience.start({
+          method: START_METHOD.DELETE_CONFIRM_BUTTON
+        });
+      }
+    }
+  });
+  return new SafePlugin({
+    key: pluginKey,
+    view: function view() {
+      return {
+        destroy: function destroy() {
+          experience.abort({
+            reason: EXPERIENCE_ABORT_REASON.EDITOR_DESTROYED
+          });
+          unbindClickListener();
+        }
+      };
+    }
+  });
+};
+export var getDeleteSourceExperience = function getDeleteSourceExperience(_ref2) {
+  var refs = _ref2.refs,
+    dispatchAnalyticsEvent = _ref2.dispatchAnalyticsEvent;
+  return new Experience(ACTION_SUBJECT.SYNCED_BLOCK, {
+    actionSubjectId: ACTION_SUBJECT_ID.SYNCED_BLOCK_DELETE,
+    dispatchAnalyticsEvent: dispatchAnalyticsEvent,
+    checks: [new ExperienceCheckTimeout({
+      durationMs: 2000
+    }), new ExperienceCheckDomMutation({
+      onDomMutation: function onDomMutation(_ref3) {
+        var mutations = _ref3.mutations;
+        var deletedResourceIds = getRemovedResourceIds(mutations, '[data-prosemirror-node-name="bodiedSyncBlock"]');
+        if (deletedResourceIds.length > 0) {
+          return {
+            status: 'success',
+            metadata: {
+              deletedResourceIds: deletedResourceIds
+            }
+          };
+        }
+        return undefined;
+      },
+      observeConfig: function observeConfig() {
+        return {
+          target: getTarget(refs.containerElement),
+          options: {
+            childList: true
+          }
+        };
+      }
+    })]
+  });
+};
+var isSyncedBlockDeleteButtonId = function isSyncedBlockDeleteButtonId(testId) {
+  return testId === 'synced-block-delete-confirmation-modal-delete-button';
+};

package/dist/esm/pm-plugins/experience-tracking/get-experience-tracking-plugins.js

@@ -1,5 +1,8 @@
 import { getCreateReferenceExperiencePlugin } from "./create-reference-experience";
 import { getCreateSourceExperiencePlugin } from "./create-source-experience";
+import { getDeleteReferenceExperiencePlugin } from "./delete-reference-experience";
+import { getDeleteSourceExperiencePlugin } from "./delete-source-experience";
+import { getProviderOnlyExperiencesPlugin } from "./provider-only-experiences";
 export var getExperienceTrackingPlugins = function getExperienceTrackingPlugins(_ref) {
   var refs = _ref.refs,
     dispatchAnalyticsEvent = _ref.dispatchAnalyticsEvent,
@@ -21,5 +24,32 @@ export var getExperienceTrackingPlugins = function getExperienceTrackingPlugins(
         syncBlockStore: syncBlockStore
       });
     }
+  }, {
+    name: 'deleteSourceExperiencePlugin',
+    plugin: function plugin() {
+      return getDeleteSourceExperiencePlugin({
+        refs: refs,
+        dispatchAnalyticsEvent: dispatchAnalyticsEvent,
+        syncBlockStore: syncBlockStore
+      });
+    }
+  }, {
+    name: 'deleteReferenceExperiencePlugin',
+    plugin: function plugin() {
+      return getDeleteReferenceExperiencePlugin({
+        refs: refs,
+        dispatchAnalyticsEvent: dispatchAnalyticsEvent,
+        syncBlockStore: syncBlockStore
+      });
+    }
+  }, {
+    name: 'providerOnlySyncedBlockExperiencesPlugin',
+    plugin: function plugin() {
+      return getProviderOnlyExperiencesPlugin({
+        refs: refs,
+        dispatchAnalyticsEvent: dispatchAnalyticsEvent,
+        syncBlockStore: syncBlockStore
+      });
+    }
   }];
 };

package/dist/esm/pm-plugins/experience-tracking/provider-only-experiences.js

@@ -0,0 +1,122 @@
+import { ACTION_SUBJECT, ACTION_SUBJECT_ID } from '@atlaskit/editor-common/analytics';
+import { Experience, ExperienceCheckTimeout } from '@atlaskit/editor-common/experiences';
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import { PluginKey } from '@atlaskit/editor-prosemirror/state';
+import { EXPERIENCE_ABORT_REASON } from '../../types';
+var pluginKey = new PluginKey('providerOnlySyncBlockExperiences');
+export var getProviderOnlyExperiencesPlugin = function getProviderOnlyExperiencesPlugin(_ref) {
+  var refs = _ref.refs,
+    dispatchAnalyticsEvent = _ref.dispatchAnalyticsEvent,
+    syncBlockStore = _ref.syncBlockStore;
+  var saveSourceExperience = getSaveSourceExperience({
+    refs: refs,
+    dispatchAnalyticsEvent: dispatchAnalyticsEvent
+  });
+  syncBlockStore.sourceManager.setSaveExperience(saveSourceExperience);
+  var saveReferenceExperience = getSaveReferenceExperience({
+    refs: refs,
+    dispatchAnalyticsEvent: dispatchAnalyticsEvent
+  });
+  var fetchExperience = getFetchExperience({
+    refs: refs,
+    dispatchAnalyticsEvent: dispatchAnalyticsEvent
+  });
+  var fetchSourceInfoExperience = getFetchSourceInfoExperience({
+    refs: refs,
+    dispatchAnalyticsEvent: dispatchAnalyticsEvent
+  });
+  syncBlockStore.referenceManager.setExperiences(fetchExperience, fetchSourceInfoExperience, saveReferenceExperience);
+  return new SafePlugin({
+    key: pluginKey,
+    view: function view() {
+      return {
+        destroy: function destroy() {
+          saveSourceExperience.abort({
+            reason: EXPERIENCE_ABORT_REASON.EDITOR_DESTROYED
+          });
+          saveReferenceExperience.abort({
+            reason: EXPERIENCE_ABORT_REASON.EDITOR_DESTROYED
+          });
+          fetchExperience.abort({
+            reason: EXPERIENCE_ABORT_REASON.EDITOR_DESTROYED
+          });
+          fetchSourceInfoExperience.abort({
+            reason: EXPERIENCE_ABORT_REASON.EDITOR_DESTROYED
+          });
+        }
+      };
+    }
+  });
+};
+
+/**
+ * This experience tracks when a source sync block is saved to the BE.
+ *
+ * Start: When the flush source sync block function is called.
+ * Success: When the sync block save is successful within 1500ms of start.
+ * Failure: When 1500ms passes without the sync block being successfully saved
+ */
+var getSaveSourceExperience = function getSaveSourceExperience(_ref2) {
+  var dispatchAnalyticsEvent = _ref2.dispatchAnalyticsEvent;
+  return new Experience(ACTION_SUBJECT.SYNCED_BLOCK, {
+    actionSubjectId: ACTION_SUBJECT_ID.SYNCED_BLOCK_UPDATE,
+    dispatchAnalyticsEvent: dispatchAnalyticsEvent,
+    checks: [new ExperienceCheckTimeout({
+      durationMs: 1500
+    })]
+  });
+};
+
+/**
+ * This experience tracks when a reference sync block is saved to the BE.
+ *
+ * Start: When the flush sync block function is called.
+ * Success: When the sync block save is successful within 1500ms of start.
+ * Failure: When 1500ms passes without the sync block being successfully saved
+ */
+var getSaveReferenceExperience = function getSaveReferenceExperience(_ref3) {
+  var dispatchAnalyticsEvent = _ref3.dispatchAnalyticsEvent;
+  return new Experience(ACTION_SUBJECT.SYNCED_BLOCK, {
+    actionSubjectId: ACTION_SUBJECT_ID.REFERENCE_SYNCED_BLOCK_UPDATE,
+    dispatchAnalyticsEvent: dispatchAnalyticsEvent,
+    checks: [new ExperienceCheckTimeout({
+      durationMs: 1500
+    })]
+  });
+};
+
+/**
+ * This experience tracks when a reference sync block data is fetched from the BE.
+ *
+ * Start: When the fetchNodesData function is called.
+ * Success: When the fetching the data is successful within 1500ms of start.
+ * Failure: When 1500ms passes without the data being successfully fetched, or the fetch fails
+ */
+var getFetchExperience = function getFetchExperience(_ref4) {
+  var dispatchAnalyticsEvent = _ref4.dispatchAnalyticsEvent;
+  return new Experience(ACTION_SUBJECT.SYNCED_BLOCK, {
+    actionSubjectId: ACTION_SUBJECT_ID.SYNCED_BLOCK_FETCH,
+    dispatchAnalyticsEvent: dispatchAnalyticsEvent,
+    checks: [new ExperienceCheckTimeout({
+      durationMs: 1500
+    })]
+  });
+};
+
+/**
+ * This experience tracks when a reference sync block source info data (title, url) is fetched from the BE.
+ *
+ * Start: When the fetchSourceInfo function is called.
+ * Success: When the fetching the data is successful within 2500ms of start.
+ * Failure: When 2500ms passes without the data being successfully fetched, or the fetch fails
+ */
+var getFetchSourceInfoExperience = function getFetchSourceInfoExperience(_ref5) {
+  var dispatchAnalyticsEvent = _ref5.dispatchAnalyticsEvent;
+  return new Experience(ACTION_SUBJECT.SYNCED_BLOCK, {
+    actionSubjectId: ACTION_SUBJECT_ID.SYNCED_BLOCK_GET_SOURCE_INFO,
+    dispatchAnalyticsEvent: dispatchAnalyticsEvent,
+    checks: [new ExperienceCheckTimeout({
+      durationMs: 2500
+    })]
+  });
+};

package/dist/esm/pm-plugins/utils/experience-tracking-utils.js

@@ -0,0 +1,79 @@
+import { pmHistoryPluginKey } from '@atlaskit/editor-common/utils';
+import { findChildren } from '@atlaskit/editor-prosemirror/utils';
+var targetEl;
+export var getTarget = function getTarget(containerElement) {
+  if (!targetEl) {
+    var element = containerElement === null || containerElement === void 0 ? void 0 : containerElement.querySelector('.ProseMirror');
+    if (!element || !(element instanceof HTMLElement)) {
+      return null;
+    }
+    targetEl = element;
+  }
+  return targetEl;
+};
+export var wasSyncBlockDeletedOrAddedByHistory = function wasSyncBlockDeletedOrAddedByHistory(tr, oldState, newState) {
+  var historyMeta = tr.getMeta(pmHistoryPluginKey);
+  if (!Boolean(historyMeta)) {
+    return {};
+  }
+  var syncBlock = newState.schema.nodes.syncBlock;
+  var oldSyncBlockNodes = findChildren(oldState.doc, function (node) {
+    return node.type === syncBlock;
+  });
+  var newSyncBlockNodes = findChildren(newState.doc, function (node) {
+    return node.type === syncBlock;
+  });
+  var oldSyncBlockIds = new Set(oldSyncBlockNodes.map(function (nodeWithPos) {
+    return nodeWithPos.node.attrs.localId;
+  }).filter(function (localId) {
+    return Boolean(localId);
+  }));
+  var newSyncBlockIds = new Set(newSyncBlockNodes.map(function (nodeWithPos) {
+    return nodeWithPos.node.attrs.localId;
+  }).filter(function (localId) {
+    return Boolean(localId);
+  }));
+  var hasDeletedSyncBlock = Array.from(oldSyncBlockIds).some(function (localId) {
+    return !newSyncBlockIds.has(localId);
+  });
+  var hasAddedSyncBlock = Array.from(newSyncBlockIds).some(function (localId) {
+    return !oldSyncBlockIds.has(localId);
+  });
+  return {
+    hasDeletedSyncBlock: hasDeletedSyncBlock,
+    hasAddedSyncBlock: hasAddedSyncBlock,
+    isUndo: historyMeta.redo === false
+  };
+};
+var getResourceIds = function getResourceIds(nodes, resourceIds, query) {
+  nodes.forEach(function (node) {
+    if (!(node instanceof HTMLElement)) {
+      return;
+    }
+    var syncBlockElements = node.querySelectorAll(query);
+    syncBlockElements.forEach(function (element) {
+      var resourceId = element.getAttribute('resourceid');
+      if (resourceId) {
+        resourceIds.push(resourceId);
+      }
+    });
+  });
+};
+export var getAddedResourceIds = function getAddedResourceIds(mutations, query) {
+  var resourceIds = [];
+  mutations.forEach(function (mutation) {
+    if (mutation.type === 'childList') {
+      getResourceIds(mutation.addedNodes, resourceIds, query);
+    }
+  });
+  return resourceIds;
+};
+export var getRemovedResourceIds = function getRemovedResourceIds(mutations, query) {
+  var resourceIds = [];
+  mutations.forEach(function (mutation) {
+    if (mutation.type === 'childList') {
+      getResourceIds(mutation.removedNodes, resourceIds, query);
+    }
+  });
+  return resourceIds;
+};

package/dist/esm/types/index.js

@@ -5,4 +5,7 @@ export var FLAG_ID = /*#__PURE__*/function (FLAG_ID) {
   FLAG_ID["FAIL_TO_DELETE"] = "fail-to-delete";
   FLAG_ID["SYNC_BLOCK_COPIED"] = "sync-block-copied";
   return FLAG_ID;
-}({});
+}({});
+export var EXPERIENCE_ABORT_REASON = {
+  EDITOR_DESTROYED: 'editor-destroyed'
+};

package/dist/esm/ui/CreateSyncedBlockDropdownItem.js

@@ -42,24 +42,56 @@ var CreateSyncedBlockDropdownItem = function CreateSyncedBlockDropdownItem(_ref)
     }),
     onClick: onClick,
     isDisabled: isOffline,
-    testId: 'create-synced-block-block-menu-btn',
+    testId: "create-synced-block-block-menu-btn",
     elemAfter: /*#__PURE__*/React.createElement(Lozenge, {
       appearance: "new"
     }, formatMessage(blockMenuMessages.newLozenge))
   }, formatMessage(blockMenuMessages.createSyncedBlock));
 };
-export var CreateOrCopySyncedBlockDropdownItem = function CreateOrCopySyncedBlockDropdownItem(_ref2) {
-  var _menuTriggerByNode$no;
-  var api = _ref2.api,
-    enableSourceSyncedBlockCreation = _ref2.enableSourceSyncedBlockCreation;
-  var _useSharedPluginState2 = useSharedPluginStateWithSelector(api, ['blockControls'], function (states) {
+var CopySyncedBlockDropdownItem = function CopySyncedBlockDropdownItem(_ref2) {
+  var api = _ref2.api;
+  var _useIntl2 = useIntl(),
+    formatMessage = _useIntl2.formatMessage;
+  var _useSharedPluginState2 = useSharedPluginStateWithSelector(api, ['connectivity'], function (states) {
+      var _states$connectivityS2;
+      return {
+        mode: (_states$connectivityS2 = states.connectivityState) === null || _states$connectivityS2 === void 0 ? void 0 : _states$connectivityS2.mode
+      };
+    }),
+    mode = _useSharedPluginState2.mode;
+  var onClick = function onClick() {
+    var _api$core3, _api$core4, _api$blockControls2;
+    api === null || api === void 0 || (_api$core3 = api.core) === null || _api$core3 === void 0 || _api$core3.actions.execute(api === null || api === void 0 ? void 0 : api.syncedBlock.commands.copySyncedBlockReferenceToClipboard());
+    api === null || api === void 0 || (_api$core4 = api.core) === null || _api$core4 === void 0 || _api$core4.actions.execute(api === null || api === void 0 || (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 || (_api$blockControls2 = _api$blockControls2.commands) === null || _api$blockControls2 === void 0 ? void 0 : _api$blockControls2.toggleBlockMenu({
+      closeMenu: true
+    }));
+  };
+  return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
+    elemBefore: /*#__PURE__*/React.createElement(SyncBlocksIcon, {
+      label: ""
+    }),
+    onClick: onClick,
+    isDisabled: isOfflineMode(mode),
+    elemAfter: /*#__PURE__*/React.createElement(Lozenge, {
+      appearance: "new"
+    }, formatMessage(blockMenuMessages.newLozenge))
+  }, formatMessage(blockMenuMessages.copySyncedBlock));
+};
+export var CreateOrCopySyncedBlockDropdownItem = function CreateOrCopySyncedBlockDropdownItem(_ref3) {
+  var api = _ref3.api,
+    enableSourceSyncedBlockCreation = _ref3.enableSourceSyncedBlockCreation;
+  var _useSharedPluginState3 = useSharedPluginStateWithSelector(api, ['blockControls'], function (states) {
       var _states$blockControls3, _states$blockControls4;
       return {
         menuTriggerByNode: (_states$blockControls3 = (_states$blockControls4 = states.blockControlsState) === null || _states$blockControls4 === void 0 ? void 0 : _states$blockControls4.menuTriggerByNode) !== null && _states$blockControls3 !== void 0 ? _states$blockControls3 : undefined
       };
     }),
-    menuTriggerByNode = _useSharedPluginState2.menuTriggerByNode;
-  if (!['syncBlock', 'bodiedSyncBlock'].includes((_menuTriggerByNode$no = menuTriggerByNode === null || menuTriggerByNode === void 0 ? void 0 : menuTriggerByNode.nodeType) !== null && _menuTriggerByNode$no !== void 0 ? _menuTriggerByNode$no : '') && enableSourceSyncedBlockCreation) {
+    menuTriggerByNode = _useSharedPluginState3.menuTriggerByNode;
+  if ((menuTriggerByNode === null || menuTriggerByNode === void 0 ? void 0 : menuTriggerByNode.nodeType) === 'syncBlock' || (menuTriggerByNode === null || menuTriggerByNode === void 0 ? void 0 : menuTriggerByNode.nodeType) === 'bodiedSyncBlock') {
+    return /*#__PURE__*/React.createElement(CopySyncedBlockDropdownItem, {
+      api: api
+    });
+  } else if (enableSourceSyncedBlockCreation) {
     return /*#__PURE__*/React.createElement(CreateSyncedBlockDropdownItem, {
       api: api
     });

package/dist/esm/ui/DeleteConfirmationModal.js

@@ -6,6 +6,7 @@ import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks'
 import { syncBlockMessages as messages } from '@atlaskit/editor-common/messages';
 import { isOfflineMode } from '@atlaskit/editor-plugin-connectivity';
 import ModalDialog, { ModalBody, ModalFooter, ModalHeader, ModalTitle, ModalTransition } from '@atlaskit/modal-dialog';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { Text } from '@atlaskit/primitives/compiled';
 import { syncedBlockPluginKey } from '../pm-plugins/main';
 export var DeleteConfirmationModal = function DeleteConfirmationModal(_ref) {
@@ -108,6 +109,7 @@ export var DeleteConfirmationModal = function DeleteConfirmationModal(_ref) {
     onClick: handleClick(true),
     autoFocus: true,
     isDisabled: isOfflineMode(mode),
-    isLoading: bodiedSyncBlockDeletionStatus === 'processing'
+    isLoading: bodiedSyncBlockDeletionStatus === 'processing',
+    testId: fg('platform_synced_block_dogfooding') ? 'synced-block-delete-confirmation-modal-delete-button' : undefined
   }, formatMessage(messages.deleteConfirmationModalDeleteButton)))));
 };

package/dist/esm/ui/floating-toolbar.js

@@ -9,6 +9,7 @@ import { SyncBlockError } from '@atlaskit/editor-synced-block-provider';
 import CopyIcon from '@atlaskit/icon/core/copy';
 import DeleteIcon from '@atlaskit/icon/core/delete';
 import EditIcon from '@atlaskit/icon/core/edit';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { copySyncedBlockReferenceToClipboard, editSyncedBlockSource, removeSyncedBlock } from '../editor-commands';
 import { findSyncBlockOrBodiedSyncBlock, isBodiedSyncBlockNode } from '../pm-plugins/utils/utils';
 export var getToolbarConfig = function getToolbarConfig(state, intl, api, syncBlockStore) {
@@ -38,7 +39,8 @@ export var getToolbarConfig = function getToolbarConfig(state, intl, api, syncBl
       type: 'button',
       title: formatMessage(commonMessages.delete),
       onClick: removeSyncedBlock(api),
-      icon: DeleteIcon
+      icon: DeleteIcon,
+      testId: fg('platform_synced_block_dogfooding') ? 'reference-synced-block-delete-button' : undefined
     }, hoverDecorationProps(nodeType, akEditorSelectedNodeClassName));
     items.push(deleteButton);
   } else {
@@ -49,7 +51,7 @@ export var getToolbarConfig = function getToolbarConfig(state, intl, api, syncBl
       icon: CopyIcon,
       title: formatMessage(messages.copySyncBlockLabel),
       showTitle: false,
-      tooltipContent: formatMessage(messages.copySyncBlockTooltip),
+      tooltipContent: formatMessage(messages.copySyncedBlockTooltip),
       onClick: copySyncedBlockReferenceToClipboard(syncBlockStore, api)
     }, hoverDecorationProps(nodeType, akEditorSelectedNodeClassName));
     items.push(copyButton);

package/dist/types/pm-plugins/experience-tracking/create-reference-experience.d.ts

@@ -1,11 +1,5 @@
-import { type DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
-type CreateReferenceExperienceOptions = {
-    dispatchAnalyticsEvent: DispatchAnalyticsEvent;
-    refs: {
-        containerElement?: HTMLElement;
-    };
-};
+import { type ExperienceOptions } from '../../types';
 /**
  * This experience tracks when a reference sync block is inserted.
  *
@@ -13,5 +7,4 @@ type CreateReferenceExperienceOptions = {
  * Success: When the sync block is added to the DOM within 500ms of start
  * Failure: When 500ms passes without the reference sync block being added to the DOM
  */
-export declare const getCreateReferenceExperiencePlugin: ({ refs, dispatchAnalyticsEvent, }: CreateReferenceExperienceOptions) => SafePlugin<any>;
-export {};
+export declare const getCreateReferenceExperiencePlugin: ({ refs, dispatchAnalyticsEvent, }: ExperienceOptions) => SafePlugin<any>;

package/dist/types/pm-plugins/experience-tracking/create-source-experience.d.ts

@@ -1,21 +1,10 @@
-import { type DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
-import type { SyncBlockStoreManager } from '@atlaskit/editor-synced-block-provider';
-type CreateSourceExperienceOptions = {
-    dispatchAnalyticsEvent: DispatchAnalyticsEvent;
-    refs: {
-        containerElement?: HTMLElement;
-        popupsMountPoint?: HTMLElement;
-        wrapperElement?: HTMLElement;
-    };
-    syncBlockStore: SyncBlockStoreManager;
-};
+import { type ProviderExperienceOptions } from '../../types';
 /**
  * This experience tracks when a source sync block is inserted.
  *
  * Start: When user inserts a sync block via block menu, quick insert or pinned toolbar
- * Success: When the sync block is added to the DOM within 2000ms of start
- * Failure: When 500ms passes without the source sync block being added to the DOM
+ * Success: When the sync block is added to the DOM within 3000ms of start
+ * Failure: When 3000ms passes without the source sync block being added to the DOM
  */
-export declare const getCreateSourceExperiencePlugin: ({ refs, dispatchAnalyticsEvent, syncBlockStore, }: CreateSourceExperienceOptions) => SafePlugin<any>;
-export {};
+export declare const getCreateSourceExperiencePlugin: ({ refs, dispatchAnalyticsEvent, syncBlockStore, }: ProviderExperienceOptions) => SafePlugin<any>;