@atlaskit/editor-plugin-card 13.1.1 → 13.1.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (45) hide show
  1. package/CHANGELOG.md +16 -0
  2. package/dist/cjs/nodeviews/blockCard.js +25 -2
  3. package/dist/cjs/nodeviews/embedCard.js +25 -2
  4. package/dist/cjs/nodeviews/genericCard.js +6 -2
  5. package/dist/cjs/nodeviews/inlineCard.js +2 -2
  6. package/dist/cjs/nodeviews/inlineCardWithAwareness.js +3 -1
  7. package/dist/cjs/ui/AwarenessWrapper/index.js +9 -3
  8. package/dist/cjs/ui/DatasourceDropdownOption.js +3 -1
  9. package/dist/cjs/ui/EditLinkToolbar.js +12 -4
  10. package/dist/cjs/ui/EditToolbarButton/EditToolbarButtonPresentation.js +3 -1
  11. package/dist/cjs/ui/EditToolbarButton/index.js +3 -1
  12. package/dist/cjs/ui/HyperlinkToolbarAppearanceDropdown.js +4 -1
  13. package/dist/cjs/ui/LinkToolbarAppearance.js +13 -8
  14. package/dist/cjs/ui/LinkToolbarAppearanceDropdown.js +3 -1
  15. package/dist/es2019/nodeviews/blockCard.js +23 -2
  16. package/dist/es2019/nodeviews/embedCard.js +23 -2
  17. package/dist/es2019/nodeviews/genericCard.js +6 -2
  18. package/dist/es2019/nodeviews/inlineCard.js +2 -2
  19. package/dist/es2019/nodeviews/inlineCardWithAwareness.js +3 -1
  20. package/dist/es2019/ui/AwarenessWrapper/index.js +9 -3
  21. package/dist/es2019/ui/DatasourceDropdownOption.js +3 -1
  22. package/dist/es2019/ui/EditLinkToolbar.js +12 -4
  23. package/dist/es2019/ui/EditToolbarButton/EditToolbarButtonPresentation.js +3 -1
  24. package/dist/es2019/ui/EditToolbarButton/index.js +3 -1
  25. package/dist/es2019/ui/HyperlinkToolbarAppearanceDropdown.js +4 -1
  26. package/dist/es2019/ui/LinkToolbarAppearance.js +14 -9
  27. package/dist/es2019/ui/LinkToolbarAppearanceDropdown.js +3 -1
  28. package/dist/esm/nodeviews/blockCard.js +25 -2
  29. package/dist/esm/nodeviews/embedCard.js +25 -2
  30. package/dist/esm/nodeviews/genericCard.js +6 -2
  31. package/dist/esm/nodeviews/inlineCard.js +2 -2
  32. package/dist/esm/nodeviews/inlineCardWithAwareness.js +3 -1
  33. package/dist/esm/ui/AwarenessWrapper/index.js +9 -3
  34. package/dist/esm/ui/DatasourceDropdownOption.js +3 -1
  35. package/dist/esm/ui/EditLinkToolbar.js +12 -4
  36. package/dist/esm/ui/EditToolbarButton/EditToolbarButtonPresentation.js +3 -1
  37. package/dist/esm/ui/EditToolbarButton/index.js +3 -1
  38. package/dist/esm/ui/HyperlinkToolbarAppearanceDropdown.js +4 -1
  39. package/dist/esm/ui/LinkToolbarAppearance.js +13 -8
  40. package/dist/esm/ui/LinkToolbarAppearanceDropdown.js +3 -1
  41. package/dist/types/nodeviews/blockCard.d.ts +6 -0
  42. package/dist/types/nodeviews/embedCard.d.ts +6 -0
  43. package/dist/types-ts4.5/nodeviews/blockCard.d.ts +6 -0
  44. package/dist/types-ts4.5/nodeviews/embedCard.d.ts +6 -0
  45. package/package.json +6 -3
package/CHANGELOG.md CHANGED
@@ -1,5 +1,21 @@
1
1
  # @atlaskit/editor-plugin-card
2
2
 
3
+ ## 13.1.3
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies
8
+
9
+ ## 13.1.2
10
+
11
+ ### Patch Changes
12
+
13
+ - [`2116707c51d9b`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/2116707c51d9b) -
14
+ [ux] Add SmartLinkDraggable wrapping to BlockCard and EmbedCard. Add stopEvent to prevent
15
+ ProseMirror from intercepting drag events on smart-element-link. Remove double feature gating in
16
+ inlineCard.
17
+ - Updated dependencies
18
+
3
19
  ## 13.1.1
4
20
 
5
21
  ### Patch Changes
@@ -19,6 +19,8 @@ var _browser = require("@atlaskit/editor-common/browser");
19
19
  var _reactNodeView = _interopRequireDefault(require("@atlaskit/editor-common/react-node-view"));
20
20
  var _ui = require("@atlaskit/editor-common/ui");
21
21
  var _utils = require("@atlaskit/editor-common/utils");
22
+ var _editorSmartLinkDraggable = require("@atlaskit/editor-smart-link-draggable");
23
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
22
24
  var _smartCard = require("@atlaskit/smart-card");
23
25
  var _ssr = require("@atlaskit/smart-card/ssr");
24
26
  var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
@@ -144,9 +146,13 @@ var BlockCardComponent = exports.BlockCardComponent = /*#__PURE__*/function (_Re
144
146
  }), this.gapCursorSpan());
145
147
  // [WS-2307]: we only render card wrapped into a Provider when the value is ready,
146
148
  // otherwise if we got data, we can render the card directly since it doesn't need the Provider
147
- return /*#__PURE__*/_react.default.createElement("div", null, cardContext && cardContext.value ? /*#__PURE__*/_react.default.createElement(cardContext.Provider, {
149
+ return /*#__PURE__*/_react.default.createElement(_editorSmartLinkDraggable.SmartLinkDraggable, {
150
+ url: url,
151
+ appearance: _editorSmartLinkDraggable.SMART_LINK_APPEARANCE.BLOCK,
152
+ source: _editorSmartLinkDraggable.SMART_LINK_DRAG_TYPES.EDITOR
153
+ }, /*#__PURE__*/_react.default.createElement("div", null, cardContext && cardContext.value ? /*#__PURE__*/_react.default.createElement(cardContext.Provider, {
148
154
  value: cardContext.value
149
- }, cardInner) : data ? cardInner : null);
155
+ }, cardInner) : data ? cardInner : null));
150
156
  }
151
157
  }]);
152
158
  }(_react.default.PureComponent);
@@ -225,6 +231,23 @@ var BlockCard = exports.BlockCard = /*#__PURE__*/function (_ReactNodeView) {
225
231
  provider: provider
226
232
  });
227
233
  }
234
+
235
+ /**
236
+ * Prevent ProseMirror from handling drag events on the smart-element-link,
237
+ * allowing native drag to work so SmartLinkDraggable can intercept it.
238
+ * @see {@link https://prosemirror.net/docs/ref/#view.NodeView.stopEvent}
239
+ */
240
+ }, {
241
+ key: "stopEvent",
242
+ value: function stopEvent(event) {
243
+ if (event.type === 'dragstart') {
244
+ var target = event.target;
245
+ if (target instanceof HTMLElement && target.closest('[data-smart-element-link]') && (0, _platformFeatureFlags.fg)('cc_drag_and_drop_smart_link_from_content_to_tree')) {
246
+ return true;
247
+ }
248
+ }
249
+ return false;
250
+ }
228
251
  }, {
229
252
  key: "destroy",
230
253
  value: function destroy() {
@@ -23,6 +23,8 @@ var _ui = require("@atlaskit/editor-common/ui");
23
23
  var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
24
24
  var _utils = require("@atlaskit/editor-common/utils");
25
25
  var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
26
+ var _editorSmartLinkDraggable = require("@atlaskit/editor-smart-link-draggable");
27
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
26
28
  var _platformFeatureFlagsReact = require("@atlaskit/platform-feature-flags-react");
27
29
  var _smartCard = require("@atlaskit/smart-card");
28
30
  var _ssr = require("@atlaskit/smart-card/ssr");
@@ -379,7 +381,11 @@ var EmbedCardComponent = exports.EmbedCardComponent = /*#__PURE__*/function (_Re
379
381
  actionOptions: actionOptions,
380
382
  CompetitorPrompt: CompetitorPrompt
381
383
  });
382
- return /*#__PURE__*/_react.default.createElement(_smartCard.EmbedResizeMessageListener, {
384
+ return /*#__PURE__*/_react.default.createElement(_editorSmartLinkDraggable.SmartLinkDraggable, {
385
+ url: url,
386
+ appearance: _editorSmartLinkDraggable.SMART_LINK_APPEARANCE.EMBED,
387
+ source: _editorSmartLinkDraggable.SMART_LINK_DRAG_TYPES.EDITOR
388
+ }, /*#__PURE__*/_react.default.createElement(_smartCard.EmbedResizeMessageListener, {
383
389
  embedIframeRef: this.embedIframeRef,
384
390
  onHeightUpdate: this.onHeightUpdate
385
391
  }, /*#__PURE__*/_react.default.createElement(CardInner, {
@@ -397,7 +403,7 @@ var EmbedCardComponent = exports.EmbedCardComponent = /*#__PURE__*/function (_Re
397
403
  heightAlone: heightAlone,
398
404
  cardProps: cardProps,
399
405
  dispatchAnalyticsEvent: dispatchAnalyticsEvent
400
- }));
406
+ })));
401
407
  }
