@atlaskit/smart-card 19.1.16 → 19.1.17

package/dist/cjs/i18n/zh_TW.js

@@ -13,153 +13,67 @@ exports.default = void 0;
  */
 //Chinese (Traditional)
 var _default = {
-  'fabric.linking.cannot_connect': '無法連結，請再試一次',
-  'fabric.linking.cannot_find_link': '找不到連結',
-  'fabric.linking.join_to_view': '加入 {context} 以查看此議題',
-  'fabric.linking.create_on': '建立時間：{context}',
-  'fabric.linking.created_by': '建立者：{context}',
-  'fabric.linking.delete': '刪除',
-  'fabric.linking.edit': '編輯',
-  'fabric.linking.forbidden_access': '您的存取遭拒',
-  'fabric.linking.restricted_link': '連結受到限制，請嘗試其他帳戶',
-  'fabric.linking.modified_on': '更新時間：{context}',
-  'fabric.linking.pending_request': '您的存取要求擱置中',
-  'fabric.linking.priority_blocker': '封鎖程式',
-  'fabric.linking.priority_critical': '重要',
-  'fabric.linking.priority_high': '高',
-  'fabric.linking.priority_highest': '最高',
-  'fabric.linking.priority_low': '低',
-  'fabric.linking.priority_lowest': '最低',
-  'fabric.linking.priority_major': '主要',
-  'fabric.linking.priority_medium': '中',
-  'fabric.linking.priority_minor': '次要',
-  'fabric.linking.priority_trivial': '不太重要',
-  'fabric.linking.priority_undefined': '未定義',
-  'fabric.linking.request_access_to_view': '要求存取 {context} 以檢視此議題',
-  'fabric.linking.request_denied': '您的存取要求遭拒',
-  'fabric.linking.updated_by': '修改者：{context}',
-  'fabric.linking.accounts': '帳戶',
   'fabric.linking.actions': '動作',
   'fabric.linking.add_account': '新增帳戶',
-  'fabric.linking.annotate': '加上註解',
-  'fabric.linking.annotate.confirmation.close.anyway': '仍要關閉',
-  'fabric.linking.annotate.confirmation.content': '您有一些未儲存的變更，確定要離開嗎？',
-  'fabric.linking.annotate.confirmation.heading': '未儲存的變更',
-  'fabric.linking.annotate.tool.arrow': '箭頭',
-  'fabric.linking.annotate.tool.blur': '模糊',
-  'fabric.linking.annotate.tool.brush': '筆刷',
-  'fabric.linking.annotate.tool.color': '顏色',
-  'fabric.linking.annotate.tool.line.thickness': '線條粗細',
-  'fabric.linking.annotate.tool.shape': '形狀',
-  'fabric.linking.annotate.tool.text': '文字',
-  'fabric.linking.archive': '封存',
-  'fabric.linking.audio': '音訊',
   'fabric.linking.cancel': '取消',
-  'fabric.linking.cant_preview_file_type': '我們無法預覽此檔案類型。',
-  'fabric.linking.cant_retrieve_files': '唉呦！我們無法擷取任何檔案',
-  'fabric.linking.cant_retrieve_gifs': '唉呦！我們無法擷取任何 GIF',
-  'fabric.linking.change_view': '變更檢視畫面',
-  'fabric.linking.check_your_network': '請檢查您的網路連線',
+  'fabric.linking.cannot_connect': '無法連結，請再試一次',
+  'fabric.linking.cannot_find_link': '找不到連結',
   'fabric.linking.click_to_join': '加入 {context}',
   'fabric.linking.click_to_join_description': '您已獲得核准，因此可以立即加入 {context}。',
   'fabric.linking.close': '關閉',
-  'fabric.linking.close_and_reopen': '請試著關閉此檔案，然後再重新開啟。',
   'fabric.linking.connect_account_description': '我們會開啟新的頁面來協助您連結 {name} 帳戶',
   'fabric.linking.connect_link_account': '連線以預覽',
   'fabric.linking.connect_link_account_card_view': '連結',
   'fabric.linking.connect_link_account_card_view_description': '若要顯示此連結的預覽，請連接您的 {context} 帳戶。',
   'fabric.linking.connect_link_account_card_view_name': '連結 {context} 帳戶',
   'fabric.linking.connect_to': '連結至 {name}',
-  'fabric.linking.could_not_load_editor': '唉呦！我們無法載入編輯器',
-  'fabric.linking.could_not_save_image': '唉呦！我們無法儲存影像',
-  'fabric.linking.couldnt_generate_encrypted_entry_preview': '我們無法預覽加密或以密碼保護的檔案。',
-  'fabric.linking.couldnt_generate_preview': '我們無法為此檔案產生預覽。',
-  'fabric.linking.couldnt_load_file': '我們無法載入檔案。',
   'fabric.linking.couldnt_load_link': '基於不明原因，我們無法載入此連結。',
-  'fabric.linking.creating_preview': '正在建立預覽...',
-  'fabric.linking.default_avatars': '預設顯示圖片',
-  'fabric.linking.disable_fullscreen': '停用全螢幕',
-  'fabric.linking.display_thumbnail': '顯示縮圖',
-  'fabric.linking.document': '文件',
+  'fabric.linking.create_on_absolute': '於 {context} 建立',
+  'fabric.linking.create_on_relative': '建立時間：{context}',
+  'fabric.linking.created_by': '建立者：{context}',
+  'fabric.linking.delete': '刪除',
   'fabric.linking.download': '下載',
-  'fabric.linking.drag_and_drop_images_here': '將影像拖曳至此',
-  'fabric.linking.drag_and_drop_your_files': '將檔案拖曳至任何位置或',
-  'fabric.linking.drag_and_drop_your_files_and_folders': '將檔案和資料夾拖曳至任何位置或',
-  'fabric.linking.drop_your_files': '置放要上傳的檔案',
-  'fabric.linking.drop_your_files_here': '將檔案置放在此',
-  'fabric.linking.email': '電子郵件',
-  'fabric.linking.enable_fullscreen': '啟用全螢幕',
-  'fabric.linking.error_429': '錯誤 429',
-  'fabric.linking.error_generating_preview': '產生預覽時發生錯誤',
-  'fabric.linking.error_hint_critical': '如果問題持續發生，請聯絡支援人員。',
-  'fabric.linking.error_hint_retry': '請再試一次。',
-  'fabric.linking.error_loading_file': '載入檔案時發生錯誤',
-  'fabric.linking.failed_to_load': '無法載入',
-  'fabric.linking.failed_to_upload': '無法上傳',
+  'fabric.linking.edit': '編輯',
+  'fabric.linking.forbidden_access': '您的存取遭拒',
   'fabric.linking.forbidden_description': '您沒有此預覽的存取權。如果您需要存取權，請連絡網站管理員。',
-  'fabric.linking.give_feedback': '提供意見反應',
-  'fabric.linking.image': '影像',
-  'fabric.linking.image_format_invalid_error': '無法載入影像，格式無效。',
-  'fabric.linking.image_size_too_large_error': '影像太大，不得大於 {MAX_SIZE_MB}Mb',
-  'fabric.linking.image_url_invalid_error': '無法載入影像，URL 無效。',
-  'fabric.linking.insert_files': '{0, plural, other {插入 {0} 個檔案}}',
   'fabric.linking.invalid_permissions': '限制連結',
   'fabric.linking.invalid_permissions_description': '您需要請求存取或嘗試不同的帳戶，來檢視此預覽。',
-  'fabric.linking.item_not_found_in_list': '在清單上找不到所選的項目。',
-  'fabric.linking.learn_more': '深入了解',
-  'fabric.linking.load_more_gifs': '載入更多 GIF',
+  'fabric.linking.join_to_view': '加入 {context} 以查看此議題',
   'fabric.linking.loading': '正在載入...',
-  'fabric.linking.loading_file': '正在載入檔案...',
-  'fabric.linking.might_be_a_hiccup': '可能只是出了點小問題。',
-  'fabric.linking.no_gifs_found': '嗨！您找我嗎？',
-  'fabric.linking.no_gifs_found_suggestion': '我們找不到符合「{query}」的項目',
-  'fabric.linking.no_pdf_artifacts': '找不到符合此檔案的 PDF 成品。',
+  'fabric.linking.modified_on_absolute': '更新於 {context}',
+  'fabric.linking.modified_on_relative': '更新時間：{context}',
+  'fabric.linking.more_actions': '更多動作',
   'fabric.linking.not_found_description': '我們找不到此連結。請檢查 URL，然後試著編輯或再次貼上。',
   'fabric.linking.not_found_title': '糟糕，我們找不到此連結！',
-  'fabric.linking.or': '或',
-  'fabric.linking.pause': '暫停',
-  'fabric.linking.play': '播放',
-  'fabric.linking.playback_default_speed': '預設',
-  'fabric.linking.playback_speed': '播放速度',
+  'fabric.linking.pending_request': '您的存取要求擱置中',
   'fabric.linking.preview': '預覽',
-  'fabric.linking.preview_currently_unavailable': '目前無法預覽',
-  'fabric.linking.preview_unavailable': '無法建立預覽',
-  'fabric.linking.recent_uploads': '最近上傳的項目',
-  'fabric.linking.remove_image': '移除影像',
+  'fabric.linking.priority_blocker': '受阻',
+  'fabric.linking.priority_critical': '嚴重',
+  'fabric.linking.priority_high': '高',
+  'fabric.linking.priority_highest': '最高',
+  'fabric.linking.priority_low': '低',
+  'fabric.linking.priority_lowest': '最低',
+  'fabric.linking.priority_major': '主要',
+  'fabric.linking.priority_medium': '中',
+  'fabric.linking.priority_minor': '次要',
+  'fabric.linking.priority_trivial': '不太重要',
+  'fabric.linking.priority_undefined': '未定義',
   'fabric.linking.request_access': '要求存取權',
   'fabric.linking.request_access_description': '要求 {context} 的存取權以檢視此預覽。',
   'fabric.linking.request_access_pending': '存取擱置',
   'fabric.linking.request_access_pending_description': '您的存取要求擱置中。',
+  'fabric.linking.request_access_to_view': '要求存取 {context} 以檢視此議題',
+  'fabric.linking.request_denied': '您的存取要求遭拒',
   'fabric.linking.request_denied_description': '您的存取要求遭到拒絕。如果您仍需要存取權，請連絡網站管理員。',
+  'fabric.linking.restricted_link': '連結受到限制，請嘗試其他帳戶',
   'fabric.linking.retry': '重試',
   'fabric.linking.save': '儲存',
-  'fabric.linking.search': '搜尋',
-  'fabric.linking.search_all_gifs': '搜尋所有 GIF！',
-  'fabric.linking.share_files_instantly': '我們會立即分享',
-  'fabric.linking.skip_backward': '倒退 10 秒',
-  'fabric.linking.skip_forward': '快轉 10 秒',
-  'fabric.linking.something_went_wrong': '發生錯誤。',
   'fabric.linking.srclink': '使用以下檢視：',
   'fabric.linking.srclinkunknown': '檢視原始狀態',
-  'fabric.linking.text': '文字',
   'fabric.linking.try_again': '再試一次',
   'fabric.linking.try_another_account': '使用其他帳戶嘗試',
-  'fabric.linking.try_downloading_file': '嘗試下載檔案來進行檢視。',
-  'fabric.linking.unable_to_annotate_image': '您無法對此影像加上註解',
-  'fabric.linking.unknown': '未知',
   'fabric.linking.unlink_account': '取消帳戶的連結',
-  'fabric.linking.upload': '上傳',
-  'fabric.linking.upload_an_avatar': '上傳圖片',
-  'fabric.linking.upload_file': '上傳檔案',
-  'fabric.linking.upload_file_from': '從 {name} 上傳檔案',
-  'fabric.linking.upload_image': '上傳影像',
-  'fabric.linking.upload_photo': '上傳相片',
-  'fabric.linking.video': '影片',
-  'fabric.linking.view': '檢視',
-  'fabric.linking.viewer_rateLimited': '載入您的檔案時發生問題。',
-  'fabric.linking.webgl_warning_description': '您的瀏覽器不支援 WebGL。使用啟用 WebGL 的瀏覽器來為影像加上註解。',
-  'fabric.linking.zip_entry_load_failed': '我們無法載入該 zip 檔案項目來進行預覽',
-  'fabric.linking.zoom_in': '縮小',
-  'fabric.linking.zoom_out': '放大'
+  'fabric.linking.updated_by': '修改者：{context}',
+  'fabric.linking.view': '檢視'
 };
 exports.default = _default;

