@atlaskit/smart-card 26.2.0 → 26.2.2

package/dist/cjs/messages.js

@@ -221,6 +221,12 @@ var messages = (0, _reactIntlNext.defineMessages)({
     defaultMessage: 'Owned by {context}',
     description: 'Indicates the person or entity that owns or maintains the resource.'
   },
+  // Move this to preview once FF has been merged
+  preview_improved: {
+    id: 'fabric.linking.preview_improved',
+    defaultMessage: 'Open preview',
+    description: 'Click to view a richer view of your content, without needing to navigate to it.'
+  },
   preview: {
     id: 'fabric.linking.preview',
     defaultMessage: 'Full screen view',

package/dist/cjs/state/actions/index.js

@@ -25,13 +25,20 @@ var useSmartCardActions = function useSmartCardActions(id, url, analytics) {
     connections = _useSmartLinkContext.connections;
   var getState = store.getState,
     dispatch = store.dispatch;
-  var _ref = getState()[url] || {
-      status: _constants.SmartLinkStatus.Pending,
-      details: undefined
-    },
-    details = _ref.details,
-    status = _ref.status,
-    metadataStatus = _ref.metadataStatus;
+  var getSmartLinkState = (0, _react.useCallback)(function () {
+    var _getState$url;
+    var _ref = (_getState$url = getState()[url]) !== null && _getState$url !== void 0 ? _getState$url : {
+        status: _constants.SmartLinkStatus.Pending
+      },
+      details = _ref.details,
+      status = _ref.status,
+      metadataStatus = _ref.metadataStatus;
+    return {
+      details: details,
+      status: status,
+      metadataStatus: metadataStatus
+    };
+  }, [getState, url]);
   var setMetadataStatus = (0, _react.useCallback)(function (metadataStatus) {
     dispatch((0, _linkingCommon.cardAction)(_linkingCommon.ACTION_UPDATE_METADATA_STATUS, {
       url: url
@@ -56,6 +63,8 @@ var useSmartCardActions = function useSmartCardActions(id, url, analytics) {
     }, _callee);
   })), [id, resolveUrl, url]);
   var register = (0, _react.useCallback)(function () {
+    var _getSmartLinkState = getSmartLinkState(),
+      details = _getSmartLinkState.details;
     if (!details) {
       dispatch((0, _linkingCommon.cardAction)(_linkingCommon.ACTION_RESOLVING, {
         url: url
@@ -63,8 +72,10 @@ var useSmartCardActions = function useSmartCardActions(id, url, analytics) {
       setMetadataStatus('pending');
     }
     return resolve();
-  }, [details, resolve, dispatch, url, setMetadataStatus]);
+  }, [getSmartLinkState, resolve, dispatch, url, setMetadataStatus]);
   var reload = (0, _react.useCallback)(function () {
+    var _getSmartLinkState2 = getSmartLinkState(),
+      details = _getSmartLinkState2.details;
     var definitionId = (0, _helpers.getDefinitionId)(details);
     if (definitionId) {
       (0, _helpers.getByDefinitionId)(definitionId, getState()).map(function (url) {
@@ -73,15 +84,20 @@ var useSmartCardActions = function useSmartCardActions(id, url, analytics) {
     } else {
       resolve(url, true);
     }
-  }, [details, url, getState, resolve]);
+  }, [getSmartLinkState, url, getState, resolve]);
   var loadMetadata = (0, _react.useCallback)(function () {
+    var _getSmartLinkState3 = getSmartLinkState(),
+      metadataStatus = _getSmartLinkState3.metadataStatus;
     //metadataStatus will be undefined for SSR links only
     if (metadataStatus === undefined) {
       setMetadataStatus('pending');
       return resolve(url, false, true);
     }
-  }, [metadataStatus, resolve, setMetadataStatus, url]);
+  }, [getSmartLinkState, resolve, setMetadataStatus, url]);
   var authorize = (0, _react.useCallback)(function (appearance) {
+    var _getSmartLinkState4 = getSmartLinkState(),
+      details = _getSmartLinkState4.details,
+      status = _getSmartLinkState4.status;
     var definitionId = (0, _helpers.getDefinitionId)(details);
     var extensionKey = (0, _helpers.getExtensionKey)(details);
     var services = (0, _helpers.getServices)(details);
@@ -133,7 +149,7 @@ var useSmartCardActions = function useSmartCardActions(id, url, analytics) {
         reload();
       });
     }
-  }, [analytics.ui, analytics.screen, analytics.track, analytics.operational, id, reload, details, status]);
+  }, [getSmartLinkState, analytics.ui, analytics.screen, analytics.track, analytics.operational, id, reload]);
   var invoke = (0, _react.useCallback)( /*#__PURE__*/function () {
     var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(opts, appearance) {
       var key, action, source, markName, response;

package/dist/cjs/state/hooks/use-resolve/index.js

@@ -8,9 +8,11 @@ exports.default = void 0;
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 var _react = require("react");
+var _reactDom = require("react-dom");
 var _analytics = require("../../analytics");
 var _helpers = require("../../helpers");
 var _linkingCommon = require("@atlaskit/linking-common");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _constants = require("../../actions/constants");
 var _jsonld = require("../../../utils/jsonld");
 var _constants2 = require("../../../constants");
@@ -80,6 +82,20 @@ var useResolve = function useResolve() {
       }
     }
   }, [getState, setMetadataStatus, dispatch]);
