@atlaskit/editor-plugin-synced-block 22.0.0 → 22.0.2

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @atlaskit/editor-plugin-synced-block
 
+## 22.0.2
+
+### Patch Changes
+
+- Updated dependencies
+
+## 22.0.1
+
+### Patch Changes
+
+- [`a5e4fa298e7ad`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/a5e4fa298e7ad) -
+  [EDITOR-8408] Synced locations that the viewer cannot access now show as 'Restricted content' with
+  a lock icon, link to the restricted page, and never expose the current page's title. They still
+  count in the synced locations total and the delete warning. Behind the
+  platform_editor_blocks_patch_11 experiment.
+- Updated dependencies
+
 ## 22.0.0
 
 ### Patch Changes

package/dist/cjs/ui/SyncedLocationDropdown.compiled.css

@@ -23,11 +23,13 @@
 ._1tkeqkoa{min-height:9pc}
 ._1ul91wqb{min-width:60px}
 ._1wpz1fhb{align-self:stretch}
+._1wpz1h6o{align-self:center}
 ._2ll012x7 a>span{column-gap:var(--ds-space-075,6px)}
 ._4bfu1r31{text-decoration-color:currentColor}
 ._4cvr1h6o{align-items:center}
 ._4t3igktf{height:20px}
 ._ahbq12x7{margin-inline-start:var(--ds-space-075,6px)}