package/dist/cjs/state/analytics/useSmartLinkAnalytics.js

@@ -113,7 +113,7 @@ var useSmartLinkAnalytics = function useSmartLinkAnalytics(url, dispatchAnalytic
           extensionKey: extensionKey,
           invokeType: invokeType
         });
-        dispatchAnalytics((0, _analytics.uiActionClickedEvent)(actionType, extensionKey, display));
+        dispatchAnalytics((0, _analytics.uiActionClickedEvent)(id, actionType, extensionKey, display));
       },
 
       /**
@@ -128,7 +128,7 @@ var useSmartLinkAnalytics = function useSmartLinkAnalytics(url, dispatchAnalytic
         var definitionId = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : extractedDefinitionId;
         var extensionKey = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : extractedExtensionKey;
         var previewInvokeMethod = arguments.length > 3 ? arguments[3] : undefined;
-        dispatchAnalytics((0, _analytics.uiHoverCardOpenLinkClickedEvent)(previewDisplay, definitionId, extensionKey, previewInvokeMethod));
+        dispatchAnalytics((0, _analytics.uiHoverCardOpenLinkClickedEvent)(defaultId, previewDisplay, definitionId, extensionKey, previewInvokeMethod));
       },
 
       /**
@@ -175,11 +175,11 @@ var useSmartLinkAnalytics = function useSmartLinkAnalytics(url, dispatchAnalytic
        * @param previewInvokeMethod How the preview was triggered.
        * @returns
        */
