@atlaskit/editor-plugin-card 1.15.1 → 2.0.0

package/dist/es2019/toolbar.js

@@ -22,7 +22,7 @@ import { buildEditLinkToolbar, editLink, editLinkToolbarConfig } from './ui/Edit
 import { EditToolbarButton } from './ui/EditToolbarButton';
 import { LinkToolbarAppearance } from './ui/LinkToolbarAppearance';
 import { ToolbarViewedEvent } from './ui/ToolbarViewedEvent';
-import { appearanceForNodeType, displayInfoForCard, findCardInfo, isDatasourceConfigEditable, isDatasourceNode, isEditDropdownEnabled, titleUrlPairFromNode } from './utils';
+import { appearanceForNodeType, displayInfoForCard, findCardInfo, isDatasourceConfigEditable, isDatasourceNode, titleUrlPairFromNode } from './utils';
 export const removeCard = editorAnalyticsApi => commandWithMetadata((state, dispatch) => {
   if (!(state.selection instanceof NodeSelection)) {
     return false;
@@ -214,13 +214,13 @@ const generateToolbarItems = (state, intl, providerFactory, cardOptions, lpLinkP
       lpLinkPicker
     })];
   } else if (shouldRenderDatasourceToolbar) {
-    var _pluginInjectionApi$c;
-    return getDatasourceButtonGroup(metadata, intl, editorAnalyticsApi, node, hoverDecoration, node.attrs.datasource.id, state, cardOptions, currentAppearance, platform, pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$c = pluginInjectionApi.card) === null || _pluginInjectionApi$c === void 0 ? void 0 : _pluginInjectionApi$c.actions);
+    return getDatasourceButtonGroup(metadata, intl, editorAnalyticsApi, node, hoverDecoration, node.attrs.datasource.id, state, cardOptions, currentAppearance, platform);
   } else {
     const {
       inlineCard
     } = state.schema.nodes;
-    const toolbarItems = [isEditDropdownEnabled(platform) && cardOptions.allowDatasource ? {
+    const isEditDropdownEnabled = getBooleanFF('platform.linking-platform.enable-datasource-edit-dropdown-toolbar') && platform !== 'mobile' && cardOptions.allowDatasource;
+    const toolbarItems = [isEditDropdownEnabled ? {
       type: 'custom',
       fallback: [],
       render: editorView => /*#__PURE__*/React.createElement(EditToolbarButton, {
@@ -298,23 +298,19 @@ const generateToolbarItems = (state, intl, providerFactory, cardOptions, lpLinkP
       toolbarItems.unshift(...getToolbarViewedItem(url, currentAppearance), {
         type: 'custom',
         fallback: [],
-        render: editorView => {
-          var _pluginInjectionApi$c2;
-          return /*#__PURE__*/React.createElement(LinkToolbarAppearance, {
-            key: "link-appearance",
-            url: url,
-            intl: intl,
-            currentAppearance: currentAppearance,
-            editorView: editorView,
-            editorState: state,
-            allowEmbeds: allowEmbeds,
-            allowBlockCards: allowBlockCards,
-            platform: platform,
-            editorAnalyticsApi: editorAnalyticsApi,
-            cardActions: pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$c2 = pluginInjectionApi.card) === null || _pluginInjectionApi$c2 === void 0 ? void 0 : _pluginInjectionApi$c2.actions,
-            showUpgradeDiscoverability: showUpgradeDiscoverability
-          });
-        }
+        render: editorView => /*#__PURE__*/React.createElement(LinkToolbarAppearance, {
+          key: "link-appearance",
+          url: url,
+          intl: intl,
+          currentAppearance: currentAppearance,
+          editorView: editorView,
+          editorState: state,
+          allowEmbeds: allowEmbeds,
+          allowBlockCards: allowBlockCards,
+          platform: platform,
+          editorAnalyticsApi: editorAnalyticsApi,
+          showUpgradeDiscoverability: showUpgradeDiscoverability
+        })
       }, ...(showDatasourceAppearance ? [{
         type: 'custom',
         fallback: [],
@@ -384,7 +380,7 @@ export const getSettingsButtonGroup = (intl, editorAnalyticsApi, userPreferences
     type: 'separator'
   }];
 };
-const getDatasourceButtonGroup = (metadata, intl, editorAnalyticsApi, node, hoverDecoration, datasourceId, state, cardOptions, currentAppearance, platform, cardActions) => {
+const getDatasourceButtonGroup = (metadata, intl, editorAnalyticsApi, node, hoverDecoration, datasourceId, state, cardOptions, currentAppearance, platform) => {
   var _node$attrs3;
   const toolbarItems = [];
   if (isDatasourceConfigEditable(datasourceId) && !getBooleanFF('platform.linking-platform.enable-datasource-edit-dropdown-toolbar')) {
@@ -453,7 +449,6 @@ const getDatasourceButtonGroup = (metadata, intl, editorAnalyticsApi, node, hove
           allowBlockCards: allowBlockCards,
           platform: platform,
           editorAnalyticsApi: editorAnalyticsApi,
-          cardActions: cardActions,
           showUpgradeDiscoverability: showUpgradeDiscoverability,
           isDatasourceView: true
         });

package/dist/es2019/ui/EditLinkToolbar.js

@@ -1,7 +1,6 @@
 import React from 'react';
 import { ACTION, buildEditLinkPayload, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { commandWithMetadata } from '@atlaskit/editor-common/card';
-import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 import { HyperlinkAddToolbar as HyperlinkToolbar } from '@atlaskit/editor-common/link';
 import { linkToolbarMessages } from '@atlaskit/editor-common/messages';
 import { LINKPICKER_HEIGHT_IN_PX, RECENT_SEARCH_HEIGHT_IN_PX, RECENT_SEARCH_WIDTH_IN_PX } from '@atlaskit/editor-common/ui';
@@ -21,12 +20,8 @@ export function HyperlinkAddToolbarWithState({
   lpLinkPicker,
   onClose,
   onEscapeCallback,
-  onClickAwayCallback,
-  pluginInjectionApi
+  onClickAwayCallback
 }) {
-  const {
-    hyperlinkState
-  } = useSharedPluginState(pluginInjectionApi, ['hyperlink']);
   return /*#__PURE__*/React.createElement(HyperlinkToolbar, {
     linkPickerOptions: linkPickerOptions,
     onSubmit: onSubmit,
@@ -39,8 +34,7 @@ export function HyperlinkAddToolbarWithState({
     lpLinkPicker: lpLinkPicker,
     onClose: onClose,
     onEscapeCallback: onEscapeCallback,
-    onClickAwayCallback: onClickAwayCallback,
-    hyperlinkPluginState: hyperlinkState
+    onClickAwayCallback: onClickAwayCallback
   });
 }
 
@@ -68,12 +62,10 @@ export class EditLinkToolbar extends React.Component {
       text,
       view,
       onSubmit,
-      pluginInjectionApi,
       forceFocusSelector,
       lpLinkPicker
     } = this.props;
     return /*#__PURE__*/React.createElement(HyperlinkAddToolbarWithState, {
-      pluginInjectionApi: pluginInjectionApi,
       view: view,
       linkPickerOptions: linkPickerOptions,
       providerFactory: providerFactory,
@@ -91,11 +83,9 @@ export class EditLinkToolbar extends React.Component {
         }
       },
       onEscapeCallback: (state, dispatch) => {
-        var _pluginInjectionApi$h;
         const {
           tr
         } = state;
-        pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$h = pluginInjectionApi.hyperlink) === null || _pluginInjectionApi$h === void 0 ? void 0 : _pluginInjectionApi$h.actions.hideLinkToolbar(tr);
         hideLinkToolbar(tr);
         forceFocusSelector === null || forceFocusSelector === void 0 ? void 0 : forceFocusSelector(`[aria-label="${linkToolbarMessages.editLink.defaultMessage}"]`)(tr);
         if (dispatch) {
@@ -105,11 +95,9 @@ export class EditLinkToolbar extends React.Component {
         return false;
       },
       onClickAwayCallback: (state, dispatch) => {
-        var _pluginInjectionApi$h2;
         const {
           tr
         } = state;
-        pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$h2 = pluginInjectionApi.hyperlink) === null || _pluginInjectionApi$h2 === void 0 ? void 0 : _pluginInjectionApi$h2.actions.hideLinkToolbar(tr);
         if (dispatch) {
           dispatch(tr);
           return true;
@@ -138,8 +126,8 @@ export const editLink = editorAnalyticsApi => (state, dispatch) => {
 export const buildEditLinkToolbar = ({
   providerFactory,
   node,
-  linkPicker,
   pluginInjectionApi,
+  linkPicker,
   lpLinkPicker
 }) => {
   return {
@@ -153,7 +141,6 @@ export const buildEditLinkToolbar = ({
       }
       const displayInfo = displayInfoForCard(node, findCardInfo(view.state));
       return /*#__PURE__*/React.createElement(EditLinkToolbar, {
-        pluginInjectionApi: pluginInjectionApi,
         key: idx,
         view: view,
         linkPickerOptions: linkPicker,

package/dist/es2019/ui/HyperlinkToolbarAppearance.js

@@ -67,8 +67,7 @@ export class HyperlinkToolbarAppearance extends Component {
       editorState,
       cardOptions,
       platform,
-      editorAnalyticsApi,
-      cardActions
+      editorAnalyticsApi
     } = this.props;
     const {
       supportedUrlsMap
@@ -76,7 +75,7 @@ export class HyperlinkToolbarAppearance extends Component {
     if (!supportedUrlsMap.get(url)) {
       return null;
     }
-    return /*#__PURE__*/React.createElement(Flex, null, /*#__PURE__*/React.createElement(EditDatasourceButton, {
+    return /*#__PURE__*/React.createElement(Flex, null, !getBooleanFF('platform.linking-platform.enable-datasource-edit-dropdown-toolbar') && /*#__PURE__*/React.createElement(EditDatasourceButton, {
       url: url,
       intl: intl,
       editorState: editorState,
@@ -91,8 +90,7 @@ export class HyperlinkToolbarAppearance extends Component {
       allowEmbeds: cardOptions === null || cardOptions === void 0 ? void 0 : cardOptions.allowEmbeds,
       allowBlockCards: cardOptions === null || cardOptions === void 0 ? void 0 : cardOptions.allowBlockCards,
       platform: platform,
-      editorAnalyticsApi: editorAnalyticsApi,
-      cardActions: cardActions
+      editorAnalyticsApi: editorAnalyticsApi
     }), getBooleanFF('platform.linking-platform.enable-datasource-appearance-toolbar') && (cardOptions === null || cardOptions === void 0 ? void 0 : cardOptions.allowDatasource) && /*#__PURE__*/React.createElement(DatasourceAppearanceButton, {
       intl: intl,
       url: url,

package/dist/es2019/ui/LinkToolbarAppearance.js

@@ -8,6 +8,7 @@ import nodeNames, { cardMessages as messages } from '@atlaskit/editor-common/mes
 import { isSupportedInParent } from '@atlaskit/editor-common/utils';
 import { Fragment } from '@atlaskit/editor-prosemirror/model';
 import { LOCAL_STORAGE_DISCOVERY_KEY_TOOLBAR } from '../common/local-storage';
+import { changeSelectedCardToLink, setSelectedCardAppearance } from '../pm-plugins/doc';
 import { shouldRenderToolbarPulse } from '../toolbar';
 import { getResolvedAttributesFromStore } from '../utils';
 import { DiscoveryPulse } from './Pulse';
@@ -16,7 +17,7 @@ export class LinkToolbarAppearance extends React.Component {
   constructor(...args) {
     super(...args);
     _defineProperty(this, "renderDropdown", (view, cardContext) => {
-      var _cardActions$setSelec, _cardActions$setSelec2, _cardActions$changeSe, _cardActions$setSelec3, _cardContext$store2, _cardContext$store2$g;
+      var _setSelectedCardAppea, _setSelectedCardAppea2, _changeSelectedCardTo, _setSelectedCardAppea3, _cardContext$store2, _cardContext$store2$g;
       const {
         url,
         intl,
@@ -26,7 +27,6 @@ export class LinkToolbarAppearance extends React.Component {
         allowBlockCards = true,
         platform,
         editorAnalyticsApi,
-        cardActions,
         showUpgradeDiscoverability = true,
         isDatasourceView
       } = this.props;
@@ -44,7 +44,7 @@ export class LinkToolbarAppearance extends React.Component {
       const embedOption = allowEmbeds && preview && {
         appearance: 'embed',
         title: intl.formatMessage(messages.embed),
-        onClick: (_cardActions$setSelec = cardActions === null || cardActions === void 0 ? void 0 : cardActions.setSelectedCardAppearance('embed', editorAnalyticsApi)) !== null && _cardActions$setSelec !== void 0 ? _cardActions$setSelec : defaultCommand,
+        onClick: (_setSelectedCardAppea = setSelectedCardAppearance('embed', editorAnalyticsApi)) !== null && _setSelectedCardAppea !== void 0 ? _setSelectedCardAppea : defaultCommand,
         selected: currentAppearance === 'embed',
         hidden: false,
         testId: 'embed-appearance',
@@ -54,7 +54,7 @@ export class LinkToolbarAppearance extends React.Component {
       const blockCardOption = allowBlockCards && {
         appearance: 'block',
         title: intl.formatMessage(messages.block),
-        onClick: (_cardActions$setSelec2 = cardActions === null || cardActions === void 0 ? void 0 : cardActions.setSelectedCardAppearance('block', editorAnalyticsApi)) !== null && _cardActions$setSelec2 !== void 0 ? _cardActions$setSelec2 : defaultCommand,
+        onClick: (_setSelectedCardAppea2 = setSelectedCardAppearance('block', editorAnalyticsApi)) !== null && _setSelectedCardAppea2 !== void 0 ? _setSelectedCardAppea2 : defaultCommand,
         selected: currentAppearance === 'block' && !isDatasourceView,
         testId: 'block-appearance',
         disabled: !isBlockCardLinkSupportedInParent,
@@ -62,7 +62,7 @@ export class LinkToolbarAppearance extends React.Component {
       };
       const options = [{
         title: intl.formatMessage(messages.url),
-        onClick: commandWithMetadata((_cardActions$changeSe = cardActions === null || cardActions === void 0 ? void 0 : cardActions.changeSelectedCardToLink(url, url, true, undefined, undefined, editorAnalyticsApi)) !== null && _cardActions$changeSe !== void 0 ? _cardActions$changeSe : defaultCommand, {
+        onClick: commandWithMetadata((_changeSelectedCardTo = changeSelectedCardToLink(url, url, true, undefined, undefined, editorAnalyticsApi)) !== null && _changeSelectedCardTo !== void 0 ? _changeSelectedCardTo : defaultCommand, {
           action: ACTION.CHANGED_TYPE
         }),
         selected: !currentAppearance && !isDatasourceView,
@@ -70,7 +70,7 @@ export class LinkToolbarAppearance extends React.Component {
       }, {
         appearance: 'inline',
         title: intl.formatMessage(messages.inline),
-        onClick: (_cardActions$setSelec3 = cardActions === null || cardActions === void 0 ? void 0 : cardActions.setSelectedCardAppearance('inline', editorAnalyticsApi)) !== null && _cardActions$setSelec3 !== void 0 ? _cardActions$setSelec3 : defaultCommand,
+        onClick: (_setSelectedCardAppea3 = setSelectedCardAppearance('inline', editorAnalyticsApi)) !== null && _setSelectedCardAppea3 !== void 0 ? _setSelectedCardAppea3 : defaultCommand,
         selected: currentAppearance === 'inline',
         testId: 'inline-appearance'
       }];

package/dist/es2019/utils.js

@@ -73,9 +73,6 @@ export const isDatasourceConfigEditable = datasourceId => {
   }
   return datasourcesWithConfigModal.includes(datasourceId);
 };
-export const isEditDropdownEnabled = platform => {
-  return getBooleanFF('platform.linking-platform.enable-datasource-edit-dropdown-toolbar') && platform !== 'mobile';
-};
 
 /**
  * Typeguard that checks node attributes are datasource node attributes

package/dist/esm/plugin.js

@@ -10,10 +10,9 @@ import { ASSETS_LIST_OF_LINKS_DATASOURCE_ID, CONFLUENCE_SEARCH_DATASOURCE_ID } f
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { createEventsQueue } from './analytics/create-events-queue';
 import { hideLinkToolbar, showDatasourceModal } from './pm-plugins/actions';
-import { changeSelectedCardToLink, queueCardsFromChangedTr, setSelectedCardAppearance } from './pm-plugins/doc';
+import { getEndingToolbarItems, getStartingToolbarItems, queueCardsFromChangedTr } from './pm-plugins/doc';
 import { cardKeymap } from './pm-plugins/keymap';
 import { createPlugin } from './pm-plugins/main';
-import { mountHyperlinkPlugin } from './pm-plugins/mountHyperlink';
 import { pluginKey } from './pm-plugins/plugin-key';
 import { floatingToolbar } from './toolbar';
 import DatasourceModalWithState from './ui/DatasourceModal/ModalWithState';
@@ -21,10 +20,6 @@ import { EditorLinkingPlatformAnalytics } from './ui/EditorLinkingPlatformAnalyt
 import { EditorSmartCardEvents } from './ui/EditorSmartCardEvents';
 import LayoutButton from './ui/LayoutButton';
 import { isDatasourceConfigEditable } from './utils';
-/**
- * Card plugin to be added to an `EditorPresetBuilder` and used with `ComposableEditor`
- * from `@atlaskit/editor-core`.
- */
 export var cardPlugin = function cardPlugin(_ref) {
   var _options$lpLinkPicker;
   var options = _ref.config,
@@ -75,11 +70,6 @@ export var cardPlugin = function cardPlugin(_ref) {
           cardPluginEvents: cardPluginEvents,
           showUpgradeDiscoverability: showUpgradeDiscoverability
         }), api)
-      }, {
-        name: 'cardHyperlink',
-        plugin: function plugin() {
-          return mountHyperlinkPlugin(api, options);
-        }
       }];
       plugins.push({
         name: 'cardKeymap',
@@ -115,8 +105,8 @@ export var cardPlugin = function cardPlugin(_ref) {
     actions: {
       hideLinkToolbar: hideLinkToolbar,
       queueCardsFromChangedTr: queueCardsFromChangedTr,
-      changeSelectedCardToLink: changeSelectedCardToLink,
-      setSelectedCardAppearance: setSelectedCardAppearance
+      getStartingToolbarItems: getStartingToolbarItems(options, api),
+      getEndingToolbarItems: getEndingToolbarItems(options, api)
     },
     pluginsOptions: {
       floatingToolbar: floatingToolbar(options, (_options$lpLinkPicker = options.lpLinkPicker) !== null && _options$lpLinkPicker !== void 0 ? _options$lpLinkPicker : false, options.platform, options.linkPicker, api, options.disableFloatingToolbar),

package/dist/esm/pm-plugins/doc.js

@@ -2,18 +2,25 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+import React from 'react';
 import isEqual from 'lodash/isEqual';
 import { isSafeUrl } from '@atlaskit/adf-schema';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD, SMART_LINK_TYPE, unlinkPayload } from '@atlaskit/editor-common/analytics';
 import { addLinkMetadata } from '@atlaskit/editor-common/card';
+import { linkToolbarMessages } from '@atlaskit/editor-common/messages';
 import { getDatasourceType, getLinkCreationAnalyticsEvent, isFromCurrentDomain, nodesBetweenChanged, processRawValue } from '@atlaskit/editor-common/utils';
 import { closeHistory } from '@atlaskit/editor-prosemirror/history';
 import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
+import { getHyperlinkToolbarSettingsButton } from '../toolbar';
+import { EditToolbarButton } from '../ui/EditToolbarButton';
+import { HyperlinkToolbarAppearance } from '../ui/HyperlinkToolbarAppearance';
+import { ToolbarViewedEvent } from '../ui/ToolbarViewedEvent';
 import { appearanceForNodeType, isDatasourceConfigEditable, isDatasourceNode, selectedCardAppearance } from '../utils';
 import { hideDatasourceModal, queueCards, removeDatasourceStash, resolveCard, setDatasourceStash, showDatasourceModal } from './actions';
 import { pluginKey } from './plugin-key';
 import { shouldReplaceLink } from './shouldReplaceLink';
+
 /**
  * Attempt to replace the link into the respective card.
  */
@@ -561,7 +568,7 @@ var updateDatasourceStash = function updateDatasourceStash(tr, selectedNode) {
     }
   }
 };
-export var editDatasource = function editDatasource(datasourceId, _editorAnalyticsApi) {
+export var editDatasource = function editDatasource(datasourceId, editorAnalyticsApi) {
   return function (state, dispatch) {
     var datasourceType = getDatasourceType(datasourceId);
     if (dispatch && datasourceType) {
@@ -580,4 +587,84 @@ export var editDatasource = function editDatasource(datasourceId, _editorAnalyti
     }
     return false;
   };
+};
+export var getStartingToolbarItems = function getStartingToolbarItems(options, api) {
+  return function (intl, link, providerFactory, onEditLink, metadata) {
+    var isEditDropdownEnabled = getBooleanFF('platform.linking-platform.enable-datasource-edit-dropdown-toolbar') && options.platform !== 'mobile' && options.allowDatasource;
+    var editLinkItem = isEditDropdownEnabled ? [{
+      type: 'custom',
+      fallback: [],
+      render: function render(editorView) {
+        var _api$analytics;
+        if (!editorView) {
+          return null;
+        }
+        return /*#__PURE__*/React.createElement(EditToolbarButton, {
+          key: "edit-toolbar-button",
+          intl: intl,
+          editorAnalyticsApi: api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions,
+          url: link,
+          editorView: editorView,
+          onLinkEditClick: onEditLink
+        });
+      }
+    }] : [{
+      id: 'editor.link.edit',
+      testId: 'editor.link.edit',
+      type: 'button',
+      onClick: onEditLink,
+      title: intl.formatMessage(linkToolbarMessages.editLink),
+      showTitle: true,
+      metadata: metadata
+    }];
+    return [{
+      type: 'custom',
+      fallback: [],
+      render: function render(editorView) {
+        return /*#__PURE__*/React.createElement(ToolbarViewedEvent, {
+          key: "edit.link.menu.viewed",
+          url: link,
+          display: "url",
+          editorView: editorView
+        });
+      }
+    }, {
+      type: 'custom',
+      fallback: [],
+      render: function render(editorView) {
+        var _api$analytics2;
+        if (!editorView) {
+          return null;
+        }
+        return /*#__PURE__*/React.createElement(HyperlinkToolbarAppearance, {
+          key: "link-appearance",
+          url: link,
+          intl: intl,
+          editorView: editorView,
+          editorState: editorView.state,
+          cardOptions: options,
+          providerFactory: providerFactory,
+          platform: options === null || options === void 0 ? void 0 : options.platform,
+          editorAnalyticsApi: api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions
+        });
+      }
+    }].concat(editLinkItem);
+  };
+};
+export var getEndingToolbarItems = function getEndingToolbarItems(options, api) {
+  return function (intl, link) {
+    if (getBooleanFF('platform.editor.card.inject-settings-button')) {
+      /**
+       * Require either provider to be supplied (controls link preferences)
+       * Or explicit user preferences config in order to enable button
+       */
+      if (options.provider || options.userPreferencesLink) {
+        var _api$analytics3;
+        return [{
+          type: 'separator'
+        }, getHyperlinkToolbarSettingsButton(intl, api === null || api === void 0 || (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions, options.userPreferencesLink)];
+      }
+    }
+    return [];
+  };
 };

package/dist/esm/toolbar.js

@@ -26,7 +26,7 @@ import { buildEditLinkToolbar, editLink, editLinkToolbarConfig } from './ui/Edit
 import { EditToolbarButton } from './ui/EditToolbarButton';
 import { LinkToolbarAppearance } from './ui/LinkToolbarAppearance';
 import { ToolbarViewedEvent } from './ui/ToolbarViewedEvent';
-import { appearanceForNodeType, displayInfoForCard, findCardInfo, isDatasourceConfigEditable, isDatasourceNode, isEditDropdownEnabled, titleUrlPairFromNode } from './utils';
+import { appearanceForNodeType, displayInfoForCard, findCardInfo, isDatasourceConfigEditable, isDatasourceNode, titleUrlPairFromNode } from './utils';
 export var removeCard = function removeCard(editorAnalyticsApi) {
   return commandWithMetadata(function (state, dispatch) {
     if (!(state.selection instanceof NodeSelection)) {
@@ -212,11 +212,11 @@ var generateToolbarItems = function generateToolbarItems(state, intl, providerFa
         lpLinkPicker: lpLinkPicker
       })];
     } else if (shouldRenderDatasourceToolbar) {
-      var _pluginInjectionApi$c;
-      return getDatasourceButtonGroup(metadata, intl, editorAnalyticsApi, node, hoverDecoration, node.attrs.datasource.id, state, cardOptions, currentAppearance, platform, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$c = pluginInjectionApi.card) === null || _pluginInjectionApi$c === void 0 ? void 0 : _pluginInjectionApi$c.actions);
+      return getDatasourceButtonGroup(metadata, intl, editorAnalyticsApi, node, hoverDecoration, node.attrs.datasource.id, state, cardOptions, currentAppearance, platform);
     } else {
       var inlineCard = state.schema.nodes.inlineCard;
-      var toolbarItems = [isEditDropdownEnabled(platform) && cardOptions.allowDatasource ? {
+      var isEditDropdownEnabled = getBooleanFF('platform.linking-platform.enable-datasource-edit-dropdown-toolbar') && platform !== 'mobile' && cardOptions.allowDatasource;
+      var toolbarItems = [isEditDropdownEnabled ? {
         type: 'custom',
         fallback: [],
         render: function render(editorView) {
@@ -295,7 +295,6 @@ var generateToolbarItems = function generateToolbarItems(state, intl, providerFa
           type: 'custom',
           fallback: [],
           render: function render(editorView) {
-            var _pluginInjectionApi$c2;
             return /*#__PURE__*/React.createElement(LinkToolbarAppearance, {
               key: "link-appearance",
               url: url,
@@ -307,7 +306,6 @@ var generateToolbarItems = function generateToolbarItems(state, intl, providerFa
               allowBlockCards: allowBlockCards,
               platform: platform,
               editorAnalyticsApi: editorAnalyticsApi,
-              cardActions: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$c2 = pluginInjectionApi.card) === null || _pluginInjectionApi$c2 === void 0 ? void 0 : _pluginInjectionApi$c2.actions,
               showUpgradeDiscoverability: showUpgradeDiscoverability
             });
           }
@@ -385,7 +383,7 @@ export var getSettingsButtonGroup = function getSettingsButtonGroup(intl, editor
     type: 'separator'
   }];
 };
-var getDatasourceButtonGroup = function getDatasourceButtonGroup(metadata, intl, editorAnalyticsApi, node, hoverDecoration, datasourceId, state, cardOptions, currentAppearance, platform, cardActions) {
+var getDatasourceButtonGroup = function getDatasourceButtonGroup(metadata, intl, editorAnalyticsApi, node, hoverDecoration, datasourceId, state, cardOptions, currentAppearance, platform) {
   var _node$attrs3;
   var toolbarItems = [];
   if (isDatasourceConfigEditable(datasourceId) && !getBooleanFF('platform.linking-platform.enable-datasource-edit-dropdown-toolbar')) {
@@ -452,7 +450,6 @@ var getDatasourceButtonGroup = function getDatasourceButtonGroup(metadata, intl,
           allowBlockCards: allowBlockCards,
           platform: platform,
           editorAnalyticsApi: editorAnalyticsApi,
-          cardActions: cardActions,
           showUpgradeDiscoverability: showUpgradeDiscoverability,
           isDatasourceView: true
         });

package/dist/esm/ui/EditLinkToolbar.js

@@ -8,7 +8,6 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
 import React from 'react';
 import { ACTION, buildEditLinkPayload, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { commandWithMetadata } from '@atlaskit/editor-common/card';
-import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 import { HyperlinkAddToolbar as HyperlinkToolbar } from '@atlaskit/editor-common/link';
 import { linkToolbarMessages } from '@atlaskit/editor-common/messages';
 import { LINKPICKER_HEIGHT_IN_PX, RECENT_SEARCH_HEIGHT_IN_PX, RECENT_SEARCH_WIDTH_IN_PX } from '@atlaskit/editor-common/ui';
@@ -29,10 +28,7 @@ export function HyperlinkAddToolbarWithState(_ref) {
     lpLinkPicker = _ref.lpLinkPicker,
     onClose = _ref.onClose,
     onEscapeCallback = _ref.onEscapeCallback,
-    onClickAwayCallback = _ref.onClickAwayCallback,
-    pluginInjectionApi = _ref.pluginInjectionApi;
-  var _useSharedPluginState = useSharedPluginState(pluginInjectionApi, ['hyperlink']),
-    hyperlinkState = _useSharedPluginState.hyperlinkState;
+    onClickAwayCallback = _ref.onClickAwayCallback;
   return /*#__PURE__*/React.createElement(HyperlinkToolbar, {
     linkPickerOptions: linkPickerOptions,
     onSubmit: onSubmit,
@@ -45,8 +41,7 @@ export function HyperlinkAddToolbarWithState(_ref) {
     lpLinkPicker: lpLinkPicker,
     onClose: onClose,
     onEscapeCallback: onEscapeCallback,
-    onClickAwayCallback: onClickAwayCallback,
-    hyperlinkPluginState: hyperlinkState
+    onClickAwayCallback: onClickAwayCallback
   });
 }
 
@@ -87,11 +82,9 @@ export var EditLinkToolbar = /*#__PURE__*/function (_React$Component) {
         text = _this$props.text,
         view = _this$props.view,
         _onSubmit = _this$props.onSubmit,
-        pluginInjectionApi = _this$props.pluginInjectionApi,
         forceFocusSelector = _this$props.forceFocusSelector,
         lpLinkPicker = _this$props.lpLinkPicker;
       return /*#__PURE__*/React.createElement(HyperlinkAddToolbarWithState, {
-        pluginInjectionApi: pluginInjectionApi,
         view: view,
         linkPickerOptions: linkPickerOptions,
         providerFactory: providerFactory,
@@ -109,9 +102,7 @@ export var EditLinkToolbar = /*#__PURE__*/function (_React$Component) {
           }
         },
         onEscapeCallback: function onEscapeCallback(state, dispatch) {
-          var _pluginInjectionApi$h;
           var tr = state.tr;
-          pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$h = pluginInjectionApi.hyperlink) === null || _pluginInjectionApi$h === void 0 || _pluginInjectionApi$h.actions.hideLinkToolbar(tr);
           _hideLinkToolbar(tr);
           forceFocusSelector === null || forceFocusSelector === void 0 || forceFocusSelector("[aria-label=\"".concat(linkToolbarMessages.editLink.defaultMessage, "\"]"))(tr);
           if (dispatch) {
@@ -121,9 +112,7 @@ export var EditLinkToolbar = /*#__PURE__*/function (_React$Component) {
           return false;
         },
         onClickAwayCallback: function onClickAwayCallback(state, dispatch) {
-          var _pluginInjectionApi$h2;
           var tr = state.tr;
-          pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$h2 = pluginInjectionApi.hyperlink) === null || _pluginInjectionApi$h2 === void 0 || _pluginInjectionApi$h2.actions.hideLinkToolbar(tr);
           if (dispatch) {
             dispatch(tr);
             return true;
@@ -154,8 +143,8 @@ export var editLink = function editLink(editorAnalyticsApi) {
 export var buildEditLinkToolbar = function buildEditLinkToolbar(_ref2) {
   var providerFactory = _ref2.providerFactory,
     node = _ref2.node,
-    linkPicker = _ref2.linkPicker,
     pluginInjectionApi = _ref2.pluginInjectionApi,
+    linkPicker = _ref2.linkPicker,
     lpLinkPicker = _ref2.lpLinkPicker;
   return {
     type: 'custom',
@@ -168,7 +157,6 @@ export var buildEditLinkToolbar = function buildEditLinkToolbar(_ref2) {
       }
       var displayInfo = displayInfoForCard(node, findCardInfo(view.state));
       return /*#__PURE__*/React.createElement(EditLinkToolbar, {
-        pluginInjectionApi: pluginInjectionApi,
         key: idx,
         view: view,
         linkPickerOptions: linkPicker,

package/dist/esm/ui/HyperlinkToolbarAppearance.js

@@ -145,13 +145,12 @@ export var HyperlinkToolbarAppearance = /*#__PURE__*/function (_Component) {
         editorState = _this$props.editorState,
         cardOptions = _this$props.cardOptions,
         platform = _this$props.platform,
-        editorAnalyticsApi = _this$props.editorAnalyticsApi,
-        cardActions = _this$props.cardActions;
+        editorAnalyticsApi = _this$props.editorAnalyticsApi;
       var supportedUrlsMap = this.state.supportedUrlsMap;
       if (!supportedUrlsMap.get(url)) {
         return null;
       }
-      return /*#__PURE__*/React.createElement(Flex, null, /*#__PURE__*/React.createElement(EditDatasourceButton, {
+      return /*#__PURE__*/React.createElement(Flex, null, !getBooleanFF('platform.linking-platform.enable-datasource-edit-dropdown-toolbar') && /*#__PURE__*/React.createElement(EditDatasourceButton, {
         url: url,
         intl: intl,
         editorState: editorState,
@@ -166,8 +165,7 @@ export var HyperlinkToolbarAppearance = /*#__PURE__*/function (_Component) {
         allowEmbeds: cardOptions === null || cardOptions === void 0 ? void 0 : cardOptions.allowEmbeds,
         allowBlockCards: cardOptions === null || cardOptions === void 0 ? void 0 : cardOptions.allowBlockCards,
         platform: platform,
-        editorAnalyticsApi: editorAnalyticsApi,
-        cardActions: cardActions
+        editorAnalyticsApi: editorAnalyticsApi
       }), getBooleanFF('platform.linking-platform.enable-datasource-appearance-toolbar') && (cardOptions === null || cardOptions === void 0 ? void 0 : cardOptions.allowDatasource) && /*#__PURE__*/React.createElement(DatasourceAppearanceButton, {
         intl: intl,
         url: url,