+._ahbq1b66{margin-inline-start:var(--ds-space-050,4px)}
 ._ajmmnqa1{text-decoration-style:solid}
 ._bfhki8nm{background-color:var(--ds-background-neutral,#0515240f)}
 ._c71lko4j{max-height:19pc}

package/dist/cjs/ui/SyncedLocationDropdown.js

@@ -28,6 +28,7 @@ var _pageLiveDoc = _interopRequireDefault(require("@atlaskit/icon-lab/core/page-
 var _bug = _interopRequireDefault(require("@atlaskit/icon/core/bug"));
 var _chevronDown = _interopRequireDefault(require("@atlaskit/icon/core/chevron-down"));
 var _epic = _interopRequireDefault(require("@atlaskit/icon/core/epic"));
+var _lockLocked = _interopRequireDefault(require("@atlaskit/icon/core/lock-locked"));
 var _page = _interopRequireDefault(require("@atlaskit/icon/core/page"));
 var _quotationMark = _interopRequireDefault(require("@atlaskit/icon/core/quotation-mark"));
 var _statusError = _interopRequireDefault(require("@atlaskit/icon/core/status-error"));
@@ -76,7 +77,27 @@ var styles = {
   errorContainer: "_1bsbo8uj _1e0c1txw",
   errorIcon: "_1mour5cr",
   learnMoreLink: "_4bfu1r31 _1hmsglyw _ajmmnqa1",
-  requestAccess: "_1bsb19n7 _o5721q9c _ahbq12x7 _syaz1rpy"
+  requestAccess: "_1bsb19n7 _o5721q9c _ahbq12x7 _syaz1rpy",
+  restrictedIcon: "_1e0c1txw _4cvr1h6o _1wpz1h6o _ahbq1b66"
+};
+var isRestrictedLocation = function isRestrictedLocation(reference) {
+  return !reference.hasAccess && (0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_blocks_patch_11');
+};
+
+/** The user requests access on the location itself, so a restricted row only shows a lock. */
+var NoAccessIndicator = function NoAccessIndicator(_ref) {
+  var formatMessage = _ref.formatMessage;
+  return (0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_blocks_patch_11') ? /*#__PURE__*/React.createElement(_compiled.Box, {
+    as: "span",
+    xcss: styles.restrictedIcon
+  }, /*#__PURE__*/React.createElement(_lockLocked.default, {
+    label: "",
+    size: "small",
+    color: "var(--ds-icon-danger, #C9372C)"
+  })) : /*#__PURE__*/React.createElement(_compiled.Box, {
+    as: "span",
+    xcss: styles.requestAccess
+  }, formatMessage(_messages.syncBlockMessages.syncedLocationDropdownRequestAccess));
 };
 
 /**
@@ -97,13 +118,13 @@ var shouldApplyMinHeight = function shouldApplyMinHeight(fetchStatus, itemCount)
   // When there are 1/2 items, dropdown height is less than minHeight 144px
   return !(fetchStatus === 'success' && itemCount > 0);
 };
-var ItemTitle = function ItemTitle(_ref) {
-  var title = _ref.title,
-    formatMessage = _ref.formatMessage,
-    onSameDocument = _ref.onSameDocument,
-    isSource = _ref.isSource,
-    hasAccess = _ref.hasAccess,
-    productType = _ref.productType;
+var ItemTitle = function ItemTitle(_ref2) {
+  var title = _ref2.title,
+    formatMessage = _ref2.formatMessage,
+    onSameDocument = _ref2.onSameDocument,
+    isSource = _ref2.isSource,
+    hasAccess = _ref2.hasAccess,
+    productType = _ref2.productType;
   return /*#__PURE__*/React.createElement(_compiled.Inline, null, /*#__PURE__*/React.createElement(_compiled.Box, {
     as: "span",
     xcss: styles.title
@@ -113,10 +134,9 @@ var ItemTitle = function ItemTitle(_ref) {
   }, "\xA0-", ' ', formatMessage(productType === 'confluence-page' ? _messages.syncBlockMessages.syncedLocationDropdownTitleNoteForConfluencePage : _messages.syncBlockMessages.syncedLocationDropdownTitleNoteForJiraWorkItem)), isSource && /*#__PURE__*/React.createElement(_compiled.Box, {
     as: "span",
     xcss: styles.lozenge
-  }, /*#__PURE__*/React.createElement(_lozenge.default, null, formatMessage(_messages.syncBlockMessages.syncedLocationDropdownSourceLozenge))), !hasAccess && /*#__PURE__*/React.createElement(_compiled.Box, {
-    as: "span",
-    xcss: styles.requestAccess
-  }, formatMessage(_messages.syncBlockMessages.syncedLocationDropdownRequestAccess)));
+  }, /*#__PURE__*/React.createElement(_lozenge.default, null, formatMessage(_messages.syncBlockMessages.syncedLocationDropdownSourceLozenge))), !hasAccess && /*#__PURE__*/React.createElement(NoAccessIndicator, {
+    formatMessage: formatMessage
+  }));
 };
 var productIconMap = {
   'confluence-page': _logo.ConfluenceIcon,
@@ -141,9 +161,9 @@ var getConfluenceSubTypeIcon = function getConfluenceSubTypeIcon(sourceAri, subT
     return _page.default;
   }
 };
-var ProductIcon = function ProductIcon(_ref2) {
+var ProductIcon = function ProductIcon(_ref3) {
   var _productIconMap$produ;
-  var product = _ref2.product;
+  var product = _ref3.product;
   var ProductIcon = product ? (_productIconMap$produ = productIconMap[product]) !== null && _productIconMap$produ !== void 0 ? _productIconMap$produ : _atlassianIcon.AtlassianIcon : _atlassianIcon.AtlassianIcon;
   return /*#__PURE__*/React.createElement("span", {
     className: (0, _runtime.ax)(["_2rkol0p1 _bfhki8nm _1bsbgktf _4t3igktf _1e0c1txw _4cvr1h6o _1bah1h6o"])
@@ -260,9 +280,9 @@ var renderJiraIssueTypeIcon = function renderJiraIssueTypeIcon(issueType, intl)
   }
   return null;
 };
-var ItemIcon = function ItemIcon(_ref3) {
-  var reference = _ref3.reference,
-    intl = _ref3.intl;
+var ItemIcon = function ItemIcon(_ref4) {
+  var reference = _ref4.reference,
+    intl = _ref4.intl;
   var hasAccess = reference.hasAccess,
     subType = reference.subType,
     productType = reference.productType,
@@ -371,10 +391,13 @@ var compareLocationOrder = function compareLocationOrder(a, b) {
 };
 
 /** The title alone. The field name is placed by the row and the tooltip, not baked in here. */
-var getBaseTitle = function getBaseTitle(_ref4) {
-  var blockIndex = _ref4.blockIndex,
-    formatMessage = _ref4.formatMessage,
-    reference = _ref4.reference;
+var getBaseTitle = function getBaseTitle(_ref5) {
+  var blockIndex = _ref5.blockIndex,
+    formatMessage = _ref5.formatMessage,
+    reference = _ref5.reference;
+  if (isRestrictedLocation(reference)) {
+    return formatMessage(_messages.syncBlockMessages.syncedLocationDropdownRestrictedContent);
+  }
   var title = reference.title === '' && reference.hasAccess ? formatMessage(_messages.syncBlockMessages.syncedLocationDropdownUntitledPage) : reference.title || reference.url || '';
   return blockIndex === undefined ? title : "".concat(title, ": ").concat(formatMessage(_messages.syncBlockMessages.syncedLocationDropdownTitleBlockIndex, {
     index: blockIndex
@@ -437,14 +460,14 @@ var toSyncedLocations = function toSyncedLocations(references, intl) {
     references: processReferenceData(references, intl)
   };
 };
-var SyncedLocationDropdown = exports.SyncedLocationDropdown = function SyncedLocationDropdown(_ref5) {
-  var syncBlockStore = _ref5.syncBlockStore,
-    resourceId = _ref5.resourceId,
-    intl = _ref5.intl,
-    isSource = _ref5.isSource,
-    localId = _ref5.localId,
-    api = _ref5.api,
-    floatingToolbarRenderContext = _ref5.floatingToolbarRenderContext;
+var SyncedLocationDropdown = exports.SyncedLocationDropdown = function SyncedLocationDropdown(_ref6) {
+  var syncBlockStore = _ref6.syncBlockStore,
+    resourceId = _ref6.resourceId,
+    intl = _ref6.intl,
+    isSource = _ref6.isSource,
+    localId = _ref6.localId,
+    api = _ref6.api,
+    floatingToolbarRenderContext = _ref6.floatingToolbarRenderContext;
   return /*#__PURE__*/React.createElement(EditorPositionedSyncedLocationDropdown, {
     syncBlockStore: syncBlockStore,
     resourceId: resourceId,
@@ -455,14 +478,14 @@ var SyncedLocationDropdown = exports.SyncedLocationDropdown = function SyncedLoc
     floatingToolbarRenderContext: floatingToolbarRenderContext
   });
 };
-var EditorPositionedSyncedLocationDropdown = function EditorPositionedSyncedLocationDropdown(_ref6) {
-  var syncBlockStore = _ref6.syncBlockStore,
-    resourceId = _ref6.resourceId,
-    intl = _ref6.intl,
-    isSource = _ref6.isSource,
-    localId = _ref6.localId,
-    api = _ref6.api,
-    floatingToolbarRenderContext = _ref6.floatingToolbarRenderContext;
+var EditorPositionedSyncedLocationDropdown = function EditorPositionedSyncedLocationDropdown(_ref7) {
+  var syncBlockStore = _ref7.syncBlockStore,
+    resourceId = _ref7.resourceId,
+    intl = _ref7.intl,
+    isSource = _ref7.isSource,
+    localId = _ref7.localId,
+    api = _ref7.api,
+    floatingToolbarRenderContext = _ref7.floatingToolbarRenderContext;
   var triggerTitle = intl.formatMessage(_messages.syncBlockMessages.syncedLocationDropdownTitle);
   var _useState = (0, _react.useState)(false),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
@@ -525,14 +548,14 @@ var EditorPositionedSyncedLocationDropdown = function EditorPositionedSyncedLoca
     }
   }, content);
 };
-var SyncedLocationDropdownWithCount = exports.SyncedLocationDropdownWithCount = function SyncedLocationDropdownWithCount(_ref7) {
-  var syncBlockStore = _ref7.syncBlockStore,
-    resourceId = _ref7.resourceId,
-    intl = _ref7.intl,
-    isSource = _ref7.isSource,
-    localId = _ref7.localId,
-    api = _ref7.api,
-    floatingToolbarRenderContext = _ref7.floatingToolbarRenderContext;
+var SyncedLocationDropdownWithCount = exports.SyncedLocationDropdownWithCount = function SyncedLocationDropdownWithCount(_ref8) {
+  var syncBlockStore = _ref8.syncBlockStore,
+    resourceId = _ref8.resourceId,
+    intl = _ref8.intl,
+    isSource = _ref8.isSource,
+    localId = _ref8.localId,
+    api = _ref8.api,
+    floatingToolbarRenderContext = _ref8.floatingToolbarRenderContext;
   var _useState3 = (0, _react.useState)(false),
     _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
     isOpen = _useState4[0],
@@ -549,13 +572,13 @@ var SyncedLocationDropdownWithCount = exports.SyncedLocationDropdownWithCount =
   var referenceCount = (0, _react.useMemo)(function () {
     switch (locations.kind) {
       case 'control':
-        return locations.references.filter(function (_ref8) {
-          var isSourceItem = _ref8.isSource;
+        return locations.references.filter(function (_ref9) {
+          var isSourceItem = _ref9.isSource;
           return !isSourceItem;
         }).length;
       case 'field-aware':
-        return locations.items.filter(function (_ref9) {
-          var reference = _ref9.reference;
+        return locations.items.filter(function (_ref0) {
+          var reference = _ref0.reference;
           return !reference.isSource;
         }).length;
     }
@@ -624,13 +647,13 @@ var SyncedLocationDropdownWithCount = exports.SyncedLocationDropdownWithCount =
     }
   }, content);
 };
-var DropdownContent = function DropdownContent(_ref0) {
-  var syncBlockStore = _ref0.syncBlockStore,
-    resourceId = _ref0.resourceId,
-    intl = _ref0.intl,
-    isSource = _ref0.isSource,
-    localId = _ref0.localId,
-    api = _ref0.api;
+var DropdownContent = function DropdownContent(_ref1) {
+  var syncBlockStore = _ref1.syncBlockStore,
+    resourceId = _ref1.resourceId,
+    intl = _ref1.intl,
+    isSource = _ref1.isSource,
+    localId = _ref1.localId,
+    api = _ref1.api;
   var _useState5 = (0, _react.useState)('none'),
     _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
     fetchStatus = _useState6[0],
@@ -642,7 +665,7 @@ var DropdownContent = function DropdownContent(_ref0) {
   (0, _react.useEffect)(function () {
     setFetchStatus('loading');
     var getReferenceData = /*#__PURE__*/function () {
-      var _ref1 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
+      var _ref10 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
         var response;
         return _regenerator.default.wrap(function (_context) {
           while (1) switch (_context.prev = _context.next) {
@@ -667,7 +690,7 @@ var DropdownContent = function DropdownContent(_ref0) {
         }, _callee);
       }));
       return function getReferenceData() {
-        return _ref1.apply(this, arguments);
+        return _ref10.apply(this, arguments);
       };
     }();
     void getReferenceData();
@@ -680,12 +703,12 @@ var DropdownContent = function DropdownContent(_ref0) {
     locations: locations
   });
 };
-var useReferenceData = function useReferenceData(_ref10) {
-  var syncBlockStore = _ref10.syncBlockStore,
-    resourceId = _ref10.resourceId,
-    intl = _ref10.intl,
-    isSource = _ref10.isSource,
-    localId = _ref10.localId;
+var useReferenceData = function useReferenceData(_ref11) {
+  var syncBlockStore = _ref11.syncBlockStore,
+    resourceId = _ref11.resourceId,
+    intl = _ref11.intl,
+    isSource = _ref11.isSource,
+    localId = _ref11.localId;
   var _useState9 = (0, _react.useState)(function () {
       return isSource && syncBlockStore.sourceManager.isNewSourceBlock(resourceId);
     }),
@@ -707,7 +730,7 @@ var useReferenceData = function useReferenceData(_ref10) {
       locations: EMPTY_LOCATIONS
     });
     var getReferenceData = /*#__PURE__*/function () {
-      var _ref11 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
+      var _ref12 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
         var response;
         return _regenerator.default.wrap(function (_context2) {
           while (1) switch (_context2.prev = _context2.next) {
@@ -746,7 +769,7 @@ var useReferenceData = function useReferenceData(_ref10) {
         }, _callee2);
       }));
       return function getReferenceData() {
-        return _ref11.apply(this, arguments);
+        return _ref12.apply(this, arguments);
       };
     }();
     void getReferenceData();
@@ -759,10 +782,10 @@ var useReferenceData = function useReferenceData(_ref10) {
     locations: state.locations
   };
 };
-var SyncedLocationTriggerContent = function SyncedLocationTriggerContent(_ref12) {
-  var intl = _ref12.intl,
-    fetchStatus = _ref12.fetchStatus,
-    referenceCount = _ref12.referenceCount;
+var SyncedLocationTriggerContent = function SyncedLocationTriggerContent(_ref13) {
+  var intl = _ref13.intl,
+    fetchStatus = _ref13.fetchStatus,
+    referenceCount = _ref13.referenceCount;
   var formatMessage = intl.formatMessage;
   var triggerTitle = formatMessage(_messages.syncBlockMessages.syncedLocationDropdownTitle);
   var syncedLocationCount = referenceCount === 0 ? 0 : referenceCount + 1;
@@ -787,12 +810,12 @@ var SyncedLocationTriggerContent = function SyncedLocationTriggerContent(_ref12)
       return triggerTitle;
   }
 };
-var DropdownContentWithReferenceData = function DropdownContentWithReferenceData(_ref13) {
-  var resourceId = _ref13.resourceId,
-    intl = _ref13.intl,
-    api = _ref13.api,
-    fetchStatus = _ref13.fetchStatus,
-    locations = _ref13.locations;
+var DropdownContentWithReferenceData = function DropdownContentWithReferenceData(_ref14) {
+  var resourceId = _ref14.resourceId,
+    intl = _ref14.intl,
+    api = _ref14.api,
+    fetchStatus = _ref14.fetchStatus,
+    locations = _ref14.locations;
   var formatMessage = intl.formatMessage;
   var locationCount = countLocations(locations);
   var handleLocationClick = function handleLocationClick() {
@@ -847,15 +870,15 @@ var DropdownContentWithReferenceData = function DropdownContentWithReferenceData
   }, content());
 };
 // The pre-experiment rows. This block is master's, moved into a component; remove with the experiment.
-var ControlLocationRows = function ControlLocationRows(_ref14) {
-  var referenceData = _ref14.referenceData,
-    intl = _ref14.intl,
-    handleLocationClick = _ref14.handleLocationClick;
+var ControlLocationRows = function ControlLocationRows(_ref15) {
+  var referenceData = _ref15.referenceData,
+    intl = _ref15.intl,
+    handleLocationClick = _ref15.handleLocationClick;
   var formatMessage = intl.formatMessage;
-  return /*#__PURE__*/React.createElement(_react.Fragment, null, referenceData.map(function (reference) {
-    var title = reference.title === '' && reference.hasAccess ? formatMessage(_messages.syncBlockMessages.syncedLocationDropdownUntitledPage) : reference.title || reference.url || '';
+  return /*#__PURE__*/React.createElement(_react.Fragment, null, referenceData.map(function (reference, index) {
+    var title = isRestrictedLocation(reference) ? formatMessage(_messages.syncBlockMessages.syncedLocationDropdownRestrictedContent) : reference.title === '' && reference.hasAccess ? formatMessage(_messages.syncBlockMessages.syncedLocationDropdownUntitledPage) : reference.title || reference.url || '';
     return /*#__PURE__*/React.createElement("div", {
-      key: reference.title,
+      key: (0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_blocks_patch_11') ? "".concat(reference.sourceAri, "#").concat(index) : reference.title,
       className: (0, _runtime.ax)(["_2ll012x7"])
     }, /*#__PURE__*/React.createElement(_Tooltip.default, {
       content: title
@@ -883,13 +906,13 @@ var ControlLocationRows = function ControlLocationRows(_ref14) {
     }))));
   }));
 };
-var FieldAwareItemTitle = function FieldAwareItemTitle(_ref15) {
-  var _ref15$item = _ref15.item,
-    baseTitle = _ref15$item.baseTitle,
-    fieldName = _ref15$item.fieldName,
-    note = _ref15$item.note,
-    reference = _ref15$item.reference,
-    formatMessage = _ref15.formatMessage;
+var FieldAwareItemTitle = function FieldAwareItemTitle(_ref16) {
+  var _ref16$item = _ref16.item,
+    baseTitle = _ref16$item.baseTitle,
+    fieldName = _ref16$item.fieldName,
+    note = _ref16$item.note,
+    reference = _ref16$item.reference,
+    formatMessage = _ref16.formatMessage;
   var titleLine = /*#__PURE__*/React.createElement(_compiled.Inline, null, /*#__PURE__*/React.createElement(_compiled.Box, {
     as: "span",
     xcss: styles.title
@@ -899,10 +922,9 @@ var FieldAwareItemTitle = function FieldAwareItemTitle(_ref15) {
   }, "\xA0- ", note), reference.isSource && /*#__PURE__*/React.createElement(_compiled.Box, {
     as: "span",
     xcss: styles.lozenge
-  }, /*#__PURE__*/React.createElement(_lozenge.default, null, formatMessage(_messages.syncBlockMessages.syncedLocationDropdownSourceLozenge))), !reference.hasAccess && /*#__PURE__*/React.createElement(_compiled.Box, {
-    as: "span",
-    xcss: styles.requestAccess
-  }, formatMessage(_messages.syncBlockMessages.syncedLocationDropdownRequestAccess)));
+  }, /*#__PURE__*/React.createElement(_lozenge.default, null, formatMessage(_messages.syncBlockMessages.syncedLocationDropdownSourceLozenge))), !reference.hasAccess && /*#__PURE__*/React.createElement(NoAccessIndicator, {
+    formatMessage: formatMessage
+  }));
   if (fieldName === undefined) {
     return titleLine;
   }
@@ -916,10 +938,10 @@ var FieldAwareItemTitle = function FieldAwareItemTitle(_ref15) {
     color: "color.text.subtlest"
   }, fieldName)));
 };
-var FieldAwareLocationRows = function FieldAwareLocationRows(_ref16) {
-  var items = _ref16.items,
-    intl = _ref16.intl,
-    handleLocationClick = _ref16.handleLocationClick;
+var FieldAwareLocationRows = function FieldAwareLocationRows(_ref17) {
+  var items = _ref17.items,
+    intl = _ref17.intl,
+    handleLocationClick = _ref17.handleLocationClick;
   var formatMessage = intl.formatMessage;
   return /*#__PURE__*/React.createElement(_react.Fragment, null, items.map(function (item) {
     return /*#__PURE__*/React.createElement("div", {
@@ -953,14 +975,14 @@ var FieldAwareLocationRows = function FieldAwareLocationRows(_ref16) {
     }))));
   }));
 };
-var LoadingScreen = function LoadingScreen(_ref17) {
-  var formatMessage = _ref17.formatMessage;
+var LoadingScreen = function LoadingScreen(_ref18) {
+  var formatMessage = _ref18.formatMessage;
   return /*#__PURE__*/React.createElement(_compiled.Box, null, /*#__PURE__*/React.createElement(_spinner.default, {
     label: formatMessage(_messages.syncBlockMessages.syncedLocationDropdownLoading)
   }));
 };
-var ErrorScreen = function ErrorScreen(_ref18) {
-  var formatMessage = _ref18.formatMessage;
+var ErrorScreen = function ErrorScreen(_ref19) {
+  var formatMessage = _ref19.formatMessage;
   return /*#__PURE__*/React.createElement(_compiled.Box, {
     xcss: styles.errorContainer,
     testId: "synced-locations-dropdown-content-error"
@@ -976,8 +998,8 @@ var ErrorScreen = function ErrorScreen(_ref18) {
     size: "medium"
   }, formatMessage(_messages.syncBlockMessages.syncedLocationDropdownError)));
 };
-var NoResultScreen = function NoResultScreen(_ref19) {
-  var formatMessage = _ref19.formatMessage;
+var NoResultScreen = function NoResultScreen(_ref20) {
+  var formatMessage = _ref20.formatMessage;
   return /*#__PURE__*/React.createElement(_compiled.Box, {
     xcss: styles.activationNoResultsContainer,
     testId: "synced-locations-dropdown-content-no-results"

package/dist/es2019/ui/SyncedLocationDropdown.compiled.css

@@ -23,11 +23,13 @@
 ._1tkeqkoa{min-height:9pc}
 ._1ul91wqb{min-width:60px}
 ._1wpz1fhb{align-self:stretch}
+._1wpz1h6o{align-self:center}
 ._2ll012x7 a>span{column-gap:var(--ds-space-075,6px)}
 ._4bfu1r31{text-decoration-color:currentColor}
 ._4cvr1h6o{align-items:center}
 ._4t3igktf{height:20px}
 ._ahbq12x7{margin-inline-start:var(--ds-space-075,6px)}
+._ahbq1b66{margin-inline-start:var(--ds-space-050,4px)}
 ._ajmmnqa1{text-decoration-style:solid}
 ._bfhki8nm{background-color:var(--ds-background-neutral,#0515240f)}
 ._c71lko4j{max-height:19pc}

package/dist/es2019/ui/SyncedLocationDropdown.js

@@ -17,6 +17,7 @@ import PageLiveDocIcon from '@atlaskit/icon-lab/core/page-live-doc';
 import BugIcon from '@atlaskit/icon/core/bug';
 import ChevronDownIcon from '@atlaskit/icon/core/chevron-down';
 import EpicIcon from '@atlaskit/icon/core/epic';
+import LockLockedIcon from '@atlaskit/icon/core/lock-locked';
 import PageIcon from '@atlaskit/icon/core/page';
 import QuotationMarkIcon from '@atlaskit/icon/core/quotation-mark';
 import StatusErrorIcon from '@atlaskit/icon/core/status-error';
@@ -59,8 +60,25 @@ const styles = {
   errorContainer: "_1bsbo8uj _1e0c1txw",
   errorIcon: "_1mour5cr",
   learnMoreLink: "_4bfu1r31 _1hmsglyw _ajmmnqa1",
-  requestAccess: "_1bsb19n7 _o5721q9c _ahbq12x7 _syaz1rpy"
+  requestAccess: "_1bsb19n7 _o5721q9c _ahbq12x7 _syaz1rpy",
+  restrictedIcon: "_1e0c1txw _4cvr1h6o _1wpz1h6o _ahbq1b66"
 };
+const isRestrictedLocation = reference => !reference.hasAccess && isExperimentEnabled('platform_editor_blocks_patch_11');
+
+/** The user requests access on the location itself, so a restricted row only shows a lock. */
+const NoAccessIndicator = ({
+  formatMessage
+}) => isExperimentEnabled('platform_editor_blocks_patch_11') ? /*#__PURE__*/React.createElement(Box, {
+  as: "span",
+  xcss: styles.restrictedIcon
+}, /*#__PURE__*/React.createElement(LockLockedIcon, {
+  label: "",
+  size: "small",
+  color: "var(--ds-icon-danger, #C9372C)"
+})) : /*#__PURE__*/React.createElement(Box, {
+  as: "span",
+  xcss: styles.requestAccess
+}, formatMessage(messages.syncedLocationDropdownRequestAccess));
 
 /**
  * One field-aware dropdown row. Every string the row shows is composed here from the untouched
@@ -95,10 +113,9 @@ const ItemTitle = ({
   }, "\xA0-", ' ', formatMessage(productType === 'confluence-page' ? messages.syncedLocationDropdownTitleNoteForConfluencePage : messages.syncedLocationDropdownTitleNoteForJiraWorkItem)), isSource && /*#__PURE__*/React.createElement(Box, {
     as: "span",
     xcss: styles.lozenge
-  }, /*#__PURE__*/React.createElement(Lozenge, null, formatMessage(messages.syncedLocationDropdownSourceLozenge))), !hasAccess && /*#__PURE__*/React.createElement(Box, {
-    as: "span",
-    xcss: styles.requestAccess
-  }, formatMessage(messages.syncedLocationDropdownRequestAccess)));
+  }, /*#__PURE__*/React.createElement(Lozenge, null, formatMessage(messages.syncedLocationDropdownSourceLozenge))), !hasAccess && /*#__PURE__*/React.createElement(NoAccessIndicator, {
+    formatMessage: formatMessage
+  }));
 };
 const productIconMap = {
   'confluence-page': ConfluenceIcon,
@@ -350,6 +367,9 @@ const getBaseTitle = ({
   formatMessage,
   reference
 }) => {
+  if (isRestrictedLocation(reference)) {
+    return formatMessage(messages.syncedLocationDropdownRestrictedContent);
+  }
   const title = reference.title === '' && reference.hasAccess ? formatMessage(messages.syncedLocationDropdownUntitledPage) : reference.title || reference.url || '';
   return blockIndex === undefined ? title : `${title}: ${formatMessage(messages.syncedLocationDropdownTitleBlockIndex, {
     index: blockIndex
@@ -760,10 +780,10 @@ const ControlLocationRows = ({
   const {
     formatMessage
   } = intl;
-  return /*#__PURE__*/React.createElement(Fragment, null, referenceData.map(reference => {
-    const title = reference.title === '' && reference.hasAccess ? formatMessage(messages.syncedLocationDropdownUntitledPage) : reference.title || reference.url || '';
+  return /*#__PURE__*/React.createElement(Fragment, null, referenceData.map((reference, index) => {
+    const title = isRestrictedLocation(reference) ? formatMessage(messages.syncedLocationDropdownRestrictedContent) : reference.title === '' && reference.hasAccess ? formatMessage(messages.syncedLocationDropdownUntitledPage) : reference.title || reference.url || '';
     return /*#__PURE__*/React.createElement("div", {
-      key: reference.title,
+      key: isExperimentEnabled('platform_editor_blocks_patch_11') ? `${reference.sourceAri}#${index}` : reference.title,
       className: ax(["_2ll012x7"])
     }, /*#__PURE__*/React.createElement(Tooltip, {
       content: title
@@ -807,10 +827,9 @@ const FieldAwareItemTitle = ({
   }, "\xA0- ", note), reference.isSource && /*#__PURE__*/React.createElement(Box, {
     as: "span",
     xcss: styles.lozenge
-  }, /*#__PURE__*/React.createElement(Lozenge, null, formatMessage(messages.syncedLocationDropdownSourceLozenge))), !reference.hasAccess && /*#__PURE__*/React.createElement(Box, {
-    as: "span",
-    xcss: styles.requestAccess
-  }, formatMessage(messages.syncedLocationDropdownRequestAccess)));
+  }, /*#__PURE__*/React.createElement(Lozenge, null, formatMessage(messages.syncedLocationDropdownSourceLozenge))), !reference.hasAccess && /*#__PURE__*/React.createElement(NoAccessIndicator, {
+    formatMessage: formatMessage
+  }));
   if (fieldName === undefined) {
     return titleLine;
   }

package/dist/esm/ui/SyncedLocationDropdown.compiled.css

@@ -23,11 +23,13 @@
 ._1tkeqkoa{min-height:9pc}
 ._1ul91wqb{min-width:60px}
 ._1wpz1fhb{align-self:stretch}
+._1wpz1h6o{align-self:center}
 ._2ll012x7 a>span{column-gap:var(--ds-space-075,6px)}
 ._4bfu1r31{text-decoration-color:currentColor}
 ._4cvr1h6o{align-items:center}
 ._4t3igktf{height:20px}
 ._ahbq12x7{margin-inline-start:var(--ds-space-075,6px)}
+._ahbq1b66{margin-inline-start:var(--ds-space-050,4px)}
 ._ajmmnqa1{text-decoration-style:solid}
 ._bfhki8nm{background-color:var(--ds-background-neutral,#0515240f)}
 ._c71lko4j{max-height:19pc}

package/dist/esm/ui/SyncedLocationDropdown.js

@@ -26,6 +26,7 @@ import PageLiveDocIcon from '@atlaskit/icon-lab/core/page-live-doc';
 import BugIcon from '@atlaskit/icon/core/bug';
 import ChevronDownIcon from '@atlaskit/icon/core/chevron-down';
 import EpicIcon from '@atlaskit/icon/core/epic';
+import LockLockedIcon from '@atlaskit/icon/core/lock-locked';
 import PageIcon from '@atlaskit/icon/core/page';
 import QuotationMarkIcon from '@atlaskit/icon/core/quotation-mark';
 import StatusErrorIcon from '@atlaskit/icon/core/status-error';
@@ -68,7 +69,27 @@ var styles = {
   errorContainer: "_1bsbo8uj _1e0c1txw",
   errorIcon: "_1mour5cr",
   learnMoreLink: "_4bfu1r31 _1hmsglyw _ajmmnqa1",
-  requestAccess: "_1bsb19n7 _o5721q9c _ahbq12x7 _syaz1rpy"
+  requestAccess: "_1bsb19n7 _o5721q9c _ahbq12x7 _syaz1rpy",
+  restrictedIcon: "_1e0c1txw _4cvr1h6o _1wpz1h6o _ahbq1b66"
+};
+var isRestrictedLocation = function isRestrictedLocation(reference) {
+  return !reference.hasAccess && isExperimentEnabled('platform_editor_blocks_patch_11');
+};
+
+/** The user requests access on the location itself, so a restricted row only shows a lock. */
+var NoAccessIndicator = function NoAccessIndicator(_ref) {
+  var formatMessage = _ref.formatMessage;
+  return isExperimentEnabled('platform_editor_blocks_patch_11') ? /*#__PURE__*/React.createElement(Box, {
+    as: "span",
+    xcss: styles.restrictedIcon
+  }, /*#__PURE__*/React.createElement(LockLockedIcon, {
+    label: "",
+    size: "small",
+    color: "var(--ds-icon-danger, #C9372C)"
+  })) : /*#__PURE__*/React.createElement(Box, {
+    as: "span",
+    xcss: styles.requestAccess
+  }, formatMessage(messages.syncedLocationDropdownRequestAccess));
 };
 
 /**
@@ -89,13 +110,13 @@ var shouldApplyMinHeight = function shouldApplyMinHeight(fetchStatus, itemCount)
   // When there are 1/2 items, dropdown height is less than minHeight 144px
   return !(fetchStatus === 'success' && itemCount > 0);
 };
-var ItemTitle = function ItemTitle(_ref) {
-  var title = _ref.title,
-    formatMessage = _ref.formatMessage,
-    onSameDocument = _ref.onSameDocument,
-    isSource = _ref.isSource,
-    hasAccess = _ref.hasAccess,
-    productType = _ref.productType;
+var ItemTitle = function ItemTitle(_ref2) {
+  var title = _ref2.title,
+    formatMessage = _ref2.formatMessage,
+    onSameDocument = _ref2.onSameDocument,
+    isSource = _ref2.isSource,
+    hasAccess = _ref2.hasAccess,
+    productType = _ref2.productType;
   return /*#__PURE__*/React.createElement(Inline, null, /*#__PURE__*/React.createElement(Box, {
     as: "span",
     xcss: styles.title
@@ -105,10 +126,9 @@ var ItemTitle = function ItemTitle(_ref) {
   }, "\xA0-", ' ', formatMessage(productType === 'confluence-page' ? messages.syncedLocationDropdownTitleNoteForConfluencePage : messages.syncedLocationDropdownTitleNoteForJiraWorkItem)), isSource && /*#__PURE__*/React.createElement(Box, {
     as: "span",
     xcss: styles.lozenge
-  }, /*#__PURE__*/React.createElement(Lozenge, null, formatMessage(messages.syncedLocationDropdownSourceLozenge))), !hasAccess && /*#__PURE__*/React.createElement(Box, {
-    as: "span",
-    xcss: styles.requestAccess
-  }, formatMessage(messages.syncedLocationDropdownRequestAccess)));
+  }, /*#__PURE__*/React.createElement(Lozenge, null, formatMessage(messages.syncedLocationDropdownSourceLozenge))), !hasAccess && /*#__PURE__*/React.createElement(NoAccessIndicator, {
+    formatMessage: formatMessage
+  }));
 };
 var productIconMap = {
   'confluence-page': ConfluenceIcon,
@@ -133,9 +153,9 @@ var getConfluenceSubTypeIcon = function getConfluenceSubTypeIcon(sourceAri, subT
     return PageIcon;
   }
 };
-var ProductIcon = function ProductIcon(_ref2) {
+var ProductIcon = function ProductIcon(_ref3) {
   var _productIconMap$produ;
-  var product = _ref2.product;
+  var product = _ref3.product;
   var ProductIcon = product ? (_productIconMap$produ = productIconMap[product]) !== null && _productIconMap$produ !== void 0 ? _productIconMap$produ : AtlassianIcon : AtlassianIcon;
   return /*#__PURE__*/React.createElement("span", {
     className: ax(["_2rkol0p1 _bfhki8nm _1bsbgktf _4t3igktf _1e0c1txw _4cvr1h6o _1bah1h6o"])
@@ -252,9 +272,9 @@ var renderJiraIssueTypeIcon = function renderJiraIssueTypeIcon(issueType, intl)
   }
   return null;
 };
-var ItemIcon = function ItemIcon(_ref3) {
-  var reference = _ref3.reference,
-    intl = _ref3.intl;
+var ItemIcon = function ItemIcon(_ref4) {
+  var reference = _ref4.reference,
+    intl = _ref4.intl;
   var hasAccess = reference.hasAccess,
     subType = reference.subType,
     productType = reference.productType,
@@ -363,10 +383,13 @@ var compareLocationOrder = function compareLocationOrder(a, b) {
 };
 
 /** The title alone. The field name is placed by the row and the tooltip, not baked in here. */
-var getBaseTitle = function getBaseTitle(_ref4) {
-  var blockIndex = _ref4.blockIndex,
-    formatMessage = _ref4.formatMessage,
-    reference = _ref4.reference;
+var getBaseTitle = function getBaseTitle(_ref5) {
+  var blockIndex = _ref5.blockIndex,
+    formatMessage = _ref5.formatMessage,
+    reference = _ref5.reference;
+  if (isRestrictedLocation(reference)) {
+    return formatMessage(messages.syncedLocationDropdownRestrictedContent);
+  }
   var title = reference.title === '' && reference.hasAccess ? formatMessage(messages.syncedLocationDropdownUntitledPage) : reference.title || reference.url || '';
   return blockIndex === undefined ? title : "".concat(title, ": ").concat(formatMessage(messages.syncedLocationDropdownTitleBlockIndex, {
     index: blockIndex
@@ -429,14 +452,14 @@ var toSyncedLocations = function toSyncedLocations(references, intl) {
     references: processReferenceData(references, intl)
   };
 };
-export var SyncedLocationDropdown = function SyncedLocationDropdown(_ref5) {
-  var syncBlockStore = _ref5.syncBlockStore,
-    resourceId = _ref5.resourceId,
-    intl = _ref5.intl,
-    isSource = _ref5.isSource,
-    localId = _ref5.localId,
-    api = _ref5.api,
-    floatingToolbarRenderContext = _ref5.floatingToolbarRenderContext;
+export var SyncedLocationDropdown = function SyncedLocationDropdown(_ref6) {
+  var syncBlockStore = _ref6.syncBlockStore,
+    resourceId = _ref6.resourceId,
+    intl = _ref6.intl,
+    isSource = _ref6.isSource,
+    localId = _ref6.localId,
+    api = _ref6.api,
+    floatingToolbarRenderContext = _ref6.floatingToolbarRenderContext;
   return /*#__PURE__*/React.createElement(EditorPositionedSyncedLocationDropdown, {
     syncBlockStore: syncBlockStore,
     resourceId: resourceId,
@@ -447,14 +470,14 @@ export var SyncedLocationDropdown = function SyncedLocationDropdown(_ref5) {
     floatingToolbarRenderContext: floatingToolbarRenderContext
   });
 };
-var EditorPositionedSyncedLocationDropdown = function EditorPositionedSyncedLocationDropdown(_ref6) {
-  var syncBlockStore = _ref6.syncBlockStore,
-    resourceId = _ref6.resourceId,
-    intl = _ref6.intl,
-    isSource = _ref6.isSource,
-    localId = _ref6.localId,
-    api = _ref6.api,
-    floatingToolbarRenderContext = _ref6.floatingToolbarRenderContext;
+var EditorPositionedSyncedLocationDropdown = function EditorPositionedSyncedLocationDropdown(_ref7) {
+  var syncBlockStore = _ref7.syncBlockStore,
+    resourceId = _ref7.resourceId,
+    intl = _ref7.intl,
+    isSource = _ref7.isSource,
+    localId = _ref7.localId,
+    api = _ref7.api,
+    floatingToolbarRenderContext = _ref7.floatingToolbarRenderContext;
   var triggerTitle = intl.formatMessage(messages.syncedLocationDropdownTitle);
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
@@ -517,14 +540,14 @@ var EditorPositionedSyncedLocationDropdown = function EditorPositionedSyncedLoca
     }
   }, content);
 };
-export var SyncedLocationDropdownWithCount = function SyncedLocationDropdownWithCount(_ref7) {
-  var syncBlockStore = _ref7.syncBlockStore,
-    resourceId = _ref7.resourceId,
-    intl = _ref7.intl,
-    isSource = _ref7.isSource,
-    localId = _ref7.localId,
-    api = _ref7.api,
-    floatingToolbarRenderContext = _ref7.floatingToolbarRenderContext;
+export var SyncedLocationDropdownWithCount = function SyncedLocationDropdownWithCount(_ref8) {
+  var syncBlockStore = _ref8.syncBlockStore,
+    resourceId = _ref8.resourceId,
+    intl = _ref8.intl,
+    isSource = _ref8.isSource,
+    localId = _ref8.localId,
+    api = _ref8.api,
+    floatingToolbarRenderContext = _ref8.floatingToolbarRenderContext;
   var _useState3 = useState(false),
     _useState4 = _slicedToArray(_useState3, 2),
     isOpen = _useState4[0],
@@ -541,13 +564,13 @@ export var SyncedLocationDropdownWithCount = function SyncedLocationDropdownWith
   var referenceCount = useMemo(function () {
     switch (locations.kind) {
       case 'control':
-        return locations.references.filter(function (_ref8) {
-          var isSourceItem = _ref8.isSource;
+        return locations.references.filter(function (_ref9) {
+          var isSourceItem = _ref9.isSource;
           return !isSourceItem;
         }).length;
       case 'field-aware':
-        return locations.items.filter(function (_ref9) {
-          var reference = _ref9.reference;
+        return locations.items.filter(function (_ref0) {
+          var reference = _ref0.reference;
           return !reference.isSource;
         }).length;
     }
@@ -616,13 +639,13 @@ export var SyncedLocationDropdownWithCount = function SyncedLocationDropdownWith
     }
   }, content);
 };
-var DropdownContent = function DropdownContent(_ref0) {
-  var syncBlockStore = _ref0.syncBlockStore,
-    resourceId = _ref0.resourceId,
-    intl = _ref0.intl,
-    isSource = _ref0.isSource,
-    localId = _ref0.localId,
-    api = _ref0.api;
+var DropdownContent = function DropdownContent(_ref1) {
+  var syncBlockStore = _ref1.syncBlockStore,
+    resourceId = _ref1.resourceId,
+    intl = _ref1.intl,
+    isSource = _ref1.isSource,
+    localId = _ref1.localId,
+    api = _ref1.api;
   var _useState5 = useState('none'),
     _useState6 = _slicedToArray(_useState5, 2),
     fetchStatus = _useState6[0],
@@ -634,7 +657,7 @@ var DropdownContent = function DropdownContent(_ref0) {
   useEffect(function () {
     setFetchStatus('loading');
     var getReferenceData = /*#__PURE__*/function () {
-      var _ref1 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+      var _ref10 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
         var response;
         return _regeneratorRuntime.wrap(function (_context) {
           while (1) switch (_context.prev = _context.next) {
@@ -659,7 +682,7 @@ var DropdownContent = function DropdownContent(_ref0) {
         }, _callee);
       }));
       return function getReferenceData() {
-        return _ref1.apply(this, arguments);
+        return _ref10.apply(this, arguments);
       };
     }();
     void getReferenceData();
@@ -672,12 +695,12 @@ var DropdownContent = function DropdownContent(_ref0) {
     locations: locations
   });
 };
-var useReferenceData = function useReferenceData(_ref10) {
-  var syncBlockStore = _ref10.syncBlockStore,
-    resourceId = _ref10.resourceId,
-    intl = _ref10.intl,
-    isSource = _ref10.isSource,
-    localId = _ref10.localId;
+var useReferenceData = function useReferenceData(_ref11) {
+  var syncBlockStore = _ref11.syncBlockStore,
+    resourceId = _ref11.resourceId,
+    intl = _ref11.intl,
+    isSource = _ref11.isSource,
+    localId = _ref11.localId;
   var _useState9 = useState(function () {
       return isSource && syncBlockStore.sourceManager.isNewSourceBlock(resourceId);
     }),
@@ -699,7 +722,7 @@ var useReferenceData = function useReferenceData(_ref10) {
       locations: EMPTY_LOCATIONS
     });
     var getReferenceData = /*#__PURE__*/function () {
-      var _ref11 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
+      var _ref12 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
         var response;
         return _regeneratorRuntime.wrap(function (_context2) {
           while (1) switch (_context2.prev = _context2.next) {
@@ -738,7 +761,7 @@ var useReferenceData = function useReferenceData(_ref10) {
         }, _callee2);
       }));
       return function getReferenceData() {
-        return _ref11.apply(this, arguments);
+        return _ref12.apply(this, arguments);
       };
     }();
     void getReferenceData();
@@ -751,10 +774,10 @@ var useReferenceData = function useReferenceData(_ref10) {
     locations: state.locations
   };
 };
-var SyncedLocationTriggerContent = function SyncedLocationTriggerContent(_ref12) {
-  var intl = _ref12.intl,
-    fetchStatus = _ref12.fetchStatus,
-    referenceCount = _ref12.referenceCount;
+var SyncedLocationTriggerContent = function SyncedLocationTriggerContent(_ref13) {
+  var intl = _ref13.intl,
+    fetchStatus = _ref13.fetchStatus,
+    referenceCount = _ref13.referenceCount;
   var formatMessage = intl.formatMessage;
   var triggerTitle = formatMessage(messages.syncedLocationDropdownTitle);
   var syncedLocationCount = referenceCount === 0 ? 0 : referenceCount + 1;
@@ -779,12 +802,12 @@ var SyncedLocationTriggerContent = function SyncedLocationTriggerContent(_ref12)
       return triggerTitle;
   }
 };
-var DropdownContentWithReferenceData = function DropdownContentWithReferenceData(_ref13) {
-  var resourceId = _ref13.resourceId,
-    intl = _ref13.intl,
-    api = _ref13.api,
-    fetchStatus = _ref13.fetchStatus,
-    locations = _ref13.locations;
+var DropdownContentWithReferenceData = function DropdownContentWithReferenceData(_ref14) {
+  var resourceId = _ref14.resourceId,
+    intl = _ref14.intl,
+    api = _ref14.api,
+    fetchStatus = _ref14.fetchStatus,
+    locations = _ref14.locations;
   var formatMessage = intl.formatMessage;
   var locationCount = countLocations(locations);
   var handleLocationClick = function handleLocationClick() {
@@ -839,15 +862,15 @@ var DropdownContentWithReferenceData = function DropdownContentWithReferenceData
   }, content());
 };
 // The pre-experiment rows. This block is master's, moved into a component; remove with the experiment.
-var ControlLocationRows = function ControlLocationRows(_ref14) {
-  var referenceData = _ref14.referenceData,
-    intl = _ref14.intl,
-    handleLocationClick = _ref14.handleLocationClick;
+var ControlLocationRows = function ControlLocationRows(_ref15) {
+  var referenceData = _ref15.referenceData,
+    intl = _ref15.intl,
+    handleLocationClick = _ref15.handleLocationClick;
   var formatMessage = intl.formatMessage;
-  return /*#__PURE__*/React.createElement(Fragment, null, referenceData.map(function (reference) {
-    var title = reference.title === '' && reference.hasAccess ? formatMessage(messages.syncedLocationDropdownUntitledPage) : reference.title || reference.url || '';
+  return /*#__PURE__*/React.createElement(Fragment, null, referenceData.map(function (reference, index) {
+    var title = isRestrictedLocation(reference) ? formatMessage(messages.syncedLocationDropdownRestrictedContent) : reference.title === '' && reference.hasAccess ? formatMessage(messages.syncedLocationDropdownUntitledPage) : reference.title || reference.url || '';
     return /*#__PURE__*/React.createElement("div", {
-      key: reference.title,
+      key: isExperimentEnabled('platform_editor_blocks_patch_11') ? "".concat(reference.sourceAri, "#").concat(index) : reference.title,
       className: ax(["_2ll012x7"])
     }, /*#__PURE__*/React.createElement(Tooltip, {
       content: title
@@ -875,13 +898,13 @@ var ControlLocationRows = function ControlLocationRows(_ref14) {
     }))));
   }));
 };
-var FieldAwareItemTitle = function FieldAwareItemTitle(_ref15) {
-  var _ref15$item = _ref15.item,
-    baseTitle = _ref15$item.baseTitle,
-    fieldName = _ref15$item.fieldName,
-    note = _ref15$item.note,
-    reference = _ref15$item.reference,
-    formatMessage = _ref15.formatMessage;
+var FieldAwareItemTitle = function FieldAwareItemTitle(_ref16) {
+  var _ref16$item = _ref16.item,
+    baseTitle = _ref16$item.baseTitle,
+    fieldName = _ref16$item.fieldName,
+    note = _ref16$item.note,
+    reference = _ref16$item.reference,
+    formatMessage = _ref16.formatMessage;
   var titleLine = /*#__PURE__*/React.createElement(Inline, null, /*#__PURE__*/React.createElement(Box, {
     as: "span",
     xcss: styles.title
@@ -891,10 +914,9 @@ var FieldAwareItemTitle = function FieldAwareItemTitle(_ref15) {
   }, "\xA0- ", note), reference.isSource && /*#__PURE__*/React.createElement(Box, {
     as: "span",
     xcss: styles.lozenge
-  }, /*#__PURE__*/React.createElement(Lozenge, null, formatMessage(messages.syncedLocationDropdownSourceLozenge))), !reference.hasAccess && /*#__PURE__*/React.createElement(Box, {
-    as: "span",
-    xcss: styles.requestAccess
-  }, formatMessage(messages.syncedLocationDropdownRequestAccess)));
+  }, /*#__PURE__*/React.createElement(Lozenge, null, formatMessage(messages.syncedLocationDropdownSourceLozenge))), !reference.hasAccess && /*#__PURE__*/React.createElement(NoAccessIndicator, {
+    formatMessage: formatMessage
+  }));
   if (fieldName === undefined) {
     return titleLine;
   }
@@ -908,10 +930,10 @@ var FieldAwareItemTitle = function FieldAwareItemTitle(_ref15) {
     color: "color.text.subtlest"
   }, fieldName)));
 };
-var FieldAwareLocationRows = function FieldAwareLocationRows(_ref16) {
-  var items = _ref16.items,
-    intl = _ref16.intl,
-    handleLocationClick = _ref16.handleLocationClick;
+var FieldAwareLocationRows = function FieldAwareLocationRows(_ref17) {
+  var items = _ref17.items,
+    intl = _ref17.intl,
+    handleLocationClick = _ref17.handleLocationClick;
   var formatMessage = intl.formatMessage;
   return /*#__PURE__*/React.createElement(Fragment, null, items.map(function (item) {
     return /*#__PURE__*/React.createElement("div", {
@@ -945,14 +967,14 @@ var FieldAwareLocationRows = function FieldAwareLocationRows(_ref16) {
     }))));
   }));
 };
-var LoadingScreen = function LoadingScreen(_ref17) {
-  var formatMessage = _ref17.formatMessage;
+var LoadingScreen = function LoadingScreen(_ref18) {
+  var formatMessage = _ref18.formatMessage;
   return /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Spinner, {
     label: formatMessage(messages.syncedLocationDropdownLoading)
   }));
 };
-var ErrorScreen = function ErrorScreen(_ref18) {
-  var formatMessage = _ref18.formatMessage;
+var ErrorScreen = function ErrorScreen(_ref19) {
+  var formatMessage = _ref19.formatMessage;
   return /*#__PURE__*/React.createElement(Box, {
     xcss: styles.errorContainer,
     testId: "synced-locations-dropdown-content-error"
@@ -968,8 +990,8 @@ var ErrorScreen = function ErrorScreen(_ref18) {
     size: "medium"
   }, formatMessage(messages.syncedLocationDropdownError)));
 };
-var NoResultScreen = function NoResultScreen(_ref19) {
-  var formatMessage = _ref19.formatMessage;
+var NoResultScreen = function NoResultScreen(_ref20) {
+  var formatMessage = _ref20.formatMessage;
   return /*#__PURE__*/React.createElement(Box, {
     xcss: styles.activationNoResultsContainer,
     testId: "synced-locations-dropdown-content-no-results"

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-synced-block",
-	"version": "22.0.0",
+	"version": "22.0.2",
 	"description": "SyncedBlock plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -53,8 +53,8 @@
 		"@atlaskit/platform-feature-flags": "^2.2.0",
 		"@atlaskit/primitives": "^22.5.0",
 		"@atlaskit/spinner": "20.4.4",
-		"@atlaskit/tmp-editor-statsig": "^220.0.0",
-		"@atlaskit/tokens": "20.1.0",
+		"@atlaskit/tmp-editor-statsig": "^221.0.0",
+		"@atlaskit/tokens": "20.2.0",
 		"@atlaskit/tooltip": "^24.4.0",
 		"@atlaskit/visually-hidden": "^4.4.0",
 		"@babel/runtime": "^7.0.0",
@@ -65,7 +65,7 @@
 		"memoize-one": "^6.0.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^128.0.0",
+		"@atlaskit/editor-common": "^128.1.0",
 		"react": "^18.2.0 || ^19.2.0",
 		"react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"
 	},