-      hoverCardViewedEvent: function hoverCardViewedEvent(previewDisplay) {
-        var definitionId = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : extractedDefinitionId;
-        var extensionKey = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : extractedExtensionKey;
-        var previewInvokeMethod = arguments.length > 3 ? arguments[3] : undefined;
-        return dispatchAnalytics((0, _analytics.uiHoverCardViewedEvent)(previewDisplay, definitionId, extensionKey, previewInvokeMethod));
+      hoverCardViewedEvent: function hoverCardViewedEvent(previewDisplay, previewInvokeMethod) {
+        var id = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : defaultId;
+        var definitionId = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : extractedDefinitionId;
+        var extensionKey = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : extractedExtensionKey;
+        return dispatchAnalytics((0, _analytics.uiHoverCardViewedEvent)(id, previewDisplay, definitionId, extensionKey, previewInvokeMethod));
       },
 
       /**
@@ -191,11 +191,11 @@ var useSmartLinkAnalytics = function useSmartLinkAnalytics(url, dispatchAnalytic
        * @param previewInvokeMethod How the preview was triggered.
        * @returns
        */
-      hoverCardDismissedEvent: function hoverCardDismissedEvent(previewDisplay, hoverTime) {
-        var definitionId = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : extractedDefinitionId;
-        var extensionKey = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : extractedExtensionKey;
-        var previewInvokeMethod = arguments.length > 4 ? arguments[4] : undefined;
-        return dispatchAnalytics((0, _analytics.uiHoverCardDismissedEvent)(previewDisplay, hoverTime, definitionId, extensionKey, previewInvokeMethod));
+      hoverCardDismissedEvent: function hoverCardDismissedEvent(previewDisplay, hoverTime, previewInvokeMethod) {
+        var id = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : defaultId;
+        var definitionId = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : extractedDefinitionId;
+        var extensionKey = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : extractedExtensionKey;
+        return dispatchAnalytics((0, _analytics.uiHoverCardDismissedEvent)(id, previewDisplay, hoverTime, definitionId, extensionKey, previewInvokeMethod));
       }
     };
   }, [defaultId, defaultLocation, extractedDefinitionId, extractedExtensionKey, dispatchAnalytics]);

