@atlaskit/smart-card 26.34.0 → 26.34.2

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/smart-card
 
+## 26.34.2
+
+### Patch Changes
+
+- [#41147](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/41147) [`38e8635bbf9`](https://bitbucket.org/atlassian/atlassian-frontend/commits/38e8635bbf9) - [ux] Update block card view styling behind cross-join feature flag
+
+## 26.34.1
+
+### Patch Changes
+
+- [#41295](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/41295) [`d18dc7aba6d`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d18dc7aba6d) - [ux] Update embed unauth view styling (behind feature flag)
+
 ## 26.34.0
 
 ### Minor Changes

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

@@ -22,7 +22,7 @@ var ANALYTICS_CHANNEL = exports.ANALYTICS_CHANNEL = 'media';
 var context = exports.context = {
   componentName: 'smart-cards',
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.34.0"
+  packageVersion: "26.34.2"
 };
 var TrackQuickActionType = exports.TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

package/dist/cjs/utils/mocks.js

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.waitFor = exports.mocks = exports.mockContext = exports.mockByUrl = exports.mockAnalytics = exports.fakeResponse = exports.fakeFactory = void 0;
+exports.waitFor = exports.mocks = exports.mockGenerator = exports.mockContext = exports.mockByUrl = exports.mockAnalytics = exports.fakeResponse = exports.fakeFactory = void 0;
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
@@ -23,6 +23,11 @@ var mockContext = exports.mockContext = {
   atlassian: 'https://schema.atlassian.com/ns/vocabulary#',
   schema: 'http://schema.org/'
 };
+var mockGenerator = exports.mockGenerator = {
+  '@type': 'Application',
+  '@id': 'https://www.atlassian.com/#Jira',
+  name: 'Jira'
+};
 var mockByUrl = exports.mockByUrl = function mockByUrl(url) {
   return {
     meta: {

package/dist/cjs/view/BlockCard/actions/flexible/ForbiddenAction.js

@@ -18,15 +18,14 @@ var _messages = require("../../../../messages");
  * @param content is a message key for a message to be displayed in the action
  * @param context is a variable for a message in case a message contains a placeholder
  */
-var ForbiddenAction = exports.ForbiddenAction = function ForbiddenAction(onClick, content, context) {
+var ForbiddenAction = exports.ForbiddenAction = function ForbiddenAction(onClick, content, context, isDisabled) {
   return {
     name: _constants.ActionName.CustomAction,
     content: /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, (0, _extends2.default)({}, _messages.messages[content], {
-      values: {
-        context: context
-      }
+      values: context
     })),
     onClick: onClick,
-    testId: 'smart-action-connect-other-account'
+    testId: 'smart-action-connect-other-account',
+    isDisabled: isDisabled
   };
 };

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

@@ -77,8 +77,9 @@ var _ErroredView = require("./views/ErroredView");
 var _FlexibleResolvedView = _interopRequireDefault(require("./views/flexible/FlexibleResolvedView"));
 var _FlexibleUnauthorisedView = _interopRequireDefault(require("./views/flexible/FlexibleUnauthorisedView"));
 var _FlexibleNotFoundView = _interopRequireDefault(require("./views/flexible/FlexibleNotFoundView"));
-var _FlexibleErroredView = _interopRequireDefault(require("./views/flexible/FlexibleErroredView"));
 var _FlexibleForbiddenView = _interopRequireDefault(require("./views/flexible/FlexibleForbiddenView"));
+var _FlexibleForbiddenViewOld = _interopRequireDefault(require("./views/flexible/FlexibleForbiddenViewOld"));
+var _FlexibleErroredView = _interopRequireDefault(require("./views/flexible/FlexibleErroredView"));
 var _react = require("@emotion/react");
 var _handlers = require("./utils/handlers");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
@@ -156,7 +157,9 @@ var BlockCard = exports.BlockCard = function BlockCard(_ref) {
           onAuthorize: handleAuthorize
         }));
       case 'forbidden':
-        return (0, _react.jsx)(_FlexibleForbiddenView.default, (0, _extends2.default)({}, flexibleBlockCardProps, {
+        return (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.cross-join') ? (0, _react.jsx)(_FlexibleForbiddenView.default, (0, _extends2.default)({}, flexibleBlockCardProps, {
+          onAuthorize: handleAuthorize
+        })) : (0, _react.jsx)(_FlexibleForbiddenViewOld.default, (0, _extends2.default)({}, flexibleBlockCardProps, {
           onAuthorize: handleAuthorize
         }));
       case 'not_found':

package/dist/cjs/view/BlockCard/views/flexible/FlexibleForbiddenView.js

@@ -10,18 +10,21 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _react = _interopRequireWildcard(require("react"));
 var _FlexibleCard = _interopRequireDefault(require("../../../FlexibleCard"));
-var _titleBlock = _interopRequireDefault(require("../../../FlexibleCard/components/blocks/title-block"));
 var _blocks = require("../../../FlexibleCard/components/blocks");
 var _colors = require("@atlaskit/theme/colors");
 var _messages = require("../../../../messages");
-var _lockFilled = _interopRequireDefault(require("@atlaskit/icon/glyph/lock-filled"));
+var _lock = _interopRequireDefault(require("@atlaskit/icon/glyph/lock"));
 var _footer = _interopRequireDefault(require("../../components/flexible/footer"));
 var _ForbiddenAction = require("../../actions/flexible/ForbiddenAction");
 var _text = _interopRequireDefault(require("../../../FlexibleCard/components/elements/text"));
+var _constants = require("../../../../constants");
 var _jsonld = require("../../../../utils/jsonld");
 var _linkExtractors = require("@atlaskit/link-extractors");
-var _context = require("../../../../extractors/common/context");
 var _withFlexibleUIBlockCardStyle = require("./utils/withFlexibleUIBlockCardStyle");
+var _extractAccessContext = require("../../../../extractors/common/context/extractAccessContext");
+var _reactIntlNext = require("react-intl-next");
+var _styled = require("./styled");
+var _extractHostname = _interopRequireDefault(require("../../../../extractors/common/hostname/extractHostname"));
 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; }
 /**
@@ -47,22 +50,34 @@ var FlexibleForbiddenView = function FlexibleForbiddenView(_ref) {
   var cardMetadata = (_details$meta = details === null || details === void 0 ? void 0 : details.meta) !== null && _details$meta !== void 0 ? _details$meta : (0, _jsonld.getForbiddenJsonLd)().meta;
   var provider = (0, _linkExtractors.extractProvider)(details === null || details === void 0 ? void 0 : details.data);
   var providerName = (provider === null || provider === void 0 ? void 0 : provider.text) || '';
-  var requestAccessContext = (0, _context.extractRequestAccessContext)({
-    jsonLd: cardMetadata,
-    url: url,
-    context: providerName
-  });
+  var messageContext = (0, _react.useMemo)(function () {
+    var hostname = /*#__PURE__*/_react.default.createElement("b", null, (0, _extractHostname.default)(url));
+    return {
+      product: providerName,
+      hostname: hostname
+    };
+  }, [providerName, url]);
+  var requestAccessContext = (0, _react.useMemo)(function () {
+    return (0, _extractAccessContext.extractRequestAccessContextImproved)({
+      jsonLd: cardMetadata,
+      url: url,
+      product: providerName
+    });
+  }, [cardMetadata, providerName, url]);
   var descriptiveMessageKey = requestAccessContext && requestAccessContext.descriptiveMessageKey ? requestAccessContext.descriptiveMessageKey : 'invalid_permissions_description';
+  var _ref2 = requestAccessContext !== null && requestAccessContext !== void 0 ? requestAccessContext : {},
+    titleMessageKey = _ref2.titleMessageKey,
+    buttonDisabled = _ref2.buttonDisabled;
   var actions = (0, _react.useMemo)(function () {
     var actionFromAccessContext = [];
     var tryAnotherAccountAction = onAuthorize ? [(0, _ForbiddenAction.ForbiddenAction)(onAuthorize, 'try_another_account')] : [];
     if (requestAccessContext) {
       var action = requestAccessContext.action,
         callToActionMessageKey = requestAccessContext.callToActionMessageKey;
-      actionFromAccessContext = action && callToActionMessageKey ? [(0, _ForbiddenAction.ForbiddenAction)(action.promise, callToActionMessageKey, providerName)] : [];
+      actionFromAccessContext = action && callToActionMessageKey ? [(0, _ForbiddenAction.ForbiddenAction)(action.promise, callToActionMessageKey, messageContext, buttonDisabled)] : [];
     }
     return [].concat(tryAnotherAccountAction, (0, _toConsumableArray2.default)(actionFromAccessContext));
-  }, [onAuthorize, requestAccessContext, providerName]);
+  }, [onAuthorize, requestAccessContext, messageContext, buttonDisabled]);
   return /*#__PURE__*/_react.default.createElement(_FlexibleCard.default, {
     appearance: "block",
     cardState: cardState,
@@ -71,25 +86,36 @@ var FlexibleForbiddenView = function FlexibleForbiddenView(_ref) {
     onError: onError,
     testId: testId,
     ui: {
-      hideElevation: true
+      hideElevation: true,
+      size: _constants.SmartLinkSize.Medium
     },
     url: url
-  }, /*#__PURE__*/_react.default.createElement(_titleBlock.default, (0, _extends2.default)({
+  }, titleMessageKey ? /*#__PURE__*/_react.default.createElement(_blocks.CustomBlock, {
+    overrideCss: _styled.forbiddenViewTitleStyle,
+    testId: "".concat(testId, "-title")
+  }, /*#__PURE__*/_react.default.createElement("a", {
+    target: anchorTarget,
+    href: url
+  }, /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, (0, _extends2.default)({}, _messages.messages[titleMessageKey], {
+    values: messageContext
+  })))) : /*#__PURE__*/_react.default.createElement(_blocks.TitleBlock, (0, _extends2.default)({
     hideRetry: true,
     anchorTarget: anchorTarget
-  }, titleBlockProps)), /*#__PURE__*/_react.default.createElement(_blocks.CustomBlock, null, /*#__PURE__*/_react.default.createElement(_lockFilled.default, {
+  }, titleBlockProps)), /*#__PURE__*/_react.default.createElement(_blocks.CustomBlock, null, /*#__PURE__*/_react.default.createElement(_lock.default, {
     label: "forbidden-lock-icon",
     size: "small",
     primaryColor: "var(--ds-icon-danger, ".concat(_colors.R300, ")"),
     testId: "".concat(testId, "-lock-icon")
   }), /*#__PURE__*/_react.default.createElement(_text.default, {
+    maxLines: 2,
     message: {
       descriptor: _messages.messages[descriptiveMessageKey],
-      values: {
-        context: providerName
-      }
+      values: messageContext
     }
-  })), /*#__PURE__*/_react.default.createElement(_blocks.CustomBlock, null, /*#__PURE__*/_react.default.createElement(_footer.default, {
+  })), /*#__PURE__*/_react.default.createElement(_blocks.PreviewBlock, {
+    placement: _constants.MediaPlacement.Right,
+    ignoreContainerPadding: true
+  }), /*#__PURE__*/_react.default.createElement(_blocks.CustomBlock, null, /*#__PURE__*/_react.default.createElement(_footer.default, {
     actions: actions,
     status: status
   })));

package/dist/cjs/view/BlockCard/views/flexible/FlexibleForbiddenViewOld.js

@@ -0,0 +1,103 @@
+"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 _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _react = _interopRequireWildcard(require("react"));
+var _FlexibleCard = _interopRequireDefault(require("../../../FlexibleCard"));
+var _titleBlock = _interopRequireDefault(require("../../../FlexibleCard/components/blocks/title-block"));
+var _blocks = require("../../../FlexibleCard/components/blocks");
+var _colors = require("@atlaskit/theme/colors");
+var _messages = require("../../../../messages");
+var _lockFilled = _interopRequireDefault(require("@atlaskit/icon/glyph/lock-filled"));
+var _footer = _interopRequireDefault(require("../../components/flexible/footer"));
+var _ForbiddenAction = require("../../actions/flexible/ForbiddenAction");
+var _text = _interopRequireDefault(require("../../../FlexibleCard/components/elements/text"));
+var _jsonld = require("../../../../utils/jsonld");
+var _linkExtractors = require("@atlaskit/link-extractors");
+var _context = require("../../../../extractors/common/context");
+var _withFlexibleUIBlockCardStyle = require("./utils/withFlexibleUIBlockCardStyle");
+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; }
+/**
+ * @private
+ * @deprecated {@link https://product-fabric.atlassian.net/browse/EDM-7977 Internal documentation for deprecation (no external access)}
+ * @deprecated Replaced by FlexibleForbiddenView
+ */
+var FlexibleForbiddenView = function FlexibleForbiddenView(_ref) {
+  var _details$meta;
+  var anchorTarget = _ref.anchorTarget,
+    cardState = _ref.cardState,
+    onAuthorize = _ref.onAuthorize,
+    onClick = _ref.onClick,
+    onError = _ref.onError,
+    _ref$testId = _ref.testId,
+    testId = _ref$testId === void 0 ? 'smart-block-forbidden-view' : _ref$testId,
+    url = _ref.url,
+    titleBlockProps = _ref.titleBlockProps;
+  var status = cardState.status;
+  var details = cardState === null || cardState === void 0 ? void 0 : cardState.details;
+  var cardMetadata = (_details$meta = details === null || details === void 0 ? void 0 : details.meta) !== null && _details$meta !== void 0 ? _details$meta : (0, _jsonld.getForbiddenJsonLd)().meta;
+  var provider = (0, _linkExtractors.extractProvider)(details === null || details === void 0 ? void 0 : details.data);
+  var providerName = (provider === null || provider === void 0 ? void 0 : provider.text) || '';
+  var requestAccessContext = (0, _context.extractRequestAccessContext)({
+    jsonLd: cardMetadata,
+    url: url,
+    context: providerName
+  });
+  var descriptiveMessageKey = requestAccessContext && requestAccessContext.descriptiveMessageKey ? requestAccessContext.descriptiveMessageKey : 'invalid_permissions_description';
+  var actions = (0, _react.useMemo)(function () {
+    var actionFromAccessContext = [];
+    var tryAnotherAccountAction = onAuthorize ? [(0, _ForbiddenAction.ForbiddenAction)(onAuthorize, 'try_another_account')] : [];
+    if (requestAccessContext) {
+      var action = requestAccessContext.action,
+        callToActionMessageKey = requestAccessContext.callToActionMessageKey;
+      actionFromAccessContext = action && callToActionMessageKey ? [(0, _ForbiddenAction.ForbiddenAction)(action.promise, callToActionMessageKey, {
+        context: providerName
+      })] : [];
+    }
+    return [].concat(tryAnotherAccountAction, (0, _toConsumableArray2.default)(actionFromAccessContext));
+  }, [onAuthorize, requestAccessContext, providerName]);
+  return /*#__PURE__*/_react.default.createElement(_FlexibleCard.default, {
+    appearance: "block",
+    cardState: cardState,
+    onAuthorize: onAuthorize,
+    onClick: onClick,
+    onError: onError,
+    testId: testId,
+    ui: {
+      hideElevation: true
+    },
+    url: url
+  }, /*#__PURE__*/_react.default.createElement(_titleBlock.default, (0, _extends2.default)({
+    hideRetry: true,
+    anchorTarget: anchorTarget
+  }, titleBlockProps)), /*#__PURE__*/_react.default.createElement(_blocks.CustomBlock, null, /*#__PURE__*/_react.default.createElement(_lockFilled.default, {
+    label: "forbidden-lock-icon",
+    size: "small",
+    primaryColor: "var(--ds-icon-danger, ".concat(_colors.R300, ")"),
+    testId: "".concat(testId, "-lock-icon")
+  }), /*#__PURE__*/_react.default.createElement(_text.default, {
+    message: {
+      descriptor: _messages.messages[descriptiveMessageKey],
+      values: {
+        context: providerName
+      }
+    }
+  })), /*#__PURE__*/_react.default.createElement(_blocks.CustomBlock, null, /*#__PURE__*/_react.default.createElement(_footer.default, {
+    actions: actions,
+    status: status
+  })));
+};
+
+/**
+ * @private
+ * @deprecated {@link https://product-fabric.atlassian.net/browse/EDM-7977 Internal documentation for deprecation (no external access)}
+ * @deprecated Replaced by FlexibleForbiddenView
+ */
+var _default = exports.default = (0, _withFlexibleUIBlockCardStyle.withFlexibleUIBlockCardStyle)(FlexibleForbiddenView);

package/dist/cjs/view/BlockCard/views/flexible/styled.js

@@ -4,17 +4,18 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.titleBlockCss = exports.metadataBlockCss = exports.footerBlockCss = exports.flexibleBlockCardStyle = void 0;
+exports.titleBlockCss = exports.metadataBlockCss = exports.forbiddenViewTitleStyle = exports.footerBlockCss = exports.flexibleBlockCardStyle = void 0;
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _token = require("../../../../utils/token");
 var _react = require("@emotion/react");
 var _colors = require("@atlaskit/theme/colors");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
 // in editor prosemirror adds padding-left so we need to overwrite it
 var metadataBlockCss = exports.metadataBlockCss = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  /* primary element group */\n  span[data-smart-element-avatar-group] {\n    > ul {\n      padding-left: 0px;\n    }\n  }\n  [data-smart-element-group] {\n    line-height: 1rem;\n  }\n"])));
 var titleBlockCss = exports.titleBlockCss = (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  ", "\n  ", "\n"])), (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.enable-better-metadata_iojwg') ? "gap: 0.5em;" : "", (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.show-smart-links-refreshed-design') ? "[data-smart-element=\"Title\"] {\n          font-weight: 600;\n        }" : "");
 var footerBlockCss = exports.footerBlockCss = (0, _react.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  height: 1.5rem;\n\n  .actions-button-group {\n    button,\n    button:hover,\n    button:focus,\n    button:active {\n      font-size: 0.875rem;\n    }\n  }\n"])));
 var flexibleBlockCardElevationStyle = (0, _react.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  border-radius: 1.5px;\n  box-shadow: ", ";\n  margin: ", ";\n"])), _token.tokens.elevation, "var(--ds-space-025, 2px)");
 var refreshedFlexibleBlockCardStyle = (0, _react.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  & > div {\n    border-radius: ", ";\n    border: 1px solid ", ";\n  }\n"])), "var(--ds-border-radius-200, 8px)", "var(--ds-border, ".concat(_colors.N40, ")"));
-var flexibleBlockCardStyle = exports.flexibleBlockCardStyle = (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.show-smart-links-refreshed-design') ? refreshedFlexibleBlockCardStyle : flexibleBlockCardElevationStyle;
+var flexibleBlockCardStyle = exports.flexibleBlockCardStyle = (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.show-smart-links-refreshed-design') ? refreshedFlexibleBlockCardStyle : flexibleBlockCardElevationStyle;
+var forbiddenViewTitleStyle = exports.forbiddenViewTitleStyle = (0, _react.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n  font-weight: 600;\n"])));

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

@@ -24,6 +24,7 @@ var _UnauthorisedView = require("./views/UnauthorisedView");
 var _ErroredView = require("./views/ErroredView");
 var _forbiddenView = _interopRequireDefault(require("./views/forbidden-view"));
 var _notFoundView = _interopRequireDefault(require("./views/not-found-view"));
+var _unauthorizedView = _interopRequireDefault(require("./views/unauthorized-view"));
 var EmbedCard = exports.EmbedCard = /*#__PURE__*/_react.default.forwardRef(function (_ref, iframeRef) {
   var _details$meta, _forbiddenViewProps$c3;
   var url = _ref.url,
@@ -110,6 +111,19 @@ var EmbedCard = exports.EmbedCard = /*#__PURE__*/_react.default.forwardRef(funct
         });
       }
       var unauthorisedViewProps = (0, _embed.extractEmbedProps)(data, meta, platform);
+      if ((0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.smart-card.cross-join')) {
+        return /*#__PURE__*/_react.default.createElement(_unauthorizedView.default, {
+          analytics: analytics,
+          context: unauthorisedViewProps.context,
+          extensionKey: extensionKey,
+          inheritDimensions: inheritDimensions,
+          isSelected: isSelected,
+          onAuthorize: handleAuthorize,
+          onClick: handleFrameClick,
+          testId: testId,
+          url: unauthorisedViewProps.link
+        });
+      }
       return /*#__PURE__*/_react.default.createElement(_UnauthorisedView.EmbedCardUnauthorisedView, (0, _extends2.default)({}, unauthorisedViewProps, {
         isSelected: isSelected,
         onAuthorise: handleAuthorize,
@@ -149,7 +163,7 @@ var EmbedCard = exports.EmbedCard = /*#__PURE__*/_react.default.forwardRef(funct
           context: forbiddenViewProps.context,
           inheritDimensions: inheritDimensions,
           isSelected: isSelected,
-          onAuthorise: handleAuthorize,
+          onAuthorize: handleAuthorize,
           onClick: handleFrameClick,
           accessContext: accessContext,
           url: forbiddenViewProps.link

package/dist/cjs/view/EmbedCard/views/UnauthorisedView.js

@@ -15,6 +15,10 @@ var _UnauthorisedViewContent = _interopRequireDefault(require("../../common/Unau
 var _utils = require("../utils");
 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; }
+/**
+ * @deprecated {@link https://product-fabric.atlassian.net/browse/EDM-7977 Internal documentation for deprecation (no external access)}\
+ * @deprecated Replaced by unauthorized-view
+ */
 var EmbedCardUnauthorisedView = exports.EmbedCardUnauthorisedView = function EmbedCardUnauthorisedView(_ref) {
   var analytics = _ref.analytics,
     link = _ref.link,

package/dist/cjs/view/EmbedCard/views/forbidden-view/index.js

@@ -16,12 +16,12 @@ var _messages = require("../../../../messages");
 var _intlUtils = require("../../../../utils/intl-utils");
 var _unresolvedView = _interopRequireDefault(require("../unresolved-view"));
 var _utils = require("../../utils");
-var _excluded = ["context", "onAuthorise", "accessContext", "testId"];
+var _excluded = ["context", "onAuthorize", "accessContext", "testId"];
 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 ForbiddenView = function ForbiddenView(_ref) {
   var context = _ref.context,
-    onAuthorise = _ref.onAuthorise,
+    onAuthorize = _ref.onAuthorize,
     accessContext = _ref.accessContext,
     _ref$testId = _ref.testId,
     testId = _ref$testId === void 0 ? 'embed-card-forbidden-view' : _ref$testId,
@@ -55,7 +55,7 @@ var ForbiddenView = function ForbiddenView(_ref) {
    */
   var button = (0, _react.useMemo)(function () {
     var _action$promise;
-    var onEmbedCardClick = (_action$promise = action === null || action === void 0 ? void 0 : action.promise) !== null && _action$promise !== void 0 ? _action$promise : onAuthorise;
+    var onEmbedCardClick = (_action$promise = action === null || action === void 0 ? void 0 : action.promise) !== null && _action$promise !== void 0 ? _action$promise : onAuthorize;
     if (!onEmbedCardClick) {
       return null;
     }
@@ -67,7 +67,7 @@ var ForbiddenView = function ForbiddenView(_ref) {
     }, /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, (0, _extends2.default)({}, (0, _intlUtils.toMessage)(_messages.messages.try_another_account, callToActionMessageKey), {
       values: values
     })));
-  }, [accessType, action === null || action === void 0 ? void 0 : action.id, action === null || action === void 0 ? void 0 : action.promise, callToActionMessageKey, onAuthorise, values]);
+  }, [accessType, action === null || action === void 0 ? void 0 : action.id, action === null || action === void 0 ? void 0 : action.promise, callToActionMessageKey, onAuthorize, values]);
   return /*#__PURE__*/_react.default.createElement(_unresolvedView.default, (0, _extends2.default)({}, unresolvedViewProps, {
     icon: icon,
     image: image !== null && image !== void 0 ? image : (0, _utils.getUnresolvedEmbedCardImage)('forbidden'),

package/dist/cjs/view/EmbedCard/views/unauthorized-view/index.js

@@ -0,0 +1,100 @@
+"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 _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _button = _interopRequireDefault(require("@atlaskit/button"));
+var _react = _interopRequireWildcard(require("react"));
+var _reactIntlNext = require("react-intl-next");
+var _reactMagneticDi = require("react-magnetic-di");
+var _messages = require("../../../../messages");
+var _UnauthorisedViewContent = _interopRequireDefault(require("../../../common/UnauthorisedViewContent"));
+var _utils = require("../../utils");
+var _unresolvedView = _interopRequireDefault(require("../unresolved-view"));
+var _excluded = ["analytics", "context", "extensionKey", "onAuthorize", "testId"];
+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 UnauthorizedView = function UnauthorizedView(_ref) {
+  var _context$image;
+  var analytics = _ref.analytics,
+    context = _ref.context,
+    extensionKey = _ref.extensionKey,
+    onAuthorize = _ref.onAuthorize,
+    _ref$testId = _ref.testId,
+    testId = _ref$testId === void 0 ? 'embed-card-unauthorized-view' : _ref$testId,
+    unresolvedViewProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  var handleOnAuthorizeClick = (0, _react.useCallback)(function () {
+    if (onAuthorize) {
+      analytics.track.appAccountAuthStarted({
+        extensionKey: extensionKey
+      });
+      onAuthorize();
+    }
+  }, [onAuthorize, analytics.track, extensionKey]);
+  var content = (0, _react.useMemo)(function () {
+    if (onAuthorize) {
+      var _context$text;
+      // Our title and button messages always expect the product name to be present
+      // while the description support when product name is not present.
+      // To be looked at https://product-fabric.atlassian.net/browse/EDM-8173
+      var _values = {
+        context: (_context$text = context === null || context === void 0 ? void 0 : context.text) !== null && _context$text !== void 0 ? _context$text : ''
+      };
+      if (_values) {
+        // title: Connect your {context} account
+        // button: Connect to {context}
+        return {
+          title: /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, (0, _extends2.default)({}, _messages.messages.connect_link_account_card_name, {
+            values: _values
+          })),
+          description: /*#__PURE__*/_react.default.createElement(_UnauthorisedViewContent.default, {
+            analytics: analytics,
+            providerName: context === null || context === void 0 ? void 0 : context.text,
+            testId: testId
+          }),
+          button: /*#__PURE__*/_react.default.createElement(_button.default, {
+            testId: "connect-account",
+            appearance: "primary",
+            onClick: handleOnAuthorizeClick
+          }, /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, (0, _extends2.default)({}, _messages.messages.connect_unauthorised_account_action, {
+            values: _values
+          })))
+        };
+      }
+    }
+    var values = context !== null && context !== void 0 && context.text ? {
+      context: context === null || context === void 0 ? void 0 : context.text
+    } : undefined;
+    if (values) {
+      // title: We can't display private pages from {context}
+      // description: You're trying to preview a link to a private {context} page. We recommend you review the URL or contact the page owner.
+      return {
+        title: /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, (0, _extends2.default)({}, _messages.messages.unauthorised_account_name, {
+          values: values
+        })),
+        description: /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, (0, _extends2.default)({}, _messages.messages.unauthorised_account_description, {
+          values: values
+        }))
+      };
+    }
+
+    // title: We can't display private pages
+    // description: You're trying to preview a link to a private page. We recommend you review the URL or contact the page owner.
+    return {
+      title: /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.messages.unauthorised_account_name_no_provider),
+      description: /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.messages.unauthorised_account_description_no_provider)
+    };
+  }, [analytics, context === null || context === void 0 ? void 0 : context.text, handleOnAuthorizeClick, onAuthorize, testId]);
+  return /*#__PURE__*/_react.default.createElement(_unresolvedView.default, (0, _extends2.default)({}, unresolvedViewProps, content, {
+    icon: context === null || context === void 0 ? void 0 : context.icon,
+    image: (_context$image = context === null || context === void 0 ? void 0 : context.image) !== null && _context$image !== void 0 ? _context$image : (0, _utils.getUnresolvedEmbedCardImage)('unauthorized'),
+    testId: testId,
+    text: context === null || context === void 0 ? void 0 : context.text
+  }));
+};
+var _default = exports.default = UnauthorizedView;

package/dist/cjs/view/EmbedCard/views/unauthorized-view/types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

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

@@ -16,6 +16,7 @@ var _linkExtractors = require("@atlaskit/link-extractors");
 var _styled = require("./styled");
 var _styled2 = require("../../../styled");
 var _extractAccessContext = require("../../../../../extractors/common/context/extractAccessContext");
+var _extractHostname = _interopRequireDefault(require("../../../../../extractors/common/hostname/extractHostname"));
 var HoverCardForbiddenView = function HoverCardForbiddenView(_ref) {
   var _cardState$details, _cardState$details2, _extractProvider$text, _extractProvider, _extractRequestAccess;
   var flexibleCardProps = _ref.flexibleCardProps,
@@ -26,7 +27,7 @@ var HoverCardForbiddenView = function HoverCardForbiddenView(_ref) {
   var data = (_cardState$details = cardState.details) === null || _cardState$details === void 0 ? void 0 : _cardState$details.data;
   var meta = (_cardState$details2 = cardState.details) === null || _cardState$details2 === void 0 ? void 0 : _cardState$details2.meta;
   var product = (_extractProvider$text = (_extractProvider = (0, _linkExtractors.extractProvider)(data)) === null || _extractProvider === void 0 ? void 0 : _extractProvider.text) !== null && _extractProvider$text !== void 0 ? _extractProvider$text : '';
-  var hostname = /*#__PURE__*/_react.default.createElement("b", null, new URL(url).hostname);
+  var hostname = /*#__PURE__*/_react.default.createElement("b", null, (0, _extractHostname.default)(url));
   var _ref2 = (_extractRequestAccess = (0, _extractAccessContext.extractRequestAccessContextImproved)({
       jsonLd: meta,
       url: url,

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

@@ -18,7 +18,7 @@ var _excluded = ["href", "children", "checkSafety", "onClick", "testId"],
   _excluded2 = ["isLinkSafe", "showSafetyWarningModal"];
 var PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.34.0",
+  packageVersion: "26.34.2",
   componentName: 'linkUrl'
 };
 var Link = (0, _click.withLinkClickedEvent)('a');

package/dist/es2019/utils/analytics/analytics.js

@@ -4,7 +4,7 @@ export const ANALYTICS_CHANNEL = 'media';
 export const context = {
   componentName: 'smart-cards',
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.34.0"
+  packageVersion: "26.34.2"
 };
 export let TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

package/dist/es2019/utils/mocks.js

@@ -4,6 +4,11 @@ export const mockContext = {
   atlassian: 'https://schema.atlassian.com/ns/vocabulary#',
   schema: 'http://schema.org/'
 };
+export const mockGenerator = {
+  '@type': 'Application',
+  '@id': 'https://www.atlassian.com/#Jira',
+  name: 'Jira'
+};
 export const mockByUrl = url => {
   return {
     meta: {

package/dist/es2019/view/BlockCard/actions/flexible/ForbiddenAction.js

@@ -12,13 +12,12 @@ import { messages } from '../../../../messages';
  * @param content is a message key for a message to be displayed in the action
  * @param context is a variable for a message in case a message contains a placeholder
  */
-export const ForbiddenAction = (onClick, content, context) => ({
+export const ForbiddenAction = (onClick, content, context, isDisabled) => ({
   name: ActionName.CustomAction,
   content: /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, messages[content], {
-    values: {
-      context
-    }
+    values: context
   })),
   onClick,
-  testId: 'smart-action-connect-other-account'
+  testId: 'smart-action-connect-other-account',
+  isDisabled
 });

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

@@ -17,8 +17,9 @@ import { ErroredView as BlockCardErroredView } from './views/ErroredView';
 import FlexibleResolvedView from './views/flexible/FlexibleResolvedView';
 import FlexibleUnauthorisedView from './views/flexible/FlexibleUnauthorisedView';
 import FlexibleNotFoundView from './views/flexible/FlexibleNotFoundView';
-import FlexibleErroredView from './views/flexible/FlexibleErroredView';
 import FlexibleForbiddenView from './views/flexible/FlexibleForbiddenView';
+import FlexibleForbiddenViewOld from './views/flexible/FlexibleForbiddenViewOld';
+import FlexibleErroredView from './views/flexible/FlexibleErroredView';
 import { jsx } from '@emotion/react';
 import { handleClickCommon } from './utils/handlers';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
@@ -98,7 +99,9 @@ export const BlockCard = ({
           onAuthorize: handleAuthorize
         }));
       case 'forbidden':
-        return jsx(FlexibleForbiddenView, _extends({}, flexibleBlockCardProps, {
+        return getBooleanFF('platform.linking-platform.smart-card.cross-join') ? jsx(FlexibleForbiddenView, _extends({}, flexibleBlockCardProps, {
+          onAuthorize: handleAuthorize
+        })) : jsx(FlexibleForbiddenViewOld, _extends({}, flexibleBlockCardProps, {
           onAuthorize: handleAuthorize
         }));
       case 'not_found':