+  var handleResolvedLinkSuccess = (0, _react.useCallback)(function (resourceUrl, response, isReloading, isMetadataRequest) {
+    //if a link resolves normally, metadata will also always be resolved
+    setMetadataStatus(resourceUrl, 'resolved');
+    // Dispatch Analytics and resolved card action - including unauthorized states.
+    if (isReloading) {
+      dispatch((0, _linkingCommon.cardAction)(_linkingCommon.ACTION_RELOADING, {
+        url: resourceUrl
+      }, response));
+    } else {
+      dispatch((0, _linkingCommon.cardAction)(_linkingCommon.ACTION_RESOLVED, {
+        url: resourceUrl
+      }, response, undefined, undefined, isMetadataRequest));
+    }
+  }, [setMetadataStatus, dispatch]);
   var handleResolvedLinkResponse = (0, _react.useCallback)(function (resourceUrl, response) {
     var isReloading = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
     var isMetadataRequest = arguments.length > 3 ? arguments[3] : undefined;
@@ -104,20 +120,20 @@ var useResolve = function useResolve() {
       handleResolvedLinkError(resourceUrl, new _linkingCommon.APIError('error', hostname, _constants.ERROR_MESSAGE_METADATA), response, isMetadataRequest);
       return;
     }
-
-    //if a link resolves normally, metadata will also always be resolved
-    setMetadataStatus(resourceUrl, 'resolved');
-    // Dispatch Analytics and resolved card action - including unauthorized states.
-    if (isReloading) {
-      dispatch((0, _linkingCommon.cardAction)(_linkingCommon.ACTION_RELOADING, {
-        url: resourceUrl
-      }, response));
+    if ((0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.enable-analytics-context')) {
+      /**
+       * Using unstable_batchedUpdates because this store update happens async and trigers a rerender
+       * more info:
+       * https://github.com/facebook/react/blob/v18.2.0/packages/use-sync-external-store/src/useSyncExternalStoreShimClient.js#L113
+       * https://react-redux.js.org/api/batch
+       */
+      (0, _reactDom.unstable_batchedUpdates)(function () {
+        handleResolvedLinkSuccess(resourceUrl, response, isReloading, isMetadataRequest);
+      });
     } else {
-      dispatch((0, _linkingCommon.cardAction)(_linkingCommon.ACTION_RESOLVED, {
-        url: resourceUrl
-      }, response, undefined, undefined, isMetadataRequest));
+      handleResolvedLinkSuccess(resourceUrl, response, isReloading, isMetadataRequest);
     }
-  }, [dispatch, handleResolvedLinkError, hasAuthFlowSupported, setMetadataStatus]);
+  }, [handleResolvedLinkError, handleResolvedLinkSuccess, hasAuthFlowSupported]);
   return (0, _react.useCallback)( /*#__PURE__*/function () {
     var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(url) {
       var isReloading,

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

@@ -0,0 +1,47 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SmartLinkAnalyticsContext = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireWildcard(require("react"));
+var _analyticsNext = require("@atlaskit/analytics-next");
+var _resolvedAttributes = require("@atlaskit/link-analytics/resolved-attributes");
+var _flexible = require("../flexible");
+var _constants = require("../../constants");
+var _store = require("../../state/store");
+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; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var SmartLinkAnalyticsContext = function SmartLinkAnalyticsContext(_ref) {
+  var children = _ref.children,
+    url = _ref.url,
+    appearance = _ref.appearance,
+    id = _ref.id;
+  var _useSmartLinkState = (0, _store.useSmartCardState)(url),
+    details = _useSmartLinkState.details,
+    status = _useSmartLinkState.status;
+  var resolvedAttributes = (0, _resolvedAttributes.getResolvedAttributes)({
+    url: url
+  }, details, status);
+  var _getUrlAttributes = (0, _resolvedAttributes.getUrlAttributes)(url),
+    urlHash = _getUrlAttributes.urlHash;
+  var isFlexibleUi = (0, _react.useMemo)(function () {
+    return (0, _flexible.isFlexibleUiCard)(children);
+  }, [children]);
+  var display = isFlexibleUi ? _constants.CardDisplay.Flexible : appearance;
+  return /*#__PURE__*/_react.default.createElement(_analyticsNext.AnalyticsContext, {
+    data: {
+      attributes: _objectSpread(_objectSpread({}, resolvedAttributes), {}, {
+        urlHash: urlHash,
+        display: display,
+        id: id
+      })
+    }
+  }, children);
+};
+exports.SmartLinkAnalyticsContext = SmartLinkAnalyticsContext;

package/dist/cjs/version.json

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

package/dist/cjs/view/BlockCard/actions/PreviewAction.js

@@ -17,7 +17,7 @@ var _reactDom = _interopRequireDefault(require("react-dom"));
 var _reactIntlNext = require("react-intl-next");
 var _messages = require("../../../messages");
 var _excluded = ["popupMountPointId", "onClose"],
-  _excluded2 = ["details"];
+  _excluded2 = ["details", "enableImprovedPreviewAction"];
 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; }
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -82,10 +82,12 @@ function _previewFunction() {
 }
 var _default = function _default(_ref2) {
   var details = _ref2.details,
+    enableImprovedPreviewAction = _ref2.enableImprovedPreviewAction,
     rest = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
+  var previewText = enableImprovedPreviewAction ? _messages.messages.preview_improved : _messages.messages.preview;
   return {
     id: 'preview-content',
-    text: /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.messages.preview),
+    text: /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, previewText),
     promise: function promise(props) {
       return previewFunction(_objectSpread(_objectSpread({
         popupMountPointId: 'twp-editor-preview-iframe',

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

@@ -82,6 +82,7 @@ var _FlexibleForbiddenView = _interopRequireDefault(require("./views/flexible/Fl
 var _token = require("../../utils/token");
 var _react = require("@emotion/react");
 var _handlers = require("./utils/handlers");
+var _linkProvider = require("@atlaskit/link-provider");
 var _PreviewAction = _interopRequireDefault(require("./actions/PreviewAction"));
 var _templateObject;
 /** @jsx jsx */
@@ -117,6 +118,7 @@ var BlockCard = function BlockCard(_ref) {
     handleInvoke: handleInvoke,
     extensionKey: extensionKey
   };
+  var enableImprovedPreviewAction = Boolean((0, _linkProvider.useFeatureFlag)('enableImprovedPreviewAction'));
   if (enableFlexibleBlockCard) {
     var ui = {
       hideElevation: true
@@ -199,7 +201,7 @@ var BlockCard = function BlockCard(_ref) {
         isSelected: isSelected
       });
     case 'resolved':
-      var resolvedViewProps = (0, _block.extractBlockProps)(data, meta, extractorOpts, renderers, platform);
+      var resolvedViewProps = (0, _block.extractBlockProps)(data, meta, extractorOpts, renderers, platform, enableImprovedPreviewAction);
       if (onResolve) {
         onResolve({
           title: resolvedViewProps.title,

package/dist/cjs/view/CardWithUrl/component.js

@@ -5,10 +5,11 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.CardWithUrlContent = CardWithUrlContent;
+exports.CardWithUrlContent = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _analyticsNext = require("@atlaskit/analytics-next");
 var _linkProvider = require("@atlaskit/link-provider");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _utils = require("../../utils");
 var measure = _interopRequireWildcard(require("../../utils/performance"));
 var _helpers = require("../../state/helpers");
@@ -20,9 +21,10 @@ var _flexible = require("../../utils/flexible");
 var _FlexibleCard = _interopRequireDefault(require("../FlexibleCard"));
 var _constants = require("../../constants");
 var _click = require("../../utils/analytics/click");
+var _SmartLinkAnalyticsContext = require("../../utils/analytics/SmartLinkAnalyticsContext");
 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; }
-function CardWithUrlContent(_ref) {
+function Component(_ref) {
   var id = _ref.id,
     url = _ref.url,
     isSelected = _ref.isSelected,
@@ -268,4 +270,12 @@ function CardWithUrlContent(_ref) {
         onIframeFocus: onIframeFocus
       });
   }
-}
+}
+var CardWithUrlContent = function CardWithUrlContent(props) {
+  return (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.enable-analytics-context') ? /*#__PURE__*/_react.default.createElement(_SmartLinkAnalyticsContext.SmartLinkAnalyticsContext, {
+    url: props.url,
+    appearance: props.appearance,
+    id: props.id
+  }, /*#__PURE__*/_react.default.createElement(Component, props)) : /*#__PURE__*/_react.default.createElement(Component, props);
+};
+exports.CardWithUrlContent = CardWithUrlContent;

package/dist/cjs/view/FlexibleCard/components/actions/action/preview-action/index.js

@@ -12,6 +12,9 @@ var _index = _interopRequireDefault(require("../index"));
 var _flexibleUiContext = require("../../../../../../state/flexible-ui-context");
 var _state = require("../../../../../../state");
 var _utils = require("../../../../../EmbedModal/utils");
+var _reactIntlNext = require("react-intl-next");
+var _messages = require("../../../../../../messages");
+var _linkProvider = require("@atlaskit/link-provider");
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var PreviewAction = function PreviewAction(props) {
@@ -28,6 +31,8 @@ var PreviewAction = function PreviewAction(props) {
     isSupportTheming = props.isSupportTheming;
   var defaultAnalytics = (0, _state.useSmartLinkAnalytics)(url, function () {});
   var analytics = (0, _flexibleUiContext.useFlexibleUiAnalyticsContext)() || defaultAnalytics;
+  var enableImprovedPreviewAction = Boolean((0, _linkProvider.useFeatureFlag)('enableImprovedPreviewAction'));
+  var previewText = enableImprovedPreviewAction ? _messages.messages.preview_improved : _messages.messages.preview;
   if (src && url) {
     var embedModal = function embedModal() {
       return (0, _utils.openPreviewModal)({
@@ -46,7 +51,8 @@ var PreviewAction = function PreviewAction(props) {
         if (_onClick) {
           _onClick();
         }
-      }
+      },
+      content: /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, previewText)
     });
     return /*#__PURE__*/_react.default.createElement(_index.default, (0, _extends2.default)({}, action, {
       appearance: appearance,

package/dist/cjs/view/FlexibleCard/components/actions/utils.js

@@ -57,7 +57,7 @@ var actionMappings = (_actionMappings = {}, (0, _defineProperty2.default)(_actio
     testId: 'smart-action-preview-action',
     content: /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.messages.preview),
     icon: /*#__PURE__*/_react.default.createElement(_vidFullScreenOn.default, {
-      label: "Full screen view"
+      label: "Open preview"
     }),
     tooltipMessage: /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.messages.preview)
   }

package/dist/cjs/view/HoverCard/components/HoverCardComponent.js

@@ -8,6 +8,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.HoverCardComponent = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _popup = _interopRequireDefault(require("@atlaskit/popup"));
 var _react = require("@emotion/react");
 var _react2 = _interopRequireWildcard(require("react"));
@@ -17,6 +18,7 @@ var _store = require("../../../state/store");
 var _HoverCardContent = _interopRequireDefault(require("../components/HoverCardContent"));
 var _styled = require("../styled");
 var _constants = require("../../../constants");
+var _SmartLinkAnalyticsContext = require("../../../utils/analytics/SmartLinkAnalyticsContext");
 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; }
 /** @jsx jsx */
@@ -24,6 +26,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 var HoverCardComponent = function HoverCardComponent(_ref) {
   var children = _ref.children,
     url = _ref.url,
+    id = _ref.id,
     analyticsHandler = _ref.analyticsHandler,
     analytics = _ref.analytics,
     _ref$canOpen = _ref.canOpen,
@@ -133,7 +136,23 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
   }, [closeOnChildClick, hideCard]);
   var content = (0, _react2.useCallback)(function (_ref2) {
     var update = _ref2.update;
-    return (0, _react.jsx)(_HoverCardContent.default, {
+    return (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.enable-analytics-context') ? (0, _react.jsx)(_SmartLinkAnalyticsContext.SmartLinkAnalyticsContext, {
+      url: url,
+      appearance: _constants.CardDisplay.HoverCardPreview,
+      id: id
+    }, (0, _react.jsx)(_HoverCardContent.default, {
+      onMouseEnter: initShowCard,
+      onMouseLeave: initHideCard,
+      analytics: analytics,
+      cardActions: filteredActions,
+      cardState: linkState,
+      onActionClick: onActionClick,
+      onResolve: update,
+      renderers: renderers,
+      showServerActions: showServerActions,
+      url: url,
+      id: id
+    })) : (0, _react.jsx)(_HoverCardContent.default, {
       onMouseEnter: initShowCard,
       onMouseLeave: initHideCard,
       analytics: analytics,
@@ -145,7 +164,7 @@ var HoverCardComponent = function HoverCardComponent(_ref) {
       showServerActions: showServerActions,
       url: url
     });
-  }, [analytics, initHideCard, initShowCard, filteredActions, linkState, onActionClick, renderers, showServerActions, url]);
+  }, [analytics, initHideCard, initShowCard, filteredActions, linkState, onActionClick, renderers, showServerActions, url, id]);
   var trigger = (0, _react2.useCallback)(function (triggerProps) {
     return (0, _react.jsx)("span", {
       ref: parentSpan

package/dist/cjs/view/HoverCard/components/views/resolved/index.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.toFooterActions = exports.default = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireWildcard(require("react"));
 var _linkProvider = require("@atlaskit/link-provider");
 var _extractors = require("@atlaskit/linking-common/extractors");
@@ -16,10 +17,31 @@ var _FlexibleCard = _interopRequireDefault(require("../../../../FlexibleCard"));
 var _utils = require("../../../utils");
 var _SnippetOrPreview = _interopRequireDefault(require("../../SnippetOrPreview"));
 var _extractMetadata = require("../../../../../extractors/hover/extractMetadata");
+var _messages = require("../../../../../messages");
+var _reactIntlNext = require("react-intl-next");
 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 toFooterActions = function toFooterActions(cardActions, onActionClick) {
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var toFooterActions = function toFooterActions(cardActions, onActionClick, enableImprovedPreviewAction) {
+  var appearance = enableImprovedPreviewAction ? {
+    appearance: 'primary'
+  } : undefined;
+  var previewText = enableImprovedPreviewAction ? _messages.messages.preview_improved : _messages.messages.preview;
   return cardActions.map(function (action) {
+    if (action.id === 'preview-content') {
+      return _objectSpread({
+        content: /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, previewText),
+        name: _constants.ActionName.CustomAction,
+        onClick: function onClick() {
+          if (onActionClick) {
+            onActionClick(action.id);
+          }
+          return action.invoke();
+        },
+        testId: action.id
+      }, appearance);
+    }
     return {
       content: action.text,
       name: _constants.ActionName.CustomAction,
@@ -48,6 +70,7 @@ var HoverCardResolvedView = function HoverCardResolvedView(_ref) {
     onActionClick = _ref.onActionClick,
     extensionKey = _ref.extensionKey;
   var showActionableElement = (0, _linkProvider.useFeatureFlag)('enableActionableElement');
+  var enableImprovedPreviewAction = (0, _linkProvider.useFeatureFlag)('enableImprovedPreviewAction');
   (0, _react.useEffect)(function () {
     // Since this hover view is only rendered on resolved status,
     // there is no need to check for statuses.
@@ -57,8 +80,8 @@ var HoverCardResolvedView = function HoverCardResolvedView(_ref) {
     });
   }, [analytics.ui, cardState.status]);
   var footerActions = (0, _react.useMemo)(function () {
-    return toFooterActions(cardActions, onActionClick);
-  }, [cardActions, onActionClick]);
+    return toFooterActions(cardActions, onActionClick, Boolean(enableImprovedPreviewAction));
+  }, [cardActions, onActionClick, enableImprovedPreviewAction]);
   var data = (_cardState$details = cardState.details) === null || _cardState$details === void 0 ? void 0 : _cardState$details.data;
   var _useMemo = (0, _react.useMemo)(function () {
       var types = data ? (0, _extractors.extractType)(data) : undefined;

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

@@ -21,7 +21,7 @@ const extractBlockIcon = jsonLd => {
   }
 };
 const extractBlockDetails = jsonLd => [extractCommentCount(jsonLd), extractProgrammingLanguage(jsonLd), extractSubscriberCount(jsonLd), extractAttachmentCount(jsonLd)].filter(detail => !!detail);
-export const extractBlockActions = (props, jsonLd, opts, platform, meta) => {
+export const extractBlockActions = (props, jsonLd, opts, platform, meta, enableImprovedPreviewAction) => {
   if (opts) {
     const {
       handleInvoke
@@ -32,7 +32,8 @@ export const extractBlockActions = (props, jsonLd, opts, platform, meta) => {
       viewProps: props,
       jsonLd,
       platform,
-      meta
+      meta,
+      enableImprovedPreviewAction
     });
 
     // The previewAction should always be the last action
@@ -63,7 +64,7 @@ export const extractBlockUsers = jsonLd => {
     return updatedByMembers || createdByMembers;
   }
 };
-export const extractBlockProps = (jsonLd, meta, opts, renderers, platform) => {
+export const extractBlockProps = (jsonLd, meta, opts, renderers, platform, enableImprovedPreviewAction) => {
   const props = {
     link: extractLink(jsonLd),
     title: extractTitle(jsonLd),
@@ -80,6 +81,6 @@ export const extractBlockProps = (jsonLd, meta, opts, renderers, platform) => {
   };
   return {
     ...props,
-    actions: extractBlockActions(props, jsonLd, opts, platform, meta)
+    actions: extractBlockActions(props, jsonLd, opts, platform, meta, enableImprovedPreviewAction)
   };
 };

package/dist/es2019/extractors/common/actions/extractPreviewAction.js

@@ -46,7 +46,8 @@ export const extractPreviewAction = ({
   origin,
   source = 'block',
   analytics,
-  meta
+  meta,
+  enableImprovedPreviewAction
 }) => {
   // Extract metadata from view props & raw JSON-LD.
   const metadataFromJsonLd = getMetadataFromJsonLd(jsonLd, platform);
@@ -70,7 +71,8 @@ export const extractPreviewAction = ({
       onViewActionClick: () => {
         handleInvoke(getInvokeOpts(key, 'ViewAction'));
       },
-      isSupportTheming: extractIsSupportTheming(meta)
+      isSupportTheming: extractIsSupportTheming(meta),
+      enableImprovedPreviewAction
     });
     // Setup props to go through proper Redux 'invocation' flow
     // for analytics, further state management if required in future.

package/dist/es2019/i18n/cs.js

@@ -47,6 +47,7 @@ export default {
   'fabric.linking.more_actions': 'Další akce',
   'fabric.linking.not_found_description': 'Odkaz se nepodařilo najít. Zkontrolujte adresu URL a zkuste ji upravit nebo vložit znovu.',
   'fabric.linking.not_found_title': 'Jejda. Tento odkaz se nepodařilo najít.',
+  'fabric.linking.open_issue_in_jira': 'Otevřít požadavek v Jira',
   'fabric.linking.open_link_in_a_new_tab': 'Otevřít odkaz na nové kartě',
   'fabric.linking.owned_by': 'Vlastník: {context}',
   'fabric.linking.pending_request': 'Vaše žádost o přístup čeká na vyřízení.',
@@ -77,6 +78,9 @@ export default {
   'fabric.linking.save': 'Uložit',
   'fabric.linking.srclink': 'Zobrazit v',
   'fabric.linking.srclinkunknown': 'Zobrazit originál',
+  'fabric.linking.status_change_load_error': 'Načtení stavů a přechodů se nezdařilo',
+  'fabric.linking.status_change_permission_error': 'K provedení přechodu tohoto požadavku nemáte oprávnění.',
+  'fabric.linking.status_change_update_error': 'Aktualizace stavu se nezdařila',
   'fabric.linking.try_again': 'Zkusit znovu',
   'fabric.linking.try_another_account': 'Zkuste jiný účet',
   'fabric.linking.unlink_account': 'Odpojit účet',

package/dist/es2019/i18n/da.js

@@ -47,6 +47,7 @@ export default {
   'fabric.linking.more_actions': 'Flere handlinger',
   'fabric.linking.not_found_description': 'Vi kunne ikke finde linket. Kontrollér og rediger URL-adressen, eller indsæt den igen.',
   'fabric.linking.not_found_title': 'Ups. Vi kan ikke finde dette link!',
+  'fabric.linking.open_issue_in_jira': 'Åbn sag i Jira',
   'fabric.linking.open_link_in_a_new_tab': 'Åbn link i en ny fane',
   'fabric.linking.owned_by': 'Ejet af {context}',
   'fabric.linking.pending_request': 'Din anmodning om adgang afventer behandling',
@@ -77,6 +78,9 @@ export default {
   'fabric.linking.save': 'Gem',
   'fabric.linking.srclink': 'Vis i',
   'fabric.linking.srclinkunknown': 'Vis original',
+  'fabric.linking.status_change_load_error': 'Vi kunne ikke indlæse statusser og overførsler',
+  'fabric.linking.status_change_permission_error': 'Du har ikke tilladelse til at overføre denne sag.',
+  'fabric.linking.status_change_update_error': 'Vi kunne ikke opdatere statussen',
   'fabric.linking.try_again': 'Prøv igen',
   'fabric.linking.try_another_account': 'Prøv en anden konto',
   'fabric.linking.unlink_account': 'Fjern link til konto',

package/dist/es2019/i18n/de.js

@@ -47,6 +47,7 @@ export default {
   'fabric.linking.more_actions': 'Weitere Aktionen',
   'fabric.linking.not_found_description': 'Der Link konnte nicht gefunden werden. Überprüfen Sie die URL und versuchen Sie die Bearbeitung oder das Einfügen erneut.',
   'fabric.linking.not_found_title': 'Oh! Diese Verknüpfung konnte nicht gefunden werden!',
+  'fabric.linking.open_issue_in_jira': 'Vorgang in Jira öffnen',
   'fabric.linking.open_link_in_a_new_tab': 'Link in neuer Registerkarte öffnen',
   'fabric.linking.owned_by': 'Besitzer: {context}',
   'fabric.linking.pending_request': 'Ihre Zugriffsanfrage ist ausstehend.',
@@ -77,6 +78,9 @@ export default {
   'fabric.linking.save': 'Speichern',
   'fabric.linking.srclink': 'Anzeigen in',
   'fabric.linking.srclinkunknown': 'Original anzeigen',
+  'fabric.linking.status_change_load_error': 'Status und Übergänge konnten nicht geladen werden',
+  'fabric.linking.status_change_permission_error': 'Sie sind nicht berechtigt, diesen Vorgang weiterzugeben.',
+  'fabric.linking.status_change_update_error': 'Der Status konnte nicht aktualisiert werden',
   'fabric.linking.try_again': 'Versuchen Sie es erneut.',
   'fabric.linking.try_another_account': 'Versuchen Sie es mit einem anderen Konto erneut.',
   'fabric.linking.unlink_account': 'Kontoverknüpfung löschen',