package/dist/cjs/state/hooks-external/useSmartLinkActions.js

@@ -51,7 +51,8 @@ function useSmartLinkActions(_ref) {
         return linkActions.invoke(opts, appearance);
       },
       handleAnalytics: analyticsHandler,
-      extensionKey: (0, _helpers.getExtensionKey)(linkState.details)
+      extensionKey: (0, _helpers.getExtensionKey)(linkState.details),
+      source: appearance
     }, undefined, platform);
 
     if (!cardProperties.actions || cardProperties.actions.length === 0) {

package/dist/cjs/utils/analytics/analytics.js

@@ -256,13 +256,14 @@ var uiCardClickedEvent = function uiCardClickedEvent(id, display, status, defini
 
 exports.uiCardClickedEvent = uiCardClickedEvent;
 
-var uiActionClickedEvent = function uiActionClickedEvent(actionType, extensionKey, display) {
+var uiActionClickedEvent = function uiActionClickedEvent(id, actionType, extensionKey, display) {
   return {
     action: 'clicked',
     actionSubject: 'button',
     actionSubjectId: uiActionSubjectIds[actionType],
     eventType: 'ui',
     attributes: _objectSpread(_objectSpread({}, context), {}, {
+      id: id,
       display: display,
       extensionKey: extensionKey || '',
       actionType: actionType
@@ -331,12 +332,13 @@ var uiRenderFailedEvent = function uiRenderFailedEvent(display, error, errorInfo
 
 exports.uiRenderFailedEvent = uiRenderFailedEvent;
 
-var uiHoverCardViewedEvent = function uiHoverCardViewedEvent(previewDisplay, definitionId, extensionKey, previewInvokeMethod) {
+var uiHoverCardViewedEvent = function uiHoverCardViewedEvent(id, previewDisplay, definitionId, extensionKey, previewInvokeMethod) {
   return {
     action: 'viewed',
     actionSubject: 'hoverCard',
     eventType: 'ui',
     attributes: _objectSpread(_objectSpread({}, context), {}, {
+      id: id,
       definitionId: definitionId || '',
       extensionKey: extensionKey || '',
       previewDisplay: previewDisplay,
@@ -347,12 +349,13 @@ var uiHoverCardViewedEvent = function uiHoverCardViewedEvent(previewDisplay, def
 
 exports.uiHoverCardViewedEvent = uiHoverCardViewedEvent;
 
-var uiHoverCardDismissedEvent = function uiHoverCardDismissedEvent(previewDisplay, hoverTime, definitionId, extensionKey, previewInvokeMethod) {
+var uiHoverCardDismissedEvent = function uiHoverCardDismissedEvent(id, previewDisplay, hoverTime, definitionId, extensionKey, previewInvokeMethod) {
   return {
     action: 'dismissed',
     actionSubject: 'hoverCard',
     eventType: 'ui',
     attributes: _objectSpread(_objectSpread({}, context), {}, {
+      id: id,
       definitionId: definitionId || '',
       extensionKey: extensionKey || '',
       hoverTime: hoverTime,
@@ -364,13 +367,14 @@ var uiHoverCardDismissedEvent = function uiHoverCardDismissedEvent(previewDispla
 
 exports.uiHoverCardDismissedEvent = uiHoverCardDismissedEvent;
 
-var uiHoverCardOpenLinkClickedEvent = function uiHoverCardOpenLinkClickedEvent(previewDisplay, definitionId, extensionKey, previewInvokeMethod) {
+var uiHoverCardOpenLinkClickedEvent = function uiHoverCardOpenLinkClickedEvent(id, previewDisplay, definitionId, extensionKey, previewInvokeMethod) {
   return {
     action: 'clicked',
     actionSubject: 'button',
     actionSubjectId: 'shortcutGoToLink',
     eventType: 'ui',
     attributes: _objectSpread(_objectSpread({}, context), {}, {
+      id: id,
       definitionId: definitionId || '',
       extensionKey: extensionKey || '',
       previewDisplay: previewDisplay,

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/smart-card",
-	"version": "19.1.16",
+	"version": "19.1.17",
 	"sideEffects": false
 }

package/dist/cjs/view/HoverCard/components/hover-card-content.js

@@ -0,0 +1,125 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _extractMetadata2 = require("../../../extractors/hover/extractMetadata");
+
+var _utils = require("../utils");
+
+var _extractPreview = _interopRequireDefault(require("../../../extractors/flexible/extract-preview"));
+
+var _constants = require("../../../constants");
+
+var _FlexibleCard = _interopRequireDefault(require("../../FlexibleCard"));
+
+var _blocks = require("../../FlexibleCard/components/blocks");
+
+var _utils2 = require("../../../utils");
+
+var _shortcut = _interopRequireDefault(require("@atlaskit/icon/glyph/shortcut"));
+
+var _helpers = require("../../../state/helpers");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var flexibleUiOptions = {
+  hideElevation: true,
+  size: _constants.SmartLinkSize.Large,
+  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+  theme: _constants.SmartLinkTheme.Black
+};
+
+var getOpenAction = function getOpenAction(url, analytics) {
+  return {
+    name: _constants.ActionName.CustomAction,
+    icon: /*#__PURE__*/_react.default.createElement(_shortcut.default, {
+      label: "open in new tab",
+      size: "medium"
+    }),
+    iconPosition: 'before',
+    onClick: function onClick() {
+      window.open(url, '_blank');
+      analytics.ui.hoverCardOpenLinkClickedEvent('card');
+    },
+    testId: 'hover-card-open-button'
+  };
+};
+
+var toFooterActions = function toFooterActions(cardActions) {
+  return cardActions.map(function (action) {
+    return {
+      content: action.text,
+      name: _constants.ActionName.CustomAction,
+      onClick: function onClick() {
+        return action.invoke();
+      },
+      testId: action.id
+    };
+  });
+};
+
+var HoverCardContent = function HoverCardContent(_ref) {
+  var _cardState$details;
+
+  var analytics = _ref.analytics,
+      _ref$cardActions = _ref.cardActions,
+      cardActions = _ref$cardActions === void 0 ? [] : _ref$cardActions,
+      cardState = _ref.cardState,
+      onResolve = _ref.onResolve,
+      renderers = _ref.renderers,
+      url = _ref.url;
+  (0, _react.useEffect)(function () {
+    // Since hover preview only render on resolved status,
+    // there is no need to check for statuses.
+    analytics.ui.renderSuccessEvent(_utils.HOVER_CARD_ANALYTICS_DISPLAY, cardState.status);
+  }, [analytics.ui, cardState.status]);
+  var extensionKey = (0, _react.useMemo)(function () {
+    return (0, _helpers.getExtensionKey)(cardState.details);
+  }, [cardState.details]);
+  var onClick = (0, _react.useCallback)(function (event) {
+    var isModifierKeyPressed = (0, _utils2.isSpecialEvent)(event);
+    analytics.ui.cardClickedEvent(undefined, _utils.HOVER_CARD_ANALYTICS_DISPLAY, cardState.status, undefined, undefined, isModifierKeyPressed);
+  }, [cardState.status, analytics.ui]);
+  var titleActions = (0, _react.useMemo)(function () {
+    return [getOpenAction(url, analytics)];
+  }, [url, analytics]);
+  var footerActions = (0, _react.useMemo)(function () {
+    return toFooterActions(cardActions);
+  }, [cardActions]); //TODO: EDM-3224 deleted simulated and use real JsonLd
+
+  var _extractMetadata = (0, _extractMetadata2.extractMetadata)((0, _utils.getSimulatedMetadata)(extensionKey)),
+      primary = _extractMetadata.primary,
+      secondary = _extractMetadata.secondary;
+
+  var data = (_cardState$details = cardState.details) === null || _cardState$details === void 0 ? void 0 : _cardState$details.data;
+  var body = data && (0, _extractPreview.default)(data) ? /*#__PURE__*/_react.default.createElement(_blocks.PreviewBlock, null) : /*#__PURE__*/_react.default.createElement(_blocks.SnippetBlock, null);
+  return /*#__PURE__*/_react.default.createElement(_FlexibleCard.default, {
+    cardState: cardState,
+    onClick: onClick,
+    onResolve: onResolve,
+    renderers: renderers,
+    ui: flexibleUiOptions,
+    url: url
+  }, /*#__PURE__*/_react.default.createElement(_blocks.TitleBlock, {
+    actions: titleActions
+  }), /*#__PURE__*/_react.default.createElement(_blocks.MetadataBlock, {
+    primary: primary,
+    secondary: secondary
+  }), body, /*#__PURE__*/_react.default.createElement(_blocks.FooterBlock, {
+    actions: footerActions
+  }));
+};
+
+var _default = HoverCardContent;
+exports.default = _default;

package/dist/cjs/view/HoverCard/index.js

@@ -17,20 +17,12 @@ var _core = require("@emotion/core");
 
 var _react = _interopRequireWildcard(require("react"));
 
-var _blocks = require("../FlexibleCard/components/blocks");
-
-var _Card = require("../Card");
-
 var _popup = _interopRequireDefault(require("@atlaskit/popup"));
 
-var _constants = require("../../constants");
-
 var _useSmartLinkActions = require("../../state/hooks-external/useSmartLinkActions");
 
 var _styled = require("./styled");
 
-var _shortcut = _interopRequireDefault(require("@atlaskit/icon/glyph/shortcut"));
-
 var _analyticsNext = require("@atlaskit/analytics-next");
 
 var _analytics = require("../../utils/analytics");
@@ -39,14 +31,12 @@ var _store = require("../../state/store");
 
 var _analytics2 = require("../../state/analytics");
 
-var _helpers = require("../../state/helpers");
+var _renderers = require("../../state/renderers");
 
-var _extractMetadata = require("../../extractors/hover/extractMetadata");
+var _hoverCardContent = _interopRequireDefault(require("./components/hover-card-content"));
 
 var _utils = require("./utils");
 
-var _extractPreview = _interopRequireDefault(require("../../extractors/flexible/extract-preview"));
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -70,14 +60,9 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
   var fadeOutTimeoutId = (0, _react.useRef)();
   var fadeInTimeoutId = (0, _react.useRef)();
   var cardOpenTime = (0, _react.useRef)();
+  var renderers = (0, _renderers.useSmartLinkRenderers)();
   var linkState = (0, _store.useSmartCardState)(url);
   var analytics = (0, _analytics2.useSmartLinkAnalytics)(url, analyticsHandler, id);
-  var extensionKey = (0, _react.useMemo)(function () {
-    return (0, _helpers.getExtensionKey)(linkState.details);
-  }, [linkState]);
-  var definitionId = (0, _react.useMemo)(function () {
-    return (0, _helpers.getDefinitionId)(linkState.details);
-  }, [linkState]);
   var initHideCard = (0, _react.useCallback)(function () {
     if (fadeInTimeoutId.current) {
       clearTimeout(fadeInTimeoutId.current);
@@ -87,12 +72,12 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
       //Check its previously open to avoid firing events when moving between the child and hover card components
       if (isOpen === true && cardOpenTime.current) {
         var hoverTime = Date.now() - cardOpenTime.current;
-        analytics.ui.hoverCardDismissedEvent('card', hoverTime, definitionId, extensionKey, 'mouse_hover');
+        analytics.ui.hoverCardDismissedEvent('card', hoverTime, 'mouse_hover');
       }
 
       setIsOpen(false);
     }, delay);
-  }, [delay, isOpen, definitionId, extensionKey, analytics]);
+  }, [delay, isOpen, analytics.ui]);
   var initShowCard = (0, _react.useCallback)(function () {
     if (fadeOutTimeoutId.current) {
       clearTimeout(fadeOutTimeoutId.current);
@@ -102,78 +87,17 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
       //Check if its previously closed to avoid firing events when moving between the child and hover card components
       if (isOpen === false) {
         cardOpenTime.current = Date.now();
-        analytics.ui.hoverCardViewedEvent('card', definitionId, extensionKey, 'mouse_hover');
+        analytics.ui.hoverCardViewedEvent('card', 'mouse_hover');
       }
 
       setIsOpen(true);
     }, delay);
-  }, [delay, isOpen, definitionId, extensionKey, analytics]);
+  }, [delay, isOpen, analytics.ui]);
   var linkActions = (0, _useSmartLinkActions.useSmartLinkActions)({
     url: url,
-    appearance: 'block',
+    appearance: _utils.HOVER_CARD_ANALYTICS_DISPLAY,
     analyticsHandler: analyticsHandler
   });
-  var smartlinkActions = (0, _react.useMemo)(function () {
-    return linkActions.map(function (action) {
-      return {
-        content: action.text,
-        name: _constants.ActionName.CustomAction,
-        onClick: function onClick() {
-          return action.invoke();
-        },
-        testId: action.id
-      };
-    });
-  }, [linkActions]);
-  var openAction = (0, _react.useMemo)(function () {
-    return {
-      name: _constants.ActionName.CustomAction,
-      icon: (0, _core.jsx)(_shortcut.default, {
-        label: "open in new tab",
-        size: "medium"
-      }),
-      iconPosition: 'before',
-      onClick: function onClick() {
-        window.open(url, '_blank');
-        analytics.ui.hoverCardOpenLinkClickedEvent('card', definitionId, extensionKey);
-      },
-      testId: 'hover-card-open-button'
-    };
-  }, [url, definitionId, extensionKey, analytics]);
-
-  var CardComponent = function CardComponent(_ref2) {
-    var _linkState$details;
-
-    var update = _ref2.update;
-    //TODO: EDM-3224 deleted simulated and use real JsonLd
-    var metadataElements = (0, _extractMetadata.extractMetadata)((0, _utils.getSimulatedMetadata)(extensionKey));
-    var linkData = (_linkState$details = linkState.details) === null || _linkState$details === void 0 ? void 0 : _linkState$details.data;
-    var content = (0, _extractPreview.default)(linkData) ? (0, _core.jsx)(_blocks.PreviewBlock, null) : (0, _core.jsx)(_blocks.SnippetBlock, null);
-    return (0, _core.jsx)("div", {
-      onMouseEnter: initShowCard,
-      onMouseLeave: initHideCard,
-      css: _styled.HoverCardContainer
-    }, (0, _core.jsx)(_Card.Card, {
-      id: id,
-      appearance: "block",
-      url: url,
-      ui: {
-        hideElevation: true,
-        size: _constants.SmartLinkSize.Large,
-        // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-        theme: _constants.SmartLinkTheme.Black
-      },
-      onResolve: update
-    }, (0, _core.jsx)(_blocks.TitleBlock, {
-      actions: [openAction]
-    }), (0, _core.jsx)(_blocks.MetadataBlock, {
-      primary: metadataElements.primary,
-      secondary: metadataElements.secondary
-    }), content, (0, _core.jsx)(_blocks.FooterBlock, {
-      actions: smartlinkActions
-    })));
-  };
-
   var onClose = (0, _react.useCallback)(function () {
     return setIsOpen(false);
   }, []);
@@ -182,11 +106,20 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
     isOpen: isOpen,
     onClose: onClose,
     placement: "bottom-start",
-    content: function content(_ref3) {
-      var update = _ref3.update;
-      return (0, _core.jsx)(CardComponent, {
-        update: update
-      });
+    content: function content(_ref2) {
+      var update = _ref2.update;
+      return (0, _core.jsx)("div", {
+        onMouseEnter: initShowCard,
+        onMouseLeave: initHideCard,
+        css: _styled.HoverCardContainer
+      }, (0, _core.jsx)(_hoverCardContent.default, {
+        analytics: analytics,
+        cardActions: linkActions,
+        cardState: linkState,
+        onResolve: update,
+        renderers: renderers,
+        url: url
+      }));
     },
     trigger: function trigger(triggerProps) {
       return (0, _core.jsx)("span", (0, _extends2.default)({}, triggerProps, {

package/dist/cjs/view/HoverCard/utils.js

@@ -3,7 +3,9 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getSimulatedMetadata = void 0;
+exports.getSimulatedMetadata = exports.HOVER_CARD_ANALYTICS_DISPLAY = void 0;
+var HOVER_CARD_ANALYTICS_DISPLAY = 'flexible';
+exports.HOVER_CARD_ANALYTICS_DISPLAY = HOVER_CARD_ANALYTICS_DISPLAY;
 
 var getSimulatedMetadata = function getSimulatedMetadata() {
   var extensionKey = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';

package/dist/es2019/extractors/block/index.js

@@ -36,10 +36,11 @@ export const extractBlockActions = (props, jsonLd, opts, platform) => {
       handleInvoke,
       handleAnalytics,
       extensionKey,
+      source,
       testId
     } = opts;
     const actions = extractActions(jsonLd, handleInvoke);
-    const previewAction = extractPreviewAction(extensionKey, props, jsonLd, handleInvoke, handleAnalytics, testId, platform); // The previewAction should always be the last action
+    const previewAction = extractPreviewAction(extensionKey, props, jsonLd, handleInvoke, handleAnalytics, testId, platform, source); // The previewAction should always be the last action
 
     if (previewAction) {
       actions.push(previewAction);