402
408
  }]);
403
409
  }(_react.default.PureComponent);
@@ -521,6 +527,23 @@ var EmbedCard = exports.EmbedCard = /*#__PURE__*/function (_ReactNodeView) {
521
527
  provider: provider
522
528
  });
523
529
  }
530
+
531
+ /**
532
+ * Prevent ProseMirror from handling drag events on the smart-element-link,
533
+ * allowing native drag to work so SmartLinkDraggable can intercept it.
534
+ * @see {@link https://prosemirror.net/docs/ref/#view.NodeView.stopEvent}
535
+ */
536
+ }, {
537
+ key: "stopEvent",
538
+ value: function stopEvent(event) {
539
+ if (event.type === 'dragstart') {
540
+ var target = event.target;
541
+ if (target instanceof HTMLElement && target.closest('[data-smart-element-link]') && (0, _platformFeatureFlags.fg)('cc_drag_and_drop_smart_link_from_content_to_tree')) {
542
+ return true;
543
+ }
544
+ }
545
+ return false;
546
+ }
524
547
  }, {
525
548
  key: "destroy",
526
549
  value: function destroy() {
@@ -96,7 +96,9 @@ function Card(SmartCardComponent, UnsupportedComponent) {
96
96
  if (this.state.isError) {
97
97
  if (url) {
98
98
  return (0, _platformFeatureFlags.fg)('dst-a11y__replace-anchor-with-link__linking-platfo') ? /*#__PURE__*/_react.default.createElement(_link.default, {
99
- href: url,
99
+ href: url
100
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
101
+ ,
100
102
  onClick: function onClick(e) {
101
103
  e.preventDefault();
102
104
  }
@@ -115,7 +117,9 @@ function Card(SmartCardComponent, UnsupportedComponent) {
115
117
  }
116
118
  var editorAppearance = (_getPluginState = (0, _state.getPluginState)(this.props.view.state)) === null || _getPluginState === void 0 ? void 0 : _getPluginState.editorAppearance;
117
119
  var analyticsEditorAppearance = (0, _utils.getAnalyticsEditorAppearance)(editorAppearance);
118
- return /*#__PURE__*/_react.default.createElement(_analyticsNext.AnalyticsContext, {
120
+ return /*#__PURE__*/_react.default.createElement(_analyticsNext.AnalyticsContext
121
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
122
+ , {
119
123
  data: {
120
124
  attributes: {
121
125
  location: analyticsEditorAppearance
@@ -222,11 +222,11 @@ function InlineCardNodeView(props) {
222
222
  // Ignored via go/ees005
223
223
  // eslint-disable-next-line react/jsx-props-no-spreading
224
224
  }, enableInlineUpgradeFeatures && (0, _utils.getAwarenessProps)(view.state, getPos, allowEmbeds, allowBlockCards, mode === 'view'))), CompetitorPromptComponent);
225
- return (0, _expValEquals.expValEquals)('cc_drag_and_drop_smart_link_from_content_to_tree', 'isEnabled', true) ? /*#__PURE__*/_react.default.createElement(_editorSmartLinkDraggable.SmartLinkDraggable, {
225
+ return /*#__PURE__*/_react.default.createElement(_editorSmartLinkDraggable.SmartLinkDraggable, {
226
226
  url: url,
227
227
  appearance: _editorSmartLinkDraggable.SMART_LINK_APPEARANCE.INLINE,
228
228
  source: _editorSmartLinkDraggable.SMART_LINK_DRAG_TYPES.EDITOR
229
- }, inlineCardContent) : inlineCardContent;
229
+ }, inlineCardContent);
230
230
  }
231
231
  var inlineCardNodeView = exports.inlineCardNodeView = function inlineCardNodeView(_ref5) {
232
232
  var inlineCardViewProducer = _ref5.inlineCardViewProducer;
@@ -198,7 +198,9 @@ var InlineCardWithAwareness = exports.InlineCardWithAwareness = /*#__PURE__*/(0,
198
198
  editorAnalyticsApi: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a4 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a4 === void 0 ? void 0 : _pluginInjectionApi$a4.actions,
199
199
  view: view,
200
200
  showPanelButton: showPanelButton,
201
- showPanelButtonIcon: isPreviewAvailable && isPreviewPanelAvailable ? 'panel' : 'modal',
201
+ showPanelButtonIcon: isPreviewAvailable && isPreviewPanelAvailable ? 'panel' : 'modal'
202
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
203
+ ,
202
204
  onClick: function onClick(event) {
203
205
  if (isPreviewPanelAvailable) {
204
206
  var _extractSmartLinkEmbe;
@@ -88,10 +88,14 @@ var AwarenessWrapper = exports.AwarenessWrapper = function AwarenessWrapper(_ref
88
88
  if (shouldShowLinkOverlay && !(0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && !(0, _experiments.editorExperiment)('platform_editor_preview_panel_linking_exp', true)) {
89
89
  return (0, _react2.jsx)(_InlineCardOverlay.default, {
90
90
  isSelected: isSelected,
91
- isVisible: isResolvedViewRendered && (isInserted || isHovered || isSelected),
91
+ isVisible: isResolvedViewRendered && (isInserted || isHovered || isSelected)
92
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
93
+ ,
92
94
  onMouseEnter: function onMouseEnter() {
93
95
  return handleOverlayChange(true);
94
- },
96
+ }
97
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
98
+ ,
95
99
  onMouseLeave: function onMouseLeave() {
96
100
  return handleOverlayChange(false);
97
101
  },
@@ -112,7 +116,9 @@ var AwarenessWrapper = exports.AwarenessWrapper = function AwarenessWrapper(_ref
112
116
  "data-vc": "awareness-wrapper",
113
117
  "data-ssr-placeholder": "awareness-wrapper-".concat(placeholderUniqId),
114
118
  "data-ssr-placeholder-replace": "awareness-wrapper-".concat(placeholderUniqId)
115
- }, (0, _react2.jsx)(_analyticsNext.AnalyticsContext, {
119
+ }, (0, _react2.jsx)(_analyticsNext.AnalyticsContext
120
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
121
+ , {
116
122
  data: {
117
123
  attributes: (0, _utils.getResolvedAttributesFromStore)(url, 'inline', cardContext === null || cardContext === void 0 || (_cardContext$value = cardContext.value) === null || _cardContext$value === void 0 ? void 0 : _cardContext$value.store)
118
124
  }
@@ -92,7 +92,9 @@ var DatasourceDropdownOption = exports.DatasourceDropdownOption = function Datas
92
92
  key: intl.formatMessage(_messages.cardMessages.datasourceAppearanceTitle),
93
93
  iconBefore: (0, _smartLinkList.default)({
94
94
  label: intl.formatMessage(_messages.cardMessages.datasourceAppearanceTitle)
95
- }),
95
+ })
96
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
97
+ ,
96
98
  onClick: function onClick() {
97
99
  return dispatchCommand(onChangeAppearance);
98
100
  },
@@ -102,13 +102,17 @@ var EditLinkToolbar = exports.EditLinkToolbar = /*#__PURE__*/function (_React$Co
102
102
  // via the floating toolbar
103
103
  ,
104
104
  invokeMethod: _analytics.INPUT_METHOD.FLOATING_TB,
105
- lpLinkPicker: lpLinkPicker,
105
+ lpLinkPicker: lpLinkPicker
106
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
107
+ ,
106
108
  onSubmit: function onSubmit(href, title, displayText, inputMethod, analytic) {
107
109
  _this.hideLinkToolbar();
108
110
  if (_onSubmit) {
109
111
  _onSubmit(href, displayText || title, inputMethod, analytic);
110
112
  }
111
- },
113
+ }
114
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
115
+ ,
112
116
  onEscapeCallback: function onEscapeCallback(state, dispatch) {
113
117
  var tr = state.tr;
114
118
  (0, _actions.hideLinkToolbar)(tr);
@@ -118,7 +122,9 @@ var EditLinkToolbar = exports.EditLinkToolbar = /*#__PURE__*/function (_React$Co
118
122
  return true;
119
123
  }
120
124
  return false;
121
- },
125
+ }
126
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
127
+ ,
122
128
  onClickAwayCallback: function onClickAwayCallback(state, dispatch) {
123
129
  var tr = state.tr;
124
130
  if (dispatch) {
@@ -173,7 +179,9 @@ var buildEditLinkToolbar = exports.buildEditLinkToolbar = function buildEditLink
173
179
  text: displayInfo.title || '',
174
180
  node: node,
175
181
  lpLinkPicker: lpLinkPicker,
176
- forceFocusSelector: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$f = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f === void 0 || (_pluginInjectionApi$f = _pluginInjectionApi$f.actions) === null || _pluginInjectionApi$f === void 0 ? void 0 : _pluginInjectionApi$f.forceFocusSelector,
182
+ forceFocusSelector: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$f = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f === void 0 || (_pluginInjectionApi$f = _pluginInjectionApi$f.actions) === null || _pluginInjectionApi$f === void 0 ? void 0 : _pluginInjectionApi$f.forceFocusSelector
183
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
184
+ ,
177
185
  onSubmit: function onSubmit(newHref, newText, inputMethod, analytic) {
178
186
  var urlChanged = newHref !== displayInfo.url;
179
187
  var titleChanged = newText !== displayInfo.title;
@@ -132,7 +132,9 @@ var EditToolbarButtonPresentation = function EditToolbarButtonPresentation(_ref)
132
132
  handleClickOutside: onClose,
133
133
  handleEscapeKeydown: onClose,
134
134
  trigger: trigger,
135
- scrollableElement: containerRef.current,
135
+ scrollableElement: containerRef.current
136
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
137
+ ,
136
138
  arrowKeyNavigationProviderOptions: {
137
139
  type: _uiMenu.ArrowKeyNavigationType.MENU
138
140
  }
@@ -157,7 +157,9 @@ var EditToolbarButtonWithCardContext = function EditToolbarButtonWithCardContext
157
157
  handleClickOutside: onClose,
158
158
  handleEscapeKeydown: onClose,
159
159
  trigger: trigger,
160
- scrollableElement: containerRef.current,
160
+ scrollableElement: containerRef.current
161
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
162
+ ,
161
163
  arrowKeyNavigationProviderOptions: {
162
164
  type: _uiMenu.ArrowKeyNavigationType.MENU
163
165
  }
@@ -122,6 +122,7 @@ var CustomHyperlinkDropdown = function CustomHyperlinkDropdown(props) {
122
122
  case 21:
123
123
  _context2.prev = 21;
124
124
  _context2.t3 = _context2["catch"](3);
125
+ // eslint-disable-line no-unused-vars
125
126
  isUrlSupported = false;
126
127
  case 24:
127
128
  newMap = new Map(supportedUrlsMap);
@@ -191,7 +192,9 @@ var CustomHyperlinkDropdown = function CustomHyperlinkDropdown(props) {
191
192
  handleClickOutside: close,
192
193
  handleEscapeKeydown: close,
193
194
  trigger: trigger,
194
- scrollableElement: containerRef.current,
195
+ scrollableElement: containerRef.current
196
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
197
+ ,
195
198
  arrowKeyNavigationProviderOptions: {
196
199
  type: _uiMenu.ArrowKeyNavigationType.MENU
197
200
  },
@@ -127,14 +127,18 @@ var LinkToolbarAppearance = exports.LinkToolbarAppearance = /*#__PURE__*/functio
127
127
  var embedEnabled = embedOption ? !embedOption.disabled : false;
128
128
  if ((0, _toolbar.shouldRenderToolbarPulse)(embedEnabled, currentAppearance !== null && currentAppearance !== void 0 ? currentAppearance : '', status !== null && status !== void 0 ? status : '', showUpgradeDiscoverability)) {
129
129
  var resolvedAnalyticsAttributes = (0, _utils2.getResolvedAttributesFromStore)(url || '', currentAppearance || null, cardContext === null || cardContext === void 0 ? void 0 : cardContext.store);
130
- return /*#__PURE__*/_react.default.createElement(_analyticsNext.AnalyticsContext, {
131
- data: {
132
- attributes: _objectSpread({}, resolvedAnalyticsAttributes)
133
- }
134
- }, /*#__PURE__*/_react.default.createElement(_Pulse.DiscoveryPulse, {
135
- localStorageKey: _localStorage.LOCAL_STORAGE_DISCOVERY_KEY_TOOLBAR,
136
- testId: "toolbar-discovery-pulse"
137
- }, LinkToolbarButtons));
130
+ return (
131
+ /*#__PURE__*/
132
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
133
+ _react.default.createElement(_analyticsNext.AnalyticsContext, {
134
+ data: {
135
+ attributes: _objectSpread({}, resolvedAnalyticsAttributes)
136
+ }
137
+ }, /*#__PURE__*/_react.default.createElement(_Pulse.DiscoveryPulse, {
138
+ localStorageKey: _localStorage.LOCAL_STORAGE_DISCOVERY_KEY_TOOLBAR,
139
+ testId: "toolbar-discovery-pulse"
140
+ }, LinkToolbarButtons))
141
+ );
138
142
  }
139
143
  return LinkToolbarButtons;
140
144
  });
@@ -161,6 +165,7 @@ var getUnavailableMessage = exports.getUnavailableMessage = function getUnavaila
161
165
  });
162
166
  return tooltip;
163
167
  } catch (e) {
168
+ // eslint-disable-line no-unused-vars
164
169
  return intl.formatMessage(_messages.cardMessages.displayOptionUnavailableInParentNode, {
165
170
  node: intl.formatMessage(_messages.default.defaultBlockNode)
166
171
  });
@@ -107,7 +107,9 @@ var LinkAppearanceMenu = exports.LinkAppearanceMenu = function LinkAppearanceMen
107
107
  return /*#__PURE__*/_react.default.createElement(_menu.MenuGroup, null, /*#__PURE__*/_react.default.createElement(_menu.Section, null, finalOptions.map(function (option) {
108
108
  return /*#__PURE__*/_react.default.createElement(_menu.ButtonItem, {
109
109
  key: option.title,
110
- iconBefore: option.icon,
110
+ iconBefore: option.icon
111
+ // eslint-disable-next-line @atlassian/perf-linting/detect-unnecessary-rerenders, @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
112
+ ,
111
113
  onClick: function onClick() {
112
114
  return option.onClick();
113
115
  },
@@ -7,6 +7,8 @@ import { browser as browserLegacy, getBrowserInfo } from '@atlaskit/editor-commo
7
7
  import ReactNodeView from '@atlaskit/editor-common/react-node-view';
8
8
  import { findOverflowScrollParent, UnsupportedBlock } from '@atlaskit/editor-common/ui';
9
9
  import { canRenderDatasource } from '@atlaskit/editor-common/utils';
10
+ import { SmartLinkDraggable, SMART_LINK_DRAG_TYPES, SMART_LINK_APPEARANCE } from '@atlaskit/editor-smart-link-draggable';
11
+ import { fg } from '@atlaskit/platform-feature-flags';
10
12
  import { Card as SmartCard } from '@atlaskit/smart-card';
11
13
  import { CardSSR } from '@atlaskit/smart-card/ssr';
12
14
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
@@ -128,9 +130,13 @@ export class BlockCardComponent extends React.PureComponent {
128
130
  }), this.gapCursorSpan());
129
131
  // [WS-2307]: we only render card wrapped into a Provider when the value is ready,
130
132
  // otherwise if we got data, we can render the card directly since it doesn't need the Provider
131
- return /*#__PURE__*/React.createElement("div", null, cardContext && cardContext.value ? /*#__PURE__*/React.createElement(cardContext.Provider, {
133
+ return /*#__PURE__*/React.createElement(SmartLinkDraggable, {
134
+ url: url,
135
+ appearance: SMART_LINK_APPEARANCE.BLOCK,
136
+ source: SMART_LINK_DRAG_TYPES.EDITOR
137
+ }, /*#__PURE__*/React.createElement("div", null, cardContext && cardContext.value ? /*#__PURE__*/React.createElement(cardContext.Provider, {
132
138
  value: cardContext.value
133
- }, cardInner) : data ? cardInner : null);
139
+ }, cardInner) : data ? cardInner : null));
134
140
  }
135
141
  }
136
142
  const WrappedBlockCard = Card(BlockCardComponent, UnsupportedBlock);
@@ -190,6 +196,21 @@ export class BlockCard extends ReactNodeView {
190
196
  provider: provider
191
197
  });
192
198
  }
199
+
200
+ /**
201
+ * Prevent ProseMirror from handling drag events on the smart-element-link,
202
+ * allowing native drag to work so SmartLinkDraggable can intercept it.
203
+ * @see {@link https://prosemirror.net/docs/ref/#view.NodeView.stopEvent}
204
+ */
205
+ stopEvent(event) {
206
+ if (event.type === 'dragstart') {
207
+ const target = event.target;
208
+ if (target instanceof HTMLElement && target.closest('[data-smart-element-link]') && fg('cc_drag_and_drop_smart_link_from_content_to_tree')) {
209
+ return true;
210
+ }
211
+ }
212
+ return false;
213
+ }
193
214
  destroy() {
194
215
  var _this$unsubscribe;
195
216
  (_this$unsubscribe = this.unsubscribe) === null || _this$unsubscribe === void 0 ? void 0 : _this$unsubscribe.call(this);
@@ -11,6 +11,8 @@ import { findOverflowScrollParent, MediaSingle as RichMediaWrapper, UnsupportedB
11
11
  import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
12
12
  import { floatingLayouts, isRichMediaInsideOfBlockNode } from '@atlaskit/editor-common/utils';
13
13
  import { akEditorFullPageNarrowBreakout, DEFAULT_EMBED_CARD_HEIGHT, DEFAULT_EMBED_CARD_WIDTH } from '@atlaskit/editor-shared-styles';
14
+ import { SmartLinkDraggable, SMART_LINK_DRAG_TYPES, SMART_LINK_APPEARANCE } from '@atlaskit/editor-smart-link-draggable';
15
+ import { fg } from '@atlaskit/platform-feature-flags';
14
16
  import { componentWithCondition } from '@atlaskit/platform-feature-flags-react';
15
17
  import { EmbedResizeMessageListener, Card as SmartCard } from '@atlaskit/smart-card';
16
18
  import { CardSSR } from '@atlaskit/smart-card/ssr';
@@ -371,7 +373,11 @@ export class EmbedCardComponent extends React.PureComponent {
371
373
  actionOptions: actionOptions,
372
374
  CompetitorPrompt: CompetitorPrompt
373
375
  });
374
- return /*#__PURE__*/React.createElement(EmbedResizeMessageListener, {
376
+ return /*#__PURE__*/React.createElement(SmartLinkDraggable, {
377
+ url: url,
378
+ appearance: SMART_LINK_APPEARANCE.EMBED,
379
+ source: SMART_LINK_DRAG_TYPES.EDITOR
380
+ }, /*#__PURE__*/React.createElement(EmbedResizeMessageListener, {
375
381
  embedIframeRef: this.embedIframeRef,
376
382
  onHeightUpdate: this.onHeightUpdate
377
383
  }, /*#__PURE__*/React.createElement(CardInner, {
@@ -389,7 +395,7 @@ export class EmbedCardComponent extends React.PureComponent {
389
395
  heightAlone: heightAlone,
390
396
  cardProps: cardProps,
391
397
  dispatchAnalyticsEvent: dispatchAnalyticsEvent
392
- }));
398
+ })));
393
399
  }
394
400
  }
395
401
  export const EmbedOrBlockCardComponent = props => {
@@ -495,6 +501,21 @@ export class EmbedCard extends ReactNodeView {
495
501
  provider: provider
496
502
  });
497
503
  }
504
+
505
+ /**
506
+ * Prevent ProseMirror from handling drag events on the smart-element-link,
507
+ * allowing native drag to work so SmartLinkDraggable can intercept it.
508
+ * @see {@link https://prosemirror.net/docs/ref/#view.NodeView.stopEvent}
509
+ */
510
+ stopEvent(event) {
511
+ if (event.type === 'dragstart') {
512
+ const target = event.target;
513
+ if (target instanceof HTMLElement && target.closest('[data-smart-element-link]') && fg('cc_drag_and_drop_smart_link_from_content_to_tree')) {
514
+ return true;
515
+ }
516
+ }
517
+ return false;
518
+ }
498
519
  destroy() {
499
520
  var _this$unsubscribe;
500
521
  (_this$unsubscribe = this.unsubscribe) === null || _this$unsubscribe === void 0 ? void 0 : _this$unsubscribe.call(this);
@@ -74,7 +74,9 @@ export function Card(SmartCardComponent, UnsupportedComponent) {
74
74
  if (this.state.isError) {
75
75
  if (url) {
76
76
  return fg('dst-a11y__replace-anchor-with-link__linking-platfo') ? /*#__PURE__*/React.createElement(Link, {
77
- href: url,
77
+ href: url
78
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
79
+ ,
78
80
  onClick: e => {
79
81
  e.preventDefault();
80
82
  }
@@ -93,7 +95,9 @@ export function Card(SmartCardComponent, UnsupportedComponent) {
93
95
  }
94
96
  const editorAppearance = (_getPluginState = getPluginState(this.props.view.state)) === null || _getPluginState === void 0 ? void 0 : _getPluginState.editorAppearance;
95
97
  const analyticsEditorAppearance = getAnalyticsEditorAppearance(editorAppearance);
96
- return /*#__PURE__*/React.createElement(AnalyticsContext, {
98
+ return /*#__PURE__*/React.createElement(AnalyticsContext
99
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
100
+ , {
97
101
  data: {
98
102
  attributes: {
99
103
  location: analyticsEditorAppearance
@@ -221,11 +221,11 @@ export function InlineCardNodeView(props) {
221
221
  // Ignored via go/ees005
222
222
  // eslint-disable-next-line react/jsx-props-no-spreading
223
223
  }, enableInlineUpgradeFeatures && getAwarenessProps(view.state, getPos, allowEmbeds, allowBlockCards, mode === 'view'))), CompetitorPromptComponent);
224
- return expValEquals('cc_drag_and_drop_smart_link_from_content_to_tree', 'isEnabled', true) ? /*#__PURE__*/React.createElement(SmartLinkDraggable, {
224
+ return /*#__PURE__*/React.createElement(SmartLinkDraggable, {
225
225
  url: url,
226
226
  appearance: SMART_LINK_APPEARANCE.INLINE,
227
227
  source: SMART_LINK_DRAG_TYPES.EDITOR
228
- }, inlineCardContent) : inlineCardContent;
228
+ }, inlineCardContent);
229
229
  }
230
230
  export const inlineCardNodeView = ({
231
231
  inlineCardViewProducer
@@ -177,7 +177,9 @@ export const InlineCardWithAwareness = /*#__PURE__*/memo(({
177
177
  editorAnalyticsApi: pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a5 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a5 === void 0 ? void 0 : _pluginInjectionApi$a5.actions,
178
178
  view: view,
179
179
  showPanelButton: showPanelButton,
180
- showPanelButtonIcon: isPreviewAvailable && isPreviewPanelAvailable ? 'panel' : 'modal',
180
+ showPanelButtonIcon: isPreviewAvailable && isPreviewPanelAvailable ? 'panel' : 'modal'
181
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
182
+ ,
181
183
  onClick: event => {
182
184
  if (isPreviewPanelAvailable) {
183
185
  var _extractSmartLinkEmbe;
@@ -78,8 +78,12 @@ export const AwarenessWrapper = ({
78
78
  if (shouldShowLinkOverlay && !editorExperiment('platform_editor_controls', 'variant1') && !editorExperiment('platform_editor_preview_panel_linking_exp', true)) {
79
79
  return jsx(InlineCardOverlay, {
80
80
  isSelected: isSelected,
81
- isVisible: isResolvedViewRendered && (isInserted || isHovered || isSelected),
82
- onMouseEnter: () => handleOverlayChange(true),
81
+ isVisible: isResolvedViewRendered && (isInserted || isHovered || isSelected)
82
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
83
+ ,
84
+ onMouseEnter: () => handleOverlayChange(true)
85
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
86
+ ,
83
87
  onMouseLeave: () => handleOverlayChange(false),
84
88
  url: url
85
89
  }, children);
@@ -98,7 +102,9 @@ export const AwarenessWrapper = ({
98
102
  "data-vc": "awareness-wrapper",
99
103
  "data-ssr-placeholder": `awareness-wrapper-${placeholderUniqId}`,
100
104
  "data-ssr-placeholder-replace": `awareness-wrapper-${placeholderUniqId}`
101
- }, jsx(AnalyticsContext, {
105
+ }, jsx(AnalyticsContext
106
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
107
+ , {
102
108
  data: {
103
109
  attributes: getResolvedAttributesFromStore(url, 'inline', cardContext === null || cardContext === void 0 ? void 0 : (_cardContext$value = cardContext.value) === null || _cardContext$value === void 0 ? void 0 : _cardContext$value.store)
104
110
  }
@@ -87,7 +87,9 @@ export const DatasourceDropdownOption = ({
87
87
  key: intl.formatMessage(messages.datasourceAppearanceTitle),
88
88
  iconBefore: SmartLinkListIcon({
89
89
  label: intl.formatMessage(messages.datasourceAppearanceTitle)
90
- }),
90
+ })
91
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
92
+ ,
91
93
  onClick: () => dispatchCommand(onChangeAppearance),
92
94
  isSelected: selected
93
95
  }, intl.formatMessage(messages.datasourceAppearanceTitle));
@@ -75,13 +75,17 @@ export class EditLinkToolbar extends React.Component {
75
75
  // via the floating toolbar
76
76
  ,
77
77
  invokeMethod: INPUT_METHOD.FLOATING_TB,
78
- lpLinkPicker: lpLinkPicker,
78
+ lpLinkPicker: lpLinkPicker
79
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
80
+ ,
79
81
  onSubmit: (href, title, displayText, inputMethod, analytic) => {
80
82
  this.hideLinkToolbar();
81
83
  if (onSubmit) {
82
84
  onSubmit(href, displayText || title, inputMethod, analytic);
83
85
  }
84
- },
86
+ }
87
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
88
+ ,
85
89
  onEscapeCallback: (state, dispatch) => {
86
90
  const {
87
91
  tr
@@ -93,7 +97,9 @@ export class EditLinkToolbar extends React.Component {
93
97
  return true;
94
98
  }
95
99
  return false;
96
- },
100
+ }
101
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
102
+ ,
97
103
  onClickAwayCallback: (state, dispatch) => {
98
104
  const {
99
105
  tr
@@ -150,7 +156,9 @@ export const buildEditLinkToolbar = ({
150
156
  text: displayInfo.title || '',
151
157
  node: node,
152
158
  lpLinkPicker: lpLinkPicker,
153
- forceFocusSelector: pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$f = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f === void 0 ? void 0 : (_pluginInjectionApi$f2 = _pluginInjectionApi$f.actions) === null || _pluginInjectionApi$f2 === void 0 ? void 0 : _pluginInjectionApi$f2.forceFocusSelector,
159
+ forceFocusSelector: pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$f = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f === void 0 ? void 0 : (_pluginInjectionApi$f2 = _pluginInjectionApi$f.actions) === null || _pluginInjectionApi$f2 === void 0 ? void 0 : _pluginInjectionApi$f2.forceFocusSelector
160
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
161
+ ,
154
162
  onSubmit: (newHref, newText, inputMethod, analytic) => {
155
163
  const urlChanged = newHref !== displayInfo.url;
156
164
  const titleChanged = newText !== displayInfo.title;
@@ -115,7 +115,9 @@ const EditToolbarButtonPresentation = ({
115
115
  handleClickOutside: onClose,
116
116
  handleEscapeKeydown: onClose,
117
117
  trigger: trigger,
118
- scrollableElement: containerRef.current,
118
+ scrollableElement: containerRef.current
119
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
120
+ ,
119
121
  arrowKeyNavigationProviderOptions: {
120
122
  type: ArrowKeyNavigationType.MENU
121
123
  }
@@ -142,7 +142,9 @@ const EditToolbarButtonWithCardContext = props => {
142
142
  handleClickOutside: onClose,
143
143
  handleEscapeKeydown: onClose,
144
144
  trigger: trigger,
145
- scrollableElement: containerRef.current,
145
+ scrollableElement: containerRef.current
146
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
147
+ ,
146
148
  arrowKeyNavigationProviderOptions: {
147
149
  type: ArrowKeyNavigationType.MENU
148
150
  }
@@ -52,6 +52,7 @@ const CustomHyperlinkDropdown = props => {
52
52
  const provider = await getProvider();
53
53
  isUrlSupported = (_await$provider$findP = await (provider === null || provider === void 0 ? void 0 : provider.findPattern(url))) !== null && _await$provider$findP !== void 0 ? _await$provider$findP : false;
54
54
  } catch (error) {
55
+ // eslint-disable-line no-unused-vars
55
56
  isUrlSupported = false;
56
57
  }
57
58
  const newMap = new Map(supportedUrlsMap);
@@ -106,7 +107,9 @@ const CustomHyperlinkDropdown = props => {
106
107
  handleClickOutside: close,
107
108
  handleEscapeKeydown: close,
108
109
  trigger: trigger,
109
- scrollableElement: containerRef.current,
110
+ scrollableElement: containerRef.current
111
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
112
+ ,
110
113
  arrowKeyNavigationProviderOptions: {
111
114
  type: ArrowKeyNavigationType.MENU
112
115
  },
@@ -100,16 +100,20 @@ export class LinkToolbarAppearance extends React.Component {
100
100
  const embedEnabled = embedOption ? !embedOption.disabled : false;
101
101
  if (shouldRenderToolbarPulse(embedEnabled, currentAppearance !== null && currentAppearance !== void 0 ? currentAppearance : '', status !== null && status !== void 0 ? status : '', showUpgradeDiscoverability)) {
102
102
  const resolvedAnalyticsAttributes = getResolvedAttributesFromStore(url || '', currentAppearance || null, cardContext === null || cardContext === void 0 ? void 0 : cardContext.store);
103
- return /*#__PURE__*/React.createElement(AnalyticsContext, {
104
- data: {
105
- attributes: {
106
- ...resolvedAnalyticsAttributes
103
+ return (
104
+ /*#__PURE__*/
105
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
106
+ React.createElement(AnalyticsContext, {
107
+ data: {
108
+ attributes: {
109
+ ...resolvedAnalyticsAttributes
110
+ }
107
111
  }
108
- }
109
- }, /*#__PURE__*/React.createElement(DiscoveryPulse, {
110
- localStorageKey: LOCAL_STORAGE_DISCOVERY_KEY_TOOLBAR,
111
- testId: "toolbar-discovery-pulse"
112
- }, LinkToolbarButtons));
112
+ }, /*#__PURE__*/React.createElement(DiscoveryPulse, {
113
+ localStorageKey: LOCAL_STORAGE_DISCOVERY_KEY_TOOLBAR,
114
+ testId: "toolbar-discovery-pulse"
115
+ }, LinkToolbarButtons))
116
+ );
113
117
  }
114
118
  return LinkToolbarButtons;
115
119
  });
@@ -130,6 +134,7 @@ export const getUnavailableMessage = (state, intl) => {
130
134
  });
131
135
  return tooltip;
132
136
  } catch (e) {
137
+ // eslint-disable-line no-unused-vars
133
138
  return intl.formatMessage(messages.displayOptionUnavailableInParentNode, {
134
139
  node: intl.formatMessage(nodeNames.defaultBlockNode)
135
140
  });
@@ -94,7 +94,9 @@ export const LinkAppearanceMenu = ({
94
94
  return /*#__PURE__*/React.createElement(MenuGroup, null, /*#__PURE__*/React.createElement(Section, null, finalOptions.map(option => {
95
95
  return /*#__PURE__*/React.createElement(ButtonItem, {
96
96
  key: option.title,
97
- iconBefore: option.icon,
97
+ iconBefore: option.icon
98
+ // eslint-disable-next-line @atlassian/perf-linting/detect-unnecessary-rerenders, @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
99
+ ,
98
100
  onClick: () => option.onClick(),
99
101
  isSelected: option.selected,
100
102
  description: option.description,
@@ -16,6 +16,8 @@ import { browser as browserLegacy, getBrowserInfo } from '@atlaskit/editor-commo
16
16
  import ReactNodeView from '@atlaskit/editor-common/react-node-view';
17
17
  import { findOverflowScrollParent, UnsupportedBlock } from '@atlaskit/editor-common/ui';
18
18
  import { canRenderDatasource } from '@atlaskit/editor-common/utils';
19
+ import { SmartLinkDraggable, SMART_LINK_DRAG_TYPES, SMART_LINK_APPEARANCE } from '@atlaskit/editor-smart-link-draggable';
20
+ import { fg } from '@atlaskit/platform-feature-flags';
19
21
  import { Card as SmartCard } from '@atlaskit/smart-card';
20
22
  import { CardSSR } from '@atlaskit/smart-card/ssr';
21
23
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
@@ -139,9 +141,13 @@ export var BlockCardComponent = /*#__PURE__*/function (_React$PureComponent) {
139
141
  }), this.gapCursorSpan());
140
142
  // [WS-2307]: we only render card wrapped into a Provider when the value is ready,
141
143
  // otherwise if we got data, we can render the card directly since it doesn't need the Provider
142
- return /*#__PURE__*/React.createElement("div", null, cardContext && cardContext.value ? /*#__PURE__*/React.createElement(cardContext.Provider, {
144
+ return /*#__PURE__*/React.createElement(SmartLinkDraggable, {
145
+ url: url,
146
+ appearance: SMART_LINK_APPEARANCE.BLOCK,
147
+ source: SMART_LINK_DRAG_TYPES.EDITOR
148
+ }, /*#__PURE__*/React.createElement("div", null, cardContext && cardContext.value ? /*#__PURE__*/React.createElement(cardContext.Provider, {
143
149
  value: cardContext.value
144
- }, cardInner) : data ? cardInner : null);
150
+ }, cardInner) : data ? cardInner : null));
145
151
  }
146
152
  }]);
147
153
  }(React.PureComponent);
@@ -220,6 +226,23 @@ export var BlockCard = /*#__PURE__*/function (_ReactNodeView) {
220
226
  provider: provider
221
227
  });
222
228
  }
229
+
230
+ /**
231
+ * Prevent ProseMirror from handling drag events on the smart-element-link,
232
+ * allowing native drag to work so SmartLinkDraggable can intercept it.
233
+ * @see {@link https://prosemirror.net/docs/ref/#view.NodeView.stopEvent}
234
+ */
235
+ }, {
236
+ key: "stopEvent",
237
+ value: function stopEvent(event) {
238
+ if (event.type === 'dragstart') {
239
+ var target = event.target;
240
+ if (target instanceof HTMLElement && target.closest('[data-smart-element-link]') && fg('cc_drag_and_drop_smart_link_from_content_to_tree')) {
241
+ return true;
242
+ }
243
+ }
244
+ return false;
245
+ }
223
246
  }, {
224
247
  key: "destroy",
225
248
  value: function destroy() {
@@ -22,6 +22,8 @@ import { findOverflowScrollParent, MediaSingle as RichMediaWrapper, UnsupportedB
22
22
  import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
23
23
  import { floatingLayouts, isRichMediaInsideOfBlockNode } from '@atlaskit/editor-common/utils';
24
24
  import { akEditorFullPageNarrowBreakout, DEFAULT_EMBED_CARD_HEIGHT, DEFAULT_EMBED_CARD_WIDTH } from '@atlaskit/editor-shared-styles';
25
+ import { SmartLinkDraggable, SMART_LINK_DRAG_TYPES, SMART_LINK_APPEARANCE } from '@atlaskit/editor-smart-link-draggable';
26
+ import { fg } from '@atlaskit/platform-feature-flags';
25
27
  import { componentWithCondition } from '@atlaskit/platform-feature-flags-react';
26
28
  import { EmbedResizeMessageListener, Card as SmartCard } from '@atlaskit/smart-card';
27
29
  import { CardSSR } from '@atlaskit/smart-card/ssr';
@@ -373,7 +375,11 @@ export var EmbedCardComponent = /*#__PURE__*/function (_React$PureComponent) {
373
375
  actionOptions: actionOptions,
374
376
  CompetitorPrompt: CompetitorPrompt
375
377
  });
376
- return /*#__PURE__*/React.createElement(EmbedResizeMessageListener, {
378
+ return /*#__PURE__*/React.createElement(SmartLinkDraggable, {
379
+ url: url,
380
+ appearance: SMART_LINK_APPEARANCE.EMBED,
381
+ source: SMART_LINK_DRAG_TYPES.EDITOR
382
+ }, /*#__PURE__*/React.createElement(EmbedResizeMessageListener, {
377
383
  embedIframeRef: this.embedIframeRef,
378
384
  onHeightUpdate: this.onHeightUpdate
379
385
  }, /*#__PURE__*/React.createElement(CardInner, {
@@ -391,7 +397,7 @@ export var EmbedCardComponent = /*#__PURE__*/function (_React$PureComponent) {
391
397
  heightAlone: heightAlone,
392
398
  cardProps: cardProps,
393
399
  dispatchAnalyticsEvent: dispatchAnalyticsEvent
394
- }));
400
+ })));
395
401
  }
396
402
  }]);
397
403
  }(React.PureComponent);
@@ -515,6 +521,23 @@ export var EmbedCard = /*#__PURE__*/function (_ReactNodeView) {
515
521
  provider: provider
516
522
  });
517
523
  }
524
+
525
+ /**
526
+ * Prevent ProseMirror from handling drag events on the smart-element-link,
527
+ * allowing native drag to work so SmartLinkDraggable can intercept it.
528
+ * @see {@link https://prosemirror.net/docs/ref/#view.NodeView.stopEvent}
529
+ */
530
+ }, {
531
+ key: "stopEvent",
532
+ value: function stopEvent(event) {
533
+ if (event.type === 'dragstart') {
534
+ var target = event.target;
535
+ if (target instanceof HTMLElement && target.closest('[data-smart-element-link]') && fg('cc_drag_and_drop_smart_link_from_content_to_tree')) {
536
+ return true;
537
+ }
538
+ }
539
+ return false;
540
+ }
518
541
  }, {
519
542
  key: "destroy",
520
543
  value: function destroy() {
@@ -87,7 +87,9 @@ export function Card(SmartCardComponent, UnsupportedComponent) {
87
87
  if (this.state.isError) {
88
88
  if (url) {
89
89
  return fg('dst-a11y__replace-anchor-with-link__linking-platfo') ? /*#__PURE__*/React.createElement(Link, {
90
- href: url,
90
+ href: url
91
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
92
+ ,
91
93
  onClick: function onClick(e) {
92
94
  e.preventDefault();
93
95
  }
@@ -106,7 +108,9 @@ export function Card(SmartCardComponent, UnsupportedComponent) {
106
108
  }
107
109
  var editorAppearance = (_getPluginState = getPluginState(this.props.view.state)) === null || _getPluginState === void 0 ? void 0 : _getPluginState.editorAppearance;
108
110
  var analyticsEditorAppearance = getAnalyticsEditorAppearance(editorAppearance);
109
- return /*#__PURE__*/React.createElement(AnalyticsContext, {
111
+ return /*#__PURE__*/React.createElement(AnalyticsContext
112
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
113
+ , {
110
114
  data: {
111
115
  attributes: {
112
116
  location: analyticsEditorAppearance
@@ -210,11 +210,11 @@ export function InlineCardNodeView(props) {
210
210
  // Ignored via go/ees005
211
211
  // eslint-disable-next-line react/jsx-props-no-spreading
212
212
  }, enableInlineUpgradeFeatures && getAwarenessProps(view.state, getPos, allowEmbeds, allowBlockCards, mode === 'view'))), CompetitorPromptComponent);
213
- return expValEquals('cc_drag_and_drop_smart_link_from_content_to_tree', 'isEnabled', true) ? /*#__PURE__*/React.createElement(SmartLinkDraggable, {
213
+ return /*#__PURE__*/React.createElement(SmartLinkDraggable, {
214
214
  url: url,
215
215
  appearance: SMART_LINK_APPEARANCE.INLINE,
216
216
  source: SMART_LINK_DRAG_TYPES.EDITOR
217
- }, inlineCardContent) : inlineCardContent;
217
+ }, inlineCardContent);
218
218
  }
219
219
  export var inlineCardNodeView = function inlineCardNodeView(_ref5) {
220
220
  var inlineCardViewProducer = _ref5.inlineCardViewProducer;
@@ -189,7 +189,9 @@ export var InlineCardWithAwareness = /*#__PURE__*/memo(function (_ref) {
189
189
  editorAnalyticsApi: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a4 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a4 === void 0 ? void 0 : _pluginInjectionApi$a4.actions,
190
190
  view: view,
191
191
  showPanelButton: showPanelButton,
192
- showPanelButtonIcon: isPreviewAvailable && isPreviewPanelAvailable ? 'panel' : 'modal',
192
+ showPanelButtonIcon: isPreviewAvailable && isPreviewPanelAvailable ? 'panel' : 'modal'
193
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
194
+ ,
193
195
  onClick: function onClick(event) {
194
196
  if (isPreviewPanelAvailable) {
195
197
  var _extractSmartLinkEmbe;
@@ -80,10 +80,14 @@ export var AwarenessWrapper = function AwarenessWrapper(_ref) {
80
80
  if (shouldShowLinkOverlay && !editorExperiment('platform_editor_controls', 'variant1') && !editorExperiment('platform_editor_preview_panel_linking_exp', true)) {
81
81
  return jsx(InlineCardOverlay, {
82
82
  isSelected: isSelected,
83
- isVisible: isResolvedViewRendered && (isInserted || isHovered || isSelected),
83
+ isVisible: isResolvedViewRendered && (isInserted || isHovered || isSelected)
84
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
85
+ ,
84
86
  onMouseEnter: function onMouseEnter() {
85
87
  return handleOverlayChange(true);
86
- },
88
+ }
89
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
90
+ ,
87
91
  onMouseLeave: function onMouseLeave() {
88
92
  return handleOverlayChange(false);
89
93
  },
@@ -104,7 +108,9 @@ export var AwarenessWrapper = function AwarenessWrapper(_ref) {
104
108
  "data-vc": "awareness-wrapper",
105
109
  "data-ssr-placeholder": "awareness-wrapper-".concat(placeholderUniqId),
106
110
  "data-ssr-placeholder-replace": "awareness-wrapper-".concat(placeholderUniqId)
107
- }, jsx(AnalyticsContext, {
111
+ }, jsx(AnalyticsContext
112
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
113
+ , {
108
114
  data: {
109
115
  attributes: getResolvedAttributesFromStore(url, 'inline', cardContext === null || cardContext === void 0 || (_cardContext$value = cardContext.value) === null || _cardContext$value === void 0 ? void 0 : _cardContext$value.store)
110
116
  }
@@ -85,7 +85,9 @@ export var DatasourceDropdownOption = function DatasourceDropdownOption(_ref) {
85
85
  key: intl.formatMessage(messages.datasourceAppearanceTitle),
86
86
  iconBefore: SmartLinkListIcon({
87
87
  label: intl.formatMessage(messages.datasourceAppearanceTitle)
88
- }),
88
+ })
89
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
90
+ ,
89
91
  onClick: function onClick() {
90
92
  return dispatchCommand(onChangeAppearance);
91
93
  },
@@ -93,13 +93,17 @@ export var EditLinkToolbar = /*#__PURE__*/function (_React$Component) {
93
93
  // via the floating toolbar
94
94
  ,
95
95
  invokeMethod: INPUT_METHOD.FLOATING_TB,
96
- lpLinkPicker: lpLinkPicker,
96
+ lpLinkPicker: lpLinkPicker
97
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
98
+ ,
97
99
  onSubmit: function onSubmit(href, title, displayText, inputMethod, analytic) {
98
100
  _this.hideLinkToolbar();
99
101
  if (_onSubmit) {
100
102
  _onSubmit(href, displayText || title, inputMethod, analytic);
101
103
  }
102
- },
104
+ }
105
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
106
+ ,
103
107
  onEscapeCallback: function onEscapeCallback(state, dispatch) {
104
108
  var tr = state.tr;
105
109
  _hideLinkToolbar(tr);
@@ -109,7 +113,9 @@ export var EditLinkToolbar = /*#__PURE__*/function (_React$Component) {
109
113
  return true;
110
114
  }
111
115
  return false;
112
- },
116
+ }
117
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
118
+ ,
113
119
  onClickAwayCallback: function onClickAwayCallback(state, dispatch) {
114
120
  var tr = state.tr;
115
121
  if (dispatch) {
@@ -164,7 +170,9 @@ export var buildEditLinkToolbar = function buildEditLinkToolbar(_ref2) {
164
170
  text: displayInfo.title || '',
165
171
  node: node,
166
172
  lpLinkPicker: lpLinkPicker,
167
- forceFocusSelector: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$f = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f === void 0 || (_pluginInjectionApi$f = _pluginInjectionApi$f.actions) === null || _pluginInjectionApi$f === void 0 ? void 0 : _pluginInjectionApi$f.forceFocusSelector,
173
+ forceFocusSelector: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$f = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f === void 0 || (_pluginInjectionApi$f = _pluginInjectionApi$f.actions) === null || _pluginInjectionApi$f === void 0 ? void 0 : _pluginInjectionApi$f.forceFocusSelector
174
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
175
+ ,
168
176
  onSubmit: function onSubmit(newHref, newText, inputMethod, analytic) {
169
177
  var urlChanged = newHref !== displayInfo.url;
170
178
  var titleChanged = newText !== displayInfo.title;
@@ -124,7 +124,9 @@ var EditToolbarButtonPresentation = function EditToolbarButtonPresentation(_ref)
124
124
  handleClickOutside: onClose,
125
125
  handleEscapeKeydown: onClose,
126
126
  trigger: trigger,
127
- scrollableElement: containerRef.current,
127
+ scrollableElement: containerRef.current
128
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
129
+ ,
128
130
  arrowKeyNavigationProviderOptions: {
129
131
  type: ArrowKeyNavigationType.MENU
130
132
  }
@@ -151,7 +151,9 @@ var EditToolbarButtonWithCardContext = function EditToolbarButtonWithCardContext
151
151
  handleClickOutside: onClose,
152
152
  handleEscapeKeydown: onClose,
153
153
  trigger: trigger,
154
- scrollableElement: containerRef.current,
154
+ scrollableElement: containerRef.current
155
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
156
+ ,
155
157
  arrowKeyNavigationProviderOptions: {
156
158
  type: ArrowKeyNavigationType.MENU
157
159
  }
@@ -113,6 +113,7 @@ var CustomHyperlinkDropdown = function CustomHyperlinkDropdown(props) {
113
113
  case 21:
114
114
  _context2.prev = 21;
115
115
  _context2.t3 = _context2["catch"](3);
116
+ // eslint-disable-line no-unused-vars
116
117
  isUrlSupported = false;
117
118
  case 24:
118
119
  newMap = new Map(supportedUrlsMap);
@@ -182,7 +183,9 @@ var CustomHyperlinkDropdown = function CustomHyperlinkDropdown(props) {
182
183
  handleClickOutside: close,
183
184
  handleEscapeKeydown: close,
184
185
  trigger: trigger,
185
- scrollableElement: containerRef.current,
186
+ scrollableElement: containerRef.current
187
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
188
+ ,
186
189
  arrowKeyNavigationProviderOptions: {
187
190
  type: ArrowKeyNavigationType.MENU
188
191
  },
@@ -118,14 +118,18 @@ export var LinkToolbarAppearance = /*#__PURE__*/function (_React$Component) {
118
118
  var embedEnabled = embedOption ? !embedOption.disabled : false;
119
119
  if (shouldRenderToolbarPulse(embedEnabled, currentAppearance !== null && currentAppearance !== void 0 ? currentAppearance : '', status !== null && status !== void 0 ? status : '', showUpgradeDiscoverability)) {
120
120
  var resolvedAnalyticsAttributes = getResolvedAttributesFromStore(url || '', currentAppearance || null, cardContext === null || cardContext === void 0 ? void 0 : cardContext.store);
121
- return /*#__PURE__*/React.createElement(AnalyticsContext, {
122
- data: {
123
- attributes: _objectSpread({}, resolvedAnalyticsAttributes)
124
- }
125
- }, /*#__PURE__*/React.createElement(DiscoveryPulse, {
126
- localStorageKey: LOCAL_STORAGE_DISCOVERY_KEY_TOOLBAR,
127
- testId: "toolbar-discovery-pulse"
128
- }, LinkToolbarButtons));
121
+ return (
122
+ /*#__PURE__*/
123
+ // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
124
+ React.createElement(AnalyticsContext, {
125
+ data: {
126
+ attributes: _objectSpread({}, resolvedAnalyticsAttributes)
127
+ }
128
+ }, /*#__PURE__*/React.createElement(DiscoveryPulse, {
129
+ localStorageKey: LOCAL_STORAGE_DISCOVERY_KEY_TOOLBAR,
130
+ testId: "toolbar-discovery-pulse"
131
+ }, LinkToolbarButtons))
132
+ );
129
133
  }
130
134
  return LinkToolbarButtons;
131
135
  });
@@ -152,6 +156,7 @@ export var getUnavailableMessage = function getUnavailableMessage(state, intl) {
152
156
  });
153
157
  return tooltip;
154
158
  } catch (e) {
159
+ // eslint-disable-line no-unused-vars
155
160
  return intl.formatMessage(messages.displayOptionUnavailableInParentNode, {
156
161
  node: intl.formatMessage(nodeNames.defaultBlockNode)
157
162
  });
@@ -100,7 +100,9 @@ export var LinkAppearanceMenu = function LinkAppearanceMenu(_ref) {
100
100
  return /*#__PURE__*/React.createElement(MenuGroup, null, /*#__PURE__*/React.createElement(Section, null, finalOptions.map(function (option) {
101
101
  return /*#__PURE__*/React.createElement(ButtonItem, {
102
102
  key: option.title,
103
- iconBefore: option.icon,
103
+ iconBefore: option.icon
104
+ // eslint-disable-next-line @atlassian/perf-linting/detect-unnecessary-rerenders, @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
105
+ ,
104
106
  onClick: function onClick() {
105
107
  return option.onClick();
106
108
  },
@@ -34,6 +34,12 @@ export declare class BlockCard extends ReactNodeView<BlockCardNodeViewProps> {
34
34
  validUpdate(currentNode: Node, newNode: Node): boolean;
35
35
  update(node: Node, decorations: ReadonlyArray<Decoration>, _innerDecorations?: DecorationSource): boolean;
36
36
  render(): React.JSX.Element;
37
+ /**
38
+ * Prevent ProseMirror from handling drag events on the smart-element-link,
39
+ * allowing native drag to work so SmartLinkDraggable can intercept it.
40
+ * @see {@link https://prosemirror.net/docs/ref/#view.NodeView.stopEvent}
41
+ */
42
+ stopEvent(event: Event): boolean;
37
43
  destroy(): void;
38
44
  }
39
45
  export interface BlockCardNodeViewProperties {
@@ -63,6 +63,12 @@ export declare class EmbedCard extends ReactNodeView<EmbedCardNodeViewProps> {
63
63
  createDomRef(): HTMLElement;
64
64
  private updateContentEditable;
65
65
  render(): React.JSX.Element;
66
+ /**
67
+ * Prevent ProseMirror from handling drag events on the smart-element-link,
68
+ * allowing native drag to work so SmartLinkDraggable can intercept it.
69
+ * @see {@link https://prosemirror.net/docs/ref/#view.NodeView.stopEvent}
70
+ */
71
+ stopEvent(event: Event): boolean;
66
72
  destroy(): void;
67
73
  }
68
74
  export interface EmbedCardNodeViewProperties {
@@ -34,6 +34,12 @@ export declare class BlockCard extends ReactNodeView<BlockCardNodeViewProps> {
34
34
  validUpdate(currentNode: Node, newNode: Node): boolean;
35
35
  update(node: Node, decorations: ReadonlyArray<Decoration>, _innerDecorations?: DecorationSource): boolean;
36
36
  render(): React.JSX.Element;
37
+ /**
38
+ * Prevent ProseMirror from handling drag events on the smart-element-link,
39
+ * allowing native drag to work so SmartLinkDraggable can intercept it.
40
+ * @see {@link https://prosemirror.net/docs/ref/#view.NodeView.stopEvent}
41
+ */
42
+ stopEvent(event: Event): boolean;
37
43
  destroy(): void;
38
44
  }
39
45
  export interface BlockCardNodeViewProperties {
@@ -63,6 +63,12 @@ export declare class EmbedCard extends ReactNodeView<EmbedCardNodeViewProps> {
63
63
  createDomRef(): HTMLElement;
64
64
  private updateContentEditable;
65
65
  render(): React.JSX.Element;
66
+ /**
67
+ * Prevent ProseMirror from handling drag events on the smart-element-link,
68
+ * allowing native drag to work so SmartLinkDraggable can intercept it.
69
+ * @see {@link https://prosemirror.net/docs/ref/#view.NodeView.stopEvent}
70
+ */
71
+ stopEvent(event: Event): boolean;
66
72
  destroy(): void;
67
73
  }
68
74
  export interface EmbedCardNodeViewProperties {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-card",
3
- "version": "13.1.1",
3
+ "version": "13.1.3",
4
4
  "description": "Card plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -60,9 +60,9 @@
60
60
  "@atlaskit/platform-feature-flags-react": "^0.4.0",
61
61
  "@atlaskit/primitives": "^18.0.0",
62
62
  "@atlaskit/prosemirror-history": "^0.2.0",
63
- "@atlaskit/smart-card": "^43.26.0",
63
+ "@atlaskit/smart-card": "^43.27.0",
64
64
  "@atlaskit/theme": "^22.0.0",
65
- "@atlaskit/tmp-editor-statsig": "^43.0.0",
65
+ "@atlaskit/tmp-editor-statsig": "^44.0.0",
66
66
  "@atlaskit/tokens": "^11.1.0",
67
67
  "@babel/runtime": "^7.0.0",
68
68
  "@emotion/react": "^11.7.1",
@@ -111,6 +111,9 @@
111
111
  }
112
112
  },
113
113
  "platform-feature-flags": {
114
+ "cc_drag_and_drop_smart_link_from_content_to_tree": {
115
+ "type": "boolean"
116
+ },
114
117
  "confluence-issue-terminology-refresh": {
115
118
  "type": "boolean"
116
119
  },